.sa-provider-detail { max-width: 1376px; padding: 24px 40px 64px; margin: 0 auto; color: light-dark(#302c28, #ebe8e1); font-size: 14px; line-height: 1.6; }
.sa-provider-detail *, .sa-provider-detail *::before { box-sizing: border-box; }
.sa-provider-detail svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.sa-provider-detail a { text-decoration: none; }
.sa-provider-detail a:hover { color: light-dark(#cf4813, #ffb07a); }
.sa-provider-detail :is(a, button, input, summary):focus-visible { outline: 2px solid light-dark(#db551b, #ffb07a); outline-offset: 4px; }
.sa-provider-back { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: light-dark(#857568, #bdb7ae); font-size: 12px; }
.sa-provider-profile-heading { display: flex; align-items: center; gap: 18px; padding: 22px 0 30px; }
.sa-provider-brand-icon { display: grid; place-items: center; width: 60px; height: 60px; background: light-dark(rgba(255,255,255,.7), rgb(28 28 27 / 0.700)); border: 1px solid var(--catalog-border); border-radius: 14px; color: light-dark(#d94b12, #ffb07a); flex-shrink: 0; }
.sa-provider-brand-icon svg { width: 32px; height: 32px; }
.sa-provider-brand-icon:has(img) { background: transparent; border: 0; border-radius: 20%; overflow: hidden; }
.sa-provider-brand-icon img { width: 100%; height: 100%; }
.sa-provider-identity { min-width: 0; }
.sa-provider-eyebrow { font-size: 11px; letter-spacing: .06em; color: light-dark(#877362, #bdb7ae); }
.sa-provider-eyebrow span { color: light-dark(#ac9584, #a19a90); margin-left: 6px; }
.sa-provider-identity h1 { font-size: 28px; font-weight: 620; letter-spacing: -.035em; line-height: 1.25; margin: 3px 0 6px; overflow-wrap: anywhere; }
.sa-provider-identity p { margin: 0; color: light-dark(#83766b, #bdb7ae); font-size: 13px; }
.sa-provider-primary-link { margin-left: auto; display: inline-flex; flex-shrink: 0; align-items: center; gap: 20px; min-height: 44px; padding: 8px 16px; color: light-dark(#a43f19, #ffb07a); border: 1px solid light-dark(#e9cbb4, rgb(190 180 163 / 0.300)); border-radius: 7px; background: light-dark(#fff6ed, #1c1c1b); font-size: 12px; }
.sa-provider-layout { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 36px; align-items: start; }
.sa-provider-main { min-width: 0; }
.sa-provider-stats { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); margin: 0 0 20px; background: light-dark(rgba(255,253,250,.66), rgb(28 28 27 / 0.660)); border: 1px solid var(--catalog-border); border-radius: 10px; padding: 17px 0; }
.sa-provider-stats > div { padding: 0 22px; }
.sa-provider-stats > div + div { border-left: 1px solid var(--catalog-border); }
.sa-provider-stats dt { color: light-dark(#85786c, #bdb7ae); font-size: 11px; }
.sa-provider-stats dd { margin: 2px 0 0; font-size: 28px; font-weight: 550; font-variant-numeric: tabular-nums; line-height: 1.4; letter-spacing: -.04em; }
.sa-provider-stats dd span { margin-left: 8px; color: light-dark(#a18e7e, #bdb7ae); font-size: 11px; letter-spacing: 0; font-weight: 400; }
.sa-provider-sections { display: flex; gap: 26px; border-bottom: 1px solid var(--catalog-border); margin-bottom: 18px; }
.sa-provider-sections a { display: inline-flex; gap: 7px; align-items: center; white-space: nowrap; min-height: 46px; font-size: 12px; font-weight: 550; color: light-dark(#776c63, #bdb7ae); border-bottom: 2px solid transparent; }
.sa-provider-sections a:first-child { border-color: light-dark(#e26023, rgb(139 93 60 / 0.300)); color: light-dark(#b6471a, #ffb07a); }
.sa-provider-sections span { font-size: 10px; font-weight: 400; color: light-dark(#9c8776, #bdb7ae); }
.sa-provider-search { display: flex; align-items: center; gap: 10px; padding: 2px 5px 2px 12px; margin-bottom: 22px; border: 1px solid var(--catalog-border); background: light-dark(rgba(255,255,255,.6), rgb(28 28 27 / 0.600)); border-radius: 7px; color: light-dark(#9a8c7f, #bdb7ae); }
.sa-provider-search input { flex: 1; width: 0; min-width: 0; min-height: 42px; background: transparent; border: 0; padding: 5px 0; color: light-dark(#443a32, #ebe8e1); font-size: 13px; }
.sa-provider-search :is(button,a) { min-height: 40px; display: inline-flex; align-items: center; padding: 6px 10px; background: transparent; border: 0; color: light-dark(#a44821, #ffb07a); font-size: 12px; border-radius: 5px; }
.sa-provider-section { scroll-margin-top: 96px; margin: 0 0 32px; }
.sa-provider-section > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
.sa-provider-section h2 { margin: 0 0 3px; font-size: 16px; letter-spacing: -.015em; font-weight: 600; }
.sa-provider-section header p { margin: 0 0 9px; font-size: 12px; color: light-dark(#938173, #bdb7ae); }
.sa-provider-kicker { display: block; color: light-dark(#806b59, #bdb7ae); font-size: 11px; font-weight: 500; }
.sa-provider-model { margin-top: 12px; padding: 20px; border: 1px solid light-dark(#e4d9ce, #47433e); border-radius: 12px; background: light-dark(#fffdfa, #292826); }
.sa-provider-model-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.sa-provider-model-heading > div { min-width: 0; flex: 1; }
.sa-provider-model h3 { margin: 2px 0 0; font-size: 17px; line-height: 1.4; font-weight: 600; letter-spacing: -.02em; overflow-wrap: anywhere; }
.sa-provider-model-icon, .sa-provider-node-icon { display: inline-grid; place-items: center; width: 42px; height: 42px; flex-shrink: 0; border: 1px solid light-dark(#f0d6c1, #69503d); border-radius: 10px; background: light-dark(#fff0e1, #45362b); color: light-dark(#ba4a18, #ffb07a); }
.sa-provider-model-route { display: flex; align-items: center; gap: 12px; padding: 4px 6px 4px 14px; background: light-dark(#f5f2ed, #201f1e); border: 1px solid light-dark(#eae3da, #3b3935); border-radius: 7px; }
.sa-provider-model-route code { flex: 1; min-width: 0; font-size: 12px; color: light-dark(#68594b, #d4cec5); overflow-wrap: anywhere; }
/* A complete request, laid out like a compact API reference. */
.sa-provider-request { --request-border:light-dark(#e4ded5,#373632); --request-muted:light-dark(#766d63,#a8a398); margin-top:12px; min-width:0; border:1px solid var(--request-border); border-radius:10px; background:light-dark(#f9f8f5,#1a1a18); overflow:hidden; }
.sa-provider-request summary { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:48px; padding:10px 16px; list-style:none; cursor:pointer; font-size:12px; font-weight:550; color:light-dark(#4f4840,#d4cec5); }
.sa-provider-request summary::-webkit-details-marker { display:none; }
.sa-provider-request summary:hover { background:light-dark(#f1eee8,#232320); }
.sa-provider-request-title { display:flex; align-items:center; gap:10px; min-width:0; }
.sa-provider-request-title svg { color:var(--request-muted); flex:none; width:16px; height:16px; }
.sa-provider-request-chevron { flex:none; width:16px; height:16px; }
.sa-provider-request[open] .sa-provider-request-chevron { transform:rotate(180deg); }
.sa-provider-request[open] summary { border-bottom:1px solid var(--request-border); }
.sa-provider-request-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:4px 12px; min-height:58px; padding:6px 12px 6px 18px; }
.sa-provider-request-label { color:var(--request-muted); font-size:11px; font-weight:550; }
.sa-provider-request-endpoint { display:flex; align-items:center; gap:12px; margin:0 18px 20px; min-width:0; }
.sa-provider-http-method { flex:none; padding:4px 8px; border:1px solid light-dark(#aed2bc,#305341); border-radius:5px; background:light-dark(#e8f4ec,#1f3228); color:light-dark(#226143,#9addb4); font:700 11px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.04em; }
.sa-provider-request code { padding:0; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; background:none; color:inherit; }
.sa-provider-request-endpoint code { min-width:0; overflow-wrap:anywhere; font-size:12px; line-height:1.7; }
.sa-provider-request-endpoint code > span { color:var(--request-muted); }
.sa-provider-request-endpoint strong { font-weight:500; color:light-dark(#383d3a,#e3e9e2); }
.sa-provider-request h4 { display:flex; align-items:center; gap:10px; margin:0; font-size:11px; font-weight:600; line-height:1.5; color:var(--request-muted); }
.sa-provider-request h4 > span { font-size:10px; font-weight:400; color:light-dark(#8b8278,#938e85); }
.sa-provider-request-headers { padding:16px 18px; border-block:1px solid var(--request-border); background:light-dark(#f0f0eb,#20211e); }
.sa-provider-request-headers dl { display:grid; gap:10px; margin:14px 0 0; font:12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; }
.sa-provider-request-headers dl > div { display:grid; grid-template-columns:140px minmax(0,1fr); gap:12px; }
.sa-provider-request-headers dt { color:light-dark(#645333,#d8c79f); }
.sa-provider-request-headers dd { min-width:0; margin:0; color:light-dark(#416451,#a0bcaa); overflow-wrap:anywhere; }
.sa-provider-request .sa-request-variable { color:light-dark(#99520e,#e2b780); }
.sa-provider-request-body { min-width:0; }
.sa-provider-request-body-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:50px; padding:4px 12px 0 18px; }
.sa-provider-request pre { max-width:100%; margin:0; padding:4px 18px 20px; overflow:auto; color:light-dark(#817a71,#96958b); font:12px/1.85 ui-monospace,SFMono-Regular,Consolas,monospace; tab-size:2; }
.sa-provider-request pre code { font:inherit; white-space:pre; }
.sa-provider-request .sa-request-key { color:light-dark(#8e411b,#e4ba92); }
.sa-provider-request .sa-request-string { color:light-dark(#246149,#a1cfb4); }
.sa-provider-request .sa-request-literal { color:light-dark(#694da4,#b9a3e1); }
.sa-provider-request-copy { display:inline-flex; flex:none; align-items:center; justify-content:center; gap:8px; min-height:44px; max-width:100%; padding:8px 12px; border:1px solid transparent; border-radius:7px; color:light-dark(#5d554c,#c8c3ba); background:transparent; cursor:pointer; }
.sa-provider-request-copy { font-family:inherit; font-size:11px; line-height:1.4; font-weight:550; }
.sa-provider-request-copy:hover { background:light-dark(#eae6de,#2c2d28); border-color:var(--request-border); color:light-dark(#342c24,#fff5e8); }
.sa-provider-request-copy--icon { width:44px; padding:10px; }
.sa-provider-request-copy svg { width:15px; height:15px; flex:none; }
.sa-provider-request-copy.is-copied { color:light-dark(#21613c,#93c9a0); }
.sa-provider-request-copy.is-copied svg { display:none; }
.sa-provider-request-copy.is-copied::before { content:'✓'; font-size:16px; width:15px; }
.sa-provider-request [hidden] { display:none !important; }
.sa-provider-request :is(pre,button,summary,a):focus-visible { outline:2px solid light-dark(#b9511d,#ffb07a); outline-offset:-3px; }
.sa-provider-request-footer { display:flex; align-items:center; justify-content:space-between; gap:8px 18px; padding:10px 18px; border-top:1px solid var(--request-border); }
.sa-provider-request-footer p { min-width:0; margin:0; color:var(--request-muted); font-size:11px; line-height:1.7; }
.sa-provider-request-footer a { display:inline-flex; flex:none; align-items:center; gap:8px; min-height:44px; color:light-dark(#944a21,#deb18a); font-size:11px; text-decoration:none; }
.sa-provider-request-footer a:hover { text-decoration:underline; }
@media (max-width:600px) {
 .sa-provider-request summary { padding-inline:12px; }
 .sa-provider-request-toolbar { padding-inline:12px 6px; }
 .sa-provider-request-endpoint { align-items:flex-start; gap:9px; margin-inline:12px; }
 .sa-provider-request-endpoint code { font-size:11px; }
 .sa-provider-request-endpoint code > span { display:block; }
 .sa-provider-request-headers { padding:14px 12px; }
 .sa-provider-request-headers dl > div { grid-template-columns:minmax(0,1fr); gap:2px; }
 .sa-provider-request-headers dl { gap:12px; font-size:11px; }
 .sa-provider-request-body-heading { padding-inline:12px 6px; }
 .sa-provider-request pre { padding-inline:12px; font-size:11px; }
 .sa-provider-request-footer { flex-wrap:wrap; gap:0; padding:12px 12px 2px; }
}
.sa-provider-context { font-size: 11px; color: light-dark(#796755, #bdb7ae); }
.sa-provider-model-nodes { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; font-size: 12px; }
.sa-provider-model-nodes > span { color: light-dark(#796755, #bdb7ae); margin-right: 2px; }
.sa-provider-model-nodes a { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 4px 10px; border-radius: 6px; border: 1px solid light-dark(#e6d6c7, #4b443d); color: light-dark(#a54b24, #ffb07a); overflow-wrap: anywhere; }
.sa-provider-model-nodes svg { width: 14px; height: 14px; }
.sa-provider-copy { display: inline-grid; place-items: center; width: 32px; min-width: 32px; height: 32px; padding: 6px; border: 0; border-radius: 5px; background: transparent; color: light-dark(#a69485, #bdb7ae); cursor: pointer; }
.sa-provider-copy svg { width: 14px; height: 14px; }
.sa-provider-copy:hover { color: light-dark(#d7551d, #ffb07a); background: light-dark(#f7e9dd, #1c1c1b); }
.sa-provider-copy.is-copied { color: light-dark(#3b7759, #93c9a0); }
.sa-provider-copy.is-copied svg { display: none; }
.sa-provider-copy.is-copied::after { content: '✓'; font-size: 17px; }
.sa-provider-state { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; font-size: 10px; font-weight: 500; padding: 3px 7px; border-radius: 4px; background: light-dark(#eee8e2, #1c1c1b); color: light-dark(#8c7c70, #bdb7ae); }
.sa-provider-state::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.sa-provider-state--sharing { color: light-dark(#497553, #93c9a0); background: light-dark(#edf1e7, #1c1c1b); }
.sa-provider-state--connected { color: light-dark(#b57833, #ffb07a); background: light-dark(#fcf0df, #1c1c1b); }
.sa-provider-node-count, .sa-provider-note { color: light-dark(#948071, #bdb7ae); font-size: 11px; }
.sa-provider-nodes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px),1fr)); gap: 14px; margin-top: 18px; }
.sa-provider-node { display: flex; flex-direction: column; min-width: 0; padding: 20px; border: 1px solid light-dark(#e4d9ce, #47433e); background: light-dark(#fffdfa, #292826); border-radius: 12px; scroll-margin-top: 100px; }
.sa-provider-node:target { border-color: light-dark(#db551b, #ffb07a); }
.sa-provider-node-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.sa-provider-node h3 { font-size: 17px; line-height: 1.4; font-weight: 600; margin: 0 0 5px; letter-spacing: -.02em; overflow-wrap: anywhere; }
.sa-provider-node h3 a { color: inherit; }
.sa-provider-node-summary { margin: 0 0 16px; font-size: 12px; color: light-dark(#796b5e, #c3bcb2); }
.sa-provider-node summary { display: flex; align-items: center; justify-content: space-between; min-height: 44px; font-size: 12px; color: light-dark(#94613c, #ffb07a); cursor: pointer; list-style: none; }
.sa-provider-node summary::-webkit-details-marker { display: none; }
.sa-provider-node-models { list-style: none; margin: 0 0 12px; padding: 0; font-size: 12px; overflow-wrap: anywhere; }
.sa-provider-node-models a { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 40px; padding: 8px 10px; border: 1px solid light-dark(#eae3da, #3b3935); border-radius: 6px; background: light-dark(#f5f2ed, #201f1e); color: light-dark(#68594b, #d4cec5); }
.sa-provider-node-models li + li { margin-top: 6px; }
.sa-provider-node details .sa-provider-node-models { max-height: 240px; overflow-y: auto; }
.sa-provider-node-link { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; margin-top: auto; padding-top: 12px; border-top: 1px solid light-dark(#e8ded3, #423e39); color: light-dark(#ad4e23, #ffb07a); font-size: 12px; font-weight: 550; }
.sa-provider-about { border: 1px solid var(--catalog-border); background: light-dark(rgba(255,253,250,.58), rgb(28 28 27 / 0.580)); padding: 20px; border-radius: 10px; position: sticky; top: 94px; }
.sa-provider-about h2 { font-size: 13px; margin: 0 0 18px; font-weight: 600; }
.sa-provider-about dl { margin: 0; }
.sa-provider-about dl > div + div { margin-top: 16px; }
.sa-provider-about :is(dt,h3) { display: flex; align-items: center; gap: 7px; color: light-dark(#958171, #bdb7ae); font-size: 11px; font-weight: 400; }
.sa-provider-about :is(dt,h3) svg { width: 14px; height: 14px; }
.sa-provider-about dd { color: light-dark(#5d5045, #ebe8e1); font-size: 12px; margin: 5px 0 0 21px; }
.sa-provider-profile-sites { border-top: 1px solid var(--catalog-border); margin-top: 20px; padding-top: 14px; }
.sa-provider-profile-sites h3 { margin: 0 0 12px; }
.sa-provider-profile-sites ul { max-height: 260px; overflow-y: auto; list-style: none; margin: 0; padding: 0; }
.sa-provider-profile-sites li + li { margin-top: 12px; }
.sa-provider-profile-sites strong { display: block; color: light-dark(#74604f, #bdb7ae); font-weight: 500; font-size: 11px; overflow-wrap: anywhere; }
.sa-provider-profile-sites li span { color: light-dark(#a9937f, #bdb7ae); font-size: 11px; }
.sa-provider-policies { border-top: 1px solid var(--catalog-border); margin-top: 20px; padding-top: 10px; }
.sa-provider-policies a { display: flex; align-items: center; justify-content: space-between; min-height: 40px; color: light-dark(#8e5b3b, #ffb07a); font-size: 12px; }
.sa-provider-section-empty, .sa-provider-unavailable { border: 1px solid light-dark(#e4d9ce, #47433e); background: light-dark(#f8f5f0, #242321); padding: 18px; border-radius: 8px; color: light-dark(#9a7f69, #bdb7ae); font-size: 12px; }
.sa-provider-unavailable h2 { color: light-dark(#5e4b3a, #ffb07a); font-size: 18px; }
.sa-provider-unavailable a { display: inline-flex; align-items: center; min-height: 44px; color: light-dark(#b84c20, #ffb07a); }
.sa-provider-updated { font-size: 10px; color: light-dark(#ac9581, #a19a90); margin: 20px 0 0; }
.sa-provider-pagination { display: flex; flex-wrap: wrap; gap: 8px 12px; justify-content: space-between; align-items: center; padding-top: 12px; font-size: 11px; color: light-dark(#9c816a, #bdb7ae); }
.sa-provider-pagination div { display: flex; flex-wrap: wrap; gap: 12px; }
.sa-provider-pagination a { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: light-dark(#a04e29, #ffb07a); }
.sa-provider-pagination [data-provider-load-more] { justify-content: center; padding: 0 18px; border: 1px solid light-dark(#dcc5b3, #625044); border-radius: 8px; background: light-dark(#fff8f2, #2b2520); font-weight: 600; }
.sa-provider-pagination [aria-disabled="true"] { opacity: .65; cursor: wait; }
.sa-provider-load-status { min-height: 1.5em; color: light-dark(#796b5e, #c3bcb2); font-size: 12px; }
.sa-provider-model:focus-visible, .sa-provider-pagination a:focus-visible { outline: 2px solid #ff6a00; outline-offset: 4px; }
.sa-provider-copy-feedback:empty { display: none; }
.sa-provider-copy-feedback { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); max-width: calc(100vw - 32px); background: light-dark(#3c322a, #151617); color: #fff9f3; padding: 9px 16px; border-radius: 8px; font-size: 12px; box-shadow: 0 4px 20px light-dark(#35231720, rgb(0 0 0 / 0.176)); z-index: 20; text-align: center; }
@media (max-width: 1100px) { .sa-provider-detail { padding-inline: 24px; } .sa-provider-layout { grid-template-columns: minmax(0,1fr) 230px; gap: 22px; } }
@media (max-width: 760px) {
 .sa-provider-detail { padding: 12px 18px 36px; }
 .sa-provider-profile-heading { display: grid; grid-template-columns: 46px minmax(0,1fr); gap: 12px; padding: 12px 0 22px; }
 .sa-provider-brand-icon { width: 46px; height: 46px; border-radius: 11px; }
 .sa-provider-brand-icon svg { width: 26px; height: 26px; }
 .sa-provider-identity { flex: 1; } .sa-provider-identity h1 { font-size: 23px; }
 .sa-provider-identity p { font-size: 11px; } .sa-provider-primary-link { margin-left: 0; min-height: 44px; grid-column: 2; justify-self: start; }
 .sa-provider-layout { grid-template-columns: minmax(0,1fr); gap: 24px; }
 .sa-provider-about { position: static; } .sa-provider-about dl { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; } .sa-provider-about dl > div + div { margin: 0; } .sa-provider-about dd { margin-left: 0; }
 .sa-provider-stats { padding: 12px 0; } .sa-provider-stats > div { padding: 0 12px; }
 .sa-provider-stats dd { font-size: 25px; } .sa-provider-stats dd span { display: block; margin: 0; } .sa-provider-stats dt { font-size: 10px; }
 .sa-provider-sections { gap: 16px; } .sa-provider-sections a { gap: 5px; font-size: 11px; }
 .sa-provider-model h3 { font-size: 14px; } .sa-provider-copy { width: 44px; min-width: 44px; height: 44px; }
 .sa-provider-model { padding: 16px; } .sa-provider-model-heading { flex-wrap: wrap; } .sa-provider-model-nodes a { min-height: 44px; }
 .sa-provider-node summary, .sa-provider-search :is(button,a) { min-height: 44px; }
 .sa-provider-section header p { font-size: 11px; }
}
@media (max-width: 370px) { .sa-provider-detail { padding-inline: 12px; } .sa-provider-sections { gap: 11px; } .sa-provider-about dl { grid-template-columns: 1fr; } .sa-provider-identity h1 { font-size: 21px; } }
@media (pointer: coarse) { .sa-provider-copy { width: 44px; min-width: 44px; height: 44px; } .sa-provider-node summary { min-height: 44px; } }

.sa-provider-detail .screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.sa-node-detail { max-width: 1120px; }
.sa-node-heading { display: flex; align-items: center; gap: 18px; padding: 26px 0 34px; }
.sa-node-heading > div { flex: 1; min-width: 0; }
.sa-node-heading .sa-provider-node-icon { width: 58px; height: 58px; border-radius: 14px; }
.sa-node-heading .sa-provider-node-icon svg { width: 26px; height: 26px; }
.sa-node-heading h1 { font-size: clamp(24px, 3vw, 34px); line-height: 1.25; letter-spacing: -.035em; margin: 3px 0 7px; overflow-wrap: anywhere; }
.sa-node-heading p { margin: 0; color: light-dark(#796b5e, #c3bcb2); font-size: 13px; }
.sa-node-uptime { padding: 28px; border: 1px solid light-dark(#e4d9ce, #47433e); border-radius: 16px; background: light-dark(#fffdfa, #292826); }
.sa-node-uptime > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sa-node-uptime h2 { font-size: 24px; letter-spacing: -.025em; margin: 2px 0 0; }
.sa-node-period { font-size: 12px; color: light-dark(#796b5e, #c3bcb2); }
.sa-node-period span { margin-left: 6px; font-size: 10px; }
.sa-node-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; margin: 28px 0 36px; padding: 24px 0; border-block: 1px solid light-dark(#e8ded3, #423e39); }
.sa-node-metrics > div + div { border-left: 1px solid light-dark(#e8ded3, #423e39); padding-left: 20px; }
.sa-node-metrics dt { color: light-dark(#796b5e, #c3bcb2); font-size: 12px; }
.sa-node-metrics dd { margin: 6px 0; font-size: 32px; line-height: 1.2; font-weight: 550; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.sa-node-metrics dd > span { font-size: 18px; margin-left: 2px; }
.sa-node-metrics .sa-node-metric-note { font-size: 11px; font-weight: 400; letter-spacing: 0; line-height: 1.5; color: light-dark(#796b5e, #c3bcb2); }
.sa-uptime-timeline { display: flex; gap: 5px; position: relative; }
.sa-uptime-day { display: block; flex: 1; min-width: 0; height: 48px; border-radius: 4px; outline-offset: 3px; }
.sa-uptime-day:focus-visible { outline: 2px solid light-dark(#b74b21, #ffb07a); }
.sa-uptime-day--online { background: light-dark(#64a975, #8cc9a0); }
.sa-uptime-day--interrupted { background: light-dark(#df8850, #efa373); }
.sa-uptime-day--unknown { background: light-dark(#e6e1d9, #494640); }
.sa-uptime-day--partial { background-image: repeating-linear-gradient(135deg, transparent 0 5px, light-dark(#ffffff75, #29282670) 5px 7px); }
.sa-uptime-day-tip { display: none; position: absolute; bottom: calc(100% + 10px); left: 0; min-width: 160px; padding: 12px 14px; border: 1px solid light-dark(#e4d9ce, #62584c); border-radius: 8px; background: light-dark(#fffdfa, #302d28); color: light-dark(#5b4e43, #e9e3d8); font-size: 11px; line-height: 1.8; box-shadow: 0 4px 18px #0002; pointer-events: none; z-index: 2; }
.sa-uptime-day-tip strong { display: block; font-size: 12px; }
.sa-uptime-day:nth-child(n+16) .sa-uptime-day-tip { left: auto; right: 0; }
.sa-uptime-day:is(:hover,:focus) .sa-uptime-day-tip { display: block; }
.sa-uptime-dates { display: flex; justify-content: space-between; margin: 9px 0 24px; font-size: 11px; color: light-dark(#796b5e, #c3bcb2); }
.sa-uptime-legend { display: flex; flex-wrap: wrap; gap: 12px 22px; font-size: 11px; color: light-dark(#796b5e, #c3bcb2); }
.sa-uptime-legend > span { display: inline-flex; align-items: center; gap: 7px; }
.sa-uptime-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; }
.sa-uptime-empty { margin-top: 24px; border: 1px solid light-dark(#eae3da, #3b3935); border-radius: 8px; padding: 18px; background: light-dark(#f5f2ed, #201f1e); }
.sa-uptime-empty strong { font-size: 13px; font-weight: 550; }
.sa-uptime-empty p { margin: 5px 0 0; color: light-dark(#796b5e, #c3bcb2); font-size: 12px; }
.sa-uptime-method { max-width: 740px; color: light-dark(#796b5e, #c3bcb2); font-size: 12px; margin: 24px 0 0; }
@media (max-width: 760px) {
 .sa-node-heading { display: grid; grid-template-columns: 46px minmax(0,1fr); gap: 12px; padding: 18px 0 26px; }
 .sa-node-heading .sa-provider-node-icon { width: 46px; height: 46px; }
 .sa-node-heading > .sa-provider-state { grid-column: 2; justify-self: start; }
 .sa-node-uptime { padding: 18px; }
 .sa-node-uptime > header { align-items: flex-start; }
 .sa-node-period { text-align: right; font-size: 11px; } .sa-node-period span { display: block; }
 .sa-node-metrics { gap: 16px; grid-template-columns: repeat(2,minmax(0,1fr)); margin: 20px 0 28px; padding: 18px 0; }
 .sa-node-metrics > div:first-child { grid-column: 1 / -1; }
 .sa-node-metrics > div + div { border-left: 0; border-top: 1px solid light-dark(#e8ded3, #423e39); padding: 16px 0 0; }
 .sa-node-metrics dd { font-size: 28px; }
 .sa-uptime-timeline { gap: 3px; } .sa-uptime-day { height: 36px; border-radius: 2px; }
}

/* ECharts enhancement: native day labels remain the fallback until initialization succeeds. */
.sa-node-period > [data-uptime-period] { margin: 0; font-size: inherit; display: inline; }
.sa-node-chart [hidden] { display: none !important; }
.sa-chart-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 12px; }
.sa-chart-toolbar > div:first-child { display: flex; flex-direction: column; gap: 2px; }
.sa-chart-toolbar strong { font-size: 13px; font-weight: 550; }
.sa-chart-toolbar > div > span { font-size: 11px; color: light-dark(#796b5e, #c3bcb2); }
.sa-chart-ranges { display: inline-flex; padding: 3px; border: 1px solid light-dark(#e6ded4, #49433b); border-radius: 9px; background: light-dark(#f6f2ec, #211f1c); flex-shrink: 0; }
.sa-chart-ranges button { min-height: 38px; min-width: 66px; padding: 7px 12px; border: 0; border-radius: 6px; color: light-dark(#796b5e, #c3bcb2); background: transparent; font: inherit; font-size: 12px; cursor: pointer; }
.sa-chart-ranges button[aria-pressed="true"] { color: light-dark(#a6451f, #ffb07a); background: light-dark(#fffdf9, #3b3127); box-shadow: 0 1px 3px #0001; }
.sa-chart-plot-wrap { position: relative; isolation: isolate; }
.sa-chart-plot { width: 100%; height: 300px; touch-action: pan-y; }
.sa-chart-plot:focus-visible { outline: 2px solid light-dark(#b74b21, #ffb07a); outline-offset: 3px; border-radius: 4px; }
.sa-chart-plot svg { width: auto; height: auto; fill: initial; stroke: initial; stroke-width: initial; stroke-linecap: initial; stroke-linejoin: initial; }
.sa-chart-building { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin: 4px 0 18px; padding: 12px 14px; border: 1px solid light-dark(#e6ded4, #423d36); border-radius: 8px; background: light-dark(#f6f3ee, #23211e); }
.sa-chart-building strong { font-size: 12px; font-weight: 550; color: light-dark(#665647, #d4cdc3); }
.sa-chart-building span { font-size: 11px; line-height: 1.5; color: light-dark(#796b5e, #b9afa3); }
.sa-chart-palette { display: none; }
.sa-chart-palette [data-chart-color="accent"] { color: light-dark(#d36327, #ffb07a); }
.sa-chart-palette [data-chart-color="online"] { color: light-dark(#5c9871, #8cc9a0); }
.sa-chart-palette [data-chart-color="offline"] { color: light-dark(#ce7650, #efa373); }
.sa-chart-palette [data-chart-color="unknown"] { color: light-dark(#e6e1d9, #494640); }
.sa-chart-palette [data-chart-color="text"] { color: light-dark(#796b5e, #c3bcb2); }
.sa-chart-palette [data-chart-color="line"] { color: light-dark(#e6ded4, #49433b); }
.sa-chart-palette [data-chart-color="surface"] { color: light-dark(#fffdfa, #292826); }
.sa-chart-line-key i { height: 2px; width: 14px; background: light-dark(#d36327, #ffb07a); }
.sa-chart-details { margin-top: 22px; padding: 18px 20px; background: light-dark(#f6f3ee, #23211e); border: 1px solid light-dark(#e6ded4, #423d36); border-radius: 10px; }
.sa-chart-selected { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.sa-chart-selected > div:first-child { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.sa-chart-selected strong { font-size: 13px; font-weight: 550; }
.sa-chart-selected span { font-size: 12px; color: light-dark(#a94d27, #ffb07a); }
.sa-chart-day-nav { display: flex; gap: 6px; flex-shrink: 0; }
.sa-chart-day-nav button { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid light-dark(#e6ded4, #49433b); border-radius: 6px; color: light-dark(#796b5e, #c3bcb2); background: transparent; cursor: pointer; font-size: 16px; }
.sa-chart-day-nav button:disabled { opacity: .35; cursor: default; }
.sa-chart-day-values { display: flex; flex-wrap: wrap; gap: 16px 40px; margin: 12px 0 0; }
.sa-chart-day-values > div { display: flex; align-items: baseline; gap: 8px; }
.sa-chart-day-values dt { font-size: 11px; color: light-dark(#796b5e, #c3bcb2); }
.sa-chart-day-values dd { margin: 0; font-size: 13px; font-variant-numeric: tabular-nums; }
@media (max-width: 760px) {
 .sa-chart-toolbar { align-items: flex-start; flex-wrap: wrap; }
 .sa-chart-ranges button { min-height: 44px; }
 .sa-chart-plot { height: 270px; }
 .sa-chart-details { padding: 14px; }
 .sa-chart-selected > div:first-child { gap: 3px; flex-direction: column; }
 .sa-chart-day-nav button { width: 44px; height: 44px; }
 .sa-chart-day-values { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
 .sa-chart-day-values > div { display: block; }
 .sa-chart-day-values dd { margin-top: 4px; }
}
@media (pointer: coarse) { .sa-chart-day-nav button { width: 44px; height: 44px; } .sa-chart-ranges button { min-height: 44px; } }
.sa-node-chart:not([data-chart-ready="true"]) .sa-chart-line-key { display: none; }
.sa-node-uptime:has([data-chart-ready="true"]) > .sa-uptime-empty { display: none; }