/* stable-46: cohesive corporate design system.
   Final presentation layer: neutral Apple-like hierarchy, restrained color, consistent typography,
   quiet surfaces, fewer decorative borders, and predictable interaction states. */

:root{
  color-scheme:dark;
  --font-sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",Inter,Arial,sans-serif;
  --font-mono:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;

  --bg:#08080a;
  --panel:#121214;
  --panel2:#18181b;
  --surface-0:#08080a;
  --surface-1:#111113;
  --surface-2:#18181b;
  --surface-3:#202024;
  --surface-hover:#252529;
  --surface-selected:#202b38;

  --text:#f5f5f7;
  --text-soft:#d2d2d7;
  --muted:#a1a1a6;
  --muted-2:#7d7d83;

  --accent:#2997ff;
  --accent2:#0071e3;
  --accent-soft:rgba(41,151,255,.14);
  --accent-border:rgba(41,151,255,.42);
  --ok:#30d158;
  --warn:#ffd60a;
  --danger:#ff453a;

  --border:rgba(255,255,255,.105);
  --border-soft:rgba(255,255,255,.075);
  --line:rgba(255,255,255,.085);
  --line-subtle:rgba(255,255,255,.065);
  --line-soft:rgba(255,255,255,.11);

  --radius-control:11px;
  --radius-sm:11px;
  --radius-md:15px;
  --radius-card:18px;
  --radius-lg:20px;
  --radius-large:22px;

  --shadow-card:0 1px 0 rgba(255,255,255,.025),0 12px 40px rgba(0,0,0,.13);
  --shadow-dialog:0 34px 100px rgba(0,0,0,.58);
  --shadow-floating:0 20px 60px rgba(0,0,0,.48);
}

html{background:var(--surface-0)!important}
body{
  font-family:var(--font-sans)!important;
  font-size:14px;
  line-height:1.45;
  letter-spacing:-.006em;
  background:var(--surface-0)!important;
  color:var(--text)!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
button,input,select,textarea{font-family:inherit!important}
.mono{font-family:var(--font-mono)!important}

/* Typography: calm hierarchy, no dashboard-style shouting. */
:where(h1,h2,h3,h4,h5){color:var(--text);letter-spacing:-.025em;text-wrap:balance}
h1{font-weight:700}
h2,h3{font-weight:690}
h4,h5{font-weight:650}
.eyebrow{
  text-transform:none!important;
  letter-spacing:-.006em!important;
  font-size:12px!important;
  font-weight:600!important;
  color:var(--muted)!important;
}
.muted{color:var(--muted)!important}
.small{font-size:12px!important}
label{color:var(--text-soft)!important;font-size:12.5px!important;font-weight:600!important}

/* Focus must be obvious, but not visually noisy until used. */
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid rgba(41,151,255,.72)!important;
  outline-offset:2px!important;
}

