/* Groundwork — the board brief (paper, Traza's publication grammar) and Present's lower third. */
#brief{position:fixed;inset:0;z-index:90;background:#2b302c;overflow:auto;display:none;padding:0 0 40px}
#brief.show{display:block}
.brief-bar{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--ink-1);border-bottom:1px solid var(--line)}
.brief-bar .grow{flex:1}
.paper{width:min(1000px,calc(100% - 24px));margin:24px auto 0;background:var(--paper);color:var(--paper-ink);border-radius:8px;padding:38px 40px 26px;font:13.5px/1.6 var(--sans);box-shadow:0 20px 60px rgba(0,0,0,.35)}
.paper .ph{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;border-bottom:1px solid var(--paper-line);padding-bottom:18px}
.paper .pk{font:500 10.5px var(--mono);letter-spacing:.2em;color:#9a6a45}
.paper h1{font:400 44px/1.02 var(--serif);margin:8px 0 6px;letter-spacing:-.01em}
.paper .psub{margin:0;color:var(--paper-ink-2);font-size:13px}
.paper .pw{font:400 26px/1 var(--serif);color:var(--paper-ink)}
.paper .pw span{color:#2f7a57}
.frames{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0 0}
.bf{margin:0}
.bf .mos{position:relative;aspect-ratio:1.25;overflow:hidden;border-radius:5px;background:#d9d4c6}
.bf .mos img{position:absolute;width:256px;height:256px;max-width:none}
.bf .mos img.crop{position:static;width:100%;height:100%;object-fit:cover}
.bf .mos .cross{position:absolute;left:50%;top:50%;width:26px;height:26px;margin:-13px 0 0 -13px;border:1.5px dashed rgba(255,255,255,.9);box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.bf .mos.empty,.bf .mos .empty{display:grid;place-items:center;height:100%;font:500 11px var(--mono);color:var(--paper-ink-2)}
.bf figcaption{font-size:11.5px;color:var(--paper-ink-2);margin-top:6px}
.bf figcaption b{color:var(--paper-ink);font-weight:600}
.pk4{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--paper-line);border-radius:6px;margin:18px 0}
.pk4>div{padding:12px 14px}
.pk4>div+div{border-left:1px solid var(--paper-line)}
.pk4 span{display:block;font:500 9.5px var(--mono);letter-spacing:.16em;color:var(--paper-ink-2)}
.pk4 b{display:block;font:400 30px/1.15 var(--serif);margin:6px 0 2px;font-weight:400}
.pk4 small{font-size:11px;color:var(--paper-ink-2)}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:34px}
.cols h3{font:600 12.5px var(--sans);margin:18px 0 8px;padding-bottom:6px;border-bottom:1px solid var(--paper-line)}
.cols h3:first-child{margin-top:0}
.cols p{margin:0 0 8px;color:#2d3b35}
.cols ul{margin:0;padding-left:16px;color:#2d3b35}
.cols li{margin:0 0 6px}
.cols li b{font-weight:600;margin-right:4px}
.bandwrap{background:#14201b;border-radius:5px;padding:8px 8px 4px}
.pf{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--paper-line);margin-top:20px;padding-top:12px;font:10px/1.6 var(--mono);color:var(--paper-ink-2);letter-spacing:.04em}
.pf span:last-child{text-align:right;max-width:70%}
@media (max-width:760px){.paper{padding:24px 18px}.paper h1{font-size:32px}.frames{grid-template-columns:1fr}.pk4{grid-template-columns:1fr 1fr}.pk4>div:nth-child(3){border-left:0}.pk4>div:nth-child(n+3){border-top:1px solid var(--paper-line)}.cols{grid-template-columns:1fr;gap:0}}
@media print{
  @page{size:A4;margin:10mm}
  body{background:#fff!important;overflow:visible!important;height:auto!important}
  body.printing #gw,body.printing .scrim,body.printing .toast{display:none!important}
  #brief{position:static;display:block!important;background:#fff;padding:0;overflow:visible}
  .brief-bar{display:none}
  .paper{box-shadow:none;margin:0;width:auto;padding:0;border-radius:0}
  .bf .mos img{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .bandwrap{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* Present: the lower third */
#present{position:absolute;left:0;right:0;bottom:0;z-index:25;display:none;pointer-events:none}
#present.show{display:block}
#present .lt{pointer-events:auto;margin:0 auto 24px;width:min(760px,calc(100% - 28px));background:linear-gradient(180deg,rgba(7,12,10,.86),rgba(7,12,10,.94));border:1px solid var(--line-2);border-radius:12px;padding:16px 20px 12px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:ltIn .5s var(--ease)}
@keyframes ltIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
#present h2{font:400 34px/1.08 var(--serif);margin:6px 0 6px}
#present p{margin:0;color:var(--text-2);font-size:14px;line-height:1.55;max-width:640px}
#present .pc{display:flex;align-items:center;gap:6px;margin-top:12px}
#present .pc button{background:none;border:1px solid var(--line-2);border-radius:6px;color:var(--text-2);padding:4px 10px;font:500 11px var(--mono);letter-spacing:.08em}
#present .pc button:hover{color:var(--text);border-color:var(--line-3)}
#present .dots{display:flex;gap:5px;margin:0 8px;flex:1}
#present .dots i{width:18px;height:2px;background:var(--line-2)}
#present .dots i.on{background:var(--leaf)}
body.presenting .dock,body.presenting .tl,body.presenting .hud-read{display:none!important}
body.presenting .body{grid-template-columns:0 1fr 392px}
body.presenting .rail{overflow:hidden;border:0}
@media (max-width:900px){body.presenting .body{grid-template-columns:1fr}#present h2{font-size:25px}}