@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Inter:wght@400;500;600;700&family=Rye&display=swap');

:root { --bg:#0d1017; --panel:#131721; --panel-2:#202633; --ink:#bfbdb6; --muted:#858b98; --line:#3a414d; --accent:#e6b450; --accent-ink:#0d1017; --font-body:'Inter',sans-serif; --font-heading:'Rye',serif; --font-mono:'DM Mono',monospace; --radius:12px; --shadow:0 18px 55px #07070d88; --content-width:68ch; --texture-strength:20%; --texture-scope:all; --texture-opacity:.03; --heading-texture:inherit; --heading-texture-strength:45%; --motif-preset:block-w; --motif-glyph:W; --motif-size:63px; --motif-gap:10px; --motif-row-offset:27%; --motif-layer:over; --motif-color-distance:3%; --motif-color:ink; }
* { box-sizing:border-box; scrollbar-color:var(--line) var(--bg); }
html { scroll-behavior:smooth; background:var(--bg); color:var(--ink); }
body { position:relative; min-height:100vh; margin:0; overflow-x:hidden; isolation:isolate; background:var(--bg); color:var(--ink); font-family:var(--font-body); line-height:1.5; }
button,select,input { font:inherit; } a { color:inherit; } h1,h2,h3,h4,p { margin-top:0; } h1,h2,h3,h4 { font-family:var(--font-heading); letter-spacing:-.055em; line-height:.98; } em { color:var(--accent); font-style:normal; }
.grain { position:fixed; z-index:0; inset:0; pointer-events:none; background:url('/static/screenprint.svg?v=5') repeat; background-size:360px 360px; opacity:var(--texture-opacity); }
.page-motif { position:fixed; z-index:0; inset:0; pointer-events:none; background:url('/static/motif.svg?v=1') repeat; background-position:0 var(--motif-row-offset); background-size:292px 181.6px; opacity:.12; }
html[data-theme$="-light"] .page-motif,html[data-theme="paper"] .page-motif { opacity:.025; }
body > :not(.grain):not(.page-motif) { position:relative; z-index:1; }
.wrap { width:min(1120px,calc(100% - 48px)); margin-inline:auto; }
.site-header { height:74px; display:flex; align-items:center; gap:32px; padding:0 max(24px,calc((100% - 1120px)/2)); border-bottom:1px solid var(--line); font:11px var(--font-mono); letter-spacing:.04em; text-transform:uppercase; }
.wordmark { display:flex; align-items:center; gap:9px; font-weight:500; text-decoration:none; white-space:nowrap; }
.mark { display:grid; place-items:center; width:23px; height:23px; border:1px solid var(--accent); border-radius:50%; color:var(--accent); font-size:13px; }
nav { display:flex; gap:25px; margin-right:auto; color:var(--muted); } nav a { text-decoration:none; } nav a:hover { color:var(--ink); }
.theme-toggle { display:flex; align-items:center; gap:8px; color:var(--muted); } .theme-toggle select { max-width:140px; padding:6px 10px; border:1px solid var(--line); border-radius:99px; outline:0; background:var(--panel); color:var(--ink); color-scheme:inherit; font:11px var(--font-mono); } .theme-toggle select:focus { border-color:var(--accent); } .theme-toggle option,.theme-toggle optgroup { background:var(--panel); color:var(--ink); }
.hero { display:grid; grid-template-columns:minmax(0,650px); align-items:center; min-height:590px; } .hero-copy { max-width:650px; }
.eyebrow,.section-label { margin-bottom:18px; color:var(--accent); font:11px var(--font-mono); letter-spacing:.12em; text-transform:uppercase; }
.hero h1 { margin-bottom:28px; font-size:clamp(52px,8vw,92px); font-weight:600; } .lede { max-width:460px; margin-bottom:35px; color:var(--muted); font-size:18px; line-height:1.55; }
.texture-heading { color:transparent; background-image:url('/static/heading-texture.svg?v=1'),linear-gradient(var(--ink),var(--ink)); background-position:center; background-size:1.7em 1.7em,auto; background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; } .texture-heading em { color:transparent; background-image:url('/static/heading-texture.svg?v=1'),linear-gradient(var(--accent),var(--accent)); background-position:center; background-size:1.7em 1.7em,auto; background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; } .texture-heading span { color:transparent; background-image:url('/static/heading-texture.svg?v=1'),linear-gradient(var(--muted),var(--muted)); background-position:center; background-size:1.7em 1.7em,auto; background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.analyzer-form { max-width:650px; } .form-row { display:flex; gap:8px; } .form-row input { min-width:0; flex:1; padding:13px 14px; border:1px solid var(--line); border-radius:var(--radius); outline:0; background:var(--panel); color:var(--ink); } .form-row input:focus { border-color:var(--accent); } .form-row button { display:inline-flex; align-items:center; gap:18px; padding:13px 17px; border:1px solid var(--accent); border-radius:var(--radius); background:var(--accent); color:var(--accent-ink); cursor:pointer; font-size:13px; font-weight:600; } .form-row button span { font-size:17px; }
.agent-note { margin:16px 0 0; color:var(--muted); font:10px var(--font-mono); } .agent-note a { color:var(--accent); } .agent-note code { color:var(--ink); }
.intro-band { border-block:1px solid var(--line); background:var(--panel); } .intro-grid { display:grid; grid-template-columns:1fr 2.1fr 1fr; gap:35px; padding-block:75px; } .intro-grid h2 { margin-bottom:22px; font-size:clamp(31px,4vw,52px); } .intro-grid h2 span { color:var(--muted); } .body-copy { max-width:570px; margin:0; color:var(--muted); } .stats { display:grid; grid-template-columns:auto 1fr; align-content:center; gap:3px 14px; padding-left:28px; border-left:1px solid var(--line); font-family:var(--font-mono); } .stats strong { color:var(--accent); font-size:28px; line-height:1; } .stats span { color:var(--muted); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.section { padding-block:105px; } .section-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:43px; } .section-heading h2 { margin:0; font-size:clamp(40px,6vw,67px); } .section-note { margin:0; color:var(--muted); text-align:right; font:11px/1.65 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; }
.results-stack { min-height:160px; } .result-card { overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:var(--panel); box-shadow:var(--shadow); } .result-summary { display:flex; gap:25px; padding:31px clamp(25px,5vw,62px); } .result-kicker,.report-heading span,.data-panel span,.data-panel small,.tag-heading,.result-footer { color:var(--muted); font:10px var(--font-mono); letter-spacing:.08em; text-transform:uppercase; } .result-summary h3 { margin:0 0 14px; font-size:clamp(30px,4vw,52px); } .result-description { max-width:520px; margin:0; color:var(--muted); }
.report-section { padding:26px clamp(25px,5vw,62px); border-block:1px solid var(--line); } .report-heading,.tag-heading,.cache-age > div { display:flex; align-items:baseline; justify-content:space-between; gap:12px; } .report-heading h4 { margin:0; color:var(--accent); font:11px var(--font-mono); letter-spacing:.12em; text-transform:uppercase; } .data-grid,.tag-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:18px; } .data-panel,.tag-panel { padding:14px; border:1px solid var(--line); border-radius:var(--radius); background:var(--bg); } .data-panel strong,.data-panel small { display:block; margin-top:8px; letter-spacing:0; text-transform:none; } .data-panel strong { color:var(--ink); font:600 15px var(--font-heading); } .cache-age { margin-top:18px; } .cache-age > div { font:10px var(--font-mono); color:var(--muted); } .progress { height:6px; margin-top:6px; overflow:hidden; border-radius:99px; background:var(--bg); } .progress i { display:block; height:100%; border-radius:inherit; background:var(--accent); }
.tag-grid { grid-template-columns:repeat(2,minmax(0,1fr)); padding:26px clamp(25px,5vw,62px); } .tag-heading h4 { margin:0; color:var(--accent); font:11px var(--font-mono); } .tag-panel p { margin:13px 0 0; overflow-wrap:anywhere; color:var(--muted); font-size:13px; } .status { padding:4px 8px; border:1px solid var(--line); border-radius:99px; font-size:9px; } .status.valid { color:#9ece6a; border-color:#6fba83; } .status.invalid,.tag-error { color:#f7768e; border-color:#c66b78; } .tag-error { display:block; margin-top:8px; font-size:11px; }
.result-footer { display:flex; justify-content:space-between; gap:20px; padding:18px clamp(25px,5vw,62px); border-top:1px solid var(--line); } details summary { color:var(--accent); cursor:pointer; } pre { max-width:100%; overflow:auto; margin-top:12px; padding:15px; color:var(--ink); font:11px/1.65 var(--font-mono); text-transform:none; letter-spacing:0; }
.admonition { padding:14px; border-left:3px solid #c66b78; background:var(--panel); color:#f7768e; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:800px) { .site-header { padding-inline:24px; } nav { display:none; } .hero { min-height:500px; gap:35px; padding-block:70px; } .intro-grid { grid-template-columns:1fr; padding-block:55px; } .stats { grid-template-columns:auto 1fr auto 1fr; padding:20px 0 0; border:0; border-top:1px solid var(--line); } .section { padding-block:70px; } .data-grid,.tag-grid { grid-template-columns:1fr; } .section-heading { align-items:start; flex-direction:column; } .section-note { text-align:left; } }
@media (max-width:480px) { .wrap { width:min(100% - 32px,1120px); } .site-header { height:auto; align-items:flex-start; flex-wrap:wrap; padding-block:16px; } .wordmark { width:100%; } .theme-toggle { flex:1; justify-content:space-between; } .theme-toggle select { max-width:none; flex:1; } .hero h1 { font-size:50px; } .lede { font-size:16px; } .form-row { align-items:stretch; flex-direction:column; } .result-footer { align-items:flex-start; flex-direction:column; } }