/* Static pages (calls, topics, tickers, record): the same Stack look as the app. Tokens and components come from
   style.css; this file only lays out the static shell and a few page-only pieces. */
body.static { padding: 0 var(--gutter) var(--s-8); }
body.static .mast { padding-left: 0; padding-right: 0; }
.s-main { max-width: calc(var(--measure) + var(--margin-col) + var(--s-5)); margin: 0 auto; padding-top: var(--s-6); min-width: 0; }
.s-call { display: grid; grid-template-columns: var(--margin-col) minmax(0, var(--measure)); gap: 0 var(--s-5); }
@media (max-width: 720px) { .s-call { grid-template-columns: minmax(0, 1fr); } }
.call-t.big { font: 800 34px/1.06 var(--display); font-stretch: 108%; letter-spacing: -.025em; }
@media (max-width: 720px) { .call-t.big { font-size: 26px; line-height: 31px; } }
.s-call .one { -webkit-line-clamp: unset; display: block; font-size: 16px; line-height: 24px; }
.ph { margin-top: 0; }
.s-block { margin-bottom: var(--s-5); }
.s-list, .s-index, .s-history { list-style: none; margin: 0; padding: 0; }
.s-list li { padding: var(--s-3) 0; border-top: var(--hair); display: grid; gap: 4px; }
.s-list a b { display: block; font: 500 17px/24px var(--read); }
.s-list a span { color: var(--ink-2); font-size: 14px; }
.s-list a:hover { text-decoration: none; }
.s-list a:hover b { text-decoration: underline; text-underline-offset: 3px; }
.s-index { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--s-3) var(--s-5); padding: var(--s-4) 0; }
.s-index li { display: grid; }
.s-index a { font: 500 16px/22px var(--read); }
.s-history li { padding: 6px 0; border-top: var(--hair); font-size: 14px; }
.s-sub { display: flex; justify-content: space-between; align-items: center; gap: var(--s-4); flex-wrap: wrap; padding: var(--s-5) 0;
  margin: var(--s-6) auto 0; border-top: var(--hair-strong); max-width: calc(var(--measure) + var(--margin-col) + var(--s-5)); }
.s-sub p { margin: 4px 0 0; }
.s-sub .sub-row { display: flex; gap: 6px; flex: 1; min-width: 260px; max-width: 420px; }
.s-sub input { flex: 1; min-width: 0; padding: 0 10px; min-height: 36px; border: var(--hair-strong); border-radius: var(--radius); background: var(--paper-raised); }
.s-foot { max-width: calc(var(--measure) + var(--margin-col) + var(--s-5)); margin: var(--s-6) auto 0; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); border-top: var(--hair-strong); border-bottom: var(--hair); margin-bottom: var(--s-5); }
.stat { padding: var(--s-3) 0; }
.stat b { display: block; font: 500 24px/30px var(--mono); }
.stat span { font-size: 12.5px; color: var(--ink-3); }
.tr-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.tr-table th, .tr-table td { text-align: left; padding: 8px 12px 8px 0; border-bottom: var(--hair); }
.tr-table th { font: 600 12px/16px var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.tr-table td { font-family: var(--mono); font-size: 13px; }
.tr-table td:first-child { font-family: var(--sans); }
.tr-line { display: block; font-size: 14px; color: var(--ink-2); }
.tag.good { color: var(--hit); border-color: var(--hit); }
.tag.acc { color: var(--ink); border-color: var(--ink); }
.brief-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: var(--s-4) 0 var(--s-5); }
.brief-body section { margin: 0 0 var(--s-5); }
.brief-body h3 { font: 600 12px/16px var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); margin: 0 0 var(--s-2); }
.brief-body h4 { margin: var(--s-4) 0 6px; font-size: 14px; }
.brief-body p, .brief-body li { font: 400 17px/27px var(--read); }
.brief-body ul, .brief-body ol { margin: 0; padding-left: 20px; }
.brief-body li { margin: 4px 0; }
.brief-body .two { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0 var(--s-5); }
.brief-page h1 { font: 800 32px/1.08 var(--display); font-stretch: 108%; letter-spacing: -.02em; margin: var(--s-3) 0 var(--s-2); }
.brief-page .lede { font-size: 16px; color: var(--ink-2); max-width: 62ch; }
.landing { padding: var(--s-4); border: 1px dashed var(--rule-strong); }
.share-text { white-space: pre-wrap; font: 400 14px/21px var(--mono); margin: 0 0 6px; padding: var(--s-3); background: var(--paper-raised); border: var(--hair); }
.share-img { max-width: 100%; border: var(--hair); margin-top: var(--s-2); }
.s-idea h1 { font: 800 32px/1.08 var(--display); font-stretch: 108%; letter-spacing: -.02em; }
.s-idea .lede { font-size: 16px; color: var(--ink-2); max-width: 62ch; }
.detail { padding: 0; }
@media print { .mast, .s-sub, .s-foot, .brief-actions, .call-foot { display: none; } body.static { padding: 0; } }
