:root {
  --ink: #0a1015;
  --ink-soft: #111b23;
  --panel: #15222d;
  --line: rgba(222, 237, 242, 0.16);
  --text: #f4f8f8;
  --muted: #9fb0b9;
  --teal: #2fe3ce;
  --teal-deep: #0c7d74;
  --gold: #edc86a;
  --radius: 18px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background: var(--ink);
}

* { box-sizing: border-box; }
html { background: var(--ink); }
body { margin: 0; min-width: 280px; background: radial-gradient(circle at 100% 0%, rgba(47, 227, 206, 0.13), transparent 32rem), var(--ink); }
.monitor { width: 100%; max-width: 760px; margin: 0 auto; padding: 20px; overflow: hidden; }
.masthead { padding: 4px 2px 22px; border-bottom: 1px solid var(--line); }
.eyebrow { margin: 0 0 7px; color: var(--teal); font-size: 0.66rem; font-weight: 800; letter-spacing: 0.14em; line-height: 1.3; }
.wordmark { color: var(--text); font-size: clamp(0.85rem, 2.9vw, 1.02rem); font-weight: 900; letter-spacing: 0.035em; }
.wordmark span { color: var(--teal); padding: 0 0.2rem; }
.page-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.page-nav a { padding: 7px 9px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 0.62rem; font-weight: 850; letter-spacing: 0.07em; line-height: 1; text-decoration: none; text-transform: uppercase; transition: border-color .2s ease, color .2s ease, background .2s ease; }
.page-nav a:hover, .page-nav a:focus-visible, .page-nav a.active { border-color: rgba(47, 227, 206, 0.6); color: var(--teal); background: rgba(47, 227, 206, 0.08); outline: none; }
.site-home { width: 100%; max-width: 1080px; margin: 0 auto; padding: 20px; overflow: hidden; }.site-masthead { padding-bottom: 22px; }.home-hero, .page-hero { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(250px, .85fr); gap: 24px; align-items: end; margin-top: 18px; padding: clamp(24px, 5vw, 46px); border: 1px solid rgba(47, 227, 206, .42); border-radius: var(--radius); background: linear-gradient(135deg, rgba(47, 227, 206, .13), transparent 55%), var(--ink-soft); }.home-hero h1, .page-hero h1 { margin: 8px 0 0; font-size: clamp(3.1rem, 10vw, 7rem); line-height: .78; letter-spacing: -.08em; }.home-hero h1 span, .page-hero h1 span { color: var(--teal); }.hero-copy, .page-hero > p { color: var(--muted); font-size: .93rem; line-height: 1.55; }.hero-copy p, .page-hero > p { max-width: 420px; margin: 0; }.hero-actions { display: grid; gap: 9px; margin-top: 22px; }.outline-link { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; color: var(--text); font-size: .78rem; font-weight: 850; text-decoration: none; transition: transform .2s ease, background .2s ease, border-color .2s ease; }.outline-link:hover, .outline-link:focus-visible { transform: translateY(-2px); border-color: rgba(47, 227, 206, .55); background: rgba(47, 227, 206, .08); outline: none; }.home-hero .watch-link { margin-top: 0; }.portal-section, .catalog-section { padding: 30px 0 0; }.portal-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }.portal-card { min-height: 250px; padding: 22px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255, 255, 255, .035); }.portal-card.featured-card { background: linear-gradient(150deg, rgba(47, 227, 206, .08), transparent 45%), rgba(255, 255, 255, .035); }.portal-card h2 { margin: 0; font-size: clamp(1.5rem, 4vw, 2.1rem); letter-spacing: -.05em; }.portal-card > p:last-of-type { margin: 12px 0 0; color: var(--muted); font-size: .82rem; line-height: 1.5; }.portal-actions { display: grid; gap: 10px; margin-top: 22px; }.text-link { color: var(--teal); font-size: .7rem; font-weight: 800; text-decoration: none; }.text-link:hover, .text-link:focus-visible { color: #71f0df; outline: none; }.release-spotlight, .video-bridge { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(220px, .8fr); gap: 24px; align-items: center; margin-top: 30px; padding: clamp(22px, 4vw, 36px); border-left: 3px solid var(--gold); background: linear-gradient(120deg, rgba(237, 200, 106, .11), transparent 55%), var(--panel); }.release-spotlight h2, .video-bridge h2 { margin: 0; font-size: clamp(2rem, 6vw, 4rem); line-height: .82; letter-spacing: -.07em; }.release-spotlight h2 span { color: var(--gold); }.release-copy, .video-bridge p { max-width: 550px; margin: 14px 0 0; color: var(--muted); font-size: .84rem; line-height: 1.5; }.spotlight-actions { display: grid; gap: 9px; }.spotlight-actions .watch-link { margin-top: 0; }.note-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }.note-grid article { min-height: 124px; padding: 15px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, .035); }.note-grid strong { display: block; color: var(--text); font-size: .85rem; line-height: 1.1; }.note-grid span { display: block; margin-top: 9px; color: var(--muted); font-size: .68rem; line-height: 1.35; }
.campaign-home-hero { display: grid; grid-template-columns: minmax(260px, .72fr) minmax(300px, 1.28fr); overflow: hidden; margin-top: 18px; border: 1px solid rgba(47, 227, 206, .55); border-radius: var(--radius); background: linear-gradient(135deg, rgba(47, 227, 206, .13), transparent 65%), var(--ink-soft); }.campaign-cover { position: relative; margin: 0; min-height: 100%; background: #05090d; }.campaign-cover img { display: block; width: 100%; height: 100%; min-height: 475px; object-fit: cover; object-position: center; }.campaign-cover figcaption { position: absolute; right: 12px; bottom: 12px; padding: 7px 9px; color: var(--text); background: rgba(5, 9, 13, .78); border: 1px solid rgba(244, 248, 248, .22); border-radius: 999px; font-size: .58rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }.campaign-home-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(24px, 5vw, 54px); }.campaign-home-copy h1 { margin: 8px 0 0; font-size: clamp(3.35rem, 9vw, 7.3rem); line-height: .78; letter-spacing: -.09em; }.campaign-home-copy h1 span { color: var(--teal); }.campaign-tagline { max-width: 480px; margin: 21px 0 0; color: var(--muted); font-size: .94rem; line-height: 1.55; }.campaign-stamp { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; margin-top: 23px; color: var(--muted); font-size: .67rem; font-weight: 800; letter-spacing: .05em; }.campaign-stamp span:first-child { padding: 6px 8px; color: var(--ink); background: var(--teal); border-radius: 999px; font-size: .61rem; letter-spacing: .12em; }
.page-hero { display: block; }.page-hero h1 { margin-bottom: 16px; }.page-hero > p { max-width: 620px; }.page-hero .watch-link { width: fit-content; margin-top: 24px; min-width: min(100%, 280px); }.video-hero { border-color: rgba(237, 200, 106, .45); background: linear-gradient(135deg, rgba(237, 200, 106, .10), transparent 55%), var(--ink-soft); }.track-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }.track-list li { border-bottom: 1px solid var(--line); }.track-list a { display: grid; grid-template-columns: 42px minmax(0, 1fr) 135px 20px; gap: 12px; align-items: center; padding: 14px 4px; color: var(--text); text-decoration: none; transition: padding .2s ease, color .2s ease, background .2s ease; }.track-list a:hover, .track-list a:focus-visible { padding-left: 12px; color: var(--teal); background: rgba(47, 227, 206, .06); outline: none; }.track-list span { color: var(--teal); font-size: .68rem; font-weight: 900; }.track-list strong { font-size: .9rem; letter-spacing: .02em; }.track-list em { color: var(--muted); font-size: .7rem; font-style: normal; }.track-list b { color: var(--teal); font-size: .85rem; }.video-bridge { border-left-color: var(--gold); }
.release-card { position: relative; margin-top: 18px; padding: 22px; border: 1px solid rgba(47, 227, 206, 0.42); border-radius: var(--radius); background: linear-gradient(135deg, rgba(47, 227, 206, 0.1), transparent 48%), var(--ink-soft); box-shadow: 0 20px 45px rgba(0, 0, 0, 0.2); }
.release-topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.status-chip, .restriction { display: inline-flex; align-items: center; width: fit-content; border-radius: 999px; font-size: 0.64rem; font-weight: 900; letter-spacing: 0.1em; padding: 7px 9px; }
.status-chip { color: var(--ink); background: var(--teal); }
.status-dot { width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: var(--ink); animation: glow 2.1s ease-in-out infinite; }
.restriction { color: var(--gold); border: 1px solid rgba(237, 200, 106, 0.48); background: rgba(237, 200, 106, 0.08); }
h1, h2, p { margin-top: 0; }
h1 { margin: 28px 0 0; font-size: clamp(2.7rem, 14vw, 5.1rem); line-height: 0.82; letter-spacing: -0.065em; font-weight: 950; }
.artist { margin: 12px 0 0; color: var(--teal); font-size: 0.9rem; font-weight: 850; letter-spacing: 0.16em; }
.audio-rule { display: flex; align-items: center; gap: 5px; height: 37px; margin: 20px 0; }
.audio-rule span { display: block; width: 4px; border-radius: 4px; background: var(--teal); opacity: 0.85; }
.audio-rule span:nth-child(1) { height: 9px; }.audio-rule span:nth-child(2) { height: 21px; }.audio-rule span:nth-child(3) { height: 31px; }.audio-rule span:nth-child(4) { height: 14px; }.audio-rule span:nth-child(5) { height: 25px; }.audio-rule span:nth-child(6) { height: 17px; }.audio-rule span:nth-child(7) { height: 8px; }
.release-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; }
.release-meta div { padding-top: 12px; border-top: 1px solid var(--line); }
dt { color: var(--muted); font-size: 0.62rem; letter-spacing: 0.08em; text-transform: uppercase; }
dd { margin: 5px 0 0; color: var(--text); font-size: 0.78rem; font-weight: 650; line-height: 1.35; }
.watch-link { display: flex; justify-content: space-between; gap: 12px; margin-top: 22px; padding: 13px 15px; color: var(--ink); background: var(--teal); border-radius: 10px; font-size: 0.82rem; font-weight: 900; text-decoration: none; transition: transform .2s ease, background .2s ease; }
.watch-link:hover, .watch-link:focus-visible { transform: translateY(-2px); background: #71f0df; outline: none; }
.panel-section { padding: 28px 0 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.section-heading h2, .campaign h2 { margin: 0; font-size: 1.28rem; line-height: 1; letter-spacing: -0.035em; }
.metrics-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.metric-card { min-height: 116px; padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, 0.035); }
.metric-card p { min-height: 31px; margin-bottom: 14px; color: var(--muted); font-size: 0.7rem; font-weight: 750; line-height: 1.2; }
.metric-card strong { display: block; color: var(--text); font-size: 0.88rem; line-height: 1; }
.metric-card span { display: block; margin-top: 6px; color: #71828c; font-size: 0.64rem; line-height: 1.15; }
.campaign { display: flex; justify-content: space-between; gap: 20px; margin-top: 28px; padding: 18px; border-left: 3px solid var(--teal); background: var(--panel); }
.campaign .eyebrow { margin-bottom: 6px; }.campaign-status { margin: 2px 0 0; max-width: 260px; color: var(--text); font-size: 0.78rem; font-weight: 750; line-height: 1.45; text-align: right; }.campaign-status span { color: var(--muted); font-weight: 500; }
.owner-note { display: flex; gap: 10px; margin-top: 22px; padding: 14px; border-radius: 12px; color: var(--muted); background: rgba(255, 255, 255, 0.04); font-size: 0.72rem; line-height: 1.5; }
.owner-note > span { flex: 0 0 18px; display: grid; width: 18px; height: 18px; place-items: center; border: 1px solid var(--teal); border-radius: 50%; color: var(--teal); font-size: 0.65rem; font-weight: 900; }.owner-note p { margin: 0; }.owner-note strong { color: var(--text); }.owner-note em { color: var(--teal); font-style: normal; }
.meter-hero { margin-top: 18px; padding: 24px 22px; border: 1px solid rgba(47, 227, 206, 0.42); border-radius: var(--radius); background: linear-gradient(135deg, rgba(47, 227, 206, 0.1), transparent 48%), var(--ink-soft); }
.meter-hero h1 { margin: 8px 0 12px; font-size: clamp(2.5rem, 12vw, 4.6rem); line-height: 0.84; letter-spacing: -0.065em; }.meter-hero h1 span { color: var(--teal); }
.meter-hero > p:last-child { max-width: 560px; margin: 0; color: var(--muted); font-size: 0.88rem; line-height: 1.5; }
.counter-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-top: 14px; }.counter-card { min-height: 144px; padding: 15px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255, 255, 255, 0.035); }.counter-card.highlight { border-color: rgba(47, 227, 206, 0.6); background: linear-gradient(145deg, rgba(47, 227, 206, 0.13), rgba(255, 255, 255, 0.035)); }.counter-card.pending { border-color: rgba(237, 200, 106, 0.38); }.counter-card p { min-height: 30px; margin-bottom: 14px; color: var(--muted); font-size: 0.67rem; font-weight: 800; line-height: 1.2; }.counter-card strong { display: block; color: var(--text); font-size: clamp(1.18rem, 3vw, 1.6rem); line-height: 0.95; letter-spacing: -0.04em; }.counter-card.highlight strong { color: var(--teal); }.counter-card.pending strong { color: var(--gold); }.counter-card span { display: block; margin-top: 8px; color: #71828c; font-size: 0.61rem; line-height: 1.25; }
.counter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }.counter-item { min-height: 126px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, 0.035); }.counter-item p { min-height: 31px; margin-bottom: 13px; color: var(--muted); font-size: 0.7rem; font-weight: 750; line-height: 1.2; }.counter-item strong { display: block; color: var(--text); font-size: 1.45rem; line-height: 0.9; letter-spacing: -0.04em; }.counter-item span { display: block; margin-top: 8px; color: var(--gold); font-size: 0.62rem; line-height: 1.2; }.counter-explainer { margin: 11px 0 0; color: var(--muted); font-size: 0.72rem; line-height: 1.48; }.counter-explainer strong { color: var(--text); }
.counter-status { display: grid; grid-template-columns: 1fr 1.15fr; gap: 18px; margin-top: 28px; padding: 18px; border-left: 3px solid var(--teal); background: var(--panel); }.counter-status h2 { margin: 0; font-size: 1.2rem; line-height: 1.05; letter-spacing: -0.035em; }.counter-status ul { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }.counter-status li { display: flex; align-items: flex-start; gap: 8px; color: var(--muted); font-size: 0.75rem; line-height: 1.4; }.counter-status li strong { color: var(--text); }.state-dot { flex: 0 0 7px; width: 7px; height: 7px; margin-top: 3px; border-radius: 50%; background: var(--teal); }.state-dot.warn { background: var(--gold); }.state-dot.muted { background: #7b8e98; }
.counter-sources { margin-top: 28px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255, 255, 255, 0.025); }.counter-sources h2 { margin: 0; font-size: 1.16rem; letter-spacing: -0.03em; }.source-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 15px; }.source-actions .source-link { margin-top: 0; }
.truth-strip { display: grid; grid-template-columns: 1.15fr .85fr; gap: 16px; margin-top: 14px; padding: 16px; border-left: 3px solid var(--gold); background: rgba(237, 200, 106, 0.08); }.truth-strip h2 { margin: 0; font-size: 1.15rem; letter-spacing: -0.03em; }.truth-strip p { margin: 2px 0 0; color: var(--muted); font-size: 0.76rem; line-height: 1.48; text-align: right; }.truth-strip strong { color: var(--text); }
.source-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }.source-card { position: relative; min-height: 196px; padding: 17px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255, 255, 255, 0.035); }.source-card .eyebrow { margin-bottom: 10px; }.source-card h2 { margin: 0; font-size: 1.2rem; letter-spacing: -0.035em; }.source-card p { margin: 10px 0 16px; color: var(--muted); font-size: 0.76rem; line-height: 1.45; }.source-card p strong { color: var(--text); }.source-status { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; color: var(--teal); font-size: 0.64rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }.source-status::before { content: ''; display: block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }.source-status.warn { color: var(--gold); }.source-status.muted { color: #7b8e98; }
.source-link { display: flex; justify-content: space-between; align-items: center; gap: 10px; width: 100%; margin-top: 14px; padding: 10px 11px; border: 1px solid rgba(47, 227, 206, 0.32); border-radius: 8px; color: var(--teal); font-size: 0.7rem; font-weight: 850; text-decoration: none; transition: transform .2s ease, background .2s ease; }.source-link:hover, .source-link:focus-visible { transform: translateY(-2px); background: rgba(47, 227, 206, 0.08); outline: none; }
.meter-steps { margin-top: 28px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); }.meter-steps h2 { margin: 0 0 12px; font-size: 1.15rem; letter-spacing: -0.03em; }.meter-steps ol { margin: 0; padding-left: 19px; color: var(--muted); font-size: 0.78rem; line-height: 1.6; }.meter-steps li + li { margin-top: 6px; }.meter-steps strong { color: var(--text); }
footer { display: flex; justify-content: space-between; gap: 16px; margin-top: 20px; padding: 0 2px; color: #68808b; font-size: 0.55rem; font-weight: 800; letter-spacing: 0.09em; line-height: 1.45; }
@keyframes glow { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.55; transform: scale(0.7); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; } }
@media (max-width: 700px) { .home-hero, .release-spotlight, .video-bridge, .campaign-home-hero { display: block; }.campaign-cover img { min-height: 0; height: auto; aspect-ratio: 213 / 256; object-fit: cover; }.campaign-home-copy { padding: 26px 20px 28px; }.hero-copy, .release-spotlight .spotlight-actions, .video-bridge .spotlight-actions { margin-top: 22px; }.portal-grid { grid-template-columns: 1fr; }.note-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .monitor, .site-home { padding: 14px; }.release-card, .meter-hero, .home-hero, .page-hero { padding: 18px; }.release-meta, .metrics-grid, .counter-summary, .counter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.source-grid { grid-template-columns: 1fr; }.campaign, .truth-strip, .counter-status { display: block; }.campaign-status, .truth-strip p { max-width: none; margin-top: 14px; text-align: left; }.counter-status ul { margin-top: 15px; }.source-actions { grid-template-columns: 1fr; }.track-list a { grid-template-columns: 30px minmax(0, 1fr) 17px; gap: 8px; }.track-list em { grid-column: 2; }.note-grid { grid-template-columns: 1fr; } footer { display: block; } footer span { display: block; margin-bottom: 5px; } }
@media (max-width: 340px) { .release-meta, .counter-summary, .counter-grid { grid-template-columns: 1fr; }.release-meta div { padding-top: 9px; }.metric-card { min-height: 105px; padding: 10px; } }