tools/site/assets/mcat-theme.css

/* Portfolio-aligned study interface. System font stacks keep the app self-hosted. */
:root{--navy:#18374b;--navy-deep:#102b3d;--navy-mid:#34566b;--slate:#586773;--amber-dark:#88682f;--amber-warm:#785822;--blue-light:#edf1f1;--page-bg:#f5f6f3;--white:#fff;--sage:#edf5ef;--amber-fill:#faf4e7;--red-fill:#fbefee;--bg:#f5f6f3;--surface:#fff;--border:#d7dcd9;--border-med:#bbc7c7;--text:#18374b;--text-body:#263b48;--muted:#586773;--dim:#e0e6e3;--accent:#18374b;--accent2:#34566b;--serif:Georgia,'Times New Roman',serif;--sans:Inter,'Segoe UI',Arial,sans-serif;--mono:Consolas,'Liberation Mono',monospace}
html{scroll-behavior:smooth;scroll-padding-top:100px}body{font-family:var(--sans);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;background:var(--page-bg)}body::before{display:none}button,input,select,textarea{font-family:var(--sans)!important}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}a{text-underline-offset:.22em}a:hover{color:var(--amber-dark)}button{touch-action:manipulation}button:focus-visible,a:focus-visible,[role=button]:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #88682f;outline-offset:4px}button:disabled{cursor:default}
.study-skip{position:absolute;left:20px;top:-100px;background:white;padding:12px 20px;z-index:100}.study-skip:focus{top:10px}.study-masthead{background:#fff;border-bottom:1px solid var(--border)}.study-masthead-inner{max-width:1120px;margin:auto;padding:24px 32px;display:flex;justify-content:space-between;align-items:center;gap:24px}.study-brand{display:flex;flex-direction:column;gap:3px;text-decoration:none;color:var(--navy)}.study-brand-name{font:20px/1.3 var(--serif);letter-spacing:.07em;text-transform:uppercase}.study-brand-sub{font:9px/1.6 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}.study-masthead nav{display:flex;gap:28px;font-size:12px;align-items:center}.study-masthead nav a{color:var(--navy);text-decoration:none}.study-masthead nav a:hover{text-decoration:underline}.study-status{background:var(--navy);color:#eff3f5;text-align:center;font:10px/1.6 var(--mono);letter-spacing:.1em;padding:9px 20px;text-transform:uppercase}
.wrap{max-width:864px;padding:0 32px 72px}#screen-home>.wrap{max-width:1120px}.home-hero{padding:56px 0 36px;border-bottom:1px solid var(--border);margin-bottom:28px;position:relative}.hero-badge{border:0;border-left:24px solid #c1a36c;padding:0 0 0 12px;background:none;color:var(--muted);font:10px/1.6 var(--mono);letter-spacing:.08em;margin-bottom:20px}.hero-title{font:400 clamp(42px,5.8vw,64px)/1.08 var(--serif);letter-spacing:-.035em;color:var(--navy);margin:0 0 18px}.hero-title span{color:var(--navy)}.hero-divider{display:none}.hero-sub{font-size:14px;line-height:1.8;font-style:normal;letter-spacing:0;color:var(--muted)}
#home-score{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:24px}#home-score>.score-strip,#home-score>.plan-strip{grid-column:1/-1;margin:0}#home-score>.results-card{margin:0;min-width:0}#home-score>.results-card:first-of-type,#home-score>.results-card:last-child{grid-column:1/-1}.config-card,.results-card,.exam-card,.question-box,.passage-card,.interstitial{border:1px solid var(--border);border-top:2px solid #c1a36c;background:white;box-shadow:none;padding:26px 28px}.config-card,.results-card,.exam-card{margin-bottom:20px}.section-label,.r-label{font:10px/1.6 var(--mono);letter-spacing:.13em;color:var(--muted);margin-bottom:16px}.section-label + p,.results-card>p,.results-card>ul,.results-card>ol{font-size:14px;line-height:1.85}.results-card p+ p{margin-top:12px}.muted-note,.advice,.tip-card,.break-banner,.toggle{font-size:13px;line-height:1.8}.advice{padding:14px 16px;margin:12px 0;border-left:2px solid #c1a36c;background:var(--page-bg)}.tip-card{padding:18px;border-color:var(--border)}
.home-actions{gap:10px;margin:0 0 32px}.action-btn{min-height:46px;font-size:12px;padding:12px 16px;letter-spacing:0;border-color:var(--border-med)}.action-btn.smart{padding:20px 24px;border:none}.action-btn.smart .smart-title{font:400 23px/1.3 var(--serif);letter-spacing:0;text-transform:none}.action-btn.smart small{font-size:12px;line-height:1.65}.action-btn.smart>b{font:13px var(--mono);padding:8px}.mode-toggle{border:0;border-bottom:1px solid var(--border-med);gap:24px;background:none;margin-bottom:28px;overflow:visible}.mode-btn{background:none;border:0!important;padding:15px 10px 15px;color:var(--muted);font-size:12px;letter-spacing:.08em;min-height:64px;position:relative}.mode-btn.active{background:none;color:var(--navy)}.mode-btn.active::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:3px;background:#88682f}.mode-btn:hover:not(.active){background:var(--blue-light)}.mode-sub{font:10px/1.6 var(--mono);letter-spacing:0;margin-top:4px;opacity:1}
.count-btn,.subject-chip,.sg-chip,.conf-btn,.seg-btn,.micro-btn{min-height:40px;font-size:12px;padding:8px 13px;letter-spacing:0;font-weight:600}.micro-btn{min-height:36px;font-size:11px;text-transform:none}.count-btn.small{min-height:40px}.sg-subject-row{background:var(--page-bg);padding:18px 16px;border-top:1px solid var(--border);gap:12px}.sg-subject-row:hover{background:var(--blue-light)}.sg-subject-name{color:var(--navy);font:600 12px/1.6 var(--sans);letter-spacing:.05em}.sg-subject-count,.sg-chevron{color:var(--muted);font-size:11px}.sg-subject-meta{gap:12px}.sg-select-all{background:white;border-color:var(--border-med);color:var(--navy);padding:6px 10px;min-height:34px;letter-spacing:0;font-size:11px}.sg-select-all:hover{background:var(--navy);color:white}.sg-topic-row{padding:14px 18px;background:var(--blue-light)}.sg-topic-row:hover{background:#e2e9e7}.sg-topic-name{font-size:12px}.sg-chips{padding:16px 20px;gap:8px}.sg-avail{font:11px/1.6 var(--mono);padding:14px 16px;background:var(--page-bg);gap:12px;flex-wrap:wrap}.sg-chip-count{opacity:.85}.start-btn,.new-quiz-btn,.next-btn{min-height:48px;font-size:12px;letter-spacing:.06em;padding:14px 20px}.start-btn{margin-top:4px}.start-btn:hover,.new-quiz-btn:hover{transform:none}.psel-btn{padding:16px;font-size:13px;min-height:54px}.psel-name{font-size:13px}.psel-count{font:10px var(--mono)}.pgroup-label{background:none;color:var(--muted);font:10px/1.6 var(--mono);padding:0;margin:12px 0}.exam-title,.passage-title,.interstitial h2,.about h2{font:400 25px/1.3 var(--serif);color:var(--navy)}.exam-meta{font-size:12px;line-height:1.8}.exam-sec{font:11px/1.6 var(--mono)}.exam-actions{min-width:180px}.passage-text{font-size:15px;line-height:1.95;color:var(--text-body)}.passage-topic{font:10px/1.6 var(--mono)}.question-text{font:400 20px/1.65 var(--serif)}.choice-btn{font-family:var(--sans);font-size:14px;line-height:1.75;padding:16px 18px;min-height:54px}.choice-lbl{width:26px;height:26px;font:11px var(--mono)}.exp-text,.missed-exp{font-size:14px;line-height:1.85}.exp-label{font:10px/1.6 var(--mono)}.explanation-box{padding:22px;border-left:2px solid var(--navy)}.quiz-header{background:rgba(245,246,243,.98);border-bottom:1px solid var(--border-med);padding-bottom:14px;margin:0 -32px;padding-left:32px;padding-right:32px}.progress-track{height:3px;background:var(--dim)}.progress-fill{background:#88682f}.quiz-meta{gap:10px;flex-wrap:wrap}.qm-counter,.qm-subject,.qm-timer,.qm-score{font:11px/1.6 var(--mono);letter-spacing:0}.qm-end{min-height:40px;padding:8px 12px;font-size:12px}.app-nav{background:#fff}.app-nav-inner{padding:8px 32px}.home-back-btn{border-color:var(--border);font-family:var(--sans);font-size:12px}.score-pct,.total-score,.tile-score,.stat b{font-family:var(--serif);font-weight:400}.results-hero{padding:48px 0 28px}.score-sub{font-size:14px;line-height:1.7}.footer{font-size:12px;line-height:1.9;letter-spacing:0;text-align:left;margin-top:32px;padding-top:24px}.footer-legal{font-size:11px;line-height:1.8;opacity:1;max-width:800px}.plan-strip{min-height:48px;font-family:var(--sans);font-size:13px;padding:14px 18px}.plan-form input,.plan-form select,.explain-it textarea{font-size:16px;padding:12px}.plan-form label{font-size:11px}.plan-form{gap:18px}.explain-it{font-size:13px}.stat-row{gap:12px}.stat{padding:18px 12px}.stat span{font-size:11px}.subject-row{font-size:12px}.sr-name{font-size:12px}.about p,.about li{font-size:14px;line-height:1.85}.kb-hint,.report-link{font-size:11px}.nav-cell{min-height:40px}.score-strip>span{padding:12px 16px}.score-strip small{font-size:10px}.data-figure th,.data-figure td{padding:8px 10px}
@media(min-width:1000px){#screen-home #recall-config{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:20px;align-items:start}#screen-home #recall-config>.config-card{margin:0 0 20px}.passage-layout{gap:24px}#screen-exam .wrap.wide,#screen-passage .wrap{max-width:1240px}}
@media(max-width:760px){.study-masthead-inner{padding:20px 24px;gap:16px;flex-wrap:wrap}.study-brand-name{font-size:18px}.study-masthead nav{gap:20px;font-size:12px}.study-status{font-size:9px;letter-spacing:.04em}.wrap{padding:0 24px 56px}.home-hero{padding:40px 0 28px}.hero-title{font-size:46px}.hero-badge{font-size:9px;line-height:1.9;max-width:100%}.hero-sub{font-size:13px}#home-score{grid-template-columns:1fr;gap:16px}#home-score>*{grid-column:1!important}.config-card,.results-card,.exam-card,.question-box,.passage-card,.interstitial{padding:22px}.mode-toggle{gap:8px}.mode-btn{font-size:11px;padding:14px 5px}.mode-sub{font-size:9px}.quiz-header{margin:0 -24px;padding-left:24px;padding-right:24px}.app-nav-inner{padding:8px 24px}.exam-actions{width:100%}.passage-text{font-size:14px}.question-text{font-size:19px}.score-strip>span{padding:10px 9px;font-size:17px}.section-label + p,.results-card>p{font-size:13px}}
@media(max-width:440px){.study-masthead-inner{padding:18px 20px}.study-masthead nav{width:100%;justify-content:space-between;gap:12px}.wrap{padding:0 20px 48px}.hero-title{font-size:42px}.config-card,.results-card,.exam-card,.question-box,.passage-card{padding:18px}.count-row{gap:6px}.count-btn{padding:9px 13px}.sg-subject-row{padding:15px 10px;gap:8px}.sg-subject-name{font-size:11px}.sg-subject-meta{gap:7px}.sg-subject-count{font-size:10px}.sg-select-all{padding:5px 7px}.sg-chips{padding:12px 10px}.quiz-header{margin:0 -20px;padding-left:20px;padding-right:20px}.app-nav-inner{padding:8px 20px}.choice-btn{padding:14px;font-size:14px;gap:10px}.mode-toggle{gap:0}.hero-badge{border-left-width:16px}.subject-row{grid-template-columns:minmax(0,110px) 1fr 36px}.score-strip small{font-size:9px}.footer{font-size:11px}.stat-row,.section-grid{gap:8px}.home-actions .action-btn{flex:1 1 46%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Real-page navigation, with touch targets and visible current location. */
.study-pages{background:#fff;border-bottom:1px solid var(--border,#d7dcd9)}.study-pages .wrap{display:flex;gap:6px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}.study-pages a{color:#18374b;text-decoration:none;padding:11px 14px;border-radius:4px;font-size:14px;font-weight:600;min-height:44px;box-sizing:border-box}.study-pages a:hover{background:#f5f6f3}.study-pages a[aria-current="page"]{background:#18374b;color:white}.study-pages a:focus-visible{outline:3px solid #88682f;outline-offset:2px}#page-notice{margin-top:20px} @media(max-width:600px){.study-pages .wrap{gap:3px}.study-pages a{font-size:13px;padding:11px 9px}}