/* QAGym shared styles. Every page links this file before its own <style>.
   1. Theme tokens: a default palette (the hub's), then one palette per page, chosen by <html data-page="…">.
      Each palette has a light block, a dark block (system setting) and a forced-dark block (data-theme="dark").
   2. Component rules that were identical on every page that used them.
   Page-specific rules stay in each page. To add a page, give its <html> a data-page and add its palette here. */

/* ---------- 1. Theme tokens ---------- */
/* Default palette */
:root{--bg:#F1F2EE; --surface:#FFFFFF; --surface-2:#F7F8F4; --ink:#16191C; --muted:#5C636B; --line:#DADDD6;
  --accent:#16191C; --accent-ink:#FFFFFF;
  --lab0:#A3471B; --lab0-soft:#F7E0D2;
  --lab1:#4A7A0C; --lab1-soft:#E2F1C4;
  --lab2:#0E6F79; --lab2-soft:#D6EEF0;
  --lab3:#A12A5E; --lab3-soft:#F6DCE7;
  --lab4:#2F4BB8; --lab4-soft:#DFE5FA;
  --lab5:#A65A00; --lab5-soft:#F8E5C9;
  --lab6:#6B3FA0; --lab6-soft:#E9DFF7;
  --lab7:#0B6E99; --lab7-soft:#D9EDF6;
  --lab8:#3E4C59; --lab8-soft:#E1E6EB;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root:not([data-theme="light"]){--bg:#0E1012; --surface:#16191C; --surface-2:#1C2024; --ink:#E8EAEC; --muted:#9BA2A9; --line:#2A2F34;
  --accent:#E8EAEC; --accent-ink:#0E1012;
  --lab0:#F2995E; --lab0-soft:#3D2518;
  --lab1:#A6E33D; --lab1-soft:#25331A;
  --lab2:#4FCFD8; --lab2-soft:#16343A;
  --lab3:#F07DAF; --lab3-soft:#3B1E2C;
  --lab4:#8EA2FF; --lab4-soft:#232C52;
  --lab5:#F5A742; --lab5-soft:#3A2B15;
  --lab6:#C3A3F0; --lab6-soft:#2E2340;
  --lab7:#5EC4F0; --lab7-soft:#16303D;
  --lab8:#AEBBC7; --lab8-soft:#273039;
  color-scheme:dark;}
}
:root[data-theme="dark"]{--bg:#0E1012; --surface:#16191C; --surface-2:#1C2024; --ink:#E8EAEC; --muted:#9BA2A9; --line:#2A2F34;
  --accent:#E8EAEC; --accent-ink:#0E1012;
  --lab0:#F2995E; --lab0-soft:#3D2518;
  --lab1:#A6E33D; --lab1-soft:#25331A;
  --lab2:#4FCFD8; --lab2-soft:#16343A;
  --lab3:#F07DAF; --lab3-soft:#3B1E2C;
  --lab4:#8EA2FF; --lab4-soft:#232C52;
  --lab5:#F5A742; --lab5-soft:#3A2B15;
  --lab6:#C3A3F0; --lab6-soft:#2E2340;
  --lab7:#5EC4F0; --lab7-soft:#16303D;
  --lab8:#AEBBC7; --lab8-soft:#273039;
  color-scheme:dark;}

