:root{color:#172033;font-synthesis:none;text-rendering:optimizelegibility;--primary:#275d4b;--primary-dark:#1d493a;--primary-soft:#e8f1ed;--border:#dce1e6;--muted:#687386;--surface:#fff;--success:#23734f;--danger:#b44343;background:#f4f6f8;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;min-height:100dvh;margin:0;overflow-x:hidden}button,input,select{font:inherit}button,select,label{-webkit-tap-highlight-color:transparent}button{touch-action:manipulation}button:focus-visible,select:focus-visible,input:focus-visible+span{outline-offset:2px;outline:3px solid #275d4b40}.app-shell{width:min(960px,100% - 40px);padding:56px 0 max(80px, env(safe-area-inset-bottom));margin:0 auto}.hero{border-bottom:1px solid var(--border);margin-bottom:42px;padding:16px 0 44px}.eyebrow{color:var(--primary);letter-spacing:.18em;text-transform:uppercase;font-size:.75rem;font-weight:800;display:block}.hero h1,.result-card h1{letter-spacing:-.045em;margin:10px 0 12px;font-size:clamp(2.25rem,7vw,4.2rem);line-height:1.06}.hero p,.result-subtitle{color:var(--muted);margin:0;font-size:1.05rem}.section-heading{justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;display:flex}.section-heading>div{align-items:center;gap:12px;display:flex}.section-heading h2{margin:0;font-size:1.25rem}.step-number{color:var(--primary);letter-spacing:.08em;font-size:.78rem;font-weight:800}.muted{color:var(--muted);font-size:.9rem}.bank-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:36px;display:grid}.bank-card{min-height:158px;color:inherit;text-align:left;background:var(--surface);border:1px solid var(--border);cursor:pointer;border-radius:14px;flex-direction:column;gap:7px;padding:24px;transition:border-color .15s,box-shadow .15s,transform .15s;display:flex;position:relative}.bank-card:hover{border-color:#9db1a9;transform:translateY(-1px);box-shadow:0 8px 24px #16282012}.bank-card--selected{border:2px solid var(--primary);background:#fbfdfc;padding:23px}.bank-card strong{font-size:1.08rem}.bank-card>span:not(.bank-card__check):not(.bank-card__meta){color:var(--muted);line-height:1.55}.bank-card__check{color:var(--primary);font-weight:800;display:none;position:absolute;top:16px;right:18px}.bank-card--selected .bank-card__check{display:block}.bank-card__meta{color:#536072;gap:18px;margin-top:auto;font-size:.85rem;display:flex}.settings-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:28px;box-shadow:0 12px 32px #1720330d}.available-count{color:var(--primary);background:var(--primary-soft);border-radius:999px;padding:5px 10px;font-size:.8rem;font-weight:700}.settings-grid{grid-template-columns:1fr 1fr;gap:22px;margin-top:28px;display:grid}.field{color:#3e4858;flex-direction:column;gap:9px;font-size:.9rem;font-weight:700;display:flex}.field--wide{grid-column:1/-1}.field select{color:#172033;cursor:pointer;background:#fff;border:1px solid #cbd2d9;border-radius:9px;width:100%;padding:12px 38px 12px 13px}.segmented{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.segmented button{color:#4f5a6a;border:1px solid var(--border);cursor:pointer;background:#f7f8f9;border-radius:8px;padding:11px}.segmented button.active{color:var(--primary);background:var(--primary-soft);border-color:var(--primary);font-weight:800}.button{cursor:pointer;touch-action:manipulation;border:0;border-radius:9px;min-height:46px;padding:10px 18px;font-weight:750;transition:background .15s,opacity .15s}.button:disabled{opacity:.45;cursor:not-allowed}.button--primary{color:#fff;background:var(--primary)}.button--primary:not(:disabled):hover{background:var(--primary-dark)}.button--secondary{color:#263143;background:#fff;border:1px solid #cbd2d9}.button--quiet{color:#596577;border:1px solid var(--border);background:0 0}.button--start{justify-content:center;align-items:center;gap:10px;width:100%;margin-top:26px;display:flex}.empty-hint{color:var(--danger);text-align:center;margin:12px 0 0;font-size:.88rem}.quiz-shell{width:min(780px,100% - 40px)}.quiz-topbar{justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:28px;display:flex}.quiz-topbar>div{flex:1}.progress-label{color:#465164;margin-bottom:10px;font-weight:750;display:block}.progress-track{background:#dfe4e7;border-radius:99px;height:6px;overflow:hidden}.progress-track span{background:var(--primary);border-radius:inherit;height:100%;transition:width .18s;display:block}.question-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:clamp(24px,5vw,44px);box-shadow:0 14px 40px #1720330f}.question-meta{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.question-meta span{color:#536072;background:#f0f2f4;border-radius:6px;padding:5px 9px;font-size:.78rem;font-weight:700}.question-meta .question-tip{color:var(--primary);background:var(--primary-soft)}.question-title{letter-spacing:-.015em;margin:24px 0 28px;font-size:clamp(1.25rem,3vw,1.65rem);line-height:1.55}.question-title,.option,.feedback,.wrong-list{overflow-wrap:anywhere;word-break:break-word}.options{border:0;gap:12px;margin:0;padding:0;display:grid}.option{cursor:pointer;border:1px solid #d4dae0;border-radius:10px;grid-template-columns:auto 24px 1fr auto;align-items:center;gap:9px;min-height:54px;padding:12px 16px;line-height:1.5;display:grid}.option:hover{background:#fbfdfc;border-color:#8aa89b}.option:has(input:checked){border-color:var(--primary);background:var(--primary-soft)}.option input{width:17px;height:17px;accent-color:var(--primary);margin:0}.option__id{color:#536072;font-weight:800}.option__status{color:inherit;font-size:.78rem;font-weight:800}.options:disabled .option{cursor:default}.options:disabled .option:not(.option--correct):not(.option--wrong){opacity:.7}.option.option--correct{color:#185c3e;opacity:1;background:#e7f5ed;border-color:#58a47c}.option.option--wrong{color:#923737;opacity:1;background:#fbeaea;border-color:#d78585}.feedback{border-left:4px solid;border-radius:8px;margin-top:22px;padding:18px 20px}.feedback--correct{color:#185c3e;border-color:var(--success);background:#edf8f1}.feedback--wrong{color:#7e3131;border-color:var(--danger);background:#fdf0f0}.feedback p{margin:8px 0 0;line-height:1.65}.question-actions{justify-content:flex-end;margin-top:28px;display:flex}.question-actions .button{min-width:150px}.result-shell{width:min(760px,100% - 40px)}.result-card{text-align:center;background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:clamp(28px,7vw,56px)}.result-card h1{font-size:clamp(2rem,6vw,3.4rem)}.score-ring{background:conic-gradient(var(--primary) var(--score), #e6e9ec 0);border-radius:50%;place-items:center;width:160px;height:160px;margin:34px auto;display:grid}.score-ring:before{content:"";background:#fff;border-radius:50%;grid-area:1/1;width:128px;height:128px}.score-ring>div{z-index:1;flex-direction:column;grid-area:1/1;display:flex}.score-ring strong{font-size:2rem}.score-ring span{color:var(--muted);font-size:.82rem}.stats{border:1px solid var(--border);border-radius:12px;grid-template-columns:repeat(3,1fr);margin:0;display:grid}.stats div{flex-direction:column-reverse;gap:5px;padding:18px;display:flex}.stats div+div{border-left:1px solid var(--border)}.stats dt{color:var(--muted);font-size:.82rem}.stats dd{margin:0;font-size:1.45rem;font-weight:800}.text-success{color:var(--success)}.text-danger{color:var(--danger)}.result-actions{grid-template-columns:1fr 1fr;gap:12px;margin-top:26px;display:grid}.wrong-list{border:1px solid var(--border);background:#fff;border-radius:16px;margin-top:28px;padding:26px}.wrong-list h2{margin:0 0 18px;font-size:1.15rem}.wrong-list details{border-top:1px solid var(--border)}.wrong-list summary{cursor:pointer;gap:10px;padding:16px 4px;font-weight:650;line-height:1.5;display:flex}.wrong-list summary span{color:var(--danger)}.wrong-list details>div{color:#556173;padding:0 8px 14px 30px;font-size:.92rem;line-height:1.6}.wrong-list details p{margin:5px 0}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}@media (width<=640px){.app-shell,.quiz-shell,.result-shell{width:min(100% - 24px,960px);padding:max(24px, env(safe-area-inset-top)) 0 max(56px, calc(env(safe-area-inset-bottom) + 36px))}.hero{margin-bottom:30px;padding-top:6px}.hero h1{font-size:2.55rem}.hero p{max-width:30ch;font-size:.98rem;line-height:1.65}.section-heading{flex-wrap:wrap;align-items:flex-start}.bank-grid,.settings-grid{grid-template-columns:1fr}.bank-grid{gap:12px;margin-bottom:28px}.bank-card{min-height:0;padding:20px}.bank-card--selected{padding:19px}.field--wide{grid-column:auto}.settings-card{padding:20px}.field select{min-height:48px;font-size:1rem}.segmented{grid-template-columns:repeat(2,1fr)}.segmented button{min-height:48px}.button--start{min-height:50px}.quiz-shell{padding-top:0}.quiz-topbar{z-index:10;padding:max(14px, env(safe-area-inset-top)) 12px 12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#f4f6f8f5;border-bottom:1px solid #dce1e6e6;align-items:center;margin:0 -12px 18px;position:sticky;top:0}.quiz-topbar .button{white-space:nowrap;padding-inline:12px}.question-card{border-radius:14px;padding:22px 18px}.question-title{margin:20px 0 24px}.options{gap:10px}.option{grid-template-columns:auto 22px minmax(0,1fr);min-height:58px;padding:13px 12px}.option input{width:19px;height:19px}.option__status{grid-column:3}.feedback{padding:16px}.question-actions{bottom:max(8px, env(safe-area-inset-bottom));z-index:5;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff5;border-radius:12px;margin:24px -6px -6px;padding:8px 6px 6px;position:sticky}.question-actions .button{width:100%;min-height:50px}.result-card{padding:32px 20px}.result-actions{grid-template-columns:1fr}.result-actions .button{min-height:50px}.wrong-list{padding:20px 16px}.wrong-list summary{align-items:flex-start}}@media (width<=360px){.app-shell,.quiz-shell,.result-shell{width:calc(100% - 16px)}.hero h1{font-size:2.25rem}.settings-card,.question-card{padding-inline:16px}.quiz-topbar{gap:12px}.quiz-topbar .button{min-height:42px;padding-inline:10px;font-size:.88rem}.progress-label{font-size:.92rem}.option{grid-template-columns:auto 20px minmax(0,1fr)}.stats div{padding:14px 8px}}@media (hover:none){.bank-card:hover{box-shadow:none;transform:none}.option:hover{background:#fff;border-color:#d4dae0}.option:has(input:checked){border-color:var(--primary);background:var(--primary-soft)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important}}
