/* Thinqly design tokens — extracted verbatim from Prototype.html (the design reference).
   Do not restyle here; if the prototype and app disagree, the prototype wins. */
:root{
  --paper:#FBFCFE; --card:#FFFFFF; --ink:#1B2940; --ink-soft:#5A6B85; --ink-faint:#8C99AE;
  --brand:#2E5EA8; --brand-deep:#1E4076; --brand-tint:#EBF1F9;
  --hl:#F5E663; --hl-soft:#FBF4C9;
  --red:#BE4B3B; --red-tint:#F9EDEA;
  --navy:#1B3A66; --navy-tint:#E7EDF6;
  --line:#DFE5EE; --line-soft:#EDF1F7;
  --ok:#2E7D53; --warn:#B07A1F;
  --accent:var(--brand); --accent-deep:var(--brand-deep); --accent-tint:var(--brand-tint);
  --r:12px; --r-sm:8px;
  --display:'Familjen Grotesk',system-ui,sans-serif;
  --body:'Instrument Sans',system-ui,sans-serif;
  --mono:'Spline Sans Mono',ui-monospace,monospace;
  --sh:0 1px 2px rgba(27,41,64,.05), 0 3px 10px rgba(27,41,64,.04);
}
.tutor-theme{ --accent:var(--navy); --accent-deep:#122A4D; --accent-tint:var(--navy-tint); }
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html{touch-action:manipulation;}
body{
  margin:0; font-family:var(--body); color:var(--ink); background:var(--paper);
  background-image:linear-gradient(var(--line-soft) 1px, transparent 1px),
                   linear-gradient(90deg, var(--line-soft) 1px, transparent 1px);
  background-size:28px 28px; background-attachment:fixed;
  font-size:16px; line-height:1.55;
  padding-bottom:env(safe-area-inset-bottom);
}
button{font-family:var(--body); cursor:pointer;}
input,textarea,select{font-family:var(--body); font-size:16px; color:var(--ink);}
h1,h2,h3{font-family:var(--display); line-height:1.15; margin:0;}
.hl{ background:linear-gradient(104deg, transparent 1.5%, var(--hl) 4%, var(--hl) 96%, transparent 98.5%);
  -webkit-box-decoration-break:clone; box-decoration-break:clone; padding:.04em .28em; margin:0 -.1em;}
.eyebrow{font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); font-weight:600; margin-bottom:6px;}
.muted{color:var(--ink-soft);} .tiny{font-size:13px;} .mono{font-family:var(--mono);}
a{color:var(--accent);}
hr.soft{border:none; border-top:1px solid var(--line-soft); margin:12px 0;}