/**
 * NEXA Cognitive Profile — Frontend Styles v4 DARK
 * Full dark purple immersion · Glassmorphic · 7 activity types
 */

/* ═══ Variables ═══════════════════════════════════════════ */
:root {
    /* Core palette */
    --ncp-purple-50:#F5F3FF; --ncp-purple-100:#EDE9FE; --ncp-purple-200:#DDD6FE;
    --ncp-purple-300:#C4B5FD; --ncp-purple-400:#A78BFA; --ncp-purple-500:#8B5CF6;
    --ncp-purple-600:#7C3AED; --ncp-purple-700:#6D28D9; --ncp-purple-800:#5B21B6;
    --ncp-purple-900:#4C1D95;
    --ncp-green-400:#34D399; --ncp-green-500:#10B981; --ncp-green-600:#059669;
    --ncp-blue-500:#3B82F6; --ncp-blue-600:#2563EB;
    --ncp-red-500:#EF4444; --ncp-red-600:#DC2626;

    /* Dark theme surfaces */
    --ncp-dark-bg:#120830;
    --ncp-dark-surface:rgba(255,255,255,.06);
    --ncp-dark-surface-hover:rgba(255,255,255,.1);
    --ncp-dark-surface-active:rgba(255,255,255,.14);
    --ncp-dark-border:rgba(255,255,255,.1);
    --ncp-dark-border-hover:rgba(255,255,255,.2);
    --ncp-dark-border-active:rgba(168,85,247,.5);
    --ncp-dark-text:#fff;
    --ncp-dark-text-secondary:rgba(255,255,255,.7);
    --ncp-dark-text-muted:rgba(255,255,255,.45);

    /* Typography */
    --ncp-font:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

    /* Radii */
    --ncp-radius-sm:8px; --ncp-radius-md:12px; --ncp-radius-lg:16px;
    --ncp-radius-xl:24px; --ncp-radius-full:9999px;

    /* Easing */
    --ncp-ease:cubic-bezier(.4,0,.2,1);

    /* RGB components for rgba() usage — overridden by admin settings */
    --ncp-primary-rgb:124,58,237;
    --ncp-accent-rgb:52,211,153;
    --ncp-secondary-rgb:16,185,129;
}

/* ═══ Reset & Base ════════════════════════════════════════ */
#ncp-test-app {
    font-family:var(--ncp-font); color:var(--ncp-dark-text); line-height:1.6;
    -webkit-font-smoothing:antialiased; max-width:780px; margin:0 auto; padding:0 20px;
}
#ncp-test-app *,#ncp-test-app *::before,#ncp-test-app *::after { box-sizing:border-box; }
.ncp-screen { display:none; }

/* ═══ Loader — Dark ══════════════════════════════════════ */
#ncp-screen-loading { display:flex; align-items:center; justify-content:center; min-height:300px; }
.ncp-loader { text-align:center; }
.ncp-loader-brain { margin:0 auto 20px; animation:ncpFloat 3s ease-in-out infinite; }
.ncp-loader-brain svg { filter:drop-shadow(0 0 16px rgba(var(--ncp-primary-rgb),.4)); }
.ncp-loader-circle { animation:ncpSpin 4s linear infinite; transform-origin:center; }
.ncp-loader-text { font-size:15px; font-weight:600; color:var(--ncp-dark-text-secondary); letter-spacing:.3px; }

/* ═══ Full dark background on entire app ═════════════════ */
#ncp-test-app {
    background:linear-gradient(170deg, #120830 0%, #1e0e4a 30%, #2d1462 60%, #1a0a3e 100%);
    border-radius:var(--ncp-radius-xl); padding:24px 24px 32px; margin-top:12px; margin-bottom:32px;
    position:relative; overflow:hidden;
    box-shadow:0 20px 60px rgba(18,8,48,.6);
}
/* Ambient glow effects */
#ncp-test-app::before {
    content:''; position:absolute; top:-120px; right:-80px; width:400px; height:400px;
    background:radial-gradient(circle, rgba(var(--ncp-primary-rgb),.2) 0%, transparent 70%);
    pointer-events:none; z-index:0;
}
#ncp-test-app::after {
    content:''; position:absolute; bottom:-100px; left:-60px; width:350px; height:350px;
    background:radial-gradient(circle, rgba(var(--ncp-secondary-rgb),.12) 0%, transparent 70%);
    pointer-events:none; z-index:0;
}
#ncp-test-app > * { position:relative; z-index:1; }


/* ═══ Animations ══════════════════════════════════════════ */
@keyframes ncpFadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes ncpSlideUp { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
@keyframes ncpScaleIn { from { opacity:0; transform:scale(.92); } to { opacity:1; transform:scale(1); } }
@keyframes ncpPulse { 0%,100% { transform:scale(1); } 50% { transform:scale(1.04); } }
@keyframes ncpSpin { to { transform:rotate(360deg); } }
@keyframes ncpFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-8px); } }
@keyframes ncpShake { 0%,100% { transform:translateX(0); } 20%,60% { transform:translateX(-6px); } 40%,80% { transform:translateX(6px); } }
@keyframes ncpGlow { 0%,100% { box-shadow:0 0 20px rgba(var(--ncp-primary-rgb),.3); } 50% { box-shadow:0 0 40px rgba(var(--ncp-primary-rgb),.6); } }
@keyframes ncpDotPulse { 0%,100% { opacity:1; } 50% { opacity:.4; } }
@keyframes ncpGradientSlide { 0% { background-position:0% 50%; } 50% { background-position:100% 50%; } 100% { background-position:0% 50%; } }

.ncp-animate-in { animation: ncpSlideUp .45s var(--ncp-ease) both; }
.ncp-shake { animation: ncpShake .4s var(--ncp-ease); }


