@font-face{font-family:Instrument Serif;src:url(/fonts/instrument-serif-400.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Plex Sans;src:url(/fonts/ibm-plex-sans-var.woff2)format("woff2");font-weight:100 700;font-style:normal;font-display:swap}@font-face{font-family:Plex Mono;src:url(/fonts/ibm-plex-mono-400.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Plex Mono;src:url(/fonts/ibm-plex-mono-500.woff2)format("woff2");font-weight:500;font-style:normal;font-display:swap}:root{--ink:#090b0e;--ink-2:#10141a;--ink-3:#171d25;--ink-4:#1f2731;--rule:#232b36;--rule-bright:#36414f;--fg:#e8eaed;--fg-dim:#7e8896;--fg-faint:#4a5361;--swiss:#ff4d2e;--swiss-dim:#8a2c1c;--good:#62e2a0;--warn:#ffc24b;--miss:#ff6b6b;--display:"Instrument Serif", "Iowan Old Style", Georgia, serif;--sans:"Plex Sans", ui-sans-serif, system-ui, sans-serif;--mono:"Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;--u:4px;--gutter:20px;--ease:cubic-bezier(.2, .7, .2, 1);--fast:.16s;--med:.26s}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{background:var(--ink);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;overscroll-behavior-y:none;background-image:linear-gradient(var(--ink-2) 1px, transparent 1px), linear-gradient(90deg, var(--ink-2) 1px, transparent 1px);background-position:-1px -1px;background-size:100% 80px,80px 100%;font-size:15px;line-height:1.5}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none}input,textarea,select{font:inherit;color:inherit;background:0 0;border:none}::selection{background:var(--swiss);color:var(--ink)}#root{min-height:100dvh}.app{border-inline:1px solid var(--rule);max-width:560px;min-height:100dvh;padding-top:env(safe-area-inset-top);flex-direction:column;margin-inline:auto;display:flex}.main{flex-direction:column;flex:1;min-height:0;display:flex}.eyebrow{font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--fg-dim);font-size:10px;font-weight:500}.eyebrow--swiss{color:var(--swiss)}.tick{font-family:var(--mono);letter-spacing:.1em;color:var(--fg-faint);font-variant-numeric:tabular-nums;font-size:10px}.rule{background:var(--rule);border:0;height:1px}.head{justify-content:space-between;align-items:baseline;gap:var(--gutter);padding:calc(var(--u) * 4) var(--gutter) calc(var(--u) * 3);border-bottom:1px solid var(--rule);background:var(--ink);display:flex}.head__mark{font-family:var(--display);letter-spacing:-.01em;font-size:26px;line-height:1}.head__mark:after{content:".";color:var(--swiss)}.head__meta{gap:calc(var(--u) * 3);align-items:baseline;display:flex}.nav{border-top:1px solid var(--rule);background:var(--ink);padding-bottom:env(safe-area-inset-bottom);grid-auto-columns:1fr;grid-auto-flow:column;display:grid}.nav__item{padding:calc(var(--u) * 4) var(--u) calc(var(--u) * 4);font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--fg-faint);border-right:1px solid var(--rule);transition:color var(--fast) var(--ease), background var(--fast) var(--ease);font-size:10px;position:relative}.nav__item:last-child{border-right:0}.nav__item[aria-current=true]{color:var(--fg);background:var(--ink-2)}.nav__item[aria-current=true]:before{content:"";background:var(--swiss);height:2px;position:absolute;inset:-1px 0 auto}.nav__badge{color:var(--swiss);font-variant-numeric:tabular-nums;margin-left:6px;display:inline-block}.card{min-height:0;animation:card-in var(--med) var(--ease) both;flex-direction:column;flex:1;display:flex;position:relative}@keyframes card-in{0%{opacity:0;transform:translateY(8px)}}.card__top{padding:calc(var(--u) * 4) var(--gutter) calc(var(--u) * 2);justify-content:space-between;align-items:baseline;display:flex}.card__body{padding:clamp(24px, 8vh, 88px) var(--gutter) calc(var(--u) * 6);flex-direction:column;flex:1;justify-content:flex-start;min-height:0;display:flex;overflow-y:auto}.prompt{font-family:var(--display);letter-spacing:-.02em;text-wrap:balance;animation:rise var(--med) var(--ease) both;font-size:clamp(2.5rem,14vw,4.25rem);line-height:.98;animation-delay:40ms}.prompt--en{font-family:var(--sans);letter-spacing:-.02em;color:var(--fg);font-size:clamp(1.75rem,9vw,2.75rem);font-weight:400;line-height:1.1}.prompt--gsw{color:var(--swiss)}.prompt__article{color:var(--fg-faint)}@keyframes rise{0%{opacity:0;transform:translateY(12px)}}.respell{font-family:var(--mono);letter-spacing:.14em;color:var(--swiss-dim);margin-top:calc(var(--u) * 3);animation:rise var(--med) var(--ease) both;font-size:12px;animation-delay:90ms}.gloss{color:var(--fg-dim);margin-top:calc(var(--u) * 4);animation:rise var(--med) var(--ease) both;font-size:15px;animation-delay:.12s}.reveal{transition:grid-template-rows var(--med) var(--ease);grid-template-rows:0fr;display:grid}.reveal[data-open=true]{grid-template-rows:1fr}.reveal__inner{min-height:0;overflow:hidden}.answer{border-top:1px solid var(--rule);margin-top:calc(var(--u) * 6);padding-top:calc(var(--u) * 5)}.answer__value{font-family:var(--display);letter-spacing:-.015em;font-size:clamp(1.75rem,8vw,2.5rem);line-height:1.05}.answer__value--gsw{color:var(--swiss)}.answer__value--good{color:var(--good)}.answer__value--miss{color:var(--miss)}.answer__note{color:var(--fg-dim);margin-top:calc(var(--u) * 3);font-size:14px;line-height:1.55}.answer__note em{color:var(--fg);font-style:normal}.laws{gap:var(--u);margin-top:calc(var(--u) * 4);flex-wrap:wrap;display:flex}.law{font-family:var(--mono);letter-spacing:.04em;color:var(--swiss);border:1px solid var(--swiss-dim);transition:background var(--fast) var(--ease);padding:3px 8px;font-size:11px}.law:active{background:var(--swiss-dim)}.law__explain{color:var(--fg-dim);margin-top:calc(var(--u) * 3);border-left:2px solid var(--swiss-dim);padding-left:calc(var(--u) * 3);font-size:13px;line-height:1.6}.choices{background:var(--rule);border:1px solid var(--rule);margin-top:calc(var(--u) * 6);animation:rise var(--med) var(--ease) both;gap:1px;animation-delay:.15s;display:grid}.choice{background:var(--ink-2);padding:calc(var(--u) * 4) calc(var(--u) * 4);text-align:left;font-family:var(--display);transition:background var(--fast) var(--ease), color var(--fast) var(--ease);align-items:center;gap:calc(var(--u) * 3);font-size:22px;line-height:1.2;display:flex}.choice__key{font-family:var(--mono);color:var(--fg-faint);letter-spacing:.1em;min-width:14px;font-size:10px}.choice:active{background:var(--ink-3)}.choice[data-state=correct]{background:color-mix(in srgb, var(--good) 14%, var(--ink-2));color:var(--good)}.choice[data-state=correct] .choice__key{color:var(--good)}.choice[data-state=wrong]{background:color-mix(in srgb, var(--miss) 12%, var(--ink-2));color:var(--miss)}.choice[data-state=muted]{opacity:.35}.type-in{align-items:baseline;gap:calc(var(--u) * 2);border-bottom:1px solid var(--rule-bright);margin-top:calc(var(--u) * 6);padding-bottom:calc(var(--u) * 2);animation:rise var(--med) var(--ease) both;animation-delay:.15s;display:flex}.type-in__caret{font-family:var(--mono);color:var(--swiss);font-size:12px}.type-in input{font-family:var(--display);outline:none;flex:1;min-width:0;font-size:26px}.type-in input::placeholder{color:var(--fg-faint);font-family:var(--sans);font-size:16px}.umlauts{margin-top:calc(var(--u) * 3);background:var(--rule);border:1px solid var(--rule);gap:1px;width:fit-content;display:flex}.umlaut{background:var(--ink-2);font-family:var(--display);min-width:40px;padding:calc(var(--u) * 2) 0;transition:background var(--fast) var(--ease);font-size:18px}.umlaut:active{background:var(--ink-4)}.audio{align-items:center;gap:calc(var(--u) * 2);font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);border:1px solid var(--rule-bright);padding:calc(var(--u) * 2) calc(var(--u) * 3);transition:color var(--fast) var(--ease), border-color var(--fast) var(--ease);font-size:10px;display:inline-flex}.audio[data-playing=true]{color:var(--good);border-color:var(--good)}.audio:disabled{opacity:.4}.audio__wave{align-items:flex-end;gap:2px;height:11px;display:flex}.audio__wave i{width:2px;height:4px;transition:height var(--fast) var(--ease);background:currentColor}.audio[data-playing=true] .audio__wave i{animation:wave .62s var(--ease) infinite alternate}.audio[data-playing=true] .audio__wave i:nth-child(2){animation-delay:.11s}.audio[data-playing=true] .audio__wave i:nth-child(3){animation-delay:.22s}@keyframes wave{to{height:11px}}.audio-hero{justify-content:center;align-items:center;gap:calc(var(--u) * 4);border:1px solid var(--rule-bright);padding:calc(var(--u) * 10) calc(var(--u) * 4);font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--fg-dim);transition:border-color var(--fast) var(--ease), color var(--fast) var(--ease);font-size:11px;display:flex}.audio-hero:active{border-color:var(--good);color:var(--good)}.grade{background:var(--rule);border-top:1px solid var(--rule);grid-template-columns:repeat(4,1fr);gap:1px;display:grid}.grade__btn{background:var(--ink-2);padding:calc(var(--u) * 4) var(--u) calc(var(--u) * 3);transition:background var(--fast) var(--ease);flex-direction:column;align-items:center;gap:3px;display:flex}.grade__btn:active{background:var(--ink-3)}.grade__label{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;font-size:10px}.grade__when{font-family:var(--mono);color:var(--fg-faint);font-variant-numeric:tabular-nums;font-size:10px}.grade__btn[data-tone=again] .grade__label{color:var(--miss)}.grade__btn[data-tone=hard] .grade__label{color:var(--warn)}.grade__btn[data-tone=good] .grade__label{color:var(--good)}.grade__btn[data-tone=easy] .grade__label{color:var(--fg-dim)}.action{border-top:1px solid var(--rule);background:var(--ink-2);width:100%;padding:calc(var(--u) * 5);font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;transition:background var(--fast) var(--ease);font-size:11px}.action:active{background:var(--ink-3)}.action--primary{background:var(--swiss);color:var(--ink);font-weight:500}.action--primary:active{background:#e63f22}.scroll{flex:1;min-height:0;overflow-y:auto}.section{padding:calc(var(--u) * 6) var(--gutter);border-bottom:1px solid var(--rule)}.section__head{margin-bottom:calc(var(--u) * 4);justify-content:space-between;align-items:baseline;display:flex}.figures{background:var(--rule);border:1px solid var(--rule);grid-template-columns:repeat(3,1fr);gap:1px;display:grid}.figure{background:var(--ink-2);padding:calc(var(--u) * 4) calc(var(--u) * 3)}.figure__n{font-family:var(--display);font-variant-numeric:tabular-nums;font-size:36px;line-height:1}.figure__n--due{color:var(--swiss)}.figure__n--good{color:var(--good)}.figure__label{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--fg-faint);margin-top:calc(var(--u) * 2);font-size:9px}.bar{background:var(--ink-3);height:6px;margin-top:calc(var(--u) * 4);display:flex;overflow:hidden}.bar span{transition:width var(--med) var(--ease)}.bar__key{gap:calc(var(--u) * 4);margin-top:calc(var(--u) * 3);flex-wrap:wrap;display:flex}.bar__key i{width:8px;height:8px;margin-right:6px;display:inline-block}.bar__key span{font-family:var(--mono);letter-spacing:.08em;color:var(--fg-dim);text-transform:uppercase;align-items:center;font-size:10px;display:flex}.weak{background:var(--rule);border:1px solid var(--rule);flex-direction:column;gap:1px;display:flex}.weak__row{background:var(--ink-2);padding:calc(var(--u) * 3) calc(var(--u) * 4);justify-content:space-between;align-items:baseline;gap:calc(var(--u) * 3);display:flex}.weak__name{text-overflow:ellipsis;white-space:nowrap;font-size:14px;overflow:hidden}.weak__rate{font-family:var(--mono);color:var(--miss);font-variant-numeric:tabular-nums;flex-shrink:0;font-size:12px}.field{padding:calc(var(--u) * 4) 0;border-bottom:1px solid var(--rule);display:block}.field:last-child{border-bottom:0}.field__label{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);margin-bottom:calc(var(--u) * 2);font-size:10px;display:block}.field__hint{color:var(--fg-faint);margin-top:calc(var(--u) * 2);font-size:13px;line-height:1.6}.input{background:var(--ink-2);border:1px solid var(--rule-bright);width:100%;padding:calc(var(--u) * 3);font-family:var(--mono);transition:border-color var(--fast) var(--ease);outline:none;font-size:13px}.input:focus{border-color:var(--swiss)}.seg{background:var(--rule);border:1px solid var(--rule);grid-auto-columns:1fr;grid-auto-flow:column;gap:1px;display:grid}.seg button{background:var(--ink-2);padding:calc(var(--u) * 3) var(--u);font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-dim);transition:background var(--fast) var(--ease), color var(--fast) var(--ease);font-size:10px}.seg button[aria-pressed=true]{background:var(--ink-4);color:var(--fg)}.danger{color:var(--miss);border-color:var(--miss)}.done,.booting{padding:calc(var(--u) * 10) var(--gutter);animation:rise var(--med) var(--ease) both;flex-direction:column;flex:1;justify-content:center;display:flex}.done__big{font-family:var(--display);letter-spacing:-.02em;font-size:clamp(2.5rem,12vw,3.5rem);line-height:1}.done__sub{color:var(--fg-dim);margin-top:calc(var(--u) * 4);max-width:34ch;line-height:1.6}.rail{background:var(--ink-3);height:2px}.rail span{background:var(--swiss);height:100%;transition:width var(--med) var(--ease);display:block}.stack{flex-direction:column;display:flex}.gap-2{gap:calc(var(--u) * 2)}.gap-3{gap:calc(var(--u) * 3)}.gap-4{gap:calc(var(--u) * 4)}.gap-6{gap:calc(var(--u) * 6)}.row{align-items:center;display:flex}.between{justify-content:space-between}.dim{color:var(--fg-dim)}.faint{color:var(--fg-faint)}.swiss{color:var(--swiss)}.good{color:var(--good)}.mono{font-family:var(--mono)}.serif{font-family:var(--display)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important}}
