:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f5f5f5;background:#111;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:#111;min-height:100svh;margin:0}.brand-credit{z-index:1;color:#f5f5f59e;letter-spacing:.02em;text-align:center;pointer-events:none;-webkit-user-select:none;user-select:none;margin:0;font-size:clamp(.68rem,1.9vw,.78rem);font-weight:600;line-height:1;position:fixed;bottom:.85rem;left:50%;transform:translate(-50%)}.brand-crack{color:#86efac}.brand-it{color:#f5f5f5}button{font:inherit}.app{flex-direction:column;justify-content:flex-start;gap:clamp(.35rem,1.25svh,.7rem);width:min(100%,37rem);min-height:100svh;margin:0 auto;padding:clamp(.7rem,2.6svh,1.35rem) .8rem 1.8rem;display:flex}.intro{margin-bottom:clamp(.35rem,1.35svh,.85rem);display:grid}.message{margin:0}.section-label{color:#8f8f8f;letter-spacing:.13em;text-transform:uppercase;margin:0 0 -.2rem;font-size:clamp(.72rem,2.25vw,.82rem);font-weight:700;line-height:1.2;transform:none}h1{color:#f5f5f5c2;letter-spacing:-.032em;margin:0;font-size:clamp(1.18rem,5.35vw,2.25rem);font-weight:680;line-height:1}.accent-green{color:#86efacd1}.formula-card{width:100%;padding:.05rem 0 0}.display-formula{white-space:nowrap;justify-content:center;align-items:center;gap:.52rem;width:100%;margin-bottom:clamp(.32rem,1.15svh,.58rem);font-size:clamp(1.75rem,9vw,3.35rem);font-weight:750;line-height:1;transition:color .18s,text-shadow .18s;display:flex}.fixed{-webkit-user-select:none;user-select:none}.equals{padding:0 .12rem}.fraction{text-align:center;grid-template-rows:auto auto;align-items:center;min-width:2.7em;line-height:.95;display:inline-grid}.numerator,.denominator{padding:.08em .28em;display:block}.numerator{border-bottom:.075em solid}.triangle-stage{justify-items:center;padding:0 0 clamp(.12rem,.65svh,.28rem);display:grid}.formula-triangle{aspect-ratio:280/230;width:min(74vw,16.4rem);transition:filter .22s,transform .22s;position:relative}.formula-triangle.complete{filter:drop-shadow(0 0 1.15rem #86efac47);animation:.9s ease-out both triangle-success}.triangle-lines{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.triangle-lines path,.triangle-lines line{fill:#1d1d1d3d;stroke:#f5f5f5;stroke-width:7px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.triangle-lines line{fill:none;stroke-width:6px}.slot,.symbol-home{color:#fff;touch-action:none;background:#1d1d1d;border:1px solid #555;border-radius:.7rem;justify-content:center;align-items:center;min-width:3.1rem;min-height:3.1rem;line-height:1;display:inline-flex}.slot{padding:.25rem .45rem}.triangle-slot{background:#1d1d1d42;border:1px dashed #f5f5f547;width:clamp(4.25rem,19.5vw,5.55rem);min-width:0;height:clamp(3.35rem,14vw,4.15rem);min-height:0;transition:border-color .18s,box-shadow .18s,background .18s,opacity .22s,filter .18s;position:absolute;transform:translate(-50%,-50%)}.triangle-slot--top{top:33%;left:50%}.triangle-slot--bottom-left{top:77%;left:36%}.triangle-slot--bottom-right{top:77%;left:64%}.triangle-slot.drop-ready{outline-offset:.2rem;background:#252525;border-color:#f5f5f5;outline:2px solid #f5f5f5}.triangle-slot.locked{background:#203126;border-style:solid;border-color:#86efac;box-shadow:0 0 .85rem #86efac33}.formula-card.complete .triangle-slot.locked{box-shadow:none;background:0 0;border-color:#0000}.triangle-slot.move-correct{animation:.42s ease-out move-correct-glow}.triangle-slot.move-incorrect,.symbol-home.move-incorrect{animation:.42s ease-out move-incorrect-glow}.symbol-bank{flex-wrap:wrap;justify-content:center;gap:clamp(.55rem,3.5vw,.9rem);max-height:4.2rem;padding-top:clamp(.2rem,1svh,.35rem);transition:max-height .22s,opacity .22s,padding-top .22s;display:flex;overflow:hidden}.formula-card.complete .symbol-bank{opacity:0;pointer-events:none;visibility:hidden}.formula-discovery{justify-items:center;gap:clamp(.32rem,.95svh,.5rem);min-height:0;padding-top:clamp(.05rem,.35svh,.18rem);display:grid}.reveal-instruction{color:#fff8e8;letter-spacing:.012em;text-align:center;text-shadow:0 0 .55rem #fff4d647;background:linear-gradient(90deg,#ffffff0d,#fbbf2424,#ffffff0d);border:1px solid #ffe8b26b;border-radius:999px;margin:0;padding:.46rem clamp(.8rem,4vw,1.2rem);font-size:clamp(1.25rem,4.7vw,1.62rem);font-weight:900;line-height:1.18;animation:1.9s ease-in-out infinite instruction-pulse;box-shadow:0 0 .9rem #fbbf2421,inset 0 0 .55rem #ffffff12}.reveal-instruction[hidden]{display:none}.revealed-formulas-layout{grid-template-columns:1fr;place-items:center;column-gap:clamp(.48rem,2.2vw,.8rem);width:100%;margin-top:clamp(.18rem,.55svh,.32rem);transition:column-gap .22s;display:grid}.formula-card.complete .revealed-formulas-layout{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);justify-items:stretch}.formula-card.complete .revealed-formulas{grid-column:2}.revealed-formulas{grid-column:1;justify-items:center;gap:clamp(.42rem,1.2svh,.65rem);display:grid}.revealed-formula{color:#f5f5f5;text-align:center;white-space:nowrap;opacity:0;justify-content:center;align-items:center;gap:.52rem;margin:0;font-size:clamp(1.75rem,9vw,3.35rem);font-weight:750;line-height:1;animation:.24s ease-out forwards formula-reveal;display:flex;transform:translateY(-.2rem)scale(.98)}.revealed-formula__fraction{min-width:2.45em}.formula-takeaway{color:#f5f5f5c7;text-align:center;text-wrap:balance;opacity:0;background:#86efac0e;border:1px solid #86efac2e;border-radius:.9rem;width:min(100%,28rem);margin:clamp(.1rem,.55svh,.32rem) auto 0;padding:clamp(.62rem,2.3vw,.8rem) clamp(.82rem,3.5vw,1.05rem);font-size:clamp(.92rem,2.85vw,1.03rem);font-weight:600;line-height:1.35;animation:.22s ease-out forwards formula-reveal;transform:translateY(-.12rem);box-shadow:inset 0 0 .75rem #ffffff06}.formula-takeaway[hidden]{display:none}.formula-takeaway strong{color:#f5f5f5f0;margin-bottom:.12rem;font-weight:800;display:block}.formula-takeaway span{color:#86efacdb;font-weight:760}.formula-token,.revealed-formula__token{transition:color .18s,text-shadow .18s,transform .18s}.formula-token--glow,.revealed-formula__token--glow{color:#86efac;animation:1.05s ease-in-out infinite formula-token-green-pulse}.symbol-home{min-width:clamp(5rem,26vw,6.4rem);min-height:3.25rem;padding:.25rem .7rem}.symbol-home:empty{opacity:.28}.letter{color:#fff;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;justify-content:center;align-items:center;min-width:100%;min-height:100%;font-size:clamp(1.24rem,5vw,1.65rem);font-weight:800;transition:color .18s,text-shadow .18s,transform .18s,opacity .18s;display:inline-flex}.letter.dragging{z-index:10;width:var(--drag-width,clamp(5rem, 26vw, 6.4rem));height:var(--drag-height,3.25rem);pointer-events:none;cursor:grabbing;transform-origin:50%;opacity:.95;background:#1d1d1d;border:1px solid #555;border-radius:.7rem;min-width:0;min-height:0;position:fixed;transform:scale(1.03);box-shadow:0 .7rem 1.25rem #00000052}.letter.locked{cursor:pointer}.letter.returning{transition:left .18s,top .18s,transform .18s,opacity .18s}.controls{grid-column:1;place-self:center;justify-items:center;gap:.45rem;transition:justify-self .22s;display:grid}.formula-card.complete .controls{grid-column:3;justify-self:start;justify-items:start}.controls button{color:#111;cursor:pointer;background:#f5f5f5;border:1px solid #f5f5f5;border-radius:.8rem;min-height:3.25rem}.controls .secondary{color:#d4d4d4;background:0 0;border-color:#555}.controls .reset{letter-spacing:.03em;text-transform:uppercase;border-radius:.8rem;width:auto;min-width:clamp(5rem,26vw,6.4rem);min-height:3.25rem;padding:.25rem .7rem;font-size:clamp(1rem,3.2vw,1.12rem);font-weight:700;transition:min-width .22s,min-height .22s,padding .22s,border-radius .22s,font-size .22s}.formula-card.complete .controls .reset{border-radius:999px;min-width:max-content;min-height:2.05rem;padding:0 .68rem;font-size:.78rem}.feedback-area{gap:.15rem;min-height:1.7rem;max-height:3.6rem;transition:opacity .22s,max-height .22s,min-height .22s,transform .22s;display:grid;overflow:hidden}.feedback-area.is-dismissed{opacity:0;pointer-events:none;gap:0;min-height:0;max-height:0;transform:translateY(-.25rem)}.message{color:#d4d4d4;min-height:1.7rem;font-size:clamp(1.05rem,3.2vw,1.12rem);font-weight:700;line-height:1.35}#message:empty{min-height:0}.helper-message[hidden]{display:none}.message-main{display:block}.message.correct{color:#86efac}.message.incorrect{color:#fca5a5}@keyframes move-correct-glow{0%{background:#1d1d1d;border-color:#555;box-shadow:0 0 #86efac00}35%{background:#203126;border-color:#86efac;box-shadow:0 0 .7rem #86efac52}to{background:#203126;border-color:#86efac;box-shadow:0 0 .85rem #86efac33}}@keyframes move-incorrect-glow{0%{background:#1d1d1d;border-color:#555;box-shadow:0 0 #fca5a500}35%{background:#332020;border-color:#fca5a5;box-shadow:0 0 .7rem #fca5a547}to{background:#1d1d1d;border-color:#555;box-shadow:0 0 #fca5a500}}@keyframes formula-reveal{to{opacity:1;transform:translateY(0)scale(1)}}@keyframes instruction-pulse{0%,to{color:#fff8e8;text-shadow:0 0 .45rem #fff4d63d,0 0 #fbbf2400;border-color:#ffe8b261;transform:scale(1);box-shadow:0 0 .85rem #fbbf2421,inset 0 0 .55rem #ffffff12}50%{color:#fff1c2;text-shadow:0 0 .9rem #fff4d67a,0 0 1.45rem #fbbf2433;border-color:#ffd67dbd;transform:scale(1.018);box-shadow:0 0 1.15rem #fbbf2447,0 0 1.9rem #ffd67d1f,inset 0 0 .75rem #ffffff1a}}@keyframes formula-token-green-pulse{0%,to{text-shadow:0 0 .35rem #86efac6b;transform:scale(1)}50%{text-shadow:0 0 .95rem #86efacdb,0 0 1.45rem #86efac57;transform:scale(1.035)}}@keyframes triangle-success{0%{transform:scale(1)}45%{transform:scale(1.025)}to{transform:scale(1)}}@media (width<=480px){.formula-card.complete .formula-takeaway{margin-top:0}}@media (width<=380px){.app{gap:.45rem;padding-inline:.6rem}.formula-card{padding-top:.05rem}.triangle-slot{width:4.35rem}.revealed-formula{font-size:clamp(1.55rem,8vw,2.6rem)}}