@import"https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700&family=Manrope:wght@400;500;600;700&display=swap";:root{font-family:var(--font-body);line-height:1.5;font-weight:400;color:#311f19;background:radial-gradient(circle at top left,oklch(94% .05 95) 0%,transparent 30%),linear-gradient(180deg,#fcf9ea,#faf1dc);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--font-display: "Fraunces", serif;--font-body: "Manrope", sans-serif;--paper: oklch(99% .02 95 / .92);--paper-elevated: oklch(100% 0 0 / .82);--ink: oklch(26% .03 40);--ink-soft: oklch(43% .03 45);--accent: oklch(63% .13 82);--accent-deep: oklch(47% .16 64);--line: oklch(84% .03 85);--line-strong: oklch(74% .06 82)}*{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) 8%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklch,var(--accent) 8%,transparent) 1px,transparent 1px);background-size:42px 42px;opacity:.35;pointer-events:none}a{color:inherit}button,input,textarea,select{font:inherit}#root{position:relative;min-height:100vh}.app-shell{min-height:100vh;min-height:100svh;display:grid;grid-template-rows:auto auto 1fr;gap:1rem;padding:clamp(.9rem,1.6vw,1.4rem)}.study-header{display:flex;align-items:center;justify-content:space-between;gap:1rem}.eyebrow,.deck-note,.progress-label,.species-latin,.meta p{margin:0}.eyebrow{font-size:.76rem;letter-spacing:.28em;text-transform:uppercase;color:var(--accent-deep)}.deck-note{margin-top:.2rem;font-size:.86rem;color:var(--ink-soft)}.header-right{display:flex;align-items:center;gap:1rem}.glyph-group{display:flex;gap:.55rem}.glyph-badge{display:inline-grid;place-items:center;width:3rem;height:3rem;border-radius:1rem;border:1px solid color-mix(in oklch,var(--accent) 30%,var(--line));background:color-mix(in oklch,var(--paper) 60%,white);font-size:1rem;font-weight:800;letter-spacing:.08em;color:var(--accent-deep);box-shadow:0 .8rem 1.6rem color-mix(in oklch,var(--accent-deep) 10%,transparent)}.glyph-badge-alt{color:var(--ink)}.progress-label{font-size:.9rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}.progress-strip{overflow:hidden;width:100%;height:.55rem;border-radius:999px;background:color-mix(in oklch,var(--accent) 12%,white)}.progress-bar{height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent) 0%,var(--accent-deep) 100%);transition:width .32s ease}.flashcard,.completion-card{min-height:0;display:grid;border:1px solid var(--line-strong);border-radius:2rem;overflow:hidden;background:var(--paper);box-shadow:0 2rem 5rem color-mix(in oklch,var(--accent-deep) 14%,transparent)}.flashcard{grid-template-rows:minmax(0,1fr) auto}.completion-card{place-content:center;gap:1rem;padding:clamp(1.5rem,3vw,3rem);text-align:center;background:radial-gradient(circle at top left,color-mix(in oklch,var(--accent) 18%,white) 0%,transparent 28%),var(--paper)}.completion-card h2,.identity-panel h2{margin:0;font-family:var(--font-display);font-weight:600;line-height:.94;letter-spacing:-.03em}.completion-card h2{font-size:clamp(2.6rem,7vw,5.8rem)}.completion-card p{margin:0;color:var(--ink-soft)}.photo-frame{position:relative;min-height:0;margin:0;background:color-mix(in oklch,var(--accent) 9%,white)}.creature-photo{width:100%;height:100%;object-fit:cover;display:block}.photo-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in oklch,var(--ink) 30%,transparent) 0%,transparent 22%),linear-gradient(180deg,transparent 55%,color-mix(in oklch,var(--ink) 70%,transparent) 100%);pointer-events:none}.photo-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;padding:clamp(1rem,2vw,1.8rem);pointer-events:none}.species-latin{align-self:flex-end;padding:.45rem .8rem;border-radius:999px;background:color-mix(in oklch,var(--ink) 48%,transparent);color:color-mix(in oklch,white 88%,var(--accent) 12%);font-size:.92rem;font-style:italic;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.identity-panel{max-width:min(40rem,100%);display:grid;gap:.45rem;padding:clamp(1rem,2vw,1.35rem);border-radius:1.35rem;background:color-mix(in oklch,var(--ink) 58%,transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:color-mix(in oklch,white 92%,var(--accent) 8%)}.identity-panel h2{font-size:clamp(2.3rem,5vw,5rem)}.identity-panel:not(.is-open){color:color-mix(in oklch,white 74%,var(--accent) 8%)}.reveal-label{margin:0;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase}.control-dock{display:grid;gap:1rem;padding:clamp(1rem,2vw,1.4rem);background:linear-gradient(180deg,color-mix(in oklch,var(--paper) 78%,white),color-mix(in oklch,var(--paper) 96%,white))}.reveal-panel{display:grid;gap:.8rem}.reveal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem}.reveal-grid div{display:grid;gap:.45rem;min-height:5.4rem;padding:1rem;border-radius:1.15rem;background:color-mix(in oklch,var(--paper) 48%,white);border:1px solid color-mix(in oklch,var(--accent) 12%,var(--line))}.reveal-grid span{font-size:.8rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.16em}.reveal-grid strong{font-size:clamp(1rem,1.8vw,1.3rem);line-height:1.25;color:var(--ink)}.reveal-panel:not(.is-open) strong{color:var(--ink-soft)}.dock-footer{display:flex;align-items:end;justify-content:space-between;gap:1rem}.actions{display:flex;flex-wrap:wrap;gap:.75rem}.primary-button,.secondary-button{appearance:none;border:0;border-radius:999px;padding:1rem 1.45rem;font:inherit;font-weight:700;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease}.primary-button{color:#fff;background:linear-gradient(135deg,var(--accent-deep),var(--accent));box-shadow:0 1rem 1.8rem color-mix(in oklch,var(--accent-deep) 28%,transparent)}.secondary-button{color:var(--ink);background:var(--paper-elevated);border:1px solid var(--line)}.primary-button:hover,.secondary-button:hover{transform:translateY(-1px)}.primary-button:focus-visible,.secondary-button:focus-visible,.meta a:focus-visible{outline:2px solid var(--accent-deep);outline-offset:3px}.meta{display:grid;justify-items:end;gap:.3rem;font-size:.84rem;text-align:right}.meta a{color:var(--accent-deep);text-underline-offset:.18em}@media(max-width:900px){.flashcard{grid-template-rows:1.2fr auto}.photo-frame{min-height:48vh}.dock-footer{flex-direction:column;align-items:stretch}.meta{justify-items:start;text-align:left}}@media(max-width:680px){.app-shell{padding:.8rem}.study-header{align-items:start;flex-direction:column}.header-right{width:100%;justify-content:space-between}.identity-panel h2{font-size:clamp(1.9rem,10vw,3rem)}.reveal-grid{grid-template-columns:1fr}.actions{width:100%}.primary-button,.secondary-button{flex:1 1 10rem}}
