/* Theta Desk — shared stylesheet for guide & blog pages.
   Homepage (index.html) keeps its own inline styles; tokens here match it. */
:root{
  --ink:#0E1A2B; --ink-2:#26384a; --paper:#EEF2F7; --card:#FFFFFF;
  --muted:#5A6B7B; --line:rgba(14,26,43,0.12); --grid:rgba(14,26,43,0.055);
  --green:#1E8A5B; --green-deep:#13633F; --clay:#C2502F; --clay-soft:rgba(194,80,47,0.08); --maxw:1140px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background-color:var(--paper);
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:28px 28px; color:var(--ink);
  font-family:'Newsreader',Georgia,serif; font-size:18px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
h1,h2,h3{font-family:'Space Grotesk',sans-serif; line-height:1.1; letter-spacing:-0.02em; font-weight:600; margin:0;}
.mono{font-family:'IBM Plex Mono',monospace;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}
.eyebrow{font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.18em; text-transform:uppercase; color:var(--green-deep); font-weight:600; display:inline-flex; align-items:center; gap:8px;}
.eyebrow::before{content:""; width:22px; height:1px; background:var(--green);}

/* nav */
header.nav{position:sticky; top:0; z-index:50; backdrop-filter:saturate(140%) blur(8px); background:rgba(238,242,247,0.82); border-bottom:1px solid var(--line);}
.nav-inner{display:flex; align-items:center; justify-content:space-between; height:66px;}
.brand{display:flex; align-items:baseline; gap:9px; text-decoration:none;}
.brand .glyph{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:21px; letter-spacing:-0.03em;}
.brand .glyph b{color:var(--green-deep);}
.brand .tag{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted);}
nav.links{display:flex; align-items:center; gap:30px;}
nav.links a{font-family:'Space Grotesk',sans-serif; font-size:15px; text-decoration:none; color:var(--ink-2); font-weight:500;}
nav.links a:hover{color:var(--green-deep);}
.btn{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:15px; display:inline-flex; align-items:center; gap:8px; cursor:pointer; text-decoration:none; border-radius:2px; border:1px solid var(--ink); padding:10px 18px; transition:transform .15s ease, background .15s ease, color .15s ease;}
.btn-solid{background:var(--ink); color:var(--paper); border-color:var(--ink);}
.btn-solid:hover{background:var(--green-deep); border-color:var(--green-deep); transform:translateY(-1px);}
.btn-sm{padding:8px 14px; font-size:14px;}
nav.links .btn{color:var(--paper);}

/* guide & blog page */
.guidepage{padding:46px 0 72px;}
.crumb{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--muted); display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:30px;}
.crumb a{color:var(--ink-2); text-decoration:none;}
.crumb a:hover{color:var(--green-deep);}
.crumb .here{color:var(--muted);}
.guide-article{max-width:760px;}
.guide-article .eyebrow{margin-bottom:14px;}
.guide-article h1{font-size:clamp(32px,5vw,52px); font-weight:700; margin:0 0 16px;}
.draft-tag{display:inline-block; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--clay); border:1px solid rgba(194,80,47,0.4); border-radius:2px; padding:5px 10px; margin:0 0 26px;}
.guide-body{border-top:1px solid var(--line); padding-top:26px;}
.guide-body p{font-size:18px; color:var(--ink-2); margin:0 0 18px;}
.guide-nav{display:flex; justify-content:space-between; gap:16px; margin-top:40px; padding-top:24px; border-top:1px solid var(--line);}
.gnav{display:flex; flex-direction:column; gap:4px; text-decoration:none; max-width:48%; padding:14px 18px; border:1px solid var(--line); border-radius:3px; background:var(--card); transition:transform .14s ease, border-color .14s ease;}
.gnav:hover{transform:translateY(-2px); border-color:rgba(14,26,43,0.3);}
.gnav span{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted);}
.gnav b{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:16px; color:var(--ink);}
.gnav.next{text-align:right; margin-left:auto; align-items:flex-end;}
.back{margin-top:26px;}
.back a{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:15px; color:var(--green-deep); text-decoration:none;}

/* footer */
footer{border-top:1px solid var(--line); margin-top:30px; padding:40px 0 56px;}
footer .disclaimer{font-size:13.5px; color:var(--muted); line-height:1.7; max-width:64em; margin:0;}
footer .disclaimer strong{color:var(--ink-2); font-family:'Space Grotesk',sans-serif; font-weight:600;}

/* guide article content */
.guide-body h2{font-family:'Space Grotesk',sans-serif; font-size:23px; font-weight:600; margin:34px 0 12px; letter-spacing:-0.01em; color:var(--ink);}
.guide-body h3{font-family:'Space Grotesk',sans-serif; font-size:17px; font-weight:600; margin:24px 0 8px; color:var(--ink);}
.guide-body ul,.guide-body ol{margin:0 0 18px; padding-left:22px; color:var(--ink-2); font-size:18px;}
.guide-body li{margin:0 0 9px;}
.guide-body strong{color:var(--ink); font-weight:600;}
.guide-body a{color:var(--green-deep);}
.guide-body .lede{font-size:21px; color:var(--ink); margin-bottom:20px;}
.table-wrap{overflow-x:auto; margin:6px 0 22px;}
.gtable{width:100%; border-collapse:collapse; font-family:'Newsreader',Georgia,serif; font-size:15.5px; min-width:560px;}
.gtable th,.gtable td{text-align:left; vertical-align:top; padding:11px 14px; border:1px solid var(--line); color:var(--ink-2);}
.gtable th{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--green-deep); background:rgba(14,26,43,0.025); font-weight:600;}
.gtable td:first-child{font-family:'Space Grotesk',sans-serif; font-weight:600; color:var(--ink); white-space:nowrap;}
.callout{border-left:4px solid var(--clay); background:var(--clay-soft); border-radius:4px; padding:16px 20px; margin:0 0 22px;}
.callout p{margin:0; font-size:16px; color:var(--ink);}
.callout .ttl{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--clay); font-weight:600; display:block; margin-bottom:6px;}
.guide-disclaimer{margin-top:30px; font-size:13px; color:var(--muted); border-top:1px solid var(--line); padding-top:16px; line-height:1.6;}

/* blog index */
.page-head{padding:8px 0 4px;}
.post-list{margin-top:30px; border-top:1px solid var(--line);}
.post-item{display:block; padding:24px 2px; border-bottom:1px solid var(--line); text-decoration:none; transition:padding-left .14s ease;}
.post-item:hover{padding-left:12px;}
.post-item .pk{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted);}
.post-item h2{font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:600; margin:6px 0 8px; color:var(--ink); letter-spacing:-0.01em;}
.post-item:hover h2{color:var(--green-deep);}
.post-item p{margin:0; font-size:16px; color:var(--ink-2); max-width:60em;}

@media (max-width:880px){
  nav.links a:not(.btn){display:none;}
  .guide-nav{flex-direction:column;}
  .gnav,.gnav.next{max-width:100%; text-align:left; align-items:flex-start;}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important;} html{scroll-behavior:auto;}}