:root {
    --bg: #07060b;
    --sidebar: #0c0811;
    --panel: #100b17;
    --panel-soft: #15101d;
    --border: rgba(181, 124, 255, 0.22);
    --purple: #b57cff;
    --purple-bright: #ca9cff;
    --purple-deep: #8e4de8;
    --green: #58f29b;
    --amber: #f2ad55;
    --pink: #f06fae;
    --blue: #66b9ec;
    --blue-bright: #78d8ff;
    --blue-mid: #4aa8ff;
    --blue-deep: #3677e8;
    --text: #f7f2fb;
    --muted: #a89caf;
    --faint: #756b7d;
    --shadow: 0 22px 55px rgba(0, 0, 0, 0.28);
}

* { box-sizing: border-box; }

html { min-width: 320px; background: var(--bg); }

body {
    margin: 0;
    color: var(--text);
    background:
        radial-gradient(circle at 85% 10%, rgba(117, 53, 180, 0.20), transparent 36%),
        radial-gradient(circle at 38% 90%, rgba(137, 73, 183, 0.09), transparent 32%),
        var(--bg);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    min-height: 100vh;
}

button { font: inherit; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 338px minmax(0, 1fr); }

.sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: 338px;
    display: flex;
    flex-direction: column;
    padding: 38px 24px 30px;
    background: linear-gradient(180deg, rgba(16, 10, 23, 0.98), rgba(7, 6, 11, 0.99));
    border-right: 1px solid var(--border);
    z-index: 10;
}

