/* Fourgovia — event display, publication rendition */

@font-face{font-family:"Sofia Sans";font-weight:400;font-display:swap;src:url(fonts/sofia-sans-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Sofia Sans";font-weight:400;font-display:swap;src:url(fonts/sofia-sans-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Sofia Sans";font-weight:500;font-display:swap;src:url(fonts/sofia-sans-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Sofia Sans";font-weight:500;font-display:swap;src:url(fonts/sofia-sans-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Sofia Sans";font-weight:600;font-display:swap;src:url(fonts/sofia-sans-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Sofia Sans";font-weight:600;font-display:swap;src:url(fonts/sofia-sans-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Sofia Sans";font-weight:700;font-display:swap;src:url(fonts/sofia-sans-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Sofia Sans";font-weight:700;font-display:swap;src:url(fonts/sofia-sans-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Sofia Sans Condensed";font-weight:700;font-display:swap;src:url(fonts/sofia-sans-condensed-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Sofia Sans Condensed";font-weight:700;font-display:swap;src:url(fonts/sofia-sans-condensed-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Sofia Sans Condensed";font-weight:800;font-display:swap;src:url(fonts/sofia-sans-condensed-latin-800-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Sofia Sans Condensed";font-weight:800;font-display:swap;src:url(fonts/sofia-sans-condensed-latin-ext-800-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Sofia Sans Semi Condensed";font-weight:600;font-display:swap;src:url(fonts/sofia-sans-semi-condensed-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Sofia Sans Semi Condensed";font-weight:600;font-display:swap;src:url(fonts/sofia-sans-semi-condensed-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Sofia Sans Semi Condensed";font-weight:700;font-display:swap;src:url(fonts/sofia-sans-semi-condensed-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Sofia Sans Semi Condensed";font-weight:700;font-display:swap;src:url(fonts/sofia-sans-semi-condensed-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --bg:#F3F4F1; --surface:#FAFAF8; --cell:#E6EBEF; --cell-2:#EDF0F2;
  --ring:#B9C4CE; --ring-2:#8FA0B1;
  --ink:#0E141A; --ink-2:#26323D; --muted:#55636F; --faint:#93A1AD;
  --sens:#B07800; --sens-ink:#855C00; --sens-tint:#F4E8C8;
  --leave:#0A7EB0; --leave-ink:#0B6E9C; --leave-tint:#DCEDF5;
  --block:#C42B24; --block-tint:#F7E0DE;
  --rule:rgba(14,20,26,.13); --rule-2:rgba(14,20,26,.3);
  --night:#0E141A; --night-ink:#EEF1F4; --night-muted:#8A99A8; --night-line:#26323F;
  --gut:clamp(20px,6.6vw,96px);
  --nav-h:76px;
  --f-cond:"Sofia Sans Condensed","Arial Narrow",sans-serif;
  --f-semi:"Sofia Sans Semi Condensed","Sofia Sans",sans-serif;
  --f-sans:"Sofia Sans",system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 8px);scrollbar-color:var(--ring-2) var(--bg);scrollbar-width:thin;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:400 18px/1.55 var(--f-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-kerning:normal}
::selection{background:#D3DCE3;color:var(--ink)}
img,svg{display:block;max-width:100%}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1.5px}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;border-radius:0}
input,select,textarea{caret-color:var(--ink)}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
ul,ol{list-style:none}
mark{background:none;color:inherit;box-shadow:inset 0 -2px 0 var(--sens);font-weight:600}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:var(--gut);top:-60px;z-index:100;background:var(--ink);color:var(--bg);padding:12px 18px;font:700 14px var(--f-semi);letter-spacing:.12em;text-transform:uppercase;text-decoration:none}
.skip:focus{top:12px}
.i{width:18px;height:18px;flex:none}
.i-to{display:inline-block;width:14px;height:10px;vertical-align:-.05em;margin:0 .15em}

/* labels shared by the whole system */
.blk-l,.b-who,.ctl-l,.demo-note,.legend,thead th,.nav .links a,.nav .lang,.pend-tag,.tag-ill{font-family:var(--f-semi);font-weight:700;letter-spacing:.16em;text-transform:uppercase}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:20;height:var(--nav-h);display:flex;align-items:center;gap:24px;padding:0 var(--gut);background:var(--bg);border-bottom:1px solid var(--rule)}
.brand{display:inline-flex;align-items:center;flex:none;color:var(--ink);text-decoration:none}
.logo{display:block;height:36px;width:auto;flex:none}
.links{flex:1;display:flex;align-items:center}
.links ul{display:flex;gap:clamp(16px,1.9vw,34px);margin-left:clamp(20px,3.4vw,64px)}
.nav .links a{white-space:nowrap;font-size:13px;letter-spacing:.14em;color:var(--muted);text-decoration:none;padding:6px 0;transition:color .2s}
.nav .links a:hover{color:var(--ink)}
.lang{display:flex;align-items:center;gap:6px;font-family:var(--f-semi);font-weight:700;font-size:13px;letter-spacing:.16em;color:var(--faint)}
.lang a{color:var(--muted);text-decoration:none}
.lang a:hover{color:var(--ink)}
.lang b{color:var(--ink)}
.links .lang{margin-left:auto}
.nav-book{font:700 13px var(--f-semi);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--ink);border:1.5px solid var(--ink);padding:12px 18px;white-space:nowrap;transition:background .2s,color .2s}
.nav-book:hover{background:var(--ink);color:var(--bg)}
.nav-menu{display:none;width:44px;height:44px;place-items:center;margin-right:-10px}
.nav-menu>span{display:grid;place-items:center}
.nav-menu>span[hidden]{display:none}
.nav-menu .i{width:22px;height:22px;max-width:none}
.nav .links .menu-book{display:none}

/* ---------- buttons & links ---------- */
.btn{display:inline-flex;align-items:center;gap:14px;background:var(--ink);color:var(--bg);padding:17px 24px;font:700 14px var(--f-semi);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;transition:background .2s}
.btn:hover{background:var(--ink-2)}
.btn .i{transition:transform .3s var(--ease)}
.btn:hover .i{transform:translateX(3px)}
.btn:disabled,.btn[aria-busy="true"]{background:var(--ink-2);cursor:progress}
.link{display:inline-block;font:700 14px var(--f-semi);letter-spacing:.16em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:1.5px solid var(--ring-2);padding-bottom:5px;transition:border-color .2s}
.link:hover{border-color:var(--ink)}

/* ---------- hero ---------- */
.hero{position:relative;min-height:max(calc(100svh - var(--nav-h)),800px);display:flex;align-items:center;overflow:hidden;border-bottom:1px solid var(--rule)}
.hero-copy{position:relative;z-index:3;width:min(600px,44vw);margin-left:var(--gut);padding:36px 0 92px}
.hero h1{font:800 2.25rem/1 var(--f-cond);text-transform:uppercase;letter-spacing:.01em;white-space:nowrap}
.hero-sub{margin-top:10px;font-size:17px;line-height:1.5;color:var(--muted);max-width:52ch}

/* the browser window */
.browser{margin-top:22px;background:var(--surface);border:1px solid var(--ring-2)}
.b-bar{display:flex;align-items:center;gap:14px;height:40px;padding:0 14px;border-bottom:1px solid var(--ring)}
.b-dots{display:flex;gap:6px}
.b-dots i{width:9px;height:9px;border-radius:50%;border:1.2px solid var(--ring-2)}
.b-tab{font:700 13px var(--f-semi);letter-spacing:.04em;white-space:nowrap}
.b-url{flex:1;min-width:0;height:26px;display:flex;align-items:center;padding:0 10px;border:1px solid var(--ring);background:var(--bg);font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.b-thread{height:236px;padding:16px 18px 12px;display:flex;flex-direction:column;gap:12px;overflow:auto}
.b-row{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;align-items:baseline}
.b-who{font-size:11px;color:var(--muted)}
.b-msg{font-size:15px;line-height:1.45;overflow-wrap:anywhere}
.b-rule .b-msg{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px}
.chip{font:700 11px var(--f-semi);letter-spacing:.16em;padding:3px 7px;border:1px solid currentColor;line-height:1.3}
.t-block{color:var(--block)} .t-redact,.t-pass{color:var(--leave-ink)} .t-warn{color:var(--sens-ink)} .t-log{color:var(--ink)}
.b-recv .mk{color:var(--leave-ink);font-weight:600}
.b-recv .nx{color:var(--block);font-weight:700}
.b-recv .sx{color:var(--sens-ink);font-weight:700}
.coach{margin-top:8px;padding:10px 12px;border:1px solid var(--sens);background:var(--sens-tint);font-size:14px;line-height:1.45;display:grid;gap:8px;justify-items:start}
.coach button{font:700 11.5px var(--f-semi);letter-spacing:.14em;text-transform:uppercase;border-bottom:1.5px solid var(--sens-ink);color:var(--sens-ink);padding-bottom:2px}
.b-audit{margin-top:auto;display:flex;align-items:center;gap:8px;font:700 11px var(--f-semi);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.b-audit::before{content:"";width:7px;height:7px;border:1.5px solid var(--ink);background:var(--surface)}
.b-thread [data-step]{transition:opacity .45s var(--ease),transform .45s var(--ease)}
.b-thread.is-run [data-step]{opacity:0;transform:translateY(4px)}
.b-thread.is-run [data-step].on{opacity:1;transform:none}
.b-input{display:flex;height:54px;border-top:1px solid var(--ring)}
.b-input:focus-within{outline:2px solid var(--ink);outline-offset:-2px}
.b-field{position:relative;flex:1;min-width:0;overflow:hidden}
.b-field input,.b-mirror{position:absolute;inset:0;width:100%;padding:0 16px;font:400 15px/54px var(--f-sans);letter-spacing:0;white-space:pre;border:0}
.b-field input{background:transparent;color:transparent;outline:none}
.b-field input::placeholder{color:var(--muted);opacity:1}
.b-field input::selection{background:var(--sens-tint);color:transparent}
.b-mirror{pointer-events:none;color:var(--ink);overflow:hidden}
.b-mirror span{display:inline-block;white-space:pre}
.b-send{display:flex;align-items:center;gap:8px;padding:0 18px;background:var(--ink);color:var(--bg);font:700 12.5px var(--f-semi);letter-spacing:.14em;text-transform:uppercase;transition:background .2s}
.b-send:hover:not(:disabled){background:var(--ink-2)}
.b-send:disabled{background:var(--cell);color:var(--muted);cursor:not-allowed}

.controls{margin-top:16px;display:grid;gap:10px}
.ctl{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:12px}
.ctl-l{font-size:11px;color:var(--muted)}
.seg{display:flex;border:1px solid var(--ring-2);background:var(--surface)}
.seg button{flex:1;height:38px;font:700 12.5px var(--f-semi);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border-right:1px solid var(--ring-2);transition:background .2s,color .2s}
.seg button:last-child{border-right:0}
.seg button:hover{color:var(--ink);background:var(--cell-2)}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.exs{display:flex;flex-wrap:wrap;gap:8px}
.exs button{height:32px;padding:0 12px;border:1px solid var(--ring);background:var(--surface);font:600 13.5px var(--f-sans);transition:border-color .2s}
.exs button:hover{border-color:var(--ink)}
.exs button[aria-pressed="true"]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.demo-note{font-size:11px;color:var(--muted);padding-left:104px}
.hero-ctas{margin-top:26px;display:flex;align-items:center;gap:28px;flex-wrap:wrap}

/* the detector */
.display{position:absolute;top:0;bottom:52px;left:0;right:0;overflow:hidden;z-index:1;container-type:size;pointer-events:none}
#det{position:absolute;width:136cqh;height:136cqh;top:-18cqh;left:calc(75cqw - 68cqh);overflow:visible}
.c1{fill:var(--cell);stroke:var(--ring);stroke-width:.8}
.c2{fill:var(--cell-2);stroke:var(--ring);stroke-width:.8}
.rl{fill:none;stroke:var(--ring);stroke-width:1}
.rd{fill:none;stroke:var(--ring-2);stroke-width:1;stroke-dasharray:1.5 5}
.ll{font:700 11px var(--f-semi);letter-spacing:.2em;fill:var(--muted);stroke:var(--bg);stroke-width:4px;paint-order:stroke;dominant-baseline:middle}
.ln{fill:var(--ink)}
.lp{fill:none;stroke:var(--ring-2);stroke-width:.9;opacity:.62}
.tk{fill:none;stroke-width:2.2;stroke-linecap:round}
.tk.thin{stroke-width:1.1;opacity:.5}
.tk.s{stroke:var(--sens)} .tk.l{stroke:var(--leave)} .tk.dash{stroke:var(--leave);stroke-dasharray:6 6}
.dep{fill:var(--block)}
.hit{fill:var(--surface);stroke-width:1.6} .hit.l{stroke:var(--leave)} .hit.s{stroke:var(--sens)}
.hold{fill:none;stroke:var(--sens);stroke-width:3}
.lit{stroke-width:1}
.lit.s{fill:var(--sens-tint);stroke:var(--sens)}
.lit.l{fill:var(--leave-tint);stroke:var(--leave)}
.trk{transition:opacity .3s var(--ease)}
#evt.iso .trk:not(.on){opacity:.1}
.lab{cursor:pointer;pointer-events:auto;outline:none}
.lab .lb{fill:var(--surface);stroke-width:1.1}
.lab .ld{fill:none;stroke-width:1}
.lab .lk{font:700 11px var(--f-semi);letter-spacing:.18em;fill:var(--muted)}
.lab .lr{font:700 11px var(--f-semi);letter-spacing:.18em}
.lab .lv{font:600 16px var(--f-sans);fill:var(--ink)}
.lab:focus-visible .lb{stroke-width:2.6}
.t-b .lb,.t-b .ld{stroke:var(--block)} .t-b .la,.t-b .lr{fill:var(--block)}
.t-l .lb,.t-l .ld{stroke:var(--leave)} .t-l .la{fill:var(--leave)} .t-l .lr{fill:var(--leave-ink)}
.t-s .lb,.t-s .ld{stroke:var(--sens)} .t-s .la{fill:var(--sens)} .t-s .lr{fill:var(--sens-ink)}
.t-i .lb,.t-i .ld{stroke:var(--ink)} .t-i .la,.t-i .lr{fill:var(--ink)}
.t-m .lb,.t-m .ld{stroke:var(--ring-2)} .t-m .la{fill:var(--ring-2)} .t-m .lr{fill:var(--muted)}

.hero-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px var(--gut);border-top:1px solid var(--rule);background:var(--bg);font:600 13px var(--f-semi);letter-spacing:.04em;color:var(--muted);font-variant-numeric:tabular-nums}
.legend{font-size:11.5px}
.legend{display:flex;gap:20px;flex:none}
.legend li{display:flex;align-items:center;gap:8px}
.sw{display:inline-block;width:16px;height:3px}
.sw.s{background:var(--sens)} .sw.l{background:var(--leave)} .sw.b{background:var(--block)}

/* ---------- sections ---------- */
.sec{padding:clamp(96px,11vw,168px) var(--gut) clamp(80px,9vw,128px);border-bottom:1px solid var(--rule)}
.head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,72px);align-items:end;margin-bottom:clamp(48px,6vw,88px)}
h2{font:800 clamp(2.5rem,4.6vw,4.5rem)/.92 var(--f-cond);text-transform:uppercase;letter-spacing:-.005em;text-wrap:balance}
h3{text-wrap:balance}
.intro{font-size:19px;line-height:1.55;color:var(--muted);max-width:46ch;text-wrap:pretty}
.blk-l{display:flex;align-items:center;gap:12px;margin-bottom:16px;font-size:12px;color:var(--muted)}
figcaption{margin-top:18px;padding-top:12px;border-top:1px solid var(--rule);font-size:14px;color:var(--muted)}
.blk-l+*,figure>figcaption.blk-l{border-top:0}
figure>figcaption.blk-l{margin-top:0;padding-top:0}
.tag-ill{font-size:11px;border:1px solid var(--ring);padding:2px 7px;color:var(--muted);letter-spacing:.14em}

/* the wall */
.wall-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);align-items:start}
.plate{background:var(--surface);border:1px solid var(--ring-2);padding:clamp(24px,3vw,40px)}
.ref{font:700 12px var(--f-semi);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.plate blockquote p{margin-top:18px;font:600 clamp(20px,1.9vw,25px)/1.32 var(--f-sans);text-wrap:pretty}
.ack{margin-top:26px;display:grid;gap:8px;font-size:15px;color:var(--muted)}
.ack li{display:flex;align-items:center;gap:10px}
.ack .i{width:16px;height:16px;color:var(--muted)}
.stream ol{border-top:1px solid var(--ring-2)}
.stream li{display:grid;grid-template-columns:58px minmax(0,220px) minmax(0,1fr);gap:16px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--rule)}
.time{font:700 15px var(--f-semi);font-variant-numeric:tabular-nums}
.st-who{font:700 11.5px var(--f-semi);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.stream p{font-size:17px}
.wall-close{margin-top:clamp(64px,8vw,112px);font:800 clamp(2rem,3.6vw,3.25rem)/.95 var(--f-cond);text-transform:uppercase;max-width:24ch;text-wrap:balance;display:flex;gap:20px;align-items:flex-start}
.wall-close .dep-glyph{flex:none;width:.5em;height:.86em;margin-top:.02em}

/* how it works */
.how-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,72px);align-items:center}
.fig-cross{width:100%;height:auto}
.axis{stroke:var(--ring-2);stroke-width:1}
.tag rect{fill:var(--surface);stroke:var(--ink);stroke-width:1.2}
.tag text{font:700 12px var(--f-semi);letter-spacing:.06em;text-anchor:middle;dominant-baseline:middle;fill:var(--ink)}
.layers li{display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:16px;padding:22px 0;border-top:1px solid var(--rule)}
.layers li:last-child{border-bottom:1px solid var(--rule)}
.num{grid-row:span 2;width:40px;height:28px;display:grid;place-items:center;border:1.2px solid var(--ink);font:700 13px var(--f-semi);letter-spacing:.06em;margin-top:2px}
.layers h3{display:flex;align-items:baseline;gap:12px;font:800 28px/1 var(--f-cond);text-transform:uppercase}
.layers h3 span{font:700 12px var(--f-semi);letter-spacing:.16em;color:var(--muted)}
.layers p{margin-top:8px;font-size:17px;color:var(--muted);max-width:42ch}
.sigs{margin-top:clamp(88px,10vw,150px)}
.sigs-h{font:800 clamp(1.75rem,2.6vw,2.4rem)/1 var(--f-cond);text-transform:uppercase;margin-bottom:28px}
.sig-row{display:grid;grid-template-columns:150px minmax(0,1fr) minmax(0,300px);gap:28px;align-items:center;padding:14px 0;border-top:1px solid var(--rule)}
.sig-head{border-top:0;padding:0 0 4px}
.sigs ul{border-bottom:1px solid var(--rule)}
.sig-name{font:800 26px/1 var(--f-cond);text-transform:uppercase}
.sig-name span{display:block;margin-top:6px;font:700 11.5px var(--f-semi);letter-spacing:.16em}
.w-block{color:var(--block)} .w-redact{color:var(--leave-ink)} .w-warn{color:var(--sens-ink)} .w-log{color:var(--ink)}
.lane,.lane-h{width:100%;height:auto}
.lane-h text{font:700 11px var(--f-semi);letter-spacing:.2em;fill:var(--muted)}
.sig-text{font-size:16px;color:var(--muted)}

