/* Alternate routes of a model, nested under the original model.
   Marketing pricing tables: tr.rt rows (public pages). Dashboard Models page: .model-row.is-route. Uses existing Noir variables only. */
.rt-ar,.route-arrow{flex:none;width:13px;height:13px;color:var(--cream-3,var(--dim,#8a8880));vertical-align:-2px;margin-right:8px}
.rt-n,.route-tag{display:inline-block;margin-left:10px;padding:1px 7px;border:1px solid var(--line-2,#2b2a27);border-radius:999px;font-family:var(--mono,ui-monospace,monospace);font-size:10px;font-weight:500;font-style:normal;letter-spacing:.07em;text-transform:uppercase;line-height:1.6;white-space:nowrap;vertical-align:1px;color:var(--accent,var(--orange,#ff5500))}

/* ---- public pricing tables ---- */
body .pt tbody tr.rt{background:rgb(245 243 238 / .018)}
body .pt tbody tr.rt>*{border-top-color:transparent}
body .pt tbody tr:has(+tr.rt)>*{border-bottom-color:transparent}
body .pt tbody tr.rt>th{padding:9px 0 9px 22px;vertical-align:middle}
body .pt tbody tr.rt>td{padding-top:9px;padding-bottom:9px;font-size:13px;color:var(--cream-2,var(--muted,inherit))}
body .pt tbody tr.rt th code{display:inline;margin:0;font-size:12px;color:var(--cream-2,var(--muted,inherit))}
body .pt tbody tr.rt th .idcopy{margin-top:0;font-size:12px;color:var(--cream-2,var(--muted,inherit));vertical-align:middle}
body .pt tbody tr.rt th .idcopy:hover,body .pt tbody tr.rt th .idcopy.done{color:var(--orange,#ff5500)}
body .pt tbody tr.rt.rt-sub>th{padding-left:44px}
body .pt tbody tr.rt.rt-sub>*{border-top-color:var(--line-2,#2b2a27);border-top-style:dashed}
@media (max-width:860px){
  body .pt tbody tr.rt{margin-left:14px;width:calc(100% - 14px);padding:10px 0 10px 12px;border-left:1px solid var(--line-2,#2b2a27);background:none}
  body .pt tbody tr.rt>th{padding:0;margin-bottom:8px}
  body .pt tbody tr.rt.rt-sub>th{padding-left:0}
}

/* ---- dashboard Models page ---- */
.model-row.is-route{background:rgb(245 243 238 / .02)}
.model-row.has-routes{border-bottom-color:transparent}
.model-row.is-route .model-open{padding:9px 12px 9px 46px;gap:14px}
.model-row.is-route .model-identity{flex-direction:row;flex-wrap:wrap;align-items:center;gap:3px 14px}
.model-row.is-route .model-identity>strong{flex:1 1 100%}
.model-row.is-route .model-identity>small:first-of-type{display:none}
.model-row.is-route .model-identity>strong{font-size:12.5px;font-weight:500;gap:0;flex-wrap:wrap;row-gap:2px}
.model-row.is-route .model-identity>strong code{font-size:12px;color:var(--text,inherit)}
.model-row.is-route .model-identity>strong .route-tag{margin-left:10px}
.model-row.is-route .model-health-detail,.model-row.is-route .model-health-line time{display:none}
.model-row.is-route .model-rates strong{font-size:12px}
.model-row.is-route .model-rates small,.model-row.is-route .model-tier small{font-size:10.5px}
.model-row.is-route.is-selected{background:linear-gradient(90deg,rgb(255 85 0 / .09),transparent 70%),var(--panel,transparent)}
@media (max-width:1200px){.model-row.is-route .model-open{padding-left:34px}}
@media (max-width:767px){.model-row.is-route .model-open{padding:10px 10px 10px 28px}}
/* vision eye on a route row sits between the arrow and the ID */
body .pt tbody tr.rt .vis{margin:0 7px 0 0;vertical-align:-1px}
/* nested routes: comparison table */
body .pt.cmp tbody tr.rt>th{padding-left:22px}
body .pt.cmp tbody tr.rt>td{font-size:13px}
body .pt.cmp tbody tr.rt .d{font-size:12px}
@media (max-width:860px){body .pt.cmp tbody tr.rt{margin-left:14px;width:calc(100% - 14px)}}
/* icon .lg collides with noir-logo .lg (hero brand logo); only glm-api links noir-logo.css, where it blew the icons up to ~600px. 17px = what these bento icons already are on the other pages */
body.pg svg.ic.lg{position:static;width:17px;height:17px;max-width:none;min-height:0;margin:0}
/* claude-api: hero 'Model IDs' list and 'Which Claude model ID should I use?' */
body .lineup li.lu-rt{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:none;gap:4px 16px;align-items:center;padding:8px 0 8px 22px;background:rgb(245 243 238 / .018)}
body .lineup li.lu-rt .lu-rtid{display:flex;flex-wrap:wrap;align-items:center;gap:2px 0;min-width:0}
body .lineup li.lu-rt .lu-id{grid-area:auto;margin:0;font-size:12px;color:var(--cream-2,var(--muted))}
body .lineup li.lu-rt .lu-p{grid-column:2;grid-row:1;margin:0;text-align:right;justify-self:end;font-size:12.5px}
body .lineup li.lu-rt+li:not(.lu-rt){border-top-color:var(--line)}
body .lineup li:has(+li.lu-rt){border-bottom-color:transparent}
body .choose>li.ch-rt{padding:9px 0;align-items:center;background:rgb(245 243 238 / .018)}
body .choose>li:has(+li.ch-rt){border-bottom-color:transparent}
body .choose>li.ch-rt .ch-need{padding-left:22px;display:flex;flex-wrap:wrap;align-items:center;font-size:13px;font-weight:400}
body .choose>li.ch-rt .ch-id{font-size:12px}
body .choose>li.ch-rt .ch-p{font-size:12.5px}
.rt-note{margin-left:10px;font-size:11.5px;color:var(--cream-3,var(--dim,#8a8880));white-space:nowrap}
@media (max-width:760px){body .lineup li.lu-rt{padding-left:14px}body .choose>li.ch-rt .ch-need{padding-left:14px}}
/* family pages: hero highlight */
body.pg .hl{margin:0;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1.3fr);gap:6px 36px;align-items:center;padding:24px 0 22px;border-top:1px solid var(--line-2)}
body.pg .hl>*{margin:0}
body.pg .hl-k{grid-column:1/-1;display:flex;align-items:center;gap:10px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--cream-3,var(--muted));margin-bottom:4px}
body.pg .hl-k::before{content:"";width:6px;height:6px;background:var(--orange,#ff5500);transform:rotate(45deg)}
body.pg .hl-n{grid-column:1;font-size:22px;font-weight:550;letter-spacing:-.02em;color:var(--cream,var(--text))}
body.pg .hl-id{grid-column:1;grid-row:3;justify-self:start;background:none;border:0;padding:0;font-size:13px;color:var(--cream-2,var(--muted))}
body.pg .hl-p{grid-column:2;grid-row:2/span 2;font-size:15px;color:var(--cream-2,var(--muted));white-space:nowrap}
body.pg .hl-p b{color:var(--cream,var(--text));font-weight:500;font-size:19px}
body.pg .hl-p i{font-style:normal;color:var(--cream-3,var(--dim));margin:0 4px}
body.pg .hl-u{display:block;margin-top:4px;font-family:var(--sans,inherit);font-size:12.5px;color:var(--cream-3,var(--dim))}
body.pg .hl-d{grid-column:3;grid-row:2/span 2;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
body.pg .hl-d b{font-size:44px;font-weight:500;letter-spacing:-.03em;line-height:1;color:var(--orange,#ff5500)}
body.pg .hl-d span{font-size:14.5px;color:var(--cream-2,var(--muted));max-width:26ch}
body.pg .hl-d i{display:block;font-style:normal;font-size:12.5px;color:var(--cream-3,var(--dim));margin-top:3px}
@media (max-width:900px){body.pg .hl{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 24px}body.pg .hl-d{grid-column:1/-1;grid-row:auto;margin-top:8px}}
@media (max-width:560px){body.pg .hl{grid-template-columns:minmax(0,1fr);padding:20px 0}body.pg .hl-n,body.pg .hl-id,body.pg .hl-p,body.pg .hl-d{grid-column:1;grid-row:auto}body.pg .hl-d b{font-size:38px}body.pg .hl-p{margin-top:8px}}