.brand { display: flex; align-items: center; gap: 16px; padding: 0 10px 34px; }
.brand-mark {
    width: 62px; height: 62px; display: grid; place-items: center;
    color: var(--purple-bright);
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.brand-mark svg { width: 42px; height: 42px; }
.brand-name { font-size: 22px; font-weight: 850; letter-spacing: 0.12em; }
.brand-subtitle { margin-top: 6px; color: var(--muted); font-size: 14px; letter-spacing: 0.03em; }

.sidebar-nav { display: grid; gap: 10px; }
.nav-link {
    width: 100%; min-height: 64px; display: grid; grid-template-columns: 32px 1fr auto;
    align-items: center; gap: 10px; padding: 0 22px; color: var(--muted);
    border: 1px solid transparent; border-radius: 17px; background: transparent;
    text-align: left; cursor: pointer; transition: 160ms ease;
}
.nav-link:hover:not(:disabled) { color: var(--text); background: rgba(181, 124, 255, 0.07); border-color: rgba(181, 124, 255, 0.20); }
.nav-link.active {
    color: var(--text); background: linear-gradient(90deg, rgba(181, 124, 255, 0.18), rgba(181, 124, 255, 0.07));
    border-color: rgba(181, 124, 255, 0.48); box-shadow: inset 4px 0 0 var(--purple-bright);
}
.nav-icon { width: 24px; color: currentColor; font-size: 18px; text-align: center; }
.nav-label { font-size: 18px; font-weight: 700; }
.nav-link-future { min-height: 58px; opacity: 0.58; cursor: not-allowed; }
.nav-link-future:disabled { color: var(--muted); background: rgba(181, 124, 255, 0.035); border-color: rgba(181, 124, 255, 0.09); }
.nav-badge {
    padding: 5px 8px; color: var(--purple-bright); border: 1px solid rgba(181, 124, 255, 0.28);
    border-radius: 999px; background: rgba(181, 124, 255, 0.09); font-size: 9px;
    font-weight: 850; letter-spacing: 0.14em; line-height: 1;
}

.sidebar-footer { margin-top: auto; padding: 28px 10px 0; border-top: 1px solid rgba(181, 124, 255, 0.13); }
.service-line { display: flex; align-items: flex-start; gap: 12px; }
.service-line strong, .service-line small { display: block; }
.service-line strong { font-size: 14px; }
.service-line small { margin-top: 4px; color: var(--muted); font-size: 12px; }
.sidebar-footer > p { margin: 26px 0 0; color: var(--faint); font-size: 11px; letter-spacing: 0.05em; }
.status-dot { width: 10px; height: 10px; flex: none; display: inline-block; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 6px rgba(88, 242, 155, 0.08), 0 0 16px rgba(88, 242, 155, 0.72); }

.main-content { grid-column: 2; min-width: 0; padding: 46px 78px 28px; }
.topbar { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; margin-bottom: 48px; }
.eyebrow { margin: 0 0 14px; color: var(--purple-bright); font-size: 13px; font-weight: 850; letter-spacing: 0.16em; }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1 { margin: 0; font-size: clamp(40px, 4vw, 56px); line-height: 1.02; letter-spacing: -0.045em; }
.subtitle { margin: 10px 0 0; color: var(--muted); font-size: 17px; }
.refresh-area { display: flex; align-items: center; gap: 20px; padding-top: 32px; }
.updated-block { text-align: right; white-space: nowrap; }
.updated-block span, .updated-block strong { display: block; }
.updated-block span { color: var(--muted); font-size: 11px; letter-spacing: 0.17em; }
.updated-block strong { margin-top: 7px; font-size: 14px; }
.refresh-button {
    min-width: 126px; height: 52px; padding: 0 20px; color: var(--text); font-weight: 800;
    border: 1px solid rgba(181, 124, 255, 0.40); border-radius: 15px;
    background: rgba(181, 124, 255, 0.14); cursor: pointer; transition: 160ms ease;
}
.refresh-button:hover { background: rgba(181, 124, 255, 0.23); transform: translateY(-1px); }
.refresh-button:disabled { cursor: wait; opacity: 0.75; }

.page-view[hidden] { display: none !important; }
.page-view.active { animation: view-in 180ms ease both; }
@keyframes view-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

.summary-heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 30px; }
.summary-heading h2 { margin: 0; font-size: 34px; letter-spacing: -0.035em; }
.health-pill, .live-pill, .advisory-pill { display: inline-flex; align-items: center; gap: 10px; border-radius: 999px; font-size: 13px; font-weight: 850; white-space: nowrap; }
.health-pill, .live-pill { padding: 11px 16px; color: #d8ffeb; border: 1px solid rgba(88, 242, 155, 0.26); background: rgba(88, 242, 155, 0.09); }
.health-pill .status-dot, .live-pill .status-dot { width: 9px; height: 9px; }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-bottom: 18px; }
.metric-card {
    min-height: 194px; padding: 25px; border: 1px solid var(--border); border-radius: 20px;
    background: linear-gradient(145deg, rgba(181, 124, 255, 0.08), rgba(13, 9, 18, 0.92)); box-shadow: var(--shadow);
}
.metric-card.metric-cyan { background: linear-gradient(145deg, rgba(120, 216, 255, 0.09), rgba(13, 9, 18, 0.92)); }
.metric-card.metric-pink { background: linear-gradient(145deg, rgba(240, 111, 174, 0.07), rgba(13, 9, 18, 0.92)); }
.metric-card.metric-blue { background: linear-gradient(145deg, rgba(102, 185, 236, 0.06), rgba(13, 9, 18, 0.92)); }
.metric-top { display: flex; justify-content: space-between; align-items: center; color: var(--muted); font-size: 13px; font-weight: 850; letter-spacing: 0.07em; }
.metric-icon { width: 39px; height: 39px; display: grid; place-items: center; border: 1px solid rgba(202, 156, 255, 0.20); border-radius: 12px; background: rgba(255,255,255,0.04); }
.metric-card > strong { display: block; margin: 16px 0 6px; font-size: 54px; line-height: 1; }
.metric-card > small { color: var(--muted); font-size: 14px; }

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(340px, 2fr); gap: 18px; }
.panel { padding: 27px; border: 1px solid var(--border); border-radius: 20px; background: rgba(14, 10, 19, 0.88); box-shadow: var(--shadow); }
.panel-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.panel-heading .eyebrow { margin-bottom: 9px; }
.panel h3 { margin: 0; font-size: 19px; letter-spacing: -0.025em; }
.text-button { padding: 7px 0; color: var(--purple-bright); border: 0; background: none; font-size: 12px; font-weight: 850; cursor: pointer; }
.broadcast-content { display: grid; grid-template-columns: 190px 1fr; align-items: center; gap: 32px; margin-top: 28px; }
.broadcast-ring {
    width: 176px; height: 176px; display: grid; place-items: center; border-radius: 50%;
    background: conic-gradient(var(--purple-bright) 0 75%, rgba(181,124,255,0.12) 75% 100%); position: relative;
}
.broadcast-ring::before { content: ""; position: absolute; inset: 11px; border-radius: 50%; background: #0e0a13; }
.broadcast-ring > div { position: relative; z-index: 1; text-align: center; }
.broadcast-ring strong, .broadcast-ring span { display: block; }
.broadcast-ring strong { font-size: 52px; line-height: 1; }
.broadcast-ring span { margin-top: 8px; color: var(--muted); font-size: 12px; letter-spacing: 0.10em; }
.stat-list { margin: 0; }
.stat-list > div { display: flex; justify-content: space-between; gap: 20px; padding: 17px 0; border-bottom: 1px solid rgba(181,124,255,0.12); }
.stat-list > div:last-child { border-bottom: 0; }
.stat-list dt { color: var(--muted); }
.stat-list dd { margin: 0; font-weight: 850; }
.healthy-text, .sensor-state strong { color: var(--green); }
.sensor-list { display: grid; gap: 14px; margin-top: 28px; }
.sensor-row { display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 15px; padding: 15px 16px; border: 1px solid rgba(181,124,255,0.13); border-radius: 15px; background: rgba(255,255,255,0.018); }
.sensor-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 13px; font-size: 20px; }
.sensor-icon.posty { color: var(--pink); border: 1px solid rgba(240,111,174,0.30); background: rgba(240,111,174,0.16); }
.sensor-icon.shout { color: var(--blue-bright); border: 1px solid rgba(120,216,255,0.30); background: rgba(74,168,255,0.15); }
.sensor-row small, .sensor-row strong { display: block; }
.sensor-row small { margin-top: 5px; color: var(--muted); font-size: 12px; }
.sensor-state { text-align: right; }
.sensor-state strong { font-size: 12px; }
.history-panel, .capacity-panel { margin-top: 2px; }
.legend { display: flex; gap: 17px; color: var(--muted); font-size: 11px; }
.legend span { display: flex; align-items: center; gap: 7px; }
.legend i { width: 8px; height: 8px; border-radius: 50%; }
.purple-dot { background: var(--purple-bright); }.blue-dot { background: var(--blue-bright); }
.chart-placeholder { height: 286px; margin-top: 26px; position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; overflow: hidden; border: 1px solid rgba(181,124,255,0.13); border-radius: 15px; background-image: linear-gradient(rgba(181,124,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(181,124,255,.035) 1px, transparent 1px); background-size: 56px 56px; }
.chart-placeholder .paw, .chart-placeholder strong, .chart-placeholder small { position: relative; z-index: 2; }
.chart-placeholder .paw { margin-bottom: 10px; filter: grayscale(.2); }
.chart-placeholder small { margin-top: 11px; color: var(--muted); }
.chart-placeholder svg { position: absolute; inset: auto 0 0; width: 100%; height: 125px; opacity: .32; }
.chart-placeholder path { fill: none; stroke: var(--blue-bright); stroke-width: 3; }.chart-placeholder .chart-line-two { stroke: var(--blue-deep); opacity: .72; }
.advisory-pill { padding: 10px 14px; color: #ffd89c; border: 1px solid rgba(242,173,85,.28); background: rgba(242,173,85,.08); }
.capacity-message { min-height: 181px; display: grid; grid-template-columns: 52px 1fr; gap: 16px; align-content: start; margin-top: 26px; padding: 22px; border: 1px solid rgba(242,173,85,.20); border-radius: 15px; background: rgba(242,173,85,.055); }
.capacity-message > span { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 14px; background: rgba(242,173,85,.10); }
.capacity-message strong { color: #ffe0ad; }.capacity-message p { color: #c8a979; font-size: 13px; line-height: 1.65; }
.progress-track { height: 8px; margin-top: 21px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.07); }.progress-track span { display: block; width: 8%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--amber), #ffd28a); }
.progress-labels { display: flex; justify-content: space-between; margin-top: 12px; color: var(--muted); font-size: 11px; }

.placeholder-panel { min-height: 595px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px; text-align: center; border: 1px solid var(--border); border-radius: 26px; background: rgba(15,10,21,.80); box-shadow: var(--shadow); }
.placeholder-icon { width: 88px; height: 88px; display: grid; place-items: center; margin-bottom: 27px; color: var(--purple-bright); border: 1px solid rgba(181,124,255,.42); border-radius: 25px; background: rgba(181,124,255,.16); font-size: 34px; box-shadow: 0 0 40px rgba(181,124,255,.11); }
.placeholder-panel .eyebrow { margin-bottom: 22px; }.placeholder-panel h2 { margin: 0; font-size: 40px; letter-spacing: -.035em; }.placeholder-panel > p:last-child { max-width: 700px; margin: 18px 0 0; color: var(--muted); font-size: 16px; }
.page-footer { display: flex; justify-content: space-between; gap: 24px; margin-top: 44px; color: #62566c; font-size: 11px; }

/* PostyCat dashboard */
.section-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 30px; }
.section-heading h2 { margin: 0; font-size: 34px; letter-spacing: -.035em; }
.section-subtitle { margin: 9px 0 0; color: var(--muted); font-size: 15px; }
.posty-eyebrow { color: var(--pink); }
.preview-pill { padding: 10px 14px; color: #ffc3df; border: 1px solid rgba(240,111,174,.32); border-radius: 999px; background: rgba(240,111,174,.09); font-size: 10px; font-weight: 850; letter-spacing: .14em; }
.posty-metric { background: linear-gradient(145deg, rgba(240,111,174,.09), rgba(13,9,18,.94)); }
.posty-symbol { color: var(--pink); border-color: rgba(240,111,174,.22); background: rgba(240,111,174,.07); }
.positive-change { color: var(--green); font-weight: 850; }
.metric-card > strong.word-metric { margin-top: 25px; font-size: 37px; }
.posty-dashboard-grid { display: grid; grid-template-columns: minmax(0,3fr) minmax(340px,2fr); gap: 18px; }
.posty-growth-panel, .top-posts-panel { min-width: 0; }
.range-switch { display: flex; padding: 3px; border: 1px solid rgba(240,111,174,.16); border-radius: 10px; background: rgba(255,255,255,.02); }
.range-switch button { padding: 7px 10px; color: var(--muted); border: 0; border-radius: 7px; background: transparent; font-size: 10px; font-weight: 850; cursor: pointer; }
.range-switch button.active { color: #ffd2e6; background: rgba(240,111,174,.16); }
.posty-chart { height: 315px; position: relative; margin-top: 24px; padding: 18px 18px 30px 50px; overflow: hidden; border: 1px solid rgba(240,111,174,.12); border-radius: 15px; background-image: linear-gradient(rgba(240,111,174,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(240,111,174,.045) 1px,transparent 1px); background-size: 100% 62px, 100px 100%; }
.posty-chart svg { width: 100%; height: 100%; overflow: visible; }
.posty-area { fill: url(#postyFill); }.posty-line { fill: none; stroke: var(--pink); stroke-width: 4; filter: drop-shadow(0 0 7px rgba(240,111,174,.35)); }.posty-chart circle { fill: var(--pink); stroke: #ffd2e6; stroke-width: 3; }
.chart-y-labels { position: absolute; inset: 13px auto 29px 12px; display: flex; flex-direction: column; justify-content: space-between; color: var(--faint); font-size: 10px; }
.chart-x-labels { position: absolute; inset: auto 18px 10px 50px; display: flex; justify-content: space-between; color: var(--faint); font-size: 10px; }
.healthy-mini { display: inline-flex; align-items: center; gap: 9px; padding: 8px 11px; color: #d8ffeb; border: 1px solid rgba(88,242,155,.24); border-radius: 999px; background: rgba(88,242,155,.07); font-size: 10px; font-weight: 850; }
.healthy-mini .status-dot { width: 8px; height: 8px; }
.posty-health-list { margin: 25px 0 0; }
.posty-health-list > div { display: flex; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid rgba(181,124,255,.11); }
.posty-health-list dt { color: var(--muted); }.posty-health-list dd { margin: 0; text-align: right; font-weight: 800; }
.posty-note { display: grid; grid-template-columns: 35px 1fr; gap: 12px; margin-top: 20px; padding: 15px; color: #d9b8ca; border: 1px solid rgba(240,111,174,.16); border-radius: 13px; background: rgba(240,111,174,.055); }
.posty-note > span { color: var(--pink); font-size: 20px; }.posty-note p { margin: 0; font-size: 11px; line-height: 1.6; }
.top-posts-panel, .hashtag-panel { margin-top: 2px; }
.table-note { color: var(--muted); font-size: 11px; }
.post-table { margin-top: 24px; }
.post-table-row { display: grid; grid-template-columns: minmax(220px,1fr) 70px 75px 65px; align-items: center; gap: 12px; padding: 15px 12px; border-bottom: 1px solid rgba(181,124,255,.11); }
.post-table-row:last-child { border-bottom: 0; }.post-table-header { color: var(--faint); font-size: 9px; font-weight: 850; letter-spacing: .12em; }.post-table-row > span:not(:first-child), .post-table-row > strong { text-align: center; }.post-table-row b,.post-table-row small { display: block; }.post-table-row b { font-size: 13px; }.post-table-row small { margin-top: 5px; color: var(--muted); font-size: 10px; }.post-table-row > strong { color: var(--pink); }
.hashtag-list { display: grid; gap: 18px; margin-top: 27px; }
.hashtag-list > div { display: grid; grid-template-columns: 130px 1fr 58px; align-items: center; gap: 12px; font-size: 11px; }
.hashtag-list > div > span { color: #f2c6da; font-weight: 750; }.hashtag-list > div > div { height: 7px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.07); }.hashtag-list i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--purple),var(--pink)); }.hashtag-list strong { color: var(--muted); text-align: right; font-size: 10px; }
.hashtag-footnote { margin: 26px 0 0; color: var(--faint); font-size: 10px; line-height: 1.5; }

/* ShoutCat dashboard — ocean blue identity */
.shout-eyebrow { color: var(--blue-bright); }
.shout-heading .live-pill { margin-bottom: 2px; }
.shout-metric { border-color: rgba(102,185,236,.25); background: linear-gradient(145deg, rgba(54,119,232,.12), rgba(8,14,27,.95)); }
.shout-metric:nth-child(2) { background: linear-gradient(145deg, rgba(74,168,255,.12), rgba(8,13,25,.95)); }
.shout-metric:nth-child(3) { background: linear-gradient(145deg, rgba(120,216,255,.10), rgba(9,13,24,.95)); }
.shout-metric:nth-child(4) { background: linear-gradient(145deg, rgba(62,104,210,.13), rgba(9,12,25,.95)); }
.shout-symbol { color: var(--blue-bright); border-color: rgba(120,216,255,.27); background: rgba(74,168,255,.09); }
.shout-dashboard-grid { display: grid; grid-template-columns: minmax(0,3fr) minmax(340px,2fr); gap: 18px; }
.station-panel { min-width: 0; }
.on-air-pill { display: inline-flex; align-items: center; gap: 9px; padding: 9px 12px; color: #d8ffeb; border: 1px solid rgba(88,242,155,.25); border-radius: 999px; background: rgba(88,242,155,.08); font-size: 10px; font-weight: 850; }
.on-air-pill .status-dot { width: 8px; height: 8px; }
.station-hero { display: grid; grid-template-columns: 170px 1fr; align-items: center; gap: 30px; margin-top: 28px; padding: 25px; border: 1px solid rgba(102,185,236,.18); border-radius: 17px; background: linear-gradient(135deg,rgba(54,119,232,.10),rgba(120,216,255,.025)); }
.station-disc { width: 152px; height: 152px; position: relative; display: grid; place-items: center; border: 1px solid rgba(120,216,255,.28); border-radius: 50%; background: repeating-radial-gradient(circle,rgba(74,168,255,.17) 0 2px,transparent 3px 13px),radial-gradient(circle,rgba(120,216,255,.18),rgba(7,12,24,.96) 66%); box-shadow: 0 0 38px rgba(74,168,255,.13); }
.station-disc::after { content:""; position:absolute; inset:17px; border:1px solid rgba(120,216,255,.14); border-radius:50%; }
.station-disc-center { width: 56px; height: 56px; position: relative; z-index: 1; display:grid; place-items:center; color:#061321; border-radius:50%; background:linear-gradient(145deg,#bcecff,var(--blue-mid)); font-size:24px; box-shadow:0 0 25px rgba(74,168,255,.34); }
.source-badge { display:inline-block; padding:7px 10px; color:#bfeeff; border:1px solid rgba(120,216,255,.28); border-radius:999px; background:rgba(74,168,255,.09); font-size:9px; font-weight:850; letter-spacing:.13em; }
.station-copy h4 { margin:15px 0 8px; font-size:22px; letter-spacing:-.025em; }
.station-copy p { margin:0; color:var(--muted); font-size:13px; line-height:1.65; }
.station-stat-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 28px; margin:22px 0 0; }
.station-stat-list > div { display:flex; justify-content:space-between; gap:15px; padding:14px 0; border-bottom:1px solid rgba(181,124,255,.11); }
.station-stat-list > div:last-child { grid-column:1/-1; }
.station-stat-list dt { color:var(--muted); }.station-stat-list dd { margin:0; text-align:right; font-weight:800; }
.telemetry-pulse { height:142px; position:relative; display:grid; place-items:center; margin-top:23px; overflow:hidden; border:1px solid rgba(102,185,236,.15); border-radius:15px; background:radial-gradient(circle,rgba(74,168,255,.13),transparent 62%); }
.telemetry-pulse span,.telemetry-pulse i { position:absolute; width:82px; height:82px; border:1px solid rgba(120,216,255,.31); border-radius:50%; animation:radio-pulse 2.8s ease-out infinite; }
.telemetry-pulse i { animation-delay:1.35s; }
.telemetry-pulse b { width:52px; height:52px; display:grid; place-items:center; color:var(--blue-bright); border:1px solid rgba(120,216,255,.32); border-radius:16px; background:rgba(74,168,255,.12); font-size:21px; }
@keyframes radio-pulse { from { transform:scale(.62); opacity:.75; } to { transform:scale(1.75); opacity:0; } }
.shout-health-list { margin-top:18px; }.shout-health-list > div { padding:12px 0; }
.shout-note { display:grid; grid-template-columns:32px 1fr; gap:11px; margin-top:18px; padding:14px; color:#a9d6ea; border:1px solid rgba(102,185,236,.18); border-radius:13px; background:rgba(74,168,255,.06); }
.shout-note > span { color:var(--blue-bright); font-size:19px; }.shout-note p { margin:0; font-size:11px; line-height:1.6; }
.radio-history-panel,.capacity-readout-panel { margin-top:2px; }
.history-tools { display:flex; align-items:center; gap:16px; }.shout-preview { color:#c5efff; border-color:rgba(120,216,255,.30); background:rgba(74,168,255,.09); }
.radio-chart { height:315px; position:relative; margin-top:25px; padding:18px 18px 30px 50px; overflow:hidden; border:1px solid rgba(102,185,236,.15); border-radius:15px; background-image:linear-gradient(rgba(120,216,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(54,119,232,.05) 1px,transparent 1px); background-size:100% 58px,100px 100%; }
.radio-chart svg { width:100%; height:100%; overflow:visible; }.broadcast-area { fill:url(#broadcastFill); }.broadcast-line { fill:none; stroke:var(--blue-bright); stroke-width:4; filter:drop-shadow(0 0 7px rgba(74,168,255,.38)); }.listener-line { fill:none; stroke:var(--blue-deep); stroke-width:3; }
.radio-y-labels { position:absolute; inset:13px auto 29px 15px; display:flex; flex-direction:column; justify-content:space-between; color:var(--faint); font-size:10px; }.radio-x-labels { position:absolute; inset:auto 18px 10px 50px; display:flex; justify-content:space-between; color:var(--faint); font-size:10px; }
.capacity-gauge { display:grid; grid-template-columns:155px 1fr; align-items:center; gap:24px; margin-top:28px; }
.capacity-dial { width:148px; height:148px; position:relative; display:grid; place-items:center; border-radius:50%; background:conic-gradient(var(--blue-bright) 0 2%,rgba(74,168,255,.13) 2% 100%); }
.capacity-dial::before { content:""; position:absolute; inset:10px; border-radius:50%; background:#0e0a13; }.capacity-dial > div { position:relative; z-index:1; text-align:center; }.capacity-dial strong,.capacity-dial span { display:block; }.capacity-dial strong { font-size:39px; }.capacity-dial span { margin-top:6px; color:var(--muted); font-size:9px; letter-spacing:.1em; }
.capacity-copy strong { color:#c9f1ff; font-size:17px; }.capacity-copy p { margin:10px 0 0; color:var(--muted); font-size:12px; line-height:1.65; }
.capacity-facts { margin:24px 0 0; }.capacity-facts > div { display:flex; justify-content:space-between; gap:15px; padding:13px 0; border-bottom:1px solid rgba(181,124,255,.10); }.capacity-facts > div:last-child { border-bottom:0; }.capacity-facts dt { color:var(--muted); }.capacity-facts dd { margin:0; font-weight:800; }

@media (max-width: 1250px) {
    .app-shell { grid-template-columns: 280px minmax(0,1fr); }
    .sidebar { width: 280px; }
    .main-content { padding: 42px 34px 26px; }
    .metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .dashboard-grid { grid-template-columns: 1fr; }
    .posty-dashboard-grid { grid-template-columns: 1fr; }
    .shout-dashboard-grid { grid-template-columns: 1fr; }
}

@media (max-width: 780px) {
    .app-shell { display: block; }
    .sidebar { position: static; width: auto; padding: 22px; }
    .brand { padding-bottom: 20px; }
    .sidebar-nav { grid-template-columns: 1fr; }
    .nav-link { min-height: 54px; }
    .sidebar-footer { margin-top: 22px; }
    .main-content { padding: 30px 20px; }
    .topbar, .summary-heading { align-items: flex-start; flex-direction: column; }
    .section-heading { align-items: flex-start; flex-direction: column; }
    .refresh-area { padding-top: 0; }
    .metric-grid { grid-template-columns: 1fr; }
    .broadcast-content { grid-template-columns: 1fr; }
    .broadcast-ring { margin: auto; }
    .station-hero, .capacity-gauge { grid-template-columns: 1fr; }
    .station-disc, .capacity-dial { margin:auto; }
    .station-stat-list { grid-template-columns:1fr; }
    .station-stat-list > div:last-child { grid-column:auto; }
    .history-tools { align-items:flex-end; flex-direction:column; gap:8px; }
    .post-table-row { grid-template-columns: minmax(150px,1fr) 48px 53px 42px; gap: 7px; padding-inline: 4px; }
    .hashtag-list > div { grid-template-columns: 105px 1fr 50px; }
    .page-footer { align-items: flex-start; flex-direction: column; gap: 4px; }
}

/* ===== CATALYTICS MOBILE MENU START ===== */

.mobile-menu-button {
    display: none;
    width: 48px;
    height: 48px;
    margin-left: auto;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    padding: 0;
    border: 1px solid rgba(194, 132, 255, 0.45);
    border-radius: 14px;
    color: #f7efff;
    background:
        linear-gradient(
            145deg,
            rgba(194, 132, 255, 0.18),
            rgba(104, 72, 166, 0.12)
        );
    box-shadow:
        0 10px 28px rgba(0, 0, 0, 0.28),
        inset 0 0 18px rgba(194, 132, 255, 0.07);
    cursor: pointer;
}

.mobile-menu-button span {
    display: block;
    width: 21px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transition:
        transform 180ms ease,
        opacity 180ms ease;
}

.mobile-menu-button[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.mobile-menu-button[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
}

.mobile-menu-button[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

@media (max-width: 760px) {
    .app-shell {
        display: block;
        min-height: 100vh;
    }

    .sidebar {
        position: sticky;
        z-index: 1000;
        top: 0;
        left: auto;
        width: 100%;
        height: auto;
        min-height: 0;
        padding: 14px 16px;
        overflow: visible;
        border-right: 0;
        border-bottom:
            1px solid rgba(194, 132, 255, 0.22);
        background:
            rgba(10, 7, 16, 0.97);
        box-shadow:
            0 14px 35px rgba(0, 0, 0, 0.38);
        backdrop-filter: blur(18px);
    }

    .brand {
        display: flex;
        width: 100%;
        align-items: center;
        gap: 12px;
        margin: 0;
    }

    .brand-mark {
        width: 52px;
        height: 52px;
        flex: 0 0 52px;
    }

    .brand-name {
        font-size: 1.05rem;
        letter-spacing: 0.12em;
    }

    .brand-subtitle {
        margin-top: 3px;
        font-size: 0.76rem;
    }

    .mobile-menu-button {
        display: flex;
    }

    .sidebar-nav {
        display: none;
        width: 100%;
        margin: 14px 0 2px;
        padding: 12px 0 2px;
        border-top:
            1px solid rgba(194, 132, 255, 0.16);
    }

    .sidebar.mobile-menu-open .sidebar-nav {
        display: grid;
        gap: 8px;
        animation:
            catalytics-menu-open 160ms ease-out;
    }

    .nav-link {
        width: 100%;
        min-height: 54px;
        margin: 0;
    }

    .sidebar-footer {
        display: none;
    }

    .main-content {
        width: 100%;
        min-width: 0;
        margin-left: 0;
        padding: 28px 18px 20px;
    }

    .topbar {
        gap: 20px;
        align-items: flex-start;
    }

    .topbar h1 {
        font-size: clamp(2rem, 10vw, 3rem);
    }

    .refresh-area {
        width: 100%;
        justify-content: space-between;
    }

    .metric-grid,
    .dashboard-grid,
    .posty-dashboard-grid,
    .shoutcat-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .page-footer {
        gap: 8px;
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .sidebar {
        padding: 12px;
    }

    .brand-mark {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
    }

    .brand-name {
        font-size: 0.98rem;
    }

    .brand-subtitle {
        font-size: 0.7rem;
    }

    .mobile-menu-button {
        width: 44px;
        height: 44px;
    }

    .main-content {
        padding: 24px 14px 18px;
    }

    .metric-card,
    .panel {
        min-width: 0;
    }
}

@keyframes catalytics-menu-open {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===== CATALYTICS MOBILE MENU END ===== */

/* ===== MOBILE SERVICE FOOTER START ===== */

.mobile-service-footer {
    display: none;
}

@media (max-width: 760px) {
    .sidebar .sidebar-footer {
        display: none;
    }

    .mobile-service-footer {
        display: flex;
        width: 100%;
        margin-top: 28px;
        padding: 22px 4px 6px;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        border-top:
            1px solid rgba(194, 132, 255, 0.18);
        color: rgba(235, 224, 244, 0.72);
    }

    .mobile-service-footer .service-line {
        display: flex;
        min-width: 0;
        align-items: center;
        gap: 11px;
    }

    .mobile-service-footer .service-line > div {
        display: grid;
        min-width: 0;
        gap: 3px;
    }

    .mobile-service-footer .service-line strong {
        color: #f7efff;
        font-size: 0.9rem;
        white-space: nowrap;
    }

    .mobile-service-footer .service-line small {
        color: rgba(211, 197, 220, 0.62);
        font-size: 0.76rem;
    }

    .mobile-service-footer .status-dot {
        flex: 0 0 auto;
    }

    .mobile-service-footer p {
        margin: 0;
        color: rgba(194, 167, 210, 0.52);
        font-size: 0.74rem;
        letter-spacing: 0.04em;
        white-space: nowrap;
    }
}

@media (max-width: 420px) {
    .mobile-service-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }
}

/* ===== MOBILE SERVICE FOOTER END ===== */

/* ===== CATALYTICS REDEMPTIONS START ===== */

.redemption-eyebrow {
    color: #d8a1ff;
}

.redemption-private-pill,
.redemption-lock {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    color: #ead7ff;
    border: 1px solid rgba(202,156,255,.28);
    border-radius: 999px;
    background: rgba(181,124,255,.09);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .11em;
}

.redemption-layout {
    display: grid;
    grid-template-columns:
        minmax(0,3fr)
        minmax(320px,2fr);
    gap: 18px;
}

.redemption-create-panel,
.redemption-guide-panel,
.redemption-list-panel {
    border-color: rgba(202,156,255,.20);
    background:
        linear-gradient(
            145deg,
            rgba(181,124,255,.055),
            rgba(14,10,19,.94)
        );
}

.redemption-form {
    display: grid;
    gap: 20px;
    margin-top: 28px;
}

.redemption-field {
    display: grid;
    gap: 9px;
}

.redemption-field > span {
    color: #efe4f7;
    font-size: 13px;
    font-weight: 800;
}

.redemption-field > span i {
    color: var(--muted);
    font-size: 11px;
    font-style: normal;
    font-weight: 500;
}

.redemption-field input,
.redemption-field select,
.redemption-field textarea {
    width: 100%;
    color: var(--text);
    border: 1px solid rgba(202,156,255,.22);
    border-radius: 12px;
    outline: none;
    background: rgba(255,255,255,.035);
    font: inherit;
}

.redemption-field input,
.redemption-field select {
    min-height: 48px;
    padding: 0 14px;
}

.redemption-field textarea {
    min-height: 108px;
    padding: 13px 14px;
    resize: vertical;
}

.redemption-field select {
    color-scheme: dark;
}

.redemption-field select option {
    color: #1c1226;
    background: #ffffff;
}

.redemption-field input:focus,
.redemption-field select:focus,
.redemption-field textarea:focus {
    border-color: rgba(202,156,255,.70);
    box-shadow:
        0 0 0 4px rgba(181,124,255,.09);
}

.redemption-field small {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.5;
}

.redemption-primary-button {
    min-height: 52px;
    padding: 0 20px;
    color: #12091b;
    border: 0;
    border-radius: 13px;
    background:
        linear-gradient(
            135deg,
            #c99cff,
            #a966f2
        );
    font-weight: 900;
    cursor: pointer;
}

.redemption-primary-button:disabled {
    cursor: wait;
    opacity: .65;
}

.redemption-form-status {
    min-height: 20px;
    margin: -5px 0 0;
    color: var(--green);
    font-size: 12px;
}

.redemption-form-status.error {
    color: #ff8eaa;
}

.redemption-created-result {
    margin-top: 28px;
    padding: 25px;
    text-align: center;
    border:
        1px solid rgba(88,242,155,.26);
    border-radius: 16px;
    background: rgba(88,242,155,.055);
}

.redemption-created-result > span,
.redemption-created-result > strong,
.redemption-created-result > small {
    display: block;
}

.redemption-created-result > span {
    color: var(--green);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .15em;
}

.redemption-created-result > strong {
    margin: 17px 0;
    font-size: clamp(21px,3vw,31px);
    overflow-wrap: anywhere;
}

.redemption-created-result > div {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.redemption-created-result button,
.redemption-copy-button,
.redemption-refresh-button {
    min-height: 39px;
    padding: 0 14px;
    color: #eadbfa;
    border:
        1px solid rgba(202,156,255,.24);
    border-radius: 10px;
    background: rgba(181,124,255,.08);
    font-weight: 800;
    cursor: pointer;
}

.redemption-created-result > small {
    margin-top: 18px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.55;
}

.redemption-type-guide {
    display: grid;
    gap: 15px;
    margin-top: 28px;
}

.redemption-guide-card {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 15px;
    padding: 18px;
    border:
        1px solid rgba(202,156,255,.16);
    border-radius: 15px;
    background: rgba(255,255,255,.018);
}

.redemption-guide-card.gift {
    border-color: rgba(240,111,174,.18);
    background: rgba(240,111,174,.035);
}

.redemption-guide-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    color: #d8a1ff;
    border-radius: 13px;
    background: rgba(181,124,255,.13);
    font-size: 20px;
}

.redemption-guide-card strong {
    font-size: 15px;
}

.redemption-guide-card p {
    margin: 8px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.6;
}

.redemption-security-note {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 11px;
    margin-top: 20px;
    padding: 15px;
    color: #cbb6dc;
    border:
        1px solid rgba(88,242,155,.15);
    border-radius: 13px;
    background: rgba(88,242,155,.045);
}

.redemption-security-note p {
    margin: 0;
    font-size: 11px;
    line-height: 1.6;
}

.redemption-list-panel {
    margin-top: 18px;
}

.redemption-list-heading,
.redemption-list-tools {
    align-items: center;
}

.redemption-list-tools {
    display: flex;
    gap: 12px;
}

.redemption-filter {
    display: flex;
    padding: 3px;
    border:
        1px solid rgba(202,156,255,.17);
    border-radius: 10px;
}

.redemption-filter button {
    padding: 8px 12px;
    color: var(--muted);
    border: 0;
    border-radius: 7px;
    background: transparent;
    font-size: 10px;
    font-weight: 850;
    cursor: pointer;
}

.redemption-filter button.active {
    color: #f0e3ff;
    background: rgba(181,124,255,.16);
}

.redemption-list-status {
    margin-top: 24px;
    padding: 22px;
    color: var(--muted);
    border:
        1px dashed rgba(202,156,255,.20);
    border-radius: 14px;
    text-align: center;
    font-size: 12px;
}

.redemption-list {
    display: grid;
    grid-template-columns:
        repeat(2,minmax(0,1fr));
    gap: 14px;
    margin-top: 24px;
}

.redemption-record {
    padding: 19px;
    border:
        1px solid rgba(202,156,255,.17);
    border-radius: 15px;
    background: rgba(255,255,255,.018);
}

.redemption-record-revoked {
    opacity: .68;
}

.redemption-record-header {
    display: flex;
    justify-content: space-between;
    gap: 18px;
}

.redemption-record-type,
.redemption-record-code {
    display: block;
}

.redemption-record-type {
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .10em;
}

.redemption-record-code {
    margin-top: 8px;
    font-size: 18px;
    letter-spacing: .045em;
}

.redemption-status-badge {
    height: fit-content;
    padding: 7px 9px;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 900;
}

.status-active {
    color: #d9ffea;
    background: rgba(88,242,155,.08);
}

.status-redeemed {
    color: #c8eaff;
    background: rgba(74,168,255,.08);
}

.status-revoked {
    color: #ffc0ce;
    background: rgba(255,112,143,.08);
}

.redemption-record-details {
    margin: 17px 0 0;
}

.redemption-record-details > div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 0;
    border-bottom:
        1px solid rgba(202,156,255,.09);
}

.redemption-record-details dt {
    color: var(--muted);
    font-size: 11px;
}

.redemption-record-details dd {
    max-width: 65%;
    margin: 0;
    text-align: right;
    overflow-wrap: anywhere;
    font-size: 11px;
    font-weight: 750;
}

.redemption-record-actions {
    display: flex;
    justify-content: flex-end;
    gap: 9px;
    margin-top: 16px;
}

.redemption-revoke-button {
    min-height: 39px;
    padding: 0 14px;
    color: #ffc0ce;
    border:
        1px solid rgba(255,112,143,.23);
    border-radius: 10px;
    background: rgba(255,112,143,.07);
    font-weight: 800;
    cursor: pointer;
}

@media (max-width: 1100px) {
    .redemption-layout,
    .redemption-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .redemption-list-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .redemption-list-tools {
        width: 100%;
        justify-content: space-between;
    }

    .redemption-created-result > div,
    .redemption-record-header {
        flex-direction: column;
    }

    .redemption-record-details > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    .redemption-record-details dd {
        max-width: none;
        text-align: left;
    }
}

/* ===== CATALYTICS REDEMPTIONS END ===== */

/* ===== CATALYTICS OPERATIONS FINISH ===== */

.brand-mark svg {
    width: 44px;
    height: 44px;
}

.brand-name {
    font-size: 17px;
    letter-spacing: .045em;
    white-space: nowrap;
}

.brand-name span {
    color: var(--text);
    font-weight: 900;
}

.brand-name b {
    color: var(--purple-bright);
    font-weight: 900;
}

.health-alert {
    position: fixed;
    z-index: 100;
    top: 18px;
    left: 50%;
    width: min(720px, calc(100vw - 36px));
    transform: translateX(-50%);
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 14px;
    align-items: center;
    padding: 15px 18px;
    color: #fff;
    border: 2px solid #ff6b72;
    border-radius: 15px;
    background: rgba(142, 19, 31, .97);
    box-shadow:
        0 0 0 5px rgba(255, 60, 72, .16),
        0 18px 55px rgba(0, 0, 0, .55);
}

.health-alert[hidden] {
    display: none;
}

.health-alert-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #7d0e18;
    background: #fff;
    font-size: 25px;
    font-weight: 950;
}

.health-alert strong,
.health-alert p {
    display: block;
    margin: 0;
}

.health-alert p {
    margin-top: 4px;
    color: #ffdadd;
    font-size: 13px;
}

.shoutcat-unhealthy .shout-heading .live-pill,
.shoutcat-unhealthy .station-panel .on-air-pill,
.live-pill.unhealthy,
.on-air-pill.unhealthy {
    color: #fff;
    border-color: rgba(255, 80, 91, .78);
    background: rgba(174, 24, 37, .82);
    box-shadow: 0 0 24px rgba(255, 50, 65, .28);
}

.shoutcat-unhealthy .status-dot {
    background: #ff5964;
    box-shadow:
        0 0 0 6px rgba(255, 65, 78, .13),
        0 0 18px rgba(255, 65, 78, .88);
}

@media (min-width: 1500px) and (min-height: 850px) {
    .sidebar {
        width: 285px;
        padding: 24px 20px 20px;
    }

    .app-shell {
        grid-template-columns: 285px minmax(0, 1fr);
    }

    .brand {
        padding-bottom: 20px;
    }

    .brand-mark {
        width: 54px;
        height: 54px;
    }

    .nav-link {
        min-height: 50px;
    }

    .main-content {
        padding: 24px 42px 20px;
    }

    .topbar {
        margin-bottom: 20px;
    }

    h1 {
        font-size: 38px;
    }

    .refresh-area {
        padding-top: 12px;
    }

    .summary-heading {
        margin-bottom: 14px;
    }

    .summary-heading h2 {
        font-size: 27px;
    }

    .metric-grid {
        gap: 12px;
        margin-bottom: 12px;
    }

    .metric-card {
        min-height: 128px;
        padding: 18px 20px;
    }

    .metric-card > strong {
        margin: 10px 0 4px;
        font-size: 38px;
    }

    .dashboard-grid {
        grid-template-columns:
            minmax(0, 3fr)
            minmax(310px, 2fr);
        gap: 12px;
    }

    .panel {
        padding: 19px;
    }

    .broadcast-content {
        grid-template-columns: 126px 1fr;
        gap: 20px;
        margin-top: 15px;
    }

    .broadcast-ring {
        width: 118px;
        height: 118px;
    }

    .broadcast-ring strong {
        font-size: 38px;
    }

    .sensor-list,
    .capacity-message {
        margin-top: 15px;
    }

    .sensor-row {
        padding: 10px 12px;
    }

    .chart-placeholder {
        height: 205px;
        margin-top: 14px;
    }

    .capacity-message {
        min-height: 116px;
        padding: 15px;
    }

    .history-panel,
    .capacity-panel {
        margin-top: 0;
    }
}

/* ===== CATALYTICS OPERATIONS FINISH ===== */

/* ===== OPERATIONAL CARD OVERFLOW CORRECTION ===== */

.metric-card {
    min-width: 0;
    overflow: hidden;
}

#customer-stations,
#network-use,
#alexandria-listeners,
#station-capacity {
    max-width: 100%;
    white-space: nowrap;
}

#network-use {
    font-size: clamp(28px, 2.35vw, 43px);
    letter-spacing: -.055em;
}

#alexandria-listeners {
    font-size: clamp(34px, 2.7vw, 48px);
    letter-spacing: -.035em;
}

/* ===== OPERATIONAL CARD OVERFLOW CORRECTION ===== */

/* ===== CATALYTICS SINGLE-SCREEN OVERVIEW ===== */

#customer-stations,
#network-use,
#alexandria-listeners,
#station-capacity {
    font-size: clamp(30px, 2.35vw, 42px);
    line-height: 1;
    letter-spacing: -.04em;
}

/*
 * The operational Overview uses a compact banner while the
 * other Catalytics pages retain their existing headings.
 */

.topbar {
    align-items: center;
    min-height: 62px;
    margin-bottom: 14px;
    padding: 10px 14px;
    border: 1px solid rgba(181, 124, 255, .18);
    border-radius: 16px;
    background:
        linear-gradient(
            100deg,
            rgba(181, 124, 255, .09),
            rgba(120, 216, 255, .025)
        );
}

.topbar > div:first-child {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
}

.topbar > div:first-child .eyebrow {
    flex: none;
    margin: 0;
    padding: 7px 9px;
    border-radius: 999px;
    background: rgba(181, 124, 255, .11);
    font-size: 9px;
    letter-spacing: .13em;
}

.topbar h1 {
    margin: 0;
    font-size: 19px;
    line-height: 1.2;
    letter-spacing: -.018em;
    white-space: nowrap;
}

.topbar .subtitle {
    display: none;
}

.refresh-area {
    flex: none;
    gap: 14px;
    padding-top: 0;
}

.updated-block span {
    font-size: 9px;
}

.updated-block strong {
    margin-top: 3px;
    font-size: 12px;
}

.refresh-button {
    min-width: 104px;
    height: 40px;
    padding: 0 15px;
    border-radius: 12px;
}

#overview-view .summary-heading {
    margin-bottom: 12px;
}

#overview-view .summary-heading .eyebrow {
    margin-bottom: 7px;
    font-size: 10px;
}

#overview-view .summary-heading h2 {
    font-size: 25px;
}

#overview-view .health-pill {
    padding: 9px 13px;
    font-size: 11px;
}

#overview-view .metric-grid {
    gap: 12px;
    margin-bottom: 12px;
}

#overview-view .metric-card {
    min-height: 124px;
    padding: 16px 18px;
}

#overview-view .metric-top {
    font-size: 11px;
}

#overview-view .metric-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

#overview-view .metric-card > strong {
    margin: 9px 0 4px;
}

#overview-view .metric-card > small {
    font-size: 12px;
}

/*
 * Sensor status, the retained ShoutCat history graph and
 * CappyCat now share one compact lower row.
 */

#overview-view .dashboard-grid {
    grid-template-columns:
        minmax(225px, .9fr)
        minmax(360px, 1.55fr)
        minmax(270px, 1.05fr);
    gap: 12px;
    align-items: stretch;
}

#overview-view .panel {
    min-width: 0;
    padding: 16px;
}

#overview-view .panel-heading {
    gap: 12px;
}

#overview-view .panel-heading .eyebrow {
    margin-bottom: 6px;
    font-size: 9px;
}

#overview-view .panel h3 {
    font-size: 16px;
}

#overview-view .text-button {
    display: none;
}

#overview-view .sensor-list {
    gap: 9px;
    margin-top: 13px;
}

