/* ISSS design system, vendored from hugo-theme-isss (tokens.css + theme.css). Do not edit;
   search-specific styles are in app.css, which uses only these tokens. */
/* ISSS design tokens — mirrors colors_and_type.css from the design system.
   Keep this file in sync with the source of truth. */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,400;0,600;0,700;0,800;0,900;1,700&family=Space+Grotesk:wght@300;400;500;600;700&family=IBM+Plex+Mono:ital,wght@0,400;0,500;0,600;1,400&display=swap');

:root{
  --color-black:#0E0E0E;--color-ink:#1A1A1A;--color-steel-900:#242424;--color-steel-800:#2E2E2E;
  --color-steel-700:#3A3A3A;--color-steel-600:#4A4A4A;--color-steel-500:#666;--color-steel-400:#888;
  --color-steel-300:#AAA;--color-steel-200:#CCC;--color-steel-100:#E5E5E5;
  --color-paper:#F0EBE1;--color-white:#FAFAF8;
  --color-amber-600:#C98A00;--color-amber-500:#E5A000;--color-amber-400:#F5B800;
  --color-amber-300:#FFCC33;--color-amber-200:#FFE280;--color-amber-100:#FFF4CC;
  --color-red:#CC2200;--color-red-light:#FF3311;--color-green:#1A7A3C;--color-green-light:#22A850;
  --color-blue:#0A4A7A;--color-blue-light:#1472C0;

  --bg-base:var(--color-black);--bg-raised:var(--color-ink);--bg-overlay:var(--color-steel-900);--bg-sunken:#080808;
  --fg-primary:var(--color-paper);--fg-secondary:var(--color-steel-300);--fg-muted:var(--color-steel-500);
  --fg-disabled:var(--color-steel-700);--fg-on-amber:var(--color-black);
  --brand-primary:var(--color-amber-400);--brand-hover:var(--color-amber-300);--brand-pressed:var(--color-amber-500);
  --brand-subtle:rgba(245,184,0,.12);--brand-subtle-hover:rgba(245,184,0,.20);
  --border-default:var(--color-steel-800);--border-subtle:var(--color-steel-900);
  --border-strong:var(--color-steel-600);--border-brand:var(--color-amber-400);
  --signal-error:var(--color-red-light);--signal-success:var(--color-green-light);
  --signal-warning:var(--color-amber-400);--signal-info:var(--color-blue-light);

  --font-display:'Barlow Condensed','Arial Narrow',sans-serif;
  --font-body:'Space Grotesk',Arial,sans-serif;
  --font-mono:'IBM Plex Mono','Courier New',monospace;

  --text-xs:.64rem;--text-sm:.8rem;--text-base:1rem;--text-md:1.25rem;--text-lg:1.563rem;
  --text-xl:1.953rem;--text-2xl:2.441rem;--text-3xl:3.052rem;--text-4xl:4.768rem;--text-5xl:7.451rem;
  --leading-tight:1.05;--leading-snug:1.2;--leading-normal:1.5;--leading-relaxed:1.7;
  --tracking-tight:-.03em;--tracking-wide:.05em;--tracking-widest:.15em;

  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;
  --space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--space-32:128px;

  --radius-none:0px;--radius-sm:2px;--radius-md:4px;--radius-lg:6px;--radius-pill:999px;

  --shadow-sm:0 1px 2px rgba(0,0,0,.5);
  --shadow-md:0 2px 8px rgba(0,0,0,.6),0 1px 2px rgba(0,0,0,.4);
  --shadow-lg:0 8px 32px rgba(0,0,0,.7),0 2px 8px rgba(0,0,0,.5);
  --shadow-brand:0 0 0 1px var(--color-amber-400),0 4px 16px rgba(245,184,0,.2);

  --measure:70ch; /* @kind spacing */
  --gutter:clamp(20px,5vw,80px); /* @kind spacing */
  --site-max:1180px; /* @kind spacing */
}

