
*,::before,::after{box-sizing:border-box}
:root{color-scheme:light dark;--bg:#f5f3ee;--card:#fff;--ink:#1a1a2e;--muted:#6b6a74;--border:#e2e0d8;--accent:#2563eb;--green:#16a34a;--red:#dc2626;--orange:#ea580c}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:'Golos Text',system-ui,sans-serif;min-height:100dvh}
body{overflow-x:hidden}
.spec-wrap{max-width:860px;margin:0 auto;padding:0 18px 36px}
.spec-screen{padding:calc(24px + env(safe-area-inset-top,0)) 0 0}
.spec-hero{display:grid;gap:14px;margin-bottom:10px}
.spec-pill{display:inline-flex;align-items:center;gap:7px;background:var(--ink);color:#fff;border-radius:999px;padding:5px 12px;font:700 11px/1 'JetBrains Mono',monospace;letter-spacing:.3px}
.spec-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;display:inline-block}
h1{font-family:'Unbounded',system-ui,sans-serif;font-size:clamp(30px,6vw,46px);line-height:1.02;letter-spacing:-1.4px;margin:18px 0 12px}
h1 em{font-style:normal;color:var(--muted)}
.spec-sub{max-width:620px;font-size:15px;line-height:1.65;color:var(--muted);margin:0}
.spec-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:22px 0 18px}
.spec-stat{background:var(--card);border:1.5px solid var(--border);border-radius:16px;padding:16px 18px}
.spec-stat-n{font-family:'Unbounded',system-ui,sans-serif;font-size:24px;font-weight:900;line-height:1}
.spec-stat-l{margin-top:6px;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;font-weight:700}
.spec-resume{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;width:100%;padding:14px 16px;border:none;border-radius:14px;background:rgba(37,99,235,.08);color:var(--ink);font:700 13px/1.45 'Golos Text',system-ui,sans-serif;text-align:left;cursor:pointer}
.spec-resume span{display:block;font-size:11px;color:var(--muted);font-weight:600;margin-top:2px}
.spec-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 12px;position:sticky;top:calc(8px + env(safe-area-inset-top,0));z-index:4;padding:8px 0;background:linear-gradient(180deg,var(--bg) 78%,rgba(245,243,238,0));backdrop-filter:saturate(1.02)}/* wave51_spec_toolbar */




.spec-clear{flex:0 0 auto;border:none;background:transparent;color:var(--muted);font:700 13px/1 'Golos Text',system-ui,sans-serif;cursor:pointer;padding:0 0 0 4px}
.spec-clear:hover{color:var(--ink)}

