*{box-sizing:border-box}html,body{margin:0;background:#0b1519;color:#eef6f8;font-family:-apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif}body{height:100svh;overflow:hidden}.lab-ui{display:none!important}#lab-gl{position:fixed!important;inset:0;touch-action:none}.sonic{position:relative;max-width:540px;margin:auto;height:100svh;pointer-events:none}.sonic button,.sonic a,.sonic details{pointer-events:auto}header{position:absolute;top:22px;left:24px;right:24px}.eyebrow{font-size:10px;letter-spacing:2px;color:#16c0d6}.eyebrow span{float:right;color:#83949b;font-size:9px}h1{font-size:34px;letter-spacing:-1.5px;line-height:1.1;margin:13px 0 8px}h1 i{font-weight:400;color:#16c0d6;font-size:30px}header p{font-size:12px;color:#a8b8bd;margin:0}.viewbar{position:absolute;top:140px;left:24px;display:flex;gap:5px;pointer-events:auto}button,a{font:inherit;-webkit-tap-highlight-color:transparent}button{border:1px solid #30424b;color:#b3c2c8;background:#101e25;border-radius:5px;min-height:36px;padding:7px 12px;font-size:12px;cursor:pointer}.on{color:#0b1519!important;background:#16c0d6!important;border-color:#16c0d6!important}.hint{position:absolute;top:188px;left:24px;right:24px;font-size:10px;color:#8a9ca4}.hint span{float:right}.deck{position:absolute;bottom:16px;left:24px;right:24px;padding-top:10px;background:#0b1519ed;border-top:1px solid #34464f;pointer-events:auto}.readout{display:grid;grid-template-columns:1fr 1fr 1fr;margin-bottom:12px}.readout div+div{border-left:1px solid #293d46;padding-left:20px}.readout small{display:block;font-size:10px;color:#8fa4af;margin-bottom:4px}.readout b{font-size:25px;font-weight:500;color:#16c0d6;font-variant-numeric:tabular-nums}.readout b span{font-size:12px}.hands{display:flex;gap:4px}.hands button{flex:1;min-height:34px}.hands small{font-size:10px;margin-left:8px}.keys{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}.keys button{display:grid;grid-template-columns:25px 1fr;text-align:left;align-items:center;border-color:#38616c;min-height:49px}.keys b{grid-row:1/3;font-size:22px;color:#16c0d6}.keys span{font-size:12px;color:#eef6f8}.keys small{font-size:9px;color:#8fa4af}.keys button:active{transform:translateY(2px);background:#154250}#status{margin:9px 0;font-size:10px;color:#8fa4af}.modes{display:flex;gap:4px;align-items:center}.modes button{min-height:30px;font-size:10px;padding:4px 9px}.modes a{font-size:10px;color:#8ebfca;margin-left:auto;text-decoration:none}details{font-size:10px;color:#8fa4af;margin-top:10px}details p{line-height:1.7}details[open]{max-height:160px;overflow:auto}#filmcap{display:none}@media(max-height:720px){header{top:14px}h1{font-size:28px}.viewbar{top:113px}.hint{top:156px}.deck{bottom:10px}.readout{margin-bottom:7px}.readout b{font-size:21px}details{display:none}}@media(min-width:700px){.sonic{border-left:1px solid #203640;border-right:1px solid #203640}.deck{bottom:24px}}