/* ============================================================
   ISSS Hugo Theme — theme.css
   Depends on tokens.css
   ============================================================ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{background:var(--bg-base);color:var(--fg-primary);font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100vh;display:flex;flex-direction:column}
body::before{content:'';position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.4;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E")}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand-primary);text-decoration:none}
a:hover{color:var(--brand-hover);text-decoration:underline;text-underline-offset:3px}
:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}
.container{width:100%;max-width:var(--site-max);margin-inline:auto;padding-inline:var(--gutter)}
.label{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--tracking-widest);text-transform:uppercase;color:var(--fg-muted)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ─── Header ─── */
.site-header{position:sticky;top:0;z-index:100;background:rgba(14,14,14,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--bg-raised)}
.site-header .container{height:60px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand:hover{text-decoration:none}
.brand svg{flex-shrink:0}
.brand-name{font-family:var(--font-display);font-weight:900;font-size:18px;letter-spacing:.02em;text-transform:uppercase;color:var(--fg-primary);line-height:1}
.brand-sub{font-family:var(--font-mono);font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--color-steel-600);margin-top:2px}
.site-nav{display:flex;align-items:center;gap:var(--space-8);list-style:none}
.site-nav a{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-muted);transition:color 150ms}
.site-nav a:hover,.site-nav a[aria-current=page]{color:var(--fg-primary);text-decoration:none}
.nav-toggle{display:none;background:none;border:1px solid var(--border-default);border-radius:var(--radius-sm);color:var(--fg-secondary);width:34px;height:34px;cursor:pointer;font-size:16px;line-height:1}

/* ─── Buttons ─── */
.btn{font-family:var(--font-body);font-weight:600;font-size:14px;border:none;border-radius:var(--radius-sm);padding:9px 18px;cursor:pointer;display:inline-block;transition:background 150ms,border-color 150ms,color 150ms,transform 100ms}
.btn:hover{text-decoration:none}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--brand-primary);color:var(--fg-on-amber)}
.btn-primary:hover{background:var(--brand-hover);color:var(--fg-on-amber)}
.btn-secondary{background:transparent;color:var(--fg-primary);border:1px solid var(--border-strong)}
.btn-secondary:hover{border-color:var(--brand-primary);color:var(--brand-primary)}
.btn-ghost{background:transparent;color:var(--fg-secondary);border:1px solid var(--border-default)}
.btn-ghost:hover{border-color:var(--border-strong);color:var(--fg-primary)}
.btn-sm{font-size:12px;padding:6px 12px}
.btn:disabled{background:var(--border-default);color:var(--fg-disabled);cursor:not-allowed;transform:none}

/* ─── Main / footer scaffold ─── */
main{flex:1}
.site-footer{border-top:1px solid var(--bg-raised);margin-top:var(--space-24)}
.site-footer .container{padding-block:var(--space-10);display:flex;justify-content:space-between;align-items:center;gap:var(--space-6);flex-wrap:wrap}
.footer-copy{font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;color:var(--color-steel-700)}
.footer-links{display:flex;gap:var(--space-6);list-style:none}
.footer-links a{font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--color-steel-700)}
.footer-links a:hover{color:var(--fg-primary);text-decoration:none}

/* ─── Hero ─── */
.hero{padding-block:var(--space-24) var(--space-16);border-bottom:1px solid var(--bg-raised)}
.hero-kicker{font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--brand-primary);margin-bottom:var(--space-6)}
.hero-title{font-family:var(--font-display);font-size:clamp(48px,8vw,112px);font-weight:900;line-height:.95;letter-spacing:var(--tracking-tight);text-transform:uppercase;max-width:14ch}
.hero-title em{font-style:normal;color:var(--brand-primary)}
.hero-lede{font-size:var(--text-md);color:var(--fg-muted);max-width:52ch;line-height:var(--leading-relaxed);margin-top:var(--space-6)}

