html[data-pbx-display="utility"] {
  --bg:#292929; --bg-raised:#333333; --bg-hover:#393939; --bg-input:#252525;
  --border:#454545; --text:#DDDDDD; --text-dim:#AAAAAA;
  --accent:#72AFE0; --accent-hover:#9DC8EA; --accent-glow:#315B80;
  --gold:#E5A34E; --success:#91C957; --warning:#E5A34E; --danger:#E47777;
  --radius:0; --font:"Segoe UI",system-ui,sans-serif;
  --font-display:var(--font); --mono:Consolas,"Cascadia Code",monospace;
  background:var(--bg); font-size:13px; color-scheme:dark;
}
html[data-pbx-display="utility"] body {
  background:var(--bg); font:13px/1.4 var(--font); height:100dvh;
  display:flex; flex-direction:column; overflow:hidden;
}
html[data-pbx-display="utility"] [hidden] {display:none!important;}
html[data-pbx-display="utility"] :focus-visible {outline:1px solid #72AFE0; outline-offset:-1px;}
html[data-pbx-display="utility"] .topnav {
  min-height:42px; padding:4px 10px; margin:0; gap:12px; flex:none;
  background:#333333; border-bottom:1px solid #454545;
}
html[data-pbx-display="utility"] .topnav::after {display:none;}
html[data-pbx-display="utility"] .topnav-logo {gap:8px; color:var(--text);}
html[data-pbx-display="utility"] .header-logo {height:21px; filter:brightness(0) invert(.87); opacity:1;}
html[data-pbx-display="utility"] .header-section {font:600 13px var(--font); text-transform:none; letter-spacing:0; color:var(--text);}
html[data-pbx-display="utility"] .topnav-center {min-width:0;}
html[data-pbx-display="utility"] .topnav-user {gap:8px; font-size:13px; color:var(--text-dim);}
html[data-pbx-display="utility"] .header-role {color:var(--text-dim); border:1px solid var(--border); padding:0 4px; font-size:11px; background:none; border-radius:0;}
html[data-pbx-display="utility"] .topnav-logout {font-size:13px;}
html[data-pbx-display="utility"] .container {
  max-width:none; width:100%; min-height:0; flex:1; padding:0; margin:0;
  display:flex; flex-direction:column; animation:none;
}
.utility-tabs {display:flex; gap:4px; padding:6px 8px 0; background:#303030; border-bottom:1px solid #454545; flex:none;}
.utility-tabs a {color:#AAAAAA; padding:6px 16px; border:1px solid transparent; margin-bottom:-1px; text-decoration:none;}
.utility-tabs a:hover {color:#DDDDDD; background:#363636;}
.utility-tabs a[aria-current="page"] {background:#292929; border-color:#454545; border-bottom-color:#292929; color:#DDDDDD;}
.utility-filters {display:flex; align-items:center; gap:8px; padding:8px; flex:none; border-bottom:1px solid #454545;}
.utility-filters label {color:#AAAAAA;}
.utility-filters select,.utility-filters input {
  background:#252525; color:#DDDDDD; border:1px solid #555555; border-radius:0;
  padding:4px 6px; font:13px var(--font); height:29px; min-width:0;
}
.utility-filters select {width:220px; max-width:25vw;}
.utility-filters input {width:260px; margin-left:auto;}
.utility-filters input::placeholder {color:#AAAAAA;}
.utility-browser {flex:1; min-height:0; overflow:auto; scrollbar-gutter:stable;}
html[data-pbx-display="utility"] .date-group {margin:0; padding:0; border:0; border-radius:0; background:none;}
html[data-pbx-display="utility"] .date-head {
  position:sticky; top:0; z-index:2; margin:0; padding:7px 10px;
  background:#383838; color:#DDDDDD; font:600 14px/1.4 var(--font); letter-spacing:0;
  border-top:1px solid #454545; border-bottom:1px solid #454545;
}
html[data-pbx-display="utility"] .date-head::after {display:none;}
html[data-pbx-display="utility"] .daily-grid {grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:10px 12px; padding:10px 8px;}
html[data-pbx-display="utility"] .daily-card {
  background:transparent; border:1px solid #454545; border-radius:0; box-shadow:none;
  transition:none; transform:none; min-width:0;
}
html[data-pbx-display="utility"] .daily-card:hover {background:#303030; border-color:#555555; box-shadow:none; transform:none;}
html[data-pbx-display="utility"] .daily-card.is-selected {border-color:#72AFE0; background:#315B80;}
html[data-pbx-display="utility"] .daily-card:focus-visible {outline:1px solid #72AFE0; outline-offset:-1px;}
html[data-pbx-display="utility"] .daily-thumb {background:#202020;}
html[data-pbx-display="utility"] .daily-thumb img {object-fit:contain;}
html[data-pbx-display="utility"] .thumb-play {font-size:12px;}
html[data-pbx-display="utility"] .daily-meta {padding:5px 4px;}
.utility-clip-heading {display:flex; align-items:baseline; gap:8px;}
.utility-clip-name {font-size:13px; font-weight:600; min-width:0; flex:0 1 auto; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.utility-clip-context {color:#AAAAAA; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; margin-top:2px;}
.utility-comments {display:inline-flex; align-items:center; gap:4px; color:#AAAAAA; font-size:12px; margin-left:auto; flex:none; white-space:nowrap;}
.daily-card:not(.mentions-you) .utility-mention {display:none;}
.daily-card.mentions-you .utility-comment-icon {display:none;}
.daily-card.mentions-you .utility-comments,
.daily-card.on-your-daily .utility-comments {color:#E5A34E;}
html[data-pbx-display="utility"] .daily-card.mentions-you,
html[data-pbx-display="utility"] .daily-card.on-your-daily {border-color:#454545; box-shadow:none;}
html[data-pbx-display="utility"] .daily-card.is-selected {border-color:#72AFE0; background:#315B80;}
html[data-pbx-display="utility"] .daily-card.is-selected .utility-clip-context {color:#DDDDDD;}
.utility-empty {padding:16px 10px; color:#AAAAAA;}
.utility-status {display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:26px; padding:3px 8px; background:#333333; border-top:1px solid #454545; flex:none; color:#AAAAAA; font-size:12px;}
html[data-pbx-display="utility"] .toast {background:#333333; border:1px solid #454545; border-radius:0; box-shadow:none; backdrop-filter:none;}
@media(max-width:720px) {
  .utility-filters {flex-wrap:wrap; gap:6px;}
  .utility-filters select {width:calc(50% - 55px); max-width:none; flex:1;}
  .utility-filters input {flex-basis:100%; width:100%;}
  html[data-pbx-display="utility"] .daily-grid {grid-template-columns:repeat(auto-fill,minmax(180px,1fr));}
  html[data-pbx-display="utility"] .topnav-user .header-role {display:none;}
  .utility-status {flex-wrap:wrap; gap:4px;}
}

.utility-load-error {display:flex; align-items:center; gap:16px; padding:12px 10px; border-bottom:1px solid #454545;}
.utility-load-error span {color:#E47777;}
.utility-thumb-state {position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#AAAAAA; font-size:12px; background:#252525;}
.utility-thumb-state.failed {color:#E5A34E;}