/* aiwire.dev site stylesheet. Generated once from docs/design/mockup-2026-09.html (Plan 2, Task 2); edit this file directly from now on. */
/* Self-hosted fonts (SIL Open Font License; licences in /fonts). Latin subset only. */
@font-face{font-family:"Source Serif 4 Variable";font-style:normal;font-display:swap;font-weight:200 900;src:url(/fonts/source-serif-4-latin-wght-normal.woff2) format("woff2")}
@font-face{font-family:"Libre Franklin Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url(/fonts/libre-franklin-latin-wght-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-display:swap;font-weight:400;src:url(/fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-display:swap;font-weight:500;src:url(/fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-display:swap;font-weight:600;src:url(/fonts/ibm-plex-mono-latin-600-normal.woff2) format("woff2")}
/* Layout: news front page. Sticky masthead, 12-col measure of 1200px; home = lead package + chronological wire (main) and a 300px rail of reference modules; inner pages share a ruled page header. */
:root{
  --bg:#FCFCFB; --surface:#FFFFFF; --fill:#F2F3F4; --fill-2:#E9EBED;
  --ink:#15181C; --ink-2:#434A53; --ink-3:#6A727D;
  --rule:#E0E3E6; --rule-2:#C9CED4; --rule-strong:#15181C;
  --accent:#00667D; --accent-ink:#FFFFFF;
  --brk:#B42318; --hdu:#9A5B00; --info:#6A727D; --up:#B42318; --down:#1D7A47;
  --s-in:#1D72A8; --s-out:#B8487A;
  --c-releases:#00667D; --c-pricing:#56701A; --c-deprecations:#7442B8; --c-sdks:#3F51C4; --c-rate-limits:#4E6A8A; --c-research:#6E5A3E;
  --serif:"Source Serif 4 Variable","Source Serif 4","Source Serif Pro",Georgia,"Times New Roman",serif;
  --sans:"Libre Franklin Variable","Libre Franklin","Franklin Gothic Medium","Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#0E1726; --surface:#142033; --fill:#1A2840; --fill-2:#203049;
  --ink:#E8EDF5; --ink-2:#B5C0D0; --ink-3:#8A98AE;
  --rule:#24344D; --rule-2:#34476A; --rule-strong:#B5C0D0;
  --accent:#5CB8CE; --accent-ink:#0E1A1E;
  --brk:#FF7A6B; --hdu:#EDA946; --info:#8A98AE; --up:#FF7A6B; --down:#5BC78D;
  --s-in:#3E93C8; --s-out:#D2699B;
  --c-releases:#5CB8CE; --c-pricing:#B5CF6B; --c-deprecations:#C3A3F0; --c-sdks:#A4A7FF; --c-rate-limits:#9DB5D4; --c-research:#CDB894;
  color-scheme:dark } }
:root[data-theme="dark"]{
  --bg:#0E1726; --surface:#142033; --fill:#1A2840; --fill-2:#203049;
  --ink:#E8EDF5; --ink-2:#B5C0D0; --ink-3:#8A98AE;
  --rule:#24344D; --rule-2:#34476A; --rule-strong:#B5C0D0;
  --accent:#5CB8CE; --accent-ink:#0E1A1E;
  --brk:#FF7A6B; --hdu:#EDA946; --info:#8A98AE; --up:#FF7A6B; --down:#5BC78D;
  --s-in:#3E93C8; --s-out:#D2699B;
  --c-releases:#5CB8CE; --c-pricing:#B5CF6B; --c-deprecations:#C3A3F0; --c-sdks:#A4A7FF; --c-rate-limits:#9DB5D4; --c-research:#CDB894;
  color-scheme:dark }

