* { box-sizing:border-box; } body { margin:0; min-width:320px; color:var(--ink); background:var(--canvas); font-family:Vazirmatn, Tahoma, sans-serif; line-height:1.65; } button { font:inherit; } button:focus-visible,a:focus-visible { outline:3px solid var(--focus-ring); outline-offset:3px; }.app-shell{min-height:100vh}.brand{display:flex;align-items:center;gap:10px;font-weight:800;text-decoration:none;color:var(--ink)}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:11px;color:#fff;background:linear-gradient(140deg,#5d6ef0,#3546bd);box-shadow:0 8px 18px rgba(69,89,230,.25)}.eyebrow{margin:0 0 6px;color:var(--primary);font-size:.77rem;font-weight:700;letter-spacing:.02em}.intro-page,.results-page{min-height:100vh;padding:34px clamp(20px,6vw,92px);background:radial-gradient(circle at 80% 16%,var(--primary-glow) 0,transparent 28%),var(--canvas)}.intro-card,.results-card{width:min(100%,760px);margin:clamp(54px,11vh,110px) auto 0;padding:clamp(32px,6vw,62px);text-align:center;border:1px solid var(--glass-border);border-radius:28px;background:rgba(var(--glass), .84);box-shadow:var(--shadow);backdrop-filter:blur(18px)}.intro-orb,.result-icon{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 20px;border-radius:20px;color:var(--primary);font-size:25px;background:var(--primary-bg)}.intro-card h1,.results-card h1{margin:0;font-size:clamp(1.7rem,4vw,2.4rem);line-height:1.35}.intro-copy,.result-copy{max-width:545px;margin:18px auto 28px;color:var(--muted)}.exam-facts,.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;overflow:hidden;margin:28px 0;border:1px solid var(--line);border-radius:16px;background:var(--line)}.exam-facts>div,.result-stats>div{padding:17px 10px;background:var(--surface)}.exam-facts strong,.result-stats strong{display:block;font-size:1rem}.exam-facts span,.result-stats span{display:block;color:var(--muted);font-size:.76rem}.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:10px 17px;border:1px solid transparent;border-radius:12px;cursor:pointer;font-weight:700;transition:transform .18s,box-shadow .18s,background .18s}.button:hover:not(:disabled){transform:translateY(-2px)}.button:disabled{cursor:not-allowed;opacity:.45}.button-primary{color:#fff;background:var(--primary-solid);box-shadow:0 8px 20px rgba(69,89,230,.22)}.button-primary:hover:not(:disabled){background:var(--primary-solid-hover)}.button-secondary{border-color:var(--line);color:var(--ink);background:var(--surface)}.button-large{padding:14px 24px;border-radius:14px;font-size:1rem}.intro-note{margin:15px 0 0;color:var(--muted);font-size:.78rem}.exam-header{position:sticky;z-index:2;top:0;padding:16px clamp(16px,5vw,72px) 0;border-bottom:1px solid var(--line);background:rgba(var(--glass), .92);backdrop-filter:blur(14px)}.topbar{display:flex;align-items:center;gap:18px;min-height:36px}.exam-name{margin-left:auto;color:var(--muted);font-size:.88rem}.text-button{border:0;color:var(--danger);background:transparent;cursor:pointer;font-weight:700}.metrics{display:grid;grid-template-columns:1.3fr repeat(4,1fr);gap:10px;margin-top:15px}.metric{min-width:0;padding:9px 12px;border-radius:11px;background:var(--fill)}.metric span,.metric strong{display:block}.metric span{color:var(--muted);font-size:.7rem}.metric strong{font-size:.89rem;white-space:nowrap}.metric em{font-style:normal;color:var(--muted);font-size:.7rem}.metric-correct{background:var(--success-bg)}.metric-correct span,.metric-correct strong{color:var(--success)}.metric-wrong{background:var(--danger-bg)}.metric-wrong span,.metric-wrong strong{color:var(--danger)}.metric-time{background:var(--primary-bg)}.metric-time span,.metric-time strong{color:var(--primary)}.progress-track{height:4px;margin-top:15px;overflow:hidden;background:var(--track)}.progress-value{height:100%;border-radius:4px;background:linear-gradient(90deg,#6677f4,#4053dc);transition:width .3s ease}.exam-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:24px;max-width:1200px;margin:0 auto;padding:34px clamp(16px,5vw,72px) 60px}.question-card,.navigator{border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:0 5px 20px rgba(22,32,61,.03)}.question-card{padding:clamp(22px,4vw,40px)}.question-heading{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.question-heading h1{margin:0;font-size:clamp(1.25rem,2.4vw,1.7rem);line-height:1.8}.important-badge{display:flex;align-items:center;gap:4px;flex:none;padding:5px 9px;border-radius:8px;color:var(--danger-ink);background:var(--danger-bg);font-size:.74rem;font-weight:700}.question-image{display:grid;place-items:center;min-height:180px;margin:24px 0;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--fill-soft)}.question-image img{max-width:100%;max-height:220px;border-radius:12px}.options{display:grid;gap:11px;margin-top:30px}.option{display:flex;align-items:center;gap:13px;width:100%;padding:15px;border:1px solid var(--line);border-radius:14px;text-align:right;color:var(--ink);background:var(--surface);cursor:pointer;transition:transform .16s,border-color .16s,box-shadow .16s}.option:hover:not(:disabled){border-color:var(--primary-line-strong);box-shadow:0 7px 18px rgba(69,89,230,.09);transform:translateX(-2px)}.option:disabled{cursor:default}.option-letter{display:grid;place-items:center;flex:none;width:29px;height:29px;border-radius:9px;color:var(--ink-3);background:var(--fill);font-weight:700}.option b{margin-right:auto;font-size:1.1rem}.option.is-correct{border-color:var(--success-line);color:var(--success-ink);background:var(--success-bg)}.option.is-correct .option-letter{color:#fff;background:var(--success-solid)}.option.is-wrong{border-color:var(--danger-line);color:var(--danger-ink);background:var(--danger-bg)}.option.is-wrong .option-letter{color:#fff;background:var(--danger-solid)}.option.is-muted{opacity:.54}.study-note{display:flex;gap:14px;margin-top:24px;padding:17px;border:1px solid var(--primary-line);border-radius:15px;background:var(--primary-bg-soft)}.study-icon{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:11px;background:var(--primary-bg)}.study-note p{margin:0;color:var(--primary);font-size:.77rem;font-weight:700}.study-note h3{margin:2px 0;font-size:.93rem}.study-note span{color:var(--muted);font-size:.8rem}.question-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:30px;color:var(--muted);font-size:.8rem}.locked-state{color:var(--success);font-weight:700}.navigator{align-self:start;padding:20px;position:sticky;top:164px}.navigator-head{display:flex;align-items:center;justify-content:space-between}.navigator h2{margin:0;font-size:1.08rem}.navigator-head>span{padding:3px 9px;border-radius:9px;color:var(--primary);background:var(--primary-bg);font-size:.75rem;font-weight:700}.question-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:20px 0}.question-number{position:relative;display:grid;place-items:center;aspect-ratio:1;border:1px solid var(--line);border-radius:10px;color:var(--muted);background:var(--surface);cursor:pointer;font-size:.82rem;font-weight:700;transition:transform .15s,border-color .15s}.question-number:hover{transform:translateY(-2px);border-color:var(--primary-line-strong)}.question-number.current{outline:2px solid var(--primary);outline-offset:2px;color:var(--primary);border-color:var(--primary)}.question-number.correct{border-color:var(--success-line);color:var(--success);background:var(--success-bg)}.question-number.wrong{border-color:var(--danger-line);color:var(--danger);background:var(--danger-bg)}.question-number i{position:absolute;top:-6px;left:-4px;color:var(--danger-ink);font-size:10px;font-style:normal}.navigator-legend{display:grid;gap:8px;padding-top:15px;border-top:1px solid var(--line);color:var(--muted);font-size:.72rem}.legend-dot{display:inline-block;width:8px;height:8px;margin-left:5px;border-radius:50%;background:var(--track)}.legend-dot.correct{background:var(--success)}.legend-dot.wrong{background:var(--danger)}.results-card{margin-top:50px}.score-ring{display:grid;place-content:center;width:132px;height:132px;margin:25px auto;border-radius:50%;background:radial-gradient(closest-side,var(--surface) 78%,transparent 79% 100%),conic-gradient(var(--primary) calc(var(--score) * 1%),var(--track) 0)}.score-ring strong{font-size:1.5rem;line-height:1}.score-ring span{color:var(--muted);font-size:.7rem}.result-stats{grid-template-columns:repeat(5,1fr)}.result-stats .correct strong{color:var(--success)}.result-stats .wrong strong{color:var(--danger)}
@media (max-width:820px){.exam-header{position:static}.metrics{grid-template-columns:repeat(3,1fr)}.exam-layout{grid-template-columns:1fr;padding-top:20px}.navigator{position:static;order:-1;overflow:hidden}.question-grid{display:flex;overflow-x:auto;padding:3px}.question-number{flex:0 0 42px}.navigator-legend{display:flex;flex-wrap:wrap;gap:11px}.navigator-legend span{white-space:nowrap}}@media (max-width:530px){.intro-page,.results-page{padding:20px}.intro-card,.results-card{margin-top:48px;padding:28px 19px;border-radius:22px}.exam-name{display:none}.topbar{justify-content:space-between}.metrics{gap:7px}.metric{padding:7px 9px}.metric-question{grid-column:span 2}.metric-time{grid-column:span 1}.metric span{font-size:.63rem}.metric strong{font-size:.78rem}.question-card{padding:20px 16px;border-radius:16px}.important-badge span{display:none}.question-actions{flex-wrap:wrap}.question-actions>span{width:100%;order:-1;text-align:center}.question-actions .button{flex:1;padding:9px}.result-stats{grid-template-columns:repeat(2,1fr)}.result-stats>div:last-child{grid-column:span 2}.exam-facts{grid-template-columns:1fr}.exam-facts>div{padding:10px}.exam-facts>div:not(:last-child){border-bottom:1px solid var(--line)}}
