/* CHERT Bell — product styles on top of chert-tokens.css (no hardcoded hex) */
.header{position:sticky;inset-block-start:0;z-index:var(--z-sticky);height:var(--header-h);display:flex;align-items:center;justify-content:space-between;padding-inline:var(--gutter);background:var(--chert-cream);border-block-end:1px solid var(--chert-border)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--chert-ink)}
.brand img{height:32px;width:auto}.brand b{font-weight:800;letter-spacing:.02em}.brand span{color:var(--chert-muted);font-size:var(--fs-sm)}
.container{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--space-7)}
.card{background:var(--chert-surface);border:1px solid var(--chert-border);border-radius:var(--radius-card);padding:28px;box-shadow:var(--shadow-card)}
.btn{font-family:inherit;font-size:var(--fs-sm);font-weight:700;padding:11px 22px;border-radius:var(--radius-sm);border:none;cursor:pointer;transition:background var(--dur-base) var(--ease),transform var(--dur-base) var(--ease);min-height:44px}
.btn--primary{background:var(--chert-orange);color:var(--chert-ink)}.btn--primary:hover{background:var(--chert-orange-deep);transform:translateY(-1px)}
.btn--secondary{background:transparent;border:1.5px solid var(--chert-ink);color:var(--chert-ink)}.btn--secondary:hover{background:var(--chert-ink);color:var(--chert-cream)}
.btn--danger{background:var(--chert-error);color:#fff}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn--lg{padding:14px 28px;font-size:var(--fs-base)}
.input{width:100%;height:44px;padding:10px 14px;font-family:inherit;font-size:var(--fs-base);background:var(--chert-surface);border:1px solid var(--chert-border);border-radius:var(--radius-sm);color:var(--chert-ink)}
.input:focus{outline:none;border-color:var(--chert-orange);box-shadow:0 0 0 3px rgba(255,134,81,.25)}
.label{display:block;font-size:var(--fs-sm);font-weight:600;margin-block-end:6px}
.row{display:flex;gap:var(--space-3);flex-wrap:wrap}.row>*{flex:1 1 160px}
.actions{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-block-start:var(--space-4)}
.status{display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-sm);font-weight:600}
.dot{width:10px;height:10px;border-radius:50%;background:var(--chert-muted)}.dot--ok{background:var(--chert-success)}.dot--busy{background:var(--chert-warning)}.dot--err{background:var(--chert-error)}
.log{background:var(--chert-surface-alt);border:1px solid var(--chert-border);border-radius:var(--radius-sm);padding:12px;height:180px;overflow:auto;font-family:var(--font-mono);font-size:var(--fs-xs);white-space:pre-wrap;margin-block-start:var(--space-4)}
.callout{border-inline-start:4px solid var(--chert-orange-deep);background:var(--chert-orange-tint);padding:var(--space-4);border-radius:var(--radius-sm)}
.chert-star{width:26px;height:26px}.loader{animation:chert-spin 1.2s linear infinite;color:var(--chert-orange)}@keyframes chert-spin{to{transform:rotate(360deg)}}
.grid{display:grid;grid-template-columns:1fr;gap:var(--space-5)}@media(min-width:768px){.grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){main>.grid{grid-template-columns:repeat(3,1fr)}}
.footer{padding-block:var(--space-6);color:var(--chert-muted);font-size:var(--fs-xs);border-block-start:1px solid var(--chert-border)}
.lang{background:none;border:1px solid var(--chert-border-strong);border-radius:var(--radius-pill);padding:6px 14px;font:inherit;font-size:var(--fs-xs);cursor:pointer;color:var(--chert-ink)}
h1{font-size:var(--fs-h2);margin:0 0 var(--space-2)}h2{font-size:var(--fs-h3);margin:0 0 var(--space-2)}p{margin:0 0 var(--space-3)}

[hidden]{display:none!important}
.table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}.table th{text-align:start;font-weight:600;color:var(--chert-muted);padding:8px 6px;border-block-end:1px solid var(--chert-border)}.table td{padding:8px 6px;border-block-end:1px solid var(--chert-border);vertical-align:middle}.table tr:nth-child(even) td{background:var(--chert-surface-alt)}.num{direction:ltr;unicode-bidi:isolate;font-family:var(--font-mono);font-size:var(--fs-xs)}.tag{display:inline-block;padding:2px 8px;border-radius:var(--radius-pill);font-size:var(--fs-xs);font-weight:600}.tag--miss{background:var(--chert-error-tint);color:var(--chert-ink)}.tag--ok{background:var(--chert-success-tint)}.wrap{overflow-x:auto}audio{width:160px;height:32px}
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-4)}@media(min-width:768px){.tiles{grid-template-columns:repeat(4,1fr)}}
.tile{background:var(--chert-surface);border:1px solid var(--chert-border);border-radius:var(--radius-card);padding:var(--space-4) var(--space-5);box-shadow:var(--shadow-card)}
.tile__v{font-size:var(--fs-h1);font-weight:800;line-height:var(--lh-tight);font-variant-numeric:tabular-nums}.tile__l{color:var(--chert-muted);font-size:var(--fs-sm);margin-block-start:4px}
.tile--alert .tile__v{color:var(--chert-error)}.tile--good .tile__v{color:var(--chert-success)}
/* --- agent profile charts (colors from CHERT tokens; answered/missed are status colors) --- */
.profile-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}
.bell-chart{direction:ltr}
.bell-chart svg{display:block;width:100%;height:auto}
.bell-chart .axis{stroke:var(--chert-border);stroke-width:1}
.bell-chart .tick{fill:var(--chert-muted);font:11px var(--font-mono)}
.bell-chart .dlabel{fill:var(--chert-ink);font:600 11px var(--font-ui)}
.legend{display:flex;gap:var(--space-4);font-size:var(--fs-xs);color:var(--chert-muted);margin-block-start:6px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-inline-end:6px;vertical-align:-1px}
.chart-tip{position:fixed;z-index:var(--z-toast);background:var(--chert-ink);color:var(--chert-cream);font:12px/1.4 var(--font-ui);padding:6px 10px;border-radius:var(--radius-sm);pointer-events:none;white-space:nowrap}
tr.rowlink{cursor:pointer}tr.rowlink:hover td{background:var(--chert-orange-tint)}
