@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500;600&family=Noto+Sans+TC:wght@400;500;700;900&display=swap";:root{font-family:Noto Sans TC,sans-serif;color:#eaf2f7;background:#050c16;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 25% 0,#123149 0,transparent 34%),#050c16}button{font:inherit;color:inherit}main{max-width:1500px;margin:auto;padding:22px 28px 14px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.eyebrow{font:600 10px IBM Plex Mono;letter-spacing:.28em;color:#52dce7;margin:0 0 4px}h1{font-size:28px;margin:0;letter-spacing:-.03em}h1 span{font:600 12px IBM Plex Mono;color:#69dfeb;border:1px solid #238491;border-radius:4px;padding:3px 6px;vertical-align:middle}.header-status{font:500 12px IBM Plex Mono;color:#8ba5b7;display:flex;gap:9px;align-items:center}.header-status b{color:#dbe7ed;margin-left:14px}.pulse{width:8px;height:8px;background:#38dca4;border-radius:50%;box-shadow:0 0 12px #38dca4}.warning{border:1px solid #76572a;background:#241c10;color:#e8d0a8;padding:10px 14px;border-radius:6px;display:flex;gap:16px;font-size:12px;margin-bottom:14px}.warning b{color:#ffc85e}.workspace{display:grid;grid-template-columns:minmax(520px,1fr) 365px;gap:14px}.stage,aside{background:#0a1522;border:1px solid #1d3345;border-radius:8px;overflow:hidden}.digits{height:56px;display:flex;border-bottom:1px solid #1b3040;padding:8px 10px;gap:6px;background:#09131e}.digits button{position:relative;flex:1;background:#0d1b29;border:1px solid #20384b;border-radius:5px;color:#7f9aab;font:600 15px IBM Plex Mono;cursor:pointer}.digits button:hover{border-color:#4db8c2}.digits button.active{color:#061016;background:#5edce5;border-color:#8bf5fc;box-shadow:0 0 16px #36d4e533}.digits button.done:not(.active){color:#71e3b1;border-color:#287b5d}.digits i{position:absolute;right:5px;top:2px;font-size:9px}.canvas-wrap{height:590px;position:relative}.stage-label{position:absolute;left:18px;top:18px;display:flex;flex-direction:column;padding:9px 12px;background:#06101bcc;border-left:2px solid #54dbe6}.stage-label b{font:600 13px IBM Plex Mono}.stage-label span{font-size:11px;color:#91a8b7;margin-top:3px}.viewbar{min-height:55px;padding:8px 10px;display:flex;justify-content:space-between;gap:10px;border-top:1px solid #1b3040}.viewbar>div{display:flex;gap:5px}.viewbar button,.toggle{background:#0d1b29;border:1px solid #20384b;border-radius:4px;font-size:11px;padding:7px 9px;color:#8fa7b6;cursor:pointer}.viewbar button.active,.toggle.on{border-color:#3caeba;color:#65e8f0;background:#102b35}.toggle span{font:600 8px IBM Plex Mono;margin-left:6px;color:#5e7483}.toggle.on span{color:#65e8f0}aside{padding:16px;overflow:auto}.pose-meta{display:flex;align-items:center;justify-content:space-between;font:600 11px IBM Plex Mono;color:#5bdce6;margin-bottom:12px}.pose-meta b{color:#e6b450;border:1px solid #795d2d;padding:4px 7px;border-radius:3px}.pose-meta b.confirmed{color:#6de0ad;border-color:#267653}.arm-card{border:1px solid #23394b;background:#0c1926;border-radius:6px;padding:13px;margin-bottom:10px}.arm-title{display:flex;align-items:center;gap:8px;margin-bottom:11px}.arm-title b{font-size:13px}.arm-title output{margin-left:auto;color:#5ee5ef;font:600 12px IBM Plex Mono}.flag-dot{width:9px;height:9px;border-radius:2px}.flag-dot.left{background:#ff3f61}.flag-dot.right{background:#ffd64a}.directions{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.directions button,.fine button{border:1px solid #294358;background:#101f2d;border-radius:4px;cursor:pointer}.directions button{font-size:20px;height:36px}.directions button:hover,.directions button.selected{border-color:#58d9e4;background:#15343e;color:#6ceaf1}.fine{display:grid;grid-template-columns:65px 1fr 65px;gap:5px;align-items:center;margin-top:8px}.fine button{padding:7px;color:#b9cbd6}.fine span{text-align:center;font-size:10px;color:#718b9b}.slider{display:block;margin-top:12px;border-top:1px solid #203646;padding-top:10px}.slider>span{font-size:11px;display:flex;justify-content:space-between}.slider b{font:600 10px IBM Plex Mono;color:#62e5ee}.slider input{width:100%;accent-color:#50dbe5}.slider small{display:block;color:#688290;font-size:9px}.rule{border-left:2px solid #eeb652;background:#221c11;padding:10px 11px;margin:10px 0;display:flex;flex-direction:column;gap:4px}.rule b{font-size:11px;color:#f1c46f}.rule span{font-size:10px;line-height:1.6;color:#a99b80}.confirm{width:100%;border:1px solid #4acfd8;background:#4acfd8;color:#061116;padding:11px;border-radius:5px;font-weight:700;cursor:pointer;margin-top:2px}.confirm.confirmed{background:#143b31;border-color:#45c890;color:#76e5b5}.actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.actions button{border:1px solid #294358;background:#101f2d;border-radius:4px;padding:9px 5px;font-size:10px;cursor:pointer}.actions .export{grid-column:1/-1;border-color:#357e9c;color:#71d8f0}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%);background:#eaf7f7;color:#07131c;padding:10px 18px;border-radius:5px;font-size:12px;box-shadow:0 8px 40px #0008}footer{text-align:center;color:#536d7d;font-size:10px;margin-top:10px}@media(max-width:900px){main{padding:14px}.workspace{grid-template-columns:1fr}.canvas-wrap{height:520px}aside{overflow:visible}header{align-items:flex-start}.header-status{flex-wrap:wrap;justify-content:flex-end}.header-status b{width:100%;text-align:right}}@media(max-width:560px){main{padding:8px}.workspace{grid-template-columns:minmax(0,1fr)}.canvas-wrap{height:430px}.viewbar{flex-direction:column}.warning{flex-direction:column;gap:3px}.header-status{display:none}.digits{gap:3px;padding:7px 5px}.digits button{font-size:12px}.toggle{padding:6px}.viewbar>div{flex-wrap:wrap}}.mode-bar{display:flex;gap:14px;align-items:center;margin-bottom:14px;flex-wrap:wrap}.mode-bar button,.secondary{border:1px solid #357e9c;border-radius:5px;background:#102735;color:#86e6ed;padding:10px 14px;cursor:pointer}.mode-bar span,.training-intro,.muted{color:#91a8b7;font-size:12px;line-height:1.8}button:disabled{opacity:.45;cursor:not-allowed}.training-state{padding:16px;color:#6ceaf1;text-align:center;border-top:1px solid #203646}.training h2{font-size:16px}.speed-label{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-bottom:20px}.speed-label select{background:#102735;color:#eaf2f7;border:1px solid #357e9c;padding:9px;border-radius:4px}.answer-label{display:block;font-size:14px;margin:20px 0 10px}.answer-input{width:100%;padding:14px;background:#07111f;color:#83f1f5;border:1px solid #4acfd8;border-radius:5px;font:600 28px monospace;letter-spacing:.2em;margin-bottom:12px}.answer-input::placeholder{font-size:15px;letter-spacing:0;color:#738b9c}.full{width:100%;margin-top:10px}.result-panel{margin-top:20px;padding:14px;background:#101f2d;border:1px solid #294358;border-radius:6px;font-size:13px}.code{font-family:monospace;font-size:24px;letter-spacing:.13em;margin-left:8px}.result-digits{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.result-digits span{padding:8px;border-radius:4px;background:#0a1522}.correct{color:#71e3b1}.incorrect{color:#ff8d9e}.session-stats{border-top:1px solid #294358;margin-top:22px;padding-top:10px;font-size:12px;color:#91a8b7}