/* where it runs */
.flow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,1fr);align-items:center}
.flow-col ul{display:grid}
.from li{display:grid;grid-template-columns:auto minmax(32px,1fr);align-items:center;gap:16px;padding:16px 0;font-size:18px;font-weight:600}
.from li::after{content:"";height:2px;background:var(--sens)}
.from .blk-l,.to .blk-l{margin-bottom:6px}
.to .blk-l{padding-left:calc(clamp(32px,5vw,72px) + 16px)}
.mid{position:relative;border:1.5px solid var(--ink);background:var(--surface);padding:30px 30px 18px}
.mid-cells{position:absolute;left:10px;right:10px;top:8px;width:calc(100% - 20px);height:8px}
.mid-t{font:800 30px/1 var(--f-cond);text-transform:uppercase;letter-spacing:.04em;margin-top:6px}
.mid li{display:grid;gap:3px;padding:14px 0;border-top:1px solid var(--rule)}
.mid li:first-child{margin-top:16px}
.mid strong{font:800 20px/1.1 var(--f-cond);text-transform:uppercase;letter-spacing:.02em}
.mid span{font-size:15.5px;color:var(--muted)}
.to li{display:grid;grid-template-columns:clamp(32px,5vw,72px) minmax(0,1fr);column-gap:16px;align-items:center;padding:12px 0}
.to li::before{content:"";grid-row:span 2;height:2px;background:var(--leave)}
.to strong{font:700 17px/1.3 var(--f-sans)}
.to span{font-size:15px;color:var(--muted);grid-column:2}
.flow figcaption{grid-column:1/-1;margin-top:40px}