*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--ink);font:400 15px/1.5 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{margin:0;text-wrap:balance}
p{margin:0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mono{font-family:var(--mono)}
.num,table,time{font-variant-numeric:tabular-nums}
.wrap{max-width:1200px;margin-inline:auto;padding-inline:24px}
@media (max-width:600px){.wrap{padding-inline:16px}}
.ic{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ic.sm{width:14px;height:14px}
/* Company marks (favicon-style logos), sized to the text they sit beside. */
.plogo{color:var(--ink);display:inline-block;width:1.1em;height:1.1em;flex:none;vertical-align:-.2em;margin-right:.4em}
.seg a[aria-current="page"] .plogo{color:inherit} /* one-colour marks stay visible on the selected (inverted) filter */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.link{color:var(--accent);font-weight:600;display:inline-flex;align-items:center;gap:4px}
.link:hover{text-decoration:underline;text-underline-offset:3px}

/* ---------- utility bar + masthead ---------- */
.util{border-bottom:1px solid var(--rule);font-size:12.5px;color:var(--ink-3)}
.util .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:32px}
.util-l,.util-r{display:flex;gap:16px;align-items:center;min-width:0}
.util b{color:var(--ink-2);font-weight:600}
.util-r a{display:inline-flex;gap:5px;align-items:center}
.util-r a:hover,.util-r button:hover{color:var(--ink)}
.util-r button{display:inline-flex;gap:5px;align-items:center;margin:0;padding:0;border:0;border-radius:0;background:none;color:inherit;font:inherit;cursor:pointer}
.util-r button[hidden]{display:none}
.dot-live{width:6px;height:6px;border-radius:50%;background:var(--down);display:inline-block}
@media (max-width:760px){.util-r .opt,.util-l .opt{display:none}}

.mast{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--bg);border-bottom:1px solid var(--rule-strong)}
.mast .wrap{display:flex;align-items:center;gap:28px;min-height:62px}
.brand{display:flex;align-items:center;flex:none}
.brand svg{height:28px;width:auto;display:block}
.brand .wm{fill:var(--ink);font:800 21px var(--sans);letter-spacing:-.02em}
.brand .mk-bg{fill:var(--ink)} .brand .mk-ln{stroke:var(--bg)} .brand .mk-ac{stroke:var(--accent)}
.nav{display:flex;gap:22px;font-weight:600;font-size:14.5px}
.nav a{color:var(--ink-2);padding-block:20px;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.nav a:hover{color:var(--ink)}
.nav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--ink)}
.mast-r{margin-left:auto;display:flex;align-items:center;gap:14px}
.search{display:flex;align-items:center;gap:8px;border:1px solid var(--rule-2);border-radius:0;background:var(--surface);padding:0 8px;width:230px;color:var(--ink-3)}
.search:focus-within{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.search input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:400 14px var(--sans);padding:8px 0}
.search input:focus{outline:none}
.search input::placeholder{color:var(--ink-3)}
kbd{font:500 11px var(--mono);border:1px solid var(--rule-2);border-bottom-width:2px;border-radius:0;padding:0 5px;color:var(--ink-3);background:var(--surface)}
.signin{font-weight:600;font-size:14px;color:var(--ink-2)}
/* Find a model: the masthead combobox (site.js) over /search.json; /search is its no-JS page. */
.search{position:relative}
.search .ic{flex:none}
.find-list{position:absolute;top:calc(100% + 1px);right:-1px;width:min(400px,calc(100vw - 32px));margin:0;padding:0;list-style:none;background:var(--bg);border:1px solid var(--rule-strong);z-index:40;max-height:70vh;overflow-y:auto}
.find-list a{display:flex;align-items:baseline;gap:10px;padding:8px 10px;color:var(--ink);border-bottom:1px solid var(--rule)}
.find-list li:last-child a{border-bottom:0}
.find-list [aria-selected="true"] a,.find-list a:hover{background:var(--fill)}
.find-list .fm{flex:1;min-width:0;font:600 14px/1.3 var(--sans)}
.find-list .fm small{display:block;font:400 12px/1.4 var(--mono);color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.find-list .fs{flex:none;font:400 12px var(--sans);color:var(--ink-3);text-align:right;max-width:40%}
.find-list .fall a{font:600 13px var(--sans);color:var(--accent)}
.find-list .fnone{padding:10px;font-size:14px;color:var(--ink-3)}
.search-page{width:100%;max-width:560px;margin:0 0 24px}
.signin:hover{color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 14px/1 var(--sans);padding:10px 15px;border-radius:0;border:1px solid var(--ink);background:var(--ink);color:var(--bg);cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--ink-2);border-color:var(--ink-2)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--rule-2)}
.btn.ghost:hover{border-color:var(--ink)}
.btn.sm{padding:7px 11px;font-size:13px}
.search-btn{display:none;border:0;background:none;padding:6px;cursor:pointer;color:var(--ink-2)}
@media (max-width:1060px){.nav{gap:16px;font-size:14px}.mast .search{width:180px}}
/* Narrow screens: the brand row scrolls away and the section row stays. The masthead is sticky with a negative top
   equal to the brand row (10px padding + 28px mark + 10px gap above the nav), so only the nav row stays in view. The
   gaps between sections shrink with the screen so all five fit down to 320px. */
@media (max-width:920px){
  html{scroll-padding-top:56px}
  .mast{top:calc(env(safe-area-inset-top,0px) - 48px)}
  .mast .wrap{flex-wrap:wrap;gap:0 14px;min-height:0;padding-top:10px}
  .nav{order:3;width:100%;overflow-x:auto;scrollbar-width:none;gap:clamp(12px,4.5vw,20px);border-top:1px solid var(--rule);margin-top:10px}
  .nav::-webkit-scrollbar{display:none}
  .nav a{padding-block:11px}
  .mast .search{display:none;order:4;width:100%;margin-bottom:10px}
  .mast.s-open .search{display:flex}
  .search-btn{display:inline-flex}
  .mast .search kbd{display:none}
  .mast .find-list{left:-1px;width:auto}
  .mast .find-list a{flex-wrap:wrap;row-gap:2px}
  .mast .find-list .fs{flex:0 0 100%;max-width:none;text-align:left;padding-left:calc(1.5rem + 10px)}
}
@media (max-width:420px){.signin{display:none}}
@media (max-width:359px){.nav{gap:11px;font-size:13px}}

.bulletin{border-bottom:1px solid var(--rule);background:var(--surface)}
.bulletin .wrap{display:flex;align-items:baseline;gap:12px;padding-block:9px;font-size:14px;flex-wrap:wrap}
.bulletin .lbl{font:700 11.5px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--brk)}
.bulletin .txt{min-width:0;flex:1 1 280px}
.bulletin .txt b{font-family:var(--mono);font-weight:600;font-size:13px}

