/* Lugoda Sentinel — theme: tokens, base, header, nav, footer, layout helpers */
:root{
  color-scheme:dark;
  --red:#e11b22; --red-dark:#b3141a; --ink:#141418; --ink2:#2a2a30;
  --panel:#1f1f25; --panel2:#26262e; --line:#34343d; --muted:#9a9aa6;
  --txt:#f2f2f4; --green:#27c281; --amber:#f5a623; --grey:#6b6b76; --blue:#4ea1f0;
  --shadow:0 8px 30px rgba(0,0,0,.35);
  --r:14px;
  /* serif display face for the wordmark + major headings — evokes Lugoda's own
     printed safety certificates / quotations. System stack, no web-font fetch. */
  --font-display:'Iowan Old Style','Palatino Linotype','Book Antiqua',Georgia,'Times New Roman',serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,'Segoe UI',Roboto,Arial,sans-serif;background:#101014;color:var(--txt);line-height:1.5}

/* display typography — the personality of the page */
.brand h1,.view-head h2,.doc-toolbar h2,.dp-title{font-family:var(--font-display);letter-spacing:.2px}
.view-head h2,.doc-toolbar h2{font-weight:700}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0}
.pad{padding:18px 22px}
.muted{color:var(--muted)}
.row{display:flex;gap:12px;align-items:center}
.wrap{flex-wrap:wrap}
.spacer{flex:1}
.grid2{display:grid;grid-template-columns:1.5fr 1fr;gap:16px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:980px){.grid2{grid-template-columns:1fr}.grid3{grid-template-columns:1fr}}

/* header */
header.top{display:flex;align-items:center;gap:14px;padding:12px 22px;
  background:linear-gradient(90deg,#1b1b20,#232329);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:40}
.shield{width:34px;height:42px;flex:0 0 auto}
.brand h1{font-size:17px;letter-spacing:.5px}
.brand h1 b{color:var(--red)} .brand h1 sup{font-size:9px;color:var(--muted)}
.brand p{margin:2px 0 0;font-size:10px;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase}
.clock{font-variant-numeric:tabular-nums;font-size:14px;color:var(--muted)}
.zica{font-size:11px;font-weight:700;color:#e9c97a;background:#241d0e;border:1px solid #4a3a14;
  padding:5px 11px;border-radius:999px}
.live-pill{display:flex;align-items:center;gap:7px;background:#2a1416;border:1px solid var(--red-dark);
  padding:5px 12px;border-radius:999px;font-size:12px;font-weight:700}
.dot{width:9px;height:9px;border-radius:50%;background:var(--red);animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(225,27,34,.6)}70%{box-shadow:0 0 0 10px rgba(225,27,34,0)}100%{box-shadow:0 0 0 0 rgba(225,27,34,0)}}
@keyframes blink{50%{opacity:.3}}
@keyframes slidein{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* app shell: sticky header on top; left sidebar + content row below */
.shell{display:flex;align-items:flex-start}
aside.sidenav{flex:0 0 236px;width:236px;position:sticky;top:64px;max-height:calc(100vh - 64px);
  overflow-y:auto;padding:10px 10px 26px;background:#15151b;border-right:1px solid var(--line);z-index:30}
aside.sidenav a{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--muted);
  padding:8px 11px;border-radius:9px;white-space:nowrap;transition:.14s;margin:1px 0}
aside.sidenav a b{color:var(--red);font-style:normal;font-weight:800;width:15px;text-align:center;flex:0 0 auto}
aside.sidenav a:hover{background:var(--panel);color:var(--txt)}
aside.sidenav a.active{background:var(--red);color:#fff}
aside.sidenav a.active b{color:#fff}
aside.sidenav a.ainav{margin-top:8px;color:#ff8b8b}
.navgroup{font-size:10px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--muted);padding:14px 11px 5px}
main.view{flex:1;min-width:0}
/* mobile menu button (hidden on desktop) */
.navburger{display:none;background:transparent;border:1px solid var(--line);color:var(--muted);
  width:36px;height:34px;border-radius:9px;cursor:pointer;font-size:17px;line-height:1;flex:0 0 auto}
.navburger:hover{border-color:var(--red);color:var(--txt)}
#scrim-nav{display:none;border:none;padding:0}
@media(max-width:900px){
  .navburger{display:inline-flex;align-items:center;justify-content:center}
  aside.sidenav{position:fixed;left:0;top:0;bottom:0;height:100vh;max-height:none;width:264px;flex-basis:264px;
    transform:translateX(-100%);transition:transform .24s cubic-bezier(.22,.61,.36,1);
    z-index:60;box-shadow:6px 0 34px rgba(0,0,0,.45)}
  body.nav-open aside.sidenav{transform:translateX(0)}
  body.nav-open #scrim-nav{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:55}
}

/* view host */
main.view{min-height:60vh;padding:18px 22px 40px}
.view-head{display:flex;align-items:flex-end;gap:14px;margin-bottom:16px;flex-wrap:wrap}
.view-head h2{font-size:22px}
.view-head .sub{color:var(--muted);font-size:13px}
.line-badge{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;
  padding:3px 10px;border-radius:999px;background:#2a1416;color:#ff9b9b;border:1px solid var(--red-dark)}

/* footer */
footer{padding:14px 22px;color:var(--muted);font-size:11px;border-top:1px solid var(--line);
  display:flex;gap:8px;flex-wrap:wrap;align-items:center}
footer b{color:#cfcfd6}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:7px;background:var(--red);color:#fff;font-weight:600;
  padding:9px 15px;border-radius:10px;font-size:13px;border:1px solid var(--red);cursor:pointer;transition:.15s}
.btn:hover{background:var(--red-dark)}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--txt)}
.btn.ghost:hover{border-color:var(--red)}
.btn.sm{padding:6px 11px;font-size:12px}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* HELD: Lugoda AI is hidden for now (Jul 2026 de-clutter). To restore, delete this
   rule and uncomment the AI line in index.html's sidebar. */
.ai-fab{display:none !important}
