border-color: rgba(74,158,255,.30) !important; color: #6096cc !important; box-shadow: none !important; } #ch-btn-print:hover, #ch-btn-export:hover { background: rgba(74,158,255,.20) !important; border-color: #4a9eff !important; color: #c8e0ff !important; } body.light #ch-btn-print, body.light #ch-btn-export { background: rgba(44,118,208,.10) !important; border-color: rgba(44,118,208,.4) !important; color: #1f4a7a !important; box-shadow: none !important; body.light #ch-btn-print:hover, body.light #ch-btn-export:hover { background: rgba(44,118,208,.20) !important; border-color: #2c76d0 !important; color: #0a2a5c !important; #chapter-content { position: relative !important; } #chapter-nav { position: absolute !important; top: -38px !important; left: 50% !important; transform: translateX(-50%) !important; display: flex !important; align-items: center !important; gap: 5px !important; justify-content: center !important; min-width: 120px !important; width: max-content !important; max-width: 100vw !important; z-index: 20 !important; @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600&family=IBM+Plex+Sans:wght@300;400;600;700&display=swap'); *{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent} body{background:#06090e;overflow:hidden;height:100vh;width:100vw;font-family:'IBM Plex Sans',sans-serif;touch-action:none} body.light{background:#9aafc0} canvas{display:block;position:absolute;inset:0} #ui{position:absolute;inset:0;pointer-events:none} #hdr{position:absolute;top:10px;left:20px;max-width:calc(100vw - 310px)} h1{font-size:clamp(12px,2.1vw,22px);font-weight:600;color:#d8e0ec;line-height:1.15;white-space:nowrap;max-width:none;letter-spacing:.01em} .hsub, #gate-hdr .gsub { font-size: 17px !important; font-weight: 400 !important; color: #8ea6bd !important; font-family: 'IBM Plex Sans', sans-serif !important; } .hauth, #gate-hdr .gauth { font-size: 14px !important; } .hsub{font-family:'IBM Plex Sans',sans-serif;font-weight:300;color:#7a8898;line-height:1.3;margin-top:4px;max-width:820px} .hauth{font-family:'IBM Plex Mono',monospace;letter-spacing:.10em;color:#6f879f;text-transform:uppercase;margin-top:6px;pointer-events:all} .hauth a{color:inherit;text-decoration:none} .hauth a:hover{color:#a0b8d0;text-decoration:underline;text-decoration-color:rgba(160,184,208,.4)} .panel{background:rgba(6,9,14,.93);border:1px solid #16202e;border-radius:6px;padding:14px 16px;width:clamp(195px,24vw,245px);backdrop-filter:blur(12px);pointer-events:all;max-height:calc(100vh - 32px);overflow:auto;overscroll-behavior:contain} #legL{position:absolute;top:116px;left:16px} #legR{position:absolute;top:116px;right:16px} /* Panel toggle buttons (top-right corner) */ #panel-toggles{position:absolute;top:16px;right:16px;display:flex;gap:6px;pointer-events:all;z-index:10} .ptgl{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.09em;text-transform:uppercase;padding:0 10px;height:26px;background:rgba(10,15,24,.88);border:1px solid #1c2638;color:#5a6878;border-radius:4px;cursor:pointer;transition:all .18s;-webkit-user-select:none;user-select:none;white-space:nowrap} .ptgl:hover{border-color:#3a5080;color:#b0c0d0} .ptgl.on{border-color:#4a9eff;color:#4a9eff;background:rgba(74,158,255,.07)} body.light .ptgl{background:rgba(200,218,234,.90);border-color:#7a96ae;color:#2a3f52} body.light .ptgl:hover{border-color:#6f92be;color:#1f2d3b} body.light .ptgl.on{border-color:#2c76d0;color:#2c76d0;background:rgba(44,118,208,.11)} .panel h3{font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.14em;color:#6f879f;text-transform:uppercase;margin-bottom:11px} .li{display:flex;align-items:flex-start;gap:9px;margin-bottom:8px} .ld{width:11px;height:11px;border-radius:50%;flex-shrink:0;margin-top:2px} .ldia{width:10px;height:10px;flex-shrink:0;margin-top:3px;transform:rotate(45deg);border:1.5px solid} .lt{font-size:clamp(11px,1.35vw,13px);color:#8ea6bd;line-height:1.4} .leg-lbl{display:block;font-size:0.72em;opacity:0.6;margin-top:1px} .leg-lbl:empty{display:none} .lln{width:20px;border-top:2px solid;flex-shrink:0;margin-top:7px} .lln-dashed{width:20px;border-top:2px dashed;flex-shrink:0;margin-top:7px} .ldv{border:none;border-top:1px solid #141e2a;margin:8px 0} /* Slider-style ON/OFF switch */ .t2h{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;color:#6f879f;text-transform:uppercase;margin:8px 0 8px} .t2sw{position:relative;display:inline-block;width:38px;height:20px;flex-shrink:0} .t2sw input{opacity:0;width:0;height:0} .t2slider{position:absolute;inset:0;background:#111a26;border:1px solid #26354c;transition:.18s;border-radius:999px} .t2slider:before{position:absolute;content:'';height:16px;width:16px;left:2px;top:1px;background:#607585;transition:.18s;border-radius:50%} .t2sw input:checked + .t2slider{background:rgba(74,158,255,.14);border-color:#4a9eff} .t2sw input:checked + .t2slider:before{transform:translateX(18px);background:#4a9eff}