:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f4f7fb;font-synthesis:none;text-rendering:optimizelegibility;background:#050608;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:#050608;min-width:320px;min-height:100vh;margin:0;overflow:hidden}button,input,select,textarea{font:inherit}button,.button-like{color:#f4f7fb;cursor:pointer;background:#151b22;border:1px solid #2c3641;border-radius:8px;transition:border-color .16s,background .16s,transform .16s}button:hover,.button-like:hover,button.active{background:#1c2530;border-color:#4bc9e8}button:active,.button-like:active{transform:translateY(1px)}button:focus-visible,.button-like:focus-within,input:focus-visible,textarea:focus-visible,select:focus-visible{outline-offset:2px;outline:2px solid #4bc9e8}textarea,input[type=text],input[type=password],select{color:#f4f7fb;background:#11161d;border:1px solid #2c3641;border-radius:8px;width:100%}textarea{resize:vertical;min-height:86px;padding:9px;font-family:ui-monospace,SFMono-Regular,SF Mono,Consolas,monospace;font-size:12px}input[type=text],input[type=password]{height:36px;padding:8px 10px}select{height:36px;padding:7px 10px}button:disabled,select:disabled,input:disabled{cursor:not-allowed;opacity:.56}.studio-shell{--panel-width:380px;grid-template-columns:minmax(0, 1fr) var(--panel-width);min-height:100vh;display:grid}.studio-shell.panel-auto{grid-template-columns:minmax(0,1fr) 0}.stage-wrap{background:#050608;min-width:0;min-height:100vh;position:relative}#stage{touch-action:none;width:100%;height:100vh;display:block}.media-source{opacity:0;pointer-events:none;width:1px;height:1px;position:fixed}.stage-status{pointer-events:none;align-items:center;gap:8px;transition:opacity .16s;display:flex;position:absolute;bottom:18px;left:18px}.stage-status span{color:#dfe8f0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#050608b8;border:1px solid #ffffff1f;border-radius:999px;padding:7px 10px;font-size:12px}.control-panel{width:var(--panel-width);z-index:5;background:#0a0d11;border-left:1px solid #202832;height:100vh;padding:20px;transition:transform .18s;position:relative;overflow:auto}.panel-hotspot{display:none}.panel-resize-handle{cursor:ew-resize;width:10px;position:absolute;top:0;bottom:0;left:-5px}.panel-auto .control-panel{transform:translateX(calc(var(--panel-width) - 12px));position:fixed;inset:0 0 auto auto;box-shadow:-18px 0 48px #0000003d}.panel-auto .panel-hotspot{z-index:4;width:28px;display:block;position:fixed;inset:0 0 0 auto}.panel-auto .panel-hotspot:hover+.control-panel,.panel-auto .control-panel:hover,.panel-auto.panel-peek .control-panel{transform:translate(0)}.panel-auto .stage-status{opacity:0}.panel-auto.panel-peek .stage-status{opacity:1}.panel-header{align-items:flex-start;gap:14px;margin-bottom:22px;display:grid}.header-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.eyebrow{color:#70d9ef;text-transform:uppercase;margin:0 0 6px;font-size:12px;font-weight:800}h1,h2,p{margin:0}h1{font-size:24px;line-height:1.1}h2{letter-spacing:0;font-size:14px}.icon-button{min-width:0;min-height:38px;padding:9px 10px}.panel-section{border-top:1px solid #202832;padding:16px 0}.panel-section.collapsed>:not(.section-title){display:none}.section-title{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.section-title span{color:#8b98a7;font-size:12px}.collapse-button{min-width:30px;min-height:30px;padding:2px 8px;font-weight:800}.mode-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:470px;padding-right:2px;display:grid;overflow:auto}.mode-card,.pack-card{text-align:left;min-height:78px;padding:10px}.mode-card strong,.mode-card span,.pack-card strong,.pack-card span{display:block}.mode-card strong,.pack-card strong{margin-bottom:6px;font-size:13px}.mode-card span,.pack-card span{color:#9aa7b5;font-size:12px;line-height:1.35}.mode-card.active,.layer-item.active,.scene-item.active .scene-load{background:#132532;border-color:#4bc9e8}.field{color:#c5d0dc;grid-template-columns:86px minmax(0,1fr);align-items:center;gap:10px;margin:10px 0;font-size:13px;display:grid}.compact-field{grid-template-columns:72px minmax(0,1fr);margin:7px 0}.stacked-field{color:#c5d0dc;gap:7px;margin:10px 0;font-size:13px;display:grid}.check-field{color:#c5d0dc;align-items:center;gap:9px;margin:10px 0;font-size:13px;display:flex}.check-field input{accent-color:#4bc9e8;width:16px;height:16px}input[type=range]{accent-color:#4bc9e8;width:100%}input[type=color]{background:#151b22;border:1px solid #2c3641;border-radius:8px;width:100%;height:34px}.mode-settings-grid{grid-template-columns:1fr;gap:2px;margin-top:10px;display:grid}.file-drop{cursor:pointer;background:#11161d;border:1px dashed #344252;border-radius:8px;gap:5px;padding:14px;display:grid}.file-drop.compact{padding:12px}.file-drop input,.button-like input{display:none}.file-drop strong{font-size:14px}.file-drop span{color:#8b98a7;font-size:12px;line-height:1.4}.button-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px;display:grid}.button-row.three{grid-template-columns:repeat(3,minmax(0,1fr))}.button-row button,.button-like{text-align:center;place-items:center;min-height:38px;padding:8px 10px;display:inline-grid}.details-box{background:#0f141b;border:1px solid #202832;border-radius:8px;margin-top:10px;padding:10px}.details-box summary{cursor:pointer;font-size:13px;font-weight:700}.details-box p{color:#8b98a7;margin:10px 0;font-size:12px;line-height:1.45}.details-box button{width:100%;min-height:36px;padding:8px 10px}.danger{background:#2a1117;border-color:#6b2632}.danger:hover{background:#35151d;border-color:#ff6b82}.preset-grid,.emoji-icon-results{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:10px;display:grid}.preset-grid button,.emoji-icon-results button{text-overflow:ellipsis;white-space:nowrap;min-height:42px;padding:8px;font-weight:800;overflow:hidden}.emoji-choice{font-size:22px}.icon-choice{text-transform:capitalize;font-size:11px}.pack-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.layer-list{gap:8px;display:grid}.layer-item,.scene-load{text-align:left;justify-content:space-between;align-items:center;gap:10px;width:100%;padding:10px;display:flex}.layer-item strong,.scene-load strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.layer-item span,.scene-load small,.empty-state,.message-box{color:#8b98a7;font-size:12px}.empty-state{border:1px solid #202832;border-radius:8px;padding:10px}.layer-controls{margin-top:12px}.message-box{min-height:32px;margin-top:10px;line-height:1.4}.scene-list{gap:8px;margin-top:10px;display:grid}.scene-item{gap:8px;display:grid}.scene-load{min-height:60px;padding:8px}.scene-load img{object-fit:cover;background:#050608;border-radius:6px;flex:none;width:64px;height:36px}.scene-load span{min-width:0;display:grid}.scene-actions{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.scene-actions button{min-height:34px;padding:7px;font-size:12px}.scene-delete{background:#2a1117;border-color:#6b2632;padding:8px}.text-layer-editor{z-index:20;color:#fff;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#050608d6;border:2px solid #4bc9e8;border-radius:6px;font-weight:800;position:fixed}.tutorial-overlay{z-index:30;pointer-events:none;background:#00000057;place-items:end start;padding:24px;display:grid;position:fixed;inset:0}.tutorial-overlay[hidden]{display:none}.tutorial-card{pointer-events:auto;background:#0a0d11;border:1px solid #2c3641;border-radius:8px;width:min(420px,100vw - 48px);padding:16px;box-shadow:0 18px 60px #00000070}.tutorial-card h2{margin-bottom:8px;font-size:18px}.tutorial-card p:not(.eyebrow){color:#c5d0dc;font-size:13px;line-height:1.45}.tutorial-target{outline-offset:4px;outline:2px solid #4bc9e8;position:relative}@media (max-width:920px){body{overflow:auto}.studio-shell,.studio-shell.panel-auto{grid-template-columns:1fr}.stage-wrap{min-height:62vh}#stage{height:62vh}.control-panel,.panel-auto .control-panel{border-top:1px solid #202832;border-left:0;width:100%;height:auto;min-height:38vh;position:relative;transform:none!important}.panel-hotspot,.panel-resize-handle{display:none!important}.stage-status{opacity:1!important}}@media (max-width:560px){.control-panel{padding:16px}.mode-grid,.pack-grid,.button-row,.button-row.three{grid-template-columns:1fr}.preset-grid,.emoji-icon-results{grid-template-columns:repeat(3,minmax(0,1fr))}}