:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#dae4ed;background:#101923;font-synthesis:none;--panel:#172430;--line:#2c3d4a;--muted:#91a5b6;--accent:#c5ef79}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select,input{color:inherit;background:#20323f;border:1px solid var(--line);border-radius:9px;min-height:44px;padding:8px 11px}button{cursor:pointer}button:hover{background:#304755}button:disabled{opacity:.35;cursor:default}button.active,.primary{background:var(--accent);color:#17251c;border-color:var(--accent)}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input{min-width:0;width:100%}input[type=checkbox]{width:22px;min-height:22px;accent-color:var(--accent)}input[type=color]{padding:3px}input[type=range]{padding:0;accent-color:var(--accent)}label{display:grid;gap:6px;font-size:12px;color:var(--muted)}h2{font-size:12px;text-transform:uppercase;letter-spacing:.13em;color:var(--muted);margin:0}header{display:flex;gap:12px;align-items:center;padding:12px 18px;background:#13212c;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:750;white-space:nowrap}.logo{width:34px;height:34px;display:grid;place-items:center;color:var(--accent);border:1px solid #709952;transform:rotate(-8deg);border-radius:9px}.badge{font-size:10px;font-weight:500;color:var(--muted);padding:5px 7px;border:1px solid var(--line);border-radius:6px}.project-name{max-width:210px;background:transparent}.actions{display:flex;gap:6px;margin-inline-start:auto;align-items:center}.studio{display:grid;grid-template-columns:220px minmax(0,1fr) 270px;grid-template-rows:minmax(0,1fr) 152px;height:calc(100dvh - 78px)}aside{background:var(--panel);padding:16px 12px;overflow:auto}.scene-panel{border-inline-end:1px solid var(--line)}.inspector{border-inline-start:1px solid var(--line)}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-title button{font-size:20px}.object-list{display:grid;gap:3px}.object-row{display:flex;align-items:center;gap:8px;text-align:start;background:transparent;border-color:transparent;width:100%;overflow:hidden}.object-row.selected{border-color:#668448;background:#304237;color:#dcfbb6}.object-row span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.object-icon{color:#8ccebc;font-size:18px}.muted{font-size:12px;color:var(--muted)}.add-menu{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:14px}.add-menu button{font-size:12px;padding:6px}.viewport{position:relative;min-width:0;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 45% 35%,#31434d,#17252e 85%)}canvas{display:block;width:100%;height:100%;touch-action:none}.toolbar{position:absolute;inset-block-start:16px;inset-inline-start:16px;display:flex;gap:5px;padding:5px;background:#16242edb;border:1px solid #354854;border-radius:13px;z-index:2}.toolbar button{border:0;background:transparent;padding:7px 12px}.toolbar button.active{background:var(--accent)}.view-select{position:absolute;inset-block-start:16px;inset-inline-end:16px;max-width:140px;z-index:2}.viewport-footer{position:absolute;inset-block-end:12px;inset-inline:15px;display:flex;justify-content:space-between;pointer-events:none;color:#abc0ce;font:11px monospace}.viewport-footer button{pointer-events:auto}.axis{position:absolute;inset-inline-end:23px;inset-block-end:60px;font:12px monospace;color:#a6d3ba}.fields{display:grid;gap:14px}.vector{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.vector input{padding:8px 4px;text-align:center}.vector label{font:10px monospace}.vector label:nth-child(1){color:#f0a2a2}.vector label:nth-child(2){color:#b5da8c}.vector label:nth-child(3){color:#8ebbe9}.separator{height:1px;background:var(--line);margin:16px 0}.inline{display:flex;align-items:center;gap:8px}.inspector .inline button{flex:1;font-size:12px}.timeline{grid-column:1/-1;display:grid;grid-template-columns:220px 1fr;background:#13212c;border-top:1px solid var(--line)}.transport{padding:16px;border-inline-end:1px solid var(--line)}.transport .inline{margin-top:10px}.timeline-body{padding:12px 20px;min-width:0;overflow:auto}.time-controls{display:flex;gap:14px;align-items:center}.time-controls input[type=number]{width:75px}.time-controls label{display:flex;align-items:center;white-space:nowrap}.scrub{width:100%;margin-top:10px}.ticks{display:flex;justify-content:space-between;color:#8aa0b0;font:10px monospace}.keys{display:flex;gap:8px;margin-top:10px;overflow-x:auto;min-height:28px}.key-chip{min-height:28px;font:11px monospace;padding:4px 8px;border-color:#567343;color:#c5ef79}.mobile-tabs{display:none}dialog{background:#1b2c38;color:#e2eaf0;border:1px solid #4d646f;border-radius:18px;max-width:min(520px,calc(100vw - 24px));padding:26px;box-shadow:0 25px 80px #0009}dialog::backdrop{background:#07131bba;backdrop-filter:blur(5px)}dialog h3{font-size:23px;margin-top:0}dialog p{line-height:1.65;color:#adc0cc}dialog .inline{justify-content:flex-end;flex-wrap:wrap;margin-top:20px}.toast{position:fixed;inset-block-end:24px;inset-inline-start:50%;transform:translate(-50%);z-index:20;max-width:90%;padding:12px 20px;background:#d6efbc;color:#17251c;border-radius:10px;box-shadow:0 5px 30px #0005;font-size:14px}.danger{color:#ffb2a9}.brush-controls{display:grid;gap:10px}.hidden{display:none!important}.welcome-mark{position:absolute;inset-inline-start:18px;inset-block-end:40px;opacity:.4;font-size:11px;letter-spacing:.18em;pointer-events:none}@media(max-width:1100px){.studio{grid-template-columns:185px minmax(0,1fr) 235px}.timeline{grid-template-columns:185px 1fr}header{padding:9px 12px;gap:8px}.badge{display:none}.actions button{font-size:12px;padding:8px}.project-name{max-width:145px}}@media(max-width:760px){header{flex-wrap:wrap;min-height:110px;padding:8px}.brand{font-size:19px}.project-name{max-width:calc(100vw - 210px)}.actions{width:100%;overflow-x:auto;margin:0}.actions button{flex-shrink:0}.actions select{margin-inline-start:auto}.studio{height:calc(100dvh - 150px);grid-template-columns:1fr;grid-template-rows:minmax(180px,1fr) 130px}.viewport{grid-row:1;grid-column:1}.scene-panel,.inspector{display:none;position:absolute;z-index:5;inset-block-start:150px;inset-block-end:130px;width:min(300px,92vw);box-shadow:0 10px 40px #0009}.scene-panel{inset-inline-start:0}.inspector{inset-inline-end:0}.scene-panel.shown,.inspector.shown{display:block}.mobile-tabs{display:flex;gap:4px;background:#13212c;padding:0 8px 6px;height:40px}.mobile-tabs button{min-height:34px;font-size:12px;flex:1;padding:4px}.timeline{grid-row:2;grid-template-columns:96px 1fr;grid-column:1}.transport{padding:10px 6px}.transport h2{font-size:9px}.transport .inline{gap:4px}.transport button{padding:4px 9px}.timeline-body{padding:10px}.time-controls{gap:7px}.time-controls label{font-size:10px}.time-controls input[type=number]{width:52px;min-height:34px}.time-controls button{min-height:34px;font-size:11px}.toolbar{inset-block-start:10px;inset-inline-start:8px;gap:0}.toolbar button{font-size:11px;padding:5px 9px}.view-select{inset-block-start:68px;inset-inline-end:10px;font-size:11px;min-height:34px}.keys{margin-top:4px}.viewport-footer{font-size:9px}.welcome-mark{display:none}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}[dir=rtl] .vector,[dir=rtl] .timeline-body{direction:ltr}#app{height:100dvh;display:flex;flex-direction:column;min-height:0}.studio{height:auto;flex:1;min-height:0}.transport button{font-size:19px;min-width:34px;padding:3px 10px}.transport .inline{gap:5px}@media(max-width:760px){.studio{grid-template-rows:minmax(180px,1fr) 160px}.timeline{grid-template-columns:90px 1fr}.scene-panel,.inspector{inset-block-end:160px}.transport button{padding:3px 7px;min-height:34px;font-size:17px}.time-controls{display:grid;grid-template-columns:1fr 1fr;gap:5px}.time-controls label{justify-content:space-between;gap:3px;font-size:9px}.time-controls input[type=number]{width:48px}.time-controls #key{grid-column:1/-1;min-height:30px}.scrub{margin-top:4px}.keys,.key-chip{min-height:25px}}