#overview-view .sensor-row {
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 11px;
}

#overview-view .sensor-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    font-size: 16px;
}

#overview-view .sensor-row strong {
    font-size: 12px;
}

#overview-view .sensor-row small {
    margin-top: 3px;
    font-size: 9px;
}

#overview-view .legend {
    gap: 9px;
    font-size: 9px;
}

#overview-view .chart-placeholder {
    height: 154px;
    margin-top: 12px;
    border-radius: 12px;
}

#overview-view .chart-placeholder .paw {
    margin-bottom: 5px;
    font-size: 17px;
}

#overview-view .chart-placeholder strong {
    font-size: 12px;
}

#overview-view .chart-placeholder small {
    margin-top: 6px;
    padding: 0 12px;
    text-align: center;
    font-size: 9px;
}

#overview-view .chart-placeholder svg {
    height: 78px;
}

#overview-view .capacity-message {
    min-height: 92px;
    grid-template-columns: 34px 1fr;
    gap: 10px;
    margin-top: 12px;
    padding: 11px;
    border-radius: 12px;
}

#overview-view .capacity-message > span {
    font-size: 22px;
}

#overview-view .capacity-message strong {
    font-size: 12px;
}

#overview-view .capacity-message p {
    margin-top: 5px;
    font-size: 9px;
    line-height: 1.45;
}

