/* Shared reference palette; school workspace keeps its established responsive layout. */
@font-face{font-family:Geist;src:url('fonts/geist-variable.woff2') format('woff2');font-weight:100 900;font-display:swap}
body.reference-ui{--ink:#0e1116;--ink-mute:#5b6270;--muted:#5b6270;--paper:#fbfbfa;--surface:#fff;--surface-soft:#f4f4f2;--line:#e7e8ea;--brand:#2f5bff;--brand-dark:#2446d6;--brand-light:#eef2ff;--indigo:#2f5bff;--indigo-soft:#eef2ff;--radius:10px;--radius-sm:8px;font-family:Geist,system-ui,sans-serif;background:var(--paper);color:var(--ink)}
.reference-ui :is(h1,h2,h3,h4){font-family:inherit;letter-spacing:-.035em}
.reference-ui :is(button,input,select,textarea){font-family:inherit}
.reference-ui :is(a,button,input,select,textarea,summary):focus-visible{outline:3px solid var(--brand);outline-offset:3px}
.reference-ui :is(.btn-primary,.btn-start,.btn-submit,.sl-btn,.home-primary,button.primary){background:var(--brand);border-color:var(--brand);color:#fff;border-radius:9px;box-shadow:none;transition:background-color 150ms,border-color 150ms}
.reference-ui :is(.card,.login-card,.sl-box,.admin-card,.legal-wrap){border-color:var(--line);box-shadow:none;border-radius:10px}
.reference-ui :is(.btn-outline,.btn-logout){border-color:#d5d7db;background:var(--surface);color:var(--ink);box-shadow:none}
.reference-ui :is(.form-input,.sl-input){border-color:#b9bec6;border-radius:8px;background:var(--surface);color:var(--ink)}
.reference-ui .site-header{background:var(--paper);border-color:var(--line);border-radius:0;box-shadow:none}
body.reference-ui:not(.student-portal)>.site-header{margin:0 auto;width:100%;max-width:none;padding:20px 32px;border:0;border-bottom:1px solid var(--line)}
.reference-ui .site-footer,.reference-ui .release-footer{color:var(--muted);border-color:var(--line)}
/* Public pages: the same quiet headings, form surfaces and actions as the dashboard. */
body.reference-ui.admin-ready{background:var(--paper);color:var(--ink)}
.reference-ui.admin-ready .site-header{margin:0 auto;width:100%;max-width:none;padding:20px 32px;border:0;border-bottom:1px solid var(--line);border-radius:0}
.reference-ui.admin-ready .site-header>a:last-child{color:var(--brand-dark)}
.reference-ui.admin-ready :is(.admin-heading h1,main>h1){font-size:34px;font-weight:600;line-height:1.2;color:var(--ink)}
.reference-ui.admin-ready :is(.admin-heading p,.admin-note,.admin-license-row p){color:var(--muted)}
.reference-ui.admin-ready .admin-card{border-color:var(--line);border-radius:10px;box-shadow:none}
.reference-ui.admin-ready button:not(.primary):not([data-danger]):not([aria-pressed=true]):not([aria-selected=true]){color:var(--ink);border-color:#d5d7db;border-radius:9px}
.reference-ui.admin-ready :is(input,select,textarea){color:var(--ink);border-color:#b9bec6;border-radius:8px}
.reference-ui.admin-ready #message:not(.error):not(.ok){background:var(--brand-light);color:#2446a7;border-radius:8px}
.reference-ui.admin-ready .teacher-access-help{border-color:var(--line)}
.reference-ui.admin-ready button:is([aria-pressed=true],[aria-selected=true]){background:var(--brand-light);color:var(--brand-dark);border-color:var(--line)}
.reference-ui.legal-page .legal-header,.reference-ui .brand-header{background:transparent;border-color:var(--line);box-shadow:none;color:var(--ink)}
.reference-ui.legal-page .legal-header h1,.reference-ui .brand-header h1{color:var(--ink);font-weight:600;font-size:34px;line-height:1.2}
.reference-ui .brand-page{color:var(--ink)}
.reference-ui .brand-page>h1{font-size:34px;font-weight:600;line-height:1.2;letter-spacing:-.035em}
.reference-ui .download-card{border-color:var(--line);border-radius:10px;box-shadow:none}
/* Student workspace inherits the palette without changing exam sizing or answer states. */
.reference-ui.student-portal{--student-radius:10px;--student-control-radius:9px;--student-soft:var(--brand-light);--student-rule:var(--line)}
.reference-ui.student-portal #view-login{background:var(--paper)}
.reference-ui.student-portal #view-login .login-title{color:var(--ink);font-weight:600}
.reference-ui.student-portal #view-login .login-card{border-color:var(--line);border-radius:10px}
.reference-ui.student-portal #view-dashboard>.figma-student-heading{padding:0 0 24px;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none}
.reference-ui.student-portal #view-dashboard .figma-student-heading h2{color:var(--ink);font-weight:600}
.reference-ui.student-portal #view-dashboard>.figma-student-stats{background:transparent;border:0;border-block:1px solid var(--line);border-radius:0}
.reference-ui.student-portal #view-dashboard .figma-student-stat{background:transparent;border-radius:0}
.reference-ui.student-portal #view-dashboard .portal-section-intro{border-color:var(--line)}
.reference-ui.student-portal :is(.portal-shortcuts a,.practice-card,.exam-card,.figma-assigned-card){border-color:var(--line);box-shadow:none;border-radius:10px}
.reference-ui.student-portal #view-classroom>.page-header{background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0}
/* Landing: established product story and hardware frames, updated reference visual system. */
body.reference-ui.welcome-page{--home-paper:#fbfbfa;--home-ink:#0e1116;--home-muted:#5b6270;--home-blue:#2f5bff;--home-line:#e7e8ea;background:var(--home-paper);color:var(--home-ink)}
.reference-ui.welcome-page .site-header{background:var(--home-paper);border-bottom:1px solid var(--home-line);box-shadow:none}
.reference-ui.welcome-page .home-copy h1{font-family:inherit;font-size:clamp(42px,4.8vw,68px);font-weight:600;line-height:1.05;letter-spacing:-.055em;color:var(--home-ink)}
.reference-ui.welcome-page .home-copy h1 em{font-family:inherit;font-style:normal;font-weight:600;letter-spacing:inherit;color:inherit}
.reference-ui.welcome-page :is(.home-info-heading h2,.home-story-copy h3,.home-access-heading h2,.home-start h2){font-family:inherit;font-weight:600;letter-spacing:-.04em;color:var(--home-ink)}
.reference-ui.welcome-page .home-copy .intro{color:var(--home-muted);font-size:17px;line-height:1.65;max-width:44ch}
.reference-ui.welcome-page :is(.home-primary,.header-nav .home-login-link){background:var(--home-blue);color:#fff;border-color:var(--home-blue);border-radius:9px;box-shadow:none;min-height:44px}
.reference-ui.welcome-page .home-access{background:transparent;border-top:1px solid var(--home-line);border-radius:0;padding-block:44px}
.reference-ui.welcome-page .home-access .portal-card,.reference-ui.welcome-page .home-access .portal-card.school{padding:28px;background:#fff;border:1px solid var(--home-line);border-radius:10px;box-shadow:none;color:var(--home-ink)}
.reference-ui.welcome-page .home-access .portal-card :is(h3,p),.reference-ui.welcome-page .home-access .school :is(h3,p){color:var(--home-ink)}
.reference-ui.welcome-page .home-access .portal-card>p{color:var(--home-muted)}
.reference-ui.welcome-page .home-access .portal-card .card-action,.reference-ui.welcome-page .home-access .school .card-action{color:var(--home-blue);border-color:var(--home-line);font-size:15px;min-height:48px}
.reference-ui.welcome-page .home-access .portal-card h3{font-size:25px;font-weight:600}
.reference-ui.welcome-page .home-access .card-icon{background:var(--brand-light);border-radius:8px;box-shadow:none}
.reference-ui.welcome-page .home-access .card-icon img{filter:brightness(0);opacity:.85}
.reference-ui.welcome-page .home-preview{box-shadow:none}
.reference-ui.welcome-page .screen-preview{border:1px solid var(--home-line);border-radius:10px;box-shadow:none}
/* Non-interactive HTML previews use the same sidebar, title and metric strip as the app. */
.reference-ui.welcome-page .demo-desktop{background:var(--home-paper);color:var(--home-ink)}
.reference-ui.welcome-page .demo-sidebar{background:var(--home-paper);border-color:var(--home-line)}
.reference-ui.welcome-page .demo-nav-active{background:var(--brand-light);color:var(--brand-dark);border-radius:5px}
.reference-ui.welcome-page .demo-workspace{background:var(--home-paper)}
.reference-ui.welcome-page .demo-welcome{background:transparent;color:var(--home-ink);border:0;border-radius:0;padding-inline:0}
.reference-ui.welcome-page .demo-welcome>span:first-child{color:var(--home-muted)}
.reference-ui.welcome-page .demo-welcome .demo-add{background:var(--home-blue);color:#fff;border-color:var(--home-blue);border-radius:5px}
.reference-ui.welcome-page .demo-tabs{border-bottom:1px solid var(--home-line);padding-bottom:1.5cqw;color:var(--home-muted)}
.reference-ui.welcome-page .demo-tab-active{color:var(--home-ink);border-bottom:2px solid var(--home-blue);padding-bottom:.5cqw}
.reference-ui.welcome-page .demo-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-block:1px solid var(--home-line);background:transparent;margin-top:2cqw}
.reference-ui.welcome-page .demo-stats>div{padding:2cqw 1.3cqw;background:transparent;border:0;border-right:1px solid var(--home-line);border-radius:0}
.reference-ui.welcome-page .demo-stats>div:first-child{padding-left:0}.reference-ui.welcome-page .demo-stats>div:last-child{border-right:0}
.reference-ui.welcome-page .demo-stats strong{color:var(--home-ink);font-size:3.8cqw}
.reference-ui.welcome-page .demo-activity>strong{background:transparent;color:var(--home-ink)}
.reference-ui.welcome-page .demo-table-head{background:transparent;color:var(--home-muted)}
.reference-ui.welcome-page .demo-aula{background:var(--home-paper);color:var(--home-ink)}
@media(hover:hover) and (pointer:fine){
 .reference-ui :is(.btn-primary,.btn-start,.btn-submit,.sl-btn,.home-primary,button.primary):hover,.reference-ui.welcome-page .header-nav .home-login-link:hover{background:var(--brand-dark);border-color:var(--brand-dark)}
 .reference-ui.welcome-page .home-access .portal-card:hover{border-color:var(--home-blue);box-shadow:none;transform:none}
 .reference-ui.welcome-page .home-access .school:hover .card-action{color:var(--brand-dark)}
 .reference-ui.admin-ready button:not(.primary):not([data-danger]):not([aria-pressed=true]):not([aria-selected=true]):hover{background:var(--surface-soft)}
}
@media(max-width:820px){
 body.reference-ui:not(.student-portal)>.site-header{padding:16px 20px}
 .reference-ui.admin-ready .site-header{padding:16px 20px}
 .reference-ui.admin-ready :is(.admin-heading h1,main>h1),.reference-ui.legal-page .legal-header h1,.reference-ui .brand-header h1{font-size:28px}
 .reference-ui.welcome-page .home-copy h1{font-size:clamp(38px,7.2vw,56px)}
 .reference-ui.welcome-page .home-access{padding-block:32px}
 .reference-ui.welcome-page .home-access .portal-card{padding:24px}
 .reference-ui.welcome-page .home-access .portal-card h3{font-size:23px}
}
@media(prefers-reduced-motion:reduce){.reference-ui :is(button,a,input,select,textarea){transition:none!important}}