.cbar { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,0.88);
  backdrop-filter: blur(16px) saturate(1.3); -webkit-backdrop-filter: blur(16px) saturate(1.3);
  border-bottom: 1px solid var(--line); }
.cbar__inner { max-width: var(--maxw); margin-inline: auto; display: flex; align-items: center;
  gap: 1.2rem; padding: 0.7rem var(--gutter); }
.cbar__brand { display: inline-flex; align-items: baseline; gap: 0.35rem; }
.cbar__word { font-family: var(--display); font-weight: 600; font-size: 1.1rem; letter-spacing: -0.03em; color: var(--ink); }
.cbar__dot { color: var(--signal); font-weight: 600; }
.cbar__tag { margin-left: 0.35rem; }
.cbar__links { display: flex; gap: 0.1rem; margin-right: auto; margin-left: 0.6rem; }
.cbar__links a { font-size: 0.9rem; color: var(--muted); padding: 0.45rem 0.85rem; border-radius: var(--pill);
  transition: color 0.2s, background 0.2s; }
.cbar__links a:hover { color: var(--ink); background: var(--paper-2); }
.cbar__links a.is-active { color: var(--ink); background: var(--paper-3); }
.cbar__actions { display: flex; align-items: center; gap: 0.7rem; }
.cbar__actions .btn { padding: 0.5rem 1.05rem; font-size: 0.85rem; }
.cbar__who { color: var(--faint); }
.cbar__logout { display: inline; }
.cbar__signout { font-size: 0.82rem; color: var(--muted); padding: 0.4rem 0.4rem; }
.cbar__signout:hover { color: var(--ink); }

.cmain { padding-block: clamp(1.6rem, 4vw, 2.8rem) 5rem; }
.cpage { display: block; }
.cpage--narrow { max-width: 820px; }
.chead { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem;
  flex-wrap: wrap; margin-bottom: 1.8rem; }
.chead h1 { margin-top: 0.5rem; }
.chead .muted { margin-top: 0.5rem; max-width: 60ch; }
.cstat-row { display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap; }
.cstat { display: inline-flex; flex-direction: column; line-height: 1.1; }
.cstat b { font-family: var(--display); font-size: 1.35rem; color: var(--ink); }
.cstat i { color: var(--faint); font-size: 0.6rem; }

.cmsgs { margin-bottom: 1.4rem; display: grid; gap: 0.5rem; }
.cmsg { padding: 0.7rem 1rem; border-radius: var(--r-sm); font-size: 0.9rem; border: 1px solid var(--line-2); background: var(--paper-2); }
.cmsg--error { border-color: rgba(200,40,40,0.35); background: rgba(200,40,40,0.06); color: #a11; }
.cmsg--success { border-color: var(--signal-line); background: var(--signal-weak); color: var(--signal-ink); }
.cmsg--info { color: var(--muted); }

.cfilters { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 1.3rem; flex-wrap: wrap; }

.ctable-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r); background: var(--paper); box-shadow: var(--shadow-sm); }
.ctable { width: 100%; border-collapse: collapse; font-size: 0.9rem; min-width: 640px; }
.ctable thead th { text-align: left; font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--faint); font-weight: 400; padding: 0.85rem 1rem; border-bottom: 1px solid var(--line); }
.ctable tbody td { padding: 0.85rem 1rem; border-bottom: 1px solid var(--line); color: var(--ink-2); vertical-align: middle; }
.ctable tbody tr { cursor: pointer; transition: background 0.15s; }
.ctable tbody tr:hover { background: var(--paper-2); }
.ctable tbody tr:last-child td { border-bottom: 0; }
.ctable__sub { display: block; color: var(--faint); font-size: 0.6rem; margin-top: 2px; }
.ctable--mini { min-width: 0; font-size: 0.82rem; }
.ctable--mini td, .ctable--mini th { padding: 0.5rem 0.6rem; }

.chip { display: inline-block; font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.1em;
  text-transform: uppercase; padding: 0.28rem 0.6rem; border-radius: var(--pill); border: 1px solid var(--line-2); color: var(--muted); }
