
:root{--b:#0d171d;--g:#ceab72;--t:#e6e7e5;--dim:#84929a;--line:#344048}*{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:'DM Sans',system-ui,sans-serif;background:var(--b);color:var(--t);display:flex;overflow:hidden}#viewport{position:relative;flex:1;min-width:0;overflow:hidden;background:radial-gradient(circle at 43% 48%,#344049 0%,#101c23 45%,#0a131b 100%)}#canvas{width:100%;height:100%;display:block;touch-action:none}.topbar{position:absolute;left:40px;top:29px;right:40px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.brand{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:800;letter-spacing:.18em}.seal{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--g);border-radius:50%;font-size:12px;color:var(--g)}.seal span{color:#6b7882}.dot{color:var(--g)}.edition,.scene-label,.bottom-hint{color:#9aa6ac;letter-spacing:.18em;font-size:10px;font-weight:600}.scene-label{position:absolute;left:44px;bottom:82px}.bottom-hint{position:absolute;left:44px;bottom:43px;color:#74848b}.bottom-hint span{color:var(--g);padding:0 9px}#loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:18px;font-size:10px;letter-spacing:.19em;color:#bdc7c5}.spinny{border:2px solid #52616a;border-top-color:#e5b974;width:25px;height:25px;border-radius:50%;animation:spin 1.3s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.panel{position:relative;z-index:2;flex:none;width:400px;overflow:auto;padding:39px 36px 31px;border-left:1px solid #46515b;background:#131e25;box-shadow:-12px 0 45px rgba(0,0,0,.12)}.eyebrow,.section-label{color:var(--g);font-size:10px;letter-spacing:.18em;font-weight:700}.eyebrow{margin:9px 0 20px}.panel h1{font-family:'Manrope',sans-serif;margin:0;font-size:31px;line-height:1.3;letter-spacing:-.036em;font-weight:800}.panel h1 em{font-style:normal;color:#c5a26f}.subtitle,.notes{font-size:12px;line-height:1.9;color:#afbac0}.subtitle{margin:19px 0 22px}.line{height:1px;background:var(--line);margin:24px 0}.section-label{display:flex;justify-content:space-between;align-items:center;margin:0 0 14px}.section-label #runState{font-size:9px;letter-spacing:.1em;color:#95b5a8}.rpm{display:flex;align-items:baseline;gap:14px;margin:12px 0 13px}.rpm strong{font-size:50px;line-height:1.2;font-weight:500;letter-spacing:-.06em}.rpm span{font-size:12px;color:var(--dim);letter-spacing:.2em}.slider{display:block;width:100%;accent-color:#ceab72;cursor:pointer;margin:10px 0 12px}.ticks{display:flex;justify-content:space-between;color:#798b93;font-size:10px}.actions{display:flex;gap:9px;margin-top:22px}.actions button{font-size:10px;letter-spacing:.12em;font-weight:800;border:1px solid #bb975b;cursor:pointer;padding:13px 11px;border-radius:3px}.primary{background:#c8a876;color:#151d23;flex:1}.secondary{background:transparent;color:#c8a876}.actions button:focus-visible,.slider:focus-visible{outline:2px solid #fff;outline-offset:3px}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:20px 18px;margin-top:19px}.metrics>div{border-top:1px solid #34424b;padding-top:11px;display:flex;flex-direction:column;gap:5px}.metrics span{font-size:10px;letter-spacing:.1em;color:#85939e}.metrics strong{font-size:18px;font-weight:500;font-variant-numeric:tabular-nums}.notes{margin-bottom:13px}.foot{color:#71828c;font-size:10px;line-height:1.7}@media(max-width:850px){body{flex-direction:column}#viewport{min-height:53vh;flex:auto}.topbar{left:22px;right:22px;top:17px}.edition{display:none}.scene-label{left:22px;bottom:51px}.bottom-hint{left:22px;bottom:20px;font-size:8px}.panel{width:100%;flex:none;height:auto;max-height:47vh;overflow:auto;padding:25px 23px}.panel h1{font-size:24px}.subtitle{margin-top:10px}.line{margin:17px 0}.rpm strong{font-size:36px}}
