/* Layout and static progressive fallbacks. All colour/shape comes from shadcn.
   React shadcn controls use the same compiled utilities and semantic tokens. */
* { box-sizing: border-box; }
body.tp-app { margin:0; background:var(--background); color:var(--foreground); font:16px/1.6 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; overflow-wrap:break-word; }
.tp-app :where(p,h1,h2,h3,ul,dl) { margin:0; }
:where(.tp-app a) { color:inherit; }
.tp-app :focus-visible { outline:3px solid var(--ring); outline-offset:3px; }
.tp-container { max-width:1280px; margin:auto; padding-inline:32px; }
.tp-skip { position:absolute; left:-10000px; top:8px; z-index:100; padding:12px 24px; background:var(--primary); color:var(--primary-foreground); }
.tp-skip:focus { left:8px; }
.tp-topbar, .tp-appfooter { background:var(--card); color:var(--foreground); }
.tp-topbar { border-bottom:1px solid var(--border); }
.tp-topbar-inner, .tp-appfooter-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.tp-brand-link { display:inline-flex; flex:none; }
.tp-brand-img { width:132px; height:132px; object-fit:contain; display:block; }
.tp-topnav { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.tp-topnav-link { padding:10px 16px; min-height:44px; border-radius:calc(var(--radius) - 2px); font-size:14px; font-weight:600; text-decoration:none; }
.tp-topnav-link:hover { background:var(--muted); }
.tp-topnav-link[aria-current="page"] { background:var(--primary); color:var(--primary-foreground); }
.tp-staging-banner { background:var(--muted); color:var(--secondary-foreground); font-size:12px; padding-block:8px; }
.tp-staging-banner p { display:flex; flex-wrap:wrap; gap:6px; }
.tp-state-picker { background:var(--card); border-bottom:1px solid var(--border); font-size:12px; padding-block:8px; }
.tp-state-picker-inner { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.tp-state-picker-label { font-weight:600; }
.tp-state-picker-list { list-style:none; display:flex; flex-wrap:wrap; gap:4px; padding:0; }
.tp-state-pill { display:inline-flex; gap:6px; align-items:center; min-height:44px; padding:6px 12px; border-radius:calc(var(--radius) - 2px); text-decoration:none; background:var(--muted); font-size:12px; }
.tp-state-pill[aria-current="true"] { background:var(--primary); color:var(--primary-foreground); }
.tp-shell { padding-bottom:64px; }
.tp-page-head { padding:40px 0; position:relative; background:var(--primary); color:var(--primary-foreground); box-shadow:0 0 0 100vmax var(--primary); clip-path:inset(0 -100vmax); margin-bottom:28px; }
.tp-page-head::after { content:""; position:absolute; right:0; top:0; width:24px; height:24px; background:var(--accent-fold); clip-path:polygon(0 0,100% 0,100% 100%); }
.tp-page-kicker { font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:600; margin-bottom:12px!important; }
.tp-page-title { font-size:clamp(32px,4vw,54px); font-weight:650; line-height:1.08; letter-spacing:-.04em; max-width:25ch; }
.tp-page-purpose { margin-top:16px!important; font-size:17px; max-width:65ch; }
.tp-page-action { font-size:13px; margin-top:16px!important; }
.tp-sheet { background:var(--card); color:var(--card-foreground); border:1px solid var(--border); border-radius:var(--radius); padding:28px; margin-top:24px; min-width:0; }
.tp-sheet-head { display:flex; flex-wrap:wrap; gap:8px 16px; align-items:baseline; justify-content:space-between; padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid var(--border); }
.tp-sheet-title { font-size:20px; line-height:1.3; font-weight:650; letter-spacing:-.02em; }
.tp-sheet-sub { font-size:14px; color:var(--secondary-foreground); margin-top:6px!important; max-width:60ch; }
.tp-doc-meta { list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:8px 24px; font-size:13px; color:var(--secondary-foreground); }
.tp-doc-meta dt { display:inline; font-weight:600; color:var(--foreground); }
.tp-doc-meta dd { display:inline; margin-left:8px; }
.tp-rev { font-size:12px; font-variant-numeric:tabular-nums; color:var(--secondary-foreground); }
.tp-form { display:grid; gap:20px; }
.tp-field-row { display:grid; gap:8px; }
.tp-label, .tp-legend { font-size:14px; font-weight:600; }
.tp-input,.tp-select,.tp-textarea { width:100%; min-height:48px; border:1px solid var(--input); border-radius:calc(var(--radius) - 2px); background:var(--background); color:var(--foreground); font:inherit; font-size:14px; padding:10px 12px; }
.tp-input:disabled,.tp-select:disabled,.tp-textarea:disabled { opacity:1; background:var(--disabled); color:var(--disabled-foreground); -webkit-text-fill-color:var(--disabled-foreground); cursor:not-allowed; }
.tp-help { font-size:14px; color:var(--secondary-foreground); margin-top:8px!important; }
.tp-error-text { color:var(--destructive); font-size:14px; font-weight:600; }
.tp-check-row { display:flex; align-items:center; gap:12px; min-height:48px; }
.tp-check-row input { width:20px; height:20px; accent-color:var(--primary); }
.tp-fieldset { padding:0; margin:0; border:0; }
.tp-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 18px; border:1px solid transparent; border-radius:calc(var(--radius) - 2px); font:600 14px/1.5 inherit; text-decoration:none; cursor:pointer; }
.tp-btn--primary { background:var(--primary); color:var(--primary-foreground)!important; }
.tp-btn--secondary { background:var(--secondary); color:var(--secondary-foreground); }
.tp-btn--outline { background:var(--background); border-color:var(--input); }
.tp-btn--ghost { background:transparent; color:var(--foreground); }
.tp-btn:hover { text-decoration:underline; text-underline-offset:4px; }
.tp-btn--ghost:hover,.tp-btn--outline:hover { background:var(--muted); }
.tp-btn[disabled],.tp-btn[aria-disabled="true"] { opacity:1; background:var(--disabled); color:var(--disabled-foreground)!important; border-color:var(--disabled-border); cursor:not-allowed; }
.tp-btn-row { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; }
.tp-unavailable { display:flex; align-items:flex-start; gap:10px; padding:14px 16px; margin-top:16px; border:1px solid var(--border); border-radius:var(--radius); background:var(--muted); color:var(--secondary-foreground); font-size:13px; }
.tp-state { display:flex; align-items:flex-start; gap:12px; padding:16px; margin-top:16px; border:1px solid var(--border); border-radius:var(--radius); background:var(--muted); }
.tp-state-icon { flex:none; display:inline-flex; justify-content:center; align-items:center; width:24px; height:24px; font-weight:700; }
.tp-state-words { font-size:15px; line-height:1.5; font-weight:600; }
.tp-state-reason,.tp-state-next { font-size:13px; color:var(--secondary-foreground); margin-top:6px!important; }
.tp-state--ok { background:var(--status-ok-tint); border-color:var(--status-ok); }
.tp-state--warn { background:var(--status-warn-tint); border-color:var(--status-warn); }
.tp-state--unknown { background:var(--status-unknown-tint); border-color:var(--status-unknown); }
.tp-state--fail { background:var(--status-fail-tint); border-color:var(--status-fail); }
.tp-state--ok .tp-state-words,.tp-state--ok .tp-state-icon { color:var(--status-ok); }
.tp-state--warn .tp-state-words,.tp-state--warn .tp-state-icon { color:var(--status-warn); }
.tp-state--unknown .tp-state-words,.tp-state--unknown .tp-state-icon { color:var(--status-unknown); }
.tp-state--fail .tp-state-words,.tp-state--fail .tp-state-icon { color:var(--status-fail); }
.tp-badge { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; border:1px solid var(--border); border-radius:calc(var(--radius) - 4px); padding:4px 8px; background:var(--muted); color:var(--foreground); }
.tp-badge--ok { background:var(--status-ok-tint); color:var(--status-ok); border-color:var(--status-ok); }
.tp-badge--warn { background:var(--status-warn-tint); color:var(--status-warn); border-color:var(--status-warn); }
.tp-badge--unknown { background:var(--status-unknown-tint); color:var(--status-unknown); border-color:var(--status-unknown); }
.tp-badge--fail { background:var(--status-fail-tint); color:var(--status-fail); border-color:var(--status-fail); }
.tp-table-wrap { overflow-x:auto; }
.tp-table { width:100%; border-collapse:collapse; font-size:14px; margin-top:16px; }
.tp-table caption { text-align:left; font-size:13px; color:var(--secondary-foreground); padding-bottom:12px; }
.tp-table th,.tp-table td { padding:14px 12px; text-align:left; border-bottom:1px solid var(--border); vertical-align:top; }
.tp-table th { background:var(--muted); font-size:12px; font-weight:600; }
.tp-table tbody tr:hover { background:var(--muted); }
.tp-money { font-variant-numeric:tabular-nums; }
.tp-mono { font-family:ui-monospace,monospace; font-size:.9em; }
.tp-list { list-style:none; padding:0; margin-top:16px!important; display:grid; gap:12px; }
.tp-list-item { padding:18px; background:var(--muted); border:1px solid var(--border); border-radius:var(--radius); }
.tp-list-title { font-size:16px; font-weight:600; line-height:1.45; }
.tp-list-meta { font-size:14px; color:var(--secondary-foreground); margin-top:8px!important; }
.tp-tabs { margin-top:24px; }
.tp-tablist { display:flex; flex-wrap:wrap; gap:4px; background:var(--muted); padding:6px; border-radius:var(--radius); margin-top:24px; }
.tp-tab { display:inline-flex; align-items:center; min-height:44px; padding:8px 14px; border-radius:calc(var(--radius) - 2px); font-size:14px; text-decoration:none; color:var(--secondary-foreground); }
.tp-tab[aria-selected="true"] { background:var(--primary); color:var(--primary-foreground); }
.tp-tabpanel { padding-top:8px; }
.tp-notice { padding:16px; margin-top:16px; font-size:14px; border:1px solid var(--status-warn); border-radius:var(--radius); color:var(--status-warn); background:var(--status-warn-tint); }
.tp-notice--draft { border-color:var(--status-unknown); color:var(--status-unknown); background:var(--status-unknown-tint); }
.tp-illustration { margin-top:12px; font-size:12px; color:var(--secondary-foreground); }
.tp-grid { display:grid; gap:24px; min-width:0; align-items:start; }
.tp-grid > * { min-width:0; }
.tp-appfooter { margin-top:32px; border-top:1px solid var(--border); padding-block:24px; }
.tp-appfooter-line { font-size:13px; color:var(--secondary-foreground); }
.tp-appfooter .tp-brand-img { width:112px; height:112px; }
.tp-operator-badge { display:inline-flex; gap:8px; border:1px solid var(--border); border-radius:calc(var(--radius) - 4px); padding:6px 12px; background:var(--muted); font-size:12px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(min-width:800px) {
 .tp-grid--2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .tp-grid--3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
 [data-tp-family="S07"] .tp-grid--2 { grid-template-columns:300px minmax(0,1fr); }
 [data-tp-family="S07"] .tp-sheet--context { align-self:start; position:sticky; top:24px; }
 [data-tp-family="S02"] .tp-grid--2 { grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); max-width:1056px; margin:auto; }
 [data-tp-family="S17"] .tp-grid--2 { grid-template-columns:minmax(0,1fr) 320px; }
 [data-tp-family="S17"] aside.tp-sheet { align-self:start; position:sticky; top:24px; }
}
[data-tp-family="S17"] aside.tp-sheet { background:var(--primary); color:var(--primary-foreground); }
[data-tp-family="S17"] aside .tp-doc-meta,[data-tp-family="S17"] aside dt,[data-tp-family="S17"] aside .tp-sheet-sub { color:var(--primary-foreground); }
[data-tp-family="S17"] aside .tp-doc-meta li { padding-block:8px; border-bottom:1px solid var(--border); }
[data-tp-family="S17"] aside .tp-doc-meta dd { display:block; margin:2px 0 0; font-size:14px; }
@media(max-width:799px) {
 .tp-container { padding-inline:20px; }
 .tp-topbar-inner { flex-wrap:wrap; gap:0; padding-bottom:12px; }
 .tp-brand-img { width:112px; height:112px; }
 .tp-topnav { gap:0; }
 .tp-topnav-link { padding:8px 10px; }
 .tp-sheet { padding:20px; margin-top:16px; }
 .tp-grid { gap:8px; }
 [data-tp-family="S07"] .tp-grid--2 > .tp-sheet--context { order:2; }
 .tp-sheet > .tp-table { display:block; overflow-x:auto; }
 .tp-state-picker [role="tab"] { font-size:12px; padding:8px; }
 .tp-page-head { padding-block:32px; }
 .tp-appfooter-inner { flex-wrap:wrap; gap:12px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
/* An information icon accompanies unavailable-state copy at every size. */
.tp-info-icon { display:inline-block; vertical-align:-3px; flex:none; }
.tp-state-icon .tp-info-icon { width:20px; height:20px; }
.tp-badge .tp-info-icon, .tp-btn .tp-info-icon { width:15px; height:15px; }