@import "https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@300;400;500;600;700;800&display=swap";
:root{--bg-main:#061109;--bg-card:#122e1fe0;--bg-card-hover:#183a27eb;--border-color:#40916c40;--border-glow:#74c69d80;--primary-900:#081c15;--primary-800:#1b4332;--primary-700:#2d6a4f;--primary-600:#40916c;--primary-500:#52b788;--primary-400:#74c69d;--primary-300:#95d5b2;--primary-200:#d8f3dc;--text-main:#fff;--text-muted:#a3c4b1;--text-dim:#6c917b;--accent-gold:#f4d06f;--accent-orange:#ff9f1c;--danger:#ef233c;--shadow-glow:0 0 25px #40916c40;--shadow-card:0 10px 30px #0006}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-main);color:var(--text-main);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 15% 15%,#1b433259 0%,#0000 45%),radial-gradient(circle at 85% 85%,#40916c40 0%,#0000 50%);background-attachment:fixed;min-height:100vh;font-family:Be Vietnam Pro,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.6}.app-container{max-width:1000px;margin:0 auto;padding:2rem 1.25rem 4rem}.app-container:has(.admin-layout){max-width:1550px}@keyframes logo-roll{0%{transform:rotate(-3deg)translateY(0)}25%{transform:rotate(0)translateY(-3px)}50%{transform:rotate(3deg)translateY(0)}75%{transform:rotate(0)translateY(-3px)}to{transform:rotate(-3deg)translateY(0)}}.header{text-align:center;z-index:2;flex-direction:column;justify-content:center;align-items:center;margin-bottom:0;padding:1.5rem 0 0;display:flex;position:relative}.logo-wrapper{filter:drop-shadow(0 0 20px #52b7888c);z-index:10;transform-origin:bottom;width:260px;height:70px;margin-bottom:.25rem;animation:3.6s ease-in-out infinite logo-roll;position:relative}.logo-wrapper:hover{filter:drop-shadow(0 0 32px #52b788f2)}.logo-img{object-fit:contain;width:100%;height:100%}.site-title{background:linear-gradient(135deg, #fff 30%, var(--primary-300) 100%);-webkit-text-fill-color:transparent;letter-spacing:-.02em;-webkit-background-clip:text;font-size:1.85rem;font-weight:800}.site-subtitle{color:var(--text-muted);margin-top:.25rem;font-size:.95rem}button,input,select,textarea{font-family:inherit}.glass-card{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-color);box-shadow:var(--shadow-card);border-radius:20px;margin-bottom:2rem;padding:2.5rem;transition:border-color .3s,box-shadow .3s;position:relative;overflow:visible}.glass-card:hover{border-color:#52b78866}.glass-card:before{content:"";background:linear-gradient(90deg, var(--primary-700), var(--primary-400), var(--primary-700));height:3px;position:absolute;top:0;left:0;right:0}.step-badge{color:var(--primary-300);text-transform:uppercase;letter-spacing:.05em;margin-bottom:1rem;font-size:.9rem;font-weight:700;display:inline-block}.section-title{color:#fff;margin-bottom:.75rem;font-size:1.6rem;font-weight:700}.section-desc{color:var(--text-muted);margin-bottom:2rem;font-size:.95rem}.form-group{margin-bottom:1.5rem}.form-label{color:var(--primary-200);margin-bottom:.5rem;font-size:.9rem;font-weight:600;display:block}.form-input,.form-select,.form-textarea{border:1px solid var(--border-color);color:#fff;background:#081c15b3;border-radius:12px;width:100%;padding:.9rem 1.2rem;font-family:inherit;font-size:1rem;transition:all .3s}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--primary-400);background:#0e2319e6;outline:none;box-shadow:0 0 15px #52b7884d}.form-input::placeholder{color:var(--text-dim)}.btn-primary{background:linear-gradient(135deg, var(--primary-600) 0%, var(--primary-800) 100%);border:1px solid var(--primary-400);color:#fff;cursor:pointer;border-radius:12px;justify-content:center;align-items:center;gap:.75rem;width:100%;padding:1rem 2rem;font-size:1.05rem;font-weight:700;transition:all .3s cubic-bezier(.175,.885,.32,1.275);display:inline-flex;box-shadow:0 6px 20px #2d6a4f66}.btn-primary:hover{background:linear-gradient(135deg, var(--primary-500) 0%, var(--primary-700) 100%);transform:translateY(-2px);box-shadow:0 10px 25px #52b78880}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-secondary{border:1px solid var(--border-color);color:var(--text-muted);cursor:pointer;background:#ffffff0d;border-radius:10px;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-secondary:hover{color:#fff;background:#ffffff1a}.quiz-progress-bar{background:#ffffff1a;border-radius:10px;width:100%;height:8px;margin:1.5rem 0 2rem;overflow:hidden}.quiz-progress-fill{background:linear-gradient(90deg, var(--primary-500), var(--primary-300));height:100%;transition:width .4s}.category-nav{scrollbar-width:thin;scrollbar-color:#52b788 #081c1580;gap:.5rem;margin-bottom:.75rem;padding-bottom:.6rem;display:flex;overflow-x:auto}.category-pill{color:#e0f2e9;white-space:nowrap;cursor:pointer;background:#081c1580;border:1px solid #95d5b266;border-radius:30px;padding:.65rem 1.25rem;font-family:Be Vietnam Pro,-apple-system,BlinkMacSystemFont,sans-serif;font-size:.88rem;font-weight:500;transition:all .25s}.category-pill:hover{color:#fff;background:#fff3}.category-pill.active{color:#081c15;background:#fff;border-color:#fff;font-weight:700;box-shadow:0 4px 15px #0000004d}.question-card{background:#f0f7f3;border:1px solid #40916c59;border-radius:16px;margin-bottom:1.5rem;padding:1.5rem;box-shadow:0 4px 15px #00000026}.question-header{align-items:flex-start;gap:.75rem;margin-bottom:1.25rem;display:flex}.question-number{background:var(--primary-800);color:#fff;border:1px solid var(--primary-600);border-radius:8px;flex-shrink:0;padding:.3rem .7rem;font-size:.85rem;font-weight:700}.question-text{color:#111827;font-size:1.05rem;font-weight:700;line-height:1.5}.options-grid{grid-template-columns:repeat(5,1fr);gap:.5rem;display:grid}.option-btn{color:#111827;text-align:center;cursor:pointer;white-space:nowrap;background:#fff;border:1.5px solid #74c69d;border-radius:12px;justify-content:center;align-items:center;gap:.4rem;padding:.75rem .35rem;font-size:.8rem;font-weight:600;transition:all .2s;display:inline-flex;box-shadow:0 2px 6px #0000000d}.radio-circle{border:1.5px solid #2d6a4f;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:15px;height:15px;transition:all .2s;display:inline-flex}.option-btn:hover{color:#061109;background:#e8f8f0;border-color:#2d6a4f}.option-btn:hover .radio-circle{border-color:#1b4332}.option-btn.selected{color:#081c15;background:#d8f3dc;border:2px solid #2d6a4f;font-weight:700;box-shadow:0 4px 12px #2d6a4f40}.option-btn.selected .radio-circle{background:#2d6a4f;border-color:#1b4332;box-shadow:0 0 6px #2d6a4f66}.option-btn.selected .radio-circle:after{content:"";background:#fff;border-radius:50%;width:5px;height:5px}.result-overview{text-align:center;border:1px solid var(--primary-500);background:linear-gradient(#2d6a4f4d 0%,#081c1599 100%);border-radius:16px;margin-bottom:2.5rem;padding:2rem 1rem}.total-score-badge{color:var(--primary-300);text-shadow:0 0 20px #52b78880;font-size:3.5rem;font-weight:800;line-height:1}.total-score-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-top:.5rem;font-size:.95rem}.chart-container{border:1px solid var(--border-color);background:#050f0a99;border-radius:16px;justify-content:space-around;align-items:flex-end;gap:.6rem;height:350px;margin-bottom:2rem;padding:2.2rem .75rem 1rem;display:flex;overflow-x:auto}.chart-bar-col{flex-direction:column;flex:1;align-items:center;min-width:90px;height:100%;display:flex}.bar-wrapper{flex:1;justify-content:center;align-items:flex-end;width:100%;display:flex;position:relative}.bar-fill{background:linear-gradient(180deg, var(--primary-400) 0%, var(--primary-800) 100%);border-radius:8px 8px 0 0;width:38px;min-height:6px;transition:height 1s cubic-bezier(.34,1.56,.64,1);position:relative;box-shadow:0 0 15px #52b7884d}.bar-fill.lowest{background:linear-gradient(#ff7b00 0%,#9e2a2b 100%);box-shadow:0 0 15px #ff7b0066}.bar-score{color:#fff;white-space:nowrap;background:#081c15b3;border:1px solid #52b7884d;border-radius:6px;padding:.15rem .4rem;font-size:.78rem;font-weight:700;position:absolute;top:-26px;left:50%;transform:translate(-50%)}.bar-label{color:#d8f3dc;text-align:center;word-break:break-word;white-space:normal;justify-content:center;align-items:center;min-height:52px;margin-top:.75rem;padding:0 .1rem;font-size:.78rem;font-weight:600;line-height:1.35;display:flex}.feedback-box{border-left:4px solid var(--primary-400);background:#1b433266;border-radius:0 12px 12px 0;margin-bottom:2rem;padding:1.5rem}.feedback-title{color:var(--primary-300);align-items:center;gap:.5rem;margin-bottom:.5rem;font-size:1.1rem;font-weight:700;display:flex}.feedback-content{color:#e0e0e0;font-size:.98rem;line-height:1.6}.qr-container{color:#111;background:#fff;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;max-width:320px;margin:1.5rem auto;padding:2rem;display:flex;box-shadow:0 10px 30px #00000080}.qr-img{object-fit:contain;width:240px;height:240px;margin-bottom:1rem}.bank-info{text-align:center;color:#333;font-size:.9rem}.bank-info strong{color:#000}.admin-table{border-collapse:collapse;width:100%;margin-top:1rem;font-size:.9rem}.admin-table th,.admin-table td{text-align:left;border-bottom:1px solid var(--border-color);padding:1rem}.admin-table th{color:var(--primary-200);background:#2d6a4f4d;font-weight:600}.admin-table tr:hover{background:#ffffff05}.badge-paid{color:var(--primary-300);border:1px solid var(--primary-500);background:#52b78833;border-radius:20px;padding:.25rem .6rem;font-size:.8rem}.badge-pending{color:var(--accent-orange);border:1px solid var(--accent-orange);background:#ff9f1c33;border-radius:20px;padding:.25rem .6rem;font-size:.8rem}@media (max-width:640px){.glass-card{padding:1.5rem 1.25rem}.section-title{font-size:1.35rem}.options-grid{grid-template-columns:repeat(1,1fr)}.option-btn{white-space:normal;padding:.75rem;font-size:.88rem}.chart-container{gap:.5rem;height:240px}.bar-fill{width:28px}}.admin-layout{align-items:flex-start;gap:1.75rem;display:flex}.admin-sidebar{border:1px solid var(--border-color);-webkit-backdrop-filter:blur(16px);z-index:50;background:#0e2319f2;border-radius:16px;flex-shrink:0;width:270px;padding:1.25rem 1rem;position:sticky;top:20px;box-shadow:0 10px 30px #0006}.admin-sidebar-brand{border-bottom:1px solid var(--border-color);text-align:center;margin-bottom:1rem;padding:.5rem .5rem 1rem}.admin-sidebar-title{color:var(--primary-300);letter-spacing:-.01em;font-size:1.1rem;font-weight:800}.admin-sidebar-sub{color:var(--text-muted);font-size:.78rem}.admin-sidebar-btn{color:#e0f2e9;cursor:pointer;text-align:left;background:0 0;border:1px solid #0000;border-radius:10px;justify-content:space-between;align-items:center;width:100%;margin-bottom:.35rem;padding:.75rem .9rem;font-size:.88rem;font-weight:500;transition:all .2s;display:flex}.admin-sidebar-btn:hover{color:#fff;background:#52b78826}.admin-sidebar-btn.active{color:#081c15;background:#fff;font-weight:700;box-shadow:0 4px 12px #00000040}.admin-badge-count{color:var(--primary-300);background:#52b78840;border-radius:20px;padding:.15rem .5rem;font-size:.75rem;font-weight:700}.admin-sidebar-btn.active .admin-badge-count{color:#fff;background:#081c15}.admin-main{flex:1;min-width:0;overflow-x:auto}.admin-subtab-btn{border:1px solid var(--border-color);color:var(--text-muted);cursor:pointer;white-space:nowrap;background:#081c1599;border-radius:20px;padding:.5rem 1rem;font-size:.85rem;font-weight:600;transition:all .2s}.admin-subtab-btn:hover{color:#fff;background:#52b78833}.admin-subtab-btn.active{background:var(--primary-500);border-color:var(--primary-500);color:#081c15;font-weight:700}html{-webkit-text-size-adjust:100%;touch-action:manipulation}@media (max-width:768px){input[type=text],input[type=tel],input[type=email],input[type=number],select,textarea{font-size:16px!important}}.table-responsive{-webkit-overflow-scrolling:touch;border-radius:12px;width:100%;margin-top:1rem;overflow-x:auto}.table-responsive::-webkit-scrollbar{height:6px}.table-responsive::-webkit-scrollbar-track{background:#081c1566}.table-responsive::-webkit-scrollbar-thumb{background:var(--primary-500);border-radius:4px}@media (max-width:1024px){.app-container{max-width:100%;padding:1.5rem 1.25rem 3rem}.options-grid{grid-template-columns:repeat(3,1fr);gap:.6rem}.admin-layout{flex-direction:column;gap:1.25rem}.admin-sidebar{width:100%;padding:1rem;position:relative;top:0}.admin-sidebar nav{flex-wrap:wrap;gap:.5rem;flex-direction:row!important}.admin-sidebar-btn{flex:calc(33.333% - .5rem);justify-content:space-between;width:auto;min-width:140px;margin-bottom:0}.admin-sidebar-brand{border-bottom:1px solid var(--border-color);margin-bottom:.75rem;padding-bottom:.75rem}}@media (max-width:768px){.app-container{padding:1rem .85rem 2.5rem}.header{padding:1rem 0 0}.logo-wrapper,.logo-img{width:200px;height:54px}.site-title{margin-top:.25rem;font-size:1.35rem;line-height:1.25}.site-subtitle{padding:0 .5rem;font-size:.85rem}.hero-card-overlap{margin-top:-35px!important}.glass-card{border-radius:16px;padding:1.25rem .95rem}.section-title{font-size:1.3rem;line-height:1.3}.section-desc{margin-bottom:1.25rem;font-size:.9rem}.options-grid{grid-template-columns:repeat(2,1fr);gap:.55rem}.option-btn{white-space:normal;word-break:break-word;border-radius:10px;min-height:48px;padding:.75rem .4rem;font-size:.82rem}.category-nav{-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;gap:.4rem;padding-bottom:.5rem;display:flex;overflow-x:auto}.category-nav::-webkit-scrollbar{display:none}.category-pill{white-space:nowrap;flex-shrink:0;padding:.45rem .8rem;font-size:.78rem}.chart-container{gap:.35rem;height:230px;padding:1.25rem .4rem .5rem;overflow-x:auto}.chart-bar-col{min-width:44px}.bar-fill{border-radius:6px 6px 0 0;width:24px}.bar-score{font-size:.7rem;top:-22px}.bar-label{height:32px;font-size:.68rem;line-height:1.15}.total-score-badge{font-size:2.5rem}.admin-sidebar-btn{flex:calc(50% - .4rem);min-width:120px;padding:.55rem .65rem;font-size:.8rem}.admin-table{min-width:620px;font-size:.8rem}.admin-table th,.admin-table td{padding:.65rem .5rem}.modal-card,[style*="position: fixed"]>.glass-card{max-height:88vh;overflow-y:auto;max-width:95%!important;padding:1.25rem 1rem!important}.btn-primary,.btn-secondary{justify-content:center;align-items:center;min-height:48px;padding:.85rem 1rem;font-size:.95rem;display:flex}}@media (max-width:480px){.options-grid{grid-template-columns:1fr}.option-btn{text-align:left;justify-content:flex-start;padding:.8rem .75rem;font-size:.85rem}.radio-circle{width:16px;height:16px;margin-right:.25rem}.admin-sidebar-btn{flex:100%;width:100%}}