/* who */
.readout{width:100%;border-collapse:collapse}
.readout th,.readout td{text-align:left;vertical-align:top;padding:26px 28px 26px 0;border-top:1px solid var(--rule)}
.readout thead th{font-size:12px;color:var(--muted);padding:0 28px 14px 0;border-top:0}
.readout tbody th{width:32%;font:800 clamp(1.6rem,2.4vw,2.25rem)/1 var(--f-cond);text-transform:uppercase}
.readout td:nth-child(2){width:22%;font-weight:600}
.readout td:nth-child(3){color:var(--muted);max-width:52ch}
.readout tbody tr:last-child>*{border-bottom:1px solid var(--rule)}

/* security */
.qa{border-top:1px solid var(--ring-2)}
.qa-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px,4vw,72px);padding:22px 0;border-bottom:1px solid var(--rule)}
.qa dt{font:700 20px/1.25 var(--f-sans)}
.qa dd{font-size:17px;display:grid;gap:10px}
.pending-box{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:12px 14px;border:1.5px dashed var(--ring-2);color:var(--muted);font-size:15px;background:var(--surface)}
.pend-tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--ink)}
.pend-tag .i{width:15px;height:15px}
.security .link{margin-top:40px}

/* manifesto */
.manifesto{position:relative;overflow:hidden;background:var(--night);color:var(--night-ink);padding:clamp(112px,13vw,208px) var(--gut)}
.ring-frag{position:absolute;right:-3%;top:-4%;width:min(700px,62vw);height:auto;pointer-events:none}
.ring-frag path{fill:none;stroke:var(--night-line);stroke-width:1}
.manifesto ol{position:relative;display:grid;gap:clamp(28px,3.4vw,48px);max-width:1120px}
.manifesto li{font:800 clamp(2.2rem,4.8vw,4.75rem)/.95 var(--f-cond);text-transform:uppercase;letter-spacing:-.005em;text-wrap:balance}
.manifesto li:nth-child(2){color:var(--night-muted)}
.manifesto li:last-child::after{content:"";display:inline-block;width:.4em;height:.4em;margin-left:.22em;background:var(--block);vertical-align:.08em}

