:root{--bg: #0a0718;--bg-elevated: #140f2e;--bg-input: #0e0a20;--border: rgba(255, 94, 138, .28);--border-blue: rgba(91, 109, 255, .32);--neon-pink: #ff5e8a;--neon-pink-bright: #ff9ec4;--neon-blue: #5b6dff;--neon-indigo: #4634e0;--neon-purple: #a855f7;--glow-pink: rgba(255, 94, 138, .55);--glow-blue: rgba(91, 109, 255, .5);--text: #f2edff;--text-muted: #a9a2c9;--danger: #ff4d6d;--amber: #ffb34d;--radius: 18px;--shadow: 0 24px 70px rgba(0, 0, 0, .6);--font-ui: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display: "Playfair Display", Georgia, "Times New Roman", serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-ui);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased;background:radial-gradient(1000px 520px at 15% -10%,rgba(255,94,138,.2),transparent 60%),radial-gradient(1000px 560px at 85% 0%,rgba(91,109,255,.22),transparent 60%),radial-gradient(900px 600px at 50% 115%,rgba(168,85,247,.2),transparent 60%),linear-gradient(135deg,#0a0718,#120a2a 45%,#0a0718);background-size:200% 200%,200% 200%,200% 200%,100% 100%;background-attachment:fixed;animation:auroraShift 18s ease-in-out infinite}@keyframes auroraShift{0%,to{background-position:0% 0%,100% 0%,50% 100%,0 0}50%{background-position:100% 50%,0% 60%,40% 0%,0 0}}#root{min-height:100vh;display:flex;flex-direction:column}.app-shell{flex:1;display:flex;flex-direction:column;align-items:center;padding:28px 16px 48px}.app-header{display:flex;align-items:center;gap:16px;margin:10px 0 32px}.logo-frame{border-radius:16px;padding:4px;background:linear-gradient(135deg,var(--neon-pink),var(--neon-blue));box-shadow:0 0 22px var(--glow-pink),0 0 34px var(--glow-blue);display:inline-flex}.logo-frame img{display:block;border-radius:12px;object-fit:cover}.logo-frame.sm img{width:58px;height:58px}.logo-frame.lg img{width:120px;height:120px}.brand-name{font-size:1.7rem;font-weight:800;letter-spacing:.3px;line-height:1.1}.brand-name .ai{color:#fff;text-shadow:0 0 10px var(--glow-blue)}.brand-name .dude{background:linear-gradient(90deg,var(--neon-pink),var(--neon-pink-bright));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 10px var(--glow-pink))}.brand-tag{display:block;font-size:.72rem;font-weight:600;color:var(--text-muted);letter-spacing:3px;text-transform:uppercase;margin-top:3px}.card{width:100%;max-width:660px;background:linear-gradient(180deg,#181034e6,#0c081af0);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow),0 0 40px #ff5e8a1f,0 0 60px #5b6dff1a;padding:36px;position:relative;overflow:hidden;animation:rise .35s ease both}.card:before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:linear-gradient(90deg,transparent,var(--neon-pink),var(--neon-blue),transparent);box-shadow:0 0 14px var(--glow-pink)}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.card-logo{display:flex;justify-content:center;margin-bottom:18px}.card h1{margin:0 0 8px;font-size:1.7rem;text-align:center}.neon-text{background:linear-gradient(90deg,var(--neon-pink-bright),var(--neon-blue));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 12px var(--glow-pink))}.card .subtitle{margin:0 0 26px;color:var(--text-muted);font-size:.96rem;line-height:1.6;text-align:center}.card .subtitle strong,.muted-note strong{color:var(--neon-pink-bright)}.field{margin-bottom:20px}.field label{display:block;font-size:.85rem;font-weight:600;margin-bottom:8px;color:var(--text)}.field input{width:100%;padding:14px 16px;background:var(--bg-input);border:1px solid var(--border-blue);border-radius:12px;color:var(--text);font-size:1rem;font-family:var(--font-ui);outline:none;transition:border-color .15s,box-shadow .15s}.field input::placeholder{color:#746e97}.select-input{width:100%;padding:14px 16px;background:var(--bg-input);border:1px solid var(--border-blue);border-radius:12px;color:var(--text);font-size:1rem;font-family:var(--font-ui);outline:none;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--neon-pink) 50%),linear-gradient(135deg,var(--neon-pink) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px,6px 6px;background-repeat:no-repeat;transition:border-color .15s,box-shadow .15s}.select-input:focus{border-color:var(--neon-pink);box-shadow:0 0 0 3px #ff5e8a38,0 0 18px var(--glow-pink)}.select-input option{background:var(--bg-elevated);color:var(--text)}.step-indicator{display:flex;align-items:center;gap:8px;margin:0 0 24px}.step-dot{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:.85rem;font-weight:700;color:var(--text-muted);background:var(--bg-input);border:1.5px solid var(--border-blue);flex-shrink:0}.step-dot.active{color:#fff;border-color:var(--neon-pink);background:linear-gradient(135deg,var(--neon-pink),var(--neon-indigo));box-shadow:0 0 14px var(--glow-pink)}.step-dot.done{color:#fff;border-color:var(--neon-blue);background:#5b6dff66}.step-line{width:34px;height:2px;background:var(--border-blue)}.step-text{margin-left:auto;font-size:.78rem;color:var(--text-muted);letter-spacing:1px;text-transform:uppercase}.star-rating{display:flex;align-items:center;gap:6px;padding:6px 0}.star-btn{background:none;border:none;padding:2px;cursor:pointer;line-height:0;color:#3a3358;transition:color .15s,transform .1s,filter .15s}.star-btn svg{fill:currentColor}.star-btn:hover{transform:scale(1.12)}.star-btn.on{color:var(--neon-pink);filter:drop-shadow(0 0 8px var(--glow-pink))}.star-count{margin-left:10px;font-weight:700;color:var(--neon-pink-bright);font-variant-numeric:tabular-nums}.field input:focus{border-color:var(--neon-pink);box-shadow:0 0 0 3px #ff5e8a38,0 0 18px var(--glow-pink)}.field .error{color:var(--danger);font-size:.8rem;margin-top:6px}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;font-size:1rem;font-weight:600;font-family:var(--font-ui);padding:14px 26px;border-radius:12px;transition:transform .06s,box-shadow .2s,filter .2s,background .2s,border-color .2s,color .2s}.btn:active{transform:translateY(1px)}.btn-primary{background:linear-gradient(135deg,var(--neon-pink),var(--neon-indigo));color:#fff;width:100%;box-shadow:0 10px 26px var(--glow-pink),0 0 22px var(--glow-blue)}.btn-primary:hover:not(:disabled){filter:brightness(1.08);box-shadow:0 12px 34px var(--glow-pink),0 0 30px var(--glow-blue)}.btn-primary:disabled{opacity:.42;cursor:not-allowed;box-shadow:none}.btn-ghost{background:#5b6dff14;color:var(--text);border:1px solid var(--border-blue)}.btn-ghost:hover:not(:disabled){border-color:var(--neon-pink);color:#fff;background:#ff5e8a1f;box-shadow:0 0 16px var(--glow-pink)}.btn-ghost:disabled{opacity:.4;cursor:not-allowed}.quiz-topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;font-size:.85rem;color:var(--text-muted)}.quiz-part-tag{color:var(--neon-pink-bright);font-weight:600}.timer-row{display:flex;justify-content:center;margin-bottom:10px}.quiz-timer{display:inline-flex;align-items:center;gap:10px;padding:8px 18px;border-radius:999px;font-variant-numeric:tabular-nums;border:1px solid var(--border-blue);background:#5b6dff1f;color:var(--neon-blue);transition:color .3s,background .3s,border-color .3s,box-shadow .3s;box-shadow:0 0 16px #5b6dff40}.quiz-timer .timer-label{font-size:.62rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;opacity:.85}.quiz-timer .timer-value{font-weight:700;font-size:1.1rem;letter-spacing:.5px}.quiz-timer.warn{color:var(--amber);border-color:#ffb34d80;background:#ffb34d1f;box-shadow:0 0 18px #ffb34d4d}.quiz-timer.danger{color:var(--danger);border-color:#ff4d6d8c;background:#ff4d6d24;animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 0 #ff4d6d80}50%{box-shadow:0 0 0 9px #ff4d6d00}}.progress-wrap{margin:8px 0 24px}.progress-track{height:10px;background:var(--bg-input);border-radius:999px;overflow:hidden;border:1px solid var(--border-blue)}.progress-fill{height:100%;background:linear-gradient(90deg,var(--neon-blue),var(--neon-pink));box-shadow:0 0 16px var(--glow-pink);transition:width .35s ease}.progress-label{font-size:.78rem;color:var(--text-muted);margin-top:8px}.question-text{font-size:1.28rem;font-weight:600;line-height:1.55;margin:6px 0 22px}.options{display:flex;flex-direction:column;gap:12px;margin-bottom:26px}.option{display:flex;align-items:center;gap:13px;padding:16px 18px;background:var(--bg-input);border:1.5px solid var(--border-blue);border-radius:14px;cursor:pointer;transition:border-color .15s,background .15s,transform .08s,box-shadow .15s}.option:hover{border-color:var(--neon-blue);transform:translateY(-1px);box-shadow:0 0 16px #5b6dff40}.option.selected{border-color:var(--neon-pink);background:#ff5e8a24;box-shadow:0 0 0 3px #ff5e8a29,0 0 20px var(--glow-pink)}.option input{accent-color:var(--neon-pink);width:18px;height:18px;flex-shrink:0}.option-text{font-size:1rem}.quiz-nav{display:flex;justify-content:space-between;gap:12px}.quiz-warning{color:var(--amber);font-size:.85rem;margin-bottom:16px;padding:12px 16px;background:#ffb34d1a;border:1px solid rgba(255,179,77,.3);border-radius:12px}.result-center{text-align:center}.score-ring{width:168px;height:168px;margin:16px auto 24px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--neon-pink) var(--pct, 0%),var(--bg-input) 0);position:relative;box-shadow:0 0 44px var(--glow-pink)}.score-ring:before{content:"";position:absolute;top:13px;right:13px;bottom:13px;left:13px;border-radius:50%;background:var(--bg-elevated)}.score-ring .score-value{position:relative;font-size:2.2rem;font-weight:800}.score-ring .score-value small{display:block;font-size:.8rem;color:var(--text-muted);font-weight:500}.result-actions{display:flex;flex-direction:column;gap:12px;margin-top:26px}.timeout-mark{font-family:var(--font-display);font-size:2.4rem;font-weight:900;letter-spacing:4px;color:var(--danger);text-shadow:0 0 22px rgba(255,77,109,.55);margin:6px 0 12px}.certificate-stage{--c-gold: #b8860b;--c-gold-mid: #d4af37;--c-gold-lt: #f0d67a;--c-ink: #463d28;--c-ink-strong: #352d1a;--c-muted: #9c8f6f;--c-paper: #fbf7ea;width:100%;max-width:1120px;display:flex;flex-direction:column;align-items:center;gap:22px}.certificate{width:min(1040px,95vw);background:#fbf7ea;border:3px solid var(--c-gold);border-radius:6px;padding:12px;box-shadow:0 30px 70px #00000080;color:var(--c-ink);font-family:var(--font-display)}.cert-frame{position:relative;border:2px solid var(--c-gold-mid);border-radius:4px;padding:clamp(26px,4.2vw,48px) clamp(28px,5vw,60px);min-height:calc(min(1040px,95vw) / 1.52);display:flex}.cert-frame:before{content:"";position:absolute;top:7px;right:7px;bottom:7px;left:7px;border:1px solid rgba(184,134,11,.55);border-radius:3px;pointer-events:none}.cert-orn{position:absolute;width:26px;height:26px;border:2px solid var(--c-gold);z-index:1}.cert-orn.tl{top:12px;left:12px;border-right:none;border-bottom:none}.cert-orn.tr{top:12px;right:12px;border-left:none;border-bottom:none}.cert-orn.bl{bottom:12px;left:12px;border-right:none;border-top:none}.cert-orn.br{bottom:12px;right:12px;border-left:none;border-top:none}.cert-inner{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center}.cert-logo{border-radius:12px;padding:3px;background:var(--c-gold);box-shadow:0 4px 14px #00000038;display:inline-flex;margin-bottom:10px}.cert-logo img{display:block;width:66px;height:66px;border-radius:9px;object-fit:cover}.cert-title{font-family:var(--font-display);font-size:clamp(2rem,4.6vw,3rem);font-weight:900;letter-spacing:9px;text-transform:uppercase;margin:4px 0 0;color:#a9791a;text-shadow:0 1px 1px rgba(138,102,8,.3)}.cert-subtitle{font-family:var(--font-ui);font-size:.8rem;letter-spacing:7px;text-transform:uppercase;color:var(--c-muted);margin-top:4px}.cert-rule{display:flex;align-items:center;justify-content:center;gap:10px;width:260px;margin:14px auto 22px}.cert-rule:before,.cert-rule:after{content:"";height:1px;flex:1}.cert-rule:before{background:var(--c-gold)}.cert-rule:after{background:var(--c-gold)}.cert-rule .diamond{width:8px;height:8px;background:var(--c-gold);transform:rotate(45deg);box-shadow:0 0 0 3px #b8860b2e}.cert-presented{font-size:1rem;font-style:italic;color:#6f6446;margin-bottom:12px}.cert-name{font-family:var(--font-display);font-size:clamp(2rem,5.2vw,3.2rem);font-weight:700;color:var(--c-ink-strong);line-height:1.12;padding:0 12px}.cert-name-rule{width:min(460px,70%);height:2px;margin:10px auto 22px;background:var(--c-gold)}.cert-body{font-family:var(--font-ui);font-size:1rem;line-height:1.75;color:#5b5138;max-width:640px;margin-bottom:18px}.cert-body strong{color:#96700c;font-weight:700}.cert-score-badge{display:inline-block;padding:9px 26px;border:1.5px solid var(--c-gold);border-radius:999px;font-family:var(--font-ui);font-weight:700;font-size:.95rem;color:#7d5c06;background:#f0d67a38;margin-bottom:26px}.cert-footer{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;width:100%;gap:24px}.cert-col{flex:1;text-align:center}.cert-sign,.cert-date{min-width:190px;max-width:260px}.sign-img{display:block;height:54px;width:auto;max-width:200px;object-fit:contain;margin:0 auto 2px}.cert-col-value{font-family:var(--font-display);font-size:1.15rem;color:var(--c-ink-strong);margin-bottom:6px;padding-bottom:4px}.cert-col-rule{width:80%;height:1px;margin:2px auto 7px;background:var(--c-gold)}.cert-col-name{font-family:var(--font-ui);font-weight:700;font-size:.9rem;letter-spacing:.6px;color:var(--c-ink-strong)}.cert-col-label{font-family:var(--font-ui);font-size:.72rem;letter-spacing:1.8px;text-transform:uppercase;color:var(--c-muted);margin-top:3px}.cert-seal-col{flex:0 0 auto}.seal-img{display:block;width:118px;height:118px;object-fit:contain;margin:0 auto;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2))}.cert-download-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.cert-download-row .btn{min-width:190px}.muted-note{color:var(--text-muted);font-size:.82rem;text-align:center;max-width:560px}.app-footer{text-align:center;color:var(--text-muted);font-size:.78rem;padding:18px}@media (max-width: 760px){.card{padding:24px}.cert-frame{padding:26px 22px}.cert-title{letter-spacing:5px}.cert-footer{gap:12px}.cert-sign,.cert-date{min-width:0}.seal-img{width:92px;height:92px}.sign-img{height:42px}}
