*{box-sizing:border-box}:root{--bg:#0d1124;--panel:rgba(255,255,255,.065);--line:rgba(255,255,255,.11);--text:#f8f9ff;--muted:#aeb5cf;--purple:#8d72ff;--mint:#2fd2ae;--coral:#ff7d68;--gold:#ffd36a;--blue:#57a8ff}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:"DM Sans",sans-serif}body{background:radial-gradient(circle at 10% 5%,rgba(118,84,230,.25),transparent 31%),radial-gradient(circle at 92% 90%,rgba(44,204,168,.14),transparent 29%),var(--bg)}button,input{font:inherit}[hidden]{display:none!important}.app-shell{width:100vw;height:100vh;height:100dvh;overflow:hidden;padding:clamp(12px,2vh,23px) clamp(14px,2.3vw,34px);display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:clamp(9px,1.45vh,15px);position:relative}.app-shell:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.26;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:48px 48px}.topbar,.workspace,.challenge{position:relative;z-index:1}.topbar{display:flex;align-items:end;justify-content:space-between;gap:24px}.eyebrow,.challenge-kicker,.diagram-kicker{display:block;text-transform:uppercase;letter-spacing:.14em;color:#c1b4ff;font-weight:700;font-size:10px}.topbar h1{font:800 clamp(25px,3.1vw,42px)/1.05 Manrope,sans-serif;letter-spacing:-.045em;margin:5px 0 0}.purpose{max-width:470px;color:var(--muted);font-size:clamp(12px,1.15vw,15px);line-height:1.5;margin:0;text-align:right}.panel{background:var(--panel);border:1px solid var(--line);border-radius:20px;box-shadow:0 18px 55px rgba(0,0,0,.2);backdrop-filter:blur(16px)}.workspace{display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr);gap:clamp(11px,1.4vw,17px);min-height:0}.controls{padding:clamp(14px,2vh,21px);display:flex;flex-direction:column;justify-content:space-between;min-height:0}.control-group{display:grid;gap:5px}.label-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.label-row label,.group-label{font-weight:700;font-size:12px}.label-row output{font-weight:800;color:var(--mint);font-size:12px;background:rgba(47,210,174,.09);padding:3px 7px;border-radius:7px}.range-hint{font-size:9px;color:#78819f;text-align:right;margin-top:-5px}input[type=range]{width:100%;height:24px;margin:0;accent-color:var(--purple);cursor:pointer}.preset-group{display:grid;gap:8px}.preset-row{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;background:rgba(0,0,0,.15);padding:4px;border-radius:11px}.preset-row button,.reset-button,.challenge-actions button{border:0;cursor:pointer}.preset-row button{color:var(--muted);background:transparent;border-radius:8px;padding:8px 3px;font-size:10px;font-weight:650}.preset-row button:hover{background:rgba(255,255,255,.07);color:#fff}.pair-toggle{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:650;cursor:pointer}.pair-toggle input{position:absolute;opacity:0}.toggle-ui{width:34px;height:20px;border-radius:99px;background:#4a516a;position:relative;transition:.2s}.toggle-ui:after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:#fff;left:3px;top:3px;transition:.2s}.pair-toggle input:checked+.toggle-ui{background:var(--coral)}.pair-toggle input:checked+.toggle-ui:after{transform:translateX(14px)}.reset-button{border:1px solid var(--line);background:rgba(255,255,255,.045);color:var(--muted);border-radius:10px;padding:8px;font-size:10px}.reset-button:hover{color:#fff;background:rgba(255,255,255,.09)}button:focus-visible,input:focus-visible{outline:3px solid rgba(255,211,106,.75);outline-offset:2px}.visual{padding:clamp(12px,1.8vh,19px);display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:clamp(7px,1.1vh,11px);min-width:0;min-height:0}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.metric{border:1px solid var(--line);background:rgba(0,0,0,.14);border-radius:13px;padding:8px 11px;min-width:0}.metric span,.metric small{display:block;color:var(--muted);font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metric strong{display:block;font:800 clamp(16px,1.9vw,25px) Manrope,sans-serif;letter-spacing:-.04em;margin:2px 0}.volume strong{color:var(--mint)}.area strong{color:var(--coral)}.edges strong{color:var(--gold)}.diagrams{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:9px;min-height:0}.diagram-card{background:rgba(4,7,18,.31);border:1px solid rgba(255,255,255,.075);border-radius:15px;padding:10px 12px;display:grid;grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;overflow:hidden}.diagram-heading{display:flex;align-items:start;justify-content:space-between;gap:8px}.diagram-heading h2{font:700 12px Manrope,sans-serif;margin:2px 0}.dimension-chip,.face-count{font-size:8px;color:var(--muted);border:1px solid var(--line);padding:4px 7px;border-radius:99px;white-space:nowrap}.diagram-card svg{width:100%;height:100%;min-height:120px;overflow:visible}.face{stroke:rgba(255,255,255,.65);stroke-width:2;vector-effect:non-scaling-stroke;transition:fill .2s}.face-label{fill:#fff;font:700 17px DM Sans,sans-serif;paint-order:stroke;stroke:rgba(13,17,36,.75);stroke-width:4;stroke-linejoin:round}.dimension-line{stroke:#d7ddf3;stroke-width:1.5;stroke-dasharray:5 5;vector-effect:non-scaling-stroke}.dimension-text{fill:#d7ddf3;font:700 15px DM Sans,sans-serif}.net-face{stroke:#f5f6ff;stroke-width:2;vector-effect:non-scaling-stroke}.net-label{fill:#fff;font:700 14px DM Sans,sans-serif;text-anchor:middle;dominant-baseline:middle;paint-order:stroke;stroke:rgba(13,17,36,.75);stroke-width:4}.pair-a-fill{fill:rgba(47,210,174,.62)}.pair-b-fill{fill:rgba(255,125,104,.62)}.pair-c-fill{fill:rgba(87,168,255,.62)}.pairs-off .pair-a-fill,.pairs-off .pair-b-fill,.pairs-off .pair-c-fill{fill:rgba(141,114,255,.42)}.face-equation{border:1px solid rgba(47,210,174,.16);background:linear-gradient(90deg,rgba(47,210,174,.08),rgba(141,114,255,.07));border-radius:12px;padding:7px 11px;display:flex;align-items:center;justify-content:space-between;gap:12px}.equation-label{font-size:9px;color:var(--muted)}.face-equation strong{font-size:11px;white-space:nowrap}.face-equation b{color:#8e97b4;margin:0 4px}.swatch{display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:3px}.pair-a{background:var(--mint)}.pair-b{background:var(--coral)}.pair-c{background:var(--blue)}.challenge{padding:10px 15px;display:grid;grid-template-columns:1.45fr .55fr auto 1.25fr;align-items:center;gap:14px}.challenge-copy h2{font:700 12px Manrope,sans-serif;margin:3px 0 0}.challenge-status span{display:block;color:var(--muted);font-size:8px}.challenge-status strong{font:800 14px Manrope,sans-serif;color:var(--mint)}.challenge-actions{display:flex;gap:6px}.challenge-actions button{border-radius:9px;background:linear-gradient(135deg,var(--purple),#6e57df);color:#fff;font-weight:700;padding:7px 11px;font-size:9px;white-space:nowrap}.challenge-actions .secondary{background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--muted)}.feedback{font-size:9px;line-height:1.35;color:var(--muted)}.feedback.success{color:#74e8ca}.feedback.close{color:var(--gold)}@media(max-height:700px) and (min-width:701px){.app-shell{padding-top:9px;padding-bottom:9px;gap:7px}.topbar h1{font-size:25px}.purpose{font-size:11px}.controls{padding:11px}.control-group{gap:2px}.range-hint{display:none}.preset-row button{padding:5px 2px}.visual{padding:10px;gap:6px}.metric{padding:5px 9px}.diagram-card{padding:7px 9px}.face-equation{padding:5px 9px}.challenge{padding:6px 12px}.challenge-kicker{display:none}}@media(max-width:700px){.app-shell{padding:8px;gap:7px}.topbar{align-items:start}.purpose{display:none}.topbar h1{font-size:22px}.eyebrow{font-size:8px}.workspace{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:7px}.controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 8px;padding:8px 10px}.control-group{gap:0}.label-row{display:block}.label-row label,.group-label{font-size:8px}.label-row output{display:block;padding:0;background:none;font-size:8px}.range-hint{display:none}input[type=range]{height:18px}.preset-group{grid-column:span 2;gap:3px}.preset-row{padding:2px}.preset-row button{padding:4px 2px;font-size:7px}.pair-toggle{font-size:8px;align-self:end}.toggle-ui{width:27px;height:16px}.toggle-ui:after{width:10px;height:10px}.pair-toggle input:checked+.toggle-ui:after{transform:translateX(11px)}.reset-button{display:none}.visual{padding:8px;gap:5px}.metric{padding:5px 6px}.metric span,.metric small{font-size:6px}.metric strong{font-size:13px}.diagrams{gap:5px}.diagram-card{padding:6px}.diagram-heading h2{font-size:8px}.diagram-kicker{font-size:6px}.dimension-chip,.face-count{font-size:6px;padding:2px 4px}.diagram-card svg{min-height:90px}.face-equation{padding:4px 6px}.equation-label{display:none}.face-equation strong{font-size:7px;margin:auto}.challenge{grid-template-columns:1fr auto;gap:5px 8px;padding:6px 8px}.challenge-copy h2{font-size:8px}.challenge-kicker{font-size:6px}.challenge-status{display:none}.challenge-actions button{font-size:7px;padding:5px 7px}.feedback{grid-column:1/-1;text-align:center;font-size:7px}}@media(max-width:430px){.app-shell{padding:7px}.diagrams{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)}.prism-card .dimension-chip{display:none}.metric small{display:none}.face-equation b{margin:0 2px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}