/* Recallwise v3 "study desk": paper + ink + one highlighter. Fonts are bundled (OFL), no CDNs. */
@font-face{font-family:"Fraunces";src:url(fonts/fraunces-var.woff2) format("woff2");font-weight:300 900;font-display:swap}
@font-face{font-family:"Fraunces";src:url(fonts/fraunces-var-italic.woff2) format("woff2");font-weight:300 900;font-style:italic;font-display:swap}
@font-face{font-family:"Plex";src:url(fonts/plex-sans-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex";src:url(fonts/plex-sans-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Plex";src:url(fonts/plex-sans-600-normal.woff2) format("woff2");font-weight:500 600;font-display:swap}
@font-face{font-family:"Plex";src:url(fonts/plex-sans-700-normal.woff2) format("woff2");font-weight:700 800;font-display:swap}
:root{
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --font:"Plex",ui-sans-serif,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --bg:#f4efe4;--bg-2:#ebe4d4;--sf:#fffdf7;--sf-2:#efe9dc;--bd:#1d1b16;--bd-s:#b9b09c;--line:#d9d0bd;--rule:#c9d7e6;--margin:#e3a39a;
  --tx:#1d1b16;--mu:#57524a;--fa:#6b655a;
  --ac:#1d1b16;--ac-h:#3a362d;--ac-fg:#fffdf7;--ac-tx:#a3261a;--ac-s:#fff2a8;
  --pen:#a3261a;--hl:#ffe45c;--hl-tx:#1d1b16;
  --warm:#a3261a;--warm-s:#fff2a8;--ok:#1f6b3a;--ok-s:#e2efdf;--bad:#a3261a;--bad-s:#f8e1dc;--warn:#7d5400;
  --r1:4px;--r2:6px;--r3:8px;
  --sh1:none;--sh2:3px 3px 0 var(--bd);--sh3:5px 5px 0 var(--bd);
  --ease:cubic-bezier(.3,.7,.2,1);--fast:120ms;--med:200ms;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#1e2622;--bg-2:#18201c;--sf:#26302b;--sf-2:#2e3a34;--bd:#e9e4d6;--bd-s:#6f7c74;--line:#3a4741;--rule:#3d5048;--margin:#8a5b55;
  --tx:#ece7d8;--mu:#b8b4a6;--fa:#a29f92;
  --ac:#f2d65c;--ac-h:#f7e27f;--ac-fg:#1e2622;--ac-tx:#f2d65c;--ac-s:#3e4430;
  --pen:#ff9b85;--hl:#f2d65c;--hl-tx:#1e2622;
  --warm:#ff9b85;--warm-s:#3e3229;--ok:#8fd19e;--ok-s:#23382b;--bad:#ff9b85;--bad-s:#43302b;--warn:#f0c26a;color-scheme:dark}}
:root[data-theme=dark]{
  --bg:#1e2622;--bg-2:#18201c;--sf:#26302b;--sf-2:#2e3a34;--bd:#e9e4d6;--bd-s:#6f7c74;--line:#3a4741;--rule:#3d5048;--margin:#8a5b55;
  --tx:#ece7d8;--mu:#b8b4a6;--fa:#a29f92;
  --ac:#f2d65c;--ac-h:#f7e27f;--ac-fg:#1e2622;--ac-tx:#f2d65c;--ac-s:#3e4430;
  --pen:#ff9b85;--hl:#f2d65c;--hl-tx:#1e2622;
  --warm:#ff9b85;--warm-s:#3e3229;--ok:#8fd19e;--ok-s:#23382b;--bad:#ff9b85;--bad-s:#43302b;--warn:#f0c26a;color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.6 var(--font)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.1;letter-spacing:-.01em;margin:0 0 .4em;font-variation-settings:"opsz" 72}
h1{font-size:clamp(34px,4.6vw,52px)}h2{font-size:clamp(26px,3vw,34px)}h3{font-size:20px;font-variation-settings:"opsz" 24}
p{margin:0 0 1em}a{color:var(--pen);text-underline-offset:3px;text-decoration-thickness:1px}
:focus-visible{outline:2px solid var(--pen);outline-offset:2px}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px}
.muted{color:var(--mu)}.small{font-size:14px}
.eyebrow{font:600 13px/1.2 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--mu);margin-bottom:12px}
.hl{background:linear-gradient(transparent 52%,var(--hl) 52%,var(--hl) 92%,transparent 92%);color:inherit;padding:0 .08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
/* buttons: flat ink, crisp border */
.btn,button.b,a.b{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;border-radius:var(--r1);border:1.5px solid var(--bd);background:var(--ac);color:var(--ac-fg);font:600 15px/1.2 var(--font);text-decoration:none;cursor:pointer;margin:4px 6px 4px 0;transition:transform var(--fast) var(--ease),box-shadow var(--fast) var(--ease)}
.btn:hover,button.b:hover,a.b:hover{background:var(--ac-h)}
.btn:active,button.b:active{transform:translate(1px,1px)}
.btn.lg{min-height:50px;padding:13px 22px;font-size:16px;box-shadow:3px 3px 0 var(--hl)}
.btn.ghost,button.b.s,a.b.s{background:transparent;color:var(--tx);border-color:var(--bd)}
.btn.ghost:hover,button.b.s:hover{background:var(--sf-2)}
button:disabled{opacity:.5;cursor:default}
.card{background:var(--sf);border:1.5px solid var(--bd);border-radius:var(--r2);padding:20px}
.chip{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--bd);background:var(--sf);color:var(--tx);border-radius:var(--r1);padding:6px 12px;font:500 14px/1.2 var(--font);cursor:pointer}
.chip[aria-pressed=true]{background:var(--hl);color:var(--hl-tx);border-color:var(--bd)}
.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--bd-s);border-radius:var(--r1);padding:2px 8px;font-size:13px;font-weight:600;color:var(--mu);background:transparent}
.pill.warm{background:var(--hl);color:var(--hl-tx);border-color:transparent}
input[type=text],input[type=email],input[type=date],textarea,select{width:100%;min-height:44px;padding:10px 12px;border:1.5px solid var(--bd-s);border-radius:var(--r1);background:var(--sf);color:var(--tx);font:16px/1.4 var(--font)}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--bd);box-shadow:0 0 0 3px var(--ac-s)}
/* index card: ruled lines + red margin line, CSS-only paper */
.flip{perspective:1600px;width:100%}
.flip-in{position:relative;width:100%;min-height:230px;transform-style:preserve-3d;transition:transform .45s var(--ease)}
.flip.on .flip-in{transform:rotateY(180deg)}
.face{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;gap:10px;padding:40px 26px 22px 30px;border-radius:3px;border:1.5px solid var(--bd);box-shadow:4px 4px 0 var(--bd);backface-visibility:hidden;-webkit-backface-visibility:hidden;
  background-color:var(--sf);background-image:linear-gradient(var(--margin),var(--margin)),repeating-linear-gradient(transparent 0 27px,var(--rule) 27px 28px);background-size:100% 1.5px,100% 100%;background-repeat:no-repeat,repeat;background-position:0 34px,0 34px}