/* ---------- shared bits ---------- */
.kick{font:600 11.5px/1.3 var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);display:flex;gap:6px 10px;align-items:center;flex-wrap:wrap}
.kick .sep{width:1px;height:10px;background:var(--rule-2)}
.sev{display:inline-flex;align-items:center;gap:5px}
.sev svg{width:9px;height:9px;flex:none}
.sev.breaking{color:var(--brk)} .sev.breaking svg{fill:var(--brk)}
.sev.headsup{color:var(--hdu)} .sev.headsup svg{fill:var(--hdu)}
.sev.info{color:var(--info)} .sev.info svg{fill:none;stroke:var(--info);stroke-width:1.6}
.sev.newmodel{color:var(--accent)} .sev.newmodel svg{fill:none;stroke:var(--accent);stroke-width:1.6}
/* Wire categories (migration 0036): label in the category colour after a short bar. Never a square, triangle or circle: those mark severity. */
.cat{display:inline-flex;align-items:center;gap:6px;color:var(--cc,var(--ink-3))}
.cat::before{content:"";width:12px;height:3px;background:currentColor;flex:none}
.c-releases{--cc:var(--c-releases)} .c-pricing{--cc:var(--c-pricing)} .c-deprecations{--cc:var(--c-deprecations)}
.c-sdks{--cc:var(--c-sdks)} .c-rate-limits{--cc:var(--c-rate-limits)} .c-research{--cc:var(--c-research)}
.yours{color:var(--accent);display:inline-flex;gap:4px;align-items:center}
.idc{font:500 12.5px var(--mono);color:var(--ink);background:var(--fill);padding:1px 5px;border-radius:0;white-space:nowrap}
.meta{font:400 12.5px var(--mono);color:var(--ink-3)}
.page{padding-bottom:24px}
.page-h{padding-block:30px 22px;border-bottom:1px solid var(--rule-strong);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 32px;align-items:end}
.crumbs{font-size:13px;color:var(--ink-3);display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.crumbs a:hover{color:var(--ink);text-decoration:underline}
.page-h h1{font:600 clamp(30px,4vw,44px)/1.06 var(--serif);letter-spacing:-.018em}
.dek{font:400 18px/1.5 var(--serif);color:var(--ink-2);max-width:62ch;margin-top:10px}
.page-h .aside{font-size:13px;color:var(--ink-3);text-align:right;display:flex;flex-direction:column;gap:4px}
@media (max-width:760px){.page-h{grid-template-columns:1fr}.page-h .aside{text-align:left}}
.sect-h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 12px;border-top:3px solid var(--ink);padding-top:8px;margin-bottom:12px}
.sect-h h2,.sect-h h3{font:700 13px/1.3 var(--sans);letter-spacing:.07em;text-transform:uppercase}
.sect-h a,.sect-h span{font-size:13px;color:var(--ink-3);white-space:nowrap}
.sect-h a:hover{color:var(--ink)}
.sect-h[class*=" c-"]{border-top-color:var(--cc)} .sect-h[class*=" c-"] h2,.sect-h[class*=" c-"] h3{color:var(--cc)}
.caption{font-size:12.5px;color:var(--ink-3);margin-top:10px}

/* ---------- front page ---------- */
.front{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:0 32px;padding-top:26px}
.front-main{min-width:0}
.rail{min-width:0;border-left:1px solid var(--rule);padding-left:32px;display:flex;flex-direction:column;gap:30px}
/* The weekly email is its own aside under the rail (row 2), so narrow screens can move it apart from the rail. */
.front{grid-template-rows:auto 1fr}
.front-main{grid-column:1;grid-row:1 / span 2}
.front > .rail{grid-column:2;grid-row:1}
.front > .rail-nl{grid-row:2;padding-top:30px}
/* Narrow screens: one column in the order lead, rail, wire, email. The rail's reference modules are what people come
   back to check, so they go above the wire, cut to three rows each (the module heads link to the full lists). */
@media (max-width:1020px){
  .front{grid-template-columns:1fr;grid-template-rows:none}
  .front-main{display:contents}
  .front > .rail,.front > .rail-nl{grid-column:1;grid-row:auto}
  .front > .rail:not(.rail-nl){order:1;border-left:0;padding-left:0;padding-block:26px;border-bottom:1px solid var(--rule-strong);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:30px 32px}
  .front-main > .wire{order:2}
  .front > .rail-nl{order:3;border-left:0;padding-left:0;border-top:1px solid var(--rule-strong);padding-top:26px;margin-top:32px}
  .rail .mod > .cd:nth-of-type(n+5),.rail .mod > .pm:nth-of-type(n+5){display:none}
}

