@import"https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Space+Grotesk:wght@400;500;700&display=swap";:root{font-family:var(--font-body);line-height:1.5;font-weight:400;color:#321a16;background:radial-gradient(circle at 15% 16%,oklch(94% .06 85) 0%,transparent 26%),radial-gradient(circle at 82% 18%,oklch(92% .08 32) 0%,transparent 22%),linear-gradient(180deg,#fcf4e6,#fce6d9);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color-scheme:light;--font-display: "Cormorant Garamond", serif;--font-body: "Space Grotesk", sans-serif;--surface: oklch(98.2% .015 80 / .9);--surface-2: oklch(95.4% .028 60 / .92);--ink: oklch(25% .04 30);--ink-soft: oklch(42% .03 35);--paper-ink: oklch(95.5% .01 80);--accent: oklch(72% .14 78);--accent-strong: oklch(58% .18 42);--accent-deep: oklch(35% .1 28);--accent-ink: oklch(36% .08 34);--line: oklch(82% .04 58);--line-strong: oklch(70% .06 48);--study-surface: oklch(23% .045 20);--study-line: oklch(56% .08 34);--error: oklch(52% .18 28);--shadow-soft: 0 1.8rem 4rem color-mix(in oklch, var(--accent-deep) 16%, transparent);--ease-out: cubic-bezier(.22, 1, .36, 1)}*{box-sizing:border-box}html{min-width:320px;min-height:100%}body{margin:0;min-height:100vh}body:before{content:"";position:fixed;inset:0;background-image:linear-gradient(color-mix(in oklch,var(--accent-deep) 4%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklch,var(--accent-deep) 4%,transparent) 1px,transparent 1px);background-size:38px 38px;opacity:.25;pointer-events:none}a{color:inherit}button,input,textarea,select{font:inherit}#root{min-height:100vh}::selection{background:color-mix(in oklch,var(--accent) 32%,white);color:var(--ink)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.screen-shell{position:relative;height:100svh;overflow:clip;isolation:isolate}.screen-noise{position:fixed;inset:0;z-index:-1;background:radial-gradient(circle at 10% 12%,color-mix(in oklch,var(--accent) 24%,transparent) 0%,transparent 30%),radial-gradient(circle at 90% 18%,color-mix(in oklch,var(--accent-strong) 18%,transparent) 0%,transparent 24%),radial-gradient(circle at 50% 100%,color-mix(in oklch,var(--accent-deep) 10%,transparent) 0%,transparent 30%);filter:blur(12px);pointer-events:none}.welcome-screen,.leaderboard-screen{height:100svh;padding:clamp(.75rem,1.5vw,1.25rem);overflow:hidden}.welcome-screen{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(19rem,28rem);gap:clamp(.75rem,1.5vw,1.25rem);align-items:stretch}.welcome-copy,.login-stage,.leaderboard-panel,.study-finish{position:relative;overflow:clip;border:1px solid var(--line-strong);background:var(--surface);box-shadow:var(--shadow-soft)}.welcome-copy:before,.login-stage:before,.leaderboard-panel:before,.study-finish:before{content:"";position:absolute;inset:0;background-image:linear-gradient(color-mix(in oklch,var(--accent-ink) 5%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklch,var(--accent-ink) 5%,transparent) 1px,transparent 1px);background-size:22px 22px;opacity:.24;pointer-events:none}.welcome-copy,.login-stage,.leaderboard-panel{border-radius:2rem}.welcome-copy,.login-stage,.panel-heading,.auth-form,.leaderboard-meta,.leaderboard-copy,.study-progress,.flashcard-bottom,.title-block{display:grid}.welcome-copy{align-content:space-between;gap:.9rem;padding:clamp(1rem,2.2vw,1.6rem);background:linear-gradient(140deg,color-mix(in oklch,var(--surface) 90%,white),color-mix(in oklch,var(--surface-2) 94%,white))}.kicker,.welcome-lead,.status-text,.error-text,.study-progress span,.species-lock,.fact-strip span,.leaderboard-copy span,.account-chip span{margin:0}.kicker,.auth-form label,.fact-strip span{font-size:.76rem;letter-spacing:.24em;text-transform:uppercase;color:var(--accent-ink)}.welcome-copy h1,.panel-heading h2,.flashcard-bottom h2,.leaderboard-header h2,.study-finish h2{margin:0;font-family:var(--font-display);line-height:.92;letter-spacing:-.05em}.welcome-copy h1{max-width:7ch;font-size:clamp(3rem,7.4vw,6.8rem)}.welcome-lead{max-width:34ch;font-size:clamp(.95rem,1.15vw,1.06rem);line-height:1.55;color:var(--ink-soft)}.welcome-actions{display:flex;flex-wrap:wrap;gap:.8rem}.login-stage{align-content:start;gap:.75rem;padding:clamp(.9rem,1.8vw,1.2rem);min-height:0;overflow:auto;background:linear-gradient(180deg,color-mix(in oklch,var(--surface) 86%,white),color-mix(in oklch,var(--surface-2) 92%,white))}.panel-heading{gap:.25rem}.panel-heading h2{font-size:clamp(1.5rem,2.2vw,2.2rem)}.status-text{color:var(--ink-soft);line-height:1.45;font-size:.94rem}.error-text{color:var(--error);line-height:1.4;font-size:.92rem}.account-chip,.welcome-score,.leaderboard-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem .9rem;border-radius:1.2rem;border:1px solid color-mix(in oklch,var(--line) 78%,white);background:color-mix(in oklch,var(--surface) 76%,white)}.account-chip strong,.leaderboard-copy strong{color:var(--ink)}.welcome-score span{font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-ink)}.welcome-score strong{font-family:var(--font-display);font-size:clamp(1.7rem,3vw,2.8rem);line-height:.9;color:var(--ink)}.auth-form{gap:.6rem}.auth-form input{width:100%;min-height:2.9rem;padding:.8rem .95rem;border-radius:1rem;border:1px solid color-mix(in oklch,var(--line) 78%,white);background:color-mix(in oklch,var(--surface) 88%,white);color:var(--ink);outline:none;transition:border-color .16s ease,box-shadow .16s ease,transform .16s var(--ease-out)}.auth-form input:focus-visible{border-color:var(--accent-strong);box-shadow:0 0 0 3px color-mix(in oklch,var(--accent) 24%,transparent)}.study-screen{height:100svh;display:grid;grid-template-rows:auto 1fr;background:#281011;overflow:hidden}.study-topbar,.leaderboard-header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1rem;align-items:center}.study-topbar{position:relative;z-index:2;padding:.8rem 1rem;background:color-mix(in oklch,var(--study-surface) 90%,black);border-bottom:1px solid color-mix(in oklch,var(--study-line) 70%,transparent)}.nav-link{appearance:none;border:0;background:transparent;color:var(--paper-ink);font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;justify-self:start;padding:0}.nav-link:last-child{justify-self:end}.study-progress{justify-items:center;gap:.45rem}.study-progress span{color:color-mix(in oklch,var(--paper-ink) 78%,var(--accent) 22%);letter-spacing:.14em;text-transform:uppercase;font-size:.76rem}.topbar-track{overflow:hidden;width:min(24rem,100%);height:.45rem;border-radius:999px;background:color-mix(in oklch,var(--paper-ink) 14%,transparent)}.topbar-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent) 0%,color-mix(in oklch,var(--accent) 45%,white) 100%);transition:width .28s var(--ease-out)}.flashcard-stage,.study-finish{min-height:0}.flashcard-stage{position:relative;height:100%}.flashcard-photo{width:100%;height:100%;object-fit:cover;display:block}.flashcard-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;gap:.8rem;padding:clamp(.8rem,1.5vw,1.35rem);background:linear-gradient(180deg,color-mix(in oklch,var(--study-surface) 46%,transparent) 0%,transparent 22%),linear-gradient(180deg,transparent 40%,color-mix(in oklch,var(--study-surface) 86%,transparent) 100%)}.flashcard-topline{display:flex;justify-content:space-between;align-items:start;gap:1rem}.topline-right{display:grid;justify-items:end;gap:.7rem}.code-stack{display:flex;gap:.65rem}.code-stack span{display:inline-grid;place-items:center;min-width:2.7rem;min-height:2.7rem;padding:.65rem;border-radius:1rem;background:color-mix(in oklch,var(--paper-ink) 86%,transparent);color:var(--accent-deep);font-weight:800;letter-spacing:.12em}.species-lock{padding:.55rem .85rem;border-radius:999px;background:color-mix(in oklch,var(--study-surface) 50%,transparent);color:var(--paper-ink);font-style:italic;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.photo-badge{margin:0;padding:.45rem .8rem;border-radius:999px;background:color-mix(in oklch,var(--study-surface) 42%,transparent);color:color-mix(in oklch,var(--paper-ink) 78%,transparent);font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.flashcard-bottom{gap:.7rem;max-width:min(54rem,100%)}.title-block{gap:.35rem}.flashcard-bottom .kicker{color:color-mix(in oklch,var(--paper-ink) 78%,var(--accent) 22%)}.flashcard-bottom h2{max-width:8ch;font-size:clamp(2.8rem,8.5vw,6.8rem);color:var(--paper-ink);line-height:.86}.fact-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem}.fact-strip div{display:grid;gap:.35rem;padding:.8rem .85rem;border-radius:1.1rem;background:color-mix(in oklch,var(--study-surface) 64%,transparent);color:var(--paper-ink);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.fact-strip strong{font-size:clamp(.92rem,1.15vw,1.08rem);line-height:1.22}.photo-credit{margin:0;max-width:42rem;color:color-mix(in oklch,var(--paper-ink) 70%,transparent);font-size:.74rem;line-height:1.35}.study-controls{display:flex;flex-wrap:wrap;gap:.65rem}.study-finish{display:grid;place-content:center;justify-items:start;gap:1rem;margin:clamp(1rem,2vw,1.5rem);padding:clamp(1.4rem,3vw,2.5rem);border-radius:2rem}.study-finish h2{max-width:8ch;font-size:clamp(3rem,8vw,6rem)}.study-finish p:last-of-type{margin:0;color:var(--ink-soft)}.leaderboard-screen{display:grid;grid-template-rows:auto 1fr;gap:.75rem}.leaderboard-header{padding:.25rem 0}.leaderboard-header h2{font-size:clamp(1.9rem,4vw,3.8rem)}.leaderboard-panel{display:grid;align-content:start;gap:.75rem;min-height:0;overflow:auto;padding:clamp(.85rem,1.5vw,1.15rem);background:linear-gradient(180deg,color-mix(in oklch,var(--surface) 88%,white),color-mix(in oklch,var(--surface-2) 94%,white))}.leaderboard-meta{gap:.85rem;max-width:44rem}.leaderboard-list{display:grid;gap:.55rem;margin:0;padding:0;list-style:none}.leaderboard-row{background:color-mix(in oklch,var(--surface) 74%,white)}.leaderboard-row.is-current{background:color-mix(in oklch,var(--accent) 16%,white);border-color:color-mix(in oklch,var(--accent-strong) 34%,var(--line))}.leaderboard-rank{min-width:2.2rem;color:var(--accent-ink);font-weight:800;letter-spacing:.12em}.leaderboard-score{font-family:var(--font-display);font-size:clamp(1.2rem,2.2vw,1.7rem);line-height:1;color:var(--ink)}.primary-button,.secondary-button,.ghost-button{appearance:none;min-height:2.8rem;border-radius:999px;padding:.72rem 1rem;font-weight:700;cursor:pointer;transition:transform .12s var(--ease-out),background-color .18s ease,color .18s ease,box-shadow .18s ease,border-color .18s ease}.primary-button:hover,.secondary-button:hover,.ghost-button:hover,.nav-link:hover{transform:translateY(-1px)}.primary-button:focus-visible,.secondary-button:focus-visible,.ghost-button:focus-visible,.nav-link:focus-visible{outline:3px solid color-mix(in oklch,var(--accent) 30%,white);outline-offset:3px}.primary-button:disabled,.secondary-button:disabled,.ghost-button:disabled{opacity:.6;cursor:wait;transform:none}.primary-button{border:0;background:linear-gradient(135deg,var(--accent-strong) 0%,color-mix(in oklch,var(--accent) 62%,white) 100%);color:var(--paper-ink);box-shadow:0 1rem 2rem color-mix(in oklch,var(--accent-strong) 22%,transparent)}.secondary-button{border:1px solid color-mix(in oklch,var(--paper-ink) 28%,transparent);background:color-mix(in oklch,var(--study-surface) 60%,transparent);color:var(--paper-ink)}.ghost-button{border:0;background:transparent;color:var(--accent-ink);padding-inline:0;min-height:auto}.welcome-copy,.login-stage,.leaderboard-panel,.study-topbar,.flashcard-stage,.study-finish{animation:screen-enter .62s var(--ease-out) both}.login-stage,.flashcard-stage,.leaderboard-panel{animation-delay:80ms}@keyframes screen-enter{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@media(max-width:960px){.welcome-screen{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) minmax(0,auto)}.fact-strip{grid-template-columns:1fr}.leaderboard-row{flex-wrap:wrap;align-items:start}}@media(max-width:720px){.welcome-screen,.leaderboard-screen{padding:.6rem}.welcome-copy h1,.flashcard-bottom h2,.leaderboard-header h2,.study-finish h2{max-width:none}.study-topbar,.leaderboard-header{grid-template-columns:1fr;justify-items:start}.study-progress{justify-items:start}.topbar-track{width:100%}.flashcard-topline{flex-direction:column;align-items:start;gap:.65rem}.topline-right{justify-items:start}.fact-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}