#overview-view .progress-track {
    margin-top: 11px;
}

#overview-view .progress-labels {
    margin-top: 7px;
    font-size: 9px;
}

@media (min-width: 1400px) {
    .main-content {
        padding: 18px 28px 16px;
    }

    .sidebar {
        width: 270px;
        padding: 20px 18px 18px;
    }

    .app-shell {
        grid-template-columns:
            270px minmax(0, 1fr);
    }

    .brand {
        padding-bottom: 17px;
    }

    .nav-link {
        min-height: 46px;
    }
}

@media (max-width: 1399px) {
    #overview-view .dashboard-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    #overview-view .history-panel {
        grid-column: 1 / -1;
    }
}

@media (max-width: 900px) {
    .topbar > div:first-child {
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
    }

    .topbar h1 {
        white-space: normal;
    }

    #overview-view .dashboard-grid {
        grid-template-columns: 1fr;
    }

    #overview-view .history-panel {
        grid-column: auto;
    }
}

/* ===== CATALYTICS SINGLE-SCREEN OVERVIEW ===== */

/* ===== CATALYTICS SIDEBAR BRAND REFINEMENT ===== */

.brand {
    gap: 10px;
    align-items: center;
}

.brand-name {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    font-size: inherit;
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
}

.brand-name .brand-product {
    display: block;
    color: var(--text);
    font-size: 20px;
    font-weight: 900;
    letter-spacing: .025em;
}

.brand-name .brand-product b {
    color: var(--purple-bright);
    font-weight: 900;
}

.brand-name .brand-section {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: .16em;
}

.sidebar-nav {
    gap: 7px;
}

.nav-link {
    min-width: 0;
    gap: 11px;
    padding-left: 15px;
    padding-right: 13px;
}

.nav-icon {
    flex: none;
}

.nav-label {
    min-width: 0;
    font-size: 14px;
    white-space: nowrap;
}

.nav-badge {
    flex: none;
    margin-left: auto;
    padding: 4px 7px;
    font-size: 8px;
}

/* ===== CATALYTICS SIDEBAR BRAND REFINEMENT ===== */

/* ===== CATALYTICS FINAL INTERFACE CLEANUP ===== */

.topbar > div:first-child {
    flex: 1;
}

.topbar h1 {
    padding-left: 4px;
}

.sidebar-footer .service-line,
.mobile-service-footer .service-line {
    align-items: center;
    gap: 12px;
}

.sidebar-footer .service-line .status-dot,
.mobile-service-footer .service-line .status-dot {
    margin: 0;
}

.sidebar-footer .service-line > strong,
.mobile-service-footer .service-line > strong {
    line-height: 1;
}

#overview-view .capacity-message {
    min-height: 92px;
    display: block;
    margin-top: 12px;
    padding: 14px;
}

#overview-view .capacity-message > div {
    min-width: 0;
}

#overview-view .capacity-message strong {
    display: block;
    margin: 0;
    font-size: 12px;
    line-height: 1.35;
}

#overview-view .capacity-message p {
    margin: 7px 0 0;
    font-size: 10px;
    line-height: 1.5;
}

/* ===== CATALYTICS FINAL INTERFACE CLEANUP ===== */

/* ===== CATALYTICS CLEAN CAT FINISH ===== */

.shout-metrics {
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}

.shout-metrics .metric-card {
    min-height: 150px;
}

#shout-listeners,
#shout-bandwidth {
    font-size: clamp(34px, 3vw, 50px);
    white-space: nowrap;
}

