@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#f5f6f8;--ink:#16243b;--muted:#687489;--line:#dfe4eb;--accent:#4e48df;--soft:#efedff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px 'DM Sans',system-ui,sans-serif}header{height:94px;display:flex;align-items:center;justify-content:space-between;max-width:1220px;margin:auto;padding:0 30px;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit;font:700 25px 'Space Grotesk',sans-serif}.brand b{background:var(--ink);color:white;font:600 25px monospace;padding:10px;border-radius:12px}.brand small{display:block;font:10px 'DM Sans',sans-serif;letter-spacing:2px;color:var(--muted);margin-top:3px}.local{color:var(--muted);font-size:12px}.local i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#2eab83;margin-right:7px}main{max-width:1160px;margin:auto;padding:0 0 24px}.intro{display:flex;justify-content:space-between;align-items:center;padding:48px 0 36px}.eyebrow{font-size:11px!important;letter-spacing:2px;font-weight:700;color:var(--accent)!important}h1{font:600 clamp(28px,4vw,44px) 'Space Grotesk',sans-serif;letter-spacing:-1.8px;margin:14px 0}h1 span{color:var(--accent)}.intro p{color:var(--muted);font-size:15px}.decoration{font:700 30px monospace;letter-spacing:10px;transform:rotate(-9deg);color:#c9c5f3;padding-right:28px}.decoration span{display:block;color:#dedcf4;margin-left:25px}nav{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:26px}button,input,select{font:inherit}button{cursor:pointer;border:1px solid var(--line);background:white;color:var(--ink);border-radius:8px;padding:10px 15px;transition:.15s}button:hover{border-color:var(--accent);color:var(--accent)}button:focus-visible,input:focus,select:focus{outline:2px solid #9e97f6;outline-offset:2px}nav button{border:0;background:transparent;border-radius:8px 8px 0 0;padding:17px 22px;color:var(--muted);font-size:12px}nav button span{margin-left:10px;font-size:14px}nav button.active{color:var(--accent);background:var(--soft);border-bottom:3px solid var(--accent)}.panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px;margin-bottom:20px}.panel-head{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:24px}h2{font:600 21px 'Space Grotesk',sans-serif;margin:0 0 6px}h3{font-size:15px;margin-top:0}.sub{font-size:13px;color:var(--muted);margin:0;line-height:1.7}.tag{font-size:11px;background:var(--soft);color:var(--accent);border-radius:6px;padding:7px 10px;white-space:nowrap}.inputs{display:grid;grid-template-columns:1fr 190px;gap:18px}label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:8px}input,select{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:9px;background:#fafbfc;color:var(--ink)}input{font-family:ui-monospace,Consolas,monospace}.large{font-size:24px;padding:17px}.examples{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:17px;font-size:12px;color:var(--muted)}.examples button{font-size:12px;padding:6px 10px;background:#f8f9fb}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.result{background:white;border:1px solid var(--line);border-radius:12px;padding:20px;min-width:0}.result .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.badge{font:700 12px monospace;color:var(--accent);background:var(--soft);padding:6px 9px;border-radius:5px}.result small{font-size:11px;color:var(--muted);margin-left:10px}.value{font:500 23px ui-monospace,Consolas,monospace;overflow-wrap:anywhere;line-height:1.6}.copy{font-size:12px;padding:5px 9px;border:0;background:#f5f6f8}.note{border-left:3px solid var(--accent);background:var(--soft);padding:16px 20px;color:#514c80;line-height:1.7;font-size:13px;margin-top:20px;border-radius:0 8px 8px 0}.error{color:#ac2944;background:#fff0f2;padding:14px;border-radius:9px;margin:16px 0}.triple{display:grid;grid-template-columns:1fr 140px 1fr;gap:14px}.controls{display:flex;gap:12px;align-items:center;margin-top:18px}.controls select{width:auto}.primary{background:var(--accent);color:white;border-color:var(--accent)}.primary:hover{color:white;background:#3a35bc}.bitstrip{display:flex;flex-wrap:wrap;gap:4px;margin:20px 0}.bit{padding:7px 5px;min-width:23px;font:12px monospace;background:#e8e7fa;color:#5144ba;border:0;border-radius:4px}.bit.sign{background:#fbe1e7;color:#ae3b5e}.bit.exp{background:#e0edf9;color:#276d9f}.bit.integer{background:#ddf3e9;color:#227d60}.legend{display:flex;flex-wrap:wrap;gap:16px;font-size:12px;color:var(--muted)}.legend i{display:inline-block;width:9px;height:9px;margin-right:5px;border-radius:2px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:22px}.stat{background:#f8f9fb;padding:15px;border-radius:9px;overflow-wrap:anywhere}.stat label{font-size:11px}.stat strong{font:500 19px monospace}details{border-top:1px solid var(--line);padding-top:16px;margin-top:20px}summary{cursor:pointer;font-weight:600;font-size:13px}pre{white-space:pre-wrap;overflow-wrap:anywhere;font:13px/1.7 monospace;background:#f7f8fb;padding:16px;border-radius:8px}.formula{font-family:monospace;overflow-wrap:anywhere;line-height:1.8}table{width:100%;border-collapse:collapse;font-size:13px}th,td{text-align:left;padding:12px;border-bottom:1px solid var(--line)}th{color:var(--muted);font-size:11px}.learn p,.learn li{color:var(--muted);font-size:14px;line-height:1.8}.learn a{color:var(--accent)}footer{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);padding:25px 0;border-top:1px solid var(--line);margin-top:30px}@media(min-width:1500px){main{padding-top:15px}}@media(max-width:1200px){main{padding:0 24px 24px}}@media(max-width:650px){header{height:78px;padding:0 20px}.local{display:none}.intro{padding:30px 0 20px}.decoration{display:none}h1{letter-spacing:-1px}nav{overflow:auto;gap:0}nav button{padding:14px 11px;white-space:nowrap}nav button span{font-size:12px;margin-left:5px}.panel{padding:19px}.inputs,.triple,.grid{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.large{font-size:20px}.panel-head{align-items:start}.value{font-size:19px}footer{gap:15px;font-size:10px}.bit{min-width:20px;padding:6px 4px}.controls{flex-wrap:wrap}}
.tutor{max-width:900px;margin:0 auto 20px}.tutor progress{width:100%;height:7px;accent-color:var(--accent);margin:0 0 28px}.teacher-body{font-size:21px;line-height:1.8;overflow-wrap:anywhere}.check{background:#f7f8fb;border-radius:10px;padding:18px;margin-top:24px}.answer-row{display:flex;gap:10px}.answer-row input{max-width:240px}.lesson-history{padding-left:24px;line-height:1.9;color:var(--muted)}.lesson-history li{padding:7px 0;overflow-wrap:anywhere}.tutor .note p{margin:12px 0} @media(max-width:650px){.teacher-body{font-size:18px}.answer-row{flex-wrap:wrap}.triple{grid-template-columns:1fr}}
.method-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:20px 0}.method-card{text-align:left;padding:18px}.method-card span{display:block;font-size:13px;line-height:1.7;color:var(--muted);margin-top:8px}.method-card.selected{border:2px solid var(--accent);background:var(--soft)}[hidden]{display:none!important}

.term{font:inherit;color:inherit;padding:0 2px;background:transparent;border:0;border-bottom:1px dotted var(--accent);border-radius:0;cursor:help}.term-popup{position:fixed;z-index:9999;width:min(310px,calc(100vw - 24px));padding:16px 18px;background:#192841;color:white;border-radius:12px;box-shadow:0 8px 30px #12223d33;font-size:14px;line-height:1.7}.term:focus-visible{outline:2px solid var(--accent)}nav{overflow-x:auto}nav button{white-space:nowrap;padding-left:13px;padding-right:13px}