/* team */
:root[data-page="team"]{--bg:#F1F2EE; --surface:#FFFFFF; --surface-2:#F7F8F4; --ink:#16191C; --muted:#5C636B; --line:#DADDD6;
  --accent:#16191C; --accent-ink:#FFFFFF; --hi:#E2F1C4;
  --gold:#B7791F; --silver:#7B8794; --bronze:#A0522D;
  --crit:#B42318; --crit-soft:#FCE5E2; --warn:#9A5B05; --warn-soft:#FAEFD6; --good:#16773A; --good-soft:#DCF2E3;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root[data-page="team"]:not([data-theme="light"]){--bg:#0E1012; --surface:#16191C; --surface-2:#1C2024; --ink:#E8EAEC; --muted:#9BA2A9; --line:#2A2F34;
  --accent:#E8EAEC; --accent-ink:#0E1012; --hi:#25331A;
  --gold:#F0B44C; --silver:#B6C0CA; --bronze:#D98A5F;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}
}
:root[data-page="team"][data-theme="dark"]{--bg:#0E1012; --surface:#16191C; --surface-2:#1C2024; --ink:#E8EAEC; --muted:#9BA2A9; --line:#2A2F34;
  --accent:#E8EAEC; --accent-ink:#0E1012; --hi:#25331A;
  --gold:#F0B44C; --silver:#B6C0CA; --bronze:#D98A5F;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}

/* strategy */
:root[data-page="strategy"]{--bg:#F1F2EE;--surface:#FFFFFF;--surface-2:#F7F8F4;--ink:#16191C;--muted:#5C636B;--line:#DADDD6;--accent:#4A7A0C;--accent-soft:#E2F1C4;--gate:#A65A00;--gate-soft:#F8E5C9;
  --font-body:"Segoe UI",system-ui,-apple-system,sans-serif;--font-mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace}
@media (prefers-color-scheme: dark){
:root[data-page="strategy"]:not([data-theme="light"]){--bg:#0E1012;--surface:#16191C;--surface-2:#1C2024;--ink:#E8EAEC;--muted:#9BA2A9;--line:#2A2F34;--accent:#A6E33D;--accent-soft:#25331A;--gate:#F5A742;--gate-soft:#3A2B15;color-scheme:dark}
}
:root[data-page="strategy"][data-theme="dark"]{--bg:#0E1012;--surface:#16191C;--surface-2:#1C2024;--ink:#E8EAEC;--muted:#9BA2A9;--line:#2A2F34;--accent:#A6E33D;--accent-soft:#25331A;--gate:#F5A742;--gate-soft:#3A2B15;color-scheme:dark}

/* lab00 */
:root[data-page="lab00"]{--bg:#F4EFE9; --surface:#FFFFFF; --surface-2:#FAF6F1; --ink:#241A14; --muted:#6B5D53; --line:#E0D6CC;
  --accent:#A3471B; --accent-soft:#F7E0D2; --accent-ink:#FFFFFF;
  --user:#4A2A1A; --user-ink:#FBF1EA;
  --crit:#B42318; --crit-soft:#FCE5E2; --warn:#9A5B05; --warn-soft:#FAEFD6; --good:#16773A; --good-soft:#DCF2E3;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root[data-page="lab00"]:not([data-theme="light"]){--bg:#14100D; --surface:#1D1713; --surface-2:#241D18; --ink:#EEE6DF; --muted:#AA9D93; --line:#362C25;
  --accent:#F2995E; --accent-soft:#3D2518; --accent-ink:#2A1206;
  --user:#4A3022; --user-ink:#F6EAE1;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}
}
:root[data-page="lab00"][data-theme="dark"]{--bg:#14100D; --surface:#1D1713; --surface-2:#241D18; --ink:#EEE6DF; --muted:#AA9D93; --line:#362C25;
  --accent:#F2995E; --accent-soft:#3D2518; --accent-ink:#2A1206;
  --user:#4A3022; --user-ink:#F6EAE1;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}

/* lab01 */
:root[data-page="lab01"]{--bg:#EDF1E8; --surface:#FFFFFF; --surface-2:#F5F7F1; --ink:#17211B; --muted:#58665D; --line:#D3DBCF;
  --accent:#4A7A0C; --accent-soft:#E2F1C4; --accent-ink:#FFFFFF;
  --user:#1E3829; --user-ink:#EFF6EC;
  --crit:#B42318; --crit-soft:#FCE5E2; --warn:#9A5B05; --warn-soft:#FAEFD6; --good:#16773A; --good-soft:#DCF2E3;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root[data-page="lab01"]:not([data-theme="light"]){--bg:#0E1410; --surface:#161E19; --surface-2:#1C251F; --ink:#E4ECE5; --muted:#99A79E; --line:#2A352E;
  --accent:#A6E33D; --accent-soft:#25331A; --accent-ink:#132009;
  --user:#2C4736; --user-ink:#EAF4EC;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}
}
:root[data-page="lab01"][data-theme="dark"]{--bg:#0E1410; --surface:#161E19; --surface-2:#1C251F; --ink:#E4ECE5; --muted:#99A79E; --line:#2A352E;
  --accent:#A6E33D; --accent-soft:#25331A; --accent-ink:#132009;
  --user:#2C4736; --user-ink:#EAF4EC;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}

/* lab02 */
:root[data-page="lab02"]{--bg:#EAF0F0; --surface:#FFFFFF; --surface-2:#F3F7F7; --ink:#14201F; --muted:#556866; --line:#D0DCDB;
  --accent:#0E6F79; --accent-soft:#D6EEF0; --accent-ink:#FFFFFF;
  --user:#163B3F; --user-ink:#ECF6F6;
  --crit:#B42318; --crit-soft:#FCE5E2; --warn:#9A5B05; --warn-soft:#FAEFD6; --good:#16773A; --good-soft:#DCF2E3;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root[data-page="lab02"]:not([data-theme="light"]){--bg:#0C1314; --surface:#141D1E; --surface-2:#1A2526; --ink:#E2ECEC; --muted:#93A6A5; --line:#283637;
  --accent:#4FCFD8; --accent-soft:#16343A; --accent-ink:#082022;
  --user:#25474B; --user-ink:#E8F4F4;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}
}
:root[data-page="lab02"][data-theme="dark"]{--bg:#0C1314; --surface:#141D1E; --surface-2:#1A2526; --ink:#E2ECEC; --muted:#93A6A5; --line:#283637;
  --accent:#4FCFD8; --accent-soft:#16343A; --accent-ink:#082022;
  --user:#25474B; --user-ink:#E8F4F4;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}

/* lab03 */
:root[data-page="lab03"]{--bg:#F2ECEF; --surface:#FFFFFF; --surface-2:#F8F3F5; --ink:#221A1E; --muted:#6A5C63; --line:#E0D3D9;
  --accent:#A12A5E; --accent-soft:#F6DCE7; --accent-ink:#FFFFFF;
  --user:#3B2230; --user-ink:#F8EEF3;
  --crit:#B42318; --crit-soft:#FCE5E2; --warn:#9A5B05; --warn-soft:#FAEFD6; --good:#16773A; --good-soft:#DCF2E3;
  --seg1:#8C7A84; --seg2:#C47A9C; --seg3:#A12A5E; --seg4:#D99A2B; --seg5:#5E8F7A;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root[data-page="lab03"]:not([data-theme="light"]){--bg:#141012; --surface:#1C1619; --surface-2:#241C20; --ink:#EDE3E8; --muted:#A8979F; --line:#352A30;
  --accent:#F07DAF; --accent-soft:#3B1E2C; --accent-ink:#2A0E1B;
  --user:#4A2B3B; --user-ink:#F6EAF0;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  --seg1:#8F7D87; --seg2:#C985A5; --seg3:#F07DAF; --seg4:#E8B04A; --seg5:#78B49A;
  color-scheme:dark;}
}
:root[data-page="lab03"][data-theme="dark"]{--bg:#141012; --surface:#1C1619; --surface-2:#241C20; --ink:#EDE3E8; --muted:#A8979F; --line:#352A30;
  --accent:#F07DAF; --accent-soft:#3B1E2C; --accent-ink:#2A0E1B;
  --user:#4A2B3B; --user-ink:#F6EAF0;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  --seg1:#8F7D87; --seg2:#C985A5; --seg3:#F07DAF; --seg4:#E8B04A; --seg5:#78B49A;
  color-scheme:dark;}

/* lab04 */
:root[data-page="lab04"]{--bg:#ECEEF5; --surface:#FFFFFF; --surface-2:#F4F5FA; --ink:#181B28; --muted:#5B6075; --line:#D6D9E6;
  --accent:#2F4BB8; --accent-soft:#DFE5FA; --accent-ink:#FFFFFF;
  --crit:#B42318; --crit-soft:#FCE5E2; --warn:#9A5B05; --warn-soft:#FAEFD6; --good:#16773A; --good-soft:#DCF2E3;
  --add-bg:#E4F5E8; --add-gut:#C9EBD1; --del-bg:#FBE7E6; --del-gut:#F4CBC8;
  --kw:#7A2BB0; --str:#1F7A4D; --com:#7D8296; --numc:#B2560A;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root[data-page="lab04"]:not([data-theme="light"]){--bg:#0F111A; --surface:#161925; --surface-2:#1C2030; --ink:#E3E6F2; --muted:#9AA0B8; --line:#2A2F44;
  --accent:#8EA2FF; --accent-soft:#232C52; --accent-ink:#0F1533;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  --add-bg:#15291C; --add-gut:#1C3826; --del-bg:#2E1717; --del-gut:#3F1F1F;
  --kw:#D2A8FF; --str:#7EE2A8; --com:#7E859E; --numc:#F5B26B;
  color-scheme:dark;}
}
:root[data-page="lab04"][data-theme="dark"]{--bg:#0F111A; --surface:#161925; --surface-2:#1C2030; --ink:#E3E6F2; --muted:#9AA0B8; --line:#2A2F44;
  --accent:#8EA2FF; --accent-soft:#232C52; --accent-ink:#0F1533;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  --add-bg:#15291C; --add-gut:#1C3826; --del-bg:#2E1717; --del-gut:#3F1F1F;
  --kw:#D2A8FF; --str:#7EE2A8; --com:#7E859E; --numc:#F5B26B;
  color-scheme:dark;}

/* lab05 */
:root[data-page="lab05"]{--bg:#F3EFE8; --surface:#FFFFFF; --surface-2:#F9F6F1; --ink:#211C15; --muted:#685F53; --line:#E1D9CC;
  --accent:#A65A00; --accent-soft:#F8E5C9; --accent-ink:#FFFFFF;
  --crit:#B42318; --crit-soft:#FCE5E2; --warn:#9A5B05; --warn-soft:#FAEFD6; --good:#16773A; --good-soft:#DCF2E3;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root[data-page="lab05"]:not([data-theme="light"]){--bg:#13100C; --surface:#1B1712; --surface-2:#221D17; --ink:#EEE6DA; --muted:#A99E8F; --line:#352E25;
  --accent:#F5A742; --accent-soft:#3A2B15; --accent-ink:#241603;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}
}
:root[data-page="lab05"][data-theme="dark"]{--bg:#13100C; --surface:#1B1712; --surface-2:#221D17; --ink:#EEE6DA; --muted:#A99E8F; --line:#352E25;
  --accent:#F5A742; --accent-soft:#3A2B15; --accent-ink:#241603;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}

/* lab06 */
:root[data-page="lab06"]{--bg:#EFECF4; --surface:#FFFFFF; --surface-2:#F6F4FA; --ink:#1D1826; --muted:#625B70; --line:#DAD4E5;
  --accent:#6B3FA0; --accent-soft:#E9DFF7; --accent-ink:#FFFFFF;
  --v1:#7A7389; --v2:#6B3FA0;
  --crit:#B42318; --crit-soft:#FCE5E2; --warn:#9A5B05; --warn-soft:#FAEFD6; --good:#16773A; --good-soft:#DCF2E3;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root[data-page="lab06"]:not([data-theme="light"]){--bg:#110E16; --surface:#19151F; --surface-2:#201B28; --ink:#ECE7F3; --muted:#A39BB1; --line:#322B3D;
  --accent:#C3A3F0; --accent-soft:#2E2340; --accent-ink:#1A0F2B;
  --v1:#9E97AC; --v2:#C3A3F0;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}
}
:root[data-page="lab06"][data-theme="dark"]{--bg:#110E16; --surface:#19151F; --surface-2:#201B28; --ink:#ECE7F3; --muted:#A39BB1; --line:#322B3D;
  --accent:#C3A3F0; --accent-soft:#2E2340; --accent-ink:#1A0F2B;
  --v1:#9E97AC; --v2:#C3A3F0;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}

/* lab07 */
:root[data-page="lab07"]{--bg:#EAF0F3; --surface:#FFFFFF; --surface-2:#F3F7F9; --ink:#14212A; --muted:#566771; --line:#D2DDE3;
  --accent:#0B6E99; --accent-soft:#D9EDF6; --accent-ink:#FFFFFF;
  --crit:#B42318; --crit-soft:#FCE5E2; --warn:#9A5B05; --warn-soft:#FAEFD6; --good:#16773A; --good-soft:#DCF2E3;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root[data-page="lab07"]:not([data-theme="light"]){--bg:#0C1215; --surface:#141B20; --surface-2:#1A232A; --ink:#E3ECF0; --muted:#97A8B2; --line:#27333B;
  --accent:#5EC4F0; --accent-soft:#16303D; --accent-ink:#06202C;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}
}
:root[data-page="lab07"][data-theme="dark"]{--bg:#0C1215; --surface:#141B20; --surface-2:#1A232A; --ink:#E3ECF0; --muted:#97A8B2; --line:#27333B;
  --accent:#5EC4F0; --accent-soft:#16303D; --accent-ink:#06202C;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}

/* lab08 */
:root[data-page="lab08"]{--bg:#ECEEF0; --surface:#FFFFFF; --surface-2:#F5F6F7; --ink:#1A1F24; --muted:#5D6670; --line:#D6DADF;
  --accent:#3E4C59; --accent-soft:#E1E6EB; --accent-ink:#FFFFFF;
  --a-orc:#3E4C59; --a-ord:#0E6F79; --a-ref:#A65A00; --a-frd:#B42318; --a-com:#2F4BB8; --a-sup:#6B3FA0; --a-cus:#5D6670;
  --crit:#B42318; --crit-soft:#FCE5E2; --warn:#9A5B05; --warn-soft:#FAEFD6; --good:#16773A; --good-soft:#DCF2E3;
  --font-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;}
@media (prefers-color-scheme: dark){
:root[data-page="lab08"]:not([data-theme="light"]){--bg:#0F1214; --surface:#171B1F; --surface-2:#1D2227; --ink:#E5E9EC; --muted:#9AA3AC; --line:#2B3238;
  --accent:#AEBBC7; --accent-soft:#273039; --accent-ink:#11161B;
  --a-orc:#AEBBC7; --a-ord:#4FCFD8; --a-ref:#F5A742; --a-frd:#F58A80; --a-com:#8EA2FF; --a-sup:#C3A3F0; --a-cus:#9AA3AC;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}
}
:root[data-page="lab08"][data-theme="dark"]{--bg:#0F1214; --surface:#171B1F; --surface-2:#1D2227; --ink:#E5E9EC; --muted:#9AA3AC; --line:#2B3238;
  --accent:#AEBBC7; --accent-soft:#273039; --accent-ink:#11161B;
  --a-orc:#AEBBC7; --a-ord:#4FCFD8; --a-ref:#F5A742; --a-frd:#F58A80; --a-com:#8EA2FF; --a-sup:#C3A3F0; --a-cus:#9AA3AC;
  --crit:#F58A80; --crit-soft:#3A1D1A; --warn:#F2BE52; --warn-soft:#352A13; --good:#5BD98A; --good-soft:#15301F;
  color-scheme:dark;}

/* ---------- 2. Shared components ---------- */
*{box-sizing:border-box}
.field label{font-size:13px;font-weight:600}
.btn.small{font-size:13px;padding:6px 11px;border-radius:8px}
.chip.good{background:var(--good-soft);color:var(--good)}
.chip.warn{background:var(--warn-soft);color:var(--warn)}
.chip.mute{background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}
.chip.crit{background:var(--crit-soft);color:var(--crit)}
.stat{background:var(--surface-2);border-radius:10px;padding:10px 12px}
.stat b{display:block;font-family:var(--font-display);font-size:22px;font-variant-numeric:tabular-nums}
.stat span{font-size:12px;color:var(--muted)}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom, 0px));background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:999px;font-size:13.5px;font-weight:500;z-index:20}
.found-chip{font-family:var(--font-mono);font-size:12.5px;padding:6px 12px;border-radius:999px;background:var(--accent-soft);color:var(--ink);font-variant-numeric:tabular-nums}
.mono{font-family:var(--font-mono);font-size:12.5px}
.bubble{padding:10px 14px;border-radius:14px;white-space:pre-wrap;overflow-wrap:anywhere}
.user .bubble{background:var(--user);color:var(--user-ink);border-bottom-right-radius:4px}
.msg.selected .bubble{box-shadow:0 0 0 2px var(--accent)}
.btn.armed{background:var(--crit);color:var(--surface);border-color:var(--crit)}
.tab{font-size:13.5px;font-weight:500;padding:10px 12px;border:none;background:none;color:var(--muted);border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap}
.tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.score-top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px}
.big{font-family:var(--font-display);font-weight:700;font-size:48px;line-height:1;letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.big small{font-size:22px;color:var(--muted);font-weight:500}
.bugrow{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:start;padding:12px 0;border-top:1px solid var(--line)}
.bugrow .id{font-family:var(--font-mono);font-size:12px;color:var(--muted);padding-top:2px}
.bugrow .t{font-weight:600}
.bugrow .t.hidden{font-weight:500;color:var(--muted)}
.bugrow .sub{font-size:13px;color:var(--muted);margin-top:2px}
.bugrow .exp{font-size:13px;margin-top:6px}
.bugrow .exp b{font-weight:600}
.kv{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 16px;margin:0;font-size:13.5px}
.kv dt{color:var(--muted)}
.kv dd{margin:0;overflow-wrap:anywhere}
.doc-head .ttl{font-weight:600}
.quote{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.quote div{font-size:13.5px;padding:8px 10px;border-radius:8px;background:var(--surface-2);white-space:pre-wrap;overflow-wrap:anywhere}
.quote span{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.rcard{border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:13.5px;display:flex;flex-direction:column;gap:4px}
.rcard .top-line{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:space-between}
.copy-box{width:100%;min-height:160px;font-family:var(--font-mono);font-size:12px;margin-top:10px;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--surface-2);color:var(--ink)}
.steps-ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px;max-width:62ch}
.runbar div{padding:8px 10px;border-radius:10px;background:var(--surface-2);font-size:12px;color:var(--muted)}
.runbar b{display:block;font-family:var(--font-mono);font-size:14px;font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums}
.runbar .over b{color:var(--crit)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.rule .rid{font-family:var(--font-mono);font-size:12px;color:var(--muted);padding-top:2px}
.chip.acc{background:var(--accent-soft);color:var(--ink)}
.filters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.flagbtn{all:unset;cursor:pointer;font-size:12.5px;font-weight:600;color:var(--crit);padding:3px 8px;border-radius:6px;white-space:nowrap}
.flagbtn:hover{background:var(--crit-soft)}
.flagbtn:focus-visible{outline:2px solid var(--accent)}
.fcard{border:1px solid var(--line);border-radius:8px;padding:8px 10px;display:flex;flex-direction:column;gap:4px;background:var(--surface);font-size:13.5px;max-width:640px}
.fcard .top-line{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:space-between}
.stack{display:flex;flex-direction:column;gap:8px}

/* ---------- 3. QAGym footer (added by qagym.js on pages without their own footer) ---------- */
.qg-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;margin-top:8px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.qg-foot b{color:var(--ink);font-weight:600}
.qg-privacy{flex-basis:100%;margin:0;font-size:12px;color:var(--muted)}
.qg-foot a,.qg-family a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* ---------- 4. Phones ----------
   Below 720 px every tap target is at least 44 × 44 px. Links inside running text are exempt. The !important is needed
   because each page's own <style> loads after this file and sizes its controls itself; these only ever raise a minimum. */
@media (max-width: 720px){
  button, .btn, select, summary, input:not([type=checkbox]):not([type=radio]):not([type=range]){min-height:44px !important}
  button, .btn{min-width:44px !important}
  .flagbtn{display:inline-flex !important;align-items:center;justify-content:center}
  a.btn, a.go, .live > a, .top-actions a, .nav a, .top a, .toc a, .qg-foot > a, footer p > a:only-child{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
  .check label, label:has(> input[type=checkbox]), label:has(> input[type=radio]){display:inline-flex;align-items:center;min-height:44px}
}