/* Shared dashboard finish: ordinary controls, readable rows, restrained color. */
:root {
  --ink: #202830;
  --muted: #586370;
  --blue: #2458b4;
  --line: #d8dde3;
  --bg: #f4f5f6;
  --radius: 6px;
}

body {font-size:14px;line-height:1.5}
.sidebar {width:220px;background:#f8f9fa;padding:24px 12px;color:#505a66}
.brand {font-size:20px;font-weight:700;letter-spacing:-.45px;gap:9px;padding:0 12px}
.brandmark {width:28px;height:28px;border-radius:0;background:transparent;object-fit:contain}
.workspace {margin:24px 0 16px;padding:16px 12px 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent}
.workspace strong {font-size:13px;color:#343e49;font-weight:600}
.workspace small {font-size:12px;color:#66717e;margin-top:4px}
.workspace small:before,.nav-caption {display:none}
.nav {font-size:14px;font-weight:500;min-height:41px;margin:2px 0;padding:10px 12px;border-radius:4px;color:#424e5c;gap:10px}
.nav:hover {background:#e9edf1;color:#202830}
.nav.active {background:#e7edf6;color:#17478f;box-shadow:inset 3px 0 #2458b4;font-weight:600}
.nav svg {width:17px;height:17px;stroke-width:1.5}
.nav b {background:transparent;color:#465b79;border-radius:0;padding:0;font-size:12px;font-weight:500;min-width:18px}
.sidebar-bottom {padding:18px 12px 0}
.sidebar-bottom strong,.sidebar-bottom p {font-size:11px;color:#65707d}
.shell {margin-left:220px}
.shell>header,body.student-body>header {height:58px;background:#fff;padding:0 32px}
.breadcrumb {font-size:12px;color:#626d79}
.breadcrumb strong {font-weight:600;color:#3d4753}
.breadcrumb span {margin:0 10px;color:#8b939e}
.local-tag {border:0;background:transparent;border-radius:0;padding:0;font-size:10px;color:#66717e;letter-spacing:.3px}
.local-tag:before {display:none}
main {padding:28px 32px 22px}
.page-heading {margin-bottom:22px}
h1 {font-size:27px;font-weight:650;letter-spacing:-.65px;margin-bottom:7px}
h2 {font-size:16px;font-weight:600;letter-spacing:-.1px}
h3 {font-size:14px;font-weight:600}
.page-heading p {font-size:13px;color:#5d6875;line-height:1.6}
.policy-dashboard .eyebrow,.teacher-dashboard .eyebrow,.district-dashboard .eyebrow,.student-body .eyebrow {display:none}
.heading-note {font-size:12px;color:#66717e}
.card,.tip-card,.category-panel {border-color:var(--line);box-shadow:none;border-radius:6px}
.card,.tip-card {padding:22px}
.button {border:1px solid #bdc6d0;border-radius:4px;background:#fff;color:#334254;font-size:13px;font-weight:550;min-height:36px;padding:8px 13px;box-shadow:none}
.button:hover {background:#f0f3f6;border-color:#9cabbc}
.button.primary {background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:none}
.button.primary:hover {background:#194996;border-color:#194996}
.button.danger {background:#fff;border-color:#d7b5b5;color:#973333}
.button.danger:hover {background:#fff3f3;border-color:#bf9292}
.button>svg {display:none}
input:not([type=checkbox]):not([type=radio]),select,textarea {background:#fff;border-color:#b9c3ce;border-radius:4px;color:#25313d;font-size:13px}
input::placeholder,textarea::placeholder {color:#7b858f;opacity:1}
input[type=checkbox],input[type=radio] {accent-color:var(--blue)}
.switch {width:34px;height:20px}
.switch span:after {width:14px;height:14px;box-shadow:none}
.switch input:checked+span:after {transform:translateX(14px)}
.switch input:checked+span {background:var(--blue)}
.notice {font-size:13px;line-height:1.6;padding:11px 14px;border:1px solid #d3ddeb;border-left:3px solid #5576a3;background:#f3f6fa;color:#405575;border-radius:4px;margin-bottom:20px}
.notice.error {border-color:#e2c8c8;border-left-color:#a54b4b;background:#fff7f7;color:#913c3c}
.status-card {padding:16px 20px;border-radius:6px;gap:12px}
.status-dot,.status-card.paused .status-dot {width:10px;height:10px;border-radius:0;background:transparent}
.status-dot:after {width:8px;height:8px;border:0;box-shadow:none;background:#2f8055}
.paused .status-dot:after {background:#78838f;border:0}
.status-text h2 {font-size:14px;color:#25313d}
.status-text p {font-size:12px;color:#606c79;margin-top:3px}
.filter-control>span {font-size:12px;color:#465261}
.stats {gap:0;margin:18px 0 24px;border:1px solid var(--line);border-radius:6px;background:#fff;overflow:hidden}
.stats>div {border:0;border-right:1px solid var(--line);border-radius:0;background:transparent;padding:17px 20px}
.stats>div:last-child {border-right:0}
.stats>div>span {font-size:12px;color:#4c5865;font-weight:500}
.stats strong {font-size:27px;font-weight:600;letter-spacing:-.6px;margin:8px 0 5px}
.stats strong span {font-size:15px;color:#78828e}
.stats small {font-size:11px;color:#687582;max-width:none;line-height:1.6}
.stat-icon {display:none}
.section-title {padding:18px 20px}
.section-title h2 {font-size:15px}
.section-title p {font-size:12px;color:#65717f;margin-top:4px}
.subtle-chip {background:transparent;padding:0;border-radius:0;color:#66717e;font-size:12px}
.table-head,.category-card {grid-template-columns:minmax(160px,1fr) 110px 90px 40px;gap:16px;padding-left:20px;padding-right:20px}
.table-head {font-size:12px;text-transform:none;letter-spacing:0;background:#f7f8fa;color:#586575;padding-top:10px;padding-bottom:10px}
.category-card {padding-top:14px;padding-bottom:14px;border-color:#e6e9ed}
.category-text {gap:10px}
.category-text h3 {font-size:14px;font-weight:550;color:#263340}
.category-text p {font-size:12px;color:#66717e;margin-top:2px}
.category-text .category-icon {width:24px;height:24px;border-radius:0;background:transparent;color:#5c6a7a}
.category-text .category-icon svg {width:19px;height:19px}
.domain-link {font-size:12px;color:#2458b4;background:transparent}
.state-chip,.state-chip.off {background:transparent;padding:0;border-radius:0;color:#32704b;font-size:12px;font-weight:500}
.state-chip.off {color:#697481}
.overview-bottom {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;margin-top:20px}
.tester h2,.tip-card h2 {font-size:15px}
.tester p,.tip-card ol {font-size:12px;color:#5f6d7b;line-height:1.8}
.tip-card {background:#f8f9fa}
.tip-card ol {padding-left:18px;margin-bottom:14px}
.text-button {font-size:12px;font-weight:550;color:var(--blue)}
.footnote {font-size:12px;color:#63707e;line-height:1.7}
.education-control p,.education-summary p,.mode-card p,.settings-card p,.inspection-card p,.youtube-card p {font-size:13px;color:#5c6977}
.education-control h2,.education-summary h2,.settings-card h2,.mode-card h2 {font-size:15px}
.education-toolbar {padding:16px 20px;gap:12px}
.education-results,.education-pagination {font-size:12px;color:#536271}
.education-table th {font-size:12px;text-transform:none;letter-spacing:0;background:#f7f8fa;color:#465563}
.education-table td {font-size:13px;color:#455362}
.education-table td:first-child {font-weight:500;color:#27333f}
.education-table th,.education-table td {padding:13px 20px}
.education-panel .education-domain {font-size:12px}
.rule-title h2 {font-size:15px}
.domain-list {font-size:13px}
.rule-columns>section>p {font-size:12px;color:#63707e}
.mode-card select {font-size:13px}
.youtube-chip {background:transparent;border:0;border-radius:0;font-size:12px;color:#425b7c;padding:0}
.youtube-modes {gap:10px}
.youtube-modes legend {font-size:12px;text-transform:none;letter-spacing:0;color:#475566}
.youtube-modes>label {border-color:#d5dce5;border-radius:5px;padding:16px;background:#fff}
.youtube-modes>label:has(input:checked) {background:#f3f6fa;border-color:#5579aa;box-shadow:none}
.youtube-modes strong {font-size:13px}
.youtube-modes small {font-size:12px;color:#5d6e7f}
.youtube-categories label {font-size:13px;color:#485766}
.youtube-card form>label,#inspection-exceptions-form>label {font-size:13px;color:#374756}
.inspection-status {color:#357149}
.info-row {font-size:13px;color:#4b5866}
.info-row strong {font-weight:550;color:#2d3d4c}
.toast {border-radius:5px;font-size:13px;box-shadow:0 2px 8px #0002}
dialog {border-radius:6px;box-shadow:0 8px 35px #0002}
footer {font-size:11px;color:#6a7581;padding:18px 0}

/* Classroom and student-list pages use the same controls and row rhythm. */
.class-setup-layout {grid-template-columns:minmax(0,1fr) 220px;gap:24px}
.roster-section-heading {margin-bottom:20px}
.roster-section-heading p {font-size:13px;color:#606e7d}
.viewing-form {gap:18px}
.viewing-form label,.enrollment-panel label {font-size:13px;color:#374654;font-weight:500}
.field-help {font-size:12px;color:#697481;font-weight:400}
.form-section {padding-top:20px;gap:18px}
.form-section legend {font-size:13px;font-weight:600;letter-spacing:0;color:#354351}
.viewing-form .class-website-fields {background:#f8f9fa;border-color:#d6dde5;border-radius:5px;padding:18px}
.class-website-fields legend {font-size:13px;color:#354351}
.class-website-fields p {font-size:12px;color:#64717f;line-height:1.7}
.viewing-form .inline-check,.inline-check {font-size:13px;color:#344654}
.viewing-form textarea,.class-policy-form textarea {font-size:13px;line-height:1.65}
.form-actions>span {font-size:12px;color:#626f7d}
.setup-help-link {font-size:12px;font-weight:550;color:var(--blue)}
.setup-aside {padding:21px 0 0 20px;border-left:1px solid var(--line)}
.setup-aside h2 {font-size:14px;color:#354351}
.setup-aside>p {font-size:12px;color:#677482;margin:8px 0 20px}
.setup-steps {list-style:decimal;padding-left:18px}
.setup-steps li {padding:0 0 18px 2px;color:#637182;font-size:12px}
.setup-steps li:before {display:none}
.setup-steps strong {font-size:12px;font-weight:600;color:#384a5c}
.setup-steps p {font-size:12px;color:#657584;line-height:1.65;margin-top:5px}
.setup-aside .aside-note {font-size:12px;line-height:1.7;color:#637384}
.class-bar,.class-websites-panel {padding:18px 20px;border-radius:6px}
.class-bar h2 {font-size:19px;font-weight:600;letter-spacing:-.3px}
.class-bar p,.class-websites-panel p {font-size:13px;color:#596b7d}
.join-code small {font-size:10px;color:#657383;letter-spacing:.3px}
.join-code strong {color:#344b68;font-size:16px}
.class-websites-panel h2 {font-size:14px}
.class-websites-panel:has(.policy-editor:not([open])) {flex-direction:row;align-items:center;gap:20px}
.class-websites-panel .policy-editor:not([open]) {width:auto;flex:0 0 auto}
.policy-editor:not([open])>summary {text-align:right}
.policy-editor>summary {font-size:12px}
.class-policy-form>label {font-size:13px;color:#374a5c}
.class-toolbar h2 {font-size:16px;font-weight:600}
.class-toolbar {flex-direction:row;align-items:center;flex-wrap:wrap;gap:16px}
.class-toolbar h2 span {background:transparent;padding:0;font-size:12px;color:#5e7184;border-radius:0;margin-left:8px}
.grid-tools>label,.grid-tools>span,.grid-tools select {font-size:12px;color:#52667a}
.grid-tools .button {font-size:12px;padding:7px 11px}
.student-screen {border-color:#cdd6df;border-radius:6px;box-shadow:none}
.student-screen:hover {border-color:#aab9c8;box-shadow:none}
.screen-heading,.compact .screen-heading {padding:12px}
.screen-heading strong,.compact .screen-heading strong {font-size:13px;font-weight:550;color:#293b4e}
.student-avatar,.compact .student-avatar {background:#edf0f3;color:#43566b;border-radius:4px;width:23px;height:23px;font-size:10px}
.screen-status,.compact .screen-status {font-size:10px;padding:0;border-radius:0;background:transparent;color:#865c27}
.screen-status.live {background:transparent;color:#337147}
.screen-controls,.compact .screen-controls {background:#f8f9fa;padding:8px 10px;gap:8px}
.screen-controls .button,.compact .screen-controls .button {border-radius:4px;font-size:11px;min-height:29px;padding:4px 8px}
.screen-placeholder {font-size:12px;color:#5c7084}
.empty-class {border-style:solid;border-color:#d4dce5;border-radius:6px;padding:45px 24px}
.empty-class h2 {font-size:16px;color:#425971}
.empty-class p {font-size:13px;color:#647789}
.empty-icon {background:transparent;color:#728498;border-radius:0;width:30px;height:30px;margin-bottom:16px}
.share-status {font-size:15px;font-weight:600;color:#5d7185}
.share-status.live {background:#f1f7f2;color:#347148;border-color:#d5e5d9;border-radius:5px}
.managed-viewing-card p {font-size:13px;color:#5b6d80}
.managed-setting {background:#f7f8fa;border-color:#d7dfe8;color:#51677e;border-radius:4px;font-size:12px}
.enrollment-panel p,.google-student-entry p {font-size:13px;color:#5e7185}
.enrollment-class {border-radius:5px;padding:14px}
.enrollment-class small {font-size:12px;color:#667a8d}
.roster-stats {gap:12px}
.roster-stats>div {padding:16px 20px;border-radius:5px}
.roster-stats strong {font-size:26px;font-weight:600;letter-spacing:-.5px}
.roster-stats span {font-size:12px;color:#586a7b}
.roster-table-wrap {border-radius:4px;border-color:#d4dde5}
.roster-table th {font-size:12px;letter-spacing:0;text-transform:none;background:#f7f8fa;color:#415467}
.roster-table td {font-size:13px;color:#465d72}
.roster-table td:nth-child(2) {color:#293d50;font-weight:550}
.roster-table td:first-child {font-size:12px;color:#576e85}
.roster-table th,.roster-table td {padding:12px 16px}
.roster-search label {font-size:12px;color:#465b70}
.roster-import .viewing-form>p,.roster-import .inline-check {font-size:12px}
.roster-pagination,.roster-group-list {font-size:12px;color:#5a7186}
.google-sync-card p {font-size:13px}
#roster-file {font-size:12px;border-style:solid;background:#f8f9fa}
#roster-file::file-selector-button {border-radius:4px;color:#405b77}
.guide-intro {border-radius:6px;background:#f4f7fa;border-color:#d5dfea}
.guide-steps>li:before {border-radius:4px;background:#edf1f6;color:#49617e}

@media(max-width:1100px) {
  .sidebar {width:198px}
  .shell {margin-left:198px}
  main {padding:26px 24px 22px}
  .shell>header {padding:0 24px}
  .class-setup-layout {grid-template-columns:minmax(0,1fr) 190px;gap:20px}
  .table-head,.category-card {grid-template-columns:minmax(130px,1fr) 95px 80px 36px;gap:12px}
}
@media(max-width:1000px) {.class-setup-layout {grid-template-columns:1fr}}
@media(max-width:950px) {.overview-bottom {grid-template-columns:1fr}}
@media(max-width:850px) {
  .table-head,.category-card {grid-template-columns:minmax(130px,1fr) 90px 36px}
  .stats>div {padding:16px}
  .category-text .category-icon {display:none}
}
@media(max-width:760px) {
  .sidebar {position:static;width:auto;padding:16px 20px 12px;border-right:0;border-bottom:1px solid var(--line)}
  .brand {padding:0;font-size:20px}
  .workspace,.sidebar-bottom,.nav-caption {display:none}
  .sidebar nav {display:flex;flex-wrap:wrap;gap:3px;margin-top:14px}
  .nav {width:auto;flex:1 1 auto;min-width:fit-content;margin:0;padding:8px 10px;font-size:12px;min-height:36px;justify-content:center;gap:7px}
  .nav svg {width:15px;height:15px}
  .nav.active {box-shadow:inset 0 -2px #2458b4}
  .shell {margin-left:0}
  .shell>header,body.student-body>header {height:50px;padding:0 20px}
  main {padding:24px 20px 20px}
  .heading-note {display:none}
  .class-websites-panel:has(.policy-editor:not([open])) {flex-direction:column;align-items:flex-start;gap:14px}
  .policy-editor:not([open])>summary {text-align:left}
}
@media(max-width:620px) {
  h1 {font-size:25px}
  .page-heading p {font-size:13px}
  .page-heading>.button {font-size:12px;padding:8px 10px}
  .stats {gap:0}
  .stats>div {padding:14px 12px}
  .stats>div>span,.stats small {font-size:11px}
  .stats>div>span {min-height:33px}
  .stats strong {font-size:25px;margin:7px 0}
  .section-title,.table-head,.category-card {padding-left:16px;padding-right:16px}
  .table-head,.category-card {grid-template-columns:minmax(100px,1fr) 82px 34px;gap:10px}
  .category-text h3 {font-size:13px}
  .category-text p {font-size:11px}
  .domain-link {font-size:11px}
  .card,.tip-card {padding:19px 17px}
  .status-card {padding:15px;align-items:flex-start;gap:10px}
  .status-dot {margin-top:6px}
  .status-text p {font-size:12px}
  .filter-control {padding-top:4px}
  .filter-control>span {display:none}
  .viewing-form label,.inline-check,.viewing-form .inline-check {font-size:13px}
  .class-website-fields p,.form-actions>span,.footnote {font-size:12px}
  .class-toolbar h2 span {font-size:12px}
  .screen-controls .button,.compact .screen-controls .button {font-size:12px;min-height:32px}
  .roster-stats>div {padding:14px 11px}
  .roster-stats span {font-size:11px}
  .roster-stats strong {font-size:24px}
  .roster-table th,.roster-table td {padding:12px}
  .info-row {font-size:12px;gap:15px}
  .info-row strong {text-align:right}
}
@media(max-width:380px) {
  .stats {grid-template-columns:1fr}
  .stats>div {border-right:0;border-bottom:1px solid var(--line)}
  .stats>div:last-child {border-bottom:0}
  .stats strong {grid-row:1/3;grid-column:2;margin:0}
  .stats>div>span {min-height:0}
  .category-text p {display:none}
}
