/* Admission OS design candidate v1.0. Shared tokens and responsive components. */
:root {
  --ink:#12213e; --ink2:#455570; --blue:#0967e8; --blue2:#0753c2;
  --mint:#54d6b0; --paper:#f4f8fd; --white:#fff; --line:#d9e5f2;
  --muted:#63738d; --shadow:0 16px 42px rgba(15,45,98,.09);
  --design-radius:20px; --design-focus:#0967e8;
}
html { scroll-behavior:smooth }
body { background:var(--paper); color:var(--ink); text-rendering:optimizeLegibility }
:where(button,a,input,select,textarea):focus-visible { outline:3px solid var(--design-focus); outline-offset:3px }
:where(h1,h2,h3,p,span,strong,a,button,label) { overflow-wrap:break-word }
:where(.card,.goal-card,.time-card,.chart-card,.profile-card,.school-board,.teacher-decision,.subject-choice) {
  border-color:var(--line); box-shadow:var(--shadow);
}
/* Public site and app share the same surface, blue and teal accents. */
.site-header { background:rgba(244,248,253,.94); border-color:var(--line) }
.brand-mark,.app-brand>span { background:var(--blue); color:#fff; border-radius:13px }
.button-primary,.primary-action { background:var(--blue) }
.hero { padding-block:76px 92px }
.sample-card { transform:none; border:1px solid var(--line) }
.sample-question { background:#edf5ff }
/* Student, teacher and subject pages. */
.app-sidebar { background:#112347 }
.app-workspace { padding-top:30px }
.nav-item { min-height:48px }
.nav-item.is-active { background:#203e71 }
.next-action,.school-intro { background:linear-gradient(135deg,#163e84,#086be5) }
.next-action .primary-action,.school-intro .primary-action { background:var(--mint); color:#092b39 }
.workspace-header h1 { line-height:1.15 }
.today-side a.time-card { border-top:4px solid var(--blue) }
.today-side a.time-card[href$="math/"] { border-top-color:#18a47b }
.today-side a.time-card[href$="english/"] { border-top-color:#e09b37 }
.question-card,.result-card,.intervention-card { border-radius:var(--design-radius) }
.question-text,.subject-starter #prompt { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.45 }
.subject-starter #prompt { font-size:clamp(1.35rem,3.5vw,2rem); font-weight:750 }
.task-instruction { max-width:65ch }
/* Pilot flows use the same design language as the public and demo routes. */
body:has(.shell #login-panel) { font-family:Inter,ui-sans-serif,system-ui,sans-serif }
body:has(.shell #login-panel) .shell { max-width:820px; padding:30px 22px 100px }
body:has(.shell #login-panel) header { align-items:center; padding-bottom:15px; border-bottom:1px solid var(--line) }
body:has(.shell #login-panel) h1 { max-width:17ch; font-size:clamp(2.1rem,6vw,3.5rem); letter-spacing:-.045em; line-height:1.08 }
body:has(.shell #login-panel) .card { border-color:var(--line); box-shadow:var(--shadow) }
body:has(.shell #login-panel) .card h2 { letter-spacing:-.025em }
body:has(.shell #login-panel) .choices { grid-template-columns:repeat(3,minmax(0,1fr)) }
body:has(.shell #login-panel) .choices button { min-height:182px; background:#f4f8ff; border:1px solid #cbdcf5; color:var(--ink); align-content:center }
body:has(.shell #login-panel) .choices button:hover { background:#dcecff; border-color:var(--blue) }
body:has(.shell #login-panel) button:not(.secondary) { background-color:var(--blue) }
body:has(.shell #login-panel) .choices button:not(.secondary) { background-color:#f4f8ff }
body:has(.shell #login-panel) .question-prompt { padding:22px; border:1px solid #cddff7; border-radius:18px; background:#f5faff }
body:has(.shell #login-panel) .instruction { border-left:4px solid var(--blue); background:#eaf4ff }
body:has(.shell #login-panel) .eyebrow { color:var(--blue) }
@media (max-width:760px) {
  .app-workspace { padding:22px 18px calc(115px + env(safe-area-inset-bottom)) }
  .workspace-header { align-items:flex-start; flex-wrap:wrap; gap:12px; margin-bottom:24px }
  .workspace-header h1 { font-size:clamp(1.75rem,7vw,2.35rem) }
  .next-action { padding:24px; min-height:350px }
  .action-copy h2 { font-size:clamp(2rem,8vw,2.75rem); line-height:1.14 }
  .today-grid,.school-data-boundary { grid-template-columns:1fr }
  body:has(.shell #login-panel) .choices { grid-template-columns:1fr }
  body:has(.shell #login-panel) .choices button { min-height:130px }
  body:has(.shell #login-panel) .shell { padding:20px 16px 90px }
  body:has(.shell #login-panel) .card { padding:22px 18px; border-radius:20px }
}
@media (max-width:380px) {
  .app-workspace { padding-inline:14px }
  .header-actions { flex-wrap:wrap }
  .card-top,.action-footer { align-items:flex-start; flex-direction:column }
  .next-action .primary-action { width:100% }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important } }
/* v2 layout follows the student and teacher flow from the accepted low-fi screens. */
.student-home-intro { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:22px }
.student-home-intro .overline { color:var(--blue); margin-bottom:8px }
.student-home-intro h2 { margin:0 0 8px; font-size:clamp(1.8rem,3.2vw,2.65rem); line-height:1.12; letter-spacing:-.04em }
.student-home-intro p:last-child { max-width:62ch; margin:0; color:var(--muted) }
.student-home-intro>span { flex:0 0 auto; color:var(--muted); font-size:.85rem }
.student-home-grid { grid-template-columns:minmax(0,1.4fr) minmax(270px,.6fr) }
.student-home-grid .next-action { min-height:365px; padding:30px; border-radius:24px }
.student-home-grid .action-copy h2 { font-size:clamp(2rem,3.3vw,3.3rem); line-height:1.1 }
.student-home-grid .action-copy>p:last-child { font-size:1rem }
.home-progress .goal-card { display:flex; flex-direction:column; justify-content:center; min-height:245px }
.home-progress .goal-card .small-label { margin-bottom:16px }
.home-progress .goal-card p { color:var(--muted); font-size:.9rem; line-height:1.45; margin:12px 0 0 }
.home-progress .meter { margin:18px 0 }
.home-text-button { align-self:flex-start; border:0; background:transparent; color:var(--blue); font-weight:800; padding:0; cursor:pointer }
.home-quick-links { margin:34px 0 24px }
.home-quick-links .section-title { margin-bottom:18px }
.home-link-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px }
.home-link-grid button { min-height:138px; padding:20px; border:1px solid var(--line); border-radius:20px; background:#fff; color:var(--ink); text-align:left; box-shadow:var(--shadow); cursor:pointer }
.home-link-grid button:hover { border-color:var(--blue); background:#f6faff }
.home-link-grid span,.home-link-grid strong,.home-link-grid small { display:block }
.home-link-grid span { color:var(--blue); font-size:1.55rem; margin-bottom:13px }
.home-link-grid strong { font-size:1.05rem }
.home-link-grid small { color:var(--muted); margin-top:4px }
.home-more { margin:0 0 28px; border:1px solid var(--line); border-radius:18px; background:#fff }
.home-more summary { padding:18px 22px; color:var(--blue); font-weight:800; cursor:pointer }
.home-more-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; padding:0 22px 10px }
.home-more-grid a { text-decoration:none; color:var(--ink) }
.home-more>.status-strip,.home-more>.week-section { margin-inline:22px }
.teacher-class-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:24px 0 32px }
.teacher-class-grid article { display:flex; flex-direction:column; min-height:270px; padding:24px; border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:var(--shadow) }
.teacher-class-grid small { color:var(--blue); font-weight:800 }
.teacher-class-grid h3 { margin:24px 0 8px; font-size:1.35rem }
.teacher-class-grid p { color:var(--muted); line-height:1.45 }
.teacher-class-grid button { margin-top:auto; min-height:48px; padding:10px 14px; border:0; border-radius:12px; background:var(--blue); color:#fff; font-weight:800; cursor:pointer }
.teacher-panel[data-teacher-panel="queue"]>.view-heading { margin-bottom:20px }
.session-layer .result-card { max-width:780px; margin-inline:auto; padding:clamp(24px,5vw,46px) }
.session-layer .result-card h2 { font-size:clamp(1.7rem,4vw,2.6rem); line-height:1.16 }
.session-layer .result-card .mini-evidence,.session-layer .result-card .result-clarification { border-radius:16px }
@media(max-width:900px) { .teacher-class-grid { grid-template-columns:1fr 1fr } }
@media(max-width:760px) {
  .student-home-intro { align-items:flex-start; flex-direction:column; gap:8px }
  .student-home-grid { grid-template-columns:1fr }
  .student-home-grid .next-action { min-height:340px; padding:24px }
  .student-home-grid .action-copy h2 { font-size:clamp(1.9rem,7.2vw,2.4rem) }
  .student-home-grid .action-footer { align-items:stretch; flex-direction:column }
  .student-home-grid .primary-action { width:100% }
  .home-progress { grid-template-columns:1fr 1fr }
  .home-progress .goal-card { min-height:200px }
  .home-link-grid { grid-template-columns:1fr }
  .home-link-grid button { min-height:86px; display:grid; grid-template-columns:34px 1fr; column-gap:12px; align-content:center }
  .home-link-grid span { grid-row:span 2; margin:0 }
  .home-more-grid { grid-template-columns:1fr }
  .teacher-class-grid { grid-template-columns:1fr }
  .teacher-class-grid article { min-height:210px }
}
@media(max-width:470px) { .home-progress { grid-template-columns:1fr } .home-progress .goal-card { min-height:190px } }