/* ═══════════════════════════════════════════════════════
   TIMP — This Is My Place  |  CSS v3.1
   ═══════════════════════════════════════════════════════ */

:root{
    --p:  #5b4fcf;
    --p2: #7c6ce6;
    --p3: #a78bfa;
    --bg: #f5f4ff;
    --sf: #ffffff;
    --bd: #ede9fe;
    --tx: #1a1a2e;
    --mt: #6b7280;
    --ok: #059669;
    --er: #dc2626;
    --am: #f59e0b;
    --sh: 0 2px 12px rgba(91,79,207,.08);
    --shm:0 4px 24px rgba(91,79,207,.13);
}
*{box-sizing:border-box}

/* ── WRAPPER ── */
.hec-app{
    width:100%;max-width:480px;margin:0 auto;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    font-size:15px;line-height:1.55;color:var(--tx);
    background:var(--bg);min-height:100vh;
    display:flex;flex-direction:column;
    padding-bottom:70px; /* space for bottom nav */
}

/* ═══════════════════════ TOP BAR ═══ */
.hec-topbar{
    background:var(--sf);
    border-bottom:1px solid var(--bd);
    padding:14px 18px 14px;
    position:sticky;top:0;z-index:100;
    display:flex;align-items:center;gap:12px;
    flex-shrink:0;
}

/* TIMP wordmark */
.hec-wordmark{
    font-size:22px;font-weight:900;
    color:var(--p);letter-spacing:-1px;
    line-height:1;
}