/* team */
.team .head{align-items:end}
.team .head .pend-tag{justify-self:end}
.people{display:grid;grid-template-columns:repeat(3,minmax(0,300px));gap:clamp(20px,3vw,40px)}
.photo{aspect-ratio:4/5;display:grid;place-items:center;border:1.5px dashed var(--ring-2);background:var(--cell-2)}
.photo span{font:700 11px var(--f-semi);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.p-name{margin-top:18px;font:800 26px/1 var(--f-cond);text-transform:uppercase}
.p-role{margin-top:8px;font:700 12px var(--f-semi);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.p-bio{margin-top:10px;font-size:16px;color:var(--muted)}

/* contact */
.contact{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(36px,6vw,112px);align-items:start;border-bottom:0}
.contact h2{margin-bottom:24px}
.contact h3.blk-l{margin:48px 0 4px}
.next li{position:relative;padding:12px 0 12px 36px;font-size:17px}
.next li::before{content:"";position:absolute;left:5px;top:20px;width:9px;height:9px;border:1.6px solid var(--ink);background:var(--surface);z-index:1}
.next li::after{content:"";position:absolute;left:9px;top:30px;bottom:-20px;width:1.6px;background:var(--ring-2)}
.next li:last-child::after{display:none}
.mform{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px 20px}
.f{display:grid;gap:8px;align-content:start}
.f-wide{grid-column:1/-1}
.f label{font:700 12px var(--f-semi);letter-spacing:.16em;text-transform:uppercase}
.opt{font:500 13px var(--f-sans);letter-spacing:0;text-transform:none;color:var(--muted)}
.f input,.f select,.f textarea{width:100%;font:400 17px/1.4 var(--f-sans);color:var(--ink);background:var(--surface);border:1px solid var(--ring-2);border-radius:0;padding:14px;transition:border-color .2s}
.f input:hover,.f select:hover,.f textarea:hover{border-color:var(--ink-2)}
.f input:focus,.f select:focus,.f textarea:focus{outline:2px solid var(--ink);outline-offset:-1px;border-color:var(--ink)}
.f [aria-invalid="true"]{border-color:var(--block)}
.f textarea{resize:vertical;min-height:100px}
.sel{position:relative}
.sel select{appearance:none;padding-right:44px;cursor:pointer}
.sel::after{content:"";position:absolute;right:18px;top:50%;width:8px;height:8px;border-right:1.6px solid var(--ink);border-bottom:1.6px solid var(--ink);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.err{display:flex;align-items:center;gap:6px;font-size:14.5px;color:var(--block)}
.err:empty{display:none}
.err.hint{color:var(--muted)}
.err .i{width:16px;height:16px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.consent{font-size:14.5px;color:var(--muted)}
.consent a{color:var(--ink)}
.f-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.form-msg{display:flex;gap:8px;align-items:flex-start;font-size:15px;color:var(--block);max-width:46ch}
.form-msg:empty{display:none}
.msent{border:1.5px solid var(--ink);background:var(--surface);padding:clamp(24px,3vw,40px);outline:none}
.msent-t{display:flex;align-items:center;gap:12px;font:800 34px/1 var(--f-cond);text-transform:uppercase}
.msent-t .i{width:26px;height:26px;color:var(--ink)}
.msent>p{margin-top:14px;font-size:17px}
.msent .next{margin-top:18px}

/* footer */
.foot{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto;gap:32px;padding:48px var(--gut) 44px;border-top:1px solid var(--ring-2);font-size:15px;color:var(--muted);align-items:start}
.foot-a p{margin-top:14px;max-width:40ch}
.foot-b{display:grid;gap:8px}
.foot-b a{color:var(--ink)}
.foot-c{display:grid;gap:10px;justify-items:end}
.pending-inline{color:var(--ink);border-bottom:1px dashed var(--ring-2)}

/* legal pages */
.legal{max-width:780px;margin:0 auto;padding:clamp(56px,8vw,112px) var(--gut) 128px}
.legal h1{margin:28px 0;font:800 clamp(2.6rem,5vw,4rem)/.95 var(--f-cond);text-transform:uppercase}
.legal .pending-box{margin-bottom:36px;color:var(--ink)}
.legal section{padding:24px 0;border-top:1px solid var(--rule)}
.legal h2{display:flex;gap:14px;align-items:baseline;font:800 1.6rem/1.1 var(--f-cond)}
.legal h2 span{font:700 12px var(--f-semi);letter-spacing:.12em;color:var(--muted)}
.legal .ph{margin-top:8px;color:var(--muted)}
.notfound section{margin-top:56px}
.notfound .nf-links{margin-top:24px}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .hero{display:block;min-height:0}
  .hero-copy{width:auto;max-width:640px;margin:0 var(--gut);padding:44px 0 32px}
  .display{position:relative;top:auto;bottom:auto;height:auto;aspect-ratio:1;container-type:normal;max-width:760px;margin:0 auto}
  #det{position:static;width:100%;height:100%}
  .hero-cap{position:static;flex-wrap:wrap}
  .head{grid-template-columns:1fr;align-items:start}
  .wall-grid,.how-grid,.contact{grid-template-columns:1fr}
  .sig-row{grid-template-columns:120px minmax(0,1fr)}
  .sig-row .sig-text{grid-column:2}
  .sig-head span:last-child{display:none}
  .flow{grid-template-columns:1fr;max-width:640px}
  .from li{grid-template-columns:1fr}
  .from li::after{display:none}
  .flow-col.from::after,.flow-col.to::before{content:"";display:block;width:2px;height:44px;margin:12px auto}
  .flow-col.from::after{background:var(--sens)}
  .flow-col.to::before{background:var(--leave)}
  .to li{grid-template-columns:1fr}
  .to li::before{display:none}
  .to span{grid-column:1}
  .to .blk-l{padding-left:0}
  .foot{grid-template-columns:1fr 1fr}
  .foot-c{grid-column:1/-1;justify-items:start}
}
@media (max-width:1240px){
  .nav-menu{display:grid}
  .nav-book{margin-left:auto}
  .links{display:none;position:fixed;inset:var(--nav-h) 0 0 0;z-index:19;flex-direction:column;align-items:stretch;padding:24px var(--gut) 40px;background:var(--bg);overflow:auto}
  .nav.open .links{display:flex}
  .links ul{flex-direction:column;gap:0;margin:0}
  .nav .links a{display:block;padding:18px 0;border-bottom:1px solid var(--rule);font-size:15px;color:var(--ink)}
  .links .lang{margin:28px 0 0;font-size:15px}
  .nav .links a.menu-book{display:inline-flex;align-self:flex-start;margin-top:28px;padding:17px 24px;border:0;color:var(--bg);font-size:14px}
}
@media (max-width:700px){
  :root{--nav-h:64px}
  body{font-size:17px}
  .logo{height:30px}
  .nav{gap:12px}
  .nav-book{padding:10px 12px;font-size:12px;letter-spacing:.12em}
  .hero h1{font-size:2rem;white-space:normal}
  .b-thread{height:auto;min-height:260px}
  .b-row{grid-template-columns:1fr;gap:4px}
  .b-tab{display:none}
  .ctl{grid-template-columns:1fr;gap:8px}
  .demo-note{padding-left:0}
  .seg button{font-size:11.5px;letter-spacing:.1em}
  .b-send span{display:none}
  .lab,.d-labels,.fig-cross .tag{display:none}
  .hero-cap{font-size:12.5px}
  .stream li{grid-template-columns:auto 1fr;gap:6px 14px}
  .stream li p{grid-column:1/-1}
  .sig-row{grid-template-columns:1fr;gap:8px}
  .sig-row .sig-text{grid-column:1}
  .sig-head{display:none}
  .sig-name{display:flex;align-items:baseline;gap:12px}
  .sig-name span{margin:0}
  .readout thead{display:none}
  .readout,.readout tbody,.readout tr,.readout th,.readout td{display:block;width:auto}
  .readout tr{padding:22px 0;border-top:1px solid var(--rule)}
  .readout tbody tr:last-child{border-bottom:1px solid var(--rule)}
  .readout th,.readout td,.readout tbody tr:last-child>*{border:0;padding:0}
  .readout td{margin-top:12px}
  .readout td::before{content:attr(data-l);display:block;margin-bottom:2px;font:700 11px var(--f-semi);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
  .qa-row{grid-template-columns:1fr;gap:10px}
  .people{grid-template-columns:repeat(2,minmax(0,1fr))}
  .team .head .pend-tag{justify-self:start}
  .mform{grid-template-columns:1fr}
  .foot{grid-template-columns:1fr}
}
@media (max-width:480px){
  .nav-book{display:none}
  .nav-menu{margin-left:auto}
}
@media (max-width:460px){
  .people{grid-template-columns:1fr}
  .hero-ctas{gap:20px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}
