:root{--bg:#f8f9f5;--ink:#253c33;--muted:#748077;--green:#226c53;--light:#eaf1e9;--border:#e2e7df;--white:#fff;--red:#a84343}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,"Helvetica Neue",sans-serif;font-size:15px;line-height:1.55}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #c99c48;outline-offset:4px}[hidden]{display:none!important}a{color:inherit}.header{max-width:1320px;margin:auto;padding:30px 48px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;text-decoration:none;font-size:25px;letter-spacing:-1.1px;font-weight:700}.brand>span:not(.brand-mark):not(.brand-dot){font-weight:400}.brand-mark{display:grid;place-items:center;width:31px;height:34px;border:1.8px solid var(--green);border-radius:9px;margin-right:10px;color:var(--green);font-size:21px;transform:rotate(-7deg)}.brand-dot{color:var(--green)}.demo-badge{display:flex;gap:8px;align-items:center;border:1px solid var(--border);border-radius:30px;padding:6px 12px;font-size:11px;color:var(--muted)}.demo-badge>span{width:5px;height:5px;border-radius:50%;background:#97ac8d}.welcome{position:relative;max-width:950px;margin:64px auto 0;text-align:center;min-height:550px;padding:0 24px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--green);display:flex;align-items:center;justify-content:center;gap:8px}.tiny-spark{font-size:20px}.welcome h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:86px;line-height:1.08;letter-spacing:-4px;margin:22px 0 23px}.welcome h1 em{font-weight:400;color:var(--green)}.intro{font-size:16px;line-height:1.8;color:var(--muted);margin-bottom:29px}.primary{border:0;background:var(--green);color:white;min-height:47px;padding:12px 22px;border-radius:9px;display:inline-flex;justify-content:center;align-items:center;gap:28px;font-weight:600;transition:background .15s,transform .15s}.primary:hover:not(:disabled){background:#19553f;transform:translateY(-1px)}.primary.large{min-height:54px;padding:14px 28px}.primary>span{font-size:19px;font-weight:400}.text-button{background:none;border:0;padding:7px 0;color:var(--muted);font-size:13px}.text-button:hover{color:var(--green)}#resume{display:block;margin:12px auto 0}.welcome-notes{display:flex;justify-content:center;gap:22px;color:var(--muted);font-size:11px;margin-top:23px}.welcome-notes i{color:var(--green);font-style:normal;margin-right:5px}.mini-stack{position:absolute;right:14px;top:180px;display:flex;text-align:left;width:180px;gap:14px;padding:20px;background:white;border:1px solid var(--border);border-radius:13px;transform:rotate(8deg);box-shadow:5px 8px 0 #edf0e7;opacity:.85}.mini-stack>span:first-child{font-size:10px;color:#a4b09f}.mini-stack>div{flex:1}.mini-line{display:block;background:#e4e9df;height:4px;width:100%;border-radius:3px;margin:3px 0 8px}.mini-line.short{width:65%}.mini-answers{display:flex;gap:4px;margin-top:17px}.mini-answers b{font-size:8px;border:1px solid var(--border);border-radius:3px;padding:3px 5px;color:#a3aaa0;font-weight:400}.mini-answers b.checked{background:var(--light);border-color:#b8cdb6;color:var(--green)}.mini-star{position:absolute;top:-30px;right:-9px;color:#b7c4aa;font-size:40px;font-family:Georgia,serif}.content-width{max-width:760px;margin:32px auto 0;padding:0 24px;min-height:520px}.section-title{font-family:Georgia,"Times New Roman",serif;font-size:44px;font-weight:400;line-height:1.2;letter-spacing:-1.5px;margin:13px 0 12px}.setup>.eyebrow{justify-content:flex-start;margin-top:28px}.muted{color:var(--muted);font-size:14px}.label-row{display:flex;align-items:center;justify-content:space-between;margin:28px 0 12px}.label-row h2,.mode-field legend{font-weight:600;font-size:13px;margin:0}.subjects{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.subject{background:var(--white);border:1px solid var(--border);border-radius:11px;display:flex;align-items:center;gap:11px;padding:15px 12px;text-align:left;color:var(--ink);position:relative;min-height:82px}.subject:hover{border-color:#a4bba2}.subject[aria-pressed=true]{border-color:var(--green);background:#eef4ed;box-shadow:0 0 0 1px var(--green)}.subject-icon{display:grid;place-items:center;flex-shrink:0;border-radius:9px;width:34px;height:36px;font-family:Georgia,serif;font-size:17px;background:#edf1fb;color:#667ea8}.subject-icon.rose{background:#f8e9e7;color:#ad7775}.subject-icon.amber{background:#f8f0de;color:#ad8b46}.subject-icon.violet{background:#eee9f6;color:#9177ad}.subject-icon.teal{background:#e3f1e9;color:#609c7e}.subject-icon.sky{background:#e5f1f4;color:#6c9aa4}.subject strong{display:block;font-size:12px;font-weight:600}.subject small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.mode-field{padding:0;border:0;margin:28px 0}.modes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:13px}.mode-option{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--border);border-radius:10px;padding:16px 13px;cursor:pointer}.mode-option:has(input:checked){border-color:var(--green);background:#f3f6f0}.mode-option input{accent-color:var(--green);margin:0}.mode-symbol{font-size:25px;color:var(--green)}.mode-option strong{display:block;font-size:13px}.mode-option small{display:block;font-size:10px;color:var(--muted);margin-top:3px}.setup-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--border);padding-top:20px}.setup-bottom .muted{font-size:12px}.back{font-size:12px}.practice{margin-top:19px}.practice-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.timer{font-variant-numeric:tabular-nums;border:1px solid var(--border);padding:5px 11px;border-radius:20px;font-size:12px;color:var(--green)}.progress-label{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-bottom:8px}.progress-track{height:3px;background:var(--border);border-radius:3px;margin-bottom:23px}.progress-track>div{height:100%;background:var(--green);border-radius:3px;transition:width .2s}.question-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:30px 34px;box-shadow:0 5px 20px #233c3303}.question-meta{display:flex;align-items:center;gap:11px;font-size:10px;color:var(--muted)}.subject-tag{background:var(--light);color:var(--green);border-radius:5px;padding:4px 9px;font-weight:600}.question-card h1{font-size:22px;font-weight:500;line-height:1.65;margin:22px 0 14px;letter-spacing:-.3px}.question-card h1:focus{outline:none}.answer-hint{font-size:11px;color:var(--muted);margin:0 0 20px}.choices{display:grid;gap:10px}.choice{position:relative;width:100%;display:flex;align-items:center;gap:13px;border:1px solid var(--border);border-radius:8px;padding:13px 14px;min-height:51px;background:#fff;text-align:left;font-size:14px;color:var(--ink);transition:border-color .15s,background .15s}.choice:hover:not(:disabled){border-color:var(--green);background:#f7faf5}.choice:disabled{opacity:1}.choice-letter{display:grid;place-items:center;width:25px;height:25px;flex-shrink:0;border-radius:50%;background:#f3f5f0;color:#7f8d7f;font-size:11px;font-weight:600}.choice.correct{border-color:#76a88b;background:#eff7ef}.choice.correct .choice-letter{background:var(--green);color:#fff}.choice.wrong{border-color:#d4a1a1;background:#fdf3f1}.choice.wrong .choice-letter{background:#a94c4c;color:#fff}.choice-state{margin-left:auto;font-size:17px;padding-left:5px}.skip-question{font-size:11px;display:block;margin:13px auto -5px}.feedback{margin-top:21px;padding:11px 13px;border-radius:7px;background:#eff6ee;color:var(--green);font-size:13px}.feedback.incorrect{background:#fbf0ed;color:#954c42}.feedback.blank{background:#f4f2e9;color:#86764c}.after-answer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:18px}.solution-button{color:var(--green);font-size:12px;font-weight:600}.solution-button span{margin-left:10px}.explanation{margin-top:22px;padding:18px;background:#f7f8f3;border-left:2px solid #a8b99d;border-radius:0 7px 7px 0}.explanation h2{font-size:11px;letter-spacing:.5px;margin:0 0 8px;color:var(--green)}.explanation p{font-size:13px;color:#657365;line-height:1.8;margin:0}.session-stats{display:flex;justify-content:center;gap:25px;margin-top:19px;color:var(--muted);font-size:11px}.session-stats b{font-weight:600;font-size:13px;margin-right:3px}.session-stats>span:first-child b{color:var(--green)}.summary{text-align:center;padding-top:42px}.finish-icon{display:grid;place-items:center;font-size:29px;color:var(--green);width:64px;height:64px;border:1px solid #c9d9c5;border-radius:50%;background:var(--light);margin:0 auto 25px}.result-score{display:flex;flex-direction:column;margin:30px 0 22px}.result-score strong{font-size:62px;font-family:Georgia,serif;font-weight:400;color:var(--green);line-height:1.1}.result-score>span{font-size:12px;color:var(--muted);margin-top:8px}.result-details{display:flex;justify-content:center;gap:24px;font-size:13px;color:var(--muted)}.sample-note{font-size:11px;color:var(--muted);line-height:1.8;margin:26px 0}.error{max-width:700px;margin:20px auto;padding:12px 16px;background:#faece9;border:1px solid #e7c6bd;border-radius:8px;font-size:13px;color:#8b3e35}footer{max-width:1224px;display:flex;justify-content:space-between;align-items:center;margin:50px auto 0;padding:22px 32px;border-top:1px solid var(--border);color:#8d978a;font-size:10px}footer>span{font-family:Georgia,serif;font-style:italic;font-size:15px}footer p{text-align:right;line-height:1.7;margin:0}.skip{position:absolute;left:10px;top:-70px;background:white;padding:12px;z-index:10}.skip:focus{top:10px}dialog{border:1px solid var(--border);border-radius:18px;padding:36px;max-width:420px;text-align:center;color:var(--ink);background:var(--bg)}dialog::backdrop{background:#233d3266;backdrop-filter:blur(4px)}dialog h2{font:36px Georgia,serif;margin:15px 0}dialog p{font-size:13px;color:var(--muted)}.break-symbol{font-size:38px;margin-bottom:20px}#break-time{display:block;font-size:45px;font-weight:400;margin:25px;font-variant-numeric:tabular-nums}dialog .primary{width:100%;font-size:12px}@media(min-width:1600px){.welcome{margin-top:100px}}@media(max-width:1050px){.mini-stack{display:none}}@media(max-width:600px){.header{padding:22px 22px}.brand{font-size:22px}.brand-mark{width:27px;height:30px;font-size:18px}.demo-badge{font-size:10px;padding:5px 9px}.welcome{margin-top:62px;min-height:460px}.welcome h1{font-size:65px;letter-spacing:-3px}.intro{font-size:14px}.welcome-notes{gap:15px;font-size:10px}.content-width{padding:0 20px;margin-top:15px}.section-title{font-size:36px}.subjects{grid-template-columns:repeat(2,1fr);gap:9px}.subject{padding:12px 10px;min-height:77px}.modes{grid-template-columns:1fr}.mode-option{padding:12px 14px}.mode-option small{font-size:11px}.setup-bottom{gap:12px}.setup-bottom .primary{padding:12px 17px;gap:14px}.question-card{padding:23px 19px;border-radius:12px}.question-card h1{font-size:19px;line-height:1.65}.choice{font-size:13px;padding:12px 11px}.question-meta{gap:8px}.after-answer .primary{font-size:12px;padding:11px 15px;gap:12px}footer{margin-top:35px;padding:22px;flex-direction:column;gap:13px}footer p{text-align:center;font-size:9px}.summary{padding-top:32px}.result-details{gap:15px;font-size:12px}.practice-top{margin-bottom:20px}.error{margin:20px}.welcome .eyebrow{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
.hp-field{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.welcome-area{background:none;border:0;color:inherit;font:inherit;letter-spacing:inherit;padding:5px;cursor:pointer}
.area-switch{background:var(--light);border:1px solid #c9d9c5;border-radius:20px;padding:7px 12px;color:var(--green);font-size:12px}.empty-area{padding:20px;background:white;border:1px solid var(--border);border-radius:12px;font-size:14px;color:var(--muted)}#area-dialog{width:calc(100% - 30px);max-width:600px;text-align:left;padding:25px}#area-dialog h2{font-size:31px}.area-tabs{display:flex;gap:10px;margin:20px 0}.area-tabs [aria-pressed=true]{background:var(--green);color:white}.area-list{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;max-height:50vh;overflow:auto}.area-card{padding:16px;text-align:left;border:1px solid var(--border);border-radius:10px;background:white;color:var(--ink);min-width:0}.area-card strong{display:block;font-size:13px}.area-card small{display:block;font-size:10px;color:var(--muted);margin-top:7px}.area-card[aria-pressed=true]{border-color:var(--green);background:var(--light)}#area-error{color:var(--red);font-size:13px}@media(max-width:600px){.area-switch{font-size:10px;padding:6px 9px}.header .account-nav{max-width:205px}.area-card{padding:13px 10px}.area-card strong{font-size:12px}.area-card small{font-size:9px}}
#pending-email{overflow-wrap:anywhere}#pending-registration h3{font:24px Georgia,serif;margin:20px 0 12px}#pending-registration .secondary{width:100%;font-size:12px}#change-email-form{border-top:1px solid var(--border);margin-top:22px;padding-top:4px}#account-message{color:var(--green);background:var(--light);padding:10px 12px;border-radius:7px}#confirm-start-over{display:block;margin-top:12px}
.account-nav{display:flex;align-items:center;justify-content:flex-end;gap:16px;flex-wrap:wrap;font-size:12px}.account-nav a{color:var(--green)}#account-name{max-width:150px;overflow:hidden;text-overflow:ellipsis}.account-nav .text-button{font-size:12px}#account-dialog{width:calc(100% - 30px);max-width:460px;text-align:left;padding:26px}#account-dialog h2{font-size:29px}#account-dialog label{display:block;font-size:13px;margin:16px 0}#account-dialog input{display:block;width:100%;padding:12px;margin-top:7px;border:1px solid var(--border);border-radius:7px;font:inherit;background:white;color:var(--ink)}.account-actions{display:flex;gap:12px;margin-top:18px}.secondary{background:white;border:1px solid var(--green);color:var(--green);padding:11px 16px;border-radius:9px}#account-error{color:var(--red);font-size:13px}.history-card{background:white;border:1px solid var(--border);border-radius:10px;padding:18px;margin:12px 0;overflow-wrap:anywhere}.history-card summary{cursor:pointer;font-size:14px}.history-card p{font-size:13px}.history-card .muted{font-size:11px}@media(max-width:600px){.header{gap:12px;align-items:flex-start}.account-nav{gap:4px 12px;max-width:200px}.account-nav #account-name{width:100%;text-align:right}.account-actions{flex-wrap:wrap}.welcome{margin-top:42px}}
#report-dialog{width:calc(100% - 30px);max-width:480px;text-align:left;padding:25px}#report-dialog h2{font-size:28px}#report-dialog label{display:block;margin:16px 0;font-size:13px}#report-dialog select,#report-dialog textarea{display:block;width:100%;margin-top:7px;padding:10px;border:1px solid var(--border);border-radius:7px;background:white;font:inherit;color:var(--ink)}#report-dialog textarea{resize:vertical}#practice-report:empty{display:none}#practice-report{margin-top:12px}select:focus-visible,textarea:focus-visible{outline:3px solid #c99c48;outline-offset:3px}
#password-change-dialog{width:calc(100% - 30px);max-width:460px;padding:26px;text-align:left}#password-change-dialog h2{font-size:29px}#password-change-dialog label{display:block;font-size:13px;margin:16px 0}#password-change-dialog input{display:block;width:100%;padding:12px;margin-top:7px;border:1px solid var(--border);border-radius:7px;font:inherit;background:white;color:var(--ink)}#password-change-message{color:var(--green);background:var(--light);padding:12px;border-radius:7px}#password-change-error{color:var(--red);font-size:13px}#close-password-change{margin-top:10px}
/* Account deletion uses the same form layout as the other account dialogs. */
#delete-account-dialog{width:calc(100% - 30px);max-width:460px;padding:26px;text-align:left}
#delete-account-dialog h2{font-size:29px}
#delete-account-dialog label{display:block;font-size:13px;margin:16px 0}
#delete-account-dialog input{display:block;width:100%;padding:12px;margin-top:7px;border:1px solid var(--border);border-radius:7px;font:inherit;background:white;color:var(--ink)}
#submit-delete-account{background:var(--red)}
#submit-delete-account:hover:not(:disabled){background:#883535}
#delete-account-error{color:var(--red);font-size:13px}
dialog{max-height:calc(100vh - 30px);max-height:calc(100dvh - 30px);overflow-y:auto;overscroll-behavior:contain}
.question-card,.choice,.explanation,#account-name{overflow-wrap:anywhere}
.choice>span:not(.choice-letter):not(.choice-state){min-width:0}
@media(max-width:600px){
  .header{flex-wrap:wrap}
  .header .account-nav{flex:1 1 140px;max-width:none;min-width:0}
  .account-nav #account-name{max-width:100%}
  button.text-button,.area-switch,.welcome-area,.account-nav a{min-height:44px}
  button.text-button{padding:10px 4px}
  .area-tabs button{min-height:44px}
  dialog input,dialog select,dialog textarea{font-size:16px!important}
  .question-meta,.progress-label,.practice-top,.after-answer,.setup-bottom{flex-wrap:wrap;gap:10px}
  .progress-label>span:first-child{min-width:0;overflow-wrap:anywhere}
  .after-answer .primary{flex:1 0 130px}
  .after-answer .solution-button{flex:1 0 110px}
  .welcome-notes{flex-wrap:wrap;row-gap:6px}
  .subjects{grid-template-columns:repeat(2,minmax(0,1fr))}
  .subject>span:last-child{min-width:0;overflow-wrap:anywhere}
}
@media(max-width:360px){
  .welcome h1{font-size:55px;letter-spacing:-2px}
  #account-dialog,#password-change-dialog,#delete-account-dialog,#report-dialog,#area-dialog{padding:20px}
  .area-list{grid-template-columns:1fr}
}
.account-menu{position:relative;flex-shrink:0}
.account-menu>summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;min-height:44px;padding:8px 12px;border:1px solid var(--border);border-radius:9px;background:white;color:var(--green);font-size:12px}
.account-menu>summary::-webkit-details-marker{display:none}
.account-menu>summary:focus-visible{outline:3px solid #c99c48;outline-offset:3px}
.account-menu[open]>summary{border-color:var(--green);background:var(--light)}
.account-menu-panel{position:absolute;z-index:50;right:0;top:calc(100% + 8px);width:min(280px,calc(100vw - 40px));padding:10px;background:white;border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 32px #253c3322;text-align:left}
.account-menu-panel #account-name{display:block;width:100%;max-width:none;white-space:normal;overflow-wrap:anywhere;text-align:left;font-size:12px;color:var(--ink);padding:8px 10px 14px;margin-bottom:6px;border-bottom:1px solid var(--border)}
.account-menu-panel button.text-button,.account-menu-panel a{display:flex;align-items:center;width:100%;min-height:44px;padding:10px;border-radius:6px;text-align:left;text-decoration:none;font-size:13px;color:var(--ink)}
.account-menu-panel button.text-button:hover,.account-menu-panel a:hover{background:var(--light)}
.account-menu-panel #open-delete-account{border-top:1px solid var(--border);margin-top:6px;padding-top:13px;color:var(--red)}
@media(max-width:600px){.header .account-nav{gap:4px 8px}}
@media(max-width:360px){.account-menu-panel{width:260px;max-width:calc(100vw - 40px)}}
.error p{margin:0 0 10px}.error .secondary{font-size:13px;max-width:100%;min-height:44px}.connection-status{max-width:700px;margin:20px auto;padding:12px 16px;background:var(--light);border-radius:8px;color:var(--green);font-size:13px}@media(max-width:600px){.connection-status{margin:20px}}
