:root{color-scheme:light;--blue:#247cf3;--deep:#122641;--ink:#1d2b42;--muted:#6c7c90;--border:#e0e9f4;--pale:#f4f9ff;--card:#fff;--shadow:0 16px 45px rgba(42,75,111,.065)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#f0f7ff 0,#fff 30%);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink)}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.43;cursor:not-allowed;box-shadow:none!important}a{color:inherit;text-decoration:none}a:hover{color:var(--blue)}.topbar{height:72px;display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--border);padding:0 max(4%,calc((100% - 1420px)/ 2));background:#ffffffe8}.logo{display:flex;align-items:center;font-size:20px;font-weight:800;letter-spacing:-.6px;white-space:nowrap}.logo>span:last-child{color:var(--blue)}.logo-square{width:31px;height:31px;background:linear-gradient(135deg,#61b6ff,#2679f2);color:#fff;border-radius:9px;display:grid;place-items:center;margin-right:10px;font-size:17px}.top-divider{height:22px;width:1px;background:#d9e5f3}.crumb,.topbar nav a{font-size:13px;color:var(--muted)}.topbar nav{display:flex;gap:25px;margin-left:auto}main{max-width:1420px;margin:auto;padding:0 26px}.hero{text-align:center;padding:66px 16px 52px}.eyebrow{font-size:11px;color:#2979c8;font-weight:800;letter-spacing:2px}.blue-dot{display:inline-block;width:7px;height:7px;background:#37a6ff;border-radius:50%;vertical-align:middle;margin-right:5px}.hero h1{font-size:clamp(35px,5.1vw,63px);letter-spacing:-2.7px;line-height:1.08;color:#152941;margin:15px 0 18px}.hero h1 span{color:var(--blue)}.hero p{font-size:17px;max-width:720px;color:#66778d;line-height:1.8;margin:0 auto}.hero-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:26px}.hero-pills span{background:#fff;border:1px solid var(--border);border-radius:40px;padding:7px 14px;color:#516b83;font-size:12px;box-shadow:0 4px 13px #3b6e9a0a}.studio{padding:28px;background:linear-gradient(180deg,#fbfdff,#f8fbff);border:1px solid #e6ecf5;border-radius:26px;box-shadow:var(--shadow)}.studio-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 20px}.studio h2{font-size:24px;letter-spacing:-.65px;margin:5px 0}.status-pill{padding:8px 13px;border-radius:50px;background:#e8f4ff;color:#2b80c6;font-size:12px;font-weight:700;white-space:nowrap}.upload{background:#fff;border:1.5px dashed #b4d5f6;border-radius:17px;display:flex;gap:16px;align-items:center;padding:21px;margin-bottom:17px}.upload.dragging{background:#e9f5ff;border-color:var(--blue)}.upload-icon{display:grid;place-items:center;width:50px;height:50px;flex:none;border-radius:15px;background:#e9f4ff;color:#247ce5;font-size:26px}.upload-copy{flex:1;min-width:0}.upload-copy strong{font-size:16px}.upload-copy p{color:var(--muted);font-size:12px;margin:3px 0 0}.history-actions,.upload-buttons,.viewer-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.btn{border:1px solid var(--border);background:#fff;color:#34516f;font-size:12px;font-weight:750;padding:10px 14px;border-radius:10px;transition:background .15s,transform .15s}.btn:hover:not(:disabled){background:#edf6ff}.btn:active:not(:disabled){transform:translateY(1px)}.btn.primary{background:var(--blue);color:#fff;border-color:var(--blue);box-shadow:0 5px 13px #247cf327}.btn.primary:hover:not(:disabled){background:#116be9}.btn.outline{background:#fff}.btn.small{padding:6px 10px;font-size:11px}.btn.minimal{border:0;background:0 0;padding:7px}.btn.danger{color:#b42d42;border-color:#f3d2d6}.btn.full{width:100%}.workspace{display:grid;grid-template-columns:minmax(0,1.72fr) minmax(288px,.83fr);gap:17px}.editor-panel,.panel,.viewer-panel{min-width:0;background:#fff;border:1px solid var(--border);border-radius:17px;overflow:hidden}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:19px 20px;border-bottom:1px solid var(--border)}.panel-title h3{font-size:16px;letter-spacing:-.3px;margin:0;display:inline}.panel-title p{color:var(--muted);font-size:12px;margin:3px 0 0}.step{display:inline-grid;place-items:center;border-radius:8px;background:#e7f2ff;color:#2776ce;font-size:10px;font-weight:800;width:28px;height:26px;margin-right:10px}.stage{background:#0b1425;min-height:280px;position:relative;display:grid;place-items:center;overflow:hidden}.stage canvas{display:block;width:auto;max-width:100%;height:auto;max-height:62vh;object-fit:contain;touch-action:pan-y;outline:0}.stage canvas.drawing{cursor:crosshair;touch-action:none}.stage canvas:focus-visible{outline:3px solid #80b4ff;outline-offset:-3px}.stage-empty{position:absolute;text-align:center;color:#d6e5fa;pointer-events:none;padding:30px}.stage-empty strong{display:block;font-size:17px}.stage-empty p{margin-top:6px;font-size:12px;color:#91a7c3}.empty-symbol{font-size:59px;line-height:1.3;color:#7aa9eb}.stage-hint{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);padding:7px 12px;background:#183b65c9;color:#fff;font-weight:700;font-size:12px;border-radius:8px;pointer-events:none;white-space:nowrap}.transport{padding:12px 16px;display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--border);flex-wrap:wrap}.circle-button{width:39px;height:39px;border:none;border-radius:50%;color:#fff;background:var(--blue);flex:none}.time-text{font-size:12px;color:#587085;font-variant-numeric:tabular-nums;white-space:nowrap}.transport input[type=range]{flex:1;min-width:130px}.viewer-foot{display:flex;justify-content:space-between;gap:9px;flex-wrap:wrap;padding:10px 16px;font-size:11px;color:var(--muted)}.viewer-foot strong{color:#253c57}.objects-list{padding:11px;display:grid;gap:7px;max-height:190px;overflow:auto}.object-item{display:flex;align-items:center;gap:9px;padding:9px;border:1px solid var(--border);border-radius:10px;background:#fff;text-align:left;width:100%}.object-item.current{border-color:#76b0f4;background:#f1f8ff}.object-item .swatch{width:13px;height:13px;border-radius:4px;flex:none}.object-item .object-info{flex:1;min-width:0}.object-item b{font-size:12px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.object-item small{display:block;font-size:10px;color:var(--muted)}.object-eye{background:0 0;border:0;font-size:13px;min-width:30px;color:#657d96}.empty-small{padding:15px;color:#8695a9;font-size:12px}.inspector{padding:15px 18px;border-top:1px solid var(--border)}.inspector h4,.panel-section h4{margin:0 0 11px;font-size:13px}.field-grid label,.inspector label{display:flex;flex-direction:column;gap:4px;color:#5a7087;font-size:11px;font-weight:650}.field-grid select,.inspector input,.inspector select{width:100%;padding:8px 9px;border:1px solid #d7e4f0;border-radius:8px;color:#2b425d;background:#fff;min-width:0}.inspector input[type=color]{padding:2px;height:35px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.inspector-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.inspector-actions{display:flex;gap:7px;margin-top:11px;flex-wrap:wrap}.panel-section{border-top:1px solid var(--border);padding:18px}.section-header{display:flex;justify-content:space-between;align-items:center;gap:8px}.subtle{color:#8194a9;font-size:11px}.check-field{align-self:end;flex-direction:row!important;align-items:center;gap:7px!important}.check-field input{accent-color:var(--blue)}.main-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:15px}.tiny-note{font-size:11px;color:#73869e;line-height:1.6;margin-bottom:0}.lower{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(310px,.8fr);gap:17px;margin-top:17px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:18px}.metrics>div{border:1px solid #e6eef7;background:#f8fbff;border-radius:12px;padding:14px}.metrics b{display:block;font-size:22px;letter-spacing:-.6px;color:#246fc0}.metrics small{color:#8292a6;font-size:10px}.track-map{min-height:155px;margin:0 18px;border-radius:10px;background:linear-gradient(90deg,#f0f5fa 1px,transparent 1px),linear-gradient(#f0f5fa 1px,transparent 1px);background-size:24px 24px;display:grid;place-items:center;overflow:hidden}.track-map svg{width:100%;height:210px}.track-empty{color:#93a2b2;font-size:12px;text-align:center;padding:20px}.notes{padding:15px 18px}.notes b{font-size:12px}.notes p{font-size:11px;color:#778ba0;margin:5px 0}.export-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:18px}.export-grid button{text-align:left;background:#f8fbff;border:1px solid var(--border);border-radius:12px;padding:13px 12px;min-height:73px}.export-grid button:hover:not(:disabled){border-color:#7db6f3;background:#eff7ff}.export-grid b,.export-grid small{display:block}.export-grid b{font-size:12px;color:#2b4b6b}.export-grid small{color:#8a9aad;margin-top:4px;font-size:10px}.export-note{border-top:1px solid var(--border);margin:0 18px 18px;padding-top:15px;font-size:11px;color:#77899b}.guide{padding:73px 0 40px}.guide h2{font-size:27px;letter-spacing:-.9px;margin:7px 0 22px}.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.guide-grid article{padding:23px;background:#f7fbff;border:1px solid var(--border);border-radius:16px}.guide-grid article span{font-weight:800;color:#2b83d5;font-size:12px}.guide-grid h3{font-size:16px;margin:9px 0 5px}.guide-grid p,.limitations p{color:#73859b;font-size:12px;line-height:1.8}.limitations{margin-top:24px;padding:21px 23px;border-left:3px solid #81baff;background:#f6faff;border-radius:9px}.limitations p{margin:4px 0 0}footer{color:#8fa1b3;text-align:center;font-size:12px;padding:30px;border-top:1px solid var(--border)}.processing{position:fixed;inset:0;z-index:100;background:#0e2039bc;display:grid;place-items:center;padding:20px}.processing[hidden],.toast[hidden],[hidden]{display:none!important}.processing-card{background:#fff;border-radius:23px;width:min(410px,100%);padding:35px 30px;box-shadow:0 20px 65px #06182b33;text-align:center}.processing-card h2{margin:10px 0}.processing-card p{color:#65788f;font-size:13px}.spinner{border-radius:50%;border:4px solid #e7f1ff;border-top-color:var(--blue);width:38px;height:38px;margin:0 auto 19px;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.progress-track{height:8px;background:#e7f1ff;border-radius:12px;overflow:hidden;margin:18px 0 5px}.progress-track>div{width:0%;background:var(--blue);height:100%;transition:width .12s}.processing-card button{margin-top:17px}.toast{position:fixed;bottom:22px;left:50%;z-index:120;transform:translateX(-50%);border-radius:12px;padding:12px 19px;color:#fff;background:#193e69;max-width:min(530px,90vw);box-shadow:0 12px 32px #193e6940;font-size:13px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8bc2ff;outline-offset:2px}input[type=range]{accent-color:var(--blue)}@media(max-width:1100px){.workspace{grid-template-columns:minmax(0,1.35fr) minmax(268px,.9fr)}.viewer-actions{justify-content:flex-start}.panel-title{align-items:flex-start;flex-wrap:wrap}}@media(max-width:820px){.lower,.workspace{grid-template-columns:1fr}.stage canvas{max-height:55vh}.topbar{padding:0 20px}}@media(max-width:580px){.topbar{height:64px}.topbar nav{gap:10px}.topbar nav a{font-size:11px}.top-divider,.topbar .crumb{display:none}main{padding:0 12px}.hero{padding:44px 5px 35px}.hero h1{letter-spacing:-1.5px}.hero p{font-size:14px}.studio{padding:13px;border-radius:17px}.studio h2{font-size:19px}.upload{padding:13px;flex-wrap:wrap;gap:9px}.upload-icon{width:39px;height:39px}.upload-buttons{width:100%}.upload-buttons button{flex:1}.panel-title{padding:15px}.panel-title h3{font-size:14px}.panel-title p{font-size:11px}.stage{min-height:190px}.transport{gap:5px}.transport .btn{padding:6px}.transport input{order:2;flex-basis:100%!important}.time-text{margin-left:auto}.metrics{gap:6px;padding:11px}.metrics>div{padding:9px 5px;text-align:center}.metrics b{font-size:18px}.metrics small{font-size:9px}.export-grid{gap:7px;padding:12px}.export-grid button{padding:10px}.guide{padding-top:48px}.guide-grid{grid-template-columns:1fr}.hero-pills{gap:6px}.hero-pills span{font-size:10px;padding:5px 9px}.main-actions{grid-template-columns:1fr 1fr}.status-pill{font-size:10px}}.track-range{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:8px;margin-top:14px}.track-range label{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:650;color:#59718c}.track-range input,.track-range select{border:1px solid #d7e4f0;border-radius:8px;padding:8px 7px;width:100%;min-width:0;background:#fff;color:#2b425d}.track-range input:invalid{border-color:#d04a57}.track-range :focus-visible{outline:3px solid #8bc2ff;outline-offset:2px}@media(max-width:410px){.track-range{grid-template-columns:1fr 1fr}.track-range label:first-child{grid-column:1/-1}}.keyframe-panel{border-top:1px solid var(--border);padding:15px 18px;background:#fcfdff}.keyframe-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}.keyframe-heading h4{margin:0;font-size:13px;color:#244b73}.keyframe-navigation{display:flex;gap:5px}.keyframe-panel .tiny-note{margin:8px 0;font-size:10px;line-height:1.5;color:#72869a}.keyframe-list{max-height:240px;overflow:auto;scrollbar-width:thin;font-size:11px;color:#687e97}.keyframe-row{display:flex;align-items:center;gap:6px;padding:6px 0;border-bottom:1px solid #ebf0f5;min-width:0}.keyframe-row span{flex:1;min-width:0;overflow-wrap:anywhere}.keyframe-row .lost-note{color:#b45249;font-weight:700}.keyframe-row .btn{padding:5px 10px;min-height:29px}@media(max-width:420px){.keyframe-navigation .btn{font-size:10px;padding:5px 7px}}