:root{
    --ink:#101C1B; --ink-2:#2E4645; --paper:#C0D9D9; --surface:#F2F9F9;
    --cool:#D3E4E4; --warm:#CBE1E1;
    --brand:#C0D9D9; --brand-mid:#326262; --brand-deep:#1F4443;
    --rule:#A5C6C6; --muted:#436060; --focus:#1F4443;
    --maxw:1120px; --read:64ch;
    --f-display:'Didot','Bodoni MT','Playfair Display',Georgia,'Times New Roman',serif;
    --f-body:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
    --logo-filter:none;
  }
  @media (prefers-color-scheme:dark){
    :root{
      --ink:#E7F1F0; --ink-2:#B7CECC; --paper:#0C1413; --surface:#15211F;
      --cool:#182726; --warm:#131F1E;
      --brand:#C0D9D9; --brand-mid:#9CC7C7; --brand-deep:#C0D9D9;
      --rule:#27403E; --muted:#93ADAB; --focus:#9CC7C7;
      --logo-filter:invert(1);
    }
  }
  :root[data-theme="dark"]{
    --ink:#E7F1F0; --ink-2:#B7CECC; --paper:#0C1413; --surface:#15211F;
    --cool:#182726; --warm:#131F1E;
    --brand:#C0D9D9; --brand-mid:#9CC7C7; --brand-deep:#C0D9D9;
    --rule:#27403E; --muted:#93ADAB; --focus:#9CC7C7;
    --logo-filter:invert(1);
  }
  :root[data-theme="light"]{
    --ink:#101C1B; --ink-2:#2E4645; --paper:#C0D9D9; --surface:#F2F9F9;
    --cool:#D3E4E4; --warm:#CBE1E1;
    --brand:#C0D9D9; --brand-mid:#326262; --brand-deep:#1F4443;
    --rule:#A5C6C6; --muted:#436060; --focus:#1F4443;
    --maxw:1120px; --read:64ch;
    --f-display:'Didot','Bodoni MT','Playfair Display',Georgia,'Times New Roman',serif;
    --f-body:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
    --logo-filter:none;
  }

  *{box-sizing:border-box}
  body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);
       font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
  .wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(20px,5vw,48px)}
  h1,h2,h3,h4{font-family:var(--f-display);font-weight:500;text-wrap:balance;margin:0;letter-spacing:-.012em}
  h1{font-size:clamp(2.05rem,5vw,3.4rem);line-height:1.09}
  h2{font-size:clamp(1.55rem,3.1vw,2.25rem);line-height:1.16}
  h3{font-size:1.14rem;line-height:1.3}
  p{margin:0;max-width:var(--read)}
  a{color:inherit}
  a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:2px}
  .eyebrow{font-size:.68rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin:0}

  header.site{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--paper) 92%,transparent);
              backdrop-filter:blur(8px);border-bottom:1px solid var(--rule)}
  .bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:14px}
  .brand{display:flex;flex-direction:column;gap:1px;text-decoration:none}
  .brand b{font-family:var(--f-display);font-size:1.02rem;font-weight:600}
  .brand span{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
  nav.site{display:flex;gap:24px;align-items:center}
  nav.site a{font-size:.87rem;text-decoration:none;color:var(--muted);padding-block:4px}
  nav.site a:hover{color:var(--ink)}
  @media (max-width:900px){nav.site{display:none}}

  .hero{padding-block:clamp(54px,9vw,100px) clamp(34px,5vw,52px)}
  .hero p.lede{font-size:clamp(1.04rem,1.9vw,1.22rem);color:var(--ink-2);margin-top:22px}
  .hero .rule{width:56px;height:3px;background:var(--brand-mid);margin-top:30px;border-radius:2px}

  .doors{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;padding-bottom:clamp(46px,7vw,76px)}
  @media (max-width:780px){.doors{grid-template-columns:1fr}}
  .door{background:var(--surface);border:1px solid var(--rule);box-shadow:0 1px 3px rgba(16,28,27,.07);border-radius:4px;
        padding:clamp(24px,3vw,32px);display:flex;flex-direction:column;gap:13px;
        text-decoration:none;transition:border-color .18s ease,transform .18s ease}
  .door:hover{border-color:var(--brand-mid);transform:translateY(-2px)}
  .door h3{font-size:1.38rem}
  .door p{font-size:.96rem;color:var(--muted)}
  .door .go{margin-top:auto;padding-top:8px;font-size:.85rem;font-weight:600;color:var(--brand-mid)}

  section{padding-block:clamp(50px,7vw,80px);border-top:1px solid var(--rule)}
  .sec-head{display:flex;flex-direction:column;gap:12px;margin-bottom:36px}
  .sec-head p{color:var(--ink-2);font-size:1.02rem;max-width:92ch}

  .grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
  .grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
  .grid-1{display:grid;grid-template-columns:1fr;gap:24px}
  .grid-1 > div > p{max-width:none}
  @media (max-width:880px){.grid-2,.grid-3{grid-template-columns:1fr}}

  .card{background:var(--surface);border:1px solid var(--rule);box-shadow:0 1px 2px rgba(16,28,27,.05);border-radius:4px;padding:22px 24px;
        display:flex;flex-direction:column;gap:8px}
  .card h3{font-family:var(--f-body);font-size:.97rem;font-weight:700;letter-spacing:0}
  .card p{font-size:.92rem;color:var(--muted)}

  .domains{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));border:1px solid var(--rule);box-shadow:0 1px 3px rgba(16,28,27,.07);
           border-radius:4px;overflow:hidden;background:var(--surface)}
  @media (max-width:780px){.domains{grid-template-columns:1fr}}
  .domain{padding:20px 24px;border-bottom:1px solid var(--rule)}
  .domain:nth-child(odd){border-right:1px solid var(--rule)}
  .domain:last-child:nth-child(odd){border-right:none;grid-column:1/-1}
  @media (max-width:780px){.domain:nth-child(odd){border-right:none}}
  .domain h4{font-family:var(--f-body);font-size:.91rem;font-weight:700;margin-bottom:5px}
  .domain p{font-size:.88rem;color:var(--muted)}

  ul.scen{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:13px}
  @media (max-width:820px){ul.scen{grid-template-columns:1fr}}
  ul.scen li{display:grid;grid-template-columns:auto 1fr;gap:12px;font-size:.94rem;color:var(--ink-2)}
  ul.scen li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brand-mid);margin-top:.55em}

  .panel{background:var(--cool);border:1px solid var(--rule);border-left:3px solid var(--brand-mid);
         border-radius:4px;padding:24px 26px;display:flex;flex-direction:column;gap:10px}
  .panel.brass{background:var(--warm);border-left-color:var(--brand-deep)}
  .panel h3{font-family:var(--f-body);font-size:1rem;font-weight:700}
  .panel p{max-width:none}
  .panel p{font-size:.93rem;color:var(--ink-2)}

  .argument{background:var(--surface);border:1px solid var(--rule);border-radius:4px;
            padding:clamp(26px,3.4vw,40px);margin-bottom:40px}
  .argument h3{font-size:1.5rem;margin-bottom:14px}
  .argument p{font-size:1.01rem;color:var(--ink-2);margin-bottom:12px;max-width:none}
  .argument p:last-child{margin-bottom:0}

  table.res{width:100%;border-collapse:collapse;font-size:.93rem}
  table.res thead{background:var(--cool)}
  table.res th,table.res td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--rule);vertical-align:top}
  table.res th{font-family:var(--f-body);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
               color:var(--muted);font-weight:700}
  table.res td:first-child{font-weight:700;white-space:nowrap}
  table.res td p{font-size:.93rem;color:var(--muted);max-width:none}
  .tablewrap{overflow-x:auto;border:1px solid var(--rule);border-radius:4px;background:var(--surface)}

  details{border-bottom:1px solid var(--rule);padding:16px 0}
  details summary{cursor:pointer;font-weight:600;font-size:1rem;list-style:none;
                  display:flex;justify-content:space-between;gap:18px;align-items:flex-start}
  details summary::-webkit-details-marker{display:none}
  details summary::after{content:"+";color:var(--brand-mid);font-size:1.2rem;line-height:1;flex:none}
  details[open] summary::after{content:"–"}
  details p{margin-top:12px;font-size:.94rem;color:var(--muted)}

  .placeholder{display:inline-block;background:var(--warm);border:1px dashed var(--brand-mid);
               color:var(--ink);padding:1px 8px;border-radius:3px;font-size:.85rem;font-weight:600}

  footer.site{border-top:1px solid var(--rule);padding-block:30px 34px;background:var(--cool)}
  footer.site .wrap{display:grid;grid-template-columns:auto minmax(0,1fr);gap:30px;align-items:start}
  .foot-text{display:flex;flex-direction:column;gap:7px;min-width:0}
  .foot-name{font-family:var(--f-display);font-size:1.02rem;font-weight:500}
  @media (max-width:760px){footer.site .wrap{grid-template-columns:1fr;gap:18px}}
  footer.site .fine{font-size:.8rem;line-height:1.55;color:var(--muted);max-width:none;margin:0}
  .brand{flex-direction:row;align-items:center;gap:12px}
  .brand .mark{filter:var(--logo-filter);flex:none;display:block}
  .brand .lockup{display:flex;flex-direction:column;gap:0;line-height:1.2}
  .brand .lockup b{font-family:var(--f-display);font-size:1rem;font-weight:500;letter-spacing:.02em}
  .brand .lockup span{font-size:.63rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
  .footer-logo{filter:var(--logo-filter);width:190px;max-width:100%;height:auto;display:block}
  a.textlink{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
  @media (prefers-reduced-motion:reduce){*{transition:none!important}}

  /* multi-page navigation */
  nav.site a.on{color:var(--ink);font-weight:600}
  nav.site a.on::after{content:"";display:block;height:2px;background:var(--brand-mid);
                       margin-top:3px;border-radius:2px}
  .pagenav{display:flex;gap:14px;align-items:center;padding-block:18px 0;font-size:.88rem}
  .pagenav a{color:var(--muted);text-decoration:none}
  .pagenav a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
  .crosslink{margin-top:34px;padding:20px 24px;background:var(--surface);border:1px solid var(--rule);
             border-radius:4px;display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline}
  .crosslink p{font-size:.93rem;color:var(--muted);max-width:none}
  .crosslink a{font-weight:600;color:var(--brand-mid);text-decoration:underline;text-underline-offset:3px}