.lead-pk{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:0 28px;padding-bottom:26px;border-bottom:1px solid var(--rule-strong)}
@media (max-width:760px){.lead-pk{grid-template-columns:1fr}}
.lead h2{font:600 clamp(28px,3.3vw,40px)/1.07 var(--serif);letter-spacing:-.018em;margin:10px 0 12px}
.lead h2 a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.lead .dek{font-size:18px;margin-top:0}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:18px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.facts > div{padding:10px 12px 10px 0;min-width:0}
.facts > div + div{border-left:1px solid var(--rule);padding-left:12px}
.facts dt{font:600 11px var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.facts dd{margin:3px 0 0;font:600 15px var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.facts dd.brk{color:var(--brk)}
@media (max-width:460px){.facts{grid-template-columns:1fr 1fr}.facts > div:nth-child(3){grid-column:1/-1;border-left:0;padding-left:0;border-top:1px solid var(--rule)}}
.todo{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;margin-top:14px;font-size:15px;align-items:baseline}
.todo .lbl{font:700 11.5px var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--accent)}
.lead .meta{margin-top:14px;display:flex;flex-wrap:wrap;gap:4px 14px}
.lead-links{display:flex;gap:18px;margin-top:14px;font-size:14px;flex-wrap:wrap}
.seconds{border-left:1px solid var(--rule);padding-left:28px;display:flex;flex-direction:column;min-width:0}
@media (max-width:760px){.seconds{border-left:0;padding-left:0;border-top:1px solid var(--rule);margin-top:22px;padding-top:4px}}
.sec-story{padding-block:16px;display:flex;flex-direction:column;gap:7px}
.sec-story:first-child{padding-top:0}
@media (max-width:760px){.sec-story:first-child{padding-top:16px}}
.sec-story + .sec-story{border-top:1px solid var(--rule)}
.sec-story h3{font:600 20px/1.2 var(--serif);letter-spacing:-.008em}
.sec-story h3 button{all:unset;cursor:pointer}
.sec-story h3 button:hover{text-decoration:underline;text-underline-offset:4px}
.sec-story h3 button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sec-story p{font:400 15px/1.45 var(--serif);color:var(--ink-2)}

/* wire */
.wire{padding-top:30px;scroll-margin-top:80px}
.wire-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px 16px;flex-wrap:wrap}
.wire-h h2{font:600 28px/1.1 var(--serif);letter-spacing:-.012em}
.wire-h p{font-size:13.5px;color:var(--ink-3)}
.tabs{display:flex;gap:22px;border-bottom:1px solid var(--rule);margin-top:14px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{all:unset;cursor:pointer;padding:10px 0 9px;font-weight:600;font-size:14px;color:var(--ink-3);border-bottom:2px solid transparent;white-space:nowrap}
.tab:hover{color:var(--ink)}
.tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--ink)}
.tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tab small{font:500 11.5px var(--mono);color:var(--ink-3);margin-left:5px}
.ctrls{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;padding:11px 0;border-bottom:1px solid var(--rule);font-size:13.5px;color:var(--ink-2)}
.ctrls .grp{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ctrls .glbl{font:600 11px var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.ctrls label{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.ctrls input[type=checkbox]{accent-color:var(--ink);margin:0;width:14px;height:14px}
.sel{font:500 13.5px var(--sans);color:var(--ink);background:var(--surface);border:1px solid var(--rule-2);border-radius:0;padding:5px 8px;max-width:100%}
.ctrls .status{margin-left:auto;font:400 12.5px var(--mono);color:var(--ink-3)}
@media (max-width:760px){.ctrls .status{margin-left:0;width:100%}}
.newbar{all:unset;box-sizing:border-box;cursor:pointer;display:flex;justify-content:center;gap:8px;align-items:center;width:100%;padding:9px;margin-top:10px;border:1px solid var(--accent);color:var(--accent);font-weight:600;font-size:14px;border-radius:0;background:var(--surface)}
.newbar:hover{background:var(--fill)}
.newbar:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.w-day{font:700 12px var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--ink);padding:22px 0 7px;border-bottom:1px solid var(--rule-strong);display:flex;justify-content:space-between;gap:10px}
.w-day span{color:var(--ink-3);font-weight:500;letter-spacing:.02em;text-transform:none;font-size:12.5px}
.w-item{display:grid;grid-template-columns:66px minmax(0,1fr);gap:14px;padding:13px 10px;margin-inline:-10px;border-bottom:1px solid var(--rule);scroll-margin:90px 0 20px}
.w-item.is-sel{background:var(--fill)}
.w-item.is-new .w-time{color:var(--accent)}
.w-time{font:500 13px var(--mono);color:var(--ink-2);padding-top:3px;white-space:nowrap}
.w-body{min-width:0}
.w-body .kick{margin-bottom:4px;font-size:11px}
.w-hl{all:unset;cursor:pointer;font:600 18px/1.28 var(--serif);color:var(--ink);letter-spacing:-.004em}
.w-hl:hover{text-decoration:underline;text-decoration-color:var(--ink-3);text-underline-offset:4px}
.w-hl:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.w-todo{display:flex;gap:6px;margin-top:4px;font-size:14px;color:var(--ink-2);align-items:baseline}
.w-todo svg{color:var(--accent);position:relative;top:2px}
.w-more{margin-top:10px;display:flex;flex-direction:column;gap:10px}
.w-more .sum{font:400 15.5px/1.5 var(--serif);color:var(--ink-2);max-width:68ch}
.w-more dl{display:grid;grid-template-columns:84px minmax(0,1fr);gap:5px 12px;margin:0;font-size:13.5px}
.w-more dt{font:600 11px var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);padding-top:2px}
.w-more dd{margin:0;min-width:0;display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center}
.w-empty{padding:40px 0;color:var(--ink-3);font-size:14px}
.keys{display:flex;flex-wrap:wrap;gap:8px 18px;padding:14px 0;font-size:12.5px;color:var(--ink-3)}
.keys kbd{margin-right:3px}
@media (max-width:600px){.w-item{grid-template-columns:1fr;gap:3px}.w-time{padding-top:0;font-size:12px}.keys{display:none}}

/* rail modules */
.mod{min-width:0}
.cd{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1px 12px;padding:9px 0 10px;border-top:1px solid var(--rule)}
.cd:first-of-type{border-top:0;padding-top:0}
.cd .id{font:600 13.5px var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd a.id:hover{text-decoration:underline}
/* The model link covers its whole rail row, so a thumb can hit it; other links in the row sit above it. */
.cd,.pm{position:relative}
.cd a.id::after,.pm a.id::after{content:"";position:absolute;inset:0}
.cd .when a{position:relative;z-index:1}
.cd .left{font:600 14px var(--mono);text-align:right;white-space:nowrap}
.cd .left.brk{color:var(--brk)} .cd .left.hdu{color:var(--hdu)}
.cd .sub{font-size:12.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cd .when{font:400 12px var(--mono);color:var(--ink-3);text-align:right}
.meter{grid-column:1/-1;height:3px;background:var(--fill-2);margin-top:6px;position:relative}
.meter i{position:absolute;inset:0 auto 0 0;background:var(--ink-3)}
.meter i.brk{background:var(--brk)} .meter i.hdu{background:var(--hdu)}
.pm{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1px 12px;padding:8px 0;border-top:1px solid var(--rule);align-items:baseline}
.pm:first-of-type{border-top:0;padding-top:0}
.pm .id{font:600 13.5px var(--mono)}
.cd .id.nm,.pm .id.nm{font:600 14px var(--sans)}
.pm .d{font:600 13.5px var(--mono);display:inline-flex;align-items:center;gap:3px}
.pm .d.dn{color:var(--down)} .pm .d.up{color:var(--up)}
.pm .d svg{width:9px;height:9px;fill:currentColor}
.pm .sub{font:400 12.5px var(--mono);color:var(--ink-3);grid-column:1/-1}
.nl-mini > h3{font:600 22px/1.15 var(--serif);letter-spacing:-.01em}
.nl-mini p{font-size:14px;color:var(--ink-2);margin-top:6px}
.subform{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.subform .in{flex:1 1 160px;min-width:0}
.in{font:400 14px var(--sans);padding:9px 10px;border:1px solid var(--rule-2);border-radius:0;background:var(--surface);color:var(--ink);min-width:0}
.in:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.fine{font-size:12.5px;color:var(--ink-3);margin-top:8px}
.tz-set{border:0;padding:0;margin:8px 0 0}
.tz-set label{display:flex;gap:8px;align-items:center;margin:6px 0;font-size:14px}
.err{font-size:13px;color:var(--brk);margin-top:6px}
.done{margin-top:12px;font-size:14px;border-left:3px solid var(--down);padding:2px 0 2px 12px}
.done b{display:block}
.stack-mini{font-size:14px;color:var(--ink-2);display:flex;flex-direction:column;gap:10px}
.stack-mini .ids{display:flex;flex-wrap:wrap;gap:5px}
.pro-note{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--ink-2);background:var(--fill);padding:10px 12px;border-radius:0}
.pro-note svg{margin-top:2px;color:var(--ink-3)}
.pro-note b{color:var(--ink)}

/* ---------- tables ---------- */
/* position:relative makes the scroll box the containing block of .sr text in its cells, so a hidden label in a
   column scrolled out of view can't widen the page. */
.tbl{overflow-x:auto;min-width:0;position:relative}
table{width:100%;border-collapse:collapse;font-size:14px}
th{font:600 11px var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);text-align:left;padding:10px 12px;border-bottom:1px solid var(--rule-strong);white-space:nowrap;vertical-align:bottom}
td{padding:11px 12px;border-bottom:1px solid var(--rule);white-space:nowrap;vertical-align:middle}
th:first-child,td:first-child{padding-left:0}
th:last-child,td:last-child{padding-right:0}
td.r,th.r{text-align:right}
td.m{font-family:var(--mono);font-size:13.5px}
td.dim{color:var(--ink-3)}
/* Plan 13: a second line in a table cell (a platform variant, "Follows Anthropic's dates", a platform ID). Unlike
   .band it stays on phone cards. */
td small.sub{display:block;font:400 12px/1.35 var(--sans);color:var(--ink-3);margin-top:2px;white-space:normal;overflow-wrap:anywhere}
td small.sub.mono{font-family:var(--mono)}
td.wrapc{white-space:normal;min-width:220px;color:var(--ink-2);font-size:13.5px}
/* Cloud-platform tables: long platform IDs break (at hyphens first) and replacement advice wraps, so a desktop table
   fits its column instead of scrolling sideways. Phone cards override min-width. */
td.idw{white-space:normal;overflow-wrap:anywhere;min-width:140px}
td.repw{white-space:normal;min-width:160px}
td.platw{white-space:normal}
tr.mine td:first-child{box-shadow:inset 3px 0 0 var(--accent);padding-left:12px}
tr.gone td{color:var(--ink-3)}
th button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:4px}
th button:hover{color:var(--ink)}
th button:focus-visible{outline:2px solid var(--accent)}
th button svg{width:8px;height:10px;opacity:.35;fill:currentColor}
th[aria-sort="ascending"],th[aria-sort="descending"]{color:var(--ink)}
th[aria-sort="ascending"] button svg,th[aria-sort="descending"] button svg{opacity:1}
th[aria-sort="descending"] button svg{transform:rotate(180deg)}
/* Phones: a table marked .cards drops its columns, since a sideways scroll hides the figure the page is for. Each row
   becomes a short card. The key cell (.c-key, usually the model) and the answer (.c-ans: time left, status, a price)
   share the first line, with .c-lead before the key. The other cells wrap underneath, each named by its data-label;
   .c-break starts a new line with the cells after it, .c-wide takes a line of its own and .c-hide is dropped. The
   header row stays for screen readers. */
@media (max-width:600px){
  table.cards,table.cards tbody{display:block}
  table.cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  table.cards tbody tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 14px;padding:11px 0 12px;border-bottom:1px solid var(--rule)}
  table.cards tbody tr::before{content:"";order:1;flex-basis:100%}
  table.cards tbody tr:has(> td.c-break)::after{content:"";order:3;flex-basis:100%}
  table.cards td.c-break,table.cards td.c-break ~ td{order:4}
  table.cards td{display:block;order:2;min-width:0;padding:0;border:0;white-space:normal;font-size:13px;color:var(--ink-2)}
  table.cards td.c-lead,table.cards td.c-key,table.cards td.c-ans{order:0;font-size:14px;color:var(--ink)}
  table.cards td.c-key{flex:1 1 0;overflow-wrap:anywhere}
  table.cards td.c-ans{margin-left:auto;text-align:right}
  table.cards td.c-wide{flex-basis:100%}
  table.cards td.c-hide,table.cards td:empty,table.cards .band{display:none}
  table.cards td.c-wide{overflow-wrap:anywhere}
  /* The key cell's link covers the whole card; links in other cells sit above it. */
  table.cards tbody tr{position:relative}
  table.cards td.c-key a:first-of-type::after{content:"";position:absolute;inset:0}
  table.cards td:not(.c-key) a{position:relative;z-index:1}
  table.cards td[data-label]::before{content:attr(data-label);content:attr(data-label) / "";font:600 10.5px var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);margin-right:6px}
  table.cards tr.mine{box-shadow:inset 3px 0 0 var(--accent);padding-left:12px}
  table.cards tr.mine td:first-child{box-shadow:none;padding-left:0}
  table.cards tr.gone td{color:var(--ink-3)}
  table.cards tr.mon{display:block;padding:0;border:0}
  table.cards tr.mon::before{content:none}
  table.cards tr.mon th{display:block}
}
.st{font:600 11.5px var(--sans);letter-spacing:.06em;text-transform:uppercase;display:inline-flex;align-items:center;gap:5px}
.st svg{width:8px;height:8px}
.st.brk{color:var(--brk)} .st.brk svg{fill:var(--brk)}
.st.hdu{color:var(--hdu)} .st.hdu svg{fill:var(--hdu)}
.st.gone{color:var(--ink-3)} .st.gone svg{fill:none;stroke:var(--ink-3);stroke-width:1.6}
.tmeter{width:120px;height:4px;background:var(--fill-2);position:relative;display:inline-block;vertical-align:middle}
.tmeter i{position:absolute;inset:0 auto 0 0;background:var(--ink-3)}
.tmeter i.brk{background:var(--brk)} .tmeter i.hdu{background:var(--hdu)}
.idlink{font:600 13.5px var(--mono);color:var(--accent)}
.idlink:hover{text-decoration:underline}
.mlink{font:600 14px var(--sans);color:var(--accent)}
.mlink:hover{text-decoration:underline}
.mlink .mid{display:block;font:400 12px var(--mono);color:var(--ink-3);margin-top:1px;overflow-wrap:anywhere}
.chg.dn{color:var(--down);font-weight:600} .chg.up{color:var(--up);font-weight:600}
.costbar{display:inline-block;height:6px;background:var(--fill-2);width:90px;position:relative;vertical-align:middle;margin-right:10px}
.costbar i{position:absolute;inset:0 auto 0 0;background:var(--ink-3)}
tr.best .costbar i{background:var(--accent)}
tr.best td.cost{font-weight:700}
.seg{display:inline-flex;border:1px solid var(--rule-2);border-radius:0;overflow:hidden;flex-wrap:wrap}
.seg button{all:unset;cursor:pointer;padding:7px 12px;font-size:13.5px;font-weight:600;color:var(--ink-2)}
.seg button + button{border-left:1px solid var(--rule-2)}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.seg button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.toolbar{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;padding-block:16px;font-size:14px;color:var(--ink-2)}
.toolbar label{display:inline-flex;gap:7px;align-items:center;cursor:pointer}
.toolbar input[type=checkbox]{accent-color:var(--ink);margin:0}
.toolbar .in{width:88px;font-family:var(--mono);text-align:right;padding:7px 8px}
.toolbar .right{margin-left:auto;font-size:13px;color:var(--ink-3)}
@media (max-width:760px){.toolbar .right{margin-left:0}}
.feeds{display:flex;gap:16px;font-size:13.5px;flex-wrap:wrap}
.feeds a{display:inline-flex;gap:5px;align-items:center;color:var(--ink-2)}
.feeds a:hover{color:var(--ink)}

