.bc-accountability-shell { width: min(1480px, 100%); margin: 0 auto; padding: 24px 28px 76px; }
.bc-accountability-head { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 24px; align-items: end; margin-bottom: 18px; }
.bc-accountability-head h1 { margin: 0; color: var(--bc-ink); font: 400 clamp(32px, 4vw, 50px)/1.08 var(--bc-serif); letter-spacing: -.025em; }
.bc-role-tabs { display: flex; gap: 8px; margin-top: 16px; }
.bc-role-tab { min-height: 44px; padding: 9px 22px; border: 1px solid var(--bc-line-dark); border-radius: 6px; background: var(--bc-paper); font-weight: 750; cursor: pointer; }
.bc-role-tab[aria-selected="true"] { color: #fff; border-color: var(--bc-green-900); background: var(--bc-green-900); }
.bc-route-summary { padding: 17px 18px; background: var(--bc-paper); border: 1px solid var(--bc-line); border-radius: 8px; }
.bc-route-row { display: flex; align-items: center; gap: 10px; }
.bc-route-badge { padding: 5px 10px; color: #fff; background: var(--bc-green-900); border-radius: 4px; font-size: 12px; font-weight: 800; }
.bc-route-row strong { margin-left: auto; color: var(--bc-green-950); font: 400 28px/1 var(--bc-serif); }
.bc-route-meter { height: 8px; margin-top: 13px; overflow: hidden; background: #e7e9e6; border-radius: 999px; }
.bc-route-meter span { display: block; height: 100%; background: var(--bc-green-900); }
.bc-accountability-grid { display: grid; grid-template-columns: minmax(300px, .9fr) minmax(480px, 1.45fr) minmax(300px, .9fr); gap: 14px; align-items: start; }
.bc-accountability-column { display: grid; gap: 14px; }
.bc-account-card { padding: 18px; background: var(--bc-paper); border: 1px solid var(--bc-line); border-radius: 8px; box-shadow: var(--bc-shadow); }
.bc-account-card h2 { margin: 0; color: var(--bc-ink); font: 400 21px/1.25 var(--bc-serif); }
.bc-card-kicker { margin: 0 0 4px; color: var(--bc-muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.bc-focus { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; margin-top: 14px; padding: 15px; background: #f8f6f0; border: 1px solid var(--bc-line); border-radius: 6px; }
.bc-focus-time { display: block; color: var(--bc-green-950); font: 400 42px/1 var(--bc-serif); font-variant-numeric: tabular-nums; }
.bc-focus-state { display: block; margin-top: 4px; color: var(--bc-muted); font-size: 12px; }
.bc-task-list { display: grid; gap: 0; margin: 14px 0 0; border: 1px solid var(--bc-line); border-radius: 6px; }
.bc-task { display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; min-height: 58px; padding: 10px 12px; border-bottom: 1px solid var(--bc-line); }
.bc-task:last-child { border-bottom: 0; }
.bc-task-index { display: grid; width: 26px; height: 26px; place-items: center; color: #fff; background: var(--bc-green-900); border-radius: 50%; font-size: 11px; font-weight: 800; }
.bc-task a { color: var(--bc-ink); text-decoration: none; font-weight: 700; }
.bc-task input { width: 22px; height: 22px; accent-color: var(--bc-green-900); }
.bc-blocker-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 13px; }
.bc-blocker { display: flex; gap: 7px; align-items: center; min-height: 40px; padding: 7px 9px; border: 1px solid var(--bc-line); border-radius: 5px; font-size: 12px; cursor: pointer; }
.bc-blocker input { accent-color: var(--bc-green-900); }
.bc-blocker-note { width: 100%; min-height: 72px; margin-top: 9px; padding: 9px; border: 1px solid var(--bc-line-dark); border-radius: 5px; resize: vertical; }
.bc-metric-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin-top: 14px; overflow: hidden; background: var(--bc-line); border: 1px solid var(--bc-line); border-radius: 6px; }
.bc-account-metric { min-height: 88px; padding: 13px; background: #fbfaf6; }
.bc-account-metric strong { display: block; color: var(--bc-ink); font: 400 27px/1 var(--bc-serif); }
.bc-account-metric span { display: block; margin-top: 7px; color: var(--bc-muted); font-size: 10px; }
.bc-account-metric small { display: block; margin-top: 4px; color: var(--bc-green-800); font-size: 10px; }
.bc-trend { width: 100%; height: 225px; margin-top: 12px; overflow: visible; }
.bc-trend-grid { stroke: #e2e5e1; stroke-width: 1; }
.bc-trend-line { fill: none; stroke: var(--bc-green-900); stroke-width: 2; }
.bc-trend-point { fill: var(--bc-paper); stroke: var(--bc-green-900); stroke-width: 2; }
.bc-trend-label { fill: var(--bc-muted); font: 10px var(--bc-sans); }
.bc-timeline { display: grid; gap: 0; margin-top: 12px; }
.bc-timeline-row { display: grid; grid-template-columns: 75px 12px 1fr auto; gap: 9px; align-items: start; padding: 10px 0; border-bottom: 1px solid var(--bc-line); }
.bc-timeline-row:last-child { border-bottom: 0; }
.bc-timeline-time { color: var(--bc-muted); font-size: 10px; }
.bc-timeline-dot { width: 9px; height: 9px; margin-top: 5px; background: var(--bc-green-800); border-radius: 50%; }
.bc-timeline-copy strong { display: block; color: var(--bc-ink); font-size: 12px; }
.bc-timeline-copy span { color: var(--bc-muted); font-size: 11px; }
.bc-levels { display: grid; gap: 8px; margin-top: 12px; }
.bc-level { padding: 12px; border: 1px solid var(--bc-line); border-radius: 6px; }
.bc-level.is-current { border-color: var(--bc-green-800); background: #f3faf7; box-shadow: inset 4px 0 var(--bc-green-800); }
.bc-level strong { display: block; color: var(--bc-ink); font-size: 13px; }
.bc-level p { margin: 4px 0 0; color: var(--bc-muted); font-size: 11px; line-height: 1.45; }
.bc-consent-list { display: grid; gap: 10px; margin-top: 12px; }
.bc-consent { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding-bottom: 9px; border-bottom: 1px solid var(--bc-line); font-size: 12px; }
.bc-consent input { width: 38px; height: 20px; accent-color: var(--bc-green-900); }
.bc-role-view[hidden] { display: none !important; }
.bc-parent-view, .bc-teacher-view { grid-column: 1 / -1; }
.bc-role-panel-grid { display: grid; grid-template-columns: 1.1fr 1fr 1fr; gap: 14px; }
.bc-queue-table { width: 100%; border-collapse: collapse; margin-top: 12px; font-size: 12px; }
.bc-queue-table th, .bc-queue-table td { padding: 9px; border-bottom: 1px solid var(--bc-line); text-align: left; }
.bc-debug { margin-top: 14px; padding: 12px; color: #43545c; background: var(--bc-blue-soft); border: 1px solid #c7d4da; border-radius: 6px; font: 11px/1.5 var(--bc-mono); white-space: pre-wrap; }
@media (max-width: 1120px) { .bc-accountability-grid { grid-template-columns: 1fr 1fr; } .bc-accountability-column:last-child { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; } .bc-route-summary { min-width: 0; } }
@media (max-width: 760px) { .bc-accountability-shell { padding: 18px 14px 72px; } .bc-accountability-head, .bc-accountability-grid, .bc-role-panel-grid { grid-template-columns: 1fr; } .bc-accountability-column:last-child { grid-column: auto; grid-template-columns: 1fr; } .bc-role-tabs { overflow-x: auto; } .bc-role-tab { flex: 1 0 125px; } .bc-metric-row { grid-template-columns: 1fr 1fr; } .bc-focus { grid-template-columns: 1fr; } .bc-focus .bc-btn { width: 100%; } }