/* Shared TITAIB foundations. Green conveys action/selection, never decoration. */
:root, :root[data-theme="dark"] {
  color-scheme: dark;
  --bg:#0b0d0c; --bg-soft:#111512;
  --panel:#141815; --panel-2:#1b211d; --panel-3:#242d27;
  --line:#29322c; --line-strong:#45534a;
  --ink:#eef2ef; --ink-soft:#c1cac3; --ink-dim:#9ba89f; --ink-muted:#7d8c82;
  --accent:#42d982; --accent-hover:#6be69b; --accent-2:#2fc571;
  --accent-soft:#42d98212; --accent-glow:transparent; --button-ink:#071b0e;
  --ok:#55d98a; --warn:#e6b45e; --bad:#f18c88;
  --ok-bg:#42d98212; --warn-bg:#e6b45e12; --bad-bg:#f18c8812; --ok-glow:transparent;
  --text:var(--ink); --muted:var(--ink-dim);
  --radius-lg:12px; --radius-md:8px; --radius-sm:5px;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  --mono:"Berkeley Mono","Cascadia Code","SFMono-Regular",Consolas,monospace;
  --shadow-sm:none; --shadow-md:0 8px 30px #00000018; --shadow-lg:0 24px 80px #00000040;
}
:root[data-theme="light"] {
  color-scheme:light;
  --bg:#f9faf9; --bg-soft:#f0f3f0;
  --panel:#ffffff; --panel-2:#edf2ee; --panel-3:#e3ebe5;
  --line:#dce3dd; --line-strong:#b4c1b7;
  --ink:#17241c; --ink-soft:#3c4e42; --ink-dim:#5e7064; --ink-muted:#6b7d71;
  --accent:#147d42; --accent-hover:#106735; --accent-2:#147d42; --button-ink:#ffffff;
  --accent-soft:#147d420a; --ok:#147d42; --warn:#936013; --bad:#b43e38;
  --ok-bg:#147d420a; --warn-bg:#9360130a; --bad-bg:#b43e380a;
}
* {box-sizing:border-box; scrollbar-width:thin; scrollbar-color:var(--line-strong) transparent}
html {background:var(--bg); scroll-padding-top:80px}
body {margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); -webkit-font-smoothing:antialiased}
button,input,textarea,select {font:inherit}
button,a,input,textarea,select,summary {touch-action:manipulation}
button {cursor:pointer}
a {color:inherit; text-decoration:none}
button:disabled {cursor:not-allowed; opacity:.5}
[hidden] {display:none !important}
:focus-visible {outline:2px solid var(--accent); outline-offset:3px}
::selection {background:var(--accent); color:var(--button-ink)}
.site-logo {display:inline-flex; align-items:center; gap:10px; color:var(--ink); font:700 19px/1 var(--sans); letter-spacing:-.6px; flex-shrink:0}
.site-logo svg {width:25px; height:25px; color:var(--accent)}
.site-logo:hover {color:var(--ink); text-decoration:none}
.theme-toggle {display:inline-flex; justify-content:center; align-items:center; flex-shrink:0; width:38px; min-height:38px; padding:9px; border:1px solid var(--line); border-radius:6px; background:transparent; color:var(--ink-soft); box-shadow:none}
.theme-toggle:hover {background:var(--panel-2); color:var(--ink); transform:none; box-shadow:none}
.theme-toggle svg {width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}
.skip-link {position:fixed; top:12px; left:16px; padding:12px 20px; z-index:100; background:var(--accent); color:var(--button-ink); clip-path:inset(100%); pointer-events:none}
.skip-link:focus {clip-path:none; pointer-events:auto}
.eyebrow {font:500 11px/1.5 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--ink-dim)}
.text-link {color:var(--ink); font-weight:500}
.text-link:hover {color:var(--accent)}
@media(prefers-reduced-motion:reduce) {*,*::before,*::after {scroll-behavior:auto !important; animation:none !important; transition:none !important}}
