@import "https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,560;9..144,700&family=Source+Sans+3:wght@400;550;650&family=Source+Code+Pro:wght@450;600&display=swap";*{margin:0}body{min-width:320px}#root{min-height:100vh}:root{--bg:#e8efe9;--bg-accent:#d3e0d6;--ink:#1a2420;--ink-soft:#3d4f46;--muted:#5c7268;--panel:#f7faf7;--line:#b7c7bc;--teal:#0d6e6e;--teal-deep:#0a5555;--amber:#a65d16;--ok:#1b6b3a;--ok-bg:#d8f0e1;--bad:#9b1c1c;--bad-bg:#f8dede;--warn-bg:#f5ebd4;--radius:10px;--font:"Source Sans 3", "Segoe UI", sans-serif;--display:"Fraunces", Georgia, serif;--mono:"Source Code Pro", ui-monospace, monospace;--shadow:none}*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{font-family:var(--font);color:var(--ink);background:radial-gradient(ellipse 80% 50% at 10% -10%, #c5ddd0 0%, transparent 55%), radial-gradient(ellipse 60% 40% at 100% 0%, #cfe0d4 0%, transparent 50%), linear-gradient(180deg, var(--bg) 0%, #dfe8e1 100%);background-attachment:fixed;line-height:1.45}.app{max-width:1120px;margin:0 auto;padding:1.25rem 1.25rem 3rem}.top{border-bottom:2px solid var(--teal);flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.5rem;padding-bottom:1rem;display:flex}.brand{align-items:center;gap:.85rem;display:flex}.brand-mark{font-family:var(--display);letter-spacing:.04em;color:#f4faf7;background:var(--teal);border-radius:8px;place-items:center;width:3.1rem;height:3.1rem;font-size:1.65rem;font-weight:700;display:grid}.brand h1{font-family:var(--display);letter-spacing:-.02em;color:var(--teal-deep);margin:0;font-size:1.75rem;font-weight:700}.tagline{color:var(--muted);margin:.15rem 0 0;font-size:.95rem}.tabs{gap:.35rem;display:flex}.tabs button{font:inherit;border:1.5px solid var(--line);background:var(--panel);color:var(--ink-soft);cursor:pointer;border-radius:999px;padding:.45rem .9rem;font-weight:550}.tabs button.active{background:var(--teal);border-color:var(--teal);color:#fff}.layout{grid-template-columns:240px 1fr;align-items:start;gap:1.25rem;display:grid}@media (width<=800px){.layout{grid-template-columns:1fr}}.controls{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;position:sticky;top:.75rem}.controls h2{font-family:var(--display);color:var(--teal-deep);margin:0 0 .75rem;font-size:1.1rem}fieldset{border:1px solid var(--line);border-radius:8px;margin:0 0 .85rem;padding:.55rem .65rem .7rem}legend{text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:0 .25rem;font-size:.78rem;font-weight:650}.check{cursor:pointer;align-items:flex-start;gap:.45rem;margin:.28rem 0;font-size:.92rem;display:flex}.meta-note{color:var(--muted);margin:.75rem 0 0;font-size:.82rem}.workspace{flex-direction:column;gap:1rem;display:flex}.problem-card,.panel,.feedback,.hint,.solution,.history{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.1rem}.problem-meta{flex-wrap:wrap;gap:.4rem;margin-bottom:.65rem;display:flex}.pill{letter-spacing:.03em;text-transform:uppercase;color:var(--teal-deep);background:#d7ebe3;border-radius:999px;padding:.2rem .55rem;font-size:.75rem;font-weight:650}.pill.muted{color:var(--muted);background:#e4ebe6}.eq{font-family:var(--display);color:var(--ink);margin:0 0 .65rem;font-size:1.35rem;font-weight:560;line-height:1.35}.prompt{color:var(--ink-soft);margin:0 0 .5rem;font-size:1.02rem}.kline{font-family:var(--mono);margin:0;font-size:.95rem}.panel h3{font-family:var(--display);color:var(--teal-deep);margin:0 0 .35rem;font-size:1.15rem}.optional{font-family:var(--font);color:var(--muted);font-size:.8rem;font-weight:550}.help{color:var(--muted);margin:0 0 .65rem;font-size:.88rem}.text-input,.ice input{font-family:var(--mono);border:1.5px solid var(--line);width:100%;color:var(--ink);background:#fff;border-radius:6px;padding:.45rem .55rem;font-size:.92rem}.text-input:focus,.ice input:focus{outline:2px solid color-mix(in srgb, var(--teal) 45%, transparent);border-color:var(--teal)}.text-input.ok,.ice input.ok{border-color:var(--ok);background:var(--ok-bg)}.text-input.bad,.ice input.bad{border-color:var(--bad);background:var(--bad-bg)}.table-wrap{overflow-x:auto}.ice{border-collapse:collapse;width:100%;min-width:420px}.ice th,.ice td{border:1px solid var(--line);text-align:center;vertical-align:middle;padding:.35rem}.ice thead th{background:#e7f1eb;font-size:.92rem;font-weight:550}.ice .phase{color:var(--muted);font-size:.72rem;font-weight:400;display:block}.ice tbody th{font-family:var(--mono);background:#eef4f0;width:2.2rem}.answer-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.75rem;display:grid}.field{color:var(--ink-soft);flex-direction:column;gap:.3rem;font-size:.88rem;font-weight:550;display:flex}.actions{flex-wrap:wrap;gap:.5rem;display:flex}.btn{font:inherit;border:1.5px solid var(--line);color:var(--ink);cursor:pointer;background:#fff;border-radius:8px;padding:.55rem .95rem;font-weight:650}.btn:hover{border-color:var(--teal);color:var(--teal-deep)}.btn.primary{background:var(--teal);border-color:var(--teal);color:#fff}.btn.primary:hover{background:var(--teal-deep);color:#fff}.btn.wide{width:100%}.feedback.correct{background:var(--ok-bg);border-color:color-mix(in srgb, var(--ok) 40%, var(--line))}.feedback.partial{background:var(--warn-bg);border-color:color-mix(in srgb, var(--amber) 40%, var(--line))}.feedback.incorrect,.feedback.incomplete{background:var(--bad-bg);border-color:color-mix(in srgb, var(--bad) 35%, var(--line))}.feedback ul,.solution ul{margin:.4rem 0 0;padding-left:1.2rem}.hint{border-left:4px solid var(--amber)}.solution{border-left:4px solid var(--teal)}.solution h3{font-family:var(--display);color:var(--teal-deep);margin:0 0 .5rem}.history-bar{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.75rem;display:flex}.history-bar h2{font-family:var(--display);color:var(--teal-deep);margin:0}.history-list{flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.history-item{text-align:left;width:100%;font:inherit;border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:8px;flex-direction:column;gap:.35rem;padding:.75rem .9rem;display:flex}.history-item:hover{border-color:var(--teal)}.eq-mini{font-family:var(--display);font-size:1.05rem}.history-meta{color:var(--muted);flex-wrap:wrap;gap:.55rem;font-size:.82rem;display:flex}.badge{text-transform:uppercase;letter-spacing:.03em;color:var(--ink-soft);background:#e4ebe6;border-radius:4px;padding:.15rem .4rem;font-size:.7rem;font-weight:650}.badge.correct{background:var(--ok-bg);color:var(--ok)}.badge.partial{background:var(--warn-bg);color:var(--amber)}.badge.incorrect,.badge.incomplete{background:var(--bad-bg);color:var(--bad)}.history.empty{text-align:center;color:var(--muted);padding:2.5rem 1rem}.foot{border-top:1px solid var(--line);color:var(--muted);text-align:center;margin-top:2rem;padding-top:1rem;font-size:.82rem}sub,sup{font-size:.7em;line-height:0}
