/* Yo'nalish ichki oqim — bosh sahifa kontrast palitrasi */
.dir-flow{
  --cat-a:#6d9dda;
  --cat-b:#496fb3;
  --cat-iv-a:#898bd0;
  --cat-iv-b:#6864ad;
  display:grid;
  gap:18px;
  max-width:1180px;
}
.dir-flow svg{stroke-width:1.9;stroke-linecap:square;stroke-linejoin:miter}
.dir-flow.dir-mahalla{--cat-a:var(--dir-mahalla-a);--cat-b:var(--dir-mahalla-b);--cat-iv-a:#7d79cd;--cat-iv-b:#5d58a5}
.dir-flow.dir-tibbiyot{--cat-a:var(--dir-tibbiyot-a);--cat-b:var(--dir-tibbiyot-b);--cat-iv-a:#c56d97;--cat-iv-b:#9f5078}
.dir-flow.dir-adliya{--cat-a:var(--dir-adliya-a);--cat-b:var(--dir-adliya-b);--cat-iv-a:#8a96a8;--cat-iv-b:#667286}
.dir-flow.dir-iqtisod{--cat-a:var(--dir-iqtisod-a);--cat-b:var(--dir-iqtisod-b);--cat-iv-a:#55a49c;--cat-iv-b:#397b76}
.dir-flow.dir-talim{--cat-a:var(--dir-talim-a);--cat-b:var(--dir-talim-b);--cat-iv-a:#9578ce;--cat-iv-b:#7459ae}
.dir-flow.dir-davlat-boshqaruvi{--cat-a:var(--dir-davlat-a);--cat-b:var(--dir-davlat-b);--cat-iv-a:#7097d1;--cat-iv-b:#506eaa}
.dir-flow.dir-qurilish{--cat-a:var(--dir-qurilish-a);--cat-b:var(--dir-qurilish-b);--cat-iv-a:#cf8054;--cat-iv-b:#a55f42}
.dir-flow.dir-qishloq-xojaligi{--cat-a:var(--dir-qishloq-a);--cat-b:var(--dir-qishloq-b);--cat-iv-a:#69a97c;--cat-iv-b:#4c805e}

.flow-context{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px 6px 6px;
  border-radius:999px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--cat-a) 16%,#fff),color-mix(in srgb,var(--cat-b) 10%,#fff));
  border:1px solid color-mix(in srgb,var(--cat-a) 32%,#fff);
  font-size:10px;
  font-weight:800;
  color:#1e293b;
  width:max-content;
}
.flow-context-icon{
  width:30px;height:30px;border-radius:9px;
  display:grid;place-items:center;
  background:linear-gradient(145deg,var(--cat-a),var(--cat-b));
  color:#fff;
  box-shadow:0 4px 12px color-mix(in srgb,var(--cat-b) 35%,transparent);
}
.flow-context-icon svg{width:16px;height:16px}
.dir-flow .flow-head .page-title h1{color:#0f172a;font-weight:800;letter-spacing:-.4px}
.dir-flow .flow-head .page-title p{color:#64748b;font-weight:600}
.dir-flow .back-link{border-color:#cbd5e1;color:#475569;font-weight:700;background:#fff}
.dir-flow .back-link:hover{border-color:color-mix(in srgb,var(--cat-a) 45%,#fff);color:var(--cat-b)}

/* Lavozim kartalari — yo'nalish rangi, oq matn */
.dir-flow .position-grid .selection-card{
  border:1px solid rgba(255,255,255,.38);
  box-shadow:0 9px 22px color-mix(in srgb,var(--cat-b) 18%,transparent);
  min-height:210px;
}
.dir-flow .cat-pos-0{background:linear-gradient(145deg,var(--cat-a),var(--cat-b))}
.dir-flow .cat-pos-1{background:linear-gradient(145deg,color-mix(in srgb,var(--cat-a) 92%,#6b7280),color-mix(in srgb,var(--cat-b) 90%,#94a3b8))}
.dir-flow .cat-pos-2{background:linear-gradient(145deg,color-mix(in srgb,var(--cat-a) 82%,#fff),color-mix(in srgb,var(--cat-b) 88%,#fff))}
.dir-flow .position-grid .selection-card>span{color:rgba(255,255,255,.35)}
.dir-flow .position-grid .selection-card h2{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.18)}
.dir-flow .position-grid .selection-card p{color:rgba(255,255,255,.88)}
.dir-flow .position-grid .selection-card .selection-icon{color:var(--cat-b);background:rgba(255,255,255,.58)}
.dir-flow .position-grid .selection-card>b{color:#fff;background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.35)}

/* Tayyorlov: Argos test vs Suhbat */
.dir-flow .choice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.dir-flow .large-choice{
  display:flex;gap:16px;align-items:flex-start;text-align:left;
  padding:22px;border-radius:18px;cursor:pointer;
  transition:transform .22s ease,box-shadow .22s,border-color .22s;
  border:1.5px solid transparent;
}
.dir-flow .large-choice>span{
  flex:0 0 52px;width:52px;height:52px;border-radius:14px;
  display:grid;place-items:center;color:#fff;
  box-shadow:0 8px 20px rgba(15,23,42,.12);
}
.dir-flow .large-choice>span svg{width:24px;height:24px}
.dir-flow .large-choice small{font-size:8px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#64748b}
.dir-flow .large-choice h2{margin:6px 0 8px;font-size:17px;font-weight:800;color:#0f172a}
.dir-flow .large-choice p{margin:0 0 14px;font-size:10px;line-height:1.55;color:#64748b;font-weight:600}
.dir-flow .large-choice>b{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:800;padding:8px 12px;border-radius:10px}
.dir-flow .prep-argos{
  background:linear-gradient(145deg,color-mix(in srgb,var(--cat-a) 11%,#fff),color-mix(in srgb,var(--cat-b) 7%,#fff));
  border-color:color-mix(in srgb,var(--cat-a) 34%,#fff);
  box-shadow:0 8px 24px color-mix(in srgb,var(--cat-a) 12%,transparent);
}
.dir-flow .prep-argos>span{background:linear-gradient(145deg,var(--cat-a),var(--cat-b))}
.dir-flow .prep-argos>b{background:color-mix(in srgb,var(--cat-a) 12%,#fff);color:var(--cat-b);border:1px solid color-mix(in srgb,var(--cat-a) 28%,#fff)}
.dir-flow .prep-interview{
  background:linear-gradient(145deg,color-mix(in srgb,var(--cat-iv-a) 12%,#fff),color-mix(in srgb,var(--cat-iv-b) 8%,#fff));
  border-color:color-mix(in srgb,var(--cat-iv-a) 36%,#fff);
  box-shadow:0 8px 24px color-mix(in srgb,var(--cat-iv-a) 12%,transparent);
}
.dir-flow .prep-interview>span{background:linear-gradient(145deg,var(--cat-iv-a),var(--cat-iv-b))}
.dir-flow .prep-interview>b{background:color-mix(in srgb,var(--cat-iv-a) 12%,#fff);color:var(--cat-iv-b);border:1px solid color-mix(in srgb,var(--cat-iv-a) 28%,#fff)}
.dir-flow .large-choice:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(15,23,42,.12)}

/* Fan kartalari */
.dir-flow .subject-grid .subject-card{
  overflow:hidden;border-radius:18px;border:1px solid color-mix(in srgb,var(--cat-a) 22%,#fff);
  background:linear-gradient(160deg,#fff 0%,color-mix(in srgb,var(--cat-a) 7%,#fff) 100%);
  box-shadow:0 8px 22px rgba(15,23,42,.06);
  min-height:200px;display:flex;flex-direction:column;align-items:flex-start;
}
.dir-flow .subject-card-icon{
  width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--cat-a),var(--cat-b));color:#fff;
  margin-bottom:6px;box-shadow:0 6px 16px color-mix(in srgb,var(--cat-b) 25%,transparent);
}
.dir-flow .subject-card-icon svg{width:22px;height:22px}
.dir-flow .subject-card.sub-tone-1 .subject-card-icon{background:linear-gradient(145deg,color-mix(in srgb,var(--cat-a) 85%,#000),var(--cat-b))}
.dir-flow .subject-card.sub-tone-2 .subject-card-icon{background:linear-gradient(145deg,var(--cat-iv-a),var(--cat-iv-b))}
.dir-flow .subject-card.sub-tone-3 .subject-card-icon{background:linear-gradient(145deg,color-mix(in srgb,var(--cat-a) 70%,#fff),var(--cat-b))}
.dir-flow .subject-card>small{color:color-mix(in srgb,var(--cat-b) 55%,#64748b);font-weight:800}
.dir-flow .subject-card h2{color:#0f172a;font-weight:800}
.dir-flow .subject-card p{color:#64748b;font-weight:600}
.dir-flow .subject-card>b{margin-top:auto;color:var(--cat-b);background:color-mix(in srgb,var(--cat-a) 10%,#fff);border:1px solid color-mix(in srgb,var(--cat-a) 22%,#fff);padding:7px 11px;border-radius:9px;font-weight:800}
.dir-flow .subject-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--cat-a) 45%,#fff)}

/* Bosqichlar — Argos / Suhbat fonlari */
.dir-flow .stage-layout{display:grid;gap:16px}
.dir-flow.flow-mode-argos .stage-summary,
.dir-flow.flow-mode-interview .stage-summary{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;
  padding:20px 22px;border-radius:18px;border:none;color:#fff;
  box-shadow:0 12px 30px rgba(15,23,42,.14);
}
.dir-flow.flow-mode-argos .stage-summary{background:linear-gradient(135deg,var(--cat-a),var(--cat-b))}
.dir-flow.flow-mode-interview .stage-summary{background:linear-gradient(135deg,var(--cat-iv-a),var(--cat-iv-b))}
.dir-flow .stage-summary>div:first-child{display:flex;align-items:center;gap:14px}
.dir-flow .stage-summary-icon{
  width:50px;height:50px;border-radius:14px;display:grid;place-items:center;
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28);
}
.dir-flow .stage-summary-icon svg{width:24px;height:24px}
.dir-flow .stage-summary small{opacity:.85;font-weight:700;font-size:8px;letter-spacing:.08em;text-transform:uppercase}
.dir-flow .stage-summary h2{margin:4px 0 0;font-size:18px;font-weight:800;color:#fff}
.dir-flow .summary-stats{display:flex;gap:22px}
.dir-flow .summary-stats span{display:grid;gap:2px}
.dir-flow .summary-stats b{font-size:18px;font-weight:800;color:#fff}
.dir-flow .summary-stats small{font-size:8px;opacity:.82;font-weight:600}

.dir-flow .stages-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.dir-flow .stage-card{
  text-align:left;padding:16px 14px;border-radius:16px;border:1.5px solid #e2e8f0;
  background:#fff;cursor:pointer;transition:.2s;box-shadow:0 6px 18px rgba(15,23,42,.05);
}
.dir-flow .stage-card .stage-state{
  width:38px;height:38px;border-radius:11px;display:grid;place-items:center;margin-bottom:10px;
  background:#f1f5f9;color:#475569;border:1px solid #e2e8f0;
}
.dir-flow .stage-card .stage-state svg{width:18px;height:18px}
.dir-flow .stage-card small{font-size:8px;font-weight:800;color:#64748b;letter-spacing:.04em}
.dir-flow .stage-card h3{margin:6px 0 10px;font-size:10px;font-weight:800;color:#0f172a;line-height:1.35}
.dir-flow .stage-card .mini-progress{height:5px;border-radius:999px;background:#e2e8f0;overflow:hidden}
.dir-flow .stage-card .mini-progress i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--cat-a),var(--cat-b))}
.dir-flow.flow-mode-interview .stage-card .mini-progress i{background:linear-gradient(90deg,var(--cat-iv-a),var(--cat-iv-b))}
.dir-flow .stage-card.open{border-color:color-mix(in srgb,var(--cat-a) 50%,#fff);box-shadow:0 10px 24px color-mix(in srgb,var(--cat-a) 14%,transparent)}
.dir-flow.flow-mode-interview .stage-card.open{border-color:color-mix(in srgb,var(--cat-iv-a) 50%,#fff)}
.dir-flow .stage-card.open .stage-state{background:linear-gradient(145deg,var(--cat-a),var(--cat-b));color:#fff;border-color:transparent}
.dir-flow.flow-mode-interview .stage-card.open .stage-state{background:linear-gradient(145deg,var(--cat-iv-a),var(--cat-iv-b))}
.dir-flow .stage-card.completed{border-color:#86efac;background:linear-gradient(160deg,#fff,#ecfdf5)}
.dir-flow .stage-card.completed .stage-state{background:#22c55e;color:#fff;border-color:#16a34a}
.dir-flow .stage-card.premium{border-color:#fcd34d;background:linear-gradient(160deg,#fffbeb,#fff)}
.dir-flow .stage-card.premium .stage-state{background:linear-gradient(145deg,#fbbf24,#d97706);color:#fff;border:none}
.dir-flow .stage-card.locked{opacity:.72;cursor:not-allowed;background:#f8fafc}
.dir-flow .stage-card.locked .stage-state{background:#e2e8f0;color:#94a3b8}
.dir-flow .stage-card:not(.locked):not(:disabled):hover{transform:translateY(-2px)}

/* Material — savollar + to‘g‘ri javoblar (PDF ko‘rinish) */
.stage-prep-full{display:grid;gap:0;max-width:960px;margin:0 auto}
.material-read-notice{
  display:flex;align-items:center;gap:12px;margin:0 0 14px;padding:14px 16px;
  border:1px solid color-mix(in srgb,var(--cat-a) 24%,#fff);border-radius:14px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--cat-a) 9%,#fff),#fff);
  color:#334155;box-shadow:0 7px 20px rgba(15,23,42,.06);
}
.flow-mode-interview .material-read-notice{
  border-color:color-mix(in srgb,var(--cat-iv-a) 24%,#fff);
  background:linear-gradient(135deg,color-mix(in srgb,var(--cat-iv-a) 9%,#fff),#fff);
}
.material-read-notice>svg{
  width:38px;height:38px;flex:0 0 38px;padding:9px;border-radius:11px;
  color:#fff;background:linear-gradient(145deg,var(--cat-a),var(--cat-b));
}
.flow-mode-interview .material-read-notice>svg{background:linear-gradient(145deg,var(--cat-iv-a),var(--cat-iv-b))}
.material-read-notice div{display:grid;gap:4px}
.material-read-notice strong{font-size:12px;line-height:1.45;color:#1e3a5f}
.material-read-notice small{font-size:9px;line-height:1.45;color:#64748b;font-weight:600}
.answer-key-shell{
  border-radius:18px;overflow:hidden;border:1px solid #e2e8f0;
  box-shadow:0 12px 32px rgba(15,23,42,.1);background:#525659;
  display:flex;flex-direction:column;min-height:min(78vh,720px);
}
.dir-flow .answer-key-toolbar{
  flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 16px;
}
.answer-key-toolbar-actions{display:flex;gap:8px;flex-wrap:wrap}
.answer-key-toolbar-actions .secondary-action{
  background:rgba(255,255,255,.95)!important;color:#0f172a!important;border-color:rgba(255,255,255,.5)!important;
  font-weight:800;font-size:10px;
}
.answer-key-scroll{
  flex:1;overflow:auto;padding:20px 16px 24px;background:linear-gradient(180deg,#4b5563 0%,#374151 100%);
}
.answer-key-loading,.answer-key-error{
  text-align:center;padding:40px 20px;color:#f8fafc;font-size:11px;font-weight:600;
}
.answer-key-error .primary-action{margin-top:12px}
.answer-key-doc{display:block;max-width:210mm;margin:0 auto}
.answer-key-page{
  background:#fff;color:#0f172a;border-radius:4px;padding:18mm 16mm 16mm;
  box-shadow:0 8px 28px rgba(0,0,0,.35);
  border:1px solid #e5e7eb;
}
.answer-key-page-head{
  display:grid;gap:4px;padding-bottom:14px;margin-bottom:18px;border-bottom:2px solid #0f172a;
}
.answer-key-page-head small{font-size:8px;font-weight:800;letter-spacing:.14em;color:#64748b}
.answer-key-page-head strong{font-size:13px;font-weight:800;color:#0f172a}
.answer-key-page-head em{font-size:9px;font-style:normal;color:#475569;font-weight:600}
.answer-key-list{
  margin:0;padding-left:1.35em;display:grid;gap:0;
  list-style:decimal;list-style-position:outside;
}
.answer-key-list>li::marker{font-weight:800;color:#1d4ed8;font-size:12px}
.answer-key-item{
  padding:0 0 16px 0.35em;margin-bottom:16px;border-bottom:1px solid #e2e8f0;
  page-break-inside:avoid;break-inside:avoid;
}
.answer-key-item:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}
.answer-key-q-title{margin:0 0 10px;font-size:12px;font-weight:800;color:#1d4ed8;letter-spacing:.04em}
.answer-key-question{margin:0 0 12px;font-size:13px;line-height:1.65;font-weight:600;color:#1e293b}
.answer-key-answer-box{
  padding:14px 16px;border-radius:12px;border:1.5px solid #86efac;background:linear-gradient(145deg,#f0fdf4,#ecfdf5);
}
.answer-key-answer-box span{
  display:block;font-size:8px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#15803d;margin-bottom:6px;
}
.answer-key-answer-box p{margin:0;font-size:12px;font-weight:800;line-height:1.55;color:#14532d}
.stage-prep-foot{
  padding:18px 4px 8px;display:grid;gap:12px;justify-items:center;text-align:center;
}
.stage-prep-foot p{margin:0;font-size:10px;color:#64748b;font-weight:600;max-width:520px;line-height:1.5}
.stage-prep-foot .flow-cta{min-width:min(100%,320px);justify-content:center}
.stage-prep-foot .flow-cta:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:760px){
  .material-read-notice{padding:12px;gap:10px}
  .material-read-notice>svg{width:34px;height:34px;flex-basis:34px;padding:8px}
  .material-read-notice strong{font-size:10px}
  .material-read-notice small{font-size:8px}
  .answer-key-shell{min-height:65vh}
  .answer-key-page{padding:28px 22px}
}

.dir-flow .pdf-mock{border-radius:18px;overflow:hidden;border:1px solid #e2e8f0;box-shadow:0 10px 28px rgba(15,23,42,.08);background:#fff}
.dir-flow .pdf-toolbar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;
  background:linear-gradient(90deg,var(--cat-a),var(--cat-b));color:#fff;font-size:10px;font-weight:700;
}
.dir-flow.flow-mode-interview .pdf-toolbar{background:linear-gradient(90deg,var(--cat-iv-a),var(--cat-iv-b))}
.dir-flow .pdf-toolbar svg{width:16px;height:16px;margin-right:6px;vertical-align:middle}
.dir-flow .pdf-toolbar a{color:#fff;opacity:.92;font-size:9px;font-weight:800}
.dir-flow .material-side{border-radius:18px;border:1px solid color-mix(in srgb,var(--cat-a) 22%,#fff);padding:22px}
.dir-flow .material-side .side-icon{
  width:48px;height:48px;border-radius:13px;display:grid;place-items:center;margin-bottom:12px;
  background:linear-gradient(145deg,var(--cat-a),var(--cat-b));color:#fff;
}
.dir-flow .material-side .side-icon svg{width:22px;height:22px}
.dir-flow .material-side ul{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:8px}
.dir-flow .material-side li{display:flex;align-items:center;gap:8px;font-size:9px;font-weight:700;color:#475569}
.dir-flow .material-side li svg{width:14px;height:14px;color:#22c55e}

/* Test jarayoni */
.dir-flow.flow-mode-test .test-screen{display:grid;gap:14px}
.dir-flow .test-top{
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:16px 18px;border-radius:18px;color:#fff;
  background:linear-gradient(135deg,var(--cat-a),var(--cat-b));
  box-shadow:0 12px 28px color-mix(in srgb,var(--cat-b) 28%,transparent);
}
.dir-flow .test-top-main{display:flex;align-items:center;gap:12px}
.dir-flow .test-top-icon{
  width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.25);
}
.dir-flow .test-top-icon svg{width:22px;height:22px}
.dir-flow .test-top small{font-size:8px;font-weight:700;opacity:.88;letter-spacing:.06em;text-transform:uppercase}
.dir-flow .test-top h2{margin:4px 0 0;font-size:17px;font-weight:800;color:#fff}
.dir-flow .test-count{
  display:flex;align-items:baseline;gap:4px;padding:10px 14px;border-radius:12px;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22);
}
.dir-flow .test-count b{font-size:22px;font-weight:800;color:#fff}
.dir-flow .test-count small{font-size:10px;color:rgba(255,255,255,.85);font-weight:700}

.dir-flow .question-nav{display:flex;flex-wrap:wrap;gap:8px}
.dir-flow .question-nav button{
  width:38px;height:38px;border-radius:11px;border:1.5px solid #e2e8f0;background:#fff;
  font-size:11px;font-weight:800;color:#64748b;cursor:pointer;transition:.18s;
}
.dir-flow .question-nav button.answered{border-color:color-mix(in srgb,var(--cat-a) 40%,#fff);color:var(--cat-b);background:color-mix(in srgb,var(--cat-a) 8%,#fff)}
.dir-flow .question-nav button.current{
  background:linear-gradient(145deg,var(--cat-a),var(--cat-b));color:#fff;border-color:transparent;
  box-shadow:0 6px 16px color-mix(in srgb,var(--cat-b) 30%,transparent);
}
.dir-flow .question-card{
  padding:24px 22px;border-radius:18px;background:#fff;border:1px solid #e2e8f0;
  box-shadow:0 10px 28px rgba(15,23,42,.06);
  border-left:4px solid var(--cat-a);
}
.dir-flow .question-card>small{font-size:9px;font-weight:800;color:var(--cat-b);letter-spacing:.04em}
.dir-flow .question-card h1{margin:10px 0 18px;font-size:18px;line-height:1.45;color:#0f172a;font-weight:800}
.dir-flow .answers{display:grid;gap:10px}
.dir-flow .answers button{
  display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:12px;text-align:left;
  padding:14px 16px;border-radius:14px;border:1.5px solid #e2e8f0;background:#f8fafc;cursor:pointer;transition:.18s;
}
.dir-flow .answers button>i{
  width:32px;height:32px;border-radius:10px;display:grid;place-items:center;
  background:#fff;border:1px solid #e2e8f0;font-style:normal;font-size:11px;font-weight:800;color:#475569;
}
.dir-flow .answers button>span{font-size:11px;font-weight:600;color:#1e293b;line-height:1.45}
.dir-flow .answers button>b{opacity:0;color:#22c55e;transition:.18s}
.dir-flow .answers button>b svg{width:18px;height:18px}
.dir-flow .answers button:hover{border-color:color-mix(in srgb,var(--cat-a) 45%,#fff);background:#fff}
.dir-flow .answers button.selected{
  border-color:var(--cat-a);background:color-mix(in srgb,var(--cat-a) 8%,#fff);
  box-shadow:0 8px 20px color-mix(in srgb,var(--cat-a) 12%,transparent);
}
.dir-flow .answers button.selected>i{background:linear-gradient(145deg,var(--cat-a),var(--cat-b));color:#fff;border-color:transparent}
.dir-flow .answers button.selected>b{opacity:1}
.dir-flow .test-actions{display:flex;gap:12px;justify-content:flex-end;flex-wrap:wrap}
.dir-flow .flow-cta{
  background:linear-gradient(145deg,var(--cat-a),var(--cat-b))!important;
  border:1px solid color-mix(in srgb,var(--cat-b) 40%,#000)!important;color:#fff!important;font-weight:800;
  box-shadow:0 8px 20px color-mix(in srgb,var(--cat-b) 28%,transparent);
}
.dir-flow .flow-cta:hover{filter:brightness(1.05)}

/* Natija */
.dir-flow .result-wrap{
  text-align:center;padding:36px 24px;border-radius:20px;background:#fff;
  border:1px solid #e2e8f0;box-shadow:0 12px 32px rgba(15,23,42,.08);
}
.dir-flow .result-icon{
  width:72px;height:72px;border-radius:20px;display:grid;place-items:center;margin:0 auto 14px;
}
.dir-flow .result-icon.success{background:linear-gradient(145deg,#22c55e,#15803d);color:#fff}
.dir-flow .result-icon.fail{background:linear-gradient(145deg,#f97316,#c2410c);color:#fff}
.dir-flow .result-icon svg{width:32px;height:32px}
.dir-flow .result-wrap>h1{font-size:22px;color:#0f172a;font-weight:800}
.dir-flow .result-score{
  display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin:22px 0;
  padding:18px;border-radius:16px;background:color-mix(in srgb,var(--cat-a) 7%,#fff);
  border:1px solid color-mix(in srgb,var(--cat-a) 18%,#fff);
}
.dir-flow .result-score b{display:block;font-size:24px;color:var(--cat-b);font-weight:800}
.dir-flow .result-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}

@media(max-width:980px){
  .dir-flow .stages-grid{grid-template-columns:repeat(4,1fr)}
  .dir-flow .choice-grid{grid-template-columns:1fr}
  .dir-flow .material-layout{grid-template-columns:1fr}
}
@media(max-width:760px){
  .dir-flow .stages-grid{grid-template-columns:repeat(2,1fr)}
  .dir-flow .summary-stats{width:100%;justify-content:space-between}
}
@media(max-width:520px){
  .dir-flow .stages-grid{grid-template-columns:1fr 1fr}
  .dir-flow .question-nav button{width:100%;flex:1;min-width:calc(20% - 8px)}
}

/* To‘g‘ri javob — to‘liq ekran (halqa + yorug‘lik o‘tishi) */
.answer-celebration{
  position:fixed;inset:0;z-index:10050;
  display:grid;place-items:center;overflow:hidden;
  background:transparent;
  opacity:0;transition:opacity .18s ease;
  pointer-events:auto;
}
.answer-celebration.show{opacity:1}
.answer-celebration.hide{opacity:0;pointer-events:none}
.answer-celebration-flash{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(15,23,42,.72) 0%,rgba(15,23,42,.88) 100%);
  animation:answerFlashIn .35s ease forwards;
}
.answer-celebration.is-argos.is-correct .answer-celebration-flash{
  background:linear-gradient(165deg,rgba(6,78,59,.75) 0%,rgba(15,23,42,.9) 55%,rgba(15,23,42,.92) 100%);
}
.answer-celebration.is-interview.is-correct .answer-celebration-flash{
  background:linear-gradient(165deg,rgba(76,29,149,.78) 0%,rgba(15,23,42,.9) 55%,rgba(15,23,42,.92) 100%);
}
.answer-celebration.is-wrong .answer-celebration-flash{
  background:linear-gradient(165deg,rgba(127,29,29,.82) 0%,rgba(15,23,42,.9) 55%,rgba(15,23,42,.92) 100%);
}
.answer-celebration.is-interview.is-wrong .answer-celebration-flash{
  background:linear-gradient(165deg,rgba(154,52,18,.8) 0%,rgba(15,23,42,.9) 55%,rgba(15,23,42,.92) 100%);
}
.answer-celebration-flash:after{
  content:"";
  position:absolute;inset:-40% -60%;
  background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.22) 50%,transparent 58%);
  transform:translateX(-120%) skewX(-12deg);
  animation:answerShineSweep .65s ease .08s forwards;
}
.answer-celebration-wave{
  position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;
}
.answer-celebration-wave span{
  position:absolute;width:min(85vw,520px);aspect-ratio:1;border-radius:50%;
  border:3px solid rgba(255,255,255,.45);
  animation:answerRingExpand 1s cubic-bezier(.15,.85,.2,1) forwards;
}
.answer-celebration.is-correct.is-argos .answer-celebration-wave span{border-color:rgba(74,222,128,.55)}
.answer-celebration.is-correct.is-interview .answer-celebration-wave span{border-color:rgba(196,181,253,.6)}
.answer-celebration.is-wrong .answer-celebration-wave span{border-color:rgba(252,165,165,.55)}
.answer-celebration.is-interview.is-wrong .answer-celebration-wave span{border-color:rgba(253,186,116,.55)}
.answer-celebration-wave span:nth-child(2){animation-delay:.12s;border-width:2px;opacity:.7}
.answer-celebration-core{
  position:relative;z-index:2;text-align:center;color:#fff;
  animation:answerCoreLift .55s cubic-bezier(.2,.9,.2,1) .05s both;
}
.answer-celebration-badge{
  width:88px;height:88px;margin:0 auto 16px;border-radius:50%;
  display:grid;place-items:center;
}
.answer-celebration-badge svg{width:42px;height:42px;stroke-width:2.4}
.answer-celebration.is-correct .answer-celebration-badge{
  background:linear-gradient(145deg,#4ade80,#16a34a);
  box-shadow:0 0 0 12px rgba(74,222,128,.2),0 20px 50px rgba(0,0,0,.35);
  animation:answerBadgeSnap .5s cubic-bezier(.34,1.56,.64,1) .1s both;
}
.answer-celebration.is-correct.is-interview .answer-celebration-badge{
  background:linear-gradient(145deg,#a78bfa,#7c3aed);
  box-shadow:0 0 0 12px rgba(167,139,250,.22),0 20px 50px rgba(0,0,0,.35);
}
.answer-celebration.is-wrong .answer-celebration-badge{
  background:linear-gradient(145deg,#f87171,#dc2626);
  box-shadow:0 0 0 12px rgba(248,113,113,.22),0 20px 50px rgba(0,0,0,.35);
  animation:answerBadgeShake .55s cubic-bezier(.36,.07,.19,.99) .08s both;
}
.answer-celebration.is-interview.is-wrong .answer-celebration-badge{
  background:linear-gradient(145deg,#fb923c,#ea580c);
  box-shadow:0 0 0 12px rgba(251,146,60,.22),0 20px 50px rgba(0,0,0,.35);
}
.answer-celebration.is-wrong .answer-celebration-title{color:#fecaca}
.answer-celebration.is-interview.is-wrong .answer-celebration-title{color:#fed7aa}
.answer-celebration-hint{font-size:11px!important;letter-spacing:0;text-transform:none;font-weight:700!important}
.answer-celebration.is-correct.is-argos .answer-celebration-sparks i{background:#bbf7d0}
.answer-celebration.is-correct.is-interview .answer-celebration-sparks i{background:#ddd6fe}
.answer-celebration.is-wrong .answer-celebration-sparks i{background:#fecaca}
.answer-celebration.is-interview.is-wrong .answer-celebration-sparks i{background:#fdba74}
.answer-celebration-kicker{
  margin:0 0 6px;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  opacity:.85;
}
.answer-celebration-title{
  margin:0;font-size:clamp(36px,8vw,52px);font-weight:800;letter-spacing:-.04em;line-height:1;
  text-shadow:0 8px 30px rgba(0,0,0,.35);
  animation:answerTitlePop .45s cubic-bezier(.2,.9,.2,1) .18s both;
}
.answer-celebration-exp{
  margin:12px 0 0;display:inline-block;padding:8px 16px;border-radius:999px;
  font-size:12px;font-weight:800;letter-spacing:.04em;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);
  backdrop-filter:blur(8px);
  animation:answerExpDrop .4s cubic-bezier(.34,1.4,.64,1) .28s both;
}
.answer-celebration-sparks{
  position:absolute;inset:0;pointer-events:none;z-index:1;
}
.answer-celebration-sparks i{
  position:absolute;left:50%;top:50%;width:8px;height:8px;border-radius:2px;
  background:#fff;opacity:0;
  transform:translate(-50%,-50%) rotate(calc(var(--spark) * 25.7deg)) translateY(0);
  animation:answerSparkFly .75s ease calc(var(--spark) * 0.02s + .15s) forwards;
}
@keyframes answerFlashIn{from{opacity:0}to{opacity:1}}
@keyframes answerShineSweep{to{transform:translateX(120%) skewX(-12deg)}}
@keyframes answerRingExpand{
  0%{transform:scale(.35);opacity:.85}
  100%{transform:scale(1.35);opacity:0}
}
@keyframes answerCoreLift{
  from{transform:translateY(24px);opacity:0}
  to{transform:translateY(0);opacity:1}
}
@keyframes answerBadgeSnap{
  from{transform:scale(.2) rotate(-18deg);opacity:0}
  to{transform:scale(1) rotate(0);opacity:1}
}
@keyframes answerBadgeShake{
  0%{transform:scale(.85);opacity:0}
  20%{transform:scale(1.05) translateX(-4px);opacity:1}
  40%{transform:scale(1) translateX(4px)}
  60%{transform:translateX(-3px)}
  80%{transform:translateX(2px)}
  100%{transform:translateX(0);opacity:1}
}
@keyframes answerTitlePop{
  from{transform:scale(.85);opacity:0}
  to{transform:scale(1);opacity:1}
}
@keyframes answerExpDrop{
  from{transform:translateY(-16px);opacity:0}
  to{transform:translateY(0);opacity:1}
}
@keyframes answerSparkFly{
  0%{opacity:0;transform:translate(-50%,-50%) rotate(calc(var(--spark) * 25.7deg)) translateY(0) scale(.5)}
  15%{opacity:1}
  100%{opacity:0;transform:translate(-50%,-50%) rotate(calc(var(--spark) * 25.7deg)) translateY(-min(42vw,220px)) scale(1)}
}
@media (prefers-reduced-motion:reduce){
  .answer-celebration-flash:after,.answer-celebration-wave span,.answer-celebration-core,.answer-celebration-badge,.answer-celebration-title,.answer-celebration-exp,.answer-celebration-sparks i{animation:none!important}
  .answer-celebration-core,.answer-celebration-badge,.answer-celebration-title,.answer-celebration-exp{opacity:1;transform:none}
}

/* Bosqich yakunlandi — keyingi bosqichga o‘tish animatsiyasi */
.stage-transition{
  position:fixed;inset:0;z-index:10060;display:grid;place-items:center;padding:20px;
  opacity:0;transition:opacity .25s ease;pointer-events:auto;
}
.stage-transition.show{opacity:1}
.stage-transition.hide{opacity:0;pointer-events:none}
.stage-transition-backdrop{
  position:absolute;inset:0;
  background:radial-gradient(circle at 50% 35%,rgba(15,23,42,.5) 0%,rgba(2,6,23,.92) 70%);
  backdrop-filter:blur(12px);
}
.stage-transition.is-pass.is-argos .stage-transition-backdrop{
  background:radial-gradient(circle at 40% 30%,rgba(6,95,70,.45) 0%,rgba(2,6,23,.94) 72%);
}
.stage-transition.is-pass.is-interview .stage-transition-backdrop{
  background:radial-gradient(circle at 40% 30%,rgba(76,29,149,.42) 0%,rgba(2,6,23,.94) 72%);
}
.stage-transition-panel{
  position:relative;z-index:1;width:min(520px,100%);padding:28px 24px 26px;border-radius:26px;
  background:linear-gradient(165deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,.04) 100%);
  border:1px solid rgba(255,255,255,.18);box-shadow:0 30px 80px rgba(0,0,0,.45);
  text-align:center;color:#fff;overflow:hidden;
  animation:stagePanelIn .65s cubic-bezier(.2,.9,.2,1) both;
}
.stage-transition-kicker{
  margin:0 0 18px;font-size:9px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;opacity:.75;
}
.stage-transition-orbit{
  position:absolute;inset:-40px;pointer-events:none;opacity:.35;
}
.stage-transition-orbit i{
  position:absolute;left:50%;top:50%;width:140px;height:140px;margin:-70px;border-radius:50%;
  border:1px dashed rgba(255,255,255,.25);animation:stageOrbitSpin 8s linear infinite;
}
.stage-transition-orbit i:nth-child(2){width:200px;height:200px;margin:-100px;animation-duration:11s;animation-direction:reverse}
.stage-transition-orbit i:nth-child(3){width:260px;height:260px;margin:-130px;animation-duration:14s}
.stage-transition-track{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin-bottom:20px;
}
.stage-transition-node{
  padding:14px 10px;border-radius:18px;border:1.5px solid rgba(255,255,255,.2);
  background:rgba(15,23,42,.35);min-height:118px;display:grid;align-content:center;justify-items:center;gap:4px;
}
.stage-transition-node-badge{
  width:44px;height:44px;border-radius:14px;display:grid;place-items:center;margin-bottom:4px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);
}
.stage-transition-node-badge svg{width:22px;height:22px}
.stage-transition-node b{font-size:15px;font-weight:800}
.stage-transition-node small{font-size:9px;opacity:.78;font-weight:700}
.stage-transition-node.is-done{
  border-color:rgba(74,222,128,.55);background:rgba(22,101,52,.35);
  animation:stageNodeDone .7s cubic-bezier(.2,.9,.2,1) both;
}
.stage-transition-node.is-done .stage-transition-node-badge{background:linear-gradient(145deg,#4ade80,#16a34a);border:none}
.stage-transition-node.is-next{
  transform:scale(.92);opacity:.55;
  animation:stageNodeNext .85s cubic-bezier(.34,1.35,.64,1) .55s forwards;
}
.stage-transition-node.is-next.is-premium{border-color:rgba(251,191,36,.55);background:rgba(120,53,15,.35)}
.stage-transition-node.is-next .stage-transition-node-badge{background:linear-gradient(145deg,#fbbf24,#d97706);border:none}
.stage-transition-bridge{
  position:relative;width:56px;height:56px;display:grid;place-items:center;
}
.stage-transition-bridge-line{
  position:absolute;width:120px;height:3px;border-radius:999px;left:50%;top:50%;
  transform:translate(-50%,-50%) scaleX(0);transform-origin:left center;
  background:linear-gradient(90deg,#4ade80,#22d3ee);
  animation:stageBridgeDraw .7s cubic-bezier(.2,.9,.2,1) .35s forwards;
}
.stage-transition.is-interview .stage-transition-bridge-line{background:linear-gradient(90deg,#a78bfa,#c084fc)}
.stage-transition-bridge-shuttle{
  position:relative;z-index:1;width:36px;height:36px;border-radius:12px;
  display:grid;place-items:center;background:#fff;color:#0f172a;
  box-shadow:0 8px 24px rgba(0,0,0,.35);
  animation:stageShuttleMove .85s cubic-bezier(.45,.05,.2,1) .45s both;
}
.stage-transition-bridge-shuttle svg{width:18px;height:18px;transform:rotate(-90deg)}
.stage-transition-title{
  margin:0 0 8px;font-size:clamp(20px,4.5vw,26px);font-weight:800;letter-spacing:-.03em;
  animation:stageTitleIn .5s ease .75s both;opacity:0;
}
.stage-transition-sub{margin:0;font-size:11px;font-weight:700;opacity:0;animation:stageTitleIn .5s ease .9s forwards}
.stage-transition-fail-ring{
  width:110px;height:110px;margin:0 auto 16px;border-radius:50%;
  display:grid;place-items:center;align-content:center;border:4px solid rgba(248,113,113,.55);
  background:rgba(127,29,29,.35);animation:stageFailPulse .9s ease both;
}
.stage-transition-fail-ring span{font-size:34px;font-weight:800;line-height:1}
.stage-transition-fail-ring small{font-size:11px;opacity:.75;font-weight:700}
.stage-transition.is-fail .stage-transition-title{color:#fecaca}
.stage-transition-hint{margin:10px 0 0;font-size:10px;opacity:.8;font-weight:600}
.result-next-hint{margin:-8px 0 16px;font-size:10px;color:#64748b;font-weight:600}
@keyframes stagePanelIn{from{transform:translateY(28px) scale(.94);opacity:0}to{transform:none;opacity:1}}
@keyframes stageOrbitSpin{to{transform:rotate(360deg)}}
@keyframes stageNodeDone{from{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes stageNodeNext{to{transform:scale(1);opacity:1;border-color:rgba(125,211,252,.65);box-shadow:0 0 0 8px rgba(56,189,248,.15)}}
@keyframes stageBridgeDraw{to{transform:translate(-50%,-50%) scaleX(1)}}
@keyframes stageShuttleMove{
  0%{transform:translateX(-36px);opacity:0}
  20%{opacity:1}
  100%{transform:translateX(36px);opacity:1}
}
@keyframes stageTitleIn{from{transform:translateY(10px);opacity:0}to{transform:none;opacity:1}}
@keyframes stageFailPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.04)}
}
@media (prefers-reduced-motion:reduce){
  .stage-transition-panel,.stage-transition-node,.stage-transition-bridge-line,.stage-transition-bridge-shuttle,.stage-transition-title,.stage-transition-sub,.stage-transition-fail-ring{animation:none!important}
  .stage-transition-node.is-next{transform:none;opacity:1}
}

/* Premium upsell — 5-bosqichdan keyin (suhbat, bepul foydalanuvchi) */
.stage-transition.is-premium-upsell{
  padding:16px;z-index:10070;
}
.premium-upsell-backdrop{
  position:absolute;inset:0;overflow:hidden;
  background:radial-gradient(ellipse 90% 70% at 50% 20%,#4c1d95 0%,#1e0a3c 42%,#020617 100%);
}
.premium-upsell-glow{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 50% 35%,rgba(251,191,36,.35) 0%,transparent 45%),
    radial-gradient(circle at 20% 80%,rgba(168,85,247,.25) 0%,transparent 40%),
    radial-gradient(circle at 80% 75%,rgba(244,114,182,.15) 0%,transparent 35%);
  animation:premiumUpsellGlow 3s ease-in-out infinite alternate;
}
.premium-upsell-rays{
  position:absolute;inset:-20%;pointer-events:none;opacity:.35;
}
.premium-upsell-rays span{
  position:absolute;left:50%;top:50%;width:2px;height:120%;
  margin-left:-1px;margin-top:-60%;
  background:linear-gradient(180deg,transparent,rgba(251,191,36,.5),transparent);
  transform:rotate(calc(var(--r) * 45deg));
  animation:premiumRayPulse 2.4s ease calc(var(--r) * 0.08s) infinite;
}
.premium-upsell-sparkles{
  position:absolute;inset:0;pointer-events:none;overflow:hidden;
}
.premium-upsell-sparkles i{
  position:absolute;width:6px;height:6px;border-radius:50%;
  background:#fde68a;box-shadow:0 0 12px #fbbf24;
  left:var(--x,50%);top:55%;
  opacity:0;
  animation:premiumSpark 2.2s ease var(--d,0s) infinite;
}
.premium-upsell-sparkles i:nth-child(odd){background:#e9d5ff;box-shadow:0 0 10px #a855f7}
.premium-upsell-panel{
  position:relative;z-index:2;width:min(440px,100%);padding:26px 22px 22px;border-radius:28px;
  background:linear-gradient(165deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,.04) 55%,rgba(251,191,36,.08) 100%);
  border:1px solid rgba(251,191,36,.45);
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 32px 90px rgba(0,0,0,.55),0 0 80px rgba(251,191,36,.15);
  text-align:center;color:#fff;overflow:hidden;
  animation:premiumPanelRise .7s cubic-bezier(.2,.9,.2,1) both;
}
.premium-upsell-shimmer{
  position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.18) 50%,transparent 60%);
  transform:translateX(-120%) skewX(-15deg);
  animation:premiumShimmer 2.8s ease-in-out infinite;
}
.premium-upsell-chip{
  display:inline-flex;align-items:center;gap:7px;margin:0 0 16px;padding:7px 14px;border-radius:999px;
  font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  background:rgba(34,197,94,.2);border:1px solid rgba(74,222,128,.45);color:#bbf7d0;
}
.premium-upsell-chip svg{width:14px;height:14px}
.premium-upsell-hero{
  position:relative;height:120px;margin:0 auto 14px;display:grid;place-items:center;
}
.premium-upsell-crown{
  width:92px;height:92px;border-radius:26px;display:grid;place-items:center;
  background:linear-gradient(145deg,#fde047 0%,#f59e0b 45%,#b45309 100%);
  color:#fff;box-shadow:0 16px 40px rgba(180,83,9,.45),0 0 0 10px rgba(251,191,36,.15);
  animation:premiumCrownFloat 2.2s ease-in-out infinite;
}
.premium-upsell-crown svg{width:44px;height:44px;stroke-width:2}
.premium-upsell-lock-ring{
  position:absolute;right:calc(50% - 95px);bottom:8px;width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;align-content:center;border:2px dashed rgba(251,191,36,.7);
  background:rgba(15,23,42,.75);backdrop-filter:blur(6px);
  animation:premiumLockPulse 1.6s ease infinite;
}
.premium-upsell-lock-ring b{font-size:16px;font-weight:800;line-height:1;color:#fde68a}
.premium-upsell-lock-ring small{font-size:8px;opacity:.75;font-weight:700}
.premium-upsell-title{
  margin:0 0 10px;font-size:clamp(21px,5vw,28px);font-weight:800;letter-spacing:-.03em;line-height:1.15;
  background:linear-gradient(90deg,#fff 0%,#fde68a 50%,#fff 100%);
  background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:premiumTitleShine 2.5s linear infinite;
}
.premium-upsell-lead{margin:0 0 16px;font-size:11px;line-height:1.55;color:rgba(255,255,255,.88);font-weight:600}
.premium-upsell-perks{
  list-style:none;margin:0 0 18px;padding:0;display:grid;gap:8px;text-align:left;
}
.premium-upsell-perks li{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  font-size:10px;font-weight:700;color:#f8fafc;
}
.premium-upsell-perks li svg{width:18px;height:18px;color:#fbbf24;flex:0 0 18px}
.premium-upsell-cta{
  position:relative;display:grid;gap:3px;padding:14px 20px;border-radius:16px;margin-bottom:12px;
  background:linear-gradient(135deg,#fbbf24 0%,#f59e0b 40%,#d97706 100%);
  color:#451a03;overflow:hidden;
  animation:premiumCtaPulse 1.8s ease infinite;
}
.premium-upsell-cta-glow{
  position:absolute;inset:-2px;border-radius:18px;
  background:linear-gradient(135deg,rgba(255,255,255,.5),transparent 50%);
  opacity:.4;animation:premiumCtaGlow 2s ease infinite alternate;
}
.premium-upsell-cta strong{position:relative;font-size:15px;font-weight:800;letter-spacing:.02em}
.premium-upsell-cta small{position:relative;font-size:9px;font-weight:700;opacity:.85}
.premium-upsell-score{margin:0;font-size:9px;font-weight:700;opacity:.65}
@keyframes premiumUpsellGlow{from{opacity:.85}to{opacity:1}}
@keyframes premiumRayPulse{0%,100%{opacity:.2}50%{opacity:.55}}
@keyframes premiumSpark{
  0%{opacity:0;transform:translateY(0) scale(.4)}
  25%{opacity:1}
  100%{opacity:0;transform:translateY(-120px) scale(1.1)}
}
@keyframes premiumPanelRise{from{transform:translateY(40px) scale(.9);opacity:0}to{transform:none;opacity:1}}
@keyframes premiumShimmer{0%,100%{transform:translateX(-120%) skewX(-15deg)}50%{transform:translateX(120%) skewX(-15deg)}}
@keyframes premiumCrownFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes premiumLockPulse{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(251,191,36,.4)}50%{transform:scale(1.05);box-shadow:0 0 0 8px rgba(251,191,36,.12)}}
@keyframes premiumTitleShine{to{background-position:200% center}}
@keyframes premiumCtaPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}
@keyframes premiumCtaGlow{from{opacity:.25}to{opacity:.55}}
@media (prefers-reduced-motion:reduce){
  .premium-upsell-glow,.premium-upsell-rays span,.premium-upsell-sparkles i,.premium-upsell-shimmer,.premium-upsell-crown,.premium-upsell-lock-ring,.premium-upsell-title,.premium-upsell-cta{animation:none!important}
  .premium-upsell-title{color:#fde68a;background:none;-webkit-text-fill-color:#fde68a}
}