/* ---------- model page ---------- */
.m-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:0 40px;padding-top:26px}
.m-main{min-width:0;display:flex;flex-direction:column;gap:36px}
.m-side{min-width:0;display:flex;flex-direction:column;gap:30px}
@media (max-width:1020px){.m-grid{grid-template-columns:1fr}.m-side{margin-top:36px}}
.statusline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.statusline > div{padding:12px 14px;min-width:0}
.statusline > div:first-child{padding-left:0}
.statusline > div + div{border-left:1px solid var(--rule)}
.statusline dt{font:600 11px var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.statusline dd{margin:4px 0 0;font:600 15px var(--mono);overflow-wrap:anywhere}
@media (max-width:700px){.statusline{grid-template-columns:1fr 1fr}.statusline > div:nth-child(3){border-left:0;padding-left:0}.statusline > div:nth-child(n+3){border-top:1px solid var(--rule)}}
.clockbox{border:1px solid var(--rule-strong);padding:16px}
.clockbox .lbl{font:600 11px var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.clock{display:grid;grid-template-columns:repeat(4,1fr);margin-top:10px}
.clock div{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.clock div + div{border-left:1px solid var(--rule);padding-left:12px}
.clock b{font:600 30px/1 var(--mono);letter-spacing:-.02em}
.clock span{font-size:12px;color:var(--ink-3)}
.clockbox .fine{margin-top:12px}
.clockbox .btn{width:100%;margin-top:14px}
.cmp td{white-space:normal}
.cmp th{text-transform:none;letter-spacing:0;font:600 12.5px var(--mono);color:var(--ink-2)}
.cmp td:first-child{color:var(--ink-3);font-size:13px}
.cmp th:nth-child(n+2),.cmp td:nth-child(n+2){text-align:right;font-family:var(--mono);font-size:13.5px}
.cmp .dn{color:var(--down)} .cmp .up{color:var(--up)}
.chart-wrap{position:relative}
.chart-wrap svg{display:block;width:100%;height:auto;overflow:visible}
.legend{display:flex;gap:18px;font-size:13px;color:var(--ink-2);margin-bottom:8px;flex-wrap:wrap}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:16px;height:2px;display:inline-block}
.tip{position:absolute;pointer-events:none;background:var(--surface);border:1px solid var(--rule-2);box-shadow:0 2px 8px rgba(0,0,0,.08);padding:8px 10px;font-size:12.5px;border-radius:0;min-width:150px;z-index:2}
.tip b{display:block;font:600 12px var(--mono);margin-bottom:4px}
.tip div{display:flex;justify-content:space-between;gap:12px;font-family:var(--mono)}
details.tv{margin-top:10px;font-size:13.5px}
details.tv summary{cursor:pointer;color:var(--ink-3)}
details.tv table{margin-top:8px}
.steps{margin:0;padding:0;list-style:none;counter-reset:s;display:flex;flex-direction:column}
.steps li{counter-increment:s;display:grid;grid-template-columns:32px minmax(0,1fr);gap:4px 10px;padding:12px 0;border-top:1px solid var(--rule)}
.steps li:first-child{border-top:0;padding-top:0}
.steps li::before{content:counter(s);font:600 14px var(--mono);color:var(--accent);padding-top:1px}
.steps b{display:block;font-weight:600}
.steps p{font-size:14.5px;color:var(--ink-2);grid-column:2}
.tl{list-style:none;margin:0;padding:0;position:relative}
.tl li{display:grid;grid-template-columns:118px 18px minmax(0,1fr);gap:0 10px;padding-bottom:18px;position:relative}
.tl li::after{content:"";position:absolute;left:136px;top:14px;bottom:-2px;width:1px;background:var(--rule-2)}
.tl li:last-child::after{display:none}
.tl time{font:500 12.5px var(--mono);color:var(--ink-3);padding-top:2px;text-align:right}
.tl .node{width:9px;height:9px;border-radius:50%;background:var(--ink-3);margin:6px 0 0 5px;position:relative;z-index:1}
.tl .node.brk{background:var(--brk)} .tl .node.fut{background:var(--bg);border:1.5px solid var(--brk)} .tl .node.hdu{background:var(--hdu)}
.tl b{font-weight:600;display:block}
.tl p{font-size:14px;color:var(--ink-2)}
@media (max-width:520px){.tl li{grid-template-columns:18px minmax(0,1fr)}.tl time{grid-column:2;text-align:left;order:-1}.tl .node{grid-row:1/span 3;grid-column:1;margin-left:0}.tl li::after{left:4px}.tl li > div:last-child{grid-column:2}}
pre.code{margin:0;background:var(--fill);border:1px solid var(--rule);padding:12px 14px;font:400 12.5px/1.6 var(--mono);overflow-x:auto;color:var(--ink);border-radius:0}
pre.code .c{color:var(--ink-3)} pre.code .e{color:var(--brk)} pre.code .w{color:var(--hdu)}
.codehead{display:flex;justify-content:space-between;align-items:center;font:500 12.5px var(--mono);color:var(--ink-3);margin-bottom:6px}
.copy{all:unset;cursor:pointer;font:600 12.5px var(--sans);color:var(--accent);display:inline-flex;gap:4px;align-items:center}
.copy:focus-visible{outline:2px solid var(--accent)}
.side-list{display:flex;flex-direction:column}
.side-list a,.side-list div{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--rule);font-size:14px}
.side-list a:first-child,.side-list div:first-child{border-top:0;padding-top:0}
.side-list .idm{font:600 13.5px var(--mono)}
.side-list a:hover .idm{text-decoration:underline}
.side-list .nmm{font:600 14px var(--sans)}
.side-list a:hover .nmm{text-decoration:underline}
.prose{font:400 16.5px/1.6 var(--serif);color:var(--ink-2);max-width:66ch}
.prose b{color:var(--ink);font-weight:600}

/* ---------- footer ---------- */
.foot{margin-top:72px;border-top:1px solid var(--rule-strong);background:var(--surface)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(4,minmax(0,1fr));gap:28px 32px;padding-block:34px 28px}
@media (max-width:900px){.foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.foot-brand{grid-column:1/-1}}
.foot-brand p{font-size:14px;color:var(--ink-2);margin-top:10px;max-width:34ch}
.foot h4{font:700 11.5px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px;font-size:14px}
.foot ul a{color:var(--ink-2);display:inline-flex;gap:6px;align-items:center}
.foot ul a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.foot-base{border-top:1px solid var(--rule);padding-block:14px 26px;display:flex;justify-content:space-between;gap:8px 20px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-3)}

