/* Nirvayo design system v2. Workshop identity: mineral ground, ink green, marigold. Plain CSS, no build step. */
@font-face { font-family:"Bricolage"; font-weight:200 800; font-display:swap; src:url("/static/fonts/Bricolage.woff2") format("woff2"); }
@font-face { font-family:"Instrument Sans"; font-weight:400 700; font-display:swap; src:url("/static/fonts/InstrumentSans.woff2") format("woff2"); }
@font-face { font-family:"Plex Mono"; font-weight:500; font-display:swap; src:url("/static/fonts/PlexMono.woff2") format("woff2"); }

:root {
  --font:"Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display:"Bricolage", "Instrument Sans", ui-sans-serif, system-ui, sans-serif;
  --mono:"Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --background:#f2f5f3; --foreground:#0c2b26; --card:#fff; --primary:#0b6b58; --primary-fg:#fff; --secondary:#f2a516;
  --muted:#e6ece9; --muted-fg:#4a605a; --accent:#e0eee8; --destructive:#c93a30; --ok:#17855e; --warn:#a8620a;
  --border:rgb(12 43 38/.15); --radius:.625rem; --marigold:#f2a516; --ink:#0c2b26;
  --body-bg:#f2f5f3; --section-soft:#e9efec; --section-light:#f2f5f3;
  --panel:#fff; --panel-border:rgb(12 43 38/.14); --panel-shadow:none; --panel-shadow-hover:0 10px 28px rgb(12 43 38/.1);
  --header-bg:rgb(242 245 243/.92); --header-border:rgb(12 43 38/.14);
  --key-shadow:#0c2b26;
}
.dark {
  --background:#0a1815; --foreground:#eaf3f0; --card:#102420; --primary:#52d3b1; --primary-fg:#06231d; --secondary:#f5b335;
  --muted:#112722; --muted-fg:#93ada5; --accent:#16332d; --destructive:#ff7a6e; --ok:#4fd9a0; --warn:#f5b335;
  --border:rgb(180 230 215/.16); --marigold:#f5b335; --ink:#0a1815;
  --body-bg:#0a1815; --section-soft:#0d1f1b; --section-light:#0a1815;
  --panel:#102420; --panel-border:rgb(180 230 215/.16); --panel-shadow-hover:0 10px 28px rgb(0 0 0/.4);
  --header-bg:rgb(10 24 21/.9); --header-border:rgb(180 230 215/.14);
  --key-shadow:#7a5405;
}

