.surface-status{margin:var(--space-3) auto var(--space-2);max-width:min(1200px,calc(100% - (2 * var(--gutter-shell))));border:1px solid var(--border-strong);background:linear-gradient(180deg,var(--panel2),var(--panel));color:var(--text-primary);border-radius:var(--r12);padding:var(--container-pad-md);font-size:13px;letter-spacing:.01em}.surface-status[data-state-kind=ok]{border-color:var(--safe-border);box-shadow:0 0 0 1px var(--safe-bg) inset}.surface-status[data-state-kind=warn]{border-color:var(--warn-border);box-shadow:0 0 0 1px var(--warn-bg) inset}.surface-status[data-state-kind=error]{border-color:var(--danger-border);box-shadow:0 0 0 1px var(--danger-bg) inset}body.ts{background-image:radial-gradient(circle at top,var(--gold-bg),transparent 42%)}.preview-not-live-banner{margin:var(--space-3) auto var(--space-2);max-width:min(1200px,calc(100% - (2 * var(--gutter-shell))));border:1px solid var(--warn-border);background:linear-gradient(180deg,var(--panel2),var(--panel));box-shadow:0 0 0 1px var(--warn-bg) inset;color:var(--text-primary);border-radius:var(--r12);padding:var(--container-pad-md);font-size:13px;letter-spacing:.01em;display:flex;gap:var(--space-2);align-items:baseline;flex-wrap:wrap}.preview-not-live-banner .preview-not-live-banner__tag{font-weight:600;color:var(--warn-border);text-transform:uppercase;letter-spacing:.06em;font-size:12px}@media(max-width:768px){.preview-not-live-banner{margin:var(--space-2) var(--space-3) 0;max-width:calc(100% - (2 * var(--space-3)));padding:var(--space-3)}}@media(max-width:768px){.surface-status{margin:var(--space-2) var(--space-3) 0;max-width:calc(100% - (2 * var(--space-3)));padding:var(--space-3)}}