/* ===== inner pages ===== */
body.inner{padding-top:0}
.phead{position:relative;padding:190px 0 70px;background:radial-gradient(90% 70% at 80% 0%,#efe4dc 0%,transparent 60%),linear-gradient(180deg,#faf6ef,var(--paper));overflow:hidden}
.phead .marks{inset:150px 22px 18px}
.phead .wrap{position:relative;z-index:2}
.crumb{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);display:flex;gap:10px;align-items:center;margin-bottom:26px}
.crumb a{color:var(--ink-soft);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line-2)}
.crumb a:hover{color:var(--brass)}
.phead h1{font-size:clamp(48px,7.4vw,112px);line-height:.95;letter-spacing:-.04em;max-width:980px;font-variation-settings:"opsz" 144}
.phead h1 em{font-style:italic;font-weight:300;color:var(--brass)}
.phead .sub{font-size:18.5px;color:var(--ink-soft);max-width:620px;margin-top:26px;line-height:1.55}
.phead .meta{display:flex;gap:34px;flex-wrap:wrap;margin-top:40px;padding-top:20px;border-top:1px solid var(--line-2);max-width:760px}
.phead .meta span{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.phead .meta b{display:block;font-family:var(--serif);font-weight:400;font-size:26px;letter-spacing:-.01em;text-transform:none;color:#2e3238;margin-bottom:4px}
.target{position:absolute;right:-90px;top:120px;width:min(520px,46vw);aspect-ratio:1;opacity:.9;z-index:1;pointer-events:none}
.target svg{width:100%;height:100%}
.target .spin{transform-origin:260px 260px;animation:tspin 60s linear infinite}
@keyframes tspin{to{transform:rotate(360deg)}}
.pbody{padding:40px 0 120px}
.pbody .sec:first-child{padding-top:30px}
.h3{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.8vw,36px);color:#2e3238;letter-spacing:-.02em;line-height:1.08}
.note{font-size:13.5px;color:var(--ink-soft)}
.prose p{font-size:16.5px;color:var(--ink);max-width:680px;margin-bottom:14px}

/* toolbar / filters */
.toolbar{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;padding:22px 0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line);margin-bottom:30px;position:sticky;top:96px;background:rgba(245,240,232,.96);z-index:5}
.fgroup{display:flex;flex-direction:column;gap:8px}
.fgroup > span{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.pills{display:flex;gap:6px;flex-wrap:wrap}
.pill{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:transparent;cursor:pointer;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--ink);transition:background .2s,border-color .2s,color .2s}
.pill:hover{border-color:var(--ink)}
.pill[aria-pressed="true"]{background:var(--deep);border-color:var(--deep);color:var(--paper)}
.sel{min-height:40px;border-radius:999px;border:1px solid var(--line-2);background:var(--paper);padding:0 36px 0 14px;font-family:var(--mono);font-size:11.5px;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%234a4f57' fill='none' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;cursor:pointer}
.viewtog{display:flex;border:1px solid var(--line-2);border-radius:999px;padding:3px}
.viewtog button{min-height:36px;min-width:44px;padding:0 12px;border:0;border-radius:999px;background:none;cursor:pointer;font-family:var(--mono);font-size:11px}
.viewtog button[aria-pressed="true"]{background:var(--brass);color:var(--paper)}
.count{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--ink-soft);margin-bottom:18px}

/* protocol cards */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.pcard{padding:24px;display:flex;flex-direction:column;gap:14px;min-height:300px;background:linear-gradient(180deg,#fbf8f3,#f3ede3);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.pcard:hover{transform:translateY(-4px);box-shadow:0 30px 60px -40px rgba(26,30,35,.6)}
.pcard .top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.cls{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--brass);border:1px solid var(--brass-soft);background:var(--brass-soft);border-radius:6px;padding:4px 8px}
.pcard h3{font-size:30px}
.pcard .chains{font-size:13px;color:var(--ink-soft)}
.pcard .score{display:flex;align-items:baseline;gap:8px;margin-top:auto}
.pcard .score b{font-family:var(--serif);font-weight:400;font-size:34px;color:#2e3238}
.pcard .score span{font-family:var(--mono);font-size:11px;color:var(--ink-soft)}
.pcard .wk{font-size:12.5px;color:var(--ink-soft);padding-top:12px;border-top:1px dashed var(--line-2);display:flex;justify-content:space-between;gap:10px}
.pcard .wk b{color:var(--brass);font-weight:600}
.pcard .go{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--ink);display:flex;justify-content:space-between;align-items:center}
.ptable{width:100%;border-collapse:collapse;font-size:14px}
.ptable th{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);font-weight:500;text-align:left;padding:12px 10px;border-bottom:1px solid var(--line-2)}
.ptable td{padding:16px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.ptable tr:hover td{background:#fff6}
.ptable a{font-family:var(--serif);font-size:20px;color:#2e3238}
.tablewrap{overflow-x:auto}
.emptybox{padding:44px;text-align:center;border:1.5px dashed var(--line-2);border-radius:20px;display:flex;flex-direction:column;align-items:center;gap:14px}
.emptybox .h3{max-width:520px}
.emptybox p{color:var(--ink-soft);max-width:480px}

/* crash report */
.rhead{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:end}
.seal{justify-self:end;width:230px;aspect-ratio:1;border-radius:50%;position:relative;display:grid;place-items:center;background:radial-gradient(circle,#fbf8f3 58%,transparent 59%),conic-gradient(var(--brass) var(--deg,0deg),var(--line) 0)}
.seal::after{content:"";position:absolute;inset:14px;border-radius:50%;border:1px dashed var(--line-2)}
.seal-in{text-align:center;position:relative;z-index:1}
.seal-in b{display:block;font-family:var(--serif);font-weight:400;font-size:64px;line-height:1;color:#2e3238}
.seal-in span{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.seal-in .stars{margin-top:10px}
.blk{padding:34px 0;border-top:1px solid var(--line-2);display:grid;grid-template-columns:260px 1fr;gap:40px}
.blk > h2{font-size:28px;line-height:1.1}
.blk > h2 small{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--brass);margin-bottom:10px;text-transform:uppercase}
.areas.big .area{grid-template-columns:200px 1fr 48px;font-size:15px}
.areas.big .bar{height:12px}
.areas.big .v{font-size:15px}
.anote{grid-column:1/-1;font-size:13px;color:var(--ink-soft);margin:-4px 0 6px}
.sgrid{display:grid;gap:10px}
.sitem{border-radius:14px;border:1px solid var(--line);background:#fbf8f3;overflow:hidden}
.sitem summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:180px 140px 1fr 30px;gap:16px;align-items:center;padding:16px 18px;min-height:56px}
.sitem summary::-webkit-details-marker{display:none}
.sitem summary .n{font-family:var(--serif);font-size:20px;color:#2e3238}
.sitem summary .pm{font-size:13.5px;color:var(--ink-soft)}
.sitem summary .pl{font-family:var(--mono);font-size:16px;text-align:right;transition:transform .3s var(--ease)}
.sitem[open] summary .pl{transform:rotate(45deg)}
.res{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;padding:6px 10px;border-radius:999px;justify-self:start}
.res i{font-style:normal;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:9px}
.res.held{background:var(--held-soft);color:var(--held)}.res.held i{background:var(--held)}
.res.degraded{background:var(--degraded-soft);color:#7a5405}.res.degraded i{background:var(--degraded)}
.res.failed{background:var(--failed-soft);color:var(--failed)}.res.failed i{background:var(--failed)}
.sdet{padding:0 18px 18px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;font-size:13.5px}
.sdet div{background:var(--paper);border-radius:10px;padding:12px 14px}
.sdet .k{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:6px}
.findings{list-style:none;display:grid;gap:14px}
.findings li{display:grid;grid-template-columns:22px 1fr;gap:14px;font-size:16px;line-height:1.5}
.findings .chk{margin-top:5px}
details.fold{border:1px solid var(--line);border-radius:14px;background:#fbf8f3}
details.fold > summary{list-style:none;cursor:pointer;padding:16px 18px;display:flex;justify-content:space-between;align-items:center;min-height:52px;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase}
details.fold > summary::-webkit-details-marker{display:none}
details.fold > summary::after{content:"+";font-size:18px;transition:transform .3s var(--ease)}
details.fold[open] > summary::after{transform:rotate(45deg)}
details.fold + details.fold{margin-top:10px}
.rtable{width:100%;border-collapse:collapse;font-size:13.5px}
.rtable th,.rtable td{padding:11px 12px;border-top:1px solid var(--line);text-align:left;vertical-align:top}
.rtable th{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);font-weight:500}
.rtable td:nth-child(2){font-family:var(--mono);white-space:nowrap}
.visual{aspect-ratio:16/7;border-radius:18px;border:1.5px dashed var(--line-2);display:grid;place-items:center;text-align:center;padding:24px;background:repeating-linear-gradient(135deg,transparent 0 14px,rgba(74,79,87,.035) 14px 15px)}
.visual p{max-width:420px;color:var(--ink-soft);font-size:14.5px}
.mrep{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.mrep .side{padding:24px}
.sigblock{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;padding:26px;border-radius:18px;background:var(--deep);color:#e9e2d6}
.sigblock .sig{font-family:var(--serif);font-style:italic;font-size:34px;color:#fbf6ee;border-bottom:1px solid #f5f0e840;padding-bottom:6px;margin-bottom:8px}
.sigblock .mono{color:#cfc6b9}

/* test protocol */
.toc{position:sticky;top:120px;display:flex;flex-direction:column;gap:2px;border-left:1px solid var(--line-2)}
.toc a{padding:8px 14px;font-size:14px;color:var(--ink-soft);border-left:2px solid transparent;margin-left:-1px;min-height:40px;display:flex;align-items:center}
.toc a:hover,.toc a.on{color:var(--brass);border-left-color:var(--brass)}
.tp{display:grid;grid-template-columns:220px 1fr;gap:56px;align-items:start}
.tp section{padding:0 0 64px;scroll-margin-top:130px}
.tp h2{font-size:clamp(30px,3.2vw,42px);margin-bottom:18px}
.princ{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.princ .card{padding:22px}
.princ h4{font-family:var(--serif);font-weight:400;font-size:22px;color:#2e3238;margin:12px 0 8px}
.princ p{font-size:14px;color:var(--ink-soft)}
.thr{width:100%;border-collapse:collapse;margin-top:10px}
.thr td{padding:14px 10px;border-top:1px solid var(--line);font-size:15px}
.thr td:nth-child(2){font-family:var(--mono);color:var(--brass);white-space:nowrap}
.code-blk{font-family:var(--mono);font-size:13px;line-height:1.7;background:var(--deep);color:#e9e2d6;border-radius:14px;padding:20px 22px;overflow-x:auto;margin-top:18px;white-space:pre}
.code-blk .c{color:#9c938a}.code-blk .k{color:#e7b2ad}
.triggers{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}
.triggers div{padding:18px;border-radius:14px;border:1px solid var(--line);background:#fbf8f3;font-size:14.5px}
.triggers b{display:block;font-family:var(--serif);font-weight:400;font-size:20px;color:#2e3238;margin-bottom:6px}

/* scenarios page */
.sbig{display:grid;grid-template-columns:1fr 1fr;gap:0;border-radius:24px;overflow:hidden;border:1px solid var(--line);background:#fbf8f3;margin-bottom:22px}
.sbig .art{position:relative;min-height:420px;background:linear-gradient(180deg,#f3ede4,#e8dfd2);border-right:1px solid var(--line)}
.sbig .art svg{position:absolute;inset:0;width:100%;height:100%}
.sbig .art .num{position:absolute;left:24px;top:20px;font-family:var(--serif);font-style:italic;font-size:88px;line-height:1;color:var(--brass);opacity:.18}
.sbig .bd{padding:34px;display:flex;flex-direction:column;gap:16px}
.sbig h2{font-size:clamp(34px,3.6vw,50px)}
.sbig .analogy{font-family:var(--serif);font-style:italic;font-size:19px;color:#3a2a2c;border-left:2px solid var(--brass);padding-left:14px}
.sbig .setup{font-size:15px;color:var(--ink)}
.crit3{display:grid;gap:8px}
.crit3 div{display:grid;grid-template-columns:120px 1fr;gap:12px;font-size:14px;padding:10px 12px;border-radius:10px}
.crit3 .h{background:var(--held-soft)}.crit3 .d{background:var(--degraded-soft)}.crit3 .f{background:var(--failed-soft)}
.crit3 .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;display:flex;align-items:center;gap:7px}
.crit3 .k i{font-style:normal;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:9px}
.crit3 .h .k{color:var(--held)}.crit3 .h i{background:var(--held)}
.crit3 .d .k{color:#7a5405}.crit3 .d i{background:var(--degraded)}
.crit3 .f .k{color:var(--failed)}.crit3 .f i{background:var(--failed)}
.adj{font-size:13.5px;color:var(--ink-soft);border-top:1px dashed var(--line-2);padding-top:14px}
.adj b{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--brass);margin-right:8px}

/* queue / log */
.legend{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px}
.st{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;padding:7px 12px;border-radius:999px;border:1px solid var(--line-2)}
.st::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.st.q{color:var(--ink-soft)}.st.t{color:#8a5f06}.st.u{color:#5a3a8a}.st.s{color:var(--held)}
.pipe{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:10px 0 40px;counter-reset:p}
.pipe div{position:relative;padding:22px 20px 0 0}
.pipe div::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--line-2)}
.pipe div::after{content:"";position:absolute;left:0;top:-5px;width:12px;height:12px;border-radius:50%;background:var(--paper);border:2px solid var(--brass)}
.pipe h4{font-family:var(--serif);font-weight:400;font-size:22px;color:#2e3238;margin-bottom:6px}
.pipe p{font-size:14px;color:var(--ink-soft)}

/* reports */
.alist{border-top:1px solid var(--line-2)}
.art-row{display:grid;grid-template-columns:200px 1fr 110px 46px;gap:20px;align-items:center;padding:26px 4px;border-bottom:1px solid var(--line);transition:padding .3s var(--ease),background .3s}
.art-row[hidden]{display:none}
.art-row:hover{background:#fff7;padding-left:14px}
.art-row .t{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--brass);display:flex;gap:10px;align-items:center}
.art-row h3{font-size:clamp(24px,2.6vw,34px);line-height:1.12}
.art-row .stt{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);text-align:right}
.art-row .go{width:46px;height:46px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center}

/* members */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:s}
.step{padding:24px;counter-increment:s;position:relative}
.step::before{content:counter(s);font-family:var(--serif);font-style:italic;font-size:54px;line-height:1;color:var(--brass);opacity:.25;position:absolute;right:18px;top:12px}
.step h4{font-family:var(--serif);font-weight:400;font-size:22px;color:#2e3238;margin:10px 0 8px}
.step p{font-size:14px;color:var(--ink-soft)}
.firewall{padding:34px;border-radius:24px;background:var(--deep);color:#e9e2d6;display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}
.firewall h2{color:#fbf6ee}
.firewall h2 em{color:#e7b2ad}
.firewall ul{list-style:none;display:grid;gap:12px}
.firewall li{display:grid;grid-template-columns:20px 1fr;gap:12px;font-size:15px;color:#d9d1c4}
.firewall li::before{content:"✕";color:#e7b2ad;font-family:var(--mono)}

/* 404 */
.nf{min-height:100vh;min-height:100svh;display:grid;place-items:center;text-align:center;padding:160px 24px 80px;position:relative;overflow:hidden}
.nf .big{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(120px,22vw,300px);line-height:.85;color:#3a2a2c;letter-spacing:-.05em;margin:0}
.nf .big span{color:var(--brass)}
.nf p{font-size:18px;color:var(--ink-soft);max-width:460px;margin:22px auto 30px}

@media (max-width:1000px){
  .pgrid{grid-template-columns:1fr 1fr}
  .tp{grid-template-columns:1fr}
  .toc{display:none}
  .sbig{grid-template-columns:1fr}
  .sbig .art{min-height:280px;border-right:0;border-bottom:1px solid var(--line)}
  .rhead{grid-template-columns:1fr}
  .seal{justify-self:start}
  .blk{grid-template-columns:1fr;gap:18px}
  .princ,.triggers,.steps{grid-template-columns:1fr 1fr}
  .firewall{grid-template-columns:1fr}
  .target{opacity:.35}
}
@media (max-width:640px){
  .phead{padding:150px 0 50px}
  .phead .marks{display:none}
  .toolbar{position:static}
  .pgrid,.princ,.triggers,.steps,.mrep,.pipe{grid-template-columns:1fr}
  .pipe div{padding:22px 0 18px}
  .sitem summary{grid-template-columns:1fr auto;gap:8px}
  .sitem summary .pm{grid-column:1/-1;order:3}
  .sdet{grid-template-columns:1fr}
  .areas.big .area{grid-template-columns:130px 1fr 36px;font-size:13px}
  .art-row{grid-template-columns:1fr 46px;gap:8px 14px}
  .art-row .t{grid-column:1/-1}
  .art-row .stt{display:none}
  .crit3 div{grid-template-columns:1fr}
  .seal{width:190px}
  .target{width:340px;right:-140px;top:90px;opacity:.25}
  .viewtog{display:none}
}
@media (prefers-reduced-motion:reduce){.target .spin{animation:none}}
.phead .meta b span{font:inherit;letter-spacing:inherit;color:inherit;text-transform:none}
.visual{aspect-ratio:auto;min-height:220px}
.pcard{overflow:hidden}
.tp > *{min-width:0}
.code-blk{max-width:100%}
.thr td:nth-child(2){white-space:normal}
@media (max-width:640px){.thr td{padding:12px 6px;font-size:14px}.code-blk{font-size:11.5px}}