:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:#e8f1f2;background:#101d23;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #9de3d8;outline-offset:3px}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}#app{height:100dvh;min-height:590px;display:flex;flex-direction:column;overflow:hidden}.topbar{height:82px;flex:none;display:flex;justify-content:space-between;align-items:center;background:#14232a;padding:0 28px;border-bottom:1px solid #294047;z-index:5;gap:12px}.brand{display:flex;align-items:center;gap:16px;min-width:0}.brand-icon{height:47px;width:47px;border:1px solid #46766f;color:#9ce0c9;display:grid;place-items:center;border-radius:12px;font-size:38px;line-height:1;flex:none}.eyebrow{font-size:10px;letter-spacing:.18em;font-weight:800;color:#9cbbba}.brand h1{font-size:18px;font-weight:650;line-height:1.2;margin:5px 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand p{font-size:11px;color:#9eafb4;margin:0}.top-actions{display:flex;align-items:center;gap:8px}.status{font-size:11px;color:#abd7c9;background:#203c3c;padding:9px 12px;border-radius:99px;margin-right:10px;white-space:nowrap}.icon-btn,.small-btn{background:#23363e;color:#d3e6e6;border:1px solid #3a5058;border-radius:9px;height:36px;width:36px;font-size:18px}.icon-btn:hover,.small-btn:hover,.view-option:hover{background:#385259}#viewport{position:relative;flex:1;min-height:0;overflow:hidden;background:#bbcad0}#sceneCanvas{display:block;width:100%;height:100%;outline:none}.top-left-hud{position:absolute;left:30px;top:26px;pointer-events:none;display:flex;flex-direction:column;gap:7px;color:#223d40;text-shadow:0 1px 2px #fff8}.hud-label{font-size:10px;letter-spacing:.2em;font-weight:800}.top-left-hud strong{font-size:24px;font-weight:650}.hud-sub{font-size:11px;opacity:.76}.toolbar{position:absolute;left:22px;top:130px;background:#15272de8;border:1px solid #355157;border-radius:13px;padding:9px;box-shadow:0 14px 35px #10212633;display:flex;flex-direction:column;gap:3px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-width:180px}.toolbar-heading{font-size:9px;letter-spacing:.2em;color:#90abae;font-weight:800;padding:9px 10px}.view-option{background:transparent;border:0;text-align:left;border-radius:8px;color:#c2d0d2;padding:11px 13px;min-width:137px;display:flex;gap:11px;align-items:center;font-size:12px}.view-option.active{background:#29584f;color:#aaf9d6}.toolbar-rule{height:1px;background:#3d5156;margin:8px 3px}.gizmo{position:absolute;right:26px;top:25px;display:flex;flex-direction:column;align-items:center;gap:5px}.gizmo button{border:1px solid #49706e;background:#152b30dc;color:#dcebe9;border-radius:7px;min-width:39px;height:29px;font-size:10px;font-weight:800}.gizmo button:hover{background:#286a60}.gizmo-mid{display:flex;gap:5px}.view-hint{position:absolute;bottom:19px;left:24px;background:#19363aaa;color:#e0ecea;border-radius:6px;padding:8px 11px;font-size:10px;letter-spacing:.02em}.view-hint span{opacity:.4;padding:0 5px}.poi-layer{position:absolute;inset:0;pointer-events:none}.poi{position:absolute;top:0;left:0;border:0;background:transparent;color:#eaf7f1;display:flex;align-items:center;gap:7px;pointer-events:auto;white-space:nowrap;filter:drop-shadow(0 3px 9px #10212155)}.poi-dot{height:33px;width:33px;display:grid;place-items:center;border-radius:50%;background:#eaf5e8;color:#24594b;border:3px solid #3b7d6a;box-shadow:0 0 0 4px #e6f5e755;font-size:10px;font-weight:850}.poi-title{padding:8px 10px;background:#152c32e8;border:1px solid #63877e;border-radius:6px;font-size:11px;font-weight:700}.poi:hover .poi-dot,.poi.selected .poi-dot{background:#a2f2c9}.info-panel{position:absolute;right:25px;bottom:55px;width:min(330px,calc(100% - 50px));padding:25px;background:#162d34ef;border:1px solid #4d7873;box-shadow:0 15px 35px #0b1e2770;border-radius:15px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.panel-category{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#99debf;font-weight:800}.info-panel h2,.modal h2{font-size:22px;line-height:1.2;margin:11px 0}.info-panel p,.modal p{color:#c7d7d8;font-size:13px;line-height:1.65}.panel-close{position:absolute;right:14px;top:13px;border:0;background:transparent;color:#c1ddda;font-size:25px}.focus-btn{background:#a4f0c9;color:#14372e;border:0;border-radius:8px;font-weight:800;font-size:12px;padding:12px 17px;margin-top:10px}.focus-btn:hover{background:#c4ffe4}.timeline{flex:none;background:#14242b;border-top:1px solid #315459;padding:18px 28px;z-index:3;min-height:198px}.timeline-top{display:flex;justify-content:space-between;align-items:center;gap:15px}.timeline-title{display:flex;align-items:baseline;gap:12px;margin-top:8px}.timeline-title strong{font-size:16px}.timeline-title span{font-size:11px;color:#96acaf}.time-actions{display:flex;align-items:center;gap:15px}.time-actions select{background:#243d43;border:1px solid #4e6769;border-radius:6px;padding:8px;color:#e0ece7;font-size:12px}.frame-readout{font:700 12px ui-monospace,SFMono-Regular,monospace;color:#b9d2d0;min-width:72px;text-align:right}.timeline-row{display:flex;align-items:center;gap:14px;margin-top:18px}.play-btn{background:#a5ebc7;color:#11392b;border:0;border-radius:10px;width:41px;height:41px;flex:none;font-size:16px;font-weight:900}.play-btn:hover{background:#c9ffdf}.small-btn{flex:none}.scrub-wrap{flex:1;min-width:0;position:relative;height:32px;display:flex;align-items:center}#timelineSlider{width:100%;height:8px;border-radius:99px;appearance:none;background:linear-gradient(to right,#a3e9c7 var(--pct,0%),#355159 var(--pct,0%));cursor:pointer;margin:0;position:relative;z-index:2}#timelineSlider::-webkit-slider-thumb{appearance:none;width:19px;height:19px;background:#d8ffec;border:4px solid #398b74;border-radius:50%;box-shadow:0 0 0 3px #14242b}#timelineSlider::-moz-range-thumb{width:14px;height:14px;background:#d8ffec;border:4px solid #398b74;border-radius:50%}.chapter-markers{position:absolute;inset:0 9px;pointer-events:none}.chapter-marker{position:absolute;top:11px;width:2px;height:10px;border:0;padding:0;transform:translate(-50%);background:#a6c9ba;z-index:3;pointer-events:auto}.chapter-nav{display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin;margin-top:15px;padding-bottom:3px}.chapter-pill{flex:none;border:1px solid #345157;border-radius:7px;background:#1c3138;padding:9px 12px;font-size:11px;color:#9cb2b5}.chapter-pill span{font-size:10px;color:#6b9995;margin-right:7px}.chapter-pill:hover,.chapter-pill.chosen{background:#254b46;border-color:#5fa78e;color:#b7f3d3}.chapter-pill.chosen span{color:#a4f4cd}.loading-cover{position:absolute;z-index:10;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#182a2ef2;color:#e4f8e9;gap:13px;font-size:13px}.spinner{width:38px;height:38px;border:3px solid #40625c;border-top-color:#b6ffdb;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.progress-track{height:4px;width:220px;background:#3b5553;border-radius:10px;overflow:hidden}.progress-track div{width:0;height:100%;background:#a5edc5;transition:width .15s}.modal-backdrop{position:absolute;z-index:20;inset:0;background:#071619ae;display:grid;place-items:center;padding:22px}.modal{position:relative;background:#1b3038;border:1px solid #50746f;border-radius:14px;padding:30px;width:min(475px,100%);box-shadow:0 25px 70px #091719aa}.modal kbd{background:#385159;color:#fff;border-radius:3px;padding:2px 6px;font-size:11px}@media(max-width:760px){#app{min-height:560px}.topbar{height:68px;padding:0 12px}.brand-icon{width:35px;height:35px;font-size:30px}.brand{gap:9px}.brand h1{font-size:13px}.brand p,.status{display:none}.top-actions{gap:5px}.icon-btn{width:30px;height:31px;font-size:15px}.top-left-hud{top:15px;left:15px}.top-left-hud strong{font-size:17px}.hud-sub{display:none}.toolbar{left:8px;top:79px;padding:5px;max-width:55px}.toolbar-heading{display:none}.view-option{min-width:0;width:39px;padding:10px;font-size:15px}.view-option span{display:none}.gizmo{right:9px;top:13px;gap:3px}.gizmo button{min-width:30px;height:25px;font-size:9px}.gizmo-mid{gap:3px}.poi-title{max-width:120px;overflow:hidden;text-overflow:ellipsis;font-size:10px}.poi-dot{height:28px;width:28px;font-size:9px}.info-panel{bottom:12px;right:10px;padding:17px;width:min(300px,calc(100% - 20px))}.view-hint{display:none}.timeline{padding:12px 10px 10px;min-height:168px}.timeline-title{flex-direction:column;gap:3px}.timeline-title strong{font-size:13px}.timeline-title span{display:none}.time-actions{gap:6px}.time-actions select{padding:5px}.frame-readout{font-size:10px;min-width:57px}.timeline-row{gap:9px;margin-top:12px}.play-btn{width:35px;height:35px}.small-btn{height:32px;width:32px}.chapter-nav{margin-top:10px}.chapter-pill{padding:8px;font-size:10px}}@media(prefers-reduced-motion:reduce){.spinner{animation:none}*{scroll-behavior:auto!important}}.chapter-pill small{display:block;margin-top:4px;color:#88a7a5;font-size:9px;font-variant-numeric:tabular-nums}.chapter-pill.chosen small{color:#a4f4cd}.chapter-nav{scroll-snap-type:x proximity}.chapter-pill{scroll-snap-align:start}.scrub-wrap{touch-action:none;cursor:ew-resize;min-height:38px}.chapter-markers,.chapter-marker{pointer-events:none;z-index:1}#timelineSlider{z-index:2;touch-action:none}.poi{transition:opacity .2s ease;max-width:205px}.poi-title{max-width:165px;overflow:hidden;text-overflow:ellipsis}@media(max-width:760px){.poi-title{max-width:105px}}.top-left-hud{background:#0d1d23e6;color:#f2fbf8;text-shadow:none;padding:16px 19px;border-radius:13px;border:1px solid rgba(159,220,204,.28);box-shadow:0 12px 35px #00000040;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);max-width:min(340px,calc(100% - 100px))}.top-left-hud .hud-label{color:#a8dcca}.top-left-hud .hud-sub{color:#c4d6d4;opacity:1}.timeline{position:relative;z-index:30;isolation:isolate}.chapter-nav{position:relative;z-index:32;pointer-events:auto;touch-action:pan-x;padding:10px;background:#08171db3;border:1px solid #355058;border-radius:12px;scroll-behavior:smooth}.chapter-pill{position:relative;z-index:33;pointer-events:auto;cursor:pointer;min-height:48px;touch-action:manipulation;background:#233a40;color:#e9f2f0;border-color:#506b70}.chapter-pill:hover{background:#32675c;border-color:#a5edc5}.chapter-pill.chosen{background:#2b6a58;color:#fff;border-color:#9cebc8}.scrub-wrap{z-index:1}@media(max-width:760px){.top-left-hud{max-width:60%;padding:11px 13px}.chapter-nav{padding:7px}}
