:root {
  --ink: #f7f5ff;
  --muted: #a7a2bc;
  --panel: rgba(22, 18, 42, .76);
  --panel-solid: #17132c;
  --line: rgba(255, 255, 255, .09);
  --violet: #9f7aea;
  --pink: #fb6fbc;
  --cyan: #38d9f5;
  --lime: #a4ef78;
  --coral: #ff8d72;
  --shadow: 0 24px 80px rgba(4, 2, 16, .34);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; color: var(--ink); background: #090714; overflow-x: hidden; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
[hidden] { display: none !important; }
.ambient { position: fixed; width: 42rem; height: 42rem; border-radius: 50%; filter: blur(110px); opacity: .17; pointer-events: none; }
.ambient-one { top: -18rem; right: -8rem; background: #9d5cff; }
.ambient-two { bottom: -24rem; left: -14rem; background: #16cfe7; }
.shell { width: min(1460px, calc(100% - 40px)); margin: 0 auto; position: relative; }
.topbar { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.brand > span:last-child { display: grid; line-height: 1.05; }
.brand strong { font-size: 1.05rem; letter-spacing: -.02em; }
.brand small { color: var(--muted); font-size: .72rem; margin-top: 5px; letter-spacing: .08em; text-transform: uppercase; }
.brand-mark { width: 36px; height: 36px; position: relative; display: block; transform: rotate(-13deg); }
.brand-mark i { position: absolute; width: 13px; height: 30px; border-radius: 9px; top: 3px; }
.brand-mark i:nth-child(1) { left: 1px; background: linear-gradient(#ffd057, #92d338); }
.brand-mark i:nth-child(2) { left: 11px; background: linear-gradient(#ff795f, #e447b8); }
.brand-mark i:nth-child(3) { left: 21px; background: linear-gradient(#59ddff, #7867ff); }
.top-actions { display: flex; align-items: center; gap: 10px; }
.environment-tabs { display: flex; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.025); }
.environment-tab { border: 0; border-radius: 8px; padding: 7px 10px; background: transparent; color: var(--muted); cursor: pointer; font-size: .7rem; font-weight: 800; }
.environment-tab.active { color: #fff; background: rgba(159,122,234,.26); box-shadow: inset 0 0 0 1px rgba(159,122,234,.28); }
.signed-in-email { color: #c7bee9; font-size: .7rem; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.viewer-presence { display: inline-flex; align-items: center; gap: 5px; min-width: 38px; padding: 6px 9px; border: 1px solid var(--line); border-radius: 999px; color: #dcd5f4; background: rgba(255,255,255,.035); font-size: .72rem; }
.viewer-presence svg { width: 15px; height: 15px; fill: currentColor; }
.viewer-presence strong { font-size: .72rem; }
.icon-button { position: relative; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 12px; color: #dcd5f4; background: rgba(255,255,255,.035); cursor: pointer; }
.icon-button:hover { border-color: rgba(159,122,234,.5); background: rgba(159,122,234,.13); }
.icon-button svg { width: 19px; height: 19px; fill: currentColor; }
.icon-badge { position: absolute; top: -7px; right: -7px; min-width: 19px; height: 19px; padding: 0 5px; display: grid; place-items: center; border-radius: 999px; color: #190c12; background: var(--coral); font-size: .61rem; font-weight: 900; }
.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; }
.last-updated { color: var(--muted); font-size: .78rem; margin-right: 8px; }
.button { border: 1px solid var(--line); border-radius: 12px; padding: 11px 16px; cursor: pointer; transition: .2s ease; font-weight: 700; }
.button:hover { transform: translateY(-1px); border-color: rgba(255,255,255,.2); }
.button-quiet { background: rgba(255,255,255,.045); }
.button-primary { border-color: transparent; background: linear-gradient(120deg, #845ef7, #d957c4); box-shadow: 0 10px 30px rgba(151, 85, 232, .22); }
.button-danger { color: #ffd3ca; border-color: rgba(255,141,114,.35); background: rgba(255,100,93,.12); }
.button:disabled { cursor: wait; opacity: .55; transform: none; }
.hero { min-height: 410px; padding: 76px 5vw 56px; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.hero h1 { margin: 14px 0 18px; font-size: clamp(3rem, 7vw, 6.4rem); line-height: .92; letter-spacing: -.072em; max-width: 880px; }
.hero h1 span { color: transparent; background: linear-gradient(90deg, #fff 0%, #a89af3 48%, #f779c5 100%); background-clip: text; -webkit-background-clip: text; }
.hero p { max-width: 630px; color: var(--muted); font-size: 1.08rem; line-height: 1.65; }
.eyebrow, .section-kicker { color: #c7bee9; font-size: .72rem; text-transform: uppercase; letter-spacing: .18em; font-weight: 800; }
.status-dot { width: 8px; height: 8px; display: inline-block; margin-right: 7px; border-radius: 50%; box-shadow: 0 0 0 5px rgba(255,255,255,.04); }
.status-dot.up { background: var(--lime); box-shadow: 0 0 20px rgba(164,239,120,.8); }
.status-dot.down { background: var(--coral); box-shadow: 0 0 20px rgba(255,141,114,.8); }
.status-dot.neutral { background: #77718f; }
.hero-orbit { width: 260px; height: 260px; flex: 0 0 260px; position: relative; }
.orbit-ring { width: 100%; height: 100%; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(255,255,255,.12); box-shadow: inset 0 0 60px rgba(142,88,245,.12); animation: float 5s ease-in-out infinite; }
.orbit-ring::before, .orbit-ring::after { content: ""; position: absolute; border-radius: 50%; border: 1px dashed rgba(255,255,255,.11); inset: 24px; }
.orbit-ring::after { inset: 58px; border-style: solid; }
.orbit-core { width: 86px; height: 86px; border-radius: 28px; display: grid; place-items: center; font-weight: 900; font-size: 2.6rem; background: linear-gradient(145deg, #7354ef, #dc55b8); transform: rotate(8deg); box-shadow: 0 20px 50px rgba(111,65,226,.4); }
.orbit-label { position: absolute; border: 1px solid var(--line); background: rgba(19,15,37,.9); border-radius: 999px; padding: 7px 10px; font-size: .66rem; font-weight: 800; box-shadow: var(--shadow); }
.orbit-label-one { top: 28px; right: -8px; }.orbit-label-two { bottom: 44px; right: -10px; }.orbit-label-three { left: -12px; top: 105px; }
@keyframes float { 50% { transform: translateY(-9px) rotate(2deg); } }
.alert-banner { display: flex; align-items: center; gap: 14px; padding: 16px 18px; margin-bottom: 42px; border: 1px solid rgba(255,141,114,.3); border-radius: 18px; background: linear-gradient(100deg, rgba(255,100,93,.12), rgba(255,255,255,.025)); }
.alert-banner.hidden { display: none; }.alert-banner p { margin: 4px 0 0; color: #c9bfd1; font-size: .88rem; }
.alert-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; color: #1a0910; background: var(--coral); font-weight: 900; }
.alert-banner button { margin-left: auto; border: 0; background: transparent; font-size: 1.5rem; cursor: pointer; color: var(--muted); }
.section-heading, .panel-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
h2 { margin: 6px 0 0; font-size: 1.45rem; letter-spacing: -.035em; }
.poll-note { color: var(--muted); font-size: .75rem; }
.service-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.service-card, .metric-card, .panel { border: 1px solid var(--line); background: var(--panel); backdrop-filter: blur(20px); box-shadow: var(--shadow); }
.service-card { padding: 19px; border-radius: 18px; min-height: 138px; }
.service-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.service-card h3 { margin: 0; font-size: .96rem; }.service-card p { margin: 20px 0 0; color: var(--muted); font-size: .78rem; line-height: 1.45; overflow-wrap: anywhere; }
.status-badge { border-radius: 999px; padding: 5px 8px; font-size: .63rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 900; }
.status-badge.up { color: var(--lime); background: rgba(164,239,120,.1); }.status-badge.down { color: var(--coral); background: rgba(255,141,114,.1); }.status-badge.not_configured { color: #bcb5cf; background: rgba(255,255,255,.06); }
.latency { color: #dbd6e8; font-size: .75rem; }
.runtime-strip { margin-top: 14px; display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); border-radius: 17px; overflow: hidden; background: rgba(255,255,255,.022); }
.runtime-strip > div { padding: 14px 18px; border-right: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 12px; }.runtime-strip > div:last-child { border-right: 0; }
.runtime-strip span { color: var(--muted); font-size: .68rem; }.runtime-strip strong { font-size: .82rem; }
.metric-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin: 16px 0 28px; }
.metric-card { min-height: 158px; padding: 22px; border-radius: 19px; position: relative; overflow: hidden; }
.metric-card-button { width: 100%; appearance: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.metric-card-button:hover { border-color: rgba(164,239,120,.42); transform: translateY(-2px); }
.metric-card-button:focus-visible { outline: 3px solid rgba(164,239,120,.45); outline-offset: 3px; }
.metric-card::before { content: ""; position: absolute; width: 90px; height: 90px; border-radius: 50%; right: -30px; top: -35px; filter: blur(12px); opacity: .3; }
.accent-violet::before { background: var(--violet); }.accent-cyan::before { background: var(--cyan); }.accent-lime::before { background: var(--lime); }.accent-coral::before { background: var(--coral); }.accent-slate::before { background: var(--muted); }
.failure-retry { align-self: flex-start; }
.archived-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 14px; align-items: center; padding: 12px 14px; border-radius: 15px; background: rgba(255,255,255,.027); border: 1px solid transparent; transition: .2s; }
.archived-row:hover { background: rgba(255,255,255,.045); border-color: var(--line); }
.archived-row strong { display: block; margin-bottom: 4px; }
.archived-row .campaign-meta { margin: 2px 0 0; max-width: 90ch; }
.metric-card span { color: var(--muted); font-size: .78rem; }.metric-card strong { display: block; font-size: 3.2rem; letter-spacing: -.06em; margin: 11px 0 2px; }.metric-card small { color: #77718f; }
.split-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(350px, .75fr); gap: 16px; }
.panel { border-radius: 24px; padding: 24px; }
.queue-panel { margin-bottom: 16px; }
.queue-panel .panel-heading p { margin: 7px 0 0; color: var(--muted); font-size: .75rem; }
.count-pill { font-size: .68rem; padding: 7px 10px; border-radius: 999px; color: var(--cyan); background: rgba(56,217,245,.09); white-space: nowrap; }.count-pill.danger { color: var(--coral); background: rgba(255,141,114,.09); }
.campaign-list, .failure-list { display: grid; gap: 10px; min-width: 0; }
.campaign-row { display: grid; grid-template-columns: 58px minmax(0,1fr) auto; gap: 14px; align-items: center; padding: 12px; border-radius: 15px; background: rgba(255,255,255,.027); border: 1px solid transparent; transition: .2s; }
.campaign-row:hover { background: rgba(255,255,255,.045); border-color: var(--line); }
.campaign-row-clickable { cursor: pointer; }
.campaign-row-clickable:focus-visible { border-color: var(--cyan); outline: 2px solid rgba(62,214,255,.28); outline-offset: 2px; }
.campaign-focus { outline: 2px solid var(--lime); outline-offset: 3px; }
.campaign-thumb { width: 58px; height: 58px; border-radius: 13px; object-fit: cover; background: linear-gradient(145deg, #32255a, #18465b); }
.campaign-title { font-size: .86rem; font-weight: 750; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.campaign-meta { color: var(--muted); font-size: .7rem; margin-top: 5px; display: flex; flex-wrap: wrap; gap: 8px; }
.campaign-link { color: #d9d0ff; text-decoration: none; font-size: .72rem; padding: 8px; }.campaign-link:hover { color: #fff; }
.failure-panel, .failure-item { min-width: 0; overflow: hidden; }
.failure-item { border-left: 2px solid var(--coral); background: rgba(255,255,255,.026); border-radius: 4px 14px 14px 4px; }
.failure-item > summary { padding: 13px 14px; cursor: pointer; list-style-position: inside; }
.failure-item > summary:hover { background: rgba(255,255,255,.035); }
.failure-details { padding: 0 14px 14px; border-top: 1px solid var(--line); }
.failure-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; font-size: .82rem; font-weight: 800; }.failure-title > span:first-child { min-width: 0; overflow-wrap: anywhere; }.failure-time { color: var(--muted); font-size: .66rem; font-weight: 500; white-space: nowrap; }
.failure-item p { max-width: 100%; color: #bcb6c9; font-size: .74rem; line-height: 1.45; margin: 7px 0; overflow-wrap: anywhere; word-break: break-word; }.failure-action { color: var(--coral); font-size: .67rem; text-transform: uppercase; letter-spacing: .06em; }
.failure-item .failure-metadata { color: #8f87a6; font-size: .67rem; }
.empty-state { min-height: 180px; place-items: center; color: var(--muted); text-align: center; }
.progress-dialog { width: min(1000px, calc(100% - 32px)); max-height: min(850px, calc(100% - 32px)); padding: 0; border: 1px solid rgba(159,122,234,.35); border-radius: 24px; color: var(--text); background: #100d20; box-shadow: 0 36px 100px rgba(0,0,0,.65); }
.progress-dialog::backdrop { background: rgba(3,2,10,.76); backdrop-filter: blur(8px); }
.progress-dialog-shell { padding: 26px; }
.progress-dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.progress-dialog-header p { margin: 9px 0 0; color: var(--muted); font-size: .78rem; }
.dialog-close { flex: 0 0 auto; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 12px; color: var(--text); background: rgba(255,255,255,.04); font-size: 1.5rem; cursor: pointer; }
.dialog-close:hover { background: rgba(255,255,255,.09); }
.support-dialog { width: min(900px, calc(100% - 32px)); max-height: min(850px, calc(100% - 32px)); padding: 0; border: 1px solid rgba(159,122,234,.35); border-radius: 24px; color: var(--ink); background: #100d20; box-shadow: 0 36px 100px rgba(0,0,0,.65); }
.support-dialog::backdrop { background: rgba(3,2,10,.76); backdrop-filter: blur(8px); }
.support-dialog-shell { padding: 26px; }
.support-dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.support-dialog-header p { margin: 9px 0 0; color: var(--muted); font-size: .78rem; }
.support-header-actions { display: flex; align-items: center; gap: 9px; }
.support-view { margin-top: 18px; max-height: min(670px, calc(100vh - 220px)); overflow: auto; }
.support-view > section + section { margin-top: 22px; }
.support-view h3 { margin: 0 0 9px; color: #d8d1ef; font-size: .82rem; text-transform: uppercase; letter-spacing: .08em; }
.support-ticket-list { display: grid; gap: 8px; }
.support-ticket-empty { margin: 0; padding: 18px; border: 1px dashed var(--line); border-radius: 14px; color: var(--muted); text-align: center; font-size: .75rem; }
.support-ticket-row { width: 100%; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px 16px; padding: 14px 15px; border: 1px solid var(--line); border-radius: 15px; color: inherit; background: rgba(255,255,255,.025); text-align: left; cursor: pointer; }
.support-ticket-row.unread { border-color: rgba(255,126,105,.65); box-shadow: inset 3px 0 0 var(--coral); }
.support-ticket-row:hover { border-color: rgba(159,122,234,.42); background: rgba(255,255,255,.045); }
.support-ticket-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.support-ticket-row p { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: .72rem; overflow-wrap: anywhere; }
.support-ticket-meta { color: #8f87a6; font-size: .66rem; }
.support-priority { color: var(--coral); font-size: .65rem; font-weight: 850; text-transform: uppercase; }
.support-back { margin-bottom: 15px; padding: 0; border: 0; color: var(--cyan); background: transparent; cursor: pointer; font-size: .75rem; }
.support-form { display: grid; gap: 15px; }
.support-form label { display: grid; gap: 7px; color: #dcd5ef; font-size: .76rem; font-weight: 750; }
.support-form label small { color: var(--muted); font-size: .66rem; font-weight: 500; }
.support-form input, .support-form select, .support-form textarea { width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: rgba(255,255,255,.045); }
.support-form textarea { resize: vertical; line-height: 1.5; }
.support-form input[type=file] { color: var(--muted); font-size: .72rem; }
.support-form .button { justify-self: start; }
.support-detail-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.support-detail-heading h3 { margin: 0; color: var(--ink); font-size: 1.25rem; text-transform: none; letter-spacing: -.02em; }
.support-detail-heading p { margin: 6px 0 0; color: var(--muted); font-size: .7rem; }
.support-status { flex: 0 0 auto; border-radius: 999px; padding: 6px 9px; color: var(--cyan); background: rgba(56,217,245,.09); font-size: .64rem; font-weight: 900; text-transform: uppercase; }
.support-status.closed { color: #bcb5cf; background: rgba(255,255,255,.06); }
.support-messages { display: grid; gap: 12px; margin: 18px 0; }
.support-message { padding: 15px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.025); }
.support-message header { display: flex; justify-content: space-between; gap: 12px; color: #ded8ef; font-size: .72rem; }
.support-message time { color: #77718f; font-size: .64rem; }
.support-message p { margin: 11px 0 0; color: #c7c0d7; font-size: .78rem; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.support-attachments { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin-top: 12px; }
.support-attachments a { display: block; min-width: 0; color: var(--cyan); text-decoration: none; font-size: .68rem; }
.support-attachments img { width: 100%; aspect-ratio: 16 / 10; display: block; object-fit: cover; border: 1px solid var(--line); border-radius: 10px; background: #090714; }
.support-attachments span { display: block; margin-top: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.support-closed-note { padding: 14px; border: 1px solid var(--line); border-radius: 13px; color: var(--muted); background: rgba(255,255,255,.025); font-size: .75rem; }
.support-detail-actions { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; }
.progress-list { display: grid; gap: 12px; margin-top: 18px; max-height: min(680px, calc(100vh - 220px)); overflow: auto; }
.progress-list.empty-state { display: grid; }
.progress-campaign { border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.025); overflow: hidden; }
.progress-campaign > summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 18px; cursor: pointer; list-style-position: inside; }
.progress-campaign > summary:hover { background: rgba(255,255,255,.035); }
.progress-summary-copy { min-width: 0; display: inline-grid; gap: 5px; margin-right: auto; }
.progress-summary-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .9rem; }
.progress-summary-copy small { color: var(--muted); font-size: .67rem; }
.progress-stage { flex: 0 0 auto; max-width: 230px; border-radius: 999px; padding: 7px 10px; color: var(--lime); background: rgba(164,239,120,.1); font-size: .65rem; font-weight: 850; text-align: center; }
.stage-failed { color: var(--coral); background: rgba(255,141,114,.1); }
.progress-body { padding: 0 20px 20px; border-top: 1px solid var(--line); }
.progress-source { display: inline-block; margin: 15px 0 8px; color: var(--cyan); text-decoration: none; font-size: .72rem; }
.progress-source:hover { color: #fff; }
.progress-review-link { display: inline-block; margin: 8px 0 1px; padding: 8px 11px; border-radius: 10px; color: #171025; background: var(--lime); text-decoration: none; font-size: .72rem; font-weight: 850; }
.progress-review-link:hover { background: #c3ff9f; }
.progress-timeline { margin: 8px 0 0; padding: 0; list-style: none; }
.progress-event { position: relative; display: grid; grid-template-columns: 18px minmax(0,1fr); gap: 11px; min-width: 0; padding: 9px 0; }
.progress-event:not(:last-child)::after { content: ""; position: absolute; left: 6px; top: 24px; bottom: -7px; width: 1px; background: var(--line); }
.progress-marker { width: 13px; height: 13px; margin-top: 2px; border: 3px solid #29243d; border-radius: 50%; background: #8f87a6; z-index: 1; }
.progress-event.active .progress-marker { background: #ffd057; box-shadow: 0 0 0 4px rgba(255,208,87,.1); }
.progress-event.waiting .progress-marker { background: #ffd057; box-shadow: 0 0 0 4px rgba(255,208,87,.1); }
.progress-event.failed .progress-marker { background: var(--coral); box-shadow: 0 0 0 4px rgba(255,141,114,.1); }
.progress-event-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.progress-event-head strong { font-size: .77rem; }
.progress-event-head time { flex: 0 0 auto; color: #77718f; font-size: .62rem; }
.progress-event p { margin: 4px 0 0; color: var(--muted); font-size: .69rem; line-height: 1.4; overflow-wrap: anywhere; }
.rss-panel { margin: 16px 0; }
.rss-heading { align-items: center; }
.rss-last-fetched { margin: 8px 0 0; color: var(--muted); font-size: .78rem; }
.status-badge.partial { color: #ffd057; background: rgba(255,208,87,.1); }
.rss-summary { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-radius: 17px; overflow: hidden; background: rgba(255,255,255,.022); }
.rss-summary > div { min-width: 0; padding: 16px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.rss-summary > :nth-child(3n) { border-right: 0; }
.rss-summary > :nth-last-child(-n+3) { border-bottom: 0; }
.rss-summary > button { min-width: 0; padding: 16px; border: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); color: inherit; background: transparent; text-align: left; cursor: pointer; }
.rss-summary > button:hover, .rss-summary > button:focus-visible { background: rgba(62,214,255,.08); outline: none; }
.rss-summary > button span { color: var(--cyan); }
.rss-summary span { display: block; color: var(--muted); font-size: .68rem; }
.rss-summary strong { display: block; margin-top: 7px; font-size: 1.28rem; letter-spacing: -.04em; }
.rss-summary-cell { position: relative; }
.rss-metric-group { display: block; margin-bottom: 9px; color: var(--cyan) !important; font-size: .56rem !important; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.rss-metric-hint { display: block; margin-top: 6px; color: #817a96 !important; font-size: .59rem !important; line-height: 1.35; }
.rss-metric-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.rss-metric-heading .rss-info-button { width: 22px; height: 22px; }
.rss-metric-action { margin-top: 9px; padding: 0; border: 0; color: var(--cyan); background: transparent; font: 750 .64rem/1.3 inherit; cursor: pointer; text-align: left; }
.rss-metric-action:hover, .rss-metric-action:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: 3px; outline: none; }
.rss-detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.rss-details { border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.022); overflow: hidden; }
.rss-details summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 16px; cursor: pointer; font-size: .8rem; font-weight: 800; list-style-position: inside; }
.rss-details summary:hover { background: rgba(255,255,255,.035); }
.rss-details summary small { color: var(--cyan); font-size: .67rem; font-weight: 700; }
.rss-summary-actions { display: inline-flex; align-items: center; gap: 9px; }
.rss-info-button { width: 25px; height: 25px; display: inline-grid; place-items: center; flex: 0 0 auto; padding: 0; border: 1px solid rgba(62,214,255,.35); border-radius: 50%; color: var(--cyan); background: rgba(62,214,255,.08); font: 800 .72rem/1 Georgia, serif; cursor: pointer; }
.rss-info-button:hover, .rss-info-button:focus-visible { color: #fff; background: rgba(62,214,255,.2); outline: 2px solid rgba(62,214,255,.35); outline-offset: 2px; }
.rss-info-dialog { width: min(680px, calc(100% - 32px)); padding: 0; border: 1px solid rgba(62,214,255,.28); border-radius: 24px; color: var(--text); background: linear-gradient(155deg, #151129, #0e0b1d); box-shadow: 0 36px 100px rgba(0,0,0,.65); }
.rss-info-dialog::backdrop { background: rgba(3,2,10,.76); backdrop-filter: blur(8px); }
.rss-info-shell { padding: 26px; }
.rss-info-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.rss-info-header h2 { margin: 5px 0 0; }
.rss-info-header p { margin: 9px 0 0; color: var(--muted); font-size: .82rem; line-height: 1.5; }
.rss-info-content { display: grid; gap: 12px; padding-top: 18px; }
.rss-info-content section { padding: 16px 18px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.028); }
.rss-info-content section.rss-info-example { border-color: rgba(164,239,120,.22); background: rgba(164,239,120,.05); }
.rss-info-label { display: block; margin-bottom: 7px; color: var(--cyan); font-size: .64rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.rss-info-content p { margin: 0; color: #d9d3e8; font-size: .82rem; line-height: 1.6; }
.rss-info-points { display: grid; gap: 9px; margin: 0; padding-left: 19px; color: #d9d3e8; font-size: .82rem; line-height: 1.5; }
.rss-info-points li::marker { color: var(--cyan); }
.rss-info-glossary { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.rss-info-glossary li { display: grid; grid-template-columns: minmax(110px,.34fr) minmax(0,1fr); gap: 14px; align-items: start; }
.rss-info-glossary strong { color: #fff; font-size: .78rem; line-height: 1.45; }
.rss-info-glossary span { color: #c9c2d9; font-size: .76rem; line-height: 1.5; }
.queue-dialog { width: min(680px, calc(100% - 32px)); padding: 0; border: 1px solid rgba(164,239,120,.3); border-radius: 24px; color: var(--text); background: linear-gradient(155deg, #151129, #0e0b1d); box-shadow: 0 36px 100px rgba(0,0,0,.65); }
.queue-dialog::backdrop { background: rgba(3,2,10,.76); backdrop-filter: blur(8px); }
.queue-dialog-shell { padding: 26px; }
.queue-dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.queue-dialog-header h2 { margin: 5px 0 0; }
.queue-dialog-header p { margin: 8px 0 0; color: var(--muted); font-size: .82rem; line-height: 1.5; }
.queue-decision-body { display: grid; gap: 16px; padding-top: 20px; }
.queue-decision-stage { display: flex; align-items: center; gap: 13px; min-height: 58px; padding: 15px 17px; border: 1px solid rgba(62,214,255,.24); border-radius: 16px; background: rgba(62,214,255,.055); }
.queue-decision-stage.approved { border-color: rgba(164,239,120,.35); background: rgba(164,239,120,.07); }
.queue-decision-stage.rejected { border-color: rgba(255,116,104,.38); background: rgba(255,116,104,.07); }
.queue-spinner { width: 22px; height: 22px; flex: 0 0 auto; border: 3px solid rgba(255,255,255,.18); border-top-color: var(--cyan); border-radius: 50%; animation: queue-reading 1.4s linear infinite; }
.queue-decision-stage.approved .queue-spinner { display: grid; place-items: center; border-color: var(--lime); animation: none; }
.queue-decision-stage.approved .queue-spinner::after { content: "✓"; color: var(--lime); font-size: .78rem; font-weight: 900; }
.queue-decision-stage.rejected .queue-spinner { border-color: var(--coral); animation: none; }
@keyframes queue-reading { to { transform: rotate(360deg); } }
.queue-decision-reasons { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.queue-decision-reasons li { padding: 12px 14px; border: 1px solid var(--line); border-radius: 13px; color: #ddd6e9; font-size: .8rem; line-height: 1.5; background: rgba(255,255,255,.025); }
.queue-decision-reasons a { display: inline-block; margin-left: 7px; color: var(--cyan); font-weight: 800; }
.queue-acknowledgements { display: grid; gap: 12px; }
.queue-acknowledgements label { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; color: #ddd6e9; font-size: .82rem; line-height: 1.45; }
.queue-acknowledgements input { margin-top: 3px; accent-color: var(--lime); }
.queue-warning { display: grid; grid-template-columns: 25px minmax(0,1fr); gap: 10px; align-items: start; margin: 0; padding: 14px 16px; border: 1px solid rgba(255,190,92,.3); border-radius: 13px; color: #f2dfc0; font-size: .79rem; line-height: 1.5; background: rgba(255,190,92,.065); }
.queue-warning::before { content: "!"; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #221506; background: #ffbe5c; font-weight: 950; }
.queue-warning:empty { display: none; }
.queue-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; }
.queue-action-button { width: max-content; padding: 8px 12px; border: 1px solid rgba(62,214,255,.3); border-radius: 11px; color: var(--cyan); background: rgba(62,214,255,.065); font: inherit; font-size: .72rem; font-weight: 850; cursor: pointer; }
.queue-action-button.remove { border-color: rgba(255,116,104,.35); color: #ffb1aa; background: rgba(255,116,104,.06); }
.queue-action-button.edit { border-color: rgba(164,239,120,.32); color: var(--lime); background: rgba(164,239,120,.06); }
.queue-action-button.status { cursor: default; border-color: rgba(164,239,120,.25); color: var(--lime); background: rgba(164,239,120,.055); }
.queue-edit-panel { display: grid; gap: 15px; }
.queue-edit-areas { display: grid; gap: 12px; margin: 0; padding: 16px; border: 1px solid var(--line); border-radius: 14px; }
.queue-edit-areas legend { padding: 0 7px; color: #fff; font-size: .8rem; font-weight: 850; }
.queue-edit-area { display: grid; gap: 8px; }
.queue-edit-area > span { display: flex; align-items: center; gap: 9px; color: #ece7f5; font-size: .8rem; font-weight: 800; }
.queue-edit-area input { accent-color: var(--lime); }
.queue-edit-area textarea { width: 100%; min-height: 74px; box-sizing: border-box; resize: vertical; padding: 11px 12px; border: 1px solid var(--line); border-radius: 11px; color: var(--text); background: rgba(255,255,255,.035); font: inherit; font-size: .78rem; line-height: 1.45; }
.queue-edit-area textarea:focus { border-color: rgba(62,214,255,.65); outline: 2px solid rgba(62,214,255,.16); }
.queue-edit-area textarea:disabled { opacity: .42; cursor: not-allowed; }
.rss-item-actions { display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 9px; margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.055); }
.rss-item-actions small { margin: 0; }
.discovery-queue-panel { margin: 16px 0; }
.discovery-queue-panel .panel-heading p { margin: 7px 0 0; color: var(--muted); font-size: .75rem; }
.discovery-queue-list { display: grid; gap: 8px; }
.discovery-queue-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px 18px; align-items: center; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.024); }
.discovery-queue-row a { color: #f3efff; text-decoration: none; font-size: .8rem; font-weight: 800; }
.discovery-queue-row a:hover { color: var(--cyan); }
.discovery-queue-row p { grid-column: 1; margin: 5px 0 0; color: var(--muted); font-size: .67rem; }
.discovery-queue-row .queue-action-button { grid-column: 2; grid-row: 1 / span 2; }
.publication-steps { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; counter-reset: publication-step; }
.publication-path-heading { padding: 14px 16px; border: 1px solid rgba(164,239,120,.2); border-radius: 15px; background: linear-gradient(135deg, rgba(164,239,120,.07), rgba(62,214,255,.04)); }
.publication-path-heading h3 { margin: 5px 0 4px; font-size: .92rem; }
.publication-path-heading p { margin: 0; color: var(--muted); font-size: .7rem; line-height: 1.5; }
.publication-steps li { display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 2px 11px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.024); counter-increment: publication-step; }
.publication-steps li::before { grid-row: 1 / span 2; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; color: #171025; background: var(--lime); content: counter(publication-step); font-size: .7rem; font-weight: 900; }
.publication-steps strong { font-size: .79rem; }
.publication-steps span { color: var(--muted); font-size: .72rem; line-height: 1.45; }
.publication-confirm { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; color: #ddd6e9; font-size: .82rem; line-height: 1.45; }
.publication-confirm input { margin-top: 3px; accent-color: var(--lime); }
.publication-destinations { display: flex; flex-wrap: wrap; gap: 10px; }
.publication-destinations .button[disabled] { opacity: .45; cursor: not-allowed; }
.publication-handoff-actions { display: grid; gap: 16px; }
.publication-record-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.publication-metadata { display: grid; gap: 12px; }
.publication-source-card { display: grid; gap: 4px; padding: 15px 17px; border: 1px solid rgba(62,214,255,.25); border-radius: 16px; color: inherit; text-decoration: none; background: linear-gradient(135deg, rgba(62,214,255,.08), rgba(159,122,234,.06)); }
.publication-source-card:hover { border-color: rgba(62,214,255,.55); transform: translateY(-1px); }
.publication-source-card strong { color: #fff; font-size: .86rem; line-height: 1.35; }
.publication-source-card small { color: var(--muted); font-size: .67rem; }
.publication-meta-label { color: var(--cyan); font-size: .59rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.publication-fact-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
.publication-fact { display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 2px 9px; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.027); }
.publication-fact-icon { grid-row: 1 / span 2; display: grid; place-items: center; width: 27px; height: 27px; border-radius: 9px; color: #171025; background: linear-gradient(135deg, var(--lime), var(--cyan)); font-size: .72rem; font-weight: 950; }
.publication-fact small { color: var(--muted); font-size: .58rem; text-transform: uppercase; letter-spacing: .07em; }
.publication-fact strong { overflow: hidden; color: #f5f1ff; font-size: .72rem; line-height: 1.35; text-overflow: ellipsis; }
.publication-people { display: grid; gap: 8px; padding: 13px 15px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.02); }
.publication-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.publication-chip { padding: 6px 9px; border-radius: 999px; color: #e8e1f4; background: rgba(159,122,234,.13); font-size: .65rem; line-height: 1.2; }
.publication-chip.reviewer { background: rgba(164,239,120,.1); color: #dfffcf; }
.publication-chip.model { background: rgba(62,214,255,.1); color: #c9f6ff; }
.publication-chip.muted, .publication-empty { color: var(--muted); background: rgba(255,255,255,.035); }
.record-dialog { width: min(960px, calc(100% - 32px)); }
.record-body { display: grid; gap: 18px; max-height: min(70vh, 760px); overflow: auto; padding-top: 20px; }
.record-section { display: grid; gap: 12px; padding: 16px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.022); }
.record-section > h3 { margin: 0; font-size: .9rem; }
.record-section > p { margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.5; }
.record-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 12px; }
.record-card { display: grid; gap: 9px; min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.record-card.selected { border-color: rgba(164,239,120,.42); background: rgba(164,239,120,.045); }
.record-card header { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.record-card h4 { margin: 0; font-size: .8rem; }
.record-badge { padding: 5px 8px; border-radius: 999px; color: var(--cyan); background: rgba(62,214,255,.09); font-size: .58rem; font-weight: 900; text-transform: uppercase; }
.record-card.selected .record-badge { color: var(--lime); background: rgba(164,239,120,.09); }
.record-images { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 7px; }
.record-images figure { margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.035); }
.record-images img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: contain; }
.record-images figcaption { padding: 6px 7px; color: var(--muted); font-size: .56rem; text-transform: capitalize; }
.record-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.record-list li { padding: 10px 12px; border-radius: 11px; color: #dcd5e9; background: rgba(255,255,255,.025); font-size: .7rem; line-height: 1.48; }
.record-preview { display: grid; gap: 10px; padding: 13px; border: 1px solid var(--line); border-radius: 13px; background: #fff; color: #191526; }
.record-preview h4 { margin: 0; font-size: 1rem; }
.record-preview-frame { width: 100%; min-height: 260px; border: 0; border-radius: 9px; background: #fff; }
.instagram-preview { display: grid; grid-template-columns: minmax(150px,.8fr) minmax(180px,1.2fr); gap: 13px; align-items: start; }
.instagram-preview img { width: 100%; border-radius: 11px; }
.instagram-preview p { margin: 0; color: #3f394a; font-size: .75rem; line-height: 1.55; white-space: pre-wrap; }
.stock-group { display: grid; gap: 12px; }
.stock-group-header { display: flex; justify-content: space-between; align-items: end; gap: 12px; }
.stock-group-header h3 { margin: 0; }
.stock-group-header p { margin: 3px 0 0; color: var(--muted); font-size: .68rem; }
.walkthrough-grid { display: grid; gap: 11px; padding-top: 20px; }
.walkthrough-grid article { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.walkthrough-grid article > span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; color: #171025; background: linear-gradient(135deg,var(--lime),var(--cyan)); font-weight: 950; }
.walkthrough-grid strong { font-size: .8rem; }
.walkthrough-grid p { margin: 4px 0 0; color: var(--muted); font-size: .72rem; line-height: 1.5; }
.non-dev-toggle { display: grid; grid-template-columns: auto 1fr; gap: 10px; margin-top: 16px; color: #ddd6e9; font-size: .78rem; line-height: 1.45; }
.non-dev-mode .developer-detail { display: none !important; }
.failure-item > summary::before { content: "!"; display: grid; place-items: center; width: 21px; height: 21px; flex: 0 0 auto; border-radius: 50%; color: #2b100c; background: var(--coral); font-size: .7rem; font-weight: 950; }
.failure-item > summary { align-items: center; }
@media (max-width: 640px) { .instagram-preview { grid-template-columns: 1fr; } .record-images { grid-template-columns: 1fr; } }
.publication-empty { margin: 0; padding: 7px 9px; border-radius: 9px; font-size: .68rem; }
.rss-item-row.focused-discovery { outline: 2px solid var(--lime); outline-offset: -2px; background: rgba(164,239,120,.07); }
.rss-list { display: grid; gap: 1px; max-height: 430px; overflow: auto; border-top: 1px solid var(--line); }
.rss-list.empty-state { display: grid; min-height: 110px; padding: 18px; }
.rss-feed-row, .rss-item-row { padding: 13px 15px; background: rgba(255,255,255,.018); }
.rss-feed-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.rss-feed-row > div { min-width: 0; }
.rss-feed-row strong, .rss-feed-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rss-feed-row strong { font-size: .78rem; }
.rss-url, .rss-meta { color: var(--muted); font-size: .66rem; margin-top: 4px; }
.rss-state, .rss-outcome { flex: 0 0 auto; border-radius: 999px; padding: 5px 8px; font-size: .6rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 900; }
.rss-state.fetched, .rss-outcome.queued { color: var(--lime); background: rgba(164,239,120,.09); }
.rss-state.failed { color: var(--coral); background: rgba(255,141,114,.09); }
.rss-outcome.filtered { color: #ffd057; background: rgba(255,208,87,.09); }
.rss-outcome.held { color: var(--cyan); background: rgba(62,214,255,.09); }
.rss-outcome.topic_duplicate { color: var(--violet); background: rgba(159,122,234,.12); }
.rss-error, .rss-reasons { margin: 7px 0 0; color: #c7a4a4; font-size: .69rem; line-height: 1.45; overflow-wrap: anywhere; }
.rss-item-row > div { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.rss-item-row a { color: #f3efff; text-decoration: none; font-size: .78rem; font-weight: 780; line-height: 1.35; }
.rss-item-row a:hover { color: var(--cyan); }
.rss-reasons { color: #aaa3bc; }
.rss-footnote { color: #77718f; font-size: .68rem; line-height: 1.5; margin: 12px 2px 0; }
.safeguards-panel { margin: 16px 0 52px; display: flex; align-items: center; justify-content: space-between; gap: 25px; }.safeguards-panel > div:first-child p { color: var(--muted); margin: 9px 0 0; font-size: .8rem; }
.safeguards { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }.guard { padding: 10px 12px; border-radius: 12px; font-size: .72rem; border: 1px solid var(--line); }.guard.safe { color: var(--lime); }.guard.info { color: var(--cyan); }.guard.unsafe { color: var(--coral); }
footer { display: flex; justify-content: space-between; gap: 20px; padding: 24px 0 42px; border-top: 1px solid var(--line); color: #716b86; font-size: .69rem; }
@media (max-width: 1050px) { .service-grid, .metric-grid { grid-template-columns: repeat(2, 1fr); }.runtime-strip { grid-template-columns: repeat(2, 1fr); }.runtime-strip > div:nth-child(2) { border-right: 0; }.runtime-strip > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }.split-layout { grid-template-columns: 1fr; }.hero-orbit { width: 210px; height: 210px; flex-basis: 210px; } }
@media (max-width: 700px) { .shell { width: min(100% - 24px, 1460px); }.topbar { padding: 14px 0; align-items: flex-start; }.top-actions { flex-wrap: wrap; justify-content: flex-end; }.last-updated { width: 100%; text-align: right; margin: 0; }.hero { padding: 56px 4px 44px; min-height: 0; }.hero-orbit { display: none; }.service-grid, .metric-grid, .runtime-strip { grid-template-columns: 1fr; }.runtime-strip > div { border-right: 0; border-bottom: 1px solid var(--line); }.runtime-strip > div:last-child { border-bottom: 0; }.rss-heading { align-items: flex-start; }.rss-summary { grid-template-columns: repeat(2, 1fr); }.rss-summary > *, .rss-summary > :nth-child(3n) { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }.rss-summary > :nth-child(2n) { border-right: 0; }.rss-summary > :last-child:nth-child(odd) { grid-column: 1 / -1; border-right: 0; border-bottom: 0; }.rss-detail-grid { grid-template-columns: 1fr; }.metric-grid { margin-bottom: 40px; }.section-heading { align-items: flex-start; flex-direction: column; }.panel { padding: 18px; }.campaign-row { grid-template-columns: 48px minmax(0,1fr); }.campaign-thumb { width: 48px; height: 48px; }.campaign-link { grid-column: 2; padding: 0; }.safeguards-panel { align-items: flex-start; flex-direction: column; }.safeguards { justify-content: flex-start; } footer { flex-direction: column; }.button { padding: 9px 11px; font-size: .75rem; }.progress-dialog, .support-dialog { width: calc(100% - 16px); max-height: calc(100% - 16px); }.progress-dialog-shell, .support-dialog-shell { padding: 18px; }.progress-campaign > summary, .support-dialog-header, .support-detail-heading { align-items: flex-start; flex-direction: column; }.progress-stage { max-width: 100%; }.progress-event-head { flex-direction: column; gap: 3px; }.support-header-actions { width: 100%; justify-content: space-between; }.support-attachments { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }

/* The failure, on the campaign it is holding up, rather than only in a panel
   further down the page. */
.progress-failure { margin-top: 12px; padding: 12px 14px; border-radius: 12px; border: 1px solid rgba(255,141,114,.35); background: rgba(255,141,114,.08); display: flex; flex-direction: column; gap: 8px; }
.progress-failure strong { color: var(--coral); font-size: .8rem; }
.progress-failure p { margin: 0; font-size: .78rem; line-height: 1.5; color: var(--text); }
.progress-failure small { color: var(--muted); font-size: .7rem; }
.progress-failure-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }
.failure-action { padding: 7px 10px; min-height: 0; border-radius: 9px; font-size: .7rem; line-height: 1.1; }
.failure-previews { order: 5; width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin-top: 2px; }
.failure-previews[hidden] { display: none; }
.failure-previews figure { margin: 0; min-width: 0; }
.failure-previews img { display: block; width: 100%; max-height: 440px; object-fit: contain; border-radius: 10px; background: rgba(0,0,0,.28); border: 1px solid var(--line); }
.failure-previews figcaption { margin-top: 5px; color: var(--muted); font-size: .68rem; }
.progress-failure-link { font-size: .72rem; font-weight: 800; color: var(--coral); text-decoration: underline; background: none; border: 0; padding: 0; cursor: pointer; }

/* Next scheduled, parked out of the way but always visible. */
.schedule-dock { position: fixed; right: 18px; bottom: 18px; z-index: 40; width: min(330px, calc(100vw - 36px)); border-radius: 16px; border: 1px solid var(--line); background: rgba(16,13,30,.94); backdrop-filter: blur(14px); box-shadow: 0 18px 48px rgba(0,0,0,.5); overflow: hidden; }
.schedule-dock-toggle { display: flex; align-items: center; gap: 9px; width: 100%; padding: 12px 14px; background: none; border: 0; color: var(--text); font: inherit; font-size: .72rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; text-align: left; }
.schedule-dock-toggle strong { margin-left: auto; text-transform: none; letter-spacing: 0; font-size: .78rem; color: var(--cyan); }
.schedule-dock-pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--cyan); animation: zoala-pulse 2s ease-in-out infinite; }
@keyframes zoala-pulse { 0%, 100% { opacity: .35; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.15); } }
.schedule-dock-body { display: flex; flex-direction: column; border-top: 1px solid var(--line); max-height: 46vh; overflow-y: auto; }
.schedule-dock[data-collapsed="true"] .schedule-dock-body { display: none; }
.schedule-row { display: flex; flex-direction: column; gap: 3px; padding: 10px 14px; border-bottom: 1px solid var(--line); }
.schedule-row:last-child { border-bottom: 0; }
.schedule-row-head { display: flex; align-items: baseline; gap: 8px; }
.schedule-row-head strong { font-size: .78rem; }
.schedule-row-head .schedule-status { margin-left: auto; font-size: .72rem; font-weight: 800; color: var(--cyan); }
.schedule-switch { min-width: 42px; padding: 4px 8px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.05); color: var(--muted); font: inherit; font-size: .66rem; font-weight: 850; cursor: pointer; }
.schedule-switch.enabled { border-color: rgba(105,226,135,.42); background: rgba(105,226,135,.14); color: #9bf5ad; }
.schedule-switch:disabled { cursor: wait; opacity: .55; }
.schedule-row small { color: var(--muted); font-size: .68rem; line-height: 1.45; }
.schedule-row[data-enabled="false"] .schedule-status { color: var(--muted); }
.schedule-editor { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; margin-top: 7px; }
.schedule-picker-trigger { min-width: 0; padding: 7px 9px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.05); color: var(--text); font: inherit; font-size: .68rem; text-align: left; cursor: pointer; }
.schedule-picker-trigger[aria-expanded="true"] { border-color: rgba(64,214,232,.5); background: rgba(64,214,232,.09); }
.schedule-selection { grid-column: 1 / -1; min-height: 1em; }
.schedule-selection.confirmed { color: #9bf5ad; }
.schedule-picker-panel { grid-column: 1 / -1; padding: 9px; border: 1px solid rgba(64,214,232,.28); border-radius: 10px; background: rgba(7,5,18,.94); box-shadow: 0 12px 30px rgba(0,0,0,.35); }
.schedule-picker-panel[hidden] { display: none; }
.schedule-picker-panel input { box-sizing: border-box; width: 100%; min-width: 0; padding: 8px 9px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.06); color: var(--text); font: inherit; font-size: .72rem; color-scheme: dark; }
.schedule-picker-actions { display: flex; justify-content: flex-end; gap: 6px; margin-top: 8px; }
.schedule-edit-button { padding: 6px 8px; border: 1px solid rgba(64,214,232,.35); border-radius: 8px; background: rgba(64,214,232,.11); color: var(--cyan); font: inherit; font-size: .66rem; font-weight: 800; cursor: pointer; }
.schedule-edit-button.confirm { min-width: 76px; background: rgba(64,214,232,.18); }
.schedule-edit-button.subtle-inline { border-color: var(--line); background: transparent; color: var(--muted); }
.schedule-edit-button.subtle { grid-column: 1 / -1; justify-self: end; border-color: var(--line); background: transparent; color: var(--muted); }
.schedule-edit-button:disabled { cursor: wait; opacity: .55; }
@media (max-width: 700px) { .schedule-dock { right: 12px; left: 12px; bottom: 12px; width: auto; } }

/* Who decided, what area, and when. One line each, oldest first. */
.progress-reviewers { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.progress-reviewers li { font-size: .76rem; color: var(--text); }
.progress-reviewers li::before { content: "¹3"; color: var(--lime); margin-right: 7px; font-weight: 800; }

/* Several destinations per campaign, stacked in the row's link column. */
.campaign-link { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.campaign-link a { white-space: nowrap; }
@media (max-width: 700px) { .campaign-link { align-items: flex-start; flex-direction: row; flex-wrap: wrap; } }

/* The pipeline stage rail: three lines, the running one in the middle.
   ------------------------------------------------------------------
   Sofea, 2026-09-20: "i prefer it to display three stages at a time, with the
   current stage at the middle and opaque, the previous stage just above it and
   a bit faint with smaller font, the next stage below the current one with the
   same fainness and size of font. you know, like 'selecting' layout we see on
   ps5/ps4 game etc."

   The console-menu read comes from the size and opacity step, not from motion:
   the middle line is the only one at full size and full opacity, so the eye
   lands on it before reading a word. The wave is reserved for that line alone -
   it is what the RSS badge used to carry, moved here where it now describes the
   whole pipeline rather than one poll. */
.stage-rail-wrap { display: flex; align-items: center; gap: 10px; }
.stage-rail {
  display: flex; flex-direction: column; align-items: center;
  gap: 1px; min-width: 190px; text-align: center;
  /* Fixed height for exactly three lines, so the panel heading does not jump
     as stages advance. A shifting header is how a live display starts feeling
     broken even when it is correct. */
  justify-content: center;
}
.stage-rail-line {
  display: block; width: 100%; max-width: 260px; margin-inline: auto; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
  font-weight: 700; letter-spacing: .01em; text-align: center;
  transition: opacity .28s ease, font-size .28s ease;
}
.stage-rail-line.adjacent { font-size: .66rem; opacity: .38; color: #bcb5cf; line-height: 1.5; }
.stage-rail-line.current {
  font-size: .95rem; opacity: 1; color: #fff; line-height: 1.35;
  background: none; border: 0; padding: 0; cursor: pointer; font-family: inherit;
  transform-origin: 50% 60%;
}
.stage-rail-line.current:not(button) { cursor: default; }
.stage-rail-line.current:hover { text-decoration: underline; text-underline-offset: 3px; }
.stage-rail-line.current:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; border-radius: 4px; }
/* A stage that has stopped is not a stage that is working. It keeps the middle
   position because it is still where the campaign is, but it must not wave as
   if progress were happening. */
.stage-rail-line.current.failed { color: var(--coral); }
.stage-rail-line.current.waiting { color: #ffd057; }
.stage-rail-empty { font-size: .7rem; opacity: .45; color: #bcb5cf; }

/* The floating Z is the user's reference for a live-feeling running position.
   Only the active line receives this motion; waiting and failed stages remain
   static so motion never pretends stopped work is progressing. */
@keyframes zoala-stage-letter-wave {
  0%, 100% { transform: translateY(0); }
  25% { transform: translateY(-3px); }
  75% { transform: translateY(3px); }
}
.stage-rail-line.current.live-text {
  /* Keep every letter opaque. The former moving transparent gradient looked
     like a rapid blink and made the live stage harder to read. */
  background: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  color: #fff;
}
.stage-wave-char {
  display: inline-block;
  color: inherit;
  animation: zoala-stage-letter-wave 3.6s ease-in-out infinite;
  animation-delay: calc(var(--wave-index) * -110ms);
  will-change: transform;
}
.stage-wave-char.space { width: .3em; }
@media (prefers-reduced-motion: reduce) {
  .stage-wave-char { animation: none; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .stage-rail-line.current, .stage-rail-line.current.live-text { animation: none; transform: none; }
  .stage-rail-line.current.live-text { background: none; -webkit-background-clip: border-box; background-clip: border-box; color: inherit; }
  .queue-spinner { animation: none; }
}

/* The poll's own verdict, demoted from a word to a dot. */
.status-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; background: rgba(255,255,255,.25); }
.status-dot.up { background: var(--lime); }
.status-dot.down { background: var(--coral); }
.status-dot.partial { background: #ffd057; }
.status-dot.not_configured { background: rgba(255,255,255,.22); }

@media (max-width: 720px) {
  .stage-rail { min-width: 0; }
  .stage-rail-line { max-width: 52vw; }
}

/* A brief highlight on the stage the rail just jumped to, so the eye finds it
   after the scroll lands. Without it the page simply moves and leaves you to
   work out which row you were sent to. */
.stage-rail-flash { animation: zoala-stage-flash 1.6s ease-out 1; border-radius: 10px; }
@keyframes zoala-stage-flash {
  0%, 100% { background: transparent; }
  20% { background: rgba(142,88,245,.26); }
}
@media (prefers-reduced-motion: reduce) { .stage-rail-flash { animation: none; } }
