.live-boot-gate {
    position: fixed; inset: 0; z-index: 20000; display: grid; place-items: center;
    padding: 20px; background: #050b15;
}
.live-boot-gate[hidden] { display: none !important; }
.live-boot-card {
    width: min(390px, 92vw); display: grid; justify-items: center; gap: 12px; padding: 30px 24px;
    color: #eaf2ff; text-align: center; border: 1px solid #263b58; border-radius: 18px;
    background: linear-gradient(145deg, #101b2d, #0a1322); box-shadow: 0 24px 80px rgba(0, 0, 0, .45);
}
.live-boot-icon { color: #8d72ff; font-size: 42px; animation: liveBootPulse 1.2s ease-in-out infinite; }
.live-boot-card strong { font-size: 17px; }
.live-boot-card span:not(.live-boot-icon) { color: #93a6c1; font-size: 13px; }
.live-boot-card button { min-height: 42px; padding: 0 16px; color: white; border: 1px solid #725ef0; border-radius: 10px; background: #5e4bd6; font-weight: 700; }
@keyframes liveBootPulse { 50% { transform: scale(1.08); opacity: .72; } }

.live-preflight-button {
    min-height: 38px; display: inline-flex; align-items: center; gap: 7px; padding: 0 11px;
    color: #bcefff; border: 1px solid #235e78; border-radius: 10px; background: #092233;
    flex: 0 0 auto; position: relative; white-space: nowrap;
    font: inherit; font-size: 12px; font-weight: 800; cursor: pointer;
}
.live-preflight-button:hover { border-color: #32dfd3; color: white; }
.live-preflight-button .material-symbols-rounded { font-size: 18px; color: #32dfd3; }
.live-preflight-button b { min-width: 20px; height: 20px; display: grid; place-items: center; padding: 0 5px; color: white; border-radius: 999px; background: #ef315d; font-size: 10px; }

.live-safety-modal[hidden] { display: none !important; }
.live-safety-modal { z-index: 15000; display: grid !important; place-items: center; padding: 18px; background: rgba(2, 7, 15, .86); }
.live-safety-dialog {
    width: min(860px, 96vw); max-height: min(820px, 92vh); display: flex; flex-direction: column; overflow: hidden;
    color: #edf5ff; border: 1px solid #294567; border-radius: 18px; background: #091827; box-shadow: 0 28px 90px rgba(0, 0, 0, .58);
}
.live-safety-dialog > header { display: flex; justify-content: space-between; gap: 18px; padding: 20px 22px 16px; border-bottom: 1px solid #1e3550; }
.live-safety-dialog h2, .live-safety-dialog h3, .live-safety-dialog p { margin: 0; }
.live-safety-dialog h2 { margin-top: 3px; font-size: 21px; }
.live-safety-dialog header p, .live-safety-missing p { margin-top: 5px; color: #8fa5c1; font-size: 12px; }
.live-safety-dialog .eyebrow { color: #8d72ff; font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.live-safety-dialog header button { width: 38px; height: 38px; display: grid; place-items: center; color: #b8c8da; border: 1px solid #294567; border-radius: 10px; background: #0e2034; cursor: pointer; }
.live-safety-summary { margin: 16px 22px 0; padding: 12px 14px; border: 1px solid #24506c; border-radius: 12px; background: #0c2637; font-size: 13px; font-weight: 800; }
.live-safety-summary.ready { color: #58ebc4; border-color: #18765f; background: #092b28; }
.live-safety-summary.blocked { color: #ffb0bd; border-color: #8b2841; background: #301321; }
.live-safety-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 14px 22px; overflow: auto; }
.live-safety-check { min-width: 0; display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 9px; padding: 11px; border: 1px solid #253e5b; border-radius: 11px; background: #0c1c2e; }
.live-safety-check > .material-symbols-rounded { font-size: 22px; }
.live-safety-check strong { display: block; font-size: 12px; }
.live-safety-check small { display: block; margin-top: 3px; color: #8fa5c1; line-height: 1.35; }
.live-safety-check.pass > .material-symbols-rounded { color: #32dfaa; }
.live-safety-check.warn > .material-symbols-rounded { color: #ffbd54; }
.live-safety-check.block > .material-symbols-rounded { color: #ff5477; }
.live-safety-missing { padding: 0 22px 16px; overflow: auto; }
.live-safety-missing > div:first-child { margin-bottom: 9px; }
.live-safety-missing-row { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(220px, 1.4fr) auto; gap: 9px; align-items: center; margin-top: 8px; padding: 10px; border: 1px solid #744831; border-radius: 11px; background: #271a16; }
.live-safety-missing-row strong, .live-safety-missing-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-safety-missing-row strong { font-size: 12px; }
.live-safety-missing-row small { margin-top: 3px; color: #d3a78e; font-size: 10px; }
.live-safety-missing-row select { width: 100%; min-height: 38px; color: #edf5ff; border: 1px solid #385373; border-radius: 9px; background: #0a1727; }
.live-safety-missing-row button, .live-safety-dialog footer button { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 0 13px; color: white; border-radius: 9px; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.live-safety-missing-row button { border: 1px solid #6858da; background: #5948c7; }
.live-safety-missing-row button:disabled { opacity: .45; cursor: not-allowed; }
.live-safety-dialog footer { display: flex; justify-content: flex-end; gap: 9px; padding: 14px 22px; border-top: 1px solid #1e3550; background: #081522; }
.live-safety-secondary { border: 1px solid #34516e; background: #10243a; }
.live-safety-primary { border: 1px solid #7866ee; background: #6653df; }

#sd-program-status[data-tone="paused"] { color: #ffbd54; }
#sd-program-status[data-tone="saved"] { color: #70b8ff; }
#sd-program-status[data-tone="offline"] { color: #ff7892; }
#sd-program-status[data-tone="ready"] { color: #59d7f4; }

/* V2.8.2: keep the shared application header usable after adding LIVE preflight.
   Desktop keeps full labels; laptops use compact controls; tablets get a second
   navigation row instead of allowing controls to overlap or move off-screen. */
.header-right { min-width: 0; }
.header-right > *,
.account-menu { flex: 0 0 auto; }

@media (min-width: 1761px) {
    .studio-header { grid-template-columns: minmax(170px, 1fr) auto minmax(600px, 1fr); }
}

@media (min-width: 1181px) and (max-width: 1760px) {
    .studio-header {
        grid-template-columns: minmax(76px, 150px) minmax(0, 1fr) auto;
        column-gap: 12px;
        padding-inline: 16px;
    }
    .studio-header .tab-nav { width: 100%; min-width: 0; justify-self: stretch; }
    .studio-header .tab-btn,
    .studio-header .tab-link { min-width: 0; padding-inline: 8px; gap: 6px; font-size: 12px; }
    .header-right { gap: 6px; }
    .live-preflight-button { width: 42px; min-width: 42px; justify-content: center; padding: 0; }
    .live-preflight-button > span:not(.material-symbols-rounded) { display: none; }
    .live-preflight-button b { position: absolute; top: -7px; right: -7px; }
    .status-panel { padding-inline: 9px; gap: 6px; }
    .status-copy small { display: none; }
    #user-display-name { display: none; }
    .account-menu summary { padding-inline: 7px; gap: 6px; }
}

@media (min-width: 769px) and (max-width: 1180px) {
    .studio-header {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "brand controls"
            "tabs tabs";
        gap: 8px 12px;
        min-height: 122px;
        padding: 9px 16px;
    }
    .brand-lockup { grid-area: brand; }
    .brand-copy { display: grid; }
    .brand-copy small { display: none; }
    .header-right { grid-area: controls; justify-self: end; gap: 6px; }
    .studio-header .tab-nav {
        grid-area: tabs;
        justify-self: stretch;
        width: 100%;
        min-width: 0;
        padding: 4px;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .studio-header .tab-nav::-webkit-scrollbar { display: none; }
    .studio-header .tab-btn,
    .studio-header .tab-link { min-width: max-content; min-height: 42px; padding-inline: 11px; font-size: 12px; }
    .live-preflight-button { width: 42px; min-width: 42px; justify-content: center; padding: 0; }
    .live-preflight-button > span:not(.material-symbols-rounded) { display: none; }
    .live-preflight-button b { position: absolute; top: -7px; right: -7px; }
    .status-panel { min-height: 40px; padding: 5px 9px; gap: 6px; }
    .status-copy small,
    .notification-button,
    #user-display-name { display: none; }
    .account-menu summary { min-height: 40px; padding-inline: 6px; gap: 6px; }
    #tab-dashboard.active,
    #tab-studio.active { height: calc(100dvh - 122px); }
}

@media (max-width: 900px) {
    .live-preflight-button > span:not(.material-symbols-rounded) { display: none; }
    .live-safety-checks { grid-template-columns: 1fr; }
    .live-safety-missing-row { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .live-preflight-button { min-width: 44px; justify-content: center; padding: 0 8px; }
    .live-safety-modal { padding: 8px; }
    .live-safety-dialog { max-height: 96vh; border-radius: 14px; }
    .live-safety-dialog > header, .live-safety-checks, .live-safety-missing, .live-safety-dialog footer { padding-left: 13px; padding-right: 13px; }
    .live-safety-summary { margin-left: 13px; margin-right: 13px; }
}
@media (prefers-reduced-motion: reduce) { .live-boot-icon { animation: none; } }