/* ═══ Buttons (shared dark) ══════════════════════════════ */
.ncp-btn {
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:14px 28px; border-radius:var(--ncp-radius-full); border:none;
    font-family:var(--ncp-font); font-weight:700; font-size:15px;
    cursor:pointer; transition:all .25s var(--ncp-ease); text-decoration:none;
}
.ncp-btn--primary {
    background:linear-gradient(135deg,var(--ncp-purple-500),var(--ncp-purple-700));
    color:#fff; box-shadow:0 4px 20px rgba(var(--ncp-primary-rgb),.4);
}
.ncp-btn--primary:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(var(--ncp-primary-rgb),.55); }
.ncp-btn--large { padding:16px 40px; font-size:17px; }
.ncp-btn--ghost {
    background:rgba(255,255,255,.06); color:var(--ncp-purple-300);
    border:1.5px solid rgba(255,255,255,.12);
}
.ncp-btn--ghost:hover { background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.2); color:#fff; }
.ncp-btn--finish { background:linear-gradient(135deg,var(--ncp-green-500),var(--ncp-green-600)) !important; box-shadow:0 4px 20px rgba(var(--ncp-secondary-rgb),.4) !important; }
.ncp-btn--finish:hover { box-shadow:0 8px 28px rgba(var(--ncp-secondary-rgb),.5) !important; }
.ncp-btn--confirm {
    display:block; width:100%; margin-top:20px; padding:14px;
    background:linear-gradient(135deg,var(--ncp-green-500),var(--ncp-green-600));
    color:#fff; border:none; border-radius:var(--ncp-radius-md); font-family:var(--ncp-font);
    font-weight:700; font-size:15px; cursor:pointer; transition:all .25s var(--ncp-ease);
    box-shadow:0 4px 16px rgba(var(--ncp-secondary-rgb),.3);
}
.ncp-btn--confirm:hover { transform:translateY(-1px); box-shadow:0 6px 24px rgba(var(--ncp-secondary-rgb),.4); }
.ncp-btn--validated { background:#10b981 !important; pointer-events:none; opacity:.85; }
.ncp-btn:disabled { opacity:.3; pointer-events:none; }


/* ═══════════════════════════════════════════════════════════
   WELCOME HERO
   ═══════════════════════════════════════════════════════════ */
#ncp-screen-welcome { animation:ncpFadeIn .6s ease; }

.ncp-hero {
    position:relative; padding:48px 40px 36px; border-radius:var(--ncp-radius-xl);
    background:rgba(255,255,255,.03); backdrop-filter:blur(4px);
    border:1px solid rgba(255,255,255,.06);
    text-align:center; overflow:hidden; color:#fff;
}
.ncp-hero::before {
    content:''; position:absolute; inset:0; z-index:0;
    background:radial-gradient(ellipse at 20% 80%, rgba(var(--ncp-primary-rgb),.2) 0%, transparent 50%),
               radial-gradient(ellipse at 80% 20%, rgba(var(--ncp-secondary-rgb),.1) 0%, transparent 50%);
    pointer-events:none;
}
.ncp-hero > * { position:relative; z-index:1; }

/* Badge */
.ncp-hero__badge {
    display:inline-flex; align-items:center; gap:8px;
    padding:8px 20px; border-radius:var(--ncp-radius-full);
    background:rgba(255,255,255,.08); backdrop-filter:blur(8px);
    border:1px solid rgba(255,255,255,.12);
    font-size:13px; font-weight:600; color:rgba(255,255,255,.85);
    margin-bottom:28px; letter-spacing:.3px;
}
.ncp-hero__badge-dot {
    width:8px; height:8px; border-radius:50%; background:var(--ncp-green-400);
    animation:ncpDotPulse 2s ease infinite;
}

/* Title */
.ncp-hero__title {
    font-size:42px; font-weight:900; line-height:1.15; margin:0 0 20px;
    color:#fff; letter-spacing:-.5px;
}
.ncp-hero__title-accent {
    background:linear-gradient(135deg, var(--ncp-purple-400), var(--ncp-green-400));
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}

/* Hook */
.ncp-hero__hook {
    font-size:16px; line-height:1.7; color:rgba(255,255,255,.75);
    max-width:560px; margin:0 auto 28px; font-weight:400;
}
.ncp-hero__hook strong { color:#fff; font-weight:700; }

/* Social proof */
.ncp-hero__proof {
    display:inline-flex; align-items:center; gap:12px;
    padding:8px 20px 8px 8px; border-radius:var(--ncp-radius-full);
    background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08);
    margin-bottom:28px;
}
.ncp-hero__proof-avatars { display:flex; }
.ncp-hero__avatar {
    width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    font-size:16px; border:2px solid rgba(76,29,149,.8);
    background:linear-gradient(135deg,var(--ncp-purple-700),var(--ncp-purple-500)); margin-left:-6px;
}
.ncp-hero__avatar:first-child { margin-left:0; }
.ncp-hero__avatar--more { font-size:11px; font-weight:800; color:#fff; background:linear-gradient(135deg,var(--ncp-green-600),var(--ncp-green-500)); }
.ncp-hero__proof-text { font-size:13px; color:rgba(255,255,255,.7); font-weight:500; }
.ncp-hero__proof-text strong { color:var(--ncp-green-400); font-weight:700; }

/* CTA */
.ncp-hero__cta {
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    padding:18px 48px; border-radius:var(--ncp-radius-full); border:none;
    background:linear-gradient(135deg,var(--ncp-purple-600),var(--ncp-purple-700)); color:#fff;
    font-family:var(--ncp-font); font-size:18px; font-weight:800;
    cursor:pointer; transition:all .3s var(--ncp-ease);
    box-shadow:0 8px 32px rgba(var(--ncp-primary-rgb),.5); animation:ncpGlow 3s ease infinite;
}
.ncp-hero__cta:hover { transform:translateY(-3px) scale(1.02); box-shadow:0 12px 40px rgba(var(--ncp-primary-rgb),.65); }
.ncp-hero__cta:active { transform:scale(.98); }

.ncp-hero__time { font-size:13px; color:rgba(255,255,255,.45); margin:16px 0 0; font-weight:500; }
.ncp-hero__divider { width:60px; height:3px; margin:32px auto; background:linear-gradient(90deg,var(--ncp-purple-600),var(--ncp-green-400)); border-radius:2px; opacity:.5; }

/* Facts */
.ncp-hero__facts { display:flex; flex-direction:column; gap:14px; max-width:520px; margin:0 auto 28px; text-align:left; }
.ncp-hero__fact {
    display:flex; align-items:flex-start; gap:14px; padding:14px 18px;
    border-radius:var(--ncp-radius-md); background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.07); transition:background .2s;
}
.ncp-hero__fact:hover { background:rgba(255,255,255,.09); }
.ncp-hero__fact-icon { font-size:24px; flex-shrink:0; margin-top:2px; }
.ncp-hero__fact strong { display:block; font-size:14px; font-weight:700; color:#fff; margin-bottom:2px; }
.ncp-hero__fact span { font-size:12.5px; color:rgba(255,255,255,.55); line-height:1.4; }

/* Filières */
.ncp-hero__filieres { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-bottom:24px; }
.ncp-hero__filiere {
    padding:7px 16px; border-radius:var(--ncp-radius-full);
    font-size:12px; font-weight:700; border:1.5px solid;
}
.ncp-hero__filiere--dev { color:#C4B5FD; background:rgba(var(--ncp-primary-rgb),.15); border-color:rgba(var(--ncp-primary-rgb),.3); }
.ncp-hero__filiere--ia { color:#93C5FD; background:rgba(37,99,235,.15); border-color:rgba(37,99,235,.3); }
.ncp-hero__filiere--marketing { color:#6EE7B7; background:rgba(5,150,105,.15); border-color:rgba(5,150,105,.3); }
.ncp-hero__filiere--cyber { color:#FCA5A5; background:rgba(220,38,38,.15); border-color:rgba(220,38,38,.3); }
.ncp-hero__bottom-hook { font-size:14px; font-style:italic; color:rgba(255,255,255,.35); margin:0; }


/* ═══════════════════════════════════════════════════════════
   PROGRESS BAR — Dark
   ═══════════════════════════════════════════════════════════ */
.ncp-test-header { margin-bottom:24px; }
.ncp-progress-info { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; font-size:13px; font-weight:600; }
#ncp-current-section { color:var(--ncp-purple-300); }
#ncp-question-count { color:var(--ncp-dark-text-muted); }
.ncp-progress-bar { height:5px; background:rgba(255,255,255,.08); border-radius:var(--ncp-radius-full); overflow:hidden; }
#ncp-progress-fill { height:100%; background:linear-gradient(90deg,var(--ncp-purple-500),var(--ncp-green-400)); border-radius:var(--ncp-radius-full); transition:width .45s var(--ncp-ease); }


/* ═══════════════════════════════════════════════════════════
   TYPE BADGES — Dark glass
   ═══════════════════════════════════════════════════════════ */
.ncp-type-badge {
    display:inline-block; padding:5px 14px; border-radius:var(--ncp-radius-full);
    font-size:12px; font-weight:700; margin-bottom:16px; letter-spacing:.3px;
    border:1px solid;
}
.ncp-type-badge--mcq { background:rgba(var(--ncp-primary-rgb),.15); color:#C4B5FD; border-color:rgba(var(--ncp-primary-rgb),.25); }
.ncp-type-badge--scenario { background:rgba(239,68,68,.12); color:#FCA5A5; border-color:rgba(239,68,68,.2); }
.ncp-type-badge--image_choice { background:rgba(245,158,11,.12); color:#FCD34D; border-color:rgba(245,158,11,.2); }
.ncp-type-badge--binary { background:rgba(6,182,212,.12); color:#67E8F9; border-color:rgba(6,182,212,.2); }
.ncp-type-badge--slider { background:rgba(var(--ncp-primary-rgb),.15); color:#C4B5FD; border-color:rgba(var(--ncp-primary-rgb),.25); }
.ncp-type-badge--ranking { background:rgba(var(--ncp-secondary-rgb),.12); color:#6EE7B7; border-color:rgba(var(--ncp-secondary-rgb),.2); }
.ncp-type-badge--priority { background:rgba(236,72,153,.12); color:#F9A8D4; border-color:rgba(236,72,153,.2); }


/* ═══════════════════════════════════════════════════════════
   QUESTION CARD — Glassmorphic dark
   ═══════════════════════════════════════════════════════════ */
.ncp-question-card {
    background:rgba(255,255,255,.05); backdrop-filter:blur(12px);
    border-radius:var(--ncp-radius-xl); padding:32px;
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 8px 32px rgba(0,0,0,.2);
}
.ncp-question-header { text-align:center; margin-bottom:24px; }
.ncp-question-icon { font-size:36px; display:block; margin-bottom:8px; }
.ncp-question-text { font-size:20px; font-weight:800; color:#fff; margin:0; line-height:1.3; }
.ncp-question-subtitle { text-align:center; color:var(--ncp-dark-text-muted); font-size:14px; margin:-12px 0 20px; }


/* ═══════════════════════════════════════════════════════════
   MCQ ANSWERS — Dark cards
   ═══════════════════════════════════════════════════════════ */
.ncp-answers-list { display:flex; flex-direction:column; gap:10px; }
.ncp-answer-option {
    display:flex; align-items:center; gap:12px; padding:14px 18px;
    border:1.5px solid var(--ncp-dark-border); border-radius:var(--ncp-radius-md);
    background:var(--ncp-dark-surface); cursor:pointer; transition:all .2s var(--ncp-ease); user-select:none;
}
.ncp-answer-option:hover { border-color:var(--ncp-dark-border-hover); background:var(--ncp-dark-surface-hover); transform:translateX(4px); }
.ncp-answer--selected { border-color:var(--ncp-purple-500) !important; background:rgba(var(--ncp-primary-rgb),.12) !important; }
.ncp-answer-radio {
    width:20px; height:20px; border-radius:50%; border:2px solid rgba(255,255,255,.25);
    flex-shrink:0; transition:all .2s; position:relative;
}
.ncp-answer--selected .ncp-answer-radio { border-color:var(--ncp-purple-400); background:var(--ncp-purple-500); }
.ncp-answer--selected .ncp-answer-radio::after {
    content:''; position:absolute; inset:4px; border-radius:50%; background:#fff;
}
.ncp-answer-emoji { font-size:20px; flex-shrink:0; }
.ncp-answer-text { font-size:14px; font-weight:500; color:var(--ncp-dark-text-secondary); }
.ncp-answer--selected .ncp-answer-text { color:#fff; }


/* ═══════════════════════════════════════════════════════════
   SCENARIO — Dark immersive
   ═══════════════════════════════════════════════════════════ */
.ncp-scenario-box {
    background:linear-gradient(135deg,rgba(var(--ncp-primary-rgb),.12),rgba(var(--ncp-accent-rgb),.08));
    border:1px solid rgba(var(--ncp-primary-rgb),.2); border-radius:var(--ncp-radius-lg);
    padding:24px; margin-bottom:24px; position:relative; overflow:hidden;
}
.ncp-scenario-box::before { content:'📍'; position:absolute; top:12px; right:16px; font-size:24px; opacity:.3; }
.ncp-scenario-title { font-size:18px; font-weight:800; color:var(--ncp-purple-300); margin:0 0 8px; }
.ncp-scenario-desc { font-size:14px; color:var(--ncp-dark-text-secondary); margin:0; line-height:1.6; }
.ncp-type-scenario .ncp-question-text { text-align:center; margin-bottom:20px; }

.ncp-scenario-options { display:flex; flex-direction:column; gap:10px; }
.ncp-scenario-option {
    display:flex; align-items:center; gap:14px; padding:16px 18px;
    border:1.5px solid var(--ncp-dark-border); border-radius:var(--ncp-radius-md);
    background:var(--ncp-dark-surface); cursor:pointer; transition:all .25s var(--ncp-ease); user-select:none;
}
.ncp-scenario-option:hover { border-color:var(--ncp-dark-border-hover); background:var(--ncp-dark-surface-hover); transform:translateX(4px); }
.ncp-scenario-option.ncp-answer--selected { border-color:var(--ncp-purple-500); background:rgba(var(--ncp-primary-rgb),.12); }
.ncp-scenario-opt-emoji { font-size:28px; flex-shrink:0; }
.ncp-scenario-opt-content { flex:1; }
.ncp-scenario-opt-title { font-size:13px; font-weight:700; color:var(--ncp-purple-300); margin-bottom:2px; }
.ncp-scenario-opt-desc { font-size:13px; color:var(--ncp-dark-text-secondary); line-height:1.4; }
.ncp-scenario-opt-check {
    width:28px; height:28px; flex-shrink:0; border-radius:50%;
    border:2px solid rgba(255,255,255,.15); display:flex; align-items:center;
    justify-content:center; color:transparent; transition:all .2s;
}
.ncp-scenario-option.ncp-answer--selected .ncp-scenario-opt-check {
    background:var(--ncp-green-500); border-color:var(--ncp-green-500); color:#fff;
}
.ncp-scenario-opt-check svg { width:14px; height:14px; }


/* ═══════════════════════════════════════════════════════════
   IMAGE CHOICE — Dark glow cards
   ═══════════════════════════════════════════════════════════ */
.ncp-imgchoice-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.ncp-imgchoice-card {
    position:relative; padding:24px 16px; border-radius:var(--ncp-radius-lg);
    border:1.5px solid var(--ncp-dark-border); text-align:center;
    cursor:pointer; transition:all .3s var(--ncp-ease); user-select:none;
    background:var(--ncp-dark-surface); overflow:hidden;
}
.ncp-imgchoice-card::before {
    content:''; position:absolute; inset:0; opacity:0;
    background:radial-gradient(circle at center, var(--card-color), transparent 70%);
    transition:opacity .3s;
}
.ncp-imgchoice-card:hover { border-color:var(--card-color); transform:translateY(-4px); box-shadow:0 8px 30px rgba(0,0,0,.3); }
.ncp-imgchoice-card:hover::before { opacity:.1; }
.ncp-imgchoice--selected { border-color:var(--card-color) !important; transform:translateY(-4px); box-shadow:0 8px 30px rgba(0,0,0,.3), 0 0 20px color-mix(in srgb, var(--card-color) 30%, transparent); }
.ncp-imgchoice--selected::before { opacity:.15 !important; }
.ncp-imgchoice-emoji { font-size:42px; display:block; margin-bottom:10px; position:relative; z-index:1; }
.ncp-imgchoice-title { font-size:15px; font-weight:800; color:#fff; margin-bottom:6px; position:relative; z-index:1; }
.ncp-imgchoice-desc { font-size:12px; color:var(--ncp-dark-text-muted); line-height:1.4; position:relative; z-index:1; }
.ncp-imgchoice-check {
    position:absolute; top:10px; right:10px; width:28px; height:28px;
    color:transparent; transition:all .2s; z-index:2;
}
.ncp-imgchoice--selected .ncp-imgchoice-check { color:var(--card-color); }
.ncp-imgchoice-check svg { width:28px; height:28px; }


/* ═══════════════════════════════════════════════════════════
   BINARY (This or That) — Dark split
   ═══════════════════════════════════════════════════════════ */
.ncp-binary-pairs { display:flex; flex-direction:column; gap:20px; }
.ncp-binary-pair { display:flex; align-items:stretch; gap:12px; position:relative; }
.ncp-binary-vs-label {
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    z-index:2; background:rgba(255,255,255,.15); backdrop-filter:blur(8px);
    color:#fff; width:36px; height:36px; border-radius:50%; font-size:11px; font-weight:800;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 2px 12px rgba(0,0,0,.3); border:1px solid rgba(255,255,255,.2);
}
.ncp-binary-btn {
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:8px; padding:20px 12px; border:1.5px solid var(--ncp-dark-border);
    border-radius:var(--ncp-radius-lg); background:var(--ncp-dark-surface);
    cursor:pointer; font-family:var(--ncp-font); transition:all .25s var(--ncp-ease); color:#fff;
}
.ncp-binary-btn:hover { border-color:var(--ncp-dark-border-hover); background:var(--ncp-dark-surface-hover); transform:scale(1.02); }
.ncp-binary--chosen.ncp-binary-btn--left {
    border-color:var(--ncp-purple-500); background:rgba(var(--ncp-primary-rgb),.15);
    transform:scale(1.03); box-shadow:0 0 20px rgba(var(--ncp-primary-rgb),.2);
}
.ncp-binary--chosen.ncp-binary-btn--right {
    border-color:var(--ncp-green-500); background:rgba(var(--ncp-secondary-rgb),.12);
    transform:scale(1.03); box-shadow:0 0 20px rgba(var(--ncp-secondary-rgb),.15);
}
.ncp-binary-emoji { font-size:32px; }
.ncp-binary-text { font-size:13px; font-weight:600; color:var(--ncp-dark-text-secondary); text-align:center; }
.ncp-binary--chosen .ncp-binary-text { color:#fff; }


/* ═══════════════════════════════════════════════════════════
   SLIDER — Dark with glow track
   ═══════════════════════════════════════════════════════════ */
.ncp-slider-axes { display:flex; flex-direction:column; gap:32px; }
.ncp-slider-labels { display:flex; justify-content:space-between; margin-bottom:12px; }
.ncp-slider-label { font-size:13px; font-weight:600; color:var(--ncp-dark-text-secondary); max-width:45%; }
.ncp-slider-label--left { text-align:left; }
.ncp-slider-label--right { text-align:right; }
.ncp-slider-track-wrap { position:relative; height:8px; margin:0 4px; }
.ncp-slider-track-bg { position:absolute; inset:0; border-radius:var(--ncp-radius-full); background:rgba(255,255,255,.1); }
/* Fill — neutral until touched */
.ncp-slider-fill {
    position:absolute; top:0; left:0; height:100%; border-radius:var(--ncp-radius-full);
    background:rgba(255,255,255,.2); pointer-events:none; transition:width .1s, background .3s;
}
.ncp-slider-axis.ncp-slider--touched .ncp-slider-fill {
    background:linear-gradient(90deg,var(--ncp-purple-400),var(--ncp-green-400));
    box-shadow:0 0 10px rgba(var(--ncp-primary-rgb),.3);
}
/* Range input */
.ncp-slider-track-wrap input[type=range] {
    position:absolute; inset:0; width:100%; height:24px; top:-8px;
    background:transparent; opacity:1; cursor:pointer;
    -webkit-appearance:none; appearance:none; margin:0; z-index:2;
}
.ncp-slider-track-wrap input[type=range]::-webkit-slider-runnable-track { height:8px; background:transparent; }
.ncp-slider-track-wrap input[type=range]::-moz-range-track { height:8px; background:transparent; }
/* Thumb — gray until touched */
.ncp-slider-track-wrap input[type=range]::-webkit-slider-thumb {
    -webkit-appearance:none; width:26px; height:26px; border-radius:50%;
    background:rgba(255,255,255,.35); border:3px solid rgba(255,255,255,.15);
    box-shadow:0 2px 10px rgba(0,0,0,.3); cursor:grab; transition:background .3s, box-shadow .3s;
}
.ncp-slider-track-wrap input[type=range]::-moz-range-thumb {
    width:26px; height:26px; border-radius:50%;
    background:rgba(255,255,255,.35); border:3px solid rgba(255,255,255,.15);
    box-shadow:0 2px 10px rgba(0,0,0,.3); cursor:grab; transition:background .3s;
}
/* Active thumb */
.ncp-slider-axis.ncp-slider--touched input[type=range]::-webkit-slider-thumb {
    background:var(--ncp-purple-500); border-color:rgba(255,255,255,.3);
    box-shadow:0 0 16px rgba(var(--ncp-primary-rgb),.5);
}
.ncp-slider-axis.ncp-slider--touched input[type=range]::-moz-range-thumb {
    background:var(--ncp-purple-500); border-color:rgba(255,255,255,.3);
}
.ncp-slider-ticks { display:flex; justify-content:space-between; padding:6px 0 0; }
.ncp-slider-ticks span { width:2px; height:6px; background:rgba(255,255,255,.15); border-radius:1px; }
.ncp-slider-hint { text-align:center; font-size:12px; color:var(--ncp-dark-text-muted); margin-bottom:4px; font-style:italic; }


/* ═══════════════════════════════════════════════════════════
   RANKING — Dark draggable
   ═══════════════════════════════════════════════════════════ */
.ncp-ranking-hint {
    text-align:center; font-size:13px; color:var(--ncp-dark-text-muted); margin-bottom:16px;
    padding:8px 16px; background:rgba(255,255,255,.04); border-radius:var(--ncp-radius-md);
    border:1px solid rgba(255,255,255,.06);
}
.ncp-ranking-list { display:flex; flex-direction:column; gap:6px; }
.ncp-ranking-item {
    display:flex; align-items:center; gap:10px; padding:14px 16px;
    background:var(--ncp-dark-surface); border:1.5px solid var(--ncp-dark-border);
    border-radius:var(--ncp-radius-md); cursor:grab; user-select:none;
    transition:all .2s var(--ncp-ease);
}
.ncp-ranking-item:hover { border-color:var(--ncp-dark-border-hover); background:var(--ncp-dark-surface-hover); }
.ncp-ranking-item:active { cursor:grabbing; }
.ncp-ranking-dragging { opacity:.5; border:1.5px dashed var(--ncp-purple-400); }
.ncp-ranking-rank {
    width:28px; height:28px; border-radius:50%;
    background:rgba(255,255,255,.12); color:rgba(255,255,255,.6); font-size:13px; font-weight:800;
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    transition:background .3s;
}
/* Medal colors only after confirm */
.ncp-ranking-list.ncp-ranking--confirmed .ncp-ranking-item .ncp-ranking-rank { background:linear-gradient(135deg,var(--ncp-purple-500),var(--ncp-purple-600)); color:#fff; }
.ncp-ranking-list.ncp-ranking--confirmed .ncp-ranking-item:nth-child(1) .ncp-ranking-rank { background:linear-gradient(135deg,#F59E0B,#D97706); }
.ncp-ranking-list.ncp-ranking--confirmed .ncp-ranking-item:nth-child(2) .ncp-ranking-rank { background:linear-gradient(135deg,#9CA3AF,#6B7280); }
.ncp-ranking-list.ncp-ranking--confirmed .ncp-ranking-item:nth-child(3) .ncp-ranking-rank { background:linear-gradient(135deg,#D97706,#92400E); }
.ncp-ranking-emoji { font-size:20px; flex-shrink:0; }
.ncp-ranking-text { flex:1; font-size:13px; font-weight:600; color:var(--ncp-dark-text-secondary); }
.ncp-ranking-arrows { display:flex; flex-direction:column; gap:2px; flex-shrink:0; }
.ncp-ranking-arrow {
    width:24px; height:20px; border:none; background:rgba(255,255,255,.08);
    border-radius:4px; cursor:pointer; display:flex; align-items:center; justify-content:center;
    color:rgba(255,255,255,.4); transition:all .15s;
}
.ncp-ranking-arrow:hover:not(:disabled) { background:rgba(var(--ncp-primary-rgb),.25); color:var(--ncp-purple-300); }
.ncp-ranking-arrow:disabled { opacity:.2; cursor:default; }
.ncp-ranking-arrow svg { width:14px; height:14px; }
.ncp-ranking-grip { color:rgba(255,255,255,.2); font-size:16px; flex-shrink:0; cursor:grab; letter-spacing:2px; }


/* ═══════════════════════════════════════════════════════════
   PRIORITY (Multi-select) — Dark glow cards
   ═══════════════════════════════════════════════════════════ */
.ncp-priority-counter { text-align:center; font-size:14px; color:var(--ncp-dark-text-muted); margin-bottom:16px; }
.ncp-priority-counter strong { color:var(--ncp-purple-300); }
.ncp-priority-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.ncp-priority-card {
    position:relative; display:flex; align-items:center; gap:10px;
    padding:14px 16px; border:1.5px solid var(--ncp-dark-border);
    border-radius:var(--ncp-radius-md); cursor:pointer; background:var(--ncp-dark-surface);
    transition:all .2s var(--ncp-ease); user-select:none;
}
.ncp-priority-card:hover { border-color:var(--ncp-dark-border-hover); transform:translateY(-2px); box-shadow:0 4px 16px rgba(0,0,0,.2); }
.ncp-priority--selected {
    border-color:var(--ncp-purple-500) !important; background:rgba(var(--ncp-primary-rgb),.12);
    transform:translateY(-2px); box-shadow:0 0 16px rgba(var(--ncp-primary-rgb),.15);
}
.ncp-priority-emoji { font-size:24px; flex-shrink:0; }
.ncp-priority-text { font-size:13px; font-weight:600; color:var(--ncp-dark-text-secondary); flex:1; }
.ncp-priority--selected .ncp-priority-text { color:#fff; }
.ncp-priority-check {
    width:22px; height:22px; flex-shrink:0; border-radius:50%;
    border:2px solid rgba(255,255,255,.15); display:flex; align-items:center;
    justify-content:center; color:transparent; transition:all .2s;
}
.ncp-priority--selected .ncp-priority-check {
    background:var(--ncp-green-500); border-color:var(--ncp-green-500); color:#fff;
}
.ncp-priority-check svg { width:12px; height:12px; }


/* ═══ Alert — Dark ═══════════════════════════════════════ */
.ncp-alert {
    padding:12px 20px; border-radius:var(--ncp-radius-md);
    background:rgba(245,158,11,.12); border:1px solid rgba(245,158,11,.25);
    color:#FCD34D; font-size:14px; font-weight:600; text-align:center;
    margin-bottom:16px; animation:ncpSlideUp .3s var(--ncp-ease);
}

/* ═══ Navigation — Dark ══════════════════════════════════ */
.ncp-test-navigation { display:flex; justify-content:space-between; gap:12px; margin-top:24px; }
.ncp-test-navigation .ncp-btn { min-width:140px; }


/* ═══════════════════════════════════════════════════════════
   PROCESSING — Dark
   ═══════════════════════════════════════════════════════════ */
#ncp-screen-processing { text-align:center; padding:60px 20px; }
.ncp-processing-card { max-width:440px; margin:0 auto; }
.ncp-processing-animation { margin-bottom:32px; position:relative; display:inline-block; width:120px; height:120px; }
.ncp-processing-ring {
    position:absolute; inset:0; border:4px solid rgba(255,255,255,.06);
    border-top-color:var(--ncp-purple-500); border-radius:50%;
    animation:ncpSpin 1.2s linear infinite;
}
.ncp-processing-ring--2 {
    position:absolute; top:12px; left:12px; right:12px; bottom:12px;
    border:4px solid rgba(255,255,255,.06); border-bottom-color:var(--ncp-green-400);
    border-radius:50%; animation:ncpSpin 1.8s linear reverse infinite;
}
.ncp-processing-ring--3 {
    position:absolute; top:24px; left:24px; right:24px; bottom:24px;
    border:4px solid rgba(255,255,255,.06); border-left-color:var(--ncp-blue-500);
    border-radius:50%; animation:ncpSpin 2.4s linear infinite;
}
.ncp-processing-icon { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-size:36px; z-index:2; }
.ncp-processing-title { font-size:22px; font-weight:800; color:#fff; margin-bottom:24px; }
.ncp-processing-steps { display:flex; flex-direction:column; gap:12px; max-width:380px; margin:0 auto; text-align:left; }
.ncp-processing-step {
    display:flex; align-items:center; gap:12px; padding:10px 16px;
    background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.06);
    border-radius:var(--ncp-radius-md);
    font-size:14px; color:var(--ncp-dark-text-muted); transition:all .4s;
}
.ncp-processing-step.active { color:var(--ncp-purple-300); background:rgba(var(--ncp-primary-rgb),.1); border-color:rgba(var(--ncp-primary-rgb),.2); }
.ncp-processing-step.done { color:var(--ncp-green-400); background:rgba(var(--ncp-secondary-rgb),.08); border-color:rgba(var(--ncp-secondary-rgb),.15); }
.ncp-processing-step-icon { font-size:18px; flex-shrink:0; }


/* ═══════════════════════════════════════════════════════════
   LEAD GATE — Dark, wide
   ═══════════════════════════════════════════════════════════ */
#ncp-screen-leadgate { max-width:700px; margin:0 auto; }

.ncp-leadgate-card {
    background:rgba(255,255,255,.05); backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.08);
    border-radius:var(--ncp-radius-xl); padding:44px 48px; text-align:center;
}
.ncp-leadgate-preview { margin-bottom:28px; }
.ncp-leadgate-badge {
    display:inline-block; padding:6px 18px; border-radius:var(--ncp-radius-full);
    font-size:12px; font-weight:700; background:rgba(var(--ncp-secondary-rgb),.12); color:#6EE7B7;
    border:1px solid rgba(var(--ncp-secondary-rgb),.2); margin-bottom:12px;
}
.ncp-leadgate-title { font-size:24px; font-weight:800; margin:0 0 6px; color:#fff; }
.ncp-leadgate-subtitle { font-size:14px; color:var(--ncp-dark-text-secondary); margin:0 0 20px; line-height:1.5; }
.ncp-leadgate-teaser {
    display:flex; align-items:center; gap:16px; padding:18px 24px;
    background:rgba(var(--ncp-primary-rgb),.1); border:1px solid rgba(var(--ncp-primary-rgb),.2);
    border-radius:var(--ncp-radius-lg); margin-bottom:4px; text-align:left;
}
.ncp-teaser-icon { font-size:44px; }
.ncp-teaser-label { font-size:11px; text-transform:uppercase; letter-spacing:1px; color:var(--ncp-dark-text-muted); font-weight:700; }
.ncp-teaser-title { font-size:20px; font-weight:800; color:var(--ncp-purple-300); }
.ncp-teaser-subtitle { font-size:14px; color:var(--ncp-dark-text-secondary); }
.ncp-teaser-locked { font-size:12px; color:var(--ncp-dark-text-muted); margin-top:6px; }

.ncp-leadgate-divider {
    display:flex; align-items:center; gap:16px; margin:20px 0;
    font-size:13px; color:var(--ncp-dark-text-muted);
}
.ncp-leadgate-divider::before, .ncp-leadgate-divider::after {
    content:''; flex:1; height:1px; background:rgba(255,255,255,.1);
}

/* HubSpot form wrapper — wide, dark inputs */
.ncp-leadgate-form-wrapper { width:100%; margin:28px 0 24px; text-align:left; }
#ncp-hubspot-form-container { width:100%; }
#ncp-hubspot-form-container .hs-form,
#ncp-hubspot-form-container form { width:100% !important; max-width:100% !important; }
#ncp-hubspot-form-container .hs-form-field { margin-bottom:16px !important; }
#ncp-hubspot-form-container .hs-input,
#ncp-hubspot-form-container input[type="text"],
#ncp-hubspot-form-container input[type="email"],
#ncp-hubspot-form-container input[type="tel"],
#ncp-hubspot-form-container input[type="number"],
#ncp-hubspot-form-container select,
#ncp-hubspot-form-container textarea {
    width:100% !important; max-width:100% !important;
    padding:14px 18px !important; border:1.5px solid rgba(255,255,255,.15) !important;
    border-radius:var(--ncp-radius-md) !important; font-size:15px !important;
    font-family:var(--ncp-font) !important; transition:border-color .2s !important;
    background:rgba(255,255,255,.06) !important; color:#fff !important;
    box-sizing:border-box !important;
}
#ncp-hubspot-form-container .hs-input::placeholder,
#ncp-hubspot-form-container input::placeholder {
    color:rgba(255,255,255,.35) !important;
}
#ncp-hubspot-form-container .hs-input:focus,
#ncp-hubspot-form-container input:focus {
    outline:none !important; border-color:var(--ncp-purple-500) !important;
    box-shadow:0 0 0 3px rgba(var(--ncp-primary-rgb),.2) !important;
}
#ncp-hubspot-form-container label {
    font-size:13px !important; font-weight:600 !important; color:var(--ncp-dark-text-secondary) !important;
    font-family:var(--ncp-font) !important; margin-bottom:6px !important; display:block !important;
}
#ncp-hubspot-form-container .hs-button,
#ncp-hubspot-form-container input[type="submit"],
#ncp-hubspot-form-container button[type="submit"] {
    width:100% !important; padding:16px 32px !important;
    background:linear-gradient(135deg,var(--ncp-purple-500),var(--ncp-purple-700)) !important;
    color:#fff !important; border:none !important; border-radius:var(--ncp-radius-full) !important;
    font-family:var(--ncp-font) !important; font-size:16px !important; font-weight:700 !important;
    cursor:pointer !important; transition:all .25s var(--ncp-ease) !important;
    box-shadow:0 4px 20px rgba(var(--ncp-primary-rgb),.4) !important;
}
#ncp-hubspot-form-container .hs-button:hover,
#ncp-hubspot-form-container input[type="submit"]:hover {
    transform:translateY(-2px) !important; box-shadow:0 8px 28px rgba(var(--ncp-primary-rgb),.55) !important;
}

/* Fallback form — dark */
.ncp-fallback-form { text-align:left; }
.ncp-fallback-form .ncp-form-field { margin-bottom:16px; }
.ncp-fallback-form label { display:block; font-size:13px; font-weight:600; color:var(--ncp-dark-text-secondary); margin-bottom:6px; }
.ncp-fallback-form input {
    width:100%; padding:14px 18px; border:1.5px solid rgba(255,255,255,.15);
    border-radius:var(--ncp-radius-md); font-size:15px; font-family:var(--ncp-font);
    background:rgba(255,255,255,.06); color:#fff; transition:border-color .2s;
}
.ncp-fallback-form input::placeholder { color:rgba(255,255,255,.35); }
.ncp-fallback-form input:focus { outline:none; border-color:var(--ncp-purple-500); box-shadow:0 0 0 3px rgba(var(--ncp-primary-rgb),.2); }

.ncp-leadgate-disclaimer { font-size:12px; color:var(--ncp-dark-text-muted); margin:0; }


/* ═══════════════════════════════════════════════════════════
   RESULTS — Dark
   ═══════════════════════════════════════════════════════════ */
.ncp-results-hero {
    background:linear-gradient(135deg,rgba(var(--ncp-primary-rgb),.2),rgba(var(--ncp-primary-rgb),.08));
    border:1px solid rgba(var(--ncp-primary-rgb),.2);
    border-radius:var(--ncp-radius-xl); padding:48px 32px; text-align:center;
    margin-bottom:32px;
}
.ncp-results-hero-content { color:#fff; }
.ncp-results-badge {
    display:inline-block; padding:6px 16px; background:rgba(255,255,255,.1);
    border:1px solid rgba(255,255,255,.12);
    border-radius:var(--ncp-radius-full); font-size:12px; font-weight:700; margin-bottom:16px;
}
.ncp-results-profile-icon { font-size:56px; display:block; margin-bottom:12px; }
.ncp-results-profile-title { font-size:32px; font-weight:800; margin:0 0 8px; color:#fff; }
.ncp-results-profile-subtitle { font-size:16px; color:var(--ncp-dark-text-secondary); margin:0 auto; max-width:500px; }

.ncp-section-title { font-size:18px; font-weight:800; color:#fff; margin:0 0 20px; display:flex; align-items:center; gap:8px; }
.ncp-section-title-icon { font-size:22px; }

.ncp-scores-section { margin-bottom:32px; }
.ncp-score-bars { display:flex; flex-direction:column; gap:14px; }
.ncp-score-row { display:flex; align-items:center; gap:12px; }
.ncp-score-label { width:180px; font-size:13px; font-weight:600; color:var(--ncp-dark-text-secondary); display:flex; align-items:center; gap:6px; flex-shrink:0; }
.ncp-score-label-icon { font-size:18px; }
.ncp-score-bar-container { flex:1; height:12px; background:rgba(255,255,255,.08); border-radius:var(--ncp-radius-full); overflow:hidden; }
.ncp-score-bar-fill { height:100%; border-radius:var(--ncp-radius-full); width:0; transition:width 1.2s var(--ncp-ease); }
.ncp-score-bar-fill--dev { background:linear-gradient(90deg,var(--ncp-purple-600),var(--ncp-purple-400)); box-shadow:0 0 8px rgba(var(--ncp-primary-rgb),.3); }
.ncp-score-bar-fill--ia { background:linear-gradient(90deg,#2563EB,#60A5FA); box-shadow:0 0 8px rgba(37,99,235,.3); }
.ncp-score-bar-fill--marketing { background:linear-gradient(90deg,var(--ncp-green-600),var(--ncp-green-400)); box-shadow:0 0 8px rgba(5,150,105,.3); }
.ncp-score-bar-fill--cyber { background:linear-gradient(90deg,#DC2626,#F87171); box-shadow:0 0 8px rgba(220,38,38,.3); }
.ncp-score-value { width:42px; font-size:14px; font-weight:700; color:#fff; text-align:right; }

.ncp-radar-section { margin-bottom:32px; }
.ncp-radar-chart-container { max-width:380px; margin:0 auto; }

.ncp-bootcamps-section { margin-bottom:32px; }
.ncp-bootcamps-grid { display:grid; gap:16px; }
.ncp-bootcamp-card {
    background:var(--ncp-dark-surface); border:1px solid var(--ncp-dark-border);
    border-radius:var(--ncp-radius-lg); overflow:hidden; transition:all .3s;
}
.ncp-bootcamp-card--primary { border:2px solid rgba(var(--ncp-primary-rgb),.3); box-shadow:0 4px 24px rgba(var(--ncp-primary-rgb),.15); }
.ncp-bootcamp-card-header { padding:20px 24px; }
.ncp-bootcamp-name { font-size:16px; font-weight:800; color:#fff; margin:0 0 6px; }
.ncp-bootcamp-description { font-size:13px; color:var(--ncp-dark-text-muted); margin:0 0 6px; }
.ncp-bootcamp-level { font-size:12px; color:var(--ncp-purple-300); font-weight:700; }
.ncp-bootcamp-cta {
    display:inline-flex; align-items:center; gap:6px; margin-top:12px;
    padding:8px 18px; border-radius:var(--ncp-radius-full); border:none;
    background:linear-gradient(135deg,var(--ncp-purple-500),var(--ncp-purple-700));
    color:#fff; font-size:13px; font-weight:600; font-family:var(--ncp-font);
    cursor:pointer; transition:all .2s;
    box-shadow:0 2px 12px rgba(var(--ncp-primary-rgb),.3);
}
.ncp-bootcamp-cta:hover { transform:translateY(-1px); box-shadow:0 4px 16px rgba(var(--ncp-primary-rgb),.4); }
.ncp-bootcamp-card-body { padding:0 24px 20px; }
.ncp-bootcamp-topics-title { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--ncp-dark-text-muted); margin-bottom:8px; }
.ncp-bootcamp-topics { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.ncp-bootcamp-topic { display:flex; align-items:flex-start; gap:8px; font-size:12.5px; color:var(--ncp-dark-text-secondary); }
.ncp-bootcamp-topic-icon {
    width:18px; height:18px; border-radius:50%; background:var(--ncp-green-500); flex-shrink:0;
    display:flex; align-items:center; justify-content:center; margin-top:1px;
}
.ncp-bootcamp-topic-icon svg { width:10px; height:10px; }

.ncp-secondary-section { opacity:.85; }
.ncp-secondary-badge {
    display:inline-block; padding:4px 14px; background:rgba(59,130,246,.12);
    border:1px solid rgba(59,130,246,.2);
    border-radius:var(--ncp-radius-full); font-size:12px; font-weight:700; color:#93C5FD; margin-bottom:12px;
}

.ncp-results-actions { text-align:center; margin-top:32px; padding-bottom:8px; }


/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════ */
@media (max-width:768px) {
    #ncp-test-app { padding:16px 14px 24px; margin:8px auto; }
    .ncp-hero { padding:36px 24px 28px; }
    .ncp-hero__title { font-size:30px; }
    .ncp-hero__hook { font-size:14px; }
    .ncp-hero__cta { padding:16px 36px; font-size:16px; }
    .ncp-hero__facts { gap:10px; }
    .ncp-hero__fact { padding:12px 14px; }
    .ncp-question-card { padding:24px 18px; }
    .ncp-imgchoice-grid { grid-template-columns:repeat(2,1fr); gap:10px; }
    .ncp-imgchoice-emoji { font-size:32px; }
    .ncp-priority-grid { grid-template-columns:repeat(2,1fr); gap:8px; }
    .ncp-score-label { width:140px; font-size:12px; }
    .ncp-binary-pair { gap:8px; }
    .ncp-binary-emoji { font-size:24px; }
    .ncp-binary-text { font-size:12px; }
    .ncp-results-hero { padding:32px 20px; }
    .ncp-results-profile-title { font-size:24px; }
    .ncp-bootcamp-topics { grid-template-columns:1fr; }
    #ncp-screen-leadgate { max-width:100%; }
    .ncp-leadgate-card { padding:32px 24px; }
}

@media (max-width:480px) {
    #ncp-test-app { padding:12px 10px 20px; border-radius:var(--ncp-radius-lg); }
    .ncp-hero { padding:28px 16px 20px; }
    .ncp-hero__title { font-size:26px; }
    .ncp-hero__title br { display:none; }
    .ncp-hero__hook { font-size:13px; }
    .ncp-hero__cta { padding:14px 28px; font-size:15px; width:100%; }
    .ncp-hero__filieres { gap:6px; }
    .ncp-hero__filiere { font-size:11px; padding:5px 12px; }
    .ncp-hero__proof { flex-direction:column; gap:8px; padding:12px; }
    .ncp-question-text { font-size:17px; }
    .ncp-question-card { padding:20px 14px; }
    .ncp-imgchoice-grid { grid-template-columns:1fr 1fr; gap:8px; }
    .ncp-imgchoice-card { padding:16px 10px; }
    .ncp-imgchoice-emoji { font-size:28px; }
    .ncp-imgchoice-desc { font-size:11px; }
    .ncp-priority-grid { grid-template-columns:1fr; }
    .ncp-binary-pair { flex-direction:row; }
    .ncp-binary-btn { padding:14px 8px; }
    .ncp-ranking-text { font-size:12px; }
    .ncp-scenario-option { padding:12px 14px; gap:10px; }
    .ncp-scenario-opt-emoji { font-size:22px; }
    .ncp-score-row { flex-wrap:wrap; }
    .ncp-score-label { width:100%; }
    .ncp-score-bar-container { flex:1; }
    .ncp-test-navigation { flex-direction:column-reverse; }
    .ncp-test-navigation .ncp-btn { width:100%; }
    .ncp-leadgate-card { padding:24px 14px; }
}

/* ═══ Design Settings Overrides (driven by data-attributes from JS) ═══ */

/* --- Card style: solid --- */
#ncp-test-app[data-card-style="solid"] .ncp-question-card,
#ncp-test-app[data-card-style="solid"] .ncp-answer-option,
#ncp-test-app[data-card-style="solid"] .ncp-scenario-option,
#ncp-test-app[data-card-style="solid"] .ncp-imgchoice-card,
#ncp-test-app[data-card-style="solid"] .ncp-binary-btn,
#ncp-test-app[data-card-style="solid"] .ncp-priority-card,
#ncp-test-app[data-card-style="solid"] .ncp-ranking-item {
    backdrop-filter:none; -webkit-backdrop-filter:none;
    background:rgba(30,14,74,.85);
}

/* --- Card style: minimal --- */
#ncp-test-app[data-card-style="minimal"] .ncp-question-card {
    backdrop-filter:none; -webkit-backdrop-filter:none;
    background:transparent; border:1px solid rgba(255,255,255,.12);
}
#ncp-test-app[data-card-style="minimal"] .ncp-answer-option,
#ncp-test-app[data-card-style="minimal"] .ncp-scenario-option,
#ncp-test-app[data-card-style="minimal"] .ncp-imgchoice-card,
#ncp-test-app[data-card-style="minimal"] .ncp-binary-btn,
#ncp-test-app[data-card-style="minimal"] .ncp-priority-card,
#ncp-test-app[data-card-style="minimal"] .ncp-ranking-item {
    backdrop-filter:none; -webkit-backdrop-filter:none;
    background:transparent; border:1px solid rgba(255,255,255,.08);
}

/* --- Animation speed: fast (0.12s) --- */
#ncp-test-app[data-animation="fast"],
#ncp-test-app[data-animation="fast"] * {
    transition-duration:0.12s !important;
}
#ncp-test-app[data-animation="fast"] .ncp-score-bar-fill { transition-duration:0.6s !important; }
#ncp-test-app[data-animation="fast"] #ncp-progress-fill { transition-duration:0.2s !important; }

/* --- Animation speed: slow (0.7s) --- */
#ncp-test-app[data-animation="slow"],
#ncp-test-app[data-animation="slow"] * {
    transition-duration:0.7s !important;
}
#ncp-test-app[data-animation="slow"] .ncp-score-bar-fill { transition-duration:2s !important; }
#ncp-test-app[data-animation="slow"] #ncp-progress-fill { transition-duration:0.9s !important; }

/* --- Animation speed: none (disabled) --- */
#ncp-test-app[data-animation="none"],
#ncp-test-app[data-animation="none"] *,
#ncp-test-app[data-animation="none"] *::before,
#ncp-test-app[data-animation="none"] *::after {
    transition-duration:0s !important; animation-duration:0s !important;
}

/* --- Toggle: hide progress bar --- */
#ncp-test-app[data-hide-progress="1"] .ncp-progress-container { display:none; }

/* --- Toggle: hide type badges --- */
#ncp-test-app[data-hide-badges="1"] .ncp-type-badge { display:none; }

/* --- Toggle: hide question numbers --- */
#ncp-test-app[data-hide-numbers="1"] .ncp-progress-count { display:none; }