/* TONK playbooks. Same tokens as the NET/HOST workbench and intel.6b74.dev.
   On playbook pages this loads after each page's own <style> and restyles it. */
:root{
  --bg:#0a0c10; --bg2:#0f1218; --bg3:#12161d; --bg4:#171c25; --line:#232a36; --line2:#2d3543;
  --border:#232a36; --border2:#2d3543;
  --text:#d7dde6; --text2:#8b949e; --text3:#5b6573;
  --accent:#58a6ff; --amber:#d29922; --green:#3fb950; --red:#f85149; --purple:#bc8cff; --cyan:#39c5cf;
  --cn:#ff7b72; --ru:#79c0ff; --ir:#7ee787; --kp:#d2a8ff; --mul:#8b949e;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;
}
html{scroll-padding-top:64px}
body{background:var(--bg);color:var(--text);font-family:var(--sans)}

/* header */
header.pb-top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:14px;padding:9px 18px;background:rgba(10,12,16,.97);border-bottom:1px solid var(--line);flex-wrap:wrap}
.pb-brand{font:700 15px var(--mono);letter-spacing:.06em;color:var(--accent);white-space:nowrap;text-decoration:none!important}
.pb-brand span{color:var(--text2);font-weight:400}
.pb-switch{display:flex;gap:2px;background:var(--bg3);border:1px solid var(--line);border-radius:8px;padding:3px}
.pb-switch a{font:600 11px var(--mono);letter-spacing:.08em;color:var(--text2);padding:4px 10px;border-radius:5px;text-decoration:none!important}
.pb-switch a:hover{color:var(--text)}
.pb-switch a.on{background:var(--cyan);color:#071114}
.pb-back{margin-left:auto;font:12px var(--mono);color:var(--text2)!important}

/* ---------------- index ---------------- */
#pb-index{max-width:1100px;margin:0 auto;padding:22px 20px 60px}
.pb-head h1{margin:0;font:700 22px var(--sans)}
.pb-head p{margin:4px 0 18px;color:var(--text2);font-size:14px}
.pb-ask{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.pb-ask-b{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:3px;background:var(--bg3);border:1px solid var(--line);border-radius:10px;padding:13px 14px}
.pb-ask-b:hover{border-color:var(--line2);background:var(--bg4)}
.pb-ask-b.on{border-color:var(--cyan);box-shadow:inset 0 0 0 1px var(--cyan)}
.pb-ask-b .q{font-weight:700;font-size:15px}
.pb-ask-b .k{font:600 11px var(--mono);color:var(--cyan);letter-spacing:.04em}
.pb-ask-b .hnt{font-size:12.5px;color:var(--text2)}
.pb-start{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 4px}
.pb-start a{flex:1;min-width:260px;font-size:13px;color:var(--text2);border:1px dashed var(--line2);border-radius:9px;padding:9px 13px;text-decoration:none}
.pb-start a b{color:var(--text)}
.pb-start a:hover{border-color:var(--green);color:var(--text)}
.pb-sec{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:26px 0 8px}
.pb-sec h3{margin:0;font:700 11.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text2)}
.pb-sec span,.pb-sec a{font:12px var(--mono);color:var(--text3)}
.pb-sec a{color:var(--accent)}
.pb-hotlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:10px}
.pb-hotcard{background:var(--bg3);border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:9px;padding:10px 13px}
.pb-hotcard .t{font-weight:700;color:var(--text);font-size:14px}
.pb-hotcard .m{font:11.5px var(--mono);color:var(--amber);margin:2px 0 5px}
.pb-hotcard .r{display:block;font-size:12.5px;color:var(--text2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pb-filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:24px}
.pb-filters input[type=search]{flex:1;min-width:220px;background:var(--bg3);border:1px solid var(--line);border-radius:7px;color:var(--text);padding:7px 11px;font:13px var(--sans)}
.pb-filters input:focus{outline:none;border-color:var(--accent)}
.pb-seg{display:flex;border:1px solid var(--line);border-radius:7px;overflow:hidden}
.pb-seg button{all:unset;cursor:pointer;font:600 11px var(--mono);padding:7px 10px;color:var(--text2)}
.pb-seg button.on{background:var(--bg4);color:var(--text);box-shadow:inset 0 -2px 0 var(--cyan)}
.pb-tog{display:flex;gap:6px;align-items:center;font-size:12.5px;color:var(--text2);cursor:pointer}
.pb-list{background:var(--bg3);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.pb-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);color:var(--text);text-decoration:none}
.pb-row:last-child{border-bottom:0}
.pb-row:hover{background:var(--bg4)}
.pb-row-t{font-weight:600;font-size:14px}
.pb-row-d{font-size:12.5px;color:var(--text2);line-height:1.45;margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pb-row-side{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:300px}
.pb-tag{font:600 10.5px var(--mono);color:var(--text2);border:1px solid var(--line2);border-radius:5px;padding:1px 7px;white-space:nowrap}
.pb-tag b{color:var(--green)}
.pb-tag.mono{font-weight:400}
.pb-tag.nat-cn{color:var(--cn)} .pb-tag.nat-ru{color:var(--ru)} .pb-tag.nat-ir{color:var(--ir)} .pb-tag.nat-kp{color:var(--kp)}
.pb-hot{font:700 10.5px var(--mono);color:#000;background:var(--amber);border-radius:5px;padding:1px 7px;white-space:nowrap}
.pb-empty{color:var(--text2);padding:30px;text-align:center;border:1px dashed var(--line);border-radius:10px;margin-top:16px}

/* ---------------- playbook page ---------------- */
/* hero lines up with the rail + content grid below (210 + 30 + 820 = 1060) */
body.pb-page .pb-hero{text-align:left;padding:22px max(20px,calc((100vw - 1060px) / 2)) 18px;background:var(--bg2);border-bottom:1px solid var(--line)}
body.pb-page .pb-pill-lg{margin-bottom:8px}
body.pb-page .pb-title{font:700 24px var(--sans);margin-bottom:6px}
body.pb-page .pb-sub{max-width:900px;font-size:14px;color:var(--text2);margin:0}
body.pb-page .pb-meta-row{margin-top:8px}
.pb-run{margin-top:14px!important}
.pb-run-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pb-btn{font:700 11px var(--mono);letter-spacing:.05em;padding:7px 12px;border:1px solid var(--line2);border-radius:7px;background:var(--bg3);color:var(--text)!important;text-decoration:none!important;white-space:nowrap}
.pb-btn:hover{border-color:var(--accent)}
.pb-btn.pri{border-color:var(--cyan);color:var(--cyan)!important}
.pb-prog{display:flex;align-items:center;gap:8px;font:12px var(--mono);color:var(--text2)}
.pb-prog b{color:var(--green)}
.pb-prog .bar{width:110px;height:5px;background:var(--line);border-radius:3px;overflow:hidden}
.pb-prog .bar i{display:block;height:100%;background:var(--green)}
.pb-reset{all:unset;cursor:pointer;font:11px var(--mono);color:var(--text3)}
.pb-reset:hover{color:var(--red)}
.pb-reset[hidden]{display:none}
.pb-intel{margin-top:12px;border:1px solid #5c4613;background:rgba(210,153,34,.06);border-radius:9px;padding:9px 12px;font-size:13px}
.pb-intel .h{color:#e3b341;margin-bottom:4px}
.pb-intel .h b{color:var(--amber)}
.pb-intel a{display:block;color:var(--text)!important;padding:3px 0;font-size:13px;text-decoration:none!important}
.pb-intel a:hover{color:var(--accent)!important}
.pb-intel .src{font:11px var(--mono);color:var(--text3);margin-right:8px}
.pb-intel .why{font:10.5px var(--mono);color:var(--amber)}
.pb-intel.quiet{border-color:var(--line);background:none;color:var(--text3);font-size:12.5px}
.pb-related{margin-top:10px;font-size:12.5px;color:var(--text3)}
.pb-related a{margin-left:10px;color:var(--accent)}

.pb-wrap{display:grid;grid-template-columns:210px minmax(0,820px);gap:30px;justify-content:center;padding:0 20px;align-items:start}
.pb-wrap .content{padding:26px 0 50px;margin:0;max-width:none}
.pb-rail{position:sticky;top:60px;padding:26px 0 20px;max-height:calc(100vh - 60px);overflow:auto}
.pb-rail-h{font:700 10px var(--mono);letter-spacing:.12em;color:var(--text3);margin-bottom:8px}
.pb-rail a{display:block;font-size:12.5px;color:var(--text2)!important;padding:4px 0 4px 10px;border-left:2px solid var(--line);text-decoration:none!important;line-height:1.35}
.pb-rail a:hover{color:var(--text)!important}
.pb-rail a.on{border-color:var(--cyan);color:var(--text)!important}
.pb-rail a.chk{color:var(--cyan)!important;font-weight:600}
.pb-rail-prog{font:10.5px var(--mono);color:var(--green)}

body.pb-page .section-head{scroll-margin-top:64px;font-size:11.5px;letter-spacing:.12em}
body.pb-page .prose{font-size:14px;line-height:1.7}
body.pb-page .check-list li{cursor:pointer;font-size:13px;background:var(--bg3);border-color:var(--line);transition:opacity .15s}
body.pb-page .check-list li:hover{border-color:var(--line2)}
body.pb-page .check-list li:focus{outline:1px solid var(--accent)}
body.pb-page .check-list li strong{font-size:14px}
body.pb-page .check-list li .ref{font-size:11px}
body.pb-page .check-list li.done{opacity:.55}
body.pb-page .check-list li.done strong{text-decoration:line-through;text-decoration-color:var(--text3)}
body.pb-page .check-list li.done::before{background:var(--green);border-color:var(--green)}
body.pb-page .check-list li.done::after{content:"";position:absolute;left:17px;top:17px;width:4px;height:8px;border:solid #000;border-width:0 2px 2px 0;transform:rotate(45deg)}
body.pb-page footer{background:var(--bg2);border-color:var(--line)}

@media (max-width:980px){
  .pb-ask{grid-template-columns:repeat(2,1fr)}
  .pb-wrap{grid-template-columns:minmax(0,1fr)}
  .pb-rail{display:none}
}
@media (max-width:640px){
  .pb-ask{grid-template-columns:1fr}
  .pb-row{grid-template-columns:1fr}
  .pb-row-side{justify-content:flex-start;max-width:none}
  .pb-back{margin-left:0}
  body.pb-page .pb-title{font-size:20px}
}