:root {
  --blue: #0879cf;
  --blue-dark: #145ca8;
  --blue-pale: #eef8ff;
  --ink: #18334f;
  --muted: #607b93;
  --line: #d7e6f2;
  --card: #ffffff;
  --bg: #f7fbfe;
  --green: #27ae60;
  --green-pale: #eefaf3;
  --amber: #b87800;
  --amber-pale: #fff7e5;
  --red: #bd3a3a;
  --red-pale: #fff2f2;
  --shadow: 0 8px 24px rgba(24, 51, 79, .06);
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body { overflow-x: hidden; }
button { font: inherit; }
.shell { min-height: 100vh; padding: clamp(22px, 2.2vw, 44px); padding-bottom: 76px; }
.topbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 28px; border-bottom: 2px solid var(--line); padding-bottom: 20px; }
.eyebrow, .live-label { letter-spacing: .19em; font-weight: 800; font-size: clamp(14px, 1vw, 20px); color: var(--blue); }
h1 { margin: 5px 0 4px; font-size: clamp(34px, 3vw, 60px); line-height: 1.04; color: var(--blue-dark); }
.date-line { color: var(--muted); font-size: clamp(18px, 1.5vw, 28px); font-weight: 650; }
.live-clock-wrap { text-align: right; flex: 0 0 auto; }
.clock { margin-top: 3px; font-variant-numeric: tabular-nums; font-weight: 800; font-size: clamp(44px, 4vw, 78px); line-height: 1; color: var(--blue); letter-spacing: .02em; }
.staff-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.3vw, 24px); margin: 22px 0 18px; }
.summary-card { background: var(--card); border: 2px solid var(--line); border-radius: 22px; padding: clamp(18px, 1.5vw, 28px); min-height: 132px; box-shadow: var(--shadow); }
.summary-label { font-size: clamp(15px, 1.05vw, 21px); font-weight: 850; letter-spacing: .09em; color: var(--muted); }
.summary-value { margin-top: 8px; font-size: clamp(25px, 2vw, 39px); line-height: 1.08; font-weight: 800; color: var(--blue-dark); overflow-wrap: anywhere; }
.summary-sub { margin-top: 6px; font-size: clamp(17px, 1.25vw, 24px); color: var(--muted); font-weight: 600; }
.tabs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 14px 0 18px; }
.tab { border: 2px solid var(--line); background: var(--card); color: var(--blue-dark); padding: 15px 18px; border-radius: 15px; font-size: clamp(18px, 1.35vw, 26px); font-weight: 800; cursor: pointer; transition: .15s ease; }
.tab.active { background: linear-gradient(135deg, #0a86e5, #0798e5); color: #fff; border-color: transparent; box-shadow: 0 7px 18px rgba(8, 121, 207, .22); }
.panel { display: none; }
.panel.active { display: block; }
.panel-grid.two-col { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 18px; }
.content-card { background: var(--card); border: 2px solid var(--line); border-radius: 22px; padding: clamp(20px, 1.55vw, 30px); box-shadow: var(--shadow); min-height: 48vh; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 12px; border-bottom: 2px solid #edf3f8; }
h2 { margin: 0; font-size: clamp(27px, 2vw, 39px); line-height: 1.1; color: var(--blue-dark); }
.count-badge { min-width: 44px; height: 44px; display: inline-grid; place-items: center; border-radius: 999px; background: var(--blue-pale); color: var(--blue); font-size: 22px; font-weight: 850; }
.card-list { display: grid; gap: 12px; padding-top: 14px; }
.item-card { border: 2px solid #e5eef5; border-radius: 18px; padding: 17px 19px; background: #fbfdff; }
.item-card.approaching { border-color: #f1cb75; background: var(--amber-pale); }
.item-title { font-size: clamp(22px, 1.62vw, 31px); font-weight: 850; line-height: 1.15; color: var(--ink); }
.item-meta { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: clamp(17px, 1.18vw, 23px); color: var(--muted); font-weight: 630; }
.participant-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 11px; }
.participant-chip { display: inline-flex; align-items: center; min-height: 40px; padding: 7px 13px; border-radius: 999px; background: var(--blue-pale); color: var(--blue-dark); border: 1px solid #c7e5f8; font-size: clamp(18px, 1.25vw, 24px); font-weight: 800; }
.item-description { margin-top: 9px; font-size: clamp(17px, 1.13vw, 22px); line-height: 1.35; color: var(--muted); }
.empty { display: grid; place-items: center; min-height: 150px; border: 2px dashed var(--line); border-radius: 17px; color: var(--muted); font-weight: 700; font-size: clamp(18px, 1.3vw, 25px); padding: 24px; text-align: center; }
.week-card { min-height: 55vh; }
.week-grid { display: grid; grid-template-columns: repeat(7, minmax(145px, 1fr)); gap: 10px; padding-top: 16px; align-items: start; }
.day-column { border: 2px solid #e5eef5; border-radius: 17px; overflow: hidden; background: #fbfdff; min-height: 290px; }
.day-column.today { border-color: #9fd2f5; background: #f5fbff; }
.day-head { padding: 14px 13px 10px; border-bottom: 2px solid #e8f0f6; }
.day-name { font-size: clamp(18px, 1.22vw, 23px); font-weight: 850; color: var(--blue-dark); }
.day-date { font-size: clamp(15px, 1vw, 19px); color: var(--muted); margin-top: 2px; font-weight: 650; }
.day-items { padding: 10px; display: grid; gap: 10px; }
.mini-item { padding: 10px; border-radius: 13px; background: #fff; border: 1px solid #dfeaf2; }
.mini-time { font-size: clamp(14px, .9vw, 17px); font-weight: 850; color: var(--blue); }
.mini-title { margin-top: 3px; font-size: clamp(17px, 1.05vw, 21px); font-weight: 800; line-height: 1.18; }
.mini-people { margin-top: 5px; font-size: clamp(14px, .87vw, 17px); color: var(--muted); font-weight: 650; }
.appointment-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding-top: 16px; }
.roster-row { display: grid; grid-template-columns: minmax(150px, .75fr) minmax(180px, 1.25fr); gap: 16px; align-items: center; }
.roster-status { display: inline-flex; align-items: center; justify-content: center; width: fit-content; min-width: 112px; padding: 7px 12px; border-radius: 999px; font-size: clamp(15px, 1vw, 19px); font-weight: 850; letter-spacing: .04em; background: var(--green-pale); color: #24704a; border: 1px solid #a9dcc0; }
.roster-status.next { background: #f3f7fa; color: var(--muted); border-color: #d7e2eb; }
.roster-status.vacant { background: var(--red-pale); color: var(--red); border-color: #efc2c2; }
.roster-name { font-size: clamp(22px, 1.55vw, 30px); font-weight: 850; }
.roster-time { margin-top: 4px; font-size: clamp(17px, 1.15vw, 22px); color: var(--muted); font-weight: 650; }
.statusbar { position: fixed; left: 0; right: 0; bottom: 0; min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 10px clamp(22px, 2.2vw, 44px); background: rgba(255,255,255,.97); border-top: 1px solid var(--line); backdrop-filter: blur(8px); z-index: 50; }
.rotation-note { color: var(--muted); font-size: clamp(14px, .95vw, 18px); font-weight: 650; }
.sync-status { display: flex; align-items: center; gap: 8px; font-size: clamp(15px, 1vw, 19px); color: var(--muted); font-weight: 700; font-variant-numeric: tabular-nums; }
.status-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(39,174,96,.10); }
.sync-status.retrying .status-dot { background: #e2a300; box-shadow: 0 0 0 4px rgba(226,163,0,.12); }
@media (max-width: 1150px) {
  .week-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .appointment-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 850px) {
  .shell { padding: 18px; padding-bottom: 72px; }
  .topbar { align-items: center; }
  .staff-strip, .panel-grid.two-col, .appointment-grid { grid-template-columns: 1fr; }
  .staff-strip { gap: 10px; }
  .summary-card { min-height: 0; }
  .tabs { grid-template-columns: repeat(2,1fr); }
  .week-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

/* v7.5 additions */
.hidden{display:none!important}
.brand-group{display:flex;align-items:center;gap:22px;min-width:0}.scope-logo{width:clamp(108px,8.4vw,150px);height:auto;flex:0 0 auto;display:block}.brand-divider{width:2px;height:78px;background:var(--line);flex:0 0 auto}.brand-copy{min-width:0}.holiday-line{display:inline-flex;margin-top:9px;padding:7px 12px;border-radius:999px;background:#fff3cd;border:1px solid #e7c86a;color:#765500;font-size:clamp(14px,1vw,19px);font-weight:850;letter-spacing:.04em}
.legend-holiday{font-size:clamp(13px,.9vw,17px);font-weight:750;color:#7a6200;background:#fff4cf;border:1px solid #ead17b;padding:6px 10px;border-radius:999px}
.day-column.public-holiday{border-color:#e7c86a;background:#fffaf0}.day-column.public-holiday .day-head{background:#fff3cf;border-bottom-color:#ead17b}.day-holiday{margin-top:7px;font-size:clamp(13px,.86vw,17px);font-weight:850;line-height:1.2;color:#765500}.holiday-badge,.appointment-holiday{display:inline-flex;align-items:center;width:fit-content;padding:5px 9px;border-radius:999px;background:#fff3cd;border:1px solid #e7c86a;color:#765500;font-size:clamp(13px,.86vw,17px);font-weight:850}.appointment-holiday{margin-bottom:9px}.public-holiday-card{border-color:#ead17b;background:#fffdf7}
.sync-status.offline .status-dot{background:#dd8a00;box-shadow:0 0 0 4px rgba(221,138,0,.12)}
.rotation-progress-track{width:min(340px,36vw);height:4px;margin-top:5px;background:#e3eef5;border-radius:999px;overflow:hidden}.rotation-progress{height:100%;width:0;background:var(--blue);border-radius:999px}.rotation-progress.run{animation:rotationProgress var(--rotation-ms,60000ms) linear forwards}@keyframes rotationProgress{from{width:0}to{width:100%}}
@media(max-width:850px){.brand-group{gap:12px}.scope-logo{width:92px}.brand-divider{display:none}.rotation-progress-track{width:46vw}}

/* v7.6 unified schedule / participant-away highlighting */
.tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.away-panel{border-color:#efd7a9;background:#fffdf8}.tv-type-badge{display:inline-flex;align-items:center;width:fit-content;margin-bottom:8px;padding:5px 9px;border-radius:999px;background:#eaf5fc;border:1px solid #cbe3f3;color:#226a9f;font-size:clamp(12px,.78vw,15px);font-weight:900;letter-spacing:.06em}.tv-type-badge.appointment{background:#f4effb;border-color:#dbd0ee;color:#6748a0}.tv-type-badge.away{background:#fff0d8;border-color:#efd19e;color:#8a5700}.item-card.appointment-card{border-color:#ded4ef;background:#fdfbff}.item-card.away-card{border-color:#efd19e;background:#fffaf2}.mini-item.appointment{background:#fcfaff;border-color:#e3daf1}.mini-item.away{background:#fff8ed;border-color:#efd6aa}.mini-item .tv-type-badge{font-size:clamp(9px,.58vw,11px);padding:3px 6px;margin-bottom:4px}.mini-empty{padding:14px 8px;text-align:center;color:var(--muted);font-size:clamp(13px,.8vw,16px);font-weight:650}.sync-status.offline .status-dot{background:#dd8a00}.sync-status.retrying .status-dot{background:#e2a300}
@media(max-width:850px){.tabs{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* v8.0 smart display */
.tabs{grid-template-columns:repeat(3,1fr)}
.timeline-section{margin-top:18px}.timeline-section:first-of-type{margin-top:14px}.timeline-label{font-size:clamp(14px,1vw,19px);font-weight:900;letter-spacing:.12em;margin-bottom:8px;color:var(--muted)}.now-label{color:#23875a}.coming-label{color:#b87800}.later-label{color:var(--blue-dark)}.smart-list{padding-top:0}.today-smart-grid .content-card{min-height:54vh}.countdown-pill{display:inline-flex;float:right;margin-left:10px;padding:6px 10px;border-radius:999px;background:#fff0c9;color:#785900;border:1px solid #e5c46f;font-size:clamp(13px,.9vw,18px);font-weight:900;letter-spacing:.04em}.item-card.status-cancelled,.mini-item.status-cancelled{opacity:.55;background:#f5f6f7;border-color:#d8e0e6}.item-card.status-cancelled .item-title,.mini-item.status-cancelled .mini-title{text-decoration:line-through}.item-card.status-tentative,.mini-item.status-tentative{border-style:dashed}.tv-type-badge.cancelled{background:#f3f4f5!important;color:#64717c!important;border-color:#d5dce1!important}.tv-type-badge.tentative{background:#fff8e4!important;color:#795b00!important;border-color:#e5d18b!important}.participant-chip.p0{background:#eef8ff}.participant-chip.p1{background:#eefaf3;border-color:#c4e7d1;color:#28714f}.participant-chip.p2{background:#f4f0fb;border-color:#ded3f1;color:#6748a0}.participant-chip.p3{background:#fff7e5;border-color:#efd69c;color:#805b00}.participant-chip.p4{background:#fff0f0;border-color:#efcccc;color:#9a3b3b}.participant-chip.p5{background:#f3f5f7;border-color:#d9e0e6;color:#52606b}.day-holiday{margin-top:6px;font-size:clamp(10px,.75vw,14px);font-weight:900;line-height:1.15;color:#725900;background:#fff0b9;border-radius:7px;padding:5px 6px}.day-column.public-holiday{background:#fff9e9;border-color:#e2c45d}.roster-day-group{display:grid;gap:9px}.roster-day-title{font-size:clamp(18px,1.25vw,24px);font-weight:900;color:var(--blue-dark);padding:7px 2px;border-bottom:2px solid #edf3f8}.few-items .item-title{font-size:clamp(26px,2vw,38px)}.few-items .item-meta,.few-items .item-description{font-size:clamp(19px,1.35vw,26px)}

/* v8 Modern UI refresh — CSS-only, Raspberry Pi friendly */
:root{
  --blue:#0a78c8;
  --blue-dark:#174f8c;
  --blue-pale:#edf7fd;
  --ink:#18324a;
  --muted:#647b8e;
  --line:#e1ebf2;
  --card:#ffffff;
  --bg:#f4f8fb;
  --green:#26865b;
  --green-pale:#edf8f2;
  --amber:#a96f00;
  --amber-pale:#fff8e8;
  --red:#b63b45;
  --red-pale:#fff1f2;
  --purple:#6a57a8;
  --shadow:0 12px 30px rgba(24,50,74,.07);
  --shadow-soft:0 4px 14px rgba(24,50,74,.05);
}
body{background:linear-gradient(180deg,#f7fbfe 0,#f3f7fa 100%)}
.shell{padding-top:clamp(20px,1.8vw,34px)}
.topbar{align-items:center;border-bottom:1px solid var(--line);padding-bottom:18px}
.scope-logo{filter:drop-shadow(0 5px 12px rgba(23,79,140,.08))}
.brand-divider{height:72px;background:#dce7ef}
.eyebrow,.live-label{font-size:clamp(13px,.9vw,18px);letter-spacing:.18em}
h1{letter-spacing:-.035em;font-weight:850}
.date-line{font-weight:650}
.clock{letter-spacing:-.025em;font-weight:850}
.holiday-line{box-shadow:var(--shadow-soft)}

.house-status-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0 12px;padding:7px;background:#eaf1f6;border:1px solid #dae6ef;border-radius:18px}
.house-status-item{min-width:0;display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 13px;border-radius:12px;background:rgba(255,255,255,.82);color:var(--muted)}
.house-status-item span{font-size:clamp(11px,.75vw,14px);font-weight:850;letter-spacing:.07em;white-space:nowrap}
.house-status-item strong{font-size:clamp(15px,1.05vw,21px);font-weight:900;color:var(--blue-dark);white-space:nowrap}
.house-status-item.has-issue{background:#fff3f3}.house-status-item.has-issue strong{color:var(--red)}

.staff-strip{margin:12px 0 14px;gap:14px}
.summary-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);background:linear-gradient(180deg,#fff 0,#fbfdff 100%);padding-top:clamp(20px,1.55vw,29px)}
.summary-card::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:linear-gradient(180deg,#0b84d5,#7ac6ed)}
.summary-label{letter-spacing:.08em}
.summary-value{letter-spacing:-.025em}
.summary-sub{line-height:1.3}

.tabs{gap:5px;padding:5px;margin:12px 0 16px;background:#e9f0f5;border:1px solid #dce6ee;border-radius:18px}
.tab{border:0;background:transparent;padding:14px 18px;border-radius:13px;box-shadow:none;color:#42657e;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}
.tab.active{background:#fff;color:var(--blue-dark);box-shadow:0 3px 10px rgba(24,50,74,.08);border:1px solid #dce8f0}

.panel.active{animation:modernPanelIn .16s ease-out}
@keyframes modernPanelIn{from{opacity:.65;transform:translateY(3px)}to{opacity:1;transform:none}}
.content-card{border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);background:#fff}
.section-heading{border-bottom:1px solid #edf2f6;padding-bottom:13px}
h2{letter-spacing:-.02em}
.count-badge{background:#edf7fd;border:1px solid #d7ebf8;box-shadow:inset 0 0 0 3px rgba(255,255,255,.6)}
.timeline-label{display:flex;align-items:center;gap:8px}.timeline-label::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(24,50,74,.04)}

.item-card{position:relative;border:1px solid #e2ebf2;border-left:5px solid #7ebde4;border-radius:17px;background:#fff;box-shadow:var(--shadow-soft)}
.item-card.appointment-card{border-left-color:#8b75ba;background:#fefcff}
.item-card.away-card{border-left-color:#dda24a;background:#fffaf1}
.item-card.approaching{border-color:#eccb7f;border-left-color:#d69b21;background:#fffaf0}
.item-title{letter-spacing:-.018em}
.item-meta{line-height:1.3}
.item-description{border-top:1px solid #eef3f6;padding-top:9px}
.tv-type-badge{border:0;background:#eaf5fc;color:#226a9f}.tv-type-badge.appointment{background:#f1edfa;color:#644b9a}.tv-type-badge.away{background:#fff0d8;color:#815400}
.countdown-pill{border:0;background:#fff0c7;box-shadow:inset 0 0 0 1px #e7ca7e}
.participant-chip{border:0;box-shadow:inset 0 0 0 1px rgba(30,76,112,.10);font-weight:850}
.empty{min-height:132px;border:1px dashed #cbdbe7;background:#f9fbfd;border-radius:16px}

.day-column{border:1px solid #dfE9f0;border-radius:16px;background:#fff;box-shadow:var(--shadow-soft)}
.day-column.today{border-color:#89c7ed;box-shadow:0 0 0 2px rgba(10,120,200,.08),var(--shadow-soft)}
.day-head{border-bottom:1px solid #e9f0f5;background:#f9fbfd}
.day-column.today .day-head{background:#eff8fd}
.day-column.public-holiday .day-head{background:#fff5d8}
.mini-item{border:0;border-left:4px solid #74b9e2;background:#f8fbfd;box-shadow:inset 0 0 0 1px #e4edf3}
.mini-item.appointment{border-left-color:#8b75ba;background:#faf8fd}
.mini-item.away{border-left-color:#dda24a;background:#fff9ee}
.mini-time{letter-spacing:.01em}

.roster-day-title{border-bottom:1px solid #e7eef4}
.roster-status{border:0;box-shadow:inset 0 0 0 1px #badfc9}
.roster-status.vacant{box-shadow:inset 0 0 0 1px #efc7ca}
.away-panel{background:linear-gradient(180deg,#fffdf9,#fffaf2)}

.statusbar{background:rgba(255,255,255,.94);border-top:1px solid #dfe8ef;box-shadow:0 -6px 20px rgba(24,50,74,.04)}
.rotation-progress-track{height:3px;background:#dfe9f0}.rotation-progress{background:linear-gradient(90deg,#0a78c8,#55b3e5)}
.status-dot{width:9px;height:9px}

@media(max-width:1150px){.house-status-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:850px){.house-status-strip{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:12px}.house-status-item{justify-content:space-between}.panel.active{animation:none}}
@media(prefers-reduced-motion:reduce){.panel.active{animation:none}.rotation-progress.run{animation:none}.tab{transition:none}}


/* v8.1 Responsive UI — viewport-fit TV layout + calmer mobile layout */
.statusbar{min-height:40px;justify-content:flex-end;padding:7px clamp(14px,1.6vw,28px)}
.rotation-note,.rotation-progress-track{display:none!important}
.sync-status{font-size:clamp(12px,.82vw,16px)}

/* Desktop / TV signage: fit the complete interface inside the physical viewport. */
@media (min-width:851px){
  html,body{height:100%;overflow:hidden}
  .shell{height:100vh;min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:clamp(12px,1.35vw,24px);padding-bottom:46px}
  .topbar,.house-status-strip,.staff-strip,.tabs{flex:0 0 auto}
  .panel.active{display:block;flex:1 1 auto;min-height:0;overflow:hidden}
  .panel-grid.two-col{height:100%;min-height:0}
  .content-card{height:100%;min-height:0;overflow:hidden}
  .today-smart-grid .content-card{min-height:0}
  .week-card{height:100%;min-height:0;display:flex;flex-direction:column}
  .week-card .section-heading{flex:0 0 auto}
  .week-grid{flex:1 1 auto;min-height:0;grid-template-columns:repeat(7,minmax(0,1fr));align-items:stretch;overflow:hidden}
  .day-column{min-width:0;min-height:0;height:100%;overflow:hidden}
  .day-items{min-height:0;overflow:hidden}
  .roster-grid .card-list{max-height:100%;overflow:hidden}
}

/* Most wall TVs are 720p–900p high. Compact vertically without sacrificing distance readability. */
@media (min-width:851px) and (max-height:900px){
  .shell{padding:12px 18px 42px}
  .topbar{gap:16px;padding-bottom:9px}
  .brand-group{gap:13px}.scope-logo{width:clamp(72px,6.4vw,108px)}.brand-divider{height:54px}
  .eyebrow,.live-label{font-size:clamp(10px,.75vw,14px)}
  h1{margin:2px 0;font-size:clamp(30px,2.65vw,45px)}.date-line{font-size:clamp(15px,1.15vw,20px)}
  .clock{font-size:clamp(36px,3.4vw,54px)}
  .holiday-line{margin-top:4px;padding:4px 8px;font-size:12px}
  .house-status-strip{margin:8px 0 7px;padding:4px;gap:5px;border-radius:13px}
  .house-status-item{padding:6px 9px;border-radius:9px;gap:6px}.house-status-item span{font-size:10px}.house-status-item strong{font-size:14px}
  .staff-strip{margin:7px 0;gap:9px}.summary-card{min-height:76px;border-radius:17px;padding:10px 14px}.summary-card::before{width:4px}
  .summary-label{font-size:11px}.summary-value{margin-top:3px;font-size:clamp(20px,1.7vw,29px)}.summary-sub{margin-top:2px;font-size:clamp(13px,1vw,17px)}
  .tabs{margin:5px 0 8px;padding:3px;border-radius:13px}.tab{padding:8px 12px;border-radius:10px;font-size:clamp(15px,1.1vw,20px)}
  .content-card{border-radius:17px;padding:12px 14px}.section-heading{padding-bottom:7px}.section-heading h2,h2{font-size:clamp(21px,1.65vw,29px)}
  .count-badge{min-width:32px;height:32px;font-size:16px}
  .timeline-section{margin-top:8px}.timeline-section:first-of-type{margin-top:7px}.timeline-label{margin-bottom:4px;font-size:11px;letter-spacing:.1em}.timeline-label::before{width:6px;height:6px}
  .card-list{gap:7px;padding-top:7px}.smart-list{padding-top:0}.item-card{border-left-width:4px;border-radius:13px;padding:9px 11px}.tv-type-badge{margin-bottom:4px;padding:3px 6px;font-size:9px}.countdown-pill{padding:4px 7px;font-size:10px}
  .item-title{font-size:clamp(17px,1.25vw,23px)}.item-meta{margin-top:3px;gap:4px 10px;font-size:clamp(12px,.9vw,16px)}.participant-row{gap:5px;margin-top:6px}.participant-chip{min-height:26px;padding:4px 8px;font-size:clamp(12px,.9vw,16px)}.item-description{margin-top:5px;padding-top:5px;font-size:clamp(12px,.86vw,15px)}
  .empty{min-height:58px;padding:10px;font-size:clamp(13px,.9vw,16px)}
  .week-grid{gap:6px;padding-top:8px}.day-column{border-radius:12px}.day-head{padding:8px 7px 6px}.day-name{font-size:clamp(14px,1vw,18px)}.day-date{font-size:clamp(11px,.8vw,14px)}.day-holiday{margin-top:3px;padding:3px 4px;font-size:9px}.day-items{padding:6px;gap:5px}.mini-item{padding:6px;border-radius:9px}.mini-item .tv-type-badge{font-size:7px;padding:2px 4px;margin-bottom:2px}.mini-time{font-size:10px}.mini-title{font-size:clamp(12px,.86vw,15px)}.mini-people{font-size:10px;margin-top:2px}.mini-empty{padding:8px 4px;font-size:11px}
  .roster-day-group{gap:5px}.roster-day-title{padding:4px 1px;font-size:clamp(14px,1vw,18px)}.roster-row{grid-template-columns:minmax(80px,.55fr) minmax(0,1.45fr);gap:9px}.roster-status{min-width:78px;padding:4px 7px;font-size:10px}.roster-name{font-size:clamp(16px,1.15vw,21px)}.roster-time{margin-top:1px;font-size:clamp(12px,.86vw,15px)}
}

@media (min-width:851px) and (max-height:720px){
  .shell{padding-top:8px;padding-bottom:38px}.topbar{padding-bottom:6px}.scope-logo{width:68px}.brand-divider{height:44px}h1{font-size:29px}.clock{font-size:38px}.date-line{font-size:14px}
  .house-status-strip{margin:5px 0}.house-status-item{padding:4px 7px}.staff-strip{margin:5px 0}.summary-card{min-height:62px;padding:8px 12px}.summary-value{font-size:20px}.summary-sub{font-size:12px}.tabs{margin:4px 0 6px}.tab{padding:6px 10px}
  .content-card{padding:9px 11px}.timeline-section{margin-top:5px}.card-list{gap:5px}.item-card{padding:7px 9px}.empty{min-height:42px;padding:7px}.statusbar{min-height:34px;padding-top:5px;padding-bottom:5px}
}

/* Tablet / phone: prioritise readable stacks and touch interaction instead of squeezing desktop columns. */
@media (max-width:850px){
  html,body{min-height:100%;overflow-x:hidden;overflow-y:auto}
  .shell{min-height:100vh;height:auto;padding:14px 12px 54px;overflow:visible}
  .topbar{flex-direction:column;align-items:stretch;gap:10px;padding-bottom:12px}
  .brand-group{gap:10px}.scope-logo{width:72px}.brand-divider{display:none}.brand-copy{flex:1}
  h1{font-size:clamp(29px,9vw,42px);line-height:1}.date-line{font-size:16px}.eyebrow{font-size:11px}
  .live-clock-wrap{display:flex;align-items:center;justify-content:space-between;text-align:left;padding:8px 10px;background:#fff;border:1px solid var(--line);border-radius:13px}.live-label{font-size:10px}.clock{margin:0;font-size:31px}
  .house-status-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:10px 0;padding:5px}.house-status-item{min-height:48px;flex-direction:column;align-items:flex-start;justify-content:center;gap:1px;padding:7px 9px}.house-status-item span{font-size:9px}.house-status-item strong{font-size:15px;white-space:normal}
  .staff-strip{grid-template-columns:1fr;gap:7px;margin:8px 0}.summary-card{min-height:0;padding:12px 14px;border-radius:16px}.summary-label{font-size:10px}.summary-value{font-size:23px;margin-top:3px}.summary-sub{font-size:14px;margin-top:3px}
  .tabs{position:sticky;top:0;z-index:30;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;margin:8px 0 10px;padding:4px;border-radius:14px;background:rgba(233,240,245,.96);backdrop-filter:blur(8px)}.tab{padding:10px 5px;font-size:14px;border-radius:10px}
  .panel-grid.two-col,.today-smart-grid,.roster-grid{grid-template-columns:1fr;gap:10px}.content-card{min-height:0;height:auto;padding:14px;border-radius:17px}.today-smart-grid .content-card{min-height:0}.section-heading h2,h2{font-size:23px}
  .week-card{min-height:0}.week-grid{grid-template-columns:1fr;gap:8px;padding-top:10px}.day-column{min-height:0}.day-items{padding:8px}.mini-item{padding:9px}
  .item-card{padding:12px 13px}.item-title{font-size:20px}.item-meta,.item-description{font-size:14px}.participant-chip{font-size:14px;min-height:32px}
  .statusbar{position:fixed;min-height:38px;padding:6px 12px;justify-content:flex-end}.sync-status{font-size:12px;max-width:100%;overflow:hidden}.sync-status span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

@media (max-width:420px){
  .shell{padding-left:9px;padding-right:9px}.scope-logo{width:62px}.house-status-strip{grid-template-columns:1fr 1fr}.content-card{padding:12px}.section-heading{gap:8px}.section-heading h2,h2{font-size:21px}.item-title{font-size:18px}.tab{font-size:13px}.summary-value{font-size:21px}
}

/* v8.1.1: never expose stale cached planner data to an unauthorised display URL. */
.display-auth-screen{min-height:100vh;display:grid;place-items:center;padding:clamp(20px,4vw,56px);background:#f4f8fb}.display-auth-card{width:min(760px,100%);display:flex;align-items:center;gap:28px;padding:clamp(24px,4vw,44px);background:#fff;border:1px solid #d9e6ef;border-radius:24px;box-shadow:0 14px 40px rgba(31,73,105,.08)}.display-auth-card img{width:108px;height:auto;flex:0 0 auto}.display-auth-card h1{margin:6px 0 12px;color:#155ca2;font-size:clamp(30px,4vw,50px);line-height:1.05}.display-auth-card p{margin:0;color:#58738a;font-size:clamp(16px,2vw,22px);line-height:1.45}.display-auth-card .display-auth-help{margin-top:12px;font-size:clamp(14px,1.5vw,18px);color:#6f8496}@media(max-width:620px){.display-auth-card{display:block;text-align:center}.display-auth-card img{width:92px;margin:0 auto 18px}}

/* v8.2 Notices display */
.tab-count{display:inline-grid;place-items:center;min-width:24px;height:24px;margin-left:7px;padding:0 6px;border-radius:999px;background:#e8f3fa;color:#1d689b;font-size:.72em;font-weight:900;vertical-align:middle}
.tab.active .tab-count{background:rgba(255,255,255,.9);color:#17618f}.tab-count.zero{opacity:.55}
.notices-display-card{display:flex;flex-direction:column}
.notice-display-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-content:start;padding-top:14px;min-height:0;overflow:hidden}
.notice-card{position:relative;border:1px solid #dfe9f0;border-left:6px solid #0a78c8;border-radius:18px;background:linear-gradient(180deg,#fff,#f9fcfe);padding:18px 20px;box-shadow:var(--shadow-soft);min-width:0}
.notice-card.priority-high{border-left-color:#d48b1f;background:linear-gradient(180deg,#fffdf8,#fff8ea)}
.notice-kicker{font-size:clamp(10px,.72vw,13px);font-weight:950;letter-spacing:.12em;color:#5c7990}
.notice-title{margin-top:5px;font-size:clamp(22px,1.65vw,32px);font-weight:900;line-height:1.05;color:#173d5b;letter-spacing:-.02em}
.notice-body{margin-top:10px;font-size:clamp(16px,1.15vw,22px);line-height:1.35;color:#294f6c;white-space:pre-wrap;overflow-wrap:anywhere}
.notice-window{margin-top:12px;padding-top:9px;border-top:1px solid #e7eef3;font-size:clamp(12px,.85vw,16px);font-weight:750;color:#70879a}
@media (min-width:851px) and (max-height:900px){.notice-display-list{gap:9px;padding-top:9px}.notice-card{padding:12px 15px;border-radius:14px}.notice-title{font-size:clamp(18px,1.35vw,25px)}.notice-body{margin-top:6px;font-size:clamp(14px,1vw,18px)}.notice-window{margin-top:7px;padding-top:6px}}
@media (max-width:850px){.notice-display-list{grid-template-columns:1fr;overflow:visible}.notices-display-card{height:auto}.notice-card{padding:16px}.notice-title{font-size:24px}.notice-body{font-size:17px}.tab-count{min-width:21px;height:21px;margin-left:4px;font-size:11px}}
/* v8.2 final tab layout override */
.tabs{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:850px){.tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}