/* Shared page chrome for the WG1 site: theme, base typography, nav, footer, theme toggle.
   Every page links this file, so a chrome fix is made once rather than mirrored per page.
   Page-specific rules stay in that page's own <style> block. */

/* --- Theme -------------------------------------------------------------- */
/* Light is the default. Dark applies from the system preference unless an
   explicit choice is recorded in data-om-theme, which always wins. */
:root{color-scheme:light dark;--bg:#FFFFFF;--surface:#F5F8FA;--ink:#20262E;--muted:#676470;--muted-strong:#57545E;--line:#E2E8EC;--accent:#1F476B;--accent-soft:color-mix(in oklab,#1F476B 10%,var(--bg));}
@media (prefers-color-scheme: dark){
:root:not([data-om-theme="light"]){--bg:#12161B;--surface:#1A2026;--ink:#E6E9ED;--muted:#939AA3;--muted-strong:#939AA3;--line:#262D35;--accent:color-mix(in oklab,#3E8ACC 85%,white);--accent-soft:color-mix(in oklab,#3E8ACC 18%,var(--bg));}
}
:root[data-om-theme="dark"]{color-scheme:dark;--bg:#12161B;--surface:#1A2026;--ink:#E6E9ED;--muted:#939AA3;--muted-strong:#939AA3;--line:#262D35;--accent:color-mix(in oklab,#3E8ACC 85%,white);--accent-soft:color-mix(in oklab,#3E8ACC 18%,var(--bg));}
:root[data-om-theme="light"]{color-scheme:light;}

/* --- Base --------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference){html{scroll-behavior:smooth;}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'Source Sans 3',system-ui,sans-serif;-webkit-font-smoothing:antialiased;}
a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:3px;}
a:hover{color:var(--ink);}
::selection{background:var(--accent-soft);}

/* --- Nav, cards, footer ------------------------------------------------- */
/* Hover states can't live in inline styles, so nav/footer link colors are classed. */
.nav-home{font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:500;letter-spacing:0.06em;color:var(--accent);text-decoration:none;}
.nav-home:hover{color:var(--ink);}
.nav-link{font-family:'IBM Plex Mono',monospace;font-size:12.5px;font-weight:500;color:var(--accent);text-decoration:none;}
.nav-link:hover{color:var(--ink);}
.nav-link-join{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--accent);text-decoration:none;}
.nav-link-join:hover{color:var(--ink);}
.card-link{color:var(--ink);text-decoration-color:var(--line);}
.card-link:hover{color:var(--accent);text-decoration-color:currentColor;}
.card-more{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--accent);text-decoration:none;white-space:nowrap;}
.card-more:hover{color:var(--ink);}
.foot-link{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--muted);}
.foot-link:hover{color:var(--accent);}
.foot-tbd{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--muted);}

/* --- Theme toggle ------------------------------------------------------- */
.theme-toggle{display:inline-flex;align-items:center;color:var(--muted);background:none;border:none;padding:6px;margin:-6px;cursor:pointer;}
.theme-toggle:hover{color:var(--accent);}
.theme-toggle svg{display:block;}
/* Icon shows the effective theme: system preference until an explicit choice is made. */
.theme-toggle .i-dark{display:none;}
@media (prefers-color-scheme: dark){.theme-toggle .i-light{display:none;}.theme-toggle .i-dark{display:block;}}
:root[data-om-theme="light"] .theme-toggle .i-light{display:block;}
:root[data-om-theme="light"] .theme-toggle .i-dark{display:none;}
:root[data-om-theme="dark"] .theme-toggle .i-light{display:none;}
:root[data-om-theme="dark"] .theme-toggle .i-dark{display:block;}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}