/* Controls: one geometry and one interaction language. */
:where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
  min-height:42px!important;
  padding:9px 12px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:var(--radius-control)!important;
  background:#1a1a1d!important;
  color:var(--text)!important;
  box-shadow:none!important;
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease!important;
}
:where(input:not([type="checkbox"]):not([type="radio"]),select,textarea):hover{
  border-color:rgba(255,255,255,.19)!important;
  background:#1d1d20!important;
}
:where(input:not([type="checkbox"]):not([type="radio"]),select,textarea):focus{
  border-color:var(--accent)!important;
  background:#1d1d20!important;
  box-shadow:0 0 0 3px rgba(41,151,255,.13)!important;
}
input::placeholder,textarea::placeholder{color:#6f6f75!important;opacity:1}
textarea{line-height:1.5}
input[type="checkbox"],input[type="radio"]{accent-color:var(--accent2)}

button:not(.stable-v19-event):not(.stable-v19-day-heading):not(.monthly-payment-row):not(.daily-payment-row){
  min-height:40px;
  border:1px solid transparent!important;
  border-radius:11px!important;
  padding:9px 14px;
  background:var(--accent2)!important;
  color:#fff!important;
  font-weight:650!important;
  letter-spacing:-.006em!important;
  box-shadow:none!important;
  transition:background .15s ease,border-color .15s ease,transform .12s ease,opacity .15s ease!important;
}
button:not(:disabled):not(.stable-v19-event):not(.stable-v19-day-heading):not(.monthly-payment-row):not(.daily-payment-row):hover{
  background:#0879e8!important;
  filter:none!important;
}
button:not(:disabled):not(.stable-v19-event):not(.stable-v19-day-heading):not(.monthly-payment-row):not(.daily-payment-row):active{
  transform:scale(.985)!important;
}
button:disabled{opacity:.42!important}
button.secondary,.secondary{
  background:#222225!important;
  border-color:rgba(255,255,255,.10)!important;
  color:var(--text-soft)!important;
}
button.secondary:hover,.secondary:hover{
  background:#2a2a2e!important;
  border-color:rgba(255,255,255,.15)!important;
  color:#fff!important;
}
.icon-button.secondary{
  background:transparent!important;
  border-color:transparent!important;
  color:var(--muted)!important;
}
.icon-button.secondary:hover{background:rgba(255,255,255,.07)!important;color:#fff!important}
button.danger-action,.remove-row{
  background:rgba(255,69,58,.10)!important;
  border-color:rgba(255,69,58,.24)!important;
  color:#ff6961!important;
}
button.danger-action:hover,.remove-row:hover{background:rgba(255,69,58,.16)!important}

/* Global surfaces: neutral, shallow, and consistent. */
.card,.workspace.card,.topbar.card,.auth-card,
.home-main,.home-side,.settings-group,.record-panel,
.stable-student-overview,.stable-v19-editor-dialog,.notification-dialog,.offline-conflict-dialog{
  border-color:var(--border-soft)!important;
}
.card,.workspace.card,.auth-card{
  background:var(--surface-1)!important;
  box-shadow:var(--shadow-card)!important;
}
.workspace.card{border-radius:var(--radius-card)!important}
.topbar.card{
  background:rgba(18,18,20,.82)!important;
  border-color:rgba(255,255,255,.07)!important;
  box-shadow:none!important;
  backdrop-filter:blur(22px) saturate(1.12)!important;
}
.subsection{border-top-color:var(--line-subtle)!important}

/* Navigation rail: product navigation, not a stack of CTA buttons. */
@media(min-width:900px){
  .brand{
    background:#0d0d0f!important;
    border-right-color:var(--line-subtle)!important;
    box-shadow:none!important;
  }
  .brand .mark{
    background:linear-gradient(145deg,#2b9fff,#0875df)!important;
    border:1px solid rgba(255,255,255,.12)!important;
    color:#fff!important;
    box-shadow:none!important;
  }
  .brand h1{font-weight:700!important;color:#f5f5f7!important}
  .dashboard-modules .module{
    background:transparent!important;
    border-color:transparent!important;
    color:#9b9ba1!important;
    box-shadow:none!important;
    font-weight:600!important;
  }
  .dashboard-modules .module:hover{
    background:#19191c!important;
    border-color:transparent!important;
    color:#f2f2f4!important;
  }
  .dashboard-modules .module.active{
    background:#202023!important;
    border-color:rgba(255,255,255,.07)!important;
    color:#fff!important;
  }
  .dashboard-modules .module.active::before{
    background:var(--accent)!important;
    width:3px!important;
  }
  .back-dashboard{
    background:#1d1d20!important;
    border-color:rgba(255,255,255,.08)!important;
  }
  .workspace>.section-head{
    background:rgba(17,17,19,.92)!important;
    border-bottom-color:var(--line-subtle)!important;
    backdrop-filter:blur(22px)!important;
  }
}

/* Home / Today: information first, chrome second. */
.desktop-home{background:var(--surface-1)!important}
.home-main,.home-side{
  background:var(--surface-2)!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.home-head h2{font-weight:700!important}
.home-section-title h3,.home-side h3{color:var(--text)!important;font-weight:650!important}
.today-row{
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
.today-row:hover{background:#202023!important;border-color:transparent!important}
.today-person small,.today-format{color:var(--muted)!important}
.home-metrics>div{border-bottom-color:var(--line-subtle)!important}
.home-metrics span{color:var(--muted)!important}

.stable-today-lesson{
  background:var(--surface-2)!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.stable-today-lesson:hover{background:var(--surface-hover)!important;border-color:rgba(255,255,255,.10)!important}
.stable-today-metric,.finance-metric,.record-metric,.business-metric,.stable-student-card-metrics>div{
  background:var(--surface-2)!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.stable-today-metric span,.finance-metric span,.record-metric span,.business-metric span,.stable-student-card-metrics span{
  color:var(--muted)!important;
}

/* Toolbars are grouped controls, not visual cards. */
.student-toolbar,.schedule-toolbar,.finance-toolbar,.records-toolbar,.business-toolbar,
.monthly-finance-period{
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
.segmented,.monthly-finance-tabs{
  background:#1a1a1d!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.segmented button,.monthly-finance-tabs button{
  background:transparent!important;
  color:var(--muted)!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
.segmented button:hover,.monthly-finance-tabs button:hover{background:#242428!important;color:#fff!important}
.segmented button.active,.monthly-finance-tabs button.active{
  background:#303034!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.08)!important;
  box-shadow:0 1px 2px rgba(0,0,0,.22)!important;
}

/* Lists: quiet rows, high legibility. */
.student-row,.record-row,.constraint-row,.document-row,.campaign-row,.ledger-row,
.notification-row,.offline-conflict-card,.stable-student-card-list>div:not(.empty),
.v39-exam-list>div,.v39-homework-list>div:not(.empty),.settings-row{
  background:var(--surface-2)!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.student-row:hover,.record-row:hover,.constraint-row:hover,.document-row:hover,.campaign-row:hover,.ledger-row:hover,
.stable-student-card-list>div:not(.empty):hover,.settings-row:hover{
  background:var(--surface-hover)!important;
  border-color:rgba(255,255,255,.10)!important;
  filter:none!important;
}
.student-main small,.student-meta,.record-row small,.constraint-row small,.document-row small,.campaign-row small,.ledger-row small,
.stable-student-card-list small,.settings-row small{color:var(--muted)!important}
.chip{
  background:#202023!important;
  border-color:rgba(255,255,255,.08)!important;
  color:#c7c7cc!important;
  font-weight:550!important;
}
.empty,.today-empty,.stable-today-empty,.stable-student-card-loading{
  background:rgba(255,255,255,.018)!important;
  border-color:rgba(255,255,255,.095)!important;
  color:var(--muted)!important;
}

/* Lesson cards: keep format color as a semantic accent, not as a large tinted panel. */
.lesson-card,
.lesson-card.lesson-format-individual,
.lesson-card.lesson-format-parallel,
.lesson-card.lesson-format-group{
  background:var(--surface-2)!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.lesson-card:hover,
.lesson-card.lesson-format-individual:hover,
.lesson-card.lesson-format-parallel:hover,
.lesson-card.lesson-format-group:hover{
  background:var(--surface-hover)!important;
  border-color:rgba(255,255,255,.11)!important;
}
.lesson-card.lesson-format-individual{box-shadow:inset 3px 0 0 #2997ff!important}
.lesson-card.lesson-format-parallel{box-shadow:inset 3px 0 0 #bf5af2!important}
.lesson-card.lesson-format-group{box-shadow:inset 3px 0 0 #30d158!important}
.lesson-card.lesson-format-individual .lesson-name small{color:#7fc0ff!important}
.lesson-card.lesson-format-parallel .lesson-name small{color:#d39af6!important}
.lesson-card.lesson-format-group .lesson-name small{color:#75dd8b!important}
.lesson-time{font-variant-numeric:tabular-nums}

/* Tabs: text navigation with one clear active indicator. */
.stable-settings-tabs,.stable-student-card-tabs,.daily-tabs,.v39-context-tabs,
.daily-document-category-tabs,.daily-document-type-actions{
  border-bottom-color:var(--line-subtle)!important;
}
.stable-settings-tabs button,.stable-student-card-tabs button,.daily-tabs button,.v39-context-tabs button,
.daily-document-category-tabs button,.daily-document-type-actions button{
  background:transparent!important;
  border-color:transparent!important;
  color:var(--muted)!important;
  box-shadow:none!important;
  font-weight:600!important;
}
.stable-settings-tabs button:hover,.stable-student-card-tabs button:hover,.daily-tabs button:hover,.v39-context-tabs button:hover,
.daily-document-category-tabs button:hover,.daily-document-type-actions button:hover{color:#fff!important;background:transparent!important}
.stable-settings-tabs button.active,.stable-student-card-tabs button.active,.daily-tabs button.active,.v39-context-tabs button.active,
.daily-document-category-tabs button.active,.daily-document-type-actions button.active{
  color:#fff!important;
  border-bottom-color:var(--accent)!important;
  background:transparent!important;
}

/* Student card: spacious, neutral and easy to scan. */
.stable-student-overview{
  background:#151517!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:var(--shadow-dialog)!important;
}
.stable-student-overview::backdrop{background:rgba(0,0,0,.72)!important;backdrop-filter:blur(12px)!important}
.stable-student-card-split>section,.stable-student-shared-sessions,.stable-price-context,
.v39-summary-grid>div{
  background:var(--surface-2)!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.stable-student-card-metrics .positive,.stable-student-card-list .positive{color:#5ee477!important}
.stable-student-card-metrics .negative,.stable-student-card-list .negative{color:#ff6961!important}
.stable-student-move-target{
  background:var(--surface-2)!important;
  border-color:var(--line-subtle)!important;
}
.stable-student-move-target:hover{background:var(--surface-hover)!important;border-color:var(--accent-border)!important}

/* Dialogs and editors: one modal system. */
dialog.student-dialog,dialog.stable-v19-editor-dialog,dialog.notification-dialog,dialog.offline-conflict-dialog,
.daily-payment-dialog,.stable-student-move-dialog{
  background:#151517!important;
  border:1px solid rgba(255,255,255,.10)!important;
  box-shadow:var(--shadow-dialog)!important;
}
dialog::backdrop{background:rgba(0,0,0,.72)!important;backdrop-filter:blur(12px)!important}
.dialog-head{border-bottom-color:transparent!important}
.dialog-actions{border-top-color:var(--line-subtle)!important}
.editor-row,.lesson-student,#lessonSimpleV41 .v41-students,#lessonSimpleV41 .v41-followup{
  background:var(--surface-2)!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
#lessonSimpleV41 .v41-student{border-color:transparent!important;background:transparent!important}
#lessonSimpleV41 .v41-student:hover{background:#222226!important;border-color:transparent!important}
#lessonSimpleV41 .v41-student:has(input:checked){
  background:var(--accent-soft)!important;
  border-color:var(--accent-border)!important;
}
#lessonSimpleV41 .v41-selected-chip{
  background:var(--accent-soft)!important;
  border-color:var(--accent-border)!important;
  color:#cfe8ff!important;
}

/* Finance / business / records: numeric data looks deliberate, not decorative. */
.finance-metric strong,.record-metric strong,.business-metric strong,.stable-today-metric strong,.stable-student-card-metrics strong{
  color:var(--text)!important;
  font-weight:680!important;
  letter-spacing:-.025em!important;
}
.finance-metric.positive strong,.positive{color:#5ee477}
.finance-metric.negative strong,.negative{color:#ff6961}
.debtor-row,.conflict-card{
  background:rgba(255,69,58,.055)!important;
  border-color:rgba(255,69,58,.18)!important;
}
.debtor-row span{color:#ff827b!important}

/* Settings / Google / account panels: nested surfaces are deliberately flatter. */
.settings-group{
  background:var(--surface-2)!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.settings-group .record-form{border-top-color:var(--line-subtle)!important}
.google-permissions,.google-account,.google-managed-calendar,.google-calendar-row.google-display-choice{
  background:var(--surface-2)!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.google-managed-calendar{border-color:rgba(41,151,255,.20)!important}
.google-calendar-row.google-display-choice:hover{background:var(--surface-hover)!important;border-color:rgba(255,255,255,.10)!important}
.google-config-warning,.stable-student-card-inline-warning{
  background:rgba(255,214,10,.055)!important;
  border-color:rgba(255,214,10,.18)!important;
  color:#ffe36a!important;
}

/* Notices: semantic color without large saturated panels. */
.notice{box-shadow:none!important}
.notice.error,.error{
  background:rgba(255,69,58,.075)!important;
  border-color:rgba(255,69,58,.22)!important;
  color:#ff827b!important;
}
.notice.warning,.warning{
  background:rgba(255,214,10,.055)!important;
  border-color:rgba(255,214,10,.18)!important;
  color:#ffe36a!important;
}

/* Calendar/timeline: crisp structure and neutral canvas. */
.stable-v19-timeline,.stable-schedule-calendar{
  background:transparent!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.stable-v19-timeline-head{background:#151517!important;border-bottom-color:var(--line-subtle)!important}
.stable-v19-day-heading{color:var(--muted)!important}
.stable-v19-day-heading:hover{background:#202023!important}
.stable-v19-day-heading.today{background:rgba(41,151,255,.07)!important;color:#d9ecff!important}
.stable-calendar-day{
  background:#151517!important;
  border-color:var(--line-subtle)!important;
  box-shadow:none!important;
}
.stable-calendar-day:hover{background:#202023!important;border-color:rgba(255,255,255,.12)!important}
.stable-calendar-day.selected{background:rgba(41,151,255,.10)!important;border-color:rgba(41,151,255,.42)!important}
.stable-calendar-day.today{box-shadow:inset 0 0 0 1px rgba(41,151,255,.55)!important}

/* Tables: separators and alignment over boxed cells. */
#appView table{color:var(--text-soft)!important}
#appView th{
  color:#8e8e93!important;
  border-bottom-color:var(--line)!important;
  font-size:11px!important;
  font-weight:650!important;
  letter-spacing:.02em!important;
}
#appView td{border-bottom-color:var(--line-subtle)!important}
#appView tbody tr:hover td{background:rgba(255,255,255,.025)!important}

/* Scrollbars are discoverable but stay out of the way. */
@supports selector(::-webkit-scrollbar){
  #appView *::-webkit-scrollbar,dialog *::-webkit-scrollbar{width:8px;height:8px}
  #appView *::-webkit-scrollbar-thumb,dialog *::-webkit-scrollbar-thumb{
    background:rgba(255,255,255,.18)!important;
    border:2px solid transparent!important;
    background-clip:padding-box!important;
  }
  #appView *::-webkit-scrollbar-thumb:hover,dialog *::-webkit-scrollbar-thumb:hover{background-color:rgba(255,255,255,.27)!important}
}

/* Mobile sheet / FAB follows the same neutral visual system. */
@media(max-width:899px){
  .topbar.card{background:rgba(14,14,16,.88)!important}
  .workspace.card{background:#101012!important;border-color:var(--line-subtle)!important;box-shadow:none!important}
  .dashboard-modules,.dashboard-modules[hidden]{
    background:rgba(22,22,24,.96)!important;
    border-color:rgba(255,255,255,.10)!important;
    box-shadow:var(--shadow-floating)!important;
    backdrop-filter:blur(28px) saturate(1.08)!important;
  }
  .dashboard-modules .module{
    background:#202023!important;
    border-color:rgba(255,255,255,.06)!important;
    color:#b8b8bd!important;
  }
  .dashboard-modules .module:hover{background:#29292d!important;border-color:rgba(255,255,255,.09)!important;color:#fff!important}
  .dashboard-modules .module.active{
    background:#2a2a2e!important;
    border-color:rgba(41,151,255,.40)!important;
    color:#fff!important;
    box-shadow:inset 0 0 0 1px rgba(41,151,255,.10)!important;
  }
  .mobile-nav-backdrop{background:rgba(0,0,0,.56)!important;backdrop-filter:blur(5px)!important}
  .mobile-nav-fab{
    background:var(--accent2)!important;
    border-color:rgba(255,255,255,.14)!important;
    border-radius:17px!important;
    box-shadow:0 14px 34px rgba(0,0,0,.38)!important;
  }
  .mobile-nav-fab:hover{background:#0879e8!important}
  .dialog-actions{background:linear-gradient(180deg,transparent,#151517 28%)!important}
}

@media(max-width:620px){
  body{font-size:13.5px}
  .topbar.card{border-radius:14px!important}
  .home-main,.home-side,.settings-group{border-radius:14px!important}
  .stable-student-card-head-actions button,.stable-student-quick-actions button{min-height:42px!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

@media(prefers-contrast:more){
  :root{--border:rgba(255,255,255,.22);--border-soft:rgba(255,255,255,.16);--line-subtle:rgba(255,255,255,.14)}
  .muted{color:#b9b9bf!important}
}
