:root{--paper:#fbfdff;--grid:#d6e4f5;--margin-line:#f08a8a;--ink:#1d3fa6;--pencil:#20232a;--muted:#5b6475;--red-pen:#e02d26;--marker:#ffe24a;--marker-green:#9df2a8;--wrong-wash:#ffe3e0;--cell:24px;--font-ui:"Bricolage Grotesque", system-ui, sans-serif;--font-hand:"Kalam", "Comic Sans MS", cursive}*{box-sizing:border-box}body{min-height:100dvh;color:var(--pencil);font-family:var(--font-ui);background-color:var(--paper);background-image:linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);background-size:var(--cell) var(--cell);margin:0;line-height:1.4}.sheet{max-width:880px;min-height:100dvh;margin:0 auto;padding:32px 20px 64px 72px;position:relative;overflow-x:clip}button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.sheet:before{content:"";background:var(--margin-line);pointer-events:none;width:2px;position:absolute;top:0;bottom:0;left:48px}.topbar{justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:28px;display:flex}.topbar--quiz{grid-template-columns:1fr auto;grid-template-areas:"back back""title score";align-items:end;row-gap:8px;display:grid}.topbar--quiz .back{grid-area:back;justify-self:start}.topbar--quiz .title{grid-area:title}.topbar--quiz .score{grid-area:score}.title{letter-spacing:-.04em;font-variation-settings:"opsz" 96;margin:0;font-size:clamp(2.8rem,9vw,4.5rem);font-weight:800;line-height:.9}.score{font-family:var(--font-hand);color:var(--red-pen);flex-direction:column;align-items:center;margin:0;font-size:2.4rem;font-weight:700;line-height:1.05;display:inline-flex;transform:rotate(-4deg)}.score__den{border-top:3px solid;padding:0 6px}.back{min-height:44px;font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:999px;align-items:center;gap:4px;margin:0 0 0 -6px;padding:0 10px 0 4px;font-size:.95rem;font-weight:600;display:inline-flex}@media (hover:hover){.back:hover{color:var(--pencil);background:var(--marker)}}.back:focus-visible{outline:3px solid var(--ink);outline-offset:3px}.picker{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;display:grid}.pick{font:inherit;color:inherit;text-align:left;cursor:pointer;border:2px solid var(--pencil);box-shadow:4px 4px 0 var(--pencil);background:#ffffffb8;border-radius:14px;flex-direction:column;align-items:flex-start;gap:8px;padding:20px 22px 22px;transition:transform .12s,box-shadow .12s,background-color .12s;display:flex}@media (hover:hover){.pick:hover{background:var(--marker);box-shadow:6px 6px 0 var(--pencil);transform:translate(-2px,-2px)}}.pick:active{box-shadow:2px 2px 0 var(--pencil);transform:translate(2px,2px)}.pick:focus-visible{outline:3px solid var(--ink);outline-offset:4px}.pick__example{font-family:var(--font-hand);color:var(--ink);margin-bottom:6px;font-size:2.2rem}.pick__title{letter-spacing:-.02em;font-size:1.6rem;font-weight:800;line-height:1.1}.pick__desc{max-width:40ch;color:var(--muted)}.pick__score{font-family:var(--font-hand);color:var(--red-pen);margin-top:6px;font-size:1.2rem;font-weight:700}.task{margin-bottom:32px}.task__prompt{max-width:44ch;color:var(--muted);margin:0 0 8px;font-size:1.05rem}.task__expr{font-family:var(--font-hand);color:var(--ink);flex-wrap:wrap;align-items:center;gap:14px;font-size:clamp(2.4rem,8vw,3.4rem);display:flex}.task__unknown{font-family:var(--font-ui);color:var(--pencil);background:var(--marker);border-radius:4px 12px 6px 10px;padding:0 .3em;font-weight:800;transform:rotate(3deg)}.answers{gap:18px;display:grid}.card{width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer;border:2px solid var(--pencil);box-shadow:4px 4px 0 var(--pencil);background:#ffffffb8;border-radius:14px;align-items:flex-start;gap:16px;padding:16px;transition:transform .12s,box-shadow .12s,background-color .12s;display:flex;position:relative}@media (hover:hover){.card--idle:hover{background:var(--marker);box-shadow:6px 6px 0 var(--pencil);transform:translate(-2px,-2px)}}.card--idle:active{box-shadow:2px 2px 0 var(--pencil);transform:translate(2px,2px)}.card:focus-visible,.next:focus-visible{outline:3px solid var(--ink);outline-offset:4px}.card--correct{background:var(--marker-green);cursor:default}.card--wrong{background:var(--wrong-wash);border-color:var(--red-pen);box-shadow:4px 4px 0 var(--red-pen);cursor:default}.card--disabled{opacity:.4;box-shadow:none;cursor:default}.card__letter{border:2px solid;border-radius:50%;flex:none;place-items:center;width:36px;height:36px;margin-top:6px;font-size:1.15rem;font-weight:800;display:grid}.card__body{flex-direction:column;gap:8px;min-width:0;display:flex}.card__steps{font-family:var(--font-hand);color:var(--ink);flex-wrap:wrap;align-items:center;gap:10px;font-size:1.7rem;display:flex}.card__hint{font-family:var(--font-hand);color:var(--red-pen);font-size:1.15rem;line-height:1.3}.card__grade{background:var(--paper);width:58px;height:58px;font-family:var(--font-hand);color:var(--red-pen);border:3px solid var(--red-pen);border-radius:50% 46% 52% 44%;place-items:center;font-size:2.4rem;font-weight:700;line-height:1;animation:.28s cubic-bezier(.2,1.6,.4,1) both stamp;display:grid;position:absolute;top:-20px;right:-14px;transform:rotate(-12deg)}@keyframes stamp{0%{opacity:0;transform:rotate(-30deg)scale(2.2)}to{opacity:1;transform:rotate(-12deg)scale(1)}}.verdict{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 24px;margin-top:28px;display:flex}.verdict__quote{background:var(--pencil);color:#fff;border-radius:16px 16px 16px 4px;flex:320px;align-items:center;gap:12px;margin:0;padding:12px 12px 12px 16px;display:flex;position:relative;transform:rotate(-1deg)}.verdict--wrong .verdict__quote{background:var(--red-pen)}.verdict__words{flex:1;min-width:0;margin:0}.replay{width:44px;height:44px;color:var(--pencil);border:2px solid var(--pencil);cursor:pointer;background:#fff;border-radius:50%;flex:none;place-items:center;padding:0;transition:transform .12s;display:grid}@media (hover:hover){.replay:hover{transform:scale(1.08)}}.replay:active{transform:scale(.94)}.replay:focus-visible{outline-offset:3px;outline:3px solid #fff}.verdict__text{font-size:1.15rem;font-weight:600;line-height:1.3;display:block}.verdict__source{opacity:.8;flex-wrap:wrap;align-items:center;gap:2px 8px;margin-top:4px;font-size:.85rem;display:flex}.verdict__author{border-left:1px solid;padding-left:8px;font-weight:600}.next{font:inherit;color:var(--pencil);background:var(--marker);border:2px solid var(--pencil);box-shadow:4px 4px 0 var(--pencil);cursor:pointer;border-radius:999px;flex:none;padding:14px 28px;font-size:1.2rem;font-weight:800;transition:transform .12s,box-shadow .12s}@media (hover:hover){.next:hover{box-shadow:6px 6px 0 var(--pencil);transform:translate(-2px,-2px)}}.next:active{box-shadow:2px 2px 0 var(--pencil);transform:translate(2px,2px)}.step,.expression{align-items:center;gap:10px;display:inline-flex}.operator{font-family:var(--font-hand);padding:0 2px}.paren{font-family:var(--font-hand);font-size:1.15em;line-height:1}.paren--open{margin-right:-6px}.paren--close{margin-left:-6px}.fraction{vertical-align:middle;flex-direction:column;align-items:center;line-height:1.05;display:inline-flex}.fraction__num{padding:0 5px 1px}.fraction__den{border-top:2.5px solid;border-radius:1px;padding:1px 5px 0}.mixed{align-items:center;gap:4px;display:inline-flex}@media (width<=560px){.sheet{padding:8px 12px 32px 34px}.sheet:before{left:22px}.sheet--answered{padding-bottom:200px}.title{font-size:2rem}.score{font-size:1.8rem}.topbar{align-items:center;margin-bottom:14px}.topbar--quiz{grid-template-columns:auto 1fr auto;grid-template-areas:"back title score";column-gap:4px}.topbar--quiz .title{font-size:1.7rem;line-height:1}.back{justify-content:center;width:44px;margin-left:-10px;padding:0}.back__label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.task{margin-bottom:20px}.task__prompt{margin-bottom:4px;font-size:.92rem}.task__expr{gap:10px;font-size:2.2rem}.answers{gap:20px}.card{padding:16px 36px 12px 16px}.card__letter{background:var(--paper);width:28px;height:28px;margin:0;font-size:.95rem;position:absolute;top:-13px;left:-11px}.card__steps{row-gap:6px;font-size:1.4rem}.card__hint{font-size:1.05rem}.card__grade{width:46px;height:46px;font-size:1.9rem;top:-18px;right:-8px}.picker{gap:18px}.pick{padding:16px 18px 18px}.pick__example{font-size:1.9rem}.verdict{z-index:10;padding:12px 12px calc(12px + env(safe-area-inset-bottom));background:var(--paper);border-top:2px solid var(--pencil);flex-direction:column;align-items:stretch;gap:10px;margin:0;animation:.22s ease-out both bar-up;position:fixed;bottom:0;left:0;right:0}.verdict__quote{flex:none;padding:8px 8px 8px 14px;transform:none}.verdict__text{font-size:1rem}.verdict__source{margin-top:2px;font-size:.8rem}.next{width:100%;padding:13px 20px;font-size:1.1rem}}@keyframes bar-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.card,.next,.replay,.pick{transition:none}.card__grade,.verdict{animation:none}}