/* Squircle animated badges */
@keyframes bg-amber {0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes bg-purple{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

.hec-badge-row{display:flex;align-items:center;gap:8px}

.hec-streak{
    display:inline-flex;align-items:center;gap:5px;
    background:linear-gradient(120deg,#f59e0b,#f97316,#fbbf24,#f59e0b);
    background-size:300% 300%;
    animation:bg-amber 4s ease infinite;
    color:#fff;font-size:12px;font-weight:800;
    padding:6px 13px;border-radius:10px;
    box-shadow:0 3px 12px rgba(245,158,11,.35);
    white-space:nowrap;
}
.hec-xp{
    display:inline-flex;align-items:center;gap:5px;
    background:linear-gradient(120deg,#7c6ce6,#5b4fcf,#a78bfa,#7c6ce6);
    background-size:300% 300%;
    animation:bg-purple 4s ease infinite;
    color:#fff;font-size:12px;font-weight:800;
    padding:6px 13px;border-radius:10px;
    box-shadow:0 3px 12px rgba(91,79,207,.35);
    white-space:nowrap;
}

/* ═══════════════════════ BOTTOM NAV ═══ */
.hec-bottom-nav{
    position:fixed;bottom:0;left:50%;transform:translateX(-50%);
    width:100%;max-width:480px;
    background:var(--sf);
    border-top:1px solid var(--bd);
    display:flex;
    z-index:200;
    box-shadow:0 -4px 20px rgba(91,79,207,.08);
}
.hec-tab{
    flex:1;background:none;border:none;
    padding:10px 4px 12px;
    font-size:10px;font-weight:700;
    color:var(--mt);
    cursor:pointer;
    display:flex;flex-direction:column;align-items:center;gap:3px;
    transition:color .2s;
    -webkit-tap-highlight-color:transparent;
    text-transform:uppercase;letter-spacing:.3px;
}
.hec-tab-icon{font-size:20px;line-height:1}
.hec-tab:hover  {color:var(--p)}
.hec-tab.active {color:var(--p)}
.hec-tab.active .hec-tab-icon{
    position:relative;
}
.hec-tab.active .hec-tab-icon::after{
    content:'';
    position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);
    width:4px;height:4px;border-radius:50%;background:var(--p);
}

/* ═══════════════════════ SCREENS ═══ */
.hec-screen{display:none;padding:20px 18px 24px;flex:1}
.hec-screen.active{display:block}
.hec-screen[data-screen="flash"]{
    display:none;flex-direction:column;
    padding:0;
    height:calc(100vh - 140px);
    min-height:400px;overflow:hidden;
}
.hec-screen[data-screen="flash"].active{display:flex}

/* ═══════════════════════ HOME ═══ */
.hec-hello{font-size:22px;font-weight:800;color:var(--tx);margin-bottom:2px;letter-spacing:-.3px}
.hec-hello-sub{font-size:13px;color:var(--mt);margin-bottom:22px}
.hec-hello-sub strong{color:var(--p)}
.hec-section{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--mt);margin-bottom:10px}

/* Progress cards — solid color, brightness pulse cycles through each card */
.hec-stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:24px}
.hec-stat{
    border-radius:14px;padding:12px 6px 10px;
    text-align:center;cursor:default;
    box-shadow:var(--shm);
    transition:filter .5s ease;
    filter:brightness(1);
}
.hec-stat:nth-child(1){ background:#5b4fcf; }
.hec-stat:nth-child(2){ background:#059669; }
.hec-stat:nth-child(3){ background:#f59e0b; }
.hec-stat:nth-child(4){ background:#8b5cf6; }
.hec-stat-icon{margin-bottom:6px;display:flex;justify-content:center}
.hec-stat-val{font-size:18px;font-weight:900;line-height:1;color:#fff}
.hec-stat-lbl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;color:rgba(255,255,255,.75);margin-top:4px;line-height:1.2}

/* Daily progress bar inside card */
.hec-stat-bar{background:rgba(255,255,255,.25);height:3px;border-radius:3px;overflow:hidden;margin-top:6px;margin-left:4px;margin-right:4px}
.hec-daily-fill{background:#fff;height:100%;border-radius:3px;transition:width .4s;width:0%}

/* Category cards */
.hec-cat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hec-cat-card{
    border-radius:18px;padding:16px 14px;cursor:pointer;
    transition:transform .15s,box-shadow .15s;
    box-shadow:var(--sh);
    -webkit-tap-highlight-color:transparent;
}
.hec-cat-card:active{transform:scale(.97)}
.hec-cat-card:hover {transform:translateY(-2px);box-shadow:var(--shm)}
.hec-cat-icon{width:40px;height:40px;border-radius:11px;margin-bottom:10px;display:flex;align-items:center;justify-content:center}
.hec-cat-name{font-size:13px;font-weight:800;color:#1a1a2e;margin-bottom:2px;line-height:1.3}
.hec-cat-count{font-size:11px;color:#555;font-weight:500}

/* ═══════════════════════ CATEGORY PICKER ═══ */
.hec-cat-picker-wrap{position:relative;display:inline-block}
.hec-cat-picker-btn{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:12px;padding:9px 16px;
    font-size:15px;font-weight:800;color:var(--p);
    cursor:pointer;transition:all .15s;
    box-shadow:var(--sh);
    -webkit-tap-highlight-color:transparent;
}
.hec-cat-picker-btn:hover{background:#f5f3ff;border-color:#c4b8f5}
.hec-picker-arrow{font-size:9px;opacity:.5;transition:transform .2s;margin-left:2px}
.hec-cat-picker-btn.open .hec-picker-arrow{transform:rotate(180deg)}

.hec-cat-dropdown{
    position:absolute;top:calc(100% + 8px);left:0;
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:18px;box-shadow:0 16px 48px rgba(91,79,207,.18);
    min-width:240px;z-index:400;overflow:hidden;display:none;
}
.hec-cat-dropdown.open{display:block;animation:drop-in .18s ease}
@keyframes drop-in{from{opacity:0;transform:translateY(-8px) scale(.97)}to{opacity:1;transform:none}}
.hec-cat-dropdown-item{
    display:flex;align-items:center;gap:10px;
    padding:11px 16px;cursor:pointer;
    font-size:13px;font-weight:600;color:var(--tx);
    transition:background .1s;-webkit-tap-highlight-color:transparent;
}
.hec-cat-dropdown-item:hover {background:#f8f7ff}
.hec-cat-dropdown-item.active{background:#f5f3ff;color:var(--p);font-weight:800}
.hec-cat-dropdown-item.active::after{content:'✓';margin-left:auto;color:var(--p)}
.hec-cat-dropdown-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}

/* Screen header (learn/flash/quiz) */
.hec-screen-header{display:flex;align-items:center;gap:10px;padding:16px 18px 10px}
.hec-screen-header .hec-cat-picker-btn{flex:1;border-radius:14px;font-size:16px;padding:10px 16px}

/* ═══════════════════════ LEARN ═══ */
.hec-intro{
    background:#fffbeb;border-left:3px solid #f59e0b;
    padding:10px 14px;border-radius:0 10px 10px 0;
    font-size:13px;margin:0 18px 14px;line-height:1.5;color:#92400e;
}
.hec-learn-cards{padding:0 18px;display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
.hec-cta-wrap{text-align:center;padding:16px 18px 16px}

/* Accordion */
.hec-accord{
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:14px;overflow:hidden;box-shadow:var(--sh);
    transition:box-shadow .2s,border-color .2s;
}
.hec-accord.open{box-shadow:var(--shm);border-color:#c4b8f5}
.hec-accord-head{
    display:flex;align-items:center;gap:10px;
    padding:13px 16px;cursor:pointer;
    -webkit-tap-highlight-color:transparent;
}
.hec-accord-dot{width:8px;height:8px;border-radius:50%;background:#ddd;flex-shrink:0;transition:background .2s}
.hec-accord.open .hec-accord-dot{background:var(--p)}
.hec-accord-term{font-size:15px;font-weight:700;flex:1;color:var(--tx)}
.hec-accord-arr{color:#ccc;font-size:10px;transition:transform .25s}
.hec-accord.open .hec-accord-arr{transform:rotate(180deg);color:var(--p)}
.hec-accord-body{display:none;padding:0 16px 14px;border-top:1px solid var(--bd)}
.hec-accord.open .hec-accord-body{display:block}

.hec-use-lbl{font-size:9px;text-transform:uppercase;letter-spacing:.6px;color:var(--p);font-weight:800;margin:10px 0 4px}
.hec-use{font-size:13px;line-height:1.6;margin-bottom:10px;color:var(--tx)}
.hec-example{
    background:#f5f3ff;border-radius:10px;
    padding:9px 12px;font-size:13px;font-style:italic;
    margin-bottom:8px;line-height:1.5;color:#3730a3;
    border-left:3px solid #c4b8f5;
}
.hec-example::before{content:'💬 ';font-style:normal}
.hec-tip{font-size:12px;color:var(--mt);line-height:1.5;margin-bottom:7px}
.hec-contrast{
    font-size:12px;color:var(--mt);background:#f8f7ff;
    padding:7px 10px;border-left:2px solid #e0dbf9;
    border-radius:0 8px 8px 0;margin-bottom:8px;line-height:1.5;
}
.hec-contrast::before{content:'↔ '}

/* ═══════════════════════ AUDIO ═══ */
.hec-audio-wrap{margin-top:8px}
.hec-speed-row{display:flex;align-items:center;gap:6px;margin-bottom:7px;flex-wrap:wrap}
.hec-speed-lbl{font-size:10px;color:var(--mt);font-weight:700;text-transform:uppercase;letter-spacing:.3px}
.hec-speed-pill{
    background:#f5f3ff;border:1px solid var(--bd);border-radius:10px;
    padding:4px 12px;font-size:11px;font-weight:700;
    cursor:pointer;color:var(--p);transition:all .15s;
    -webkit-tap-highlight-color:transparent;
}
.hec-speed-pill.active{background:var(--p);color:#fff;border-color:var(--p)}
.hec-audio-btns{display:flex;gap:7px;flex-wrap:wrap}
.hec-audio-btn{
    border:none;border-radius:10px;padding:7px 16px;
    font-size:12px;font-weight:700;cursor:pointer;
    transition:all .15s;-webkit-tap-highlight-color:transparent;
}
.hec-audio-btn:disabled{opacity:.5;cursor:default}
.hec-audio-google{background:#ede9fe;color:var(--p)}
.hec-audio-google:hover{background:#ddd6fe}
.hec-audio-os{background:#d1fae5;color:#065f46}
.hec-audio-os:hover{background:#a7f3d0}
.hec-flash-front .hec-speed-row,.hec-flash-back .hec-speed-row{display:none !important}
.hec-flash-front .hec-audio-btn{
    background:rgba(255,255,255,.22);border:1.5px solid rgba(255,255,255,.4);
    color:#fff;border-radius:10px;padding:8px 18px;font-size:13px;
}
.hec-flash-front .hec-audio-btn:hover{background:rgba(255,255,255,.32)}

/* ═══════════════════════ FLASHCARD ═══ */

/* ── FLASH HEADER ── */
.hec-flash-header{
    display:flex;align-items:center;gap:10px;
    padding:12px 18px 8px;flex-shrink:0;
}
.hec-flash-header .hec-cat-picker-btn{flex:1;font-size:15px;font-weight:800;padding:9px 16px;border-radius:14px}
.hec-flash-header .hec-flash-counter{font-size:12px;color:var(--mt);white-space:nowrap}
.hec-flash-header .hec-flash-shuffle{
    background:#f5f3ff;border:1px solid var(--bd);
    border-radius:8px;padding:7px 11px;font-size:13px;
    cursor:pointer;color:var(--p);flex-shrink:0;
    -webkit-tap-highlight-color:transparent;
}

/* ── FLASH CENTER (card + audio btn) ── */
.hec-flash-center{
    flex:1;              /* fills space between header and bottom */
    display:flex;
    flex-direction:column;
    justify-content:center;  /* vertically centers card+audio */
    align-items:stretch;
    padding:0 18px;
    gap:10px;
    min-height:0;
    overflow:hidden;
}

/* ── FLASH SCENE (just holds the card) ── */
.hec-flash-scene{
    perspective:1200px;
    flex-shrink:0;
}
.hec-flash-card{
    width:100%;
    height:320px;
    position:relative;transform-style:preserve-3d;
    transition:transform .55s cubic-bezier(.4,0,.2,1);cursor:pointer;
}
.hec-flash-card.flipped{transform:rotateY(180deg)}
.hec-flash-front,.hec-flash-back{
    position:absolute;inset:0;
    backface-visibility:hidden;-webkit-backface-visibility:hidden;
    border-radius:22px;padding:22px 20px 18px;
    display:flex;flex-direction:column;box-sizing:border-box;
}
.hec-flash-front{
    background:linear-gradient(140deg,var(--p),var(--p2),#9b59f5);
    color:#fff;text-align:center;align-items:center;
    justify-content:space-between;
    box-shadow:0 8px 32px rgba(91,79,207,.3);
    transform:rotateY(0deg) translateZ(1px); /* GPU layer isolation */
    will-change:transform;
}
.hec-flash-cat{font-size:10px;text-transform:uppercase;letter-spacing:1.2px;opacity:.7}
.hec-flash-term{
    font-size:32px;font-weight:900;line-height:1.2;letter-spacing:-.5px;
    flex:1;display:flex;align-items:center;justify-content:center; /* vertically centered */
}
.hec-flash-hint{font-size:12px;opacity:.6}
.hec-flash-back{
    background:var(--sf);border:1.5px solid var(--bd);
    transform:rotateY(180deg) translateZ(1px);
    justify-content:center;
    gap:5px;
    box-shadow:var(--shm);overflow:hidden;
    will-change:transform;
}
.hec-flash-back .hec-use-lbl{margin-top:0}
.hec-flash-back .hec-use-lbl{margin:0 0 4px;font-size:9px}
.hec-flash-back .hec-use{font-size:12px;line-height:1.4;font-weight:600;margin-bottom:5px;padding:7px 10px}
.hec-flash-back .hec-example{font-size:12px;padding:7px 10px;margin-bottom:5px;border-width:1px;line-height:1.45}
.hec-flash-back .hec-tip{font-size:11px;margin-bottom:4px;padding:6px 9px;border-width:1px;line-height:1.4}
.hec-flash-back .hec-contrast{font-size:11px;margin-bottom:0;padding:6px 9px;border-width:1px;line-height:1.4}

.hec-flash-bottom{flex-shrink:0;padding:10px 18px 12px;background:var(--bg)}

/* Audio button below card */
.hec-flash-audio-btn{
    display:flex;align-items:center;justify-content:center;gap:8px;
    width:100%;
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:14px;padding:13px;
    font-size:14px;font-weight:700;color:var(--p);
    cursor:pointer;transition:all .15s;
    box-shadow:var(--sh);
    -webkit-tap-highlight-color:transparent;
}
.hec-flash-audio-btn:hover{background:#f5f3ff;border-color:#c4b8f5}
.hec-flash-audio-btn:active{transform:scale(.98)}
.hec-flash-audio-btn svg{flex-shrink:0}
/* When showing example (flipped state) */
.hec-flash-audio-btn.example-mode{
    background:linear-gradient(135deg,#f5f3ff,#ede9fe);
    border-color:#c4b8f5;color:#4338ca;
}
.hec-flash-nav{display:flex;gap:8px;align-items:center;justify-content:center;margin-bottom:8px}
.hec-flash-nav button{
    flex:1;
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:14px;padding:13px 10px;
    cursor:pointer;color:var(--tx);box-shadow:var(--sh);
    -webkit-tap-highlight-color:transparent;
    display:flex;align-items:center;justify-content:center;
}
.hec-flash-nav button:disabled{opacity:.3;cursor:default}
.hec-flash-nav button svg{width:22px;height:22px;flex-shrink:0}
.hec-flash-flip{
    background:linear-gradient(135deg,var(--p),var(--p2)) !important;
    color:#fff !important;border:none !important;
    box-shadow:0 4px 14px rgba(91,79,207,.3) !important;
}
.hec-flash-flip svg{stroke:#fff}
.hec-flash-prog{background:#e5e7eb;height:4px;border-radius:4px;overflow:hidden}
.hec-flash-prog-fill{background:linear-gradient(90deg,var(--p),var(--p2));height:100%;border-radius:4px;transition:width .4s}

/* ═══════════════════════ QUIZ ═══ */
.hec-quiz-header{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.hec-quiz-prog-wrap{flex:1;background:#e5e7eb;height:8px;border-radius:8px;overflow:hidden}
.hec-quiz-prog-fill{background:linear-gradient(90deg,var(--p),var(--p2));height:100%;border-radius:8px;transition:width .4s}
.hec-lives{display:flex;gap:3px}
.hec-heart{font-size:16px;transition:opacity .3s}
.hec-heart.lost{opacity:.2}

/* Quiz config */
.hec-quiz-config-panel{
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:22px;padding:28px 22px;box-shadow:var(--shm);
}
.hec-quiz-title{font-size:24px;font-weight:900;color:var(--tx);margin-bottom:24px;letter-spacing:-.5px}
.hec-quiz-row{display:flex;flex-direction:column;gap:8px;margin-bottom:22px}
.hec-quiz-row-lbl{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--mt)}
.hec-count-pills{display:flex;gap:8px}
.hec-count-pill{
    flex:1;height:44px;
    border:1.5px solid var(--bd);border-radius:12px;
    background:var(--sf);font-size:15px;font-weight:800;
    color:var(--mt);cursor:pointer;transition:all .15s;
    -webkit-tap-highlight-color:transparent;
}
.hec-count-pill:hover {border-color:var(--p);color:var(--p);background:#f5f3ff}
.hec-count-pill.active{border-color:var(--p);color:var(--p);background:#f5f3ff}

/* Question card */
.hec-q-card{
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:18px;padding:20px 18px;margin-bottom:12px;box-shadow:var(--sh);
}
.hec-q-type{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--p);margin-bottom:10px}
.hec-q-text{font-size:17px;font-weight:700;line-height:1.5;color:var(--tx)}
.hec-blank{background:#f0edff;padding:2px 10px;border-radius:6px;border-bottom:2px solid var(--p);font-weight:900}

/* Options */
.hec-options{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.hec-opt{
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:14px;padding:14px 16px;
    font-size:14px;font-weight:600;cursor:pointer;
    display:flex;align-items:center;gap:10px;
    width:100%;text-align:left;transition:all .15s;
    color:var(--tx);box-shadow:var(--sh);
    -webkit-tap-highlight-color:transparent;
}
/* Selected (before verify) */
.hec-opt.selected{border-color:var(--p);background:#f5f3ff;color:var(--p)}
/* After verify */
.hec-opt.correct{border-color:var(--ok);background:#d1fae5;color:#065f46;font-weight:700}
.hec-opt.wrong  {border-color:var(--er);background:#fee2e2;color:#991b1b}
.hec-opt:disabled{cursor:default}
.hec-opt:hover:not(:disabled):not(.selected):not(.correct):not(.wrong){border-color:var(--p);background:#f8f7ff}

.hec-opt-letter{
    width:30px;height:30px;border-radius:9px;
    background:#f5f3ff;font-size:12px;font-weight:900;
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;color:var(--p);transition:all .15s;
}
.hec-opt.selected .hec-opt-letter{background:var(--p);color:#fff}
.hec-opt.correct .hec-opt-letter{background:var(--ok);color:#fff}
.hec-opt.wrong   .hec-opt-letter{background:var(--er);color:#fff}

/* Feedback */
.hec-feedback{border-radius:14px;padding:13px 16px;font-size:13px;line-height:1.6;margin-bottom:12px}
.hec-feedback.ok  {background:#d1fae5;border-left:4px solid var(--ok);color:#064e3b}
.hec-feedback.fail{background:#fee2e2;border-left:4px solid var(--er);color:#7f1d1d}

/* Buttons */
.hec-check-btn{
    width:100%;background:#e5e7eb;color:#9ca3af;
    border:none;border-radius:14px;padding:16px;
    font-size:16px;font-weight:800;cursor:default;
    transition:all .2s;letter-spacing:-.2px;
}
.hec-check-btn.ready{
    background:linear-gradient(135deg,var(--p),var(--p2));
    color:#fff;cursor:pointer;
    box-shadow:0 4px 16px rgba(91,79,207,.3);
}
.hec-check-btn.ready:active{transform:scale(.98)}
.hec-check-btn.next{
    background:linear-gradient(135deg,var(--ok),#10b981);
    color:#fff;cursor:pointer;
    box-shadow:0 4px 16px rgba(5,150,105,.25);
}

/* Results */
.hec-result-wrap{background:var(--sf);border:1.5px solid var(--bd);border-radius:22px;padding:24px 18px;box-shadow:var(--shm)}
.hec-result-top{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:20px}
.hec-score-ring{
    width:96px;height:96px;border-radius:50%;
    border:7px solid var(--p);display:flex;align-items:center;justify-content:center;
    margin-bottom:12px;box-shadow:0 0 0 6px rgba(91,79,207,.1);
}
.hec-score-pct{font-size:26px;font-weight:900;color:var(--p)}
.hec-result-msg{font-size:19px;font-weight:900;margin-bottom:4px;letter-spacing:-.3px}
.hec-result-sub{font-size:13px;color:var(--mt)}
.hec-review{margin-bottom:20px}
.hec-review-item{border-radius:12px;padding:11px 14px;margin-bottom:8px;font-size:13px;line-height:1.55}
.hec-review-item.ok  {background:#d1fae5;border-left:4px solid var(--ok)}
.hec-review-item.fail{background:#fee2e2;border-left:4px solid var(--er)}
.hec-review-q  {font-weight:700;margin-bottom:4px}
.hec-review-ans{font-size:12px;margin:3px 0}
.hec-review-exp{font-size:12px;color:#555;margin-top:3px}
.hec-ans-wrong {color:var(--er);font-weight:700}
.hec-ans-right {color:var(--ok);font-weight:700}
.hec-result-actions{display:flex;flex-direction:column;gap:8px}

/* Login */
.hec-login-notice{background:#fef3c7;border-left:4px solid #f59e0b;padding:14px 18px;border-radius:12px;font-size:14px;color:#92400e}

@media(min-width:600px){
    .hec-app{margin-top:0;padding-bottom:70px}
    .hec-result-actions{flex-direction:row}
    .hec-result-top{flex-direction:row;text-align:left;gap:20px}
}
/* ═══════════════════════ AVATAR DROPDOWN ═══ */
.hec-avatar-wrap{position:relative;margin-left:auto}
.hec-avatar{
    width:38px;height:38px;border-radius:50%;
    background:linear-gradient(135deg,var(--p),var(--p2));
    color:#fff;font-size:15px;font-weight:900;
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;user-select:none;
    box-shadow:0 3px 12px rgba(91,79,207,.35);
    transition:transform .15s;
    -webkit-tap-highlight-color:transparent;
}
.hec-avatar:hover{transform:scale(1.06)}
.hec-avatar-dropdown{
    position:absolute;top:calc(100% + 10px);right:0;
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:18px;box-shadow:0 16px 48px rgba(91,79,207,.18);
    min-width:260px;z-index:500;overflow:hidden;
    display:none;
}
.hec-avatar-dropdown.open{display:block;animation:drop-in .18s ease}
.hec-avatar-name{
    padding:14px 16px 10px;font-size:13px;font-weight:700;
    color:var(--p);
}
.hec-avatar-sep{height:1px;background:var(--bd);margin:0}
.hec-avatar-item{white-space:nowrap;
    display:flex;align-items:center;gap:10px;
    padding:11px 16px;font-size:13px;font-weight:600;
    color:var(--tx);cursor:pointer;text-decoration:none;
    transition:background .1s;-webkit-tap-highlight-color:transparent;
}
.hec-avatar-item:hover{background:#f8f7ff}
.hec-avatar-disabled{color:var(--mt);cursor:default}
.hec-avatar-disabled:hover{background:none}
.hec-avatar-logout{color:var(--er)}
.hec-avatar-logout:hover{background:#fef2f2}
.hec-soon{
    margin-left:auto;font-size:10px;font-weight:700;
    background:#f0f0f0;color:#999;
    padding:2px 7px;border-radius:8px;
}

/* ═══════════════════════ STAT CARD FLOWING GRADIENT ═══ */

/* Active card pulses brightness at 0.5s interval via keyframe */
@keyframes card-pulse {
    0%,100% { opacity: 1;    }
    50%     { opacity: .75;  }
}
.hec-stat.hec-stat-pulse {
    animation: card-pulse 1.8s ease-in-out infinite;
}

/* ═══════════════════════ LEARN CARD CONTENT ═══ */
.hec-accord-body{padding:0 16px 16px}
.hec-use-lbl{
    font-size:9px;text-transform:uppercase;letter-spacing:.7px;
    color:var(--p);font-weight:800;
    margin:14px 0 5px;display:flex;align-items:center;gap:5px;
}
.hec-use-lbl::before{
    content:'';display:inline-block;
    width:12px;height:2px;background:var(--p);border-radius:2px;
}
.hec-use{
    font-size:14px;line-height:1.65;
    margin-bottom:12px;color:var(--tx);
    padding:10px 12px;
    background:#f8f7ff;
    border:1.5px solid #ddd9f8;
    border-radius:10px;
}
.hec-example{
    background:#f5f3ff;
    border:1.5px solid #c4b8f5;
    border-radius:10px;
    padding:11px 14px;
    font-size:13px;font-style:italic;
    margin-bottom:14px;  /* more space before Ouvir */
    line-height:1.6;
    color:#3730a3;
}
.hec-example::before{content:'💬  ';font-style:normal;font-size:14px}
.hec-tip{
    font-size:12px;color:#78350f;line-height:1.55;
    margin-top:4px;margin-bottom:8px;padding:8px 10px;
    background:#fef3c7;
    border:1.5px solid #fcd34d;
    border-radius:8px;
}
.hec-contrast{
    font-size:12px;color:#374151;
    background:#f8f7ff;padding:8px 12px;
    border:1.5px solid #ddd9f8;
    border-radius:8px;
    margin-bottom:8px;line-height:1.6;
}
.hec-contrast::before{content:'↔  '}

/* ═══════════════════════ AUDIO MODAL ═══ */
.hec-audio-modal-overlay{
    position:fixed;inset:0;
    background:rgba(0,0,0,.45);
    z-index:600;
    display:none;
    align-items:flex-end;
    justify-content:center;
    -webkit-tap-highlight-color:transparent;
    pointer-events:none; /* NEVER intercepts clicks — document handler manages close */
}
.hec-audio-modal{
    cursor:default;
    pointer-events:auto; /* sheet is always interactive */
}
.hec-audio-modal-overlay.open{display:flex;animation:overlay-in .2s ease}
@keyframes overlay-in{from{opacity:0}to{opacity:1}}

.hec-audio-modal{
    background:var(--sf);
    border-radius:24px 24px 0 0;
    padding:20px 20px 32px;
    width:100%;max-width:480px;
    box-shadow:0 -8px 40px rgba(0,0,0,.15);
    animation:sheet-in .25s cubic-bezier(.4,0,.2,1);
}
@keyframes sheet-in{from{transform:translateY(100%)}to{transform:translateY(0)}}

.hec-audio-modal-handle{
    width:36px;height:4px;background:#e5e7eb;
    border-radius:4px;margin:0 auto 16px;
}
.hec-audio-modal-text{
    font-size:13px;color:var(--mt);font-weight:600;
    margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px;
}
.hec-audio-modal-phrase{
    font-size:18px;font-weight:800;color:var(--tx);
    margin-bottom:18px;line-height:1.3;letter-spacing:-.3px;
}
.hec-audio-modal-speed{
    display:flex;align-items:center;gap:8px;margin-bottom:14px;flex-wrap:wrap;
}
.hec-audio-modal-btns{display:flex;gap:10px}
.hec-audio-modal-btn{
    flex:1;border:none;border-radius:14px;padding:14px;
    font-size:15px;font-weight:800;cursor:pointer;
    transition:transform .1s;-webkit-tap-highlight-color:transparent;
}
.hec-audio-modal-btn.google{
    background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;
    box-shadow:0 4px 14px rgba(91,79,207,.3);
}
.hec-audio-modal-btn.os{
    background:linear-gradient(135deg,var(--ok),#10b981);color:#fff;
    box-shadow:0 4px 14px rgba(5,150,105,.25);
}
.hec-audio-modal-btn:active{transform:scale(.97)}

/* Universal audio trigger button */
.hec-audio-trigger{
    display:inline-flex;align-items:center;gap:6px;
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:10px;padding:6px 14px;
    font-size:12px;font-weight:700;color:var(--p);
    cursor:pointer;transition:all .15s;
    box-shadow:var(--sh);-webkit-tap-highlight-color:transparent;
    margin-top:10px;margin-bottom:12px;
}
.hec-audio-trigger:hover{background:#f5f3ff;border-color:#c4b8f5}
.hec-audio-trigger svg{width:14px;height:14px;flex-shrink:0}
/* ── GAME OVER ── */
.hec-gameover{
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:22px;padding:32px 24px;
    text-align:center;box-shadow:var(--shm);
    display:none;
}
.hec-gameover.show{display:block}
.hec-gameover-emoji{font-size:56px;margin-bottom:12px;line-height:1}
.hec-gameover-title{font-size:24px;font-weight:900;color:var(--tx);margin-bottom:6px;letter-spacing:-.5px}
.hec-gameover-sub{font-size:14px;color:var(--mt);margin-bottom:24px;line-height:1.5}
.hec-gameover-score{
    background:#f5f3ff;border:1.5px solid var(--bd);
    border-radius:14px;padding:14px;margin-bottom:22px;
    font-size:15px;font-weight:700;color:var(--p);
}
/* Flash card audio wraps — hidden (audio handled by modal from bottom bar) */
.hec-flash-front .hec-audio-wrap,
.hec-flash-back  .hec-audio-wrap { display: none !important; }
/* Quiz: picker full width, pills full width */
.hec-quiz-row .hec-cat-picker-wrap { width: 100%; }
.hec-quiz-row .hec-cat-picker-btn  { width: 100%; justify-content: space-between; font-size:15px; padding: 11px 16px; }
.hec-quiz-row .hec-count-pills     { width: 100%; }
.hec-quiz-row .hec-count-pill      { flex: 1; }

/* Quiz screen: vertically centered config panel */
.hec-screen[data-screen="quiz"] {
    display: none;
    align-items: stretch;
    justify-content: center;
    min-height: calc(100vh - 135px);
}
.hec-screen[data-screen="quiz"].active { display: flex; flex-direction: column; justify-content: center; }
.hec-screen[data-screen="interview"]{
    padding:0 !important;
    overflow:hidden;
    /* Fill viewport minus topbar (~52px) and bottom nav (~60px) */
    height:calc(100vh - 122px);
    max-height:calc(100vh - 122px);
}
.hec-screen[data-screen="interview"].active{
    display:flex;
    flex-direction:column;
}
.hec-int-setup{
    flex:1;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
}
.hec-int-chat{
    flex:1;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    height:100%;
}
.hec-quiz-active, .hec-result-wrap, .hec-gameover { width: 100%; }
/* Audio button inside quiz feedback */
.hec-feedback-audio-btn{
    display:inline-flex;align-items:center;gap:6px;
    margin-top:10px;
    background:rgba(0,0,0,.07);
    border:none;border-radius:10px;
    padding:7px 14px;font-size:13px;font-weight:700;
    cursor:pointer;color:inherit;
    -webkit-tap-highlight-color:transparent;
    transition:background .15s;
}
.hec-feedback-audio-btn:hover{background:rgba(0,0,0,.13)}
/* Tense badge — discrete, below example */
.hec-tense-badge{
    display:inline-block;
    font-size:10px;font-weight:700;
    text-transform:uppercase;letter-spacing:.4px;
    color:#7c6ce6;
    background:#f0edff;
    border-radius:6px;
    padding:2px 8px;
    margin-bottom:8px;
    opacity:.85;
}
/* Second tense badge (past example) — slightly different styling */
.hec-tense-badge-alt{
    color:#059669;
    background:#d1fae5;
}
/* Present example — slightly lighter purple border */
.hec-example-present{ border-color:#c4b8f5; }
/* Past example — green tint border */
.hec-example-past{ border-color:#6ee7b7; }
/* ── Feedback improvements ── */
.hec-fb-header{
    font-size:15px;font-weight:700;
    margin-bottom:6px;
}
.hec-fb-exp{
    font-size:13px;line-height:1.5;
    opacity:.92;
}
.hec-mistake-badge{
    display:inline-block;
    margin-top:8px;
    font-size:11px;font-weight:700;
    background:rgba(0,0,0,.08);
    border-radius:8px;
    padding:3px 10px;
    opacity:.8;
}
/* ── Growing Faster button ── */
.hec-grow-btn{
    display:flex;align-items:center;gap:10px;
    width:100%;margin:12px 0 4px;
    background:linear-gradient(135deg,var(--p),#7c3aed);
    color:#fff;border:none;border-radius:16px;
    padding:14px 18px;cursor:pointer;
    text-align:left;
    box-shadow:0 4px 20px rgba(91,79,207,.35);
    transition:transform .15s,box-shadow .15s;
    -webkit-tap-highlight-color:transparent;
}
.hec-grow-btn:active{transform:scale(.98);box-shadow:0 2px 10px rgba(91,79,207,.2);}
.hec-grow-btn + .hec-section{ margin-top:20px; }
.hec-grow-btn svg{flex-shrink:0;opacity:.9;}
.hec-grow-btn span:first-of-type{font-size:16px;font-weight:800;letter-spacing:-.2px;}
.hec-grow-sub{
    display:block;font-size:11px;font-weight:500;
    opacity:.75;margin-top:1px;letter-spacing:.2px;
}

/* ── Growing Faster overlay ── */
.hec-grow-overlay{
    position:fixed;inset:0;z-index:500;
    background:var(--bg);
    display:none;flex-direction:column;
    overflow:hidden;
}
.hec-grow-overlay.open{display:flex;}
.hec-grow-header{
    display:flex;align-items:center;gap:12px;
    padding:16px 16px 12px;
    border-bottom:1px solid var(--bd);
}
.hec-grow-back{
    background:none;border:none;cursor:pointer;
    padding:4px;color:var(--p);
    display:flex;align-items:center;
}
.hec-grow-title{font-size:16px;font-weight:800;color:var(--p);}
.hec-grow-steps{
    display:flex;gap:0;
    margin-left:auto;
}
.hec-grow-step{
    display:flex;align-items:center;gap:4px;
    font-size:11px;font-weight:700;
    padding:4px 10px;border-radius:20px;
    color:#aaa;background:transparent;
    transition:all .2s;
}
.hec-grow-step.active{color:var(--p);background:rgba(91,79,207,.1);}
.hec-grow-step.done{color:#059669;background:#d1fae5;}
.hec-grow-step-dot{
    width:6px;height:6px;border-radius:50%;
    background:currentColor;opacity:.5;
}
.hec-grow-body{flex:1;overflow:auto;}
.hec-grow-footer{
    padding:12px 16px 20px;
    border-top:1px solid var(--bd);
    background:var(--sf);
}
.hec-grow-next-btn{
    width:100%;padding:14px;
    background:var(--p);color:#fff;
    border:none;border-radius:12px;
    font-size:15px;font-weight:700;cursor:pointer;
    transition:opacity .15s;
}
.hec-grow-next-btn:disabled{opacity:.4;cursor:not-allowed;}
/* ── Growing Faster accordion (isolated from main hec-accord) ── */
.hec-gf-card{
    background:var(--sf);border:1.5px solid var(--bd);
    border-radius:14px;margin-bottom:8px;overflow:hidden;
    transition:box-shadow .2s,border-color .2s;
}
.hec-gf-card.open{box-shadow:var(--shm);border-color:#c4b8f5}
.hec-gf-card-head{
    display:flex;align-items:center;gap:10px;
    padding:14px 16px;cursor:pointer;
    -webkit-tap-highlight-color:transparent;
}
.hec-gf-card-dot{width:8px;height:8px;border-radius:50%;background:#ddd;flex-shrink:0;transition:background .2s}
.hec-gf-card.open .hec-gf-card-dot{background:var(--p)}
.hec-gf-card-term{font-size:15px;font-weight:700;flex:1;color:var(--tx)}
.hec-gf-card-arr{color:#ccc;font-size:10px;transition:transform .25s}
.hec-gf-card.open .hec-gf-card-arr{transform:rotate(180deg);color:var(--p)}
.hec-gf-card-body{
    display:none;
    padding:0 16px 14px;
    border-top:1px solid var(--bd);
}
.hec-gf-card.open .hec-gf-card-body{display:block !important}

/* ══════════════════════════════════════════
   BOUNJARVIS INTERVIEW / TALK SCREEN
   ══════════════════════════════════════════ */

/* Setup screen */
.hec-int-setup{padding:16px 16px 24px;display:flex;flex-direction:column;gap:10px;overflow-y:auto}
.hec-int-avatar-wrap{display:flex;align-items:center;gap:12px;padding:12px 0}
.hec-int-avatar-circle{
    width:52px;height:52px;border-radius:50%;
    background:linear-gradient(135deg,var(--p),#7c3aed);
    color:#fff;font-size:15px;font-weight:900;
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;letter-spacing:.5px;
}
.hec-int-name{font-size:17px;font-weight:800;color:var(--tx)}
.hec-int-sub{font-size:12px;color:#888;margin-top:2px}
.hec-int-desc{font-size:13px;color:#666;line-height:1.5;margin:0}
.hec-int-topics{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 8px}
.hec-int-topic-btn{
    display:inline-flex;align-items:center;
    padding:9px 16px;border-radius:20px;
    border:1.5px solid var(--bd);background:var(--sf);
    font-size:13px;font-weight:600;color:var(--tx);cursor:pointer;
    transition:background .15s,border-color .15s,color .15s;
    -webkit-tap-highlight-color:transparent;
    white-space:nowrap;
}
.hec-int-topic-btn.active{background:var(--p);color:#fff;border-color:var(--p);}
.hec-int-topic-btn:active{opacity:.85;}
.hec-int-or{
    font-size:12px;color:#aaa;text-align:center;
    position:relative;margin:16px 0 8px;
    display:flex;align-items:center;gap:8px;
}
.hec-int-or::before,.hec-int-or::after{
    content:'';flex:1;height:1px;background:var(--bd);
}
.hec-int-field{
    width:100%;box-sizing:border-box;
    padding:11px 14px;border-radius:12px;
    border:1.5px solid var(--bd);background:var(--sf);
    font-size:14px;color:var(--tx);outline:none;
    transition:border-color .15s;margin-bottom:2px;
}
.hec-int-field:focus{border-color:var(--p)}

/* Chat screen */
.hec-int-chat{display:flex;flex-direction:column;overflow:hidden;position:relative}
.hec-int-topbar{
    display:flex;align-items:center;gap:10px;
    padding:8px 14px;border-bottom:1px solid var(--bd);
    background:var(--sf);flex-shrink:0;
}
.hec-int-back-btn{
    background:none;border:none;cursor:pointer;
    color:var(--p);padding:4px;display:flex;align-items:center;
}
.hec-int-topic-tag{
    flex:1;font-size:13px;font-weight:700;color:var(--p);
}
.hec-int-score-badge{
    display:flex;align-items:center;gap:4px;
    background:#fef3c7;border-radius:20px;
    padding:4px 10px;font-size:13px;font-weight:700;color:#92400e;
}
.hec-int-messages{
    flex:1;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    padding:12px 14px;
    display:flex;
    flex-direction:column;
    gap:10px;
    min-height:0; /* critical for flex children to scroll */
}

/* Message bubbles */
.hec-msg{display:flex;flex-direction:column;max-width:85%}
.hec-msg-bj{align-self:flex-start}
.hec-msg-user{align-self:flex-end;align-items:flex-end}
.hec-msg-bubble{
    padding:10px 14px;border-radius:16px;
    font-size:14px;line-height:1.5;
}
.hec-msg-bj .hec-msg-bubble{
    background:var(--sf);border:1.5px solid var(--bd);
    border-bottom-left-radius:4px;color:var(--tx);
}
.hec-msg-user .hec-msg-bubble{
    background:var(--p);color:#fff;
    border-bottom-right-radius:4px;
}
/* Correction box inside BJ message */
.hec-msg-correction{
    background:#fef3c7;border:1.5px solid #fcd34d;
    border-radius:10px;padding:8px 12px;
    margin-bottom:6px;font-size:13px;
    line-height:1.4;color:#92400e;
}
.hec-msg-correction-ex{
    margin-top:4px;font-weight:700;color:#065f46;
    font-size:13px;
}
.hec-msg-score{
    font-size:11px;color:#10b981;font-weight:700;
    margin-top:3px;align-self:flex-end;
}
.hec-msg-audio-btn{
    background:none;border:none;padding:4px 0;
    font-size:12px;color:#888;cursor:pointer;
    display:flex;align-items:center;gap:4px;margin-top:4px;
}

/* Typing indicator */
.hec-int-typing{
    padding:8px 14px;display:flex;align-items:center;gap:4px;
}
.hec-int-dot{
    width:7px;height:7px;border-radius:50%;
    background:var(--p);opacity:.4;
    animation:hec-dot-pulse 1.2s infinite;
}
.hec-int-dot:nth-child(2){animation-delay:.2s}
.hec-int-dot:nth-child(3){animation-delay:.4s}
@keyframes hec-dot-pulse{0%,100%{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.3)}}

/* Input bar — push-to-talk */
.hec-int-inputbar{
    padding:8px 16px 12px;border-top:1px solid var(--bd);
    background:var(--sf);flex-shrink:0;
    /* Always stick to bottom */
    position:sticky;bottom:0;
}
.hec-int-main-btns{
    display:flex;align-items:center;gap:12px;
}
/* Push-to-talk big button */
.hec-int-ptt-btn{
    flex:1;
    display:flex;flex-direction:column;align-items:center;gap:5px;
    padding:12px 12px;border-radius:16px;
    background:var(--p);color:#fff;border:none;cursor:pointer;
    font-size:13px;font-weight:700;letter-spacing:.2px;
    transition:background .15s,transform .1s,box-shadow .15s;
    box-shadow:0 4px 16px rgba(91,79,207,.3);
    -webkit-tap-highlight-color:transparent;
    user-select:none;-webkit-user-select:none;
}
.hec-int-ptt-btn:active,.hec-int-ptt-btn.listening{
    background:#ef4444;transform:scale(.97);
    box-shadow:0 2px 8px rgba(239,68,68,.4);
    animation:mic-pulse 1s infinite;
}
@keyframes mic-pulse{
    0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.4)}
    70%{box-shadow:0 0 0 10px rgba(239,68,68,0)}
}
/* Keyboard toggle button */
.hec-int-kbd-btn{
    width:52px;height:52px;border-radius:14px;flex-shrink:0;
    background:var(--sf);border:1.5px solid var(--bd);
    color:#888;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    transition:border-color .15s,color .15s;
    -webkit-tap-highlight-color:transparent;
}
.hec-int-kbd-btn.active{border-color:var(--p);color:var(--p);background:#f5f3ff}
/* Text input area (shown when keyboard active) */
.hec-int-text-wrap{
    display:flex;align-items:center;gap:8px;
    margin-top:10px;
}
.hec-int-text-wrap .hec-int-field{flex:1;padding:10px 14px;border-radius:24px}
.hec-int-send-btn{
    width:44px;height:44px;border-radius:50%;flex-shrink:0;
    background:var(--p);color:#fff;border:none;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    -webkit-tap-highlight-color:transparent;
}
.hec-int-send-btn:disabled{opacity:.4;cursor:not-allowed}

/* ── BounJarvis audio loading waves ── */
.hec-int-audio-loader{
    display:none;
    align-items:center;gap:10px;
    padding:12px 16px;
    background:linear-gradient(135deg,rgba(91,79,207,.06),rgba(124,108,230,.06));
    border-top:1px solid var(--bd);
    flex-shrink:0;
}
.hec-int-audio-loader span{
    font-size:12px;color:var(--p);font-weight:600;
    opacity:.8;
}
.hec-wave-bar{
    width:4px;border-radius:4px;
    background:var(--p);opacity:.7;
    animation:hec-wave 1s ease-in-out infinite;
}
.hec-wave-bar:nth-child(1){height:12px;animation-delay:.0s}
.hec-wave-bar:nth-child(2){height:20px;animation-delay:.1s}
.hec-wave-bar:nth-child(3){height:28px;animation-delay:.2s}
.hec-wave-bar:nth-child(4){height:20px;animation-delay:.3s}
.hec-wave-bar:nth-child(5){height:12px;animation-delay:.4s}
@keyframes hec-wave{
    0%,100%{transform:scaleY(.4);opacity:.4}
    50%{transform:scaleY(1);opacity:.9}
}

/* User message score badge */
.hec-msg-score-badge{
    display:flex;align-items:baseline;gap:2px;
    font-size:13px;margin-top:4px;
    justify-content:flex-end;
}
/* PTT button - listening state */
.hec-int-ptt-btn.listening{
    background:#ef4444;
    box-shadow:0 4px 16px rgba(239,68,68,.4);
}

/* ══ PRO GATE ══ */
.hec-pro-gate{
    display:flex;flex-direction:column;align-items:center;
    padding:24px 20px 32px;text-align:center;gap:14px;
}
.hec-pro-burst{
    position:relative;width:100px;height:100px;
    display:flex;align-items:center;justify-content:center;
    margin-bottom:4px;
}
.hec-burst-svg{
    width:100px;height:100px;
    animation:burst-spin 8s linear infinite;
    filter:drop-shadow(0 4px 16px rgba(91,79,207,.4));
}
@keyframes burst-spin{
    0%{transform:rotate(0deg) scale(1)}
    50%{transform:rotate(180deg) scale(1.05)}
    100%{transform:rotate(360deg) scale(1)}
}
.hec-burst-text{
    position:absolute;
    font-size:22px;font-weight:900;color:#fff;
    letter-spacing:.5px;
}
.hec-pro-title{
    font-size:22px;font-weight:800;color:var(--tx);
    margin:0;
}
.hec-pro-desc{
    font-size:14px;color:#666;line-height:1.5;margin:0;max-width:280px;
}
.hec-pro-perks{
    list-style:none;padding:0;margin:4px 0;
    display:flex;flex-direction:column;gap:8px;
    text-align:left;width:100%;max-width:280px;
}
.hec-pro-perks li{
    font-size:13px;font-weight:600;color:var(--tx);
    display:flex;align-items:center;gap:8px;
}
.hec-pro-perks li::before{content:none}
.hec-pro-cta-btn{
    display:block;width:100%;max-width:280px;
    padding:16px;border-radius:14px;
    background:linear-gradient(135deg,var(--p),#7c3aed);
    color:#fff;font-size:16px;font-weight:800;
    text-decoration:none;text-align:center;
    box-shadow:0 4px 20px rgba(91,79,207,.35);
    transition:transform .15s,box-shadow .15s;
}
.hec-pro-cta-btn:active{transform:scale(.98);}
.hec-pro-note{font-size:11px;color:#aaa;margin:0;}

/* BJ loading bubble */
.hec-bj-loading-bubble{
    display:flex;align-items:center;gap:5px;
    padding:12px 16px;min-width:60px;
}
.hec-bj-loading-bubble .hec-int-dot{
    width:8px;height:8px;
}