/* Interface refinement: readable operational screens and stable interactions. */
:root { --muted:#a5b6cd; --line:rgba(153,185,225,.24); --radius:16px; }
body { line-height:1.6; }
body:before { opacity:.08; }
body:after { display:none; }
.topbar nav a { color:#b2c3d9; }
.sidebar-label,.sidebar-foot { color:#a5b6cd; }
.topbar nav a.active { background:#132941; box-shadow:inset 3px 0 #79ceff; }
.card { background:linear-gradient(145deg,#0d2035,#091727); box-shadow:0 8px 28px rgba(0,0,0,.16); }
.card-head { gap:12px; }
.field>label { color:#d9e7f5; }
input::placeholder,textarea::placeholder { color:#9badc5; opacity:1; }
:is(a,button,input,select,textarea,summary):focus-visible { outline:3px solid #9acbff; outline-offset:3px; }
.btn,.cc-btn { min-height:44px; }
.btn:disabled,button:disabled { opacity:.65; cursor:not-allowed; }
.tabs { gap:8px; overflow-x:auto; }
.tabs a { color:#b0c2da; min-height:44px; display:inline-flex; align-items:center; white-space:nowrap; }
.tabs a.active { color:#a7ddff; }
.metric-card>span,.metric-card small,.tile-sub,.flow-card small,
.settings-revision,.variable-count,.variable-kind,.variable-source { color:#a5b6cd!important; }
.projects-hero p,.project-hero p,.launch-intro p,.auth-story p { color:#b1c3da; }
.auth-content>.card { background:linear-gradient(145deg,#0d2035,#091727); }
.auth-content .field>label { color:#d9e7f5; }
.auth-points span { color:#bed0e5; }
.cc-main { --cc-muted:#a5b6cd; --cc-line:rgba(153,185,225,.24); }
.cc-kicker,.section-kicker { color:#96ceff; font-size:12px; }
.cc-stat-label { color:#b1c3da; font-size:12px; }
.cc-stat small,.cc-visual-copy small,.cc-machine-name small,.cc-latency,
.cc-action small,.cc-project-name small,.cc-health-item>small,.cc-event-copy small,
.cc-event-row time,.cc-gauge-head span,.cc-gauge small,.cc-empty { color:#a5b6cd; font-size:12px; }
.cc-machine-name strong,.cc-project-name strong,.cc-action strong,.cc-event-copy strong { font-size:14px; }
.cc-btn,.cc-text-link { font-size:13px; }
.cc-text-link { min-height:44px; align-items:center; }
.cc-pill { font-size:11px; padding:5px 9px; }
.cc-machine-row,.cc-project-row,.cc-event-row { padding:14px 0; }
.cc-health-item>strong { font-size:12px; }
.cc-health-item>small { max-width:120px; }
.cc-machine-name small,.cc-project-name small,.cc-event-copy small { white-space:normal; overflow-wrap:anywhere; }
.cc-panel { padding:20px; }
.cc-stats,.cc-upper-grid,.cc-action-grid,.cc-lower-grid { gap:16px; margin-bottom:16px; }
.cc-hero h1 { line-height:1.12; }
.cc-hero p { font-size:16px; }
.cc-wave i,.badge.ok,.cc-pill.ok,.cc-live-badge i { animation:none; }
.cc-btn:hover,.cc-action:hover,.cc-stat:hover,
body.cinematic-ready [data-cinematic-bound="1"]:hover { transform:none; }
@media(max-width:640px) {
  .topbar nav {
    display:grid;
    grid-auto-flow:row;
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .topbar nav a { padding-inline:6px; }
  .settings-index {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    overflow:visible;
    padding-bottom:0;
  }
  .settings-index .btn {
    width:100%;
    min-width:0;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .cc-panel,.card { padding:16px; }
  .cc-hero { gap:16px; }
  .cc-hero h1 { font-size:32px; }
  .cc-stats,.cc-action-grid { gap:10px; }
  .cc-machine-row { grid-template-columns:10px minmax(0,1fr) auto; }
  .cc-latency { grid-column:2; }
  .cc-event-row { grid-template-columns:auto minmax(0,1fr); }
  .cc-event-row time { grid-column:2; }
  .cc-project-row { gap:8px; }
  .cc-pill { white-space:normal; }
  .cc-gauge { grid-template-columns:80px minmax(0,1fr); }
  .cc-gauge small { grid-column:2; text-align:left; }
  .cc-health-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  .card-grid { grid-template-columns:minmax(0,1fr); }
}
@media(prefers-reduced-motion:reduce) {
  body.cinematic-ready [data-cinematic-bound="1"] { transform:none!important; }
}

/* Unread counts are counters, not service-status indicators. Keep the existing
   navigation grid and let unusually long counts wrap instead of clipping. */
.topbar nav a[href="#/notifications"] { flex-wrap:wrap; row-gap:0; }
.topbar nav a[href="#/notifications"] .badge {
  padding:.15rem .35rem;
  min-width:1.5rem;
  justify-content:center;
  flex-shrink:0;
}
.topbar nav a[href="#/notifications"] .badge::before { display:none; }

/* Deployment preparation keeps evidence readable without hiding release history. */
.deployment-preparation { min-width:0; }
.deployment-preparation .deployment-checks { display:grid; grid-template-columns:1fr; gap:10px; list-style:none; padding:0; margin:0; }
.deployment-preparation .deployment-checks>li { border:1px solid var(--border,#25364b); border-radius:10px; padding:12px; min-width:0; }
.deployment-preparation .deployment-checks p { margin:8px 0 0; overflow-wrap:anywhere; }
.deployment-preparation .release-image { overflow-wrap:anywhere; word-break:break-word; }
.deployment-preparation select { width:100%; min-width:0; }
.deployment-preparation .release-actions { display:flex; flex-wrap:wrap; gap:8px; }
@media(min-width:760px) { .deployment-preparation .deployment-checks { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:480px) { .deployment-preparation .release-actions>button { width:100%; } }