/* org-ai-assisted.github.io -- distinct identity: access-control / trust boundary.
   Cool steel neutral, mono display voice, one accent (--deny) spent on the boundary.
   No external fonts or assets. AI-Assisted. */
:root{
  --paper:#e9ebef; --panel:#f6f7f9; --ink:#14161a; --ink2:#2b2f37;
  --muted:#5c636e; --line:#d3d7de; --deny:#c32b22; --ok:#2f7d4f;
  --mono:ui-monospace,"SF Mono","Cascadia Code",Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --wrap:1000px;
  --archmask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M3%207.8%2012%203.2%2021%207.8'/%3E%3Cpath%20d='M4%2020.4h16'/%3E%3Cpath%20d='M6.5%2010.6v8M10.5%2010.6v8M14.5%2010.6v8M18.5%2010.6v8'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
code{font-family:var(--mono);font-size:.88em;background:#dfe3e9;border:1px solid var(--line);
  padding:.06em .38em;border-radius:4px;unicode-bidi:isolate}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}
:focus-visible{outline:2px solid var(--deny);outline-offset:2px;border-radius:3px}

/* sticky masthead */
header.nav{position:sticky;top:0;z-index:10;background:rgba(233,235,239,.92);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav > .wrap{display:flex;align-items:center;gap:12px;min-height:58px;position:relative}
.brand{display:inline-flex;align-items:center;text-decoration:none}
.brand .brandmark{height:20px;width:auto;display:block}
/* menu toggle: CSS-only hidden checkbox + label; nav inline on desktop */
.nav .navtoggle{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.nav .menubtn{margin-left:auto;display:inline-block;cursor:pointer;user-select:none;
  font:600 .82rem/1 var(--mono);color:var(--ink);border:1px solid var(--line);
  border-radius:8px;padding:8px 10px}
.nav .menubtn::before{content:"";display:inline-block;width:15px;height:11px;
  vertical-align:-1px;background:linear-gradient(currentColor 0 2px,transparent 2px 4.5px,
  currentColor 4.5px 6.5px,transparent 6.5px 9px,currentColor 9px 11px)}
.nav .navtoggle:focus-visible + .menubtn{outline:2px solid var(--deny);outline-offset:2px}
.nav nav{font:600 .82rem/1 var(--mono);letter-spacing:.02em}
.nav nav a{color:var(--muted);text-decoration:none;white-space:nowrap}
.nav nav a:hover{color:var(--ink)}
.nav nav{display:none}
.nav .navtoggle:checked ~ nav{position:absolute;left:0;right:0;top:100%;display:flex;
  flex-direction:column;align-items:stretch;gap:0;background:var(--paper);z-index:2;
  border-bottom:1px solid var(--line);padding:2px 20px 10px;box-shadow:0 12px 26px rgba(0,0,0,.10)}
.nav .navtoggle:checked ~ nav a{padding:11px 2px;border-top:1px solid var(--line);
  font-size:1rem;white-space:normal;color:var(--ink)}
/* click-outside-to-close: invisible full-viewport label under the panel (no JS) */
.nav .navscrim{display:none}
.nav .navtoggle:checked ~ .navscrim{display:block;position:fixed;inset:0;z-index:1}
@media(min-width:721px){
  .nav .menubtn{display:none}
  .nav nav{display:flex;gap:20px;align-items:center;position:static;flex-wrap:wrap}
}
/* inline "on this page" table of contents (replaces the old second sticky bar) */
.toc{margin:0 0 6px;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:13px 16px}
.toc .toch{margin:0 0 9px;font:600 .66rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.toc ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px}
.toc li{margin:0}
.toc a{font:600 .78rem/1 var(--mono);letter-spacing:.02em;color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:7px}
.toc a::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--deny);display:inline-block;flex:0 0 auto;opacity:.55}
.toc a:hover{color:var(--deny)}
.toc a:hover::before{opacity:1}

/* hero */
.hero{padding:52px 0 38px}
.kicker{font:600 .72rem/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);margin:0 0 16px}
.kicker b{color:var(--deny);font-weight:600}
.hero h1{font-family:var(--mono);font-weight:700;font-size:clamp(1.9rem,7vw,3.5rem);
  line-height:1.02;letter-spacing:-.03em;margin:0 0 8px;white-space:nowrap}
.hero h1 .r{color:var(--deny)}
.hero h1 .tm{font-size:.3em;vertical-align:super;color:var(--muted);letter-spacing:0}
.hero .line{font-family:var(--mono);font-size:clamp(1rem,2.4vw,1.32rem);color:var(--ink2);
  margin:0 0 22px;line-height:1.35}
.hero .line u{text-decoration:none;border-bottom:3px solid var(--deny);padding-bottom:1px}
.hero .sub{max-width:58ch;color:var(--ink2);margin:0 0 26px;font-size:1.04rem}
.hero .sub a{color:var(--ink);text-underline-offset:2px}
.hero .tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.tag{font:600 .68rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:4px 9px}

