:root{--chrome: #16202b;--chrome-2: #1e2b39;--chrome-3: #27384a;--edge: #33475d;--key-bg: #ffffff;--key-fg: #101820;--key-shadow: 0 2px 0 #b9c6d3;--struct: #8f1d1d;--accent: #2563eb;--accent-soft: #dbeafe;--accent-pale: #eff6ff;--paper: #ffffff;--ink: #0b1220;--line: #c3cfdb;--guide: #f4f7fb;--danger: #b3261e;--ok: #17692f;--kgap: 8px;--ppad: 10px;--radius: 10px;--ui: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--math: "Cambria Math", Cambria, Georgia, "Times New Roman", serif;--header-h: clamp(56px, 6vh, 72px);--strip-h: clamp(68px, 9vh, 92px)}:root.hc{--chrome: #000000;--chrome-2: #000000;--chrome-3: #101010;--edge: #ffffff;--key-bg: #000000;--key-fg: #ffffff;--key-shadow: none;--struct: #ffd400;--accent: #ffd400;--accent-soft: #4a3c00;--accent-pale: #2a2200;--paper: #000000;--ink: #ffffff;--line: #8d8d8d;--guide: #1c1c1c}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--chrome);color:#e8eef5;font-family:var(--ui);-webkit-text-size-adjust:100%}body{user-select:none;-webkit-user-select:none}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}.app{display:grid;grid-template-rows:var(--header-h) minmax(0,1fr) var(--strip-h);height:100dvh}.bar{display:flex;align-items:center;gap:14px;padding:0 12px;background:var(--chrome-2);border-bottom:1px solid var(--edge);min-width:0}.brand{display:flex;align-items:center;gap:8px;padding-right:6px;flex:0 0 auto}.brand-mark{font-size:26px;line-height:1;color:var(--accent);font-family:var(--math)}:root.hc .brand-mark{color:var(--accent)}.brand-name{font-size:17px;font-weight:650;letter-spacing:.2px;white-space:nowrap}.group{display:flex;gap:6px;padding:0 8px;border-left:1px solid var(--edge);height:100%;align-items:center;min-width:0}.spacer{flex:1 1 auto}.tool{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:62px;height:calc(var(--header-h) - 14px);padding:4px 8px;border-radius:var(--radius);background:var(--chrome-3);color:#dbe6f1;overflow:hidden}.tool.wide{min-width:96px}.tool>.face{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;pointer-events:none}.tool .g-svg,.tool .eye svg{width:22px;height:22px;display:block}.tool .lbl{font-size:11px;font-weight:600;letter-spacing:.2px;white-space:nowrap}.tool .dir-glyph{font-size:20px;line-height:22px;font-weight:700}.tool:hover{background:#31465c}.tool.on{background:var(--accent);color:#fff}:root.hc .tool.on{color:#000}.tool.is-off{opacity:.38}.work{display:grid;grid-template-columns:auto minmax(0,1fr) auto;min-height:0;background:var(--chrome)}.panel{display:flex;flex-direction:column;gap:8px;padding:var(--ppad);background:var(--chrome-2);min-height:0;overflow:hidden}.panel-left{width:clamp(214px,17.5vw,336px);border-right:1px solid var(--edge)}.panel-right{width:clamp(150px,12.5vw,232px);border-left:1px solid var(--edge)}.pane{display:flex;flex-direction:column;gap:8px;flex:1 1 auto;min-height:0}.pane.hidden{display:none}.pane-hint{margin:0;font-size:11.5px;line-height:1.35;color:#9db0c4;flex:0 0 auto}.pane-hint b,.pane-hint i{color:#dbe6f1}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;flex:0 0 auto}.tab{position:relative;height:40px;border-radius:8px;background:var(--chrome-3);color:#cfdce9;font-weight:700;letter-spacing:1px;overflow:hidden}.tab.on{background:var(--accent);color:#fff}:root.hc .tab.on{color:#000}.kgroup{display:flex;flex-direction:column;gap:5px;flex:var(--rowsn, 1) 1 0;min-height:0}.kgroup-label{margin:0;font-size:10.5px;font-weight:700;letter-spacing:.9px;text-transform:uppercase;color:#7d93a9;flex:0 0 auto}.kpad{display:grid;grid-template-columns:repeat(var(--kcols, 3),1fr);grid-auto-rows:1fr;gap:var(--kgap);flex:1 1 auto;min-height:0}.kblank{display:block}.key{position:relative;display:flex;align-items:center;justify-content:center;min-height:36px;min-width:0;border-radius:var(--radius);background:var(--key-bg);color:var(--key-fg);box-shadow:var(--key-shadow);overflow:hidden;transition:transform 90ms ease,box-shadow 90ms ease}:root.hc .key{border:2px solid var(--edge)}.key>.face{display:flex;align-items:center;justify-content:center;width:100%;height:100%;pointer-events:none}.key:hover{background:var(--accent-pale)}:root.hc .key:hover{background:var(--accent-pale)}@keyframes keypress{0%{transform:translateY(2px);filter:brightness(.86)}to{transform:translateY(0);filter:brightness(1)}}.key.pressed{animation:keypress .22s ease-out}.key.on{background:var(--accent);color:#fff}:root.hc .key.on{background:var(--accent);color:#000}.key.armed{background:var(--accent-pale);box-shadow:inset 0 0 0 3px var(--accent)}.key.stateful>.face{flex-direction:column;gap:2px;padding:2px 2px 0}.key .step{flex:0 0 auto;height:12px;line-height:12px;font-size:10px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--accent);white-space:nowrap}.key.stateful>.face>:first-child{min-height:0;flex:0 1 auto}.key.stateful .g-svg{max-height:100%}.key[data-state=num] .num-part,.key[data-state=den] .den-part,.key[data-state=active] .mark-part .ph,.key[data-state=active] .ph-rect.mark-part{background:var(--accent);border-color:var(--accent);fill:var(--accent);stroke:var(--accent)}.key[data-state=on] .mark-part,.key[data-state=on].tone-structure{color:var(--accent)}.key[data-state=open] .bar-part{stroke:var(--accent);stroke-width:7}.key[data-state=open] .slot-part{fill:var(--accent-soft);stroke:var(--accent)}.key.tone-structure{color:var(--struct)}.key.tone-structure.on{color:#fff}:root.hc .key.tone-structure.on{color:#000}.key.tone-operator{color:#13314f}:root.hc .key.tone-operator{color:var(--key-fg)}.key.tone-danger{color:var(--danger)}:root.hc .key.tone-danger{color:var(--key-fg)}.g-digit{font-size:clamp(20px,3.4vh,38px);font-weight:600;line-height:1;font-variant-numeric:tabular-nums}.g-plain{font-size:clamp(19px,3.1vh,34px);font-weight:600;line-height:1}.g-italic{font-family:var(--math);font-style:italic;font-size:clamp(20px,3.3vh,36px);line-height:1}.g-svg{width:clamp(26px,4vh,44px);height:auto;display:block}.g-svg-wrap{display:block}.ph-rect{fill:none;stroke:currentColor;stroke-width:2.5;opacity:.85}.ph{display:inline-block;width:.42em;height:.34em;border:.09em solid currentColor;vertical-align:baseline}.g-mark{position:relative;font-size:clamp(18px,3vh,32px);line-height:1;white-space:nowrap}.g-mark .g-italic{font-size:1em}.g-mark sup,.g-mark sub{font-size:.62em}.g-mark sup.deg{font-size:.7em}.g-repeat:after{content:"";position:absolute;top:-.16em;right:.04em;width:.16em;height:.16em;background:currentColor}.g-frac{display:inline-flex;flex-direction:column;align-items:center;gap:.12em;font-size:clamp(20px,3.4vh,36px)}.g-frac .ph{width:.64em;height:.5em;border-width:.07em}.g-frac .frac-bar{width:1.1em;height:.08em;background:currentColor}.g-join{display:flex;align-items:center;justify-content:center;border:2.5px solid currentColor;border-radius:6px;padding:.06em .3em;font-size:clamp(15px,2.4vh,26px)}.g-join .g-italic{font-size:1em}.tab-lbl{font-size:clamp(13px,1.7vh,16px)}.canvas{display:flex;flex-direction:column;align-items:center;min-width:0;min-height:0;padding:12px;background:var(--chrome);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--chrome-3) transparent;overscroll-behavior:contain}.canvas::-webkit-scrollbar{width:10px}.canvas::-webkit-scrollbar-thumb{background:var(--chrome-3);border-radius:999px}.canvas::-webkit-scrollbar-track{background:transparent}.grid{--cell: 60px;display:grid;grid-template-columns:repeat(var(--cols, 16),var(--cell));grid-auto-rows:var(--cell);flex:0 0 auto;background:var(--paper);border-top:1px solid var(--line);border-left:1px solid var(--line);box-shadow:0 10px 30px #00000073}:root.hc .grid{box-shadow:0 0 0 2px var(--edge)}.cell{position:relative;border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--ink);outline:none}:root.no-lines .cell{border-color:transparent}:root.no-lines .grid{border-color:transparent}.cell.on-guide{background:var(--guide)}.cell.in-range{background:var(--accent-soft)}.cell.is-anchor:before{content:"";position:absolute;left:0;bottom:0;border-left:9px solid var(--accent);border-top:9px solid transparent;opacity:.55}.cell.is-target{background:var(--accent-pale);box-shadow:inset 0 0 0 2px var(--accent)}.cell.is-cursor{background:var(--accent-pale);z-index:3;box-shadow:inset 0 0 0 3px var(--accent)}.cell-svg{position:absolute;inset:0;width:100%;height:100%}.cell-bar{position:absolute;left:-1px;right:-1px;top:calc(6% - 1.5px);height:0;border-top:3px solid currentColor}.cell-main{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;line-height:1;font-size:calc(var(--cell) * .56);font-variant-numeric:tabular-nums;white-space:nowrap}.cell-main[data-len="2"]{font-size:calc(var(--cell) * .42)}.cell-main[data-len="3"]{font-size:calc(var(--cell) * .32)}.cell-main[data-len="4"]{font-size:calc(var(--cell) * .25)}.cell-deg{font-size:.5em;line-height:1;position:relative;top:-.5em;margin-left:.02em}.cell-rep{position:absolute;left:50%;top:.02em;width:.16em;height:.16em;border-radius:50%;border:.08em solid currentColor;transform:translate(-50%);overflow:hidden;text-indent:-10em}.cell-sup,.cell-sub,.cell-presup,.cell-radindex{position:absolute;line-height:1;font-size:calc(var(--cell) * .26);font-variant-numeric:tabular-nums}.cell-sup{top:8%;right:4%}.cell-sub{bottom:8%;right:4%}.cell-presup{top:4%;left:5%}.cell-radindex{top:14%;left:7%;font-size:calc(var(--cell) * .26);font-weight:500}.cell-frac{position:absolute;inset:6% 12%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1em;font-size:calc(var(--cell) * .3);line-height:1}.frac-num,.frac-den{min-height:1em;font-variant-numeric:tabular-nums}.frac-rule{width:100%;height:0;border-top:2px solid currentColor}.strip{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--chrome-2);border-top:1px solid var(--edge);min-width:0}.strip-group{display:flex;gap:var(--kgap);height:100%;flex:0 0 auto}.strip-group .key{min-width:74px;padding:0 6px}.strip-group.arrows .key{min-width:52px}.strip-group.big .key{min-width:108px}.strip-group .key .face{flex-direction:column;gap:2px}.strip-group .key .lbl{font-size:11px;font-weight:700;letter-spacing:.2px}.strip-group .key .g-svg{width:clamp(20px,2.6vh,30px)}.strip-status{flex:1 1 auto;min-width:0;display:flex;align-items:center;justify-content:center}.status{max-width:100%;padding:7px 16px;border-radius:999px;background:var(--chrome-3);color:#dce7f2;font-size:clamp(12px,1.5vh,15px);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dwell-fill{position:absolute;inset:0;background:var(--accent);opacity:0;transform:scaleY(0);transform-origin:bottom;pointer-events:none}.dwelling>.dwell-fill{opacity:.3;transform:scaleY(var(--dwell, 0))}.dwelling{outline:3px solid var(--accent);outline-offset:-3px}.cell:after{content:"";position:absolute;inset:0;background:var(--accent);opacity:0;transform:scaleY(0);transform-origin:bottom;pointer-events:none}.cell.dwelling:after{opacity:.28;transform:scaleY(var(--dwell, 0))}:root.dwell-on .key:hover{background:var(--key-bg)}:root.dwell-on .tool:hover{background:var(--chrome-3)}.overlay{position:fixed;inset:0;display:none;place-items:center;padding:20px;background:#060c12b8;z-index:50}.overlay.open{display:grid}.card{width:min(880px,100%);max-height:100%;display:flex;flex-direction:column;background:var(--chrome-2);border:1px solid var(--edge);border-radius:16px;overflow:hidden}.card-confirm{width:min(560px,100%);padding:24px;gap:10px}.card h2{margin:0;font-size:22px}.card p{margin:0;color:#b9c8d7;line-height:1.5}.card-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:12px}.card-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;border-bottom:1px solid var(--edge)}.card-body{padding:8px 20px 20px;overflow:auto;display:grid;gap:4px}.big-btn{position:relative;min-width:128px;min-height:52px;padding:0 22px;border-radius:10px;background:var(--chrome-3);color:#e8eef5;font-size:16px;font-weight:650;overflow:hidden}.big-btn:hover{background:#37506a}.big-btn.danger{background:var(--danger);color:#fff}.card-calc{width:min(560px,100%)}.calc-screen{margin:14px 20px 0;padding:14px 18px;min-height:96px;display:flex;flex-direction:column;justify-content:center;gap:4px;border-radius:12px;background:var(--paper);color:var(--ink);border:1px solid var(--edge)}.calc-expr{font-size:clamp(18px,2.6vh,24px);line-height:1.25;font-family:var(--math);word-break:break-all}.calc-expr.is-empty{color:#7d8896;font-family:var(--ui);font-size:16px}.calc-answer{font-size:clamp(24px,3.6vh,34px);font-weight:700;font-variant-numeric:tabular-nums;min-height:1.2em;line-height:1.2;word-break:break-all}.calc-answer.is-error{font-size:16px;font-weight:600;color:var(--danger)}:root.hc .calc-answer.is-error{color:var(--accent)}.calc-pad{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--kgap);padding:14px 20px 0}.calc-key{position:relative;min-height:58px;border-radius:var(--radius);background:var(--key-bg);color:var(--key-fg);box-shadow:var(--key-shadow);overflow:hidden}:root.hc .calc-key{border:2px solid var(--edge)}.calc-key>.face{pointer-events:none}.ck-face{font-size:clamp(19px,2.8vh,26px);font-weight:600;line-height:1}.calc-key:hover{background:var(--accent-pale)}.calc-key.pressed{animation:keypress .22s ease-out}.ck-op .ck-face,.ck-fn .ck-face{color:#13314f}:root.hc .ck-op .ck-face,:root.hc .ck-fn .ck-face{color:var(--key-fg)}.ck-warn .ck-face{color:var(--danger)}:root.hc .ck-warn .ck-face{color:var(--key-fg)}.ck-go{background:var(--accent);color:#fff}:root.hc .ck-go{color:#000}.ck-go:hover{background:var(--accent);filter:brightness(1.08)}.calc-actions{padding:14px 20px 20px}.calc-actions .big-btn{width:100%;min-height:60px;font-size:17px}.big-btn.primary{background:var(--ok);color:#fff}:root.hc .big-btn.primary{background:var(--accent);color:#000}.big-btn.primary:hover{filter:brightness(1.08)}.big-btn.is-off{opacity:.42}.sect{padding:14px 0;border-bottom:1px solid var(--edge)}.sect:last-child{border-bottom:0}.sect h3{margin:0 0 10px;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#8ba1b7}.sect-note{margin-top:10px;font-size:13px;color:#93a7bb}.srow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:7px 0}.srow-label{font-size:16px}.stepper{display:flex;align-items:center;gap:10px}.stepper-val{min-width:74px;text-align:center;font-size:18px;font-weight:700;font-variant-numeric:tabular-nums}.round-btn{position:relative;width:52px;height:52px;border-radius:50%;background:var(--chrome-3);color:#e8eef5;font-size:24px;font-weight:700;overflow:hidden}.round-btn:hover{background:#37506a}.switch{position:relative;min-height:52px;padding:0 6px;border-radius:10px;overflow:hidden}.switch>.face{display:flex;align-items:center;gap:12px;pointer-events:none}.switch-track{width:68px;height:36px;border-radius:999px;background:#46596d;display:block;position:relative;transition:background .14s ease}.switch-knob{position:absolute;top:4px;left:4px;width:28px;height:28px;border-radius:50%;background:#fff;transition:transform .14s ease}.switch.on .switch-track{background:var(--accent)}.switch.on .switch-knob{transform:translate(32px)}.switch-text{font-size:15px;font-weight:650;min-width:30px}.help{display:grid;grid-template-columns:minmax(160px,34%) 1fr;gap:6px 18px;margin:0;font-size:14px}.help dt{font-weight:700;color:#dbe6f1}.help dd{margin:0;color:#a9bbcd;line-height:1.45}.toast{position:fixed;left:50%;bottom:calc(var(--strip-h) + 16px);transform:translate(-50%,12px);padding:12px 22px;border-radius:999px;background:var(--chrome-3);border:1px solid var(--edge);color:#e8eef5;font-size:15px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease;z-index:40}.toast.show{opacity:1;transform:translate(-50%)}.toast.error{background:#3a0f0c;border-color:#7a2a24}@page{size:landscape;margin:10mm}@media print{html,body{overflow:visible;background:#fff;height:auto}.app{display:block;height:auto}.bar,.panel,.strip,.toast,.overlay{display:none!important}.work{display:block}.canvas{display:block;padding:0;background:#fff;overflow:visible}.grid{box-shadow:none;border-color:#666;--cell: min(15mm, calc(268mm / var(--cols, 16)))}.cell{color:#000;border-color:#666}.cell.is-cursor,.cell.is-anchor,.cell.is-target,.cell.on-guide,.cell.in-range{background:transparent!important;box-shadow:none!important}.cell.is-anchor:before{display:none}.cell:after{display:none}.cell.no-print{display:none}}
