@font-face{font-family:Fraunces;font-style:normal;font-weight:300 900;font-display:swap;src:url(fonts/fraunces-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Fraunces;font-style:normal;font-weight:300 900;font-display:swap;src:url(fonts/fraunces-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:200 900;font-display:swap;src:url(fonts/source-serif-4-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:200 900;font-display:swap;src:url(fonts/source-serif-4-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:200 900;font-display:swap;src:url(fonts/source-serif-4-italic-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:200 900;font-display:swap;src:url(fonts/source-serif-4-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/ibmplexsans-normal-500-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/ibmplexsans-normal-500-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibmplexsans-normal-600-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibmplexsans-normal-600-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* Câte cuvinte știi — paper and ink, with the sunflower's gold for the words a reader knows */
:root,html[data-theme="dark"]{
  --bg:#15120e;--panel:#1d1914;--panel-2:#27211a;--ink:#f2e9d8;--ink-2:#dccfb8;--muted:#b9ab93;--line:#43392c;--line-soft:#2d261e;
  --accent:#f0b44c;--accent-ink:#1e1404;--focus:#9cc8ff;
  --fl-bg:rgb(21,18,14);--fl-c0:rgb(107,58,18);--fl-c1:rgb(217,142,31);--fl-c2:rgb(245,200,74);--fl-off:rgb(92,80,68);--fl-off-a:.42;--fl-rim:rgb(98,90,80);--fl-rim-a:.62;--fl-mark:rgb(255,211,107);--fl-no:rgb(138,128,112);--fl-ring:rgb(255,241,208);--fl-ink:rgb(243,230,200);
  --serif:"Source Serif 4",Georgia,serif;--display:Fraunces,"Source Serif 4",Georgia,serif;--sans:"IBM Plex Sans",system-ui,sans-serif;color-scheme:dark}
html[data-theme="light"]{
  --bg:#f6f0e3;--panel:#fbf7ee;--panel-2:#eee4cf;--ink:#1d1810;--ink-2:#3a3226;--muted:#5a5042;--line:#d3c4a6;--line-soft:#e4d9c1;
  --accent:#8a5200;--accent-ink:#fffaf0;--focus:#1a56b0;
  --fl-bg:rgb(246,240,227);--fl-c0:rgb(168,98,28);--fl-c1:rgb(196,114,10);--fl-c2:rgb(150,80,4);--fl-off:rgb(170,156,134);--fl-off-a:.6;--fl-rim:rgb(200,190,174);--fl-rim-a:.95;--fl-mark:rgb(150,80,0);--fl-no:rgb(140,128,110);--fl-ring:rgb(40,30,18);--fl-ink:rgb(29,24,16);color-scheme:light}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.07rem/1.62 var(--serif);-webkit-font-smoothing:antialiased}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.skip{position:absolute;left:-999px;top:0}.skip:focus{left:12px;top:8px;z-index:50;background:var(--panel);padding:8px 12px;border-radius:8px}
.topbar{position:fixed;top:0;left:0;right:0;z-index:20;height:44px;display:flex;align-items:center;gap:10px;padding:0 14px;font:500 .86rem/1 var(--sans);background:var(--bg);border-bottom:1px solid var(--line-soft)}
.topbar .brand{color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:8px}
.brand-mark{width:20px;height:20px}.brand-mark circle{fill:var(--accent)}.brand-mark circle.o{fill:var(--muted);opacity:.6}
.topbar .spacer{flex:1}
.topnav{display:flex;gap:2px;margin-left:12px}.topnav a{color:var(--muted);text-decoration:none;padding:6px 8px;border-radius:6px}.topnav a:hover{color:var(--ink)}
.topbar .chip{color:var(--muted);text-decoration:none;border:1px solid var(--line);border-radius:99px;padding:5px 9px}.topbar .chip[aria-current]{color:var(--ink);border-color:var(--muted)}
.icon-btn{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer}
svg[hidden]{display:none}

/* the flower stays beside the text (desktop) or above it (phone) */
.layout{display:grid;grid-template-columns:minmax(0,600px) minmax(0,1fr);gap:0 3vw;padding:44px 4vw 0 5vw}
.col{grid-column:1;grid-row:1;padding-bottom:24vh}
.stage{grid-column:2;grid-row:1;position:sticky;top:44px;height:calc(100vh - 44px);height:calc(100svh - 44px);align-self:start;display:flex;flex-direction:column;justify-content:center}
.stage canvas{display:block;width:100%;height:min(calc(100% - 60px),46vw);touch-action:manipulation}
.stage-hint .short{display:none}
.stage-hint{margin:6px 0 0;text-align:center;font:500 .8rem/1.4 var(--sans);color:var(--muted);padding:0 10px}
.stage-status{position:absolute;inset:auto 0 50% 0;text-align:center;font:500 .9rem var(--sans);color:var(--muted)}
.seed-tip{position:absolute;z-index:6;width:260px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 32px 10px 12px;font:500 .8rem/1.4 var(--sans);color:var(--muted);box-shadow:0 8px 26px rgba(0,0,0,.28)}
.seed-tip b{display:block;font:600 1.3rem/1.2 var(--display);color:var(--ink);margin-bottom:2px}.tip-h{color:var(--muted)}.tip-w{margin:4px 0 6px;font:italic 1rem/1.45 var(--serif);color:var(--ink)}.tip-w a{color:var(--ink);text-decoration-color:var(--line)}.seed-tip span{display:block}.seed-tip a{display:inline-block;margin-top:6px}
.tip-x{position:absolute;top:4px;right:4px;width:30px;height:30px;border:0;background:transparent;color:var(--muted);font:500 1.2rem var(--sans);cursor:pointer;border-radius:50%}

section{scroll-margin-top:60px}
.intro{min-height:calc(42vh);padding:7vh 0 2vh}
.kicker{font:600 .76rem/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin:0 0 10px}
h1{font:600 clamp(2.2rem,4.1vw,3.5rem)/1.04 var(--display);letter-spacing:-.015em;margin:0 0 18px;text-wrap:balance}
h2{font:600 1.65rem/1.15 var(--display);margin:0 0 12px;position:relative;scroll-margin-top:80px;text-wrap:balance}
h3{font:600 1.08rem/1.3 var(--sans);margin:22px 0 6px}
.anchor{margin-left:8px;color:var(--line);text-decoration:none;font-size:.8em;opacity:0}h2:hover .anchor,.anchor:focus{opacity:1}
.deck{font-size:1.18rem;line-height:1.55;color:var(--ink-2);margin:0 0 10px}
.shared{background:var(--panel-2);border-radius:14px;padding:14px 16px;margin:0 0 18px;font:500 1rem/1.45 var(--sans)}
.shared p{margin:0 0 10px}.row{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;border-radius:99px;border:1px solid var(--line);background:transparent;color:var(--ink);font:600 .92rem/1.1 var(--sans);text-decoration:none;cursor:pointer}
.btn:hover{border-color:var(--muted)}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn.ghost{border-color:transparent;color:var(--muted)}

/* the test */
.test{padding:4vh 0 2vh}
.tbox{background:var(--panel);border:1px solid var(--line-soft);border-radius:18px;padding:16px 16px 12px;margin-top:14px}
.t-top{display:flex;align-items:center;gap:12px;font:600 .8rem var(--sans);color:var(--muted);margin-bottom:12px}
.t-dots{display:flex;gap:6px;flex:1}.t-dots i{width:22px;height:4px;border-radius:4px;background:var(--line)}.t-dots i.done{background:var(--accent);opacity:.6}.t-dots i.now{background:var(--accent)}
.t-count{font-weight:500}
.grid{display:flex;flex-wrap:wrap;gap:8px;min-height:200px;align-content:flex-start}
.w{display:inline-flex;align-items:center;min-height:42px;padding:7px 14px;border-radius:99px;border:1px solid var(--line);background:transparent;color:var(--ink);font:500 1.08rem/1.1 var(--serif);cursor:pointer;transition:background .15s,border-color .15s}
span.w{cursor:default;opacity:.6}
.w:hover{border-color:var(--accent)}
.w[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.t-nav{display:flex;justify-content:space-between;gap:10px;margin:14px 0 0}

/* result */
.result{padding:5vh 0 2vh}
.r-main{margin:0 0 6px;line-height:1.1}.r-num{font:600 clamp(2.8rem,6vw,4.2rem)/1 var(--display);color:var(--accent);letter-spacing:-.02em}.r-unit{display:block;font:500 1.1rem/1.35 var(--serif);color:var(--ink-2);margin-top:6px}
.r-range{font:500 .95rem/1.45 var(--sans);color:var(--muted);margin:0 0 16px}
.r-rare,.r-missed,.r-pseudo{font:500 .95rem/1.55 var(--sans);color:var(--ink-2);margin:0 0 12px}
.r-rare em{font:italic 1.15rem var(--serif)}
.pw{display:inline-block;font:italic .98rem var(--serif);color:var(--muted);padding:0 2px}.pw.on{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px}
.r-texts{margin:16px 0}.r-texts-h{font:600 .85rem var(--sans);color:var(--ink-2);margin:0 0 8px}
.bars{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.bars li{display:grid;grid-template-columns:minmax(0,13.5em) 1fr 3.2em 8.5em;align-items:center;gap:10px;font:500 .84rem var(--sans);color:var(--ink-2)}
.bm{font-size:.76rem;color:var(--muted);white-space:nowrap}
.bars-note{font:500 .74rem var(--sans);color:var(--muted);margin:4px 0 0}
.bt{height:8px;border-radius:8px;background:var(--line-soft);overflow:hidden}.bt i{display:block;height:100%;width:var(--w);background:var(--accent)}
.bv{text-align:right;color:var(--ink)}
.small{font:500 .82rem/1.5 var(--sans);color:var(--muted)}
.share-block{margin:18px 0 8px}.share-label{font:600 .8rem var(--sans);color:var(--muted);margin:0 0 6px}
.share-row{display:flex;gap:8px;flex-wrap:wrap}
.sbtn{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line-soft);background:transparent;color:var(--ink);cursor:pointer}
.sbtn:hover,.sbtn:focus-visible{border-color:var(--accent);color:var(--accent)}
@media (pointer:coarse){.sbtn{width:44px;height:44px}}
.status{font:500 .8rem var(--sans);color:var(--muted);min-height:1.2em;margin:6px 0 0}

/* essay sections */
.essay{padding:12vh 0 2vh}
.essay p{margin:0 0 1em}
.pick-h{font:600 .8rem var(--sans);color:var(--muted);margin:16px 0 6px!important}
.picks{display:flex;flex-wrap:wrap;gap:6px}
.picks button{min-height:38px;padding:6px 12px;border-radius:99px;border:1px solid var(--line);background:transparent;color:var(--ink);font:500 .84rem var(--sans);cursor:pointer}
.picks button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.texts-out{font:500 1.02rem/1.5 var(--serif);color:var(--ink);margin:12px 0 0!important;min-height:3em}
.chart-fig{margin:18px 0 8px}
.chart{width:100%;height:auto;font:500 10px var(--sans);fill:var(--muted)}
.chart .ln{fill:none;stroke:var(--accent);stroke-width:2}.chart .pt{fill:var(--accent)}.chart .axis{stroke:var(--line)}.chart .lbl{fill:var(--ink);font-weight:600}
.chart .rim{fill:var(--fl-rim);fill-opacity:.25}
figcaption{font:500 .78rem/1.4 var(--sans);color:var(--muted);margin-top:4px}

/* after the flower */
.after{position:relative;z-index:3;background:var(--bg);padding:40px 16px 60px;border-top:1px solid var(--line-soft)}
.wrap{max-width:720px;margin:0 auto 34px}
.prose p{margin:0 0 1em}
.sources{padding-left:1.2em;font:500 .88rem/1.5 var(--sans)}.sources li{margin:0 0 6px}
.related{font:500 .92rem var(--sans)}
.site-footer{position:relative;z-index:3;background:var(--bg);display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:center;padding:22px 16px 40px;font:500 .82rem var(--sans);color:var(--muted);border-top:1px solid var(--line-soft)}
.site-footer a{color:var(--ink-2)}
.rail{position:fixed;right:8px;top:50%;transform:translateY(-50%);z-index:4;display:flex;flex-direction:column;gap:12px}
.rail a{display:block;width:6px;height:6px;border-radius:50%;background:var(--line);position:relative}
.rail a span{position:absolute;right:14px;top:-7px;white-space:nowrap;font:500 .74rem var(--sans);color:var(--muted);opacity:0;pointer-events:none}
.rail a:hover span,.rail a:focus span{opacity:1}
.rail a[aria-current]{background:var(--accent)}
@media (max-width:1100px){.topnav{display:none}}
@media (max-width:899px){
  .layout{display:block;padding:44px 0 0}
  .stage{position:sticky;top:44px;z-index:5;height:31svh;background:var(--bg);border-bottom:1px solid var(--line-soft)}
  .stage canvas{height:calc(100% - 26px)}
  .stage-hint{font-size:.72rem;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stage-hint .long{display:none}.stage-hint .short{display:inline}
  .col{padding:0 16px 14vh}
  .intro{min-height:0;padding:20px 0 6px}
  h1{font-size:1.85rem;margin-bottom:12px}.deck{font-size:1rem;line-height:1.5}.intro{padding:14px 0 0}.test{padding-top:14px!important}.test h2{font-size:1.3rem}.test .kicker{display:none}.test>p{margin:0 0 4px;font-size:.98rem}
  .test,.result{padding:18px 0 8px}.essay{padding:40px 0 8px}
  section,h2{scroll-margin-top:calc(31svh + 52px)}
  .rail{display:none}.topbar .brand span{font-size:.82rem}.topbar .chip{padding:5px 8px}
  .bars{padding-right:46px}
  .tbox{padding:12px 10px 10px;border-radius:14px}.w{font-size:1.02rem;padding:7px 12px;min-height:40px}
  .bars li{grid-template-columns:1fr auto;grid-template-areas:'l l' 't v';row-gap:2px;column-gap:10px;font-size:.8rem;margin-bottom:6px}.bars .bl{grid-area:l}.bars .bt{grid-area:t}.bars .bv{grid-area:v}.bars .bm{display:none}
  .seed-tip{width:200px}
}
@media (prefers-reduced-motion:reduce){.w{transition:none}}
