/* The shared macOS / iOS language used by every Standards screen. */
:root {
 --accent: #007aff;
 --accent-hover: #0067db;
 --accent-soft: #edf5ff;
 --bg: #f5f5f7;
 --surface: #fff;
 --ink: #1d1d1f;
 --secondary: #62626a;
 --muted: #86868b;
 --line: #e8e8ed;
 --blue: #007aff;
 --blue-soft: #edf5ff;
 --sage: #248a3d;
 --sage-soft: #edf8ef;
 --orange: #b46b00;
 --orange-soft: #fff5e5;
 --red: #d70015;
 --red-soft: #fff0f1;
 --purple: #73737c;
 --radius: 25px;
 --shadow: 0 3px 18px rgb(0 0 0 / 2%);
}
::selection { color: #1d1d1f; background: #d8eaff; }
:focus-visible { outline: 3px solid #8cc1ff; outline-offset: 4px; }
body { letter-spacing: -.01em; }
h1 { font-size: clamp(30px, 2.75vw, 38px); font-weight: 600; letter-spacing: -1.45px; }
.page-heading { padding-top: 34px; padding-bottom: 28px; }
.eyebrow { color: #898990; font-size: 10px; letter-spacing: 1.4px; }
.subtitle { font-size: 13px; color: #85858c; }
.panel { border-color: #ededf1; background: #fff; border-radius: 25px; box-shadow: var(--shadow); }
.panel-heading h2, .card-top h2, .section-title, .section-heading h2 { color: var(--ink); font-size: 16px; font-weight: 600; letter-spacing: -.4px; }
.panel-heading, .card-top { padding: 24px 25px 19px; }
.app-footer { color: #929299; border-color: #e8e8ed; font-size: 10px; }

/* A translucent navigation rail, with blue as the single action accent. */
.sidebar { background: rgb(247 247 249 / 87%); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); border-right-color: #e4e4e9; }
.brand { color: var(--ink); letter-spacing: -1.05px; }
.brand-mark { background: #1d1d1f; border-radius: 11px; }
.brand-mark i:last-child { background: #70b1ff; }
.brand-period { color: var(--accent); }
.restaurant-switch { padding: 13px 12px; background: rgb(255 255 255 / 75%); border-color: #e9e9ee; border-radius: 15px; box-shadow: 0 1px 3px rgb(0 0 0 / 1%); }
.restaurant-switch:hover { background: #fff; }
.restaurant-symbol { color: #686871; background: #f0f0f3; border: 0; border-radius: 10px; }
.restaurant-switch strong { color: #303035; font-size: 12px; }
.restaurant-switch small, .nav-label { color: #8b8b92; }
.nav-item { color: #6c6c74; border-radius: 12px; }
.nav-item:hover { color: #34343b; background: #ededf2; }
.nav-item.active { color: var(--accent); background: #fff; box-shadow: 0 2px 7px rgb(0 0 0 / 4%); }
.nav-item.active .icon { stroke-width: 1.8; }
.nav-item.active .badge-count { color: var(--accent); background: #e9f2ff; }
.source-dot { background: #b6b6be; }
.source-badge { color: #717179; }
.source-badge small, .local-info small { color: #929299; }
.local-info { color: #7c7c83; border-color: #e4e4e9; }
.topbar { border-bottom-color: #e7e7ec; }
.breadcrumb, .today-date { color: #898990; }
.breadcrumb strong { color: #62626a; }
.breadcrumb > span { color: #c0c0c7; }
.profile-avatar { border: 0; color: #797981; background: #ececf0; }
.topbar .icon-btn { background: #ececf0; color: #73737c; }

/* Shared actions, fields, and sheets. */
.btn { min-height: 46px; padding: 12px 20px; border-radius: 24px; font-size: 12px; font-weight: 500; letter-spacing: -.08px; }
.btn:hover { transform: none; }
.btn:active { transform: scale(.985); }
.btn.primary { color: #fff; background: var(--accent); border-color: transparent; box-shadow: none; }
.btn.primary:hover { background: var(--accent-hover); }
.btn.primary:active { background: #005ec8; }
.btn.secondary { color: #6c6c74; background: #f1f1f4; border-color: transparent; }
.btn.secondary:hover { color: #3c3c43; background: #e9e9ee; }
.icon-btn { min-width: 38px; width: 38px; height: 38px; border: 0; border-radius: 50%; background: #f1f1f4; color: #797981; }
.icon-btn:hover { background: #e8e8ee; color: #44444c; }
.text-link, .dashboard-note a { color: var(--accent); }
.text-link:hover, .dashboard-note a:hover { color: var(--accent-hover); }
.tag { color: #7e7e87; background: #f1f1f4; border-radius: 6px; }
.tag.critical, .tag.warning { color: #a36808; background: #fff5e5; }
.status-pill { color: #7e7e87; background: #f1f1f4; }
.status-pill.green { color: #248a3d; background: #edf8ef; }
.status-pill.orange { color: #a56808; background: #fff5e5; }
.status-pill.red { color: #c52235; background: #fff0f1; }
.badge-count { color: #a56808; background: #fff5e5; }
.avatar, .avatar-1, .avatar-2, .avatar-3, .avatar-4, .avatar-5 { color: #7c7c85; background: #ededf2; }
.item-icon, .item-icon.blue, .item-icon.orange, .item-icon.green, .item-icon.purple { color: #7e7e88; background: #f0f0f4; border-radius: 11px; }
.item-icon.red { color: #c52235; background: #fff0f1; }
.activity-symbol { color: #7e7e88; background: #f0f0f4; }
.activity-symbol.green { color: #248a3d; background: #edf8ef; }
.activity-symbol.orange { color: #a56808; background: #fff5e5; }
.field label, .field-label { color: #65656d; font-size: 12px; }
.field input, .field select, .field textarea { color: #27272d; background: #f5f5f7; border: 1px solid transparent; border-radius: 13px; min-height: 46px; padding: 12px 14px; }
.field input:focus, .field select:focus, .field textarea:focus { outline: 0; border-color: #8fc0ff; background: #f8fbff; box-shadow: 0 0 0 3px #edf5ff; }
.field textarea { line-height: 1.65; }
.field small, .microcopy { color: #898990; }
input::placeholder, textarea::placeholder { color: #a0a0a7; }
.required { color: #82828a; }
.modal-backdrop { background: rgb(28 28 32 / 24%); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.modal { border-radius: 30px; border-color: rgb(255 255 255 / 90%); background: #fff; box-shadow: 0 26px 90px rgb(0 0 0 / 17%); }
.modal-header { padding: 27px 29px 24px; border-color: #ededf1; }
.modal-header h2 { color: #1d1d1f; font-size: 24px; font-weight: 600; letter-spacing: -.8px; }
.modal-header .eyebrow { color: #86868b; }
.modal-header .icon-btn { color: #808088; background: #f1f1f4; }
.modal-body { padding: 25px 29px; }
.modal-footer { padding: 19px 29px; background: rgb(255 255 255 / 94%); border-color: #ededf1; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
.empty-state > .icon { color: #9bbbe5; }
.empty-state h2, .empty-state h3 { color: #38383f; }
.empty-state p { color: #898990; }

/* The same blue geometry on the overview and on individual controls. */
.progress-ring, .tone-sage, .tone-orange, .tone-blue, .tone-purple { --ring-color: var(--accent); }
.ring-track { stroke: #e4e7ec; }
.ring-track, .ring-progress { stroke-width: 6; }
.ring-number { color: #25252a; }
.ring-number > span, .ring-caption { color: #85858c; }
.card-top .status-pill { font-size: 10px; }
.mastery-body { gap: 30px; padding: 9px 28px 24px; }
.mastery-count { color: #85858c; }
.mastery-count strong { color: #27272d; font-size: 29px; font-weight: 500; }
.metric-line { padding: 9px 3px; min-height: 52px; color: #62626a; border-radius: 9px; }
.metric-line:hover { background: #f8f8fa; }
.metric-line > strong { color: #38383f; }
.metric-line > span > small { color: #929299; }
.metric-dot, .metric-dot.sage, .metric-dot.blue, .metric-dot.orange { background: #9dbde7; }
.mastery-footnote { color: #929299; }
.mastery-footer { margin: 0 24px 20px; padding: 5px; gap: 3px; background: #f5f5f7; border: 0; border-radius: 16px; }
.summary-chip { min-height: 65px; color: #898990; border-radius: 12px; }
.summary-chip + .summary-chip { border-left: 0; border-radius: 12px; }
.summary-chip:hover { background: #fff; }
.summary-chip strong { color: #3b3b42; font-size: 22px; font-weight: 500; }
.summary-chip.has-issues strong { color: #b46b00; }
.round-focus { padding: 25px; color: #1d1d1f; background: #fff; border-color: #ededf1; box-shadow: var(--shadow); }
.round-heading { color: #73737b; font-size: 11px; letter-spacing: 1px; }
.round-heading .icon { color: #9b9ba3; }
.round-window { color: #1d1d1f; margin-top: 22px; }
.round-window strong { font-weight: 450; font-size: 39px; }
.round-window span { color: #a1a1a8; }
.round-window i { color: #c0c0c7; }
.round-description, .round-active small { color: #8b8b92; }
.round-active { margin-top: 10px; padding: 13px 12px; border-radius: 14px; background: #f5f5f7; }
.round-active strong { color: #45454d; font-weight: 500; }
.round-active .ring-number { color: #3b3b42; }
.round-active .ring-number span { color: #929299; }
.round-active .ring-track { stroke: #e2e5eb; }
.round-symbol, .round-active .avatar { color: #7e8ea4; background: #e9eef6; }
.round-symbol { border-radius: 50%; }
.btn.round-cta { min-height: 46px; color: #fff; background: var(--accent); border: 0; border-radius: 24px; font-weight: 500; }
.btn.round-cta:hover { background: var(--accent-hover); }
.timeline::before { background: #e3e5ea; }
.timeline-dot { background: #d2d5dc; border-color: #fff; box-shadow: 0 0 0 1px #e5e7ec; }
.timeline-step.next .timeline-dot { background: #007aff; box-shadow: 0 0 0 2px #e2edff; }
.timeline-step.done .timeline-dot { color: #fff; background: #248a3d; border-color: #fff; box-shadow: 0 0 0 1px #d8eadd; }
.timeline-time { color: #9b9ba3; }
.timeline-step.next .timeline-time { color: #007aff; }
.round-footer-note { color: #95959d; }
.chapter-card { border-color: #ededf1; border-radius: 22px; background: #fff; box-shadow: var(--shadow); }
.chapter-card:hover { border-color: #d9e6f7; box-shadow: 0 3px 16px rgb(0 122 255 / 4%); transform: translateY(-1px); }
.chapter-copy h3 { color: #45454d; font-weight: 500; }
.chapter-copy p { color: #96969e; }
.priority-row { background: #fff; border-color: #ededf1; min-height: 75px; }
.priority-row:hover { background: #f9f9fb; }
.item-copy strong { color: #38383f; font-weight: 500; }
.item-meta { color: #929299; }
.team-member { border-radius: 12px; }
.team-member:hover { background: #f5f5f7; }
.team-member strong { color: #45454d; font-weight: 500; }
.team-member small, .team-overview-footer { color: #929299; }
.team-overview-footer { background: #fafafd; border-color: #ededf1; }
.dashboard-note { color: #929299; }

/* Search and filters behave like a single grouped control. */
.filter-bar { padding: 8px; gap: 8px; background: #fff; border: 1px solid #ededf1; border-radius: 18px; box-shadow: 0 2px 12px rgb(0 0 0 / 1%); }
.search-field { min-height: 46px; border: 1px solid transparent; border-radius: 12px; background: #f5f5f7; }
.search-field input { padding-top: 12px; padding-bottom: 12px; font-size: 13px; }
.search-field .icon { color: #95959d; }
.search-field:focus-within { border-color: #9bc7ff; background: #f8fbff; box-shadow: 0 0 0 3px #edf5ff; }
.filter-bar select { min-height: 46px; color: #696971; background: #f5f5f7; border: 1px solid transparent; border-radius: 12px; }
.filter-bar select:focus-visible { outline-color: #8cc1ff; }
.filter-chips { width: fit-content; max-width: 100%; padding: 4px; gap: 3px; flex-wrap: nowrap; background: #ececf0; border-radius: 14px; }
.filter-chip { min-height: 36px; padding: 8px 13px; color: #85858d; background: transparent; border: 0; border-radius: 10px; }
.filter-chip:hover { color: #62626a; background: #e5e5eb; }
.filter-chip.active { color: var(--accent); background: #fff; box-shadow: 0 2px 5px rgb(0 0 0 / 5%); }
.list-caption { color: #73737c; font-size: 11px; }
.list-caption span { color: #929299; }
.item-list { border-radius: 23px; }
.control-row { min-height: 84px; padding: 21px 23px; border-color: #ededf1; background: #fff; }
.control-row:hover { background: #f9f9fb; }
.control-row:focus-visible, .priority-row:focus-visible { outline-offset: -3px; }
.control-title { color: #34343b; font-size: 13px; font-weight: 500; }
.control-tags > span:not(.tag), .item-number { color: #95959d; }
.row-owner { color: #73737c; }
.row-owner small { color: #a0a0a7; }
.row-status { color: #8b8b93; }
.row-status.ok { color: #248a3d; }
.row-status.issue { color: #c52235; }
.row-status.corrected, .row-status.stale { color: #a56808; }
.control-row > .icon, .chevron .icon { color: #b7b7c0; }

@media (max-width: 1200px) {
 .mastery-body { gap: 20px; padding: 8px 20px 23px; }
 .mastery-count strong { font-size: 25px; }
 .mastery-footer { margin-left: 20px; margin-right: 20px; }
 .metric-line { min-height: 49px; }
 .round-focus { padding: 23px; }
 .card-top h2, .panel-heading h2, .section-title { font-size: 15px; }
}
@media (max-width: 1000px) {
 .page-heading { padding-top: 28px; gap: 17px; }
 h1 { font-size: 32px; }
 .mastery-body { gap: 35px; padding: 10px 28px 24px; }
 .round-active { margin: 0; padding: 12px; }
 .round-focus > .btn.round-cta { margin-top: 12px; }
 .round-description { font-size: 11px; }
 .round-window strong { font-size: 36px; }
 .control-row { padding: 20px; }
}
@media (max-width: 640px) {
 .app-main { padding-left: 18px; padding-right: 18px; }
 .page-heading { padding-top: 23px; padding-bottom: 24px; gap: 18px; }
 h1 { font-size: 31px; letter-spacing: -1.2px; }
 .subtitle { font-size: 12px; line-height: 1.65; }
 .eyebrow { font-size: 9px; }
 .topbar .icon-btn, .profile-avatar { width: 40px; height: 40px; min-width: 40px; }
 .btn { min-height: 46px; border-radius: 24px; font-size: 12px; }
 .panel { border-radius: 23px; }
 .panel-heading, .card-top { padding: 21px 20px 17px; }
 .panel-heading h2, .card-top h2, .section-title, .section-heading h2 { font-size: 15px; }
 .card-top .status-pill { font-size: 9px; }
 .mastery-body { padding: 7px 20px 23px; gap: 20px; }
 .mastery-count { font-size: 11px; }
 .mastery-count strong { font-size: 25px; }
 .metric-line { min-height: 48px; padding: 7px 0; font-size: 10px; }
 .metric-line > strong { font-size: 12px; }
 .mastery-footer { margin: 0 18px 17px; padding: 4px; gap: 2px; border-radius: 14px; }
 .summary-chip { min-height: 56px; font-size: 9px; }
 .summary-chip strong { font-size: 21px; }
 .round-focus { padding: 23px; }
 .round-heading { font-size: 11px; }
 .round-window strong { font-size: 39px; }
 .round-active { width: 100%; margin-top: 14px; padding: 12px; }
 .round-focus > .btn.round-cta { margin-top: 16px; }
 .chapter-card { border-radius: 20px; }
 .chapter-copy h3 { font-size: 12px; }
 .priority-row { min-height: 76px; padding: 16px 18px; }
 .item-copy strong { font-size: 12px; }
 .priority-row .row-status { font-size: 9px; }
 .team-member { min-height: 65px; }
 .team-member strong { font-size: 12px; }
 .team-member small { font-size: 10px; }
 .filter-bar { padding: 8px; gap: 8px; border-radius: 17px; }
 .search-field { min-width: 100%; }
 .search-field input { font-size: 16px; }
 .filter-bar select { min-width: 0; font-size: 11px; padding-right: 12px; }
 .filter-chips { width: 100%; min-width: 0; padding-bottom: 4px; scrollbar-width: none; }
 .filter-chips::-webkit-scrollbar { display: none; }
 .filter-chip { min-height: 38px; padding-left: 12px; padding-right: 12px; font-size: 10px; }
 .list-caption { font-size: 10px; }
 .control-row { padding: 19px 16px; }
 .control-title { font-size: 13px; }
 .control-tags { gap: 5px; }
 .control-row .row-status { font-size: 10px; }
 .field input, .field select, .field textarea { font-size: 16px; }
 .modal { border-radius: 27px; }
 .modal-header { padding: 23px 21px 20px; }
 .modal-header h2 { font-size: 22px; }
 .modal-body { padding: 22px 21px; }
 .modal-footer { padding: 16px 21px max(16px, env(safe-area-inset-bottom)); }
 .mobile-nav { padding-top: 9px; border-top-color: rgb(224 224 231 / 80%); background: rgb(250 250 252 / 91%); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); }
 .mobile-nav a, .mobile-nav button { color: #92929a; background: transparent; }
 .mobile-nav .active { color: var(--accent); background: transparent; }
 .mobile-nav .active .icon { stroke-width: 1.9; }
 .empty-state { padding: 45px 24px; }
 .empty-state h2 { font-size: 19px; }
 .app-footer { font-size: 9px; }
}
@media (max-width: 370px) {
 .app-main { padding-left: 13px; padding-right: 13px; }
 h1 { font-size: 29px; }
 .mastery-body { padding-left: 15px; padding-right: 15px; gap: 14px; }
 .mastery-count strong { font-size: 23px; }
 .metric-line { font-size: 9px; }
 .metric-line > strong { font-size: 11px; }
 .card-top { padding-left: 16px; padding-right: 16px; }
 .card-top h2 { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
 *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media print {
 .panel, .chapter-card, .round-focus { background: #fff; color: #000; box-shadow: none; border-color: #ddd; }
 .round-focus * { color: #333; }
 .sidebar, .topbar, .mobile-nav, .btn, .icon-btn { display: none !important; }
 .app-main { margin: 0; padding: 0; }
 .modal, .report-modal { box-shadow: none; }
}
/* The restaurant name is content, rather than the breadcrumb separator. */
.breadcrumb > #breadcrumb-restaurant { color: #898990; }