:root{color:#e5edf8;--panel:#080d18b8;--panel-strong:#101827;--border:#1d2a3f;--border-bright:#334765;--text-muted:#90a4c4;--accent:#73d0ff;--accent-strong:#2f9fe4;background:#070b14;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button{font:inherit}button:disabled{cursor:not-allowed;opacity:.48}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.loading{place-items:center;min-height:100vh;display:grid}.studio-shell{background:radial-gradient(circle at 50% -10%,#1e3a5f 0,#0000 42%),linear-gradient(135deg,#070b14 0%,#0a1020 55%,#050711 100%);grid-template-rows:64px minmax(0,1fr) 292px;grid-template-columns:260px minmax(0,1fr) 320px;height:100vh;display:grid}.toolbar{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid var(--border);background:#070b14d6;grid-column:1/-1;justify-content:space-between;align-items:center;padding:0 20px;display:flex}.brand-block{flex-direction:column;gap:2px;display:flex}.brand-block strong{letter-spacing:-.02em}.brand-block span,.toolbar-status span{color:var(--text-muted);font-size:13px}.toolbar-status,.toolbar-actions{gap:8px;display:flex}.toolbar-status span,.preview-badges span{border:1px solid var(--border);background:#101827;border-radius:999px;padding:6px 10px}.toolbar button,.project-explorer button,.transport-button{border:1px solid var(--border-bright);color:#e5edf8;cursor:pointer;background:#20304a;border-radius:10px;padding:9px 12px}.primary-button,.transport-button.primary{background:linear-gradient(135deg,#1d8bce,#7655d8);border-color:#59b7ec}.save-pill.save-dirty{color:#fed7aa;border-color:#f59e0b}.save-pill.save-saving{border-color:var(--accent);color:#dbeafe}.save-pill.save-error{color:#fecaca;border-color:#ef4444}.project-explorer,.inspector{background:var(--panel);border-color:var(--border);border-style:solid;padding:18px;overflow:auto}.project-explorer{border-width:0 1px 0 0}.inspector{border-width:0 0 0 1px}.panel-title{margin:4px 0 14px}.panel-title span{color:var(--accent);letter-spacing:.13em;text-transform:uppercase;font-size:11px;font-weight:700}.panel-title h2{letter-spacing:-.02em;margin:2px 0 0;font-size:18px}.scene-card,.template-card{border:1px solid var(--border);color:#e5edf8;text-align:left;background:linear-gradient(#132035,#0f172a);border-radius:14px;gap:6px;width:100%;margin:8px 0 18px;padding:12px;display:grid}.scene-card span,.template-card span{color:var(--text-muted);font-size:12px}.project-explorer .selected,.clip.selected{outline:2px solid var(--accent);outline-offset:2px}.writer-panel{border-top:1px solid var(--border);margin-top:18px;padding-top:18px}.writer-panel label{color:var(--text-muted);text-transform:uppercase;margin:0 0 6px;font-size:11px;font-weight:700;display:block}.writer-panel textarea,.writer-panel input,.writer-panel select{background:var(--panel-strong);color:#e5edf8;font:inherit;border:1px solid #26364f;border-radius:10px;width:100%;padding:10px;display:block}.writer-panel textarea{resize:vertical;line-height:1.45}.writer-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;display:grid}.writer-panel .checkbox-row{border:1px solid var(--border);text-transform:none;background:#101827;border-radius:10px;align-items:center;gap:8px;margin-top:17px;padding:10px;display:flex}.writer-panel .checkbox-row input{width:auto}.writer-panel p{color:var(--text-muted);font-size:12px;line-height:1.45}.writer-panel code{color:#dbeafe}.writer-panel button{width:100%}.writer-error{color:#fecaca!important}.canvas-panel{align-content:center;gap:14px;min-width:0;padding:24px;display:grid}.canvas-header{justify-content:space-between;align-items:center;display:flex}.canvas-header div:first-child{gap:3px;display:grid}.canvas-header span{color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:12px}.canvas-header strong{letter-spacing:-.03em;font-size:20px}.preview-badges{gap:8px;display:flex}.preview-badges span{color:#dbeafe;letter-spacing:0;text-transform:none}.canvas-panel canvas{aspect-ratio:16/9;background:#050812;border:1px solid #27374f;border-radius:22px;width:100%;max-width:100%;max-height:100%;box-shadow:0 30px 90px #00000073,inset 0 1px #ffffff0a}.inspector-summary{border:1px solid var(--border);background:linear-gradient(135deg,#132035,#171a34);border-radius:16px;gap:4px;margin-bottom:16px;padding:14px;display:grid}.inspector-summary span{color:var(--text-muted);font-size:12px}.inspector label{color:var(--text-muted);text-transform:uppercase;margin:0 0 6px;font-size:11px;font-weight:700;display:block}.inspector-field{margin-top:12px}.field-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.inspector input,.inspector select,.inspector code,.inspector pre{background:var(--panel-strong);color:#e5edf8;font:inherit;border:1px solid #26364f;border-radius:10px;width:100%;min-width:0;padding:10px;display:block;overflow:auto}.inspector input,.inspector select{outline:none}.inspector input:hover,.inspector input:focus,.inspector select:hover,.inspector select:focus{border-color:var(--accent)}.inspector pre{line-height:1.45}.param-editor{border-top:1px solid var(--border);gap:10px;margin-top:16px;padding-top:16px;display:grid}.param-editor>label{margin-bottom:0}.param-editor p{color:var(--text-muted);margin:0}.edit-hint{color:var(--text-muted);margin:14px 0 0;font-size:12px;line-height:1.45}.nudge-row,.danger-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px;display:grid}.nudge-row button,.danger-row button{border:1px solid var(--border-bright);color:#e5edf8;cursor:pointer;background:#17243a;border-radius:10px;padding:9px}.danger-row{border-top:1px solid var(--border);padding-top:16px}.danger-row .danger-button{color:#fecaca;background:#3a1620;border-color:#a13a54}.timeline-panel{border-top:1px solid var(--border);background:#050812eb;grid-column:1/-1;padding:14px 18px;overflow:hidden}.transport-row{align-items:center;gap:10px;margin-bottom:10px;display:flex}.transport-row span{color:var(--text-muted);margin-left:auto}.transport-button{padding:7px 12px}.playhead-row{align-items:center;gap:16px;display:flex}.playhead-row input{accent-color:var(--accent);width:100%}.timeline-tracks{gap:10px;margin-top:14px;display:grid}.track{grid-template-columns:160px 1fr;gap:12px;display:grid}.track-label{color:#dbeafe;gap:2px;padding-top:4px;font-size:13px;display:grid}.track-label span{color:var(--text-muted);font-size:11px}.track-lane{border:1px solid var(--border);background:linear-gradient(#101827,#0a1020);border-radius:12px;height:48px;position:relative;overflow:hidden}.track-lane:before{content:"";pointer-events:none;background:repeating-linear-gradient(90deg,#0000 0 calc(10% - 1px),#ffffff0f 10%);position:absolute;inset:0}.playhead-marker{background:var(--accent);z-index:3;width:2px;position:absolute;top:0;bottom:0;box-shadow:0 0 18px #73d0ffbf}.clip{color:#fff;cursor:grab;text-overflow:ellipsis;touch-action:none;-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:2;background:linear-gradient(135deg,#277bb3,#7954d8);border:0;border-radius:9px;justify-content:space-between;align-items:center;height:30px;padding:0 0 0 8px;font-size:12px;display:flex;position:absolute;top:8px;overflow:hidden}.clip.dragging{cursor:grabbing;filter:brightness(1.18)}.clip>span:first-child{text-overflow:ellipsis;overflow:hidden}.resize-handle{cursor:ew-resize;flex:0 0 9px;align-self:stretch;margin-left:4px;position:relative}.resize-handle:after{content:"";background:#ffffff94;border-radius:999px;position:absolute;inset:7px 3px}.clip-typeCharacter{background:linear-gradient(135deg,#1d8bce,#1fbaaa)}.clip-word{background:linear-gradient(135deg,#1d8bce,#1fbaaa);font-weight:700}.clip-backspace{background:linear-gradient(135deg,#d14d72,#f59e0b)}.clip-mouseMove,.clip-mouseClick{background:linear-gradient(135deg,#7c3aed,#2563eb)}.clip-focusInput{background:linear-gradient(135deg,#475569,#64748b)}@media (width<=900px){.studio-shell{grid-template-rows:auto auto auto auto auto;grid-template-columns:1fr;height:auto;min-height:100vh}.toolbar,.timeline-panel{grid-column:1}.toolbar,.canvas-header,.transport-row{flex-direction:column;align-items:flex-start}.toolbar-status,.toolbar-actions,.preview-badges{flex-wrap:wrap}.project-explorer,.inspector{border-width:1px 0}.track{grid-template-columns:1fr}}