.chip--queued { color: var(--muted); }
.chip--running { color: var(--signal-ink); border-color: var(--signal-line); background: var(--signal-weak); }
.chip--done { color: var(--ok); border-color: rgba(10,143,91,0.3); background: rgba(10,143,91,0.06); }
.chip--failed { color: #a11; border-color: rgba(200,40,40,0.35); background: rgba(200,40,40,0.06); }
.tier { display: inline-block; font-size: 0.7rem; font-weight: 600; padding: 0.24rem 0.6rem; border-radius: var(--pill); }
.tier--winner { background: rgba(10,143,91,0.1); color: var(--ok); }
.tier--average { background: var(--paper-3); color: var(--muted); }
.tier--underperformer { background: rgba(200,40,40,0.08); color: #a11; }
.tier--unknown { background: var(--paper-3); color: var(--faint); }

.cempty { padding: clamp(2rem, 5vw, 3.5rem); text-align: center; }
.cempty .muted { max-width: 46ch; margin: 0.6rem auto 1.2rem; }

.cform { display: block; }
.careform { display: grid; gap: 1.2rem; }
.csection { padding: 1.3rem 1.4rem; }
.csection__title { font-size: 1.05rem; margin-bottom: 1rem; }
.csection__note { font-weight: 400; font-size: 0.72rem; margin-left: 0.4rem; }
.cfield { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.9rem; }
.cfield--wide { grid-column: 1 / -1; }
.cfield__label { color: var(--faint); }
.cinput { width: 100%; padding: 0.7rem 0.85rem; font: inherit; font-size: 0.92rem; color: var(--ink);
  background: var(--paper); border: 1px solid var(--line-2); border-radius: var(--r-sm); transition: border-color 0.2s, box-shadow 0.2s; }
.cinput:focus { outline: none; border-color: var(--signal); box-shadow: 0 0 0 3px var(--signal-weak); }
.cinput--sm { width: auto; min-width: 120px; padding: 0.5rem 0.7rem; font-size: 0.85rem; }
.cinput--area { resize: vertical; font-family: var(--sans); }
.cgrid { display: grid; gap: 0 1rem; }
.cgrid--2 { grid-template-columns: 1fr 1fr; }
.cgrid--3 { grid-template-columns: repeat(3, 1fr); }
.chelp { font-size: 0.82rem; margin-top: 0.2rem; }
.cactions { display: flex; align-items: center; gap: 1rem; margin-top: 0.4rem; }

.ctoggle { display: inline-flex; gap: 0.3rem; padding: 0.28rem; background: var(--paper-3); border-radius: var(--pill); margin-bottom: 1rem; }
.ctoggle__opt { position: relative; cursor: pointer; }
.ctoggle__opt input { position: absolute; opacity: 0; }
.ctoggle__opt span { display: inline-block; padding: 0.45rem 1rem; border-radius: var(--pill); font-size: 0.85rem; color: var(--muted); transition: background 0.2s, color 0.2s; }
.ctoggle__opt input:checked + span { background: var(--paper); color: var(--ink); box-shadow: var(--shadow-sm); }

.cfile { display: block; border: 1.5px dashed var(--line-3); border-radius: var(--r); padding: 1.4rem; cursor: pointer;
  transition: border-color 0.2s, background 0.2s; text-align: center; }
.cfile:hover, .cfile.is-drag { border-color: var(--signal); background: var(--signal-weak); }
.cfile__input { display: none; }
.cfile__face { display: flex; flex-direction: column; gap: 0.25rem; }
.cfile__name { color: var(--ink); font-family: var(--display); }

.crow { display: grid; grid-template-columns: 1fr 120px; gap: 0.7rem; margin-bottom: 0.6rem; }
.crow--hidden { display: none; }

.clogin { min-height: 82vh; display: grid; place-items: center; padding: 2rem var(--gutter); }
.clogin__card { width: 100%; max-width: 420px; padding: clamp(1.8rem, 4vw, 2.6rem); }
.clogin__title { margin-top: 0.8rem; }
.clogin__sub { margin: 0.5rem 0 1.4rem; font-size: 0.9rem; }
.clogin__submit { width: 100%; margin-top: 0.4rem; }

.cgrid--detail { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 1.2rem; align-items: start; }
.cpanel { padding: 1.3rem 1.4rem; }
.cpanel__h { color: var(--faint); margin: 1.3rem 0 0.7rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.cpanel__h:first-child, .cvideo + .cpanel__h { border-top: 0; padding-top: 0; margin-top: 0; }
.cvideo { width: 100%; border-radius: var(--r-sm); background: #000; max-height: 460px; }
.cmetrics { display: flex; flex-wrap: wrap; gap: 1.1rem; }
.cmetric { display: inline-flex; flex-direction: column; line-height: 1.15; }
.cmetric b { font-family: var(--display); font-size: 1.15rem; color: var(--ink); }
.cmetric i { color: var(--faint); font-size: 0.58rem; }
.ccomment { padding: 0.7rem 0; border-bottom: 1px solid var(--line); }
.ccomment:last-child { border-bottom: 0; }
.ccomment__text { font-size: 0.9rem; }
.ccomment__meta { display: flex; align-items: center; gap: 0.6rem; margin-top: 0.35rem; color: var(--faint); font-size: 0.62rem; }
.cdl { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem 1rem; }
.cdl > div { display: flex; justify-content: space-between; gap: 0.6rem; padding: 0.35rem 0; border-bottom: 1px solid var(--line); }
.cdl dt { color: var(--faint); font-size: 0.82rem; }
.cdl dd { color: var(--ink-2); font-size: 0.86rem; text-align: right; }

.cagg-total { color: var(--faint); margin-bottom: 1rem; }
.cgrid--insights { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.1rem; }
.cinsight { padding: 1.1rem 1.2rem; }

@media (max-width: 860px) {
  .cgrid--detail { grid-template-columns: 1fr; }
  .cbar__tag { display: none; }
}
@media (max-width: 620px) {
  .cbar__links { display: none; }
  .cbar__who { display: none; }
  .cgrid--2, .cgrid--3 { grid-template-columns: 1fr; }
  .chead { flex-direction: column; align-items: flex-start; }
  .crow { grid-template-columns: 1fr 90px; }
  .cdl { grid-template-columns: 1fr; }
}