.spec-tools-meta{font-size:11px;line-height:1.4;color:var(--muted);font-weight:700;letter-spacing:.2px}
.spec-subject-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.spec-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(37,99,235,.08);color:var(--ink);font-size:11px;font-weight:700}
.spec-section-title{margin:18px 0 12px;font-family:'Unbounded',system-ui,sans-serif;font-size:11px;font-weight:800;letter-spacing:1.3px;text-transform:uppercase;color:var(--muted)}
.spec-grid,.spec-topic-list,.spec-review-list{display:grid;gap:10px}
.spec-grid{grid-template-columns:1fr}
.spec-card,.spec-topic-card{display:flex;align-items:center;gap:14px;width:100%;padding:18px 16px;border:1.5px solid var(--border);border-radius:18px;background:var(--card);color:var(--ink);text-align:left;cursor:pointer;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.spec-card:hover,.spec-topic-card:hover,.spec-back:hover,.spec-btn:hover,.spec-next:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,.05)}
.spec-card:active,.spec-topic-card:active,.spec-back:active,.spec-btn:active,.spec-next:active,.spec-opt:active{transform:scale(.99)}
.spec-card{position:relative;overflow:hidden}
.spec-card::after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--spec-accent,var(--accent));opacity:.55}
.spec-card-ic,.spec-subject-ic{display:flex;align-items:center;justify-content:center;flex:0 0 auto;border-radius:16px;background:var(--spec-accent-bg,var(--abg));color:var(--spec-accent,var(--accent));font-size:28px}
.spec-card-ic{width:56px;height:56px}
.spec-card-main{min-width:0;flex:1}
.spec-card-nm,.spec-subject-nm,.spec-topic-nm,.spec-quiz-title{font-family:'Unbounded',system-ui,sans-serif;font-size:15px;font-weight:800;line-height:1.25}
.spec-card-desc,.spec-subject-desc,.spec-topic-sub,.spec-quiz-sub{margin-top:4px;font-size:12px;line-height:1.5;color:var(--muted)}
.spec-card-meta,.spec-topic-stat{display:flex;justify-content:space-between;gap:12px;margin-top:10px;font-size:11px;color:var(--muted)}
.spec-card-meta strong,.spec-topic-stat strong{color:var(--ink)}
.spec-card-arrow{margin-left:auto;font-size:16px;color:var(--spec-accent,var(--muted))}
.spec-card,.spec-subject-head{--spec-accent:var(--accent);--spec-accent-bg:var(--abg)}
.spec-card[data-spec-id="diplomacy"],.spec-subject-head[data-spec-id="diplomacy"]{--spec-accent:#1e40af;--spec-accent-bg:#dbeafe}
.spec-card[data-spec-id="construction"],.spec-subject-head[data-spec-id="construction"]{--spec-accent:#b45309;--spec-accent-bg:#fef3c7}
.spec-card[data-spec-id="procurement"],.spec-subject-head[data-spec-id="procurement"]{--spec-accent:#059669;--spec-accent-bg:#d1fae5}
.spec-card[data-spec-id="management"],.spec-subject-head[data-spec-id="management"]{--spec-accent:#7c3aed;--spec-accent-bg:#ede9fe}
.spec-card[data-spec-id="gkh"],.spec-subject-head[data-spec-id="gkh"]{--spec-accent:#dc2626;--spec-accent-bg:#fee2e2}
.spec-card[data-spec-id="psychology"],.spec-subject-head[data-spec-id="psychology"]{--spec-accent:#db2777;--spec-accent-bg:#fce7f3}
.spec-card[data-spec-id="fashion_design"],.spec-subject-head[data-spec-id="fashion_design"]{--spec-accent:#be123c;--spec-accent-bg:#ffe4e6}
.spec-card[data-spec-id="architecture"],.spec-subject-head[data-spec-id="architecture"]{--spec-accent:#92400e;--spec-accent-bg:#ffedd5}
.spec-card[data-spec-id="graphic_design"],.spec-subject-head[data-spec-id="graphic_design"]{--spec-accent:#7c3aed;--spec-accent-bg:#ede9fe}
.spec-card[data-spec-id="interior_design"],.spec-subject-head[data-spec-id="interior_design"]{--spec-accent:#0f766e;--spec-accent-bg:#ccfbf1}
.spec-card[data-spec-id="design_entrance"],.spec-subject-head[data-spec-id="design_entrance"]{--spec-accent:#c2410c;--spec-accent-bg:#ffedd5}
.spec-score-good{color:var(--green)}
.spec-score-warn{color:var(--orange)}
.spec-score-bad{color:var(--red)}
.spec-fill-good{background:var(--green)}
.spec-fill-warn{background:var(--orange)}
.spec-fill-bad{background:var(--red)}
.spec-back,.spec-btn,.spec-next{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1.5px solid var(--border);border-radius:14px;background:var(--card);color:var(--ink);font:700 13px/1 'Golos Text',system-ui,sans-serif;cursor:pointer}
.spec-back{padding:11px 14px;margin-bottom:14px}
.spec-btn,.spec-next{padding:12px 16px}
.spec-btn.primary,.spec-next{border-color:transparent;background:var(--ink);color:#fff}
.spec-subject-head{display:flex;align-items:center;gap:14px;padding:18px 16px;border-radius:18px;background:var(--card);border:1.5px solid var(--border);margin-bottom:6px}
.spec-subject-ic{width:64px;height:64px}
.spec-quiz-head{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}
.spec-quiz-meta{flex:1;min-width:0}
.spec-progress{height:8px;background:#e8e6e0;border-radius:999px;overflow:hidden;margin-bottom:16px}
.spec-progress-fill{height:100%;background:var(--accent);border-radius:999px;transition:width .2s ease}
.spec-qcard,.spec-result,.spec-review-card,.spec-history{background:var(--card);border:1.5px solid var(--border);border-radius:18px;padding:20px 18px}
.spec-qtext{font-size:18px;line-height:1.65;font-weight:600;margin-bottom:16px}
.spec-opts{display:grid;gap:10px}
.spec-opt{width:100%;padding:14px 16px;border:1.5px solid var(--border);border-radius:14px;background:#fff;color:var(--ink);font:600 14px/1.45 'Golos Text',system-ui,sans-serif;text-align:left;cursor:pointer}
.spec-opt.is-correct{border-color:rgba(22,163,74,.32);background:rgba(22,163,74,.10);color:var(--green)}
.spec-opt.is-wrong{border-color:rgba(220,38,38,.32);background:rgba(220,38,38,.10);color:var(--red)}
.spec-opt.is-muted{opacity:.72}
.spec-feedback{display:flex;flex-direction:column;gap:6px;margin-top:14px;padding:14px 15px;border-radius:14px;font-size:13px;line-height:1.55}
.spec-feedback.ok{background:rgba(22,163,74,.10);color:var(--green)}
.spec-feedback.bad{background:rgba(220,38,38,.10);color:var(--red)}
.spec-feedback span{color:var(--ink)}
.spec-next{margin-top:14px}
.spec-result{text-align:center}
.spec-result-n{font-family:'Unbounded',system-ui,sans-serif;font-size:54px;line-height:1;font-weight:900}
.spec-result-sub{margin-top:10px;color:var(--muted);font-size:14px;line-height:1.55}
.spec-result-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:16px}
.spec-review-q{font-size:14px;line-height:1.6;font-weight:700;margin-bottom:10px}
.spec-review-line{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--muted);margin-top:6px}
.spec-review-line strong{font-size:13px}
.spec-review-line .ok{color:var(--green)}
.spec-review-line .bad{color:var(--red)}
.spec-review-hint{margin-top:10px;font-size:12px;line-height:1.55;color:var(--ink);background:rgba(37,99,235,.08);border-radius:12px;padding:12px}
.spec-history{margin-top:10px}
.spec-history-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.spec-history-row:last-child{border-bottom:none;padding-bottom:0}
.spec-history-row span{display:block;font-size:11px;color:var(--muted);margin-top:3px}
.spec-empty{padding:22px;border:1.5px dashed var(--border);border-radius:16px;color:var(--muted);text-align:center;font-size:13px;background:rgba(37,99,235,.04)}
.spec-actions-row{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 10px}
.spec-soft-note{margin-bottom:12px;padding:12px 14px;border:1.5px dashed rgba(37,99,235,.18);border-radius:14px;background:rgba(37,99,235,.05);font-size:12px;line-height:1.55;color:var(--muted)}
.spec-loading{margin:10px 0;padding:14px 16px;border:1.5px solid var(--border);border-radius:14px;background:rgba(37,99,235,.06);font-size:13px;font-weight:700;line-height:1.5;color:var(--ink)}
.spec-error{margin:10px 0;border-style:solid;background:rgba(220,38,38,.08);color:var(--red)}
.spec-quiz-topline{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.spec-timer{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 12px;border-radius:999px;background:rgba(26,26,46,.06);color:var(--ink);font:700 12px/1 'JetBrains Mono',monospace}
.spec-qtopic{display:inline-flex;align-items:center;gap:6px;margin-bottom:10px;padding:6px 10px;border-radius:999px;background:rgba(37,99,235,.08);color:var(--ink);font:700 11px/1.2 'Golos Text',system-ui,sans-serif}
.spec-topic-bars{display:grid;gap:10px;text-align:left}
.spec-topic-bar-row{display:grid;gap:8px;padding:8px 0;border-bottom:1px solid var(--border)}
.spec-topic-bar-row:last-child{border-bottom:none;padding-bottom:0}
.spec-topic-bar-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:var(--muted)}
.spec-topic-bar-head strong{font-size:13px;color:var(--ink)}
.spec-topic-bar-track{height:10px;background:#e8e6e0;border-radius:999px;overflow:hidden}
.spec-topic-bar-fill{height:100%;border-radius:999px}
.spec-weak-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 14px;border:1.5px solid var(--border);border-radius:16px;background:var(--card)}
.spec-history-split{height:1px;background:var(--border);margin:6px 0}
.spec-quick-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding-top:calc(14px + env(safe-area-inset-top,0));margin-bottom:6px}
.spec-quick-link{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:12px 14px;border:1.5px solid var(--border);border-radius:14px;background:var(--card);color:var(--ink);text-decoration:none;font:700 12px/1.25 'Golos Text',system-ui,sans-serif;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.spec-quick-link:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(0,0,0,.05)}
.spec-quick-link:active{transform:scale(.99)}
body[data-trainer-screen="immersive"] .spec-quick-nav{display:none}

.spec-w-0{width:0%}
.spec-w-1{width:1%}
.spec-w-2{width:2%}
.spec-w-3{width:3%}
.spec-w-4{width:4%}
.spec-w-5{width:5%}
.spec-w-6{width:6%}
.spec-w-7{width:7%}
.spec-w-8{width:8%}
.spec-w-9{width:9%}
.spec-w-10{width:10%}
.spec-w-11{width:11%}
.spec-w-12{width:12%}
.spec-w-13{width:13%}
.spec-w-14{width:14%}
.spec-w-15{width:15%}
.spec-w-16{width:16%}
.spec-w-17{width:17%}
.spec-w-18{width:18%}
.spec-w-19{width:19%}
.spec-w-20{width:20%}
.spec-w-21{width:21%}
.spec-w-22{width:22%}
.spec-w-23{width:23%}
.spec-w-24{width:24%}
.spec-w-25{width:25%}
.spec-w-26{width:26%}
.spec-w-27{width:27%}
.spec-w-28{width:28%}
.spec-w-29{width:29%}
.spec-w-30{width:30%}
.spec-w-31{width:31%}
.spec-w-32{width:32%}
.spec-w-33{width:33%}
.spec-w-34{width:34%}
.spec-w-35{width:35%}
.spec-w-36{width:36%}
.spec-w-37{width:37%}
.spec-w-38{width:38%}
.spec-w-39{width:39%}
.spec-w-40{width:40%}
.spec-w-41{width:41%}
.spec-w-42{width:42%}
.spec-w-43{width:43%}
.spec-w-44{width:44%}
.spec-w-45{width:45%}
.spec-w-46{width:46%}
.spec-w-47{width:47%}
.spec-w-48{width:48%}
.spec-w-49{width:49%}
.spec-w-50{width:50%}
.spec-w-51{width:51%}
.spec-w-52{width:52%}
.spec-w-53{width:53%}
.spec-w-54{width:54%}
.spec-w-55{width:55%}
.spec-w-56{width:56%}
.spec-w-57{width:57%}
.spec-w-58{width:58%}
.spec-w-59{width:59%}
.spec-w-60{width:60%}
.spec-w-61{width:61%}
.spec-w-62{width:62%}
.spec-w-63{width:63%}
.spec-w-64{width:64%}
.spec-w-65{width:65%}
.spec-w-66{width:66%}
.spec-w-67{width:67%}
.spec-w-68{width:68%}
.spec-w-69{width:69%}
.spec-w-70{width:70%}
.spec-w-71{width:71%}
.spec-w-72{width:72%}
.spec-w-73{width:73%}
.spec-w-74{width:74%}
.spec-w-75{width:75%}
.spec-w-76{width:76%}
.spec-w-77{width:77%}
.spec-w-78{width:78%}
.spec-w-79{width:79%}
.spec-w-80{width:80%}
.spec-w-81{width:81%}
.spec-w-82{width:82%}
.spec-w-83{width:83%}
.spec-w-84{width:84%}
.spec-w-85{width:85%}
.spec-w-86{width:86%}
.spec-w-87{width:87%}
.spec-w-88{width:88%}
.spec-w-89{width:89%}
.spec-w-90{width:90%}
.spec-w-91{width:91%}
.spec-w-92{width:92%}
.spec-w-93{width:93%}
.spec-w-94{width:94%}
.spec-w-95{width:95%}
.spec-w-96{width:96%}
.spec-w-97{width:97%}
.spec-w-98{width:98%}
.spec-w-99{width:99%}
.spec-w-100{width:100%}
@media (min-width: 768px){
  .spec-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width: 767px){
  .spec-wrap{padding:0 14px 24px}
  .spec-card{align-items:flex-start;flex-direction:column;gap:12px;min-height:208px;padding:16px 14px}
  .spec-card-main{width:100%}
  .spec-card-arrow{margin-left:0;align-self:flex-end}
  .spec-card-ic{width:52px;height:52px;font-size:26px}
  .spec-quick-nav{grid-template-columns:1fr 1fr}
  .spec-quiz-head{flex-direction:column}
  .spec-qtext{font-size:16px}
}
@media (max-width: 640px){
  .spec-stats{display:flex;gap:8px;margin:14px 0 10px}
  .spec-stat{flex:1;padding:12px 10px;text-align:center}
  .spec-stat-n{font-size:18px}
  .spec-stat-l{font-size:10px;letter-spacing:.4px}
}
@media (max-width: 480px){
  .spec-quick-nav{grid-template-columns:1fr}
  .spec-actions-row{flex-direction:column}
  .spec-weak-card{flex-direction:column;align-items:flex-start}
  .spec-card,.spec-topic-card,.spec-qcard,.spec-result,.spec-review-card,.spec-history,.spec-subject-head{padding:16px 14px}
}

.spec-feedback-ex{display:block;margin-top:8px;font-size:13px;line-height:1.45;color:#475569}
