/* Family Brief field desk — one visual and interaction system for members,
   organizers, newsroom staff, and account workflows. The live broadcast/wire
   is the signature; every other surface stays quieter and task-focused. */

:root {
  --desk-black: #090b0f;
  --desk-panel: #151922;
  --desk-panel-2: #202633;
  --desk-paper: #f5f5f2;
  --desk-white: #fff;
  --desk-red: var(--red);
  --desk-gold: var(--gold);
  --desk-line: #d5d5cf;
  --desk-shadow: 0 18px 44px -32px rgba(0,0,0,.72);
  --desk-top: 58px;
}

html { scroll-padding-top: calc(var(--desk-top) + 16px); }
body.family-brief-app {
  min-height: 100dvh;
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,0) 15rem),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(17,17,17,.025) 32px),
    var(--paper);
}
.skip-link {
  position: fixed; z-index: 200; top: 8px; left: 8px; transform: translateY(-150%);
  padding: 10px 14px; color: var(--ink); background: var(--gold); border: 2px solid var(--ink);
  font: 800 13px var(--font-ui); text-transform: uppercase;
}
.skip-link:focus { transform: none; }

/* Shared command rail */
.family-brief-app .topbar {
  min-height: var(--desk-top); padding: 0 12px; gap: 10px;
  background: rgba(9,11,15,.98); border-bottom: 3px solid var(--red);
  box-shadow: 0 6px 22px rgba(0,0,0,.2); backdrop-filter: blur(14px);
}
.family-brief-app .brand { flex: 0 0 auto; }
.family-brief-app .brand-mark { font-size: 23px; padding: 3px 7px 4px; }
.family-brief-app .brand-word { font-size: 21px; }
.desk-live {
  min-height: 32px; display: inline-flex; align-items: center; gap: 7px; padding: 5px 9px;
  color: #fff; border: 1px solid #3c4350; text-decoration: none;
  font: 800 11px var(--font-ui); text-transform: uppercase; letter-spacing: .08em;
}
.desk-live:visited { color: #fff; }
.desk-live:hover { color: var(--ink); background: var(--gold); border-color: var(--gold); }
.desk-live span, .member-continuity-copy i {
  width: 8px; height: 8px; display: inline-block; border-radius: 50%; background: #ff3042;
  box-shadow: 0 0 0 5px rgba(255,48,66,.12); animation: field-live-pulse 2s ease-in-out infinite;
}
@keyframes field-live-pulse { 50% { opacity: .38; } }
.family-brief-app .topnav {
  min-width: 0; display: flex; align-items: stretch; align-self: stretch; gap: 0;
  margin-left: auto; scrollbar-width: none;
}
.family-brief-app .topnav::-webkit-scrollbar { display: none; }
.family-brief-app .topnav a {
  min-height: 100%; display: inline-flex; align-items: center; padding: 0 10px;
  color: #c8ccd3; border-bottom: 4px solid transparent; font-size: 11px; letter-spacing: .045em;
}
.family-brief-app .topnav a:hover, .family-brief-app .topnav a.on {
  color: #fff; background: #171b23; border-bottom-color: var(--gold); text-decoration: none;
}
.topnav-divider { width: 1px; align-self: center; height: 26px; margin: 0 5px; background: #414753; }
.account-menu { position: relative; flex: 0 0 auto; }
.account-menu > summary {
  min-width: 46px; min-height: 42px; max-width: 160px; display: flex; align-items: center; gap: 8px;
  padding: 7px 10px; color: #fff; border: 1px solid #4a515e; cursor: pointer; list-style: none;
  font: 700 11px var(--font-ui); text-transform: uppercase;
}
.account-menu > summary::-webkit-details-marker { display: none; }
.account-menu > summary span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-menu[open] > summary { color: var(--ink); background: var(--gold); border-color: var(--gold); }
.account-menu > div {
  position: absolute; z-index: 70; top: calc(100% + 7px); right: 0; width: 220px; padding: 7px;
  background: #11151c; border: 1px solid #555d6b; box-shadow: 0 20px 50px rgba(0,0,0,.45);
}
.account-menu a, .account-menu button {
  width: 100%; min-height: 44px; display: flex; align-items: center; padding: 9px 11px;
  color: #fff; background: transparent; border: 0; text-decoration: none; cursor: pointer;
  font: 700 13px var(--font-ui); text-transform: none; text-align: left;
}
.account-menu a:visited { color: #fff; }
.account-menu a:hover, .account-menu button:hover { color: var(--ink); background: var(--gold); }
.account-menu .logout-form { margin: 0; border-top: 1px solid #3b414c; }
.public-account-links { margin-left: auto; display: flex; align-items: center; gap: 7px; }
.public-account-links a {
  min-height: 42px; display: inline-flex; align-items: center; padding: 8px 16px; color: #fff;
  border: 1px solid #555d6a; text-decoration: none; font: 800 12px var(--font-ui); text-transform: uppercase;
}
.public-account-links a:last-child { color: var(--ink); background: var(--gold); border-color: var(--gold); }

/* All non-broadcast pages share a deliberate editorial work surface. */
.family-brief-app .page:not(.war-room-page) { width: min(1180px, 100%); max-width: 1180px; padding: 30px 24px 60px; }
.family-brief-app .page:not(.war-room-page) > h1,
.family-brief-app .page:not(.war-room-page) > .login-wrap:first-child h1 {
  font-size: clamp(2.45rem, 6vw, 4.7rem); line-height: .9; letter-spacing: -.015em;
}
.family-brief-app .page:not(.war-room-page) > h1::before {
  content: "Family Brief field desk"; display: block; margin-bottom: 10px; color: var(--red);
  font: 900 10px var(--font-ui); letter-spacing: .13em; text-transform: uppercase;
}
.family-brief-app .page:not(.war-room-page) > h1 + .muted { max-width: 760px; margin: 8px 0 24px; font-size: 1rem; line-height: 1.5; }
.family-brief-app .card {
  border: 1px solid var(--desk-line); border-top: 5px solid var(--ink); padding: clamp(18px, 2.4vw, 28px);
  margin-bottom: 18px; box-shadow: var(--desk-shadow);
}
.family-brief-app .card.accent-red { border-top-color: var(--red); }
.family-brief-app .card.accent-gold { border-top-color: var(--gold); }
.family-brief-app .card.accent-blue { border-top-color: var(--navy); }
.family-brief-app .card > h2 { font-size: clamp(1.45rem, 3vw, 2rem); }
.family-brief-app .stats { gap: 12px; margin-bottom: 20px; }
.family-brief-app .stat { min-height: 100px; display: flex; flex-direction: column; justify-content: center; border-left-width: 6px; box-shadow: var(--desk-shadow); }
.family-brief-app .stat .n { font-size: clamp(30px, 4vw, 46px); }
.family-brief-app .stat .l { font-size: 11px; }
.family-brief-app .rowlist li { min-height: 64px; padding: 14px 16px; margin-bottom: 9px; box-shadow: 0 9px 24px -22px rgba(0,0,0,.8); }
.family-brief-app .rowlist li .title { font-size: 1.1rem; }
.family-brief-app input[type=text], .family-brief-app input[type=email],
.family-brief-app input[type=tel], .family-brief-app input[type=date],
.family-brief-app select, .family-brief-app textarea { min-height: 52px; border: 2px solid #8d9197; font-size: 17px; }
.family-brief-app textarea { min-height: 120px; }
.family-brief-app button.primary, .family-brief-app a.button,
.family-brief-app a.btn-link { min-height: 52px; padding: 14px 22px; font-size: 14px; }
.family-brief-app .filters { padding: 14px; background: #fff; border: 1px solid var(--desk-line); border-left: 6px solid var(--gold); }
.family-brief-app table.data th { padding: 13px 12px; }
.family-brief-app table.data td { padding: 13px 12px; }

/* The small continuity band keeps the live experience present in deep tools. */
.member-continuity {
  position: sticky; z-index: 24; top: var(--desk-top); min-height: 92px; display: grid;
  grid-template-columns: 148px minmax(220px, 1fr) auto; align-items: stretch;
  color: #fff; background: #10141b; border-bottom: 1px solid #3f4653; box-shadow: 0 12px 34px rgba(0,0,0,.24);
}
.member-continuity:not(:has(.member-continuity-video)) { grid-template-columns: minmax(220px, 1fr) auto; }
.member-continuity-video { position: relative; overflow: hidden; background: #000; }
.member-continuity-video iframe,
.member-continuity-video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; pointer-events: none; object-fit: cover; }
.member-continuity-copy { min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 12px 16px; }
.member-continuity-copy > span { display: flex; align-items: center; gap: 8px; color: var(--gold); font: 900 10px var(--font-ui); text-transform: uppercase; letter-spacing: .1em; }
.member-continuity-copy strong { overflow: hidden; margin-top: 3px; font: 800 16px var(--font-ui); text-overflow: ellipsis; white-space: nowrap; }
.member-continuity-copy small { color: #b7bec9; font: 12px var(--font-ui); }
.member-continuity-actions { display: flex; align-items: center; gap: 8px; padding: 12px 16px; }
.member-continuity-actions a {
  min-height: 46px; display: inline-flex; align-items: center; justify-content: center; padding: 10px 14px;
  color: #fff; border: 1px solid #626b79; text-decoration: none; white-space: nowrap;
  font: 800 11px var(--font-ui); text-transform: uppercase;
}
.member-continuity-actions a:first-child { color: var(--ink); background: var(--gold); border-color: var(--gold); }
.member-continuity-actions a:visited { color: #fff; }
.member-continuity-actions a:first-child:visited { color: var(--ink); }

/* Authentication is a large, calm invitation rather than a small utility card. */
.login-wrap { width: min(1060px, 100%); margin: 3vh auto 0; display: grid; grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr); gap: 0; }
.login-wrap .brandline {
  min-height: 520px; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(26px, 5vw, 58px);
  color: #fff; background:
    linear-gradient(180deg, rgba(6,8,12,.22), rgba(6,8,12,.94)),
    radial-gradient(circle at 72% 18%, rgba(252,204,0,.25), transparent 28%), #11151c;
  border-bottom: 8px solid var(--red);
}
.login-wrap .brandline::before { content: "LIVE · FAMILY BRIEF"; color: var(--gold); font: 900 11px var(--font-ui); letter-spacing: .12em; }
.auth-live-reel { width: min(100%, 440px); margin: 16px 0 24px; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid #59606c; box-shadow: 0 20px 54px rgba(0,0,0,.5); background: #000; }
.auth-live-reel iframe,
.auth-live-reel video { width: 100%; height: 100%; display: block; border: 0; pointer-events: none; object-fit: cover; }
.login-wrap .brandline h1 { margin: 10px 0 14px; color: #fff; font-size: clamp(3.4rem, 8vw, 6rem) !important; }
.login-wrap .brandline .muted { color: #e0e2e6; font-size: 1.15rem; line-height: 1.55; }
.login-wrap > .card { min-height: 520px; display: flex; flex-direction: column; justify-content: center; margin: 0; padding: clamp(28px, 5vw, 58px); border-top-width: 8px; box-shadow: none; }
.login-wrap > .card h2 { font-size: clamp(2rem, 4vw, 3rem); }
.returning-member { margin-top: 30px; padding-top: 26px; border-top: 2px solid var(--ink); }
.returning-member .returning-signin { width: 100%; display: flex; justify-content: center; background: var(--ink); color: #fff; }

/* Staff work pages are dense where comparison is useful, never cramped. */
.has-staff-access.endpoint-org-home .page:not(.war-room-page) { max-width: 1320px; }
.has-staff-access .card + .card { margin-top: 20px; }
.has-staff-access .data { box-shadow: var(--desk-shadow); }
.has-staff-access .pill { border-radius: 999px; }
.organizer-workflow {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 20px;
}
.organizer-workflow a {
  min-height: 98px; display: flex; flex-direction: column; justify-content: center; padding: 15px 17px;
  color: #fff; background: #151a22; border: 1px solid #353c48; border-left: 5px solid var(--gold); text-decoration: none;
}
.organizer-workflow a:visited { color: #fff; }
.organizer-workflow a:hover { color: var(--ink); background: var(--gold); border-color: var(--gold); }
.organizer-workflow span { color: var(--gold); font: 900 10px var(--font-ui); text-transform: uppercase; letter-spacing: .1em; }
.organizer-workflow a:hover span { color: var(--red); }
.organizer-workflow strong { margin-top: 5px; font: 800 15px/1.25 var(--font-ui); }

/* Route-specific political hierarchy. */
.endpoint-org-tips .tip-card { display: grid; gap: 6px; }
.endpoint-org-room .page:not(.war-room-page) { max-width: 920px; }
.endpoint-org-room .card:not(.accent-blue) { border-left: 6px solid var(--ink); }
.endpoint-org-electeds .rowlist, .endpoint-org-games .page > .game-card { max-width: 900px; }
.endpoint-org-official-portal .portal-hero { padding: 26px; box-shadow: var(--desk-shadow); }
.endpoint-org-newsroom .page:not(.war-room-page) { max-width: 1260px; }
.endpoint-org-newsroom .page > .card { scroll-margin-top: 170px; }
.endpoint-org-trophy-case .trophy-room { max-width: 1180px; }
.newsroom-workflow {
  display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 0 22px; border: 1px solid var(--ink); background: #fff;
}
.newsroom-workflow a {
  min-height: 86px; display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 12px;
  padding: 12px 16px; color: var(--ink); border-right: 1px solid var(--ink); text-decoration: none;
}
.newsroom-workflow a:last-child { border-right: 0; }
.newsroom-workflow a:visited { color: var(--ink); }
.newsroom-workflow a:hover { color: #fff; background: var(--red); }
.newsroom-workflow b { font: 2rem var(--font-punch); color: var(--red); }
.newsroom-workflow a:hover b { color: var(--gold); }
.newsroom-workflow span { font: 800 13px/1.25 var(--font-ui); text-transform: uppercase; }

/* A fast, in-context path from the live desk to the newsroom. */
.news-report-dialog {
  width: min(680px, calc(100vw - 28px)); max-height: min(820px, calc(100dvh - 28px));
  margin: auto; padding: 0; color: var(--ink); background: #fff; border: 3px solid var(--ink);
  box-shadow: 0 34px 100px rgba(0,0,0,.62);
}
.news-report-dialog:not([open]) { display: none; }
.news-report-dialog::backdrop { background: rgba(5,7,11,.78); backdrop-filter: blur(8px); }
.news-report-dialog > header {
  position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 17px 20px; color: #fff; background: #11151c; border-bottom: 5px solid var(--red);
}
.news-report-dialog > header h2 { margin: 3px 0 0; color: #fff; font-size: 2rem; }
.news-report-dialog > header button {
  min-height: 46px; padding: 9px 14px; color: #fff; background: transparent; border: 1px solid #747c89;
  cursor: pointer; font: 800 12px var(--font-ui); text-transform: uppercase;
}
.news-report-dialog > header button:hover { color: var(--ink); background: var(--gold); border-color: var(--gold); }
.news-report-dialog form { padding: 20px; overflow-y: auto; }
.news-report-dialog form > p:first-of-type { margin: 0 0 14px; font-size: 1rem; line-height: 1.5; }
.news-report-dialog label span { color: var(--muted); font-weight: 500; text-transform: none; }
.news-report-actions { display: flex; align-items: center; gap: 14px; margin-top: 16px; }
.news-report-actions .primary { margin: 0; }
.news-report-actions a { font: 700 13px var(--font-ui); }
.news-report-status { min-height: 24px; margin: 13px 0 0; font: 700 14px var(--font-ui); }
.news-report-status.is-ok { color: var(--ok); }
.news-report-status.is-error { color: var(--red); }
.news-report-dialog button:disabled { cursor: wait; opacity: .65; }

/* Mobile keeps the broadcast dominant and the tools obvious. */
@media (max-width: 1050px) {
  .family-brief-app .topnav { display: none; }
  .desk-live { margin-left: auto; }
  .family-brief-app .account-menu { margin-left: 0; }
  .member-continuity { grid-template-columns: 122px 1fr auto; }
  .member-continuity-copy small { display: none; }
  .member-continuity-actions a:last-child { display: none; }
}
@media (max-width: 700px) {
  :root { --desk-top: 54px; }
  .family-brief-app .topbar { min-height: 54px; padding: 0 7px; gap: 6px; }
  .family-brief-app .brand-mark { font-size: 20px; }
  .family-brief-app .brand-word { font-size: 18px; }
  .desk-live { min-width: 42px; justify-content: center; padding: 5px 8px; font-size: 0; }
  .desk-live span { margin: 0; }
  .account-menu > summary { width: 42px; min-width: 42px; padding: 7px; justify-content: center; }
  .account-menu > summary span { display: none; }
  .public-account-links a { padding: 7px 10px; font-size: 10px; }
  .family-brief-app .page:not(.war-room-page) { padding: 22px 12px 94px; }
  .family-brief-app .page:not(.war-room-page) > h1 { font-size: 2.7rem; }
  .family-brief-app .card { padding: 17px 14px; }
  .family-brief-app .stats { grid-template-columns: 1fr 1fr; }
  .family-brief-app .stat { min-height: 86px; }
  .member-continuity { min-height: 72px; grid-template-columns: 104px 1fr auto; }
  .member-continuity:not(:has(.member-continuity-video)) { grid-template-columns: minmax(0, 1fr) auto; }
  .member-continuity-copy { padding: 8px 10px; }
  .member-continuity-copy strong { font-size: 13px; white-space: normal; line-height: 1.15; }
  .member-continuity-actions { padding: 8px; }
  .member-continuity-actions a { min-height: 46px; padding: 8px 10px; font-size: 10px; }
  .login-wrap { display: block; margin: 0; }
  .login-wrap .brandline { min-height: 250px; padding: 28px 20px; }
  .auth-live-reel { margin: 12px 0 18px; }
  .login-wrap .brandline h1 { font-size: 3.7rem !important; }
  .login-wrap .brandline .muted { font-size: 1rem; }
  .login-wrap > .card { min-height: 0; padding: 28px 20px; }
  .family-brief-app .filters { display: grid; grid-template-columns: 1fr; }
  .family-brief-app .filters input, .family-brief-app .filters select { width: 100%; }
  .organizer-workflow { grid-template-columns: 1fr 1fr; }
  .newsroom-workflow { grid-template-columns: 1fr; }
  .newsroom-workflow a { min-height: 66px; border-right: 0; border-bottom: 1px solid var(--ink); }
  .newsroom-workflow a:last-child { border-bottom: 0; }
  .news-report-dialog { width: 100vw; max-height: 100dvh; height: 100dvh; border: 0; }
  .news-report-dialog > header { padding: 13px 12px; }
  .news-report-dialog > header h2 { font-size: 1.55rem; }
  .news-report-dialog form { padding: 15px 12px; }
  .news-report-actions { align-items: stretch; flex-direction: column; }
  .news-report-actions > * { width: 100%; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .desk-live span, .member-continuity-copy i { animation: none; }
}