/* ─── Section heads ─── */
.section{padding-block:var(--space-16)}
.section-kicker{font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--brand-primary);margin-bottom:var(--space-3)}
.section-title{font-family:var(--font-display);font-size:clamp(32px,4vw,52px);font-weight:800;text-transform:uppercase;letter-spacing:var(--tracking-tight);line-height:var(--leading-snug)}

/* ─── Post list ─── */
.post-list{list-style:none;border-top:1px solid var(--border-subtle)}
.post-item{border-bottom:1px solid var(--border-subtle)}
.post-item > a{display:grid;grid-template-columns:120px 1fr auto;gap:var(--space-6);align-items:baseline;padding-block:var(--space-6);color:inherit;transition:background 120ms}
.post-item > a:hover{background:rgba(245,184,0,.03);text-decoration:none}
.post-item time{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--color-steel-700);white-space:nowrap}
.post-item h3{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;text-transform:uppercase;letter-spacing:-.01em;line-height:var(--leading-snug);color:var(--fg-primary)}
.post-item p{font-size:var(--text-sm);color:var(--fg-muted);line-height:var(--leading-normal);margin-top:var(--space-1);max-width:60ch}
.post-item .post-cmt-count{font-family:var(--font-mono);font-size:10px;color:var(--color-steel-700);white-space:nowrap}
.post-item:hover .post-cmt-count{color:var(--brand-primary)}

/* ─── Tags ─── */
.tags{display:flex;gap:var(--space-2);flex-wrap:wrap;list-style:none}
.tag{font-family:var(--font-mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:var(--radius-sm);background:var(--bg-overlay);color:var(--fg-muted);border:1px solid var(--border-default)}
a.tag:hover{color:var(--brand-primary);border-color:var(--brand-primary);text-decoration:none}

/* ─── Article ─── */
.article-header{padding-block:var(--space-16) var(--space-8);border-bottom:1px solid var(--border-subtle)}
.article-meta{display:flex;gap:var(--space-4);align-items:center;flex-wrap:wrap;font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--color-steel-600);margin-bottom:var(--space-5)}
.article-title{font-family:var(--font-display);font-size:clamp(38px,6vw,76px);font-weight:900;line-height:.98;letter-spacing:var(--tracking-tight);text-transform:uppercase;max-width:18ch}
.article-lede{font-size:var(--text-md);color:var(--fg-secondary);line-height:var(--leading-relaxed);max-width:58ch;margin-top:var(--space-5)}
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:var(--space-16);align-items:start;padding-block:var(--space-12)}

/* Prose */
.prose{max-width:var(--measure);font-size:var(--text-base);line-height:var(--leading-relaxed);color:var(--fg-secondary)}
.prose > * + *{margin-top:var(--space-5)}
.prose h2{font-family:var(--font-display);font-size:var(--text-xl);font-weight:800;text-transform:uppercase;letter-spacing:-.01em;color:var(--fg-primary);margin-top:var(--space-12);padding-top:var(--space-5);border-top:1px solid var(--border-subtle)}
.prose h3{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;text-transform:uppercase;color:var(--fg-primary);margin-top:var(--space-8)}
.prose h4{font-family:var(--font-body);font-size:var(--text-base);font-weight:600;color:var(--fg-primary);margin-top:var(--space-6)}
.prose strong{color:var(--fg-primary);font-weight:600}
.prose ul,.prose ol{padding-left:var(--space-5)}
.prose li + li{margin-top:var(--space-2)}
.prose li::marker{color:var(--brand-primary)}
.prose blockquote{border-left:2px solid var(--brand-primary);padding-left:var(--space-5);color:var(--fg-primary);font-family:var(--font-display);font-size:var(--text-md);font-weight:600;text-transform:uppercase;line-height:var(--leading-snug)}
.prose code{font-family:var(--font-mono);font-size:.85em;background:var(--bg-sunken);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:1px 5px;color:var(--brand-primary)}
.prose pre{background:var(--bg-sunken);border:1px solid var(--border-default);border-radius:var(--radius-none);padding:var(--space-5);overflow-x:auto;font-family:var(--font-mono);font-size:var(--text-sm);line-height:var(--leading-relaxed)}
.prose pre code{background:none;border:none;padding:0;color:var(--fg-secondary)}
.prose hr{border:none;border-top:1px solid var(--border-default);margin-block:var(--space-10)}
.prose table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
.prose th{font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-muted);text-align:left;padding:0 var(--space-3) var(--space-3);border-bottom:1px solid var(--border-default)}
.prose td{padding:var(--space-3);border-bottom:1px solid var(--border-subtle)}
.prose figure figcaption{font-family:var(--font-mono);font-size:10px;color:var(--fg-muted);margin-top:var(--space-2)}

