/* Editorial companion to the existing Light Table design tokens in src/index.css. */
:root { --ground:#edf0ef; --surface:#f8faf9; --ink:#0b1618; --muted:#56696d; --petrol:#0f4c52; --line:#d6dddb; --signal:#e0a82e; --display:'Bricolage Grotesque',system-ui,sans-serif; --body:'Instrument Sans',system-ui,sans-serif; --mono:'IBM Plex Mono',monospace; }
* { box-sizing:border-box; }
html { scroll-padding-top:32px; }
body { margin:0; background:var(--ground); color:var(--ink); font:400 17px/1.75 var(--body); -webkit-font-smoothing:antialiased; }
a { color:var(--petrol); text-underline-offset:4px; }
a:hover { text-decoration-thickness:2px; }
a, button { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid var(--petrol); outline-offset:5px; border-radius:2px; }
button { font:inherit; }
[hidden] { display:none!important; }
.skip { position:absolute; top:8px; left:12px; padding:10px 18px; background:white; z-index:10; transform:translateY(-160%); }
.skip:focus { transform:none; }
.site-header, .site-footer { max-width:1280px; margin:auto; padding:24px 48px; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid var(--line); }
.brand { display:inline-flex; align-items:center; gap:10px; color:var(--ink); font:700 24px/1.2 var(--display); text-decoration:none; }
.brand img { flex-shrink:0; }
.site-header nav { display:flex; align-items:center; gap:26px; font-size:14px; }
.site-header nav>a:not(.button), .site-footer nav a { padding:8px 0; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:20px; min-height:46px; padding:11px 20px; border:1px solid var(--petrol); border-radius:6px; background:var(--petrol); color:white; font:600 14px/1.5 var(--body); text-decoration:none; cursor:pointer; }
.button:hover { background:#1a6b73; }
.article-hero { max-width:1060px; margin:auto; padding:56px 48px 52px; }
.back { display:inline-block; margin-bottom:36px; font-size:14px; }
.eyebrow { color:var(--petrol); font:500 12px/1.7 var(--mono); text-transform:uppercase; letter-spacing:.08em; }
h1,h2,h3 { font-family:var(--display); line-height:1.16; text-wrap:balance; }
h1 { max-width:960px; margin:18px 0 24px; font-size:clamp(38px,5.5vw,68px); letter-spacing:-.045em; font-weight:700; }
.standfirst { max-width:740px; color:var(--muted); font-size:21px; line-height:1.65; }
.byline { margin-top:28px; color:var(--muted); font-size:13px; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px; margin-top:30px; font-size:14px; }
.hero-actions>a:not(.button) { padding:9px 0; }
.article-layout { display:grid; grid-template-columns:220px minmax(0,720px); gap:64px; max-width:1160px; margin:auto; padding:52px 48px 0; border-top:1px solid var(--line); align-items:start; }
.contents { position:sticky; top:28px; }
.contents nav { display:flex; flex-direction:column; gap:4px; }
.contents .eyebrow { margin:0 0 16px; }
.contents a { display:block; padding:7px 0; color:var(--muted); font-size:13px; line-height:1.5; text-decoration:none; }
.contents a:hover { color:var(--petrol); text-decoration:underline; }
.article-body { min-width:0; }
.article-body section { margin-bottom:48px; }
.article-body h2 { margin:0 0 22px; font-size:30px; letter-spacing:-.025em; }
.article-body h3 { margin:28px 0 12px; font-size:21px; }
.article-body p { margin:0 0 20px; }
.article-body li { padding-left:5px; margin-bottom:18px; }
.article-body ol { padding-left:24px; }
.evidence-list { margin:26px 0; border-top:1px solid var(--line); }
.evidence-list>div { display:grid; grid-template-columns:155px minmax(0,1fr); gap:20px; padding:24px 0; border-bottom:1px solid var(--line); }
.evidence-list dt { color:var(--petrol); font-weight:700; line-height:1.5; }
.evidence-list dd { margin:0; font-size:16px; }
.table-wrap { overflow-x:auto; margin:28px 0; border:1px solid var(--line); border-radius:6px; }
table { width:100%; border-collapse:collapse; font-size:15px; }
th,td { padding:16px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line); }
thead { background:var(--petrol); color:white; }
tbody th { width:28%; color:var(--petrol); }
tbody tr:last-child>* { border-bottom:0; }
.prompt-block { padding:30px; background:#0d1a1c; color:#f8faf9; border-radius:10px; }
.prompt-block .eyebrow { color:var(--signal); }
.prompt-block h2 { color:#fff; }
.prompt-block>p:not(.eyebrow) { color:#cfd9d8; font-size:15px; }
blockquote { margin:24px 0; padding:0 0 0 20px; border-left:3px solid var(--signal); font-size:16px; line-height:1.8; }
.prompt-block .button { background:#f8faf9; color:var(--petrol); border-color:transparent; }
.prompt-block .copy-status { margin:16px 0 0; font-size:13px; }
.copy-status:empty { display:none; }
.offer { padding:32px; background:var(--surface); border:1px solid var(--line); border-radius:8px; }
.offer p:not(.eyebrow) { font-size:15px; color:var(--muted); }
.offer-details { display:block; margin-top:20px; font-size:14px; }
.related, .hub-guides { max-width:1160px; margin:80px auto; padding:0 48px; }
.related>h2, .hub-guides>h2 { font-size:32px; letter-spacing:-.025em; }
.guide-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-top:32px; }
.guide-card { display:flex; flex-direction:column; gap:14px; padding:30px; background:var(--surface); border:1px solid var(--line); border-radius:8px; text-decoration:none; }
.guide-card:hover { border-color:var(--petrol); }
.guide-card h2 { margin:0; color:var(--ink); font-size:27px; letter-spacing:-.025em; }
.guide-card p { margin:0; color:var(--muted); font-size:16px; line-height:1.7; }
.card-action { margin-top:auto; padding-top:12px; font-size:14px; font-weight:600; }
.hub-hero { max-width:1160px; margin:auto; padding:76px 48px 64px; border-bottom:1px solid var(--line); }
.hub-hero h1 { font-size:clamp(44px,6.4vw,82px); }
.hub-hero h1 span { color:var(--petrol); }
.hub-guides .guide-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.hub-offer { max-width:750px; margin-top:32px; color:var(--muted); font-size:14px; }
.site-footer { display:flex; flex-wrap:wrap; align-items:start; justify-content:space-between; gap:28px; border-top:1px solid var(--line); padding-block:40px; }
.site-footer p { color:var(--muted); font-size:13px; }
.site-footer nav { display:flex; flex-wrap:wrap; gap:12px 24px; font-size:14px; }
.site-footer .disclosure { flex-basis:100%; max-width:820px; margin:0; }
@media(max-width:1000px) {
  .article-layout { gap:36px; grid-template-columns:180px minmax(0,1fr); padding-inline:32px; }
  .hub-guides .guide-grid { grid-template-columns:1fr; }
  .hub-guides .guide-card { max-width:780px; }
}
@media(max-width:760px) {
  .site-header, .site-footer { padding-inline:20px; }
  .site-header { flex-wrap:wrap; gap:18px; }
  .site-header nav { width:100%; gap:18px; justify-content:space-between; font-size:13px; }
  .site-header .button { padding:9px 13px; font-size:13px; gap:10px; }
  .article-hero, .hub-hero { padding:36px 22px; }
  .article-hero .back { margin-bottom:26px; }
  .standfirst { font-size:19px; }
  .article-layout { display:block; padding:28px 22px 0; }
  .contents { position:static; margin-bottom:38px; padding-bottom:22px; border-bottom:1px solid var(--line); }
  .contents nav { gap:2px; }
  .contents a { font-size:14px; padding-block:9px; }
  .article-body h2 { font-size:28px; }
  .article-body { font-size:17px; overflow-wrap:break-word; }
  .evidence-list>div { grid-template-columns:1fr; gap:8px; }
  .prompt-block, .offer { padding:24px 20px; }
  .related, .hub-guides { margin:52px auto; padding-inline:22px; }
  .guide-grid { grid-template-columns:1fr; }
  .guide-card { padding:25px; }
}
@media print {
  .site-header, .contents, .hero-actions, .related, .site-footer, [data-copy-prompt] { display:none; }
  body { background:white; color:black; }
  .article-layout { display:block; padding:0; }
  .article-hero { padding:0; }
  .prompt-block { color:black; background:white; border:1px solid #777; }
  .prompt-block h2, .prompt-block>p:not(.eyebrow), .prompt-block .eyebrow { color:black; }
}
