:root{color-scheme:dark;--bg:#03080e;--panel:#07111b;--panel2:#091522;--line:#1b2b3c;--text:#edf5ff;--muted:#8ba0b7;--cyan:#45c8f5;--green:#55d88a;--amber:#d7b85d;--red:#ef7c8b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;font-size:15px}.wrap{width:min(1500px,calc(100% - 40px));margin:auto}a{color:var(--cyan)}.site-header{border-bottom:1px solid var(--line);background:#050c14}.header-inner{height:64px;display:flex;align-items:center;justify-content:space-between}.wordmark{display:inline-flex;align-items:center;text-decoration:none}.brand-logo{display:block;width:166px;max-width:42vw;height:auto}nav{display:flex;gap:30px}nav a{color:#c1cfdd;text-decoration:none}nav a:hover{color:var(--cyan)}.page{padding:28px 0 40px}.page-head{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(360px,.95fr);gap:24px;align-items:end;margin-bottom:22px}.page-head h1,.prose h1{font-size:32px;margin:0 0 6px}.page-head p{margin:0;color:var(--muted)}.global-search{display:flex;width:100%;min-width:0}.global-search input,.filters input,.filters select{background:#07111b;border:1px solid var(--line);color:var(--text);padding:11px 12px}.global-search input{flex:1;border-radius:6px 0 0 6px}.global-search button,.filters button{border:1px solid #2a6078;background:#0a1d29;color:var(--cyan);font-weight:800;padding:0 16px;border-radius:0 6px 6px 0}.home-layout{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(360px,.95fr);gap:24px;align-items:start}.room-list-panel,.room-detail-panel,.table-wrap,.detail-card{border:1px solid var(--line);background:var(--panel);border-radius:7px;overflow:hidden}.list-head,.room-row{display:grid;grid-template-columns:minmax(150px,1.35fr) minmax(78px,.62fr) minmax(92px,.82fr) minmax(80px,.72fr) minmax(110px,.9fr) minmax(72px,.58fr) minmax(76px,.62fr);gap:14px;align-items:center}.list-head{padding:12px 16px;color:var(--muted);font-size:12px;border-bottom:1px solid var(--line)}.room-row{padding:15px 16px;text-decoration:none;color:var(--text);border-bottom:1px solid var(--line);position:relative}.room-row:last-child{border-bottom:0}.room-row:hover,.room-row.selected{background:#0c1b29}.room-row.selected:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--cyan)}.room-row>span{color:#b7c5d5;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.activity-text.live{color:var(--green)}.status-dot{color:var(--muted);text-transform:capitalize}.status-dot:before{content:"● ";font-size:12px}.status-dot.online{color:var(--green)}.status-dot.degraded{color:var(--amber)}.status-dot.offline{color:var(--red)}.room-detail-panel{padding:28px}.detail-heading{display:flex;justify-content:space-between;gap:20px}.detail-heading h2{font-size:30px;margin:0 0 6px}.detail-heading p{margin:0;color:var(--muted)}.online-mark{color:var(--green);white-space:nowrap}.talking-panel{margin:24px 0;padding:18px 20px;border:1px solid var(--line);border-left:4px solid #52677e;border-radius:6px}.talking-panel.live{border-left-color:var(--green)}.talking-panel strong,.talking-panel span{display:block}.talking-panel strong{font-size:18px;margin-bottom:6px}.talking-panel span{color:#c4d0dc}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:8px 0 22px}.metric-grid div{padding:18px 14px;border-right:1px solid var(--line)}.metric-grid div:nth-child(3n){border-right:0}.metric-grid span{display:block;color:var(--muted);font-size:12px;margin-bottom:7px}.metric-grid strong{font-size:16px}.detail-link{text-decoration:none}.community-footer{border-top:1px solid var(--line);padding:18px 0;color:var(--muted);text-align:center}.filters{display:grid;grid-template-columns:minmax(280px,1fr) repeat(4,minmax(130px,auto)) auto auto;gap:8px;margin:18px 0}.filters input,.filters select,.filters button{border-radius:6px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:13px 15px;border-bottom:1px solid var(--line);text-align:left}th{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.05em}.status{font-size:12px;text-transform:capitalize}.status.online{color:var(--green)}.status.degraded{color:var(--amber)}.status.offline{color:var(--red)}.detail-card{padding:22px}.detail-title{display:flex;justify-content:space-between}.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;background:transparent;border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:18px}.detail-grid div{background:var(--panel);padding:16px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.detail-grid span{display:block;color:var(--muted);font-size:12px}.who-box{border-left:4px solid #52677e;padding:15px 18px;margin:20px 0;background:var(--panel2)}.who-box.hot{border-left-color:var(--green)}.eyebrow{color:var(--cyan);font-size:12px;font-weight:800}.prose{max-width:900px}.prose p{color:#c0ccda;line-height:1.7}.empty{padding:30px;color:var(--muted)}
.stats{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.stats a{display:inline-flex;align-items:baseline;gap:6px;padding:8px 11px;border:1px solid var(--line);border-radius:6px;background:var(--panel);text-decoration:none}.stats strong{font-size:16px;color:var(--text)}.stats span{font-size:12px;color:var(--muted)}.page-title{padding-top:28px}.page-title h1{font-size:32px;margin:8px 0 6px}.page-title p{margin:0;color:var(--muted)}.ysf-id{font-variant-numeric:tabular-nums;color:#b7c5d5}.room-table{table-layout:fixed}.room-table th:nth-child(1),.room-table td:nth-child(1){width:20%}.room-table th:nth-child(2),.room-table td:nth-child(2){width:10%}.room-table th:nth-child(3),.room-table td:nth-child(3){width:13%}.room-table th:nth-child(4),.room-table td:nth-child(4){width:12%}.room-table th:nth-child(5),.room-table td:nth-child(5){width:16%}.room-table th:nth-child(6),.room-table td:nth-child(6){width:12%}.room-table th:nth-child(7),.room-table td:nth-child(7){width:11%}.room-table td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.home-page-head .global-search{align-self:end}.home-page-head .global-search input{min-width:0}.room-detail-panel{min-height:0}
@media(max-width:1000px){.page-head{grid-template-columns:1fr}.home-layout{grid-template-columns:1fr}.room-detail-panel{display:none}.list-head,.room-row{grid-template-columns:1.35fr 1fr .8fr .8fr}.list-head span:nth-child(2),.list-head span:nth-child(6),.list-head span:nth-child(7),.room-row>*:nth-child(2),.room-row>*:nth-child(6),.room-row>*:nth-child(7){display:none}.filters{grid-template-columns:1fr 1fr}.global-search{min-width:320px}}@media(max-width:680px){.wrap{width:min(100% - 24px,1500px)}.header-inner{height:auto;padding:14px 0;align-items:flex-start;gap:12px;flex-direction:column}nav{gap:16px;flex-wrap:wrap}.page-head{align-items:stretch;flex-direction:column}.global-search{min-width:0}.list-head,.room-row{grid-template-columns:1.4fr .8fr .9fr}.list-head span:nth-child(4),.room-row>*:nth-child(4){display:none}.filters{grid-template-columns:1fr}.metric-grid{grid-template-columns:1fr 1fr}}
nav a.active{color:var(--cyan);border-bottom:2px solid var(--cyan);padding-bottom:20px}.room-table td small{display:block;color:var(--muted);margin-top:4px}.room-table .room-link{text-decoration:none}.room-table tbody tr:hover{background:#0c1b29}

/* v0.5.7.3: match the preview panel to the room list height while keeping its content flexible. */
@media(min-width:1001px){
  .home-layout{align-items:stretch}
  .room-list-panel{height:100%}
  .room-detail-panel{min-height:540px;height:100%;align-self:stretch;display:flex;flex-direction:column}
  .detail-heading{min-height:92px;align-items:flex-start}
  .detail-heading>div{min-width:0;flex:1}
  .detail-heading h2{line-height:1.15;overflow-wrap:anywhere}
  .detail-heading p{white-space:normal;overflow-wrap:anywhere;line-height:1.45;min-height:42px}
  .talking-panel{flex:0 0 auto}
  .metric-grid{flex:0 0 auto}
  .detail-link{margin-top:auto;align-self:flex-start}
}

/* v0.5.7.4 mobile UI hotfix. Desktop rules above remain unchanged. */
.mobile-icon-button,.mobile-filter-button,.mobile-open-filters,.mobile-filter-header,.mobile-room-meta{display:none}
.mobile-search-row{display:contents}

@media(max-width:680px){
  body{font-size:16px;background:#03080e}
  .wrap{width:calc(100% - 28px)}
  .site-header{position:sticky;top:0;z-index:50;background:rgba(5,12,20,.98);backdrop-filter:blur(14px)}
  .header-inner{display:grid;grid-template-columns:40px 1fr 40px;height:auto;padding:16px 0 0;align-items:center;gap:8px}
  .wordmark{justify-self:center}
  .brand-logo{width:170px;max-width:66vw}
  .mobile-icon-button{display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;border:0;background:transparent;color:var(--text);font-size:26px;padding:0}
  .mobile-search-button{font-size:30px;line-height:1}
  nav{grid-column:1/-1;display:flex;width:100%;gap:0;border-top:1px solid rgba(27,43,60,.55);margin-top:10px}
  nav a{flex:1;text-align:center;padding:16px 4px 14px;font-size:15px;border-bottom:2px solid transparent}
  nav a.active{padding-bottom:14px}
  nav.is-collapsed{display:none}

  .page{padding:26px 0 30px}
  .page-head,.home-page-head{display:block;margin-bottom:18px}
  .page-head h1,.page-title h1,.prose h1{font-size:34px;line-height:1.08;margin-bottom:10px}
  .page-head p,.page-title p{font-size:16px;line-height:1.45}
  .mobile-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin-top:22px}
  .global-search{min-width:0;width:100%}
  .global-search input{font-size:15px;padding:14px 14px}
  .global-search button{padding:0 18px}
  .mobile-filter-button,.mobile-open-filters{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:1px solid #2a6078;background:#0a1d29;color:var(--cyan);font-weight:800;border-radius:7px;padding:0 14px;white-space:nowrap}

  /* Home room list becomes thumb-friendly cards. */
  .home-layout{display:block}
  .room-detail-panel{display:none!important}
  .room-list-panel{border:0;background:transparent;overflow:visible}
  .list-head{display:none}
  #home-room-list{display:grid;gap:10px}
  .room-row{display:grid;grid-template-columns:1fr auto;grid-template-areas:
    "activity heard"
    "name arrow"
    "id arrow"
    "caller tx";
    gap:5px 12px;padding:16px;border:1px solid var(--line);border-radius:9px;background:linear-gradient(180deg,#0a1622,#08131e);min-height:132px}
  .room-row:hover,.room-row.selected{background:linear-gradient(180deg,#0d1c2a,#091723)}
  .room-row.selected:before{top:10px;bottom:10px;border-radius:3px}
  .room-row:after{content:"›";grid-area:arrow;align-self:center;color:#cdd8e3;font-size:34px;font-weight:300}
  .room-row>span,.room-row>strong{white-space:normal;overflow:visible;text-overflow:clip}
  .mobile-room-name{grid-area:name;font-size:20px;line-height:1.15}
  .mobile-room-id{grid-area:id;color:var(--muted)!important;font-size:14px}
  .mobile-last-heard{grid-area:heard;justify-self:end;font-size:13px;color:#b7c5d5!important}
  .mobile-caller{grid-area:caller;font-size:14px;color:#c8d4e0!important}
  .mobile-caller:before{content:"Caller: ";color:var(--muted)}
  .mobile-activity{grid-area:activity;justify-self:start;padding:4px 9px;border-radius:999px;background:#122232;color:#b9c7d5!important;font-size:13px;font-weight:700}
  .mobile-activity.live{background:#0d3222;color:var(--green)!important}
  .mobile-tx{grid-area:tx;justify-self:end;font-weight:700;color:var(--text)!important;font-size:14px}
  .mobile-tx:before{content:"TX today\A";white-space:pre;color:var(--muted);font-weight:500;font-size:10px;text-transform:uppercase;letter-spacing:.04em}
  .mobile-status{position:absolute;top:18px;left:17px;font-size:0}
  .mobile-status:before{font-size:13px}

  /* Active page table becomes the same card feed. */
  .room-table,.room-table tbody,.room-table tr,.room-table td{display:block;width:100%!important}
  .room-table thead{display:none}
  .table-wrap:has(.room-table){border:0;background:transparent;overflow:visible}
  .room-table tbody{display:grid;gap:10px}
  .room-table tr{position:relative;border:1px solid var(--line);border-radius:9px;background:linear-gradient(180deg,#0a1622,#08131e);padding:16px 42px 16px 16px;min-height:132px}
  .room-table tr:after{content:"›";position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:34px;color:#cdd8e3}
  .room-table td{border:0;padding:0;white-space:normal;overflow:visible;text-overflow:clip}
  .room-table td:nth-child(1){font-size:20px;margin:34px 0 2px}
  .room-table td:nth-child(1) a{color:var(--text)}
  .room-table .mobile-room-meta{display:block;color:var(--muted);font-size:14px;margin-top:4px}
  .room-table td:nth-child(2){display:none}
  .room-table td:nth-child(3){position:absolute;top:18px;right:46px;font-size:13px;color:#b7c5d5}
  .room-table td:nth-child(4){margin-top:14px;font-size:14px;color:#c8d4e0}
  .room-table td:nth-child(4):before{content:"Caller: ";color:var(--muted)}
  .room-table td:nth-child(5){position:absolute;top:16px;left:16px}
  .room-table td:nth-child(5) .activity-text{display:inline-block;padding:4px 9px;border-radius:999px;background:#122232;font-size:13px;font-weight:700}
  .room-table td:nth-child(5) .activity-text.live{background:#0d3222}
  .room-table td:nth-child(6){position:absolute;bottom:16px;right:46px;text-align:right;font-weight:700}
  .room-table td:nth-child(6):before{content:"TX today\A";white-space:pre;color:var(--muted);font-weight:500;font-size:10px;text-transform:uppercase}
  .room-table td:nth-child(7){position:absolute;top:18px;left:18px;transform:translateX(-1px);font-size:0}
  .room-table td:nth-child(7) .status-dot:before{font-size:12px}

  /* Directory filters become a bottom sheet and results become cards. */
  .page-title{padding-top:26px}
  .stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
  .stats a{justify-content:center;padding:10px}
  .mobile-open-filters{width:100%;height:48px;margin:16px 0 18px}
  .filters{display:none;position:fixed;z-index:100;left:0;right:0;bottom:0;margin:0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));background:#09131e;border:1px solid var(--line);border-radius:22px 22px 0 0;box-shadow:0 -18px 60px rgba(0,0,0,.55);grid-template-columns:1fr;max-height:86vh;overflow:auto}
  .filters.is-open{display:grid}
  body.filter-open:before{content:"";position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.68);backdrop-filter:blur(3px)}
  .mobile-filter-header{display:flex;align-items:center;justify-content:space-between;font-size:20px;margin-bottom:4px}
  .mobile-filter-header button{background:transparent;border:0;color:var(--text);font-size:32px;line-height:1}
  .filters input,.filters select,.filters button{width:100%;min-height:48px;font-size:15px}
  .filters button{border-radius:7px}
  .directory-page .table-wrap{border:0}
  .directory-page>.table-wrap table,.directory-page>.table-wrap tbody,.directory-page>.table-wrap tr,.directory-page>.table-wrap td{display:block;width:100%}
  .directory-page>.table-wrap thead{display:none}
  .directory-page>.table-wrap tbody{display:grid;gap:10px}
  .directory-page>.table-wrap tr{position:relative;border:1px solid var(--line);border-radius:9px;background:linear-gradient(180deg,#0a1622,#08131e);padding:16px;min-height:142px}
  .directory-page>.table-wrap td{border:0;padding:0;white-space:normal}
  .directory-page>.table-wrap td[data-label="Room"]{font-size:20px;padding-right:70px}
  .directory-page>.table-wrap td[data-label="Room"] small{font-size:14px;line-height:1.4;margin-top:5px}
  .directory-page>.table-wrap td[data-label="Activity"]{position:absolute;top:16px;right:16px}
  .directory-page>.table-wrap td[data-label="Caller"]{margin-top:18px;font-size:14px}
  .directory-page>.table-wrap td[data-label="Caller"]:before{content:"Caller: ";color:var(--muted)}
  .directory-page>.table-wrap td[data-label="Region"]{margin-top:7px;color:var(--muted);font-size:14px}
  .directory-page>.table-wrap td[data-label="Status"]{position:absolute;bottom:15px;left:16px}
  

  /* Room detail becomes the rendered stacked mobile layout. */
  .detail-page{width:100%;padding:0 14px 30px}
  .back-link{margin:16px 0}.back-link a{text-decoration:none;color:#d5e0eb}
  .mobile-room-detail{border:0;background:transparent;padding:0;overflow:visible}
  .detail-title{display:block;position:relative;padding:6px 0 4px}
  .detail-title h1{font-size:30px;line-height:1.08;margin:8px 90px 6px 0}
  .detail-title p{color:var(--muted);line-height:1.45;margin:0}
  .detail-title .eyebrow{display:none}
  .detail-actions{position:absolute;right:0;top:10px}
  .detail-actions 
  .detail-actions .status.large{font-size:14px;text-transform:capitalize}
  .mobile-who-box{border:1px solid var(--line);border-left:4px solid #52677e;border-radius:8px;margin:24px 0 14px;padding:17px;background:linear-gradient(180deg,#0b1722,#09131d)}
  .mobile-who-box.hot{border-left-color:var(--green)}
  .mobile-who-box>span{display:inline-block;padding:4px 8px;border-radius:999px;background:#122232;color:#b9c7d5;font-size:12px;font-weight:800}
  .mobile-who-box.hot>span{background:#0d3222;color:var(--green)}
  .mobile-who-box strong{display:block;font-size:18px;margin:10px 0 5px}
  .mobile-who-box p{margin:0;color:#c8d4e0}
  .detail-grid{grid-template-columns:1fr 1fr;border:0;gap:8px;margin-top:14px}
  .detail-grid div{border:1px solid var(--line)!important;border-radius:8px;background:linear-gradient(180deg,#0b1722,#09131d);padding:15px;min-height:94px}
  .detail-grid div:nth-child(1),.detail-grid div:nth-child(2),.detail-grid div:nth-child(3){display:none}
  .detail-grid div:nth-child(8){grid-column:1/-1}
  .detail-grid span{font-size:12px;margin-bottom:7px}
  .detail-grid strong{font-size:17px;line-height:1.35;overflow-wrap:anywhere}
  .detail-page h2{font-size:21px;margin:26px 0 10px}
  .detail-page .table-wrap{border-radius:9px}
  .detail-page .table-wrap table,.detail-page .table-wrap tbody,.detail-page .table-wrap tr,.detail-page .table-wrap td{display:block;width:100%}
  .detail-page .table-wrap thead{display:none}
  .detail-page .table-wrap tr{padding:14px 16px;border-bottom:1px solid var(--line)}
  .detail-page .table-wrap tr:last-child{border-bottom:0}
  .detail-page .table-wrap td{border:0;padding:4px 0;display:flex;justify-content:space-between;gap:18px;text-align:right}
  .detail-page .table-wrap td:before{content:attr(data-label);color:var(--muted);text-align:left}
  .community-footer{font-size:14px;line-height:1.5;padding:22px 14px}
}


/* v0.5.7.5 mobile polish hotfix. Desktop remains unchanged. */
@media(max-width:680px){
  /* Keep page content clear of the sticky header and give controls room. */
  .page{padding-top:30px}
  .page-head,.home-page-head{margin-top:0}
  .mobile-search-row{position:relative;z-index:1}

  /* Home cards: clean hierarchy, no overlapping status dot, no TX counter, whole card is the target. */
  .room-row{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "activity heard"
      "name name"
      "id id"
      "caller caller";
    padding:20px;
    min-height:146px;
    row-gap:8px;
    cursor:pointer;
  }
  .room-row:after{display:none!important}
  .room-row.selected:before{top:14px;bottom:14px}
  .mobile-activity{position:static!important;display:inline-flex!important;align-items:center;gap:6px;margin:0}
  .mobile-activity:before{content:"●";font-size:10px;color:#8295aa}
  .mobile-activity.live:before{color:var(--green)}
  .mobile-last-heard{display:block!important;position:static!important;transform:none!important;max-width:none;white-space:nowrap!important;overflow:visible!important}
  .mobile-room-name{display:block!important;overflow-wrap:anywhere}
  .mobile-room-id{display:block!important}
  .mobile-caller{display:block!important}
  .mobile-tx,.mobile-status{display:none!important}

  /* Active-now table cards mirror Home and are tappable without a decorative chevron. */
  .room-table tr{padding:20px;min-height:146px;cursor:pointer}
  .room-table tr:after{display:none!important}
  .room-table td:nth-child(1){margin:36px 0 4px;padding-right:0}
  .room-table td:nth-child(3){top:20px;right:20px}
  .room-table td:nth-child(4){margin-top:16px}
  .room-table td:nth-child(5){top:18px;left:20px;width:auto!important}
  .room-table td:nth-child(5) .activity-text{display:inline-flex;align-items:center;gap:6px}
  .room-table td:nth-child(5) .activity-text:before{content:"●";font-size:10px;color:#8295aa}
  .room-table td:nth-child(5) .activity-text.live:before{color:var(--green)}
  .room-table td:nth-child(6),.room-table td:nth-child(7){display:none!important}

  /* Directory cards: undo full-width absolute table cells that caused clipped text. */
  .directory-page>.table-wrap tr{padding:58px 20px 20px;min-height:164px;overflow:hidden}
  .directory-page>.table-wrap td[data-label="Room"]{padding-right:0;overflow-wrap:anywhere}
  .directory-page>.table-wrap td[data-label="Activity"]{
    width:auto!important;
    max-width:calc(100% - 40px);
    left:20px;
    right:auto;
    top:18px;
  }
  .directory-page>.table-wrap td[data-label="Activity"] .activity-chip{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 10px;
    border-radius:999px;
    background:#122232;
    color:#b9c7d5;
    white-space:nowrap;
  }
  .directory-page>.table-wrap td[data-label="Activity"] .activity-chip.hot{background:#0d3222;color:var(--green)}
  .directory-page>.table-wrap td[data-label="Activity"] .activity-chip:before{content:"●";font-size:10px}
  .directory-page>.table-wrap td[data-label="Status"]{width:auto!important;left:20px;bottom:16px}
  
  .directory-page>.table-wrap td[data-label="Caller"],
  .directory-page>.table-wrap td[data-label="Region"]{width:auto!important}
}

/* v0.5.7.7 mobile navigation and Active Now card alignment hotfix. Desktop remains unchanged. */
@media(max-width:680px){
  /* Mobile navigation is the three primary tabs only. */
  .header-inner{
    display:grid;
    grid-template-columns:44px minmax(0,1fr) 44px;
    padding:18px 0 0;
    gap:14px;
    justify-items:center;
  }
  .mobile-menu-button{display:none!important}
  .wordmark{grid-column:2;justify-self:center}
  .mobile-search-button{display:flex!important;grid-column:3;justify-self:end}
  .brand-logo{width:min(250px,70vw);max-width:none}
  nav[aria-label="Primary navigation"]{
    grid-column:1/-1;
    display:grid!important;
    grid-template-columns:repeat(3,1fr);
    width:100%;
    gap:0;
    margin:0;
  }
  nav[aria-label="Primary navigation"] a{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:54px;
    padding:0 6px 12px;
    text-align:center;
    border-bottom:3px solid transparent;
    white-space:nowrap;
  }
  nav[aria-label="Primary navigation"] a.active{
    color:var(--cyan);
    border-bottom-color:var(--cyan);
  }

  /* Active Now cards use a real grid so last-heard and activity never escape the card. */
  .room-table tbody{display:grid!important;gap:10px}
  .room-table tr[data-room-row]{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "activity heard"
      "room room"
      "caller caller";
    gap:8px 14px;
    padding:20px!important;
    min-height:146px;
    overflow:hidden;
    align-items:start;
  }
  .room-table tr[data-room-row] td{
    position:static!important;
    inset:auto!important;
    transform:none!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    min-width:0;
  }
  .room-table tr[data-room-row] td:nth-child(1){
    grid-area:room;
    display:block!important;
    font-size:20px;
    line-height:1.2;
    padding-top:8px!important;
  }
  .room-table tr[data-room-row] td:nth-child(1) a{
    display:block;
    overflow-wrap:anywhere;
  }
  .room-table tr[data-room-row] td:nth-child(2),
  .room-table tr[data-room-row] td:nth-child(6),
  .room-table tr[data-room-row] td:nth-child(7){display:none!important}
  .room-table tr[data-room-row] td:nth-child(3){
    grid-area:heard;
    display:block!important;
    justify-self:end;
    color:#b7c5d5;
    font-size:13px;
    line-height:1.3;
    white-space:nowrap!important;
    overflow:visible!important;
  }
  .room-table tr[data-room-row] td:nth-child(4){
    grid-area:caller;
    display:block!important;
    color:#c8d4e0;
    font-size:14px;
    line-height:1.35;
    padding-top:6px!important;
  }
  .room-table tr[data-room-row] td:nth-child(5){
    grid-area:activity;
    display:block!important;
    justify-self:start;
  }
  .room-table tr[data-room-row] td:nth-child(5) .activity-text{
    display:inline-flex!important;
    align-items:center;
    gap:6px;
    padding:5px 10px;
    border-radius:999px;
    background:#122232;
    color:#b9c7d5;
    font-size:13px;
    font-weight:700;
    line-height:1.25;
    white-space:nowrap;
  }
  .room-table tr[data-room-row] td:nth-child(5) .activity-text.live{
    background:#0d3222;
    color:var(--green);
  }
  .room-table tr[data-room-row] td:nth-child(5) .activity-text:before{
    content:"●";
    font-size:10px;
    color:#8295aa;
  }
  .room-table tr[data-room-row] td:nth-child(5) .activity-text.live:before{color:var(--green)}
}


/* v0.5.7.8 mobile-only directory/search/detail polish. Desktop remains unchanged. */
@media(max-width:680px){
  /* Keep directory metadata and status from colliding. */
  .directory-page>.table-wrap tr{
    min-height:184px;
    padding:58px 20px 52px;
  }
  .directory-page>.table-wrap td[data-label="Region"]{
    display:block!important;
    margin-top:8px;
    padding-right:72px!important;
    line-height:1.35;
    overflow-wrap:anywhere;
  }
  .directory-page>.table-wrap td[data-label="Status"]{
    left:20px!important;
    bottom:17px!important;
    line-height:1;
  }
  

  /* The public room page keeps ten desktop rows, but phones show only five. */
  #activity-events-body tr:nth-child(n+6){display:none!important}
}

.beta-badge{display:inline-flex;align-items:center;margin-left:.65rem;padding:.18rem .5rem;border:1px solid #35cfff;border-radius:999px;color:#35cfff;font-size:.68rem;font-weight:800;letter-spacing:.12em;vertical-align:middle}
@media (max-width:720px){.beta-badge{margin-left:.4rem;font-size:.62rem;padding:.14rem .4rem}}

/* v0.5.9 public-beta legal and footer polish. */
.footer-content{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.footer-links{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.footer-links a{color:var(--muted);text-decoration:none}
.footer-links a:hover{color:var(--cyan);text-decoration:underline}
.legal-page{max-width:860px;padding-top:3rem;padding-bottom:4rem}
.legal-page h1{margin:.25rem 0 .35rem}
.legal-page h2{margin-top:2rem;margin-bottom:.55rem;font-size:1.15rem}
.legal-page p{color:#c9d5e2;line-height:1.7}
.legal-page .legal-updated,.legal-page .legal-note{color:var(--muted)}
@media(max-width:680px){
  .footer-content{justify-content:center;text-align:center}
  .footer-links{justify-content:center;width:100%;gap:.85rem}
  .legal-page{padding-top:2rem;padding-bottom:3rem}
}
/* v0.5.10 operational pages */
.footer-version{font-size:.78rem;opacity:.75;margin-left:.35rem}.status-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin:24px 0}.status-card{display:flex;align-items:flex-start;gap:12px;border:1px solid var(--line);background:var(--panel);border-radius:7px;padding:16px}.status-card p{margin:.3rem 0 0}.health-dot{width:12px;height:12px;border-radius:50%;flex:0 0 12px;margin-top:.3rem;box-shadow:0 0 10px currentColor}.health-dot.good{background:var(--green);color:var(--green)}.health-dot.bad{background:var(--red);color:var(--red)}.status-updated{font-size:.85rem}.maintenance-page{padding-top:15vh;text-align:center}

.connection-banner{position:fixed;left:50%;bottom:18px;transform:translate(-50%,20px);background:#311016;border:1px solid var(--red);color:#ffdbe0;padding:10px 16px;border-radius:6px;opacity:0;pointer-events:none;transition:.2s;z-index:9999}.connection-banner.show{opacity:1;transform:translate(-50%,0)}

/* YSF LIVE HOMEPAGE EXPLAINER */
.home-explainer{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 210px;min-height:235px;margin:0 0 30px;padding:30px 32px;overflow:hidden;border:1px solid #214158;border-radius:10px;background:radial-gradient(circle at 85% 45%,rgba(0,205,238,.08),transparent 38%),linear-gradient(135deg,#081522 0%,#06111b 100%)}
.home-explainer-copy{position:relative;z-index:2;align-self:center;max-width:850px}.home-explainer-title-row{display:flex;align-items:center;gap:14px}.home-explainer-title-row h1{margin:0;font-size:clamp(23px,3vw,35px);line-height:1.15}.home-explainer-info{display:inline-grid;flex:0 0 34px;width:34px;height:34px;place-items:center;border:2px solid var(--cyan);border-radius:50%;color:var(--cyan);font-size:21px;font-weight:900;font-family:Georgia,serif}.home-explainer p{max-width:760px;margin:20px 0 22px;color:#c3d0de;font-size:17px;line-height:1.65}.home-explainer-search{display:inline-flex;align-items:center;gap:10px;color:var(--cyan);font-size:16px;font-weight:700;text-decoration:none}.home-explainer-search:hover{text-decoration:underline}.home-explainer-search span{font-size:27px;line-height:1}.mobile-room-detail-id{display:none}
@media (max-width:760px){.home-explainer{display:block;min-height:0;margin-bottom:26px;padding:23px 22px}.home-explainer-title-row{align-items:flex-start;gap:11px}.home-explainer-info{flex-basis:29px;width:29px;height:29px;margin-top:1px;font-size:18px}.home-explainer-title-row h1{font-size:23px}.home-explainer p{position:relative;z-index:2;max-width:100%;margin:17px 0 20px;font-size:15px;line-height:1.6}.home-explainer-search{position:relative;z-index:2;max-width:100%;font-size:14px;line-height:1.45}.mobile-room-detail-id{display:block;margin:5px 0 0;color:var(--cyan);font-size:14px;font-weight:700}}