:root {
  --bg:#f5f6f8;
  --ink:#17232b;
  --muted:#74818a;
  --line:#e7ebee;
  --teal:#187a67;
  --mint:#dff2ec;
  --sidebar:#142a2d;
  --accent:#d4f479;
  --orange:#c27c21
}
* {
  box-sizing:border-box
}
body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:14px;
  line-height:1.55
}
a {
  color:inherit;
  text-decoration:none
}
button,input,select {
  font:inherit
}
button,a,input,select {
  outline-offset:4px
}
button {
  cursor:pointer
}
button:disabled {
  opacity:.65;
  cursor:wait
}
.sidebar {
  position:fixed;
  inset:0 auto 0 0;
  width:236px;
  background:var(--sidebar);
  color:#c6d6d4;
  padding:36px 25px;
  display:flex;
  flex-direction:column
}
.brand {
  font-size:38px;
  font-weight:750;
  letter-spacing:-2px;
  display:flex;
  align-items:center;
  gap:8px;
  color:#fff
}
.brand-symbol {
  width:36px;
  height:36px;
  color:var(--accent);
  font-size:34px;
  line-height:1
}
.brand-dot {
  color:var(--accent);
  margin-left:-8px
}
.brand-caption {
  font-size:9px;
  letter-spacing:2.2px;
  margin:3px 0 54px 3px;
  color:#92aaa8
}
.workspace-label {
  font-size:10px;
  letter-spacing:1.8px;
  color:#6f9390;
  margin-bottom:15px
}
.sidebar nav {
  display:flex;
  flex-direction:column;
  gap:12px
}
.sidebar nav>a,.nav-future {
  padding:12px 15px;
  border-radius:9px
}
.sidebar nav>a {
  display:flex;
  gap:13px;
  align-items:center
}
.nav-active {
  background:#244347;
  color:#fff;
  font-weight:600
}
.nav-active>span {
  color:var(--accent);
  font-size:20px
}
.nav-future {
  color:#76918f;
  display:block
}
.nav-future small {
  display:block;
  font-size:9px;
  margin:3px 0 0 22px;
  color:#76918f
}
.sidebar-bottom {
  margin-top:auto;
  font-size:11px
}
.subtle {
  color:#73938f;
  font-size:9px
}
.mini-dot {
  display:inline-block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#3e9b7f;
  margin-right:5px
}
.mini-dot.amber {
  background:#d49b3e
}
.mini-dot.red {
  background:#ce7372
}
.logout {
  border:0;
  background:none;
  color:#9bb4b0;
  font-size:11px;
  padding:20px 0 0
}
.main-shell {
  margin-left:236px
}
.topbar {
  height:78px;
  background:#fff;
  border-bottom:1px solid var(--line);
  padding:0 48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:var(--muted);
  font-size:10px;
  letter-spacing:1.5px
}
.topbar-divider {
  margin:0 14px;
  color:#c6ced3
}
.account {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  letter-spacing:0;
  color:#56636a
}
.avatar {
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  background:#e7eee9;
  color:var(--teal);
  border-radius:50%;
  font-weight:700
}
main {
  max-width:1500px;
  margin:auto;
  padding:44px 48px 48px
}
.page-heading {
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  margin:0 0 30px
}
.eyebrow {
  font-size:9px;
  letter-spacing:2px;
  font-weight:700;
  color:var(--teal);
  margin:0 0 12px
}
h1 {
  font-size:36px;
  letter-spacing:-1.3px;
  line-height:1.15;
  margin:0;
  font-weight:650;
  overflow-wrap:anywhere
}
.heading-dot {
  color:var(--teal)
}
.intro {
  color:var(--muted);
  font-size:13px;
  margin:13px 0 0
}
h2 {
  font-size:18px;
  letter-spacing:-.35px;
  margin:0 0 12px
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  border:1px solid transparent;
  border-radius:7px;
  padding:12px 18px;
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
  line-height:1.4
}
.primary {
  background:var(--teal);
  color:#fff
}
.primary:hover {
  background:#126451
}
.secondary {
  background:#fff;
  border-color:#dce3e6;
  color:#46565f
}
.secondary:hover {
  border-color:#839891
}
.small {
  padding:9px 15px
}
.full {
  width:100%;
  justify-content:space-between
}
.stats {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin-bottom:29px
}
.stats>div {
  background:#fff;
  padding:21px 23px;
  border:1px solid var(--line);
  border-radius:9px
}
.stats>div>span {
  display:block;
  color:#6a777f;
  font-size:11px
}
.stats strong {
  font-size:32px;
  line-height:1.3;
  font-weight:600;
  display:block;
  margin:9px 0 3px;
  letter-spacing:-1px
}
.stats small {
  color:#98a2a8;
  font-size:10px
}
.library-panel {
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden
}
.panel-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid var(--line);
  padding:0 23px;
  gap:15px
}
.tabs {
  display:flex;
  gap:24px
}
.tabs>a {
  font-size:12px;
  color:#8b969d;
  padding:20px 0 16px;
  border-bottom:3px solid transparent
}
.tabs .selected {
  color:var(--teal);
  border-color:var(--teal);
  font-weight:650
}
.live-indicator {
  color:#9aa7a5;
  font-size:9px;
  white-space:nowrap
}
.live-indicator .mini-dot {
  width:5px;
  height:5px
}
.filters {
  display:flex;
  gap:12px;
  padding:20px 23px;
  align-items:center
}
.search {
  display:flex;
  align-items:center;
  gap:10px;
  flex:1;
  background:#fafbfc;
  border:1px solid var(--line);
  border-radius:6px;
  padding:0 12px
}
.search>span {
  color:#8e9ca4;
  font-size:22px
}
.search input {
  border:0!important;
  background:transparent;
  padding:10px 0!important;
  outline:0;
  width:100%;
  min-width:80px;
  font-size:11px
}
.filters select {
  padding:10px 12px;
  font-size:11px;
  max-width:170px;
  background:#fff
}
.table-scroll {
  overflow-x:auto
}
table {
  width:100%;
  border-collapse:collapse;
  text-align:left;
  white-space:nowrap
}
thead {
  background:#fafbfc;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
th {
  font-size:9px;
  letter-spacing:1.1px;
  color:#8c999f;
  font-weight:600;
  padding:13px 18px
}
th:first-child {
  padding-left:24px
}
td {
  border-bottom:1px solid #f0f2f3;
  padding:17px 18px;
  color:#78858c;
  font-size:11px
}
td:first-child {
  padding-left:24px;
  width:52%;
  white-space:normal
}
tbody tr:last-child td {
  border-bottom:none
}
.track-cell {
  display:flex;
  gap:14px;
  align-items:flex-start
}
.track-icon {
  display:grid;
  place-items:center;
  flex-shrink:0;
  border-radius:8px;
  width:40px;
  height:43px;
  background:#e5f0ed;
  color:#358674;
  font-size:23px
}
.track-icon.podcasts {
  background:#eceaf7;
  color:#9181b7
}
.track-icon.jingles {
  background:#fff0db;
  color:#b89852
}
.track-title {
  display:block;
  font-size:12px;
  font-weight:600;
  color:#384951;
  overflow-wrap:anywhere
}
.track-title:hover {
  text-decoration:underline
}
.track-subtitle {
  display:block;
  color:#97a0a7;
  font-size:10px;
  margin-top:3px;
  word-break:break-word
}
.track-preview {
  margin-top:4px
}
.preview-trigger {
  border:0;
  background:none;
  padding:0;
  font-size:10px;
  color:var(--teal)
}
.track-preview audio {
  width:220px;
  height:30px;
  margin-top:5px;
  max-width:100%
}
.category-label {
  font-size:10px
}
.duration {
  font-variant-numeric:tabular-nums
}
.badge {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 9px;
  border-radius:5px;
  font-size:9px;
  white-space:nowrap;
  font-weight:600;
  background:#f2f4f5;
  color:#89979d
}
.badge:before {
  content:'';
  height:5px;
  width:5px;
  background:currentColor;
  border-radius:50%
}
.badge.ready {
  background:#e8f5ef;
  color:#388a6b
}
.badge.pending,.badge.processing {
  background:#fff5e3;
  color:#bc8d36
}
.badge.error {
  background:#fdeeed;
  color:#ba6360
}
.row-action {
  font-size:18px;
  color:#89989f
}
.panel-footer {
  border-top:1px solid var(--line);
  padding:16px 24px;
  font-size:9px;
  color:#95a1a7;
  display:flex;
  justify-content:space-between;
  gap:20px
}
.panel-footer>div {
  display:flex;
  gap:20px
}
.panel-footer a {
  color:var(--teal)
}
.empty-state {
  text-align:center;
  padding:54px 20px 58px
}
.empty-state h2 {
  margin-top:22px;
  font-size:20px
}
.empty-state p {
  color:var(--muted);
  font-size:12px;
  margin:0 0 23px
}
.empty-art {
  margin:auto;
  width:85px;
  height:70px;
  border-radius:20px;
  background:#f0f5ef;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  transform:rotate(-5deg)
}
.empty-art span {
  width:5px;
  background:#6c9b7d;
  border-radius:3px;
  height:20px
}
.empty-art span:nth-child(2),.empty-art span:nth-child(4) {
  height:33px
}
.empty-art span:nth-child(3) {
  height:45px;
  background:#a9c781
}
.library-note {
  display:flex;
  gap:12px;
  margin-top:22px;
  color:#99a4a8;
  font-size:10px
}
.library-note>span {
  font-size:21px;
  color:#b7c5c2
}
.library-note p {
  margin:4px 0;
  max-width:750px
}
.library-note strong {
  color:#6e8280;
  font-weight:600
}
.card {
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  padding:28px
}
.upload-layout,.detail-layout {
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr);
  gap:24px
}
.back-link {
  display:inline-block;
  font-size:11px;
  color:var(--muted);
  margin-bottom:25px
}
label {
  display:block;
  color:#56696f;
  font-size:12px;
  font-weight:600;
  margin-bottom:9px
}
input:not([type=hidden]):not([type=file]),select {
  width:100%;
  padding:11px 12px;
  border:1px solid #dce3e6;
  border-radius:6px;
  color:var(--ink);
  background:#fff
}
.card form>input,.card>input,.login-card input {
  margin-bottom:19px
}
.card>.button {
  margin-top:14px
}
.upload-zone {
  position:relative;
  border:1.5px dashed #c9dbd3;
  background:#f8fbf9;
  border-radius:8px;
  text-align:center;
  padding:28px 16px 20px;
  margin-top:25px
}
.upload-symbol {
  font-size:34px;
  color:var(--teal);
  line-height:1;
  margin-bottom:17px
}
.upload-zone h2 {
  font-size:16px;
  margin:0 0 6px
}
.upload-zone p {
  color:#94a29e;
  font-size:11px
}
.file-label {
  display:inline-block;
  border:1px solid #bed4c9;
  color:var(--teal);
  padding:8px 15px;
  border-radius:5px;
  margin:12px 0;
  cursor:pointer;
  background:white
}
.upload-zone input[type=file] {
  position:absolute;
  width:1px;
  height:1px;
  opacity:0
}
.upload-zone:focus-within {
  outline:2px solid var(--teal);
  outline-offset:3px
}
.file-selection {
  overflow-wrap:anywhere
}
.help-text {
  font-size:11px;
  color:#8b999f;
  line-height:1.7
}
.upload-guide ol {
  padding:0;
  margin:30px 0;
  list-style:none
}
.upload-guide li {
  display:flex;
  gap:16px;
  margin-bottom:28px
}
.upload-guide li>span {
  color:#98b1a4;
  font-size:11px;
  padding-top:2px
}
.upload-guide strong {
  font-size:12px;
  color:#405b55;
  font-weight:600
}
.upload-guide li p {
  font-size:11px;
  color:#93a19c;
  margin:6px 0
}
.soft-note {
  background:#f5f8f6;
  color:#879b92;
  padding:16px;
  border-radius:7px;
  font-size:11px;
  margin-top:20px;
  line-height:1.8
}
.detail-layout form label {
  margin-top:17px
}
.detail-layout form input {
  margin-bottom:0!important
}
.detail-audio {
  width:100%;
  margin:16px 0
}
.audio-facts {
  margin:15px 0
}
.audio-facts>div {
  display:flex;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid var(--line);
  padding:12px 0;
  font-size:11px
}
.audio-facts dt {
  color:var(--muted)
}
.audio-facts dd {
  margin:0;
  font-weight:600
}
.preparing {
  margin:25px 0;
  color:#b58b3c
}
.notice {
  padding:13px 18px;
  border-radius:7px;
  background:#e8f2ee;
  color:#2a775e;
  font-size:12px;
  margin-bottom:20px
}
.notice.error {
  background:#fbeceb;
  color:#b55b58
}
.notice.info {
  background:#edf1f6;
  color:#596f86
}
.errorlist {
  list-style:none;
  padding:10px 0;
  color:#b55b58;
  font-size:12px
}
.auth-shell {
  min-height:100vh;
  background:radial-gradient(ellipse at top left,#e1eee7,transparent 65%),#f5f6f8;
  display:grid;
  place-items:center
}
.auth-shell main {
  width:100%;
  max-width:520px;
  padding:30px
}
.login-card {
  background:#fff;
  padding:42px;
  border:1px solid #e0e9e3;
  border-radius:14px;
  box-shadow:0 15px 70px #2147390a
}
.login-card .brand {
  color:var(--sidebar);
  margin-bottom:34px
}
.login-card .brand-symbol,.login-card .brand-dot {
  color:var(--teal)
}
.login-card h1 {
  font-size:28px
}
.login-card .eyebrow {
  font-size:8px
}
.login-card form {
  margin-top:30px
}
.login-footer {
  font-size:8px;
  letter-spacing:1.7px;
  color:#a5b2ad;
  text-align:center;
  margin:30px 0 0
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0)
}
@media(min-width:1600px) {
  main {
    padding-top:56px
  }
  .page-heading {
    margin-bottom:38px
  }
  .stats {
    margin-bottom:34px
  }
}
@media(max-width:1100px) {
  .sidebar {
    width:195px;
    padding:30px 20px
  }
  .main-shell {
    margin-left:195px
  }
  main {
    padding:30px 25px
  }
  .topbar {
    padding:0 25px
  }
  .stats {
    gap:10px
  }
  .stats>div {
    padding:17px 14px
  }
  .live-indicator {
    display:none
  }
  .tabs {
    gap:22px
  }
  .upload-layout,.detail-layout {
    grid-template-columns:minmax(0,1.3fr) minmax(240px,1fr)
  }
}
@media(max-width:760px) {
  .sidebar {
    position:static;
    width:100%;
    padding:17px 20px;
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:space-between
  }
  .brand {
    font-size:29px
  }
  .brand-symbol {
    font-size:27px;
    width:28px;
    height:28px
  }
  .brand-caption,.workspace-label,.sidebar nav,.sidebar-bottom .subtle,.sidebar-bottom>.mini-dot {
    display:none
  }
  .sidebar-bottom {
    margin:0;
    font-size:11px;
    display:flex;
    gap:18px;
    align-items:center
  }
  .logout {
    padding:0
  }
  .main-shell {
    margin:0
  }
  .topbar {
    height:55px;
    padding:0 20px;
    font-size:8px
  }
  main {
    padding:27px 18px
  }
  .page-heading {
    align-items:flex-start;
    gap:12px;
    flex-wrap:wrap
  }
  h1 {
    font-size:29px
  }
  .intro {
    font-size:12px
  }
  .stats {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin:22px 0
  }
  .stats>div {
    padding:15px
  }
  .stats strong {
    font-size:27px
  }
  .stats small {
    font-size:9px
  }
  .panel-top {
    padding:0 15px
  }
  .tabs {
    gap:22px
  }
  .tabs>a {
    font-size:11px
  }
  .filters {
    padding:16px 13px;
    gap:7px;
    flex-wrap:wrap
  }
  .search {
    flex-basis:100%
  }
  .filters select {
    max-width:none;
    width:auto;
    flex:1
  }
  .panel-footer {
    padding:15px;
    flex-wrap:wrap
  }
  .panel-footer>span:last-child {
    display:none
  }
  th,td {
    padding:12px
  }
  th:first-child,td:first-child {
    padding-left:14px
  }
  .track-cell {
    gap:10px
  }
  .track-icon {
    width:30px;
    height:34px;
    font-size:19px
  }
  .track-title {
    font-size:11px;
    min-width:135px
  }
  .upload-layout,.detail-layout {
    grid-template-columns:1fr
  }
  .card {
    padding:23px
  }
  .empty-state {
    padding:35px 16px
  }
  .login-card {
    padding:30px
  }
  .auth-shell main {
    padding:20px
  }
  .account {
    font-size:11px
  }
  .library-note {
    font-size:10px
  }
  .page-heading .badge {
    margin-top:10px
  }
}