.face.back{transform:rotateY(180deg)}
.face .q{font-family:var(--serif);font-size:24px;font-weight:550;line-height:1.25;font-variation-settings:"opsz" 36}.face .a{font-size:17px;line-height:28px}
.face .tag{position:absolute;top:9px;left:30px;font:600 11px/1 var(--font);color:var(--pen);text-transform:uppercase;letter-spacing:.12em}
.flip button.face{font:inherit;color:inherit;cursor:pointer;width:100%}
.rate{display:flex;gap:10px;margin-top:18px}
.rate .btn{flex:1;max-width:220px}
.rate .no{background:transparent;color:var(--tx)}.rate .no:hover{background:var(--bad-s)}
.rate .yes{background:var(--ac);color:var(--ac-fg)}
.coach{display:inline-block;font:italic 500 16px/1.3 var(--serif);color:var(--pen)}
.coach::before{content:"↳ "}
/* ring: thin ink circle */
.ring{position:relative;display:inline-grid;place-items:center}.ring svg{display:block;transform:rotate(-90deg)}
.ring .rv{position:absolute;font:600 15px var(--font);font-variant-numeric:tabular-nums}
.ring circle{fill:none}.ring .tr{stroke:var(--line)}.ring .pr{stroke:var(--ok);stroke-linecap:butt;transition:stroke-dasharray .6s var(--ease)}.ring .pr.z{stroke:transparent}
.toast-c{position:fixed;left:50%;bottom:calc(90px + env(safe-area-inset-bottom));transform:translateX(-50%) rotate(-1.5deg);background:var(--hl);color:var(--hl-tx);border:1.5px solid var(--bd);padding:8px 16px;border-radius:2px;font:600 15px var(--font);box-shadow:3px 3px 0 var(--bd);z-index:1001;animation:pop .25s var(--ease)}
@keyframes pop{from{opacity:0;transform:translate(-50%,6px) rotate(-1.5deg)}}
.fade-in{animation:fadeup .25s var(--ease) both}@keyframes fadeup{from{opacity:0;transform:translateY(6px)}}
.scribble{display:block;color:var(--pen);overflow:visible}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .flip-in{transform:none!important}.flip .face.back{display:none;transform:none}.flip.on .face.front{display:none}.flip.on .face.back{display:flex}}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}