.history-status {
    padding: 9px 12px;
    color: #c5efff;
    border:
        1px solid rgba(120, 216, 255, .30);
    border-radius: 999px;
    background: rgba(74, 168, 255, .09);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .12em;
    white-space: nowrap;
}

.listener-area {
    fill: url(#listenerFill);
}

.listener-line {
    fill: none;
    stroke: var(--blue-bright);
    stroke-width: 4;
    filter:
        drop-shadow(
            0 0 7px rgba(74, 168, 255, .38)
        );
}

@media (max-width: 780px) {
    .shout-metrics {
        grid-template-columns: 1fr;
    }
}

/* ===== CATALYTICS CLEAN CAT FINISH ===== */

/* ===== POSTYCAT LIVE OPERATIONS AND CREATE ===== */

.posty-nav-group {
    display: grid;
    gap: 5px;
}

.posty-nav-group .nav-link {
    position: relative;
    z-index: 1;
}

.posty-create-nav {
    width: auto;
    min-width: 0;
    min-height: 34px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: -2px 12px 2px 48px;
    padding: 0 13px;
    color: #ffc7e2;
    border: 1px solid rgba(240, 111, 174, .24);
    border-radius: 10px;
    background: rgba(240, 111, 174, .07);
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
}

.posty-create-nav:hover {
    border-color: rgba(240, 111, 174, .48);
    background: rgba(240, 111, 174, .14);
}

#postycat-view .posty-heading {
    margin-bottom: 16px;
}

#postycat-view .posty-heading h2 {
    font-size: 28px;
}

#postycat-view .posty-metrics {
    gap: 12px;
    margin-bottom: 12px;
}

#postycat-view .posty-metric {
    min-height: 132px;
    padding: 17px 18px;
}

#postycat-view .posty-metric > strong {
    min-height: 42px;
    display: flex;
    align-items: center;
    margin: 8px 0 4px;
    font-size: clamp(30px, 2.35vw, 42px);
    line-height: 1;
    letter-spacing: -.035em;
}

#postycat-view .posty-metric > small {
    font-size: 11px;
    line-height: 1.4;
}

#postycat-view .posty-dashboard-grid {
    gap: 12px;
}

.posty-growth-summary {
    display: block;
    margin-top: 6px;
    color: var(--muted);
    font-size: 10px;
}

.posty-chart {
    position: relative;
}

.posty-chart-empty {
    position: absolute;
    z-index: 3;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
    color: var(--muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .12em;
    white-space: nowrap;
}

.posty-chart-empty[hidden] {
    display: none;
}

.post-table-status,
.hashtag-status {
    padding: 28px 12px;
    color: var(--muted);
    text-align: center;
    font-size: 11px;
}

.hashtag-list > .hashtag-status {
    display: block;
}

.healthy-mini.posty-unhealthy {
    color: #ffd9dd;
    border-color: rgba(255, 80, 91, .55);
    background: rgba(174, 24, 37, .25);
}

.healthy-mini.posty-running {
    color: #fff0cb;
    border-color: rgba(242, 173, 85, .42);
    background: rgba(242, 173, 85, .10);
}

.posty-create-layer {
    position: fixed;
    z-index: 250;
    inset: 0;
}

.posty-create-layer[hidden] {
    display: none;
}

.posty-create-backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    border: 0;
    background: rgba(4, 2, 7, .72);
    backdrop-filter: blur(4px);
    cursor: pointer;
}

.posty-create-drawer {
    position: absolute;
    inset: 0 0 0 auto;
    width: min(520px, 100vw);
    display: flex;
    flex-direction: column;
    gap: 22px;
    padding: 28px;
    overflow-y: auto;
    color: var(--text);
    border-left: 1px solid rgba(240, 111, 174, .30);
    background:
        linear-gradient(
            180deg,
            rgba(25, 12, 26, .99),
            rgba(9, 6, 13, .995)
        );
    box-shadow: -25px 0 70px rgba(0, 0, 0, .55);
    animation: posty-drawer-in 180ms ease-out;
}

@keyframes posty-drawer-in {
    from {
        transform: translateX(32px);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.posty-create-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.posty-create-header h2 {
    margin: 0;
    font-size: 26px;
}

.posty-create-header p:last-child {
    margin: 8px 0 0;
    color: var(--muted);
    font-size: 13px;
}

.posty-create-close {
    width: 42px;
    height: 42px;
    flex: none;
    color: var(--text);
    border: 1px solid rgba(240, 111, 174, .26);
    border-radius: 12px;
    background: rgba(240, 111, 174, .08);
    font-size: 25px;
    cursor: pointer;
}

.posty-composer-placeholder {
    display: grid;
    gap: 10px;
}

.posty-composer-placeholder label,
.posty-connections h3 {
    font-size: 12px;
    font-weight: 850;
}

.posty-composer-placeholder textarea {
    width: 100%;
    resize: vertical;
    padding: 14px;
    color: var(--text);
    border: 1px solid rgba(240, 111, 174, .18);
    border-radius: 14px;
    background: rgba(255, 255, 255, .025);
    font: inherit;
}

.posty-composer-placeholder button,
.posty-create-actions button {
    min-height: 42px;
    padding: 0 15px;
    border: 1px solid rgba(240, 111, 174, .18);
    border-radius: 11px;
    color: var(--muted);
    background: rgba(240, 111, 174, .05);
}

.posty-connections {
    padding-top: 4px;
}

.posty-connections-heading {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
}

.posty-connections-heading h3 {
    margin: 0;
}

.posty-connections-heading span {
    color: var(--pink);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .13em;
}

.posty-platform-list {
    display: grid;
    gap: 8px;
    margin-top: 13px;
}

.posty-platform-list > div {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding: 13px;
    border: 1px solid rgba(240, 111, 174, .12);
    border-radius: 11px;
    background: rgba(255, 255, 255, .018);
}

.posty-platform-list strong {
    font-size: 12px;
}

.posty-platform-list span {
    color: var(--muted);
    text-align: right;
    font-size: 10px;
}

.posty-create-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: auto;
    padding-top: 8px;
}

.posty-create-actions button:last-child {
    color: #ffd1e7;
    border-color: rgba(240, 111, 174, .30);
    background: rgba(240, 111, 174, .11);
}

.posty-composer-open {
    overflow: hidden;
}

@media (max-width: 780px) {
    .posty-create-nav {
        margin-left: 43px;
        margin-right: 8px;
    }

    .posty-create-drawer {
        padding: 22px 18px;
    }

    .posty-platform-list > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    .posty-platform-list span {
        text-align: left;
    }
}

/* ===== POSTYCAT LIVE OPERATIONS AND CREATE ===== */

/* ===== SHOUTCAT CUSTOMER RADIO LOGIN ===== */

.shoutcat-nav-group {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.shoutcat-nav-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.shoutcat-nav-row .nav-link {
    min-width: 0;
}

.shoutcat-login-button {
    min-width: 58px;
    height: 30px;
    padding: 0 9px;
    color: #dff6ff;
    border:
        1px solid rgba(74, 168, 255, .48);
    border-radius: 9px;
    background:
        linear-gradient(
            145deg,
            rgba(74, 168, 255, .25),
            rgba(54, 119, 232, .14)
        );
    box-shadow:
        inset 0 0 14px rgba(74, 168, 255, .07);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .12em;
    cursor: pointer;
    transition: 160ms ease;
}

.shoutcat-login-button:hover:not(:disabled) {
    border-color: rgba(120, 216, 255, .75);
    background: rgba(74, 168, 255, .32);
    transform: translateY(-1px);
}

.shoutcat-login-button:disabled {
    opacity: .42;
    cursor: wait;
}

.shoutcat-radio-menu {
    margin: -1px 0 3px 43px;
    padding: 10px;
    border-left:
        1px solid rgba(74, 168, 255, .28);
    animation: view-in 160ms ease both;
}

.shoutcat-radio-menu[hidden] {
    display: none;
}

.shoutcat-radio-menu > p {
    margin: 0 0 8px 9px;
    color: var(--blue-bright);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .16em;
}

.radio-menu-link {
    width: 100%;
    display: grid;
    grid-template-columns:
        20px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 9px;
    color: #d8ebf5;
    border:
        1px solid rgba(74, 168, 255, .14);
    border-radius: 10px;
    background: rgba(74, 168, 255, .055);
    text-align: left;
    cursor: pointer;
}

.radio-menu-link:hover {
    border-color: rgba(74, 168, 255, .34);
    background: rgba(74, 168, 255, .10);
}

.radio-menu-link strong,
.radio-menu-link small {
    display: block;
    min-width: 0;
}

.radio-menu-link strong {
    overflow: hidden;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.radio-menu-link small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 8px;
}

.radio-menu-link i {
    color: var(--green);
    font-size: 7px;
    font-style: normal;
    font-weight: 900;
    letter-spacing: .09em;
}

@media (max-width: 760px) {
    .shoutcat-nav-row {
        grid-template-columns:
            minmax(0, 1fr) 62px;
    }

    .shoutcat-login-button {
        height: 34px;
    }

    .shoutcat-radio-menu {
        margin-left: 37px;
    }
}

/* ===== SHOUTCAT CUSTOMER RADIO LOGIN ===== */

/* ===== CATALYTICS CLEAN PAGE HEADINGS ===== */

.section-identity-line {
    margin: 9px 0 0;
    line-height: 1;
}

.shout-heading {
    align-items: flex-end;
}

/* ===== CATALYTICS CLEAN PAGE HEADINGS ===== */

/* ===== CATALYTICS OWNER STATUS LAMPS ===== */

/*
 * Public/customer default: every state is solid.
 * Animation is enabled only when the server supplies
 * the owner interface preference.
 */

.sidebar-footer .status-dot,
.mobile-service-footer .status-dot {
    animation: none;
}

.healthy-mini.posty-running .status-dot {
    background: var(--amber);
    box-shadow:
        0 0 0 6px rgba(242, 173, 85, .10),
        0 0 16px rgba(242, 173, 85, .64);
    animation: none !important;
}

.shoutcat-unhealthy .status-dot {
    background: #ff5964;
    box-shadow:
        0 0 0 8px rgba(255, 65, 78, .18),
        0 0 36px rgba(255, 40, 58, .98);
    animation: none;
}

.animate-status-lamps
.sidebar-footer
.status-dot,
.animate-status-lamps
.mobile-service-footer
.status-dot {
    animation:
        trackycat-soft-pulse
        2.8s
        ease-in-out
        infinite;
}

.animate-status-lamps.shoutcat-unhealthy
.status-dot {
    animation:
        trackycat-severe-alert
        .72s
        steps(1, end)
        infinite;
}

.animate-status-lamps
.healthy-mini.posty-running
.status-dot {
    animation: none;
}

@keyframes trackycat-soft-pulse {
    0%,
    100% {
        opacity: .72;
        box-shadow:
            0 0 0 5px rgba(88, 242, 155, .06),
            0 0 11px rgba(88, 242, 155, .46);
    }

    50% {
        opacity: 1;
        box-shadow:
            0 0 0 7px rgba(88, 242, 155, .12),
            0 0 24px rgba(88, 242, 155, .88);
    }
}

@keyframes trackycat-severe-alert {
    0%,
    45% {
        opacity: 1;
        box-shadow:
            0 0 0 10px rgba(255, 42, 58, .24),
            0 0 46px rgba(255, 25, 45, 1);
    }

    46%,
    100% {
        opacity: .42;
        box-shadow:
            0 0 0 5px rgba(255, 42, 58, .10),
            0 0 16px rgba(255, 25, 45, .55);
    }
}

@media (prefers-reduced-motion: reduce) {
    .animate-status-lamps
    .status-dot {
        animation: none !important;
    }
}

/* ===== CATALYTICS OWNER STATUS LAMPS ===== */

/* ===== CATALYTICS LANDSCAPE SIDE RAIL ===== */

@media (orientation: landscape)
       and (max-width: 1000px)
       and (max-height: 600px) {
    .app-shell {
        display: grid;
        grid-template-columns:
            76px minmax(0, 1fr);
    }

    .sidebar {
        position: fixed;
        z-index: 1000;
        inset: 0 auto 0 0;
        width: 76px;
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows:
            auto minmax(0, 1fr) auto;
        padding: 14px 10px;
        overflow: visible;
        border-right:
            1px solid rgba(194, 132, 255, 0.22);
        border-bottom: 0;
        background:
            rgba(10, 7, 16, 0.985);
        box-shadow:
            12px 0 30px rgba(0, 0, 0, 0.28);
        transition:
            width 180ms ease,
            box-shadow 180ms ease;
    }

    .sidebar .brand {
        display: contents;
    }

    .sidebar .brand-mark {
        grid-row: 1;
        justify-self: center;
        width: 56px;
        height: 56px;
        padding: 0;
    }

    .sidebar .brand-name {
        display: none;
    }

    .sidebar .mobile-menu-button {
        grid-row: 3;
        display: flex;
        justify-self: center;
        margin: 0;
    }

    .sidebar .sidebar-nav {
        display: none;
    }

    .sidebar .sidebar-footer {
        display: none;
    }

    .main-content {
        grid-column: 2;
        width: 100%;
        min-width: 0;
        margin-left: 0;
        padding: 20px 24px;
    }

    .sidebar.mobile-menu-open {
        width: min(310px, calc(100vw - 48px));
        grid-template-columns:
            56px minmax(0, 1fr);
        grid-template-rows:
            auto minmax(0, 1fr) auto;
        padding: 14px 16px;
        box-shadow:
            18px 0 55px rgba(0, 0, 0, 0.62);
    }

    .sidebar.mobile-menu-open .brand-mark {
        grid-column: 1;
        grid-row: 1;
    }

    .sidebar.mobile-menu-open .brand-name {
        grid-column: 2;
        grid-row: 1;
        display: flex;
        align-self: center;
    }

    .sidebar.mobile-menu-open .sidebar-nav {
        grid-column: 1 / -1;
        grid-row: 2;
        display: grid;
        min-height: 0;
        margin: 14px 0;
        padding: 12px 0;
        overflow-x: hidden;
        overflow-y: auto;
        border-top:
            1px solid rgba(194, 132, 255, 0.16);
        border-bottom:
            1px solid rgba(194, 132, 255, 0.16);
        overscroll-behavior: contain;
    }

    .sidebar.mobile-menu-open
    .mobile-menu-button {
        grid-column: 1;
        grid-row: 3;
        justify-self: center;
    }
}

/* ===== CATALYTICS LANDSCAPE SIDE RAIL ===== */

/* ===== CATALYTICS LANDSCAPE OVERVIEW GRID ===== */

@media (orientation: landscape)
       and (max-width: 1000px)
       and (max-height: 600px) {
    #overview-view .dashboard-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        align-items: start;
    }

    #overview-view .sensor-panel {
        grid-column: 1;
        grid-row: 1;
    }

    #overview-view .capacity-panel {
        grid-column: 2;
        grid-row: 1;
        margin-top: 2px;
    }

    #overview-view .history-panel {
        grid-column: 1 / -1;
        grid-row: 2;
    }
}