/* Radio controls remain native, visible and keyboard accessible. */
input[type="checkbox"] { width: 18px !important; height: 18px; accent-color: var(--teal); padding: 0 !important; }
.rotation-label { display: block; font-size: 9px; color: var(--teal); margin-top: 4px; }
.jingle-current { margin: 20px 0; }

.playlist-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 20px; margin-top: 25px; }
.playlist-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-top: 20px; }
.playlist-picker { max-height: 400px; overflow: auto; margin: 15px 0 25px; border: 1px solid var(--line); border-radius: 7px; }
.playlist-picker > div { padding: 12px 18px; border-bottom: 1px solid var(--line); }
.playlist-picker label { display: flex; align-items: center; gap: 14px; margin: 0; }
.playlist-picker input { margin: 0 !important; flex-shrink: 0; }
.playlist-picker > div[hidden] { display: none; }
.trash-action { border-top: 1px solid var(--line); margin-top: 24px; padding-top: 20px; }
.sidebar { overflow-y: auto; }

.broadcast-row {display:flex;align-items:center;gap:1rem;padding:1.2rem 0;border-bottom:1px solid var(--border,#e7e9ed)}
.broadcast-row>div {flex:1;min-width:0}.broadcast-row p{margin:.4rem 0;overflow-wrap:anywhere}.broadcast-row:last-child{border-bottom:0}
@media(max-width:650px){.broadcast-row{flex-wrap:wrap}}

.upload-schedule {border:1px solid var(--line);border-radius:8px;margin:24px 0;padding:18px}
.upload-schedule legend {font-weight:650;padding:0 6px}.schedule-toggle {display:flex;gap:12px;align-items:center}
.upload-schedule[hidden], [data-schedule-time][hidden] {display:none}
.broadcast-row {flex-wrap:wrap}.broadcast-row>div{flex-basis:45%}

.playlist-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px;font-size:11px;color:var(--muted)}
.playlist-tags a{background:#eef4ef;border-radius:5px;padding:3px 7px;color:var(--teal)}
.removal-selection{max-height:320px;overflow:auto;padding:12px 24px}.removal-selection li{padding:6px 0}
.schedule-toggle{display:flex;align-items:center;gap:12px;margin:20px 0}.schedule-toggle input{flex-shrink:0}
.library-table{min-width:860px}
.library-table td{padding-top:12px;padding-bottom:12px;vertical-align:middle}
.library-table td:first-child{width:auto;min-width:180px}
.library-table .playlist-column{width:250px}
.row-playlists{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;margin:0;position:relative}
.row-playlist-menu{width:155px;flex-shrink:0}
.row-playlist-toggle{display:flex;justify-content:space-between;align-items:center;width:100%;gap:10px;cursor:pointer;border:1px solid var(--line);border-radius:6px;padding:9px 12px;background:white;font-size:12px;color:var(--teal)}
.row-playlist-toggle[aria-expanded="true"]{border-color:var(--teal)}
.row-playlist-options[popover]{position:fixed;inset:auto;margin:0;border:1px solid var(--line);border-radius:6px;padding:12px;background:#fff;box-shadow:0 8px 25px #192d2422;max-height:220px;overflow:auto;box-sizing:border-box}
.row-playlist-feedback{position:absolute;top:100%;left:0;line-height:12px;max-width:250px}
.row-playlist-options p{font-size:11px;color:var(--muted);margin:0 0 10px}
.row-playlist-options label{display:flex;align-items:center;gap:8px;margin:8px 0;font-size:12px;overflow-wrap:anywhere}
.row-playlist-options input{flex-shrink:0;margin:0}.row-playlist-feedback{font-size:10px;color:var(--teal);overflow-wrap:anywhere}.row-playlist-feedback.error{color:#b33b3b}
.row-playlist-options,.row-playlist-feedback{white-space:normal}

.row-playlist-toggle [data-playlist-caption]{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.sidebar-bottom .archive-nav{margin-bottom:20px;padding-top:12px;border-top:1px solid #39504f;font-size:12px}

/* Keep the episode choice and its confirmation on one compact row. */
.replay-choice { display:flex; align-items:center; gap:8px; }
.replay-choice select { width:auto; min-width:150px; margin:0; }
.card textarea { width:100%; box-sizing:border-box; padding:12px; border:1px solid var(--line); border-radius:7px; font:inherit; resize:vertical; }

.studio-grid {display:grid;grid-template-columns:1.4fr 1fr;gap:24px;margin-bottom:24px;}
.studio-metrics {display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:24px;}
.studio-current h2 {font-size:28px;overflow-wrap:anywhere;}
.studio-number {font-size:48px;font-weight:700;margin:16px 0;color:var(--teal);}
.studio-next {margin-top:24px;}
.audience-chart {display:flex;gap:1px;height:180px;margin:28px 0 0;border-bottom:1px solid var(--line);align-items:stretch;}
.audience-column {flex:1;min-width:0;display:flex;align-items:flex-end;}
.audience-bar {width:100%;min-height:3px;background:var(--teal);border-radius:3px 3px 0 0;}
.audience-bar.unknown {background:#d5dbdd;}
@media(max-width:800px){.studio-grid,.studio-metrics{grid-template-columns:1fr;}}

.backup-hash {max-width:280px;overflow-wrap:anywhere;font-family:monospace;font-size:11px;}

.month-panel{background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:24px}
.month-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.month-panel>.month-toolbar{padding:24px 24px 0}.month-toolbar h2{margin:0;font-size:24px}.month-toolbar nav{display:flex;gap:8px}.month-hint{padding:0 24px;margin:14px 0 20px}.month-scroll{overflow-x:auto}.month-grid{width:100%;table-layout:fixed;border-collapse:collapse;min-width:700px}.month-grid th{background:#f7f9f7;text-align:left;padding:12px 10px;font-size:12px;border-bottom:1px solid var(--line)}.month-grid td{height:140px;vertical-align:top;padding:8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.month-grid td:last-child{border-right:0}.month-grid tr:last-child td{border-bottom:0}.month-day[data-calendar-create]{cursor:pointer}.month-day:hover{background:#fafcf9}.outside-month{background:#f7f8f7}.outside-month .day-number{color:#929c99}.today{background:#f4f8ef}.day-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.day-number{font-size:13px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px}.today .day-number{border-radius:50%;background:var(--teal);color:white}.day-add{font-size:18px;color:var(--teal);padding:0 6px}.calendar-event{display:flex;align-items:center;gap:4px;background:#eaf3ee;color:#245e50;border-left:3px solid #397d69;border-radius:4px;padding:6px 5px;margin:4px 0;font-size:11px;line-height:1.4}.calendar-event time{font-weight:700;flex-shrink:0}.calendar-event>span:not(.event-marker){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.calendar-event:hover{background:#dcece2}.event-cancelled,.event-skipped,.event-error,.event-interrupted{background:#eff0f1;color:#6c7478;border-left-color:#99a0a3}.event-cancelled>span:not(.event-marker){text-decoration:line-through}.event-playing,.event-dispatching{background:#fff3d9;border-left-color:#b88621;color:#795915}.event-conflict{border-left-color:#bf4c47;background:#fff0ed;color:#a23e39}.event-marker{margin-left:auto;font-weight:bold}.calendar-more{font-size:11px;color:var(--teal);display:inline-block;padding:6px 2px}.month-legend{padding:14px 24px;border-top:1px solid var(--line);display:flex;gap:20px;flex-wrap:wrap;font-size:11px;color:var(--muted)}.day-agenda .month-toolbar{margin-bottom:20px}.calendar-event:focus-visible,.day-number:focus-visible,.day-add:focus-visible{outline:3px solid #83ac6c;outline-offset:2px}
@media(max-width:800px){.month-panel>.month-toolbar{padding:18px 16px 0}.month-hint{padding:0 16px}.month-grid{min-width:650px}.month-grid td{height:120px;padding:6px}.month-toolbar h2{font-size:21px}}

.calendar-event{flex-wrap:wrap}.calendar-event time{font-size:10px}.calendar-event>span:not(.event-marker){flex-basis:100%;order:3;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.event-marker{order:2}
.file-metadata-row{border:1px solid var(--line);border-radius:8px;padding:16px;margin:16px 0;min-width:0}.file-metadata-row legend{font-size:12px;padding:0 6px;overflow-wrap:anywhere}.file-metadata-row input{width:100%;box-sizing:border-box}

/* Hidden form groups must override the layout display rules. */
[hidden] { display: none !important; }
.brand-icon { width:48px; height:48px; object-fit:contain; flex-shrink:0; }

.maintenance-menu summary{cursor:pointer;padding:14px 16px;border-radius:8px;font-size:13px;display:flex;align-items:center;gap:12px}.maintenance-menu summary::after{content:'⌄';margin-left:auto}.maintenance-menu[open] summary::after{content:'⌃'}.maintenance-menu>div{padding-left:20px}.reset-panel{max-width:850px}.reset-panel li{margin:10px 0}.reset-panel p{line-height:1.65}.reset-danger{background:#a33f38;color:white;margin-top:20px}.reset-danger:hover{background:#84332d}
.sidebar{overflow-y:auto}.sidebar>.brand,.sidebar>.brand-caption,.sidebar>.workspace-label,.sidebar>nav,.sidebar-bottom{flex-shrink:0}.maintenance-menu>div{display:flex;flex-direction:column;gap:6px;padding-left:18px}.maintenance-menu>div>a{display:block;padding:10px 12px;border-radius:8px}.maintenance-menu>div>a:hover{background:#244347}

.restore-upload input[type=file]{display:block;width:100%;border:1px solid var(--line);padding:18px;border-radius:9px;background:#f7f9f7;margin-top:10px}.restore-upload input::file-selector-button{border:1px solid #bfd0c9;border-radius:6px;background:white;color:var(--teal);font-weight:600;padding:10px 14px;margin-right:12px;cursor:pointer}

.upload-zone.is-dragging {
  border-color: var(--accent, #e5bc4b);
  background-color: rgba(229, 188, 75, 0.12);
  outline: 2px solid var(--accent, #e5bc4b);
  outline-offset: 3px;
}

/* Host overview: distinct readings, quiet status and accessible native meters. */
.host-monitor { grid-column: 1 / -1; }
.host-heading, .host-title, .host-footer { display: flex; align-items: center; }
.host-heading { justify-content: space-between; gap: 20px; margin-bottom: 24px; flex-wrap: wrap; }
.host-title { gap: 14px; }
.host-title h2 { margin: 0; }
.host-title p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }
.host-symbol { display: grid; place-items: center; width: 46px; height: 46px; flex: 0 0 46px; border-radius: 14px; background: var(--mint); color: var(--teal); }
.host-symbol svg { width: 27px; height: 27px; }
.host-badge { display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border-radius: 99px; background: #f0f3f4; color: #5e6d73; font-size: 11px; font-weight: 600; white-space: nowrap; }
.host-badge > span:first-child { width: 6px; height: 6px; border-radius: 50%; background: #869397; }
.host-monitor[data-state="ready"] .host-badge { background: var(--mint); color: var(--teal); }
.host-monitor[data-state="ready"] .host-badge > span:first-child { background: var(--teal); }
.host-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.host-metric { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 20px; border-radius: 13px; background: #f6f8f8; border: 1px solid #edf1f1; }
.host-metric-label { font-size: 12px; font-weight: 600; color: #617476; }
.host-metric-value { font-size: clamp(25px, 2.8vw, 36px); line-height: 1.2; letter-spacing: -1px; font-variant-numeric: tabular-nums; margin: 12px 0; font-weight: 650; color: var(--sidebar); overflow-wrap: anywhere; }
.host-metric-temperature .host-metric-value { color: #9b6d2b; }
.host-metric-value.host-uptime { font-size: clamp(20px, 2vw, 27px); letter-spacing: -.5px; }
.host-metric-detail { font-size: 11px; color: #6d7c80; line-height: 1.6; }
.host-meter { appearance: none; border: 0; border-radius: 20px; height: 5px; width: 100%; margin: 0 0 11px; overflow: hidden; background: #e1ebe7; accent-color: var(--teal); }
.host-meter::-webkit-progress-bar { background: #e1ebe7; border-radius: 20px; }
.host-meter::-webkit-progress-value { background: var(--teal); border-radius: 20px; }
.host-meter::-moz-progress-bar { background: var(--teal); border-radius: 20px; }
.host-meter[hidden] { display: none; }
.host-footer { justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; margin-top: 18px; color: var(--muted); font-size: 11px; }
.host-monitor .host-note { margin: 7px 0 0; color: var(--muted); font-size: 11px; }
@media (max-width: 1050px) { .host-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .host-metric { padding: 14px; } .host-title { align-items: flex-start; } .host-heading { gap: 12px; } .host-title h2 { font-size: 19px; } }

/* Transmission controls: clear intent, independently observed stream status. */
.transmission-card{border-top:3px solid #77a99d}
.transmission-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}
.transmission-kicker{font-size:10px;font-weight:700;letter-spacing:1.8px;color:#6a8580}
.transmission-heading h2{margin:7px 0 0}
.transmission-symbol{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:#edf5f1;color:#47796b;font-size:25px}
.transmission-state{display:flex;align-items:center;gap:14px;padding:20px;border:1px solid #d8e8e0;border-radius:14px;background:#f0f7f3;color:#285b49}
.transmission-state strong{font-size:22px;letter-spacing:-.5px;line-height:1.3}
.transmission-state p{margin:5px 0 0;font-size:12px;color:#60766c}
.transmission-dot{width:11px;height:11px;border-radius:50%;background:#458d6a;box-shadow:0 0 0 6px #458d6a14;flex-shrink:0;margin:0 6px}
.transmission-state.is-paused{background:#fbf6eb;border-color:#ecdfc1;color:#896329}
.transmission-state.is-paused .transmission-dot{background:#b28a43;box-shadow:0 0 0 6px #b28a4314}
.transmission-state.is-unknown{background:#f3f5f5;border-color:#dfe5e4;color:#586b68}
.transmission-state.is-unknown .transmission-dot{background:#82938e;box-shadow:0 0 0 6px #82938e14}
.transmission-description{font-size:13px;line-height:1.8;color:#637474;margin:22px 0 17px}
.transmission-confirm{display:flex;align-items:center;gap:10px;font-size:12px;color:#475f59;padding:13px 15px;background:#f7f9f8;border:1px solid #e5ece8;border-radius:9px;cursor:pointer}
.transmission-confirm input{width:16px;height:16px;margin:0;flex-shrink:0;accent-color:#548979}
.transmission-action{display:flex;align-items:center;justify-content:center;gap:11px;width:100%;margin-top:16px;min-height:48px}
.transmission-action>span{font-size:16px}
.transmission-note{font-size:11px;line-height:1.7;color:#7c8985;margin:12px 0 23px}
.transmission-diagnostics{display:flex;gap:12px;flex-wrap:wrap;border-top:1px solid #e8eeeb;padding-top:18px;margin-top:22px}
.transmission-diagnostics>span{display:flex;flex-direction:column;gap:5px;flex:1;font-size:11px;color:#7a8b85}
.transmission-diagnostics strong{font-size:12px;font-weight:600;color:#486259}
.transmission-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-top:20px;font-size:10px;color:#8a9791}
.transmission-footer a{font-size:12px;font-weight:600}
@media(max-width:480px){.transmission-state{padding:17px 13px}.transmission-state strong{font-size:20px}.transmission-footer{align-items:flex-start;flex-direction:column}}
.transmission-card .transmission-action:not(.secondary){background:#4b8073;color:#fff;border:1px solid #4b8073;border-radius:9px;font-weight:600}
.transmission-card .transmission-action:not(.secondary):hover{background:#396a5e}
.transmission-card .transmission-action.secondary{border-color:#cadbd5;color:#3d675b;border-radius:9px}