@media (prefers-reduced-motion: reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* ---------- v1 additions ---------- */
.empty{padding:24px 0;color:var(--ink-3);font-size:15px;max-width:62ch}
.pager{display:flex;justify-content:space-between;gap:16px;padding:18px 0;font-size:14px}
.pager a{color:var(--accent);font-weight:600}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:8px;z-index:50;background:var(--surface);padding:8px 12px;border:1px solid var(--rule-2)}
/* Link filters (.seg of <a>, used by /shutdowns and /prices). */
.seg a{padding:7px 12px;font-size:13.5px;font-weight:600;color:var(--ink-2);border-radius:0}
.seg a + a{border-left:1px solid var(--rule-2)}
.seg a:hover{color:var(--ink);background:var(--fill)}
.seg a[aria-current="page"]{background:var(--ink);color:var(--bg)}
.seg a:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}

/* My Stack (spec 4.3, 4.4): the bar, and Mark mode's left rule plus a text label (meaning never by colour alone). */
.stackbar{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:10px 0;padding:8px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);font:400 13.5px/1.4 var(--sans);color:var(--ink-2)}
.stackbar[hidden]{display:none}
.stackbar b{font-weight:600;color:var(--ink)}
.stackbar a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.stackbar .btn{font-size:12.5px}
.mine{box-shadow:inset 3px 0 0 var(--accent)}
.w-item.mine,.cd.mine,.pm.mine,.lead.mine{padding-left:12px}
tr.mine{box-shadow:none}
tr.mine > td:first-child{box-shadow:inset 3px 0 0 var(--accent);padding-left:12px}
.mine-lbl{font:600 10.5px var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--accent);margin-left:8px;white-space:nowrap}
.stack-btn{display:flex;flex-wrap:wrap;gap:10px;align-items:baseline;margin-top:12px;font:400 13.5px var(--sans);color:var(--ink-2)}
.stack-btn[hidden]{display:none}
/* A company's logo and name link to its page; they read as a label until hovered. */
a.plink{color:inherit;text-decoration:none;white-space:nowrap}
a.plink:hover{text-decoration:underline;text-underline-offset:2px}