/* SIGNATURE: the access boundary */
.boundary{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  display:grid;grid-template-columns:1fr 3px 1fr;overflow:hidden}
.zone{padding:20px 22px}
.zone .zh{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 14px}
.zone .zt{font:600 .72rem/1 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.zone.trusted .zt{color:var(--ink)}
.zone .zn{font:600 .64rem/1 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.kv{display:flex;align-items:baseline;gap:.5ch;font:.8rem/1.95 var(--mono)}
.kv .k{color:var(--muted);white-space:nowrap}
.kv .d{flex:1;border-bottom:1px dotted var(--line);transform:translateY(-.28em);min-width:1ch}
.kv .v{color:var(--ink);font-weight:600;white-space:nowrap}
.kv .v.deny{color:var(--deny)}
.divider{background:var(--deny);transform-origin:top;animation:draw .55s ease-out both}
@keyframes draw{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.boundary .cap{grid-column:1/-1;border-top:1px solid var(--line);background:var(--paper);
  font:600 .74rem/1.4 var(--mono);letter-spacing:.02em;color:var(--muted);text-align:center;padding:12px 18px}
.boundary .cap b{color:var(--deny);font-weight:700}

/* plain-language strip */
.whatis{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:42px}
.whatis .wrap{padding:22px}
.whatis p{margin:0;max-width:80ch;color:var(--ink2);font-size:1.02rem}
.whatis b{color:var(--ink)}

/* sections */
section.cat{padding:46px 0 6px}
.cat > .wrap > h2.catname{font:600 .74rem/1 var(--mono);letter-spacing:.13em;
  text-transform:uppercase;color:var(--deny);margin:0 0 6px}
.cat > .wrap > p.catdesc{margin:0 0 20px;color:var(--muted);max-width:66ch}

.issue{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px}
.issue h3{margin:0 0 8px;font-size:1.16rem;letter-spacing:-.01em}
.issue p{margin:0;color:var(--ink2);max-width:76ch;font-size:.97rem}
.fg{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:6px 0 0}

.qa{border-top:1px solid var(--line);padding:18px 2px}
.qa:last-of-type{border-bottom:1px solid var(--line)}
.qa h4{margin:0 0 6px;font-size:1.02rem}
.qa p{margin:0;color:var(--ink2);max-width:76ch;font-size:.97rem}

.repos{list-style:none;padding:0;margin:6px 0 0}
.repos > li{margin:0 0 14px;color:var(--ink2)}
.repos b{font-weight:700;color:var(--ink)}
.repos ul{margin:8px 0 0;padding-left:18px}
.repos ul li{margin:4px 0}

.outro{padding:48px 0 12px}
.outro h2{font-size:1.4rem;letter-spacing:-.02em;margin:0 0 10px}
.outro p{margin:0;color:var(--ink2);max-width:76ch}

/* footer */
footer{border-top:1px solid var(--line);background:var(--panel);color:var(--muted);
  font-size:.9rem;margin-top:44px}
footer .ftop{display:flex;gap:36px 52px;flex-wrap:wrap;justify-content:space-between;
  padding:36px 22px 28px;max-width:var(--wrap);margin:0 auto}
footer .fbrand .ftag{display:inline-flex;align-items:center}
footer .ftag .brandmark{height:20px;width:auto;display:block}
footer .fbrand p{margin:12px 0 0;max-width:26ch;color:var(--muted);
  font:600 .82rem/1.5 var(--mono)}
footer .fcols{display:flex;gap:48px;flex-wrap:wrap}
footer .fcol{display:flex;flex-direction:column;gap:8px}
footer .fcol h4{margin:0 0 3px;font:600 .68rem/1 var(--mono);letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted)}
footer .fcol a{color:var(--ink2);text-decoration:none;font-size:.87rem}
footer .fcol a:hover{color:var(--ink)}
footer .fcol a.self{color:var(--deny);pointer-events:none;cursor:default}
footer .fcol a.self::after{content:" (this site)";font-size:.8em;color:var(--muted)}
footer .fbot{display:flex;gap:18px;flex-wrap:wrap;padding:16px 22px 40px;
  border-top:1px solid var(--line);align-items:center;max-width:var(--wrap);margin:0 auto}
footer .fbot .sp{margin-left:auto}
footer .fcopy{color:var(--muted);font-size:.83rem}
footer .fcopy a{color:var(--ink2)}

/* archive-link icon (Wayback), CSS-masked inline SVG, no external asset */
.arch{display:inline-block;width:.82em;height:.82em;margin-left:3px;vertical-align:-.06em;
  background-color:var(--muted);-webkit-mask:var(--archmask) center/contain no-repeat;
  mask:var(--archmask) center/contain no-repeat;opacity:.75}
.arch:hover{background-color:var(--deny);opacity:1}

/* share row */
footer .fshare{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;max-width:var(--wrap);
  margin:0 auto;padding:6px 22px 14px;font-size:.85rem;color:var(--muted)}
footer .fshare .fshare-l{color:var(--muted);font:600 .72rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase}
footer .fshare .sh{color:var(--ink);text-decoration:none;border:1px solid var(--line);
  border-radius:7px;padding:4px 10px;background:transparent;cursor:pointer;font:inherit}
footer .fshare .sh:hover{border-color:var(--deny);color:var(--deny)}
footer .fshare .sh-msg{color:var(--ok);font-family:var(--mono);font-size:.8rem}

@media (max-width:720px){
  .nav > .wrap{gap:10px}
  .brand .brandmark{height:16px}
  html{scroll-padding-top:76px}
  /* icon-only toggle on mobile: hides the "Menu" label (it had no gap and ran
     into the hamburger); the centered icon reads clearly on its own */
  .nav .menubtn{font-size:0;padding:9px 10px}
  .nav .menubtn::before{margin-right:0}
  .boundary{grid-template-columns:1fr}
  .divider{height:3px;width:auto;transform-origin:left;animation:drawx .55s ease-out both}
  @keyframes drawx{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  .fg{grid-template-columns:1fr}
  footer .ftop{justify-content:flex-start;gap:22px 30px;padding:30px 22px 22px}
  footer .fbrand{flex-basis:100%}
  footer .fcols{display:grid;grid-template-columns:1fr 1fr;gap:20px 24px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .divider{animation:none}
}