:root{color-scheme:dark;--surface: #121413;--surf-lowest: #1C1F1E;--surf-low: #212422;--surf: #252726;--surf-high: #2E3130;--surf-highest: #383B3A;--on-surface: #DCE5E4;--on-variant: #BEC8C9;--outline: #899394;--outline-variant: #6A7475;--primary: #09E989;--on-primary: #033922;--primary-container: #005232;--on-primary-container: #6FFCA8;--error: #FEB4AB;--error-container: #93000A;--warning: #F9D894;--warning-container: #65470B;--success: #89E689;--success-container: #174F17;--on-air: #FF5449;--font-display: "Bricolage Grotesque", system-ui, sans-serif;--font-body: "Plus Jakarta Sans", system-ui, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, monospace;--r-xs: 4px;--r-sm: 6px;--r-md: 8px;--r-lg: 10px;--r-xl: 12px;--r-2xl: 14px;--r-3xl: 16px;--r-4xl: 20px;--r-full: 999px;--motion-fast: .2s;--motion-std: .3s;--motion-emph: .6s}@media(prefers-reduced-motion:reduce){:root{--motion-fast: 0ms;--motion-std: 0ms;--motion-emph: 0ms}}*{scrollbar-width:thin;scrollbar-color:var(--surf-highest) transparent}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html,body{height:100%}body{background:var(--surface);color:var(--on-surface);font-family:var(--font-body);font-size:14px;line-height:20px;-webkit-font-smoothing:antialiased}h1{font-family:var(--font-display);font-size:24px;line-height:32px;font-weight:600}h2{font-family:var(--font-body);font-size:14px;line-height:20px;font-weight:600;margin-bottom:8px}h3{font-size:14px;line-height:20px;font-weight:600}.muted{color:var(--on-variant);font-size:12px;line-height:16px}.mono{font-family:var(--font-mono);font-size:12px;color:var(--on-variant);font-weight:400;margin-left:4px}.ms{font-family:Material Symbols Rounded;font-size:20px;line-height:1;display:inline-flex;font-weight:400;font-style:normal;letter-spacing:normal;text-transform:none;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 16px;border:0;border-radius:var(--r-md);font:600 14px/20px var(--font-body);color:var(--on-surface);background:transparent;cursor:pointer;white-space:nowrap;transition:background var(--motion-fast) ease-in-out,opacity var(--motion-fast) ease-in-out}.btn:disabled{opacity:.38;cursor:default}.btn-sm{height:32px;padding:0 12px;font-size:12px;line-height:16px}.btn-sm .ms{font-size:18px}.btn-lg{height:44px;padding:0 20px}.btn-primary{background:var(--primary);color:var(--on-primary)}.btn-primary:hover:not(:disabled){background:#3bf0a2}.btn-danger{background:var(--error-container);color:var(--error)}.btn-tonal{background:var(--surf-high)}.btn-tonal:hover:not(:disabled){background:var(--surf-highest)}.btn-text{color:var(--on-variant)}.btn-text:hover:not(:disabled){background:var(--surf-high);color:var(--on-surface)}.btn-icon{width:36px;padding:0;color:var(--on-variant)}.btn-icon.btn-sm{width:32px}.btn-icon:hover:not(:disabled){background:var(--surf-high);color:var(--on-surface)}.field{display:flex;flex-direction:column;gap:4px;font-size:12px;line-height:16px;font-weight:500;color:var(--on-variant)}input[type=text],input[type=email],input[type=password],input[type=number],select{height:36px;width:100%;padding:0 10px;background:var(--surf-lowest);color:var(--on-surface);border:1px solid var(--outline-variant);border-radius:var(--r-md);font:400 14px/20px var(--font-body)}input[type=number]{font-family:var(--font-mono);font-size:13px}input:disabled{opacity:.5}input::placeholder{color:var(--outline);font-family:var(--font-body);font-size:12px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}.grid-2 .field{justify-content:flex-end}.card>.field{margin-bottom:12px}.row-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.switch-row{display:flex;align-items:center;gap:10px;font-size:14px;cursor:pointer}.switch{appearance:none;width:40px;height:24px;border-radius:var(--r-full);flex:none;background:var(--surf-highest);border:1px solid var(--outline-variant);position:relative;cursor:pointer;transition:background var(--motion-fast) ease-in-out}.switch:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--outline);transition:transform var(--motion-fast) ease-in-out,background var(--motion-fast) ease-in-out}.switch:checked{background:var(--primary);border-color:var(--primary)}.switch:checked:after{transform:translate(16px);background:var(--on-primary)}#login-screen{min-height:100%;display:flex;align-items:center;justify-content:center;padding:16px}.login-card{width:100%;max-width:360px;display:flex;flex-direction:column;gap:12px;background:var(--surf-low);border-radius:var(--r-4xl);padding:24px}.brand{font-family:var(--font-display);font-weight:700;font-size:16px;color:var(--primary);white-space:nowrap}.brand span{color:var(--on-variant);font-family:var(--font-body);font-weight:500;font-size:14px;margin-left:8px}.form-error{min-height:16px;font-size:12px;line-height:16px;color:var(--error)}.link{color:var(--on-variant);font-size:12px;line-height:16px;display:inline-flex;align-items:center;gap:4px;text-decoration:underline;text-underline-offset:2px}.link:hover{color:var(--on-surface)}.link .ms{font-size:14px}#app{height:100%;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:8px;padding:8px 16px;background:var(--surf-lowest);flex:none;min-height:52px}.spacer{flex:1}.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;margin-left:8px;border-radius:var(--r-full);font-size:12px;line-height:16px;font-weight:600;background:var(--surf-high);color:var(--on-variant);white-space:nowrap}.chip:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.chip.ok{background:var(--success-container);color:var(--success)}.chip.warn{background:var(--warning-container);color:var(--warning)}.chip.err{background:var(--error-container);color:var(--error)}.alert{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 16px;background:var(--warning-container);color:var(--warning);font-size:14px;flex:none}.alert.err{background:var(--error-container);color:var(--error)}.alert a,.alert button{color:inherit;font:inherit;font-weight:700;text-decoration:underline;background:none;border:0;cursor:pointer}.workspace{flex:1;min-height:0;display:grid;grid-template-columns:280px minmax(0,1fr) 280px}.panel{overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:12px;background:var(--surf-lowest)}.card{background:var(--surf-low);border-radius:var(--r-2xl);padding:16px}.card>.muted{margin-bottom:12px}.help ul{list-style:none;display:flex;flex-direction:column;gap:6px;font-size:12px;line-height:16px;color:var(--on-variant)}kbd{font-family:var(--font-mono);font-size:11px;padding:1px 5px;border-radius:var(--r-xs);background:var(--surf-highest);color:var(--on-surface)}#variant-matrix{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.vm-row-label{grid-column:1 / -1;font-size:12px;line-height:16px;font-weight:600;color:var(--on-variant);margin-top:8px}.vm-row-label:first-child{margin-top:0}.vm-cell{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 4px 4px;background:var(--surf);border:1px solid transparent;border-radius:var(--r-md);color:var(--on-variant);font:500 12px/16px var(--font-body);cursor:pointer;min-height:60px;min-width:0;overflow:hidden;white-space:nowrap}.vm-cell:hover{background:var(--surf-high)}.vm-cell.active{border-color:var(--primary);background:var(--surf-high);color:var(--on-surface)}.vm-cell .thumbs{display:flex;align-items:flex-end;gap:3px;height:22px}.vm-cell .layout-thumb-h{height:15px}.vm-cell .layout-thumb-v{height:22px}.vm-cell.wide{grid-column:span 2}.vm-cell.add{border:1px dashed var(--outline-variant);background:transparent;justify-content:center}.vm-cell.add .ms{font-size:18px}.layout-thumb{display:block;border-radius:2px}.layout-thumb .th-bg{fill:var(--surface)}.layout-thumb .th-slides{fill:var(--outline-variant)}.layout-thumb .th-cam{fill:var(--primary)}.layout-thumb .th-label{fill:var(--on-primary);font-family:var(--font-body);font-weight:700}.stage{min-width:0;min-height:0;padding:16px;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.empty{max-width:420px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}.canvases{display:flex;gap:24px;align-items:flex-start}.canvas-col{display:flex;flex-direction:column;gap:8px}.canvas-head{display:flex;flex-direction:column;gap:6px;height:62px}.canvas-head h3{white-space:nowrap}.pos-row{display:flex;align-items:center;gap:8px;font-size:12px;line-height:16px;color:var(--on-variant);height:32px;white-space:nowrap}.pos-row.off{visibility:hidden}.canvas-note{min-height:32px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;line-height:16px;color:var(--on-variant)}.canvas-note button{height:28px}.seg{display:inline-flex;background:var(--surf-low);border-radius:var(--r-md);padding:2px}.seg button{height:28px;padding:0 10px;border:0;border-radius:var(--r-sm);background:transparent;color:var(--on-variant);font:600 12px/16px var(--font-body);cursor:pointer}.seg button.active{background:var(--surf-highest);color:var(--on-surface)}.canvas{position:relative;background:#0b0d0c;border-radius:var(--r-xs);overflow:hidden;box-shadow:0 0 0 1px var(--surf-highest);-webkit-user-select:none;user-select:none;touch-action:none;background-image:linear-gradient(45deg,rgba(255,255,255,.025) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.025) 75%),linear-gradient(45deg,rgba(255,255,255,.025) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.025) 75%);background-size:16px 16px;background-position:0 0,8px 8px}.canvas-h{aspect-ratio:16 / 9;width:var(--w-h, 640px)}.canvas-v{aspect-ratio:9 / 16;width:var(--w-v, 202px)}.guide-margin{position:absolute;border:1px dashed rgba(190,200,201,.35);pointer-events:none}.guide-safe{position:absolute;left:0;right:0;background:#f9d89414;pointer-events:none}.guide-safe.top{top:0;border-bottom:1px dashed rgba(249,216,148,.5)}.guide-safe.bottom{bottom:0;border-top:1px dashed rgba(249,216,148,.5)}.guide-safe span{position:absolute;left:6px;font-size:10px;line-height:12px;color:var(--warning);opacity:.8}.guide-safe.top span{bottom:4px}.guide-safe.bottom span{top:4px}.snap-line{position:absolute;background:var(--on-air);pointer-events:none;z-index:5}.snap-line.x{top:0;bottom:0;width:1px}.snap-line.y{left:0;right:0;height:1px}.cell{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:move;overflow:visible;text-align:center;border:1px solid rgba(9,233,137,.7);background:#09e98929;color:var(--on-surface)}.cell.slides{border-color:#bec8c999;background:#bec8c921}.cell.derived{cursor:default;border-style:dashed;opacity:.75}.cell.selected{border-width:2px;border-color:var(--primary);background:#09e98942;z-index:3}.cell.slides.selected{border-color:var(--on-surface);background:#bec8c938}.cell.twin{box-shadow:0 0 0 2px #dce5e459}.cell .cell-name{font-weight:600;font-size:12px;line-height:16px;pointer-events:none;white-space:nowrap}.cell .cell-dims{font-family:var(--font-mono);font-size:10px;line-height:12px;color:var(--on-variant);pointer-events:none;white-space:nowrap}.cell.tiny .cell-dims{display:none}.cell.tiny .cell-name{font-size:10px}.handle{position:absolute;width:10px;height:10px;background:var(--surface);border:2px solid var(--primary);border-radius:2px;z-index:4}.handle:after{content:"";position:absolute;inset:-7px}.handle.n{top:-6px;left:calc(50% - 5px);cursor:ns-resize}.handle.s{bottom:-6px;left:calc(50% - 5px);cursor:ns-resize}.handle.e{right:-6px;top:calc(50% - 5px);cursor:ew-resize}.handle.w{left:-6px;top:calc(50% - 5px);cursor:ew-resize}.handle.ne{top:-6px;right:-6px;cursor:nesw-resize}.handle.sw{bottom:-6px;left:-6px;cursor:nesw-resize}.handle.nw{top:-6px;left:-6px;cursor:nwse-resize}.handle.se{bottom:-6px;right:-6px;cursor:nwse-resize}dialog{margin:auto;border:0;border-radius:var(--r-4xl);padding:24px;width:min(400px,calc(100vw - 32px));background:var(--surf-high);color:var(--on-surface)}dialog::backdrop{background:#0009}dialog h2{font-family:var(--font-display);font-size:18px;line-height:24px}dialog .muted{font-size:14px;line-height:20px;margin-bottom:16px}.dlg-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%);z-index:20;padding:10px 16px;border-radius:var(--r-md);background:var(--on-surface);color:var(--surface);font-size:14px;font-weight:500;box-shadow:0 4px 16px #0006}.toast.err{background:var(--error-container);color:var(--error)}@media(max-width:1100px){.workspace{grid-template-columns:240px minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;overflow-y:auto}#panel-right{grid-column:1 / -1;flex-direction:row;flex-wrap:wrap}#panel-right .card{flex:1 1 240px}}@media(max-width:720px){.workspace{display:flex;flex-direction:column;overflow-y:auto}.panel{overflow:visible}.stage{overflow-x:auto;justify-content:flex-start;min-height:420px}.topbar{flex-wrap:wrap}}