/* ===== CATALYTICS LANDSCAPE OVERVIEW GRID ===== */


/* =========================================================
   VisitorCat
   ========================================================= */

.visitorcat-sensor-row {
    cursor: pointer;
    transition:
        border-color 160ms ease,
        background 160ms ease,
        transform 160ms ease;
}

.visitorcat-sensor-row:hover,
.visitorcat-sensor-row:focus-visible {
    border-color:
        rgba(120, 216, 255, .38);

    background:
        rgba(120, 216, 255, .055);

    transform:
        translateY(-1px);

    outline:
        none;
}

.sensor-icon.visitorcat {
    background:
        rgba(120, 216, 255, .12);

    border-color:
        rgba(120, 216, 255, .32);
}

.visitorcat-eyebrow {
    color:
        #78d8ff;
}

.visitorcat-range-picker {
    display:
        flex;

    gap:
        7px;

    padding:
        5px;

    border:
        1px solid
        rgba(120, 216, 255, .18);

    border-radius:
        12px;

    background:
        rgba(120, 216, 255, .045);
}

.visitorcat-range {
    border:
        0;

    border-radius:
        8px;

    padding:
        9px 14px;

    color:
        var(--muted);

    background:
        transparent;

    font:
        inherit;

    font-weight:
        700;

    cursor:
        pointer;
}

.visitorcat-range:hover,
.visitorcat-range:focus-visible {
    color:
        #ffffff;

    outline:
        none;
}

.visitorcat-range.active {
    color:
        #071018;

    background:
        #78d8ff;
}

.visitorcat-metrics {
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );
}

.visitorcat-dashboard-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap:
        18px;
}

.visitorcat-history-panel,
.visitorcat-client-panel {
    grid-column:
        1 / -1;
}

.visitorcat-chart {
    position:
        relative;

    height:
        315px;

    margin-top:
        25px;

    padding:
        18px;

    overflow:
        hidden;

    border:
        1px solid
        rgba(120, 216, 255, .15);

    border-radius:
        15px;

    background-image:
        linear-gradient(
            rgba(120,216,255,.045)
            1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(54,119,232,.05)
            1px,
            transparent 1px
        );

    background-size:
        100% 58px,
        100px 100%;
}

.visitorcat-chart svg {
    width:
        100%;

    height:
        100%;

    overflow:
        visible;
}

.visitorcat-visitor-line,
.visitorcat-pageview-line {
    fill:
        none;

    vector-effect:
        non-scaling-stroke;
}

.visitorcat-visitor-line {
    stroke:
        #78d8ff;

    stroke-width:
        4;

    filter:
        drop-shadow(
            0 0 7px
            rgba(120,216,255,.35)
        );
}

.visitorcat-pageview-line {
    stroke:
        #a93bfe;

    stroke-width:
        3;
}

.visitorcat-visitor-dot,
.visitorcat-pageview-dot {
    display:
        inline-block;

    width:
        8px;

    height:
        8px;

    margin-right:
        6px;

    border-radius:
        50%;
}

.visitorcat-visitor-dot {
    background:
        #78d8ff;
}

.visitorcat-pageview-dot {
    background:
        #a93bfe;
}

.visitorcat-chart-empty {
    position:
        absolute;

    inset:
        0;

    display:
        grid;

    place-items:
        center;

    color:
        var(--muted);

    pointer-events:
        none;
}

.visitorcat-chart-empty[hidden] {
    display:
        none;
}

.visitorcat-list {
    display:
        grid;

    gap:
        9px;

    margin-top:
        18px;
}

.visitorcat-list-row {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        18px;

    padding:
        10px 12px;

    border-radius:
        10px;

    background:
        rgba(120,216,255,.045);
}

.visitorcat-list-row span {
    min-width:
        0;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    color:
        var(--muted);
}

.visitorcat-list-row strong {
    color:
        #c5efff;
}

.visitorcat-list-empty {
    padding:
        12px;

    color:
        var(--muted);
}

.visitorcat-client-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap:
        18px;

    margin-top:
        18px;
}

.visitorcat-client-grid
> div
> strong {
    display:
        block;

    color:
        #c5efff;

    font-size:
        13px;

    letter-spacing:
        .04em;

    text-transform:
        uppercase;
}


/* Fren has arrived! */

.visitorcat-toast {
    position:
        fixed;

    right:
        24px;

    bottom:
        24px;

    z-index:
        5000;

    max-width:
        min(
            360px,
            calc(100vw - 32px)
        );

    padding:
        13px 17px;

    border:
        1px solid
        rgba(0,0,0,.12);

    border-radius:
        12px;

    background:
        #bfe9ff;

    color:
        #071018;

    box-shadow:
        0 12px 32px
        rgba(0,0,0,.24);

    font-weight:
        800;

    opacity:
        0;

    transform:
        translateY(10px);

    transition:
        opacity 200ms ease,
        transform 200ms ease;

    pointer-events:
        none;
}

.visitorcat-toast.show {
    opacity:
        1;

    transform:
        translateY(0);
}

.visitorcat-toast[hidden] {
    display:
        none;
}