/* TOC */
.toc{position:sticky;top:84px;font-size:var(--text-sm)}
.toc-title{font-family:var(--font-mono);font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--color-steel-700);margin-bottom:var(--space-3)}
.toc nav ul{list-style:none;border-left:1px solid var(--border-default)}
.toc nav li a{display:block;padding:5px 0 5px var(--space-4);color:var(--fg-muted);font-size:12px;line-height:1.4;border-left:1px solid transparent;margin-left:-1px;transition:color 120ms,border-color 120ms}
.toc nav li a:hover{color:var(--fg-primary);text-decoration:none}
.toc nav li a.is-active{color:var(--brand-primary);border-left-color:var(--brand-primary)}
.toc nav ul ul a{padding-left:var(--space-8);font-size:11px}

/* Prev/next */
.post-nav{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border-subtle);border-block:1px solid var(--border-subtle);margin-top:var(--space-16)}
.post-nav a{background:var(--bg-base);padding:var(--space-6);color:inherit;transition:background 120ms}
.post-nav a:hover{background:var(--bg-raised);text-decoration:none}
.post-nav .dir{font-family:var(--font-mono);font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--brand-primary);margin-bottom:var(--space-2);display:block}
.post-nav .ttl{font-family:var(--font-display);font-size:var(--text-md);font-weight:700;text-transform:uppercase;color:var(--fg-primary);line-height:var(--leading-snug)}
.post-nav .next{text-align:right}

/* Pagination */
.pagination{display:flex;gap:var(--space-2);justify-content:center;align-items:center;list-style:none;margin-top:var(--space-12)}
.pagination a,.pagination span{font-family:var(--font-mono);font-size:11px;padding:6px 11px;border:1px solid var(--border-default);border-radius:var(--radius-sm);color:var(--fg-muted)}
.pagination a:hover{border-color:var(--border-strong);color:var(--fg-primary);text-decoration:none}
.pagination .active span{background:var(--brand-subtle);border-color:var(--brand-primary);color:var(--brand-primary)}

/* 404 */
.notfound{padding-block:var(--space-32);text-align:center}
.notfound-code{font-family:var(--font-display);font-size:var(--text-5xl);font-weight:900;color:var(--brand-primary);line-height:1}

@media (max-width:900px){
  .article-layout{grid-template-columns:1fr;gap:var(--space-8)}
  .toc{position:static;border-bottom:1px solid var(--border-subtle);padding-bottom:var(--space-5)}
  .post-item > a{grid-template-columns:1fr;gap:var(--space-2)}
  .post-item .post-cmt-count{justify-self:start}
}
@media (max-width:680px){
  .site-nav{position:absolute;top:60px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:var(--bg-raised);border-bottom:1px solid var(--border-default);padding:var(--space-3) var(--gutter);display:none}
  .site-nav.open{display:flex}
  .site-nav li{width:100%}
  .site-nav a{display:block;padding:10px 0;font-size:12px}
  .nav-toggle{display:block}
  .post-nav{grid-template-columns:1fr}
  .post-nav .next{text-align:left}
}