/* Plan 10: the AIWire Monday sign-up box (front-page rail, /newsletter, issue pages). Square corners, thin rules. */
.nl-box{display:grid;gap:6px;margin:8px 0 0;max-width:420px}
.nl-box label{font:600 12px/1.3 var(--sans);color:var(--ink-2)}
.nl-box input{font:15px/1.4 var(--sans);padding:8px 10px;border:1px solid var(--rule-2);border-radius:0;background:var(--surface);color:var(--ink);min-width:0}
.nl-box .btn{justify-self:start}

/* Plan 11: feature marks. Shape carries meaning: filled square yes, half-filled partial, hollow no. */
.fv{display:inline-flex;align-items:baseline;gap:.4em;white-space:nowrap}
.fv i{display:inline-block;width:.62em;height:.62em;border:1.5px solid currentColor;flex:none}
.fv-yes i{background:currentColor}
.fv-part i{box-shadow:inset .31em 0 0 currentColor}
.fv-no{color:var(--ink-3)}
.fv small{color:var(--ink-3);white-space:normal}
.ft-tbl{overflow:visible}
.ftip{position:relative;display:inline-block;vertical-align:middle;margin-left:4px}
.ftip-b{all:unset;cursor:help;display:inline-flex;color:var(--ink-3);padding:2px}
.ftip-b:hover,.ftip-b:focus-visible{color:var(--accent)}
.ftip-b:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.ftip-t{display:none;position:absolute;left:-6px;top:calc(100% + 4px);z-index:3;width:min(280px,calc(100vw - 48px));background:var(--surface);border:1px solid var(--rule-2);box-shadow:0 2px 8px rgba(0,0,0,.08);padding:8px 10px;font:400 13px/1.45 var(--sans);color:var(--ink);white-space:normal;text-align:left}
.ftip:hover .ftip-t,.ftip-b:focus + .ftip-t{display:block}

/* iOS Safari zooms the page into any form field under 16px when it takes focus. Touch screens and narrow windows get
   16px fields. */
@media (max-width:1020px),(pointer:coarse){
  input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),select,.sel,textarea{font-size:16px}
}

/* An API ID in a headline wraps as one unit (to the next line, not at its own hyphens), unless it is wider than the
   line by itself. */
.idn{display:inline-block;max-width:100%;overflow-wrap:anywhere}

/* Touch screens: taller hit areas for small links. Where the link sits in a row, a negative margin cancels the padding
   so nothing moves. */
@media (pointer:coarse){
  .util-r a,.util-r button{padding-block:8px}
  .foot ul{gap:0}
  .foot ul a{padding-block:6px}
  .sect-h a{padding:10px 0 10px 16px;margin:-10px 0 -10px -16px}
  .crumbs a{padding-block:10px;margin-block:-10px}
  .ctrls input[type=checkbox]{width:18px;height:18px}
}