@media (max-width: 780px) {
    .visitorcat-metrics,
    .visitorcat-dashboard-grid,
    .visitorcat-client-grid {
        grid-template-columns:
            1fr;
    }

    .visitorcat-range-picker {
        width:
            100%;
    }

    .visitorcat-range {
        flex:
            1;

        padding-inline:
            8px;
    }

    .visitorcat-toast {
        right:
            16px;

        bottom:
            16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .visitorcat-sensor-row,
    .visitorcat-toast {
        transition:
            none;
    }
}

/* PostyCat publishing workspace uses the existing Catalytics palette. */
.posty-workspace { margin-bottom: 24px; }
.posty-workspace p { color: #aaa0b2; line-height: 1.6; }
.posty-workspace button, .posty-draft-card button { background: #29182b; color: #f4c0de; border: 1px solid #613653; border-radius: 12px; padding: 12px 18px; cursor: pointer; font: inherit; font-weight: 700; }
.posty-workspace button:disabled { opacity: .5; cursor: wait; }
.posty-workspace button:hover, .posty-draft-card button:hover { border-color: #f16ab4; }
.posty-workflow-toolbar, .posty-workflow-metrics, .posty-draft-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 20px 0; }
.posty-workflow-metrics span { background: #1b1224; border: 1px solid #3a274b; border-radius: 14px; padding: 14px 20px; }
.posty-workspace details { border-top: 1px solid #36203b; padding: 18px 0; }
.posty-workspace summary { cursor: pointer; color: #f16ab4; font-weight: 700; margin-bottom: 16px; }
.posty-workspace label, .posty-connections label { display: grid; gap: 8px; margin: 12px 0; color: #d7cdda; }
.posty-workspace input, .posty-workspace textarea, .posty-workspace select, .posty-connections input, .posty-connections select, .posty-draft-card textarea, .posty-draft-card input, .posty-draft-card select { width: 100%; box-sizing: border-box; border: 1px solid #51304a; border-radius: 12px; background: #160f1b; color: #f6eef8; padding: 13px; font: inherit; color-scheme: dark; }
.posty-draft-list { display: grid; gap: 18px; }
.posty-draft-card { border: 1px solid #422b4f; border-radius: 20px; padding: 24px; background: linear-gradient(130deg,#1d1222,#100b16); }
.posty-draft-card header { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 14px; color: #f16ab4; font-weight: 700; }
.posty-draft-card p { white-space: pre-wrap; overflow-wrap: anywhere; color: #efe6f2; }
#posty-workflow-message { margin: 16px 0; color: #f4c0de; }
.posty-draft-card small { color: #b3a4bd; }
.posty-monthly { margin: 20px 0; }

.posty-collaboration-grid { display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap:24px; }
#posty-chat-history { max-height:320px; overflow:auto; }
#posty-chat-history p { padding:14px; border-radius:14px; background:#1b1224; white-space:pre-wrap; }
#posty-chat-history strong { display:block; color:#f16ab4; margin-bottom:6px; }
#posty-chat-history span { display:block; overflow-wrap:anywhere; }
@media(max-width:800px) { .posty-collaboration-grid { grid-template-columns:1fr; } }

.posty-calendar { display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin:20px 0; }
.posty-calendar>strong { color:#f16ab4;text-align:center; }
.posty-calendar-day { min-height:95px;border:1px solid #3b2748;background:#160f1b;border-radius:12px;padding:10px;overflow:hidden; }
.posty-calendar-day small { display:block;background:#34203a;border-radius:7px;padding:5px;margin-top:6px;font-size:11px;overflow-wrap:anywhere; }
.posty-media-item { display:grid;gap:8px;margin:12px 0; }
@media(max-width:600px){ .posty-calendar {gap:3px;} .posty-calendar-day {padding:5px;min-height:70px;} .posty-calendar-day small {font-size:9px;padding:2px;} }

/* PostyCat dashboard overview */
.posty-dashboard-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:16px 0;}
.posty-dashboard-heading label {max-width:320px;min-width:180px;}
.posty-dashboard-top {display:grid;grid-template-columns:minmax(230px,1fr) minmax(0,3fr);gap:20px;margin:24px 0;}
.posty-dashboard-card {min-width:0;padding:24px;border:1px solid rgba(181,124,255,.22);border-radius:20px;background:linear-gradient(135deg,rgba(181,124,255,.07),rgba(240,111,174,.035));}
.posty-dashboard-card p {color:var(--muted);line-height:1.6;overflow-wrap:anywhere;}
.posty-account-card {text-align:center;}
.posty-profile-mark {display:grid;place-items:center;margin:18px auto;width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#7142a1,#ad416f);font-size:38px;}
.posty-profile-stats {display:flex;justify-content:space-around;gap:16px;margin:24px 0;}
.posty-profile-stats strong {display:block;font-size:28px;color:var(--text);}.posty-profile-stats span {font-size:12px;color:var(--muted);}
.posty-agenda-list {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.posty-agenda-item {padding:18px;border-radius:16px;background:rgba(0,0,0,.2);min-width:0;}.posty-agenda-item p {font-size:14px;}.posty-agenda-item small {color:#ffc7e2;}
.posty-dashboard-tools {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:24px 0;}
.posty-dashboard-tools .posty-dashboard-card {display:flex;flex-direction:column;}.posty-dashboard-tools button {margin-top:auto;}
.posty-tool-symbol {display:grid;place-items:center;min-height:90px;margin:12px 0;font-size:42px;color:#de9afb;background:rgba(0,0,0,.18);border-radius:16px;}
.posty-collaboration-grid:has(#posty-chat-section) {grid-template-columns:1fr;}
@media(max-width:1100px){.posty-dashboard-top{grid-template-columns:1fr 2fr;}.posty-agenda-list{grid-template-columns:1fr;}.posty-dashboard-tools{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:650px){.posty-dashboard-top,.posty-dashboard-tools{grid-template-columns:1fr;}.posty-dashboard-card{padding:18px;}}

/* Assistant beside the publishing workspace */
.posty-companion-toggle {position:fixed;right:24px;bottom:24px;z-index:270;padding:14px 20px;border:1px solid #b57cff;border-radius:18px;background:#24142f;color:#ffd1e7;font-weight:800;cursor:pointer;box-shadow:0 8px 32px #0006;}
.posty-companion {position:fixed;right:16px;top:24px;bottom:88px;width:350px;z-index:270;display:flex;flex-direction:column;gap:14px;padding:22px;border:1px solid rgba(181,124,255,.35);border-radius:22px;background:linear-gradient(145deg,#1a1024,#100b17);box-shadow:0 12px 48px #0008;}
.posty-companion[hidden]{display:none;}.posty-companion-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;}.posty-companion-heading h3{margin:0;}.posty-companion button{padding:10px 14px;background:#35203d;color:#ffc7e2;border:1px solid #754c80;border-radius:12px;cursor:pointer;}.posty-companion label{display:grid;gap:8px;}.posty-companion textarea{width:100%;background:#100a17;color:var(--text);border:1px solid #56345f;border-radius:12px;padding:12px;}.posty-companion #posty-chat-history{flex:1;min-height:100px;max-height:none;overflow:auto;}.posty-companion p{font-size:13px;color:var(--muted);margin:0;}.posty-companion #posty-chat-history p{padding:12px;margin-bottom:12px;}.posty-companion #posty-chat-history strong{display:block;color:#f06fae;margin-bottom:8px;}
body:not(:has(#postycat-view:not([hidden]),#settings-view:not([hidden]),#posty-analytics-view:not([hidden]),#posty-profile-view:not([hidden]),#posty-library-view:not([hidden]))):not(.posty-composer-open) .posty-companion,body:not(:has(#postycat-view:not([hidden]),#settings-view:not([hidden]),#posty-analytics-view:not([hidden]),#posty-profile-view:not([hidden]),#posty-library-view:not([hidden]))):not(.posty-composer-open) .posty-companion-toggle{display:none;}
@media(min-width:1200px){}
@media(max-width:650px){.posty-companion{top:12px;right:12px;bottom:80px;width:calc(100vw - 24px);padding:18px;}.posty-companion-toggle{right:12px;bottom:14px;}}

/* Compact overview, with the full calendar in view */
.posty-dashboard-card{padding:16px;border-radius:16px;}.posty-dashboard-top{gap:14px;margin:16px 0;}.posty-profile-mark{width:48px;height:48px;font-size:24px;margin:10px auto;}.posty-profile-stats{margin:14px 0;}.posty-profile-stats strong{font-size:23px;}.posty-agenda-item{padding:12px;}.posty-agenda-item p{font-size:13px;margin:8px 0;}.posty-dashboard-tools{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0;}.posty-dashboard-tools h3{font-size:18px;margin:6px 0;}.posty-dashboard-tools p{font-size:13px;margin:6px 0 12px;}.posty-dashboard-tools .posty-tool-symbol{display:none;}.posty-dashboard-tools .eyebrow{font-size:10px;}.posty-dashboard-tools button{padding:9px 12px;font-size:13px;}
#posty-calendar-section{margin:18px 0;padding:18px;border:1px solid rgba(181,124,255,.22);border-radius:18px;background:rgba(181,124,255,.035);}
@media(max-width:1000px){.posty-dashboard-tools{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:650px){.posty-dashboard-tools{grid-template-columns:1fr;}}
@media(max-width:650px){.posty-companion,.posty-companion-toggle{z-index:1100;}}

.posty-dashboard-title-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px;}.posty-dashboard-title-actions h2{margin:0;}
.posty-workflow-toolbar.posty-dashboard-actions{gap:6px;margin:0;}.posty-workspace .posty-dashboard-actions button{padding:6px 9px;font-size:12px;border-radius:8px;min-height:30px;}
.posty-workflow-metrics.posty-dashboard-hud{gap:6px;margin:10px 0 18px;}.posty-dashboard-hud span{padding:7px 10px;font-size:12px;border-radius:8px;}
body:not(:has(#postycat-view:not([hidden]))) .posty-dashboard-hud{display:none;}

/* Compact tool shortcuts above the calendar */
.posty-dashboard-tools{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:14px 0;}
.posty-dashboard-tools .posty-dashboard-card{padding:12px;border-radius:12px;}
.posty-dashboard-tools .posty-dashboard-card h3{font-size:14px;line-height:1.35;margin:5px 0 10px;}
.posty-dashboard-tools .posty-dashboard-card p:not(.eyebrow){display:none;}
.posty-dashboard-tools .posty-dashboard-card .eyebrow{font-size:9px;margin:0;}
.posty-workspace .posty-dashboard-tools button{font-size:11px;line-height:1.35;padding:6px 8px;border-radius:8px;}
@media(max-width:1400px){.posty-dashboard-tools{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:650px){.posty-dashboard-tools{grid-template-columns:repeat(2,minmax(0,1fr));}}

.posty-owner-form{display:grid;gap:16px;max-width:650px;}.posty-owner-form label{display:grid;gap:8px;}

.posty-avatar-upload{padding:0!important;overflow:hidden;position:relative;cursor:pointer;}.posty-avatar-image{width:100%;height:100%;object-fit:cover;border-radius:50%;}.posty-avatar-image[hidden]{display:none;}

.posty-owner-layout{display:grid;grid-template-columns:minmax(0,650px) minmax(150px,1fr);gap:32px;align-items:start;}.posty-owner-photo{text-align:center;padding:12px;}.posty-owner-photo .posty-avatar-upload{width:140px;height:140px;margin:0 auto 16px;}.posty-owner-photo p{font-size:13px;line-height:1.6;color:var(--muted);}@media(max-width:650px){.posty-owner-layout{grid-template-columns:1fr;}.posty-owner-photo{grid-row:1;}.posty-owner-photo .posty-avatar-upload{width:100px;height:100px;}}

.posty-avatar-upload{overflow:visible;border-radius:50%;}.posty-avatar-upload .posty-avatar-image{position:absolute;inset:0;}.posty-avatar-edit{position:absolute;right:-2px;bottom:-2px;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:#f3b9de;color:#29142f;border:2px solid #160d20;font-size:13px;z-index:1;}.posty-owner-photo .posty-avatar-edit{width:30px;height:30px;font-size:18px;}.posty-create-nav[hidden]{display:none;}#posty-analytics-summary{grid-template-columns:repeat(4,minmax(0,1fr));}#posty-analytics-summary strong{font-size:28px;color:#f3b9de;}@media(max-width:650px){#posty-analytics-summary{grid-template-columns:repeat(2,minmax(0,1fr));}}

.posty-avatar-edit{background:#eeeeef;color:#505058;border-color:#777780;}

.posty-nav-group .nav-link.active{color:#fff;border-color:#fff;background:linear-gradient(90deg,rgba(181,124,255,.18),rgba(181,124,255,.07));}.posty-nav-group .nav-link.active span{color:#fff;}

.posty-platform-icons{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0;}.posty-workspace .posty-platform-login{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:66px;min-height:76px;padding:8px;background:transparent;border:1px solid #493a53;border-radius:12px;color:#a49aaa;}.posty-platform-login img{width:28px;height:28px;object-fit:contain;filter:grayscale(1);opacity:.5;}.posty-platform-login small{font-size:9px;letter-spacing:.08em;}.posty-workspace .posty-platform-login.is-active{color:#fff;border-color:#a684c9;}.posty-platform-login.is-active img{filter:none;opacity:1;}.posty-social-dialog{width:min(620px,calc(100vw - 32px));max-height:calc(100vh - 40px);overflow:auto;padding:24px;border:1px solid #795493;border-radius:22px;background:#160d20;color:var(--text);}.posty-social-dialog::backdrop{background:#050309b3;backdrop-filter:blur(4px);}.posty-social-dialog label{display:grid;gap:8px;margin:16px 0;}.posty-social-dialog input{background:#100a17;color:var(--text);border:1px solid #56345f;border-radius:12px;padding:12px;}.posty-social-dialog button{padding:9px 14px;background:#35203d;color:#ffc7e2;border:1px solid #754c80;border-radius:10px;cursor:pointer;}.posty-social-dialog p,.posty-social-dialog li{font-size:14px;line-height:1.6;color:var(--muted);}.posty-social-dialog [hidden]{display:none;}

.posty-workspace .posty-avatar-upload,.posty-avatar-upload{border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;}.posty-avatar-upload:focus-visible{outline:2px solid #fff;outline-offset:5px;}#posty-dashboard-profile{max-width:180px;}

body.posty-composer-open .posty-companion-toggle,body:has(dialog[open]) .posty-companion-toggle{display:none;}#posty-tone{min-width:140px;padding:9px 12px;background:#160d20;color:var(--text);border:1px solid #56345f;border-radius:12px;}

.posty-rewrite-dialog{width:min(1000px,calc(100vw - 32px));}.posty-rewrite-comparison{display:grid;grid-template-columns:1fr 1fr;gap:18px;}.posty-rewrite-comparison textarea{width:100%;padding:14px;color:var(--text);background:#100a17;border:1px solid #56345f;border-radius:12px;}@media(max-width:650px){.posty-rewrite-comparison{grid-template-columns:1fr;}}

/* Ask Me grows with the conversation, rather than reserving an empty column. */
.posty-companion{top:auto;bottom:88px;width:310px;max-height:calc(100vh - 112px);gap:12px;padding:18px;}
.posty-companion #posty-chat-history{flex:0 1 auto;min-height:0;max-height:280px;}
.posty-companion #posty-chat-history:empty{display:none;}
.posty-companion #posty-chat-status:empty{display:none;}
@media(min-width:1200px){}
@media(max-width:650px){.posty-companion{top:auto;right:12px;bottom:80px;width:calc(100vw - 24px);max-height:calc(100dvh - 100px);}}

#posty-workspace>.posty-dashboard-heading{margin-top:0;}.posty-engine-compact{padding:5px 9px;font-size:9px;}

.posty-dashboard-heading>.posty-dashboard-title-actions{display:flex;flex:1 1 100%;width:100%;gap:14px;flex-wrap:nowrap;}.posty-dashboard-title-actions h2{flex:0 0 auto;}#posty-dashboard-profile{flex:1 1 220px;max-width:none;min-width:160px;width:auto;}.posty-dashboard-actions{flex:0 0 auto;margin-left:auto!important;}.posty-dashboard-account-filter{margin-top:4px;}.posty-social-status-icons{display:flex;align-items:center;gap:6px;flex:0 0 auto;}.posty-social-state{position:relative;display:inline-flex;align-items:center;width:28px;height:28px;}.posty-social-state img{width:23px;height:23px;object-fit:contain;}.posty-social-state-dot{position:absolute;bottom:0;right:0;width:8px;height:8px;border:2px solid #160d20;border-radius:50%;background:#44d98f;}.posty-social-state.is-offline img{filter:grayscale(1);opacity:.5;}.posty-social-state.is-offline .posty-social-state-dot{background:#999;}.posty-social-state.empty{color:#aaa;font-size:25px;}
@media(max-width:1200px){.posty-dashboard-heading>.posty-dashboard-title-actions{flex-wrap:wrap;}.posty-dashboard-title-actions h2{font-size:23px;}}
@media(max-width:650px){#posty-dashboard-profile{flex:1 1 100%;width:100%;}.posty-dashboard-actions{margin-left:0!important;flex-wrap:wrap;}}
@media(max-width:650px){.posty-dashboard-title-actions h2{flex:1 1 auto;min-width:0;}.posty-dashboard-actions{flex:1 1 100%;min-width:0;width:100%;}.posty-dashboard-heading>.posty-dashboard-title-actions{min-width:0;}}

.posty-account-label-row{display:flex;align-items:center;gap:12px;}.posty-workspace .posty-status-button{display:inline-flex;align-items:center;gap:7px;padding:4px 9px;font-size:11px;border-radius:8px;}.posty-status-lamp{width:9px;height:9px;border-radius:50%;background:#e6bb44;box-shadow:0 0 7px #e6bb4460;}.posty-status-button[data-health="green"] .posty-status-lamp{background:#44d98f;box-shadow:0 0 7px #44d98f60;}.posty-status-button[data-health="red"] .posty-status-lamp{background:#f16a7f;box-shadow:0 0 7px #f16a7f60;}

.posty-connection-status-row{display:flex;align-items:center;gap:14px;padding:16px 0;border-bottom:1px solid #493052;}.posty-connection-status-row img{width:28px;height:28px;object-fit:contain;}.posty-connection-status-row>div{flex:1;min-width:0;}.posty-connection-status-row strong,.posty-connection-status-row small{display:block;overflow-wrap:anywhere;}.posty-connection-status-row small{margin-top:4px;color:var(--muted);}.posty-connection-state{font-size:12px;}.posty-connection-state.healthy{color:#7ee7ac;}.posty-connection-state.warning{color:#e6bb44;}.posty-connection-state.unknown{color:#aaa;}

.posty-dashboard-account-filter{display:flex;align-items:center;gap:12px;width:min(100%,560px);}.posty-dashboard-account-filter label{min-width:0;max-width:none;margin:0;flex:none;}.posty-dashboard-account-filter select{flex:1;min-width:0;}.posty-dashboard-account-filter .posty-status-button{flex:none;}
/* Align profile and account selectors in the dashboard header. */
.posty-dashboard-heading>.posty-dashboard-title-actions{display:grid;grid-template-columns:100px minmax(160px,1fr) auto;gap:12px;align-items:center;}
.posty-dashboard-title-actions h2{font-size:16px;line-height:1.3;overflow-wrap:normal;}
#posty-dashboard-profile{width:100%;min-width:0;max-width:none;}
.posty-dashboard-actions{margin-left:0!important;}
.posty-dashboard-account-filter{display:grid;grid-template-columns:100px minmax(0,1fr) auto;gap:12px;width:100%;}
.posty-dashboard-account-filter label{font-size:14px;}
@media(max-width:1000px){.posty-dashboard-heading>.posty-dashboard-title-actions{grid-template-columns:100px minmax(0,1fr);}.posty-dashboard-actions{grid-column:2;justify-content:flex-end;}}
@media(max-width:650px){.posty-dashboard-title-actions h2{font-size:14px;}.posty-dashboard-actions{grid-column:1 / -1;justify-content:flex-start;}.posty-dashboard-account-filter{grid-template-columns:100px minmax(0,1fr) auto;gap:8px;}}

.posty-dashboard-title-actions h2{font-weight:400;letter-spacing:normal;line-height:1.4;overflow-wrap:normal;word-break:normal;text-shadow:none;}
#posty-profile-view .posty-workflow-toolbar{align-items:flex-end;}
#posty-profile-add{align-self:flex-end;min-height:0;padding:0 18px;}
/* Profile creation controls share a single field baseline. */
#posty-profile-view .posty-workflow-toolbar{align-items:flex-end;}
#posty-profile-view .posty-workflow-toolbar>label{margin:0;display:grid;gap:8px;}
#posty-profile-view .posty-workflow-toolbar>label input,#posty-profile-view .posty-workflow-toolbar>label select{margin:0;}
#posty-profile-add{margin:0;align-self:flex-end;}

.posty-mascot{width:64px;height:78px;object-fit:contain;flex:none;transform-origin:center bottom;animation:posty-mascot-breathe 5.5s ease-in-out infinite;}.posty-mascot-blinking{position:relative;display:inline-block;}.posty-mascot-blinking img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;}.posty-mascot-blink-frame{opacity:0;}.posty-mascot-blinking.is-blinking img:first-child{opacity:0;}.posty-mascot-blinking.is-blinking .posty-mascot-blink-frame{opacity:1;}.posty-review-mascot{width:34px;height:42px;object-fit:contain;float:right;}.posty-social-dialog .posty-companion-heading h2{flex:1;}.posty-voice-scan-results h3{text-transform:capitalize;}#posty-voice-scan-results blockquote{padding:12px;margin:12px 0;border-left:3px solid #b57cff;background:#21142c;border-radius:8px;}@keyframes posty-mascot-breathe{0%,100%{transform:translateY(0) rotate(0);}45%{transform:translateY(-2px) rotate(.7deg) scale(1.012);}}@media(prefers-reduced-motion:reduce){.posty-mascot{animation:none;}}

.posty-scan-tracker {display:flex;flex-direction:column;gap:8px;margin:12px 0;font-size:12px;color:var(--text-muted,#b8adbf)}
.posty-scan-tracker[hidden]{display:none}
.posty-scan-tracker progress{width:100%;height:8px;accent-color:#bc8cff}
#posty-voice-scan-consent button:disabled{opacity:.45;filter:grayscale(1);cursor:default}

.posty-mascot-blinking .posty-mascot-pawlick-frame,.posty-mascot-blinking .posty-mascot-tail-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity 160ms ease}
.posty-mascot-blinking.is-pawlick>img:first-child,.posty-mascot-blinking.is-tail>img:first-child{opacity:0}
.posty-mascot-blinking.is-pawlick .posty-mascot-pawlick-frame,.posty-mascot-blinking.is-tail .posty-mascot-tail-frame{opacity:1}
@media(prefers-reduced-motion:reduce){.posty-mascot-blinking .posty-mascot-pawlick-frame,.posty-mascot-blinking .posty-mascot-tail-frame{transition:none}}

.posty-mascot-rig{display:block;width:100%;height:100%;overflow:visible}
.posty-rig-tail{transform-origin:850px 1200px;animation:posty-tail-swish 6.5s ease-in-out infinite}
.posty-rig-tongue{opacity:0;transform-origin:570px 660px}
.posty-mascot-blinking.is-blinking .posty-mascot-blink-frame{opacity:1}
@keyframes posty-tail-swish{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(7deg)}}
@media(prefers-reduced-motion:reduce){.posty-rig-tail{animation:none}}

#library-documents{display:grid;gap:12px;margin-top:20px;}#library-documents progress{width:100%;accent-color:#b57cff;}#library-review{width:min(800px,calc(100vw - 32px));}#library-source{max-height:320px;overflow:auto;padding:16px;background:#160e1e;border-radius:12px;}#library-close{float:right;}
#analytics-posts,#analytics-accounts{display:grid;gap:12px;margin:16px 0;}#analytics-posts article>p{white-space:pre-wrap;}#analytics-totals strong{font-size:24px;}#analytics-comments{width:min(700px,calc(100vw - 32px));}#analytics-comments-close{float:right;}#analytics-progress{width:100%;accent-color:#b57cff;}#library-upload{gap:12px;}#library-upload label{margin:0;}

.posty-content-warning-badge{display:block;margin:10px 0;color:#f2b6d8;}#posty-content-warning-help{font-size:13px;line-height:1.5;}

.analytics-post-images{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}.analytics-image-thumb{padding:0;width:180px;height:150px;overflow:hidden;background:#100b17}.analytics-image-thumb img{width:100%;height:100%;object-fit:contain;display:block}.analytics-image-preview{max-width:90vw}.analytics-image-preview>img{display:block;max-width:100%;max-height:75vh;object-fit:contain;margin:12px auto}.posty-create-nav>span:first-child{width:12px;flex:0 0 12px;text-align:center}

/* Keep the analytics collection action aligned with its filter fields. */
#posty-analytics-view .posty-workflow-toolbar:has(#analytics-refresh){align-items:flex-end;}
#posty-analytics-view .posty-workflow-toolbar:has(#analytics-refresh)>label{margin:0;}
#analytics-channel,#analytics-days{height:52px;margin:0;}
#posty-analytics-view #analytics-refresh{height:52px;min-height:0;align-self:flex-end;margin:0;padding:0 18px;white-space:nowrap;}

.posty-workspace .posty-image-preference{display:flex;align-items:center;gap:10px}.posty-image-preference input[type="checkbox"]{width:18px;height:18px;flex:none;accent-color:#b57cff}

.analytics-profile-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:520px;margin:12px 0}.analytics-profile-stats>div{display:grid;gap:5px;padding:10px 14px;border:1px solid #422b4f;border-radius:12px;background:#160f1b}.analytics-profile-stats span{font-size:12px;color:#aaa0b2}.analytics-profile-stats strong{font-size:22px;line-height:1.2}@media(max-width:450px){.analytics-profile-stats{gap:6px}.analytics-profile-stats>div{padding:10px 8px}}

#analytics-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:16px 0}.analytics-chart svg{display:block;width:100%;height:auto}.analytics-chart svg text{fill:#aaa0b2;font-size:12px}.analytics-chart p{font-size:12px}.analytics-chart table{width:100%;font-size:12px}.analytics-bar-row{display:grid;grid-template-columns:70px 1fr 85px;align-items:center;gap:10px;margin:16px 0;font-size:12px}.analytics-bar-track{height:10px;background:#35203d;border-radius:8px;overflow:hidden}.analytics-bar-track>div{height:100%;background:linear-gradient(90deg,#b57cff,#ed70b7);border-radius:8px}@media(max-width:800px){#analytics-charts{grid-template-columns:1fr}}

#analytics-start-label[hidden],#analytics-end-label[hidden]{display:none}#analytics-start,#analytics-end{height:52px;margin:0}

#posty-analytics-view #analytics-date-button{height:52px;width:52px;padding:0;align-self:flex-end;display:grid;place-items:center;flex:none}#analytics-date-button[aria-pressed="true"]{border-color:#fff;background:#35203d}#analytics-date-summary{align-self:center;font-size:12px;color:#d7cdda}#analytics-date-summary[hidden]{display:none}

.posty-file-drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:240px;max-width:100%;min-height:220px;box-sizing:border-box;padding:20px;border:2px dashed #795493;border-radius:16px;background:#160f1b;text-align:center;cursor:pointer;margin:12px 0}.posty-file-drop>input[type="file"]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:1}.posty-file-drop>span{font-size:32px;color:#b57cff}.posty-file-drop>small{color:#aaa0b2}.posty-file-drop .posty-drop-filename{font-size:12px;margin:0;overflow-wrap:anywhere;max-width:100%}.posty-file-drop:hover,.posty-file-drop.is-dragging,.posty-file-drop:focus-within{border-color:#ed70b7;background:#29182b}.posty-file-drop:focus-within{outline:2px solid #b57cff;outline-offset:3px}

#analytics-insights{display:grid;gap:14px;margin:16px 0}.analytics-top-post{padding:14px 0;border-top:1px solid #422b4f}.analytics-top-post>small{display:block;margin-top:6px;color:#aaa0b2}.analytics-top-post>p{white-space:pre-wrap}.analytics-data-notes{font-size:12px}.analytics-profile-stats small{font-size:11px;color:#aaa0b2}.analytics-chart circle:focus{outline:none;stroke:#fff;stroke-width:3}

/* Website reporting stays within the Catalytics shell. */
.analytics-submenu { margin: 0 0 12px 32px; border-left: 1px solid var(--border); padding-left: 10px; }
.analytics-submenu[hidden] { display: none; }
.analytics-subnav { min-height: 34px; padding: 7px 12px; font-size: 13px; }
.analytics-subnav.active { color: var(--blue-bright); background: rgba(120,216,255,.08); }
.catalytics-analytics-report { display: block; width: 100%; height: 1100px; border: 0; background: transparent; opacity: 0; }
.catalytics-analytics-report.is-ready { opacity: 1; }
#visitorcat-report-status:empty { display: none; }

.postycat-submenu { display: grid; gap: 8px; }
.postycat-submenu[hidden] { display: none; }
.client-service-card { margin: 18px 0; display: grid; gap: 14px; }
.client-service-card fieldset { border: 1px solid var(--border); border-radius: 12px; padding: 18px; display: grid; gap: 10px; }
.client-service-card input[type="checkbox"] { accent-color: var(--purple); width: 18px; height: 18px; vertical-align: middle; }
.client-service-card input[type="url"] { display:block; width:100%; margin-top:8px; padding:10px; background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px; }
#redemption-client-fields[hidden], .redemption-field[hidden] { display:none; }

[data-client-hidden="true"] { display:none !important; }

/* ===== AZURACAST STATION ACTIVITY GRAPH ===== */

.activity-heading {
    align-items: flex-start;
}

.activity-status {
    display: block;
    margin-top: 7px;
    color: var(--faint);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .11em;
}

.activity-legend {
    max-width: 62%;
    flex-wrap: wrap;
    justify-content: flex-end;
    row-gap: 7px;
}

.station-activity-chart {
    height: 286px;
    position: relative;
    margin-top: 18px;
    padding: 18px 18px 30px 50px;
    overflow: hidden;
    border: 1px solid rgba(120, 216, 255, .15);
    border-radius: 15px;
    background-image:
        linear-gradient(
            rgba(120, 216, 255, .045) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(54, 119, 232, .05) 1px,
            transparent 1px
        );
    background-size: 100% 25%, 14.285% 100%;
}

.station-activity-chart svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

.station-activity-area {
    fill: rgba(74, 168, 255, .10);
}

.station-activity-line {
    fill: none;
    stroke-width: 2.5;
    vector-effect: non-scaling-stroke;
    filter:
        drop-shadow(
            0 0 5px rgba(74, 168, 255, .25)
        );
}

.station-activity-line.aggregate {
    stroke-width: 4;
}

.activity-y-labels {
    position: absolute;
    inset: 13px auto 29px 13px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: var(--faint);
    font-size: 10px;
}

.activity-x-labels {
    position: absolute;
    inset: auto 18px 10px 50px;
    display: flex;
    justify-content: space-between;
    color: var(--faint);
    font-size: 10px;
}

.station-activity-empty {
    position: absolute;
    z-index: 2;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
    display: grid;
    justify-items: center;
    gap: 8px;
    color: var(--muted);
    text-align: center;
}

.station-activity-empty[hidden] {
    display: none;
}

.station-activity-empty strong {
    font-size: 11px;
}

@media (max-width: 780px) {
    .activity-heading {
        gap: 12px;
    }

    .activity-legend {
        max-width: 100%;
        justify-content: flex-start;
    }
}

/* ===== AZURACAST STATION ACTIVITY GRAPH ===== */