/* Tudásív: ink, paper and a measured gold accent. All assets are local. */
:root { --ink:#203b3a; --green:#173f3e; --green-hover:#102f2e; --mint:#eaf2ef; --bg:#f7f5ef; --line:#dfe5df; --muted:#5d706c; --gold:#edbd62; }
@supports (color: light-dark(#000, #fff)) { :root { --ink: light-dark(#203b3a, #ccebea); --green: light-dark(#173f3e, #bfeae8); --green-hover: light-dark(#102f2e, #cff2f0); --mint: light-dark(#eaf2ef, #1e2321); --bg: light-dark(#f7f5ef, #21201d); --line: light-dark(#dfe5df, #252925); --muted: light-dark(#5d706c, #9fb3af); --gold: light-dark(#edbd62, #513a06); } }
.preview-measurement { padding:1.25rem; border:1px solid var(--line); background:var(--white); background: var(--light-dark(white, #1a2420)); border-radius:.8rem; margin-bottom:1.5rem; }
.preview-measurement p { margin:.35rem 0 1rem; max-width:64rem; color:var(--muted); font-size:.8125rem; }
.preview-measurement .actions,.preview-measurement form { display:flex; flex-wrap:wrap; gap:.6rem; }
.brand-name { font-weight:720; letter-spacing:-.025em; font-size:1rem; line-height:1.25; white-space:normal; }
.brand-note { max-width:18rem; text-align:right; }
.brand-logo { border-radius:24%; }
.knowledge-arc,.classroom { padding:clamp(1rem,3vw,2rem); margin-block:1.5rem; }
.knowledge-arc .section-head,.classroom .section-head { align-items:flex-start; flex-wrap:wrap; }
.knowledge-arc h2,.classroom h2 { font-size:1.7rem; margin-bottom:0; }
.knowledge-subject { padding-block:1.25rem; border-top:1px solid var(--line); }
.knowledge-chart { display:block; width:100%; max-height:240px; overflow:visible; }
.knowledge-chart a:focus circle { outline:3px solid var(--amber); outline-offset:4px; }
.knowledge-topics { display:grid; gap:.65rem; }
.knowledge-topic { display:grid; grid-template-columns:1fr minmax(140px,1fr); gap:1rem; align-items:center; padding:.8rem 1rem; border-radius:.7rem; background:var(--bg); }
.knowledge-topic small { display:block; color:var(--muted); font-size:.75rem; }
.knowledge-topic meter { display:block; width:100%; height:.55rem; margin:.25rem 0; accent-color:var(--green); }
.knowledge-sources { margin-top:1rem; }
.knowledge-timeline { list-style:none; padding:0; }
.knowledge-timeline li { padding:.75rem 0; border-bottom:1px solid var(--line); }
.knowledge-timeline a { display:flex; flex-wrap:wrap; gap:.3rem 1rem; }
.knowledge-timeline time,.knowledge-timeline li>span { font-size:.8rem; color:var(--muted); }
.knowledge-practice { border-top:1px solid var(--line); padding-top:1.25rem; }
.knowledge-practice details { padding:.65rem 0; }
.insight-empty { padding:1.5rem; background:var(--bg); border:1px dashed var(--line); border-radius:.8rem; }
.insight-empty p { margin-bottom:0; max-width:50rem; color:var(--muted); }
.classroom-focus { border-left:3px solid var(--gold); padding-left:1rem; margin:1.5rem 0; }
.focus-item { display:flex; justify-content:space-between; gap:1rem; padding:.7rem 0; border-top:1px solid var(--line); }
.focus-item small { display:block; font-size:.75rem; color:var(--muted); max-width:36rem; }
.focus-item>strong { text-align:right; flex-shrink:0; }
.room-picker { margin-top:1rem; }
.classroom-map-wrap { max-width:100%; overflow:auto; max-height:36rem; border-radius:1rem; border:1px solid var(--line); overscroll-behavior:contain; }
.classroom-map { display:block; min-width:100%; background:var(--bg); }
.classroom-desk { fill:white; fill: light-dark(white, #10201a); stroke:var(--green); stroke-width:1.5; }
.classroom-map a:focus .classroom-desk { stroke:var(--amber); stroke-width:4; }
.classroom-edge { stroke:#a17528; stroke: light-dark(#a17528, #b88b40); stroke-width:3; stroke-dasharray:6 5; }
.desk-name { fill:var(--ink); font:600 10px system-ui,sans-serif; }
.desk-rate { fill:var(--muted); font:10px system-ui,sans-serif; }
.empty-desk { fill:var(--bg); stroke:var(--line); }
.classroom-patterns { margin-top:1rem; }
.classroom-legend { display:flex; flex-wrap:wrap; gap:.65rem 1rem; margin:1.5rem 0 .75rem; font-size:.75rem; }
.classroom-legend>span { display:inline-flex; gap:.35rem; align-items:center; }
.answer-dot { display:inline-flex; justify-content:center; align-items:center; width:2rem; min-width:2rem; height:2rem; border:1px solid transparent; border-radius:.5rem; font-size:1.1rem; font-weight:700; }
.answer-correct { background:#dceee4; background: light-dark(#dceee4, #1d2722); color:#214b37; color: light-dark(#214b37, #b1dfc6); }
.answer-partial { background:#fff0cc; background: light-dark(#fff0cc, #292008); color:#715018; color: light-dark(#715018, #d8b37c); }
.answer-incorrect { background:#f9e5e1; background: light-dark(#f9e5e1, #2c211f); color:#8b3530; color: light-dark(#8b3530, #fe9c92); }
.answer-blank { background:#eee8df; background: light-dark(#eee8df, #27241f); color:#665744; color: light-dark(#665744, #c6b5a0); }
.answer-unknown { background:#edf0f1; background: light-dark(#edf0f1, #202222); color:#50616a; color: light-dark(#50616a, #a6b9c3); border-style:dashed; border-color:#8f9c9f; border-color: light-dark(#8f9c9f, #657174); }
.classroom-scroll { overflow:auto; max-height:38rem; overscroll-behavior:contain; }
.classroom-matrix { min-width:100%; width:max-content; border-collapse:separate; border-spacing:0; font-size:.8125rem; }
.classroom-matrix caption { text-align:left; color:var(--muted); padding:.75rem 0; font-size:.75rem; }
.classroom-matrix :is(th,td) { padding:.6rem .75rem; text-align:center; min-width:5rem; border-bottom:1px solid var(--line); }
.classroom-matrix th:first-child { position:sticky; left:0; z-index:1; text-align:left; background:white; background: light-dark(white, #1a2420); max-width:14rem; min-width:9rem; white-space:normal; }
.classroom-matrix thead th { position:sticky; top:0; z-index:2; background:var(--bg); }
.classroom-matrix thead th:first-child { z-index:3; }
.classroom-matrix tr:target :is(th,td) { background:#fff2d7; background: light-dark(#fff2d7, #27200f); }
.classroom-matrix td .answer-dot { width:2.75rem; height:2.75rem; }
.product-intro { padding-block:clamp(1.5rem,4vw,4rem); }
.product-intro h2 { font-size:clamp(2.4rem,5vw,4.5rem); line-height:1.06; letter-spacing:-.055em; max-width:13ch; }
.product-intro-copy>p { font-size:1.05rem; max-width:33rem; }
.product-preview { background:var(--white); background: var(--light-dark(white, #1a2420)); color:var(--ink); transform:rotate(1.5deg); }
.product-preview :is(h3,strong) { color:var(--ink); }
.product-preview .eyebrow { color:var(--green); }
.product-preview .product-preview-note { color:var(--muted); }
.product-preview .product-preview-roster { color:var(--ink); }
.product-intro .actions { margin-block:1.5rem; flex-wrap:wrap; }
.product-intro .button:not(.secondary) { background:var(--gold); color:var(--green); border-color:var(--gold); }
.product-demo { border:1px solid var(--line); border-radius:1.5rem; overflow:hidden; background:white; background: light-dark(white, #1a2420); margin-block:3rem; scroll-margin-top:2rem; }
.demo-header { display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding:1.5rem; background:var(--green); color:#fffaf0; color: light-dark(#fffaf0, #221f19); }
.demo-header h2 { margin:0; font-size:1.5rem; }.demo-header .eyebrow { color:var(--gold); }
.demo-header p { margin:0; font-size:.8rem; color:#d5e6de; color: light-dark(#d5e6de, #212b27); }
.demo-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-bottom:1px solid var(--line); background:var(--bg); padding:.5rem; gap:.3rem; }
.demo-steps button { background:transparent; color:var(--muted); text-align:left; justify-content:flex-start; }
.demo-steps button[aria-pressed=true] { background:white; background: light-dark(white, #1a2420); color:var(--green); box-shadow:var(--shadow); }
.demo-panel { padding:clamp(1rem,3vw,2rem); min-height:24rem; }
.demo-panel h3 { font-size:1.4rem; }.demo-panel .hint { margin-top:1rem; }
.demo-two { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.demo-sheet { padding:1.5rem; background:var(--bg); border:1px solid var(--line); border-radius:.6rem; }
.demo-sheet .eyebrow { padding-bottom:.75rem; border-bottom:1px solid var(--line); }
.demo-sheet ol { padding-left:1.25rem; }.demo-sheet li { padding-block:.5rem; }
.demo-paper-list { list-style:none; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; margin-block:1rem; }
.demo-paper-list li { padding:.75rem; border:1px solid var(--line); border-radius:.5rem; background:var(--bg); }
.demo-paper-list small { display:block; color:var(--muted); }
.demo-table { width:100%; border-collapse:collapse; }.demo-table :is(th,td) { padding:.7rem; border-bottom:1px solid var(--line); text-align:left; }
.demo-table tr[data-selected=true] { background:var(--mint); }
.demo-controls { display:flex; flex-wrap:wrap; gap:.7rem; align-items:end; margin-bottom:1rem; }
.demo-foot { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:1rem; padding:1rem 1.5rem; border-top:1px solid var(--line); background:var(--bg); }
.demo-foot p { margin:0; font-size:.75rem; color:var(--muted); }
@media(max-width:640px) {
  .knowledge-topic,.demo-two { grid-template-columns:1fr; gap:.5rem; }
  .demo-steps { grid-template-columns:1fr 1fr; }.demo-steps button { font-size:.8rem; }
  .demo-table :is(th,td) { padding:.5rem .3rem; font-size:.8rem; }
  .focus-item { flex-direction:column; gap:.3rem; }.focus-item>strong { text-align:left; }
  .brand-note { font-size:.7rem; max-width:9rem; }
  .product-preview { transform:none; }
  .knowledge-chart { min-height:135px; }
}
@media(prefers-reduced-motion:reduce) { .product-preview { transform:none; } }