* { box-sizing:border-box; border-color:var(--border); }
html { scroll-behavior:smooth; text-rendering:optimizeLegibility; -webkit-text-size-adjust:100%; }
body { margin:0; min-width:320px; overflow-x:clip; font:16px/1.6 var(--font); color:var(--foreground); background:var(--body-bg); -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4 { font-family:var(--display); font-weight:700; letter-spacing:-.035em; text-wrap:balance; margin:0; line-height:1.08; }
p { margin:0; text-wrap:pretty; }
a { color:var(--primary); text-underline-offset:.2em; }
:focus-visible { outline:3px solid var(--marigold); outline-offset:2px; border-radius:4px; }
::selection { background:var(--marigold); color:#0c2b26; }
button { font-family:inherit; }
button:not(:disabled), summary { cursor:pointer; }
section[id] { scroll-margin-top:6rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } }

.site-container { width:100%; max-width:76rem; margin:0 auto; padding-inline:1.25rem; }
@media (min-width:768px) { .site-container { padding-inline:2rem; } }
.section-shell { padding:4.5rem 0; } @media (min-width:768px) { .section-shell { padding:6.5rem 0; } }
.section-soft { background:var(--section-soft); }
.section-light { background:var(--section-light); }
.muted { color:var(--muted-fg); } .fine { color:var(--muted-fg); font-size:.8125rem; margin-top:.9rem; } .ok { color:var(--ok); } .err { color:var(--destructive); }
.row { display:flex; gap:.75rem; flex-wrap:wrap; align-items:center; } .between { justify-content:space-between; }
.eyebrow, .site-eyebrow { color:var(--primary); font-size:.95rem; font-weight:600; }
.section-intro { display:flex; flex-direction:column; align-items:flex-start; gap:.9rem; max-width:44rem; }
.section-intro h2, .h2 { font-size:clamp(2rem,4.2vw,3.1rem); }
.section-intro p:not(.site-eyebrow) { color:var(--muted-fg); font-size:1.08rem; line-height:1.7; max-width:38rem; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.i { flex:none; }

/* Buttons: a tactile key. Marigold face, ink edge. */
.btn, .site-button { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; height:2.75rem; padding:0 1.15rem; border-radius:.6rem; border:1.5px solid var(--ink);
  background:var(--marigold); color:#0c2b26 !important; font:700 .95rem var(--font); letter-spacing:-.01em; text-decoration:none; white-space:nowrap;
  box-shadow:0 3px 0 var(--key-shadow); transition:transform .12s, box-shadow .12s, filter .15s; }
.dark .btn, .dark .site-button { border-color:#a8760a; }
.btn:hover { filter:brightness(1.05); transform:translateY(-1px); box-shadow:0 4px 0 var(--key-shadow); }
.btn:active { transform:translateY(3px); box-shadow:0 0 0 var(--key-shadow); }
.btn.lg { height:3.1rem; padding:0 1.5rem; font-size:1rem; } .btn.small { height:2.15rem; padding:0 .85rem; font-size:.85rem; border-radius:.5rem; box-shadow:0 2px 0 var(--key-shadow); }
.btn.ghost { background:transparent; color:var(--foreground) !important; border:1.5px solid var(--border); box-shadow:none; }
.btn.ghost:hover { border-color:var(--foreground); background:var(--muted); transform:none; filter:none; box-shadow:none; }
.btn.danger { background:transparent; color:var(--destructive) !important; border:1.5px solid color-mix(in srgb,var(--destructive) 50%,transparent); box-shadow:none; }
.btn:disabled { opacity:.6; transform:none; }

/* Header: flat bar */
.hdr { position:fixed; inset:0 0 auto 0; z-index:50; }
.hdr-shell { display:flex; align-items:center; justify-content:space-between; gap:1rem; height:4rem; padding-inline:max(1.25rem, calc((100vw - 76rem)/2 + 2rem));
  border-bottom:1px solid var(--header-border); background:var(--header-bg); backdrop-filter:saturate(160%) blur(10px); -webkit-backdrop-filter:saturate(160%) blur(10px); transition:box-shadow .25s; }
.hdr-shell[data-scrolled="true"] { box-shadow:0 6px 24px rgb(12 43 38/.08); }
.brand { display:inline-flex; align-items:center; gap:.6rem; color:var(--foreground); text-decoration:none; font:800 1.3rem var(--display); letter-spacing:-.05em; min-height:2.75rem; }
.brand-mark { display:grid; place-items:center; width:2rem; height:2rem; border-radius:.5rem; background:var(--ink); color:var(--marigold); }
.dark .brand-mark { background:var(--marigold); color:#0c2b26; }
.nav-links { display:none; gap:.15rem; } @media (min-width:1100px) { .nav-links { display:flex; } }
.nav-links a { position:relative; padding:.5rem .8rem; color:var(--foreground); text-decoration:none; font-size:.95rem; font-weight:500; }
.nav-links a::after { content:""; position:absolute; left:.8rem; right:.8rem; bottom:.15rem; height:3px; border-radius:2px; background:var(--marigold); transform:scaleX(0); transform-origin:left; transition:transform .2s; }
.nav-links a:hover::after, .nav-links a[aria-current]::after { transform:scaleX(1); }
.hdr-actions { display:flex; align-items:center; gap:.5rem; }
.hide-m { display:none; } @media (min-width:1100px) { .hide-m { display:inline-flex; } .menu-btn { display:none !important; } }
.icon-btn { display:inline-grid; place-items:center; width:2.5rem; height:2.5rem; border:1px solid var(--border); border-radius:.6rem; background:transparent; color:var(--foreground); }
.icon-btn:hover { background:var(--muted); }
.cur { display:inline-flex; padding:2px; border:1px solid var(--border); border-radius:.6rem; }
.cur button { border:0; background:transparent; color:var(--muted-fg); padding:.3rem .6rem; border-radius:.45rem; font-size:.78rem; font-weight:700; }
.cur button.on { background:var(--foreground); color:var(--background); }
.kbd-hint { display:none; align-items:center; gap:.4rem; height:2.5rem; padding:0 .7rem; border:1px solid var(--border); border-radius:.6rem; background:transparent; color:var(--muted-fg); font:500 .8rem var(--font); }
.kbd-hint kbd { font:500 .72rem var(--mono); padding:.1rem .35rem; border:1px solid var(--border); border-radius:.3rem; }
@media (min-width:1280px) { .kbd-hint { display:inline-flex; } }

/* Announcement */
.announcement-bar { position:fixed; inset:0 0 auto 0; height:2.4rem; z-index:52; background:var(--ink); color:#eaf3f0; font-size:.85rem; }
.dark .announcement-bar { background:#0f2a24; }
.announcement-content { display:flex; align-items:center; justify-content:center; gap:.75rem; height:2.4rem; text-align:center; }
.announcement-bar a { color:var(--marigold); font-weight:600; }
.badge-accent { display:inline-block; padding:.05rem .5rem; border-radius:.3rem; background:var(--marigold); color:#0c2b26; font-weight:700; font-size:.75rem; margin-right:.35rem; }
.announcement-close { background:none; border:0; color:inherit; opacity:.7; padding:.25rem; display:grid; place-items:center; } .announcement-close:hover { opacity:1; }
.announcement-bar.gone { display:none; }
.hdr { top:var(--ann-h, 0px); }
body:has(.announcement-bar:not(.gone)) { --ann-h:2.4rem; padding-top:2.4rem; }

/* Mobile sheet + dock */
.sheet-bg { position:fixed; inset:0; z-index:60; background:rgb(0 0 0/.5); opacity:0; pointer-events:none; transition:opacity .2s; }
.sheet { position:fixed; top:0; right:0; bottom:0; z-index:61; width:90vw; max-width:23rem; overflow-y:auto; padding:1.25rem; background:var(--background); border-left:1px solid var(--border);
  transform:translateX(100%); transition:transform .25s ease; display:grid; gap:1.25rem; align-content:start; }
body.sheet-open .sheet { transform:none; } body.sheet-open .sheet-bg { opacity:1; pointer-events:auto; }
.sheet a.mlink { display:block; padding:.75rem .9rem; border-radius:.6rem; color:var(--foreground); text-decoration:none; font-weight:500; }
.sheet a.mlink:hover { background:var(--muted); }
.sheet .grp { font-size:.8rem; font-weight:600; color:var(--muted-fg); }
.dock { display:none !important; }
body { padding-bottom:0 !important; }

/* Hero */
.hero { position:relative; background:var(--section-light); border-bottom:1px solid var(--border); overflow:hidden; }
.hero::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.55;
  background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px); background-size:3.5rem 3.5rem;
  mask-image:linear-gradient(180deg,#000 0,transparent 85%); -webkit-mask-image:linear-gradient(180deg,#000 0,transparent 85%); }
.hero .site-container { position:relative; display:grid; gap:3rem; align-items:center; padding-top:8.5rem; padding-bottom:4.5rem; }
@media (min-width:980px) { .hero .site-container { grid-template-columns:1.08fr .92fr; gap:3.5rem; padding-top:9.5rem; padding-bottom:6rem; } }
.pill { display:inline-flex; align-items:center; gap:.45rem; padding:.28rem .75rem; border:1.5px solid var(--ink); border-radius:.4rem; background:var(--marigold); color:#0c2b26; font-size:.82rem; font-weight:700; }
.dark .pill { border-color:#a8760a; }
.hero h1 { margin-top:1.4rem; font-size:clamp(2.7rem,6.6vw,5.2rem); line-height:.98; letter-spacing:-.05em; font-weight:800; }
.hero h1 em { font-style:normal; background:linear-gradient(transparent 62%,color-mix(in srgb,var(--marigold) 70%,transparent) 62% 92%,transparent 92%); }
.hero .lead { margin-top:1.5rem; max-width:34rem; color:var(--muted-fg); font-size:1.18rem; line-height:1.65; }
.hero .cta-row { margin-top:2rem; display:flex; flex-wrap:wrap; gap:.9rem; }
.hero-pills { display:flex; flex-wrap:wrap; gap:.5rem 1.2rem; margin-top:1.75rem; padding:0; }
.hero-pills span { display:inline-flex; gap:.4rem; align-items:center; font-size:.9rem; color:var(--muted-fg); font-weight:500; }
.hero-pills .i { color:var(--ok); }
.ico { display:inline-grid; place-items:center; flex:none; width:2.5rem; height:2.5rem; border-radius:.6rem; background:var(--accent); color:var(--primary); }

/* Bench: the live diagnostic. The one memorable object on the page. */
.bench { position:relative; background:var(--card); border:1.5px solid var(--ink); border-radius:1rem; box-shadow:8px 8px 0 var(--marigold); overflow:hidden; }
.dark .bench { border-color:var(--border); box-shadow:8px 8px 0 #7a5405; }
.bench-head { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.7rem 1rem; border-bottom:1.5px solid var(--ink); background:var(--ink); color:#eaf3f0; font-size:.85rem; font-weight:600; }
.dark .bench-head { border-color:var(--border); background:#14302a; }
.bench-head .dot { display:inline-block; width:.55rem; height:.55rem; border-radius:50%; background:var(--marigold); margin-right:.5rem; }
.bench-head small { font:500 .75rem var(--mono); opacity:.7; }
.bench-body { padding:1.25rem; display:grid; gap:1rem; }
.bench form { display:flex; gap:.5rem; }
.bench input { flex:1; min-width:0; font:500 1rem var(--mono); }
.bench .out { margin:0; max-width:none; }
.bench-score { display:flex; align-items:center; gap:1rem; }
.bench-score b { font:800 2.6rem var(--display); letter-spacing:-.05em; line-height:1; }
.bench-score span { color:var(--muted-fg); font-size:.85rem; }
.bench-note { padding:.6rem 1rem; border-top:1px solid var(--border); font-size:.78rem; color:var(--muted-fg); background:var(--muted); }
.mock-row { display:flex; gap:.7rem; align-items:center; padding:.65rem .8rem; border:1px solid var(--border); border-radius:.55rem; font-size:.9rem; font-weight:500; background:var(--background); }
.mock-row i { width:.65rem; height:.65rem; border-radius:50%; flex:none; } .mock-row i.c { background:var(--destructive); } .mock-row i.w { background:var(--warn); } .mock-row i.o { background:var(--ok); }
.mock-row .fix { margin-left:auto; color:var(--muted-fg); font-size:.78rem; font-weight:400; text-align:right; }
.mock-list { display:grid; gap:.5rem; }
@media (prefers-reduced-motion: no-preference) {
  .hero-copy > * { animation:hero-in .6s cubic-bezier(.22,1,.36,1) both; } .hero-copy > *:nth-child(2){animation-delay:.07s} .hero-copy > *:nth-child(3){animation-delay:.14s} .hero-copy > *:nth-child(4){animation-delay:.21s}
  .bench { animation:bench-in .7s .15s cubic-bezier(.22,1,.36,1) both; }
}
@keyframes hero-in { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
@keyframes bench-in { from { opacity:0; transform:translate(8px,8px); box-shadow:0 0 0 var(--marigold); } to { opacity:1; transform:none; } }

/* Strip: facts as a ruled list, not cards */
.strip { padding:0; border-bottom:1px solid var(--border); background:var(--card); }
.strip ul { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); }
@media (min-width:900px) { .strip ul { grid-template-columns:repeat(4,1fr); } }
.strip li { display:flex; align-items:center; gap:.85rem; padding:1.2rem 1.25rem; border-left:1px solid var(--border); } .strip li:first-child { border-left:0; }
@media (max-width:899px) { .strip li:nth-child(odd) { border-left:0; } .strip li:nth-child(n+3) { border-top:1px solid var(--border); } }
.strip b { display:block; font-size:.95rem; } .strip span.t { font-size:.85rem; color:var(--muted-fg); }

/* Panels, tiles, plans */
.card, .panel { display:block; position:relative; padding:1.5rem; border:1px solid var(--panel-border); border-radius:.9rem; background:var(--panel); color:var(--foreground); text-decoration:none; box-shadow:var(--panel-shadow); transition:border-color .2s, box-shadow .2s, transform .2s; }
a.card:hover, .panel.hover:hover { border-color:var(--foreground); box-shadow:var(--panel-shadow-hover); }
.card p { color:var(--muted-fg); font-size:.95rem; }
.grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
.bento { display:grid; gap:1rem; grid-template-columns:repeat(6,minmax(0,1fr)); margin-top:2.75rem; }
.bento .tile { grid-column:span 2; } .bento .tile:first-child { grid-column:span 3; } .bento .tile:nth-child(2) { grid-column:span 3; }
@media (max-width:960px) { .bento { grid-template-columns:repeat(2,minmax(0,1fr)); } .bento .tile, .bento .tile:first-child, .bento .tile:nth-child(2) { grid-column:span 1; } }
@media (max-width:560px) { .bento { grid-template-columns:1fr; } .bento .tile, .bento .tile:first-child, .bento .tile:nth-child(2) { grid-column:auto; } }
.tile { display:flex; flex-direction:column; gap:.5rem; padding:1.5rem; border-radius:.9rem; border:1px solid var(--panel-border); background:var(--panel); transition:border-color .2s, box-shadow .2s; }
.tile:hover { border-color:var(--foreground); box-shadow:var(--panel-shadow-hover); }
.tile:first-child { background:var(--ink); color:#eaf3f0; border-color:var(--ink); } .tile:first-child p { color:#aac3bb; } .tile:first-child .ico { background:var(--marigold); color:#0c2b26; }
.dark .tile:first-child { background:#14302a; border-color:var(--border); }
.tile .ico { width:2.4rem; height:2.4rem; } .tile h3 { font-size:1.2rem; margin-top:.6rem; letter-spacing:-.02em; } .tile p { font-size:.95rem; line-height:1.6; color:var(--muted-fg); }

.seg { display:inline-flex; padding:3px; border:1px solid var(--border); border-radius:.65rem; background:var(--card); margin:1.25rem 0; }
.seg button { border:0; background:transparent; color:var(--muted-fg); padding:.45rem 1rem; border-radius:.5rem; font-weight:700; font-size:.85rem; } .seg button.on { background:var(--foreground); color:var(--background); }
.plans { display:grid; gap:1.1rem; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); margin-top:1rem; align-items:stretch; }
.plan { position:relative; display:flex; flex-direction:column; gap:.6rem; padding:1.75rem; border:1px solid var(--panel-border); border-radius:1rem; background:var(--panel); }
.plan.featured { border:1.5px solid var(--ink); box-shadow:6px 6px 0 var(--marigold); } .dark .plan.featured { border-color:var(--marigold); box-shadow:6px 6px 0 #7a5405; }
.plan h3 { font-size:1.4rem; } .ribbon { position:absolute; top:-.85rem; left:1.25rem; padding:.2rem .7rem; border-radius:.4rem; background:var(--marigold); color:#0c2b26; border:1.5px solid var(--ink); font-size:.78rem; font-weight:700; }
.price { margin:.5rem 0 .25rem; } .price b { font:800 2.7rem var(--display); letter-spacing:-.05em; } .price small { color:var(--muted-fg); font-size:.88rem; }
.plan ul, .ticks { list-style:none; padding:0; margin:.5rem 0 1rem; display:grid; gap:.55rem; flex:1; }
.plan li, .ticks li { display:flex; gap:.6rem; align-items:flex-start; font-size:.95rem; color:var(--muted-fg); } .plan li .i, .ticks .i { color:var(--ok); margin-top:.2rem; }

/* Forms and check tool */
.split { display:grid; gap:2.5rem; align-items:start; } @media (min-width:900px) { .split { grid-template-columns:1.1fr .9fr; gap:3.5rem; } }
.form { display:grid; gap:1rem; max-width:34rem; }
label { display:grid; gap:.4rem; font-size:.88rem; color:var(--foreground); font-weight:600; } label.check { display:flex; gap:.5rem; align-items:center; font-weight:500; }
input, textarea, select { width:100%; font:inherit; color:var(--foreground); padding:.7rem .9rem; border:1.5px solid var(--border); border-radius:.6rem; background:var(--card); min-height:2.85rem; transition:border-color .15s, box-shadow .15s; }
input:hover, textarea:hover, select:hover { border-color:color-mix(in srgb,var(--foreground) 40%,transparent); }
input:focus, textarea:focus, select:focus { outline:0; border-color:var(--foreground); box-shadow:0 0 0 3px color-mix(in srgb,var(--marigold) 55%,transparent); }
input[type=checkbox] { width:auto; min-height:0; accent-color:var(--primary); } textarea { min-height:7.5rem; } @media (max-width:767px) { input,textarea,select { font-size:16px; } }
.hp { position:absolute; left:-9999px; height:0; width:0; opacity:0; }
.out { margin-top:1rem; display:grid; gap:.6rem; max-width:44rem; }
.f { padding:.75rem 1rem; background:var(--card); border:1px solid var(--panel-border); border-left:5px solid var(--ok); border-radius:.55rem; font-size:.92rem; } .f.critical { border-left-color:var(--destructive); } .f.warning { border-left-color:var(--warn); }
.f small { display:block; color:var(--muted-fg); margin-top:.15rem; }
.report { display:grid; gap:.6rem; } .report .tag { color:var(--muted-fg); font-size:.85rem; font-weight:600; }
.mini { display:flex; gap:.6rem; align-items:center; padding:.6rem .8rem; border-radius:.55rem; background:var(--muted); font-size:.9rem; } .mini i { width:.6rem; height:.6rem; border-radius:50%; } .mini .c { background:var(--destructive); } .mini .w { background:var(--warn); } .mini .o { background:var(--ok); }
.more { display:inline-flex; gap:.4rem; align-items:center; color:var(--primary); font-weight:700; font-size:.92rem; }

/* Steps (a true sequence), faq, cta */
.steps { list-style:none; padding:0; margin:3rem 0 0; display:grid; gap:0; counter-reset:s; } @media (min-width:768px) { .steps { grid-template-columns:repeat(4,1fr); } }
.steps > li { position:relative; padding:0 1.25rem 0 0; } .steps > li + li { padding-left:0; }
.step { display:flex; flex-direction:column; gap:1rem; height:100%; padding:1.4rem; border-radius:.9rem; margin-right:.75rem; }
.step .num { font:500 .85rem var(--mono); color:var(--ink); background:var(--marigold); padding:.15rem .5rem; border-radius:.3rem; } .dark .step .num { color:#0c2b26; }
.step h3 { font-size:1.15rem; } .step p { font-size:.93rem; color:var(--muted-fg); margin-top:.4rem; }
@media (max-width:767px) { .steps > li { padding:0; margin-bottom:.75rem; } .step { margin-right:0; } }
.faq { display:grid; gap:.6rem; max-width:48rem; margin:2.5rem 0 0; }
details.q { border:1px solid var(--panel-border); border-radius:.7rem; background:var(--panel); padding:1rem 1.25rem; } details.q[open] { border-color:var(--foreground); }
details.q summary { font-weight:600; list-style:none; display:flex; justify-content:space-between; gap:1rem; }
details.q summary::-webkit-details-marker { display:none; } details.q summary::after { content:"+"; font-size:1.4rem; line-height:1; color:var(--primary); } details.q[open] summary::after { content:"\2212"; }
details.q p { margin-top:.7rem; color:var(--muted-fg); }
.gateway-cta { padding:3rem 2rem; display:flex; flex-direction:column; align-items:flex-start; gap:1.25rem; border-radius:1.25rem; background:var(--ink); color:#eaf3f0; border:1.5px solid var(--ink); box-shadow:8px 8px 0 var(--marigold); }
.dark .gateway-cta { background:#14302a; border-color:var(--border); box-shadow:8px 8px 0 #7a5405; }
.gateway-cta h2 { font-size:clamp(2rem,4.2vw,3rem); max-width:30rem; } .gateway-cta p { color:#aac3bb; max-width:38rem; }
.gateway-cta .btn.ghost { color:#eaf3f0 !important; border-color:rgb(234 243 240/.4); } .gateway-cta .btn.ghost:hover { background:rgb(255 255 255/.08); border-color:#eaf3f0; }
.page-head { padding-top:8.5rem; padding-bottom:2.5rem; border-bottom:1px solid var(--border); background:var(--section-light); }
.page-head h1 { font-size:clamp(2.3rem,5.2vw,4rem); margin-top:.6rem; letter-spacing:-.045em; } .page-head .lead { margin-top:1rem; max-width:40rem; color:var(--muted-fg); font-size:1.15rem; }
.svc { display:flex; gap:1.25rem; padding:1.75rem 0; border-bottom:1px solid var(--border); } .svc h2 { font-size:1.7rem; } .svc .ticks { margin:.8rem 0; flex:none; }
.prose { max-width:44rem; } .prose h2 { font-size:1.55rem; margin:2.2rem 0 .6rem; } .prose p { margin:.8rem 0; line-height:1.8; }
.narrow { max-width:28rem; margin-inline:auto; }

/* Footer: ink, always dark */
.foot { position:relative; background:#0c2b26; color:#eaf3f0; border-top:4px solid var(--marigold); }
.dark .foot { background:#07130f; }
.foot-glow, .foot-beam, .foot-pg, .wm-wrap { display:none; } .foot-top { display:none; }
.foot-in { max-width:76rem; margin:0 auto; padding:3.5rem 1.25rem 1.75rem; } @media (min-width:768px) { .foot-in { padding:4.5rem 2rem 1.75rem; } }
.foot-grid { display:grid; gap:2.5rem; } @media (min-width:768px) { .foot-grid { grid-template-columns:repeat(2,1fr); } } @media (min-width:1024px) { .foot-grid { grid-template-columns:1.4fr repeat(3,1fr); gap:2rem; } }
.foot .brand { color:#eaf3f0; } .foot .brand-mark { background:var(--marigold); color:#0c2b26; }
.foot .muted, .foot address .muted { color:#93ada5; }
.foot h3 { font:700 .95rem var(--display); letter-spacing:-.01em; color:#eaf3f0; }
.fcol { display:grid; gap:.65rem; align-content:start; } .fcol a, .foot a.fl { color:#aac3bb; text-decoration:none; font-size:.93rem; } .fcol a:hover { color:var(--marigold); }
.chips { display:flex; flex-wrap:wrap; gap:.5rem; margin:1.25rem 0; }
.chip { display:inline-flex; align-items:center; gap:.45rem; min-height:2.5rem; padding:0 .85rem; border:1px solid rgb(234 243 240/.25); border-radius:.55rem; color:#eaf3f0; font-size:.85rem; font-weight:500; text-decoration:none; transition:.15s; }
.chip:hover { border-color:var(--marigold); color:var(--marigold); } .chip .i { color:var(--marigold); }
.foot address { font-style:normal; display:grid; gap:.3rem; font-size:.92rem; } .foot address a { color:#eaf3f0; text-decoration:none; }
.foot-legal { margin-top:3rem; padding-top:1.5rem; border-top:1px solid rgb(234 243 240/.15); display:flex; flex-wrap:wrap; gap:1rem 1.5rem; justify-content:space-between; color:#93ada5; font-size:.85rem; } .foot-legal a { color:#93ada5; text-decoration:none; } .foot-legal a:hover { color:var(--marigold); }

/* Motion: a single reveal for long pages */
.reveal { opacity:0; transform:translateY(16px); transition:opacity .5s ease, transform .5s cubic-bezier(.22,1,.36,1); } .reveal.in { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity:1; transform:none; } }
.no-js .reveal { opacity:1; transform:none; }

/* Dashboards (client area + admin): dense, flat, tool-like */
.dash { display:grid; gap:1.75rem; padding-top:6.5rem; padding-bottom:4rem; } @media (min-width:900px) { .dash { grid-template-columns:14.5rem 1fr; align-items:start; } }
.side { display:grid; gap:.15rem; padding:.6rem; border:1px solid var(--panel-border); border-radius:.9rem; background:var(--panel); position:sticky; top:5.5rem; }
.side a { display:flex; gap:.65rem; align-items:center; padding:.6rem .75rem; border-radius:.55rem; color:var(--foreground); text-decoration:none; font-weight:500; font-size:.93rem; } .side a:hover { background:var(--muted); }
.side a[aria-current] { background:var(--ink); color:#eaf3f0; } .dark .side a[aria-current] { background:var(--marigold); color:#0c2b26; } .side a[aria-current] .i { color:var(--marigold); } .dark .side a[aria-current] .i { color:#0c2b26; }
.side .grp { padding:.6rem .75rem .2rem; font-size:.8rem; font-weight:600; color:var(--muted-fg); }
@media (max-width:899px) { .side { position:static; display:flex; overflow-x:auto; } .side .grp { display:none; } .side a { white-space:nowrap; } }
.dash h1 { font-size:2rem; margin-bottom:1.1rem; } .dash h2 { font-size:1.3rem; margin:1.75rem 0 .75rem; }
.stats { display:grid; gap:.9rem; grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr)); margin-bottom:1.5rem; }
.stat b { display:block; font:800 2rem var(--display); letter-spacing:-.04em; } .stat span { color:var(--muted-fg); font-size:.88rem; }
.table { width:100%; border-collapse:collapse; font-size:.92rem; } .table th { text-align:left; padding:.7rem .9rem; font-size:.82rem; font-weight:600; color:var(--muted-fg); border-bottom:1px solid var(--border); background:var(--muted); }
.table td { padding:.8rem .9rem; border-bottom:1px solid var(--border); vertical-align:top; } .table tr:last-child td { border-bottom:0; } .table tbody tr:hover td { background:color-mix(in srgb,var(--muted) 55%,transparent); } .tablewrap { overflow-x:auto; padding:0; }
.badge { display:inline-block; padding:.12rem .55rem; border-radius:.35rem; font-size:.76rem; font-weight:700; background:var(--muted); color:var(--muted-fg); }
.badge.open { background:color-mix(in srgb,var(--marigold) 30%,transparent); color:var(--foreground); } .badge.in_progress { background:color-mix(in srgb,var(--warn) 20%,transparent); color:var(--warn); } .badge.done { background:color-mix(in srgb,var(--ok) 18%,transparent); color:var(--ok); }
.msg { padding:1rem 1.2rem; border:1px solid var(--panel-border); border-radius:.8rem; background:var(--panel); margin-bottom:.75rem; } .msg.staff { border-color:var(--foreground); box-shadow:4px 4px 0 var(--marigold); } .msg .who { font-size:.82rem; color:var(--muted-fg); margin-bottom:.35rem; } .msg p { white-space:pre-wrap; }
.subnav { display:flex; gap:1rem; flex-wrap:wrap; }
.empty { padding:2.25rem; text-align:center; color:var(--muted-fg); border:1.5px dashed var(--border); border-radius:.9rem; }
.cta { max-width:36rem; padding:1.75rem; border:1px solid var(--panel-border); border-radius:1rem; background:var(--panel); }

/* Command palette */
.palette { position:fixed; inset:0; z-index:90; display:grid; place-items:start center; padding:12vh 1rem 1rem; } .palette[hidden] { display:none; }
.pal-bg { position:absolute; inset:0; background:rgb(6 20 17/.6); backdrop-filter:blur(3px); }
.pal-box { position:relative; width:100%; max-width:34rem; background:var(--card); border:1.5px solid var(--ink); border-radius:1rem; box-shadow:8px 8px 0 var(--marigold); overflow:hidden; }
.dark .pal-box { border-color:var(--border); box-shadow:8px 8px 0 #7a5405; }
.pal-box input { border:0; border-bottom:1px solid var(--border); border-radius:0; min-height:3.4rem; padding-inline:1.1rem; font-size:1.05rem; background:transparent; }
.pal-box input:focus { box-shadow:none; }
.pal-list { max-height:min(22rem,50vh); overflow-y:auto; padding:.4rem; display:grid; }
.pal-list .grp { padding:.6rem .7rem .2rem; font-size:.8rem; font-weight:600; color:var(--muted-fg); }
.pal-list a[data-pal] { display:flex; align-items:center; gap:.7rem; padding:.65rem .7rem; border-radius:.5rem; color:var(--foreground); text-decoration:none; font-weight:500; }
.pal-list a[data-pal].on, .pal-list a[data-pal]:hover { background:var(--marigold); color:#0c2b26; } .pal-list a[hidden] { display:none; }
.pal-list .i { color:var(--primary); } .pal-list a.on .i { color:#0c2b26; }
.pal-foot { display:flex; gap:1rem; padding:.55rem 1rem; border-top:1px solid var(--border); font-size:.78rem; color:var(--muted-fg); background:var(--muted); }
body.pal-open { overflow:hidden; }

/* Status page */
.status-list { display:grid; gap:1rem; max-width:52rem; }
.status-row { display:grid; gap:.9rem; }
.status-name { font:700 1.1rem var(--display); letter-spacing:-.02em; } .status-hint { font-size:.9rem; }
.state { padding:.15rem .6rem; border-radius:.35rem; font-size:.8rem; font-weight:700; background:var(--muted); color:var(--muted-fg); }
.state.up { background:color-mix(in srgb,var(--ok) 18%,transparent); color:var(--ok); } .state.down { background:color-mix(in srgb,var(--destructive) 18%,transparent); color:var(--destructive); }
.bars { display:grid; grid-template-columns:repeat(30,1fr); gap:3px; height:2.2rem; }
.bar { border-radius:2px; background:var(--muted); border:1px solid var(--border); } .bar.ok { background:var(--ok); border-color:transparent; } .bar.warn { background:var(--warn); border-color:transparent; } .bar.down { background:var(--destructive); border-color:transparent; }

.attn { margin-bottom:1.5rem; padding:1rem 1.25rem; border:1.5px solid var(--destructive); border-radius:.8rem; background:color-mix(in srgb,var(--destructive) 8%,var(--panel)); }
.attn b { display:block; margin-bottom:.35rem; } .attn ul { margin:0; padding-left:1.1rem; display:grid; gap:.25rem; font-size:.93rem; }
@media (max-width:560px) { .ann-long { display:none; } .announcement-content { gap:.5rem; font-size:.82rem; } }

/* CMS: editor, media, uptime bars */
.editor { display:grid; gap:1.5rem; } @media (min-width:1100px) { .editor { grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; } }
.editor-preview { padding:1.25rem; border:1px solid var(--panel-border); border-radius:.9rem; background:var(--panel); position:sticky; top:5.5rem; max-height:calc(100vh - 7rem); overflow:auto; }
.prose img { max-width:100%; height:auto; border-radius:.6rem; } .prose figure { margin:1.2rem 0; }
.media-grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fill,minmax(12rem,1fr)); }
.media-item { padding:.75rem; display:grid; gap:.6rem; } .media-item img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:.5rem; background:var(--muted); }
.media-code { font:500 .72rem var(--mono); word-break:break-all; color:var(--muted-fg); user-select:all; }
.media-pick { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.75rem; } .media-thumb { padding:0; border:1.5px solid var(--border); border-radius:.5rem; background:none; overflow:hidden; } .media-thumb:hover { border-color:var(--foreground); }
.media-thumb img { display:block; width:4.5rem; height:3.4rem; object-fit:cover; }
.spark { display:flex; align-items:flex-end; gap:2px; height:1.6rem; margin-top:.5rem; max-width:14rem; }
.spark i { flex:1; min-width:2px; border-radius:1px; background:var(--ok); } .spark i.bad { background:var(--destructive); }