@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Amiri:wght@400;700&family=Scheherazade+New:wght@400;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Scheherazade+New:wght@400;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Inter:wght@400;600;700;800&display=swap";@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Orbitron:wght@400;500;600;700;800;900&display=swap";@import"https://fonts.googleapis.com/css2?family=Indie+Flower&family=Coming+Soon&family=Gochi+Hand&family=Outfit:wght@400;700;900&display=swap";@import"https://fonts.googleapis.com/css2?family=Gochi+Hand&family=Nunito:wght@400;700;900&display=swap";@font-face{font-family:KFGQPC;src:url(/fonts/kfgqpc.otf) format("opentype");font-weight:400;font-style:normal;font-display:swap}:root{font-family:Inter,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--breakpoint-sm: 480px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1280px;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--theme-transition: background-color .3s ease, color .3s ease, border-color .3s ease, box-shadow .3s ease;--brand-merah-hati: #8b0000}:root,[data-theme=dark]{color-scheme:dark;--bg-primary: #051a14;--bg-secondary: #0b241e;--bg-tertiary: #113026;--bg-card: linear-gradient(145deg, #0d2720 0%, #13332b 100%);--bg-card-hover: linear-gradient(145deg, #13332b 0%, #1a3f36 100%);--bg-input: rgba(255, 255, 255, .05);--bg-input-focus: rgba(255, 255, 255, .08);--text-primary: #ecfdf5;--text-secondary: #d1fae5;--text-muted: #6ee7b7;--text-disabled: #374151;--border-primary: rgba(52, 211, 153, .2);--border-secondary: rgba(52, 211, 153, .1);--accent-primary: #10b981;--accent-primary-rgb: 16, 185, 129;--accent-secondary: #059669;--accent-gradient: linear-gradient(135deg, #10b981 0%, #059669 100%);--accent-shadow: rgba(16, 185, 129, .2);--accent-shadow-rgb: 16, 185, 129;--accent-soft: rgba(16, 185, 129, .1);--success: #34d399;--success-bg: rgba(52, 211, 153, .1);--warning: #fbbf24;--warning-bg: rgba(251, 191, 36, .1);--error: #f87171;--error-bg: rgba(248, 113, 113, .1);--info: #38bdf8;--info-bg: rgba(56, 189, 248, .1);--shadow-sm: 0 4px 10px rgba(0, 50, 20, .3);--shadow-md: 0 10px 25px rgba(0, 50, 20, .4);--shadow-lg: 0 20px 50px rgba(0, 50, 20, .5);--glass-bg: rgba(6, 78, 59, .2);--glass-border: rgba(52, 211, 153, .1);--glass-blur: blur(12px);--scrollbar-track: rgba(6, 78, 59, .3);--scrollbar-thumb: rgba(52, 211, 153, .2);--scrollbar-thumb-hover: rgba(52, 211, 153, .4)}[data-theme=light]{color-scheme:light;--bg-primary: #f0fdf4;--bg-secondary: #ffffff;--bg-tertiary: #dcfce7;--bg-card: linear-gradient(145deg, #ffffff 0%, #f0fdf4 100%);--bg-card-hover: linear-gradient(145deg, #f0fdf4 0%, #dcfce7 100%);--bg-input: rgba(6, 78, 59, .03);--bg-input-focus: rgba(6, 78, 59, .05);--text-primary: #042f2e;--text-secondary: #064e3b;--text-muted: #15803d;--text-disabled: #6b7280;--border-primary: rgba(5, 150, 105, .2);--border-secondary: rgba(5, 150, 105, .1);--accent-primary: #059669;--accent-primary-rgb: 5, 150, 105;--accent-secondary: #0d9488;--accent-gradient: linear-gradient(135deg, #047857 0%, #10b981 100%);--accent-shadow: rgba(5, 150, 105, .2);--accent-shadow-rgb: 5, 150, 105;--accent-soft: rgba(5, 150, 105, .08);--success: #166534;--success-bg: rgba(22, 101, 52, .08);--warning: #92400e;--warning-bg: rgba(146, 64, 14, .08);--error: #991b1b;--error-bg: rgba(153, 27, 27, .08);--info: #075985;--info-bg: rgba(7, 89, 133, .08);--shadow-sm: 0 4px 10px rgba(6, 78, 59, .05);--shadow-md: 0 10px 25px rgba(6, 78, 59, .08);--shadow-lg: 0 20px 50px rgba(6, 78, 59, .12);--glass-bg: rgba(255, 255, 255, .8);--glass-border: rgba(5, 150, 105, .2);--glass-blur: blur(12px);--scrollbar-track: rgba(6, 78, 59, .05);--scrollbar-thumb: rgba(6, 78, 59, .15);--scrollbar-thumb-hover: rgba(6, 78, 59, .25)}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;padding:0;min-height:100vh;min-height:100dvh;overflow-x:hidden;background-color:var(--bg-primary);color:var(--text-primary)}#root{width:100%;min-height:100vh;min-height:100dvh;background-color:var(--bg-primary)}@media(hover:none)and (pointer:coarse){button,a,input[type=button],input[type=submit],.nav-item,.clickable{min-height:44px;min-width:44px}.stat-card:hover,.nav-item:hover,.student-pill:hover{transform:none}}html{font-size:16px}@media(max-width:768px){html{font-size:15px}}@media(max-width:480px){html{font-size:14px}}.hide-mobile{display:block}.show-mobile{display:none}@media(max-width:768px){.hide-mobile{display:none!important}.show-mobile{display:block!important}}.no-scroll-x{overflow-x:hidden}.safe-area-top{padding-top:env(safe-area-inset-top,0)}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom,0)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#ffffff0d}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#ffffff40}.premium-card{background:var(--bg-card);border:1px solid var(--border-secondary);border-radius:20px;padding:1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.premium-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:var(--accent-primary)}.glass-pill{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:50px}.animate-fade{animation:fadeIn .5s ease forwards}.loading-premium{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:5rem;gap:1.5rem;color:var(--text-muted);font-weight:600}.spinner-p{width:50px;height:50px;border:4px solid var(--border-secondary);border-top:4px solid var(--accent-primary);border-radius:50%;animation:spin 1s linear infinite}.modal-overlay-p{position:fixed;inset:0;background:#0f172a99;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease-out}.modal-content-p{background:var(--bg-secondary);width:90%;max-width:600px;max-height:90vh;border-radius:32px;overflow:hidden;display:flex;flex-direction:column;position:relative;box-shadow:0 25px 50px -12px #00000040;border:1px solid var(--border-secondary);animation:modalSlideUp .4s cubic-bezier(.16,1,.3,1)}@keyframes modalSlideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header-p{padding:2rem 2.5rem;background:var(--bg-tertiary);border-bottom:1px solid var(--border-secondary);position:relative}.modal-header-p h2{margin:0;font-size:1.5rem;font-weight:800;color:var(--text-primary)}.modal-header-p p{margin:.5rem 0 0;color:var(--text-muted);font-size:.9rem}.btn-close-p{position:absolute;top:1.5rem;right:1.5rem;width:36px;height:36px;background:var(--bg-secondary);border:1px solid var(--border-secondary);border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.5rem;color:var(--text-primary);transition:all .2s}.btn-close-p:hover{background:var(--error-bg);color:var(--error);border-color:var(--error)}.form-p{padding:2.5rem;overflow-y:auto;flex:1;min-height:0}.form-group-p{margin-bottom:1.5rem}.form-group-p label{display:block;margin-bottom:.75rem;font-weight:700;font-size:.9rem;color:var(--text-secondary)}.form-p input,.form-p select,.form-p textarea{width:100%;padding:.85rem 1.25rem;border-radius:14px;border:2px solid var(--border-secondary);background:var(--bg-tertiary);color:var(--text-primary);font-size:1rem;font-weight:600;transition:all .2s}.form-p input:focus,.form-p select:focus,.form-p textarea:focus{border-color:var(--accent-primary);background:var(--bg-secondary);outline:none;box-shadow:0 0 0 4px var(--info-bg)}.form-actions-p{display:flex;gap:1rem;margin-top:2.5rem}.btn-submit-p{flex:2;padding:1rem;background:var(--accent-gradient);color:#fff;border:none;border-radius:14px;font-weight:800;cursor:pointer;box-shadow:0 10px 15px -3px var(--info-bg);transition:all .3s}.btn-cancel-p{flex:1;padding:1rem;background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border-secondary);border-radius:14px;font-weight:700;cursor:pointer}.btn-submit-p:hover{transform:translateY(-3px);box-shadow:0 20px 25px -5px var(--info-bg)}.btn-cancel-p:hover{background:var(--bg-secondary)}.dashboard-main{flex:1;margin-left:260px;padding:0;min-height:100vh;transition:all .3s ease;background-color:var(--bg-primary)}@media(max-width:1024px){.dashboard-main{margin-left:0;padding-top:5rem}}@media(max-width:768px){.dashboard-main{padding-top:4.5rem}}.dashboard-layout.no-sidebar .dashboard-main,.dashboard-main.full-width{margin-left:0!important;padding-top:0!important}.no-sidebar .detail-header{left:0!important;width:100%!important}.toast-container{position:fixed;top:2rem;right:2rem;z-index:10000;display:flex;flex-direction:column;gap:.75rem;pointer-events:none}.toast-premium{pointer-events:auto;min-width:300px;max-width:450px;background:#1e293b;color:#f8fafc;padding:1rem 1.25rem;border-radius:16px;box-shadow:0 10px 25px -5px #0000004d,0 8px 10px -6px #0000004d;display:flex;align-items:center;gap:.75rem;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:toast-slide-in .4s cubic-bezier(.16,1,.3,1);cursor:pointer;transition:transform .2s,opacity .3s}.toast-premium:hover{transform:scale(1.02)}.toast-premium.exit{animation:toast-slide-out .3s forwards}.toast-premium.success{border-left:6px solid #10b981}.toast-premium.error{border-left:6px solid #ef4444}.toast-premium.warning{border-left:6px solid #fbbf24;background:#451a03;color:#fef3c7}.toast-premium.info{border-left:6px solid #3b82f6}.toast-icon{font-size:1.25rem;flex-shrink:0}.toast-message{font-size:.95rem;font-weight:600;line-height:1.4;flex-grow:1}.toast-close{background:none;border:none;color:var(--text-muted, #6b7280);font-size:.8rem;cursor:pointer;opacity:.5;transition:opacity .2s}.toast-premium:hover .toast-close{opacity:1}@keyframes toast-slide-in{0%{transform:translate(100%) scale(.9);opacity:0}to{transform:translate(0) scale(1);opacity:1}}@keyframes toast-slide-out{0%{transform:translate(0) scale(1);opacity:1}to{transform:translate(120%) scale(.9);opacity:0}}[data-theme=dark] .toast-premium{background:#1f2937;color:#f9fafb;border-color:#374151}.access-denied-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px}.access-denied-card{background:#1e293be6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:40px;max-width:420px;width:100%;text-align:center;box-shadow:0 25px 50px -12px #00000040;animation:fadeInUp .5s ease-out}.access-denied-icon{font-size:64px;margin-bottom:16px;filter:drop-shadow(0 0 20px rgba(239,68,68,.3))}.access-denied-title{color:#fff;font-size:1.75rem;font-weight:700;margin:0 0 16px;background:linear-gradient(135deg,#fff,#94a3b8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.access-denied-message{color:#94a3b8;font-size:1rem;line-height:1.6;margin:0 0 12px}.access-denied-message strong{color:#38bdf8;font-weight:600}.access-denied-hint{color:#64748b;font-size:.9rem;margin:0 0 24px}.access-denied-current-role{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:24px;padding:12px 16px;background:#0003;border-radius:12px}.current-role-label{color:#64748b;font-size:.85rem}.current-role-badge{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;padding:6px 14px;border-radius:20px;font-size:.85rem;font-weight:600}.access-denied-actions{display:flex;flex-direction:column;gap:12px}.btn-back-dashboard{background:linear-gradient(135deg,#0ea5e9,#0284c7);border:none;border-radius:12px;padding:14px 24px;color:#fff;font-weight:600;font-size:1rem;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 6px -1px #0000001a}.btn-back-dashboard:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0ea5e966;filter:brightness(1.1)}.btn-back-dashboard:active{transform:translateY(0)}@media(max-width:480px){.access-denied-card{padding:30px 24px}.access-denied-icon{font-size:48px}.access-denied-title{font-size:1.5rem}}.auth-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;background:var(--bg-primary);transition:var(--theme-transition)}.auth-card{background:var(--bg-card);padding:2.5rem;border-radius:20px;width:100%;max-width:420px;box-shadow:var(--shadow-lg);border:1px solid var(--border-secondary);transition:var(--theme-transition)}.register-card{max-width:550px}.form-section{margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid var(--border-secondary)}.form-section h4{color:var(--accent-primary);margin-bottom:1.25rem;font-size:1.1rem;font-weight:600}.auth-form{display:flex;flex-direction:column;gap:1.25rem}.role-selector-pills{display:flex;background:var(--bg-secondary);padding:.35rem;border-radius:12px;margin-bottom:.5rem;gap:.25rem}.role-selector-pills .pill{flex:1;border:none;background:transparent;padding:.75rem;border-radius:10px;font-weight:600;color:var(--text-muted);cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);font-size:.95rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.role-selector-pills .pill.active{background:var(--bg-card);color:var(--accent-primary);box-shadow:var(--shadow-sm)}.input-hint{font-size:.8rem;color:var(--text-muted);margin-top:.4rem;display:block}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.auth-form textarea{width:100%;padding:.875rem 1rem;background:var(--bg-input);border:1px solid var(--border-primary);border-radius:10px;color:var(--text-primary);font-size:1rem;font-family:inherit;resize:none}.auth-header{text-align:center;margin-bottom:2rem}.auth-logo-img{height:80px;margin-bottom:1rem;animation:float 3s ease-in-out infinite}.auth-header h1{font-size:2rem;font-weight:700;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.auth-header p{color:var(--text-muted);font-size:1rem}.auth-error{background:var(--error-bg);border:1px solid var(--error);color:var(--error);padding:.875rem 1rem;border-radius:10px;margin-bottom:1.5rem;font-size:.9rem;text-align:center}.auth-form .form-group{margin-bottom:1.25rem}.auth-form label{display:block;color:var(--text-secondary);font-size:.875rem;margin-bottom:.5rem;font-weight:500}.auth-form input,.auth-form select{width:100%;padding:.875rem 1rem;background:var(--bg-input);border:1px solid var(--border-primary);border-radius:10px;color:var(--text-primary);font-size:1rem;transition:all .3s ease;box-sizing:border-box}.auth-form input::placeholder{color:var(--text-disabled)}.auth-form input:focus,.auth-form select:focus{outline:none;border-color:var(--accent-primary);background:var(--bg-input-focus);box-shadow:0 0 0 3px var(--accent-shadow)}.auth-form select option{background:var(--bg-secondary);color:var(--text-primary)}.password-input-wrapper{position:relative;display:flex;align-items:center}.password-input-wrapper input{padding-right:3rem!important}.password-toggle{position:absolute;right:.75rem;background:transparent;border:none;color:var(--text-muted);cursor:pointer;font-size:1.25rem;padding:.25rem;display:flex;align-items:center;justify-content:center;transition:all .2s ease;border-radius:8px;z-index:10}.password-toggle:hover{color:var(--text-primary);background:var(--bg-input)}.password-toggle.active{color:var(--warning);text-shadow:0 0 10px rgba(251,191,36,.5)}.auth-btn{width:100%;padding:1rem;background:var(--accent-gradient);color:#fff;border:none;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:.5rem}.auth-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 30px var(--accent-shadow)}.auth-btn:disabled{opacity:.7;cursor:not-allowed}.auth-footer{text-align:center;margin-top:1.5rem;color:var(--text-muted)}.auth-footer a{color:var(--accent-primary);text-decoration:none;font-weight:500;transition:color .2s ease}.auth-footer a:hover{color:var(--accent-secondary)}@media(max-width:768px){.auth-container{padding:1.5rem}.auth-card{padding:2rem;max-width:400px}.auth-logo-img{height:70px}.auth-header h1{font-size:1.75rem}.auth-header p{font-size:.95rem}}@media(max-width:480px){.auth-container{padding:2rem 1rem 1rem;align-items:flex-start}.auth-card{padding:1.5rem;margin:0;max-width:100%;border-radius:16px}.auth-logo-img{height:35px;margin-bottom:.5rem}.auth-header{margin-bottom:1rem}.auth-header h1{font-size:1.25rem}.auth-header p{font-size:.8rem;margin-bottom:0}.auth-form .form-group{margin-bottom:1rem}.auth-form input,.auth-form select{padding:.75rem .875rem;font-size:.95rem}.auth-btn{padding:.875rem;font-size:.95rem}.auth-footer{font-size:.85rem;margin-top:1rem}}.auth-divider{display:flex;align-items:center;text-align:center;margin:1.5rem 0;color:var(--text-muted);font-size:.875rem}.auth-divider:before,.auth-divider:after{content:"";flex:1;border-bottom:1px solid var(--border-secondary)}.auth-divider span{padding:0 .75rem;font-weight:500}.google-login-wrapper{display:flex;justify-content:center;width:100%}.login-features-showcase{width:100%;margin-bottom:1.5rem}.features-label{text-align:center;font-size:.8rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:1rem}.features-icon-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem}.feature-icon-item{display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:.75rem .5rem;background:var(--bg-input);border:1px solid var(--border-secondary);border-radius:14px;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:default}.feature-icon-item:hover{border-color:var(--accent-primary);background:var(--accent-soft, rgba(16, 185, 129, .06));transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.feature-icon-circle{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;background:var(--accent-soft, rgba(16, 185, 129, .08));border-radius:12px;transition:transform .3s ease}.feature-icon-item:hover .feature-icon-circle{transform:scale(1.1) rotate(3deg)}.feature-icon-item>span:last-child{font-size:.72rem;font-weight:600;color:var(--text-secondary);text-align:center;line-height:1.2}@media(max-width:480px){.features-icon-grid{gap:.5rem}.feature-icon-item{padding:.6rem .35rem;border-radius:10px}.feature-icon-circle{width:34px;height:34px;font-size:1.1rem;border-radius:10px}.feature-icon-item>span:last-child{font-size:.65rem}.features-label{font-size:.7rem;margin-bottom:.75rem}}.theme-toggle-btn{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:50px;padding:0;width:60px;height:30px;position:relative;cursor:pointer;overflow:hidden;transition:all .3s ease;display:flex;align-items:center;justify-content:space-between;box-shadow:inset 0 2px 4px #0000001a}.theme-toggle-btn:hover{border-color:var(--accent-primary)}.toggle-icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:.8rem;color:var(--text-muted);transition:all .3s ease;z-index:2}.toggle-icon.active,[data-theme=dark] .toggle-icon.active{color:var(--brand-merah-hati)}.theme-toggle-btn:after{content:"";position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:50%;background:var(--bg-tertiary);box-shadow:0 1px 3px #0003;transition:transform .3s cubic-bezier(.175,.885,.32,1.275);z-index:1}[data-theme=light] .theme-toggle-btn:after{transform:translate(30px);background:#fff}.sidebar{width:260px;height:100vh;background:var(--bg-secondary);border-right:1px solid var(--border-secondary);display:flex;flex-direction:column;position:fixed;left:0;top:0;transition:var(--theme-transition);z-index:10001;overflow:hidden}[data-theme=dark] .sidebar{background:linear-gradient(180deg,var(--bg-secondary) 0%,var(--bg-primary) 100%);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.sidebar-header{padding:1.5rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid var(--border-secondary)}.sidebar-header .logo-img{width:32px;height:32px;object-fit:contain}.sidebar-header h2{font-size:1.25rem;font-weight:700;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.sidebar-header .close-sidebar{display:none;background:transparent;border:none;color:var(--text-primary);font-size:1.5rem;cursor:pointer}.user-info{padding:1.25rem;display:flex;align-items:center;gap:.875rem;border-bottom:1px solid var(--border-secondary)}.avatar{width:45px;height:45px;border-radius:12px;background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:600;color:#fff}.user-details{display:flex;flex-direction:column;gap:.25rem}.username{font-weight:600;color:var(--text-primary);font-size:.95rem}.role-badge{font-size:.7rem;padding:.2rem .5rem;border-radius:4px;font-weight:600;text-transform:uppercase;width:fit-content}.badge-user{background:var(--bg-input);color:var(--text-muted)}.sidebar-nav{flex:1;padding:1rem .75rem;display:flex;flex-direction:column;gap:.25rem;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--accent-primary) transparent}.sidebar-nav::-webkit-scrollbar{width:6px}.sidebar-nav::-webkit-scrollbar-thumb{background-color:var(--accent-primary);border-radius:20px}.nav-item{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;border-radius:10px;color:var(--text-muted);text-decoration:none;font-weight:500;transition:all .2s ease}.nav-item:hover{background:var(--bg-input);color:var(--text-primary)}.nav-item.active{background:var(--accent-gradient);color:#fff;box-shadow:0 4px 15px var(--accent-shadow);transform:scale(1.02)}.nav-item.active .nav-icon,.nav-item.active .nav-label{color:#fff}.nav-icon{font-size:1.25rem;display:flex;align-items:center}.nav-label{font-size:.95rem}.nav-badge{margin-left:auto;background:#ef4444;color:#fff;font-size:.75rem;padding:.2rem .5rem;border-radius:999px;font-weight:700}.nav-badge.premium{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#5f370e;font-size:.65rem;border:1px solid #fbd38d;box-shadow:0 0 10px #f59e0b4d}.nav-item.locked{opacity:.6}.nav-item.locked:hover{opacity:.9;background:#f59e0b0d}.sidebar-footer{padding:1rem;border-top:1px solid var(--border-secondary)}.logout-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem;background:var(--error-bg);border:1px solid var(--error);border-radius:10px;color:var(--error);font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease}.logout-btn:hover{background:var(--error);color:#fff}.mobile-toggle{display:none;position:fixed;top:1rem;left:1rem;z-index:10000;background:var(--accent-gradient);color:#fff;border:none;width:45px;height:45px;border-radius:12px;font-size:1.25rem;cursor:pointer;box-shadow:var(--shadow-md);align-items:center;justify-content:center}.sidebar-backdrop{display:none;position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:999}@media(max-width:1024px){.sidebar{width:240px}.sidebar-header h2{font-size:1.1rem}}@media(max-width:768px){.sidebar{transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);width:280px;box-shadow:var(--shadow-lg)}.sidebar.open{transform:translate(0)}.sidebar-footer{padding-bottom:calc(1rem + env(safe-area-inset-bottom,20px))}.mobile-toggle{display:flex}.sidebar-backdrop{display:block}.sidebar-header .close-sidebar{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--bg-input);border-radius:10px;margin-left:auto}}@media(max-width:480px){.sidebar{width:100%;max-width:300px}}.auth-footer-btns{display:flex;flex-direction:column;gap:.5rem}.login-btn-sidebar,.register-btn-sidebar{width:100%;padding:.75rem;border-radius:10px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:none}.login-btn-sidebar{background:var(--bg-input);color:var(--text-primary);border:1px solid var(--border-secondary)}.login-btn-sidebar:hover{background:var(--bg-secondary);border-color:var(--accent-primary)}.register-btn-sidebar{background:var(--accent-gradient);color:#fff}.register-btn-sidebar:hover{transform:translateY(-2px);box-shadow:0 4px 12px var(--accent-shadow)}.prayer-widget-card{background:var(--bg-card);border:1px solid var(--border-secondary);border-radius:18px;padding:15px;margin-bottom:20px;position:relative;overflow:hidden;box-shadow:0 4px 15px #0000000d;transition:transform .3s}.prayer-widget-card:hover{transform:translateY(-3px)}.widget-header{display:flex;align-items:center;gap:12px;margin-bottom:12px}.widget-header .icon{font-size:1.5rem;background:rgba(var(--primary-rgb),.1);width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:10px}.title-group h4{margin:0;font-size:1rem;font-weight:700}.title-group .location{font-size:.75rem;color:var(--text-secondary)}.next-prayer-info{background:var(--primary-color);color:#fff;padding:10px 15px;border-radius:12px;display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.next-prayer-info .label{font-size:.85rem;font-weight:600}.next-prayer-info .time{font-size:1.2rem;font-weight:800}.mini-times-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.mini-time{display:flex;flex-direction:column;align-items:center}.mini-time span{font-size:.65rem;color:var(--text-secondary);text-transform:uppercase;margin-bottom:2px}.mini-time strong{font-size:.8rem;color:var(--text-primary)}.uda-onboarding-overlay{position:fixed;z-index:9999;display:flex;pointer-events:none}.uda-onboarding-overlay.bottom-right{bottom:2rem;right:2rem}.uda-onboarding-overlay.bottom-left{bottom:2rem;left:2rem}.uda-onboarding-container{pointer-events:auto;background:#ffffffe6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.3);border-radius:24px;padding:1.5rem;width:320px;box-shadow:0 15px 35px #00000026,0 5px 15px #0000000d;display:flex;flex-direction:column;align-items:center;position:relative;max-width:calc(100vw - 4rem)}[data-theme=dark] .uda-onboarding-container{background:#1e293be6;border-color:#ffffff1a;box-shadow:0 20px 40px #0006}.uda-avatar-wrapper{margin-top:-3.5rem;margin-bottom:1rem;display:flex;flex-direction:column;align-items:center}.uda-avatar-onboarding{width:80px;height:80px;border-radius:50%;background:#fff;padding:2px;box-shadow:0 4px 12px #0000001a;border:3px solid var(--success-primary, #4caf50)}.uda-name-tag{background:var(--success-primary, #4caf50);color:#fff;font-size:.75rem;font-weight:700;padding:2px 12px;border-radius:10px;margin-top:-.75rem;box-shadow:0 2px 6px #0000001a}.uda-message-bubble{width:100%;text-align:center}.uda-message-title{margin:0 0 .5rem;font-size:1.1rem;color:var(--text-primary, #1e293b);font-weight:700}[data-theme=dark] .uda-message-title{color:#f1f5f9}.uda-message-text{font-size:.95rem;line-height:1.5;color:var(--text-secondary, #475569);margin:0 0 1.25rem}[data-theme=dark] .uda-message-text{color:#94a3b8}.uda-message-actions{display:flex;justify-content:center}.uda-btn-paham{background:var(--accent-gradient);color:#fff;border:none;padding:.85rem 2rem;border-radius:16px;font-weight:800;font-size:1rem;cursor:pointer;transition:all .3s cubic-bezier(.175,.885,.32,1.275);width:100%;box-shadow:0 8px 20px var(--accent-shadow);letter-spacing:.5px}.uda-btn-paham:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 12px 25px var(--accent-shadow);filter:brightness(1.1)}.uda-btn-paham:active{transform:scale(.95)}.uda-close-btn{position:absolute;top:1rem;right:1rem;background:none;border:none;color:var(--text-secondary, #94a3b8);cursor:pointer;font-size:1.2rem;padding:5px}.uda-close-btn:hover{color:var(--text-primary, #1e293b)}[data-theme=dark] .uda-close-btn:hover{color:#fff}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.animate-slide-up{animation:slideUp .6s cubic-bezier(.16,1,.3,1)}@media(max-width:480px){.uda-onboarding-overlay{left:0!important;right:0!important;bottom:0!important;padding:1rem;justify-content:center}.uda-onboarding-container{width:100%;margin-bottom:2rem}}:root{--primary-gradient: var(--accent-gradient);--admin-gold: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);--admin-silver: linear-gradient(135deg, #94a3b8 0%, #64748b 100%);--admin-bronze: linear-gradient(135deg, #d97706 0%, #b45309 100%);--glass-bg: var(--glass-bg);--glass-border: var(--glass-border)}.dashboard-main-premium{flex:1;margin-left:260px;padding:0;transition:all .4s cubic-bezier(.4,0,.2,1);background:var(--bg-primary)}.dashboard-hero-banner{position:relative;padding:4rem 3rem;background:var(--accent-gradient);color:#fff;overflow:hidden;margin-bottom:-2rem}.hero-overlay{position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");opacity:.3}.hero-content{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto}.welcome-text h3{font-size:1.1rem;font-weight:500;opacity:.9;margin-bottom:.5rem}.welcome-text h1{font-size:2.5rem;font-weight:800;margin-bottom:.75rem;letter-spacing:-.5px}.welcome-text p{font-size:1.1rem;opacity:.8}.hero-visual{display:flex;gap:2rem}.float-icon{font-size:3rem;background:#fff3;width:80px;height:80px;display:flex;align-items:center;justify-content:center;border-radius:20px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:float 3s ease-in-out infinite}.float-icon.star{animation-delay:1.5s}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.dashboard-scroll-content{padding:0 3rem 3rem;max-width:1200px;margin:0 auto;position:relative;z-index:3}.stats-grid-premium{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card-premium{position:relative;background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:1.5rem;border-radius:24px;overflow:hidden;box-shadow:0 10px 25px -5px #0000000d,inset 0 0 0 1px var(--glass-border);transition:all .4s cubic-bezier(.175,.885,.32,1.275);border:none}.stat-card-premium:hover{transform:translateY(-10px) scale(1.02);box-shadow:0 25px 50px -12px #4f46e533;background:var(--bg-secondary)}.card-glass-effect{position:absolute;top:-30px;right:-30px;width:120px;height:120px;background:var(--primary-color);filter:blur(40px);opacity:.1;border-radius:50%;transition:all .6s ease}.stat-card-premium:hover .card-glass-effect{width:200px;height:200px;opacity:.2;filter:blur(60px)}.stat-content{display:flex;align-items:center;gap:1.25rem}.icon-wrapper{width:60px;height:60px;background:var(--bg-tertiary);border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:1.8rem;transition:all .3s}.user-total .icon-wrapper{background:#0ea5e926;color:#0ea5e9}.teacher-total .icon-wrapper{background:#f59e0b26;color:#f59e0b}.student-total .icon-wrapper{background:#10b98126;color:#10b981}.global-hafalan .icon-wrapper{background:#8b5cf626;color:#8b5cf6}.quran-total .icon-wrapper{background:#10b98126;color:#10b981}.progress-percent .icon-wrapper{background:#10b98126;color:#34d399}.premium-expiry .icon-wrapper{background:#4f46e526;color:#4f46e5}.premium-expiry.warning .icon-wrapper{background:#f59e0b33;color:#f59e0b;animation:pulse-warning 2s infinite}.premium-expiry.danger .icon-wrapper{background:#ef444433;color:#ef4444;animation:pulse-danger 1.5s infinite}.premium-expiry.danger .value{color:#ef4444}@keyframes pulse-warning{0%{box-shadow:0 0 #f59e0b66}70%{box-shadow:0 0 0 10px #f59e0b00}to{box-shadow:0 0 #f59e0b00}}@keyframes pulse-danger{0%{box-shadow:0 0 #ef444466}70%{box-shadow:0 0 0 10px #ef444400}to{box-shadow:0 0 #ef444400}}.stat-card-premium:hover .icon-wrapper{transform:scale(1.1) rotate(5deg)}.text-wrapper{display:flex;flex-direction:column}.text-wrapper .value{font-size:1.75rem;font-weight:800;color:var(--text-primary);line-height:1;margin-bottom:.25rem}.text-wrapper .label{font-size:.9rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.dashboard-card-premium{background:var(--bg-secondary);border-radius:24px;padding:2rem;box-shadow:0 10px 25px -5px #0000000d;border:1px solid var(--border-primary);margin-bottom:2rem}.card-header-premium h3{font-size:1.35rem;font-weight:700;color:var(--text-primary);margin-bottom:1.5rem;display:flex;align-items:center;gap:.75rem}.flex-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.dashboard-grid-main{display:grid;grid-template-columns:2fr 1fr;gap:2rem}.ranking-flex-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.ranking-title{font-size:.95rem;font-weight:700;color:var(--text-muted);margin-bottom:1.25rem;text-transform:uppercase;letter-spacing:.5px;border-left:3px solid var(--primary-color);padding-left:.75rem}.ranking-list-premium{display:flex;flex-direction:column;gap:1rem}.ranking-item-premium{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--bg-tertiary);border-radius:16px;transition:all .2s}.ranking-item-premium:hover{background:var(--bg-secondary);box-shadow:0 8px 15px -3px #0000000a;transform:translate(5px)}.rank-badge{width:32px;height:32px;background:var(--border-primary);color:#475569;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem}.rank-1 .rank-badge{background:var(--admin-gold);color:#fff;border:none;box-shadow:0 4px 10px #f59e0b4d}.rank-2 .rank-badge{background:var(--admin-silver);color:#fff;border:none;box-shadow:0 4px 10px #64748b4d}.rank-3 .rank-badge{background:var(--admin-bronze);color:#fff;border:none;box-shadow:0 4px 10px #b453094d}.student-info{flex:1;display:flex;flex-direction:column}.student-info .name{font-weight:700;color:var(--text-primary);font-size:.95rem}.student-info .stats{font-size:.8rem;color:var(--text-muted);font-weight:500}.summary-list-premium{display:flex;flex-direction:column;gap:1.25rem}.summary-item-premium{display:flex;justify-content:space-between;padding-bottom:1rem;border-bottom:1px dashed var(--border-secondary)}.summary-item-premium:last-child{border:none}.summary-item-premium .label{color:var(--text-muted)}.summary-item-premium .value{font-weight:700;color:var(--text-primary)}.quick-actions-premium{display:flex;flex-direction:column;gap:1rem;margin-top:1.5rem}.action-btn-p{display:block;width:100%;padding:.875rem;border-radius:14px;text-align:center;font-weight:600;text-decoration:none;transition:all .2s;background:var(--primary-color);color:#fff}.action-btn-p.outline{background:var(--bg-tertiary);color:var(--text-secondary)}.action-btn-p:hover{transform:translateY(-2px);filter:brightness(1.1)}.monitoring-grid-p{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.25rem}.monitoring-item-p{display:flex;align-items:center;gap:1.25rem;padding:1.5rem;background:var(--bg-tertiary);border-radius:20px;text-decoration:none;transition:all .3s;border:1px solid transparent}.monitoring-item-p:hover{background:var(--bg-secondary);border-color:var(--accent-primary);box-shadow:0 10px 20px -5px #4f46e51a;transform:translateY(-5px)}.monitoring-item-p .icon{font-size:2rem;width:55px;height:55px;display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);border-radius:16px;box-shadow:0 4px 6px -1px #0000000d}.monitoring-item-p .text h5{margin:0;color:var(--text-primary);font-size:1.05rem;font-weight:700}.monitoring-item-p .text p{margin:.25rem 0 0;font-size:.85rem;color:var(--text-secondary);opacity:.7}.monitoring-item-p .arrow{margin-left:auto;color:var(--border-primary);font-size:1.2rem;transition:all .2s}.monitoring-item-p:hover .arrow{transform:translate(5px);color:var(--primary-color)}.search-wrapper-p{position:relative;width:300px}.search-wrapper-p input{width:100%;padding:.75rem 1rem .75rem 2.8rem;border-radius:14px;border:1.5px solid var(--border-secondary);background:var(--bg-tertiary);font-size:.9rem;transition:all .2s}.search-wrapper-p input:focus{outline:none;border-color:var(--primary-color);background:var(--bg-secondary);box-shadow:0 0 0 4px #4f46e51a}.search-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:#94a3b8}.table-wrapper-p{margin-top:1.5rem;overflow-x:auto}.premium-table-minimal{width:100%;border-collapse:collapse}.premium-table-minimal th{text-align:left;padding:1rem;background:var(--bg-tertiary);color:var(--text-muted);font-weight:700;font-size:.75rem;text-transform:uppercase;letter-spacing:1px;border-bottom:2px solid #e2e8f0}.premium-table-minimal td{padding:1.25rem 1rem;border-bottom:1px solid var(--border-primary);color:var(--text-primary);font-size:.95rem}.student-cell{display:flex;align-items:center;gap:.875rem}.student-cell span{font-weight:600}.avatar-s{width:36px;height:36px;background:var(--primary-light);color:var(--primary-color);border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem}.badge-class{background:var(--bg-tertiary);padding:.35rem .75rem;border-radius:10px;font-weight:700;font-size:.8rem;color:var(--text-secondary)}.status-badge{padding:.35rem .75rem;border-radius:10px;font-weight:600;font-size:.8rem}.s-active{background:#dcfce7;color:#166534}.s-inactive{background:#f1f5f9;color:#64748b;font-style:italic}.hafalan-progress-visual{margin-top:2rem}.progress-bar-p{height:24px;background:var(--bg-tertiary);border-radius:12px;overflow:hidden;position:relative;box-shadow:inset 0 2px 4px #0000000d}.progress-bar-p .fill{height:100%;background:var(--accent-gradient);border-radius:12px;transition:width 1s cubic-bezier(.4,0,.2,1)}.progress-bar-p .shine{position:absolute;inset:0;background:linear-gradient(90deg,#fff0,#fff3,#fff0);animation:shine 3s infinite linear}@keyframes shine{0%{transform:translate(-100%)}to{transform:translate(100%)}}.progress-text-p{display:flex;justify-content:space-between;margin-top:1rem}.progress-text-p .text-left,.progress-text-p .text-right{display:flex;flex-direction:column}.progress-text-p .big{font-size:1.75rem;font-weight:800;color:var(--text-primary);line-height:1}.progress-text-p .small{font-size:.9rem;color:var(--text-muted);font-weight:600;margin-top:.25rem}.quiz-options-mini{display:grid;grid-template-columns:1fr;gap:.75rem;margin-top:1.5rem}.mini-opt-btn{padding:1rem 1.25rem;background:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:12px;font-size:.95rem;font-weight:600;color:var(--text-primary);cursor:pointer;transition:all .2s;text-align:center;line-height:1.4}.mini-opt-btn:hover:not(:disabled){background:var(--bg-secondary);border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 4px 6px #0000000d}.mini-opt-btn.correct{background:#dcfce7;color:#166534;border-color:#22c55e}.mini-opt-btn.wrong{background:#fee2e2;color:#991b1b;border-color:#ef4444}.quiz-feedback-mini{margin-top:1rem;padding:.75rem;border-radius:10px;text-align:center;font-weight:700;font-size:.95rem}.quiz-feedback-mini.correct{background:#dcfce7;color:#166534}.quiz-feedback-mini.wrong{background:#fee2e2;color:#991b1b}.quiz-footer{text-align:center;margin-top:1.5rem;padding-top:1rem;border-top:1px dashed var(--border-primary)}.quiz-footer .full-game-link{display:inline-block;padding:.5rem 1rem;background:var(--bg-tertiary);color:var(--primary-color);border-radius:8px;text-decoration:none;font-weight:600;font-size:.9rem;transition:all .2s}.quiz-footer .full-game-link:hover{background:var(--primary-light);transform:translate(4px)}.quiz-empty-mini{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1rem;text-align:center;background:var(--bg-tertiary);border-radius:16px;border:1px dashed var(--border-primary)}.quiz-empty-mini .icon{font-size:2.5rem;margin-bottom:1rem;animation:float 3s ease-in-out infinite}.quiz-empty-mini p{font-size:.95rem;color:var(--text-secondary);margin-bottom:1.5rem;max-width:240px;line-height:1.5}.quiz-empty-mini .mini-opt-btn{width:100%;max-width:200px;background:var(--accent-gradient);color:#fff;border:none;padding:.8rem 1.5rem;font-weight:700}.quiz-empty-mini .mini-opt-btn:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 10px 20px -5px #4f46e54d}.timeline-list-p{position:relative;padding-left:1.5rem}.timeline-item-p{position:relative;padding-bottom:2.5rem}.timeline-item-p .line{position:absolute;left:-15px;top:5px;bottom:-5px;width:2px;background:#e2e8f0}.timeline-item-p:last-child .line{display:none}.timeline-item-p .dot{position:absolute;left:-20px;top:5px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--primary-color)}.timeline-item-p .content{background:var(--bg-tertiary);padding:1.25rem;border-radius:16px;border:1px solid #f1f5f9}.header-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.type-badge{font-size:.7rem;font-weight:800;text-transform:uppercase;padding:.25rem .6rem;border-radius:6px;letter-spacing:.5px}.new_feature .type-badge{background:#ede9fe;color:#7c3aed}.warning .type-badge{background:#fff1f2;color:#e11d48}.general .type-badge{background:#e0f2fe;color:#0ea5e9}.timeline-item-p h4{font-size:1.1rem;font-weight:700;color:#1e293b;margin-bottom:.5rem}.timeline-item-p p{color:var(--text-secondary);font-size:.9rem;line-height:1.6;opacity:.8}.dashboard-grid-main{display:grid;grid-template-columns:1fr 320px;gap:2rem}.dashboard-column-side{display:flex;flex-direction:column;gap:2rem}.achievements-mini{display:flex;flex-direction:column;gap:1.25rem}.ach-item{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--bg-tertiary);border-radius:16px}.ach-item .icon{font-size:1.5rem}.ach-item .info{display:flex;flex-direction:column}.ach-item .label{font-size:.8rem;color:var(--text-muted);font-weight:600}.ach-item .val{font-weight:700;color:var(--text-primary)}.discovery-dashboard{padding:2rem}.discovery-hero{text-align:center;padding:4rem 1rem;max-width:800px;margin:0 auto}.compliance-footer-mini{margin-top:5rem;padding-top:3rem;border-top:1px solid var(--border-primary);text-align:left}.footer-mini-content{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:2rem;max-width:1200px;margin:0 auto}.footer-mini-info strong{font-size:1.1rem;color:var(--text-primary);display:block;margin-bottom:.5rem}.footer-mini-info p{font-size:.9rem;color:var(--text-secondary);opacity:.8}.footer-mini-links{display:flex;flex-direction:column;gap:.5rem}.footer-mini-links a{font-size:.85rem;color:var(--text-secondary);text-decoration:none;transition:color .2s}.footer-mini-links a:hover{color:var(--primary-color)}.footer-mini-partner{display:flex;flex-direction:column;gap:.75rem;align-items:flex-end}.footer-mini-partner span{font-size:.8rem;font-weight:600;color:var(--text-secondary)}.footer-mini-partner img{height:30px}@media(max-width:768px){.footer-mini-content{flex-direction:column;align-items:center;text-align:center}.footer-mini-partner{align-items:center}}.discovery-hero p{font-size:1.25rem;color:var(--text-secondary);opacity:.9;max-width:700px;margin:0 auto;line-height:1.6}.discovery-products{max-width:1200px;margin:6rem auto;padding:0 2rem;text-align:center;animation:fadeInUp-products .8s ease-out forwards}@keyframes fadeInUp-products{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.discovery-products .section-header{margin-bottom:3.5rem}.discovery-products .section-header h3{font-size:2.5rem;font-weight:800;margin-bottom:1rem;color:var(--text-primary)}.discovery-products .section-header p{font-size:1.1rem;color:var(--text-secondary);opacity:.8}.products-mini-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem;margin-bottom:3rem}.product-mini-card{background:var(--bg-secondary);padding:2.5rem 1.5rem;border-radius:24px;border:1px solid var(--border-primary);transition:all .4s cubic-bezier(.175,.885,.32,1.275);position:relative;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;align-items:center;box-shadow:0 4px 6px -1px #0000000d}.product-mini-card:hover,.product-mini-card.active{transform:translateY(-12px) scale(1.02);border-color:var(--primary-color);box-shadow:0 25px 50px -12px #10b98126}.product-mini-card.active{background:var(--bg-tertiary)}.product-mini-features{margin:1.5rem 0;width:100%;text-align:left;opacity:.8}.product-mini-features ul{list-style:none;padding:0;margin:0}.product-mini-features li{font-size:.85rem;color:var(--text-secondary);margin-bottom:.5rem;display:flex;align-items:center;gap:.5rem}.btn-buy-mini{width:100%;padding:12px;border-radius:12px;background:var(--primary-color);color:#fff!important;border:none;font-weight:700;font-size:.9rem;cursor:pointer;transition:all .3s;margin-top:auto;text-shadow:0 1px 2px rgba(0,0,0,.1)}[data-theme=light] .btn-buy-mini{background:#059669}.btn-buy-mini:hover{filter:brightness(1.1);transform:scale(1.02)}.product-mini-card.featured{border:2px solid var(--primary-color);background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.popular-mini-badge{position:absolute;top:15px;right:15px;background:var(--primary-color);color:#fff;font-size:.7rem;font-weight:800;padding:4px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:.5px}.p-icon{font-size:3rem;display:block;margin-bottom:1rem;transition:transform .3s}.product-mini-card:hover .p-icon{transform:rotate(10deg) scale(1.1)}.product-mini-card h5{font-size:1.35rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.p-price{font-size:1.15rem;font-weight:700;color:var(--primary-color)}.products-mini-grid .product-mini-card:nth-child(1){animation-delay:.1s}.products-mini-grid .product-mini-card:nth-child(2){animation-delay:.2s}.products-mini-grid .product-mini-card:nth-child(3){animation-delay:.3s}.products-mini-grid .product-mini-card:nth-child(4){animation-delay:.4s}.products-footer{margin-top:2rem}.btn-view-premium{padding:14px 30px;border-radius:15px;background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-primary);font-weight:700;cursor:pointer;transition:all .3s}.btn-view-premium:hover{background:var(--primary-color);color:#fff;transform:translateY(-3px);box-shadow:0 10px 20px #0000000d}@media(max-width:768px){.discovery-products{margin:4rem auto}.discovery-products .section-header h3{font-size:1.8rem}.products-mini-grid{grid-template-columns:1fr;gap:1.5rem}}.discovery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;max-width:1200px;margin:0 auto 4rem}.discovery-card{background:var(--bg-secondary);padding:2.5rem;border-radius:30px;border:1px solid var(--border-primary);transition:all .3s;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start}.discovery-card:hover{transform:translateY(-10px);border-color:var(--primary-color);box-shadow:0 20px 40px #0000000d}.discovery-card .icon{font-size:2.5rem;margin-bottom:1.5rem}.discovery-card h4{font-size:1.5rem;font-weight:800;margin-bottom:1rem}.discovery-card p{color:var(--text-secondary);opacity:.8;margin-bottom:2rem;line-height:1.6}.btn-trial{margin-top:auto;background:var(--bg-tertiary);border:none;padding:10px 20px;border-radius:12px;font-weight:700;color:var(--primary-color)}.discovery-cta{background:var(--accent-gradient);border-radius:40px;padding:5rem 2rem;text-align:center;color:#fff;max-width:1000px;margin:0 auto}.cta-content h3{font-size:2.5rem;font-weight:800;margin-bottom:1.5rem}.cta-btns{display:flex;gap:1.5rem;justify-content:center}.btn-login-p,.btn-register-p{padding:14px 35px;border-radius:15px;font-weight:700;font-size:1.05rem;cursor:pointer;transition:all .3s}.btn-login-p{background:#fff;color:var(--accent-primary, #10b981);border:none}.btn-register-p{background:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn-login-p:hover{transform:translateY(-3px);box-shadow:0 10px 20px #0000001a}.btn-register-p:hover{background:#ffffff4d;transform:translateY(-3px)}@media(max-width:768px){.discovery-hero h2{font-size:2.2rem}.discovery-cta{padding:3rem 1.5rem}.cta-btns{flex-direction:column}.btn-login-p,.btn-register-p{width:100%}}.badge-glow{display:inline-block;padding:8px 16px;background:var(--accent-soft);color:var(--accent-primary);border-radius:30px;font-size:.9rem;font-weight:700;margin-bottom:1.5rem;border:1px solid var(--border-primary)}.gradient-text{background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.discovery-hero h2{font-size:3.5rem;font-weight:850;line-height:1.1;color:var(--text-primary);margin-bottom:1.5rem}.premium-upsell-banner-top{position:relative;background:linear-gradient(135deg,#0f172a,#1e293b);margin:1.5rem 3rem 0;padding:1.5rem 2.5rem;border-radius:24px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;overflow:hidden;border:1px solid rgba(16,185,129,.3);box-shadow:0 20px 25px -5px #0003,0 10px 10px -5px #0000001a;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:10}.premium-upsell-banner-top:hover{transform:translateY(-5px);border-color:#10b981;box-shadow:0 25px 30px -5px #10b98133}.premium-upsell-banner-top:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right,rgba(16,185,129,.15),transparent 70%)}.banner-content-p{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;width:100%;gap:2rem}.banner-info{flex:1}.banner-badge-p{display:inline-block;padding:.35rem .75rem;background:var(--accent-gradient);color:#fff;border-radius:50px;font-size:.75rem;font-weight:800;letter-spacing:1px;margin-bottom:.75rem;box-shadow:0 4px 10px #10b9814d}.banner-info h3{margin:0 0 .5rem;font-size:1.5rem;font-weight:800;color:#fff!important;letter-spacing:-.5px}.banner-info p{margin:0;color:#94a3b8!important;font-size:1rem;font-weight:500}.banner-btn-p{padding:1rem 2rem;background:#fff;color:#0f172a;border:none;border-radius:14px;font-weight:800;font-size:1rem;cursor:pointer;transition:all .3s;white-space:nowrap;box-shadow:0 10px 15px -3px #0000001a}.premium-upsell-banner-top:hover .banner-btn-p{background:var(--accent-gradient);color:#fff;transform:scale(1.05)}.banner-decoration{position:absolute;right:5%;top:50%;transform:translateY(-50%);font-size:5rem;opacity:.1;filter:blur(2px);pointer-events:none;transition:all .5s}.premium-upsell-banner-top:hover .banner-decoration{opacity:.2;transform:translateY(-50%) scale(1.2) rotate(15deg)}@media(max-width:1024px){.premium-upsell-banner-top{margin:1rem 1.5rem 0;padding:1.25rem 1.5rem}.banner-info h3{font-size:1.25rem}}@media(max-width:768px){.banner-content-p{flex-direction:column;align-items:flex-start;gap:1.25rem}.banner-btn-p{width:100%}.banner-decoration{display:none}.dashboard-main-premium{margin-left:0!important;padding-bottom:2rem}.dashboard-hero-banner{padding:3rem 1.5rem;margin-bottom:-1.5rem}.hero-content{flex-direction:column;text-align:center;gap:1.5rem}.welcome-text h1{font-size:1.8rem}.welcome-text p{font-size:1rem}.hero-visual{justify-content:center}.dashboard-scroll-content{padding:0 1rem 1.5rem}.stats-grid-premium{grid-template-columns:1fr}.dashboard-grid-main{grid-template-columns:1fr;gap:1.5rem}.ranking-flex-grid{grid-template-columns:1fr}.discovery-dashboard{padding:1rem}.discovery-hero{padding:2.5rem .5rem}.discovery-hero h2{font-size:2rem}.discovery-hero p{font-size:1.1rem}.discovery-grid{grid-template-columns:1fr;gap:1.25rem}.table-wrapper-p{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -1rem;padding:0 1rem}}.whatsapp-collection-card{background:linear-gradient(135deg,#25d366,#128c7e);border-radius:24px;padding:2rem;color:#fff;display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;box-shadow:0 15px 30px -10px #25d36666;position:relative;overflow:hidden;animation:slideInUp .6s cubic-bezier(.16,1,.3,1)}.whatsapp-collection-card:before{content:"";position:absolute;top:-50%;right:-10%;width:300px;height:300px;background:#ffffff1a;border-radius:50%;filter:blur(40px)}.wa-card-content{position:relative;z-index:1;display:flex;align-items:center;gap:1.5rem}.wa-icon-large{font-size:3.5rem;filter:drop-shadow(0 4px 10px rgba(0,0,0,.2))}.wa-text h3{font-size:1.25rem;font-weight:800;margin-bottom:.25rem;color:#fff}.wa-text p{font-size:.95rem;opacity:.9;margin:0;color:#fff}.wa-card-action{position:relative;z-index:1;display:flex;flex-direction:column;gap:.75rem}.inline-form{flex-direction:row;align-items:center;background:#ffffff1a;padding:.4rem;border-radius:16px;border:1px solid rgba(255,255,255,.2);min-width:320px}.inline-wa-input{flex:1;background:transparent;border:none;padding:.6rem 1rem;color:#fff;font-size:1rem;font-weight:600;outline:none;min-width:150px}.inline-wa-input::placeholder{color:#fff9;font-weight:500}.inline-wa-input::-webkit-outer-spin-button,.inline-wa-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.inline-wa-input[type=number]{-moz-appearance:textfield}.btn-complete-wa{background:#fff;color:#128c7e;border:none;padding:.8rem 1.5rem;border-radius:12px;font-weight:800;font-size:.95rem;cursor:pointer;transition:all .3s;box-shadow:0 4px 12px #0000001a;display:flex;align-items:center;gap:.5rem;white-space:nowrap}.btn-dismiss-wa{background:#ffffff26;color:#fff;border:1px solid rgba(255,255,255,.3);padding:.6rem 1rem;border-radius:12px;font-weight:600;font-size:.85rem;cursor:pointer;transition:all .3s;text-align:center}.btn-dismiss-wa:hover{background:#ffffff40;border-color:#fff}.btn-complete-wa:hover{transform:scale(1.05);box-shadow:0 6px 15px #00000026}@keyframes slideInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.whatsapp-collection-card{flex-direction:column;gap:1.5rem;text-align:center;padding:1.5rem}.wa-card-content{flex-direction:column;gap:1rem}.wa-icon-large{font-size:2.5rem}.btn-complete-wa{width:100%;justify-content:center}}.ai-consultant-card{background:linear-gradient(135deg,#4f46e51a,#8b5cf61a);border:1px solid rgba(79,70,229,.2);display:flex;align-items:center;position:relative;overflow:hidden;padding:1.5rem;border-radius:24px;margin-bottom:2rem}.ai-consult-content{display:flex;align-items:center;gap:1.5rem;position:relative;z-index:2;width:100%}.uda-avatar-circle{width:80px;height:80px;background:#fff;border-radius:50%;padding:10px;box-shadow:0 10px 20px #4f46e533;display:flex;align-items:center;justify-content:center;flex-shrink:0}.uda-avatar-circle img{width:100%;height:100%;object-fit:contain}.ai-text h4{font-size:1.25rem;font-weight:800;margin-bottom:.25rem;color:var(--text-primary);margin-top:0}.ai-text p{font-size:.95rem;color:var(--text-secondary);margin-bottom:1rem;margin-top:0}.btn-ai-consult{background:var(--accent-gradient);color:#fff;border:none;padding:.6rem 1.2rem;border-radius:12px;font-weight:700;font-size:.9rem;cursor:pointer;transition:all .3s;box-shadow:0 4px 12px #4f46e54d}.btn-ai-consult:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 8px 20px #4f46e566}.premium-modal-overlay{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:1.5rem}.uda-ai-modal{background:var(--bg-secondary);width:100%;max-width:550px;border-radius:30px;overflow:hidden;box-shadow:0 25px 50px -12px #00000080;border:1px solid var(--border-primary)}.uda-ai-chat{display:flex;gap:1.5rem;padding:2rem;align-items:flex-start}.uda-side .uda-img{width:100px;height:100px;background:var(--bg-tertiary);border-radius:20px;padding:10px}.message-side{flex:1}.ai-message-bubble{background:var(--bg-tertiary);padding:1.5rem;border-radius:0 20px 20px;position:relative;border:1px solid var(--border-secondary)}.ai-message-bubble p{font-size:1.05rem;line-height:1.6;color:var(--text-primary);margin-bottom:1rem;margin-top:0}.ai-tags{display:flex;gap:.5rem;flex-wrap:wrap}.ai-tags .tag{background:var(--bg-secondary);color:var(--accent-primary);padding:.4rem 1rem;border-radius:12px;font-size:.8rem;font-weight:800;text-transform:uppercase;border:1px solid var(--border-secondary);box-shadow:var(--shadow-sm);letter-spacing:.5px}.typing-loader{display:flex;gap:5px;padding:1rem}.typing-loader span{width:10px;height:10px;background:var(--primary-color);border-radius:50%;animation:typing 1s infinite alternate}.typing-loader span:nth-child(2){animation-delay:.2s}.typing-loader span:nth-child(3){animation-delay:.4s}@keyframes typing{0%{opacity:.3;transform:translateY(0)}to{opacity:1;transform:translateY(-5px)}}@media(max-width:600px){.ai-consult-content{flex-direction:column;text-align:center}.uda-ai-chat{flex-direction:column;align-items:center}.ai-message-bubble{border-radius:20px}}.modal-footer{padding:1.5rem 2rem;display:flex;justify-content:flex-end;background:var(--bg-tertiary);border-top:1px solid var(--border-secondary)}.btn-action-p{background:var(--accent-gradient);color:#fff;border:none;padding:.8rem 1.8rem;border-radius:14px;font-weight:800;font-size:1rem;cursor:pointer;transition:all .3s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 8px 15px var(--accent-shadow);letter-spacing:.5px;width:auto}.btn-action-p:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 12px 25px var(--accent-shadow);filter:brightness(1.1)}.btn-action-p:active{transform:scale(.95)}.games-menu-widget{margin-top:2rem}.games-grid-mini{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-top:1.5rem}.game-card-mini{display:flex;align-items:center;padding:1.25rem;background:var(--bg-tertiary);border-radius:20px;text-decoration:none;color:inherit;transition:all .3s cubic-bezier(.4,0,.2,1);border:1px solid var(--border-primary);position:relative;overflow:hidden}.game-card-mini:hover{transform:translateY(-5px);border-color:var(--primary-color);background:var(--bg-secondary);box-shadow:0 10px 20px #0000000d}.game-icon-p{font-size:1.8rem;margin-right:1rem;background:#ffffff1a;width:50px;height:50px;display:flex;align-items:center;justify-content:center;border-radius:12px}.game-info-p h5{margin:0;font-size:1rem;font-weight:700;color:var(--text-primary)}.game-info-p p{margin:4px 0 0;font-size:.8rem;color:var(--text-secondary);opacity:.8}.game-arrow-p{margin-left:auto;font-size:1.2rem;opacity:.3;transition:.3s}.game-card-mini:hover .game-arrow-p{opacity:1;transform:translate(5px);color:var(--primary-color)}@media(max-width:600px){.games-grid-mini{grid-template-columns:1fr}}.user-list-premium{background:var(--bg-card);border-radius:20px;border:1px solid var(--border-primary);overflow:hidden;box-shadow:var(--shadow-sm)}.premium-table{width:100%;border-collapse:collapse;font-size:.95rem}.premium-table th{background:var(--bg-input);color:var(--text-muted);font-weight:600;text-align:left;padding:1.25rem 1.5rem;font-size:.8rem;text-transform:uppercase;letter-spacing:1px;border-bottom:2px solid var(--border-secondary)}.premium-table td{padding:1.25rem 1.5rem;border-bottom:1px solid var(--border-secondary);vertical-align:middle}.premium-table tr:hover{background:var(--bg-input)}.user-avatar-cell{display:flex;align-items:center;gap:1rem}.avatar-circle{width:40px;height:40px;background:var(--accent-gradient);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:1.2rem;box-shadow:0 4px 10px #6366f14d}.id-tag{font-size:.7rem;color:var(--text-muted);font-family:monospace}.username-stack{display:flex;flex-direction:column}.user-bold{font-weight:600;color:var(--text-primary)}.user-email{font-size:.8rem;color:var(--text-muted)}.linked-name{color:var(--success);font-weight:500}.not-linked{color:var(--text-disabled);font-style:italic;font-size:.85rem}.text-right{text-align:right}.action-flex{display:flex;gap:.75rem;justify-content:flex-end}.btn-action{width:36px;height:36px;border-radius:10px;border:1px solid var(--border-primary);background:var(--bg-input);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;font-size:1rem}.btn-action.edit:hover{background:var(--info-bg);border-color:var(--info);transform:translateY(-2px)}.btn-action.delete:hover{background:var(--error-bg);border-color:var(--error);transform:translateY(-2px)}.loading-placeholder-table{padding:4rem;text-align:center;color:var(--text-muted);background:var(--bg-card);border-radius:20px;border:1px dashed var(--border-primary)}.empty-row{padding:4rem!important}.empty-content{display:flex;flex-direction:column;align-items:center;gap:1rem}.empty-icon{font-size:3rem;opacity:.3}.badge{padding:.4rem .8rem;border-radius:8px;font-size:.75rem;font-weight:600}.badge-admin{background:var(--error-bg);color:var(--error)}.badge-guru{background:var(--info-bg);color:var(--info)}.badge-murid{background:var(--success-bg);color:var(--success)}.badge-nomurid{background:var(--bg-secondary);color:var(--text-muted);border:1px solid var(--border-primary)}.premium-status-cell{display:flex;align-items:center;gap:.75rem}.status-dot{width:8px;height:8px;border-radius:50%}.status-dot.active{background:var(--success);box-shadow:0 0 8px var(--success)}.status-dot.expired{background:var(--error)}.premium-dates{display:flex;flex-direction:column;font-size:.75rem}.date-label{color:var(--text-disabled);font-size:.65rem;text-transform:uppercase}.date-value{color:var(--text-primary);font-weight:500}.not-premium{color:var(--text-disabled);font-size:.85rem}@media(max-width:768px){.premium-table{min-width:800px}}.form-overlay{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000}.form-container{background:var(--bg-card);padding:2rem;border-radius:16px;width:100%;max-width:450px;box-shadow:var(--shadow-lg);border:1px solid var(--border-secondary);transition:var(--theme-transition)}.form-container h2{margin:0 0 1.5rem;color:var(--text-primary);font-size:1.5rem;text-align:center}.form-group{margin-bottom:1.25rem}.form-group label{display:block;color:var(--text-muted);font-size:.875rem;margin-bottom:.5rem}.form-group input,.form-group select{width:100%;padding:.75rem 1rem;background:var(--bg-input);border:1px solid var(--border-primary);border-radius:8px;color:var(--text-primary);font-size:1rem;transition:all .3s ease;box-sizing:border-box}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--accent-primary);background:var(--bg-input-focus);box-shadow:0 0 0 3px #6366f133}.form-group select option{background:var(--bg-secondary);color:var(--text-primary)}.form-actions{display:flex;gap:1rem;margin-top:1.5rem}.btn-cancel,.btn-submit{flex:1;padding:.875rem 1.5rem;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-cancel{background:var(--bg-input);color:var(--text-muted)}.btn-cancel:hover{background:var(--bg-input-focus);color:var(--text-primary)}.btn-submit{background:var(--accent-gradient);color:#fff}.form-row-premium{display:flex;gap:1rem;margin-bottom:1.25rem}.form-row-premium .form-group{flex:1;margin-bottom:0}.btn-submit:hover{transform:translateY(-2px);box-shadow:0 8px 20px #6366f166}.users-main-p{padding:2.5rem;max-width:1400px;margin-left:260px;animation:fadeIn .5s ease-out}@media(max-width:1024px){.users-main-p{margin-left:0;padding:5rem 1rem 2rem}}.u-header-p{margin-bottom:3rem}.u-header-p h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.u-header-p p{color:var(--text-muted);font-size:1.1rem}.u-stats-grid-p{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;margin-bottom:3rem}.u-stat-card-p{background:var(--bg-secondary);padding:1.5rem;border-radius:24px;box-shadow:0 4px 6px -1px #0000000d;border:1px solid var(--border-primary);display:flex;align-items:center;gap:1.25rem;transition:transform .3s}.u-stat-card-p:hover{transform:translateY(-5px)}.u-stat-icon-p{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.5rem}.u-stat-info-p span{display:block;color:var(--text-muted);font-size:.875rem;font-weight:600;margin-bottom:.25rem}.u-stat-info-p strong{font-size:1.5rem;color:var(--text-primary);font-weight:800}.u-controls-p{background:var(--bg-secondary);padding:1.5rem;border-radius:20px;box-shadow:0 4px 6px -1px #0000000d;border:1px solid var(--border-primary);display:flex;justify-content:space-between;align-items:center;gap:1.5rem;margin-bottom:2rem}.u-search-p{flex:1;position:relative}.u-search-p input{width:100%;padding:.75rem 1rem .75rem 3rem;border-radius:12px;border:1.5px solid var(--border-secondary);font-size:1rem;transition:all .2s}.u-search-p:before{content:"🔍";position:absolute;left:1.25rem;top:50%;transform:translateY(-50%);font-size:1rem;opacity:.5}.u-search-p input:focus{border-color:#4f46e5;outline:none;box-shadow:0 0 0 4px #4f46e51a}.u-actions-p{display:flex;gap:1rem}.u-filter-p{padding:.75rem 1.25rem;border-radius:12px;border:1.5px solid var(--border-secondary);font-weight:600;cursor:pointer;background:var(--bg-secondary)}.u-btn-add-p{padding:.75rem 1.5rem;background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;border:none;border-radius:12px;font-weight:700;cursor:pointer;box-shadow:0 10px 15px -3px #4f46e54d;transition:all .3s;display:flex;align-items:center;gap:.5rem}.u-btn-add-p:hover{transform:translateY(-2px);box-shadow:0 20px 25px -5px #4f46e566}@media(max-width:768px){.u-controls-p{flex-direction:column;align-items:stretch}.u-actions-p{flex-direction:column}}.profile-page-premium{padding:2rem;max-width:1200px;margin:0 auto;animation:fadeIn .5s ease-out}.profile-banner-hero{background:var(--accent-gradient);border-radius:24px;padding:3rem;display:flex;justify-content:space-between;align-items:center;color:#fff;margin-bottom:2rem;box-shadow:0 20px 25px -5px #4f46e533}.hero-content{display:flex;align-items:center;gap:2rem}.avatar-wrapper-premium{position:relative}.avatar-large-premium{width:120px;height:120px;background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:30px;display:flex;align-items:center;justify-content:center;font-size:3rem;font-weight:800;border:2px solid rgba(255,255,255,.3)}.online-indicator{position:absolute;bottom:5px;right:5px;width:20px;height:20px;background:#10b981;border:4px solid var(--accent-primary);border-radius:50%}.hero-text h1{margin:0;font-size:2.2rem;font-weight:800;letter-spacing:-.5px;color:#fff}.hero-badges{display:flex;gap:.8rem;margin-top:.5rem}.role-pill{padding:4px 12px;background:#fff3;border-radius:20px;font-size:.8rem;text-transform:uppercase;font-weight:700;letter-spacing:1px}.trial-pill{padding:4px 12px;background:#fff6;border-radius:20px;font-size:.8rem;font-weight:700;border:1px solid rgba(255,255,255,.6)}.premium-pill-active{padding:4px 12px;background:linear-gradient(135deg,#f59e0b,#ef4444);border-radius:20px;font-size:.8rem;font-weight:800;color:#fff;box-shadow:0 4px 10px #0003;border:1px solid rgba(255,255,255,.3)}.free-pill-active{padding:4px 12px;background:#ffffff26;border-radius:20px;font-size:.8rem;font-weight:700;color:#fff;border:1px solid rgba(255,255,255,.3)}.id-pill{font-size:.9rem;opacity:.9;color:#ffffffe6}.hero-actions button{padding:.8rem 1.5rem;border-radius:12px;font-weight:600;cursor:pointer;transition:all .2s;border:none}.btn-edit-mode{background:#fff;color:var(--accent-primary)}.btn-edit-mode:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a}.edit-mode-group{display:flex;gap:1rem}.btn-save-changes{background:#10b981;color:#fff}.btn-cancel-edit{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.3)!important}.profile-main-grid{display:grid;grid-template-columns:1fr 350px;gap:2rem}.profile-info-columns{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;background:var(--bg-primary)}@media(max-width:900px){.profile-main-grid,.profile-info-columns{grid-template-columns:1fr}}.profile-info-card-premium{background:var(--bg-secondary);border:1px solid var(--border-secondary);border-radius:20px;padding:1.5rem;box-shadow:0 4px 6px -1px #0000000d}.full-width{grid-column:span 2}@media(max-width:900px){.full-width{grid-column:span 1}}.card-header-premium{display:flex;align-items:center;gap:.8rem;margin-bottom:1.5rem;border-bottom:1px solid var(--border-secondary);padding-bottom:1rem}.card-header-premium .icon{font-size:1.2rem}.card-header-premium h3{margin:0;font-size:1.1rem;color:var(--text-primary)}.info-list-premium{display:flex;flex-direction:column;gap:1.2rem}.info-item-premium{display:flex;flex-direction:column;gap:.3rem}.info-item-premium .label{font-size:.75rem;text-transform:uppercase;color:var(--text-muted);font-weight:700;letter-spacing:.5px}.info-item-premium .value{font-weight:600;color:var(--text-primary);font-size:1rem}.value-full{line-height:1.6;color:var(--text-muted)}.premium-input-small,.premium-select-small{padding:.6rem .8rem;border-radius:10px;border:1.5px solid var(--border-secondary);background:var(--bg-tertiary);color:var(--text-primary);font-size:.95rem;width:100%}.edit-name-hero{background:#fff3;border:2px solid rgba(255,255,255,.4);border-radius:12px;padding:.5rem 1rem;color:#fff;font-size:2rem;font-weight:800;width:100%;outline:none}.edit-name-hero::placeholder{color:#fff9}.security-card{background:linear-gradient(to bottom right,var(--bg-secondary),var(--bg-tertiary))}.password-form-premium{display:flex;flex-direction:column;gap:1rem}.form-group-p label{display:block;font-size:.85rem;margin-bottom:.4rem;font-weight:600;color:var(--text-primary)}.pass-wrapper{position:relative;display:flex}.pass-wrapper input{width:100%;padding:.7rem 1rem;border-radius:12px;border:1.5px solid var(--border-secondary);background:var(--bg-tertiary)}.pass-wrapper button{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer}.pass-actions{display:flex;gap:.5rem;margin-top:1rem}.btn-confirm-pass{flex:2;background:var(--accent-primary);color:#fff;border:none;padding:.8rem;border-radius:10px;font-weight:600;cursor:pointer}.btn-cancel-pass{flex:1;background:var(--bg-tertiary);color:var(--text-secondary);border:none;padding:.8rem;border-radius:10px;font-weight:600;cursor:pointer}.btn-trigger-pass{width:100%;background:#fff;border:1.5px solid var(--border-secondary);padding:1rem;border-radius:15px;font-weight:600;cursor:pointer;margin-top:1rem;transition:all .2s}.btn-trigger-pass:hover{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.account-stats-list{display:flex;flex-direction:column;gap:1rem}.stat-row{display:flex;justify-content:space-between;font-size:.9rem;color:var(--text-muted)}.status-active{color:#10b981;font-weight:700;display:flex;align-items:center;gap:.4rem}.status-active:before{content:"";width:8px;height:8px;background:#10b981;border-radius:50%}.premium-stat span:last-child{color:#f59e0b;font-weight:800}.toast-premium{position:fixed;top:2rem;right:2rem;padding:1rem 2rem;border-radius:12px;color:#fff;font-weight:600;z-index:1000;box-shadow:0 10px 15px -3px #0000001a;animation:slideIn .3s ease-out}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.toast-premium.success{background:#10b981}.toast-premium.error{background:#ef4444}.danger-zone-card{border:1px solid #fee2e2!important;background:snow!important}.danger-header h3,.danger-header .icon{color:#ef4444!important}.danger-content{display:flex;flex-direction:column;gap:1rem;padding-top:.5rem}.danger-content p{color:#b91c1c;font-size:.95rem;line-height:1.5}.btn-delete-account{background:#fff;color:#ef4444;border:1.5px solid #ef4444;padding:.8rem;border-radius:12px;font-weight:700;cursor:pointer;transition:all .2s;width:100%;margin-top:.5rem}.btn-delete-account:hover{background:#ef4444;color:#fff}.modal-overlay{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:10000;padding:2rem;animation:fadeInModal .2s ease-out}@keyframes fadeInModal{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.modal-content.danger-modal{background:#fff;padding:2rem;border-radius:20px;width:100%;max-width:480px;box-shadow:0 25px 50px -12px #00000040;border:1px solid #fee2e2}.danger-modal h3{color:#ef4444;font-size:1.5rem;margin-top:0;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.warning-box{background:#fff5f5;border-left:4px solid #ef4444;padding:1rem;border-radius:8px;margin:1.5rem 0}.warning-box p{font-weight:700;color:#991b1b;margin-bottom:.5rem}.warning-box ul{margin:0;padding-left:1.5rem;color:#b91c1c}.warning-box li{margin-bottom:.3rem;font-size:.9rem}.confirm-instruction{margin-bottom:.8rem;font-size:.95rem;color:#4b5563}.confirm-input{width:100%;padding:.8rem 1rem;border:2px solid #e5e7eb;border-radius:10px;font-size:1.1rem;font-weight:600;text-align:center;letter-spacing:1px;margin-bottom:1.5rem;transition:all .2s;text-transform:uppercase}.confirm-input:focus{border-color:#ef4444;outline:none;background:#fff5f5}.modal-actions{display:flex;gap:1rem}.btn-cancel{flex:1;padding:.8rem;border:1px solid #e5e7eb;background:#fff;border-radius:10px;font-weight:600;color:#4b5563;cursor:pointer}.btn-confirm-delete{flex:2;padding:.8rem;border:none;background:#ef4444;border-radius:10px;font-weight:700;color:#fff;cursor:pointer;transition:all .2s}.btn-confirm-delete:disabled{background:#fca5a5;cursor:not-allowed}.btn-confirm-delete:hover:not(:disabled){background:#dc2626}.profile-legal-footer{display:flex;justify-content:center;gap:1.5rem;margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border-secondary);width:100%}.profile-legal-footer a{color:var(--text-muted);text-decoration:none;font-size:.85rem;font-weight:500;transition:color .2s}.profile-legal-footer a:hover{color:var(--accent-primary)}@media(max-width:768px){.profile-legal-footer{flex-direction:column;align-items:center;gap:.8rem}}.bank-soal-premium{padding:2.5rem;max-width:1200px;margin:0 auto;animation:fadeIn .5s ease-out}.bank-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:2.5rem;gap:2rem}.bank-header-p h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.bank-header-p p{color:var(--text-muted);font-size:1.1rem}.btn-start-game-p{padding:1rem 2rem;background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;border:none;border-radius:16px;font-weight:700;font-size:1rem;cursor:pointer;box-shadow:0 10px 15px -3px #4f46e54d;transition:all .3s;display:flex;align-items:center;gap:.75rem}.btn-start-game-p:hover{transform:translateY(-3px);box-shadow:0 20px 25px -5px #4f46e566}.filters-row-p{display:flex;gap:1.5rem;margin-bottom:3rem;background:var(--bg-secondary);padding:1.5rem;border-radius:20px;box-shadow:0 4px 6px -1px #0000000d;border:1px solid var(--border-primary)}.filter-item-p{flex:1;display:flex;flex-direction:column;gap:.5rem}.filter-item-p label{font-size:.85rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.filter-item-p select,.filter-item-p .static-val{padding:.75rem 1rem;border-radius:12px;border:1.5px solid var(--border-secondary);background:var(--bg-tertiary);font-weight:600;color:var(--text-primary)}.soal-grid-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:1.5rem}.soal-card-p{background:var(--bg-secondary);border-radius:24px;padding:1.75rem;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary);transition:all .3s;display:flex;flex-direction:column}.soal-card-p:hover{transform:translateY(-8px);box-shadow:0 20px 25px -5px #0000001a;border-color:#4f46e5}.soal-badges-p{display:flex;justify-content:space-between;margin-bottom:1.25rem}.badge-item-p{padding:.4rem .875rem;border-radius:10px;font-size:.75rem;font-weight:800;text-transform:uppercase}.badge-item-p.diff{background:var(--bg-tertiary);color:var(--text-secondary)}.badge-item-p.done{background:#dcfce7;color:#166534}.soal-text-p{font-size:1.1rem;font-weight:600;color:var(--text-primary);line-height:1.5;margin-bottom:1.5rem;flex:1}.game-overlay-p{max-width:800px;margin:2rem auto;background:var(--bg-secondary);border-radius:32px;padding:3rem;box-shadow:0 25px 50px -12px #0000001a}.game-hud-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:2.5rem}.hud-progress-p{flex:1;margin-right:2rem}.hud-progress-p span{display:block;font-size:.9rem;font-weight:700;color:var(--text-muted);margin-bottom:.5rem}.hud-bar-p{height:10px;background:var(--bg-tertiary);border-radius:10px}.hud-bar-p .fill{height:100%;background:linear-gradient(90deg,#4f46e5,#7c3aed);border-radius:10px;transition:width .3s ease}.btn-quit-p{padding:.6rem 1.2rem;background:var(--bg-tertiary);color:var(--text-secondary);border:none;border-radius:12px;font-weight:700;cursor:pointer}.question-view-p h3{font-size:1.75rem;font-weight:800;color:var(--text-primary);line-height:1.4;margin-bottom:2.5rem;text-align:center}.options-grid-p{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}@media(max-width:640px){.options-grid-p{grid-template-columns:1fr}}.option-btn-p{padding:1.25rem;background:var(--bg-tertiary);border:2px solid var(--border-secondary);border-radius:20px;display:flex;align-items:center;gap:1rem;text-align:left;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .2s}.option-label-p{width:36px;height:36px;background:var(--bg-secondary);border:1.5px solid var(--border-primary);border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--text-muted);flex-shrink:0}.option-btn-p:hover:not(:disabled){border-color:#4f46e5;background:var(--bg-secondary);transform:translateY(-3px)}.option-btn-p.is-correct{background:#dcfce7;border-color:#22c55e;color:#166534}.option-btn-p.is-wrong{background:#fee2e2;border-color:#ef4444;color:#991b1b}.explanation-p{margin-top:2.5rem;padding:2rem;background:var(--bg-tertiary);border-radius:24px;border:1.5px dashed #0ea5e9;animation:slideUp .3s ease-out}.explanation-p p{color:#0369a1;font-size:1rem;margin-bottom:1.5rem;line-height:1.6}.btn-next-p{width:100%;padding:1rem;background:#0ea5e9;color:#fff;border:none;border-radius:16px;font-weight:700;font-size:1.1rem;cursor:pointer}.result-view-p{text-align:center}.result-emoji-p{font-size:5rem;margin-bottom:1.5rem}.result-view-p h2{font-size:2.5rem;font-weight:800;margin-bottom:2rem;color:var(--text-primary)}.final-score-p{display:flex;justify-content:center;align-items:baseline;gap:.5rem;margin-bottom:1rem}.score-big-p{font-size:6rem;font-weight:900;color:#4f46e5}.score-total-p{font-size:2rem;font-weight:700;color:var(--text-disabled)}.result-msg-p{font-size:1.25rem;color:var(--text-muted);margin-bottom:3rem;max-width:500px;margin-left:auto;margin-right:auto}.result-btns-p{display:flex;gap:1.5rem;justify-content:center}.btn-retry-p{padding:1rem 2.5rem;background:#4f46e5;color:#fff;border:none;border-radius:16px;font-weight:700;cursor:pointer}.btn-home-p{padding:1rem 2.5rem;background:var(--bg-tertiary);color:var(--text-secondary);border:none;border-radius:16px;font-weight:700;cursor:pointer}.alquran-container{padding:clamp(1rem,5vw,2.5rem);max-width:1400px;margin:0 auto;transition:var(--theme-transition);min-height:100vh;overflow:visible!important}.alquran-header{text-align:center;padding:3.5rem 1rem;background:var(--bg-card);border-radius:30px;margin-bottom:2rem;border:1px solid var(--border-secondary);position:relative;overflow:hidden;animation:fadeIn .8s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;align-items:center}.alquran-header:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top left,var(--accent-primary-light),transparent 60%),radial-gradient(circle at bottom right,var(--accent-secondary-light),transparent 60%);opacity:.15;z-index:0}.alquran-header h1{font-size:clamp(1.8rem,5vw,3rem);font-weight:800;margin:0;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;position:relative;z-index:1}.title-donation-wrapper{display:flex;flex-direction:column;align-items:center;gap:.8rem;margin-bottom:.6rem;position:relative;z-index:2}.btn-donation-link{border:1px solid var(--border-secondary);padding:.4rem 1.2rem;border-radius:50px;font-size:.85rem;font-weight:600;text-decoration:none;transition:all .3s ease;display:flex;align-items:center;gap:8px;cursor:pointer;background:var(--bg-secondary);color:var(--accent-primary);transform:translateY(-2px);box-shadow:0 5px 15px #0000001a}.alquran-header p{color:var(--text-muted);font-size:1.1rem;max-width:600px;margin:1rem auto 0;position:relative;z-index:1;font-weight:500}.controls-sticky-container{position:sticky;top:0;z-index:1500;background:var(--bg-primary);padding:1.2rem 0;margin:-1rem 0 2rem;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border-secondary);display:flex;flex-direction:column;gap:1.2rem;box-shadow:0 4px 20px #0000000d}.search-container{max-width:800px;margin:0 auto;width:100%}.search-wrapper{position:relative;background:var(--bg-card);border:1.5px solid var(--border-secondary);border-radius:18px;display:flex;align-items:center;padding:0 1.5rem;transition:all .3s ease}.search-wrapper:focus-within{border-color:var(--accent-primary);box-shadow:0 0 0 4px var(--accent-primary-transparent)}.search-input{width:100%;padding:1rem 1.5rem 1rem 2.8rem;border:none;background:transparent;color:var(--text-primary);font-size:1.05rem;border-radius:18px}.search-icon{position:absolute;left:1.2rem;top:50%;transform:translateY(-50%);font-size:1.2rem}.last-read-banner-quran{background:var(--bg-card);border:1px solid var(--border-secondary);border-radius:20px;padding:1.5rem;margin-bottom:2rem;display:flex;align-items:center;gap:1.5rem;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;animation:fadeIn .6s ease;box-shadow:var(--shadow-sm)}.last-read-banner-quran:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--accent-primary);background:var(--bg-card-hover)}.last-read-banner-quran:before{content:"";position:absolute;inset:0;background:var(--accent-gradient);opacity:.05;z-index:0}.lrb-icon{width:60px;height:60px;background:var(--accent-gradient-transparent);border-radius:15px;display:flex;align-items:center;justify-content:center;font-size:2rem;z-index:1;box-shadow:0 4px 15px #0ca88e33}.lrb-content{flex:1;z-index:1}.lrb-label{display:block;font-size:.8rem;font-weight:700;color:var(--accent-primary);text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}.lrb-surah{font-size:1.4rem;font-weight:800;margin:0;color:var(--text-primary)}.lrb-detail{font-size:.95rem;color:var(--text-muted);margin:2px 0 0}.lrb-action{z-index:1}.lrb-btn{padding:.6rem 1.2rem;background:var(--accent-primary);color:#fff;border-radius:12px;font-weight:700;font-size:.9rem;transition:all .3s ease;box-shadow:0 4px 10px #0ca88e4d}.last-read-banner-quran:hover .lrb-btn{transform:scale(1.05);box-shadow:0 6px 15px #0ca88e66}.surah-card.last-read-highlight{border-color:var(--accent-primary);background:var(--accent-primary-transparent)}.last-read-badge{position:absolute;top:15px;right:15px;background:var(--accent-primary);color:#fff;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.9rem;box-shadow:0 2px 8px #0ca88e66;z-index:10}.last-read-verse{border-left:5px solid var(--accent-primary)!important;background:var(--accent-primary-transparent)!important}.last-read-verse:after{content:"Terakhir Dibaca";position:absolute;top:15px;right:25px;background:var(--accent-primary);color:#fff;padding:2px 10px;border-radius:20px;font-size:.7rem;font-weight:700;text-transform:uppercase}.surah-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}.surah-card{background:var(--bg-card);border-radius:20px;padding:1.5rem;display:flex;align-items:center;gap:1.2rem;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);border:1px solid var(--border-secondary);position:relative;overflow:hidden;animation:fadeIn .4s ease forwards}.surah-card:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--accent-gradient);opacity:0;transition:opacity .3s ease}.surah-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);background:var(--bg-card-hover)}.surah-card:hover:before{opacity:1}.surah-number{display:flex;align-items:center;justify-content:center;font-weight:800;font-size:2rem;color:var(--accent-primary);margin-right:15px;min-width:50px}.surah-info{flex:1}.surah-name-latin{display:block;font-weight:700;font-size:1.4rem;color:var(--text-primary);margin-bottom:5px}.surah-verses-count{display:block;font-size:.85rem;color:var(--text-muted);margin-top:4px;font-weight:500}.surah-verses-count-latin{display:block;font-size:.85rem;color:var(--text-muted);font-weight:600}.surah-translation{display:none}.surah-hafalan-info{margin-top:12px;display:flex;flex-direction:column;gap:6px}.surah-hafalan-progress{width:100%;height:6px;background:#b59e6f26;border-radius:10px;overflow:hidden}.shp-fill{height:100%;background:linear-gradient(90deg,#b59e6f,#d4af37);transition:width .4s ease-out}.surah-hafalan-count{font-size:.75rem;color:var(--accent-primary);font-weight:600}.surah-star-badge{position:absolute;top:-10px;left:-10px;background:radial-gradient(circle,#fff9c4,#fbc02d);width:35px;height:35px;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:0 4px 10px #d4af3766;font-size:1.2rem;z-index:5;animation:pulse-gold 2s infinite;border:2px solid #fff}@keyframes pulse-gold{0%{transform:scale(1);box-shadow:0 0 #d4af3766}70%{transform:scale(1.1);box-shadow:0 0 0 10px #d4af3700}to{transform:scale(1);box-shadow:0 0 #d4af3700}}.surah-detail-container{background:var(--bg-primary);overflow:visible;position:relative;padding-top:90px;max-width:1000px;margin:0 auto}.detail-header{position:fixed!important;top:0!important;left:0;right:0;z-index:9999!important;background:var(--bg-secondary);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);box-shadow:0 4px 20px #00000026;border-bottom:1px solid var(--border-primary);padding:.6rem 1rem;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:12px;height:70px;overflow-x:auto;scrollbar-width:none;transform:none!important;will-change:auto}.detail-header::-webkit-scrollbar{display:none}@media(min-width:1025px){.dashboard-layout .detail-header{left:260px!important;width:calc(100% - 260px)!important}}@media(min-width:769px)and (max-width:1024px){.dashboard-layout .detail-header{left:240px!important;width:calc(100% - 240px)!important}}.landing-page .detail-header{left:0!important;right:0!important;width:100%!important}@media(max-width:768px){.detail-header{left:0!important;right:0!important;width:100%!important;height:auto!important;min-height:auto;padding:.8rem 1rem!important;flex-direction:column!important;align-items:stretch!important;gap:1rem!important}.detail-header-top{width:100%;justify-content:space-between}.header-features-row{width:100%;justify-content:center!important;overflow-x:auto!important;padding-bottom:5px!important;gap:8px!important;-webkit-overflow-scrolling:touch}.header-features-row::-webkit-scrollbar{height:3px;display:block}.header-features-row::-webkit-scrollbar-thumb{background:#0ca88e66;border-radius:4px}.qori-compact-mini{max-width:140px}.qori-compact-mini select{width:100%}.surah-detail-container{padding-top:160px!important}.surah-title-mini{font-size:1.4rem;max-width:150px;overflow:hidden;text-overflow:ellipsis}}.detail-header{visibility:visible!important;display:flex!important;opacity:1!important;pointer-events:auto!important;isolation:isolate}.animate-fade{animation-fill-mode:forwards}.surah-detail-container,.alquran-container{transform:none!important;animation:fadeInOnly .5s ease forwards!important}@keyframes fadeInOnly{0%{opacity:0}to{opacity:1}}* .detail-header{position:fixed!important;top:0!important;z-index:9999!important}.detail-header-top{display:flex;align-items:center;gap:12px;flex-shrink:0}.header-features-row{display:flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;padding:0!important;border-top:none!important}.nav-group-mini h2,.back-button-mini,.hpb-text{color:var(--text-primary)!important}.nav-group-mini{display:flex;align-items:center;gap:8px}.back-button-mini{background:transparent;border:none;color:var(--text-primary);font-size:1.2rem;cursor:pointer;padding:0 4px;transition:all .2s;border-radius:4px}.back-button-mini:hover{background:#fff3;transform:translate(-3px)}.surah-title-mini{font-family:KFGQPC,serif;font-size:1.6rem;font-weight:400;margin:0;color:var(--text-primary);white-space:nowrap;direction:rtl;line-height:1.5}.surah-title-latin-mini{font-size:1.25rem;font-weight:800;margin:0;color:var(--text-primary);white-space:nowrap;letter-spacing:-.5px}.juz-badge-mini{background:var(--accent-gradient);color:#fff;padding:2px 8px;border-radius:6px;font-size:.75rem;font-weight:700;white-space:nowrap;box-shadow:0 2px 5px #0000001a}.hafalan-progress-badge{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--bg-tertiary);padding:4px 10px;border-radius:10px;border:1px solid var(--border-primary);min-width:90px;flex-shrink:0}.hpb-text{font-size:.65rem;font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:.5px}.hpb-bar-bg{width:100%;height:4px;background:#ffffff4d;border-radius:2px;overflow:hidden}.hpb-bar-fill{height:100%;background:#4ade80;transition:width .5s cubic-bezier(.4,0,.2,1)}.controls-group-mini{display:flex;align-items:center;gap:10px}.page-nav-controls{display:flex;flex-direction:row-reverse;align-items:center;gap:8px;background:#fff3;padding:6px 12px;border-radius:50px;border:1px solid rgba(255,255,255,.3)}.page-nav-controls button{background:transparent;border:none;color:var(--text-primary);cursor:pointer;font-size:1.1rem;padding:2px 6px;border-radius:4px;transition:background .2s}.page-nav-controls button:hover:not(:disabled){background:#fff3}.page-nav-controls button:disabled{opacity:.5;cursor:not-allowed}.page-nav-controls input{background:#0003;border:1px solid rgba(255,255,255,.3);color:var(--text-primary);padding:4px;border-radius:6px;width:60px!important;text-align:center;font-weight:700}.page-nav-controls input:focus{outline:none;border-color:#fff;background:#0006}.qori-compact-mini{display:flex;align-items:center;gap:6px;background:#fff3;padding:4px 10px;border-radius:50px;border:1px solid rgba(255,255,255,.3);transition:all .3s ease}.qori-compact-mini:hover{background:#ffffff4d;border-color:#ffffff80}.qori-compact-mini:before{content:"🎙️ Qori:";font-size:.7rem;font-weight:700;color:var(--text-primary);white-space:nowrap}.qori-compact-mini select{background:transparent;border:none;color:var(--text-primary)!important;font-size:.85rem;font-weight:700;border-radius:4px;padding:2px 18px 2px 0;outline:none;cursor:pointer;text-transform:capitalize;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%236B7280' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right center}.qori-compact-mini select option{background:var(--bg-secondary);color:var(--text-primary);font-weight:500}.progress-mini-btn{text-decoration:none;font-size:.9rem;padding:2px 8px;background:#ffffff40;border-radius:4px;color:#fff}.header-features-row-legacy{display:flex;justify-content:space-between;align-items:center;width:100%;padding:2px 0;border-top:1px solid var(--border-primary)}.feat-btn-mini{background:transparent;border:none;font-size:1.1rem;padding:4px;cursor:pointer;transition:all .2s;border-radius:6px;display:flex;align-items:center;justify-content:center;color:var(--text-primary)}.feat-btn-mini:hover{background:#fff3;transform:translateY(-2px)}.feat-btn-mini[title*=Audio]:hover,.feat-btn-mini[title*=Hentikan]:hover,.feat-btn-mini[title*=Matikan]:hover{background:#ef444466!important}.feat-btn-mini.active{background:#fff;color:var(--accent-primary);box-shadow:0 0 10px #fff6}[data-theme=light] .detail-header .feat-btn-mini.active{background:var(--accent-primary);color:#fff;box-shadow:0 2px 8px #0ca88e66}.bismillah{padding:3rem;text-align:center;font-family:KFGQPC,serif;font-size:3rem;color:var(--text-primary);background:var(--bg-secondary);border-radius:24px;margin-bottom:2rem;border:1px solid var(--border-secondary)}.verses-list{padding:1rem}.search-wrapper{position:relative;display:flex;align-items:center;background:var(--bg-secondary);border:1px solid var(--border-secondary);border-radius:18px;padding:0 1.2rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.ai-loader-dots{display:flex;gap:4px;margin-left:10px}.ai-loader-dots span{width:6px;height:6px;background:var(--accent-primary);border-radius:50%;animation:ai-pulse 1.4s infinite ease-in-out both}.ai-loader-dots span:nth-child(1){animation-delay:-.32s}.ai-loader-dots span:nth-child(2){animation-delay:-.16s}@keyframes ai-pulse{0%,80%,to{transform:scale(0);opacity:.3}40%{transform:scale(1);opacity:1}}.ai-suggestion-banner{margin-top:10px;padding:12px 18px;background:linear-gradient(135deg,rgba(var(--accent-primary-rgb),.1),rgba(var(--accent-secondary-rgb),.05));border:1px dashed var(--accent-primary);border-radius:15px;font-size:.95rem;color:var(--text-primary);cursor:pointer;animation:slideDownIn .4s ease-out;display:flex;align-items:center;gap:10px;transition:all .2s ease}.ai-suggestion-banner:hover{background:linear-gradient(135deg,rgba(var(--accent-primary-rgb),.15),rgba(var(--accent-secondary-rgb),.1));transform:translateY(-2px);box-shadow:0 4px 12px rgba(var(--accent-primary-rgb),.1)}.uda-zoni-avatar-mini{width:38px;height:38px;border-radius:50%;border:2px solid white;box-shadow:0 2px 8px #0000001a;flex-shrink:0}.ai-suggestion-content{flex:1}.ai-sparkle{font-weight:800;color:var(--accent-primary);background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}@keyframes slideDownIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.verse-item{padding:clamp(1.5rem,5vw,3rem);background:var(--bg-card);border:1px solid var(--border-secondary);border-radius:28px;margin-bottom:2.5rem;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:var(--shadow-sm);display:flex;flex-direction:column}.verse-item:before{content:"";position:absolute;inset:10px;border:1px solid rgba(181,158,111,.3);pointer-events:none;border-radius:8px}.verse-item:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:var(--accent-primary)}.verse-item.playing{background:var(--bg-card);border-color:var(--accent-primary);box-shadow:0 0 0 2px var(--accent-primary),0 10px 40px rgba(var(--accent-shadow-rgb),.2);transform:scale(1.02);z-index:10;animation:versePop .5s ease forwards}@keyframes versePop{0%{transform:scale(1);border-color:transparent}50%{transform:scale(1.03)}to{transform:scale(1.02);border-color:var(--accent-primary)}}.verse-item.playing:after{content:"NOW READING";position:absolute;top:1rem;left:50%;transform:translate(-50%);font-size:.65rem;font-weight:800;color:var(--accent-primary);letter-spacing:2px;background:var(--bg-primary);padding:2px 10px;border-radius:20px;box-shadow:0 2px 10px #0000001a;animation:fadeIn .5s ease forwards}.verse-item.selected{background:#fff176!important;border-color:#fbc02d;box-shadow:0 4px 15px #fbc02d4d}.verse-item.selected .verse-arabic{color:#333!important}.verse-top{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:2rem;gap:1.5rem;width:100%}.verse-arabic{font-family:KFGQPC,serif;font-size:clamp(2rem,8vw,2.8rem);line-height:2.2;text-align:center;color:var(--text-primary);width:100%;word-spacing:.5rem;direction:rtl;transition:color .3s ease}.verse-arabic.hidden-text{color:transparent!important;-webkit-user-select:none;user-select:none}.verse-translation{font-size:1.05rem;line-height:1.6;color:var(--text-secondary)}.translation-group{display:flex;flex-direction:column;gap:.8rem}.translation-text{margin:0;display:flex;gap:10px;align-items:flex-start}.lang-icon{font-size:1.1rem;min-width:24px}.verse-actions{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:clamp(1rem,3vw,2.5rem);width:100%;padding:1.5rem 0;margin-top:2rem;border-top:1px solid var(--border-secondary)}.audio-btn,.hafalan-btn,.voice-btn{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:14px;padding:.6rem;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .25s ease;color:var(--text-primary);font-size:1.1rem}.audio-btn:hover,.hafalan-btn:hover:not(.active),.voice-btn:hover{background:var(--accent-gradient);color:#fff;transform:scale(1.1);box-shadow:var(--shadow-sm)}.hafalan-btn.active{background:var(--success);color:#fff;border-color:var(--success)}.mushaf-ayah-end.memorized{position:relative}.mushaf-ayah-end.memorized:after{content:"✓";position:absolute;top:-12px;left:50%;transform:translate(-50%);background:#10b981;color:#fff;width:clamp(16px,4vw,22px);height:clamp(16px,4vw,22px);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:clamp(10px,2.5vw,12px);font-weight:800;box-shadow:0 2px 5px #0000004d;border:2px solid white;z-index:5}.audio-btn.playing{background:var(--error);border-color:var(--error);color:#fff;animation:pulse 1.5s infinite}.hafalan-btn.active{background:#10b981;border-color:#10b981;color:#fff;box-shadow:0 4px 12px #10b9814d}.hafalan-btn{border-radius:50%!important;font-weight:800}.voice-btn.recording{background:var(--warning);border-color:var(--warning);animation:flash 1s infinite}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.view-mode-selector-wrapper{display:flex;justify-content:center;margin-bottom:2rem;perspective:1000px}.view-mode-selector{display:flex;background:var(--bg-card);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:6px;border:1px solid var(--border-secondary);box-shadow:var(--shadow-md);position:relative;z-index:10}.word-v2{font-family:KFGQPC,Amiri,serif;display:inline-block;padding:.2rem .4rem;border-radius:4px;cursor:pointer;transition:all .2s;font-size:2.8rem;line-height:1.8}.mode-btn{border:none;background:transparent;color:var(--text-muted);padding:.8rem 1.8rem;border-radius:12px;cursor:pointer;font-size:.95rem;font-weight:700;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:10px;position:relative;overflow:hidden}.mode-btn.active{background:var(--accent-gradient);color:#fff;box-shadow:0 8px 20px rgba(var(--accent-shadow-rgb),.4);transform:scale(1.05)}.mode-btn:not(.active):hover{background:var(--bg-secondary);color:var(--text-primary)}.surah-selector-container{transition:all .3s ease}.surah-selector-container select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:35px!important}.surah-selector-container select option{background:var(--bg-secondary);color:var(--text-primary)}.surah-selector-container:focus-within{border-color:var(--accent-primary)!important;box-shadow:0 0 10px rgba(var(--accent-shadow-rgb),.2)}.mushaf-container{padding:clamp(.5rem,2vw,2rem);padding-bottom:10rem;background:var(--bg-secondary);display:flex;flex-direction:column;align-items:center;gap:3rem}.mushaf-page-wrapper{width:100%;max-width:min(900px,100vw - 2rem);perspective:2000px}.mushaf-page-paper{background:#fffdf7;padding:3rem 2rem;border-radius:4px;box-shadow:0 4px 15px #00000014,0 1px 4px #0000000a;position:relative;width:100%;min-height:1000px;display:flex;flex-direction:column;container-type:inline-size;border:1px solid #e8e3d5;margin:1.5rem auto;transition:transform .3s ease;color:#2d2d2d}.mushaf-page-paper:before{content:"";position:absolute;inset:0;border:1px solid #c0b7a0;margin:5px;pointer-events:none;border-radius:2px}.mushaf-page-header{display:flex;justify-content:space-between;align-items:center;padding:0 2rem;font-size:.9rem;font-weight:600;color:#5c5340;margin-top:1cqw}.mushaf-vertical-stack{display:flex;flex-direction:column;align-items:center;width:100%;gap:0}.mushaf-page-container{width:100%;display:flex;flex-direction:column;align-items:center}.mushaf-page-divider{width:100%;height:40px;background:transparent;margin:1rem 0}.page-num-badge{color:var(--accent-primary);font-size:1.2rem;font-weight:700;font-family:KFGQPC,serif;opacity:.6}.mushaf-surah-header{text-align:center;padding:2.5rem 1rem;margin:3rem 0 1.5rem;background:rgba(var(--accent-primary-rgb),.03);border-top:1px solid var(--accent-primary);border-bottom:1px solid var(--accent-primary);border-radius:0;position:relative;z-index:2;box-shadow:none}.surah-title-arabic{font-family:KFGQPC,serif;font-size:6cqw;color:#2d2d2d;margin:0;line-height:1}.surah-title-latin-large{font-size:3.5rem;font-weight:900;color:var(--text-primary);margin:0;line-height:1.1;letter-spacing:-2px;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-transform:uppercase}.bismillah-arabic{font-family:KFGQPC,serif;font-size:2.25rem;color:#2d2d2d;margin:1.25rem 0;text-align:center;line-height:1.2}.mushaf-text-area{direction:rtl;text-align:justify;text-justify:inter-word;line-height:3;padding:1rem 0;z-index:2;width:100%;font-family:KFGQPC,serif}.mushaf-hidden-placeholder{display:inline-block;background:#b59e6f14;border:1px dashed #b59e6f;border-radius:8px;padding:2px 12px;margin:0 4px;cursor:pointer;vertical-align:middle;transition:all .2s ease}.mushaf-placeholder-text{font-size:.85rem;color:#8c734b;font-family:Inter,sans-serif;font-weight:600}.mushaf-ayah-group{display:inline;cursor:pointer;transition:background .3s ease;border-radius:6px;white-space:normal}.mushaf-ayah-group.active{background:#b59e6f26}.mushaf-ayah-group.selected{background:#fff176cc!important;border-radius:4px;box-shadow:0 0 15px #fff17666}.mushaf-word-span{display:inline;padding:0 1px;transition:all .2s ease;font-size:clamp(1.6rem,4.5cqw,2.5rem);word-spacing:normal}.mushaf-word-span:hover{background:#b59e6f33;color:var(--accent-primary)}.mushaf-word-span.playing{color:var(--accent-primary);text-shadow:0 0 10px rgba(181,158,111,.4);background:#b59e6f1a}.mushaf-ayah-end{display:inline-flex;align-items:center;justify-content:center;position:relative;margin:0 10px;vertical-align:middle}@keyframes pulse-mic{0%{transform:scale(1);box-shadow:0 0 #ef444466}70%{transform:scale(1.1);box-shadow:0 0 0 10px #ef444400}to{transform:scale(1);box-shadow:0 0 #ef444400}}.mushaf-ayah-actions-mini{display:flex;align-items:center;gap:8px;margin-right:12px;background:rgba(var(--accent-primary-rgb),.05);padding:4px 8px;border-radius:20px;border:1px solid rgba(var(--accent-primary-rgb),.1)}.mushaf-mic-btn{background:transparent;border:none;cursor:pointer;font-size:1.1rem;padding:2px;transition:transform .2s ease;display:flex;align-items:center;justify-content:center}.mushaf-mic-btn:hover{transform:scale(1.2)}.mushaf-mic-btn.recording{animation:pulse-recording 1.5s infinite}@keyframes pulse-recording{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}to{opacity:1;transform:scale(1)}}.ayah-end-main{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;position:relative;cursor:pointer;margin:0 5px;background:none!important}.memorized-check{position:absolute;top:-6px;right:-6px;left:auto;transform:none;background:#27ae60;color:#fff;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;box-shadow:0 2px 4px #0003;border:2px solid white;z-index:5;animation:bounceIn .5s cubic-bezier(.68,-.55,.265,1.55)}@keyframes bounceIn{0%{transform:translate(-50%) scale(0);opacity:0}to{transform:translate(-50%) scale(1);opacity:1}}.ayah-num-arabic{font-size:1.8rem;font-weight:800;color:var(--accent-primary);font-family:KFGQPC,serif;line-height:1}.blurred-text{filter:blur(10px);opacity:.3}@media(max-width:1024px){.alquran-container{padding:2rem}}@media(max-width:768px){.surah-detail-container{padding-top:100px}.detail-header{left:0;padding:4px .6rem}.surah-title-mini{font-size:1rem}.feat-btn-mini{font-size:1rem;width:30px;height:30px}.mushaf-ayah-text{font-size:1.8rem}}@media(max-width:480px){.alquran-container{padding:0!important;margin:0!important}.surah-detail-container{max-width:100%;padding-top:100px}.mushaf-container{padding:0;gap:0}.mushaf-page-wrapper{max-width:100%;margin:0}.mushaf-page-paper{padding:10cqw 6cqw 5cqw;border-radius:0;border-left:none;border-right:none;width:100vw;aspect-ratio:8.5 / 14}.mushaf-page-paper:before,.mushaf-page-paper:after{left:2cqw;right:2cqw}.mushaf-text-area{padding:0 1.5cqw 6cqh;line-height:5.6cqh}.mushaf-ayah-text{font-size:2.3cqh}.verse-item{padding:1.5rem 1rem;border-radius:20px}.verse-actions{gap:1.5rem}.audio-btn,.hafalan-btn,.voice-btn{width:48px;height:48px;font-size:1.2rem}.qori-compact-mini select{padding:4px 6px;font-size:.85rem}}@media print{.sidebar,.navbar,.detail-header,.features-group,.alquran-header,.search-container,.back-button{display:none!important}body{background:#fff!important}.mushaf-page-paper{box-shadow:none!important;border:none!important;width:100%!important}}@media(max-width:768px){.mushaf-container{padding:0}.mushaf-page-paper{min-height:auto;padding:1rem .5rem;border-radius:0;border:none}.mushaf-text-area{padding:1.5rem 1rem;line-height:2.4}.mushaf-word-span{font-size:1.5rem}.mushaf-ayah-end{width:35px;height:35px}}.verse-highlight-band{display:none}.mushaf-word-hitbox{position:absolute;cursor:pointer;z-index:10;transition:background .2s ease}.mushaf-word-hitbox:hover{background:#b59e6f26}.mushaf-word-hitbox.word-hovered{background:#b59e6f33;box-shadow:0 0 10px #b59e6f4d}.verse-highlight-band-mini{position:absolute;inset:0;background:#ffa500a6;mix-blend-mode:screen;pointer-events:none;animation:fadeIn .3s ease}.mushaf-page-paper{background:#fbf8f3;width:100%;max-width:900px;min-height:auto;height:auto;flex-direction:column;overflow:visible}.mushaf-word-tooltip{position:fixed;transform:translate(-50%,-100%);background:var(--bg-card);border:1px solid var(--accent-primary);padding:12px;border-radius:12px;box-shadow:0 10px 30px #0000004d;z-index:3000;pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:120px;max-width:250px;text-align:center;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:tooltip-pop .2s cubic-bezier(.175,.885,.32,1.275)}@keyframes tooltip-pop{0%{opacity:0;transform:translate(-50%,-90%) scale(.9)}to{opacity:1;transform:translate(-50%,-100%) scale(1)}}.tooltip-arabic{font-family:KFGQPC,serif;font-size:1.5rem;color:var(--accent-primary);line-height:1.2;direction:rtl}.ayat-text{font-family:KFGQPC,Amiri,serif;font-size:2.5rem;line-height:2;color:var(--text-primary);direction:rtl;flex:1;margin-bottom:1rem}.tooltip-transliteration{font-size:.8rem;color:var(--text-muted);font-style:italic}.tooltip-translation{font-size:.9rem;font-weight:600;color:var(--text-primary)}.playing-indicator-overlay{bottom:20px;font-size:.9rem;padding:8px 16px;position:fixed;right:20px;background:var(--bg-card);border:1px solid var(--accent-primary);border-radius:20px;z-index:1000}.surah-selector-wrapper{margin-left:10px}.surah-select-mini{background:#ffffff1a;border:1px solid rgba(255,255,255,.3);color:#fff!important;padding:4px 25px 4px 10px;border-radius:8px;font-size:.9rem;font-weight:600;cursor:pointer;max-width:150px;outline:none;transition:all .2s ease;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}.surah-select-mini option{background:var(--bg-secondary);color:var(--text-primary)}.surah-select-mini:hover,.surah-select-mini:focus{border-color:var(--accent-primary);background:rgba(var(--accent-primary-rgb),.05)}.surah-card-actions{position:absolute;right:50px;top:50%;transform:translateY(-50%);display:flex;gap:8px;opacity:0;transition:all .3s ease}.surah-card:hover .surah-card-actions{opacity:1;right:60px}.mushaf-mic-btn-end{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.85rem;transition:all .2s ease;box-shadow:0 2px 4px #0000000d}.mushaf-mic-btn-end:hover{transform:scale(1.1);border-color:var(--accent-primary);color:var(--accent-primary)}.mushaf-mic-btn-end.recording{background:#fee2e2;border-color:#ef4444;color:#ef4444;animation:pulse-mic 1.5s infinite}.btn-card-mushaf{background:rgba(var(--accent-primary-rgb),.1);border:1px solid var(--accent-primary);color:var(--accent-primary);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;transition:all .2s ease}.btn-card-mushaf:hover{background:var(--accent-primary);color:#fff;transform:scale(1.1)}@media(max-width:768px){.surah-card-actions{opacity:1;right:40px;position:relative;transform:none;top:auto;margin-top:10px;justify-content:flex-end}.surah-select-mini{max-width:120px;font-size:.8rem}.detail-header{padding:4px 8px}.header-features-row{overflow-x:auto;justify-content:flex-start!important;gap:15px;padding:8px 0;scrollbar-width:none;-ms-overflow-style:none}.header-features-row::-webkit-scrollbar{display:none}.qori-compact-mini{padding:3px 8px;flex-shrink:0}.feat-btn-mini{flex-shrink:0}.page-nav-controls{padding:4px 8px;scale:.9}}@media(max-width:480px){.detail-header-top{flex-wrap:wrap;gap:8px}.nav-group-mini{width:100%;justify-content:space-between}.controls-group-mini{width:100%;justify-content:center}.surah-detail-container{padding-top:130px}.mushaf-page-paper{padding:1.5rem 1rem}.verse-arabic{font-size:1.8rem}}@media(min-width:769px)and (max-width:1024px){.detail-header{padding:8px 1.5rem}.surah-detail-container{max-width:90%}}.voice-feedback-card{margin-top:1.5rem;padding:1.2rem;border-radius:18px;animation:slideUp .3s ease-out;border-left:6px solid #ccc;background:#1a1a1a;color:#fff!important;box-shadow:0 4px 15px #0003}.voice-feedback-card.success{border-left-color:#10b981;background:#064e3b}.voice-feedback-card.failed{border-left-color:#ef4444;background:#7f1d1d}.feedback-header span,.feedback-header div,.feedback-hint{color:#fff!important}.feedback-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.8rem;font-weight:700}.feedback-diff{font-size:1.1rem;line-height:1.8;background:#00000040;color:#fff!important;padding:1rem;border-radius:12px}[data-theme=dark] .feedback-diff{background:#0006}.diff-word{padding:2px 4px;border-radius:4px}.diff-word.correct{color:#34d399!important}.diff-word.wrong{color:#f87171!important;text-decoration:line-through}.diff-word.missing{color:#fbbf24!important;border-bottom:2px dashed #fbbf24}.diff-word.wrong{color:var(--error);text-decoration:line-through}.diff-word.missing{color:var(--warning);border-bottom:2px dashed var(--warning)}.feedback-hint{margin-top:.8rem;font-size:.9rem;font-style:italic;color:var(--text-muted)}.feedback-header-left{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.status-hafalan-badge{display:inline-block;padding:2px 10px;border-radius:20px;font-size:.75rem;font-weight:700;background:rgba(var(--accent-primary-rgb, 13, 148, 136),.15);color:var(--accent-primary);letter-spacing:.5px}.score-ring{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;font-weight:800;font-size:.85rem;border:3px solid;flex-shrink:0;transition:all .3s ease}.score-ring.high{border-color:#10b981;color:#10b981;background:#10b9811a;box-shadow:0 0 12px #10b98133}.score-ring.mid{border-color:#f59e0b;color:#f59e0b;background:#f59e0b1a;box-shadow:0 0 12px #f59e0b33}.score-ring.low{border-color:#ef4444;color:#ef4444;background:#ef44441a;box-shadow:0 0 12px #ef444433}.score-value{font-variant-numeric:tabular-nums}.tajwid-notes-section{margin-top:1rem;padding:.8rem 1rem;background:rgba(var(--accent-primary-rgb, 13, 148, 136),.05);border-radius:12px;border:1px solid rgba(var(--accent-primary-rgb, 13, 148, 136),.15)}.tajwid-notes-title{font-weight:700;font-size:.85rem;color:var(--accent-primary);margin-bottom:.5rem}.tajwid-note-item{display:flex;align-items:flex-start;gap:8px;padding:6px 0;font-size:.82rem;line-height:1.5;color:var(--text-secondary);border-bottom:1px solid rgba(var(--accent-primary-rgb, 13, 148, 136),.08)}.tajwid-note-item:last-child{border-bottom:none}.tajwid-huruf{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;background:var(--accent-primary);color:#fff;font-size:1.1rem;font-weight:700;flex-shrink:0;font-family:KFGQPC,Amiri,serif}.tajwid-hint{flex:1}.mvf-score{display:inline-block;padding:2px 8px;border-radius:10px;font-weight:800;font-size:.8rem}.mvf-score.high{background:#10b98126;color:#10b981}.mvf-score.mid{background:#f59e0b26;color:#f59e0b}.mvf-score.low{background:#ef444426;color:#ef4444}.mvf-tajwid{margin-top:6px;padding-top:6px;border-top:1px solid var(--border-secondary);font-size:.75rem;color:var(--text-muted)}.mvf-tajwid-item{display:flex;align-items:center;gap:5px;padding:3px 0}.mvf-tajwid-item .tajwid-huruf{width:22px;height:22px;font-size:.85rem;border-radius:6px}.diff-word.close{color:#f59e0b;text-decoration:underline wavy #f59e0b}.mushaf-voice-feedback{position:absolute;bottom:-60px;left:50%;transform:translate(-50%);z-index:100;min-width:200px;max-width:350px;background:#1a1a1a;color:#fff!important;padding:.8rem 1.2rem;border-radius:15px;box-shadow:0 10px 30px #0006;border:1px solid rgba(255,255,255,.1);animation:fadeIn .3s ease}.mushaf-voice-feedback.success{background:#064e3b;border-bottom:4px solid #10b981}.mushaf-voice-feedback.failed{background:#7f1d1d;border-bottom:4px solid #ef4444}.mushaf-ayah-group.active{color:#2e7d32!important;transition:color .3s ease}.mushaf-ayah-group.active .mushaf-word-span{color:#2e7d32!important}.mvf-text{font-size:.9rem;color:#fff!important;text-align:center}.verse-number-circle{display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--accent-primary);font-size:2.2rem;margin-bottom:1.5rem;background:transparent}@keyframes slideUp{0%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}.surah-content-footer{text-align:center;margin-top:2rem;padding:2rem;background:var(--bg-card);border-radius:20px;border:1px solid var(--border-secondary)}.footer-count{color:var(--text-muted);font-weight:600;margin-bottom:1rem}.footer-warning{color:var(--warning);font-weight:700;margin-bottom:1rem}.refresh-surah-btn{background:var(--bg-tertiary);color:#fff;border:none;padding:.8rem 1.5rem;border-radius:50px;font-weight:700;cursor:pointer;transition:all .3s ease;display:inline-flex;align-items:center;gap:8px}.refresh-surah-btn:hover{background:var(--accent-primary);box-shadow:0 4px 12px #0d94884d;transform:translateY(-2px)}@media(max-width:768px){.dashboard-main.alquran-detail-view{margin-left:0!important;width:100%!important}.alquran-detail-view .detail-header{left:0!important;width:100%!important}}.tafsir-list{display:flex;flex-direction:column;gap:2rem;padding:2rem 0 5rem;max-width:900px;margin:0 auto}.tafsir-item{background:var(--bg-card, #ffffff);border-radius:16px;padding:2rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;border:1px solid var(--border-secondary, #e2e8f0)}.tafsir-ayat-num{display:inline-block;background:var(--accent-primary, #0d9488);color:#fff;padding:.25rem 1rem;border-radius:9999px;font-size:.9rem;font-weight:600;margin-bottom:1.5rem}.tafsir-content{display:flex;flex-direction:column;gap:1.5rem}.tafsir-section{position:relative;padding-left:1.5rem;border-left:4px solid var(--accent-primary, #0d9488)}.tafsir-section.en{border-left-color:#3b82f6;margin-top:1rem}.tafsir-text{font-size:1.1rem;line-height:2;color:var(--text-primary, #1e293b);text-align:justify;white-space:pre-wrap;font-family:Inter,system-ui,sans-serif}.lang-badge{font-size:1.2rem;margin-right:.5rem;vertical-align:middle;display:inline-block}@media(prefers-color-scheme:dark){.tafsir-item{background:var(--bg-card, #1e293b);border-color:var(--border-secondary, #334155)}.tafsir-text{color:var(--text-primary, #f1f5f9)}}@media(max-width:640px){.tafsir-item{padding:1.25rem}.tafsir-text{font-size:1rem;line-height:1.8}}.mabruk-modal-overlay{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10000;display:flex;align-items:center;justify-content:center;padding:2rem}.mabruk-modal-content{background:var(--bg-card);width:100%;max-width:500px;border-radius:40px;padding:3.5rem 2.5rem 3rem;text-align:center;border:1px solid var(--border-secondary);box-shadow:0 30px 60px #00000080;position:relative;overflow:hidden}.mabruk-modal-content:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right,var(--accent-primary-light),transparent 70%);opacity:.1;pointer-events:none}.mabruk-confetti{font-size:3rem;position:absolute;top:20px;left:0;right:0;pointer-events:none;animation:bounceSlow 3s infinite}.mabruk-badge{font-size:5rem;margin-bottom:1.5rem;filter:drop-shadow(0 10px 20px rgba(241,196,15,.4));animation:scalePulse 2s infinite ease-in-out}.mabruk-header h2{font-size:2.2rem;font-weight:800;margin-bottom:.5rem;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.mabruk-header p{color:var(--text-muted);font-size:1.1rem;margin-bottom:1.5rem}.mabruk-surah-name{font-family:Scheherazade New,serif;font-size:3.5rem;color:var(--accent-primary);margin:1.5rem 0;line-height:1;direction:rtl}.mabruk-body{border-top:1px solid var(--border-secondary);padding-top:2rem;margin-top:1rem}.mabruk-body p{color:var(--text-muted);font-size:1rem;line-height:1.7;font-style:italic}.mabruk-footer{margin-top:2.5rem}.mabruk-btn{width:100%;padding:1.2rem;font-size:1.1rem;font-weight:700;border:none;border-radius:20px;background:var(--accent-gradient);color:#fff;cursor:pointer;box-shadow:0 10px 25px #0ca88e4d;transition:all .3s cubic-bezier(.4,0,.2,1)}.mabruk-btn:hover{transform:translateY(-5px) scale(1.02);box-shadow:0 15px 35px #0ca88e80}@keyframes scalePulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}@keyframes bounceSlow{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.animate-pop{animation:popIn .5s cubic-bezier(.34,1.56,.64,1)}@keyframes popIn{0%{opacity:0;transform:scale(.5) translateY(30px)}to{opacity:1;transform:scale(1) translateY(0)}}.last-read-highlight{border-color:var(--accent-primary)!important;background:rgba(var(--accent-primary-rgb),.05)!important;box-shadow:0 0 15px rgba(var(--accent-primary-rgb),.2)!important}.last-read-badge{position:absolute;top:10px;right:10px;background:var(--accent-primary);color:#fff;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:.9rem;box-shadow:0 4px 10px #0ca88e4d;z-index:10;animation:bounce 2s infinite}.last-read-verse{border-left:6px solid var(--accent-primary)!important;background:rgba(var(--accent-primary-rgb),.03)!important}.bookmark-btn{background:transparent;border:none;font-size:1.2rem;cursor:pointer;transition:all .3s ease;opacity:.6;padding:5px;border-radius:8px}.bookmark-btn:hover{opacity:1;background:rgba(var(--accent-primary-rgb),.1);transform:scale(1.1)}.bookmark-btn.active{opacity:1;color:var(--accent-primary);transform:scale(1.2)}.mushaf-bookmark-btn{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.85rem;transition:all .2s ease;box-shadow:0 2px 4px #0000000d}.mushaf-bookmark-btn:hover{transform:scale(1.1);border-color:var(--accent-primary);color:var(--accent-primary)}.mushaf-bookmark-btn.active{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-5px)}60%{transform:translateY(-3px)}}.sync-indicator{display:flex;align-items:center;gap:6px;font-size:.8rem;font-weight:600;padding:4px 10px;border-radius:20px;background:var(--bg-card);border:1px solid var(--border-secondary)}.sync-indicator.syncing{color:var(--accent-primary)}.sync-indicator.saved{color:var(--success)}.sync-indicator.error{color:var(--error)}.sync-icon-spin{display:inline-block;animation:rotate 2s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.mon-main-p{padding:2rem;max-width:1400px;margin-left:260px;animation:fadeIn .5s ease-out;transition:all .3s ease}.mon-header-p{margin-bottom:3rem;display:flex;justify-content:space-between;align-items:center;gap:2rem}.mon-title-p h1{font-size:clamp(1.75rem,5vw,2.5rem);font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.mon-title-p p{color:var(--text-muted);font-size:clamp(.9rem,2vw,1.1rem)}.mon-selector-p{background:var(--bg-secondary);border-radius:28px;padding:2rem;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary);margin-bottom:3rem}.mon-sel-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.mon-sel-header-p h3{font-size:1.1rem;font-weight:800;color:var(--text-secondary);margin:0}.mon-search-p input{padding:.8rem 1.5rem;border-radius:14px;border:1.5px solid var(--border-secondary);background:var(--bg-primary);width:300px;max-width:100%;font-weight:600;transition:all .2s}.mon-search-p input:focus{border-color:var(--accent-primary);background:var(--bg-secondary);box-shadow:0 0 0 4px var(--accent-shadow)}.mon-tabs-p{display:flex;overflow-x:auto;gap:1rem;padding-bottom:.5rem;-webkit-overflow-scrolling:touch}.mon-tabs-p::-webkit-scrollbar{height:4px}.mon-tabs-p::-webkit-scrollbar-thumb{background:var(--border-primary);border-radius:4px}.mon-tab-p{background:var(--bg-primary);border:2px solid transparent;padding:1rem 1.5rem;border-radius:18px;cursor:pointer;transition:all .2s;text-align:center;min-width:120px}.mon-tab-p:hover{transform:translateY(-3px);border-color:#4f46e5}.mon-tab-p.is-active{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;box-shadow:0 10px 15px -3px #4f46e54d}.mon-tab-p span:first-child{display:block;font-weight:800;font-size:1rem}.mon-tab-p span:last-child{font-size:.8rem;font-weight:600;opacity:.8}.mon-section-p{background:var(--bg-secondary);border-radius:28px;padding:2.5rem;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary)}.mon-sec-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:2.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border-primary)}.mon-sec-header-p h2{font-size:clamp(1.2rem,3vw,1.5rem);font-weight:800;color:var(--text-primary)}.mon-badge-p{padding:.4rem 1rem;background:var(--success-bg);color:var(--success);border-radius:50px;font-weight:800;font-size:.75rem}.mon-table-container-p{overflow-x:auto;overflow-y:auto;max-height:65vh}.mon-table-p{width:100%;border-collapse:separate;border-spacing:0 .75rem}.mon-table-p th{text-align:left;padding:1rem 1.5rem;color:var(--text-muted);font-weight:700;font-size:.8rem;text-transform:uppercase;position:sticky;top:0;background:var(--bg-secondary);z-index:2}.mon-row-p{background:var(--bg-primary);transition:all .2s}.mon-row-p:hover{background:var(--bg-tertiary);transform:scale(1.01)}.mon-row-p td{padding:1.25rem 1.5rem}.mon-row-p td:first-child{border-radius:16px 0 0 16px}.mon-row-p td:last-child{border-radius:0 16px 16px 0}.mon-name-cell-p{display:flex;align-items:center;gap:1rem}.mon-avatar-p{width:40px;height:40px;background:var(--accent-gradient);color:#fff;border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:800}.mon-name-stack-p strong{display:block;color:var(--text-primary)}.mon-name-stack-p small{color:var(--accent-primary);font-weight:700}.mon-count-pill-p{padding:.4rem 1rem;background:#dcfce7;color:#15803d;border-radius:12px;font-weight:800;font-size:.9rem}.mon-bar-p{width:100%;height:8px;background:var(--border-primary);border-radius:10px;overflow:hidden;margin-bottom:.25rem}.mon-fill-p{height:100%;background:linear-gradient(90deg,#10b981,#34d399);border-radius:10px}.mon-btn-view-p{padding:.6rem 1.25rem;background:var(--bg-secondary);border:1.5px solid var(--border-secondary);border-radius:12px;color:var(--text-secondary);font-weight:700;cursor:pointer;transition:all .2s}.mon-btn-view-p:hover{border-color:var(--accent-primary);color:var(--accent-primary);background:var(--bg-tertiary)}.mon-modal-quran-p{max-width:700px;max-height:90vh;display:flex;flex-direction:column}.mon-modal-quran-p .form-p{overflow-y:auto;flex:1;min-height:0;max-height:calc(90vh - 120px)}.mon-hafalan-groups-p{max-height:none}.mon-modal-stats-p{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:2rem}.mon-modal-stat-card-p{background:var(--bg-primary);padding:1.5rem;border-radius:20px;text-align:center;border:1px solid var(--border-secondary)}.mon-modal-stat-card-p span:first-child{display:block;font-size:1.75rem;font-weight:800;color:var(--text-primary)}.mon-modal-stat-card-p span:last-child{font-size:.85rem;color:var(--text-muted);font-weight:600}.mon-hafalan-groups-p{display:flex;flex-direction:column;gap:1rem}.mon-surat-box-p{background:var(--bg-primary);padding:1.25rem;border-radius:18px;border:1px solid var(--border-secondary)}.mon-surat-title-p{font-weight:800;color:var(--accent-primary);border-bottom:1px dashed var(--border-secondary);padding-bottom:.5rem;margin-bottom:.75rem}.mon-ayat-badges-p{display:flex;flex-wrap:wrap;gap:.5rem}.mon-ayat-badge-p{background:var(--bg-secondary);padding:.25rem .75rem;border-radius:8px;font-size:.85rem;font-weight:700;color:var(--text-secondary);box-shadow:0 1px 2px #0000000d}@media(max-width:1024px){.mon-main-p{margin-left:240px;padding:1.5rem}.mon-header-p{flex-direction:column;align-items:flex-start;gap:1.5rem;margin-bottom:2rem}.mon-sel-header-p{flex-direction:column;align-items:flex-start;gap:1.25rem}.mon-search-p,.mon-search-p input{width:100%}}@media(max-width:768px){.mon-main-p{margin-left:0;padding-top:5rem}.mon-section-p{padding:1.5rem}.mon-table-container-p{overflow-x:auto;margin:0 -1rem;padding:0 1rem}.mon-table-p{min-width:600px}.mon-avatar-p{width:32px;height:32px;font-size:.8rem}.mon-row-p td{padding:1rem .75rem}}@media(max-width:480px){.mon-title-p h1{font-size:1.75rem}.mon-tabs-p{gap:.75rem}.mon-tab-p{min-width:100px;padding:.75rem 1rem}.mon-name-stack-p strong{font-size:.9rem}}.dashboard-main-premium{margin-left:260px;animation:fadeIn .5s ease-out}.bilingual-header{background:var(--accent-gradient);padding:4rem 2rem;color:#fff;text-align:center;border-radius:0 0 50px 50px;margin-bottom:4rem;box-shadow:0 15px 35px var(--accent-shadow);position:relative;overflow:hidden}.bilingual-header:after{content:"🌍";position:absolute;bottom:-20px;left:-20px;font-size:8rem;opacity:.1;transform:rotate(15deg)}.bilingual-header h1{font-size:2.75rem;font-weight:850;margin-bottom:1rem;letter-spacing:-1px;line-height:1.2}.bilingual-header p{font-size:1.25rem;opacity:.9;font-weight:500}.bilingual-teaser{margin:-2rem auto 3rem!important;max-width:900px}.surah-lock-overlay{position:absolute;inset:0;background:#0000001a;border-radius:28px;display:flex;align-items:center;justify-content:center;z-index:5}.surah-lock-overlay span{font-size:2.5rem;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}.levels-timeline{position:relative;max-width:900px;margin:0 auto;padding:0 2rem 4rem 60px}.timeline-line{position:absolute;left:20px;top:0;bottom:0;width:6px;background:var(--border-primary);border-radius:10px}.timeline-line.active{background:var(--accent-gradient)}.level-card-wrapper{position:relative;margin-bottom:2.5rem}.level-dot{position:absolute;left:-53px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;background:var(--bg-secondary);border:4px solid var(--border-primary);z-index:10;transition:all .4s;display:flex;align-items:center;justify-content:center}.level-dot.active{border-color:var(--accent-primary);background:var(--accent-primary);box-shadow:0 0 15px var(--accent-shadow)}.level-dot.completed{border-color:#22c55e;background:#22c55e;box-shadow:0 0 15px #22c55e66}.level-card{background:var(--bg-secondary);border-radius:28px;padding:2rem;display:flex;align-items:center;gap:2rem;cursor:pointer;transition:all .4s cubic-bezier(.175,.885,.32,1.275);border:1px solid var(--border-primary);box-shadow:var(--shadow-sm)}.level-card:hover:not(.locked){transform:translate(15px);box-shadow:0 25px 45px var(--accent-shadow);border-color:var(--accent-primary)}.level-card.locked{background:var(--bg-tertiary);opacity:.7;filter:grayscale(1);cursor:not-allowed}.level-icon{font-size:2.5rem;background:var(--bg-tertiary);width:80px;height:80px;min-width:80px;display:flex;align-items:center;justify-content:center;border-radius:20px}.level-info h3{font-size:1.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.level-info span{color:var(--text-muted);font-weight:600;font-size:1rem}.quiz-container{max-width:900px;margin:2rem auto;padding:0 1.5rem}.quiz-header{text-align:center;margin-bottom:3rem}.quiz-header h2{font-size:2rem;font-weight:850;color:var(--text-primary)}.question-card{background:var(--bg-secondary);padding:4rem 2rem;border-radius:40px;text-align:center;box-shadow:var(--shadow-md);margin-bottom:3rem;border:1px solid var(--border-primary)}.question-card h1{font-family:Amiri,serif;font-size:4.5rem;color:var(--text-primary);direction:rtl}.dual-options-container{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;margin-bottom:3rem}.language-section{background:var(--bg-tertiary);border-radius:32px;padding:2.5rem;border:1px solid var(--border-secondary)}.section-title{font-size:1.2rem;font-weight:850;text-align:center;margin-bottom:2rem;color:var(--text-secondary)}.options-grid{display:grid;gap:1.5rem}.option-btn{background:var(--bg-secondary);border:2px solid var(--border-secondary);padding:1.5rem;border-radius:20px;font-size:1.15rem;font-weight:700;color:var(--text-primary);cursor:pointer;transition:all .3s;display:flex;align-items:center;gap:1rem}.option-btn.selected{border-color:#fbbf24;background:#fffbeb;color:#b45309}.option-btn.correct{background:#22c55e;border-color:#22c55e;color:#fff}.option-btn.wrong{background:#ef4444;border-color:#ef4444;color:#fff}.checkbox-dummy{width:24px;height:24px;border-radius:6px;border:2.5px solid currentColor;display:flex;align-items:center;justify-content:center;flex-shrink:0}.result-screen{background:var(--bg-secondary);border-radius:50px;padding:5rem 3rem;text-align:center;box-shadow:var(--shadow-lg)}.score-circle{width:180px;height:180px;background:var(--bg-tertiary);border:8px solid #22c55e;border-radius:50%;margin:3rem auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.score-number{font-size:4rem;font-weight:900;color:#166534}.locked-modal-overlay{position:fixed;inset:0;background:#000000bf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:9999;padding:20px;animation:fadeIn .3s ease}.locked-modal-icon{font-size:4rem;margin-bottom:1rem;filter:drop-shadow(0 0 20px var(--accent-shadow))}.locked-modal-title{color:#fff;font-size:1.75rem;margin:0 0 1rem}.locked-modal-message strong{color:var(--accent-primary)}.locked-modal-btn{background:var(--accent-gradient);border:none;border-radius:14px;padding:14px 32px;color:#fff;font-weight:700;font-size:1rem;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px var(--accent-shadow)}.locked-modal-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4f46e566;filter:brightness(1.1)}@media(max-width:1024px){.dashboard-main-premium{margin-left:0;padding:0}}@media(max-width:768px){.bilingual-header{padding:4rem 1.5rem}.bilingual-header h1{font-size:2rem}.levels-timeline{padding-left:50px;padding-right:1rem}.dual-options-container{grid-template-columns:1fr}.question-card{padding:3rem 1.5rem;border-radius:30px}.question-card h1{font-size:3rem}.level-card{padding:1.5rem;gap:1rem}.level-icon{width:60px;height:60px;min-width:60px;font-size:1.75rem}}@media(max-width:480px){.locked-modal-content{padding:2rem 1.5rem}.locked-modal-icon{font-size:3rem}.locked-modal-title{font-size:1.5rem}.level-info h3{font-size:1.2rem}.level-dot{left:-43px;width:20px;height:20px}.timeline-line{left:15px}}.students-main-p{padding:2.5rem;max-width:1400px;margin-left:260px;animation:fadeIn .5s ease-out}.s-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:3rem;gap:2rem}.s-header-info-p h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.s-header-info-p p{color:var(--text-muted);font-size:1.1rem}.s-btn-add-p{padding:1rem 2rem;background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;border:none;border-radius:16px;font-weight:700;cursor:pointer;box-shadow:0 10px 15px -3px #4f46e54d;transition:all .3s;display:flex;align-items:center;gap:.75rem}.s-btn-add-p:hover{transform:translateY(-3px);box-shadow:0 20px 25px -5px #4f46e566}.s-filters-p{background:var(--bg-secondary);padding:1.25rem 2rem;border-radius:20px;box-shadow:0 4px 6px -1px #0000000d;border:1px solid var(--border-primary);margin-bottom:2.5rem;display:flex;align-items:center;gap:1.5rem}.s-filters-p label{font-weight:700;color:var(--text-secondary);font-size:.9rem;text-transform:uppercase}.s-select-p{padding:.75rem 1.25rem;border-radius:12px;border:1.5px solid var(--border-secondary);font-weight:600;background:var(--bg-secondary);min-width:250px}.s-grid-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:2rem}.s-card-p{background:var(--bg-secondary);border-radius:24px;padding:2rem;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary);transition:all .3s;display:flex;flex-direction:column}.s-card-p:hover{transform:translateY(-8px);box-shadow:0 20px 25px -5px #0000001a}.s-card-top-p{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem}.s-avatar-p{width:64px;height:64px;background:#eef2ff;color:#4f46e5;border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:800}.s-actions-p{display:flex;gap:.5rem}.s-btn-icon-p{width:36px;height:36px;border-radius:10px;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}.s-btn-edit-p{background:#eff6ff;color:#3b82f6}.s-btn-delete-p{background:#fee2e2;color:#ef4444}.s-content-p h3{font-size:1.25rem;font-weight:800;color:var(--text-primary);margin-bottom:1rem}.s-meta-item-p{display:flex;justify-content:space-between;margin-bottom:.75rem;font-size:.95rem}.s-meta-item-p .lbl{color:var(--text-muted);font-weight:500}.s-meta-item-p .val{color:var(--text-primary);font-weight:700}.s-status-tag-p{margin-top:1rem;padding:.5rem 1rem;border-radius:10px;font-size:.8rem;font-weight:800;display:inline-block;width:fit-content}.s-status-tag-p.active{background:#dcfce7;color:#166534}.s-status-tag-p.inactive{background:#f1f5f9;color:#475569}@media(max-width:1024px){.students-main-p{margin-left:0;padding:5rem 1rem 2rem}.s-header-p{flex-direction:column;align-items:flex-start;gap:1.5rem;margin-bottom:2rem}.s-header-info-p h1{font-size:1.75rem}.s-btn-add-p{width:100%;justify-content:center}.s-filters-p{flex-direction:column;align-items:stretch;gap:1rem;padding:1.5rem}.s-select-p{min-width:0}}@media(max-width:640px){.s-grid-p{grid-template-columns:1fr}.s-avatar-p{width:48px;height:48px;font-size:1.25rem}}.classes-main-p{padding:2.5rem;max-width:1400px;margin-left:260px;animation:fadeIn .5s ease-out}@media(max-width:1024px){.classes-main-p{margin-left:0;padding:5rem 1rem 2rem}}.c-header-p{margin-bottom:3rem}.c-header-p h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.c-header-p p{color:var(--text-muted);font-size:1.1rem}.c-controls-p{background:var(--bg-secondary);padding:1.5rem;border-radius:20px;box-shadow:0 4px 6px -1px #0000000d;border:1px solid var(--border-primary);margin-bottom:2rem}.c-search-p{position:relative;max-width:500px}.c-search-p input{width:100%;padding:.75rem 1rem .75rem 3rem;border-radius:12px;border:1.5px solid var(--border-secondary);font-size:1rem;transition:all .2s}.c-search-p:before{content:"🔍";position:absolute;left:1.25rem;top:50%;transform:translateY(-50%);font-size:1rem;opacity:.5}.c-table-card-p{background:var(--bg-secondary);border-radius:24px;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary);overflow:hidden}.c-table-p{width:100%;border-collapse:collapse}.c-table-p th{background:var(--bg-primary);padding:1.25rem 2rem;text-align:left;font-size:.85rem;text-transform:uppercase;font-weight:700;color:var(--text-secondary);letter-spacing:.05em;border-bottom:1.5px solid var(--border-secondary)}.c-table-p td{padding:1.5rem 2rem;border-bottom:1px solid var(--border-primary);vertical-align:middle}.c-class-info-p strong{display:block;font-size:1.1rem;color:var(--text-primary);margin-bottom:.25rem}.c-class-info-p span{color:var(--text-muted);font-size:.85rem;font-weight:500}.c-walas-p{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;background:#eef2ff;color:#4f46e5;border-radius:12px;font-weight:700;font-size:.95rem;width:fit-content}.c-pengampu-list-p{display:flex;flex-wrap:wrap;gap:.5rem}.c-mapel-tag-p{padding:.25rem .75rem;background:var(--bg-tertiary);color:var(--text-secondary);border-radius:8px;font-size:.85rem;font-weight:600}.c-btn-edit-p{padding:.6rem 1.25rem;background:var(--bg-tertiary);color:var(--text-primary);border:none;border-radius:10px;font-weight:700;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:.5rem}.c-btn-edit-p:hover{background:var(--border-primary);transform:translate(-3px)}.c-modal-content-p{padding:2.5rem}.c-modal-header-p{margin-bottom:2rem}.c-form-grid-p{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.c-form-group-full-p{grid-column:1 / -1;background:var(--bg-primary);padding:1.5rem;border-radius:20px;border:1px solid var(--border-secondary)}@media(max-width:1024px){.c-form-grid-p{grid-template-columns:1fr}}.dashboard-layout{display:flex;min-height:100vh;background-color:var(--bg-primary)}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.dashboard-header h1{font-size:1.8rem;font-weight:800;margin:0;color:var(--text-primary)}.dashboard-header p{margin:.5rem 0 0;color:var(--text-muted)}.add-btn-premium{background:var(--accent-primary);color:#fff;border:none;padding:.8rem 1.5rem;border-radius:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.8rem;transition:all .2s;box-shadow:0 4px 6px -1px #4f46e533}.add-btn-premium:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #4f46e54d;background:var(--accent-secondary)}.add-btn-premium span{font-size:1.2rem;font-weight:700}.premium-input,.premium-select{padding:.75rem 1rem;border-radius:12px;border:1.5px solid var(--border-secondary);background:var(--bg-tertiary);color:var(--text-primary);font-size:.95rem;transition:all .2s}.premium-input:focus,.premium-select:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 4px var(--info-bg)}.table-container-premium{box-shadow:0 4px 6px -1px #0000000d}.premium-table{width:100%;border-collapse:collapse;text-align:left}.premium-table th{background:var(--bg-tertiary);padding:1.2rem 1.5rem;font-size:.8rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border-secondary)}.premium-table td{padding:1.2rem 1.5rem;border-bottom:1px solid var(--border-secondary);color:var(--text-primary);font-size:.95rem}.premium-table tr:last-child td{border-bottom:none}.premium-table tr:hover{background:var(--bg-primary)}.action-btn-mini{width:32px;height:32px;border-radius:8px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.9rem;transition:all .2s}.action-btn-mini.edit{background:#e0f2fe;color:#0369a1}.action-btn-mini.delete{background:#fee2e2;color:#b91c1c}.action-btn-mini:hover{transform:scale(1.1)}.modal-overlay{position:fixed;inset:0;background:#0f172a80;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}.modal-content-premium{background:var(--bg-secondary);border-radius:24px;padding:2.5rem;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 25px 50px -12px #00000040;animation:slideUp .3s ease-out}.form-group-p label{display:block;margin-bottom:.5rem;font-weight:600;font-size:.9rem;color:var(--text-primary)}.form-group-p textarea{width:100%;resize:vertical}.save-btn-premium{background:var(--accent-primary);color:#fff;border:none;padding:.8rem 2rem;border-radius:12px;font-weight:600;cursor:pointer}.btn-cancel{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border-secondary);padding:.8rem 2rem;border-radius:12px;font-weight:600;cursor:pointer}.btn-cancel:hover{background:#e2e8f0}.stat-card-premium{transition:all .3s cubic-bezier(.4,0,.2,1)}.stat-card-premium:hover{transform:translateY(-5px);box-shadow:0 10px 15px -3px #0000001a}.kasus-saya-main-p{padding:2.5rem;max-width:1000px;margin-left:260px;animation:fadeIn .5s ease-out}@media(max-width:1024px){.kasus-saya-main-p{margin-left:0}}.kasus-saya-header-p{margin-bottom:3rem;text-align:center}.kasus-saya-header-p h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.kasus-saya-header-p p{color:var(--text-muted);font-size:1.1rem}.stats-grid-p{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-bottom:3rem}.stat-p{background:var(--bg-secondary);padding:1.5rem;border-radius:24px;box-shadow:var(--shadow-sm);border:1px solid var(--border-primary);display:flex;align-items:center;gap:1.25rem;transition:all .2s}.stat-p:hover{transform:translateY(-5px)}.stat-icon-p{width:60px;height:60px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:1.75rem;flex-shrink:0}.stat-info-p{display:flex;flex-direction:column}.stat-val-p{font-size:1.75rem;font-weight:800;color:var(--text-primary);line-height:1;margin-bottom:.25rem}.stat-lbl-p{font-size:.85rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.kasus-list-p{display:flex;flex-direction:column;gap:1.5rem}.card-kasus-p{background:var(--bg-secondary);border-radius:24px;padding:2rem;box-shadow:var(--shadow-sm);border:1px solid var(--border-primary);transition:all .3s;position:relative;overflow:hidden}.card-kasus-p:hover{box-shadow:0 20px 25px -5px #0000001a;border-color:#cbd5e1}.card-kasus-p.done{border-left:6px solid #22c55e}.card-kasus-p.pending{border-left:6px solid #f59e0b}.k-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.kat-badge-p{padding:.4rem .875rem;border-radius:10px;font-size:.75rem;font-weight:800;text-transform:uppercase}.k-date-p{font-size:.9rem;color:var(--text-disabled);font-weight:600}.k-desc-p{font-size:1.1rem;color:var(--text-primary);line-height:1.6;margin-bottom:1.5rem;font-weight:500}.k-sol-p{background:var(--bg-tertiary);padding:1.25rem;border-radius:16px;margin-bottom:1.5rem;border-left:4px solid #22c55e}.k-sol-p strong{display:block;color:#166534;margin-bottom:.25rem;font-size:.9rem}.k-sol-p p{margin:0;color:#166534;font-size:.95rem}.k-footer-p{display:flex;justify-content:space-between;align-items:center;padding-top:1.25rem;border-top:1px solid var(--border-primary)}.k-poin-p{font-weight:700;color:var(--text-muted)}.k-poin-p b{color:#ef4444;font-size:1.15rem}.k-poin-p.zero b{color:#22c55e}.k-stat-p{font-weight:700;font-size:.85rem;padding:.4rem 1rem;border-radius:20px}.k-stat-p.done{background:#dcfce7;color:#166534}.k-stat-p.pending{background:#fef3c7;color:#92400e}.empty-p{text-align:center;padding:5rem;background:var(--bg-tertiary);border-radius:32px;border:2px dashed var(--border-primary)}.empty-p .icon{font-size:5rem;margin-bottom:1rem}.empty-p h3{font-size:1.75rem;font-weight:800;color:#166534;margin-bottom:.5rem}.empty-p p{color:#166534;font-size:1.1rem;opacity:.8}.pengaduan-main-p{padding:2.5rem;max-width:1100px;margin-left:260px;animation:fadeIn .5s ease-out}@media(max-width:1024px){.pengaduan-main-p{margin-left:0}}.p-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:3rem;gap:2rem}.p-header-info-p h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.p-header-info-p p{color:var(--text-muted);font-size:1.1rem}.btn-add-p{padding:1rem 2rem;background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;border:none;border-radius:16px;font-weight:700;cursor:pointer;box-shadow:0 10px 15px -3px #4f46e54d;transition:all .3s;display:flex;align-items:center;gap:.75rem}.btn-add-p:hover{transform:translateY(-3px);box-shadow:0 20px 25px -5px #4f46e566}.p-grid-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:2rem}.p-card-p{background:var(--bg-secondary);border-radius:24px;padding:2rem;box-shadow:var(--shadow-sm);border:1px solid var(--border-primary);transition:all .3s;display:flex;flex-direction:column}.p-card-p:hover{transform:translateY(-8px);box-shadow:0 20px 25px -5px #0000001a}.p-card-header-p{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem}.p-mapel-p{background:var(--bg-tertiary);color:var(--text-secondary);padding:.4rem .875rem;border-radius:10px;font-size:.75rem;font-weight:800;text-transform:uppercase}.p-status-p{padding:.4rem .875rem;border-radius:10px;font-size:.75rem;font-weight:800}.p-content-p h3{font-size:1.25rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.p-teacher-p{font-size:.9rem;color:var(--text-muted);margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.p-desc-p{font-size:1rem;color:var(--text-secondary);line-height:1.6;margin-bottom:1.5rem}.p-response-p{background:var(--bg-tertiary);padding:1.25rem;border-radius:16px;margin-bottom:1.5rem;border-left:4px solid #22c55e}.p-response-p strong{display:block;color:#166534;font-size:.85rem;margin-bottom:.25rem}.p-response-p p{margin:0;color:#166534;font-size:.95rem}.p-video-p{margin-bottom:1.5rem;border-radius:16px;overflow:hidden;box-shadow:0 4px 6px -1px #0000001a}.p-footer-p{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:1.25rem;border-top:1px solid var(--border-primary)}.p-token-p{font-size:.8rem;color:#94a3b8;font-weight:700}.p-actions-p{display:flex;gap:.75rem}.p-btn-icon{width:36px;height:36px;border-radius:10px;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}.p-btn-edit{background:#eff6ff;color:#3b82f6}.p-btn-delete{background:#fee2e2;color:#ef4444}.p-btn-icon:hover{transform:scale(1.1)}@media(max-width:640px){.p-header-p{flex-direction:column;align-items:stretch;text-align:center}.btn-add-p{justify-content:center}}.tanggapan-main-p{padding:2.5rem;max-width:1200px;margin-left:260px;animation:fadeIn .5s ease-out}@media(max-width:1024px){.tanggapan-main-p{margin-left:0;padding:5rem 1rem 2rem}}.t-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:3rem}.t-header-info-p h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.t-header-info-p p{color:var(--text-muted);font-size:1.1rem}.t-pending-badge-p{background:#fee2e2;color:#dc2626;padding:.75rem 1.5rem;border-radius:12px;font-weight:800;font-size:.9rem;box-shadow:0 4px 6px -1px #dc26261a}.t-tabs-p{display:flex;gap:1rem;margin-bottom:3rem;background:var(--bg-tertiary);padding:.5rem;border-radius:16px;width:fit-content}.t-tab-p{padding:.75rem 1.5rem;border:none;border-radius:12px;font-weight:700;cursor:pointer;transition:all .2s;background:transparent;color:var(--text-muted)}.t-tab-p.active{background:var(--bg-secondary);color:var(--accent-primary);box-shadow:0 4px 6px -1px #0000000d}.t-grid-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:2rem}.t-card-p{background:var(--bg-secondary);border-radius:24px;padding:2rem;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary);transition:all .3s;display:flex;flex-direction:column}.t-card-p:hover{transform:translateY(-8px);box-shadow:0 20px 25px -5px #0000001a}.t-card-p.is-pending{border-top:5px solid #f59e0b}.t-card-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.t-mapel-tag-p{background:#f1f5f9;padding:.4rem .8rem;border-radius:10px;font-size:.75rem;font-weight:800;color:#475569}.t-status-tag-p{padding:.4rem .8rem;border-radius:10px;font-size:.75rem;font-weight:800}.t-content-p h3{font-size:1.25rem;font-weight:800;color:var(--text-primary);margin-bottom:.75rem}.t-siswa-p{font-size:.9rem;color:var(--text-muted);margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.t-desc-p{font-size:1rem;color:var(--text-secondary);line-height:1.6;margin-bottom:2rem;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.t-btn-respond-p{margin-top:auto;width:100%;padding:1rem;border-radius:12px;border:1.5px solid var(--border-secondary);background:var(--bg-secondary);color:var(--text-primary);font-weight:700;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:.5rem}.t-btn-respond-p:hover{border-color:#4f46e5;color:#4f46e5;background:#f5f3ff}.t-modal-detail-p{background:var(--bg-primary);padding:1.5rem;border-radius:20px;margin-bottom:2rem;border:1px solid var(--border-secondary)}.t-detail-row-p{display:flex;margin-bottom:.75rem;font-size:.95rem}.t-detail-row-p .lbl{width:140px;color:var(--text-muted);font-weight:600}.t-detail-row-p .val{color:var(--text-primary);font-weight:700;flex:1}.t-modal-desc-p{margin-top:1.25rem;padding-top:1.25rem;border-top:1px dashed #cbd5e1}.t-modal-desc-p strong{display:block;margin-bottom:.5rem;color:var(--text-primary);font-size:.9rem}.t-modal-desc-p p{margin:0;color:var(--text-secondary);line-height:1.5;font-size:1rem}@media(max-width:640px){.t-header-p{flex-direction:column;align-items:flex-start;gap:1rem}.t-tabs-p{width:100%;overflow-x:auto}}.kosakata-container{padding:0;max-width:1400px;margin-left:0;animation:fadeIn .5s ease-out;transition:margin-left .3s ease}.kosakata-menu .menu-header{background:linear-gradient(135deg,#f59e0b,#fbbf24);padding:3rem 2rem;border-radius:0 0 40px 40px;text-align:center;color:#fff;margin-bottom:3rem;box-shadow:0 10px 30px #f59e0b33;position:relative;overflow:hidden}.kosakata-menu .menu-header:before{content:"📖";position:absolute;top:-20px;right:-20px;font-size:8rem;opacity:.1;transform:rotate(-15deg)}.kosakata-menu .menu-header h1{font-size:clamp(2rem,5vw,3.5rem);font-weight:800;margin-bottom:.75rem;letter-spacing:-1px}.kosakata-menu .menu-header p{font-size:clamp(1rem,2vw,1.25rem);opacity:.9;max-width:600px;margin:0 auto}.kosakata-teaser-banner{background:linear-gradient(135deg,#0ea5e9,#0284c7);border-radius:20px;padding:1.5rem 2rem;margin:-1rem 2rem 2rem;display:flex;align-items:center;gap:1rem;color:#fff;box-shadow:0 10px 30px #0ea5e94d}.teaser-icon{font-size:2.5rem;flex-shrink:0}.teaser-content h3{margin:0 0 .25rem;font-size:1.1rem;font-weight:700}.teaser-content p{margin:0;font-size:.9rem;opacity:.9;line-height:1.5}.teaser-content strong{color:#fef08a}@media(max-width:768px){.kosakata-teaser-banner{flex-direction:column;text-align:center;margin:-1rem 1rem 2rem;padding:1.25rem}.teaser-icon{font-size:2rem}.teaser-content h3{font-size:1rem}.teaser-content p{font-size:.85rem}}.search-container{padding:0 2rem;margin-top:-2.5rem;margin-bottom:3rem;display:flex;justify-content:center}.search-input{width:100%;max-width:600px;padding:1.25rem 2rem;border-radius:20px;border:none;background:var(--bg-secondary);box-shadow:var(--shadow-lg);color:var(--text-primary);transition:all .3s}.search-input:focus{outline:none;transform:translateY(-3px);box-shadow:0 20px 40px #00000026}.juz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;padding:0 2rem 4rem}@media(max-width:640px){.juz-grid{grid-template-columns:1fr;padding:0 1rem 3rem;gap:1rem}}.juz-card{background:var(--bg-secondary);border-radius:28px;padding:2.5rem;cursor:pointer;transition:all .4s cubic-bezier(.175,.885,.32,1.275);border:1px solid var(--border-primary);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;align-items:center;gap:1.5rem;position:relative}.juz-card:hover{transform:translateY(-10px);box-shadow:0 25px 50px -12px #f59e0b33;border-color:#fbbf24}.juz-card.locked{opacity:.7;cursor:not-allowed;border-style:dashed;border-color:var(--border-secondary)}.juz-card.locked:hover{transform:translateY(-5px);box-shadow:var(--shadow-sm);border-color:#94a3b8}.surah-lock-overlay{position:absolute;inset:0;background:#00000026;border-radius:28px;display:flex;align-items:center;justify-content:center;z-index:5}.surah-lock-overlay span{font-size:3rem;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}.juz-number{position:absolute;top:1.5rem;right:1.5rem;width:45px;height:45px;background:var(--bg-tertiary);color:#f59e0b;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:800}.juz-info{display:flex;flex-direction:column;gap:.5rem;text-align:center}.juz-info strong{font-size:1.4rem;color:var(--text-primary);font-weight:800;line-height:1.3}.juz-info span{color:var(--text-muted);font-size:.95rem;font-weight:600;line-height:1.4}.juz-progress{background:var(--bg-tertiary);height:10px;border-radius:10px;overflow:hidden;margin-top:2.5rem;width:100%}.juz-progress .progress-bar{height:100%;background:linear-gradient(90deg,#f59e0b,#fbbf24);border-radius:10px}.juz-card .progress-text{font-size:.85rem;color:var(--text-muted);font-weight:600;text-align:center;margin-top:.25rem}.juz-card.completed{border-color:#22c55e;background:#22c55e0d}.surah-check-badge{position:absolute;bottom:2rem;right:2rem;font-size:1.5rem;background:#fff;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #0000001a;border:3px solid #f59e0b}.back-btn-lux{display:inline-flex!important;align-items:center!important;gap:12px!important;background:#0f172a!important;border:2px solid #f59e0b!important;color:#f59e0b!important;padding:10px 24px!important;border-radius:50px!important;font-size:.9rem!important;font-weight:850!important;text-transform:uppercase!important;letter-spacing:1.5px!important;cursor:pointer!important;transition:all .4s cubic-bezier(.175,.885,.32,1.275)!important;box-shadow:0 10px 30px #0000004d!important;margin-bottom:2rem!important;position:relative!important;z-index:9999!important}.back-btn-lux .icon{font-size:1.2rem;transition:transform .4s}.back-btn-lux:hover{background:#1e293b!important;border-color:#fbbf24!important;color:#fbbf24!important;transform:translateY(-5px) scale(1.05)!important;box-shadow:0 15px 45px #0006,0 0 25px #f59e0b80!important;letter-spacing:2px!important}.back-btn-lux:hover .icon{transform:translate(-5px)}.back-btn-lux:active{transform:translateY(-2px) scale(.98)}.kosakata-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:1.25rem;padding:2rem;background:var(--bg-secondary);border-radius:32px;box-shadow:var(--shadow-sm);border:1px solid var(--border-primary)}.ayat-circle{aspect-ratio:1;border-radius:20px;background:var(--bg-tertiary);border:2.5px solid var(--border-secondary);display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--text-secondary);font-size:1.1rem;cursor:pointer;transition:all .3s;position:relative}.ayat-circle:hover:not(.locked){background:var(--bg-secondary);border-color:#f59e0b;color:#f59e0b;transform:translateY(-5px) scale(1.1)}.ayat-circle.completed{background:var(--bg-tertiary);border-color:#22c55e;color:#166534}.ayat-circle.locked{background:var(--bg-tertiary);opacity:.6;cursor:not-allowed;border-style:dashed}.ayat-circle .check-icon{position:absolute;top:-5px;right:-5px;background:#22c55e;color:#fff;width:20px;height:20px;border-radius:50%;font-size:.75rem;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #22c55e4d}.ayat-circle .lock-icon{position:absolute;top:-5px;right:-5px;background:#94a3b8;color:#fff;width:20px;height:20px;border-radius:50%;font-size:.6rem;display:flex;align-items:center;justify-content:center}.kosakata-game{max-width:800px;margin:2rem auto;padding:0 1rem;width:100%}.game-info{display:flex;gap:1rem}.level-tag,.progress-tag,.score-tag{padding:.6rem 1.2rem;border-radius:12px;font-weight:800;font-size:.9rem}.level-tag{background:var(--bg-tertiary);color:#f59e0b}.progress-tag{background:var(--bg-tertiary);color:#3b82f6}.score-tag{background:var(--bg-tertiary);color:#22c55e}.game-card.kosakata-v2{background:var(--bg-secondary);border-radius:40px;padding:4rem 3rem;text-align:center;box-shadow:var(--shadow-lg);border:1px solid var(--border-primary)}.arabic-word{font-family:KFGQPC,Amiri,serif;font-size:clamp(2.5rem,10vw,5rem);color:var(--text-primary);margin-bottom:2.5rem;direction:rtl;line-height:1.6;word-break:break-word}.tf-content-box{background:var(--bg-tertiary);padding:2.5rem;border-radius:32px;margin-bottom:2.5rem}.displayed-answer-v2{font-size:clamp(1.5rem,6vw,2.5rem);font-weight:850;color:#f59e0b;margin:1.5rem 0;display:block}.tf-buttons{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.tf-btn{padding:1.25rem;border-radius:20px;font-size:1.2rem;font-weight:800;cursor:pointer;transition:all .3s;border:none}.tf-btn.benar{background:var(--bg-tertiary);color:#22c55e}.tf-btn.salah{background:var(--bg-tertiary);color:#ef4444}.tf-btn.correct{background:#22c55e!important;color:#fff!important}.tf-btn.wrong{background:#ef4444!important;color:#fff!important}.instruction{font-size:1.1rem;color:var(--text-muted);margin-bottom:1.5rem;display:block}.choice-container{width:100%;max-width:600px;margin:0 auto}.option-btn-v2{width:100%;padding:1.5rem;margin-bottom:1rem;border-radius:20px;background:var(--bg-tertiary);border:2px solid var(--border-secondary);color:var(--text-primary);font-size:1.25rem;font-weight:700;transition:all .3s}.option-btn-v2:hover:not(:disabled){background:var(--bg-secondary);border-color:#f59e0b;transform:scale(1.02)}.option-btn-v2.correct{background:#22c55e!important;border-color:#22c55e!important;color:#fff!important}.option-btn-v2.wrong{background:#ef4444!important;border-color:#ef4444!important;color:#fff!important}.result-card{background:var(--bg-secondary);border-radius:40px;padding:4rem;text-align:center;max-width:500px;margin:4rem auto;box-shadow:0 40px 60px -15px #0000001a}.score-circle{width:160px;height:160px;background:var(--bg-tertiary);border:6px solid #f59e0b;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:2rem auto}.score-value{font-size:3rem;font-weight:900;color:#f59e0b}.retry-btn{width:100%;padding:1.25rem;border-radius:16px;font-weight:800;font-size:1.1rem;cursor:pointer;background:var(--bg-tertiary);border:none;transition:all .3s}.retry-btn:hover{background:var(--bg-tertiary);opacity:.9}@media(max-width:1024px){.kosakata-container{margin-left:0;padding:0}.search-container{padding:0 1.5rem}}@media(max-width:768px){.kosakata-menu .menu-header{padding:2.5rem 1.5rem;border-radius:0 0 30px 30px}.kosakata-menu .menu-header h1{font-size:2rem}.juz-card{padding:1.5rem}.game-header{flex-direction:column;gap:1rem;text-align:center}.game-info{flex-wrap:wrap;justify-content:center;width:100%}.game-card.kosakata-v2{padding:2.5rem 1.5rem;border-radius:30px}.tf-buttons{grid-template-columns:1fr}.kosakata-grid{grid-template-columns:repeat(auto-fill,minmax(55px,1fr));padding:1rem;gap:.75rem;border-radius:20px}.ayat-circle{font-size:1rem;border-width:2px}.result-card{padding:2rem 1.5rem;margin:2rem 1rem}}@media(max-width:480px){.search-input{padding:1rem 1.5rem}.level-tag,.progress-tag,.score-tag{font-size:.8rem;padding:.4rem .8rem}.tf-content-box{padding:1.5rem}.option-btn-v2{padding:1.2rem;font-size:1.1rem}}.locked-modal-overlay{position:fixed;inset:0;background:#000000b3;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:9999;padding:20px;animation:fadeIn .3s ease}.locked-modal-content{background:linear-gradient(135deg,#1e293b,#0f172a);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:2.5rem;max-width:420px;width:100%;text-align:center;position:relative;box-shadow:0 25px 50px -12px #00000080;animation:slideUp .4s cubic-bezier(.16,1,.3,1)}@keyframes slideUp{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.locked-modal-close{position:absolute;top:16px;right:16px;background:transparent;border:none;color:#ffffff80;font-size:28px;cursor:pointer;transition:color .2s;line-height:1}.locked-modal-close:hover{color:#fff}.locked-modal-icon{font-size:4rem;margin-bottom:1rem;filter:drop-shadow(0 0 20px rgba(245,158,11,.4))}.locked-modal-title{color:#fff;font-size:1.75rem;font-weight:700;margin:0 0 1rem}.locked-modal-message{color:#94a3b8;font-size:1rem;line-height:1.6;margin:0 0 1.5rem}.locked-modal-message strong{color:#f59e0b}.locked-modal-info{background:#0000004d;border-radius:16px;padding:1.25rem;margin-bottom:1.5rem;text-align:left}.locked-modal-info .info-item{display:flex;align-items:center;gap:10px;color:#e2e8f0;font-size:.95rem;padding:.5rem 0}.locked-modal-info .info-icon{font-size:1rem}.locked-modal-hint{color:#64748b;font-size:.9rem;margin:0 0 1.5rem;font-style:italic}.locked-modal-btn{background:linear-gradient(135deg,#f59e0b,#d97706);border:none;border-radius:14px;padding:14px 32px;color:#fff;font-weight:700;font-size:1rem;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px #f59e0b4d}.locked-modal-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #f59e0b66;filter:brightness(1.1)}@media(max-width:480px){.locked-modal-content{padding:2rem 1.5rem}.locked-modal-icon{font-size:3rem}.locked-modal-title{font-size:1.5rem}}.language-selector-container{display:flex;justify-content:center;margin:-1.5rem 0 2rem;position:relative;z-index:10}.lang-toggle-group{background:var(--bg-tertiary);padding:6px;border-radius:16px;display:flex;gap:4px;box-shadow:var(--shadow-md);border:1px solid var(--border-primary)}.lang-btn{padding:10px 20px;border-radius:12px;border:none;background:transparent;color:var(--text-secondary);font-weight:700;font-size:.9rem;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:8px}.lang-btn:hover:not(.active){background:#f59e0b1a;color:#f59e0b}.lang-btn.active{background:#fff;color:#f59e0b;box-shadow:0 4px 12px #00000014}[data-theme=dark] .lang-btn.active{background:#1e293b;color:#fbbf24}[data-theme=dark] .arabic-word{color:#fff!important}[data-theme=dark] .instruction{color:#cbd5e1!important}[data-theme=dark] .displayed-answer-v2{color:#fbbf24!important;text-shadow:0 0 10px rgba(251,191,36,.3)}[data-theme=dark] .option-btn-v2{background:#1e293b;color:#f8fafc;border-color:#ffffff1a}[data-theme=dark] .option-btn-v2:hover{background:#2d3748;border-color:#fbbf24}[data-theme=dark] .tf-btn{background:#1e293b}[data-theme=dark] .tf-content-box{background:#0f172a80;border:1px solid rgba(255,255,255,.1)}.dashboard-layout{display:flex;min-height:100vh;background:var(--bg-primary)}.mon-unified-main{flex:1;padding:2.5rem;margin-left:260px;animation:fadeIn .5s ease-out;transition:all .3s ease;background-color:var(--bg-primary)}.mon-unified-header{margin-bottom:3rem;display:flex;justify-content:space-between;align-items:flex-end}.mon-unified-title h1{font-size:clamp(2rem,4vw,2.75rem);font-weight:800;color:var(--text-primary);margin-bottom:.5rem;letter-spacing:-.5px}.mon-unified-title p{color:var(--text-muted);font-size:1.1rem;font-weight:500}.mon-unified-selector{background:var(--glass-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:28px;padding:2rem;box-shadow:0 10px 30px -5px #0000000d,inset 0 0 0 1px var(--glass-border);border:none;margin-bottom:2.5rem}.mon-sel-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.5rem;margin-bottom:1.5rem}.mon-sel-top h3{font-size:1.15rem;font-weight:800;color:var(--text-secondary);margin:0;text-transform:uppercase;letter-spacing:.5px}.mon-search-box input{padding:.85rem 1.5rem;border-radius:14px;border:1.5px solid var(--border-secondary);background:var(--bg-tertiary);width:320px;max-width:100%;font-weight:600;transition:all .3s;color:var(--text-primary)}.mon-search-box input:focus{border-color:var(--primary-color);background:var(--bg-secondary);box-shadow:0 0 0 4px #4f46e526;outline:none}.mon-class-tabs{display:flex;flex-wrap:wrap;gap:.6rem;padding-bottom:.5rem}.mon-class-tabs::-webkit-scrollbar{height:6px}.mon-class-tabs::-webkit-scrollbar-thumb{background:var(--border-primary);border-radius:6px}.mon-class-btn{background:var(--bg-tertiary);border:2px solid transparent;padding:.6rem 1rem;border-radius:12px;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:row;align-items:center;gap:.4rem;white-space:nowrap}.mon-class-btn:hover{transform:translateY(-2px);background:var(--bg-secondary);border-color:#4f46e54d;box-shadow:0 4px 10px -2px #0000000d}.mon-class-btn.active{background:var(--primary-gradient);color:#fff;border-color:transparent;box-shadow:0 8px 16px -4px #4f46e54d;transform:translateY(-2px)}.mon-class-btn .class-name{font-weight:700;font-size:.85rem}.mon-class-btn .class-count{font-size:.7rem;font-weight:600;opacity:.7}.mon-category-tabs{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:2rem;background:var(--bg-secondary);padding:.75rem;border-radius:20px;box-shadow:inset 0 2px 4px #00000005;border:1px solid var(--border-primary)}.mon-cat-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;border-radius:14px;border:none;background:transparent;color:var(--text-muted);font-weight:700;font-size:.95rem;cursor:pointer;transition:all .3s}.mon-cat-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.mon-cat-btn.active{background:var(--bg-primary);color:var(--primary-color);box-shadow:0 4px 6px -1px #0000000d}.mon-cat-btn .icon{font-size:1.2rem}.mon-data-section{background:var(--bg-secondary);border-radius:28px;padding:2.5rem;box-shadow:0 10px 25px -5px #0000000d;border:1px solid var(--border-primary);position:relative;overflow:hidden}.mon-data-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;border-bottom:1px solid var(--border-secondary);padding-bottom:1.5rem}.mon-data-header h2{font-size:1.5rem;font-weight:800;color:var(--text-primary);display:flex;align-items:center;gap:.75rem}.mon-role-badge{padding:.4rem 1rem;background:var(--success-bg);color:var(--success);border-radius:50px;font-weight:800;font-size:.75rem;text-transform:uppercase}.mon-table-container{overflow-x:auto;overflow-y:auto;max-height:65vh}.mon-table{width:100%;border-collapse:separate;border-spacing:0 .75rem}.mon-table th{text-align:left;padding:1rem 1.5rem;color:var(--text-muted);font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:.5px;position:sticky;top:0;background:var(--bg-secondary);z-index:2}.mon-table-row{background:var(--bg-primary);transition:all .2s cubic-bezier(.4,0,.2,1)}.mon-table-row:hover{transform:scale(1.01) translateY(-2px);box-shadow:0 10px 20px -5px #0000000d}.mon-table-row td{padding:1.25rem 1.5rem;border-top:1px solid var(--border-primary);border-bottom:1px solid var(--border-primary);vertical-align:middle}.mon-table-row td:first-child{border-left:1px solid var(--border-primary);border-radius:16px 0 0 16px;font-weight:700;color:var(--text-muted)}.mon-table-row td:last-child{border-right:1px solid var(--border-primary);border-radius:0 16px 16px 0}.student-profile-cell{display:flex;align-items:center;gap:1.25rem}.student-avatar{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#4338ca;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.1rem;box-shadow:0 4px 6px -1px #4338ca1a}.student-info strong{display:block;color:var(--text-primary);font-size:1rem;font-weight:700}.student-info small{color:var(--text-muted);font-weight:600;font-size:.8rem}.mon-stat-pill{display:inline-flex;padding:.5rem 1rem;border-radius:12px;font-weight:700;font-size:.9rem;background:var(--bg-tertiary);color:var(--text-secondary)}.mon-stat-pill.highlight{background:#dcfce7;color:#15803d}.mon-progress-wrapper{width:100%;min-width:150px}.mon-progress-bar-bg{width:100%;height:10px;background:var(--border-primary);border-radius:10px;overflow:hidden;margin-bottom:.4rem;position:relative;box-shadow:inset 0 1px 3px #0000000d}.mon-progress-fill{height:100%;border-radius:10px;background:linear-gradient(90deg,#10b981,#34d399);position:relative}.mon-progress-fill.mutabaah{background:linear-gradient(90deg,#3b82f6,#60a5fa)}.mon-progress-fill.scramble{background:linear-gradient(90deg,#8b5cf6,#a78bfa)}.mon-progress-glow{position:absolute;inset:0;background:linear-gradient(90deg,#fff0,#fff6,#fff0);animation:monGlow 2s infinite linear}@keyframes monGlow{0%{transform:translate(-100%)}to{transform:translate(100%)}}.mon-progress-wrapper span{font-size:.8rem;font-weight:800;color:var(--text-muted)}.mon-last-active{font-size:.9rem;font-weight:600;color:var(--text-muted)}.mon-empty-state{text-align:center;padding:6rem 2rem;color:var(--text-muted)}.mon-empty-state .icon{font-size:4rem;margin-bottom:1rem;opacity:.5}.mon-empty-state h3{font-size:1.25rem;color:var(--text-primary);margin-bottom:.5rem}@media(max-width:1024px){.mon-unified-main{margin-left:0;padding:5rem 1.5rem 2rem}}@media(max-width:768px){.mon-unified-header{flex-direction:column;align-items:flex-start;gap:1.5rem}.mon-data-section{padding:1.5rem}.mon-category-tabs{overflow-x:auto;flex-wrap:nowrap}.mon-cat-btn{white-space:nowrap}.mon-sel-top{flex-direction:column;align-items:flex-start}.mon-search-box input{width:100%}}.rank-cell-p{text-align:center!important;font-size:1.1rem;font-weight:800}.rank-medal{font-size:1.65rem;display:inline-block;transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.mon-table-row:hover .rank-medal{transform:scale(1.3) rotate(8deg)}.rank-medal.gold{filter:drop-shadow(0 0 8px rgba(255,215,0,.4))}.rank-medal.silver{filter:drop-shadow(0 0 8px rgba(192,192,192,.4))}.rank-medal.bronze{filter:drop-shadow(0 0 8px rgba(205,127,50,.4))}.top-rank-row-p{position:relative}.top-rank-row-p.mon-table-row{background:linear-gradient(90deg,#fff,#f9fafb)}.top-rank-row-p:nth-child(1){border-left:4px solid #ffd700}.top-rank-row-p:nth-child(2){border-left:4px solid #c0c0c0}.top-rank-row-p:nth-child(3){border-left:4px solid #cd7f32}.top-rank-row-p td:first-child{position:relative}.top-rank-row-p:nth-child(1) td{background-color:#ffd70008}.mon-modal-overlay-p{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .3s ease}.mon-modal-content-p{background:#fff;width:90%;max-width:800px;max-height:85vh;border-radius:20px;box-shadow:0 25px 50px -12px #00000040;display:flex;flex-direction:column;overflow:hidden;animation:slideUp .4s cubic-bezier(.16,1,.3,1)}.mon-modal-header-p{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;border-bottom:1px solid #f0f0f0;background:linear-gradient(135deg,#fff,#f9fafb)}.mon-modal-title-p{display:flex;align-items:center;gap:1rem}.mon-modal-title-p .avatar{width:48px;height:48px;background:var(--primary-color, #27ae60);color:#fff;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:700}.mon-modal-title-p h3{margin:0;font-size:1.2rem}.mon-modal-title-p p{margin:0;font-size:.85rem;color:#666}.close-btn-p{background:#f3f4f6;border:none;width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.close-btn-p:hover{background:#fee2e2;color:#dc2626}.mon-modal-body-p{padding:2rem;overflow-y:auto;flex:1}.surah-detail-card-p{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:1.25rem;margin-bottom:1.5rem}.surah-header-p{display:flex;justify-content:space-between;margin-bottom:1rem;font-size:.95rem}.ayah-grid-p{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:1rem}.ayah-tile-p{width:14px;height:14px;background:#e2e8f0;border-radius:2px;transition:all .2s}.ayah-tile-p.filled{background:#27ae60;box-shadow:0 0 5px #27ae6066}.surah-footer-p{border-top:1px dashed #cbd5e1;padding-top:.75rem;color:#64748b;font-size:.8rem}.roadmap-grid-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1rem}.roadmap-step-p{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:1rem;display:flex;flex-direction:column;align-items:center;gap:.5rem;transition:all .3s}.roadmap-step-p.completed{border-color:#27ae60;background:#f0fdf4}.step-circle{font-size:1.5rem}.step-label{font-size:.8rem;font-weight:600}.mutabaah-day-card-p{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:1rem;margin-bottom:.75rem}.day-header{display:flex;justify-content:space-between;margin-bottom:.75rem}.day-dots{display:flex;gap:6px}.mini-dot{width:10px;height:10px;background:#f1f5f9;border-radius:50%}.mini-dot.filled{background:#8b5cf6}.mon-action-cell{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.mon-detail-btn-p{background:#fff;border:1px solid #e5e7eb;width:32px;height:32px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;box-shadow:0 2px 4px #0000000d}.mon-detail-btn-p:hover{background:#f9fafb;border-color:#27ae60;transform:translateY(-2px);box-shadow:0 4px 6px #0000001a}@media(max-width:768px){.mon-modal-content-p{height:95vh;max-height:95vh;width:100%;border-radius:20px 20px 0 0;align-self:flex-end}.roadmap-grid-p{grid-template-columns:repeat(3,1fr)}}.monitoring-layout{display:flex;min-height:100vh;background:var(--bg-primary)}.monitoring-main{flex:1;padding:2.5rem;margin-left:260px;transition:all .3s ease}.monitoring-header{margin-bottom:2.5rem}.monitoring-header h1{font-size:2.25rem;color:var(--text-primary);margin-bottom:8px;font-weight:800}.monitoring-header p{color:var(--text-muted);font-size:1.1rem}.class-selector{background:var(--bg-secondary);border-radius:24px;padding:1.5rem 2rem;margin-bottom:2rem;box-shadow:0 4px 6px -1px #0000000d;border:1px solid var(--border-primary)}.selector-title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.class-selector h3{color:var(--text-secondary);margin:0;font-size:1.1rem;font-weight:700}.search-box-mini input{padding:.75rem 1.25rem;border-radius:12px;border:1.5px solid var(--border-secondary);background:var(--bg-primary);color:var(--text-primary);font-size:.9rem;width:250px;transition:all .2s}.search-box-mini input:focus{outline:none;border-color:var(--accent-primary);background:var(--bg-secondary);box-shadow:0 0 0 4px var(--accent-shadow)}.class-tabs{display:flex;gap:1rem;overflow-x:auto;padding-bottom:.5rem;-webkit-overflow-scrolling:touch}.class-tabs::-webkit-scrollbar{height:4px}.class-tabs::-webkit-scrollbar-thumb{background:var(--border-primary);border-radius:10px}.class-tab{background:var(--bg-primary);border:2px solid transparent;padding:.875rem 1.5rem;border-radius:14px;color:var(--text-muted);cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;align-items:center;min-width:120px}.class-tab:hover{transform:translateY(-2px);border-color:var(--accent-primary)}.class-tab.active{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;border-color:transparent;box-shadow:0 10px 15px -3px #4f46e533}.tab-count{font-size:.75rem;font-weight:600;opacity:.9;margin-top:2px}.progress-section{background:var(--bg-secondary);border-radius:24px;padding:2rem;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary)}.progress-table-container{overflow-x:auto;overflow-y:auto;max-height:65vh}.progress-table th{position:sticky;top:0;background:var(--bg-secondary);z-index:2}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid var(--border-primary)}.section-header h2{margin:0;color:var(--text-primary);font-size:1.5rem;font-weight:800}.role-badge{padding:.5rem 1rem;background:#eef2ff;color:#4f46e5;border-radius:50px;font-size:.85rem;font-weight:700}@media(max-width:1024px){.monitoring-main{margin-left:0;padding:5rem 1rem 2rem}.monitoring-header h1{font-size:1.75rem}.selector-title-row{flex-direction:column;align-items:stretch;gap:1rem}.search-box-mini input{width:100%}.class-tabs{flex-wrap:nowrap}}@media(max-width:768px){.progress-table-container{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.progress-table{min-width:650px}.progress-section{padding:1.25rem}.section-header{flex-direction:column;align-items:flex-start;gap:.75rem}}.monitor-container{padding:2rem;background:var(--bg-primary);min-height:calc(100vh - 40px);color:var(--text-primary)}.monitor-header{margin-bottom:2rem;border-bottom:1px solid var(--border-primary);padding-bottom:1rem}.monitor-header h1{font-size:2rem;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.avg-score{font-weight:700;font-size:1.1rem;padding:.25rem .75rem;border-radius:6px}.avg-score.good{color:#10b981;background:#10b9811a}.avg-score.poor{color:#ef4444;background:#ef44441a}.profile-avatar.bank-soal{background:var(--accent-gradient)}.quiz-item.pass{border-left:4px solid #10b981}.quiz-item.fail{border-left:4px solid #ef4444}.att-time-small{font-size:.7rem;color:#64748b;margin-top:.2rem}.mutabaah-header{background:var(--accent-gradient);padding:30px;border-radius:20px;color:#fff;display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;box-shadow:0 10px 30px #0000001a}.mutabaah-header h1{font-size:2rem;margin-bottom:5px}.date-picker-p input{background:#fff3;border:1px solid rgba(255,255,255,.3);padding:10px 15px;border-radius:10px;color:#fff;font-family:inherit;outline:none}.mutabaah-content-grid{display:grid;grid-template-columns:1fr 350px;gap:30px}.mutabaah-section{margin-bottom:40px}.section-title{font-size:1.2rem;color:var(--text-color);margin-bottom:20px;padding-left:10px;border-left:4px solid var(--accent-color)}.mutabaah-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}.mutabaah-card{background:var(--card-bg);border:1px solid var(--border-color);padding:20px;border-radius:15px;cursor:pointer;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative}.mutabaah-card:hover{transform:translateY(-5px);box-shadow:0 10px 20px var(--shadow-color);border-color:var(--accent-color)}.mutabaah-card.active{background:var(--accent-gradient);color:#fff;border-color:transparent}.card-icon{font-size:2rem;margin-bottom:10px}.card-label{font-weight:600;margin-bottom:15px}.card-check{font-size:1.2rem}.history-card h3{margin-bottom:20px}.history-list-p{display:flex;flex-direction:column;gap:15px}.history-item-p{display:flex;align-items:center;gap:15px;padding:10px;background:#00000008;border-radius:12px}.date-box{display:flex;flex-direction:column;align-items:center;min-width:50px;padding:5px;background:#fff;border-radius:8px;box-shadow:0 2px 5px #0000000d}.date-box .day{font-size:.7rem;text-transform:uppercase;color:#888}.date-box .date{font-size:1.1rem;font-weight:700;color:var(--accent-color)}.prog-box{flex:1}.prog-bar-mini{height:8px;background:#eee;border-radius:4px;overflow:hidden;margin-bottom:5px}.prog-bar-mini .fill{height:100%;background:var(--accent-gradient);transition:width .5s ease}.prog-text{font-size:.8rem;color:#666}.stats-card{margin-bottom:30px;background:var(--card-bg);border:1px solid var(--border-color);padding:25px;border-radius:20px}.stats-card h3{margin-bottom:20px;display:flex;align-items:center;gap:10px}.chart-container{height:250px;width:100%;margin-top:20px;position:relative;overflow:hidden}.chart-tooltip{background:#fff;padding:10px;border:1px solid var(--border-color);border-radius:8px;box-shadow:0 5px 15px #0000001a}.chart-tooltip .label{font-weight:700;color:var(--text-color);margin-bottom:5px;display:block}.chart-tooltip .value{color:var(--accent-color);font-size:.9rem}@media(max-width:900px){.mutabaah-content-grid{grid-template-columns:1fr}}.page-container{display:flex;min-height:100vh;background:var(--bg-primary)}.ks-main-content{flex:1;margin-left:260px;margin-right:0;max-width:100%;transition:margin-left .3s ease;width:calc(100% - 260px);position:relative}.ks-page{min-height:100vh;padding:2rem;background:var(--bg-primary)}@media(max-width:1024px){.ks-main-content{margin-left:240px;width:calc(100% - 240px)}}@media(max-width:768px){.ks-main-content{margin-left:0;width:100%;padding-top:4.5rem}.ks-page{padding:1rem}.ks-header h1{font-size:1.75rem}}.ks-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;color:var(--text-primary)}.ks-spinner{width:50px;height:50px;border:4px solid var(--border-primary);border-top-color:var(--accent-primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.ks-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;color:var(--text-primary);text-align:center}.ks-error span{font-size:4rem;margin-bottom:1rem}.ks-error button{margin-top:1rem;padding:.75rem 2rem;background:var(--accent-primary);color:#fff;border:none;border-radius:8px;cursor:pointer;transition:transform .2s,background .2s}.ks-error button:hover{background:var(--accent-secondary);transform:scale(1.05)}.ks-header{text-align:center;margin-bottom:2rem;color:var(--text-primary)}.ks-header h1{font-size:2.5rem;margin-bottom:.5rem;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.ks-header p{color:var(--text-secondary);font-size:1.1rem}.ks-nav-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.ks-back-btn{padding:.5rem 1rem;background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-primary);border-radius:8px;cursor:pointer;transition:all .2s;font-size:.9rem}.ks-back-btn:hover{background:var(--bg-tertiary);transform:translate(-3px)}.ks-breadcrumb{display:flex;align-items:center;gap:.5rem;color:var(--text-secondary);font-size:.9rem}.ks-breadcrumb-separator{color:var(--text-muted)}.ks-breadcrumb-item.active{color:var(--text-primary);font-weight:600}.ks-level-sections{display:flex;flex-direction:column;gap:2rem}.ks-level-section{background:var(--bg-secondary);border-radius:16px;padding:1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border-primary)}.ks-level-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem;padding-bottom:.75rem;border-bottom:2px solid}.ks-level-header.sd{border-color:#22c55e}.ks-level-header.smp{border-color:#0d9488}.ks-level-header.sma{border-color:#059669}.ks-level-icon{font-size:1.5rem}.ks-level-header h2{font-size:1.25rem;color:var(--text-primary);margin:0}.ks-classes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:1rem}.ks-class-card{background:var(--bg-secondary);border-radius:16px;padding:1.5rem 1rem;text-align:center;cursor:pointer;transition:all .3s ease;border:2px solid var(--border-secondary);position:relative;overflow:hidden}.ks-class-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px}.ks-class-card.sd:before{background:linear-gradient(90deg,#22c55e,#4ade80)}.ks-class-card.smp:before{background:linear-gradient(90deg,#0d9488,#2dd4bf)}.ks-class-card.sma:before{background:linear-gradient(90deg,#059669,#10b981)}.ks-class-card:hover{transform:translateY(-5px);box-shadow:0 10px 40px var(--accent-shadow)}.ks-class-card.sd:hover{border-color:#22c55e;box-shadow:0 10px 40px #22c55e4d}.ks-class-card.smp:hover{border-color:#0d9488;box-shadow:0 10px 40px #0d94884d}.ks-class-card.sma:hover{border-color:#059669;box-shadow:0 10px 40px #0596694d}.ks-class-number{font-size:2.5rem;font-weight:700;color:var(--text-primary);margin-bottom:.25rem}.ks-class-label{font-size:.85rem;color:var(--text-secondary)}.ks-subjects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.25rem}.ks-subject-card{background:var(--bg-secondary);border-radius:20px;padding:2rem 1.5rem;text-align:center;cursor:pointer;transition:all .3s ease;border:2px solid var(--border-secondary)}.ks-subject-card:hover{transform:translateY(-8px) scale(1.02);border-color:var(--accent-primary);box-shadow:0 15px 50px var(--accent-shadow);background:linear-gradient(135deg,rgba(var(--accent-primary-rgb),.15),rgba(var(--accent-secondary-rgb),.08))}.ks-subject-icon{font-size:3.5rem;margin-bottom:1rem;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2));display:flex;justify-content:center;align-items:center}.ks-subject-icon.is-text{font-size:1rem;font-weight:700;text-transform:uppercase;background:var(--bg-input);color:var(--text-primary);padding:.5rem;border-radius:8px;margin-top:1rem}.ks-subject-label{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:.5rem}.ks-subject-topics{font-size:.85rem;color:var(--text-muted);background:var(--bg-tertiary);padding:.25rem .75rem;border-radius:20px;display:inline-block}.ks-topics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}.ks-topic-card{background:var(--bg-secondary);border-radius:16px;padding:1.5rem;cursor:pointer;transition:all .3s ease;border:1px solid var(--border-primary);display:flex;flex-direction:column;gap:.75rem}.ks-topic-card:hover{transform:translate(8px);border-color:var(--accent-primary);background:linear-gradient(135deg,rgba(var(--accent-primary-rgb),.15),rgba(var(--accent-secondary-rgb),.08))}.ks-topic-label{font-size:1.1rem;font-weight:600;color:var(--text-primary)}.ks-topic-questions{font-size:.85rem;color:var(--text-muted)}.ks-topic-start{font-size:.9rem;color:var(--accent-primary);font-weight:500;margin-top:auto;transition:color .2s}.ks-topic-card:hover .ks-topic-start{color:var(--accent-secondary)}.ks-quiz-container{max-width:700px;margin:0 auto}.ks-quiz-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.ks-quiz-info{display:flex;gap:1.5rem;color:var(--text-primary)}.ks-quiz-topic{background:var(--bg-secondary);padding:.5rem 1rem;border-radius:20px;font-size:.9rem;border:1px solid var(--border-primary)}.ks-quiz-score{background:var(--accent-gradient);padding:.5rem 1rem;border-radius:20px;font-weight:600;color:#fff}.ks-progress-bar{height:8px;background:var(--bg-tertiary);border-radius:10px;overflow:hidden;margin-bottom:1rem}.ks-progress-fill{height:100%;background:linear-gradient(90deg,#22c55e,#4ade80);border-radius:10px;transition:width .5s ease}.ks-question-counter{text-align:center;color:var(--text-secondary);font-size:.9rem;margin-bottom:1.5rem}.ks-question-card{background:var(--bg-card);border-radius:24px;padding:2rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border-primary)}.ks-question-text{font-size:1.35rem;color:var(--text-primary);text-align:center;margin-bottom:2rem;line-height:1.6}.ks-options-container{display:flex;flex-direction:column;gap:.75rem}.ks-option{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;background:var(--bg-secondary);border:2px solid var(--border-primary);border-radius:12px;color:var(--text-primary);cursor:pointer;transition:all .2s;text-align:left;font-size:1rem}.ks-option:hover:not(:disabled){background:var(--bg-tertiary);border-color:var(--accent-primary);transform:translate(5px)}.ks-option.selected{border-color:var(--accent-primary);background:rgba(var(--accent-primary-rgb),.15)}.ks-option.correct{border-color:#22c55e;background:#22c55e33}.ks-option.wrong{border-color:#ef4444;background:#ef444433}.ks-option:disabled{cursor:default}.ks-option-letter{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--bg-tertiary);border-radius:8px;font-weight:600;flex-shrink:0}.ks-option.correct .ks-option-letter{background:var(--success);color:#fff}.ks-option.wrong .ks-option-letter{background:var(--error);color:#fff}.ks-option-text{flex:1}.ks-option-icon{font-size:1.25rem;font-weight:700}.ks-feedback-container{margin-top:1.5rem;display:flex;flex-direction:column;gap:1rem}.ks-feedback{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;border-radius:12px;font-size:1rem}.ks-feedback.correct{background:#22c55e33;color:#4ade80}.ks-feedback.wrong{background:#ef444433;color:#f87171}.ks-feedback-icon{font-size:1.5rem}.ks-next-btn{padding:1rem 2rem;background:var(--accent-gradient);color:#fff;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.ks-next-btn:hover{transform:scale(1.02);box-shadow:0 8px 25px var(--accent-shadow)}.ks-quiz-stats{display:flex;justify-content:center;gap:2rem;margin-top:1.5rem}.ks-stat{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:20px;font-weight:600;font-size:1.1rem}.ks-stat.correct{background:#22c55e33;color:#4ade80}.ks-stat.wrong{background:#ef444433;color:#f87171}.ks-stat-icon{font-size:1.2rem}.ks-result-container{max-width:600px;margin:0 auto}.ks-result-card{background:var(--bg-card);border-radius:24px;padding:2.5rem;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border-primary);margin-bottom:2rem}.ks-result-emoji{font-size:5rem;margin-bottom:1rem;animation:bounce 1s ease infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.ks-result-title{font-size:2rem;color:var(--text-primary);margin-bottom:.5rem}.ks-result-grade{font-size:1.25rem;color:var(--accent-primary);margin-bottom:2rem;font-weight:600}.ks-result-score{margin-bottom:2rem}.ks-score-circle{width:150px;height:150px;background:var(--accent-gradient);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto;box-shadow:0 10px 40px var(--accent-shadow)}.ks-score-value{font-size:2.5rem;font-weight:700;color:#fff}.ks-score-label{font-size:.9rem;color:#fffc}.ks-result-stats{display:flex;justify-content:center;gap:1.5rem;margin-bottom:1.5rem}.ks-result-stat{text-align:center;padding:1rem 1.5rem;background:var(--bg-secondary);border-radius:12px;flex:1;border:1px solid var(--border-primary);min-width:100px}@media(max-width:480px){.ks-result-stats{gap:.75rem;flex-wrap:wrap}.ks-result-stat{padding:.75rem}.ks-stat-number,.ks-result-title{font-size:1.5rem}.ks-result-emoji{font-size:4rem}.ks-quiz-stats{gap:1rem}.ks-quiz-header{flex-direction:column;align-items:flex-start;gap:1rem}.ks-quiz-info{width:100%;justify-content:space-between}}.ks-result-stat.correct{background:#22c55e26}.ks-result-stat.wrong{background:#ef444426}.ks-stat-number{display:block;font-size:2rem;font-weight:700;color:var(--text-primary)}.ks-stat-label{font-size:.85rem;color:var(--text-muted)}.ks-result-info{color:var(--text-secondary);margin-bottom:2rem;font-size:.95rem}.ks-result-info p{margin:.25rem 0}.ks-result-actions{display:flex;flex-direction:column;gap:.75rem}.ks-btn{padding:1rem 2rem;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;border:none}.ks-btn-primary{background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff}.ks-btn-primary:hover{transform:scale(1.02);box-shadow:0 8px 25px #6366f166}.ks-btn-secondary{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-primary)}.ks-btn-secondary:hover{background:var(--bg-tertiary)}.ks-btn-outline{background:transparent;color:var(--text-secondary);border:1px solid var(--border-primary)}.ks-btn-outline:hover{background:var(--bg-secondary);color:var(--text-primary)}.ks-subject-card.locked{opacity:.8;cursor:default;border-color:var(--border-primary);background:var(--bg-tertiary);position:relative;overflow:hidden}.ks-subject-card.locked:hover{transform:none;box-shadow:none;border-color:var(--border-primary)}.ks-subject-card.locked .ks-subject-icon{opacity:.5;filter:grayscale(1)}.ks-lock-link{display:inline-block;margin-top:.75rem;color:var(--accent-primary);font-size:.85rem;font-weight:600;text-decoration:none;background:var(--bg-primary);padding:.4rem .8rem;border-radius:20px;border:1px solid var(--accent-primary);transition:all .2s}.ks-lock-link:hover{background:var(--accent-primary);color:#fff}.ks-review-container{background:var(--bg-secondary);border-radius:20px;padding:1.5rem;border:1px solid var(--border-primary)}.ks-review-container h3{color:var(--text-primary);margin-bottom:1rem;font-size:1.25rem}.ks-review-list{display:flex;flex-direction:column;gap:.75rem}.ks-review-item{display:flex;align-items:flex-start;gap:1rem;padding:1rem;background:var(--bg-tertiary);border-radius:12px;border-left:4px solid;border-top:1px solid var(--border-primary);border-right:1px solid var(--border-primary);border-bottom:1px solid var(--border-primary)}.ks-review-item.correct{border-color:#22c55e}.ks-review-item.wrong{border-color:#ef4444}.ks-review-number{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);border-radius:50%;font-size:.85rem;font-weight:600;color:var(--text-primary);flex-shrink:0;border:1px solid var(--border-primary)}.ks-review-content{flex:1}.ks-review-question{color:var(--text-primary);font-size:.95rem;margin-bottom:.5rem}.ks-review-answers{display:flex;flex-direction:column;gap:.25rem;font-size:.85rem}.ks-review-answer.correct{color:#4ade80}.ks-review-answer.wrong{color:#f87171}.ks-review-icon{font-size:1.25rem;font-weight:700}.ks-review-item.correct .ks-review-icon{color:#22c55e}.ks-review-item.wrong .ks-review-icon{color:#ef4444}@media(max-width:768px){.ks-page{padding:1rem}.ks-header h1{font-size:1.75rem}.ks-classes-grid{grid-template-columns:repeat(3,1fr)}.ks-subjects-grid{grid-template-columns:repeat(2,1fr)}.ks-topics-grid{grid-template-columns:1fr}.ks-question-card{padding:1.5rem}.ks-question-text{font-size:1.1rem}.ks-result-stats{flex-wrap:wrap}.ks-nav-header{flex-direction:column;align-items:flex-start}.ks-quiz-header{flex-direction:column;gap:1rem}.ks-quiz-info{width:100%;justify-content:space-between}}@media(max-width:480px){.ks-classes-grid{grid-template-columns:repeat(2,1fr)}.ks-class-number{font-size:2rem}.ks-subject-icon{font-size:2.5rem}.ks-result-emoji{font-size:4rem}.ks-score-circle{width:120px;height:120px}.ks-score-value{font-size:2rem}}:root{--scramble-text: #f8fafc;--scramble-text-muted: #94a3b8;--scramble-accent: #fbbf24;--scramble-bg-card: rgba(255, 255, 255, .03);--scramble-border: rgba(255, 255, 255, .1)}.scramble-landing-wrapper{--scramble-text: var(--text-primary);--scramble-text-muted: var(--text-secondary);--scramble-accent: #f59e0b;--scramble-bg-card: var(--bg-card);--scramble-border: var(--border-primary);width:100%;color:var(--scramble-text)}.scramble-main{padding:2rem;min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);color:var(--scramble-text);display:flex;flex-direction:column;align-items:center;position:relative;overflow-x:hidden;transition:all .3s ease}.dashboard-layout .scramble-main{margin-left:260px}.scramble-landing-wrapper .tense-selection-container{max-width:1000px;margin:0 auto}.dashboard-layout .scramble-main{margin-left:260px;width:calc(100% - 260px)}@media(max-width:1024px){.dashboard-layout .scramble-main{margin-left:240px;width:calc(100% - 240px)}}@media(max-width:768px){.dashboard-layout .scramble-main{margin-left:0;width:100%;padding:4.5rem 1rem 1rem}}.scramble-selection{width:100%;max-width:900px;margin:0 auto;padding:20px}.selection-header{text-align:center;margin-bottom:50px}.selection-header h1{font-size:3rem;font-weight:800;background:linear-gradient(135deg,var(--scramble-text),var(--scramble-accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:10px}.tenses-timeline{position:relative;padding-left:40px}.tenses-timeline:before{content:"";position:absolute;left:14px;top:10px;bottom:10px;width:2px;background:#ffffff1a}.tense-item-wrapper{position:relative;margin-bottom:30px;opacity:0;transform:translateY(20px);animation:slideUp .5s forwards}@keyframes slideUp{to{opacity:1;transform:translateY(0)}}.tense-dot{position:absolute;left:-35px;top:30px;width:20px;height:20px;border-radius:50%;background:#334155;border:3px solid #1e293b;z-index:2;transition:.3s}.tense-dot.active{background:#fbbf24;box-shadow:0 0 15px #fbbf2480}.tense-dot.completed{background:#22c55e;box-shadow:0 0 15px #22c55e80}.tense-card{background:var(--scramble-bg-card);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1.5px solid var(--scramble-border);border-radius:28px;padding:2.2rem;display:flex;align-items:center;gap:1.5rem;cursor:pointer;transition:all .4s cubic-bezier(.175,.885,.32,1.275);position:relative;box-shadow:0 10px 30px #0000000d}.tense-card:hover:not(.locked){background:var(--scramble-bg-card);transform:translateY(-5px);border-color:var(--scramble-accent);box-shadow:0 20px 40px #0000001a}.tense-card.locked{opacity:.6;cursor:not-allowed;filter:grayscale(.8)}.tense-card.premium-locked-card{border-color:#fbbf2466;background:#fbbf240d}.tense-card.premium-locked-card:hover{background:#fbbf241a;transform:translateY(-2px);border-color:#fbbf24}.tense-icon{font-size:2.2rem;width:60px;height:60px;background:#ffffff0d;border-radius:15px;display:flex;align-items:center;justify-content:center}.tense-content{flex:1}.tense-content h3{font-size:1.25rem;margin-bottom:8px;color:var(--scramble-text)}.progress-bar-flat{height:6px;background:#0000004d;border-radius:10px;margin-bottom:5px;overflow:hidden}.progress-fill-flat{height:100%;background:linear-gradient(90deg,#fbbf24,#f59e0b);transition:width .6s ease}.tense-progress span{font-size:.8rem;color:var(--scramble-text-muted)}.done-badge{position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:1.5rem}.premium-badge{position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:1.2rem;filter:drop-shadow(0 0 5px #fbbf24)}.premium-badge-small{position:absolute;right:15px;top:15px;font-size:.9rem;background:#fbbf24;color:#1e293b;padding:2px 8px;border-radius:20px;font-weight:800;box-shadow:0 0 10px #fbbf244d}.scramble-container{width:100%;max-width:850px;background:var(--scramble-bg-card);-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);border:1px solid var(--scramble-border);border-radius:40px;padding:4rem 3rem;box-shadow:var(--shadow-lg)}.scramble-container.landing-mode{max-width:1000px;padding:4rem 3rem;border-color:var(--scramble-border)}.scramble-header{text-align:center;margin-bottom:30px}.scramble-header h1{font-size:2.5rem;font-weight:800;margin:10px 0;color:#fbbf24}.badge-tense{background:#fbbf241a;color:#fbbf24;padding:6px 16px;border-radius:30px;font-size:.85rem;font-weight:700;border:1px solid rgba(251,191,36,.3)}.translation{font-size:1.4rem;color:var(--scramble-text-muted);line-height:1.5;margin-top:15px;font-weight:500}.sentence-slots{min-height:100px;background:#00000026;border:2px dashed rgba(255,255,255,.1);border-radius:20px;padding:25px;display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center;margin-bottom:30px;position:relative;transition:all .3s}.sentence-slots:hover{border-color:#fbbf244d}.placeholder-text{color:#64748b;font-size:1rem;font-style:italic}.word-bubble{background:var(--scramble-bg-card);border:1px solid var(--scramble-border);color:var(--scramble-text);padding:12px 24px;border-radius:12px;font-size:1.2rem;font-weight:600;cursor:pointer;transition:.2s all}.word-bubble:hover{background:#ffffff26;transform:translateY(-2px)}.word-bubble.user-word{background:#3b82f6;border-color:#60a5fa;box-shadow:0 4px 12px #3b82f64d}.word-bubble.correct{background:#22c55e!important;border-color:#4ade80!important;box-shadow:0 0 20px #22c55e66}.word-bubble.wrong{background:#ef4444!important;border-color:#f87171!important;animation:shake .4s}.scrambled-area{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:30px}.result-card{text-align:center}.score-circle{width:140px;height:140px;border-radius:50%;background:linear-gradient(135deg,#fbbf24,#f59e0b);display:flex;flex-direction:column;justify-content:center;align-items:center;margin:30px auto;box-shadow:0 0 40px #fbbf244d}.score-num{font-size:3rem;font-weight:800}.score-total{font-size:1.1rem;opacity:.8}.mq-action-group{display:flex;gap:15px;justify-content:center;margin-top:30px}.mq-btn-primary,.mq-btn-secondary{padding:12px 25px;border-radius:12px;font-weight:700;cursor:pointer;transition:.3s;border:none}.mq-btn-primary{background:#fbbf24;color:#1e293b}.mq-btn-secondary{background:#ffffff1a;color:#fff}.locked-modal-overlay{position:fixed;inset:0;background:#000c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.locked-modal-content{background:#1e293b;border:1px solid #fbbf24;padding:40px;border-radius:30px;max-width:450px;text-align:center;position:relative;box-shadow:0 0 50px #00000080}.locked-modal-icon{font-size:4rem;margin-bottom:20px}.locked-modal-title{font-size:1.8rem;margin-bottom:15px;color:#fbbf24}.locked-modal-message{color:#94a3b8;line-height:1.6;margin-bottom:30px}.locked-modal-btn{width:100%;padding:15px;background:#fbbf24;border:none;border-radius:15px;font-weight:800;color:#1e293b;cursor:pointer;font-size:1.1rem}.locked-modal-close{position:absolute;top:20px;right:20px;background:transparent;border:none;color:#64748b;font-size:1.5rem;cursor:pointer}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}@media(max-width:768px){.scramble-main{padding:1rem}.selection-header h1{font-size:2rem}.tense-card{padding:15px;gap:15px}.tense-icon{width:50px;height:50px;font-size:1.8rem}.scramble-container{padding:25px 20px}.scramble-header h1{font-size:1.8rem}.word-bubble{padding:10px 18px;font-size:1rem}.translation{font-size:1.1rem}.mq-action-group{flex-direction:column}.tenses-timeline{padding-left:20px}.tenses-timeline:before{left:4px}.tense-dot{left:-25px;width:16px;height:16px;top:25px}}@media(max-width:480px){.tense-card h3{font-size:1rem}.tense-progress span{font-size:.7rem}.locked-modal-content{padding:30px 20px}}.landing-page{--l-bg-deep: #020a06;--l-bg-primary: #030f09;--l-bg-secondary: #061a10;--l-bg-card: rgba(6, 26, 16, .7);--l-bg-card-hover: rgba(10, 40, 24, .9);--l-bg-elevated: rgba(16, 45, 30, .6);--l-accent: #10b981;--l-accent-light: #34d399;--l-accent-dark: #059669;--l-accent-glow: rgba(16, 185, 129, .3);--l-accent-soft: rgba(16, 185, 129, .08);--l-gold: #f59e0b;--l-gold-light: #fbbf24;--l-gold-soft: rgba(245, 158, 11, .1);--l-text-primary: #ecfdf5;--l-text-secondary: #a7f3d0;--l-text-muted: #6ee7b7;--l-text-dim: rgba(167, 243, 208, .4);--l-border: rgba(52, 211, 153, .12);--l-border-hover: rgba(52, 211, 153, .3);--l-border-glow: rgba(16, 185, 129, .5);--l-gradient-accent: linear-gradient(135deg, #10b981 0%, #059669 50%, #047857 100%);--l-gradient-gold: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);--l-gradient-hero: linear-gradient(135deg, #ecfdf5 0%, #a7f3d0 40%, #6ee7b7 100%);--l-gradient-iris: linear-gradient(135deg, #34d399 0%, #10b981 50%, #f59e0b 100%);--l-gradient-glass: linear-gradient(135deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 100%);--l-shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--l-shadow-md: 0 8px 32px rgba(0, 0, 0, .4);--l-shadow-lg: 0 16px 48px rgba(0, 0, 0, .5);--l-shadow-glow: 0 0 30px rgba(16, 185, 129, .2);--l-shadow-glow-lg: 0 0 60px rgba(16, 185, 129, .3);--l-radius-sm: .75rem;--l-radius-md: 1rem;--l-radius-lg: 1.5rem;--l-radius-xl: 2rem;--l-radius-full: 9999px;--l-ease: cubic-bezier(.16, 1, .3, 1);--l-ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--l-transition-fast: .2s var(--l-ease);--l-transition: .35s var(--l-ease);--l-transition-slow: .5s var(--l-ease);--l-max-width: 1280px;--l-padding: 1.5rem;--l-nav-height: 72px}.landing-page{background:var(--l-bg-deep);min-height:100vh;position:relative;font-family:Plus Jakarta Sans,Inter,-apple-system,BlinkMacSystemFont,sans-serif;color:var(--l-text-primary);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.landing-page:before{content:"";position:fixed;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(ellipse at 20% 50%,rgba(16,185,129,.08) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(52,211,153,.05) 0%,transparent 40%),radial-gradient(ellipse at 50% 80%,rgba(245,158,11,.03) 0%,transparent 40%);pointer-events:none;z-index:0;animation:ambientDrift 20s ease-in-out infinite alternate}@keyframes ambientDrift{0%{transform:translate(0) rotate(0)}to{transform:translate(-3%,2%) rotate(1deg)}}.landing-navbar{position:fixed;top:.75rem;left:50%;transform:translate(-50%);width:calc(100% - 2rem);max-width:var(--l-max-width);z-index:1000;background:#030f09bf;backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid var(--l-border);border-radius:var(--l-radius-xl);padding:.5rem 1.25rem;transition:all var(--l-transition)}.landing-navbar:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(52,211,153,.05) 0%,transparent 50%);pointer-events:none}.nav-container{display:flex;justify-content:space-between;align-items:center;gap:1rem;position:relative}.nav-brand{display:flex;align-items:center;gap:.6rem;cursor:pointer;transition:transform var(--l-transition-fast);flex-shrink:0;z-index:10}.nav-brand:hover{transform:scale(1.03)}.nav-brand img{height:36px;width:auto;filter:drop-shadow(0 0 12px var(--l-accent-glow));transition:filter var(--l-transition)}.nav-brand:hover img{filter:drop-shadow(0 0 20px var(--l-accent-glow))}.nav-brand span{font-size:1.3rem;font-weight:800;background:var(--l-gradient-accent);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-.02em}.landing-nav-center{display:flex;gap:.25rem;background:#ffffff08;padding:.3rem;border-radius:var(--l-radius-lg);border:1px solid rgba(255,255,255,.04)}.btn-premium-nav{padding:.5rem 1rem;background:transparent;border:none;color:var(--l-text-secondary);font-weight:600;font-size:.85rem;cursor:pointer;border-radius:var(--l-radius-md);transition:all var(--l-transition-fast);position:relative;white-space:nowrap;font-family:inherit}.btn-premium-nav:hover{color:var(--l-text-primary);background:#ffffff0d}.btn-premium-nav.active{color:#fff;background:var(--l-gradient-accent);box-shadow:0 0 20px var(--l-accent-glow)}.nav-actions{display:flex;align-items:center;gap:.75rem;flex-shrink:0}.btn-login,.btn-dashboard{padding:.5rem 1.25rem;border-radius:var(--l-radius-md);font-weight:700;font-size:.85rem;cursor:pointer;transition:all var(--l-transition-fast);position:relative;overflow:hidden;font-family:inherit;white-space:nowrap}.btn-login{background:transparent;border:1px solid var(--l-border);color:var(--l-text-primary)}.btn-login:hover{border-color:var(--l-accent);background:var(--l-accent-soft);transform:translateY(-1px)}.btn-dashboard{background:var(--l-gradient-accent);border:none;color:#fff;box-shadow:0 0 20px var(--l-accent-glow)}.btn-dashboard:hover{transform:translateY(-2px);box-shadow:var(--l-shadow-glow-lg)}.mobile-menu-toggle{display:none;background:#ffffff0f;border:1px solid var(--l-border);color:var(--l-text-primary);font-size:1.3rem;cursor:pointer;border-radius:var(--l-radius-sm);padding:.4rem .6rem;transition:all var(--l-transition-fast);font-family:inherit;line-height:1}.mobile-menu-toggle:hover{background:#ffffff1a}.landing-main{position:relative;z-index:1;padding-top:calc(var(--l-nav-height) + 1rem)}.landing-container-v2{width:100%;max-width:var(--l-max-width);margin:0 auto;padding:0 var(--l-padding)}.landing-section{padding:5rem 0}.section-title-center{text-align:center;margin-bottom:3.5rem}.section-title-center p{color:var(--l-text-muted);font-size:1.1rem;margin-top:.75rem;font-weight:500}.hero-section-alt{position:relative;text-align:center;padding:5rem 0 4rem;overflow:hidden}.hero-pill{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1.25rem;background:var(--l-accent-soft);border:1px solid rgba(52,211,153,.2);border-radius:var(--l-radius-full);font-size:.85rem;font-weight:600;color:var(--l-accent-light);margin-bottom:2rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:pillGlow 3s ease-in-out infinite alternate}@keyframes pillGlow{0%{box-shadow:0 0 10px #10b9811a}to{box-shadow:0 0 25px #10b98133}}.hero-main-title{font-size:clamp(2.5rem,7vw,4.5rem);font-weight:900;letter-spacing:-.04em;line-height:1.08;margin-bottom:1.5rem;background:var(--l-gradient-hero);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.text-gradient-iris{background:var(--l-gradient-iris);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.gradient-text{background:var(--l-gradient-accent);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.hero-description{font-size:clamp(1rem,2.5vw,1.2rem);color:var(--l-text-secondary);line-height:1.7;max-width:640px;margin:0 auto 2.5rem;font-weight:400;opacity:.9}.hero-cta{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-bottom:3rem}.btn-glass-cta{position:relative;padding:.9rem 2.5rem;background:var(--l-gradient-accent);border:none;border-radius:var(--l-radius-full);color:#fff;font-weight:700;font-size:1rem;cursor:pointer;overflow:hidden;transition:all var(--l-transition);box-shadow:0 0 30px var(--l-accent-glow),0 8px 30px #0000004d;font-family:inherit;letter-spacing:-.01em}.btn-glass-cta:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .6s}.btn-glass-cta:hover:before{left:100%}.btn-glass-cta:hover{transform:translateY(-3px) scale(1.02);box-shadow:var(--l-shadow-glow-lg),0 12px 40px #0006}.visual-anchor{position:relative;width:100%;height:200px;margin-top:-2rem;pointer-events:none}.aurora-blur{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:300px;background:radial-gradient(ellipse,rgba(16,185,129,.15) 0%,rgba(52,211,153,.05) 40%,transparent 70%);filter:blur(60px);animation:auroraBreath 6s ease-in-out infinite alternate}@keyframes auroraBreath{0%{transform:translate(-50%,-50%) scale(1);opacity:.6}to{transform:translate(-50%,-50%) scale(1.2);opacity:1}}.floating-elements{position:absolute;width:100%;height:100%}.float-icon-premium{position:absolute;font-size:2.5rem;filter:drop-shadow(0 0 15px var(--l-accent-glow));animation:floatPremium 8s ease-in-out infinite;opacity:.7}@keyframes floatPremium{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-18px) rotate(3deg)}50%{transform:translateY(-5px) rotate(-2deg)}75%{transform:translateY(-22px) rotate(4deg)}}.bento-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1.25rem}.bento-card{position:relative;background:var(--l-bg-card);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);border:1px solid var(--l-border);border-radius:var(--l-radius-xl);padding:2rem;transition:all var(--l-transition);overflow:hidden;display:flex;flex-direction:column}.bento-card:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent);transition:left .7s}.bento-card:hover:before{left:100%}.bento-card:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(52,211,153,.03) 0%,transparent 50%);pointer-events:none}.bento-card:hover{border-color:var(--l-border-hover);transform:translateY(-4px);box-shadow:var(--l-shadow-glow),var(--l-shadow-lg)}.card-span-4{grid-column:span 4}.card-span-6{grid-column:span 6}.card-span-8{grid-column:span 8}.card-span-12{grid-column:span 12}.card-row-2{grid-row:span 2}.bento-icon-wrapper{width:56px;height:56px;background:var(--l-accent-soft);border:1px solid rgba(52,211,153,.15);border-radius:var(--l-radius-md);display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin-bottom:1rem;transition:all var(--l-transition-fast)}.bento-card:hover .bento-icon-wrapper{transform:scale(1.08) rotate(3deg);box-shadow:0 0 20px var(--l-accent-glow)}.bento-tag{display:inline-block;padding:.3rem .75rem;background:#10b9811a;border:1px solid rgba(52,211,153,.15);border-radius:var(--l-radius-full);font-size:.7rem;font-weight:700;color:var(--l-accent-light);letter-spacing:.06em;text-transform:uppercase;margin-bottom:.75rem;width:fit-content}.bento-card h3{font-size:1.35rem;font-weight:800;color:var(--l-text-primary);margin-bottom:.5rem;letter-spacing:-.02em}.bento-card p{font-size:.92rem;color:var(--l-text-secondary);line-height:1.6;margin-bottom:1.25rem;opacity:.85}.p-tag-small{display:inline-block;padding:.25rem .7rem;background:var(--l-gold-soft);border:1px solid rgba(245,158,11,.2);border-radius:var(--l-radius-full);font-size:.7rem;font-weight:700;color:var(--l-gold-light);margin-bottom:.75rem;width:fit-content}.mq-btn-primary-large{position:relative;width:100%;padding:.75rem 1.5rem;background:var(--l-gradient-accent);border:none;border-radius:var(--l-radius-md);color:#fff;font-weight:700;font-size:.9rem;cursor:pointer;overflow:hidden;transition:all var(--l-transition);font-family:inherit;margin-top:auto;letter-spacing:-.01em}.mq-btn-primary-large:hover{transform:translateY(-2px);box-shadow:var(--l-shadow-glow)}.st-game-embed-large{background:#0003;border-radius:var(--l-radius-lg);padding:1.5rem;border:1px solid var(--l-border)}.products-bento-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem}.products-bento-grid .bento-card{min-height:280px}.reveal-up{animation:revealUp .8s var(--l-ease) both}@keyframes revealUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.minimal-footer{position:relative;background:var(--l-bg-primary);border-top:1px solid var(--l-border);padding:4rem var(--l-padding) 2rem;margin-top:4rem}.minimal-footer:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--l-accent),transparent);opacity:.3}.footer-inner{max-width:var(--l-max-width);margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:2.5rem;align-items:start}.footer-col h4{font-size:.9rem;font-weight:700;color:var(--l-text-primary);margin-bottom:.75rem;letter-spacing:-.01em}.footer-col .nav-brand{margin-bottom:0}.footer-links{display:flex;flex-direction:column;gap:.5rem}.footer-links a{color:var(--l-text-secondary);text-decoration:none;font-size:.85rem;font-weight:500;transition:all var(--l-transition-fast);position:relative;width:fit-content}.footer-links a:hover{color:var(--l-accent-light);transform:translate(3px)}.footer-midtrans-badge{margin-top:.25rem}.midtrans-logo-text{display:inline-block;font-size:1.4rem;font-weight:800;letter-spacing:.04em;color:var(--l-text-primary);opacity:.5;font-family:Inter,sans-serif;text-transform:lowercase}.footer-midtrans-badge p{font-size:.72rem;color:var(--l-text-muted);margin-top:.3rem;opacity:.6}@media(max-width:1023px){.landing-page{--l-padding: 1.25rem}.landing-navbar{width:calc(100% - 1.5rem)}.bento-grid{grid-template-columns:repeat(6,1fr)}.card-span-8{grid-column:span 6}.card-span-4{grid-column:span 3}.card-span-12{grid-column:span 6}.card-row-2{grid-row:span 1}.hero-main-title{font-size:clamp(2rem,6vw,3.5rem)}.hero-section-alt{padding:3.5rem 0 3rem}.landing-section{padding:3.5rem 0}.footer-inner{grid-template-columns:1fr 1fr;gap:2rem}.footer-inner>.footer-col:first-child{grid-column:span 2}}@media(max-width:767px){.landing-page{--l-padding: 1rem;--l-nav-height: 60px}.landing-navbar{top:0;width:100%;border-radius:0;padding:.5rem 1rem;border-left:none;border-right:none;border-top:none}.nav-brand img{height:30px}.nav-brand span{font-size:1.1rem}.landing-nav-center{position:fixed;top:0;right:-100%;width:80%;max-width:320px;height:100vh;height:100dvh;flex-direction:column;background:var(--l-bg-secondary);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border-radius:0;border:none;border-left:1px solid var(--l-border);padding:5rem 1.5rem 2rem;transition:right var(--l-transition);z-index:999;gap:.5rem;box-shadow:-10px 0 40px #00000080}.landing-nav-center.show{right:0}.landing-nav-center .btn-premium-nav{width:100%;text-align:left;padding:.85rem 1.25rem;font-size:1rem;border-radius:var(--l-radius-md)}.mobile-menu-toggle{display:block}.hero-section-alt{padding:2.5rem 0 2rem}.hero-pill{font-size:.75rem;padding:.4rem 1rem}.hero-main-title{font-size:clamp(1.8rem,8vw,2.8rem);line-height:1.12}.hero-description{font-size:.95rem;line-height:1.6;padding:0 .5rem}.btn-glass-cta{width:100%;padding:.85rem 2rem;font-size:.95rem}.visual-anchor{height:120px}.aurora-blur{width:300px;height:150px}.float-icon-premium{font-size:1.8rem;opacity:.5}.bento-grid{grid-template-columns:1fr;gap:1rem}.card-span-4,.card-span-6,.card-span-8,.card-span-12{grid-column:span 1}.card-row-2{grid-row:span 1}.bento-card{padding:1.5rem;border-radius:var(--l-radius-lg)}.bento-card h3{font-size:1.15rem}.bento-card p{font-size:.88rem}.bento-icon-wrapper{width:48px;height:48px;font-size:1.4rem}.section-title-center{margin-bottom:2rem}.section-title-center h2{font-size:1.8rem!important}.section-title-center p{font-size:.95rem}.landing-section{padding:2.5rem 0}.products-bento-grid{grid-template-columns:1fr;gap:1rem}.products-bento-grid .bento-card{min-height:auto}.st-game-embed-large{padding:1rem}.minimal-footer{padding:2.5rem var(--l-padding) 1.5rem;margin-top:2rem}.footer-inner{grid-template-columns:1fr;gap:1.5rem;text-align:center}.footer-inner>.footer-col:first-child{grid-column:span 1}.footer-col{text-align:center!important}.footer-col .nav-brand{justify-content:center}.footer-col div[style*=flex-end]{justify-content:center!important}.footer-links{align-items:center}.footer-midtrans-badge{text-align:center}}@media(max-width:400px){.landing-page{--l-padding: .75rem}.landing-navbar{padding:.4rem .75rem}.hero-main-title{font-size:1.6rem}.hero-description{font-size:.88rem}.bento-card{padding:1.25rem}}@media(min-width:1440px){.landing-page{--l-max-width: 1400px}.hero-section-alt{padding:7rem 0 5rem}.landing-section{padding:6rem 0}.bento-card{padding:2.5rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.landing-page ::-webkit-scrollbar{width:6px;height:6px}.landing-page ::-webkit-scrollbar-track{background:var(--l-bg-secondary)}.landing-page ::-webkit-scrollbar-thumb{background:#34d39933;border-radius:10px}.landing-page ::-webkit-scrollbar-thumb:hover{background:#34d39966}.landing-page ::selection{background:#10b9814d;color:#fff}.landing-nav-center.show~.nav-overlay{display:block}@media(hover:none)and (pointer:coarse){.bento-card:hover,.btn-glass-cta:hover{transform:none}.bento-card:active{transform:scale(.98)}}.offline-guide-container-p{max-width:1000px;margin:0 auto;padding-bottom:4rem}.guide-hero-premium{background:linear-gradient(135deg,#0ea5e9,#2563eb)!important}.guide-badge-p{display:inline-block;background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;padding:.5rem 1.25rem;border-radius:50px;font-size:.85rem;font-weight:700;margin-bottom:1.25rem;text-transform:uppercase;letter-spacing:1px;border:1px solid rgba(255,255,255,.3)}.guide-steps-grid-p{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;margin:2rem 0 4rem}.guide-step-card-p{background:var(--bg-secondary);border-radius:32px;padding:3rem;border:1px solid var(--border-primary);position:relative;overflow:hidden;transition:all .4s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 10px 25px #0000000d}.guide-step-card-p:hover{transform:translateY(-12px);box-shadow:0 30px 60px -15px #0000001a;border-color:#3b82f6}.step-number-p{position:absolute;top:-10px;right:-10px;font-size:6rem;font-weight:950;color:#3b82f6;opacity:.07;line-height:1}.step-icon-p{font-size:3.5rem;margin-bottom:1.5rem;filter:drop-shadow(0 10px 10px rgba(0,0,0,.1))}.guide-step-card-p h3{font-size:1.5rem;margin-bottom:1rem;color:var(--text-primary);font-weight:850}.guide-step-card-p p{color:var(--text-muted);line-height:1.7;font-size:1rem}.disclaimer-info-premium{background:var(--bg-secondary);border-radius:32px;padding:3.5rem;border:1px solid #fee2e2;margin-bottom:3rem;position:relative;box-shadow:0 20px 40px #ef44440d}.disclaimer-info-premium h3{margin-bottom:2rem;color:#ef4444;font-size:1.75rem;font-weight:800}.disclaimer-grid-p{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem}.disclaimer-item-p{padding:1.5rem;background:var(--bg-primary);border-radius:20px;color:var(--text-secondary);font-size:1rem;line-height:1.6;border-left:6px solid #ef4444}.disclaimer-item-p strong{color:var(--text-primary);display:block;margin-bottom:.5rem;font-size:1.1rem}.guide-note-p{text-align:center;font-style:italic;color:var(--text-muted);padding:3rem;max-width:750px;margin:0 auto;font-size:1.1rem;line-height:1.8}@media(max-width:1024px){.dashboard-main-premium{margin-left:0;padding:0}.offline-guide-container-p{padding:0 1.5rem 4rem}.disclaimer-info-premium{padding:2.5rem}}@media(max-width:768px){.guide-hero-premium{padding:4rem 1.5rem!important;text-align:center}.guide-hero-premium h1{font-size:2.1rem}.guide-step-card-p{padding:2rem}}.report-main-premium{padding:2.5rem;max-width:1300px;margin-left:260px;animation:fadeIn .5s ease-out}.report-header-premium{margin-bottom:3rem;text-align:center}.report-header-premium h1{font-size:2.5rem;font-weight:800;margin-bottom:.75rem;background:linear-gradient(135deg,var(--text-primary) 0%,var(--text-secondary) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.report-header-premium p{color:var(--text-muted);font-size:1.15rem}.stats-row-premium{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin-bottom:2.5rem}.stat-box-mini{background:var(--bg-secondary);padding:1.5rem;border-radius:20px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;align-items:center;border:1px solid var(--border-primary);transition:all .2s}.stat-box-mini:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}.stat-box-mini .label{font-size:.9rem;font-weight:600;color:var(--text-muted);margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.5px}.stat-box-mini .value{font-size:2rem;font-weight:800;color:var(--accent-primary)}.stat-box-mini .value small{font-size:1rem;font-weight:600;color:var(--text-muted);margin-left:.25rem}.report-grid-premium{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:2rem;margin-bottom:3rem}@media(max-width:1200px){.report-grid-premium{grid-template-columns:1fr 1fr}.rankings-col{grid-column:1 / -1}}@media(max-width:768px){.report-grid-premium{grid-template-columns:1fr}}.report-card-premium{background:var(--bg-secondary);border-radius:24px;padding:2rem;box-shadow:0 10px 25px -5px #0000000d;border:1px solid var(--border-primary);display:flex;flex-direction:column}.report-card-premium h3{font-size:1.25rem;font-weight:700;color:var(--text-primary);margin-bottom:1.5rem}.progress-center-p{display:flex;flex-direction:column;align-items:center;margin-bottom:2rem}.circular-p{position:relative;width:200px;height:200px}.progress-info-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;display:flex;flex-direction:column}.progress-info-text .val{font-size:2.5rem;font-weight:800;color:var(--text-primary);line-height:1}.progress-info-text .lbl{font-size:.9rem;color:var(--text-muted);font-weight:600;margin-top:.25rem}.horizontal-stats-p{display:flex;flex-direction:column;gap:1.25rem;width:100%}.h-stat-item{display:flex;justify-content:space-between;align-items:center}.h-stat-item .lbl{color:var(--text-muted);font-weight:500}.h-stat-item .val{font-weight:700;color:var(--text-primary);font-size:1.1rem}.h-stat-item .val small{color:var(--text-disabled);font-weight:500;font-size:.85rem}.chart-container-p{flex:1;display:flex;flex-direction:column}.mini-chart-svg{width:100%;height:150px;margin:1.5rem 0}.chart-axis-p{display:flex;justify-content:space-between;padding:0 10px}.chart-axis-p span{font-size:.75rem;color:var(--text-disabled);font-weight:600}.leaders-list-p{display:flex;flex-direction:column;gap:.75rem}.leader-row-p{display:flex;align-items:center;gap:1rem;padding:.875rem 1.25rem;background:var(--bg-tertiary);border-radius:16px;transition:all .2s}.leader-row-p:hover{background:var(--bg-secondary);box-shadow:0 4px 6px -1px #0000000d}.leader-row-p.is-me{background:var(--accent-gradient);opacity:.9;color:#fff}.r-num{width:28px;height:28px;background:var(--border-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;color:var(--text-secondary)}.is-me .r-num{background:#fff;color:var(--accent-primary)}.r-name{flex:1;font-weight:600}.r-val{font-weight:700;color:var(--accent-primary)}.is-me .r-name,.is-me .r-val{color:#fff}.report-tabs-p{display:flex;justify-content:center;gap:1rem;margin-bottom:2.5rem}.tab-btn-p{padding:.875rem 2rem;border-radius:14px;border:none;background:var(--bg-secondary);color:var(--text-muted);font-weight:700;cursor:pointer;transition:all .2s;box-shadow:0 4px 6px -1px #0000000d}.tab-btn-p:hover{transform:translateY(-2px)}.tab-btn-p.is-active{background:var(--accent-primary);color:#fff;box-shadow:0 10px 15px -3px var(--accent-shadow)}.juz-explorer-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1.25rem}.juz-item-p{background:var(--bg-secondary);padding:1.5rem;border-radius:20px;text-align:center;cursor:pointer;border:1px solid var(--border-primary);transition:all .3s}.juz-item-p:hover{transform:scale(1.05);border-color:var(--primary-color);box-shadow:0 10px 20px -5px #0000000d}.juz-item-p.has-progress{background:var(--bg-tertiary);border-color:#fbbf24}.juz-item-p.is-done{background:var(--bg-tertiary);border-color:#22c55e}.j-label{display:block;font-size:.85rem;color:#94a3b8;margin-bottom:.25rem;font-weight:600}.j-val{display:block;font-size:1.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.75rem}.j-bar{height:6px;background:var(--bg-tertiary);border-radius:10px;overflow:hidden}.j-bar .fill{height:100%;background:#22c55e;border-radius:10px}.j-detail-p{background:var(--bg-secondary);border-radius:24px;padding:2.5rem;box-shadow:0 10px 25px -5px #0000000d}.j-detail-header{display:flex;align-items:center;gap:1.5rem;margin-bottom:2.5rem}.btn-back-p{padding:.6rem 1.2rem;background:var(--bg-tertiary);color:var(--text-secondary);border:none;border-radius:12px;font-weight:700;cursor:pointer}.surah-list-p{display:flex;flex-direction:column;gap:1.5rem}.s-item-p{display:flex;flex-direction:column;gap:.75rem}.s-info-p{display:flex;justify-content:space-between;align-items:flex-end}.s-name-p{font-size:1.15rem;font-weight:700;color:var(--text-primary)}.s-meta-p{font-size:.9rem;color:var(--text-muted);font-weight:500}.s-bar-p{height:8px;background:var(--bg-tertiary);border-radius:10px}.s-bar-p .fill{height:100%;background:linear-gradient(90deg,#10b981,#3b82f6);border-radius:10px}.kosakata-grid-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.k-card-p{background:var(--bg-secondary);border-radius:20px;padding:1.5rem;border:1px solid var(--border-secondary);transition:all .3s}.k-card-p:hover{transform:translateY(-5px);border-color:var(--accent-primary)}.k-header-p{display:flex;justify-content:space-between;margin-bottom:1rem}.k-header-p h4{margin:0;font-size:1.2rem;font-weight:700}.k-badge-p{padding:.25rem .75rem;border-radius:10px;font-size:.75rem;font-weight:700}.k-badge-p.done{background:#dcfce7;color:#166534}.k-stats-p{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;color:var(--text-muted);font-size:.9rem}.k-stats-p b{color:var(--text-primary)}.k-continue-p{display:block;width:100%;padding:.75rem;text-align:center;background:var(--bg-tertiary);color:var(--accent-primary);text-decoration:none;border-radius:12px;font-weight:700}@media(max-width:1024px){.report-main-premium{padding:0;margin-left:0}}@media(max-width:768px){.report-header-premium{padding:3rem 1.5rem}.stats-row-premium{grid-template-columns:1fr;padding:0 1.5rem}.report-grid-premium,.report-tabs-p{padding:0 1.5rem}}.surah-report-grid-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.75rem;padding:1rem 0}.s-report-card-p{background:var(--bg-secondary);border-radius:28px;padding:1.75rem;position:relative;border:1px solid var(--border-primary);transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex;flex-direction:column;gap:1.5rem;box-shadow:0 4px 15px #00000008;overflow:hidden}.s-report-card-p:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:transparent;transition:background .3s}.s-report-card-p:hover{transform:translateY(-8px) scale(1.02);border-color:var(--accent-primary);box-shadow:0 20px 30px -10px #00000014}.s-report-card-p.fully-memorized{border-color:#fbbf24;background:linear-gradient(135deg,var(--bg-secondary) 0%,rgba(251,191,36,.08) 100%)}.s-report-card-p.fully-memorized:before{background:linear-gradient(90deg,#f59e0b,#fbbf24)}.golden-star-p{position:absolute;top:15px;right:15px;background:radial-gradient(circle,#fff9c4,#fbc02d);width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:0 4px 15px #d4af3766;font-size:1.2rem;border:2px solid white;z-index:5;animation:goldPulsePremium 2s infinite}@keyframes goldPulsePremium{0%{transform:scale(1);box-shadow:0 0 #fbbf2480}70%{transform:scale(1.15);box-shadow:0 0 0 10px #fbbf2400}to{transform:scale(1);box-shadow:0 0 #fbbf2400}}.s-card-header-p{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem}.s-card-num-p{font-size:.75rem;font-weight:800;color:var(--accent-primary);background:#b59e6f1a;padding:4px 12px;border-radius:20px;margin-bottom:.5rem}.s-card-names-p{display:flex;flex-direction:column;gap:2px}.s-card-arabic-p{font-family:KFGQPC,Amiri,serif;font-size:2rem;color:var(--text-primary);line-height:1.1}.s-card-latin-p{font-size:.9rem;font-weight:700;color:var(--text-muted);letter-spacing:.5px;text-transform:uppercase}.s-card-progress-p{display:flex;flex-direction:column;gap:.75rem}.s-meta-text-p{display:flex;justify-content:space-between;font-size:.85rem;font-weight:700;color:var(--text-muted)}.s-progress-bar-p{height:10px;background:#0000000d;border-radius:20px;overflow:hidden;position:relative}.s-progress-bar-p .fill{height:100%;background:linear-gradient(90deg,#10b981,#34d399);border-radius:20px;transition:width .8s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #10b9814d}.fully-memorized .s-progress-bar-p .fill{background:linear-gradient(90deg,#f59e0b,#fbbf24);box-shadow:0 0 15px #f59e0b66}.kosakata-theme .s-card-arabic-p{color:var(--accent-secondary)}.kosakata-theme .s-card-num-p{color:var(--accent-secondary);background:#0d94881a}.kosakata-theme .s-progress-bar-p .fill{background:linear-gradient(90deg,var(--accent-secondary),#2dd4bf);box-shadow:0 0 10px #0d94884d}.kosakata-theme .s-report-card-p.fully-mastered{border-color:var(--accent-secondary);background:linear-gradient(135deg,var(--bg-secondary) 0%,rgba(13,148,136,.08) 100%)}.kosakata-theme .s-report-card-p.fully-mastered:before{background:linear-gradient(90deg,var(--accent-primary),var(--accent-secondary))}.science-star-badge{position:absolute;top:15px;right:15px;background:radial-gradient(circle,#ccfbf1,#0d9488);width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:12px;box-shadow:0 4px 15px #0d948866;font-size:1.2rem;border:2px solid white;z-index:5;animation:sciencePulse 2s infinite;transform:rotate(45deg)}.science-star-badge span{transform:rotate(-45deg)}@keyframes sciencePulse{0%{transform:rotate(45deg) scale(1);box-shadow:0 0 #0d948880}70%{transform:rotate(45deg) scale(1.1);box-shadow:0 0 0 10px #0d948800}to{transform:rotate(45deg) scale(1);box-shadow:0 0 #0d948800}}.k-mini-btn{display:block;width:100%;padding:.6rem;text-align:center;border-radius:12px;text-decoration:none;font-size:.85rem;font-weight:700;transition:all .2s;background:#0d94880d;color:#0d9488;border:1px solid rgba(13,148,136,.2)}.k-mini-btn:hover{background:#0d9488;color:#fff}.k-mini-btn.start{background:transparent;border-style:dashed;color:var(--text-disabled)}.no-activity{opacity:.7;filter:grayscale(.5)}.has-activity{opacity:1;filter:none}.s-note-p{font-size:.8rem;color:var(--text-muted);margin-top:.75rem;font-style:italic;border-top:1px solid var(--border-primary);padding-top:.6rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.s-note-p:hover{-webkit-line-clamp:unset;line-clamp:unset}.m-verse-section{background:#f8fafc80;padding:1.5rem;border-radius:20px;margin-top:1.5rem;border:1px solid var(--border-primary)}.m-verse-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem}.m-verse-header h4{margin:0;font-size:1rem;color:var(--text-secondary)}.m-legend{display:flex;gap:1rem}.l-item{font-size:.8rem;display:flex;align-items:center;gap:.5rem;color:var(--text-muted);font-weight:600}.dot{width:8px;height:8px;border-radius:50%}.dot.mastered{background:#22c55e;box-shadow:0 0 10px #22c55e66}.dot.gray{background:#e2e8f0}.v-bubble-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(28px,1fr));gap:6px;max-height:280px;overflow-y:auto;padding-right:8px;padding-bottom:5px}.v-bubble{width:28px;height:28px;border-radius:50%;background:#f1f5f9;color:#94a3b8;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;transition:all .2s cubic-bezier(.4,0,.2,1);border:1px solid transparent}.v-bubble.mastered{background:#22c55e;color:#fff;box-shadow:0 4px 6px -1px #22c55e33;border-color:#16a34a}.v-bubble:hover{transform:scale(1.1);z-index:2;box-shadow:0 10px 15px -3px #0000001a}.v-bubble-grid::-webkit-scrollbar{width:4px}.v-bubble-grid::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:10px}.gh-main-p{padding:2.5rem;max-width:1400px;margin-left:260px;animation:fadeIn .5s ease-out}.gh-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:3rem;gap:2rem}.gh-title-p h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.gh-title-p p{color:var(--text-muted);font-size:1.1rem}.gh-controls-p{display:flex;gap:1rem;align-items:center}.gh-search-p input{padding:.8rem 1.5rem;border-radius:14px;border:1.5px solid var(--border-secondary);background:var(--bg-secondary);font-weight:600;width:250px}.gh-select-p{padding:.8rem 1.5rem;border-radius:14px;border:1.5px solid var(--border-secondary);background:var(--bg-secondary);font-weight:700;cursor:pointer}.gh-stats-row-p{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-bottom:3rem}.gh-stat-card-p{background:var(--bg-secondary);border-radius:24px;padding:2rem;display:flex;align-items:center;gap:1.5rem;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary)}.gh-stat-icon-p{width:60px;height:60px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:1.75rem}.gh-stat-icon-p.blue{background:#eff6ff;color:#3b82f6}.gh-stat-icon-p.green{background:#f0fdf4;color:#22c55e}.gh-stat-icon-p.purple{background:#faf5ff;color:#a855f7}.gh-stat-info-p span:first-child{display:block;font-size:1.75rem;font-weight:800;color:var(--text-primary)}.gh-stat-info-p span:last-child{color:var(--text-muted);font-weight:600;font-size:.95rem}.gh-grid-p{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-bottom:3rem}.gh-card-p{background:var(--bg-secondary);border-radius:24px;padding:2rem;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary)}.gh-card-p h3{font-size:1.25rem;font-weight:800;color:var(--text-primary);margin-bottom:2rem}.gh-juz-list-p{display:flex;flex-direction:column;gap:1.25rem}.gh-juz-item-p{display:flex;align-items:center;gap:1.5rem}.gh-juz-name-p{width:70px;font-weight:800;color:var(--text-secondary)}.gh-juz-bar-p{flex:1;height:10px;background:var(--bg-tertiary);border-radius:10px;overflow:hidden}.gh-juz-fill-p{height:100%;background:linear-gradient(90deg,#4f46e5,#818cf8);border-radius:10px}.gh-juz-count-p{width:80px;text-align:right;font-weight:700;color:#4f46e5;font-size:.9rem}.gh-table-container-p{overflow-x:auto}.gh-table-p{width:100%;border-collapse:separate;border-spacing:0 .75rem}.gh-table-p th{text-align:left;padding:1rem 1.5rem;color:var(--text-muted);font-weight:700;font-size:.85rem;text-transform:uppercase}.gh-row-p{background:var(--bg-primary);transition:all .2s}.gh-row-p:hover{transform:scale(1.01);background:var(--bg-tertiary);box-shadow:0 4px 6px -1px #0000000d}.gh-row-p td{padding:1.25rem 1.5rem}.gh-row-p td:first-child{border-radius:16px 0 0 16px}.gh-row-p td:last-child{border-radius:0 16px 16px 0}.gh-rank-p{width:32px;height:32px;background:var(--bg-secondary);border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;box-shadow:0 2px 4px #0000000d}.gh-rank-1-p{background:#fef3c7;color:#b45309}.gh-rank-2-p{background:#e2e8f0;color:var(--text-secondary)}.gh-rank-3-p{background:#ffedd5;color:#9a3412}.gh-student-info-p strong{display:block;font-size:1rem;color:var(--text-primary)}.gh-student-info-p small{color:var(--text-muted);font-weight:600}.gh-count-pill-p{display:inline-block;padding:.4rem 1rem;background:#eef2ff;color:#4f46e5;border-radius:12px;font-weight:800;font-size:.9rem}.gh-last-cap-p span:first-child{display:block;font-weight:800;color:var(--text-secondary)}.gh-last-cap-p span:last-child{font-size:.85rem;color:var(--text-muted);font-weight:600}@media(max-width:1024px){.gh-main-p{margin-left:0;padding-top:80px}.gh-grid-p,.gh-stats-row-p{grid-template-columns:1fr}.gh-header-p{flex-direction:column;align-items:stretch;text-align:center}.gh-controls-p{flex-direction:column}.gh-search-p input{width:100%}}.gh-note-p{font-size:.825rem;color:var(--text-secondary);font-style:italic;background:var(--bg-tertiary);padding:.5rem .75rem;border-radius:10px;border-left:3px solid var(--accent-primary);max-width:250px;white-space:normal;word-break:break-word}.gh-modal-overlay-p{position:fixed;inset:0;background:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.gh-modal-content-p{background:var(--bg-secondary);width:90%;max-width:600px;max-height:80vh;border-radius:24px;box-shadow:0 25px 50px -12px #00000040;display:flex;flex-direction:column;overflow:hidden;animation:slideUp .3s ease-out}.gh-modal-header-p{padding:1.5rem 2rem;border-bottom:1px solid var(--border-primary);display:flex;justify-content:space-between;align-items:center}.gh-modal-header-p h2{font-size:1.25rem;font-weight:800;color:var(--text-primary);margin:0}.gh-modal-header-p p{font-size:.85rem;color:var(--text-muted);margin:.25rem 0 0}.gh-modal-close-p{background:var(--bg-tertiary);border:none;width:36px;height:36px;border-radius:50%;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:all .2s}.gh-modal-close-p:hover{background:#fee2e2;color:#ef4444}.gh-modal-body-p{padding:1.5rem 2rem;overflow-y:auto;flex:1}.gh-surah-detail-list-p{display:flex;flex-direction:column;gap:1rem}.gh-surah-detail-card-p{background:var(--bg-tertiary);padding:1.25rem;border-radius:16px;border:1px solid var(--border-secondary)}.gh-sd-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.gh-sd-name-p{font-weight:700;color:var(--text-primary);font-size:1rem}.gh-sd-count-p{font-size:.8rem;font-weight:700;color:var(--accent-primary);background:#4f46e51a;padding:2px 8px;border-radius:8px}.gh-sd-verses-p{font-size:.875rem;color:var(--text-secondary);margin-bottom:.75rem}.gh-sd-verses-p strong{color:var(--text-primary)}.gh-sd-progress-p{height:6px;background:#0000000d;border-radius:10px;overflow:hidden}.gh-sd-progress-p .fill{height:100%;background:var(--accent-gradient);border-radius:10px}.v-bubble-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(26px,1fr));gap:5px;max-height:200px;overflow-y:auto;padding-right:4px}.v-bubble{width:26px;height:26px;border-radius:50%;background:var(--bg-primary);color:var(--text-disabled);display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;transition:all .2s;border:1px solid var(--border-primary)}.v-bubble.mastered{background:#22c55e;color:#fff;border-color:#16a34a;box-shadow:0 4px 6px -1px #22c55e33}.settings-main-p{padding:2.5rem;max-width:1400px;margin-left:260px;animation:fadeIn .5s ease-out}@media(max-width:1024px){.settings-main-p{margin-left:0;padding:5rem 1rem 2rem}}.s-header-p{margin-bottom:3rem}.s-header-p h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.s-header-p p{color:var(--text-muted);font-size:1.1rem}.s-alert-p{padding:1.25rem 1.5rem;border-radius:16px;margin-bottom:2.5rem;display:flex;align-items:center;gap:1rem;font-weight:600;animation:slideInDown .4s ease-out}.s-alert-success-p{background:#dcfce7;color:#166534;border:1px solid #bbf7d0}.s-alert-error-p{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}.s-grid-p{display:grid;grid-template-columns:repeat(auto-fit,minmax(450px,1fr));gap:2rem}.s-card-p{background:var(--bg-secondary);border-radius:24px;padding:2.5rem;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary)}.s-card-title-p{display:flex;align-items:center;gap:1rem;margin-bottom:2.5rem;padding-bottom:1rem;border-bottom:1.5px solid var(--border-primary)}.s-card-title-p h3{font-size:1.35rem;font-weight:800;color:var(--text-primary);margin:0}.s-card-icon-p{font-size:1.75rem}.s-field-p{margin-bottom:1.5rem}.s-field-p label{display:block;margin-bottom:.75rem;font-weight:700;font-size:.9rem;color:var(--text-secondary)}.s-input-p{width:100%;padding:.8rem 1.25rem;border-radius:12px;border:1.5px solid var(--border-secondary);font-size:1rem;font-weight:600;transition:all .2s;background:var(--bg-primary)}.s-input-p:focus{border-color:var(--accent-primary);background:var(--bg-secondary);outline:none;box-shadow:0 0 0 4px #4f46e51a}.s-checkbox-card-p{display:flex;align-items:center;gap:1.25rem;padding:1.25rem;border-radius:16px;background:var(--bg-primary);border:1.5px solid var(--border-primary);cursor:pointer;transition:all .2s;margin-bottom:1rem}.s-checkbox-card-p:hover{border-color:var(--text-muted);background:var(--bg-tertiary)}.s-checkbox-card-p input[type=checkbox]{width:22px;height:22px;border-radius:6px;accent-color:#4f46e5}.s-checkbox-info-p strong{display:block;font-size:1rem;color:var(--text-primary);margin-bottom:.25rem}.s-checkbox-info-p span{font-size:.85rem;color:var(--text-muted)}.s-btn-save-p{width:100%;padding:1rem;border-radius:14px;border:none;font-weight:800;font-size:1.1rem;cursor:pointer;transition:all .3s;margin-top:1.5rem}.s-btn-primary-p{background:#4f46e5;color:#fff;box-shadow:0 10px 15px -3px #4f46e54d}.s-btn-primary-p:hover{transform:translateY(-3px);box-shadow:0 20px 25px -5px #4f46e566}.s-btn-teal-p{background:#0d9488;color:#fff;box-shadow:0 10px 15px -3px #0d94884d}.s-btn-teal-p:hover{transform:translateY(-3px);box-shadow:0 20px 25px -5px #0d948866}.s-info-banner-p{margin-top:3.5rem;padding:3rem;background:linear-gradient(135deg,#1e293b,#0f172a);border-radius:32px;color:#fff;position:relative;overflow:hidden}.s-info-banner-p:after{content:"";position:absolute;top:-50%;right:-10%;width:400px;height:400px;background:radial-gradient(circle,rgba(79,70,229,.15) 0%,transparent 70%);pointer-events:none}.s-info-grid-p{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:3rem}.s-env-item-p span{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:#94a3b8;margin-bottom:.75rem}.s-env-item-p strong{font-size:1.35rem;font-weight:800}.s-description-p{color:var(--text-muted);margin-bottom:1.5rem;font-size:.95rem}@keyframes slideInDown{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}@media(max-width:640px){.s-grid-p{grid-template-columns:1fr}.s-card-p{padding:1.5rem}}.notif-main-p{padding:2.5rem;max-width:1400px;margin-left:260px;animation:fadeIn .5s ease-out}.n-header-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:3rem;gap:2rem}.n-header-info-p h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.n-header-info-p p{color:var(--text-muted);font-size:1.1rem}.n-btn-add-p{padding:1rem 2rem;background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;border:none;border-radius:16px;font-weight:700;cursor:pointer;box-shadow:0 10px 15px -3px #4f46e54d;transition:all .3s;display:flex;align-items:center;gap:.75rem}.n-btn-add-p:hover{transform:translateY(-3px);box-shadow:0 20px 25px -5px #4f46e566}.n-grid-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:2rem}.n-card-p{background:var(--bg-secondary);border-radius:24px;padding:2rem;box-shadow:0 10px 15px -3px #0000000d;border:1px solid var(--border-primary);position:relative;display:flex;flex-direction:column;transition:all .3s}.n-card-p:hover{transform:translateY(-5px);box-shadow:0 20px 25px -5px #0000001a}.n-card-p.inactive{opacity:.7;background:var(--bg-primary)}.n-card-top-p{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.n-badge-p{padding:.4rem 1rem;border-radius:12px;font-size:.75rem;font-weight:800;text-transform:uppercase}.n-badge-all-p{background:#eef2ff;color:#4f46e5}.n-badge-guru-p{background:#fdf4ff;color:#a21caf}.n-badge-murid-p{background:#fffbeb;color:#b45309}.n-date-p{font-size:.85rem;color:var(--text-muted);font-weight:600}.n-card-p h3{font-size:1.25rem;font-weight:800;color:#1e293b;margin-bottom:.75rem}.n-card-p p{font-size:.95rem;color:var(--text-secondary);line-height:1.6;margin-bottom:2rem;flex:1}.n-card-actions-p{display:flex;gap:.75rem;padding-top:1.5rem;border-top:1.5px solid var(--border-primary)}.n-btn-edit-p{flex:1;padding:.75rem;background:var(--bg-tertiary);color:var(--text-primary);border:none;border-radius:12px;font-weight:700;cursor:pointer;transition:all .2s}.n-btn-edit-p:hover{background:var(--border-primary)}.n-btn-delete-p{padding:.75rem 1rem;background:#fee2e2;color:#ef4444;border:none;border-radius:12px;font-weight:700;cursor:pointer;transition:all .2s}.n-btn-delete-p:hover{background:#fecaca}.n-draft-tag-p{position:absolute;top:-10px;right:20px;background:var(--text-secondary);color:#fff;padding:.25rem .75rem;border-radius:8px;font-size:.7rem;font-weight:800}@media(max-width:1024px){.notif-main-p{margin-left:0;padding-top:80px}}@media(max-width:640px){.n-header-p{flex-direction:column;align-items:stretch;text-align:center}.n-btn-add-p{justify-content:center}.n-grid-p{grid-template-columns:1fr}}.sholat-container{padding:20px;max-width:1000px;margin:0 auto;animation:fadeIn .5s ease-out}.sholat-header{margin-bottom:30px;text-align:center}.sholat-header h1{font-size:2.5rem;color:var(--text-primary);margin-bottom:10px;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.sholat-header p{color:var(--text-secondary);font-size:1.1rem}.search-container{position:relative;max-width:500px;margin:0 auto 30px;z-index:10}.search-box{display:flex;align-items:center;background:var(--bg-card);border:1px solid var(--border-secondary);border-radius:12px;padding:10px 15px;transition:all .3s ease;box-shadow:0 4px 6px #0000000d}.search-box:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.1)}.search-icon{font-size:1.2rem;margin-right:10px}.search-box input{background:transparent;border:none;outline:none;color:var(--text-primary);width:100%;font-size:1rem}.city-results{position:absolute;top:100%;left:0;right:0;background:var(--bg-card);border:1px solid var(--border-secondary);border-radius:12px;margin-top:5px;max-height:250px;overflow-y:auto;box-shadow:0 10px 25px #0000001a}.city-item{padding:12px 15px;cursor:pointer;transition:background .2s;color:var(--text-primary);border-bottom:1px solid var(--border-secondary)}.city-item:last-child{border-bottom:none}.city-item:hover{background:var(--bg-hover)}.view-selector{display:flex;justify-content:center;gap:10px;margin-bottom:30px}.view-selector button{padding:10px 25px;border-radius:20px;border:1px solid var(--border-secondary);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;transition:all .3s;font-weight:600}.view-selector button.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color);box-shadow:0 4px 10px rgba(var(--primary-rgb),.3)}.daily-grid{background:var(--bg-card);border-radius:20px;padding:30px;box-shadow:0 10px 30px #0000001a;border:1px solid var(--border-secondary)}.today-info{text-align:center;margin-bottom:30px}.today-info h3{font-size:1.5rem;margin-bottom:5px}.times-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:15px}.time-card{background:var(--bg-main);padding:20px;border-radius:15px;display:flex;flex-direction:column;align-items:center;transition:transform .3s,box-shadow .3s;border:1px solid var(--border-secondary)}.time-card:hover{transform:translateY(-5px);box-shadow:0 5px 15px #0000001a}.time-label{font-size:.9rem;color:var(--text-secondary);margin-bottom:10px;text-transform:uppercase;letter-spacing:1px}.time-value{font-size:1.5rem;font-weight:700;color:var(--primary-color)}.time-card.highlight{background:linear-gradient(135deg,rgba(var(--primary-rgb),.1),rgba(var(--secondary-rgb),.1));border:1px solid var(--primary-color)}.time-card.highlight .time-label{color:var(--primary-color);font-weight:700}.monthly-table-container{background:var(--bg-card);border-radius:20px;padding:25px;box-shadow:0 10px 30px #0000001a;border:1px solid var(--border-secondary)}.monthly-table-container h3{margin-bottom:20px;text-align:center}.table-responsive{overflow-x:auto}.monthly-table{width:100%;border-collapse:collapse}.monthly-table th,.monthly-table td{padding:12px 15px;text-align:center;border-bottom:1px solid var(--border-secondary)}.monthly-table th{background:var(--bg-hover);font-weight:600;color:var(--text-secondary)}.today-row{background:rgba(var(--primary-rgb),.05);font-weight:700}.highlight-column{color:var(--primary-color);font-weight:600}.loading-spinner{text-align:center;padding:50px}.spinner{width:40px;height:40px;border:4px solid var(--border-secondary);border-top:4px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 15px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.detect-btn{display:block;margin:10px auto 0;padding:8px 20px;border-radius:20px;border:1px solid var(--primary-color);background:transparent;color:var(--primary-color);cursor:pointer;font-weight:600;font-size:.9rem;transition:all .3s ease}.detect-btn:hover:not(:disabled){background:var(--primary-color);color:#fff;box-shadow:0 4px 10px rgba(var(--primary-rgb),.3)}.detect-btn:disabled{opacity:.6;cursor:not-allowed}.sholat-source-info{text-align:center;margin-top:20px;padding:12px;color:var(--text-secondary);opacity:.7}@media(max-width:768px){.sholat-header h1{font-size:2rem}.times-container{grid-template-columns:repeat(2,1fr)}.sholat-container{padding:10px}}.juz30-container{max-width:1200px;margin:0 auto;animation:fadeIn .5s ease-out}.juz30-menu .menu-header{background:linear-gradient(135deg,#10b981,#059669);padding:3.5rem 2rem;border-radius:0 0 40px 40px;text-align:center;color:#fff;margin-bottom:3.5rem;box-shadow:0 10px 30px #10b98133;position:relative;overflow:hidden}.juz30-menu .menu-header:after{content:"🕌";position:absolute;bottom:-10px;right:-10px;font-size:8rem;opacity:.15;transform:rotate(-10deg)}.juz30-menu .menu-header h1{font-size:2.75rem;font-weight:850;margin-bottom:.75rem}.juz30-menu .menu-header p{font-size:1.2rem;opacity:.9}.levels-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.75rem;padding:0 2rem 4rem}.level-card{background:#fff;border-radius:24px;padding:2rem;cursor:pointer;transition:all .4s cubic-bezier(.175,.885,.32,1.275);border:1px solid #f1f5f9;box-shadow:0 10px 20px #00000008;display:flex;flex-direction:column;gap:1.25rem;position:relative;overflow:hidden}.level-card:hover:not(.locked){transform:translateY(-8px);box-shadow:0 25px 50px -12px #10b98126;border-color:#10b981}.level-card.completed{border-color:#10b981;background:#f0fdf4}.level-number{width:40px;height:40px;background:#ecfdf5;color:#10b981;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.1rem}.level-info .surah-name{display:block;font-size:1.4rem;font-weight:800;color:#1e293b;margin-bottom:.25rem}.level-info .question-count{font-size:.95rem;color:#64748b;font-weight:600}.progress-badge{background:#f1f5f9;height:30px;border-radius:15px;position:relative;overflow:hidden;margin-top:.5rem}.progress-bar{height:100%;background:linear-gradient(90deg,#10b981,#34d399);transition:width .6s ease-in-out}.progress-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.8rem;font-weight:800;color:#064e3b}.completed-badge{position:absolute;top:1rem;right:1rem;color:#10b981;font-size:1.25rem;font-weight:900}.juz30-game{max-width:800px;margin:2rem auto;padding:0 1.5rem}.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2.5rem}.game-progress{display:flex;gap:1.5rem;align-items:center;font-weight:700;color:#64748b}.score-display{background:#ecfdf5;color:#10b981;padding:.5rem 1rem;border-radius:12px}.juz30-game .question-card{background:#fff;border-radius:40px;padding:4rem 3rem;text-align:center;box-shadow:0 25px 50px -12px #0000001a;border:1px solid #f1f5f9}.arabic-word,.arabic-word-v2{font-family:KFGQPC,Amiri,serif;font-size:4.5rem;color:#1e293b;margin-bottom:2rem;direction:rtl;line-height:1.6}.question-label-v2{font-size:1.1rem;color:#64748b;font-weight:700;margin-bottom:1rem;text-transform:uppercase;letter-spacing:1px}.audio-play-btn{background:#ecfdf5;color:#10b981;border:2px solid #10b981;padding:.6rem 1.2rem;border-radius:50px;font-weight:700;cursor:pointer;margin-bottom:1.5rem;transition:all .2s}.audio-play-btn:hover{background:#10b981;color:#fff}.options-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-top:2.5rem}.option-btn{padding:1.5rem;border-radius:20px;background:#f8fafc;border:2px solid #e2e8f0;color:#1e293b;font-size:1.2rem;font-weight:700;cursor:pointer;transition:all .3s}.option-btn:hover:not(:disabled){background:#fff;border-color:#10b981;transform:translateY(-3px)}.option-btn.correct{background:#10b981!important;border-color:#10b981!important;color:#fff!important}.option-btn.wrong{background:#ef4444!important;border-color:#ef4444!important;color:#fff!important}.feedback{margin-top:2rem;font-weight:800;font-size:1.2rem;padding:1rem;border-radius:15px}.feedback.correct{color:#10b981;background:#ecfdf5}.feedback.wrong{color:#ef4444;background:#fef2f2}.next-btn{width:100%;margin-top:2rem;padding:1.25rem;border-radius:20px;background:#1e293b;color:#fff;border:none;font-weight:800;font-size:1.1rem;cursor:pointer;transition:all .3s}.next-btn:hover{background:#0f172a;transform:scale(1.02)}.result-card{background:#fff;border-radius:40px;padding:4rem;text-align:center;max-width:500px;margin:4rem auto;box-shadow:0 40px 60px -15px #0000001a}.score-circle{width:150px;height:150px;background:#ecfdf5;border:6px solid #10b981;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:2rem auto}.score-value{font-size:3rem;font-weight:900;color:#10b981}.retry-btn{width:100%;padding:1.25rem;border-radius:16px;font-weight:800;font-size:1.1rem;cursor:pointer;background:#10b981;color:#fff;border:none;transition:all .3s;margin-bottom:1rem}.loading-overlay-mini{position:fixed;inset:0;background:#fffc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;gap:1rem}.loader-mini{width:40px;height:40px;border:4px solid #f1f5f9;border-top:4px solid #10b981;border-radius:50%;animation:spin 1s linear infinite}.level-card.disabled{opacity:.7;pointer-events:none}@media(max-width:768px){.juz30-menu .menu-header h1{font-size:2rem}.levels-grid{grid-template-columns:1fr;padding:1.5rem}.options-grid{grid-template-columns:1fr}.arabic-word{font-size:3rem}.juz30-game .question-card{padding:2.5rem 1.5rem}}.trial-mode-banner{background:#10b9811a;border:1px solid rgba(16,185,129,.3);border-radius:12px;padding:1rem;margin:-2rem 2rem 2rem;display:flex;align-items:center;gap:1rem;justify-content:center}.trial-badge{background:#10b981;color:#fff;padding:.2rem .6rem;border-radius:6px;font-size:.75rem;font-weight:800;text-transform:uppercase}.trial-mode-banner p{margin:0;font-size:.9rem;color:#1e293b;font-weight:600}.highlight-text{color:#10b981;cursor:pointer;text-decoration:underline}.guest-save-prompt{background:#f8fafc;border:2px dashed #e2e8f0;border-radius:20px;padding:1.5rem;margin:1.5rem 0}.guest-save-prompt p{font-size:.95rem;color:#64748b;margin-bottom:1rem;font-weight:600}.login-prompt-btn{background:#1e293b;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:12px;font-weight:700;cursor:pointer;transition:all .2s}.login-prompt-btn:hover{background:#0f172a;transform:scale(1.05)}.activity-report-container{padding:2rem;background-color:var(--bg-dashboard);min-height:100vh;margin-left:260px;transition:margin-left .3s ease}@media(max-width:1024px){.activity-report-container{margin-left:240px}}@media(max-width:768px){.activity-report-container{margin-left:0;padding-top:60px}}.report-header{margin-bottom:2rem}.report-header h1{font-size:1.75rem;color:var(--text-primary);margin-bottom:.5rem}.report-header p{color:var(--text-muted)}.two-column-layout{display:grid;grid-template-columns:1fr 380px;gap:2rem;margin-top:2rem}.activity-feed-section,.top-performers-section{background:var(--bg-secondary);border-radius:16px;padding:1.5rem;border:1px solid var(--border-secondary);box-shadow:var(--shadow-sm)}.section-header{margin-bottom:1.5rem;border-bottom:1px solid var(--border-secondary);padding-bottom:1rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.filter-group{display:flex;gap:.5rem;background:var(--bg-tertiary);padding:.25rem;border-radius:10px}.filter-btn{padding:.4rem .85rem;border:none;background:transparent;color:var(--text-muted);font-size:.8rem;font-weight:600;cursor:pointer;border-radius:8px;transition:all .2s ease}.filter-btn.active{background:var(--bg-secondary);color:var(--accent-primary);box-shadow:var(--shadow-sm);font-weight:700}.section-header h2{font-size:1.1rem;color:var(--text-primary);font-weight:700}.feed-list{display:flex;flex-direction:column;gap:1rem;max-height:600px;overflow-y:auto;padding-right:.5rem}.feed-item{display:flex;gap:1rem;padding:1rem;background:var(--bg-primary);border-radius:12px;border:1px solid var(--border-secondary);animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.feed-badge{width:45px;height:45px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;flex-shrink:0}.feed-badge.hafalan,.feed-badge.kosakata{background:#10b9811a}.feed-badge.game{background:#f59e0b1a}.feed-content{flex:1}.feed-user{font-weight:700;font-size:1rem;color:var(--text-primary)}.feed-header-row{display:flex;align-items:center;gap:.5rem}.badge-umum{font-size:.7rem;background:var(--bg-tertiary);color:var(--text-muted);padding:.1rem .4rem;border-radius:4px;border:1px solid var(--border-secondary);font-weight:600}.badge-umum-mini{display:inline-block;font-size:.65rem;background:var(--bg-tertiary);color:var(--text-muted);width:16px;height:16px;line-height:16px;text-align:center;border-radius:4px;margin-left:.4rem;font-weight:700;vertical-align:middle}.rank-info{flex:1;display:flex;flex-direction:column}.feed-detail{font-size:.9rem;color:var(--text-muted);margin:.25rem 0}.feed-time{font-size:.8rem;color:var(--accent-primary);font-weight:600}.simple-rank-list{display:flex;flex-direction:column;gap:.75rem}.rank-item{display:flex;align-items:center;gap:.75rem;padding:.85rem;background:var(--bg-primary);border-radius:12px;border:1px solid var(--border-secondary)}.rank-number{font-weight:800;color:var(--text-muted);width:30px;font-size:1.1rem}.rank-name{font-weight:600;font-size:.95rem;display:flex;align-items:center}.rank-score{font-weight:700;color:var(--accent-primary);font-size:.9rem}.rank-tabs{display:flex;gap:.25rem;background:var(--bg-input);padding:.25rem;border-radius:10px}.rank-tab{padding:.5rem 1rem;border:none;background:transparent;color:var(--text-muted);font-size:.8rem;font-weight:600;cursor:pointer;border-radius:8px;transition:all .2s ease}.rank-tab.active{background:var(--bg-secondary);color:var(--accent-primary);box-shadow:var(--shadow-sm)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{background:var(--bg-secondary);padding:1.5rem;border-radius:16px;display:flex;align-items:center;gap:1.25rem;border:1px solid var(--border-secondary);box-shadow:var(--shadow-sm)}.stat-icon{width:54px;height:54px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.75rem}.stat-icon.blue{background:#2dd4bf1a;color:#0d9488}.stat-icon.green{background:#10b9811a;color:#10b981}.stat-icon.orange{background:#f59e0b1a;color:#f59e0b}.stat-info h3{font-size:.85rem;color:var(--text-muted);margin-bottom:.25rem}.stat-info .value{font-size:1.5rem;font-weight:800;color:var(--text-primary)}.at-risk-section{background:#f973160d;border:1px solid rgba(249,115,22,.2);border-radius:16px;padding:1.5rem;margin-bottom:2rem}.at-risk-header h3{font-size:1rem;color:#ea580c;margin-bottom:1rem;font-weight:700}.at-risk-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}.at-risk-card{background:var(--bg-secondary);border:1px solid var(--border-secondary);padding:1rem;border-radius:12px;display:flex;justify-content:space-between;align-items:center}.at-risk-user{display:flex;flex-direction:column}.at-risk-user .name{font-weight:700;font-size:.95rem;color:var(--text-primary)}.at-risk-user .nisn{font-size:.8rem;color:var(--text-muted)}.at-risk-status .days{background:#ea580c1a;color:#ea580c;padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:700}@media(max-width:1200px){.two-column-layout{grid-template-columns:1fr}}.hadits-page{padding:1.5rem 2rem;background-color:var(--bg-primary)}.badge-premium{display:none}.last-read-banner{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--accent-primary);border-radius:20px;padding:1.5rem;margin-bottom:2rem;display:flex;align-items:center;gap:1.5rem;cursor:pointer;transition:all .3s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 8px 32px #6366f126}.last-read-banner:hover{transform:translateY(-5px);box-shadow:0 12px 40px #6366f140;background:var(--bg-card)}.banner-icon{font-size:2.5rem;background:var(--bg-tertiary);width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:16px;border:1px solid var(--border-secondary)}.banner-content{flex:1}.banner-label{font-size:.8rem;color:var(--accent-primary);font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:.3rem;display:block}.banner-content h3{margin:0 0 .3rem;font-size:1.25rem;color:var(--text-primary);font-weight:800}.banner-content p{margin:0;color:var(--text-secondary);font-size:.95rem}.banner-action{display:flex;align-items:center;gap:.5rem;color:#fff;font-weight:700;background:var(--accent-gradient);padding:.6rem 1.2rem;border-radius:14px;transition:all .3s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 4px 12px var(--accent-shadow)}.last-read-banner:hover .banner-action{transform:scale(1.05);filter:brightness(1.1);box-shadow:0 6px 20px var(--accent-shadow)}.banner-action .arrow{transition:transform .2s}.last-read-banner:hover .arrow{transform:translate(4px)}.hadits-nav{display:flex;justify-content:center;margin-bottom:3rem}.tabs-container{background:var(--bg-secondary);padding:.4rem;border-radius:20px;display:flex;gap:.5rem;border:1px solid var(--border-secondary)}.tab-btn{padding:.8rem 1.8rem;border-radius:16px;border:1px solid transparent;background:transparent;color:var(--text-secondary);font-weight:700;font-size:.95rem;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.tab-btn.active{background:var(--accent-gradient);color:#fff;box-shadow:0 8px 20px var(--accent-shadow)}.tab-btn:hover:not(.active){background:var(--bg-card);color:var(--accent-primary);border-color:var(--border-secondary);transform:translateY(-2px)}.hadits-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem;max-width:1300px;margin:0 auto}.hadits-book-card-v2{perspective:1000px;cursor:pointer}.card-inner{background:var(--bg-card);border:1px solid var(--border-secondary);border-radius:32px;padding:2.5rem;position:relative;transition:all .4s cubic-bezier(.175,.885,.32,1.275);height:100%;display:flex;flex-direction:column;overflow:hidden}.hadits-book-card-v2:hover .card-inner{transform:translateY(-10px) rotateX(4deg);border-color:var(--accent-primary);box-shadow:var(--shadow-lg)}.book-visual{width:64px;height:64px;background:var(--bg-tertiary);border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:2rem;margin-bottom:1.5rem;position:relative;transition:all .3s}.hadits-book-card-v2:hover .book-visual{background:var(--accent-gradient);transform:scale(1.1)}.corner-badge{position:absolute;top:-8px;right:-30px;background:var(--warning);color:#fff;font-size:.6rem;padding:.2rem .8rem;border-radius:4px;font-weight:900}.book-details h3{font-size:1.6rem;font-weight:800;margin-bottom:.8rem;color:var(--text-primary)}.stat-pill{display:inline-block;padding:.3rem .8rem;background:var(--bg-tertiary);border-radius:8px;font-size:.85rem;font-weight:600;color:var(--text-muted)}.card-footer{margin-top:auto;padding:.8rem 1.5rem;background:var(--bg-tertiary);border-radius:16px;display:flex;align-items:center;justify-content:center;gap:.8rem;font-weight:800;color:var(--accent-primary);transition:all .3s;border:1px solid var(--border-secondary)}.hadits-book-card-v2:hover .card-footer{background:var(--accent-gradient);color:#fff;border-color:transparent;box-shadow:0 4px 15px var(--accent-shadow);transform:scale(1.02)}.read-link{font-size:.95rem;text-transform:uppercase;letter-spacing:.5px}@media(max-width:768px){.hadits-page{padding:1rem .75rem}.last-read-banner{padding:1rem;gap:1rem;border-radius:16px}.banner-icon{width:45px;height:45px;font-size:1.8rem}.banner-content h3{font-size:1.05rem}.banner-action{padding:.4rem .75rem;font-size:.8rem}.hadits-nav{margin-bottom:2rem}.tabs-container{padding:.3rem;border-radius:15px}.tab-btn{padding:.6rem 1rem;font-size:.85rem}.hadits-grid{gap:1.25rem}.card-inner{padding:1.5rem;border-radius:24px}.book-visual{width:50px;height:50px;font-size:1.5rem;margin-bottom:1rem}.book-details h3{font-size:1.3rem}}@media(max-width:480px){.banner-action span:first-child{display:none}.hadits-grid{grid-template-columns:1fr}}.hadith-detail-page{padding:0;background-color:var(--bg-primary);display:flex;flex-direction:column}.detail-header-v2{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);padding:1rem 2rem;border-bottom:1px solid var(--border-secondary);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:1001}.header-left{display:flex;align-items:center;gap:1.5rem}.icon-btn.back{background:var(--bg-card);border:1px solid var(--border-secondary);width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.4rem;color:var(--text-primary);transition:all .3s cubic-bezier(.175,.885,.32,1.275);box-shadow:var(--shadow-sm)}.icon-btn.back:hover{background:var(--accent-gradient);color:#fff;transform:translate(-5px) scale(1.05);box-shadow:0 4px 15px var(--accent-shadow);border-color:transparent}.book-title-group h1{font-size:1.2rem;margin:0;font-weight:800}.book-meta{font-size:.8rem;color:var(--text-muted)}.chapter-indicator{padding:2px 8px;border-radius:4px;background:var(--bg-tertiary);transition:all .3s}.chapter-indicator.active{color:var(--accent-primary);background:var(--info-bg);font-weight:700}.topic-toggle-btn{background:var(--accent-gradient);color:#fff;border:none;padding:.6rem 1.2rem;border-radius:12px;font-weight:700;display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .3s cubic-bezier(.175,.885,.32,1.275)}.topic-toggle-btn:hover{transform:scale(1.05);box-shadow:0 5px 15px var(--accent-shadow)}.stats-indicator{font-size:.85rem;color:var(--accent-primary);font-weight:600;background:var(--bg-secondary);padding:.2rem .75rem;border-radius:20px;display:inline-block;margin-top:.25rem}.hadith-layout-container.search-focused{max-width:1000px;margin:0 auto;padding:2rem}.search-hero{text-align:center;margin-bottom:2.5rem}.search-hero h2{font-size:2rem;font-weight:800;margin-bottom:.5rem;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.search-hero p{color:var(--text-muted);font-size:1.1rem}.search-box-v2.large{max-width:800px;margin:0 auto 3rem;position:relative;background:var(--bg-card);border-radius:20px;padding:.5rem;box-shadow:var(--shadow-xl);border:2px solid transparent;transition:all .3s ease;display:flex;align-items:center}.search-box-v2.large:focus-within{border-color:var(--accent-primary);transform:translateY(-2px)}.search-box-v2.large input{flex:1;background:transparent;border:none;padding:1rem 1.5rem;font-size:1.25rem;color:var(--text-primary);outline:none}.search-icon-v2{font-size:1.5rem;margin-left:1.5rem}.clear-search{background:var(--bg-secondary);border:none;color:var(--text-muted);width:30px;height:30px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-right:1rem}.search-results-info{margin-bottom:1.5rem;color:var(--text-muted);font-weight:500;text-align:center}.hadith-cards-grid{display:flex;flex-direction:column;gap:2rem}.hadith-card-v2{background:var(--bg-card);border-radius:24px;padding:2rem;border:1px solid var(--border-secondary);box-shadow:var(--shadow-md);transition:all .3s ease}.hadith-card-v2:hover{box-shadow:var(--shadow-lg);border-color:var(--accent-primary)}.hadith-card-v2.bookmark-highlight{border:2px solid #ff9800;box-shadow:0 0 15px #ff980066;background:linear-gradient(to right,rgba(255,152,0,.05),var(--bg-card));animation:pulse-highlight 2s infinite ease-in-out}.hadith-card-v2.bookmark-highlight.no-animate{animation:none!important;opacity:1!important;transform:none!important}@keyframes pulse-highlight{0%{box-shadow:0 0 15px #ff980066}50%{box-shadow:0 0 25px #ff980099}to{box-shadow:0 0 15px #ff980066}}.card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.badge-number{background:var(--bg-tertiary);color:var(--accent-primary);padding:.4rem 1rem;border-radius:10px;font-weight:800;font-size:.85rem;border:1px solid var(--border-secondary)}.action-buttons-group{display:flex;gap:.75rem;align-items:center}.action-btn-v2{display:flex;align-items:center;gap:.6rem;background:var(--bg-card);border:1px solid var(--border-secondary);padding:.65rem 1.25rem;border-radius:16px;font-size:.9rem;font-weight:700;color:var(--text-primary);cursor:pointer;transition:all .3s cubic-bezier(.175,.885,.32,1.275);white-space:nowrap;box-shadow:0 4px 6px -1px #0000001a}.action-btn-v2 span{font-size:1.1rem;line-height:1;transition:transform .3s}.action-btn-v2:hover{transform:translateY(-3px);background:var(--bg-tertiary);border-color:var(--accent-primary);box-shadow:0 10px 20px -5px #6366f133;color:var(--accent-primary)}.action-btn-v2:hover span{transform:scale(1.2) rotate(5deg)}.action-btn-v2:active{transform:scale(.92)}.action-btn-v2.bookmark-btn.active{background:var(--accent-gradient);color:#fff;border-color:transparent;box-shadow:0 8px 15px var(--accent-shadow)}.action-btn-v2.hafal-btn.active{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-color:transparent;box-shadow:0 8px 15px #10b9814d}.arabic-text{font-family:Amiri,Scheherazade New,serif;font-size:2.4rem;line-height:1.8;text-align:right;direction:rtl;margin-bottom:2.5rem;color:var(--text-primary);word-spacing:2px}.translation-box{padding-top:2rem;border-top:1px dashed var(--border-primary)}.indo-translation{font-size:1.15rem;line-height:1.7;color:var(--text-secondary);text-align:justify}.search-highlight{background:#ffeb3b;color:#000;padding:0 2px;border-radius:4px;font-weight:700;box-shadow:0 0 8px #ffeb3b80}.load-more-v2{margin-top:4rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1rem}.btn-modern-load{background:var(--bg-secondary);border:2px solid var(--accent-primary);color:var(--accent-primary);padding:1rem 3rem;border-radius:16px;font-weight:800;cursor:pointer;transition:all .3s}.btn-modern-load:hover{background:var(--accent-primary);color:#fff;transform:translateY(-3px)}.load-stats{font-size:.85rem;color:var(--text-muted)}@media(max-width:1024px){.hadith-layout-container.search-focused{padding:1.5rem}}@media(max-width:768px){.detail-header-v2{padding:.75rem 1rem}.book-title-group h1{font-size:1.1rem}.hadith-layout-container.search-focused{padding:1rem .75rem}.search-box-v2.large{margin-bottom:2rem;border-radius:15px}.search-box-v2.large input{padding:.8rem 1rem;font-size:1.05rem}.search-icon-v2{margin-left:1rem;font-size:1.2rem}.hadith-card-v2{padding:1.25rem;border-radius:20px}.card-top{flex-direction:column;align-items:flex-start;gap:1rem;margin-bottom:1.5rem}.action-buttons-group{width:100%;overflow-x:auto;padding-bottom:.5rem;gap:.4rem;-webkit-overflow-scrolling:touch}.action-btn-v2{flex-shrink:0;padding:.5rem .8rem;font-size:.8rem}.arabic-text{font-size:1.75rem;line-height:1.7;margin-bottom:1.5rem}.translation-box{padding-top:1.5rem}.indo-translation{font-size:1rem;line-height:1.6}.memorized-badge-check{right:15px;padding:.25rem .75rem;font-size:.7rem}}@media(max-width:480px){.header-left{gap:.75rem}.icon-btn.back{width:35px;height:35px}.book-title-group h1{max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}.hadith-card-v2.is-memorized{border-color:var(--success-primary, #4caf50);box-shadow:0 4px 12px #4caf5026;background:linear-gradient(135deg,rgba(76,175,80,.03) 0%,var(--bg-card) 100%)}.memorized-badge-check{position:absolute;top:-12px;right:30px;background:#4caf50;color:#fff;padding:.35rem 1rem;border-radius:20px;font-size:.8rem;font-weight:800;box-shadow:0 4px 8px #4caf504d;border:2px solid var(--bg-card);z-index:10}.hadith-card-v2{position:relative}.action-btn-v2.hafal-btn.active{background:#4caf501a;color:#4caf50;border-color:#4caf50}.action-btn-v2.hafal-btn.active span{filter:drop-shadow(0 0 2px #4caf50)}.action-btn-v2.hafal-btn:hover{background:#4caf500d;border-color:#4caf50}.install-popup-overlay{position:fixed;bottom:20px;right:20px;z-index:9999;display:flex;justify-content:flex-end;align-items:flex-end;pointer-events:none}@media(max-width:768px){.install-popup-overlay{inset:0;background:#0009;justify-content:center;align-items:center;pointer-events:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.install-popup-content{background:#1e293bf2;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:24px;width:320px;box-shadow:0 20px 50px #0000004d,0 0 0 1px #ffffff1a inset;position:relative;overflow:hidden;pointer-events:auto;color:#fff;font-family:Inter,sans-serif}@media(max-width:768px){.install-popup-content{width:90%;max-width:360px;background:#1e293bfa}}.animate-popup{animation:slideInUp .6s cubic-bezier(.16,1,.3,1) forwards}@keyframes slideInUp{0%{opacity:0;transform:translateY(50px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.install-popup-close{position:absolute;top:12px;right:12px;background:transparent;border:none;color:#ffffff80;font-size:24px;line-height:1;cursor:pointer;transition:color .2s;z-index:10}.install-popup-close:hover{color:#fff}.install-popup-header{display:flex;justify-content:center;margin-bottom:20px;position:relative}.install-popup-app-branding{position:relative;width:80px;height:80px;display:flex;align-items:center;justify-content:center}.install-popup-app-logo{width:70px;height:70px;object-fit:contain;z-index:2;filter:drop-shadow(0 0 10px rgba(56,189,248,.3));border-radius:15px}.install-popup-logo-glow{position:absolute;width:100px;height:100px;background:radial-gradient(circle,rgba(56,189,248,.2) 0%,transparent 70%);z-index:1;animation:pulseGlow 2s infinite ease-in-out}@keyframes pulseGlow{0%,to{transform:scale(1);opacity:.5}50%{transform:scale(1.2);opacity:.8}}.install-popup-title{margin:0 0 8px;font-size:1.25rem;font-weight:700;text-align:center;background:linear-gradient(135deg,#fff,#cbd5e1);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.install-popup-desc{margin:0 0 20px;font-size:.9rem;line-height:1.5;color:#94a3b8;text-align:center}.install-popup-desc strong{color:#38bdf8;font-weight:600}.install-popup-actions{display:flex;flex-direction:column;gap:12px;align-items:center}.btn-install-playstore{background:transparent;border:none;padding:0;cursor:pointer;transition:transform .2s cubic-bezier(.175,.885,.32,1.275);width:180px}.btn-install-playstore:hover{transform:scale(1.05)}.play-store-badge-img{width:100%;height:auto;filter:drop-shadow(0 4px 10px rgba(0,0,0,.3))}.btn-maybe-later-v2{background:transparent;border:none;color:#64748b;font-size:.85rem;cursor:pointer;transition:color .2s;text-decoration:underline;text-underline-offset:4px}.btn-maybe-later-v2:hover{color:#94a3b8}.premium-page-wrapper{min-height:100vh;background:var(--bg-primary);color:var(--text-primary);font-family:Inter,system-ui,-apple-system,sans-serif;padding-bottom:4rem;overflow-x:hidden}.premium-navbar-glass{position:sticky;top:0;z-index:1000;background:rgba(var(--bg-primary-rgb, 5, 26, 20),.7);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border-secondary);padding:.75rem 0}.nav-container{max-width:1200px;margin:0 auto;padding:0 5%;display:flex;justify-content:space-between;align-items:center}.nav-brand-premium{display:flex;align-items:center;gap:.75rem;cursor:pointer}.logo-premium-nav{height:24px;width:auto;object-fit:contain;transition:transform .3s}.nav-brand-premium span{font-weight:800;font-size:1.1rem;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.back-link-premium{color:var(--text-muted);text-decoration:none;font-size:.9rem;font-weight:600;transition:all .3s;display:flex;align-items:center;gap:.5rem}.back-link-premium:hover{color:var(--accent-primary);transform:translate(-5px)}.premium-hero{position:relative;padding:clamp(4rem,10vh,8rem) 5% clamp(3rem,8vh,6rem);text-align:center;background:radial-gradient(circle at 50% 0%,rgba(var(--accent-shadow-rgb),.15) 0%,transparent 70%)}.hero-blur-bg{position:absolute;top:-150px;left:50%;transform:translate(-50%);width:600px;height:600px;background:var(--accent-gradient);filter:blur(150px);opacity:.1;border-radius:50%;z-index:1}.premium-hero-content{position:relative;z-index:2;max-width:900px;margin:0 auto}.premium-badge{display:inline-block;padding:.5rem 1.2rem;background:rgba(var(--accent-shadow-rgb),.1);color:var(--accent-primary);border-radius:50px;font-weight:800;font-size:clamp(.7rem,2vw,.85rem);text-transform:uppercase;letter-spacing:2px;margin-bottom:2rem;border:1px solid rgba(var(--accent-shadow-rgb),.2)}.premium-hero h1{font-size:clamp(2.2rem,5vw,4rem);font-weight:950;line-height:1.05;margin-bottom:1.5rem;letter-spacing:-2px;color:var(--text-primary)}.premium-hero p{font-size:clamp(1rem,2.5vw,1.25rem);color:var(--text-secondary);max-width:650px;margin:0 auto;line-height:1.6;opacity:.9}.premium-promo-text{margin-top:1.5rem!important;font-weight:700;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-size:clamp(1.1rem,2.8vw,1.4rem)!important;animation:pulseSubtle 3s infinite ease-in-out}@keyframes pulseSubtle{0%,to{transform:scale(1);opacity:.9}50%{transform:scale(1.03);opacity:1}}.pricing-section{padding:2rem 5% 6rem;position:relative;z-index:10}.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:1400px;margin:0 auto}.pricing-card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:32px;padding:clamp(2rem,5vw,3.5rem) 2rem;display:flex;flex-direction:column;transition:all .5s cubic-bezier(.175,.885,.32,1.275);position:relative;box-shadow:0 10px 40px #0000001a;overflow:hidden}.pricing-card:hover{transform:translateY(-15px) scale(1.02);box-shadow:0 40px 80px rgba(var(--accent-shadow-rgb),.2);border-color:var(--accent-primary)}.pricing-card.popular{border:2px solid var(--accent-primary);background:linear-gradient(180deg,var(--bg-card) 0%,rgba(var(--accent-shadow-rgb),.05) 100%)}.popular-tag{position:absolute;top:1.5rem;left:50%;transform:translate(-50%);background:var(--accent-gradient);color:#fff;padding:.4rem 1.2rem;border-radius:50px;font-size:.75rem;font-weight:800;box-shadow:0 4px 15px rgba(var(--accent-shadow-rgb),.4)}.savings-ribbon{position:absolute;top:1.8rem;right:-2rem;background:#ef4444;color:#fff;padding:.5rem 3rem;font-size:.75rem;font-weight:900;transform:rotate(45deg);box-shadow:0 4px 10px #0003}.card-top{text-align:center;margin-bottom:2rem;display:flex;flex-direction:column;align-items:center;gap:1rem}.product-icon-large{font-size:clamp(2.5rem,5vw,3.5rem);display:block;margin-bottom:1rem;filter:drop-shadow(0 10px 15px rgba(0,0,0,.1))}.card-top h3{font-size:clamp(1.4rem,3vw,1.8rem);font-weight:900;margin-bottom:1rem;letter-spacing:-.5px}.price-box{display:flex;flex-direction:column;align-items:center;gap:.25rem}.price-amount{font-size:clamp(1.2rem,3.5vw,1.8rem);font-weight:950;color:var(--text-primary);line-height:1.2}.price-period{color:var(--text-muted);font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-top:.25rem}.tier-features{list-style:none;padding:0;margin:0 0 3rem;flex:1;display:flex;flex-direction:column;gap:1.25rem}.tier-features li{font-size:clamp(.9rem,1.5vw,1.05rem);color:var(--text-secondary);display:flex;align-items:center;gap:.85rem;font-weight:600}.tier-features li span{color:var(--accent-primary);background:rgba(var(--accent-shadow-rgb),.1);width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.7rem;flex-shrink:0}.purchase-btn{width:100%;padding:1.2rem;border-radius:20px;border:1px solid var(--border-primary);background:var(--bg-input);color:var(--text-primary);font-size:1.1rem;font-weight:800;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.purchase-btn:hover:not(:disabled){background:var(--accent-gradient);color:#fff;border-color:transparent;transform:translateY(-5px);box-shadow:0 15px 30px rgba(var(--accent-shadow-rgb),.4)}.btn-glow{background:var(--accent-gradient);color:#fff;border-color:transparent;box-shadow:0 10px 30px rgba(var(--accent-shadow-rgb),.3)}.btn-active-premium{background:linear-gradient(135deg,#059669,#10b981)!important;color:#fff!important;border:none!important;cursor:default!important;box-shadow:0 8px 20px #10b98133!important;transform:none!important}.btn-active-premium:hover{transform:none!important;box-shadow:0 8px 20px #10b98133!important}.premium-trust-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:3rem;max-width:1000px;margin:0 auto;padding:4rem 5% 6rem;text-align:center}.trust-item{background:rgba(var(--bg-primary-rgb),.5);padding:2.5rem 2rem;border-radius:24px;border:1px solid var(--border-secondary);transition:all .3s}.trust-item:hover{background:var(--bg-card);transform:translateY(-5px)}.trust-icon{font-size:2.5rem;margin-bottom:1.5rem;display:block}.trust-item h4{font-size:1.25rem;font-weight:850;margin-bottom:1rem}.trust-item p{font-size:.95rem;color:var(--text-muted);line-height:1.6}.compliance-footer{border-top:1px solid var(--border-secondary);padding:5rem 8% 4rem;display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:4rem;background:var(--bg-card)}.footer-company-info h4{font-size:1.4rem;font-weight:900;margin-bottom:1.25rem;color:var(--text-primary)}.footer-company-info p{color:var(--text-muted);margin-bottom:2rem;line-height:1.6}.footer-details{display:flex;flex-direction:column;gap:1rem}.footer-details span{font-size:.95rem;color:var(--text-secondary);font-weight:600;display:flex;align-items:center;gap:.75rem}.legal-links{display:flex;flex-direction:column;gap:1.25rem}.legal-links h4,.payment-partner h4{font-size:.85rem;text-transform:uppercase;letter-spacing:2px;color:var(--text-muted);margin-bottom:1.5rem}.legal-links a{color:var(--text-secondary);text-decoration:none;font-size:1rem;font-weight:600;transition:all .2s}.legal-links a:hover{color:var(--accent-primary);transform:translate(5px)}.payment-partner h4{margin-bottom:1.5rem}.midtrans-logo-small{height:35px;width:auto;filter:brightness(0);opacity:.8;transition:opacity .3s}.midtrans-logo-small:hover{opacity:1}@media(max-width:1024px){.compliance-footer{grid-template-columns:1fr;gap:4rem;text-align:center}.footer-details,.legal-links{align-items:center}.premium-trust-info{gap:2rem}}@media(max-width:640px){.premium-navbar-glass{padding:.5rem 0}.logo-premium-nav{height:28px}.pricing-grid{grid-template-columns:1fr;padding-top:1rem}.premium-hero{padding:4rem 5%}.pricing-section{margin-top:-2rem}.pricing-card{padding:2rem 1.5rem}.price-amount{font-size:1.4rem}}@supports not (backdrop-filter: blur(10px)){.premium-navbar-glass{background:var(--bg-primary)}}.premium-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;z-index:2000;animation:fadeIn .3s ease-out}.premium-modal-content{background:rgba(var(--bg-card-rgb, 20, 30, 25),.95);border:1px solid rgba(var(--accent-shadow-rgb),.3);border-radius:32px;padding:3rem 2rem;max-width:450px;width:90%;text-align:center;position:relative;box-shadow:0 40px 100px #00000080;animation:slideUp .4s cubic-bezier(.175,.885,.32,1.275)}.modal-close-btn{position:absolute;top:1.5rem;right:1.5rem;background:none;border:none;color:var(--text-muted);font-size:2rem;cursor:pointer;line-height:1;transition:color .3s}.modal-close-btn:hover{color:var(--text-primary)}.modal-icon{font-size:3.5rem;display:block;margin-bottom:1.5rem;filter:drop-shadow(0 10px 15px rgba(var(--accent-shadow-rgb),.3))}.modal-header h2{font-size:1.8rem;font-weight:900;margin-bottom:1rem;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.modal-header p{color:var(--text-secondary);line-height:1.6;margin-bottom:2rem}.modal-google-container{width:100%;min-height:40px;margin-bottom:1.5rem;display:flex;justify-content:center}.modal-error-text{color:#ef4444;font-size:.85rem;margin-bottom:1rem;font-weight:600}.modal-actions{display:flex;flex-direction:column;gap:1rem;margin-bottom:.5rem}.modal-btn-primary{background:var(--accent-gradient);color:#fff;border:none;padding:1.2rem;border-radius:18px;font-weight:800;font-size:1.1rem;cursor:pointer;box-shadow:0 10px 25px rgba(var(--accent-shadow-rgb),.4);transition:all .3s cubic-bezier(.4,0,.2,1)}.modal-btn-primary:hover{transform:translateY(-3px);box-shadow:0 15px 35px rgba(var(--accent-shadow-rgb),.5)}.modal-btn-secondary{background:transparent;color:var(--text-muted);border:1px solid rgba(255,255,255,.1);padding:.8rem;border-radius:12px;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .3s}.modal-btn-secondary:hover{background:#ffffff0d;color:var(--text-primary)}@keyframes slideUp{0%{opacity:0;transform:translateY(40px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:480px){.premium-modal-content{padding:2.5rem 1.5rem 2rem}.modal-header h2{font-size:1.5rem}}.legal-container{max-width:800px;margin:80px auto;padding:40px;background:var(--surface-light);border-radius:16px;box-shadow:0 10px 30px #0000000d;line-height:1.6;color:var(--text-main)}.legal-container h1{font-size:2.5rem;margin-bottom:30px;color:var(--primary-color);text-align:center}.legal-container h2{font-size:1.5rem;margin-top:30px;margin-bottom:15px;color:var(--secondary-color);border-left:4px solid var(--primary-color);padding-left:15px}.legal-container p{margin-bottom:15px}.legal-container ul{margin-bottom:20px;padding-left:20px}.legal-container li{margin-bottom:10px}@media(max-width:768px){.legal-container{margin:40px 20px;padding:20px}}.activity-header{margin-bottom:40px;text-align:center}.activity-header h1{font-size:2.5rem;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:10px}.trial-mode-notice{background:#ffffff1a;border:1px dashed rgba(255,255,255,.3);padding:8px 15px;border-radius:10px;font-size:.9rem;display:inline-block;margin-top:10px}.activity-timeline{max-width:800px;margin:0 auto;position:relative;padding-left:30px}.activity-timeline:before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:4px;background:var(--border-color);border-radius:2px}.activity-item-p{position:relative;margin-bottom:30px;background:var(--card-bg);padding:20px;border-radius:15px;border:1px solid var(--border-color);box-shadow:0 5px 15px var(--shadow-color);display:flex;align-items:center;gap:20px;transition:transform .3s ease}.activity-item-p:hover{transform:translate(10px)}.activity-item-p:before{content:"";position:absolute;left:-33px;top:50%;transform:translateY(-50%);width:10px;height:10px;background:var(--accent-color);border:3px solid white;border-radius:50%;z-index:2}.activity-icon-p{width:50px;height:50px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:#fff;flex-shrink:0}.activity-info-p{flex:1}.activity-main{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}.activity-main h4{margin:0;font-size:1.1rem;color:var(--text-color)}.timestamp{font-size:.8rem;color:#999}.type-tag{font-size:.7rem;text-transform:uppercase;background:#0000000d;padding:4px 10px;border-radius:20px;color:#666;letter-spacing:1px}.activity-empty{text-align:center;padding:100px 20px;color:#999}.empty-icon{font-size:4rem;margin-bottom:20px}.broadcast-main-p{flex:1;padding:2.5rem;margin-left:260px;max-width:1400px;animation:fadeIn .5s ease;transition:all .3s ease}@media(max-width:1024px){.broadcast-main-p{margin-left:0;padding:5rem 1.5rem 2rem}}.b-header-p{margin-bottom:2rem}.b-header-p h1{font-size:2rem;color:var(--text-primary);margin-bottom:.5rem}.b-header-p p{color:var(--text-secondary)}.b-controls-p{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;margin-bottom:2rem;background:var(--bg-card);padding:1.5rem;border-radius:12px;box-shadow:0 4px 12px #0000000d}.b-search-p input{width:350px;padding:.8rem 1.2rem;border-radius:8px;border:1px solid var(--border-color);background:var(--bg-input);color:var(--text-primary);font-size:1rem;transition:all .3s ease}.b-search-p input:focus{border-color:var(--accent-color);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.1)}.b-actions-p{display:flex;gap:1rem}.b-filter-p{padding:.8rem 1rem;border-radius:8px;border:1px solid var(--border-color);background:var(--bg-input);color:var(--text-primary);cursor:pointer}.b-table-container{background:var(--bg-card);border-radius:12px;box-shadow:0 4px 12px #0000000d;overflow:hidden}.b-table{width:100%;border-collapse:collapse;text-align:left}.b-table th{background:var(--bg-secondary);padding:1rem 1.5rem;font-weight:600;color:var(--text-secondary);font-size:.9rem;text-transform:uppercase}.b-table td{padding:1.2rem 1.5rem;border-bottom:1px solid var(--border-color);color:var(--text-primary)}.user-name-cell{display:flex;flex-direction:column}.user-name-cell .u-role{font-size:.8rem;color:var(--text-secondary)}.status-badge{padding:.4rem .8rem;border-radius:20px;font-size:.85rem;font-weight:500}.status-badge.premium{background:#ecfdf5;color:#059669}.status-badge.free{background:#fef2f2;color:#dc2626}.btn-send-wa{display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem;background:#25d366;color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-send-wa:hover{background:#128c7e;transform:translateY(-1px)}.btn-send-wa:disabled{background:#ccc;cursor:not-allowed}.empty-state{padding:4rem;text-align:center;color:var(--text-secondary)}.loading-spinner{padding:4rem;text-align:center}[data-theme=dark] .status-badge.premium{background:#10b98133}[data-theme=dark] .status-badge.free{background:#ef444433}.zakat-container{padding:2rem;max-width:800px;margin:0 auto;color:var(--text-color, #1a1a1a)}.zakat-header{text-align:center;margin-bottom:2.5rem}.zakat-header h2{font-size:2.2rem;color:var(--primary-color, #2e7d32);margin-bottom:.5rem;font-weight:700}.zakat-header p{color:var(--text-secondary, #666);font-size:1.1rem}.zakat-settings-card{padding:1.5rem;border-radius:16px;background:var(--bg-card, #fff);margin-bottom:2rem;border-left:5px solid var(--primary-color, #2e7d32)}.zakat-settings-card h3{font-size:1.3rem;color:var(--text-color, #333);margin-bottom:1rem}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:1.5rem}.info-box{display:flex;align-items:flex-start;background:#2e7d3214;padding:1rem;border-radius:8px;margin-bottom:1.5rem}.info-icon{font-size:1.2rem;margin-right:.8rem;opacity:.8}.info-box p{font-size:.95rem;color:var(--text-color, #444);line-height:1.5;margin:0}.zakat-tabs-scroll{display:flex;overflow-x:auto;gap:.8rem;padding-bottom:1rem;margin-bottom:1.5rem;border-bottom:1px solid var(--border-color, #e0e0e0);scrollbar-width:none}.zakat-tabs-scroll::-webkit-scrollbar{display:none}.tab-btn{white-space:nowrap;padding:.6rem 1.2rem;border-radius:20px;background:transparent;border:none;color:var(--text-secondary, #666);font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:.4rem}.tab-btn:hover{color:var(--primary-color, #2e7d32);background:#2e7d320d}.tab-btn.active{background:#2e7d321a;color:var(--primary-color, #2e7d32);font-weight:700}.tab-btn .icon{font-size:1.1rem}.input-group-z{margin-bottom:1.5rem}.input-group-z label{display:block;font-weight:600;margin-bottom:.4rem;color:var(--text-secondary, #555);font-size:.9rem}.input-with-prefix,.input-with-suffix{display:flex;align-items:center;border:1px solid var(--border-color, #ddd);border-radius:8px;background:var(--bg-main, #f9f9f9);overflow:hidden;transition:all .2s}.input-with-prefix:focus-within,.input-with-suffix:focus-within{border-color:var(--primary-color, #2e7d32);background:var(--bg-card, #fff)}.prefix,.suffix{padding:0 1rem;color:var(--text-secondary, #777);font-weight:700;background:transparent;font-size:.95rem}.input-with-prefix .zakat-input,.input-with-suffix .zakat-input{border:none;background:transparent;padding:.8rem;flex:1}.zakat-input{width:100%;padding:.8rem;border:1px solid var(--border-color, #ddd);border-radius:8px;font-size:1rem;color:var(--text-color, #333);background:var(--bg-main, #f9f9f9)}.zakat-input:focus{outline:none;border-color:var(--primary-color, #2e7d32);background:var(--bg-card, #fff)}.radio-group-z{display:flex;gap:1rem}.radio-btn{flex:1;padding:.8rem;border:1px solid var(--border-color, #ddd);border-radius:8px;background:var(--bg-main, #f9f9f9);color:var(--text-secondary, #555);font-weight:600;cursor:pointer;transition:all .2s}.radio-btn.active{background:#2e7d321a;border-color:var(--primary-color, #2e7d32);color:var(--primary-color, #2e7d32)}.zakat-result-card{margin-top:2rem;background:var(--bg-main, #f9f9f9);border:1px solid var(--border-color, #ddd);border-radius:12px;padding:1.5rem;transition:all .3s ease}.zakat-result-card.not-wajib{opacity:.9}.result-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.result-header h4{font-size:1.1rem;color:var(--text-color, #333)}.status-badge{padding:.3rem .8rem;border-radius:12px;font-size:.85rem;font-weight:700}.status-badge.wajib{background:#2e7d3226;color:#2e7d32}.status-badge.non-wajib{background:#d32f2f26;color:#d32f2f}.nisab-note{font-size:.85rem;color:#d32f2f;font-style:italic;margin-bottom:1rem}.divider-z{height:1px;background:var(--border-color, #e0e0e0);margin:1.5rem 0}.zakat-label{font-size:.95rem;color:var(--text-secondary, #666);margin-bottom:.5rem}.z-amount{font-size:2.2rem;font-weight:800;color:#2e7d32}.z-amount.disabled-amount{color:var(--text-secondary, #999)}.ternak-card{background:var(--bg-main, #f9f9f9);border:1px solid var(--border-color, #ddd);padding:1.2rem;border-radius:8px;margin-bottom:1rem}.ternak-card h4{color:var(--primary-color, #2e7d32);font-size:1.1rem;margin-bottom:.8rem}.ternak-card ul{list-style-type:disc;padding-left:1.5rem;color:var(--text-color, #444);line-height:1.6;font-size:.95rem}.fadeIn{animation:fadeIn .3s ease-out forwards}.animate-slide{animation:slideUp .3s ease-out forwards}@keyframes slideUp{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}[data-theme=dark] .zakat-settings-card,[data-theme=dark] .zakat-content-wrapper{background:#1e1e1e;border-color:#333}[data-theme=dark] .info-box{background:#2e7d3226}[data-theme=dark] .info-box p{color:#e0e0e0}[data-theme=dark] .input-with-prefix,[data-theme=dark] .input-with-suffix,[data-theme=dark] .zakat-input,[data-theme=dark] .radio-btn,[data-theme=dark] .zakat-result-card,[data-theme=dark] .ternak-card{background:#121212;border-color:#444}[data-theme=dark] .zakat-input{color:#e0e0e0}[data-theme=dark] .tab-btn{color:#bbb}[data-theme=dark] .input-group-z label{color:#ccc}[data-theme=dark] .result-header h4{color:#e0e0e0}@media(max-width:768px){.settings-grid{grid-template-columns:1fr;gap:1rem}.z-amount{font-size:1.8rem}.radio-group-z{flex-direction:column}}.zikir-container{padding:2rem;max-width:600px;margin:0 auto;text-align:center;color:var(--text-color, #1a1a1a)}.zikir-header{margin-bottom:2rem}.zikir-header h2{font-size:2.2rem;font-weight:700;margin-bottom:.5rem}.zikir-header p{color:var(--text-secondary, #666);font-size:1.1rem}.zikir-controls{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;background:var(--bg-card, #fff);border-radius:20px;box-shadow:0 4px 15px #0000000d;margin-bottom:3rem;flex-wrap:wrap;gap:1rem}.control-group{display:flex;flex-direction:column;align-items:flex-start}.control-group label{font-size:.9rem;color:var(--text-secondary, #666);margin-bottom:.3rem;font-weight:600}.zikir-select{padding:.6rem 1rem;border-radius:10px;border:2px solid var(--border-color, #e0e0e0);background:var(--bg-main, #f8f9fa);font-size:1rem;font-weight:600;color:var(--text-color, #333);cursor:pointer;transition:all .2s}.zikir-select:focus{outline:none;border-color:var(--primary-color, #2e7d32)}.toggle-group{flex-direction:row;gap:.8rem;align-items:flex-end}.icon-btn{width:45px;height:45px;border-radius:12px;border:none;background:var(--bg-main, #f0f0f0);font-size:1.2rem;cursor:pointer;transition:all .2s cubic-bezier(.175,.885,.32,1.275);display:flex;align-items:center;justify-content:center}.icon-btn:hover{transform:translateY(-2px);box-shadow:0 4px 10px #0000001a}.icon-btn.active{background:#e3f2fd;color:#1976d2}.icon-btn.danger-btn{background:#ffebee;color:#d32f2f}.icon-btn.danger-btn:hover{background:#ffcdd2}.tasbih-wrapper{display:flex;justify-content:center;align-items:center;margin:3rem 0;position:relative;-webkit-user-select:none;user-select:none}.progress-ring-container{position:relative;width:300px;height:300px}.progress-ring{position:absolute;top:0;left:0;transform:rotate(-90deg)}.progress-ring-bg{stroke:var(--border-color, #e0e0e0)}.progress-ring-circle{stroke:var(--primary-color, #2e7d32);transition:stroke-dashoffset .3s cubic-bezier(.4,0,.2,1)}.tap-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:260px;height:260px;border-radius:50%;border:none;background:linear-gradient(145deg,#fff,#e6e6e6);box-shadow:15px 15px 30px #0000001a,-15px -15px 30px #fffc,inset 0 0 #0000001a;cursor:pointer;transition:all .1s;display:flex;align-items:center;justify-content:center;z-index:10}.tap-btn:active,.tap-btn.pressed{box-shadow:inset 10px 10px 20px #0000001a,inset -10px -10px 20px #fffc;background:linear-gradient(145deg,#e6e6e6,#fff)}.tap-content{display:flex;flex-direction:column;align-items:center}.count-display{font-size:5rem;font-weight:800;color:var(--text-color, #1a1a1a);line-height:1;margin-bottom:.5rem}.target-display{font-size:1.2rem;font-weight:600;color:var(--text-secondary, #757575);margin-bottom:1rem}.tap-hint{font-size:.9rem;font-weight:700;letter-spacing:2px;color:var(--primary-color, #2e7d32);opacity:.6}.zikir-footer{margin-top:4rem;font-style:italic;color:var(--text-secondary, #666);background:var(--bg-main, #f8f9fa);padding:1.5rem;border-radius:12px;border-left:4px solid var(--primary-color, #2e7d32)}.theme-green{--primary-color: #2e7d32;--primary-light: #e8f5e9}.theme-green .progress-ring-circle{stroke:#2e7d32}.theme-green .tap-hint{color:#2e7d32}.theme-blue{--primary-color: #1976d2;--primary-light: #e3f2fd}.theme-blue .progress-ring-circle{stroke:#1976d2}.theme-blue .tap-hint,.theme-blue .zikir-header h2{color:#1976d2}.theme-blue .zikir-footer{border-color:#1976d2}.theme-gold{--primary-color: #b79c3f;--primary-light: #fef5d8}.theme-gold .progress-ring-circle{stroke:#b79c3f}.theme-gold .tap-hint,.theme-gold .zikir-header h2{color:#b79c3f}.theme-gold .zikir-footer{border-color:#b79c3f}[data-theme=dark] .zikir-controls{background:#1e1e1e;border-color:#333;box-shadow:0 4px 15px #0006}[data-theme=dark] .zikir-select{background:#121212;color:#e0e0e0;border-color:#444}[data-theme=dark] .icon-btn{background:#2a2a2a}[data-theme=dark] .progress-ring-bg{stroke:#333}[data-theme=dark] .tap-btn{background:linear-gradient(145deg,#2a2a2a,#1a1a1a);box-shadow:15px 15px 30px #0006,-15px -15px 30px #3c3c3c1a,inset 0 0 #0000}[data-theme=dark] .tap-btn:active,[data-theme=dark] .tap-btn.pressed{box-shadow:inset 10px 10px 20px #0006,inset -10px -10px 20px #3c3c3c1a;background:linear-gradient(145deg,#1a1a1a,#2a2a2a)}[data-theme=dark] .count-display{color:#e0e0e0}[data-theme=dark] .zikir-footer{background:#1e1e1e}.fadeIn{animation:fadeIn .4s ease-out forwards}@media(max-width:768px){.zikir-container{padding:1rem}.zikir-controls{flex-direction:column;align-items:stretch}.toggle-group{justify-content:flex-end}.progress-ring-container,.progress-ring,.progress-ring-bg,.progress-ring-circle{width:250px;height:250px}.progress-ring-bg,.progress-ring-circle{r:100;cx:125;cy:125}.tap-btn{width:210px;height:210px}.count-display{font-size:4rem}}.playground-page{min-height:100vh;background:#0a0e1a;font-family:Inter,sans-serif;display:flex;flex-direction:column;overflow:hidden}.playground-header{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:linear-gradient(135deg,#0f1729,#1a1f3a);border-bottom:1px solid rgba(99,102,241,.25);flex-shrink:0;z-index:100}.playground-header-left{display:flex;align-items:center;gap:14px}.playground-logo{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:800;color:#e2e8f0;letter-spacing:-.5px}.playground-logo-icon{width:32px;height:32px;background:linear-gradient(135deg,#6366f1,#8b5cf6,#ec4899);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px;box-shadow:0 4px 15px #6366f166}.playground-back-btn{display:flex;align-items:center;gap:6px;padding:6px 14px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#94a3b8;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.playground-back-btn:hover{background:#ffffff1a;color:#e2e8f0;border-color:#fff3}.playground-header-right{display:flex;align-items:center;gap:10px}.playground-run-btn{display:flex;align-items:center;gap:6px;padding:8px 20px;background:linear-gradient(135deg,#10b981,#059669);border:none;border-radius:8px;color:#fff;font-size:13px;font-weight:700;cursor:pointer;transition:all .25s;box-shadow:0 4px 15px #10b9814d}.playground-run-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px #10b98173}.playground-run-btn:active{transform:translateY(0)}.playground-run-btn.auto-run-active{background:linear-gradient(135deg,#6366f1,#8b5cf6);box-shadow:0 4px 15px #6366f14d}.playground-clear-btn{display:flex;align-items:center;gap:6px;padding:8px 14px;background:#ef444426;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#f87171;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.playground-clear-btn:hover{background:#ef444440;border-color:#ef444480}.playground-template-btn{display:flex;align-items:center;gap:6px;padding:8px 14px;background:#fbbf241f;border:1px solid rgba(251,191,36,.25);border-radius:8px;color:#fbbf24;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;position:relative}.playground-template-btn:hover{background:#fbbf2438;border-color:#fbbf2473}.playground-autorun-toggle{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#64748b;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s}.playground-autorun-toggle.active{background:#6366f126;border-color:#6366f159;color:#a5b4fc}.playground-main{flex:1;display:flex;overflow:hidden;position:relative}.playground-editor-panel{flex:1;display:flex;flex-direction:column;min-width:0;background:#0d1117;border-right:1px solid rgba(99,102,241,.15)}.playground-editor-tabs{display:flex;align-items:center;gap:0;background:#161b22;padding:0;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;overflow-x:auto}.playground-tab{display:flex;align-items:center;gap:6px;padding:10px 20px;background:transparent;border:none;border-bottom:2px solid transparent;color:#64748b;font-family:Inter,sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap;position:relative}.playground-tab:hover{color:#94a3b8;background:#ffffff08}.playground-tab.active{color:#e2e8f0;border-bottom-color:#6366f1;background:#6366f114}.playground-tab-icon{font-size:14px}.tab-html .playground-tab-icon{color:#f97316}.tab-css .playground-tab-icon{color:#3b82f6}.tab-js .playground-tab-icon{color:#eab308}.tab-html.active{border-bottom-color:#f97316}.tab-css.active{border-bottom-color:#3b82f6}.tab-js.active{border-bottom-color:#eab308}.playground-code-area{flex:1;display:flex;overflow:hidden;position:relative}.playground-line-numbers{width:48px;flex-shrink:0;background:#0d1117;padding:14px 0;text-align:right;font-family:JetBrains Mono,Fira Code,monospace;font-size:13px;line-height:1.65;color:#30363d;-webkit-user-select:none;user-select:none;overflow:hidden;border-right:1px solid rgba(255,255,255,.04)}.playground-line-numbers span{display:block;padding-right:12px}.playground-textarea-wrap{flex:1;position:relative;overflow:auto}.playground-textarea{width:100%;height:100%;padding:14px 16px;background:#0d1117;color:#e6edf3;font-family:JetBrains Mono,Fira Code,monospace;font-size:13px;line-height:1.65;border:none;outline:none;resize:none;tab-size:2;white-space:pre;overflow:auto;caret-color:#6366f1}.playground-textarea::placeholder{color:#30363d}.playground-textarea::-webkit-scrollbar{width:8px;height:8px}.playground-textarea::-webkit-scrollbar-track{background:#0d1117}.playground-textarea::-webkit-scrollbar-thumb{background:#21262d;border-radius:4px}.playground-textarea::-webkit-scrollbar-thumb:hover{background:#30363d}.playground-resizer{width:6px;cursor:col-resize;background:#6366f126;transition:background .2s;flex-shrink:0;position:relative;z-index:10}.playground-resizer:hover,.playground-resizer.active{background:#6366f173}.playground-resizer:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2px;height:40px;background:#fff3;border-radius:2px}.playground-preview-panel{flex:1;display:flex;flex-direction:column;min-width:0;background:#fff}.playground-preview-header{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:#161b22;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0}.playground-preview-title{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#94a3b8}.preview-dot{width:10px;height:10px;border-radius:50%}.dot-red{background:#ef4444}.dot-yellow{background:#eab308}.dot-green{background:#22c55e}.playground-preview-url{display:flex;align-items:center;gap:6px;padding:4px 12px;background:#ffffff0d;border-radius:6px;font-size:11px;color:#475569;font-family:JetBrains Mono,monospace}.playground-iframe-wrap{flex:1;overflow:hidden;background:#fff}.playground-iframe{width:100%;height:100%;border:none;background:#fff}.template-dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:260px;background:#1e2235;border:1px solid rgba(99,102,241,.25);border-radius:12px;padding:8px;box-shadow:0 16px 48px #00000080;z-index:1000;animation:dropdownSlide .2s ease}@keyframes dropdownSlide{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.template-dropdown-item{display:flex;align-items:center;gap:10px;padding:10px 14px;background:transparent;border:none;border-radius:8px;color:#cbd5e1;font-size:13px;font-weight:500;cursor:pointer;width:100%;text-align:left;transition:all .15s}.template-dropdown-item:hover{background:#6366f126;color:#e2e8f0}.template-dropdown-item span:first-child{font-size:18px}.playground-console{background:#0d1117;border-top:1px solid rgba(255,255,255,.06);max-height:180px;overflow-y:auto;font-family:JetBrains Mono,monospace;font-size:12px;flex-shrink:0}.playground-console-header{display:flex;align-items:center;justify-content:space-between;padding:6px 14px;background:#161b22;border-bottom:1px solid rgba(255,255,255,.04);position:sticky;top:0;z-index:5}.playground-console-header span{color:#64748b;font-size:12px;font-weight:600}.console-clear-btn{padding:2px 8px;background:#ffffff0d;border:1px solid rgba(255,255,255,.08);border-radius:4px;color:#475569;font-size:11px;cursor:pointer;transition:all .2s}.console-clear-btn:hover{background:#ffffff1a;color:#94a3b8}.playground-console-log{padding:4px 14px;border-bottom:1px solid rgba(255,255,255,.02);color:#cbd5e1;word-break:break-all}.playground-console-log.log-error{color:#f87171;background:#ef44440f}.playground-console-log.log-warn{color:#fbbf24;background:#fbbf240f}.playground-console-log.log-info{color:#60a5fa}.playground-statusbar{display:flex;align-items:center;justify-content:space-between;padding:4px 16px;background:#161b22;border-top:1px solid rgba(255,255,255,.04);font-size:11px;color:#475569;flex-shrink:0}.statusbar-left,.statusbar-right{display:flex;align-items:center;gap:16px}.statusbar-indicator{display:flex;align-items:center;gap:4px}.statusbar-dot{width:6px;height:6px;border-radius:50%;background:#22c55e;animation:pulse-dot 2s infinite}@keyframes pulse-dot{0%,to{opacity:.6}50%{opacity:1}}@media(max-width:768px){.playground-main{flex-direction:column}.playground-editor-panel{border-right:none;border-bottom:1px solid rgba(99,102,241,.15);max-height:45vh}.playground-resizer{width:auto;height:6px;cursor:row-resize}.playground-resizer:after{width:40px;height:2px}.playground-preview-panel{max-height:55vh}.playground-header{flex-wrap:wrap;gap:8px;padding:8px 12px}.playground-header-right{flex-wrap:wrap;gap:6px}.playground-run-btn,.playground-clear-btn,.playground-template-btn{padding:6px 10px;font-size:12px}}@media(max-width:480px){.playground-logo span:last-child{display:none}.playground-tab{padding:8px 12px;font-size:12px}.playground-autorun-toggle span:last-child{display:none}}.shortcut-hint{position:fixed;bottom:40px;left:50%;transform:translate(-50%);background:#1e2235f2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(99,102,241,.3);border-radius:10px;padding:10px 20px;color:#94a3b8;font-size:12px;display:flex;align-items:center;gap:8px;z-index:1000;animation:fadeInUp .3s ease;pointer-events:none}@keyframes fadeInUp{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}.shortcut-hint kbd{background:#6366f133;border:1px solid rgba(99,102,241,.3);border-radius:4px;padding:2px 6px;font-family:JetBrains Mono,monospace;font-size:11px;color:#a5b4fc}.playground-project-name{background:transparent;border:1px solid transparent;color:#e2e8f0;font-family:Inter,sans-serif;font-size:14px;font-weight:600;padding:4px 8px;border-radius:6px;outline:none;width:150px;transition:all .2s}.playground-project-name:hover{background:#ffffff0d}.playground-project-name:focus{background:#0003;border-color:#6366f180;width:200px}.playground-save-btn{display:flex;align-items:center;gap:6px;padding:8px 14px;background:#0ea5e926;border:1px solid rgba(14,165,233,.3);border-radius:8px;color:#38bdf8;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.playground-save-btn:hover{background:#0ea5e940;border-color:#0ea5e980}.playground-projects-btn{display:flex;align-items:center;gap:6px;padding:8px 14px;background:#ec489926;border:1px solid rgba(236,72,153,.3);border-radius:8px;color:#f472b6;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.playground-projects-btn:hover{background:#ec489940;border-color:#ec489980}.playground-toast{position:fixed;top:20px;left:50%;transform:translate(-50%) translateY(-20px);background:#10b981;color:#fff;padding:10px 20px;border-radius:8px;font-weight:600;font-size:14px;box-shadow:0 10px 30px #10b9814d;z-index:9999;opacity:0;visibility:hidden;transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.playground-toast.show{transform:translate(-50%) translateY(0);opacity:1;visibility:visible}.playground-modal-overlay{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:5000;opacity:0;visibility:hidden;transition:all .3s}.playground-modal-overlay.open{opacity:1;visibility:visible}.playground-modal{background:#1e293b;width:90%;max-width:700px;border-radius:16px;box-shadow:0 25px 50px -12px #00000080;border:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;max-height:80vh;transform:scale(.95) translateY(20px);transition:all .3s cubic-bezier(.34,1.56,.64,1)}.playground-modal-overlay.open .playground-modal{transform:scale(1) translateY(0)}.playground-modal-header{padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;align-items:center}.playground-modal-header h2{color:#f8fafc;font-size:20px;margin:0}.close-modal-btn{background:transparent;border:none;color:#94a3b8;font-size:24px;cursor:pointer;transition:color .2s}.close-modal-btn:hover{color:#f1f5f9}.playground-modal-body{padding:20px 24px;overflow-y:auto;flex:1}.project-list{display:flex;flex-direction:column;gap:12px}.project-card{background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:16px;display:flex;justify-content:space-between;align-items:center;transition:border-color .2s}.project-card:hover{border-color:#6366f180;background:#ffffff0d}.project-info h4{margin:0 0 4px;color:#f8fafc;font-size:16px}.project-meta{color:#94a3b8;font-size:12px;display:flex;gap:12px}.project-actions{display:flex;gap:8px}.p-btn{padding:6px 12px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;border:none;transition:all .2s}.p-btn-open{background:#10b98126;color:#34d399}.p-btn-open:hover{background:#10b9814d}.p-btn-share{background:#6366f126;color:#818cf8}.p-btn-share:hover{background:#6366f14d}.p-btn-delete{background:#ef444426;color:#f87171}.p-btn-delete:hover{background:#ef44444d}.share-controls{margin-top:12px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.1);display:flex;flex-direction:column;gap:8px}.toggle-public-wrap{display:flex;align-items:center;gap:8px;font-size:13px;color:#cbd5e1}.link-box{display:flex;gap:8px;background:#0f172a;padding:8px;border-radius:6px;border:1px solid rgba(255,255,255,.1)}.link-box input{background:transparent;border:none;color:#94a3b8;font-size:12px;flex:1;outline:none}.link-box button{background:#3b82f6;color:#fff;border:none;padding:4px 10px;border-radius:4px;font-size:11px;cursor:pointer}.mathlab-container{padding:40px 20px;font-family:Inter,sans-serif;max-width:1000px;margin:0 auto;min-height:80vh}.mathlab-header{text-align:center;margin-bottom:50px}.mathlab-header h1{font-size:36px;color:#1f2937;font-weight:800;margin-bottom:10px}.mathlab-header p{font-size:18px;color:#6b7280;max-width:600px;margin:0 auto}.mathlab-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}.lab-card{background:#fff;border-radius:20px;padding:30px;text-align:center;cursor:pointer;transition:all .3s cubic-bezier(.175,.885,.32,1.275);border:1px solid #e5e7eb;position:relative;overflow:hidden;box-shadow:0 10px 15px -3px #0000000d}.lab-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:6px;background:var(--card-color, #3b82f6)}.lab-card:hover{transform:translateY(-10px);box-shadow:0 20px 25px -5px #0000001a;border-color:#cbd5e1}.lab-icon{font-size:50px;margin-bottom:20px;display:inline-block}.lab-title{font-size:22px;font-weight:700;color:#1f2937;margin-bottom:10px}.lab-desc{font-size:14px;color:#4b5563;margin-bottom:20px;line-height:1.5}.lab-badge{display:inline-block;padding:5px 12px;border-radius:20px;font-size:12px;font-weight:600;background:#f1f5f9;color:#64748b}.lab-badge.online{background:#dcfce7;color:#166534}.lab-badge.offline{background:#fef9c3;color:#854d0e}.lab-badge.premium{background:#fef3c7;color:#92400e;border:1px solid #fde68a}.lab-badge.level-badge{background:#e0e7ff;color:#3730a3;border:1px solid #c7d2fe}.mathlab-controls{display:flex;flex-direction:column;align-items:center;gap:20px;margin-bottom:40px}.mathlab-search{position:relative;width:100%;max-width:500px}.mathlab-search .search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);font-size:18px;color:#9ca3af}.mathlab-search input{width:100%;padding:16px 16px 16px 44px;border-radius:9999px;border:2px solid #e5e7eb;font-size:16px;outline:none;transition:all .3s;box-sizing:border-box}.mathlab-search input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.mathlab-tabs{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.filter-tab{padding:10px 24px;border-radius:9999px;border:1px solid #e5e7eb;background:#fff;color:#4b5563;font-weight:700;cursor:pointer;transition:all .3s}.filter-tab:hover{background:#f8fafc}.filter-tab.active{background:#3b82f6;color:#fff;border-color:#3b82f6}.empty-state{text-align:center;padding:60px 20px;background:#ffffff80;border-radius:20px;border:1px dashed #cbd5e1}.empty-state h3{color:#334155;margin:10px 0 5px}.empty-state p{color:#64748b}.back-btn{background:#f1f5f9;border:1px solid #e2e8f0;color:#64748b;padding:10px 20px;border-radius:12px;cursor:pointer;font-weight:700;margin-bottom:30px;transition:all .2s}.back-btn:hover{background:#e2e8f0}.sciencelab-container{padding:40px 20px;font-family:Outfit,sans-serif;max-width:1000px;margin:0 auto;min-height:80vh;background-color:var(--bg-primary);color:var(--text-primary);transition:var(--theme-transition)}.sciencelab-header{text-align:center;margin-bottom:50px}.sciencelab-header h1{font-size:36px;color:var(--text-primary);font-weight:800;margin-bottom:10px}.sciencelab-header p{font-size:18px;color:var(--text-muted);max-width:600px;margin:0 auto}.scilab-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}.sci-card{background:var(--bg-secondary);border-radius:20px;padding:30px;text-align:center;cursor:pointer;transition:all .3s cubic-bezier(.175,.885,.32,1.275);border:1px solid var(--border-secondary);position:relative;overflow:hidden;box-shadow:var(--shadow-sm)}.sci-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:6px;background:var(--card-color, var(--accent-primary))}.sci-card:hover{transform:translateY(-10px);box-shadow:var(--shadow-md);border-color:var(--accent-primary)}.sci-icon{font-size:50px;margin-bottom:20px;display:inline-block}.sci-title{font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:10px}.sci-desc{font-size:14px;color:var(--text-secondary);margin-bottom:20px;line-height:1.5}.sci-badge{display:inline-block;padding:5px 12px;border-radius:20px;font-size:12px;font-weight:600;background:var(--bg-tertiary);color:var(--text-muted)}.sci-badge.premium{background:var(--warning-bg);color:var(--warning);border:1px solid var(--warning)}.sci-badge.free{background:var(--success-bg);color:var(--success)}.sci-badge.level-badge{background:var(--info-bg);color:var(--info);border:1px solid var(--info)}.sciencelab-controls{display:flex;flex-direction:column;align-items:center;gap:20px;margin-bottom:40px}.sciencelab-search{position:relative;width:100%;max-width:500px}.sciencelab-search .search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);font-size:18px;color:var(--text-muted)}.sciencelab-search input{width:100%;padding:16px 16px 16px 44px;border-radius:9999px;border:2px solid var(--border-primary);background:var(--bg-tertiary);color:var(--text-primary);font-size:16px;outline:none;transition:all .3s;box-sizing:border-box}.sciencelab-search input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-shadow)}.sciencelab-tabs{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.filter-tab{padding:10px 24px;border-radius:9999px;border:1px solid var(--border-secondary);background:var(--bg-secondary);color:var(--text-secondary);font-weight:700;cursor:pointer;transition:all .3s}.filter-tab:hover{background:var(--bg-tertiary)}.filter-tab.active{background:var(--accent-gradient);color:#fff;border-color:var(--accent-primary)}.empty-state{text-align:center;padding:60px 20px;background:var(--bg-secondary);border-radius:20px;border:1px dashed var(--border-primary)}.empty-state h3{color:var(--text-primary);margin:10px 0 5px}.back-btn{background:var(--bg-tertiary);border:1px solid var(--border-secondary);color:var(--text-muted);padding:10px 20px;border-radius:12px;cursor:pointer;font-weight:700;margin-bottom:30px;transition:all .2s}.back-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.sci-adaptive-title{font-size:44px;margin:0;font-weight:800;color:var(--text-primary);transition:var(--theme-transition)}[data-theme=dark] .sci-adaptive-title{background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.sci-desc-readable{font-size:18px;color:var(--text-secondary);margin:12px 0 40px;line-height:1.6}@media(max-width:768px){.sci-adaptive-title{font-size:32px}.sci-desc-readable{font-size:16px;margin:10px 0 25px}.sciencelab-container{padding:15px}.sci-grid{grid-template-columns:1fr;gap:20px}}@media(max-width:480px){.sci-adaptive-title{font-size:28px}}:root{--sci-glass-bg: rgba(255, 255, 255, .05);--sci-glass-border: rgba(255, 255, 255, .1);--sci-hud-accent: #60a5fa;--sci-neon-glow: 0 0 15px rgba(96, 165, 250, .4)}[data-theme=light]{--sci-glass-bg: rgba(255, 255, 255, .7);--sci-glass-border: rgba(0, 0, 0, .1);--sci-hud-accent: #2563eb}.sci-glass{background:var(--sci-glass-bg);backdrop-filter:blur(12px) saturate(180%);-webkit-backdrop-filter:blur(12px) saturate(180%);border:1px solid var(--sci-glass-border);box-shadow:0 8px 32px #0000001a}.sci-digital{font-family:Orbitron,sans-serif;letter-spacing:1px}.sci-hud-frame{position:relative;background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:12px}.sci-hud-frame:before,.sci-hud-frame:after{content:"";position:absolute;width:20px;height:20px;border-color:var(--sci-hud-accent);border-style:solid;pointer-events:none}.sci-hud-frame:before{top:-2px;left:-2px;border-width:3px 0 0 3px;border-top-left-radius:8px}.sci-hud-frame:after{bottom:-2px;right:-2px;border-width:0 3px 3px 0;border-bottom-right-radius:8px}.sci-scanner-overlay{display:none}.sci-tech-label{font-family:Orbitron,sans-serif;font-size:10px;text-transform:uppercase;color:var(--sci-hud-accent);opacity:.8;letter-spacing:2px}.sci-btn-modern{background:var(--accent-gradient);color:#fff;border:none;padding:12px 24px;border-radius:8px;font-weight:700;font-family:Orbitron,sans-serif;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;box-shadow:var(--sci-neon-glow);display:flex;align-items:center;justify-content:center;gap:10px}.sci-btn-modern:hover{transform:translateY(-2px) scale(1.02);filter:brightness(1.2);box-shadow:0 0 25px #60a5fa99}.sci-btn-modern:active{transform:translateY(1px) scale(.98)}.sci-assistant-wrap{position:fixed;bottom:30px;right:30px;z-index:9999;display:flex;flex-direction:column;align-items:flex-end;pointer-events:none}.sci-assistant-wrap *{pointer-events:auto}.sci-assistant-trigger{width:70px;height:70px;border-radius:50%;border:none;background:var(--accent-gradient);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px #0000004d,var(--sci-neon-glow);transition:all .3s cubic-bezier(.175,.885,.32,1.275);position:relative}.sci-assistant-trigger:hover{transform:scale(1.1) rotate(5deg)}.avatar-wrapper{font-size:35px;display:flex;align-items:center;justify-content:center}.avatar-emoji{animation:float 3s ease-in-out infinite}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-5px)}to{transform:translateY(0)}}.online-indicator{position:absolute;top:5px;right:5px;width:15px;height:15px;background:#10b981;border:3px solid white;border-radius:50%;box-shadow:0 0 10px #10b98180}[data-theme=dark] .online-indicator{border-color:var(--bg-secondary)}.sci-assistant-bubble{width:280px;padding:15px 20px;margin-bottom:20px;opacity:0;transform:translateY(20px) scale(.9);transition:all .4s cubic-bezier(.175,.885,.32,1.275);background:var(--bg-secondary);border-radius:20px 20px 5px;box-shadow:var(--shadow-lg);position:relative;visibility:hidden}.sci-assistant-bubble.active{opacity:1;transform:translateY(0) scale(1);visibility:visible}.bubble-header{font-size:10px;margin-bottom:8px;border-bottom:1px solid var(--border-primary);padding-bottom:5px}.bubble-close{position:absolute;top:5px;right:10px;background:none;border:none;color:var(--text-muted);font-size:20px;cursor:pointer;line-height:1;padding:5px;transition:color .2s}.bubble-close:hover{color:#ef4444}.bubble-text{margin:0;font-size:14px;line-height:1.6;color:#fff;font-family:Outfit,sans-serif;font-weight:500;padding-right:15px}.bubble-next-btn{margin-top:15px;width:100%;padding:8px;background:#60a5fa1a;border:1px solid var(--sci-hud-accent);border-radius:8px;color:var(--sci-hud-accent);font-family:Orbitron,sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.bubble-next-btn:hover{background:var(--sci-hud-accent);color:#fff;box-shadow:var(--sci-neon-glow)}.bubble-tail{position:absolute;bottom:-10px;right:25px;width:20px;height:20px;background:var(--bg-secondary);border-right:1px solid var(--border-primary);border-bottom:1px solid var(--border-primary);transform:rotate(45deg);z-index:-1}.pulse{animation:pulse-ring .5s ease-out}@keyframes pulse-ring{0%{transform:scale(1)}50%{transform:scale(1.15)}to{transform:scale(1)}}@media(max-width:768px){.sci-assistant-wrap{bottom:20px;right:20px}.sci-assistant-trigger{width:60px;height:60px}.sci-assistant-bubble{width:240px;right:0}}.watercycle-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.wc-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.wc-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.wc-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.wc-instruction:before{content:"METEO_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.wc-board{display:flex;justify-content:center;transform-origin:top center}.wc-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:30px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:25px;box-shadow:0 20px 50px #0000001a;position:relative}.wc-scene{position:relative;width:100%;height:450px;background:linear-gradient(to bottom,#87ceeb,#e0f6ff);border-radius:20px;overflow:hidden;transition:background 1s ease;border:4px solid var(--border-secondary);box-shadow:inset 0 0 50px #0000001a}[data-theme=dark] .wc-scene{background:linear-gradient(to bottom,#0ea5e9,#0c4a6e);border-color:#0f172a}.wc-scene.dark{background:linear-gradient(to bottom,#4b5563,#111827)!important}.wc-scene:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px);background-size:100% 40px;pointer-events:none;z-index:5}.wc-sun{position:absolute;top:40px;right:50px;width:80px;height:80px;background:#fbbf24;border-radius:50%;box-shadow:0 0 60px #f59e0b,0 0 120px #f59e0b66;transition:all 1s ease;z-index:2}.wc-mountain{position:absolute;bottom:0;left:-50px;border-bottom:300px solid #166534;border-left:200px solid transparent;border-right:300px solid transparent;z-index:3}.wc-mountain-2{position:absolute;bottom:0;left:150px;border-bottom:220px solid #15803d;border-left:180px solid transparent;border-right:180px solid transparent;z-index:2}.wc-lake{position:absolute;bottom:0;right:0;width:60%;height:100px;background:linear-gradient(to bottom,#3b82f6,#1e40af);border-top-left-radius:80px;z-index:4;box-shadow:inset 0 10px 30px #0003}.wc-evaporation{position:absolute;bottom:100px;right:15%;width:30%;height:250px;display:flex;justify-content:space-around;opacity:0;transition:opacity .5s;z-index:6}.wc-arrow-up{width:3px;height:100%;background:linear-gradient(to top,#fff0,#ffffffe6);box-shadow:0 0 10px #fff;animation:floatUp 2s infinite linear}.wc-clouds-container{position:absolute;top:60px;width:100%;height:120px;display:flex;justify-content:space-around;z-index:7}.wc-cloud{width:150px;height:50px;background:#fff;border-radius:25px;position:relative;transition:all 1s cubic-bezier(.4,0,.2,1);box-shadow:0 10px 30px #0000001a}.wc-cloud:before,.wc-cloud:after{content:"";position:absolute;background:inherit;border-radius:50%}.wc-cloud:before{width:60px;height:60px;top:-30px;left:20px}.wc-cloud:after{width:80px;height:80px;top:-45px;right:20px}.wc-drop{position:absolute;width:2px;height:20px;background:linear-gradient(to bottom,transparent,#60a5fa);animation:fall .6s infinite linear;box-shadow:0 0 5px #60a5fa;z-index:8}.wc-runoff{position:absolute;bottom:40px;left:200px;width:200px;height:12px;background:#3b82f6;border-radius:6px;opacity:0;transform:rotate(18deg);transition:opacity .5s;box-shadow:0 0 15px #3b82f6;z-index:4}@keyframes floatUp{0%{transform:translateY(150px);opacity:0}50%{opacity:1}to{transform:translateY(-100px);opacity:0}}@keyframes fall{0%{transform:translateY(-50px);opacity:0}50%{opacity:1}to{transform:translateY(350px);opacity:0}}.wc-param-panel{background:var(--bg-tertiary);border:1px solid var(--border-secondary);border-radius:20px;padding:24px;position:relative;z-index:2}.wc-slider-row{display:flex;align-items:center;gap:20px}.wc-slider-row label{font-family:Orbitron,sans-serif;font-size:13px;font-weight:700;color:var(--sci-hud-accent);min-width:140px;text-transform:uppercase;letter-spacing:1px}.wc-slider-row input[type=range]{flex:1;-webkit-appearance:none;height:6px;background:var(--bg-input);border-radius:10px;outline:none}.wc-slider-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;background:var(--sci-hud-accent);border-radius:50%;cursor:pointer;border:4px solid var(--bg-secondary);box-shadow:var(--sci-neon-glow)}.wc-info-box{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:18px;border-radius:12px;margin-top:15px;font-size:14px;border-left:4px solid var(--sci-hud-accent);color:var(--text-secondary);line-height:1.6}.wc-btn{padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;font-family:Orbitron,sans-serif;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:768px){.wc-nav{justify-content:center}.wc-scene{height:350px}.wc-param-panel,.wc-board-inner{padding:15px}}@media(max-width:480px){.wc-scene{height:280px}.wc-sun{width:50px;height:50px;right:20px;top:20px}.wc-cloud{transform:scale(.6)}.wc-slider-row{flex-direction:column;align-items:flex-start;gap:8px}.wc-slider-row label{min-width:auto;font-size:11px}}.solarsystem-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.ss-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.ss-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.ss-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.ss-instruction:before{content:"ASTRO_NAV_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.ss-board{display:flex;justify-content:center;transform-origin:top center}.ss-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:30px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:25px;box-shadow:0 20px 50px #0000001a;position:relative}.ss-viewport{width:100%;height:450px;background:radial-gradient(circle at center,#1e1b4b,#000);border-radius:20px;position:relative;overflow:hidden;border:4px solid var(--border-secondary);box-shadow:inset 0 0 100px #000c,0 0 30px #00000080}.ss-viewport:before{content:"";position:absolute;width:200%;height:200%;background-image:radial-gradient(white,rgba(255,255,255,.2) 2px,transparent 40px),radial-gradient(white,rgba(255,255,255,.15) 1px,transparent 30px);background-size:200px 200px,150px 150px;background-position:0 0,40px 60px;opacity:.3;animation:drift 100s linear infinite}@keyframes drift{0%{transform:translate(-25%,-25%)}to{transform:translate(0)}}.ss-sun{position:absolute;top:50%;left:50%;width:70px;height:70px;background:radial-gradient(circle,#fff7ed,#fbbf24 40%,#ea580c);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 60px #f59e0b,0 0 120px #f59e0b66,0 0 200px #ea580c33;z-index:10;animation:sunGlow 4s infinite ease-in-out}@keyframes sunGlow{0%,to{transform:translate(-50%,-50%) scale(1);box-shadow:0 0 60px #f59e0b,0 0 120px #f59e0b66}50%{transform:translate(-50%,-50%) scale(1.05);box-shadow:0 0 80px #f59e0b,0 0 180px #f59e0b99}}.ss-orbit{position:absolute;top:50%;left:50%;width:320px;height:320px;border:1px solid rgba(255,255,255,.15);border-radius:50%;transform:translate(-50%,-50%);z-index:5}.ss-earth-wrapper{position:absolute;top:50%;left:50%;width:320px;height:320px;transform:translate(-50%,-50%);animation:revolve 30s linear infinite}.ss-earth-wrapper.paused{animation-play-state:paused}@keyframes revolve{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.ss-earth{position:absolute;top:-20px;left:50%;width:40px;height:40px;background:#3b82f6;border-radius:50%;transform:translate(-50%);box-shadow:inset -10px -10px 20px #000c,0 0 15px #3b82f666;overflow:hidden;z-index:15}.ss-earth-surface{width:200%;height:100%;background:linear-gradient(90deg,#1e40af,#3b82f6 25%,#22c55e 35%,#3b82f6 50%,#1e40af 50%,#3b82f6 75%,#22c55e 85%,#3b82f6);animation:rotateEarth 10s linear infinite}.ss-earth-surface.paused{animation-play-state:paused}@keyframes rotateEarth{0%{transform:translate(0)}to{transform:translate(-50%)}}.ss-moon-wrapper{position:absolute;top:-20px;left:50%;width:80px;height:80px;transform:translate(-50%,-50%);animation:revolve 5s linear infinite}.ss-moon{position:absolute;top:-8px;left:50%;width:12px;height:12px;background:#cbd5e1;border-radius:50%;transform:translate(-50%);box-shadow:inset -3px -3px 6px #00000080}.ss-moon-orbit{position:absolute;top:50%;left:50%;width:100%;height:100%;border:1px dotted rgba(255,255,255,.2);border-radius:50%;transform:translate(-50%,-50%)}.ss-controls{width:100%;background:var(--bg-tertiary);padding:24px;border-radius:20px;display:flex;gap:20px;border:1px solid var(--border-secondary);z-index:2}.ss-toggle{flex:1;font-family:Orbitron,sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;padding:15px;border-radius:12px;border:1px solid var(--border-primary);background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px}.ss-toggle.active{background:var(--accent-gradient);color:#fff;border-color:transparent;box-shadow:var(--sci-neon-glow)}.ss-info{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:18px;border-radius:12px;font-size:14px;color:var(--text-secondary);border-left:4px solid var(--sci-hud-accent);line-height:1.6;z-index:2}.ss-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:768px){.ss-nav{justify-content:center}.ss-viewport{height:350px}.ss-controls{flex-direction:column;gap:10px}.ss-board-inner{padding:20px}}@media(max-width:480px){.ss-viewport{height:280px}.ss-sun{width:50px;height:50px}.ss-earth{width:30px;height:30px}.ss-orbit,.ss-earth-wrapper{width:220px;height:220px}.ss-info{font-size:12px}}.foodchain-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow-x:hidden}.food-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;position:relative;z-index:10}.food-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.food-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.food-instruction:before{content:"ANALYSIS_MODE";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.food-board{display:flex;justify-content:center;transform-origin:top center}.food-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:40px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.food-board-inner:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle at 2px 2px,var(--border-secondary) 1px,transparent 0);background-size:24px 24px;opacity:.15;pointer-events:none}.food-slots{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;width:100%;z-index:2}.food-slot{width:130px;height:130px;background:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.food-slot.filled{border-color:var(--sci-hud-accent);background:var(--sci-glass-bg);box-shadow:0 0 20px #60a5fa33}.food-slot .emoji{font-size:44px;margin-bottom:5px}.food-slot .slot-label{position:absolute;bottom:-22px;font-size:10px;font-weight:800;text-transform:uppercase;font-family:Orbitron,sans-serif;color:var(--text-secondary);letter-spacing:1px}.food-energy-arrow{display:flex;align-items:center;justify-content:center;color:var(--sci-hud-accent);font-size:18px;animation:energyFlow 2s infinite ease-in-out}@keyframes energyFlow{0%{transform:scale(1);opacity:.4}50%{transform:scale(1.3) translate(5px);opacity:1;filter:drop-shadow(0 0 8px var(--sci-hud-accent))}to{transform:scale(1);opacity:.4}}.food-options-container{width:100%;z-index:2}.food-options{display:flex;gap:15px;flex-wrap:wrap;justify-content:center;padding:24px;background:var(--bg-tertiary);border-radius:20px;border:1px solid var(--border-secondary)}.food-opt{background:var(--bg-secondary);border:1px solid var(--border-secondary);border-radius:12px;padding:12px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:8px;width:90px;transition:all .3s}.food-opt:hover:not(.placed){transform:translateY(-5px);border-color:var(--sci-hud-accent);box-shadow:var(--sci-neon-glow)}.food-opt.placed{opacity:.2;cursor:default}.food-opt .emoji{font-size:32px}.food-opt .name{font-size:11px;font-weight:800;color:var(--text-primary);text-transform:uppercase;font-family:Orbitron,sans-serif}.food-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}.food-btn:hover{transform:translateY(-2px);box-shadow:0 0 25px #60a5fa80}@media(max-width:768px){.food-nav{justify-content:center}.food-board-inner{padding:20px}.food-slots{gap:10px}.food-slot{width:100px;height:100px}.food-slot .emoji{font-size:36px}.food-options{padding:15px}.food-opt{width:80px;padding:10px}.food-opt .emoji{font-size:24px}}@media(max-width:480px){.food-slot{width:75px;height:75px}.food-slot .emoji{font-size:28px}.food-slot .slot-label{font-size:8px;bottom:-18px}.food-opt{width:65px}.food-opt .name{font-size:9px}}.matterstate-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.ms-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.ms-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.ms-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.ms-instruction:before{content:"MOLECULAR_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.ms-board{display:flex;justify-content:center;transform-origin:top center}.ms-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;gap:30px;align-items:flex-start;box-shadow:0 20px 50px #0000001a;position:relative}.ms-canvas-col{flex:1;display:flex;flex-direction:column;align-items:center;position:relative}.ms-canvas-col:after{content:"PARTICLE_CHAMBER_VIEW";position:absolute;top:10px;left:10px;font-family:Orbitron,sans-serif;font-size:9px;color:var(--sci-hud-accent);letter-spacing:1px;opacity:.6}canvas{background:#0f172a;border:4px solid var(--border-secondary);box-shadow:inset 0 0 30px #00000080,0 0 20px #0003}.ms-controls-col{width:350px;display:flex;flex-direction:column;gap:20px}.ms-card{padding:24px;border-radius:20px;background:var(--bg-tertiary);border:1px solid var(--border-secondary);position:relative}.ms-card h4{font-family:Orbitron,sans-serif;font-size:11px;text-transform:uppercase;letter-spacing:1.5px;margin:0 0 20px;color:var(--sci-hud-accent)}.ms-thermometer-wrap{display:flex;align-items:center;gap:20px}.ms-slider{-webkit-appearance:none;height:80px;width:12px;background:var(--bg-input);border-radius:10px;outline:none;writing-mode:vertical-lr;direction:rtl;margin:0}.ms-therm-bar{width:20px;height:120px;background:var(--bg-input);border:2px solid var(--border-secondary);border-radius:30px;position:relative;overflow:hidden}.ms-therm-fill{position:absolute;bottom:0;width:100%;transition:all .5s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 -5px 15px #ffffff4d}.ms-reading{font-family:Orbitron,sans-serif;font-size:32px;font-weight:800;text-shadow:0 0 10px currentColor}.ms-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:900px){.ms-board-inner{flex-direction:column;align-items:center}.ms-controls-col{width:100%}}@media(max-width:768px){.ms-nav{justify-content:center}.ms-board-inner{padding:20px}canvas{width:100%!important;height:auto!important}}@media(max-width:480px){.ms-reading{font-size:24px}.ms-thermometer-wrap{gap:10px}}.plantparts-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.pp-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.pp-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.pp-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.pp-instruction:before{content:"BIOMETRIC_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.pp-board{display:flex;justify-content:center;transform-origin:top center}.pp-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;gap:30px;box-shadow:0 20px 50px #0000001a;position:relative}.pp-board-inner:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(var(--border-secondary) 1px,transparent 1px);background-size:30px 30px;opacity:.1;pointer-events:none}.pp-plant-col{flex:1.2;background:var(--bg-tertiary);border-radius:20px;padding:30px;border:1px solid var(--border-secondary);display:flex;flex-direction:column;align-items:center;position:relative;min-height:500px}.pp-plant-wrapper{margin-top:auto;position:relative;display:flex;flex-direction:column;align-items:center}.pp-part-tag{position:absolute;background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid var(--sci-hud-accent);padding:4px 12px;border-radius:8px;font-family:Orbitron,sans-serif;font-size:10px;color:var(--text-primary);cursor:pointer;white-space:nowrap;transition:all .3s;box-shadow:0 0 10px #60a5fa33;z-index:5}.pp-part-tag:hover{background:var(--sci-hud-accent);color:#fff;transform:scale(1.1);box-shadow:var(--sci-neon-glow)}.pp-flower{font-size:60px;cursor:pointer;transition:transform .3s;z-index:4}.pp-flower:hover{transform:scale(1.2) rotate(10deg)}.pp-stem{width:12px;height:200px;background:linear-gradient(to bottom,#4ade80,#166534);position:relative;cursor:pointer}.pp-leaf{position:absolute;width:40px;height:20px;background:#22c55e;border-radius:40px 0;cursor:pointer;transition:all .3s}.pp-leaf.left{left:-35px;top:40px;transform:rotate(-20deg)}.pp-leaf.right{right:-35px;top:80px;transform:rotate(110deg)}.pp-leaf:hover{filter:brightness(1.2);transform:scale(1.2)}.pp-roots{width:100px;height:80px;position:relative;display:flex;justify-content:center;cursor:pointer}.pp-root-line{position:absolute;width:2px;background:#78350f;height:40px;transform-origin:top}.pp-root-line:nth-child(1){transform:rotate(-30deg);height:60px}.pp-root-line:nth-child(2){transform:rotate(-10deg);height:75px}.pp-root-line:nth-child(3){transform:rotate(15deg);height:70px}.pp-root-line:nth-child(4){transform:rotate(40deg);height:55px}.pp-info-col{flex:.8;display:flex;flex-direction:column}.pp-detail-card{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--sci-glass-border);border-radius:20px;padding:30px;height:100%;display:flex;flex-direction:column;gap:20px;box-shadow:0 10px 30px #0000001a}.pp-micro-view{width:100%;height:150px;background:#000;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:60px;border:2px solid var(--sci-hud-accent);box-shadow:inset 0 0 20px #60a5fa4d;position:relative;overflow:hidden}.pp-micro-view:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:repeating-linear-gradient(0deg,rgba(96,165,250,.05) 0px,rgba(96,165,250,.05) 1px,transparent 1px,transparent 2px);pointer-events:none}.pp-detail-title{font-family:Orbitron,sans-serif;font-size:24px;color:var(--sci-hud-accent);margin:0;text-transform:uppercase}.pp-detail-desc{font-size:15px;line-height:1.7;color:var(--text-secondary);margin:0}.pp-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:900px){.pp-board-inner{flex-direction:column}.pp-info-col{flex:1}.pp-plant-col{min-height:400px}}@media(max-width:480px){.pp-detail-title{font-size:20px}.pp-detail-desc{font-size:14px}.pp-part-tag{font-size:8px;padding:3px 8px}}.photo-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.photo-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.photo-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.photo-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.photo-instruction:before{content:"BIO_SYNTHESIS_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.photo-board{display:flex;justify-content:center;transform-origin:top center;overflow:hidden}.photo-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.photo-board-inner:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(var(--border-secondary) 1px,transparent 1px);background-size:30px 30px;opacity:.1;pointer-events:none}.photo-pantry{display:flex;gap:15px;flex-wrap:wrap;justify-content:center;background:var(--bg-tertiary);padding:24px;border-radius:20px;width:100%;border:1px solid var(--border-secondary);z-index:2}.photo-item{background:var(--bg-secondary);border:1px solid var(--border-secondary);border-radius:16px;padding:15px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:10px;transition:all .3s cubic-bezier(.175,.885,.32,1.275);min-width:110px;-webkit-user-select:none;user-select:none}.photo-item:hover:not(.used){border-color:var(--sci-hud-accent);transform:translateY(-5px);box-shadow:var(--sci-neon-glow)}.photo-item.used{opacity:.2;transform:scale(.9);cursor:default}.photo-item .emoji{font-size:36px}.photo-item .name{color:var(--text-primary);font-weight:800;font-size:11px;font-family:Orbitron,sans-serif;text-transform:uppercase}.photo-tree{position:relative;width:350px;height:350px;display:flex;align-items:center;justify-content:center;margin:20px 0;background:radial-gradient(circle,rgba(96,165,250,.1) 0%,transparent 70%)}.photo-leaf-bg{position:absolute;font-size:200px;filter:drop-shadow(0 0 20px var(--accent-shadow));transition:all 1s ease;z-index:1}.photo-leaf-bg.glow{filter:drop-shadow(0 0 50px #22c55e) brightness(1.2);transform:scale(1.1);animation:leafPulse 2.5s infinite alternate ease-in-out}.photo-slots{position:relative;z-index:2;display:flex;gap:15px}.photo-slot{width:70px;height:70px;background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:2px dashed var(--border-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:34px;transition:all .4s}.photo-slot.filled{border-style:solid;border-color:var(--sci-hud-accent);box-shadow:0 0 20px #60a5fa4d;transform:scale(1.1)}.photo-out-item{position:absolute;font-size:44px;opacity:0;display:flex;flex-direction:column;align-items:center;filter:drop-shadow(0 0 10px rgba(255,255,255,.5))}.photo-out-item span{font-family:Orbitron,sans-serif;font-size:11px;font-weight:800;color:#fff;background:var(--accent-gradient);padding:4px 10px;border-radius:12px;margin-top:8px;text-transform:uppercase;letter-spacing:1px}.photo-out-item.fly{animation:floatAway 3.5s forwards cubic-bezier(.2,.8,.2,1)}@keyframes leafPulse{0%{transform:scale(1.05) rotate(0);opacity:.8}to{transform:scale(1.15) rotate(5deg);opacity:1}}@keyframes floatAway{0%{transform:translate(0) scale(0);opacity:0}20%{opacity:1}to{transform:translate(var(--tx),var(--ty)) scale(1.3);opacity:0}}.photo-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:768px){.photo-nav{justify-content:center}.photo-pantry{gap:10px;padding:15px}.photo-item{padding:10px;min-width:90px}.photo-board-inner{padding:20px}.photo-tree{width:300px;height:300px}.photo-leaf-bg{font-size:160px}}@media(max-width:480px){.photo-tree{transform:scale(.85);margin-bottom:-30px}.photo-item .emoji{font-size:28px}.photo-item .name{font-size:9px}.photo-slot{width:60px;height:60px;font-size:28px}}.magnet-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.mag-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.mag-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.mag-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.mag-instruction:before{content:"MAGNETIC_FIELD_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.mag-board{display:flex;justify-content:center;transform-origin:top center}.mag-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.mag-testing-area{position:relative;width:100%;height:400px;background:radial-gradient(circle at center,#1e293b,#020617);border-radius:20px;overflow:hidden;border:4px solid var(--border-secondary);display:flex;align-items:center;justify-content:center}.mag-testing-area:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:40px 40px;pointer-events:none}.mag-field-lines{position:absolute;width:300px;height:200px;border:1px solid rgba(96,165,250,.2);border-radius:50%;pointer-events:none;animation:fluxMove 4s infinite linear}@keyframes fluxMove{0%{transform:scale(.8);opacity:0}50%{opacity:.3}to{transform:scale(1.5);opacity:0}}.mag-field-lines:nth-child(2){animation-delay:2s}.mag-main-magnet{width:200px;height:60px;display:flex;box-shadow:0 15px 35px #0006;z-index:10;border:2px solid rgba(255,255,255,.1);border-radius:12px;overflow:hidden;transform:translate(-50px)}.mag-pole-n,.mag-pole-s{flex:1;display:flex;align-items:center;justify-content:center;font-family:Orbitron,sans-serif;font-weight:800;color:#fff;font-size:24px}.mag-pole-n{background:linear-gradient(135deg,#ef4444,#991b1b)}.mag-pole-s{background:linear-gradient(135deg,#2563eb,#1e3a8a)}.mag-tested-obj{position:absolute;font-size:50px;right:15%;transition:all .8s cubic-bezier(.175,.885,.32,1.275);z-index:11;filter:drop-shadow(0 0 10px rgba(255,255,255,.3))}.mag-tested-obj.attract{transform:translate(-150px);animation:shake .2s infinite}.mag-tested-obj.repel{transform:translate(100px);opacity:0}.mag-tested-obj.fall{transform:translateY(200px);opacity:0}@keyframes shake{0%,to{transform:translate(-150px) rotate(0)}25%{transform:translate(-150px) rotate(2deg)}75%{transform:translate(-150px) rotate(-2deg)}}.mag-log{width:100%;background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:20px;border-radius:16px;border-left:4px solid var(--sci-hud-accent);color:var(--text-secondary);font-size:14px;line-height:1.6}.mag-drawer{display:flex;gap:15px;flex-wrap:wrap;justify-content:center;width:100%;padding:24px;background:var(--bg-tertiary);border-radius:20px;border:1px solid var(--border-secondary);z-index:2}.mag-item-btn{background:var(--bg-secondary);border:1px solid var(--border-secondary);border-radius:12px;padding:12px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:8px;width:100px;transition:all .3s}.mag-item-btn:hover{transform:translateY(-5px);border-color:var(--sci-hud-accent);box-shadow:var(--sci-neon-glow)}.mag-item-btn .emoji{font-size:32px}.mag-item-btn .name{font-size:11px;font-weight:800;color:var(--text-primary);text-transform:uppercase;font-family:Orbitron,sans-serif;text-align:center}.mag-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:768px){.mag-nav{justify-content:center}.mag-testing-area{height:300px}.mag-main-magnet{transform:translate(-30px) scale(.8)}.mag-tested-obj{font-size:40px;right:10%}}@media(max-width:480px){.mag-testing-area{height:250px}.mag-main-magnet{transform:translate(-20px) scale(.7)}.mag-item-btn{width:85px}.mag-item-btn .name{font-size:9px}}.circuit-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.circ-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.circ-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.cir-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.cir-instruction:before{content:"SCHEMATIC_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.cir-board{display:flex;justify-content:center;transform-origin:top center;overflow:hidden}.cir-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.cir-diagram{position:relative;width:100%;max-width:600px;height:400px;background:#0f172a;border-radius:20px;border:4px solid var(--border-secondary);overflow:hidden;display:flex;align-items:center;justify-content:center}.cir-diagram:before{content:"";position:absolute;width:100%;height:100%;background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1px);background-size:40px 40px}.cir-flow{position:absolute;width:440px;height:280px;border:3px solid #334155;border-radius:12px;z-index:1;transition:all .3s}.cir-flow.active{border:3px solid #fbbf24;box-shadow:0 0 20px #fbbf2466;background:repeating-linear-gradient(90deg,transparent 0,transparent 20px,rgba(251,191,36,.1) 20px,rgba(251,191,36,.1) 40px);animation:bgFlow 10s linear infinite}@keyframes bgFlow{0%{background-position:0 0}to{background-position:400px 0}}.cir-slot{position:absolute;width:80px;height:80px;background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:2px dashed var(--border-primary);border-radius:12px;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .3s}.cir-slot.filled{border-style:solid;border-color:var(--sci-hud-accent)}.cir-slot.power-on{box-shadow:0 0 30px #facc15;background:#facc151a}.cir-slot-top{top:60px;left:50%;transform:translate(-50%)}.cir-slot-bottom{bottom:60px;left:50%;transform:translate(-50%)}.cir-slot-left{left:80px;top:50%;transform:translateY(-50%)}.cir-slot-right{right:80px;top:50%;transform:translateY(-50%)}.cir-slot-txt{font-family:Orbitron,sans-serif;font-size:8px;color:var(--text-muted);text-transform:uppercase;margin-top:5px}.cir-inventory{display:flex;gap:15px;flex-wrap:wrap;justify-content:center;background:var(--bg-tertiary);padding:24px;border-radius:20px;width:100%;border:1px solid var(--border-secondary);z-index:2}.cir-item-btn{background:var(--bg-secondary);border:1px solid var(--border-secondary);border-radius:12px;padding:12px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:8px;width:110px;transition:all .3s}.cir-item-btn:hover{border-color:var(--sci-hud-accent);transform:translateY(-5px)}.cir-item-btn.selected{background:var(--sci-hud-accent);border-color:transparent;box-shadow:var(--sci-neon-glow)}.cir-item-btn.selected .name{color:#fff}.cir-item-btn .emoji{font-size:32px}.cir-item-btn .name{font-size:10px;font-weight:800;color:var(--text-primary);text-transform:uppercase;font-family:Orbitron,sans-serif;text-align:center}.cir-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:768px){.circ-nav{justify-content:center}.cir-diagram{height:320px;max-width:100%}.cir-flow{width:85%;height:70%}.cir-slot{width:60px;height:60px}.cir-slot-left{left:20px}.cir-slot-right{right:20px}.cir-inventory{gap:10px;padding:15px}.cir-item-btn{width:90px}}@media(max-width:480px){.cir-diagram{height:280px}.cir-slot{width:50px;height:50px}.cir-slot .emoji{font-size:24px}.cir-item-btn{width:85px}.cir-item-btn .name{font-size:8px}}.friction-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.fric-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.fric-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.fric-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.fric-instruction:before{content:"KINETIC_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.fric-board{display:flex;justify-content:center;transform-origin:top center;overflow:hidden}.fric-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.fric-panel{width:100%;display:flex;flex-direction:column;gap:15px}.fric-surface-btn{padding:10px 20px;border-radius:12px;border:1px solid var(--border-secondary);background:var(--bg-tertiary);color:var(--text-secondary);font-family:Orbitron,sans-serif;font-size:11px;font-weight:700;cursor:pointer;transition:all .3s;text-transform:uppercase;letter-spacing:1px}.fric-surface-btn:hover:not(:disabled){border-color:var(--sci-hud-accent);color:var(--text-primary)}.fric-surface-btn.active{background:var(--sci-hud-accent);color:#fff;border-color:transparent;box-shadow:var(--sci-neon-glow)}.fric-track-wrap{position:relative;width:100%;height:200px;background:#020617;border-radius:20px;border:4px solid var(--border-secondary);display:flex;align-items:flex-end;padding-bottom:30px;overflow:hidden}.fric-track-wrap:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:50px 100%}.fric-surface{position:absolute;bottom:0;width:100%;height:40px;z-index:1;transition:all .5s ease}.fric-surface.kaca{background:linear-gradient(to right,#94a3b8,#cbd5e1);box-shadow:inset 0 10px 20px #ffffff80}.fric-surface.aspal{background:#1e293b;background-image:radial-gradient(#334155 1px,transparent 1px);background-size:4px 4px}.fric-surface.pasir{background:#d97706;background-image:radial-gradient(#b45309 2px,transparent 2px);background-size:10px 10px}.fric-car{position:absolute;left:50px;bottom:35px;font-size:60px;z-index:5;transition-property:transform;transition-timing-function:cubic-bezier(.1,.5,.1,1);filter:drop-shadow(0 0 15px rgba(239,68,68,.4))}.fric-controls{display:flex;gap:20px;width:100%}.fric-btn{flex:1;font-family:Orbitron,sans-serif;padding:18px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;color:#fff}.fric-btn:disabled{opacity:.3;cursor:not-allowed;transform:none!important;box-shadow:none!important}.fric-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--sci-neon-glow)}@media(max-width:768px){.fric-nav{justify-content:center}.fric-track-wrap{height:180px}.fric-controls{flex-direction:column}}@media(max-width:480px){.fric-car{font-size:40px}.fric-surface-btn{padding:8px 12px;font-size:9px}}.light-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.light-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.light-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.light-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.light-instruction:before{content:"OPTIC_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.light-board{display:flex;justify-content:center;transform-origin:top center;overflow:hidden}.light-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.light-lab{position:relative;width:100%;height:400px;background:#020617;border-radius:20px;border:4px solid var(--border-secondary);overflow:hidden;display:flex;align-items:center;justify-content:center}.light-flashlight{position:absolute;left:50px;top:50%;transform:translateY(-50%);font-size:50px;cursor:pointer;z-index:10;filter:drop-shadow(0 0 10px rgba(255,255,255,.3));transition:transform .2s}.light-flashlight:hover{transform:translateY(-50%) scale(1.1)}.light-beam{position:absolute;left:100px;top:50%;width:0;height:4px;background:#fff;box-shadow:0 0 20px #fff;transition:width .5s ease;z-index:5}.light-beam.active{width:calc(50% - 140px)}.light-prism{position:absolute;width:0;height:0;border-left:50px solid transparent;border-right:50px solid transparent;border-bottom:90px solid rgba(147,197,253,.2);border-top:0;z-index:6}.light-prism:before{content:"";position:absolute;top:0;left:-50px;width:0;height:0;border-left:50px solid transparent;border-right:50px solid transparent;border-bottom:90px solid transparent;box-shadow:inset 0 -4px #fff6}.light-rainbow{position:absolute;left:calc(50% + 40px);top:50%;width:0;height:120px;background:linear-gradient(to right,#f006,#ffa50066,#ff06,#00800066,#00f6,#4b008266,#ee82ee66);filter:blur(8px);opacity:0;transition:opacity 1s,width 1s;z-index:4;transform:rotate(10deg);transform-origin:left center}.light-rainbow.active{opacity:1;width:300px}.light-info{width:100%;background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:24px;border-radius:16px;border-left:4px solid var(--sci-hud-accent);color:var(--text-secondary);font-size:14px;line-height:1.7}.light-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:768px){.light-nav{justify-content:center}.light-lab{height:320px}.light-flashlight{left:20px;font-size:40px}.light-beam.active{width:calc(50% - 70px)}.light-rainbow.active{width:150px}}@media(max-width:480px){.light-lab{height:260px}.light-flashlight{font-size:30px}}.animal-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.animal-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.animal-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.animal-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.animal-instruction:before{content:"ZOOLOGY_SCAN_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.animal-board{display:flex;justify-content:center;transform-origin:top center;overflow:hidden}.animal-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.animal-subject{width:100%;max-width:600px;background:#0f172a;border-radius:20px;border:4px solid var(--border-secondary);padding:40px;display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden}.animal-subject:before{content:"";position:absolute;width:100%;height:100%;background-image:radial-gradient(rgba(96,165,250,.1) 1px,transparent 1px);background-size:20px 20px;top:0;left:0}.animal-main-icon{font-size:100px;z-index:2;filter:drop-shadow(0 0 20px rgba(255,255,255,.2));margin-bottom:20px}.animal-trait{background:#ffffff0d;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.1);padding:20px;border-radius:12px;color:var(--text-secondary);font-size:15px;line-height:1.6;text-align:center;z-index:2;width:100%}.animal-options{display:flex;gap:20px;width:100%;justify-content:center;flex-wrap:wrap}.animal-opt-btn{background:var(--bg-tertiary);border:1px solid var(--border-secondary);border-radius:20px;padding:24px;flex:1;min-width:220px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:12px;transition:all .3s cubic-bezier(.175,.885,.32,1.275)}.animal-opt-btn:hover{transform:translateY(-8px);border-color:var(--sci-hud-accent);box-shadow:var(--sci-neon-glow)}.animal-opt-btn .emoji{font-size:40px}.animal-opt-btn .name{font-family:Orbitron,sans-serif;font-size:14px;font-weight:800;color:var(--text-primary);text-transform:uppercase}.animal-opt-btn .desc{font-size:12px;color:var(--text-muted);text-align:center}.animal-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}.animal-score{font-family:Orbitron,sans-serif;font-weight:800;font-size:18px;color:var(--sci-hud-accent)!important;text-shadow:0 0 10px rgba(96,165,250,.4)}@keyframes bounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.bounce{animation:bounce 2s infinite}@media(max-width:768px){.animal-nav{justify-content:center}.animal-subject{padding:30px}.animal-main-icon{font-size:80px}.animal-options{gap:10px}.animal-opt-btn{min-width:160px;padding:15px}}@media(max-width:480px){.animal-subject{padding:20px}.animal-main-icon{font-size:60px}.animal-opt-btn{min-width:100%}}.meta-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.meta-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.meta-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.meta-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.meta-instruction:before{content:"CHRONO_BIO_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.meta-board{display:flex;justify-content:center;transform-origin:top center;overflow:hidden}.meta-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.meta-tabs{display:flex;gap:15px;width:100%;justify-content:center}.meta-tab-btn{background:var(--bg-tertiary);border:1px solid var(--border-secondary);padding:12px 24px;border-radius:12px;color:var(--text-secondary);font-family:Orbitron,sans-serif;font-size:11px;font-weight:700;cursor:pointer;transition:all .3s;text-transform:uppercase;letter-spacing:1px}.meta-tab-btn.active{background:var(--sci-hud-accent);color:#fff;border-color:transparent;box-shadow:var(--sci-neon-glow)}.meta-stepper{display:flex;width:100%;max-width:600px;justify-content:space-between;position:relative;margin:20px 0}.meta-stepper:after{content:"";position:absolute;top:50%;left:0;width:100%;height:2px;background:var(--border-primary);z-index:1;transform:translateY(-50%)}.meta-step{width:50px;height:50px;background:var(--bg-secondary);border:4px solid var(--border-secondary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:Orbitron,sans-serif;font-weight:800;font-size:16px;z-index:2;transition:all .4s;position:relative}.meta-step.active{border-color:var(--sci-hud-accent);background:var(--bg-primary);transform:scale(1.2);box-shadow:0 0 20px #60a5fa66}.meta-step.passed{background:var(--sci-hud-accent);border-color:var(--sci-hud-accent);color:#fff}.meta-stage-display{width:100%;max-width:600px;background:#0f172a;border:4px solid var(--border-secondary);border-radius:24px;padding:40px;display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden}.meta-stage-display:before{content:"";position:absolute;width:100%;height:100%;background-image:radial-gradient(rgba(239,68,68,.1) 1px,transparent 1px);background-size:30px 30px}.meta-stage-icon{font-size:100px;margin-bottom:20px;z-index:2;filter:drop-shadow(0 0 30px rgba(255,255,255,.2))}.meta-stage-title{font-family:Orbitron,sans-serif;font-size:28px;color:var(--sci-hud-accent);margin:0 0 10px;text-transform:uppercase;z-index:2}.meta-stage-desc{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:20px;border-radius:12px;color:var(--text-secondary);font-size:15px;line-height:1.7;text-align:center;z-index:2;width:100%}.meta-controls{display:flex;gap:20px;width:100%;max-width:600px}.meta-btn{flex:1;font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff}.meta-btn:disabled{opacity:.3;cursor:not-allowed}.meta-btn:not(:disabled):hover{transform:translateY(-2px);box-shadow:var(--sci-neon-glow)}.animate-in{animation:popIn .5s cubic-bezier(.175,.885,.32,1.275) forwards}@keyframes popIn{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@media(max-width:768px){.meta-nav{justify-content:center}.meta-stage-display{padding:30px}.meta-stage-icon{font-size:80px}.meta-tab-btn{padding:8px 16px;font-size:9px}}@media(max-width:480px){.meta-stage-icon{font-size:60px}.meta-stage-title{font-size:20px}.meta-step{width:35px;height:35px;font-size:12px;border-width:2px}.meta-controls{flex-direction:column}}.skel-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.skel-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.skel-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.skel-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.skel-instruction:before{content:"RADIOLOGY_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.skel-board{display:flex;justify-content:center;transform-origin:top center;overflow:hidden}.skel-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.skel-workspace{display:flex;gap:30px;width:100%}.skel-body-map{flex:1;background:#020617;border:4px solid var(--border-secondary);border-radius:24px;height:600px;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;padding:40px 0;gap:20px}.skel-body-map:before{content:"";position:absolute;width:100%;height:100%;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:40px 40px;top:0;left:0}.skel-slot{width:180px;height:80px;border:2px dashed rgba(255,255,255,.2);border-radius:12px;background:#ffffff05;display:flex;align-items:center;justify-content:center;font-family:Orbitron,sans-serif;font-size:10px;color:#fff6;cursor:pointer;transition:all .3s;z-index:2;text-align:center}.skel-slot:hover{border-color:var(--sci-hud-accent);background:#60a5fa0d}.skel-slot.filled{border:2px solid var(--sci-hud-accent);background:#60a5fa1a;color:#fff;border-style:solid}.skel-inventory{width:280px;background:var(--bg-tertiary);border-radius:20px;border:1px solid var(--border-secondary);padding:20px;display:flex;flex-direction:column;gap:12px;height:600px;overflow-y:auto}.skel-bone-item{background:var(--bg-secondary);border:1px solid var(--border-secondary);padding:15px;border-radius:12px;cursor:pointer;display:flex;align-items:center;gap:12px;transition:all .3s}.skel-bone-item:hover:not(.used){border-color:var(--sci-hud-accent);transform:translate(5px)}.skel-bone-item.selected{background:var(--sci-hud-accent);border-color:transparent;color:#fff;box-shadow:var(--sci-neon-glow)}.skel-bone-item.used{opacity:.3;cursor:not-allowed}.skel-bone-item .emoji{font-size:24px}.skel-bone-item .name{font-family:Orbitron,sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px}.skel-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:768px){.skel-nav{justify-content:center}.skel-workspace{flex-direction:column}.skel-inventory{width:100%;height:auto;display:grid;grid-template-columns:repeat(2,1fr)}.skel-body-map{height:500px}}@media(max-width:480px){.skel-inventory{grid-template-columns:1fr}.skel-slot{width:140px;height:60px}}.dig-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.dig-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.dig-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.dig-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.dig-instruction:before{content:"GASTRO_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.dig-board{display:flex;justify-content:center;transform-origin:top center;overflow:hidden}.dig-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.dig-system{position:relative;width:300px;height:500px;background:#0f172a99;border-radius:100px;border:4px solid var(--border-secondary);display:flex;flex-direction:column;align-items:center;padding:40px 0;overflow:hidden}.dig-path{position:absolute;width:10px;height:100%;background:#3b82f633;top:0;left:50%;transform:translate(-50%);z-index:1}.dig-organ{font-size:50px;z-index:5;margin-bottom:40px;transition:all .5s;filter:grayscale(1) opacity(.3)}.dig-organ.active{filter:grayscale(0) opacity(1);transform:scale(1.3)}.dig-food{position:absolute;left:calc(50% - 20px);width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:30px;z-index:10;transition:top .8s cubic-bezier(.4,0,.2,1);filter:drop-shadow(0 0 10px rgba(255,255,255,.3))}.dig-food.scale-down{transform:scale(.6)}.dig-food.scale-mush{transform:scale(.4) rotate(15deg);filter:blur(2px)}.dig-info-box{width:100%;background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:24px;border-radius:16px;border-left:4px solid var(--sci-hud-accent)}.dig-info-title{font-family:Orbitron,sans-serif;font-size:20px;color:var(--sci-hud-accent);margin-bottom:8px;text-transform:uppercase}.dig-info-desc{color:var(--text-secondary);font-size:15px;line-height:1.7;margin:0}.dig-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:768px){.dig-nav{justify-content:center}.dig-system{width:220px;height:450px}.dig-organ{font-size:40px;margin-bottom:30px}.dig-board-inner{padding:30px}}@media(max-width:480px){.dig-system{width:180px;height:400px}.dig-organ{font-size:32px}}.resp-container{min-height:100vh;background:var(--bg-primary);padding:20px;font-family:Outfit,sans-serif;color:var(--text-primary);transition:var(--theme-transition);position:relative;overflow:hidden}.resp-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px;z-index:10;position:relative}.resp-nav .stat-badge{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 18px;border-radius:12px;font-weight:700;font-size:13px;color:var(--text-primary);border:1px solid var(--sci-glass-border);font-family:Orbitron,sans-serif;letter-spacing:1px}.resp-instruction{background:#3b82f60d;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto;position:relative}.resp-instruction:before{content:"PULMONARY_LOG";position:absolute;top:-10px;left:20px;background:var(--sci-hud-accent);color:#fff;font-size:9px;font-family:Orbitron,sans-serif;padding:2px 8px;border-radius:4px}.resp-board{display:flex;justify-content:center;transform-origin:top center;overflow:hidden}.resp-board-inner{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:24px;padding:40px;width:100%;max-width:950px;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative;box-shadow:0 20px 50px #0000001a}.resp-lab{position:relative;width:100%;height:400px;background:#020617;border-radius:20px;border:4px solid var(--border-secondary);overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center}.resp-lab:before{content:"";position:absolute;width:100%;height:100%;background-image:radial-gradient(rgba(239,68,68,.1) 1px,transparent 1px);background-size:40px 40px}.resp-trachea{width:20px;height:100px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:10px;z-index:2;margin-top:-50px}.resp-lungs-wrap{display:flex;gap:10px;z-index:5;margin-top:-10px}.resp-lung{width:100px;height:160px;background:linear-gradient(135deg,#ef4444,#991b1b);border-radius:50% 50% 20% 20%;box-shadow:0 0 30px #ef44444d;opacity:.8;transition:transform .1s linear}.resp-diaphragm{position:absolute;bottom:0;width:120%;background:linear-gradient(to top,#3b82f6,transparent);border-top:2px solid #60a5fa;box-shadow:0 0 20px #3b82f666;z-index:6;opacity:.5;transition:height .1s linear}.resp-particles{position:absolute;width:100%;height:100%;top:0;left:0;pointer-events:none;z-index:10}.resp-particle{position:absolute;left:50%;top:100px;transform:translate(-50%);font-family:Orbitron,sans-serif;font-weight:800;font-size:14px}.resp-particle.inhale{color:#60a5fa;animation:particleIn 2s forwards}.resp-particle.exhale{color:#f87171;animation:particleOut 2s forwards}@keyframes particleIn{0%{top:0;opacity:0;transform:translate(-50%) scale(.5)}to{top:150px;opacity:1;transform:translate(-50%) scale(1.2)}}@keyframes particleOut{0%{top:150px;opacity:1;transform:translate(-50%) scale(1.2)}to{top:0;opacity:0;transform:translate(-50%) scale(.5)}}.resp-slider-wrap{width:100%;max-width:500px;background:var(--sci-glass-bg);padding:24px;border-radius:16px;border:1px solid var(--border-secondary)}.resp-slider{width:100%;height:6px;background:var(--bg-input);border-radius:3px;outline:none;margin:15px 0;cursor:pointer}.resp-info{background:var(--sci-glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:20px;border-radius:12px;border-left:4px solid var(--sci-hud-accent);color:var(--text-secondary);font-size:14px;line-height:1.7}.resp-btn{font-family:Orbitron,sans-serif;padding:16px 32px;border-radius:12px;border:none;font-weight:800;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff;box-shadow:var(--sci-neon-glow)}@media(max-width:768px){.resp-nav{justify-content:center}.resp-lab{height:350px}.resp-lung{width:80px;height:130px}.resp-slider-wrap{padding:15px}}@media(max-width:480px){.resp-lung{width:60px;height:100px}.resp-particle{font-size:11px}}.circulatory-container{min-height:100vh;background-color:var(--bg-primary, #0f172a);color:var(--text-primary, #f8fafc);font-family:Inter,sans-serif;position:relative;overflow:hidden}.cc-nav{display:flex;justify-content:space-between;padding:20px;position:relative;z-index:10}.cc-board{max-width:900px;margin:0 auto;padding:20px;position:relative;z-index:10}.cc-board-inner{display:grid;grid-template-columns:1fr;gap:20px}@media(min-width:768px){.cc-board-inner{grid-template-columns:1fr 300px}}.cc-visualizer{display:flex;flex-direction:column;padding:20px;background:#0f172a80;min-height:500px}.cc-body-diagram{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:20px 0;position:relative}.cc-organ{background:#0006;border:1px solid #334155;padding:10px 20px;border-radius:20px;text-align:center;font-weight:700;z-index:5;width:200px}.lungs{border-color:#38bdf8;color:#bae6fd}.body-capillaries{border-color:#a855f7;color:#e9d5ff}.minor-text{font-size:10px;font-weight:400;color:#94a3b8;margin-top:5px}.vessel-group{display:flex;justify-content:space-between;width:120px;height:80px;position:relative;z-index:1}.vessel{width:10px;height:100%;border-radius:5px;position:relative;overflow:hidden}.vessel:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%}.vein-pulmonary{background:#dc262633;border:1px solid #dc2626}.vein-pulmonary:after{background:linear-gradient(to bottom,transparent,#ef4444,transparent);animation:flow-down linear infinite}.artery-pulmonary{background:#2563eb33;border:1px solid #2563eb}.artery-pulmonary:after{background:linear-gradient(to top,transparent,#3b82f6,transparent);animation:flow-up linear infinite}.artery-systemic{background:#dc262633;border:1px solid #dc2626}.artery-systemic:after{background:linear-gradient(to bottom,transparent,#ef4444,transparent);animation:flow-down linear infinite}.vein-systemic{background:#2563eb33;border:1px solid #2563eb}.vein-systemic:after{background:linear-gradient(to top,transparent,#3b82f6,transparent);animation:flow-up linear infinite}@keyframes flow-up{0%{transform:translateY(100%)}to{transform:translateY(-100%)}}@keyframes flow-down{0%{transform:translateY(-100%)}to{transform:translateY(100%)}}.heart-wrapper{background:transparent;border:none;display:flex;flex-direction:column;align-items:center;gap:10px}.beating-heart{font-size:60px;animation:heartbeat ease-in-out infinite;filter:drop-shadow(0 0 10px rgba(244,63,94,.5))}@keyframes heartbeat{0%{transform:scale(1)}15%{transform:scale(1.15)}25%{transform:scale(1)}35%{transform:scale(1.15)}to{transform:scale(1)}}.heart-chambers{display:flex;gap:10px}.chamber{font-size:10px;padding:4px 8px;border-radius:4px}.chamber.right{background:#2563eb33;color:#93c5fd;border:1px solid #3b82f6}.chamber.left{background:#dc262633;color:#fca5a5;border:1px solid #ef4444}.cc-controls{padding:20px;display:flex;flex-direction:column;gap:20px}.ekg-readout{text-align:center;background:#00000080;padding:20px;border-radius:8px;border:1px solid #334155;box-shadow:inset 0 0 20px #f43f5e1a}.bpm-large{font-size:48px;font-family:Courier New,Courier,monospace;font-weight:700}.bpm-label{font-size:12px;color:#94a3b8;margin-bottom:10px}.ekg-graph{height:40px;width:100%;border-top:1px solid #334155;border-bottom:1px solid #334155;position:relative;overflow:hidden;background:repeating-linear-gradient(90deg,#1e293b,#1e293b 10px,transparent 10px,transparent 20px)}.ekg-line{position:absolute;top:50%;left:0;width:10px;height:10px;background:#10b981;border-radius:50%;box-shadow:0 0 10px #10b981,-10px 0 10px #10b981;animation:sweep linear infinite}@keyframes sweep{0%{left:0;transform:translateY(-50%)}10%{transform:translateY(-50%) translateY(-15px)}15%{transform:translateY(-50%) translateY(15px)}25%{transform:translateY(-50%)}to{left:100%;transform:translateY(-50%)}}.activity-status{text-align:center;padding:15px;background:#0f172acc;border-radius:8px}.slider-wrapper label{display:block;font-size:14px;color:#f8fafc;margin-bottom:15px;text-align:center}.cc-slider{width:100%;height:8px;border-radius:4px;background:linear-gradient(to right,#3b82f6,#10b981,#f59e0b,#ef4444);outline:none;-webkit-appearance:none}.cc-slider::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background:#fff;border-radius:50%;cursor:pointer;box-shadow:0 0 5px #00000080}.linearmotion-container{min-height:100vh;background-color:var(--bg-primary, #0f172a);color:var(--text-primary, #f8fafc);font-family:Inter,sans-serif;position:relative;overflow:hidden}.lm-nav{display:flex;justify-content:space-between;padding:20px;position:relative;z-index:10}.lm-board{max-width:900px;margin:0 auto;padding:20px;position:relative;z-index:10}.lm-board-inner{display:grid;grid-template-columns:1fr;gap:20px}.lm-panel,.lm-track-panel{padding:20px;display:flex;flex-direction:column}.slider-container label{display:block;margin-bottom:10px;color:var(--text-secondary);font-family:Courier New,Courier,monospace}.sci-slider{width:100%;accent-color:var(--sci-hud-accent)}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:20px 0}.stat-box{background:#0003;padding:15px;border-radius:8px;border:1px solid var(--border-primary);display:flex;flex-direction:column;align-items:center}.stat-label{font-size:12px;color:var(--text-secondary);text-transform:uppercase;margin-bottom:5px;font-family:Courier New,Courier,monospace}.stat-val{font-size:24px;color:var(--sci-hud-accent);font-family:Courier New,Courier,monospace}.formula-box{text-align:center;padding:15px;background:#22c55e1a;border:1px dashed var(--sci-hud-accent);border-radius:8px;font-family:Courier New,Courier,monospace;font-size:18px}.lm-track{height:80px;background:#1e293b;border-radius:40px;position:relative;margin:20px 0;display:flex;align-items:center;border:2px solid #334155;overflow:hidden}.lm-car{position:absolute;font-size:40px;top:50%;transform:translateY(-50%);transition:left .1s linear;z-index:2}.lm-finish-line{position:absolute;right:0;top:0;bottom:0;width:10px;background:repeating-linear-gradient(45deg,#fff,#fff 10px,#000 10px 20px);z-index:1}.controls{display:flex;gap:10px;justify-content:center}.sci-btn-action{padding:12px 24px;border:none;border-radius:8px;font-weight:700;cursor:pointer;transition:all .2s;text-transform:uppercase;letter-spacing:1px}.sci-btn-action:disabled{opacity:.5;cursor:not-allowed}.sci-btn-action:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}@media(min-width:768px){.lm-board-inner{grid-template-columns:300px 1fr}}.newton-container{min-height:100vh;background-color:var(--bg-primary, #0f172a);color:var(--text-primary, #f8fafc);font-family:Inter,sans-serif;position:relative;overflow:hidden}.nw-nav{display:flex;justify-content:space-between;padding:20px;position:relative;z-index:10}.nw-board{max-width:1000px;margin:0 auto;padding:20px;position:relative;z-index:10}.nw-board-inner{display:grid;grid-template-columns:1fr;gap:20px}@media(min-width:900px){.nw-board-inner{grid-template-columns:1fr 350px}}.nw-sim-area{min-height:400px;position:relative;display:flex;flex-direction:column}.nw-world{flex:1;position:relative;overflow:hidden;margin-top:40px}.nw-ground{position:absolute;bottom:0;left:0;right:0;height:20px;background:#334155;border-top:4px solid #475569}.nw-box{position:absolute;background:linear-gradient(135deg,#ef4444,#b91c1c);border:2px solid #7f1d1d;box-shadow:4px 4px 15px #00000080,inset -5px -5px 15px #0000004d;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:width .3s,height .3s;z-index:5}.nw-mass-label{font-family:Courier New,Courier,monospace;font-weight:700;font-size:16px;text-shadow:1px 1px 2px #000}.nw-force-vector{position:absolute;left:-20px;top:50%;transform:translateY(-50%);height:8px;background:#38bdf8;z-index:4;display:flex;align-items:center}.nw-arrow-head{position:absolute;right:-10px;top:-6px;width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:10px solid #38bdf8}.nw-force-label{position:absolute;top:-25px;left:50%;transform:translate(-50%);color:#38bdf8;font-weight:700;font-family:Courier New,Courier,monospace;text-shadow:1px 1px 2px #000}.nw-control-panel{padding:25px;display:flex;flex-direction:column;gap:20px}.control-group{display:flex;flex-direction:column;gap:10px}.control-group label{color:var(--text-secondary);font-size:14px}.val-hi{color:var(--sci-hud-accent);font-weight:700;font-family:Courier New,Courier,monospace}.force-slider{accent-color:#38bdf8}.mass-slider{accent-color:#ef4444}.nw-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.nw-stat-item{background:#0000004d;padding:15px;border-radius:8px;border:1px solid #334155;text-align:center}.stat-title{font-size:12px;color:#94a3b8;margin-bottom:5px}.stat-value{font-size:20px;color:#fff;font-family:Courier New,Courier,monospace}.nw-formula{background:#10b9811a;border:1px dashed #10b981;padding:15px;border-radius:8px;text-align:center;font-family:Courier New,Courier,monospace;font-size:16px;margin-top:10px}.nw-actions{display:flex;gap:10px;margin-top:auto}.btn-push{flex:2;background:#38bdf8!important;color:#000!important}.btn-reset{flex:1;background:transparent!important;border:1px solid #64748b!important;color:#cbd5e1!important}.wave-container{min-height:100vh;background-color:var(--bg-primary, #0f172a);color:var(--text-primary, #f8fafc);font-family:Inter,sans-serif;position:relative;overflow:hidden}.wave-nav{display:flex;justify-content:space-between;padding:20px;position:relative;z-index:10}.wave-board{max-width:900px;margin:0 auto;padding:20px;position:relative;z-index:10}.wave-board-inner{display:grid;grid-template-columns:1fr;gap:20px}@media(min-width:768px){.wave-board-inner{grid-template-columns:1fr 350px}}.wave-display{display:flex;flex-direction:column;padding:20px;min-height:300px;background:#0f172ab3;box-shadow:inset 0 0 50px #00000080}.canvas-wrapper{flex:1;position:relative;width:100%;border-radius:8px;overflow:hidden;background:#000;border:1px solid #334155;box-shadow:0 0 15px #ec48991a}.wave-canvas{position:absolute;top:0;left:0;width:100%;height:100%}.wave-controls{padding:25px;display:flex;flex-direction:column}.wave-slider-wrap{display:flex;flex-direction:column;gap:10px}.wave-slider-wrap label{display:flex;justify-content:space-between;font-size:14px;color:var(--text-secondary);font-family:Courier New,Courier,monospace}.wave-val{color:#ec4899;font-weight:700}.freq-slider{accent-color:#38bdf8}.amp-slider{accent-color:#ec4899}.wave-desc{font-size:12px;color:#94a3b8;font-style:italic;text-align:right}.mt-4{margin-top:20px}.wave-actions{margin-top:auto;display:flex;flex-direction:column;gap:10px;padding-top:20px}.btn-play-sound{padding:15px;border:none;border-radius:8px;font-weight:700;cursor:pointer;transition:all .3s;background:#1e293b;color:#f8fafc;border:2px solid #334155;letter-spacing:1px}.btn-play-sound:hover{background:#334155}.btn-play-sound.playing{background:#ec4899;border-color:#be185d;color:#fff;box-shadow:0 0 15px #ec489980;animation:pulse-pink 2s infinite}@keyframes pulse-pink{0%{box-shadow:0 0 #ec489966}70%{box-shadow:0 0 0 10px #ec489900}to{box-shadow:0 0 #ec489900}}.playing-indicator{font-size:12px;color:#38bdf8;text-align:center;animation:blink 1.5s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.5}}.acidbase-container{min-height:100vh;background-color:var(--bg-primary, #0f172a);color:var(--text-primary, #f8fafc);font-family:Inter,sans-serif;position:relative;overflow:hidden}.ab-nav{display:flex;justify-content:space-between;padding:20px;position:relative;z-index:10}.ab-board{max-width:900px;margin:0 auto;padding:20px;position:relative;z-index:10}.ab-board-inner{display:grid;grid-template-columns:1fr;gap:20px}@media(min-width:768px){.ab-board-inner{grid-template-columns:350px 1fr}}.ab-inventory,.ab-test-area{padding:20px;display:flex;flex-direction:column}.ab-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;overflow-y:auto;max-height:400px}.ab-item-btn{background:#0f172a99;border:1px solid #334155;padding:10px;border-radius:8px;color:#cbd5e1;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;transition:all .2s}.ab-item-btn:hover:not(:disabled){background:#a855f71a;border-color:#a855f7}.ab-item-btn.active{background:#a855f733;border-color:#a855f7;color:#fff;box-shadow:inset 0 0 10px #a855f74d}.ab-item-btn:disabled{opacity:.5;cursor:not-allowed}.ab-item-icon{font-size:24px}.ab-item-name{font-size:12px;text-align:center}.ab-flask-wrapper{position:relative;height:250px;display:flex;justify-content:center;align-items:flex-end;margin:20px 0}.ab-flask{display:flex;flex-direction:column;align-items:center}.ab-flask-neck{width:40px;height:60px;border-left:2px solid rgba(255,255,255,.3);border-right:2px solid rgba(255,255,255,.3);background:#ffffff0d;border-top-left-radius:5px;border-top-right-radius:5px;position:relative;z-index:2}.ab-flask-bowl{width:150px;height:150px;border:2px solid rgba(255,255,255,.3);border-radius:50%;background:#ffffff0d;position:relative;overflow:hidden;margin-top:-5px;z-index:1;box-shadow:inset -10px -10px 20px #00000080,inset 10px 10px 20px #ffffff1a}.ab-liquid-fill{position:absolute;bottom:0;left:0;width:100%;border-top:1px solid rgba(255,255,255,.5)}.shaking{animation:shake .5s infinite}@keyframes shake{0%{transform:translate(1px,1px) rotate(0)}10%{transform:translate(-1px,-2px) rotate(-1deg)}20%{transform:translate(-3px) rotate(1deg)}30%{transform:translate(3px,2px) rotate(0)}40%{transform:translate(1px,-1px) rotate(1deg)}50%{transform:translate(-1px,2px) rotate(-1deg)}60%{transform:translate(-3px,1px) rotate(0)}70%{transform:translate(3px,1px) rotate(-1deg)}80%{transform:translate(-1px,-1px) rotate(1deg)}90%{transform:translate(1px,2px) rotate(0)}to{transform:translate(1px,-2px) rotate(-1deg)}}.ab-dropper{position:absolute;top:-30px;left:50%;transform:translate(-50%);width:10px;height:40px;background:#cbd5e1;border-radius:5px;z-index:3}.ab-dropper:after{content:"";position:absolute;top:-20px;left:-5px;width:20px;height:25px;background:#a855f7;border-radius:10px 10px 0 0;animation:squeeze 1.5s ease-in-out}.ab-drop{position:absolute;bottom:-15px;left:1px;width:8px;height:12px;background:#a855f7;border-radius:0 50% 50%;transform:rotate(45deg);animation:drip 1.5s ease-in;opacity:0}@keyframes squeeze{0%,to{transform:scaleY(1)}50%{transform:scaleY(.8)}}@keyframes drip{0%{transform:rotate(45deg) translate(0);opacity:0}10%{opacity:1}80%{transform:rotate(45deg) translate(100px,100px);opacity:1}to{opacity:0}}.bubbles{position:absolute;bottom:0;left:0;width:100%;height:100%;background-image:radial-gradient(rgba(255,255,255,.4) 20%,transparent 20%);background-size:20px 20px;animation:bubble-rise 1s linear infinite}@keyframes bubble-rise{0%{transform:translateY(0)}to{transform:translateY(-20px)}}.ab-readout{text-align:center;min-height:80px}.ab-scale{margin-top:20px}.scale-bar{height:15px;border-radius:10px;background:linear-gradient(to right,#dc2626,#ea580c,#eab308,#22c55e,#3b82f6,#4c1d95);border:1px solid rgba(255,255,255,.2)}.scale-labels{display:flex;justify-content:space-between;margin-top:5px;font-size:10px;color:#94a3b8;font-family:Courier New,Courier,monospace}.archimedes-container{min-height:100vh;background:radial-gradient(circle at center,#0b1120,#030712);color:#fff;font-family:Outfit,sans-serif;overflow-x:hidden;position:relative}.sci-scanner-overlay{position:fixed;inset:0;background:linear-gradient(rgba(14,165,233,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(14,165,233,.03) 1px,transparent 1px);background-size:30px 30px;pointer-events:none;z-index:1}.sci-scanline{width:100%;height:2px;background:#0ea5e926;box-shadow:0 0 10px #0ea5e980;position:absolute;animation:scanline 8s linear infinite}.arch-nav{display:flex;gap:15px;padding:20px;position:relative;z-index:10;max-width:1200px;margin:0 auto}.arch-board{max-width:1200px;margin:0 auto;padding:0 20px 40px;position:relative;z-index:10}.arch-board-inner{display:grid;grid-template-columns:1fr 350px;gap:20px;margin-top:20px}.arch-sim-area{min-height:500px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;position:relative;overflow:hidden;background:radial-gradient(circle at top,rgba(14,165,233,.1) 0%,transparent 70%)}.arch-tank{width:300px;height:350px;border:4px solid rgba(255,255,255,.1);border-top:none;border-radius:0 0 20px 20px;position:relative;overflow:hidden;box-shadow:0 20px 30px #00000080}.arch-water{position:absolute;bottom:0;left:0;right:0;height:75%;background:linear-gradient(180deg,#38bdf866,#0284c799);border-top:2px solid rgba(56,189,248,.8);transition:all .5s ease}.water-waves{position:absolute;top:-10px;left:0;right:0;height:10px;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="rgba(56,189,248,0.4)" fill-opacity="1" d="M0,160L48,165.3C96,171,192,181,288,165.3C384,149,480,107,576,96C672,85,768,107,864,122.7C960,139,1056,149,1152,149.3C1248,149,1344,139,1392,133.3L1440,128L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>') repeat-x;background-size:200px 10px;animation:waveAnim 3s linear infinite}.arch-block{width:80px;height:80px;position:absolute;left:50%;transform:translate(-50%);border-radius:8px;display:flex;align-items:center;justify-content:center;font-family:Orbitron,sans-serif;font-weight:700;font-size:14px;transition:bottom 1s cubic-bezier(.34,1.56,.64,1);box-shadow:inset 0 0 10px #fff3,0 5px 15px #0000004d;z-index:5}.arch-block-forces{position:absolute;width:100%;height:100%;pointer-events:none}.force-arrow{position:absolute;left:50%;transform:translate(-50%);width:4px;border-radius:2px;display:flex;align-items:center;justify-content:center}.arrow-up{bottom:100%;background:#10b981;box-shadow:0 0 8px #10b981}.arrow-up:before{content:"";position:absolute;top:-6px;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:8px solid #10b981}.arrow-label-up{position:absolute;top:-25px;color:#10b981;font-size:11px;white-space:nowrap}.arrow-down{top:100%;background:#ef4444;box-shadow:0 0 8px #ef4444}.arrow-down:after{content:"";position:absolute;bottom:-6px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid #ef4444}.arrow-label-down{position:absolute;bottom:-25px;color:#ef4444;font-size:11px;white-space:nowrap}.arch-control-panel{display:flex;flex-direction:column;gap:25px}.material-selector{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mat-btn{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);padding:12px 5px;border-radius:8px;color:#94a3b8;cursor:pointer;transition:all .2s;font-size:13px;font-weight:600}.mat-btn:hover{background:#ffffff1a;color:#fff}.mat-btn.active{background:#0ea5e933;border-color:#0ea5e9;color:#0ea5e9;box-shadow:0 0 15px #0ea5e94d}.liquid-selector{display:flex;background:#0000004d;border-radius:8px;padding:5px}.liq-btn{flex:1;background:transparent;border:none;padding:10px;color:#94a3b8;cursor:pointer;border-radius:6px;transition:all .2s;font-size:13px}.liq-btn.active{background:#38bdf8;color:#000;font-weight:700}.arch-stats{background:#0006;border-radius:10px;padding:15px;display:grid;grid-template-columns:1fr 1fr;gap:15px;border:1px solid rgba(255,255,255,.05)}.arch-stat-box .title{color:#94a3b8;font-size:11px;text-transform:uppercase;letter-spacing:1px}.arch-stat-box .val{font-family:Orbitron,monospace;font-size:16px;color:#fff;margin-top:5px}.arch-formula{background:#10b9811a;border:1px dashed rgba(16,185,129,.5);padding:15px;border-radius:8px;font-family:monospace;font-size:14px;color:#34d399;text-align:center}.state-indicator{padding:15px;border-radius:8px;text-align:center;font-weight:700;letter-spacing:1px;text-transform:uppercase}.state-apung{background:#38bdf833;color:#38bdf8;border:1px solid #38bdf8}.state-melayang{background:#facc1533;color:#facc15;border:1px solid #facc15}.state-tenggelam{background:#ef444433;color:#ef4444;border:1px solid #ef4444}@keyframes waveAnim{0%{background-position-x:0}to{background-position-x:200px}}@media(max-width:900px){.arch-board-inner{grid-template-columns:1fr}}.optics-container{min-height:100vh;background:radial-gradient(circle at center,#0b1120,#030712);color:#fff;font-family:Outfit,sans-serif;overflow-x:hidden;position:relative}.optics-nav{display:flex;gap:15px;padding:20px;position:relative;z-index:10;max-width:1200px;margin:0 auto}.optics-board{max-width:1200px;margin:0 auto;padding:0 20px 40px;position:relative;z-index:10}.optics-board-inner{display:grid;grid-template-columns:1fr 350px;gap:20px;margin-top:20px}.optics-sim-area{min-height:500px;display:flex;flex-direction:column;position:relative;background:#0006;overflow:hidden}.optics-viewport{width:100%;height:400px;position:relative;margin-top:50px;border:1px dashed rgba(255,255,255,.1)}.optic-axis{position:absolute;top:50%;left:0;right:0;height:2px;background:#ffffff4d;z-index:1}.optic-lens-container{position:absolute;top:0;bottom:0;left:50%;width:20px;transform:translate(-50%);z-index:10;display:flex;justify-content:center}.optic-vertical-line{position:absolute;top:10%;bottom:10%;width:2px;background:#ffffff80;z-index:9}.optic-lens{position:absolute;top:15%;bottom:15%;width:40px;transition:all .3s}.lens-cembung{background:#0ea5e94d;border:2px solid rgba(14,165,233,.8);border-radius:50%;box-shadow:0 0 20px #0ea5e966}.lens-cekung{background:transparent;border-left:4px solid rgba(236,72,153,.8);border-right:4px solid rgba(236,72,153,.8);border-radius:50%/10%;width:20px;box-shadow:-10px 0 20px #ec489933,10px 0 20px #ec489933}.optic-focal-point{position:absolute;top:50%;transform:translate(-50%,-50%);width:10px;height:10px;border-radius:50%;background:#facc15;box-shadow:0 0 10px #facc15;z-index:5}.focal-label{position:absolute;top:15px;left:50%;transform:translate(-50%);font-family:Orbitron,monospace;font-size:12px;color:#facc15}.optic-object,.optic-image{position:absolute;width:20px;background-size:contain;background-repeat:no-repeat;z-index:15;transition:all .2s ease-out}.optic-object{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2322c55e"><path d="M12 2L22 20H2L12 2Z"/></svg>')}.optic-image{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23ef4444"><path d="M12 2L22 20H2L12 2Z"/></svg>');opacity:.8}.optic-ray-svg{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:2}.ray-real{stroke:#facc15cc;stroke-width:2;filter:drop-shadow(0 0 3px rgba(250,204,21,.8))}.ray-virtual{stroke:#facc1566;stroke-width:2;stroke-dasharray:5,5}.optics-slider-group{margin-bottom:20px}.optics-slider-group label{display:flex;justify-content:space-between;font-size:13px;color:#94a3b8;margin-bottom:8px}.optics-slider-group .val-hi{color:#fff;font-family:Orbitron,monospace}.optics-stats{background:#0006;padding:15px;border-radius:8px;border:1px solid rgba(255,255,255,.05)}.optics-stat-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed rgba(255,255,255,.1);font-size:14px}.optics-stat-row:last-child{border-bottom:none}.lens-type-btn{flex:1;padding:12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#fff;cursor:pointer;transition:all .2s;border-radius:8px}.lens-type-btn.active.cembung{background:#0ea5e933;border-color:#0ea5e9;box-shadow:0 0 15px #0ea5e94d}.lens-type-btn.active.cekung{background:#ec489933;border-color:#ec4899;box-shadow:0 0 15px #ec48994d}@media(max-width:900px){.optics-board-inner{grid-template-columns:1fr}}.ohm-container{min-height:100vh;background:radial-gradient(circle at center,#020617,#000);color:#fff;font-family:Outfit,sans-serif;overflow-x:hidden;position:relative}.ohm-nav{display:flex;gap:15px;padding:20px;position:relative;z-index:10;max-width:1200px;margin:0 auto}.ohm-board{max-width:1200px;margin:0 auto;padding:0 20px 40px;position:relative;z-index:10}.ohm-board-inner{display:grid;grid-template-columns:1fr 380px;gap:20px;margin-top:20px}.ohm-sim-area{min-height:500px;display:flex;align-items:center;justify-content:center;position:relative;background:#0006;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:20px 20px}.circuit-canvas{width:500px;height:350px;position:relative;border:4px solid #334155;border-radius:20px;background:#0f172a;box-shadow:inset 0 0 50px #000c,0 10px 30px #00000080}.wire{position:absolute;background:#cbd5e1;box-shadow:0 0 5px #ffffff80}.wire-top{top:50px;left:50px;right:50px;height:6px}.wire-bottom{bottom:50px;left:50px;right:50px;height:6px}.wire-left{top:50px;bottom:50px;left:50px;width:6px}.wire-right{top:50px;bottom:50px;right:50px;width:6px}.battery{position:absolute;left:40px;top:50%;transform:translateY(-50%);width:26px;height:80px;background:#1e293b;display:flex;flex-direction:column;justify-content:center;align-items:center}.bat-pos{width:26px;height:60px;background:#ef4444;border-radius:4px}.bat-neg{width:26px;height:20px;background:#000;border-radius:4px;border-top:2px solid #ef4444}.bat-label{position:absolute;left:-50px;font-family:Orbitron,monospace;color:#ef4444;font-size:16px;text-shadow:0 0 5px #ef4444}.resistor-bulb{position:absolute;right:25px;top:50%;transform:translateY(-50%);width:80px;height:90px;display:flex;flex-direction:column;align-items:center;justify-content:center}.bulb-glass{width:60px;height:60px;border-radius:50%;border:2px solid rgba(255,255,255,.2);background:#ffffff0d;position:relative;display:flex;justify-content:center;align-items:flex-end;transition:all .2s}.filament{width:20px;height:30px;border:2px solid #64748b;border-bottom:none;border-radius:10px 10px 0 0;margin-bottom:5px;transition:all .2s}.bulb-base{width:30px;height:20px;background:#94a3b8;border-radius:0 0 5px 5px;margin-top:-2px;z-index:2}.res-label{position:absolute;right:-55px;font-family:Orbitron,monospace;color:#38bdf8;font-size:16px;white-space:nowrap}.electron-flow{position:absolute;inset:0;pointer-events:none}.electron{position:absolute;width:8px;height:8px;background:#facc15;border-radius:50%;box-shadow:0 0 10px #facc15,0 0 20px #facc15}@keyframes flowTop{0%{left:50px}to{left:450px}}@keyframes flowRight{0%{top:50px}to{top:300px}}@keyframes flowBottom{0%{left:450px}to{left:50px}}@keyframes flowLeft{0%{top:300px}to{top:50px}}.e-top{top:49px;animation:flowTop linear infinite}.e-right{right:49px;animation:flowRight linear infinite}.e-bottom{bottom:49px;animation:flowBottom linear infinite}.e-left{left:49px;animation:flowLeft linear infinite}.ohm-controls{display:flex;flex-direction:column;gap:20px}.ohm-formula-display{display:flex;align-items:center;justify-content:center;gap:15px;font-family:Orbitron,monospace;font-size:28px;background:#00000080;padding:20px;border-radius:12px;border:1px solid rgba(255,255,255,.1);margin-bottom:20px}.f-var{display:flex;flex-direction:column;align-items:center}.f-var span.f-lbl{font-size:11px;color:#94a3b8;font-family:Outfit,sans-serif;letter-spacing:1px}.f-v{color:#ef4444}.f-i{color:#facc15;font-size:34px;font-weight:700;text-shadow:0 0 15px rgba(250,204,21,.5)}.f-r{color:#38bdf8}.ohm-slider-wrap{background:#ffffff08;padding:15px;border-radius:8px;border:1px solid rgba(255,255,255,.05)}.ohm-slider-wrap label{display:flex;justify-content:space-between;margin-bottom:15px;font-size:14px}@media(max-width:900px){.ohm-board-inner{grid-template-columns:1fr}.circuit-canvas{transform:scale(.7)}}.excretory-container{min-height:100vh;background:radial-gradient(circle at center,#1f0d15,#000);color:#fff;font-family:Outfit,sans-serif;overflow-x:hidden;position:relative}.exc-nav{display:flex;gap:15px;padding:20px;position:relative;z-index:10;max-width:1200px;margin:0 auto}.exc-board{max-width:1200px;margin:0 auto;padding:0 20px 40px;position:relative;z-index:10}.exc-board-inner{display:grid;grid-template-columns:1fr 380px;gap:20px;margin-top:20px}.exc-sim-area{min-height:500px;display:flex;align-items:center;justify-content:center;position:relative;background:#0006;overflow:hidden;border-radius:12px}.kidney-system{position:relative;width:400px;height:400px}.kidney-organ{position:absolute;top:50px;left:150px;width:100px;height:150px;background:#9f1239;border-radius:50px 30px 40px 50px;box-shadow:inset -10px -10px 30px #00000080,0 0 20px #9f123966;transform:rotate(15deg);z-index:3}.kidney-indent{position:absolute;top:60px;left:70px;width:50px;height:40px;background:#1f0d15;border-radius:50%;box-shadow:inset 5px 0 10px #000c}.renal-artery{position:absolute;top:80px;left:0;width:220px;height:15px;background:#ef4444;border-radius:8px;z-index:2;box-shadow:inset 0 -3px 5px #00000080}.renal-vein{position:absolute;top:110px;left:0;width:220px;height:15px;background:#3b82f6;border-radius:8px;z-index:1;box-shadow:inset 0 -3px 5px #00000080}.ureter{position:absolute;top:130px;left:190px;width:12px;height:150px;background:#fde047;border-radius:6px;z-index:2;box-shadow:inset 0 -2px 5px #0000004d;transform:rotate(10deg);overflow:hidden}.bladder{position:absolute;top:270px;left:155px;width:80px;height:80px;background:#fef08a33;border:3px solid #fde047;border-radius:40px 40px 20px 20px;z-index:3;overflow:hidden;box-shadow:0 0 15px #fde04733}.bladder-fluid{position:absolute;bottom:0;left:0;right:0;background:#facc15;transition:all 1s ease}.urine-drop{position:absolute;width:6px;height:10px;background:#facc15;border-radius:50%;left:3px;animation:dropDown 1s linear infinite}@keyframes dropDown{0%{top:0;opacity:1}to{top:150px;opacity:0}}.blood-particle{position:absolute;width:5px;height:5px;background:#fff;border-radius:50%;animation:flowRight 2s linear infinite}@keyframes flowRight{0%{left:0;opacity:0}10%{opacity:1}90%{opacity:1}to{left:200px;opacity:0}}.lifestyle-card{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:15px;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:15px}.lifestyle-card:hover{background:#ffffff14;transform:translateY(-2px)}.lifestyle-card.active{background:#f43f5e26;border-color:#f43f5e;box-shadow:0 0 20px #f43f5e33}.lifestyle-icon{font-size:32px}.lifestyle-info h4{margin:0 0 5px;color:#fff}.lifestyle-info p{margin:0;font-size:12px;color:#94a3b8}.exc-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.exc-stat{background:#0000004d;padding:10px;border-radius:8px;border:1px solid rgba(255,255,255,.05);text-align:center}.exc-stat .lbl{font-size:11px;color:#94a3b8;margin-bottom:5px}.exc-stat .val{font-family:Orbitron,monospace;font-size:16px;color:#fff}@media(max-width:900px){.exc-board-inner{grid-template-columns:1fr}}.biotech-container{min-height:100vh;background:radial-gradient(circle at center,#064e3b,#022c22);color:#fff;font-family:Outfit,sans-serif;overflow-x:hidden;position:relative}.bio-nav{display:flex;gap:15px;padding:20px;position:relative;z-index:10;max-width:1200px;margin:0 auto}.bio-board{max-width:1200px;margin:0 auto;padding:0 20px 40px;position:relative;z-index:10}.bio-board-inner{display:grid;grid-template-columns:1fr 380px;gap:20px;margin-top:20px}.bio-sim-area{min-height:500px;display:flex;align-items:center;justify-content:center;position:relative;background:#0006;overflow:hidden;border-radius:12px}.bio-reactor{position:relative;width:250px;height:400px}.flask-glass{position:absolute;bottom:20px;left:50%;transform:translate(-50%);width:200px;height:250px;background:#ffffff0d;border:4px solid rgba(255,255,255,.2);border-radius:50% 50% 10px 10px/60% 60% 10px 10px;box-shadow:inset 0 0 30px #ffffff1a,0 10px 20px #00000080;overflow:hidden;z-index:2}.flask-neck{position:absolute;bottom:260px;left:50%;transform:translate(-50%);width:60px;height:120px;background:#ffffff0d;border-left:4px solid rgba(255,255,255,.2);border-right:4px solid rgba(255,255,255,.2);z-index:1}.flask-lid{position:absolute;top:-15px;left:-5px;right:-5px;height:20px;background:#334155;border-radius:5px}.bio-mixture{position:absolute;bottom:0;left:0;right:0;height:60%;background:linear-gradient(180deg,#fde68ab3,#d97706cc);border-top:2px solid rgba(253,230,138,.9);transition:all .5s ease}.heat-source{position:absolute;bottom:-20px;left:50%;transform:translate(-50%);width:150px;height:20px;background:#1e293b;border-radius:10px;box-shadow:0 -5px 20px #ef444400;transition:box-shadow .5s}.heat-source.hot{box-shadow:0 -15px 30px #ef444499}.heat-source.cold{box-shadow:0 -15px 30px #38bdf899}.bubble{position:absolute;bottom:10px;background:#fff9;border-radius:50%;animation:riseUp linear infinite}@keyframes riseUp{0%{transform:translateY(0) scale(.5);opacity:0}20%{opacity:1}to{transform:translateY(-200px) scale(1.5);opacity:0}}.microbe{position:absolute;width:10px;height:10px;border-radius:50%;background:#a3e635;box-shadow:0 0 5px #a3e635;animation:jiggle 2s infinite;opacity:.8}.microbe.dead{background:#64748b;box-shadow:none;animation:none;bottom:5px!important}@keyframes jiggle{0%,to{transform:translate(0)}25%{transform:translate(2px,-2px)}50%{transform:translate(-2px,2px)}75%{transform:translate(-2px,-2px)}}.bio-controls{display:flex;flex-direction:column;gap:25px}.temp-selector{display:flex;gap:10px}.tmp-btn{flex:1;padding:12px 5px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#94a3b8;cursor:pointer;transition:all .2s;font-size:13px;font-weight:600;display:flex;flex-direction:column;align-items:center;gap:5px}.tmp-btn .icon{font-size:20px}.tmp-btn:hover{background:#ffffff1a}.tmp-btn.active.cold{background:#38bdf833;border-color:#38bdf8;color:#38bdf8;box-shadow:0 0 15px #38bdf84d}.tmp-btn.active.warm{background:#10b98133;border-color:#10b981;color:#10b981;box-shadow:0 0 15px #10b9814d}.tmp-btn.active.hot{background:#ef444433;border-color:#ef4444;color:#ef4444;box-shadow:0 0 15px #ef44444d}.microbe-slider-wrap{background:#ffffff08;padding:15px;border-radius:8px;border:1px solid rgba(255,255,255,.05)}.microbe-slider-wrap label{display:flex;justify-content:space-between;margin-bottom:15px;font-size:14px}.bio-card-stat{background:#0000004d;border:1px solid rgba(255,255,255,.05);padding:15px;border-radius:8px;display:flex;justify-content:space-between;align-items:center}.bio-card-row{display:flex;flex-direction:column}.bio-card-row .lbl{font-size:11px;color:#94a3b8;margin-bottom:5px;text-transform:uppercase}.bio-card-row .val{font-family:Orbitron,monospace;font-size:18px;font-weight:700}@media(max-width:900px){.bio-board-inner{grid-template-columns:1fr}}.heat-container{display:flex;flex-direction:column;min-height:100vh;background-color:var(--bg-primary, #0f172a);color:#fff;font-family:Inter,system-ui,sans-serif;overflow-x:hidden;position:relative}.heat-container:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(239,68,68,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(239,68,68,.03) 1px,transparent 1px);background-size:30px 30px;z-index:0;pointer-events:none}.heat-nav{display:flex;align-items:center;gap:15px;padding:20px 40px;background:#0f172acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(239,68,68,.2);position:relative;z-index:20}.heat-board{flex:1;display:flex;padding:40px;justify-content:center;align-items:flex-start;position:relative;z-index:10}.heat-board-inner{display:grid;grid-template-columns:2fr 1fr;gap:30px;width:100%;max-width:1200px;animation:fadeIn .8s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:900px){.heat-board-inner{grid-template-columns:1fr}}.heat-display{padding:30px;min-height:500px;position:relative;display:flex;flex-direction:column}.experiment-stage{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;padding-bottom:50px;margin-top:20px;border-bottom:2px solid #334155}.bunsen-burner-wrapper{position:absolute;bottom:0;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;z-index:5}.flame-container{width:50px;height:80px;position:relative;display:flex;justify-content:center;align-items:flex-end;opacity:0;transition:opacity .3s ease-in-out}.flame-container.active{opacity:1}.flame-outer{position:absolute;bottom:0;width:36px;height:65px;background:radial-gradient(ellipse at bottom,#38bdf8,#0284c7 40%,#0284c700 70%);border-radius:50% 50% 20% 20%;animation:flickerBase .1s infinite alternate;filter:blur(2px)}.flame-inner{position:absolute;bottom:0;width:18px;height:35px;background:radial-gradient(ellipse at bottom,#bae6fd,#38bdf8 60%,#38bdf800);border-radius:50% 50% 20% 20%;animation:flickerCore .15s infinite alternate}.burner-nozzle{width:16px;height:40px;background:linear-gradient(90deg,#64748b,#94a3b8,#475569);border-radius:2px}.burner-base{width:60px;height:15px;background:#334155;border-radius:8px 8px 0 0}@keyframes flickerBase{0%{transform:scaleX(.95) scaleY(1.05) translateY(-1px)}to{transform:scaleX(1.1) scaleY(.95) translateY(1px)}}@keyframes flickerCore{0%{transform:scaleX(.9) scaleY(1.1) translateY(1px)}to{transform:scaleX(1.1) scaleY(.9) translateY(-1px)}}.material-rods{position:absolute;bottom:120px;width:100%;aspect-ratio:4/1;display:flex;justify-content:center;align-items:center}.rod-unit{position:absolute;width:80%;height:40px;border-radius:20px;display:flex;align-items:center;overflow:hidden;box-shadow:0 10px 20px #00000080,inset 0 2px 10px #fff3;transition:all .5s ease;opacity:0;transform:scaleY(0) translateY(20px);pointer-events:none}.rod-unit.visible{opacity:1;transform:scaleY(1) translateY(0)}.rod-tembaga{background:linear-gradient(180deg,#b45309,#d97706,#78350f)}.rod-kaca{background:linear-gradient(180deg,#e0f2fe66,#fff9,#bae6fd80);border:1px solid rgba(255,255,255,.8);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.rod-kayu{background:repeating-linear-gradient(90deg,#78350f,#78350f 15px,#92400e 15px 30px)}.heat-spread{position:absolute;inset:0;background:radial-gradient(circle at center,#ef4444 0%,transparent 60%);mix-blend-mode:screen;transform-origin:center;opacity:.8;transition:transform .1s linear}.rod-tembaga .heat-spread{mix-blend-mode:color-dodge}.rod-kaca .heat-spread{mix-blend-mode:multiply;background:radial-gradient(circle at center,#fca5a5 0%,transparent 70%)}.rod-kayu .heat-spread{mix-blend-mode:overlay;background:radial-gradient(circle at center,#fb923c 0%,transparent 50%)}.particle-field{position:absolute;inset:0;display:flex;justify-content:space-around;align-items:center;padding:0 5%}.particle{width:8px;height:8px;background:#fffc;border-radius:50%;box-shadow:0 0 4px #fffc}.rod-kaca .particle{background:#38bdf899}.thermometer-display{position:absolute;right:20px;top:20px;display:flex;align-items:flex-start;gap:15px}.thermometer-glass{width:14px;height:250px;background:#0f172a99;border:2px solid #64748b;border-radius:10px;padding:2px;display:flex;flex-direction:column;justify-content:flex-end;position:relative}.thermometer-bulb{position:absolute;bottom:-15px;left:-9px;width:28px;height:28px;background:#ef4444;border-radius:50%;box-shadow:inset -3px -3px 8px #0006}.thermometer-liquid{width:100%;background:linear-gradient(to top,#ef4444,#f87171);border-radius:4px;transition:height .2s linear}.thermometer-notches{position:absolute;left:-20px;top:0;bottom:10px;display:flex;flex-direction:column;justify-content:space-between;font-size:10px;color:#94a3b8;font-family:monospace}.readout-panel{background:#0f172ae6;border:1px solid #ef4444;padding:15px;border-radius:8px;min-width:120px;box-shadow:0 0 15px #ef444433}.readout-temp{font-size:32px;font-family:Courier New,Courier,monospace;font-weight:700;color:#ef4444;margin:5px 0}.readout-label{font-size:12px;color:#94a3b8;letter-spacing:1px}.readout-status.safe{color:#4ade80}.readout-status.warning{color:#facc15;animation:pulse 1s infinite}.readout-status.danger{color:#ef4444;animation:flash .5s infinite;font-weight:700}@keyframes flash{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.heat-controls{background:#1e293b80;border:1px solid #ef4444;border-radius:16px;padding:30px;display:flex;flex-direction:column;gap:25px}.material-selector{display:grid;grid-template-columns:1fr;gap:12px}.mat-btn{background:#1e293b;border:1px solid #334155;padding:15px;border-radius:8px;color:#cbd5e1;text-align:left;cursor:pointer;transition:all .2s;display:flex;justify-content:space-between;align-items:center}.mat-btn:hover:not(.active){background:#334155}.mat-btn.active{background:#ef44441a;border-color:#ef4444;color:#fff;box-shadow:0 0 10px #ef444433}.mat-btn-k{font-family:monospace;color:#94a3b8;font-size:12px}.mat-btn.active .mat-btn-k{color:#fca5a5}.ignite-btn{background:linear-gradient(135deg,#ef4444,#b91c1c);color:#fff;border:none;padding:20px;font-size:18px;font-weight:700;border-radius:12px;cursor:pointer;text-transform:uppercase;letter-spacing:2px;box-shadow:0 8px 25px #ef444466;transition:all .2s;-webkit-user-select:none;user-select:none}.ignite-btn:active{transform:scale(.98);box-shadow:0 4px 15px #ef444466}.ignite-btn.heating{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 0 30px #f59e0b80}.cooldown-btn{background:transparent;border:1px solid #38bdf8;color:#38bdf8;padding:12px;border-radius:8px;cursor:pointer;transition:all .2s;font-weight:600}.cooldown-btn:hover{background:#38bdf81a}.sci-lever-container{min-height:100vh;background:radial-gradient(circle at top right,#0f172a,#020617);color:#fff;padding:20px;font-family:Outfit,sans-serif}.sci-lever-layout{display:grid;grid-template-columns:1fr 400px;gap:30px;max-width:1500px;margin:0 auto}.sci-lever-main{background:#0f172a99;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:40px;padding:40px;display:flex;flex-direction:column;gap:30px;position:relative;overflow:hidden}.sci-lever-main:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(56,189,248,.5),transparent)}.simulation-area{background:#0006;height:500px;border-radius:32px;border:1px dashed rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;position:relative;padding-bottom:60px}.lever-system{position:relative;width:800px;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.plank-container{width:100%;position:relative;z-index:2;margin-top:-60px}.plank{width:100%;height:16px;background:linear-gradient(180deg,#475569,#1e293b);border-radius:8px;border:1px solid rgba(255,255,255,.2);display:flex;justify-content:space-between;padding:0 20px;transition:transform 1.2s cubic-bezier(.34,1.56,.64,1);transform-origin:center center;box-shadow:0 10px 25px #0009}.pivot-point{width:14px;height:14px;background:#00f2ff;border-radius:50%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 20px #00f2ffcc;z-index:10}.slot{width:50px;height:140px;position:relative;top:-140px;display:flex;flex-direction:column-reverse;align-items:center;gap:2px}.slot:hover:after{content:"";position:absolute;inset:10px 0 0;background:#ffffff08;border:1px dashed rgba(255,255,255,.2);border-radius:8px}.slot-marker{position:absolute;bottom:-35px;font-size:11px;color:#475569;font-weight:800;font-family:JetBrains Mono,monospace}.weight-box{width:44px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-weight:900;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3);font-size:12px;box-shadow:0 4px 6px #0000004d,inset 0 2px #fff3;animation:dropIn .4s cubic-bezier(.175,.885,.32,1.275);border:1px solid rgba(0,0,0,.2)}@keyframes dropIn{0%{transform:translateY(-50px) scale(1.1);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.w-5{height:30px;background:linear-gradient(135deg,#10b981,#065f46)}.w-10{height:45px;background:linear-gradient(135deg,#3b82f6,#1e40af)}.w-20{height:65px;background:linear-gradient(135deg,#f59e0b,#9a3412)}.w-50{height:95px;background:linear-gradient(135deg,#ef4444,#991b1b)}.fulcrum-base{width:80px;height:0;border-left:40px solid transparent;border-right:40px solid transparent;border-bottom:70px solid #334155;position:absolute;bottom:-70px;z-index:1;filter:drop-shadow(0 5px 15px rgba(0,0,0,.5))}.fulcrum-base:after{content:"";position:absolute;bottom:-70px;left:-40px;width:80px;height:10px;background:#1e293b;border-radius:10px}.controls-panel{display:flex;justify-content:space-between;align-items:center;background:#ffffff08;padding:24px;border-radius:24px;border:1px solid rgba(255,255,255,.05)}.weight-selector label{display:block;font-size:12px;font-weight:800;color:#64748b;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}.weight-options{display:flex;gap:12px}.weight-btn{padding:14px 24px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#ffffff05;color:#cbd5e1;cursor:pointer;font-weight:800;transition:all .3s}.weight-btn:hover{border-color:#3b82f6;color:#fff}.weight-btn.active{background:#3b82f6;border-color:#60a5fa;color:#fff;box-shadow:0 8px 20px #3b82f64d}.sci-lever-sidebar{display:flex;flex-direction:column;gap:20px}.stats-card{background:#0f172acc;border:1px solid rgba(255,255,255,.1);border-radius:32px;padding:24px}.stats-card h3{margin:0 0 20px;font-size:1.2rem;font-weight:800}.moment-display{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:15px;background:#020617;padding:20px;border-radius:20px;margin-bottom:20px;border:1px solid rgba(255,255,255,.05)}.moment-box{text-align:center}.moment-box.left .moment-val{color:#10b981}.moment-box.right .moment-val{color:#f59e0b}.side-label{display:block;font-size:10px;font-weight:800;opacity:.5;margin-bottom:4px}.moment-val{font-size:1.8rem;font-weight:900;font-family:JetBrains Mono,monospace}.moment-vs{font-weight:900;color:#475569;font-size:.9rem}.status-banner{padding:16px;border-radius:16px;background:#ef44441a;border:1px solid rgba(239,68,68,.2);color:#ef4444;text-align:center;font-weight:900;font-size:.9rem;letter-spacing:.5px}.status-banner.balanced{background:#10b9811a;border-color:#10b9814d;color:#10b981;animation:pulseGlow 2s infinite}@keyframes pulseGlow{0%{box-shadow:0 0 #10b98166}70%{box-shadow:0 0 0 10px #10b98100}to{box-shadow:0 0 #10b98100}}.sci-hud-frame{border:1px solid rgba(255,255,255,.1);background:#0f172acc;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px)}.sci-tech-label{font-family:JetBrains Mono,monospace;font-size:10px;letter-spacing:2px;color:var(--accent-primary);background:#00f2ff1a;padding:4px 10px;border-radius:4px;display:inline-block}.lever-intro-overlay{position:absolute;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#020617cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:40px}.intro-card h2{font-size:2rem;font-weight:900;margin-bottom:15px}.start-btn{margin-top:30px;padding:16px 40px;background:#3b82f6;border:none;border-radius:16px;color:#fff;font-weight:900;cursor:pointer;box-shadow:0 10px 20px #3b82f666;transition:transform .2s}.start-btn:hover{transform:scale(1.05)}.sci-pascal-container{min-height:100vh;background:radial-gradient(circle at top left,#0f172a,#020617);color:#e2e8f0;padding:20px;font-family:Outfit,sans-serif}.sci-pascal-layout{display:grid;grid-template-columns:1fr 400px;gap:30px;max-width:1500px;margin:0 auto}.sci-pascal-main{background:#0f172a99;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:40px;padding:40px;display:flex;flex-direction:column;gap:30px;position:relative;overflow:hidden}.sci-pascal-main:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(56,189,248,.5),transparent)}.module-header h1{font-size:2.5rem;font-weight:900;margin:0;background:linear-gradient(to right,#fff,#94a3b8);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.simulation-area{background:#0006;height:480px;border-radius:32px;border:1px dashed rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.hydraulic-system{display:flex;align-items:flex-end;gap:0;position:relative;padding-bottom:20px}.vessel{height:300px;background:#ffffff0d;border:4px solid #475569;border-top:none;position:relative;display:flex;flex-direction:column-reverse;box-shadow:0 10px 30px #00000080}.vessel:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.05) 0%,transparent 20%,transparent 80%,rgba(255,255,255,.05) 100%);pointer-events:none}.piston-head{position:absolute;width:100%;height:25px;background:linear-gradient(180deg,#94a3b8,#475569);border:1px solid rgba(255,255,255,.2);box-shadow:0 4px 10px #0006;z-index:5;display:flex;justify-content:center;transition:top .1s linear}.force-arrow{position:absolute;top:-50px;color:#3b82f6;font-weight:900;font-size:14px;text-align:center}.force-arrow:after{content:"↓";display:block;font-size:24px}.car-load{position:absolute;top:-65px;font-size:3rem;filter:drop-shadow(0 0 15px rgba(255,250,250,.4));animation:idleCar 2s infinite ease-in-out}@keyframes idleCar{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.fluid{width:100%;background:linear-gradient(to top,#1e40af,#3b82f6);box-shadow:inset 0 0 40px #0000004d;position:relative}.fluid:before{content:"";position:absolute;top:0;left:0;right:0;height:10px;background:#fff3}.connecting-tube{width:120px;height:50px;background:#0f172acc;border-top:4px solid #475569;border-bottom:4px solid #475569;position:relative}.fluid-horizontal{width:100%;height:100%;background:#1e40af;box-shadow:inset 0 0 20px #00000080}.control-card{background:#ffffff08;padding:24px;border-radius:24px;border:1px solid rgba(255,255,255,.05);display:flex;flex-direction:column;gap:15px}.control-card label{font-size:10px;font-weight:800;color:#64748b;text-transform:uppercase;letter-spacing:1px}.btn-group{display:flex;gap:8px}.btn-group button{flex:1;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff05;color:#94a3b8;cursor:pointer;font-weight:800;transition:all .2s}.btn-group button.active{background:#3b82f6;border-color:#60a5fa;color:#fff;box-shadow:0 4px 15px #3b82f64d}.pump-btn{width:100%;background:linear-gradient(135deg,#3b82f6,#1d4ed8);padding:24px;border-radius:24px;border:1px solid rgba(255,255,255,.2);color:#fff;font-weight:900;font-size:1.4rem;cursor:pointer;transition:all .2s;box-shadow:0 10px 25px #2563eb4d}.pump-btn:hover{transform:translateY(-2px);box-shadow:0 15px 30px #2563eb66}.pump-btn.active{transform:translateY(4px);box-shadow:none;background:#1d4ed8}.sci-pascal-sidebar{display:flex;flex-direction:column;gap:20px}.diag-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.05)}.diag-row .val.accent{color:#3b82f6}.progress-bar-container{height:12px;background:#020617;border-radius:6px;overflow:hidden;margin-top:10px;border:1px solid rgba(255,255,255,.05)}.progress-fill{height:100%;background:linear-gradient(90deg,#1d4ed8,#3b82f6);box-shadow:0 0 15px #3b82f680;transition:width .3s cubic-bezier(.4,0,.2,1)}.pascal-intro-overlay{position:absolute;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#020617d9;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:40px}.sci-hud-frame{border:1px solid rgba(255,255,255,.1);background:#0f172ae6;border-radius:32px}.sci-tech-label{font-family:JetBrains Mono,monospace;font-size:10px;letter-spacing:2px;color:#3b82f6;background:#3b82f61a;padding:4px 12px;border-radius:4px;margin-bottom:15px;display:inline-block}.start-btn{margin-top:30px;padding:18px 50px;background:#3b82f6;border:none;border-radius:18px;color:#fff;font-weight:900;font-size:1rem;cursor:pointer;box-shadow:0 10px 25px #3b82f666;transition:all .2s}.start-btn:hover{transform:translateY(-3px);box-shadow:0 15px 35px #3b82f680}.sci-atom-container{min-height:100vh;background:radial-gradient(circle at top right,#050510,#020617);color:#fff;padding:20px;font-family:Outfit,sans-serif}.sci-atom-layout{display:grid;grid-template-columns:1fr 400px;gap:30px;max-width:1500px;margin:0 auto}.sci-atom-main{background:#0f172a99;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:40px;padding:40px;display:flex;flex-direction:column;gap:20px;position:relative;overflow:hidden}.sci-atom-main:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(99,102,241,.5),transparent)}.simulation-area{height:520px;margin:20px 0;background:radial-gradient(circle at center,#1a1a3a,#050510 75%);border-radius:32px;position:relative;display:flex;justify-content:center;align-items:center;overflow:hidden;border:1px solid rgba(99,102,241,.1)}.atom-canvas{position:relative;width:420px;height:420px;display:flex;justify-content:center;align-items:center}.shell{position:absolute;border:1px dashed rgba(255,255,255,.15);border-radius:50%}.s1{width:120px;height:120px}.s2{width:220px;height:220px}.s3{width:320px;height:320px}.electron-orbit{position:absolute;width:100%;height:100%;z-index:5;animation:rotate-orbit linear infinite}.orbit-1{animation-duration:6s}.orbit-2{animation-duration:12s}.orbit-3{animation-duration:20s}@keyframes rotate-orbit{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.electron-particle{position:absolute;left:50%;top:50%;width:12px;height:12px;background:#3b82f6;border-radius:50%;margin-left:-6px;margin-top:-6px;box-shadow:0 0 15px #3b82f6cc,inset 0 2px 2px #fff6}.nucleus{width:60px;height:60px;background:#ffffff0d;border-radius:50%;position:relative;z-index:10;display:flex;justify-content:center;align-items:center;filter:drop-shadow(0 0 10px rgba(0,0,0,.5))}.particle{position:absolute;width:16px;height:16px;border-radius:50%;transition:all .5s cubic-bezier(.175,.885,.32,1.275)}.particle.proton{background:linear-gradient(135deg,#ef4444,#991b1b);box-shadow:0 0 10px #ef444499,inset 0 2px 2px #ffffff4d}.particle.neutron{background:linear-gradient(135deg,#94a3b8,#475569);box-shadow:0 0 8px #94a3b866,inset 0 2px 2px #fff3}.element-display{position:absolute;top:40px;right:40px;background:#0f172acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:24px;border-radius:20px;border:1px solid rgba(255,255,255,.1);min-width:120px;text-align:center;box-shadow:0 10px 30px #00000080}.symbol-box{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:5px}.symbol{font-size:3.5rem;font-weight:900;color:#fbbf24;text-shadow:0 0 20px rgba(251,191,36,.3)}.mass-num{align-self:flex-start;font-size:14px;font-weight:800;color:#94a3b8;font-family:JetBrains Mono,monospace}.atomic-num{align-self:flex-end;font-size:14px;font-weight:800;color:#ef4444;font-family:JetBrains Mono,monospace}.element-name{font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:2px;font-size:12px}.controls-panel{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.particle-control{background:#ffffff08;padding:20px;border-radius:24px;border:1px solid rgba(255,255,255,.05);display:flex;flex-direction:column;align-items:center;gap:15px;transition:all .3s}.particle-control label{font-size:10px;font-weight:800;color:#64748b;text-transform:uppercase;letter-spacing:1px}.particle-control.red{border-bottom:4px solid #ef4444}.particle-control.grey{border-bottom:4px solid #94a3b8}.particle-control.blue{border-bottom:4px solid #3b82f6}.btn-row{display:flex;align-items:center;gap:25px}.btn-row button{width:44px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#fff;font-size:1.5rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.btn-row button:hover{background:#ffffff1a;transform:scale(1.1)}.btn-row span{font-size:2rem;font-weight:900;font-family:JetBrains Mono,monospace}.sci-atom-sidebar{display:flex;flex-direction:column;gap:20px}.diag-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.diag-row .val{font-size:1.4rem;font-weight:900;color:#e2e8f0;font-family:JetBrains Mono,monospace}.val.pos{color:#ef4444}.val.neg{color:#3b82f6}.sci-tech-label{font-family:JetBrains Mono,monospace;font-size:10px;letter-spacing:2px;color:#6366f1;background:#6366f11a;padding:4px 12px;border-radius:4px;margin-bottom:15px;display:inline-block}.atom-intro-overlay{position:absolute;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#020617d9;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:40px}.start-btn{margin-top:30px;padding:18px 50px;background:#6366f1;border:none;border-radius:18px;color:#fff;font-weight:900;font-size:1rem;cursor:pointer;box-shadow:0 10px 25px #6366f166;transition:all .2s}.start-btn:hover{transform:translateY(-3px);box-shadow:0 15px 35px #6366f180}.sci-genetics-container{min-height:100vh;background:radial-gradient(circle at top right,#0f172a,#020617);color:#fff;padding:20px;font-family:Outfit,sans-serif}.sci-genetics-layout{display:grid;grid-template-columns:1fr 400px;gap:30px;max-width:1500px;margin:0 auto}.sci-genetics-main{background:#0f172a99;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:40px;padding:40px;display:flex;flex-direction:column;gap:20px;position:relative;overflow:hidden}.sci-genetics-main:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(168,85,247,.5),transparent)}.module-header h1{font-size:2.5rem;font-weight:900;margin:0;background:linear-gradient(to right,#fff,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.module-header p{color:#94a3b8;margin-top:10px;font-weight:500}.simulation-area{background:#0006;min-height:500px;border-radius:32px;border:1px dashed rgba(255,255,255,.1);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:40px;gap:40px}.parents-area{display:flex;align-items:center;gap:40px}.parent-card{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:24px;text-align:center;width:200px;transition:transform .3s}.parent-card:hover{transform:translateY(-5px);border-color:#a855f766}.p-label{display:block;font-size:10px;font-weight:800;color:#64748b;text-transform:uppercase;margin-bottom:15px}.flower-icon{font-size:3rem;margin-bottom:15px;filter:drop-shadow(0 0 10px rgba(255,255,255,.2))}.flower-icon.ungu{filter:drop-shadow(0 0 15px rgba(168,85,247,.4))}.flower-icon.putih{filter:drop-shadow(0 0 15px rgba(255,255,255,.2))}.genotype-select select{width:100%;padding:10px;border-radius:12px;background:#0f172a;border:1px solid rgba(255,255,255,.1);color:#fff;font-weight:700;cursor:pointer}.vs-sign{font-size:1.5rem;font-weight:900;color:#a855f7;text-shadow:0 0 15px rgba(168,85,247,.5)}.punnett-grid{display:grid;grid-template-columns:60px 120px 120px;grid-template-rows:60px 120px 120px;gap:10px}.cell{background:#ffffff05;border:1px solid rgba(255,255,255,.05);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.cell.header{background:#a855f71a;border-color:#a855f733;font-weight:900;font-size:1.5rem;color:#a855f7}.cell.child{background:#0f172a99;border:1px solid rgba(255,255,255,.1);transition:all .3s}.cell.child:hover{transform:scale(1.05);z-index:10;border-color:#a855f7;box-shadow:0 10px 30px #00000080}.cell.child.ungu{border-bottom:4px solid #a855f7}.cell.child.putih{border-bottom:4px solid #f8fafc}.alleles{font-size:1.8rem;font-weight:900;font-family:JetBrains Mono,monospace;letter-spacing:2px}.mini-flower{font-size:1.2rem;margin-top:5px}.results-summary{width:100%}.res-card{background:#ffffff08;padding:24px;border-radius:24px;border:1px solid rgba(255,255,255,.05)}.res-card h3{font-size:1rem;font-weight:800;margin-bottom:15px;color:#94a3b8}.ratio-bar{height:48px;background:#0f172a;border-radius:12px;overflow:hidden;display:flex;border:1px solid rgba(255,255,255,.05)}.bar{height:100%;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:12px;transition:width .8s cubic-bezier(.4,0,.2,1)}.bar.ungu{background:linear-gradient(90deg,#7c3aed,#a855f7);color:#fff}.bar.putih{background:#f8fafc;color:#0f172a}.sci-genetics-sidebar{display:flex;flex-direction:column;gap:20px}.stats-card{background:#0f172acc;border:1px solid rgba(255,255,255,.1);border-radius:32px;padding:30px}.stats-card.dna-bg{position:relative;overflow:hidden}.stats-card.dna-bg:after{content:"";position:absolute;bottom:-50px;right:-50px;width:200px;height:200px;background:radial-gradient(circle,rgba(168,85,247,.1) 0%,transparent 70%);z-index:0}.diag-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;position:relative;z-index:1}.diag-row span:first-child{font-size:11px;font-weight:800;color:#64748b;text-transform:uppercase}.diag-row .val{font-size:1.2rem;font-weight:900}.sci-hud-frame{border:1px solid rgba(255,255,255,.1);background:#0f172acc;border-radius:32px}.sci-tech-label{font-family:JetBrains Mono,monospace;font-size:10px;letter-spacing:2px;color:#a855f7;background:#a855f71a;padding:4px 12px;border-radius:4px;margin-bottom:15px;display:inline-block}.genetics-intro-overlay{position:absolute;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#020617d9;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:40px}.intro-card{max-width:500px;padding:40px;text-align:center}.start-btn{margin-top:30px;padding:18px 50px;background:#a855f7;border:none;border-radius:18px;color:#fff;font-weight:900;font-size:1rem;cursor:pointer;box-shadow:0 10px 25px #a855f766;transition:all .2s}.start-btn:hover{transform:translateY(-3px);box-shadow:0 15px 35px #a855f780}.sciquiz-container{min-height:100vh;background:var(--bg-primary);color:var(--text-primary);padding:20px;font-family:Outfit,Inter,sans-serif;display:flex;flex-direction:column;align-items:center;transition:var(--theme-transition)}.sciquiz-header{width:100%;max-width:800px;display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.sciquiz-card{width:100%;max-width:800px;background:var(--bg-secondary);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border-primary);border-radius:24px;padding:40px;position:relative;overflow:hidden;box-shadow:var(--shadow-lg)}.sciquiz-progress{position:absolute;top:0;left:0;height:6px;background:var(--accent-gradient);transition:width .4s cubic-bezier(.4,0,.2,1)}.sciquiz-q-index{font-size:14px;font-weight:700;color:var(--text-muted);margin-bottom:15px;text-transform:uppercase;letter-spacing:1px}.sciquiz-question{font-size:24px;font-weight:700;line-height:1.4;margin-bottom:35px;color:var(--text-primary)}.sciquiz-options{display:grid;grid-template-columns:1fr;gap:15px}.sciquiz-opt{background:var(--bg-tertiary);border:1px solid var(--border-secondary);border-radius:16px;padding:18px 24px;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:15px;font-size:17px;text-align:left;color:var(--text-primary)}.sciquiz-opt:hover:not(.disabled){background:var(--bg-input-focus);border-color:var(--accent-primary);transform:translate(10px)}.sciquiz-opt.selected{background:var(--info-bg);border-color:var(--info);box-shadow:0 0 15px var(--info-bg)}.sciquiz-opt.correct{background:var(--success-bg)!important;border-color:var(--success)!important;color:var(--success)!important}.sciquiz-opt.wrong{background:var(--error-bg)!important;border-color:var(--error)!important;color:var(--error)!important}.sciquiz-opt .opt-label{width:35px;height:35px;background:var(--accent-soft);border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;flex-shrink:0;color:var(--accent-primary)}.sciquiz-feedback{margin-top:30px;padding:20px;background:var(--success-bg);border:1px dashed var(--success);border-radius:16px;animation:slideUp .4s ease-out}.sciquiz-feedback h5{margin:0 0 10px;color:var(--success);font-size:16px}.sciquiz-feedback p{margin:0;font-size:15px;line-height:1.5;color:var(--text-secondary)}.sciquiz-footer{margin-top:30px;display:flex;justify-content:space-between;align-items:center}.sciquiz-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:var(--accent-gradient);color:#fff}.sciquiz-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--shadow-md)}.sciquiz-btn:disabled{opacity:.5;cursor:not-allowed}.sciquiz-result{text-align:center}.sciquiz-score-circle{width:180px;height:180px;border-radius:50%;border:8px solid var(--border-secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto 30px;position:relative}.sciquiz-score-circle .score-num{font-size:60px;font-weight:900;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.sciquiz-stats{display:flex;justify-content:center;gap:40px;margin-bottom:40px}.stat-item{display:flex;flex-direction:column}.stat-val{font-size:28px;font-weight:800;color:var(--text-primary)}.stat-label{font-size:13px;color:var(--text-muted);font-weight:600;text-transform:uppercase}.back-to-lab{background:var(--bg-tertiary);border:1px solid var(--border-secondary);color:var(--text-primary);margin-left:15px}@media(max-width:640px){.sciquiz-card{padding:25px}.sciquiz-question{font-size:20px}.sciquiz-stats{gap:20px}}.earth-container{display:flex;flex-direction:column;min-height:100vh;background-color:var(--bg-primary, #0f172a);color:#fff;font-family:Inter,system-ui,sans-serif;overflow-x:hidden;position:relative;transition:transform .05s linear}.earth-container:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(249,115,22,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(249,115,22,.03) 1px,transparent 1px);background-size:30px 30px;z-index:0;pointer-events:none}.earth-nav{display:flex;align-items:center;gap:15px;padding:20px 40px;background:#0f172acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(249,115,22,.2);position:relative;z-index:20;flex-wrap:wrap}.earth-board{flex:1;display:flex;padding:20px 40px 40px;justify-content:center;align-items:flex-start;position:relative;z-index:10}.earth-board-inner{display:flex;flex-direction:column;gap:20px;width:100%;max-width:1200px;animation:earthFadeIn .8s ease-out}@keyframes earthFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.earth-mode-selector{display:flex;gap:10px;flex-wrap:wrap}.mode-btn{flex:1;min-width:150px;padding:14px 20px;background:#1e293b99;border:1px solid #334155;border-radius:12px;color:#94a3b8;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s}.mode-btn:hover{background:#1e293be6;border-color:var(--mode-color);color:#fff}.mode-btn.active{background:#f973161a;border-color:var(--mode-color);color:var(--mode-color);box-shadow:0 0 15px #f9731626}.earth-display{padding:30px;min-height:400px}.earth-controls{padding:25px}@media(min-width:900px){.earth-board-inner{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto;gap:20px}.earth-board-inner{grid-template-columns:1.3fr 1fr}.earth-mode-selector{grid-column:1 / -1}}.earth-canvas-wrap{display:flex;justify-content:center;align-items:center;min-height:350px}.earth-canvas{border-radius:50%;box-shadow:0 0 40px #f9731633,0 0 80px #f973160d}.layer-buttons{display:flex;flex-direction:column;gap:8px}.layer-btn{background:#1e293b;border:1px solid #334155;padding:12px 15px;border-radius:10px;color:#cbd5e1;text-align:left;cursor:pointer;transition:all .2s;display:flex;justify-content:space-between;align-items:center}.layer-btn:hover:not(.active){background:#334155;border-color:var(--layer-color)}.layer-btn.active{background:#f9731614;border-color:var(--layer-color);box-shadow:0 0 10px #f973161a}.layer-btn-header{display:flex;align-items:center;gap:10px}.layer-color-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0;box-shadow:0 0 6px currentColor}.layer-name{font-weight:600;font-size:14px}.layer-name-en{font-size:11px;color:#64748b;font-style:italic}.layer-meta{font-size:11px;color:#94a3b8;font-family:monospace}.layer-detail{background:#0f172acc;border:1px solid #334155;border-radius:12px;padding:18px;margin-top:8px}.detail-stats{display:flex;gap:15px;font-size:13px;color:#94a3b8;margin-bottom:10px}.detail-desc{font-size:14px;color:#cbd5e1;line-height:1.6;margin:0 0 12px}.detail-facts{list-style:none;padding:0;margin:0}.detail-facts li{font-size:13px;color:#94a3b8;padding:4px 0;border-bottom:1px solid rgba(51,65,85,.5)}.detail-facts li:last-child{border-bottom:none}.plates-visual{display:flex;flex-direction:column;gap:20px}.plate-scene{position:relative;height:320px;background:linear-gradient(180deg,#0c4a6e,#164e63 30%,#78350f 30%,#451a03);border-radius:12px;overflow:hidden}.ocean-layer{position:absolute;top:0;left:0;right:0;height:30%;overflow:hidden}.wave{position:absolute;bottom:0;left:-10%;width:120%;height:20px;background:#38bdf84d;border-radius:50%;animation:waveMove 3s ease-in-out infinite}.wave.w2{bottom:8px;animation-delay:.5s;opacity:.5}.wave.w3{bottom:16px;animation-delay:1s;opacity:.3}@keyframes waveMove{0%,to{transform:translate(-5%)}50%{transform:translate(5%)}}.plate{position:absolute;top:28%;height:25%;width:42%;background:linear-gradient(180deg,#78350f,#92400e,#451a03);border:2px solid #a16207;display:flex;align-items:center;justify-content:center;transition:transform .1s linear}.plate-left{left:2%;border-radius:4px 0 0 4px;border-right:3px dashed #ef4444}.plate-right{right:2%;border-radius:0 4px 4px 0;border-left:3px dashed #ef4444}.plate-label{font-size:11px;font-weight:600;color:#fbbf24;text-shadow:0 1px 3px rgba(0,0,0,.8)}.plate-arrow{position:absolute;font-size:24px;color:#fbbf24;animation:arrowPulse 1.5s infinite}.plate-left .plate-arrow{right:8px}.plate-right .plate-arrow{left:8px}@keyframes arrowPulse{0%,to{opacity:.5}50%{opacity:1}}.subduction-zone{position:absolute;left:50%;top:20%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;z-index:5}.volcano-shape{width:0;height:0;border-left:40px solid transparent;border-right:40px solid transparent;border-bottom:50px solid #78350f;position:relative}.volcano-shape:after{content:"";position:absolute;top:-8px;left:-10px;width:20px;height:12px;background:#ef4444;border-radius:50%;box-shadow:0 0 15px #ef4444}.volcano-smoke{position:absolute;top:-30px}.smoke-puff{width:20px;height:20px;background:#94a3b866;border-radius:50%;position:absolute;animation:smokeFade 2s infinite}.smoke-puff.s1{left:-5px;animation-delay:0s}.smoke-puff.s2{left:10px;top:-10px;animation-delay:.5s}@keyframes smokeFade{0%{transform:translateY(0) scale(1);opacity:.6}to{transform:translateY(-40px) scale(2);opacity:0}}.magma-rise{position:absolute;top:50px;display:flex;flex-direction:column;align-items:center;gap:10px}.magma-bubble{width:8px;height:8px;background:#ef4444;border-radius:50%;box-shadow:0 0 8px #ef4444;animation:magmaRise 2s infinite}.magma-bubble.m2{animation-delay:.5s;width:6px;height:6px}.magma-bubble.m3{animation-delay:1s;width:5px;height:5px}@keyframes magmaRise{0%{transform:translateY(30px);opacity:0}50%{opacity:1}to{transform:translateY(-20px);opacity:0}}.mantle-layer{position:absolute;bottom:10%;left:0;right:0;display:flex;justify-content:space-around}.convection-arrow{font-size:32px;color:#f97316;animation:convectionSpin 3s linear infinite;text-shadow:0 0 10px #f97316}.convection-arrow.ca2{animation-direction:reverse}@keyframes convectionSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.plate-info-box{background:#0f172acc;border:1px solid #f97316;border-radius:10px;padding:15px}.plate-info-box h4{color:#f97316;margin:0 0 8px}.plate-info-box p{color:#cbd5e1;font-size:14px;line-height:1.6;margin:0}.plate-controls{display:flex;flex-direction:column;gap:15px}.plate-move-btn,.reset-btn{padding:14px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;-webkit-user-select:none;user-select:none}.plate-move-btn{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;border:none;box-shadow:0 5px 15px #3b82f64d}.plate-move-btn:active,.plate-move-btn.active{transform:scale(.97)}.reset-btn{background:transparent;border:1px solid #64748b;color:#94a3b8}.reset-btn:hover{background:#64748b1a}.plate-edu-box{background:#0f172ab3;border:1px solid #334155;border-radius:10px;padding:15px}.plate-edu-box h4{color:#fbbf24;margin:0 0 8px}.plate-edu-box p{color:#94a3b8;font-size:13px;line-height:1.6;margin:0}.quake-visual{display:flex;flex-direction:column;gap:15px}.quake-scene{position:relative;height:300px;background:linear-gradient(180deg,#0ea5e9,#7dd3fc 25%,#a7f3d0 25%,#4ade80 30%,#78350f 30%,#451a03);border-radius:12px;overflow:hidden}.quake-ground{position:absolute;top:20%;left:0;right:0;height:15%;display:flex;align-items:flex-end;justify-content:center;gap:30px;padding:0 20px;transition:transform .05s linear}.building{display:grid;grid-template-columns:repeat(2,1fr);gap:3px;padding:5px;border-radius:2px 2px 0 0;position:relative;transition:all .2s}.building.b1{width:35px;height:60px;background:#475569}.building.b2{width:30px;height:40px;background:#64748b}.building.b3{width:40px;height:75px;background:#334155}.building .window{width:10px;height:8px;background:#fde047;border-radius:1px}.building.damaged{animation:buildingShake .15s infinite alternate}.building.damaged .window{background:#94a3b8}.building.collapsed{transform:skew(-15deg) scaleY(.5);opacity:.6}.building.collapsed .window{background:#475569}@keyframes buildingShake{0%{transform:translate(-2px) rotate(-.5deg)}to{transform:translate(2px) rotate(.5deg)}}.tree{font-size:28px;position:absolute}.tree.t1{left:15%}.tree.t2{right:15%}.seismic-waves{position:absolute;bottom:50%;left:50%;transform:translate(-50%,50%)}.seismic-ring{position:absolute;width:20px;height:20px;border:2px solid rgba(239,68,68,.5);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);animation:seismicExpand 1.5s ease-out infinite}@keyframes seismicExpand{0%{width:10px;height:10px;opacity:1}to{width:200px;height:200px;opacity:0}}.epicenter{position:absolute;bottom:45%;left:50%;transform:translate(-50%);text-align:center;z-index:5}.epi-dot{width:12px;height:12px;background:#ef4444;border-radius:50%;margin:0 auto 5px;box-shadow:0 0 10px #ef4444}.epi-dot.active{animation:epiPulse .5s infinite}@keyframes epiPulse{0%,to{transform:scale(1);box-shadow:0 0 10px #ef4444}50%{transform:scale(1.5);box-shadow:0 0 25px #ef4444}}.epi-label{font-size:10px;color:#fca5a5;text-transform:uppercase;letter-spacing:1px}.fault-line{position:absolute;bottom:20%;left:10%;right:10%;height:4px;display:flex}.fault-left,.fault-right{flex:1;height:100%;background:#ef4444;transition:transform .05s linear}.fault-left{border-radius:2px 0 0 2px}.fault-right{border-radius:0 2px 2px 0}.seismograph{background:#0f172ae6;border:1px solid #4ade80;border-radius:10px;padding:12px}.seis-label{font-size:11px;color:#4ade80;letter-spacing:2px;font-family:monospace;margin-bottom:5px}.seis-wave{width:100%;height:60px}.quake-controls{display:flex;flex-direction:column;gap:15px}.magnitude-control{display:flex;flex-direction:column;gap:8px}.magnitude-control label{display:flex;justify-content:space-between;align-items:center}.mag-label{font-size:13px;color:#94a3b8}.mag-value{font-size:28px;font-family:Courier New,monospace;font-weight:700}.mag-slider{-webkit-appearance:none;width:100%;height:8px;background:linear-gradient(90deg,#4ade80,#facc15,#f97316,#ef4444);border-radius:4px;outline:none}.mag-slider::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;background:#fff;border-radius:50%;cursor:pointer;box-shadow:0 2px 8px #0000004d}.mag-scale{display:flex;justify-content:space-between;font-size:11px;color:#64748b;font-family:monospace}.quake-effect-box{background:#0f172acc;border:1px solid;border-radius:10px;padding:12px;text-align:center}.effect-label{font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:2px}.effect-desc{font-size:13px;color:#94a3b8;margin-top:4px}.quake-btn{padding:18px;border:none;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;text-transform:uppercase;letter-spacing:2px;transition:all .2s;background:linear-gradient(135deg,#ef4444,#b91c1c);color:#fff;box-shadow:0 5px 20px #ef44444d}.quake-btn:active{transform:scale(.97)}.quake-btn.active{background:linear-gradient(135deg,#4ade80,#16a34a);box-shadow:0 5px 20px #4ade804d}.mitigation-box{background:#0f172ab3;border:1px solid #334155;border-radius:12px;padding:15px}.mitigation-box h4{color:#4ade80;margin:0 0 10px}.mitigation-box ul{list-style:none;padding:0;margin:0}.mitigation-box li{font-size:13px;color:#94a3b8;padding:5px 0;border-bottom:1px solid rgba(51,65,85,.3)}.mitigation-box li:last-child{border-bottom:none}@media(max-width:768px){.earth-nav{padding:15px 20px;gap:8px}.earth-board{padding:15px}.earth-board-inner{grid-template-columns:1fr!important}.plate-scene,.quake-scene{height:220px}.building.b1{width:25px;height:40px}.building.b2{width:22px;height:30px}.building.b3{width:30px;height:55px}}.ecology-container{display:flex;flex-direction:column;min-height:100vh;background-color:var(--bg-primary, #0f172a);color:#fff;font-family:Inter,system-ui,sans-serif;overflow-x:hidden;position:relative}.ecology-container:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(16,185,129,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(16,185,129,.03) 1px,transparent 1px);background-size:30px 30px;z-index:0;pointer-events:none}.eco-nav{display:flex;align-items:center;gap:15px;padding:20px 40px;background:#0f172acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(16,185,129,.2);position:relative;z-index:20;flex-wrap:wrap}.eco-board{flex:1;display:flex;padding:20px 40px 40px;justify-content:center;align-items:flex-start;position:relative;z-index:10}.eco-board-inner{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;width:100%;max-width:1200px;animation:ecoFadeIn .8s ease-out}@keyframes ecoFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.eco-display{padding:20px}.ecosystem-scene{border-radius:12px;overflow:hidden;position:relative;transition:filter .5s ease}.eco-sky{height:120px;position:relative;overflow:hidden;transition:background .5s}.smog-layer{position:absolute;inset:0;background:#78716c80;transition:opacity .3s}.eco-bird{position:absolute;font-size:16px;animation:birdFly 4s ease-in-out infinite}@keyframes birdFly{0%,to{transform:translate(0) translateY(0)}25%{transform:translate(15px) translateY(-8px)}50%{transform:translate(30px) translateY(0)}75%{transform:translate(15px) translateY(8px)}}.eco-land{height:100px;background:linear-gradient(180deg,#4ade80,#16a34a,#15803d);position:relative;overflow:hidden}.eco-tree{position:absolute;transition:opacity .5s}.eco-insect{position:absolute;font-size:12px;animation:insectFloat 3s ease-in-out infinite}@keyframes insectFloat{0%,to{transform:translate(0)}33%{transform:translate(8px,-5px)}66%{transform:translate(-5px,-8px)}}.eco-water{height:100px;position:relative;overflow:hidden;transition:background .5s}.eco-fish{position:absolute;font-size:16px;animation:fishSwim 5s ease-in-out infinite}@keyframes fishSwim{0%,to{transform:translate(0) scaleX(1)}49%{transform:translate(40px) scaleX(1)}50%{transform:translate(40px) scaleX(-1)}99%{transform:translate(0) scaleX(-1)}}.algae-bloom{position:absolute;inset:0;transition:opacity .5s}.algae-dot{position:absolute;width:15px;height:15px;background:#4ade8080;border-radius:50%;filter:blur(3px)}.eco-status-bar{display:flex;align-items:center;gap:15px;padding:12px 15px;margin-top:12px;background:#0f172acc;border-radius:10px;border:1px solid #334155;flex-wrap:wrap}.status-item{display:flex;align-items:center;gap:8px;font-size:13px}.status-emoji{font-size:18px}.status-label{color:#64748b;font-size:12px}.pollution-bar{width:100px;height:8px;background:#1e293b;border-radius:4px;overflow:hidden}.pollution-fill{height:100%;border-radius:4px;transition:width .3s,background .3s}.eco-controls{padding:20px;display:flex;flex-direction:column;gap:15px;max-height:80vh;overflow-y:auto}.type-selector{display:grid;grid-template-columns:1fr 1fr;gap:8px}.type-btn{padding:12px;border-radius:10px;background:#1e293b;border:1px solid #334155;color:#94a3b8;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.type-btn:hover{border-color:var(--type-color);color:#fff}.type-btn.active{background:#10b9811a;border-color:var(--type-color);color:var(--type-color)}.pollution-sources{display:flex;flex-direction:column;gap:6px}.source-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#1e293b;border:1px solid #334155;border-radius:8px;color:#cbd5e1;cursor:pointer;transition:all .2s;text-align:left}.source-btn:hover:not(:disabled){background:#334155;border-color:#ef4444}.source-btn:disabled{opacity:.4;cursor:not-allowed}.source-icon{font-size:22px}.source-name{font-size:13px;font-weight:600}.source-desc{font-size:11px;color:#64748b}.source-impact{margin-left:auto;font-size:12px;font-family:monospace;color:#ef4444;font-weight:700}.sim-btn{padding:16px;border:none;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s;background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 5px 15px #10b9814d}.sim-btn.running{background:linear-gradient(135deg,#f97316,#c2410c);box-shadow:0 5px 15px #f973164d}.clean-btn{padding:12px;border:1px solid #4ade80;border-radius:10px;background:transparent;color:#4ade80;font-weight:600;cursor:pointer;transition:all .2s}.clean-btn:hover:not(:disabled){background:#4ade801a}.clean-btn:disabled{opacity:.3;cursor:not-allowed}.reset-btn-eco{padding:10px;border:1px solid #64748b;border-radius:8px;background:transparent;color:#94a3b8;cursor:pointer;font-size:13px;transition:all .2s}.reset-btn-eco:hover{background:#64748b1a}.pop-monitor{background:#0f172a99;border:1px solid #334155;border-radius:12px;padding:15px}.pop-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid rgba(51,65,85,.3)}.pop-row:last-child{border-bottom:none}.pop-icon{font-size:16px;width:24px;text-align:center}.pop-label{font-size:12px;color:#94a3b8;width:60px}.pop-bar{flex:1;height:6px;background:#1e293b;border-radius:3px;overflow:hidden}.pop-fill{height:100%;border-radius:3px;transition:width .5s,background .3s}.pop-count{font-size:12px;font-family:monospace;color:#cbd5e1;width:24px;text-align:right}@media(max-width:900px){.eco-board-inner{grid-template-columns:1fr}.eco-nav{padding:15px 20px;gap:8px}.eco-board{padding:15px}}.nerve-container{display:flex;flex-direction:column;min-height:100vh;background-color:var(--bg-primary, #0f172a);color:#fff;font-family:Inter,system-ui,sans-serif;overflow-x:hidden;position:relative}.nerve-container:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(168,85,247,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(168,85,247,.03) 1px,transparent 1px);background-size:30px 30px;z-index:0;pointer-events:none}.nerve-nav{display:flex;align-items:center;gap:15px;padding:20px 40px;background:#0f172acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(168,85,247,.2);position:relative;z-index:20;flex-wrap:wrap}.nerve-board{flex:1;display:flex;padding:20px 40px 40px;justify-content:center;align-items:flex-start;position:relative;z-index:10}.nerve-board-inner{display:flex;flex-direction:column;gap:20px;width:100%;max-width:1200px;animation:nerveFadeIn .8s ease-out}@keyframes nerveFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.nerve-mode-selector{display:flex;gap:10px;flex-wrap:wrap}@media(min-width:900px){.nerve-board-inner{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}.nerve-mode-selector{grid-column:1 / -1}}.nerve-display{padding:25px;min-height:450px}.reflex-display{display:flex;flex-direction:column;gap:20px}.reflex-arc{display:flex;flex-direction:column;gap:4px}.arc-node{display:flex;align-items:center;gap:12px;padding:10px 15px;background:#1e293b80;border-radius:10px;border:1px solid #334155;transition:all .3s;position:relative}.arc-node.active{background:#a855f71a;border-color:#a855f7;box-shadow:0 0 15px #a855f726}.arc-icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:18px;flex-shrink:0}.arc-label{font-weight:700;font-size:14px;min-width:100px}.arc-desc{font-size:12px;color:#94a3b8;flex:1}.arc-connector{width:2px;height:12px;background:#334155;margin-left:32px;position:relative;transition:background .3s}.arc-connector.active{background:#a855f7}.signal-dot{width:6px;height:6px;background:#a855f7;border-radius:50%;position:absolute;top:0;left:-2px;opacity:0}.arc-connector.active .signal-dot{opacity:1;animation:signalMove .5s ease-in-out}@keyframes signalMove{0%{top:0}to{top:100%}}.reflex-btn{padding:16px;border:none;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;background:linear-gradient(135deg,#f97316,#c2410c);color:#fff;box-shadow:0 5px 20px #f973164d;transition:all .2s}.reflex-btn:disabled{opacity:.6;cursor:not-allowed}.reflex-btn:active:not(:disabled){transform:scale(.97)}.reaction-test{background:#0f172acc;border:1px solid #334155;border-radius:12px;padding:20px;text-align:center}.reaction-start-btn{padding:12px 30px;background:#1e293b;border:1px solid #a855f7;border-radius:8px;color:#a855f7;font-weight:600;cursor:pointer;transition:all .2s}.reaction-start-btn:hover{background:#a855f71a}.reaction-wait{padding:20px;background:#7f1d1d;border-radius:10px;animation:pulseRed 1s infinite}@keyframes pulseRed{0%,to{box-shadow:0 0 10px #ef44444d}50%{box-shadow:0 0 25px #ef444499}}.reaction-click-btn{padding:25px 40px;background:linear-gradient(135deg,#4ade80,#16a34a);border:none;border-radius:12px;color:#fff;font-size:20px;font-weight:800;cursor:pointer;animation:pulseGreen .5s infinite}@keyframes pulseGreen{0%,to{box-shadow:0 0 15px #4ade8066}50%{box-shadow:0 0 30px #4ade80cc}}.reaction-result{margin-top:10px}.result-time{font-size:42px;font-family:Courier New,monospace;font-weight:800;color:#a855f7}.result-grade{font-size:14px;margin-top:5px}.eye-display{display:flex;flex-direction:column;align-items:center}.eye-visual{display:flex;flex-direction:column;align-items:center;gap:15px}.eyeball{width:180px;height:180px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 0 30px #a855f733,inset 0 4px 15px #0000004d;transition:background .3s;position:relative}.pupil{background:#000;border-radius:50%;transition:all .3s ease;position:relative;display:flex;align-items:center;justify-content:center}.light-reflect{width:15%;height:15%;background:#fffc;border-radius:50%;position:absolute;top:20%;right:25%}.eye-labels{display:flex;gap:15px;flex-wrap:wrap;justify-content:center}.eye-label-item{display:flex;align-items:center;gap:6px;font-size:12px;color:#94a3b8}.label-dot{width:10px;height:10px;border-radius:50%;border:1px solid rgba(255,255,255,.3)}.light-slider{-webkit-appearance:none;width:100%;height:8px;background:linear-gradient(90deg,#1e293b,#fde047);border-radius:4px;outline:none}.light-slider::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background:#fff;border-radius:50%;cursor:pointer;box-shadow:0 2px 8px #0000004d}.ear-display{display:flex;flex-direction:column;gap:20px}.ear-diagram{display:flex;flex-direction:column;gap:8px}.ear-section{background:#1e293b80;border:1px solid #334155;border-radius:12px;padding:15px;cursor:pointer;transition:all .3s}.ear-section:hover{border-color:var(--ear-color)}.ear-section.active{background:#a855f714;border-color:var(--ear-color);box-shadow:0 0 15px #a855f71a}.ear-section-header{display:flex;align-items:center;gap:10px}.ear-section-header h4{margin:0;font-size:14px}.ear-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.ear-parts-list{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.ear-part-tag{font-size:11px;padding:3px 8px;background:#64748b33;border-radius:4px;color:#94a3b8}.ear-desc{font-size:13px;color:#cbd5e1;line-height:1.6;margin-top:10px}.sound-visual{background:#0f172ab3;border:1px solid #334155;border-radius:12px;padding:15px}.sound-wave-svg{width:100%;height:80px}.sound-controls-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:10px}.sound-controls-grid label{font-size:12px;color:#94a3b8;display:block;margin-bottom:5px}.sound-controls-grid input[type=range]{width:100%;-webkit-appearance:none;height:6px;background:#334155;border-radius:3px;outline:none}.sound-controls-grid input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:#a855f7;border-radius:50%;cursor:pointer}.freq-labels{display:flex;justify-content:space-between;font-size:10px;color:#64748b;margin-top:3px}.nerve-info{padding:25px}.info-content{display:flex;flex-direction:column;gap:12px}.info-content h4{margin:0;font-size:16px}.info-content p{color:#cbd5e1;font-size:14px;line-height:1.6;margin:0}.info-fact{display:flex;align-items:flex-start;gap:10px;padding:10px;background:#1e293b80;border-radius:8px;font-size:13px;color:#94a3b8;line-height:1.5}.info-fact span:first-child{font-size:18px;flex-shrink:0}@media(max-width:900px){.nerve-board-inner{grid-template-columns:1fr!important}.nerve-nav{padding:15px 20px;gap:8px}.nerve-board{padding:15px}.sound-controls-grid{grid-template-columns:1fr}.eyeball{width:140px;height:140px}}.gas-container{display:flex;flex-direction:column;min-height:100vh;background-color:var(--bg-primary, #0f172a);color:#fff;font-family:Inter,system-ui,sans-serif;overflow-x:hidden;position:relative}.gas-container:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(244,63,94,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(244,63,94,.03) 1px,transparent 1px);background-size:30px 30px;z-index:0;pointer-events:none}.gas-nav{display:flex;align-items:center;gap:15px;padding:20px 40px;background:#0f172acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(244,63,94,.2);position:relative;z-index:20;flex-wrap:wrap}.gas-board{flex:1;display:flex;padding:20px 40px 40px;justify-content:center;align-items:flex-start;position:relative;z-index:10}.gas-board-inner{display:flex;flex-direction:column;gap:20px;width:100%;max-width:1200px;animation:gasFadeIn .8s ease-out}@keyframes gasFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.gas-mode-selector{display:flex;gap:10px;flex-wrap:wrap}@media(min-width:900px){.gas-board-inner{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}.gas-mode-selector{grid-column:1 / -1}}.gas-display{padding:25px;min-height:450px}.gas-controls{padding:25px;display:flex;flex-direction:column;gap:15px}.balloon-scene{position:relative}.balloon-sky{height:380px;border-radius:12px;overflow:hidden;position:relative;transition:background .5s}.clouds{position:absolute;width:100%;transition:transform .5s}.cloud{position:absolute;font-size:40px;opacity:.6;animation:cloudDrift 15s linear infinite}.cloud.c1{left:10%;top:30%;animation-duration:20s}.cloud.c2{left:60%;top:20%;animation-duration:18s;font-size:30px}.cloud.c3{left:35%;top:50%;animation-duration:25s}@keyframes cloudDrift{0%{transform:translate(-20px)}50%{transform:translate(20px)}to{transform:translate(-20px)}}.stars{position:absolute;inset:0}.star{position:absolute;color:#fde047;font-size:10px;animation:starTwinkle 2s ease-in-out infinite}@keyframes starTwinkle{0%,to{opacity:.3}50%{opacity:1}}.balloon-wrap{position:absolute;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;transition:bottom .3s ease-out;z-index:5}.balloon-envelope{width:90px;height:110px;border-radius:50% 50% 10% 10%;position:relative;overflow:hidden;transition:transform .3s;box-shadow:0 10px 30px #0000004d,inset 0 -15px 30px #0003}.balloon-stripe{position:absolute;top:0;bottom:0;width:20px;background:#ffffff26}.balloon-stripe.s1{left:25%}.balloon-stripe.s2{left:55%}.balloon-ropes{display:flex;gap:20px;height:20px}.rope{width:1px;height:100%;background:#94a3b8}.balloon-basket{width:35px;height:20px;background:linear-gradient(180deg,#92400e,#78350f);border-radius:2px 2px 4px 4px;border:1px solid #a16207;position:relative;display:flex;justify-content:center}.basket-flame{position:absolute;bottom:100%;width:15px;display:flex;justify-content:center;align-items:flex-end;transition:height .2s,opacity .2s}.flame-outer-gas{width:14px;height:100%;background:radial-gradient(ellipse at bottom,#f97316 0%,#ef4444 50%,transparent 100%);border-radius:50% 50% 20% 20%;animation:flickerGas .1s infinite alternate}.flame-inner-gas{position:absolute;bottom:0;width:6px;height:60%;background:radial-gradient(ellipse at bottom,#fde047 0%,#f97316 80%,transparent 100%);border-radius:50% 50% 20% 20%}@keyframes flickerGas{0%{transform:scaleX(.9) scaleY(1.05)}to{transform:scaleX(1.1) scaleY(.95)}}.ground-layer{position:absolute;bottom:0;left:0;right:0;height:60px;background:linear-gradient(180deg,#4ade80,#16a34a);transition:transform .3s;display:flex;align-items:center;justify-content:center}.ground-trees{font-size:20px;letter-spacing:8px}.balloon-hud{display:flex;gap:12px;margin-top:12px;flex-wrap:wrap}.hud-item{flex:1;min-width:100px;background:#0f172ae6;border:1px solid #334155;border-radius:8px;padding:10px;text-align:center}.hud-label{font-size:10px;color:#64748b;letter-spacing:1px;font-family:monospace}.hud-value{font-size:20px;font-weight:700;font-family:Courier New,monospace;color:#f43f5e;margin-top:4px}.flight-controls{display:flex;flex-direction:column;gap:15px}.flame-control label{display:flex;justify-content:space-between;font-size:13px;color:#94a3b8;margin-bottom:6px}.flame-slider{-webkit-appearance:none;width:100%;height:8px;background:linear-gradient(90deg,#334155,#f97316,#ef4444);border-radius:4px;outline:none}.flame-slider::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;background:#fff;border-radius:50%;cursor:pointer;box-shadow:0 2px 8px #0000004d}.fly-btn{padding:16px;border:none;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;background:linear-gradient(135deg,#f43f5e,#be123c);color:#fff;box-shadow:0 5px 20px #f43f5e4d;transition:all .2s}.fly-btn.active{background:linear-gradient(135deg,#4ade80,#16a34a);box-shadow:0 5px 20px #4ade804d}.fly-btn:active{transform:scale(.97)}.reset-btn-gas{padding:10px;border:1px solid #64748b;border-radius:8px;background:transparent;color:#94a3b8;cursor:pointer;font-size:13px;transition:all .2s}.reset-btn-gas:hover{background:#64748b1a}.flight-info,.boyle-info,.barometer-info{background:#0f172ab3;border:1px solid #334155;border-radius:12px;padding:15px}.formula-box{background:#1e293bcc;border:1px solid #f43f5e;border-radius:8px;padding:12px;text-align:center;font-size:20px;font-family:Courier New,monospace;color:#fde047;margin-top:10px;letter-spacing:2px}.boyle-scene{display:flex;flex-direction:column;gap:20px}.syringe-wrap{position:relative;display:flex;align-items:center;padding:30px 10px}.syringe-body{flex:1;height:70px;background:#94a3b81a;border:2px solid #64748b;border-radius:6px;position:relative;overflow:hidden}.syringe-gas{position:absolute;left:0;top:0;bottom:0;background:#3b82f626;transition:width .2s;overflow:hidden}.gas-particle{position:absolute;color:#3b82f6;animation:particleBounce 1s ease-in-out infinite alternate}@keyframes particleBounce{0%{transform:translate(0)}to{transform:translate(5px,-5px)}}.syringe-piston{position:absolute;top:-5px;bottom:-5px;width:8px;background:#475569;cursor:grab;transition:left .2s}.piston-handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20px;height:30px;background:#64748b;border-radius:4px;border:1px solid #94a3b8}.syringe-scale{position:absolute;bottom:-22px;left:0;right:0;display:flex;justify-content:space-between;font-size:10px;color:#64748b;font-family:monospace}.syringe-tip{width:30px;height:10px;background:#64748b;border-radius:0 4px 4px 0;margin-left:-2px}.boyle-slider label{display:flex;justify-content:space-between;font-size:13px;color:#94a3b8;margin-bottom:6px}.volume-slider{-webkit-appearance:none;width:100%;height:8px;background:linear-gradient(90deg,#ef4444,#3b82f6,#10b981);border-radius:4px;outline:none}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;background:#fff;border-radius:50%;cursor:pointer;box-shadow:0 2px 8px #0000004d}.boyle-data{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.boyle-card{background:#0f172acc;border:1px solid #334155;border-radius:10px;padding:12px;text-align:center}.boyle-card-label{font-size:11px;color:#64748b;font-family:monospace;letter-spacing:1px}.boyle-card-value{font-size:22px;font-weight:700;font-family:Courier New,monospace;margin:5px 0}.boyle-card-bar{height:6px;background:#1e293b;border-radius:3px;overflow:hidden}.example-list{display:flex;flex-direction:column;gap:6px}.example-item{font-size:13px;color:#94a3b8;padding:8px 10px;background:#1e293b80;border-radius:6px;line-height:1.5}.barometer-scene{display:flex;flex-direction:column;gap:15px}.mountain-visual{position:relative}.mountain-bg{height:300px;background:linear-gradient(180deg,#0f172a,#1e3a5f,#38bdf8,#4ade80 90%,#16a34a);border-radius:12px;position:relative;overflow:hidden}.mtn-layer{position:absolute;width:100%;text-align:center;font-size:14px;color:#ffffff80}.mtn-space{top:5%}.mtn-peak{top:25%;font-size:40px}.mtn-mid{top:55%}.mtn-base{bottom:5%;font-size:18px;letter-spacing:5px}.alt-indicator{position:absolute;right:60px;display:flex;align-items:center;gap:8px;transition:bottom .3s;z-index:5}.alt-dot{width:12px;height:12px;background:#f43f5e;border-radius:50%;box-shadow:0 0 10px #f43f5e;animation:altPulse 1s infinite}@keyframes altPulse{0%,to{box-shadow:0 0 10px #f43f5e}50%{box-shadow:0 0 20px #f43f5e,0 0 30px #f43f5e4d}}.alt-line{width:30px;height:2px;background:#f43f5e}.alt-label{font-size:12px;font-family:monospace;color:#f43f5e;font-weight:700;background:#0f172acc;padding:3px 8px;border-radius:4px}.alt-scale{position:absolute;left:15px;top:0;bottom:0}.scale-line{position:absolute;display:flex;align-items:center;gap:5px}.scale-line:before{content:"";width:15px;height:1px;background:#fff3}.scale-line span{font-size:9px;color:#fff6;font-family:monospace}.alt-slider-wrap label{display:flex;justify-content:space-between;font-size:13px;color:#94a3b8;margin-bottom:6px}.altitude-slider{-webkit-appearance:none;width:100%;height:8px;background:linear-gradient(90deg,#4ade80,#38bdf8,#1e3a5f);border-radius:4px;outline:none}.altitude-slider::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;background:#fff;border-radius:50%;cursor:pointer;box-shadow:0 2px 8px #0000004d}.alt-presets{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.preset-btn{padding:6px 10px;background:#1e293b;border:1px solid #334155;border-radius:6px;color:#94a3b8;font-size:11px;cursor:pointer;transition:all .2s}.preset-btn:hover{border-color:#10b981;color:#fff;background:#10b9811a}.baro-data{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.baro-card{background:#0f172acc;border:1px solid #334155;border-radius:10px;padding:12px;display:flex;align-items:center;gap:10px}.baro-icon{font-size:22px}.baro-label{font-size:11px;color:#64748b}.baro-value{font-size:18px;font-weight:700;font-family:Courier New,monospace}.danger-alert{background:#7f1d1d66;border:1px solid #ef4444;border-radius:10px;padding:12px;text-align:center;color:#fca5a5;font-size:13px;animation:dangerPulse 1.5s infinite}@keyframes dangerPulse{0%,to{box-shadow:0 0 10px #ef444433}50%{box-shadow:0 0 20px #ef444466}}.altitude-facts{display:flex;flex-direction:column;gap:6px;margin-top:12px}.alt-fact{display:flex;justify-content:space-between;font-size:12px;color:#94a3b8;padding:8px 10px;background:#1e293b80;border-radius:6px}.alt-fact span:first-child{font-weight:600;color:#cbd5e1;min-width:70px}@media(max-width:900px){.gas-board-inner{grid-template-columns:1fr!important}.gas-nav{padding:15px 20px;gap:8px}.gas-board{padding:15px}.balloon-sky{height:280px}.boyle-data,.baro-data{grid-template-columns:1fr}.mountain-bg{height:220px}.balloon-envelope{width:70px;height:85px}}.sci-parabola-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e1b4b);padding:2rem;color:#f8fafc;font-family:Inter,sans-serif}.title-container h1{font-size:3rem;font-weight:800;margin-bottom:1rem;background:linear-gradient(to right,#60a5fa,#a78bfa,#f472b6);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.sci-canvas-container{background:#0f172a;border-radius:24px;overflow:hidden;position:relative;box-shadow:0 0 0 1px #ffffff1a,inset 0 0 20px #00000080;margin-bottom:2rem}.sci-canvas{width:100%;height:400px;display:block}.sci-flying-data{position:absolute;top:1rem;right:1rem;background:#000000b3;padding:1rem;border-radius:12px;font-family:monospace;font-size:1.1rem;color:#38bdf8;border:1px solid rgba(56,189,248,.3)}input[type=range]{width:100%;accent-color:#38bdf8;cursor:pointer}.sci-select{width:100%;padding:.75rem;background:#0f172acc;border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:8px;font-size:1rem;outline:none}.sci-btn.primary{background:linear-gradient(135deg,#ef4444,#b91c1c);color:#fff;box-shadow:0 4px 15px #ef444466}.sci-btn.primary:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 6px 20px #ef444499}.sci-data-box{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.data-item{display:flex;align-items:center;gap:1rem;background:#0003;padding:1rem;border-radius:12px;border:1px solid rgba(255,255,255,.05)}.data-item.highlight{background:#38bdf81a;border-color:#38bdf84d}.data-icon{font-size:2rem}.data-label{display:block;font-size:.875rem;color:#94a3b8}.data-value{display:block;font-size:1.5rem;font-weight:700;color:#f8fafc}.data-item.highlight .data-value{color:#38bdf8}.sci-explanation{background:#f59e0b1a;border-left:4px solid #f59e0b;padding:1rem;border-radius:0 12px 12px 0}.sci-explanation h4{color:#fcd34d;margin-bottom:.5rem}.sci-explanation p{color:#d1d5db;font-size:.9rem;line-height:1.5}.sci-kepler-container{min-height:100vh;background:linear-gradient(135deg,#020617,#0f172a,#1e1b4b);padding:2rem;color:#f8fafc;font-family:Inter,sans-serif}.title-container h1{font-size:3rem;font-weight:800;margin-bottom:1rem;background:linear-gradient(to right,#818cf8,#c084fc,#e879f9);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.sci-canvas-container{background:#020617;border-radius:24px;overflow:hidden;position:relative;box-shadow:0 0 0 1px #ffffff1a,inset 0 0 30px #000c;margin-bottom:2rem;display:flex;justify-content:center;align-items:center}.sci-canvas{width:100%;height:500px;display:block}.sci-orbit-stats{position:absolute;top:1rem;left:1rem;background:#000000b3;padding:1rem;border-radius:12px;font-family:monospace;font-size:1.1rem;color:#c084fc;border:1px solid rgba(192,132,252,.3)}input[type=range]{width:100%;accent-color:#c084fc;cursor:pointer}.sci-btn.primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #10b98199}.sci-btn.warning{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;box-shadow:0 4px 15px #f59e0b66}.sci-btn.warning:hover{transform:translateY(-2px);box-shadow:0 6px 20px #f59e0b99}.law-box{background:#0003;padding:1.5rem;border-radius:12px;border:1px solid rgba(255,255,255,.05);margin-bottom:1rem}.law-box.highlight{background:#c084fc1a;border-color:#c084fc4d}.law-header{font-size:1.2rem;font-weight:700;color:#f8fafc;margin-bottom:.5rem}.law-box.highlight .law-header{color:#c084fc}.mini-stat{font-size:.85rem;color:#94a3b8;background:#0000004d;padding:.75rem;border-radius:8px}.sci-rotation-container{min-height:100vh;background:linear-gradient(135deg,#1e293b,#334155);padding:2rem;color:#f8fafc;font-family:Inter,sans-serif}.back-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:.75rem 1.5rem;border-radius:9999px;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);margin-bottom:2rem}.back-btn:hover{background:#fff3;transform:translate(-5px)}.sci-header{text-align:center;margin-bottom:3rem}.title-container h1{font-size:3rem;font-weight:800;margin-bottom:1rem;background:linear-gradient(to right,#38bdf8,#818cf8,#fbbf24);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.title-container p{color:#94a3b8;font-size:1.1rem;max-width:600px;margin:0 auto 1rem}.premium-badge{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;padding:.25rem 1rem;border-radius:9999px;font-size:.875rem;font-weight:700;letter-spacing:1px;text-transform:uppercase}.sci-main-content{display:grid;grid-template-columns:2fr 1fr;gap:2rem;max-width:1400px;margin:0 auto}.glass-panel{background:#ffffff0d;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:2rem;box-shadow:0 25px 50px -12px #00000080}.sci-canvas-container{background:#0f172a;border-radius:24px;overflow:hidden;position:relative;box-shadow:0 0 0 1px #ffffff1a,inset 0 0 30px #000c;margin-bottom:2rem}.ramp-wrapper{position:absolute;top:50px;left:50px;width:1500px;height:400px;z-index:1}.ramp-surface{position:absolute;top:0;left:0;width:100%;height:400px;background:repeating-linear-gradient(90deg,#1e293b,#1e293b 40px,#2dd4bf 40px 42px);border-top:4px solid #14b8a6;opacity:.8}.finish-line{position:absolute;top:0;width:10px;height:100%;background:repeating-linear-gradient(45deg,#fff,#fff 10px,#000 10px 20px);z-index:2}.object{position:absolute;width:40px;height:40px;border-radius:50%;z-index:5;box-shadow:0 5px 15px #00000080;margin-top:-20px;margin-left:-20px}.hoop{border:8px solid #ef4444;background:transparent;box-sizing:border-box}.hoop-inner{width:100%;height:100%;border-radius:50%;border-top:4px solid rgba(255,255,255,.8)}.solid-cyl{background:#fbbf24;overflow:hidden}.stripe{position:absolute;width:100%;height:6px;background:#b45309;top:17px}.solid-sphere{background:radial-gradient(circle at 30% 30%,#60a5fa,#1d4ed8)}.sphere-mark{position:absolute;width:10px;height:10px;background:#fffc;border-radius:50%;top:5px;left:15px}.sci-rotation-stats{position:absolute;bottom:1rem;right:1rem;background:#000000b3;padding:1rem;border-radius:12px;font-family:monospace;font-size:1.5rem;color:#fbbf24;border:1px solid rgba(251,191,36,.3);z-index:10}.sci-controls-panel h3{margin-bottom:1.5rem;font-size:1.5rem;color:#f8fafc}.control-group{margin-bottom:1.5rem}.control-group label{display:flex;justify-content:space-between;margin-bottom:.5rem;color:#cbd5e1}.control-group label b{color:#38bdf8}input[type=range]{width:100%;accent-color:#f59e0b;cursor:pointer}.btn-group{display:flex;gap:1rem;margin-top:2rem}.sci-btn{flex:1;padding:1rem;border-radius:12px;border:none;font-weight:700;font-size:1.1rem;cursor:pointer;transition:all .3s}.sci-btn.primary{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 4px 15px #10b98166}.sci-btn.primary:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 6px 20px #10b98199}.sci-btn:disabled{opacity:.5;cursor:not-allowed}.sci-btn.secondary{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.2)}.sci-btn.secondary:not(:disabled):hover{background:#fff3}.sci-right-panel{display:flex;flex-direction:column;gap:2rem}.sci-hud-panel h3{margin-bottom:1.5rem;font-size:1.5rem;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:1rem}.leaderboard{display:flex;flex-direction:column;gap:1rem}.rank-item{display:flex;align-items:center;gap:1rem;background:#0003;padding:1rem;border-radius:12px;border:1px solid rgba(255,255,255,.05);transition:all .3s}.rank-item.winner{background:#fbbf241a;border-color:#fbbf244d;transform:scale(1.02)}.rank-badge{background:#334155;color:#fff;width:32px;height:32px;display:flex;justify-content:center;align-items:center;border-radius:50%;font-weight:700;font-size:1.2rem}.rank-item.winner .rank-badge{background:#fbbf24;color:#000}.rank-info{display:flex;flex-direction:column}.rank-info .name{font-weight:700;font-size:1.1rem}.rank-info .k-value{color:#94a3b8;font-size:.85rem}.law-box{background:#0003;padding:1.5rem;border-radius:12px;border:1px solid rgba(255,255,255,.05)}.law-box.highlight{background:#38bdf81a;border-color:#38bdf84d}.law-header{font-size:1.2rem;font-weight:700;color:#38bdf8;margin-bottom:.5rem}.law-box p{color:#cbd5e1;font-size:.95rem;line-height:1.5;margin-bottom:1rem}.sci-qa-container{flex:1;display:flex;flex-direction:column}@media(max-width:1024px){.sci-main-content{grid-template-columns:1fr}}.math-map-container{padding:20px;font-family:Inter,sans-serif;max-width:800px;margin:0 auto}.math-header{text-align:center;margin-bottom:30px;background:linear-gradient(135deg,#4f46e5,#3b82f6);color:#fff;padding:30px 20px;border-radius:20px;box-shadow:0 10px 25px -5px #3b82f666}.math-header h1{font-size:32px;margin-bottom:10px;font-weight:800}.math-header p{font-size:16px;opacity:.9}.level-card{display:flex;align-items:center;padding:20px;border-radius:16px;margin-bottom:15px;transition:all .3s ease;position:relative;overflow:hidden}.level-card.completed{background:linear-gradient(to right,#ecfdf5,#fff);border:2px solid #10b981;box-shadow:0 4px 15px #10b9811a;cursor:pointer}.level-card.in-progress{background:linear-gradient(to right,#eff6ff,#fff);border:2px solid #3b82f6;box-shadow:0 8px 20px #3b82f626;cursor:pointer;transform:scale(1.02)}.level-card.locked{background:#f9fafb;border:1px solid #e5e7eb;opacity:.7;cursor:not-allowed}.level-card:hover:not(.locked){transform:translateY(-5px);box-shadow:0 12px 25px -5px #0000001a}.level-icon{width:60px;height:60px;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:28px;margin-right:20px;flex-shrink:0;box-shadow:0 4px 6px #0000001a}.completed .level-icon{background:#10b981;color:#fff}.in-progress .level-icon{background:#3b82f6;color:#fff;animation:pulse 2s infinite}.locked .level-icon{background:#9ca3af;color:#fff;box-shadow:none}.level-content{flex:1}.level-title{margin:0 0 8px;font-size:20px;font-weight:700;color:#1f2937}.locked .level-title{color:#6b7280}.level-badge{font-size:12px;padding:5px 10px;background-color:#f3f4f6;border-radius:6px;color:#4f46e5;font-weight:600;display:inline-block;margin-right:10px}.level-diff{font-size:12px;padding:5px 10px;border-radius:6px;font-weight:600;display:inline-block}.diff-Beginner{background:#dcfce7;color:#166534}.diff-Elementary{background:#fef9c3;color:#854d0e}.diff-Intermediate{background:#ffedd5;color:#9a3412}.diff-Advanced{background:#fee2e2;color:#991b1b}.diff-Boss{background:#f3e8ff;color:#6b21a8}.level-action{font-weight:700;font-size:14px;padding:8px 16px;border-radius:8px}.completed .level-action{color:#10b981;background:#d1fae5}.in-progress .level-action{color:#fff;background:#3b82f6}@keyframes pulse{0%{transform:scale(1);box-shadow:0 0 #3b82f6b3}70%{transform:scale(1.05);box-shadow:0 0 0 10px #3b82f600}to{transform:scale(1);box-shadow:0 0 #3b82f600}}.back-btn{background:#f1f5f9;border:1px solid #e2e8f0;color:#64748b;padding:10px 20px;border-radius:12px;cursor:pointer;font-size:14px;margin-bottom:20px;transition:all .2s;display:inline-flex;align-items:center;gap:8px;font-weight:700}.back-btn:hover{background:#e2e8f0;color:#1e293b}.math-workspace{min-height:100vh;background:#f0fdf4;font-family:Inter,sans-serif;display:flex;flex-direction:column}.math-nav{display:flex;justify-content:space-between;align-items:center;padding:15px 30px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:sticky;top:0;z-index:100}.math-nav h2{margin:0;color:#1f2937;font-size:20px}.math-score-box{background:#fef9c3;color:#854d0e;padding:8px 16px;border-radius:20px;font-weight:700;border:2px solid #fde047;display:flex;align-items:center;gap:8px}.math-board{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px}.question-area{background:#fff;border-radius:24px;padding:40px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;text-align:center;max-width:800px;width:100%}.math-equation{display:flex;justify-content:center;align-items:center;gap:20px;font-size:72px;font-weight:900;color:#1f2937;margin-bottom:40px}.math-operator{color:#3b82f6}.math-equals{color:#9ca3af}.math-visuals{display:flex;justify-content:center;gap:40px;margin-bottom:40px}.visual-group{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;background:#f8fafc;padding:15px;border-radius:16px;border:2px dashed #cbd5e1}.visual-item{width:30px;height:30px;background:#ef4444;border-radius:50%;box-shadow:inset -3px -3px #0000001a;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275)}.visual-item.blue{background:#3b82f6}.answer-options{display:flex;justify-content:center;gap:15px;flex-wrap:wrap}.option-btn{background:#f1f5f9;border:3px solid #cbd5e1;color:#334155;font-size:32px;font-weight:700;border-radius:16px;width:80px;height:80px;cursor:pointer;transition:all .2s;display:flex;justify-content:center;align-items:center}.option-btn:hover{transform:translateY(-5px);background:#e2e8f0;box-shadow:0 10px 15px -3px #0000001a}.option-btn:active{transform:translateY(2px)}.option-btn.correct{background:#10b981;border-color:#059669;color:#fff;animation:pulseSuccess .5s}.option-btn.wrong{background:#ef4444;border-color:#dc2626;color:#fff;animation:shakeError .5s}.progress-bar{width:100%;height:12px;background:#e5e7eb;border-radius:6px;margin-top:30px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#3b82f6,#10b981);border-radius:6px;transition:width .5s ease-out}.success-overlay{position:fixed;inset:0;background:#000c;display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s}.success-modal{background:#fff;padding:50px;border-radius:24px;text-align:center;max-width:500px;width:90%;animation:slideUp .5s cubic-bezier(.175,.885,.32,1.275)}.stars-container{font-size:60px;margin-bottom:20px}.btn-primary{background:#4f46e5;color:#fff;border:none;padding:15px 30px;border-radius:12px;font-size:18px;font-weight:700;cursor:pointer;margin-top:20px;box-shadow:0 4px 6px #4f46e533;transition:transform .2s}.btn-primary:hover{transform:scale(1.05)}@keyframes popIn{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes pulseSuccess{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes shakeError{0%,to{transform:translate(0)}25%{transform:translate(-10px)}50%{transform:translate(10px)}75%{transform:translate(-10px)}}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.floating-star{position:absolute;top:-30px;right:-20px;font-size:24px;font-weight:700;color:#f59e0b;text-shadow:0 2px 4px rgba(0,0,0,.2);animation:floatUp 1s ease-out forwards;pointer-events:none}.practice-container{min-height:100vh;background:#f8fafc;font-family:Inter,sans-serif;display:flex;flex-direction:column}.practice-nav{display:flex;justify-content:space-between;align-items:center;padding:15px 30px;background:#fff;box-shadow:0 4px 6px -1px #0000000d}.practice-score{background:#dcfce7;color:#166534;padding:8px 16px;border-radius:20px;font-weight:700}.practice-timer{background:#fef9c3;color:#854d0e;padding:8px 16px;border-radius:20px;font-weight:700;border:1px solid #fde047}.practice-board{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px}.geometry-visual{height:200px;display:flex;justify-content:center;align-items:center;margin-bottom:30px;position:relative}.shape-square,.shape-rectangle{background:#3b82f6;position:relative;border:4px solid #1d4ed8;display:flex;justify-content:center;align-items:center;color:#fff;font-weight:700}.shape-triangle{width:0;height:0;border-left:80px solid transparent;border-right:80px solid transparent;border-bottom:140px solid #ef4444;position:relative}.shape-label{position:absolute;color:#1f2937;font-weight:800;background:#fff;padding:2px 6px;border-radius:4px;border:1px solid #e5e7eb}.label-bottom{bottom:-30px;left:50%;transform:translate(-50%)}.label-left{left:-40px;top:50%;transform:translateY(-50%)}.label-right{right:-40px;top:50%;transform:translateY(-50%)}.shape-circle{width:150px;height:150px;background:#10b981;border-radius:50%;border:4px solid #047857;position:relative}.shape-radius{position:absolute;top:50%;left:50%;width:75px;height:2px;background:#fff}.question-text{font-size:24px;color:#374151;margin-bottom:30px;text-align:center;font-weight:700}.numpad-container{display:flex;gap:10px;margin-top:20px;justify-content:center}.numpad-input{font-size:40px;padding:10px 20px;border-radius:12px;border:3px solid #cbd5e1;width:150px;text-align:center}.numpad-submit{background:#4f46e5;color:#fff;border:none;border-radius:12px;font-size:24px;padding:0 30px;cursor:pointer;font-weight:700;transition:all .2s}.numpad-submit:hover{background:#4338ca}.shape-cube-container{perspective:600px;width:100px;height:100px}.cube{width:100%;height:100%;position:relative;transform-style:preserve-3d;transform:rotateX(-20deg) rotateY(25deg)}.cube-face{position:absolute;width:100px;height:100px;border:2px solid #0891b2;background:#06b6d466}.cube-front{transform:translateZ(50px)}.cube-back{transform:rotateY(180deg) translateZ(50px)}.cube-right{transform:rotateY(90deg) translateZ(50px)}.cube-left{transform:rotateY(-90deg) translateZ(50px)}.cube-top{transform:rotateX(90deg) translateZ(50px)}.cube-bottom{transform:rotateX(-90deg) translateZ(50px)}.feedback-anim{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:100px;pointer-events:none;animation:zoomFade 1s forwards;z-index:100}@keyframes zoomFade{0%{transform:translate(-50%,-50%) scale(0);opacity:1}50%{transform:translate(-50%,-50%) scale(1.2);opacity:1}to{transform:translate(-50%,-50%) scale(1.5);opacity:0}}.geometry-visual{height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;perspective:1000px}.shape-cube-container{transform-style:preserve-3d;display:flex;justify-content:center;align-items:center}.cube.solid{position:relative;transform-style:preserve-3d;transition:transform 1s ease}.cube.solid .cube-face{position:absolute;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;box-shadow:inset 0 0 15px #0000001a}.cube.solid .cube-front{background:#19a1e6;transform:translateZ(var(--z))}.cube.solid .cube-back{background:#0f618a;transform:rotateY(180deg) translateZ(var(--z))}.cube.solid .cube-top{background:#5ebeed;transform:rotateX(90deg) translateZ(var(--z))}.cube.solid .cube-bottom{background:#0a415c;transform:rotateX(-90deg) translateZ(var(--z))}.cube.solid .cube-left{background:#1791cf;transform:rotateY(-90deg) translateZ(var(--z))}.cube.solid .cube-right{background:#1271a1;transform:rotateY(90deg) translateZ(var(--z))}.cube.solid.is-cuboid .cube-face{background-color:#22c373}.cube.solid.is-cuboid .cube-top{background-color:#52e099}.cube.solid.is-cuboid .cube-bottom{background-color:#0f5733}.cube.solid.is-cuboid .cube-right{background-color:#1b9859}.solid-cylinder{width:100px;height:160px;position:relative;transform-style:preserve-3d;transform:rotateX(-15deg)}.cyl-top{width:100px;height:35px;border-radius:50%;background:#fde047;border:2px solid #854d0e;position:absolute;top:-17px;z-index:5}.cyl-body{width:100px;height:160px;background:linear-gradient(to right,#854d0e,#eab308 30%,#fef08a 45%,#eab308 70%,#854d0e);border-radius:0 0 50px 50px/0 0 20px 20px;border-left:2px solid #854d0e;border-right:2px solid #854d0e}.solid-sphere{width:140px;height:140px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#f9a8d4,#db2777,#831843);box-shadow:inset -5px -5px 20px #0006,0 10px 20px #0000001a;position:relative;display:flex;align-items:center;justify-content:center}.sphere-line{width:100%;height:1px;background:#fff6}.solid-cone{width:0;height:0;border-left:70px solid transparent;border-right:70px solid transparent;border-bottom:160px solid #ef4444;position:relative}.solid-cone:before{content:"";position:absolute;top:0;left:-70px;width:140px;height:160px;background:linear-gradient(to right,rgba(0,0,0,.2) 0%,transparent 40%,rgba(255,255,255,.3) 50%,transparent 60%,rgba(0,0,0,.3) 100%)}.solid-cone:after{content:"";position:absolute;bottom:-175px;left:-70px;width:140px;height:35px;background:#b91c1c;border-radius:50%;box-shadow:inset 0 5px 10px #0000004d}.solid-pyramid{width:140px;height:140px;position:relative;transform-style:preserve-3d;transform:rotateX(-20deg) rotateY(25deg)}.pyr-face{position:absolute;width:0;height:0;border-left:70px solid transparent;border-right:70px solid transparent;border-bottom:130px solid #8b5cf6;transform-origin:bottom center}.pf1{transform:translateZ(70px) rotateX(30deg);background-color:#a78bfa;border-bottom-color:#a78bfa}.pf2{transform:rotateY(90deg) translateZ(70px) rotateX(30deg);border-bottom-color:#7c3aed}.pf3{transform:rotateY(180deg) translateZ(70px) rotateX(30deg);border-bottom-color:#6d28d9}.pf4{transform:rotateY(-90deg) translateZ(70px) rotateX(30deg);border-bottom-color:#7c3aed}.solid-prism{width:140px;height:140px;position:relative;transform-style:preserve-3d;transform:rotateX(-15deg) rotateY(30deg)}.prism-tri{position:absolute;top:0;left:0;width:0;height:0;border-left:60px solid transparent;border-right:60px solid transparent;border-bottom:104px solid #f43f5e}.prism-rect{position:absolute;top:0;left:0;width:120px;height:160px;background:#e11d48;border:1px solid #9f1239;transform-origin:center left}.pr1{transform:rotateY(0) translateZ(30px)}.pr2{transform:rotateY(120deg) translateZ(30px)}.pr3{transform:rotateY(240deg) translateZ(30px)}.solid-labels{margin-top:30px;font-weight:800;color:#1e293b;font-size:20px;background:#f1f5f9;padding:10px 20px;border-radius:25px;box-shadow:0 4px 6px #0000000d}@keyframes floatUp{0%{transform:translateY(10px) scale(.5);opacity:0}20%{transform:translateY(0) scale(1.2);opacity:1}80%{transform:translateY(-40px) scale(1);opacity:1}to{transform:translateY(-50px) scale(1);opacity:0}}.formulas-container{padding:40px 20px;font-family:Inter,sans-serif;max-width:1000px;margin:0 auto;min-height:80vh}.formulas-header{text-align:center;margin-bottom:50px}.formulas-header h1{font-size:36px;color:#1f2937;font-weight:800;margin-bottom:10px}.formula-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}.formula-card{background:#fff;border-radius:20px;padding:30px;border:1px solid #e5e7eb;transition:transform .3s;box-shadow:0 4px 6px -1px #0000000d}.formula-card:hover{transform:translateY(-5px);box-shadow:0 10px 15px -3px #0000001a}.formula-card h2{margin:0 0 20px;font-size:24px;color:#4f46e5;display:flex;align-items:center;gap:10px}.formula-item{background:#f8fafc;padding:15px;border-radius:12px;margin-bottom:15px;border-left:4px solid #3b82f6}.formula-item p{margin:0 0 5px;font-weight:700;color:#374151}.formula-code{font-family:monospace;font-size:18px;color:#b91c1c;background:#fee2e2;padding:4px 8px;border-radius:6px;display:inline-block;font-weight:700}.poro-container{min-height:100vh;background:#f8fafc;font-family:Outfit,sans-serif;padding:20px;display:flex;flex-direction:column;align-items:center;position:relative}.poro-container:before{content:"";position:fixed;inset:0;background-color:#f8fafc;background-image:linear-gradient(#e2e8f0 1px,transparent 1px),linear-gradient(90deg,#e2e8f0 1px,transparent 1px);background-size:20px 20px;z-index:-1;opacity:.5}.poro-nav{width:100%;max-width:1200px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;z-index:10}.stat-badge{background:#fff;padding:10px 18px;border-radius:16px;font-weight:800;box-shadow:0 4px 6px -1px #0000001a;display:flex;align-items:center;gap:10px;color:#1e293b}.poro-board-paper{background:#fff;padding:60px;border-radius:4px;box-shadow:0 20px 50px #0000001a,0 0 0 1px #0000000d;min-height:600px;position:relative;display:flex;justify-content:center;width:100%;max-width:900px;border:1px solid #e1e5eb;transition:all .3s ease}.poro-board-paper:after{content:"";position:absolute;top:0;left:30px;bottom:0;width:2px;background:#ef444433}.porogapit-grid-container{font-family:Gochi Hand,Indie Flower,cursive;font-size:40px;color:#1e293b;position:relative;-webkit-user-select:none;user-select:none}.poro-bracket-svg{position:absolute;pointer-events:none;stroke:#1e293b;stroke-width:4;fill:none;stroke-linecap:round;filter:drop-shadow(2px 2px 2px rgba(0,0,0,.1))}.digit-cell{width:45px;height:55px;display:flex;align-items:center;justify-content:center;position:absolute;transition:all .4s cubic-bezier(.34,1.56,.64,1)}.digit-cell input{width:100%;height:50px;font-family:inherit;font-size:inherit;text-align:center;border:none;background:transparent;color:#2563eb;outline:none;border-bottom:2px dashed #cbd5e1;letter-spacing:12px;padding-left:6px}.digit-cell input::-webkit-outer-spin-button,.digit-cell input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.digit-cell input[type=number]{-moz-appearance:textfield;appearance:none}.digit-cell input:focus{border-bottom:3px solid #3b82f6;color:#1d4ed8}.digit-cell input::placeholder{color:#e2e8f0;font-size:24px}.subtraction-line{position:absolute;height:4px;background:#1e293b;border-radius:2px;transition:all .5s ease}.minus-sign{position:absolute;font-size:30px;font-weight:700;color:#1e293b}.digit-drop{animation:dropDigit .6s cubic-bezier(.34,1.56,.64,1)}@keyframes dropDigit{0%{transform:translateY(-100px);opacity:0}to{transform:translateY(0);opacity:1}}.scratchpad{position:absolute;right:-320px;top:0;width:280px;background:#fffbeb;border:1px solid #fde68a;padding:20px;border-radius:12px;box-shadow:0 4px 15px #fbbf241a;transform:rotate(1deg)}.scratchpad h4{font-family:Outfit,sans-serif;color:#92400e;margin-top:0;display:flex;align-items:center;gap:8px;border-bottom:1px solid #fef3c7;padding-bottom:10px}.scratch-input{width:100%;min-height:200px;background:transparent;border:none;font-family:Coming Soon,cursive;font-size:18px;line-height:1.6;color:#b45309;resize:none;outline:none}.box-digit.solved{color:#10b981;border-color:#d1fae5;background:#f0fdf4}.box-active{background:#fef9c3!important;border:4px solid #eab308!important;box-shadow:0 0 10px #eab30880;animation:pulse 1.5s infinite}.input-wrong{background:#fee2e2!important;border:4px solid #ef4444!important;animation:shake .3s}.input-active{background:#dcfce7!important;border:4px solid #10b981!important;color:#166534}.history-cascade{display:flex;flex-direction:column;align-items:flex-end;margin-top:10px;width:100%}.cascade-row{display:flex;flex-direction:column;align-items:flex-end;margin-bottom:5px;width:100%}.completed-row-boxes{display:flex;gap:5px}.q-digit-history{width:45px;height:60px;border:1px solid #cbd5e1;background:#f8fafc;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:32px;color:#64748b}.calc-line-long{width:150px;border-bottom:4px solid #1e293b;margin:10px 0;position:relative}.calc-line-long:after{content:"-";position:absolute;right:-30px;top:-15px;font-size:40px;color:#1e293b}.num-pad{background:#fff;padding:20px;border-radius:24px;box-shadow:0 10px 25px #0000000d;display:grid;grid-template-columns:repeat(3,1fr);gap:15px;height:fit-content}.pad-btn{background:#f8fafc;border:2px solid #e2e8f0;padding:20px;font-size:28px;font-weight:700;border-radius:16px;cursor:pointer;transition:all .1s}.pad-btn:active{transform:scale(.9);background:#e2e8f0}.pad-btn.action{grid-column:span 3;background:#4f46e5;color:#fff;border:none}.hint-box{grid-column:span 2;background:#4f46e5;color:#fff;padding:20px;border-radius:20px;font-size:20px;text-align:center;margin-top:20px}@media(max-width:1024px){.poro-board-paper{padding:40px 20px;max-width:95%}}@media(max-width:768px){.poro-nav{flex-direction:column;gap:10px}.poro-board-paper{padding:100px 10px 40px;margin-top:20px;min-height:auto}.scratchpad{position:relative;right:0;top:20px;width:100%;transform:none;margin-top:40px}.instruction-bubble{position:absolute;left:10px;right:10px;top:10px;max-width:none;text-align:center}.poro-board-paper:after{left:15px}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.summary-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}.summary-card{background:#fff;padding:30px;border-radius:24px;text-align:center;max-width:400px;width:100%}.scribble-canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:5;pointer-events:none;cursor:default}.scribble-canvas.pen-active{pointer-events:auto;cursor:crosshair}.board-top-controls{position:absolute;top:15px;right:15px;display:flex;gap:10px;z-index:10}.btn-tool{background:#f1f5f9;border:2px solid #e2e8f0;padding:8px 16px;border-radius:12px;font-size:14px;font-weight:800;color:#475569;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .2s}.btn-tool:hover{background:#e2e8f0}.btn-tool.active{background:#4f46e5;color:#fff;border-color:#4338ca;box-shadow:0 4px 10px #4f46e54d}.ai-controls{animation:slideUp .5s ease-out}.multi-container{min-height:100vh;background:#f8fafc;font-family:Outfit,sans-serif;padding:20px;display:flex;flex-direction:column;align-items:center;position:relative}.multi-container:before{content:"";position:fixed;inset:0;background-color:#f8fafc;background-image:linear-gradient(#e2e8f0 1px,transparent 1px),linear-gradient(90deg,#e2e8f0 1px,transparent 1px);background-size:20px 20px;z-index:-1;opacity:.5}.multi-nav{width:100%;max-width:1200px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;z-index:10}.multi-board-paper{background:#fff;padding:60px;border-radius:4px;box-shadow:0 20px 50px #0000001a,0 0 0 1px #0000000d;min-height:500px;position:relative;display:flex;justify-content:center;width:100%;max-width:900px;border:1px solid #e1e5eb;transition:all .3s ease}.multi-board-paper:after{content:"";position:absolute;top:0;left:30px;bottom:0;width:2px;background:#ef444433}.multi-grid-container{font-family:Gochi Hand,Indie Flower,cursive;font-size:40px;color:#1e293b;position:relative;-webkit-user-select:none;user-select:none}.multi-digit-cell{width:45px;height:60px;display:flex;align-items:center;justify-content:center;position:absolute;transition:all .3s ease}.carry-cell{width:30px;height:30px;font-size:22px;color:#ea580c;border:1px dashed #fdba74;border-radius:4px;background:#fff7ed;position:absolute;display:flex;align-items:center;justify-content:center}.multi-digit-cell input{width:40px;height:50px;font-family:inherit;font-size:inherit;text-align:center;border:none;background:transparent;color:#2563eb;outline:none;border-bottom:2px dashed #cbd5e1;appearance:none}.multi-digit-cell input::-webkit-outer-spin-button,.multi-digit-cell input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.multi-digit-cell input:focus{border-bottom:3px solid #3b82f6;color:#1d4ed8}.multiplication-line{position:absolute;height:4px;background:#1e293b;border-radius:2px}.sign-x{position:absolute;font-size:32px;color:#1e293b}.sign-plus{position:absolute;font-size:28px;color:#64748b}.instruction-bubble{position:absolute;left:20px;top:20px;background:#eff6ff;border:1px solid #bfdbfe;padding:15px;border-radius:15px;max-width:250px;z-index:20;box-shadow:0 4px 6px #0000000d}@media(max-width:1024px){.multi-board-paper{padding:40px 20px;max-width:95%}}@media(max-width:768px){.multi-nav{flex-direction:column;gap:10px}.multi-board-paper{padding:100px 10px 40px;margin-top:20px;min-height:auto}.scratchpad{position:relative;right:0;top:20px;width:100%;transform:none;margin-top:40px}.instruction-bubble{position:absolute;left:10px;right:10px;top:10px;max-width:none;text-align:center}.multi-board-paper:after{left:15px}}.summary-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.summary-card{background:#fff;padding:30px;border-radius:24px;text-align:center;box-shadow:0 20px 40px #0003;max-width:400px;width:100%}.frac-container{min-height:100vh;background:#f8fafc;font-family:Outfit,sans-serif;padding:20px;display:flex;flex-direction:column;align-items:center;position:relative}.frac-container:before{content:"";position:fixed;inset:0;background-color:#f8fafc;background-image:linear-gradient(#e2e8f0 1px,transparent 1px),linear-gradient(90deg,#e2e8f0 1px,transparent 1px);background-size:20px 20px;z-index:-1;opacity:.5}.frac-nav{width:100%;max-width:1200px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;z-index:10}.stat-badge{background:#fff;padding:10px 18px;border-radius:16px;font-weight:800;box-shadow:0 4px 6px -1px #0000001a;display:flex;align-items:center;gap:10px;color:#1e293b;border:1px solid #e2e8f0}.frac-board-paper{background:#fff;padding:60px;border-radius:4px;box-shadow:0 20px 50px #0000001a,0 0 0 1px #0000000d;min-height:500px;position:relative;display:flex;flex-direction:column;align-items:center;width:100%;max-width:1000px;border:1px solid #e1e5eb;transition:all .3s ease}.frac-board-paper:after{content:"";position:absolute;top:0;left:30px;bottom:0;width:2px;background:#ef444433}.fraction-exp{display:flex;align-items:center;gap:20px;font-family:Gochi Hand,cursive;font-size:48px;color:#1e293b}.fraction-box{display:flex;flex-direction:column;align-items:center;min-width:60px}.fraction-line{width:100%;height:4px;background:#1e293b;margin:5px 0;border-radius:2px}.frac-input{width:50px;height:60px;text-align:center;font-size:40px;font-family:inherit;border:none;background:transparent;color:#2563eb;border-bottom:2px dashed #cbd5e1;outline:none}.frac-input:focus{border-bottom:3px solid #3b82f6;background:#eff6ff}.visual-area{display:flex;gap:40px;margin-bottom:50px;justify-content:center;padding:20px;background:#fdfcf6;border-radius:24px;box-shadow:inset 0 2px 10px #00000008}.pizza-visual{width:120px;height:120px;position:relative}.pizza-slice{fill:#f59e0b;stroke:#92400e;stroke-width:1px}.pizza-bg{fill:#fef3c7;stroke:#fde68a;stroke-width:1px}@media(max-width:768px){.frac-nav{flex-direction:column;gap:10px}.frac-board-paper{padding:100px 10px 40px}.scratchpad{position:relative;right:0;width:100%;margin-top:40px}}.board-scaler{transform-origin:top center;transition:transform .3s ease}.instruction-bubble{position:absolute;left:20px;top:20px;background:#eff6ff;border:1px solid #bfdbfe;padding:15px;border-radius:15px;max-width:300px;z-index:20;box-shadow:0 4px 6px #0000000d}.scratchpad{position:absolute;right:-320px;top:0;width:280px;background:#fffbeb;border:1px solid #fde68a;padding:20px;border-radius:12px;box-shadow:0 4px 15px #fbbf241a}.active-target{background:#fef9c399!important;border-radius:4px}.frac-steps-container{display:flex;flex-direction:column;gap:25px;width:100%;padding:10px 0}.frac-step-row{display:flex;align-items:center;gap:20px;padding:15px 20px;background:#fafbfc;border-radius:16px;border:1px solid #e2e8f0;transition:all .3s ease}.frac-step-row:hover{border-color:#cbd5e1;box-shadow:0 2px 8px #0000000a}.frac-step-label{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:70px;flex-shrink:0}.frac-step-num{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:14px;background:#e2e8f0;color:#94a3b8;transition:all .3s ease}.frac-step-num.active{background:#3b82f6;color:#fff;box-shadow:0 0 0 4px #3b82f633;animation:pulse 2s infinite}.frac-step-num.done{background:#10b981;color:#fff}.frac-step-text{font-size:11px;font-weight:700;color:#94a3b8;text-transform:uppercase;letter-spacing:.5px;text-align:center}.frac-input-sm{width:50px;height:45px;text-align:center;font-size:28px;font-family:Gochi Hand,cursive;border:none;background:transparent;color:#2563eb;border-bottom:2px dashed #cbd5e1;outline:none;transition:all .2s ease}.frac-input-sm:focus{border-bottom:3px solid #3b82f6;background:#eff6ff}.frac-input-sm::placeholder{color:#cbd5e1;font-size:24px}.input-correct{color:#10b981!important;border-bottom-color:#10b981!important;background:#10b98114!important}.frac-step-row .fraction-exp{font-size:32px;gap:12px;flex-wrap:wrap}.frac-step-row .fraction-box{min-width:45px}.frac-step-row .fraction-line{height:3px}@keyframes pulse{0%,to{box-shadow:0 0 0 4px #3b82f633}50%{box-shadow:0 0 0 8px #3b82f61a}}@media(max-width:600px){.frac-step-row{flex-direction:column;gap:10px}.frac-step-label{flex-direction:row;min-width:unset}.frac-step-row .fraction-exp{font-size:24px;gap:8px}.frac-input-sm{width:35px;height:35px;font-size:20px}.frac-step-row .fraction-box{min-width:35px}.instruction-bubble{position:relative;left:0;top:0;max-width:100%;margin-bottom:15px}}.fmd-container{min-height:100vh;background:#f8fafc;font-family:Outfit,sans-serif;padding:20px;display:flex;flex-direction:column;align-items:center;position:relative}.fmd-container:before{content:"";position:fixed;inset:0;background-color:#f8fafc;background-image:linear-gradient(#e2e8f0 1px,transparent 1px),linear-gradient(90deg,#e2e8f0 1px,transparent 1px);background-size:20px 20px;z-index:-1;opacity:.5}.fmd-nav{width:100%;max-width:1200px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;z-index:10}.fmd-badge{background:#fff;padding:10px 18px;border-radius:16px;font-weight:800;box-shadow:0 4px 6px -1px #0000001a;display:flex;align-items:center;gap:10px;color:#1e293b;border:1px solid #e2e8f0;font-family:inherit;font-size:14px}.fmd-active{background:#6366f11a!important;border-color:#6366f1!important;color:#4338ca!important}.fmd-setup-card{background:#fff;padding:40px;border-radius:24px;box-shadow:0 20px 40px #0000000d;margin-top:40px;width:100%;max-width:700px}.fmd-free-section{background:#f8fafc;padding:20px;border-radius:16px;margin-bottom:30px}.fmd-btn-primary{width:100%;padding:18px;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;border-radius:16px;border:none;font-size:18px;font-weight:900;cursor:pointer;box-shadow:0 10px 20px #6366f14d;font-family:inherit;transition:transform .2s}.fmd-btn-primary:hover{transform:translateY(-2px)}.fmd-btn-secondary{width:100%;margin-top:20px;padding:12px;background:#6366f1;color:#fff;border-radius:12px;border:none;font-weight:700;cursor:pointer;font-family:inherit}.fmd-board-scaler{transform-origin:top center;transition:transform .3s ease}.fmd-board{background:#fff;padding:60px;border-radius:4px;box-shadow:0 20px 50px #0000001a,0 0 0 1px #0000000d;min-height:500px;position:relative;display:flex;flex-direction:column;align-items:center;width:100%;max-width:1000px;border:1px solid #e1e5eb}.fmd-board:after{content:"";position:absolute;top:0;left:30px;bottom:0;width:2px;background:#6366f133}.fmd-visual-area{display:flex;gap:40px;margin-bottom:50px;justify-content:center;padding:20px;background:#fdfcf6;border-radius:24px;box-shadow:inset 0 2px 10px #00000008}.fmd-instruction{position:absolute;left:20px;top:20px;background:#eef2ff;border:1px solid #c7d2fe;padding:15px;border-radius:15px;max-width:300px;z-index:20;box-shadow:0 4px 6px #0000000d}.fmd-frac-box{display:flex;flex-direction:column;align-items:center;min-width:45px;font-family:Gochi Hand,cursive;font-size:32px;color:#1e293b}.fmd-frac-line{width:100%;height:3px;background:#1e293b;margin:4px 0;border-radius:2px}.fmd-frac-input{width:50px;height:50px;text-align:center;font-size:32px;font-family:inherit;border:none;background:transparent;color:#6366f1;border-bottom:2px dashed #cbd5e1;outline:none}.fmd-frac-input:focus{border-bottom:3px solid #6366f1;background:#eef2ff}.fmd-steps{display:flex;flex-direction:column;gap:20px;width:100%}.fmd-step-row{display:flex;align-items:center;gap:20px;padding:15px 20px;background:#fafbfc;border-radius:16px;border:1px solid #e2e8f0;transition:all .3s ease}.fmd-step-row:hover{border-color:#c7d2fe;box-shadow:0 2px 8px #6366f10f}.fmd-step-label{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:75px;flex-shrink:0}.fmd-step-num{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:14px;background:#e2e8f0;color:#94a3b8;transition:all .3s ease}.fmd-step-num.active{background:#6366f1;color:#fff;box-shadow:0 0 0 4px #6366f133;animation:fmd-pulse 2s infinite}.fmd-step-num.done{background:#10b981;color:#fff}.fmd-step-text{font-size:11px;font-weight:700;color:#94a3b8;text-transform:uppercase;letter-spacing:.5px;text-align:center}.fmd-step-content{display:flex;align-items:center;gap:12px;font-family:Gochi Hand,cursive;font-size:32px;color:#1e293b;flex-wrap:wrap}.fmd-input-sm{width:50px;height:45px;text-align:center;font-size:28px;font-family:Gochi Hand,cursive;border:none;background:transparent;color:#6366f1;border-bottom:2px dashed #cbd5e1;outline:none;transition:all .2s ease}.fmd-input-sm:focus{border-bottom:3px solid #6366f1;background:#eef2ff}.fmd-input-sm::placeholder{color:#cbd5e1;font-size:24px}.fmd-correct{color:#10b981!important;border-bottom-color:#10b981!important;background:#10b98114!important}.fmd-flip-arrow{position:absolute;right:-30px;top:50%;transform:translateY(-50%);font-size:20px}.fmd-result-preview{display:flex;align-items:center;gap:8px;margin-left:10px;animation:fadeIn .4s ease}.fmd-finish-card{text-align:center;background:#fff;padding:50px;border-radius:32px;box-shadow:0 20px 40px #0000001a;max-width:600px;margin:100px auto}@keyframes fmd-pulse{0%,to{box-shadow:0 0 0 4px #6366f133}50%{box-shadow:0 0 0 8px #6366f11a}}@media(max-width:768px){.fmd-nav{flex-direction:column;gap:10px}.fmd-board{padding:100px 10px 40px}}@media(max-width:600px){.fmd-step-row{flex-direction:column;gap:10px}.fmd-step-label{flex-direction:row;min-width:unset}.fmd-step-content{font-size:24px;gap:8px}.fmd-input-sm{width:35px;height:35px;font-size:20px}.fmd-instruction{position:relative;left:0;top:0;max-width:100%;margin-bottom:15px}}.fpb-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#ede9fe,#f0f9ff,#ecfdf5);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.fpb-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.fpb-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.fpb-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px;position:relative}.fpb-instruction{background:linear-gradient(135deg,#eff6ff,#e0f2fe);border:1px solid #bfdbfe;padding:16px 20px;border-radius:16px;margin-bottom:30px}.fpb-instruction h5{margin:0 0 6px;color:#1d4ed8;font-size:14px}.fpb-instruction p{margin:0;font-size:14px;color:#1e40af;line-height:1.5}.fpb-setup{display:flex;flex-direction:column;align-items:center;gap:25px}.fpb-mode-toggle{display:flex;gap:10px;background:#f1f5f9;padding:6px;border-radius:14px}.fpb-mode-btn{padding:12px 28px;border:none;border-radius:10px;font-weight:700;font-size:15px;cursor:pointer;transition:all .3s ease;background:transparent;color:#64748b}.fpb-mode-btn.active{background:#7c3aed;color:#fff;box-shadow:0 4px 15px #7c3aed4d}.fpb-input-row{display:flex;align-items:center;gap:15px;flex-wrap:wrap;justify-content:center}.fpb-number-input{width:120px;padding:14px;border:3px solid #e2e8f0;border-radius:14px;font-size:24px;font-weight:800;text-align:center;outline:none;transition:border-color .3s;color:#1e293b}.fpb-number-input:focus{border-color:#7c3aed;box-shadow:0 0 0 4px #7c3aed1a}.fpb-number-input::placeholder{color:#cbd5e1}.fpb-and-label{font-size:20px;font-weight:700;color:#94a3b8}.fpb-start-btn{padding:16px 40px;background:linear-gradient(135deg,#7c3aed,#6d28d9);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #7c3aed59;transition:all .3s ease;margin-top:10px}.fpb-start-btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px #7c3aed73}.factor-tree-section{display:flex;gap:60px;justify-content:center;flex-wrap:wrap;margin-top:20px}.factor-tree-wrapper{display:flex;flex-direction:column;align-items:center;min-width:200px}.factor-tree-title{font-size:18px;font-weight:800;margin-bottom:20px;padding:8px 20px;border-radius:10px}.factor-tree-title.tree-a{background:#fef3c7;color:#92400e;border:2px solid #f59e0b}.factor-tree-title.tree-b{background:#dbeafe;color:#1e40af;border:2px solid #3b82f6}.tree-container{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px}.tree-level{display:flex;align-items:center;gap:20px;position:relative}.tree-node{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:800;position:relative;transition:all .3s ease}.tree-node.given{background:#f1f5f9;color:#475569;border:3px solid #cbd5e1}.tree-node.prime{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:3px solid #059669;box-shadow:0 4px 12px #10b9814d;animation:popIn .4s ease}.tree-node.input-node{border:3px dashed #7c3aed;background:#faf5ff;cursor:text}.tree-node.input-node.active{border-color:#7c3aed;box-shadow:0 0 0 4px #7c3aed26;animation:pulse-border 1.5s infinite}.tree-node.correct{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-color:#059669;animation:popIn .4s ease}.tree-node.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.tree-node input{width:100%;height:100%;border:none;background:transparent;text-align:center;font-size:18px;font-weight:800;outline:none;color:#7c3aed;border-radius:50%}.tree-connector{position:absolute;width:2px;height:20px;background:#cbd5e1;top:-16px;left:50%;transform:translate(-50%)}.tree-branch-lines{display:flex;justify-content:center;position:relative;height:30px;width:100%}.tree-branch-line{position:absolute;height:2px;background:#94a3b8;top:0}.tree-branch-line.left{transform-origin:right center;transform:rotate(30deg)}.tree-branch-line.right{transform-origin:left center;transform:rotate(-30deg)}.tree-branch-svg{width:100%;height:30px;overflow:visible}.prime-factors-section{margin-top:30px;padding:25px;background:linear-gradient(135deg,#faf5ff,#f5f3ff);border-radius:18px;border:2px solid #ddd6fe}.prime-factors-header{font-size:16px;font-weight:800;color:#6d28d9;margin-bottom:15px;text-align:center}.prime-factors-row{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:10px;flex-wrap:wrap}.prime-chip{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:10px;font-weight:800;font-size:16px}.prime-chip.a-color{background:#fef3c7;color:#92400e;border:2px solid #f59e0b}.prime-chip.b-color{background:#dbeafe;color:#1e40af;border:2px solid #3b82f6}.prime-chip.common{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:2px solid #059669;box-shadow:0 2px 8px #10b9814d}.multiply-sign{font-size:18px;color:#94a3b8;font-weight:700}.fpb-results{display:flex;gap:20px;justify-content:center;margin-top:25px;flex-wrap:wrap}.result-card{background:#fff;border-radius:18px;padding:20px 30px;text-align:center;border:3px solid transparent;min-width:180px;transition:all .3s ease}.result-card.fpb-card{border-color:#f59e0b;box-shadow:0 4px 20px #f59e0b26}.result-card.kpk-card{border-color:#3b82f6;box-shadow:0 4px 20px #3b82f626}.result-card h3{margin:0 0 5px;font-size:14px;color:#64748b;text-transform:uppercase;letter-spacing:1px}.result-card .result-input-box{width:90px;padding:10px;border:3px solid #e2e8f0;border-radius:12px;font-size:28px;font-weight:800;text-align:center;outline:none;color:#1e293b;transition:all .3s}.result-card .result-input-box:focus{border-color:#7c3aed}.result-card .result-input-box.correct{border-color:#10b981;background:#ecfdf5;color:#059669}.result-card .result-input-box.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.result-card .result-value{font-size:36px;font-weight:900;color:#10b981}.division-table{border-collapse:collapse;margin:20px auto}.division-table td{padding:8px 16px;font-size:20px;font-weight:700;text-align:center;border:none}.division-table .divider-col{border-right:3px solid #7c3aed;color:#7c3aed}.division-table .number-col{border-bottom:2px solid #e2e8f0}.division-table input{width:60px;padding:6px;border:2px dashed #7c3aed;border-radius:8px;font-size:18px;font-weight:700;text-align:center;outline:none;background:#faf5ff}.division-table input.correct{border-color:#10b981;background:#ecfdf5;color:#059669;border-style:solid}.division-table input.wrong{border-color:#ef4444;background:#fef2f2}.fpb-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.fpb-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:500px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.fpb-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.fpb-summary-card p{font-size:16px;color:#64748b;line-height:1.6}.fpb-summary-results{display:flex;gap:20px;justify-content:center;margin:25px 0}.fpb-summary-item{padding:15px 25px;border-radius:14px;font-weight:800;font-size:20px}.fpb-summary-item.fpb-color{background:#fef3c7;color:#92400e;border:2px solid #f59e0b}.fpb-summary-item.kpk-color{background:#dbeafe;color:#1e40af;border:2px solid #3b82f6}.fpb-summary-btns{display:flex;gap:15px;justify-content:center;margin-top:20px}.fpb-summary-btns button{padding:14px 28px;border:none;border-radius:12px;font-weight:700;font-size:16px;cursor:pointer;transition:all .3s}.fpb-step-indicator{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.fpb-step-dot{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;transition:all .3s ease}.fpb-step-dot.completed{background:#10b981;color:#fff}.fpb-step-dot.active{background:#7c3aed;color:#fff;box-shadow:0 0 0 4px #7c3aed33}.fpb-step-dot.pending{background:#f1f5f9;color:#94a3b8}@keyframes pulse-border{0%,to{box-shadow:0 0 0 4px #7c3aed1a}50%{box-shadow:0 0 0 8px #7c3aed33}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes glow{0%,to{box-shadow:0 0 5px #10b9814d}50%{box-shadow:0 0 20px #10b98199}}@media(max-width:768px){.fpb-board{padding:20px}.factor-tree-section{gap:30px}.fpb-results,.fpb-summary-results{flex-direction:column;align-items:center}}@media(max-width:480px){.fpb-container{padding:10px}.fpb-number-input{width:90px;font-size:20px}.tree-node{width:42px;height:42px;font-size:15px}}.numline-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#ecfdf5,#f0f9ff,#ede9fe);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.numline-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.numline-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.numline-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px}.numline-instruction{background:linear-gradient(135deg,#ecfdf5,#d1fae5);border:1px solid #6ee7b7;padding:16px 20px;border-radius:16px;margin-bottom:25px}.numline-instruction h5{margin:0 0 6px;color:#065f46;font-size:14px}.numline-instruction p{margin:0;font-size:14px;color:#047857;line-height:1.5}.numline-question{text-align:center;margin-bottom:30px}.numline-expression{font-size:52px;font-weight:900;color:#1e293b;letter-spacing:2px}.numline-expression .num-positive{color:#3b82f6}.numline-expression .num-negative{color:#ef4444}.numline-expression .num-operator{color:#64748b;margin:0 10px}.numline-svg-wrapper{width:100%;overflow-x:auto;padding:20px 0;margin-bottom:30px}.numline-svg-wrapper svg{display:block;margin:0 auto}.numline-tick{stroke:#cbd5e1;stroke-width:2}.numline-tick-label{fill:#64748b;font-size:13px;font-weight:600;font-family:Nunito,sans-serif}.numline-tick-label.zero{fill:#1e293b;font-size:16px;font-weight:800}.numline-tick-label.highlight-start{fill:#3b82f6;font-size:15px;font-weight:800}.numline-tick-label.highlight-end{fill:#10b981;font-size:15px;font-weight:800}.numline-axis{stroke:#94a3b8;stroke-width:3}.numline-arrow-marker{fill:#94a3b8}.jump-arrow{fill:none;stroke-width:3;stroke-linecap:round}.jump-arrow.positive{stroke:#3b82f6}.jump-arrow.negative{stroke:#ef4444}.jump-arrowhead{stroke:none}.jump-arrowhead.positive{fill:#3b82f6}.jump-arrowhead.negative{fill:#ef4444}.jump-label{font-size:14px;font-weight:800;font-family:Nunito,sans-serif}.jump-label.positive{fill:#3b82f6}.jump-label.negative{fill:#ef4444}.numline-dot{transition:all .5s ease}.numline-dot.start-dot{fill:#3b82f6;filter:drop-shadow(0 2px 4px rgba(59,130,246,.4))}.numline-dot.end-dot{fill:#10b981;filter:drop-shadow(0 2px 4px rgba(16,185,129,.4))}.numline-answer-area{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:30px}.numline-answer-label{font-size:22px;font-weight:800;color:#475569}.numline-answer-input{width:100px;padding:14px;border:3px solid #e2e8f0;border-radius:14px;font-size:28px;font-weight:800;text-align:center;outline:none;color:#1e293b;transition:all .3s}.numline-answer-input:focus{border-color:#10b981;box-shadow:0 0 0 4px #10b98126}.numline-answer-input.correct{border-color:#10b981;background:#ecfdf5;color:#059669}.numline-answer-input.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.numline-progress{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.numline-progress-dot{width:14px;height:14px;border-radius:50%;transition:all .3s}.numline-progress-dot.done{background:#10b981;box-shadow:0 2px 6px #10b9814d}.numline-progress-dot.current{background:#7c3aed;box-shadow:0 0 0 3px #7c3aed33;animation:pulse-border 1.5s infinite}.numline-progress-dot.pending{background:#e2e8f0}.op-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:8px;font-size:13px;font-weight:700}.op-badge.add{background:#dbeafe;color:#1d4ed8}.op-badge.sub{background:#fef3c7;color:#92400e}.numline-setup{display:flex;flex-direction:column;align-items:center;gap:25px}.numline-difficulty{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.diff-btn{padding:12px 24px;border:2px solid #e2e8f0;border-radius:12px;background:#fff;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s;color:#64748b}.diff-btn.active{border-color:#10b981;background:#ecfdf5;color:#065f46;box-shadow:0 4px 12px #10b98133}.numline-start-btn{padding:16px 40px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #10b98159;transition:all .3s ease}.numline-start-btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px #10b98173}.numline-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.numline-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.numline-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.numline-summary-card p{font-size:16px;color:#64748b;line-height:1.6}.numline-summary-stats{display:flex;gap:15px;justify-content:center;margin:20px 0}.numline-summary-stat{padding:12px 20px;border-radius:12px;font-weight:700}.numline-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:20px}.numline-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer;transition:all .3s}@keyframes jumpArc{0%{opacity:0;stroke-dashoffset:100}to{opacity:1;stroke-dashoffset:0}}@keyframes pulse-border{0%,to{box-shadow:0 0 0 3px #7c3aed33}50%{box-shadow:0 0 0 6px #7c3aed4d}}@media(max-width:768px){.numline-board{padding:20px}.numline-expression{font-size:36px}.numline-answer-input{width:80px;font-size:24px}}@media(max-width:480px){.numline-container{padding:10px}.numline-expression{font-size:28px}}.addsub-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#fff7ed,#fef3c7,#fef9c3);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.addsub-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.addsub-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.addsub-board-paper{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px;position:relative;display:flex;gap:30px;flex-wrap:wrap}.addsub-instruction{background:linear-gradient(135deg,#fff7ed,#ffedd5);border:1px solid #fed7aa;padding:16px 20px;border-radius:16px;margin-bottom:20px;width:100%}.addsub-instruction h5{margin:0 0 6px;color:#c2410c;font-size:14px}.addsub-instruction p{margin:0;font-size:14px;color:#ea580c;line-height:1.5}.addsub-grid-area{flex:1;min-width:350px;display:flex;flex-direction:column;align-items:center}.addsub-grid-container{position:relative;display:inline-block}.addsub-digit-cell{position:absolute;display:flex;align-items:center;justify-content:center;border:2px solid #e2e8f0;border-radius:8px;font-size:24px;font-weight:800;color:#1e293b;background:#f8fafc;transition:all .3s ease}.addsub-digit-cell.given{background:#fff;border-color:#cbd5e1}.addsub-digit-cell.input-cell{border:2px dashed #f59e0b;background:#fffbeb;cursor:text}.addsub-digit-cell.input-cell.active{border-color:#f59e0b;box-shadow:0 0 0 4px #f59e0b26;animation:pulse-amber 1.5s infinite}.addsub-digit-cell.correct{background:#ecfdf5;border-color:#10b981;color:#059669;animation:popIn .3s ease}.addsub-digit-cell.wrong{background:#fef2f2;border-color:#ef4444;color:#ef4444;animation:shake .4s ease}.addsub-digit-cell input{width:100%;height:100%;border:none;background:transparent;text-align:center;font-size:24px;font-weight:800;outline:none;color:#f59e0b}.addsub-carry{position:absolute;font-size:14px;font-weight:800;color:#ef4444;background:#fef2f2;border:1px solid #fca5a5;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;animation:popIn .3s ease;z-index:5}.addsub-borrow{position:absolute;font-size:12px;font-weight:800;color:#3b82f6;z-index:5;animation:popIn .3s ease}.addsub-op-sign{position:absolute;font-size:28px;font-weight:900;color:#f59e0b}.addsub-result-line{position:absolute;height:3px;background:#1e293b;border-radius:2px}.addsub-scratch{width:250px;min-width:200px}.addsub-scratch h4{margin:0 0 10px;color:#475569;font-size:15px}.addsub-scratch-input{width:100%;height:200px;border:2px solid #e2e8f0;border-radius:14px;padding:14px;font-size:16px;font-family:Gochi Hand,cursive;resize:none;outline:none;background:#fffef5;background-image:repeating-linear-gradient(transparent,transparent 27px,#e8e5d8 27px,#e8e5d8 28px);line-height:28px}.addsub-scratch-input:focus{border-color:#f59e0b}.addsub-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.addsub-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.addsub-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.addsub-summary-card p{font-size:16px;color:#64748b;line-height:1.6}.addsub-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:25px}.addsub-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer;transition:all .3s}.addsub-mode-toggle{display:flex;gap:10px;background:#f1f5f9;padding:6px;border-radius:14px}.addsub-mode-btn{padding:12px 28px;border:none;border-radius:10px;font-weight:700;font-size:15px;cursor:pointer;transition:all .3s ease;background:transparent;color:#64748b}.addsub-mode-btn.active{background:#f59e0b;color:#fff;box-shadow:0 4px 15px #f59e0b4d}.addsub-start-btn{padding:16px 40px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #f59e0b59;transition:all .3s ease}.addsub-start-btn:hover{transform:translateY(-2px)}.addsub-board-scaler{transform-origin:top center}@keyframes pulse-amber{0%,to{box-shadow:0 0 0 4px #f59e0b1a}50%{box-shadow:0 0 0 8px #f59e0b33}}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@media(max-width:768px){.addsub-board-paper{padding:20px;flex-direction:column}.addsub-scratch{width:100%}.addsub-grid-area{min-width:280px}}@media(max-width:480px){.addsub-container{padding:10px}}.clock-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#f0f9ff,#e0f2fe,#dbeafe);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.clock-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.clock-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.clock-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px}.clock-instruction{background:linear-gradient(135deg,#f0f9ff,#dbeafe);border:1px solid #93c5fd;padding:16px 20px;border-radius:16px;margin-bottom:25px}.clock-instruction h5{margin:0 0 6px;color:#1d4ed8;font-size:14px}.clock-instruction p{margin:0;font-size:14px;color:#1e40af;line-height:1.5}.analog-clock-wrapper{display:flex;justify-content:center;margin:30px 0}.analog-clock svg{filter:drop-shadow(0 8px 25px rgba(0,0,0,.1))}.clock-face{fill:#fff;stroke:#1e293b;stroke-width:4}.clock-center-dot{fill:#1e293b}.clock-hand-hour{stroke:#1e293b;stroke-width:6;stroke-linecap:round;transition:transform .5s ease}.clock-hand-minute{stroke:#3b82f6;stroke-width:4;stroke-linecap:round;transition:transform .5s ease}.clock-tick-major{stroke:#1e293b;stroke-width:3}.clock-tick-minor{stroke:#cbd5e1;stroke-width:1.5}.clock-number{fill:#475569;font-size:18px;font-weight:700;font-family:Nunito,sans-serif;text-anchor:middle;dominant-baseline:central}.clock-answer-area{display:flex;align-items:center;justify-content:center;gap:12px;margin:25px 0;flex-wrap:wrap}.clock-answer-label{font-size:20px;font-weight:800;color:#475569}.clock-time-input{width:70px;padding:12px;border:3px solid #e2e8f0;border-radius:12px;font-size:28px;font-weight:800;text-align:center;outline:none;color:#1e293b;transition:all .3s}.clock-time-input:focus{border-color:#3b82f6;box-shadow:0 0 0 4px #3b82f626}.clock-time-input.correct{border-color:#10b981;background:#ecfdf5;color:#059669}.clock-time-input.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.clock-colon{font-size:32px;font-weight:900;color:#1e293b}.clock-duration-display{display:flex;align-items:center;justify-content:center;gap:15px;margin:20px 0;font-size:28px;font-weight:800;color:#475569}.clock-duration-time{padding:12px 20px;background:#f0f9ff;border:2px solid #93c5fd;border-radius:12px;color:#1d4ed8}.clock-progress{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.clock-progress-dot{width:14px;height:14px;border-radius:50%;transition:all .3s}.clock-progress-dot.done{background:#10b981}.clock-progress-dot.current{background:#3b82f6;animation:pulse-blue 1.5s infinite}.clock-progress-dot.pending{background:#e2e8f0}.clock-mode-toggle{display:flex;gap:10px;background:#f1f5f9;padding:6px;border-radius:14px}.clock-mode-btn{padding:12px 24px;border:none;border-radius:10px;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s ease;background:transparent;color:#64748b}.clock-mode-btn.active{background:#3b82f6;color:#fff;box-shadow:0 4px 15px #3b82f64d}.clock-start-btn{padding:16px 40px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #3b82f659;transition:all .3s ease}.clock-start-btn:hover{transform:translateY(-2px)}.clock-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.clock-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.clock-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.clock-summary-card p{font-size:16px;color:#64748b;line-height:1.6}.clock-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:25px}.clock-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer}@keyframes pulse-blue{0%,to{box-shadow:0 0 0 3px #3b82f633}50%{box-shadow:0 0 0 6px #3b82f64d}}@media(max-width:768px){.clock-board{padding:20px}}.pattern-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#fdf4ff,#fae8ff,#f5f3ff);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.pattern-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.pattern-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.pattern-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px}.pattern-instruction{background:linear-gradient(135deg,#fdf4ff,#fae8ff);border:1px solid #e9d5ff;padding:16px 20px;border-radius:16px;margin-bottom:25px}.pattern-instruction h5{margin:0 0 6px;color:#7e22ce;font-size:14px}.pattern-instruction p{margin:0;font-size:14px;color:#9333ea;line-height:1.5}.pattern-sequence{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:30px 0}.pattern-card{width:70px;height:70px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:900;transition:all .3s ease;position:relative}.pattern-card.given{background:linear-gradient(135deg,#f5f3ff,#ede9fe);border:3px solid #c4b5fd;color:#5b21b6}.pattern-card.answer-slot{border:3px dashed #a855f7;background:#faf5ff;cursor:text}.pattern-card.answer-slot.active{border-color:#a855f7;box-shadow:0 0 0 4px #a855f726;animation:pulse-purple 1.5s infinite}.pattern-card.correct{background:linear-gradient(135deg,#ecfdf5,#d1fae5);border-color:#10b981;color:#059669;animation:popIn .4s ease}.pattern-card.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.pattern-card input{width:100%;height:100%;border:none;background:transparent;text-align:center;font-size:22px;font-weight:900;outline:none;color:#a855f7;border-radius:14px}.pattern-diff-row{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:20px}.pattern-diff-arrow{display:flex;flex-direction:column;align-items:center;width:70px}.pattern-diff-arrow .arrow-line{width:30px;height:2px;background:#d8b4fe;position:relative}.pattern-diff-arrow .arrow-line:after{content:"↓";position:absolute;left:50%;top:-12px;transform:translate(-50%);color:#d8b4fe;font-size:16px}.pattern-diff-value{font-size:14px;font-weight:700;color:#a855f7;background:#faf5ff;padding:2px 8px;border-radius:6px;border:1px solid #e9d5ff}.pattern-type-badge{display:inline-flex;padding:6px 16px;border-radius:20px;font-size:13px;font-weight:700;margin-bottom:20px}.pattern-type-badge.arithmetic{background:#dbeafe;color:#1d4ed8}.pattern-type-badge.geometric{background:#fef3c7;color:#92400e}.pattern-type-badge.fibonacci{background:#ecfdf5;color:#065f46}.pattern-type-badge.square{background:#fce7f3;color:#9d174d}.pattern-progress{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.pattern-progress-dot{width:14px;height:14px;border-radius:50%;transition:all .3s}.pattern-progress-dot.done{background:#10b981}.pattern-progress-dot.current{background:#a855f7;animation:pulse-purple 1.5s infinite}.pattern-progress-dot.pending{background:#e2e8f0}.pattern-difficulty{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.pattern-diff-btn{padding:12px 24px;border:2px solid #e2e8f0;border-radius:12px;background:#fff;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s;color:#64748b}.pattern-diff-btn.active{border-color:#a855f7;background:#faf5ff;color:#7e22ce;box-shadow:0 4px 12px #a855f733}.pattern-start-btn{padding:16px 40px;background:linear-gradient(135deg,#a855f7,#7c3aed);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #a855f759;transition:all .3s ease}.pattern-start-btn:hover{transform:translateY(-2px)}.pattern-hint{background:#fffbeb;border:1px solid #fcd34d;padding:12px 18px;border-radius:12px;margin-top:20px;text-align:center;animation:slideDown .3s ease}.pattern-hint p{margin:0;font-size:14px;color:#92400e;font-weight:600}.pattern-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.pattern-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.pattern-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.pattern-summary-card p{font-size:16px;color:#64748b;line-height:1.6}.pattern-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:25px}.pattern-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer}@keyframes pulse-purple{0%,to{box-shadow:0 0 0 4px #a855f71a}50%{box-shadow:0 0 0 8px #a855f733}}@media(max-width:768px){.pattern-board{padding:20px}.pattern-card{width:55px;height:55px;font-size:20px}.pattern-card input{font-size:18px}}@media(max-width:480px){.pattern-container{padding:10px}.pattern-card{width:48px;height:48px;font-size:18px}}.counting-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#fef3c7,#ffedd5,#fce7f3);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.counting-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.counting-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.counting-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px}.counting-instruction{background:linear-gradient(135deg,#fef3c7,#ffedd5);border:1px solid #fed7aa;padding:16px 20px;border-radius:16px;margin-bottom:25px}.counting-instruction h5{margin:0 0 6px;color:#c2410c;font-size:14px}.counting-instruction p{margin:0;font-size:14px;color:#ea580c;line-height:1.5}.counting-objects{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:30px 0;padding:30px;background:#fffbeb;border-radius:20px;border:2px dashed #fcd34d}.counting-object{font-size:40px;transition:all .3s ease;cursor:default;animation:bounceIn .3s ease backwards}.counting-object:hover{transform:scale(1.2)}.counting-answer-area{display:flex;align-items:center;justify-content:center;gap:15px;margin:25px 0}.counting-answer-label{font-size:22px;font-weight:800;color:#475569}.counting-answer-input{width:100px;padding:14px;border:3px solid #e2e8f0;border-radius:14px;font-size:32px;font-weight:800;text-align:center;outline:none;color:#1e293b;transition:all .3s}.counting-answer-input:focus{border-color:#f59e0b;box-shadow:0 0 0 4px #f59e0b26}.counting-answer-input.correct{border-color:#10b981;background:#ecfdf5;color:#059669}.counting-answer-input.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.counting-mode-toggle{display:flex;gap:10px;background:#f1f5f9;padding:6px;border-radius:14px}.counting-mode-btn{padding:12px 24px;border:none;border-radius:10px;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s ease;background:transparent;color:#64748b}.counting-mode-btn.active{background:#f59e0b;color:#fff;box-shadow:0 4px 15px #f59e0b4d}.counting-start-btn{padding:16px 40px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #f59e0b59;transition:all .3s ease}.counting-start-btn:hover{transform:translateY(-2px)}.counting-progress{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.counting-progress-dot{width:14px;height:14px;border-radius:50%;transition:all .3s}.counting-progress-dot.done{background:#10b981}.counting-progress-dot.current{background:#f59e0b;animation:pulse-amber 1.5s infinite}.counting-progress-dot.pending{background:#e2e8f0}.counting-choices{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:20px 0}.counting-choice-btn{width:70px;height:70px;border-radius:16px;border:3px solid #e2e8f0;background:#fff;font-size:28px;font-weight:900;cursor:pointer;transition:all .2s;color:#1e293b;display:flex;align-items:center;justify-content:center}.counting-choice-btn:hover{border-color:#f59e0b;transform:scale(1.05)}.counting-choice-btn.selected{border-color:#f59e0b;background:#fffbeb;box-shadow:0 4px 12px #f59e0b33}.counting-choice-btn.correct{border-color:#10b981;background:#ecfdf5;color:#059669;animation:popIn .3s ease}.counting-choice-btn.wrong{border-color:#ef4444;background:#fef2f2;color:#ef4444;animation:shake .4s ease}.counting-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.counting-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.counting-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.counting-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:25px}.counting-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer}@keyframes bounceIn{0%{transform:scale(0);opacity:0}60%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}@keyframes pulse-amber{0%,to{box-shadow:0 0 0 3px #f59e0b33}50%{box-shadow:0 0 0 6px #f59e0b4d}}@media(max-width:768px){.counting-board{padding:20px}.counting-object{font-size:32px}}@media(max-width:480px){.counting-container{padding:10px}.counting-object{font-size:28px}}.compare-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#dbeafe,#ede9fe,#fce7f3);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.compare-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.compare-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.compare-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px}.compare-instruction{background:linear-gradient(135deg,#ede9fe,#ddd6fe);border:1px solid #c4b5fd;padding:16px 20px;border-radius:16px;margin-bottom:25px}.compare-instruction h5{margin:0 0 6px;color:#6d28d9;font-size:14px}.compare-instruction p{margin:0;font-size:14px;color:#7c3aed;line-height:1.5}.compare-battle{display:flex;align-items:center;justify-content:center;gap:20px;margin:30px 0;flex-wrap:wrap}.compare-number-box{min-width:140px;padding:30px;background:linear-gradient(135deg,#f8fafc,#f1f5f9);border:4px solid #e2e8f0;border-radius:24px;text-align:center;transition:all .3s}.compare-number-box .number{font-size:56px;font-weight:900;color:#1e293b}.compare-number-box .visual-objects{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;margin-top:10px;max-width:130px}.compare-number-box .visual-objects span{font-size:18px}.compare-number-box.left{border-color:#3b82f6;background:linear-gradient(135deg,#eff6ff,#dbeafe)}.compare-number-box.right{border-color:#ec4899;background:linear-gradient(135deg,#fdf2f8,#fce7f3)}.compare-buttons{display:flex;flex-direction:column;gap:12px}.compare-op-btn{width:80px;height:60px;border-radius:16px;border:3px solid #e2e8f0;background:#fff;font-size:32px;font-weight:900;cursor:pointer;transition:all .2s;color:#475569;display:flex;align-items:center;justify-content:center}.compare-op-btn:hover{border-color:#7c3aed;transform:scale(1.05);background:#faf5ff}.compare-op-btn.correct{border-color:#10b981;background:#ecfdf5;color:#059669;animation:popIn .3s ease}.compare-op-btn.wrong{border-color:#ef4444;background:#fef2f2;color:#ef4444;animation:shake .4s ease}.compare-op-btn.selected{border-color:#7c3aed;background:#faf5ff;color:#7c3aed;box-shadow:0 4px 15px #7c3aed33}.compare-progress{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.compare-progress-dot{width:14px;height:14px;border-radius:50%;transition:all .3s}.compare-progress-dot.done{background:#10b981}.compare-progress-dot.current{background:#7c3aed;animation:pulse-purple 1.5s infinite}.compare-progress-dot.pending{background:#e2e8f0}.compare-start-btn{padding:16px 40px;background:linear-gradient(135deg,#7c3aed,#6d28d9);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #7c3aed59;transition:all .3s ease}.compare-start-btn:hover{transform:translateY(-2px)}.compare-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.compare-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.compare-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.compare-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:25px}.compare-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer}@keyframes pulse-purple{0%,to{box-shadow:0 0 0 3px #7c3aed33}50%{box-shadow:0 0 0 6px #7c3aed4d}}@media(max-width:768px){.compare-board{padding:20px}.compare-number-box .number{font-size:40px}}.placevalue-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#ecfdf5,#f0fdf4,#f0f9ff);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.placevalue-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.placevalue-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.placevalue-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px}.placevalue-instruction{background:linear-gradient(135deg,#ecfdf5,#d1fae5);border:1px solid #6ee7b7;padding:16px 20px;border-radius:16px;margin-bottom:25px}.placevalue-instruction h5{margin:0 0 6px;color:#065f46;font-size:14px}.placevalue-instruction p{margin:0;font-size:14px;color:#047857;line-height:1.5}.placevalue-number-display{text-align:center;margin:20px 0}.placevalue-number{font-size:72px;font-weight:900;color:#1e293b;letter-spacing:8px}.placevalue-columns{display:flex;justify-content:center;gap:12px;margin:30px 0;flex-wrap:wrap}.placevalue-column{min-width:100px;border-radius:18px;overflow:hidden;border:3px solid #e2e8f0;transition:all .3s}.placevalue-column .col-header{padding:12px;text-align:center;font-weight:800;font-size:13px;color:#fff;text-transform:uppercase;letter-spacing:1px}.placevalue-column.ribuan .col-header{background:linear-gradient(135deg,#7c3aed,#6d28d9)}.placevalue-column.ratusan .col-header{background:linear-gradient(135deg,#3b82f6,#2563eb)}.placevalue-column.puluhan .col-header{background:linear-gradient(135deg,#10b981,#059669)}.placevalue-column.satuan .col-header{background:linear-gradient(135deg,#f59e0b,#d97706)}.placevalue-column.ribuanpuluh .col-header{background:linear-gradient(135deg,#ec4899,#db2777)}.placevalue-column .col-body{padding:20px;text-align:center;background:#f8fafc}.placevalue-column .col-body input{width:60px;height:60px;border:3px solid #e2e8f0;border-radius:14px;font-size:32px;font-weight:900;text-align:center;outline:none;color:#1e293b;transition:all .3s}.placevalue-column .col-body input:focus{border-color:#10b981;box-shadow:0 0 0 4px #10b98126}.placevalue-column .col-body input.correct{border-color:#10b981;background:#ecfdf5;color:#059669}.placevalue-column .col-body input.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.placevalue-blocks{display:flex;justify-content:center;gap:20px;margin:25px 0;flex-wrap:wrap}.placevalue-block-group{text-align:center}.placevalue-block-group .block-label{font-size:12px;font-weight:700;color:#64748b;margin-bottom:5px}.placevalue-block-visual{display:flex;flex-wrap:wrap;gap:3px;justify-content:center;max-width:120px}.placevalue-block-visual .block{border-radius:4px}.block-1000{width:30px;height:30px;background:linear-gradient(135deg,#c4b5fd,#8b5cf6)}.block-100{width:22px;height:22px;background:linear-gradient(135deg,#93c5fd,#3b82f6)}.block-10{width:6px;height:22px;background:linear-gradient(135deg,#6ee7b7,#10b981)}.block-1{width:10px;height:10px;background:linear-gradient(135deg,#fcd34d,#f59e0b)}.placevalue-compose-row{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:20px 0}.placevalue-compose-chip{padding:10px 16px;border-radius:12px;font-weight:800;font-size:18px;color:#fff}.placevalue-progress{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.placevalue-progress-dot{width:14px;height:14px;border-radius:50%;transition:all .3s}.placevalue-progress-dot.done{background:#10b981}.placevalue-progress-dot.current{background:#10b981;animation:pulse-green 1.5s infinite}.placevalue-progress-dot.pending{background:#e2e8f0}.placevalue-start-btn{padding:16px 40px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #10b98159;transition:all .3s ease}.placevalue-start-btn:hover{transform:translateY(-2px)}.placevalue-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.placevalue-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.placevalue-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.placevalue-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:25px}.placevalue-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer}@keyframes pulse-green{0%,to{box-shadow:0 0 0 3px #10b98133}50%{box-shadow:0 0 0 6px #10b9814d}}@media(max-width:768px){.placevalue-board{padding:20px}.placevalue-number{font-size:48px}.placevalue-column{min-width:80px}}.money-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#f0fdfa,#ccfbf1,#e0f2fe);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.money-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.money-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.money-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px}.money-instruction{background:linear-gradient(135deg,#f0fdfa,#ccfbf1);border:1px solid #5eead4;padding:16px 20px;border-radius:16px;margin-bottom:25px}.money-instruction h5{margin:0 0 6px;color:#0d9488;font-size:14px}.money-instruction p{margin:0;font-size:14px;color:#0f766e;line-height:1.5}.money-items{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;margin:20px 0}.money-item-card{background:#fff;border:3px solid #e2e8f0;border-radius:16px;padding:20px;text-align:center;min-width:150px;animation:popIn .4s ease backwards}.money-item-emoji{font-size:48px;margin-bottom:10px}.money-item-name{font-weight:800;color:#1e293b;margin-bottom:5px}.money-item-price{font-weight:700;color:#10b981;font-size:18px}.money-wallet{display:flex;gap:15px;justify-content:center;margin:30px 0;padding:20px;background:#f8fafc;border-radius:20px;border:2px dashed #cbd5e1;flex-wrap:wrap}.money-bill{padding:15px 25px;border-radius:12px;font-weight:800;font-size:20px;color:#fff;display:flex;align-items:center;justify-content:center;min-width:120px;box-shadow:0 4px 6px #0000001a;border:2px solid rgba(255,255,255,.2);animation:popIn .3s ease}.money-bill.rp1000{background:linear-gradient(135deg,#fbbf24,#d97706)}.money-bill.rp2000{background:linear-gradient(135deg,#e4e4e7,#a1a1aa);color:#3f3f46}.money-bill.rp5000{background:linear-gradient(135deg,#fcd34d,#d97706)}.money-bill.rp10000{background:linear-gradient(135deg,#c084fc,#9333ea)}.money-bill.rp20000{background:linear-gradient(135deg,#4ade80,#16a34a)}.money-bill.rp50000{background:linear-gradient(135deg,#60a5fa,#2563eb)}.money-bill.rp100000{background:linear-gradient(135deg,#f87171,#dc2626)}.money-answer-area{display:flex;flex-direction:column;gap:20px;align-items:center;margin-top:30px}.money-input-group{display:flex;align-items:center;gap:10px;background:#f1f5f9;padding:15px 25px;border-radius:16px;width:100%;max-width:400px;justify-content:space-between}.money-input-label{font-size:16px;font-weight:800;color:#475569}.money-input-wrapper{display:flex;align-items:center;gap:5px}.money-input-currency{font-weight:800;color:#1e293b;font-size:20px}.money-input{width:130px;padding:12px;border:3px solid #cbd5e1;border-radius:12px;font-size:22px;font-weight:800;text-align:right;outline:none;transition:all .3s}.money-input:focus{border-color:#0d9488;box-shadow:0 0 0 4px #0d948826}.money-input.correct{border-color:#10b981;background:#ecfdf5;color:#059669}.money-input.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.money-progress{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.money-progress-dot{width:14px;height:14px;border-radius:50%;transition:all .3s}.money-progress-dot.done{background:#10b981}.money-progress-dot.current{background:#0d9488;animation:pulse-teal 1.5s infinite}.money-progress-dot.pending{background:#e2e8f0}.money-start-btn{padding:16px 40px;background:linear-gradient(135deg,#0d9488,#0f766e);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #0d948859;transition:all .3s ease}.money-start-btn:hover{transform:translateY(-2px)}.money-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.money-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.money-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.money-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:25px}.money-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer}@keyframes pulse-teal{0%,to{box-shadow:0 0 0 3px #0d948833}50%{box-shadow:0 0 0 6px #0d94884d}}@media(max-width:768px){.money-board{padding:20px}.money-input-group{flex-direction:column;align-items:stretch;text-align:center}.money-input-wrapper{justify-content:center}}.ruler-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#fdf4ff,#fae8ff,#fef2f2);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.ruler-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.ruler-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.ruler-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px}.ruler-instruction{background:linear-gradient(135deg,#fae8ff,#f3e8ff);border:1px solid #d8b4fe;padding:16px 20px;border-radius:16px;margin-bottom:25px}.ruler-instruction h5{margin:0 0 6px;color:#9333ea;font-size:14px}.ruler-instruction p{margin:0;font-size:14px;color:#7e22ce;line-height:1.5}.ruler-workspace{position:relative;margin:40px 0;padding:20px;background:#f8fafc;border-radius:20px;border:2px dashed #cbd5e1;-webkit-user-select:none;user-select:none}.ruler-object-area{height:100px;position:relative;margin-bottom:10px;display:flex;align-items:flex-end}.ruler-object{position:absolute;height:60px;font-size:50px;display:flex;align-items:center;justify-content:space-between;overflow:hidden;background:linear-gradient(90deg,#ef44441a,#ef444433);border:3px solid #ef4444;border-radius:8px;border-left:6px solid #b91c1c;border-right:6px solid #b91c1c;box-shadow:0 5px 15px #0000001a;transition:all .5s ease-out}.ruler-object-center{position:absolute;left:0;right:0;text-align:center;font-size:30px;letter-spacing:5px;opacity:.5;overflow:hidden;white-space:nowrap;line-height:60px}.ruler-tool-wrapper{width:100%;overflow-x:auto;overflow-y:hidden;background:#00000005;border-radius:12px}.svg-ruler{display:block;border-left:4px solid #1e293b;border-bottom:2px solid #94a3b8;border-right:4px solid #1e293b;background:#ffffffe6;border-radius:4px;box-shadow:0 4px 6px #0000000d}.ruler-guide{position:absolute;top:0;bottom:-30px;width:4px;border-left:3px dashed #3b82f6;z-index:10;opacity:0;pointer-events:none;transition:opacity .3s}.ruler-guide.show{opacity:.7}.ruler-guide-box{position:absolute;bottom:-45px;transform:translate(-50%);background:#eff6ff;color:#1d4ed8;padding:4px 8px;border-radius:6px;font-weight:800;font-size:14px;border:2px solid #bfdbfe;opacity:0;transition:opacity .3s}.ruler-guide-box.show{opacity:1}.ruler-answer-area{display:flex;align-items:center;justify-content:center;gap:15px;margin:40px 0 20px}.ruler-answer-input{width:120px;padding:14px;border:3px solid #e2e8f0;border-radius:14px;font-size:30px;font-weight:800;text-align:center;outline:none;color:#1e293b;transition:all .3s}.ruler-answer-input:focus{border-color:#d946ef;box-shadow:0 0 0 4px #d946ef26}.ruler-answer-input.correct{border-color:#10b981;background:#ecfdf5;color:#059669}.ruler-answer-input.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.ruler-answer-label{font-size:24px;font-weight:800;color:#475569}.ruler-progress{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.ruler-progress-dot{width:14px;height:14px;border-radius:50%;transition:all .3s}.ruler-progress-dot.done{background:#10b981}.ruler-progress-dot.current{background:#d946ef;animation:pulse-fuchsia 1.5s infinite}.ruler-progress-dot.pending{background:#e2e8f0}.ruler-start-btn{padding:16px 40px;background:linear-gradient(135deg,#d946ef,#c026d3);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #d946ef59;transition:all .3s ease}.ruler-start-btn:hover{transform:translateY(-2px)}.ruler-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.ruler-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.ruler-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.ruler-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:25px}.ruler-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer}@keyframes pulse-fuchsia{0%,to{box-shadow:0 0 0 3px #d946ef33}50%{box-shadow:0 0 0 6px #d946ef4d}}@media(max-width:768px){.ruler-board{padding:20px}}.areaperimeter-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#e0e7ff,#c7d2fe,#eff6ff);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.areaperimeter-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.areaperimeter-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.areaperimeter-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px}.areaperimeter-instruction{background:linear-gradient(135deg,#e0e7ff,#c7d2fe);border:1px solid #818cf8;padding:16px 20px;border-radius:16px;margin-bottom:25px}.areaperimeter-instruction h5{margin:0 0 6px;color:#4f46e5;font-size:14px}.areaperimeter-instruction p{margin:0;font-size:14px;color:#4338ca;line-height:1.5}.areaperimeter-shapes{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:30px}.areaperimeter-shape-btn{padding:12px 20px;border:2px solid #e2e8f0;border-radius:12px;background:#fff;font-weight:700;font-size:14px;cursor:pointer;color:#64748b;transition:all .3s}.areaperimeter-shape-btn:hover{border-color:#6366f1;background:#eef2ff}.areaperimeter-shape-btn.active{border-color:#4f46e5;background:#e0e7ff;color:#4338ca;box-shadow:0 4px 10px #4f46e533}.areaperimeter-workspace{display:flex;gap:40px;align-items:flex-start;justify-content:center;flex-wrap:wrap}.areaperimeter-visual{position:relative;width:300px;height:300px;background:#f8fafc;border:2px dashed #cbd5e1;border-radius:20px;display:flex;align-items:center;justify-content:center;animation:popIn .5s ease}.areaperimeter-visual svg{overflow:visible;filter:drop-shadow(0 10px 15px rgba(0,0,0,.1))}.svg-label{font-size:14px;font-weight:800;fill:#1e293b;background:#fff}.areaperimeter-calc{flex:1;min-width:300px}.areaperimeter-calc-box{background:#fff;border:3px solid #e2e8f0;border-radius:20px;padding:25px;margin-bottom:20px}.areaperimeter-calc-title{margin:0 0 15px;font-size:18px;color:#1e293b;display:flex;justify-content:space-between;align-items:center}.badge{font-size:12px;padding:4px 10px;border-radius:10px;color:#fff;background:#94a3b8}.badge.keliling{background:#10b981}.badge.luas{background:#f59e0b}.areaperimeter-step{display:flex;align-items:center;gap:10px;margin-bottom:15px;flex-wrap:wrap;font-size:18px;font-weight:700;color:#475569}.areaperimeter-input{width:80px;padding:10px;border:3px solid #e2e8f0;border-radius:10px;font-size:20px;font-weight:800;text-align:center;outline:none;color:#1e293b;transition:all .3s}.areaperimeter-input:focus{border-color:#6366f1;box-shadow:0 0 0 4px #6366f126}.areaperimeter-input.correct{border-color:#10b981;background:#ecfdf5;color:#059669}.areaperimeter-input.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.areaperimeter-start-btn{padding:16px 40px;background:linear-gradient(135deg,#4f46e5,#4338ca);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #4f46e559;transition:all .3s ease}.areaperimeter-start-btn:hover{transform:translateY(-2px)}.areaperimeter-progress{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.areaperimeter-progress-dot{width:14px;height:14px;border-radius:50%;transition:all .3s}.areaperimeter-progress-dot.done{background:#10b981}.areaperimeter-progress-dot.current{background:#4f46e5;animation:pulse-indigo 1.5s infinite}.areaperimeter-progress-dot.pending{background:#e2e8f0}.areaperimeter-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.areaperimeter-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.areaperimeter-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.areaperimeter-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:25px}.areaperimeter-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer}@keyframes pulse-indigo{0%,to{box-shadow:0 0 0 3px #4f46e533}50%{box-shadow:0 0 0 6px #4f46e54d}}@media(max-width:768px){.areaperimeter-board{padding:20px}.areaperimeter-workspace{flex-direction:column;align-items:center}}.chart-container{min-height:100vh;padding:20px;background:linear-gradient(135deg,#e0f2fe,#bae6fd,#fef08a);font-family:Nunito,Segoe UI,sans-serif;display:flex;flex-direction:column;align-items:center}.chart-nav{width:100%;max-width:900px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.chart-nav .stat-badge{background:#fff;border:2px solid #e2e8f0;padding:10px 20px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;color:#475569}.chart-board{width:100%;max-width:900px;background:#fff;border-radius:24px;box-shadow:0 20px 60px #00000014;padding:40px}.chart-instruction{background:linear-gradient(135deg,#e0f2fe,#bae6fd);border:1px solid #7dd3fc;padding:16px 20px;border-radius:16px;margin-bottom:25px}.chart-instruction h5{margin:0 0 6px;color:#0284c7;font-size:14px}.chart-instruction p{margin:0;font-size:14px;color:#0369a1;line-height:1.5}.chart-read-workspace{display:flex;flex-direction:column;align-items:center;gap:20px;margin-top:20px}.chart-visual-area{width:100%;max-width:600px;height:350px;background:#fff;border:2px solid #e2e8f0;border-radius:16px;padding:20px;position:relative}.bar-rect{transition:height .5s ease,y .5s ease;fill:#3b82f6}.bar-rect:hover{fill:#2563eb;cursor:pointer}.bar-text{font-size:12px;font-weight:700;fill:#475569;text-anchor:middle}.axis-line{stroke:#cbd5e1;stroke-width:2}.chart-quiz-area{background:#f8fafc;border:2px solid #cbd5e1;border-radius:16px;padding:25px;width:100%;max-width:600px;display:flex;flex-direction:column;gap:15px}.chart-quiz-q{font-size:18px;font-weight:800;color:#1e293b}.chart-quiz-input{width:120px;padding:12px;border:3px solid #cbd5e1;border-radius:12px;font-size:22px;font-weight:800;text-align:center;outline:none;transition:all .3s}.chart-quiz-input:focus{border-color:#0284c7;box-shadow:0 0 0 4px #0284c726}.chart-quiz-input.correct{border-color:#10b981;background:#ecfdf5;color:#059669}.chart-quiz-input.wrong{border-color:#ef4444;background:#fef2f2;animation:shake .4s ease}.chart-build-workspace{display:flex;gap:30px;flex-wrap:wrap}.chart-data-table{flex:1;min-width:280px}.chart-table{width:100%;border-collapse:collapse}.chart-table th{background:#f1f5f9;padding:12px;text-align:left;font-weight:800;color:#475569;border-bottom:2px solid #cbd5e1}.chart-table td{padding:8px;border-bottom:1px solid #e2e8f0}.chart-table-input{width:100%;padding:8px;border:2px solid #e2e8f0;border-radius:8px;font-weight:700;outline:none}.chart-table-input:focus{border-color:#3b82f6}.chart-table-input[type=number]{text-align:center}.chart-start-btn{padding:16px 40px;background:linear-gradient(135deg,#0284c7,#0369a1);color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 8px 25px #0284c759;transition:all .3s ease}.chart-start-btn:hover{transform:translateY(-2px)}.chart-progress{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.chart-progress-dot{width:14px;height:14px;border-radius:50%;transition:all .3s}.chart-progress-dot.done{background:#10b981}.chart-progress-dot.current{background:#0284c7;animation:pulse-sky 1.5s infinite}.chart-progress-dot.pending{background:#e2e8f0}.chart-summary-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.chart-summary-card{background:#fff;border-radius:28px;padding:50px;text-align:center;max-width:450px;width:90%;box-shadow:0 25px 60px #00000026;animation:popIn .5s ease}.chart-summary-card h2{font-size:28px;color:#1e293b;margin:15px 0}.chart-summary-btns{display:flex;gap:12px;justify-content:center;margin-top:25px}.chart-summary-btns button{padding:14px 24px;border:none;border-radius:12px;font-weight:700;font-size:15px;cursor:pointer}@keyframes popIn{0%{transform:scale(.8);opacity:0}60%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}@keyframes pulse-sky{0%,to{box-shadow:0 0 0 3px #0284c733}50%{box-shadow:0 0 0 6px #0284c74d}}@media(max-width:768px){.chart-board{padding:20px}}.decper-container{min-height:100vh;background-color:#f1f5f9;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.decper-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.active-target{border-color:#3b82f6;background:#eff6ff;color:#1d4ed8}.board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.decper-board-paper{background:#fff;width:900px;min-height:500px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f8fafc;padding:40px;position:relative}.visual-area{display:flex;justify-content:center;align-items:center;gap:40px;margin-bottom:40px;background:#f8fafc;padding:30px;border-radius:24px}.pizza-visual{display:flex;flex-direction:column;align-items:center}.pizza-bg{fill:#f1f5f9}.progress-container{width:200px;height:40px;background:#e2e8f0;border-radius:20px;overflow:hidden;position:relative;box-shadow:inset 0 2px 4px #0000001a}.progress-fill{height:100%;background:linear-gradient(90deg,#10b981,#34d399);transition:width .5s cubic-bezier(.4,0,.2,1)}.progress-text{position:absolute;width:100%;text-align:center;line-height:40px;font-weight:900;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4)}.fraction-box{display:flex;flex-direction:column;align-items:center;width:60px}.fraction-line{height:3px;background:#1e293b;width:100%;margin:6px 0;border-radius:2px}.number-input{width:60px;height:45px;text-align:center;font-size:24px;font-weight:800;font-family:Nunito,sans-serif;border:2px solid #cbd5e1;border-radius:12px;color:#1e293b;background:#fff;transition:all .2s}.decper-steps-container{display:flex;flex-direction:column;gap:20px}.decper-step-row{display:flex;align-items:center;background:#fff;padding:15px 25px;border-radius:16px;border:2px solid #f1f5f9;position:relative;gap:20px}.decper-step-row:hover{border-color:#e2e8f0}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.bounce-in{animation:bounceIn .5s cubic-bezier(.175,.885,.32,1.275)}@keyframes bounceIn{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.card-box{display:flex;align-items:center;gap:20px;background:#f8fafc;padding:20px;border-radius:16px;border:2px solid #e2e8f0}.arrow{color:#94a3b8;font-size:24px;font-weight:700}.scale-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.scale-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.scale-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.scale-board-paper{background:#fff;width:900px;min-height:500px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f1f5f9;padding:40px;position:relative;display:flex;gap:30px}.map-area{flex:1;background:#e0f2fe;border-radius:20px;border:4px solid #bae6fd;position:relative;overflow:hidden}.island{position:absolute;background:#dcfce7;border:3px solid #86efac;border-radius:40px 60px 50px 30px}.city-node{position:absolute;width:16px;height:16px;background:#ef4444;border:3px solid white;border-radius:50%;transform:translate(-50%,-50%);cursor:pointer;z-index:5;box-shadow:0 4px 6px #0003;transition:all .2s}.city-node:hover{transform:translate(-50%,-50%) scale(1.3)}.city-node.active{background:#3b82f6;border-color:#bfdbfe;box-shadow:0 0 0 4px #3b82f64d}.city-label{position:absolute;transform:translate(-50%,-100%);margin-top:-12px;background:#fff;padding:2px 8px;border-radius:8px;font-weight:700;font-size:14px;color:#1e293b;box-shadow:0 2px 4px #0000001a;pointer-events:none;white-space:nowrap;z-index:6}.map-line{stroke:#1e293b;stroke-width:4;stroke-dasharray:8 8;animation:dash 2s linear infinite}@keyframes dash{to{stroke-dashoffset:-16}}.map-distance-label{position:absolute;background:#fff;padding:4px 10px;border:2px solid #1e293b;border-radius:12px;font-weight:900;color:#1e293b;transform:translate(-50%,-50%);z-index:6;font-size:16px}.map-scale-legend{position:absolute;bottom:20px;right:20px;background:#fff;padding:10px 15px;border-radius:12px;border:2px solid #cbd5e1;font-weight:700;box-shadow:0 4px 6px #0000001a}.scale-bar{width:100px;height:8px;background:repeating-linear-gradient(90deg,#1e293b,#1e293b 25px,#fff 25px 50px);border:1px solid #1e293b;margin-top:5px}.scale-formula-box{background:#fef9c3;border:2px solid #fde047;padding:15px;border-radius:16px;text-align:center}.formula-triangle{width:0;height:0;border-left:60px solid transparent;border-right:60px solid transparent;border-bottom:100px solid #fcd34d;margin:0 auto 10px;position:relative}.triangle-text{position:absolute;font-weight:900;color:#92400e}.t-js{top:30px;left:-10px;font-size:20px}.t-jp{top:70px;left:-35px;font-size:16px}.t-sk{top:70px;left:15px;font-size:16px}.step-card{background:#fff;border:2px solid #e2e8f0;border-radius:16px;padding:15px;position:relative;overflow:hidden}.step-card.active{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.number-input{width:80px;height:40px;text-align:center;font-size:18px;font-weight:800;border:2px solid #cbd5e1;border-radius:8px;transition:all .2s}.debit-container{min-height:100vh;background-color:#f1f5f9;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.debit-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.debit-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.debit-board-paper{background:#fff;width:900px;min-height:500px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f8fafc;padding:40px;position:relative;display:flex;gap:30px}.tank-area{flex:1;background:#f8fafc;border-radius:20px;padding:30px;display:flex;flex-direction:column;align-items:center;position:relative}.water-tank{width:150px;height:200px;border:8px solid #cbd5e1;border-top:none;border-radius:0 0 20px 20px;position:relative;overflow:hidden;background:#fff;margin-top:50px}.water-fill{position:absolute;bottom:0;left:0;width:100%;background:linear-gradient(180deg,#38bdf8,#0284c7);transition:height 3s ease-in-out}.water-waves{position:absolute;top:0;left:0;width:200%;height:10px;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 10" preserveAspectRatio="none"><path d="M0,5 Q12.5,0 25,5 T50,5 T75,5 T100,5" fill="none" stroke="%2338bdf8" stroke-width="2"/></svg>') repeat-x;background-size:50px 10px;animation:wave 2s linear infinite;margin-top:-10px}@keyframes wave{0%{transform:translate(0)}to{transform:translate(-50px)}}.faucet{position:absolute;top:20px;left:50%;transform:translate(-50%);width:20px;height:40px;background:#64748b;border-radius:4px}.faucet:before{content:"";position:absolute;top:-20px;left:10px;width:40px;height:20px;background:#64748b;border-radius:4px 4px 4px 0}.faucet:after{content:"";position:absolute;top:-10px;left:40px;width:20px;height:10px;background:#ef4444;border-radius:4px;cursor:pointer}.water-drop{position:absolute;bottom:-20px;left:50%;transform:translate(-50%);width:8px;height:100px;background:#38bdf8;opacity:0;border-radius:4px}.water-drop.flowing{animation:flow .5s linear infinite;opacity:1}@keyframes flow{0%{transform:translate(-50%) translateY(0);height:10px;opacity:1}50%{height:100px}to{transform:translate(-50%) translateY(150px);height:20px;opacity:0}}.tank-volume-label{position:absolute;right:-80px;bottom:0;font-weight:900;color:#1e293b;background:#e2e8f0;padding:4px 8px;border-radius:8px}.tank-time-label{margin-top:15px;font-size:18px;font-weight:700;color:#475569}.debit-formula-box{background:#dbeafe;border:2px solid #bfdbfe;padding:15px;border-radius:16px;text-align:center}.formula-triangle{width:0;height:0;border-left:60px solid transparent;border-right:60px solid transparent;border-bottom:100px solid #93c5fd;margin:0 auto 10px;position:relative}.triangle-text{position:absolute;font-weight:900;color:#1e3a8a}.t-vol{top:30px;left:-10px;font-size:20px}.t-deb{top:70px;left:-35px;font-size:16px}.t-wak{top:70px;left:15px;font-size:16px}.step-card{background:#fff;border:2px solid #e2e8f0;border-radius:16px;padding:15px}.number-input{width:90px;height:40px;text-align:center;font-size:18px;font-weight:800;border:2px solid #cbd5e1;border-radius:8px;transition:all .2s}.number-input:focus{outline:none;border-color:#3b82f6}.coord-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.coord-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.coord-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.coord-board-paper{background:#fff;width:950px;min-height:600px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f1f5f9;padding:40px;position:relative;display:flex;gap:30px}.grid-area{flex:1;background:#f8fafc;border-radius:20px;border:4px solid #e2e8f0;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden}.svg-grid{cursor:crosshair;background-color:#fff;border-radius:8px}.grid-line{stroke:#e2e8f0;stroke-width:1}.axis-line{stroke:#1e293b;stroke-width:2}.axis-text{font-family:Nunito,sans-serif;font-size:12px;font-weight:700;fill:#64748b;-webkit-user-select:none;user-select:none}.axis-label{font-family:Gochi Hand,cursive;font-size:20px;font-weight:700;fill:#1e293b}.point-target{fill:#ef4444;stroke:#fca5a5;stroke-width:4;animation:pulse 1.5s infinite}.point-clicked{fill:#3b82f6;stroke:#bfdbfe;stroke-width:4}.point-correct{fill:#10b981;stroke:#a7f3d0;stroke-width:4}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.7}to{transform:scale(1);opacity:1}}.coordinate-label{font-weight:800;font-size:14px;fill:#1e293b;background:#fff;-webkit-user-select:none;user-select:none}.work-area{width:350px;display:flex;flex-direction:column;gap:20px}.step-card{background:#fff;border:2px solid #e2e8f0;border-radius:16px;padding:20px}textarea:focus,input:focus{outline:none}.number-input{width:60px;height:45px;text-align:center;font-size:22px;font-weight:800;border:2px solid #cbd5e1;border-radius:12px;transition:all .2s}.number-input:focus{border-color:#3b82f6}.pemdas-container{min-height:100vh;background-color:#f1f5f9;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.pemdas-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.pemdas-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.pemdas-board-paper{background:#fff;width:900px;min-height:500px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f8fafc;padding:40px;position:relative;display:flex;flex-direction:column;align-items:center}.equation-row{display:flex;align-items:center;gap:10px;font-size:40px;font-family:Nunito,sans-serif;font-weight:900;margin-bottom:30px;flex-wrap:wrap;justify-content:center}.eq-item{padding:5px 15px;border-radius:16px;transition:all .3s cubic-bezier(.4,0,.2,1);color:#1e293b;border:4px solid transparent}.eq-item.highlight{background:#fef9c3;color:#d97706;border-color:#fde047;transform:scale(1.1);z-index:2;box-shadow:0 10px 15px -3px #fde04780}.eq-item.fade{opacity:.3}.eq-item.operator{color:#64748b;padding:5px}.eq-item.bracket{color:#3b82f6;padding:5px}.history-area{display:flex;flex-direction:column;gap:15px;width:100%;align-items:center;margin-top:20px;border-top:2px dashed #e2e8f0;padding-top:30px}.history-line{font-size:24px;font-weight:700;color:#94a3b8;display:flex;gap:10px}.history-line span.solved{color:#10b981}.input-card{background:#fff;border:2px solid #3b82f6;border-radius:20px;padding:20px 40px;display:flex;flex-direction:column;align-items:center;gap:15px;box-shadow:0 10px 25px -5px #3b82f61a;animation:slideUp .5s cubic-bezier(.4,0,.2,1)}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.target-expression{font-size:32px;font-weight:900;color:#d97706;background:#fef9c3;padding:10px 20px;border-radius:12px;border:2px dashed #fde047}.number-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 4px #3b82f61a}.instruction-bubble{background:#dbeafe;border-left:6px solid #3b82f6;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #3b82f61a;max-width:600px;margin:20px auto}.power-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.power-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.power-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.power-board-paper{background:#fff;width:900px;min-height:500px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f1f5f9;padding:40px;position:relative;display:flex;gap:30px}.visual-area{flex:1;background:#fdf4ff;border:4px solid #f5d0fe;border-radius:20px;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden}.block-grid{display:grid;gap:4px;padding:20px}.block-item{background:#d946ef;border:2px solid #c026d3;border-radius:4px;transition:all .3s;box-shadow:0 4px 6px #0000001a}.block-item.animate-in{animation:popIn .3s cubic-bezier(.175,.885,.32,1.275) both}@keyframes popIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.math-expression{font-size:48px;font-weight:900;color:#86198f;display:flex;align-items:center;gap:10px}.math-base{font-size:48px}.math-exponent{font-size:24px;vertical-align:super;margin-left:2px}.math-root-symbol{font-family:Times New Roman,Times,serif;font-size:56px;margin-right:-5px}.work-area{width:350px;display:flex;flex-direction:column;gap:20px;justify-content:center}.instruction-bubble{background:#fce7f3;border-left:6px solid #e11d48;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #e11d481a;max-width:600px;margin:20px auto}.step-card{background:#fff;border:2px solid #e2e8f0;border-radius:16px;padding:20px;text-align:center}.number-input{width:100px;height:60px;text-align:center;font-size:32px;font-weight:900;border:3px solid #cbd5e1;border-radius:16px;transition:all .2s;color:#1e293b}.number-input:focus{outline:none;border-color:#d946ef;box-shadow:0 0 0 4px #d946ef1a}.number-input.input-wrong{border-color:#ef4444;background:#fef2f2;animation:shake .5s}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.algebra-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.algebra-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.algebra-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.algebra-board-paper{background:#fff;width:900px;min-height:500px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f1f5f9;padding:40px;position:relative;display:flex;flex-direction:column;gap:30px}.scale-area{height:300px;background:#f8fafc;border-radius:20px;padding:30px;position:relative;display:flex;justify-content:center;align-items:flex-end}.scale-base{width:100px;height:120px;background:#94a3b8;clip-path:polygon(20% 0%,80% 0%,100% 100%,0% 100%);position:relative;z-index:2}.scale-pivot{position:absolute;top:-10px;left:50%;transform:translate(-50%);width:20px;height:20px;background:#cbd5e1;border-radius:50%;z-index:4}.scale-arm-container{position:absolute;bottom:150px;left:50%;width:500px;height:20px;transform-origin:center;transition:transform .5s ease-in-out;z-index:3}.scale-arm{width:100%;height:12px;background:#64748b;border-radius:6px;position:absolute;top:4px;left:-250px}.pan{position:absolute;top:12px;width:160px;height:120px}.pan.left-pan{left:-250px}.pan.right-pan{right:-250px}.pan-lines{position:absolute;width:100%;height:100%;border-left:2px solid #94a3b8;border-right:2px solid #94a3b8;clip-path:polygon(50% 0%,100% 100%,0% 100%)}.pan-plate{position:absolute;bottom:0;width:160px;height:15px;background:#475569;border-radius:10px;display:flex;justify-content:center;align-items:flex-end;gap:5px;padding-bottom:2px;flex-wrap:wrap-reverse}.x-box{width:50px;height:50px;background:#3b82f6;border:3px solid #2563eb;border-radius:8px;display:flex;justify-content:center;align-items:center;font-size:28px;font-weight:900;color:#fff;box-shadow:0 4px 6px #0000001a;margin-bottom:15px}.constant-block{width:25px;height:25px;background:#f59e0b;border:2px solid #d97706;border-radius:4px;display:flex;justify-content:center;align-items:center;font-weight:700;color:#fff;box-shadow:0 2px 4px #0000001a;margin-bottom:15px}.block-anim-out{animation:fadeUpOut .8s forwards}@keyframes fadeUpOut{0%{transform:translateY(0);opacity:1}to{transform:translateY(-50px);opacity:0}}.work-area{display:flex;justify-content:center;gap:50px;align-items:center}.equation-card{background:#eff6ff;border:2px solid #bfdbfe;padding:20px 40px;border-radius:16px;font-size:40px;font-weight:900;color:#1e3a8a;text-align:center;transition:all .5s}.action-card{background:#fff;border:2px solid #e2e8f0;padding:20px;border-radius:16px;display:flex;flex-direction:column;gap:10px;align-items:center}.number-input{width:80px;height:50px;text-align:center;font-size:24px;font-weight:800;border:2px solid #cbd5e1;border-radius:12px;transition:all .2s}.number-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.number-input.input-correct{border-color:#10b981;background:#ecfdf5;color:#047857}.number-input.input-wrong{border-color:#ef4444;background:#fef2f2}.sets-container{min-height:100vh;background-color:#f1f5f9;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.sets-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.sets-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.sets-board-paper{background:#fff;width:900px;min-height:500px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f8fafc;padding:40px;position:relative;display:flex;gap:30px}.venn-area{flex:1;background:#f8fafc;border:4px solid #e2e8f0;border-radius:20px;padding:20px;position:relative;display:flex;justify-content:center;align-items:center}.venn-svg{width:400px;height:400px;border:4px dashed #cbd5e1;border-radius:12px;background:#fff}.venn-zone{transition:all .2s;cursor:pointer;stroke:#cbd5e1;stroke-width:3}.venn-zone-text{font-weight:900;font-size:20px;fill:#64748b;pointer-events:none;font-family:Gochi Hand,cursive}.zone-universe{fill:#f8fafc}.zone-universe:hover{fill:#f1f5f9}.zone-a{fill:#ef444433;stroke:#ef4444}.zone-a:hover{fill:#ef444466}.zone-b{fill:#3b82f633;stroke:#3b82f6}.zone-b:hover{fill:#3b82f666}.zone-intersect{fill:#a855f766;stroke:#a855f7}.zone-intersect:hover{fill:#a855f799}.work-area{width:350px;display:flex;flex-direction:column;gap:20px;justify-content:flex-start}.def-card{background:#eff6ff;border:2px solid #bfdbfe;padding:15px;border-radius:16px}.def-row{display:flex;align-items:flex-start;gap:10px;margin-bottom:8px;font-size:16px}.def-badge{font-weight:900;padding:2px 8px;border-radius:6px;color:#fff;margin-top:2px}.target-element-card{background:#fff;border:2px solid #e2e8f0;padding:20px;border-radius:16px;display:flex;flex-direction:column;align-items:center;gap:15px;box-shadow:0 4px 6px #0000000d}.draggable-element{width:60px;height:60px;background:#f59e0b;border:3px solid #d97706;border-radius:12px;display:flex;justify-content:center;align-items:center;font-size:32px;font-weight:900;color:#fff;box-shadow:0 4px 10px #f59e0b4d;animation:floatUpDown 2s infinite ease-in-out}@keyframes floatUpDown{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.placed-text{font-family:Gochi Hand,cursive;font-size:24px;font-weight:700;fill:#1e293b;pointer-events:none;animation:popElement .4s cubic-bezier(.175,.885,.32,1.275)}@keyframes popElement{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.linear-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.linear-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.linear-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.linear-board-paper{background:#fff;width:900px;min-height:500px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f1f5f9;padding:40px;position:relative;display:flex;flex-direction:column;gap:30px}.eq-display-area{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:20px}.eq-block{background:#f8fafc;border:4px solid #e2e8f0;border-radius:20px;padding:30px 40px;font-size:48px;font-weight:900;display:flex;align-items:center;gap:15px;min-width:250px;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1)}.eq-block.calculated{background:#eff6ff;border-color:#3b82f6;color:#1e3a8a;position:relative}.eq-block.target{background:#fef2f2;border-color:#ef4444;color:#9f1239}.eq-block.matched{background:#ecfdf5;border-color:#10b981;color:#065f46;transform:scale(1.05);box-shadow:0 10px 25px -5px #10b9814d}.x-highlight{color:#3b82f6;background:#dbeafe;padding:0 10px;border-radius:8px;border:2px dashed #93c5fd}.operator{color:#94a3b8;font-size:60px}.operator.matched{color:#10b981}.tilt-indicator{position:absolute;top:-40px;font-size:18px;font-weight:700;background:#1e293b;color:#fff;padding:4px 12px;border-radius:8px;animation:fadeIn .3s}.tilt-indicator:after{content:"";position:absolute;bottom:-6px;left:50%;transform:translate(-50%);border-width:6px 6px 0;border-style:solid;border-color:#1e293b transparent transparent transparent}.slider-container{background:#f8fafc;padding:40px;border-radius:24px;display:flex;flex-direction:column;align-items:center;gap:20px}.custom-slider{-webkit-appearance:none;width:80%;height:15px;background:#cbd5e1;border-radius:10px;outline:none}.custom-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:40px;height:40px;border-radius:50%;background:#3b82f6;cursor:pointer;border:4px solid white;box-shadow:0 4px 10px #0003;transition:transform .1s}.custom-slider::-webkit-slider-thumb:active{transform:scale(1.1)}.slider-value-display{font-size:36px;font-weight:900;color:#3b82f6;background:#fff;border:3px solid #bfdbfe;padding:10px 30px;border-radius:16px;box-shadow:0 4px 6px #0000000d}.instruction-bubble{background:#dbeafe;border-left:6px solid #3b82f6;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #3b82f61a;max-width:600px;margin:10px auto}.btn-start{transition:all .2s}.btn-start:hover{transform:translateY(-2px);filter:brightness(1.05)}.btn-start:active{transform:translateY(1px)}.proportion-container{min-height:100vh;background-color:#f1f5f9;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.proportion-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.proportion-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.proportion-board-paper{background:#fff;width:1100px;min-height:600px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f8fafc;padding:40px;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:30px}.graph-area{background:#f8fafc;border-radius:20px;padding:20px;display:flex;flex-direction:column;align-items:center;position:relative;border:4px solid #e2e8f0}.graph-svg{background:#fff;border-radius:12px;box-shadow:inset 0 2px 4px #0000000d}.axis{stroke:#64748b;stroke-width:2}.grid-line{stroke:#f1f5f9;stroke-width:1}.graph-curve{fill:none;stroke-width:4;stroke-linecap:round;transition:d .5s ease-in-out}.point-dot{transition:all .3s cubic-bezier(.175,.885,.32,1.275)}.work-area{display:flex;flex-direction:column;gap:20px}.proportion-table{width:100%;border-collapse:separate;border-spacing:0;border-radius:16px;overflow:hidden;border:2px solid #e2e8f0}.proportion-table th{background:#f1f5f9;padding:15px;font-weight:900;color:#475569;text-align:center}.proportion-table td{padding:15px;text-align:center;border-top:1px solid #e2e8f0}.proportion-table tr.active{background:#f0f9ff}.input-cell{width:100%;max-width:80px;padding:8px;border:2px solid #cbd5e1;border-radius:8px;text-align:center;font-weight:800;font-size:18px;transition:all .2s}.input-cell:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.input-cell.correct{border-color:#10b981;background:#ecfdf5;color:#047857}.proportion-type-badge{padding:10px 20px;border-radius:12px;font-weight:900;font-size:20px;text-align:center;margin-bottom:20px}.type-direct{background:#dcfce7;color:#166534;border:2px solid #bbf7d0}.type-inverse{background:#fee2e2;color:#991b1b;border:2px solid #fecaca}.instruction-bubble{background:#dbeafe;border-left:6px solid #3b82f6;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #3b82f61a;max-width:700px;margin:20px auto}.formula-box{background:#f8fafc;padding:15px;border-radius:12px;border:2px dashed #cbd5e1;text-align:center;font-family:Gochi Hand,cursive;font-size:22px;color:#475569}.btn-primary{padding:15px 25px;background:#3b82f6;color:#fff;border:none;border-radius:12px;font-weight:800;font-size:18px;cursor:pointer;transition:all .2s}.arith-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.arith-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.arith-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.arith-board-paper{background:#fff;width:1000px;min-height:600px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f1f5f9;padding:40px;position:relative}.tab-container{display:flex;gap:10px;margin-bottom:30px;justify-content:center}.tab-btn{padding:12px 24px;border-radius:999px;border:2px solid #e2e8f0;background:#fff;font-weight:800;cursor:pointer;transition:all .2s;color:#64748b}.tab-btn.active{background:#3b82f6;color:#fff;border-color:#3b82f6;box-shadow:0 4px 12px #3b82f64d}.shop-area{display:grid;grid-template-columns:1fr 1.5fr;gap:30px;animation:slideUp .5s ease-out}.product-card{background:#f8fafc;border:2px solid #e2e8f0;border-radius:20px;padding:20px;text-align:center}.product-img{font-size:80px;margin-bottom:15px}.price-tag{display:flex;flex-direction:column;gap:10px;margin-top:20px}.price-box{background:#fff;padding:15px;border-radius:12px;border:2px solid #bfdbfe;font-weight:900;color:#1e3a8a}.receipt{background:#fff;border:2px solid #e2e8f0;border-radius:8px;padding:30px;box-shadow:0 4px 6px #0000000d;font-family:Courier New,Courier,monospace;position:relative}.receipt:before{content:"";position:absolute;top:-10px;left:0;width:100%;height:10px;background:radial-gradient(circle,transparent,transparent 50%,#fff 50%,#fff) 0 0 / 20px 20px}.receipt-line{display:flex;justify-content:space-between;margin-bottom:10px;border-bottom:1px dashed #e2e8f0}.bank-vault{background:linear-gradient(135deg,#1e293b,#0f172a);padding:40px;border-radius:24px;color:#e2e8f0;text-align:center}.balance-display{font-size:48px;font-weight:900;color:#fbbf24;margin:20px 0}.input-field{width:150px;padding:10px;border:2px solid #cbd5e1;border-radius:10px;text-align:center;font-weight:800;font-size:20px}.input-field.correct{border-color:#10b981;background:#ecfdf5}.input-field.wrong{border-color:#ef4444;background:#fef2f2}.btn-action{background:#3b82f6;color:#fff;border:none;padding:15px 30px;border-radius:12px;font-weight:800;cursor:pointer;transition:all .2s}.btn-action:hover{transform:translateY(-2px);box-shadow:0 4px 12px #3b82f64d}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.spldv-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.spldv-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.spldv-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.spldv-board-paper{background:#fff;width:1100px;min-height:650px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f8fafc;padding:40px;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:30px}.cartesian-canvas{background:#fff;border:4px solid #e2e8f0;border-radius:20px;position:relative;overflow:hidden;box-shadow:inset 0 2px 10px #0000000d}.line-math{stroke-width:3;stroke-linecap:round;transition:all .3s ease-out}.intersection-dot{fill:#3b82f6;stroke:#fff;stroke-width:3;filter:drop-shadow(0 0 5px rgba(59,130,246,.5))}.coordinate-label{font-weight:700;font-size:14px}.equation-card{padding:15px;border-radius:16px;border:2px solid #e2e8f0;position:relative;transition:all .3s}.equation-card.eq1{border-left:8px solid #ef4444;background:#fef2f2}.equation-card.eq2{border-left:8px solid #10b981;background:#ecfdf5}.equation-text{font-size:24px;font-weight:800;color:#1e293b;margin-bottom:10px}.coefficient-controls{display:flex;gap:15px;flex-wrap:wrap}.coef-item{display:flex;flex-direction:column;align-items:center;gap:5px}.coef-label{font-size:12px;font-weight:700;color:#64748b}.coef-input{width:60px;padding:5px;border:2px solid #cbd5e1;border-radius:8px;text-align:center;font-weight:800}.steps-box{background:#f8fafc;border-radius:20px;padding:20px;border:1px dashed #cbd5e1;max-height:250px;overflow-y:auto}.step-row{font-family:Courier New,Courier,monospace;font-weight:700;margin-bottom:8px;display:flex;align-items:center;gap:10px}.btn-primary{padding:12px 24px;background:#3b82f6;color:#fff;border:none;border-radius:12px;font-weight:800;cursor:pointer;transition:all .2s}.pyth-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.pyth-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.pyth-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.pyth-board-paper{background:#fff;width:1000px;min-height:600px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #fdf4ff;padding:40px;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:30px}.triangle-viz{background:#fdf4ff;border-radius:20px;padding:20px;display:flex;justify-content:center;align-items:center;position:relative;border:4px solid #f5d0fe}.pyth-svg{width:450px;height:450px;overflow:visible}.triangle-path{fill:#d946ef;stroke:#c026d3;stroke-width:4}.square-path{fill:#d946ef33;stroke:#d946ef;stroke-width:2;stroke-dasharray:4}.label-text{font-weight:900;font-size:24px;fill:#701a75}.solver-area{display:flex;flex-direction:column;gap:20px;justify-content:center}.formula-card{background:#fff;border:2px solid #f5d0fe;padding:30px;border-radius:20px;text-align:center;box-shadow:0 4px 6px -1px #0000000d}.math-formula{font-size:36px;font-weight:900;color:#86198f;margin-bottom:20px;font-family:Times New Roman,Times,serif}.input-group{display:flex;flex-direction:column;gap:15px}.pyth-input-row{display:flex;align-items:center;justify-content:center;gap:10px;font-size:24px;font-weight:800}.pyth-input{width:100px;padding:10px;border:3px solid #cbd5e1;border-radius:12px;text-align:center;font-weight:900;font-size:24px;transition:all .2s}.pyth-input:focus{outline:none;border-color:#d946ef}.pyth-input.correct{border-color:#10b981;background:#ecfdf5;color:#047857}.pyth-input.target{border-color:#3b82f6;background:#eff6ff}.instruction-bubble{background:#fdf2f8;border-left:6px solid #d946ef;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #d946ef1a;max-width:800px;margin:20px auto}.btn-primary{padding:15px 30px;background:#d946ef;color:#fff;border:none;border-radius:12px;font-weight:800;font-size:18px;cursor:pointer;transition:all .2s}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .5s ease-out forwards}.circle-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.circle-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.circle-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.circle-board-paper{background:#fff;width:1100px;min-height:650px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f0fdf4;padding:40px;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:30px}.circle-viz{background:#f0fdf4;border-radius:20px;padding:20px;display:flex;justify-content:center;align-items:center;position:relative;border:4px solid #bbf7d0;overflow:hidden}.circle-svg{width:450px;height:450px}.circle-base{fill:none;stroke:#10b981;stroke-width:4}.circle-part{transition:all .3s;pointer-events:none}.part-radius{stroke:#3b82f6;stroke-width:4}.part-diameter{stroke:#ef4444;stroke-width:4;stroke-dasharray:8 4}.part-arc{stroke:#f59e0b;stroke-width:8;fill:none}.part-sector{fill:#3b82f633}.part-chord{stroke:#8b5cf6;stroke-width:4}.drag-handle{cursor:grab;fill:#3b82f6;stroke:#fff;stroke-width:3}.drag-handle:active{cursor:grabbing}.info-sidebar{display:flex;flex-direction:column;gap:20px}.part-selector{display:grid;grid-template-columns:1fr 1fr;gap:10px}.selector-btn{padding:10px;border-radius:12px;border:2px solid #e2e8f0;background:#fff;font-weight:800;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px;color:#64748b}.selector-btn.active{border-color:#10b981;background:#f0fdf4;color:#166534;box-shadow:0 4px 6px #10b9811a}.formula-display{background:#f8fafc;padding:20px;border-radius:16px;border:1px dashed #cbd5e1}.formula-text{font-family:Gochi Hand,cursive;font-size:24px;color:#166534;text-align:center}.calculation-result{font-size:32px;font-weight:900;color:#10b981;text-align:center;margin-top:10px}.instruction-bubble{background:#dcfce7;border-left:6px solid #10b981;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #10b9811a;max-width:800px;margin:20px auto}.shapes3d-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.shapes3d-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.shapes3d-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.shapes3d-board-paper{background:#fff;width:1100px;min-height:650px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #eff6ff;padding:40px;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:30px}.viewport-3d{background:#eff6ff;border-radius:20px;padding:20px;display:flex;justify-content:center;align-items:center;position:relative;border:4px solid #bfdbfe;perspective:1000px}.shape-svg{width:450px;height:450px;overflow:visible}.shape-face{fill:#3b82f633;stroke:#3b82f6;stroke-width:2;transition:all .3s}.shape-face-solid{fill:#3b82f680;stroke:#2563eb;stroke-width:3}.shape-dashed{stroke-dasharray:8 4;opacity:.5}.label-line{stroke:#64748b;stroke-width:2;marker-end:url(#arrowhead)}.shape-selector{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:20px}.selector-btn{padding:12px;border-radius:12px;border:2px solid #e2e8f0;background:#fff;font-weight:800;cursor:pointer;transition:all .2s;text-align:center}.selector-btn.active{border-color:#3b82f6;background:#dbeafe;color:#1e40af}.dimension-slider{background:#f8fafc;padding:20px;border-radius:16px;border:1px dashed #cbd5e1}.slider-row{display:flex;flex-direction:column;gap:10px;margin-bottom:15px}.custom-range{-webkit-appearance:none;width:100%;height:8px;background:#cbd5e1;border-radius:4px;outline:none}.custom-range::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;background:#3b82f6;border-radius:50%;cursor:pointer;border:4px solid white}.formula-card{background:#fff;border:2px solid #bfdbfe;padding:20px;border-radius:16px;text-align:center;box-shadow:0 4px 6px #0000000d}.formula-text{font-family:Gochi Hand,cursive;font-size:24px;color:#1e40af;margin-bottom:15px}.result-display{font-size:32px;font-weight:900;color:#3b82f6}.instruction-bubble{background:#dbeafe;border-left:6px solid #3b82f6;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #3b82f61a;max-width:800px;margin:20px auto}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.floating{animation:float 3s infinite ease-in-out}.transform-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.transform-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.transform-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.transform-board-paper{background:#fff;width:1100px;min-height:650px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #fdf2f8;padding:40px;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:30px}.cartesian-canvas{background:#fff;border:4px solid #fbcfe8;border-radius:20px;position:relative;overflow:hidden;box-shadow:inset 0 2px 10px #0000000d}.shape-original{fill:#f472b633;stroke:#f472b6;stroke-width:3;stroke-dasharray:4}.shape-transformed{fill:#3b82f666;stroke:#3b82f6;stroke-width:4;transition:all .8s cubic-bezier(.4,0,.2,1)}.controls-sidebar{display:flex;flex-direction:column;gap:20px}.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.action-btn{padding:15px;border-radius:12px;border:2px solid #e2e8f0;background:#fff;font-weight:800;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;align-items:center;gap:5px;color:#64748b}.action-btn.active{border-color:#f472b6;background:#fdf2f8;color:#db2777;box-shadow:0 4px 6px #f472b61a}.transform-panel{background:#f8fafc;padding:20px;border-radius:16px;border:1px dashed #cbd5e1}.input-row{display:flex;align-items:center;gap:15px;margin-top:10px}.num-input{width:60px;padding:8px;border:2px solid #cbd5e1;border-radius:8px;text-align:center;font-weight:800}.btn-apply{background:#f472b6;color:#fff;border:none;padding:12px 24px;border-radius:12px;font-weight:800;cursor:pointer;transition:all .2s}.btn-apply:hover{transform:translateY(-2px);box-shadow:0 4px 12px #f472b64d}.stat-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.stat-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.stat-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.stat-board-paper{background:#fff;width:1100px;min-height:650px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f0fdfa;padding:40px;position:relative;display:grid;grid-template-columns:1.5fr 1fr;gap:30px}.chart-area{background:#f0fdfa;border-radius:24px;padding:30px;display:flex;flex-direction:column;align-items:center;border:4px solid #ccfbf1}.bar-container{display:flex;align-items:flex-end;gap:15px;height:300px;padding:20px;border-bottom:4px solid #5eead4;margin-top:20px;width:100%;justify-content:center}.stat-bar{width:40px;background:#0d9488;border-radius:8px 8px 0 0;transition:all .5s cubic-bezier(.175,.885,.32,1.275);position:relative;display:flex;justify-content:center}.bar-val{position:absolute;top:-30px;font-weight:900;color:#0f766e}.marker-line{position:absolute;width:100%;border-top:2px dashed #0d9488;z-index:1}.marker-label{position:absolute;right:-80px;background:#14b8a6;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:700}.data-input-box{background:#fff;border:2px solid #e2e8f0;border-radius:20px;padding:20px;box-shadow:0 4px 6px -1px #0000000d}.data-grid{display:flex;flex-wrap:wrap;gap:10px;margin-top:15px}.data-chip{background:#f1f5f9;padding:8px 15px;border-radius:999px;font-weight:800;display:flex;align-items:center;gap:8px}.chip-remove{cursor:pointer;color:#ef4444;font-weight:700}.result-card{background:#f0fdfa;border:2px solid #5eead4;border-radius:20px;padding:20px;text-align:center}.mmm-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:15px}.mmm-item{background:#fff;padding:10px;border-radius:12px;border:2px solid #ccfbf1}.mmm-val{font-size:24px;font-weight:900;color:#0d9488}.btn-primary{padding:12px 24px;background:#0d9488;color:#fff;border:none;border-radius:12px;font-weight:800;cursor:pointer;transition:all .2s}.btn-primary:hover{transform:translateY(-2px);filter:brightness(1.1)}.instruction-bubble{background:#f0fdfa;border-left:6px solid #0d9488;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #0d94881a;max-width:800px;margin:20px auto}.prob-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.prob-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.prob-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.prob-board-paper{background:#fff;width:1100px;min-height:650px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #fef2f2;padding:40px;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:30px}.sim-area{background:#fef2f2;border-radius:24px;padding:30px;display:flex;flex-direction:column;align-items:center;border:4px solid #fecaca;position:relative}.coin-box,.dice-box{height:200px;display:flex;justify-content:center;align-items:center;perspective:1000px}.coin{width:120px;height:120px;background:#fbbf24;border-radius:50%;border:4px solid #d97706;display:flex;justify-content:center;align-items:center;font-size:40px;font-weight:900;color:#92400e;box-shadow:0 10px #b45309;transition:transform .6s cubic-bezier(.175,.885,.32,1.275)}.coin.flip{animation:coinFlip 1s ease-out forwards}@keyframes coinFlip{0%{transform:translateY(0) rotateX(0)}50%{transform:translateY(-150px) rotateX(720deg)}to{transform:translateY(0) rotateX(1440deg)}}.dice{width:100px;height:100px;background:#fff;border:4px solid #ef4444;border-radius:16px;display:grid;grid-template-columns:repeat(3,1fr);padding:10px;gap:5px;box-shadow:0 10px #b91c1c}.dice-dot{width:15px;height:15px;background:#ef4444;border-radius:50%;margin:auto}.stats-panel{display:flex;flex-direction:column;gap:20px}.prob-table{width:100%;border-collapse:separate;border-spacing:0;border-radius:16px;overflow:hidden;border:2px solid #e2e8f0}.prob-table th{background:#f8fafc;padding:12px;font-weight:900;color:#475569}.prob-table td{padding:12px;text-align:center;border-top:1px solid #e2e8f0}.prob-chart{display:flex;align-items:flex-end;gap:8px;height:150px;padding:10px;background:#f8fafc;border-radius:12px}.prob-bar{flex:1;background:#ef4444;border-radius:4px 4px 0 0;transition:height .3s cubic-bezier(.175,.885,.32,1.275)}.btn-primary{padding:15px 30px;background:#ef4444;color:#fff;border:none;border-radius:12px;font-weight:800;font-size:18px;cursor:pointer;transition:all .2s;margin-top:20px}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #ef44444d}.btn-primary:active{transform:translateY(2px)}.instruction-bubble{background:#fef2f2;border-left:6px solid #ef4444;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #ef44441a;max-width:800px;margin:20px auto}.radical-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.radical-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.radical-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.radical-board-paper{background:#fff;width:1000px;min-height:600px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f0f9ff;padding:40px;position:relative;display:grid;grid-template-columns:1.2fr 1fr;gap:30px}.lab-area{background:#f0f9ff;border-radius:24px;padding:30px;display:flex;flex-direction:column;align-items:center;border:4px solid #bae6fd}.radical-display{font-size:72px;font-weight:900;color:#0369a1;margin:40px 0;font-family:Times New Roman,serif}.factor-tree{width:100%;display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:20px}.factor-node{background:#fff;border:2px solid #0369a1;padding:10px 20px;border-radius:12px;font-weight:800;font-size:20px}.solver-area{display:flex;flex-direction:column;gap:20px}.solution-box{background:#f8fafc;border:2px solid #e2e8f0;border-radius:20px;padding:25px;text-align:center}.input-row{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:20px}.radical-input{width:80px;padding:12px;border:3px solid #cbd5e1;border-radius:12px;text-align:center;font-weight:900;font-size:28px;transition:all .2s}.radical-input:focus{outline:none;border-color:#0369a1}.radical-input.correct{border-color:#10b981;background:#ecfdf5}.radical-input.wrong{border-color:#ef4444;background:#fef2f2}.btn-primary{padding:15px 30px;background:#0369a1;color:#fff;border:none;border-radius:12px;font-weight:800;font-size:18px;cursor:pointer;transition:all .2s}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0369a14d}.instruction-bubble{background:#e0f2fe;border-left:6px solid #0369a1;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #0369a11a;max-width:800px;margin:20px auto}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.pulse{animation:pulse 2s infinite ease-in-out}.func-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.func-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.func-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.func-board-paper{background:#fff;width:1100px;min-height:650px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #fdf4ff;padding:40px;position:relative;display:grid;grid-template-columns:1.5fr 1fr;gap:30px}.plotter-area{background:#fff;border-radius:24px;border:4px solid #fbcfe8;position:relative;overflow:hidden;box-shadow:inset 0 2px 10px #0000000d}.plotter-svg{width:100%;height:100%}.grid-line{stroke:#fdf2f8;stroke-width:1}.axis-line{stroke:#f472b6;stroke-width:2}.func-curve{fill:none;stroke:#db2777;stroke-width:4;stroke-linecap:round;transition:d .3s ease-out}.type-selector{display:flex;gap:10px;margin-bottom:10px}.selector-btn{flex:1;padding:12px;border-radius:12px;border:2px solid #e2e8f0;background:#fff;font-weight:800;cursor:pointer;transition:all .2s;color:#64748b}.selector-btn.active{background:#fdf2f8;border-color:#f472b6;color:#db2777}.parameter-card{background:#f8fafc;border:1px dashed #cbd5e1;border-radius:20px;padding:20px}.slider-group{margin-bottom:20px}.slider-label{display:flex;justify-content:space-between;font-weight:800;margin-bottom:8px;color:#475569}.func-slider{-webkit-appearance:none;width:100%;height:8px;background:#cbd5e1;border-radius:4px;outline:none}.func-slider::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;background:#db2777;border-radius:50%;cursor:pointer;border:4px solid white}.formula-display{background:#db2777;color:#fff;padding:20px;border-radius:16px;text-align:center;font-family:Times New Roman,serif;font-size:32px;font-weight:700}.instruction-bubble{background:#fdf2f8;border-left:6px solid #f472b6;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #f472b61a;max-width:800px;margin:20px auto}.quad-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.quad-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.quad-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.quad-board-paper{background:#fff;width:1100px;min-height:650px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #f0fdf4;padding:40px;position:relative;display:grid;grid-template-columns:1fr 1.2fr;gap:30px}.calc-panel{display:flex;flex-direction:column;gap:20px}.equation-input-row{display:flex;align-items:center;gap:10px;background:#fff;padding:20px;border-radius:20px;border:2px solid #bbf7d0;justify-content:center}.param-input{width:60px;padding:10px;border:2px solid #cbd5e1;border-radius:12px;text-align:center;font-weight:900;font-size:20px}.abc-card{background:#f0fdf4;border:4px solid #bbf7d0;border-radius:24px;padding:25px}.formula-step{font-family:Gochi Hand,cursive;font-size:24px;line-height:1.6;color:#166534}.viz-area{background:#fff;border-radius:24px;border:4px solid #bbf7d0;position:relative;overflow:hidden}.plot-svg{width:100%;height:100%}.root-dot{fill:#dc2626;stroke:#fff;stroke-width:2;r:6}.instruction-bubble{background:#f0fdf4;border-left:6px solid #22c55e;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #22c55e1a;max-width:800px;margin:20px auto}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}}.root-glow{animation:pulse 2s infinite ease-in-out}.sim-container{min-height:100vh;background-color:#f8fafc;font-family:Nunito,sans-serif;color:#1e293b;position:relative;overflow:hidden;padding-bottom:50px}.sim-nav{display:flex;justify-content:space-between;padding:20px 40px;background:#fff;box-shadow:0 4px 6px -1px #0000000d;position:relative;z-index:10}.stat-badge{background:#fff;border:2px solid #e2e8f0;padding:8px 16px;border-radius:9999px;font-weight:800;color:#475569;font-size:16px;box-shadow:0 2px 4px #0000000d}.sim-board-scaler{transform-origin:top center;width:100%;display:flex;justify-content:center;padding:20px}.sim-board-paper{background:#fff;width:1100px;min-height:650px;border-radius:32px;box-shadow:0 25px 50px -12px #0000001a,inset 0 0 0 10px #fdf4ff;padding:40px;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:30px}.canvas-area{background:#fdf4ff;border-radius:24px;padding:30px;display:flex;justify-content:center;align-items:center;border:4px solid #f5d0fe;position:relative;overflow:hidden}.triangle-svg{width:100%;height:100%}.triangle-ref{fill:#a855f733;stroke:#a855f7;stroke-width:3}.triangle-comp{fill:#3b82f666;stroke:#3b82f6;stroke-width:3;transition:transform .8s cubic-bezier(.4,0,.2,1)}.sidebar-area{display:flex;flex-direction:column;gap:20px}.mode-selector{display:flex;gap:10px}.selector-btn{flex:1;padding:12px;border-radius:12px;border:2px solid #e2e8f0;background:#fff;font-weight:800;cursor:pointer;transition:all .2s}.selector-btn.active{border-color:#a855f7;background:#f3e8ff;color:#7e22ce}.control-card{background:#fff;border:2px solid #e2e8f0;padding:20px;border-radius:20px;box-shadow:0 4px 6px #0000000d}.ratio-display{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px;text-align:center;margin-top:20px}.ratio-item{background:#f8fafc;padding:10px;border-radius:12px;border:1px dashed #cbd5e1}.ratio-val{font-size:20px;font-weight:900;color:#a855f7}.btn-primary{padding:15px 30px;background:#a855f7;color:#fff;border:none;border-radius:12px;font-weight:800;font-size:18px;cursor:pointer;transition:all .2s;width:100%}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #a855f74d}.instruction-bubble{background:#f3e8ff;border-left:6px solid #a855f7;padding:15px 25px;border-radius:0 16px 16px 0;box-shadow:0 4px 6px #a855f71a;max-width:800px;margin:20px auto}.explog-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.explog-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.explog-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1);cursor:default}.explog-instruction{background:#8b5cf61f;border:1px dashed rgba(139,92,246,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.explog-board{transform-origin:top center;display:flex;justify-content:center}.explog-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:40px;width:100%;max-width:900px}.explog-tabs{display:flex;gap:10px;margin-bottom:30px;flex-wrap:wrap;justify-content:center}.explog-tab{padding:12px 24px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s}.explog-tab.active{background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff;border-color:transparent;box-shadow:0 4px 20px #8b5cf64d}.explog-tab:hover:not(.active){background:#ffffff1a}.explog-question{text-align:center;margin-bottom:30px}.explog-question .problem{font-size:48px;font-weight:900;color:#f1f5f9;margin-bottom:8px;font-family:Courier New,monospace}.explog-question .hint-text{font-size:15px;color:#64748b}.explog-options{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:600px;margin:0 auto 30px}.explog-option{padding:18px 24px;border-radius:16px;background:#ffffff0f;border:2px solid rgba(255,255,255,.1);color:#e2e8f0;font-weight:700;font-size:20px;cursor:pointer;transition:all .3s;text-align:center;font-family:Courier New,monospace}.explog-option:hover{background:#8b5cf626;border-color:#7c3aed;transform:translateY(-2px)}.explog-option.correct{background:#22c55e33;border-color:#22c55e;animation:optionPop .5s}.explog-option.wrong{background:#ef444433;border-color:#ef4444;animation:shake .4s}.explog-option.disabled{opacity:.5;pointer-events:none}.explog-rules-section{margin-top:20px;padding:24px;background:#ffffff0a;border-radius:16px;border:1px solid rgba(255,255,255,.08)}.explog-rules-section h3{margin:0 0 16px;color:#a78bfa;font-size:20px}.rule-card{background:#8b5cf614;border:1px solid rgba(139,92,246,.2);border-radius:12px;padding:16px 20px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}.rule-card .rule-name{color:#c4b5fd;font-weight:700;font-size:14px}.rule-card .rule-formula{color:#e2e8f0;font-family:Courier New,monospace;font-size:16px;font-weight:700}.progress-bar-container{background:#ffffff14;border-radius:20px;height:12px;overflow:hidden;margin-bottom:24px}.progress-bar-fill{height:100%;background:linear-gradient(90deg,#7c3aed,#a855f7);border-radius:20px;transition:width .5s ease}.explog-btn{padding:14px 32px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff}.explog-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #8b5cf666}.explog-btn.secondary{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#94a3b8}@keyframes optionPop{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-8px)}75%{transform:translate(8px)}}@media(max-width:600px){.explog-options{grid-template-columns:1fr}.explog-question .problem{font-size:32px}.explog-board-inner{padding:20px}}.inequality-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.inequality-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.inequality-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1);cursor:default}.inequality-instruction{background:#3b82f61f;border:1px dashed rgba(59,130,246,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.inequality-board{transform-origin:top center;display:flex;justify-content:center}.inequality-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:900px}.inequality-grid-container{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.inequality-graph-area{flex:1;min-width:320px;display:flex;flex-direction:column;align-items:center}.inequality-controls{flex:0 0 280px;display:flex;flex-direction:column;gap:14px}.inequality-eq-card{background:#3b82f614;border:1px solid rgba(59,130,246,.25);border-radius:14px;padding:16px 20px}.inequality-eq-card h4{margin:0 0 10px;font-size:14px;color:#93c5fd}.inequality-eq-card .eq-display{font-family:Courier New,monospace;font-size:18px;font-weight:800;color:#e2e8f0}.inequality-slider-row{display:flex;align-items:center;gap:10px;margin-top:8px}.inequality-slider-row label{font-weight:700;font-size:14px;color:#94a3b8;min-width:20px}.inequality-slider-row input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:#ffffff1f;border-radius:10px;outline:none}.inequality-slider-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#3b82f6;border-radius:50%;cursor:pointer;border:2px solid #1e3a5f}.inequality-slider-row .val{font-family:Courier New,monospace;color:#60a5fa;font-weight:800;min-width:32px;text-align:right}.inequality-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:10px}.legend-item{display:flex;align-items:center;gap:6px;font-size:13px;color:#94a3b8}.legend-swatch{width:16px;height:16px;border-radius:4px}.inequality-select{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#e2e8f0;padding:10px 14px;border-radius:12px;font-size:14px;font-weight:700;cursor:pointer;width:100%}.inequality-select option{background:#1e293b;color:#e2e8f0}.ineq-btn{padding:14px 32px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#3b82f6,#60a5fa);color:#fff}.ineq-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #3b82f666}.ineq-btn.secondary{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#94a3b8}.inequality-quiz-option{padding:14px 20px;border-radius:14px;background:#ffffff0f;border:2px solid rgba(255,255,255,.1);color:#e2e8f0;font-weight:700;font-size:16px;cursor:pointer;transition:all .3s;text-align:center}.inequality-quiz-option:hover{background:#3b82f626;border-color:#3b82f6}.inequality-quiz-option.correct{background:#22c55e33;border-color:#22c55e}.inequality-quiz-option.wrong{background:#ef444433;border-color:#ef4444}@media(max-width:700px){.inequality-grid-container{flex-direction:column}.inequality-controls{flex:none;width:100%}}.trig-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.trig-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.trig-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1);cursor:default}.trig-instruction{background:#f43f5e1f;border:1px dashed rgba(244,63,94,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.trig-board{transform-origin:top center;display:flex;justify-content:center}.trig-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.trig-tabs{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}.trig-tab{padding:12px 22px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s}.trig-tab.active{background:linear-gradient(135deg,#f43f5e,#fb7185);color:#fff;border-color:transparent;box-shadow:0 4px 20px #f43f5e4d}.trig-tab:hover:not(.active){background:#ffffff1a}.trig-layout{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.trig-circle-area{flex:1;min-width:320px;display:flex;flex-direction:column;align-items:center}.trig-info-area{flex:0 0 300px;display:flex;flex-direction:column;gap:14px}.trig-value-card{background:#f43f5e14;border:1px solid rgba(244,63,94,.2);border-radius:14px;padding:16px 20px}.trig-value-card h4{margin:0 0 8px;color:#fb7185;font-size:14px}.trig-value-card .val-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.05)}.trig-value-card .val-row:last-child{border-bottom:none}.trig-value-card .fn-name{color:#94a3b8;font-weight:700;font-size:14px}.trig-value-card .fn-val{font-family:Courier New,monospace;color:#e2e8f0;font-weight:800;font-size:16px}.trig-table{width:100%;border-collapse:collapse;font-size:13px}.trig-table th,.trig-table td{padding:8px 6px;text-align:center;border:1px solid rgba(255,255,255,.08)}.trig-table th{background:#f43f5e1f;color:#fb7185;font-weight:800}.trig-table td{color:#cbd5e1;font-family:Courier New,monospace}.trig-table tr:nth-child(2n) td{background:#ffffff05}.trig-slider-area{margin-top:16px;text-align:center}.trig-slider-area input[type=range]{width:80%;max-width:350px;-webkit-appearance:none;appearance:none;height:6px;background:#ffffff1f;border-radius:10px;outline:none}.trig-slider-area input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:#f43f5e;border-radius:50%;cursor:pointer;border:2px solid #881337}.trig-angle-display{font-size:36px;font-weight:900;color:#f43f5e;margin:10px 0 4px;font-family:Courier New,monospace}.trig-btn{padding:14px 32px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#f43f5e,#fb7185);color:#fff}.trig-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #f43f5e66}.trig-btn.secondary{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#94a3b8}.trig-quiz-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:20px}.trig-quiz-opt{padding:14px;border-radius:14px;background:#ffffff0f;border:2px solid rgba(255,255,255,.1);color:#e2e8f0;font-weight:700;font-size:16px;cursor:pointer;transition:all .3s;text-align:center;font-family:Courier New,monospace}.trig-quiz-opt:hover{background:#f43f5e26;border-color:#f43f5e}.trig-quiz-opt.correct{background:#22c55e33;border-color:#22c55e}.trig-quiz-opt.wrong{background:#ef444433;border-color:#ef4444}.trig-quiz-opt.disabled{opacity:.5;pointer-events:none}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in-up{animation:fadeInUp .5s ease-out}@media(max-width:700px){.trig-layout{flex-direction:column}.trig-info-area{flex:none;width:100%}.trig-quiz-grid{grid-template-columns:1fr}}.matrix-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.matrix-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.matrix-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1);cursor:default}.matrix-instruction{background:#f59e0b1f;border:1px dashed rgba(245,158,11,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.matrix-board{transform-origin:top center;display:flex;justify-content:center}.matrix-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.matrix-tabs{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}.matrix-tab{padding:10px 18px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:13px;cursor:pointer;transition:all .3s}.matrix-tab.active{background:linear-gradient(135deg,#f59e0b,#fbbf24);color:#1e293b;border-color:transparent;box-shadow:0 4px 20px #f59e0b4d}.matrix-tab:hover:not(.active){background:#ffffff1a}.matrix-op-layout{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;align-items:center;margin-bottom:24px}.matrix-grid-wrapper{display:flex;flex-direction:column;align-items:center;gap:6px}.matrix-grid-wrapper .label{font-size:14px;font-weight:800;color:#fbbf24}.matrix-grid{display:grid;gap:6px;background:#f59e0b0f;border:2px solid rgba(245,158,11,.2);border-radius:14px;padding:14px}.matrix-grid.size-2{grid-template-columns:repeat(2,60px)}.matrix-grid.size-3{grid-template-columns:repeat(3,56px)}.matrix-cell{width:100%;height:44px;text-align:center;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;color:#e2e8f0;font-weight:800;font-size:16px;font-family:Courier New,monospace;outline:none;transition:all .3s}.matrix-cell:focus{border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b33;background:#f59e0b1a}.matrix-cell.readonly{background:#ffffff08;cursor:default}.matrix-op-symbol{font-size:36px;color:#fbbf24;font-weight:900;padding:0 6px}.matrix-result-area{background:#22c55e14;border:1px solid rgba(34,197,94,.2);border-radius:16px;padding:20px;text-align:center}.matrix-result-area h3{color:#22c55e;margin:0 0 14px;font-size:16px}.matrix-result-grid{display:inline-grid;gap:6px;background:#22c55e0f;border:2px solid rgba(34,197,94,.3);border-radius:14px;padding:14px}.matrix-result-grid.size-2{grid-template-columns:repeat(2,60px)}.matrix-result-grid.size-3{grid-template-columns:repeat(3,56px)}.matrix-result-cell{height:44px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#22c55e1a;border:1px solid rgba(34,197,94,.25);color:#22c55e;font-weight:900;font-size:16px;font-family:Courier New,monospace}.det-display{margin-top:16px;padding:20px;background:#8b5cf61a;border-radius:14px;border:1px solid rgba(139,92,246,.25);text-align:center}.det-display .det-label{color:#a78bfa;font-size:14px;font-weight:700}.det-display .det-value{color:#e2e8f0;font-size:40px;font-weight:900;font-family:Courier New,monospace;margin-top:4px}.det-display .det-formula{color:#64748b;font-size:13px;margin-top:8px;font-family:Courier New,monospace}.matrix-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#f59e0b,#fbbf24);color:#1e293b}.matrix-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #f59e0b66}.matrix-btn.secondary{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#94a3b8}.matrix-size-toggle{display:flex;gap:10px;justify-content:center;margin-bottom:20px}@media(max-width:600px){.matrix-grid.size-3,.matrix-result-grid.size-3{grid-template-columns:repeat(3,44px)}.matrix-cell,.matrix-result-cell{height:38px;font-size:14px}.matrix-board-inner{padding:16px}}.vector-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.vector-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.vector-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1);cursor:default}.vector-instruction{background:#10b9811f;border:1px dashed rgba(16,185,129,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.vector-board{transform-origin:top center;display:flex;justify-content:center}.vector-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.vector-tabs{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}.vector-tab{padding:10px 20px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:13px;cursor:pointer;transition:all .3s}.vector-tab.active{background:linear-gradient(135deg,#10b981,#34d399);color:#0f172a;border-color:transparent;box-shadow:0 4px 20px #10b9814d}.vector-tab:hover:not(.active){background:#ffffff1a}.vector-layout{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.vector-canvas-area{flex:1;min-width:320px;display:flex;flex-direction:column;align-items:center}.vector-controls{flex:0 0 280px;display:flex;flex-direction:column;gap:14px}.vector-input-card{background:#10b98114;border:1px solid rgba(16,185,129,.2);border-radius:14px;padding:16px 20px}.vector-input-card h4{margin:0 0 12px;font-size:14px}.vector-input-row{display:flex;gap:8px;align-items:center;margin-bottom:8px}.vector-input-row label{font-weight:700;font-size:14px;color:#94a3b8;min-width:16px}.vector-input-row input[type=number]{flex:1;height:38px;text-align:center;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;color:#e2e8f0;font-weight:800;font-size:15px;font-family:Courier New,monospace;outline:none}.vector-input-row input[type=number]:focus{border-color:#10b981;box-shadow:0 0 0 3px #10b98133}.vector-result-card{background:#3b82f614;border:1px solid rgba(59,130,246,.2);border-radius:14px;padding:16px 20px}.vector-result-card h4{color:#60a5fa;margin:0 0 10px;font-size:14px}.vector-result-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.05);align-items:center}.vector-result-row:last-child{border-bottom:none}.vector-result-row .label{color:#94a3b8;font-weight:700;font-size:13px}.vector-result-row .value{color:#e2e8f0;font-weight:900;font-family:Courier New,monospace;font-size:15px}.vector-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#10b981,#34d399);color:#0f172a}.vector-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #10b98166}.vector-btn.secondary{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#94a3b8}.vector-op-info{padding:14px 20px;background:#ffffff0a;border-radius:12px;border:1px solid rgba(255,255,255,.06);font-size:13px;color:#94a3b8;line-height:1.6}.vector-op-info strong{color:#e2e8f0}@media(max-width:700px){.vector-layout{flex-direction:column}.vector-controls{flex:none;width:100%}}.sequence-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.sequence-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.sequence-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1);cursor:default}.sequence-instruction{background:#06b6d41f;border:1px dashed rgba(6,182,212,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.sequence-board{transform-origin:top center;display:flex;justify-content:center}.sequence-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.sequence-tabs{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}.sequence-tab{padding:12px 22px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s}.sequence-tab.active{background:linear-gradient(135deg,#06b6d4,#22d3ee);color:#0f172a;border-color:transparent;box-shadow:0 4px 20px #06b6d44d}.sequence-tab:hover:not(.active){background:#ffffff1a}.sequence-params{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:24px;justify-content:center}.sequence-param{background:#06b6d414;border:1px solid rgba(6,182,212,.2);border-radius:14px;padding:14px 18px;display:flex;flex-direction:column;gap:6px;min-width:120px}.sequence-param label{font-size:12px;font-weight:700;color:#67e8f9;text-transform:uppercase;letter-spacing:.5px}.sequence-param input{background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:10px;color:#e2e8f0;font-weight:800;font-size:16px;font-family:Courier New,monospace;padding:8px 12px;text-align:center;outline:none;width:80px}.sequence-param input:focus{border-color:#06b6d4;box-shadow:0 0 0 3px #06b6d433}.sequence-terms{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:24px}.sequence-term{background:#06b6d41a;border:1px solid rgba(6,182,212,.25);border-radius:12px;padding:10px 16px;min-width:50px;text-align:center}.sequence-term .term-idx{font-size:11px;color:#67e8f9;font-weight:700}.sequence-term .term-val{font-size:18px;font-weight:900;color:#e2e8f0;font-family:Courier New,monospace}.sequence-formula-box{background:#8b5cf614;border:1px solid rgba(139,92,246,.2);border-radius:16px;padding:20px;margin-bottom:20px}.sequence-formula-box h4{color:#a78bfa;margin:0 0 12px;font-size:15px}.formula-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05);flex-wrap:wrap;gap:6px}.formula-row:last-child{border-bottom:none}.formula-row .f-label{color:#94a3b8;font-weight:700;font-size:13px}.formula-row .f-value{color:#e2e8f0;font-weight:900;font-family:Courier New,monospace;font-size:16px}.sequence-chart{margin-top:20px}.sequence-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:6px}.sequence-bar-row .bar-label{font-size:12px;color:#94a3b8;min-width:30px;text-align:right;font-weight:700}.sequence-bar-row .bar-track{flex:1;height:20px;background:#ffffff0a;border-radius:10px;overflow:hidden}.sequence-bar-row .bar-fill{height:100%;border-radius:10px;transition:width .5s ease}.sequence-bar-row .bar-val{font-size:12px;color:#e2e8f0;font-weight:800;font-family:Courier New,monospace;min-width:50px}.seq-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#06b6d4,#22d3ee);color:#0f172a}.seq-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #06b6d466}.seq-btn.secondary{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#94a3b8}@media(max-width:600px){.sequence-board-inner{padding:16px}.sequence-term{min-width:40px;padding:8px 10px}.sequence-term .term-val{font-size:14px}}.linprog-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.linprog-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.linprog-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1);cursor:default}.linprog-instruction{background:#eab3081f;border:1px dashed rgba(234,179,8,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.linprog-board{transform-origin:top center;display:flex;justify-content:center}.linprog-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.linprog-layout{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.linprog-graph-area{flex:1;min-width:320px;display:flex;flex-direction:column;align-items:center}.linprog-controls{flex:0 0 290px;display:flex;flex-direction:column;gap:14px}.linprog-card{background:#eab30814;border:1px solid rgba(234,179,8,.2);border-radius:14px;padding:16px 20px}.linprog-card h4{margin:0 0 10px;font-size:14px;color:#fbbf24}.linprog-slider-row{display:flex;align-items:center;gap:10px;margin-top:8px}.linprog-slider-row label{font-weight:700;font-size:13px;color:#94a3b8;min-width:24px}.linprog-slider-row input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:#ffffff1f;border-radius:10px;outline:none}.linprog-slider-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#eab308;border-radius:50%;cursor:pointer;border:2px solid #854d0e}.linprog-slider-row .val{font-family:Courier New,monospace;color:#fbbf24;font-weight:800;min-width:28px;text-align:right;font-size:14px}.linprog-eq-display{font-family:Courier New,monospace;font-size:15px;font-weight:800;color:#e2e8f0;margin-bottom:10px}.linprog-select{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#e2e8f0;padding:8px 12px;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;width:100%}.linprog-select option{background:#1e293b;color:#e2e8f0}.linprog-result{background:#22c55e14;border:1px solid rgba(34,197,94,.2);border-radius:14px;padding:16px 20px}.linprog-result h4{color:#22c55e;margin:0 0 10px;font-size:14px}.linprog-result .res-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.05)}.linprog-result .res-row:last-child{border-bottom:none}.linprog-result .res-label{color:#94a3b8;font-weight:700;font-size:13px}.linprog-result .res-value{color:#e2e8f0;font-weight:900;font-family:Courier New,monospace}.linprog-vertex-list{margin-top:10px}.linprog-vertex{display:flex;justify-content:space-between;align-items:center;padding:8px 14px;border-radius:10px;margin-bottom:4px;font-size:13px;font-family:Courier New,monospace}.linprog-vertex.optimal{background:#22c55e1f;border:1px solid rgba(34,197,94,.3)}.lp-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#eab308,#fbbf24);color:#1e293b}.lp-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #eab30866}.lp-btn.secondary{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#94a3b8}@media(max-width:700px){.linprog-layout{flex-direction:column}.linprog-controls{flex:none;width:100%}}.composition-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.composition-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.composition-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1)}.composition-instruction{background:#a855f71f;border:1px dashed rgba(168,85,247,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.composition-board{transform-origin:top center;display:flex;justify-content:center}.composition-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:800px}.comp-tabs{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}.comp-tab{padding:12px 22px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s}.comp-tab.active{background:linear-gradient(135deg,#a855f7,#c084fc);color:#fff;border-color:transparent;box-shadow:0 4px 20px #a855f74d}.comp-tab:hover:not(.active){background:#ffffff1a}.comp-func-card{background:#a855f714;border:1px solid rgba(168,85,247,.2);border-radius:14px;padding:18px 22px;margin-bottom:16px}.comp-func-card h4{margin:0 0 12px;font-size:14px}.comp-func-card .func-display{font-family:Courier New,monospace;font-size:22px;font-weight:900;color:#e2e8f0;text-align:center;margin-bottom:12px}.comp-slider-row{display:flex;align-items:center;gap:10px;margin-top:8px}.comp-slider-row label{font-weight:700;font-size:13px;color:#94a3b8;min-width:20px}.comp-slider-row input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:#ffffff1f;border-radius:10px;outline:none}.comp-slider-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#a855f7;border-radius:50%;cursor:pointer;border:2px solid #581c87}.comp-slider-row .val{font-family:Courier New,monospace;color:#c084fc;font-weight:800;min-width:28px;text-align:right}.comp-pipeline{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin:24px 0}.comp-pipe-box{padding:14px 22px;border-radius:14px;font-weight:800;font-size:18px;font-family:Courier New,monospace;text-align:center;min-width:60px}.comp-pipe-arrow{font-size:24px;color:#64748b}.comp-result-box{background:#22c55e14;border:1px solid rgba(34,197,94,.2);border-radius:16px;padding:20px;margin-top:20px}.comp-result-box h4{color:#22c55e;margin:0 0 12px;font-size:15px}.comp-res-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05);flex-wrap:wrap;gap:6px}.comp-res-row:last-child{border-bottom:none}.comp-res-row .cr-label{color:#94a3b8;font-weight:700;font-size:14px}.comp-res-row .cr-value{color:#e2e8f0;font-weight:900;font-family:Courier New,monospace;font-size:16px}.comp-x-input{display:flex;align-items:center;gap:12px;justify-content:center;margin:20px 0}.comp-x-input label{font-weight:800;color:#c084fc;font-size:16px}.comp-x-input input{width:80px;height:44px;text-align:center;border-radius:12px;border:2px solid rgba(168,85,247,.3);background:#ffffff0f;color:#e2e8f0;font-weight:900;font-size:20px;font-family:Courier New,monospace;outline:none}.comp-x-input input:focus{border-color:#a855f7;box-shadow:0 0 0 3px #a855f733}.comp-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#a855f7,#c084fc);color:#fff}.comp-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #a855f766}.limit-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.limit-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.limit-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1)}.limit-instruction{background:#0ea5e91f;border:1px dashed rgba(14,165,233,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.limit-board{transform-origin:top center;display:flex;justify-content:center}.limit-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.limit-func-select{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap;justify-content:center}.limit-func-btn{padding:10px 18px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:13px;cursor:pointer;transition:all .3s;font-family:Courier New,monospace}.limit-func-btn.active{background:linear-gradient(135deg,#0ea5e9,#38bdf8);color:#0f172a;border-color:transparent;box-shadow:0 4px 16px #0ea5e94d}.limit-func-btn:hover:not(.active){background:#ffffff1a}.limit-layout{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.limit-graph-area{flex:1;min-width:320px;display:flex;flex-direction:column;align-items:center}.limit-info-area{flex:0 0 280px;display:flex;flex-direction:column;gap:14px}.limit-slider-area{text-align:center;margin-top:16px}.limit-a-display{font-size:32px;font-weight:900;color:#0ea5e9;font-family:Courier New,monospace;margin-bottom:6px}.limit-slider-area input[type=range]{width:80%;max-width:350px;-webkit-appearance:none;appearance:none;height:6px;background:#ffffff1f;border-radius:10px;outline:none}.limit-slider-area input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:#0ea5e9;border-radius:50%;cursor:pointer;border:2px solid #0369a1}.limit-value-card{background:#0ea5e914;border:1px solid rgba(14,165,233,.2);border-radius:14px;padding:16px 20px}.limit-value-card h4{margin:0 0 10px;color:#38bdf8;font-size:14px}.limit-val-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.05)}.limit-val-row:last-child{border-bottom:none}.limit-val-row .lv-label{color:#94a3b8;font-weight:700;font-size:13px}.limit-val-row .lv-value{color:#e2e8f0;font-weight:900;font-family:Courier New,monospace;font-size:15px}.limit-table{width:100%;border-collapse:collapse;font-size:13px;margin-top:14px}.limit-table th,.limit-table td{padding:8px 6px;text-align:center;border:1px solid rgba(255,255,255,.08)}.limit-table th{background:#0ea5e91f;color:#38bdf8;font-weight:800}.limit-table td{color:#cbd5e1;font-family:Courier New,monospace}.limit-table .left-side{background:#ef44440f}.limit-table .right-side{background:#22c55e0f}.limit-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#0ea5e9,#38bdf8);color:#0f172a}.limit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0ea5e966}@media(max-width:700px){.limit-layout{flex-direction:column}.limit-info-area{flex:none;width:100%}}.derivative-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.derivative-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.derivative-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1)}.derivative-instruction{background:#f973161f;border:1px dashed rgba(249,115,22,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.derivative-board{transform-origin:top center;display:flex;justify-content:center}.derivative-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.deriv-tabs{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}.deriv-tab{padding:12px 22px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s}.deriv-tab.active{background:linear-gradient(135deg,#f97316,#fb923c);color:#fff;border-color:transparent;box-shadow:0 4px 20px #f973164d}.deriv-tab:hover:not(.active){background:#ffffff1a}.deriv-layout{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.deriv-graph-area{flex:1;min-width:320px;display:flex;flex-direction:column;align-items:center}.deriv-info-area{flex:0 0 280px;display:flex;flex-direction:column;gap:14px}.deriv-param-card{background:#f9731614;border:1px solid rgba(249,115,22,.2);border-radius:14px;padding:16px 20px}.deriv-param-card h4{margin:0 0 10px;color:#fb923c;font-size:14px}.deriv-slider-row{display:flex;align-items:center;gap:10px;margin-top:8px}.deriv-slider-row label{font-weight:700;font-size:13px;color:#94a3b8;min-width:20px}.deriv-slider-row input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:#ffffff1f;border-radius:10px;outline:none}.deriv-slider-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#f97316;border-radius:50%;cursor:pointer;border:2px solid #9a3412}.deriv-slider-row .val{font-family:Courier New,monospace;color:#fb923c;font-weight:800;min-width:28px;text-align:right}.deriv-result-card{background:#22c55e14;border:1px solid rgba(34,197,94,.2);border-radius:14px;padding:16px 20px}.deriv-result-card h4{color:#22c55e;margin:0 0 10px;font-size:14px}.deriv-res-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.05);flex-wrap:wrap;gap:4px}.deriv-res-row:last-child{border-bottom:none}.deriv-res-row .dr-label{color:#94a3b8;font-weight:700;font-size:13px}.deriv-res-row .dr-value{color:#e2e8f0;font-weight:900;font-family:Courier New,monospace;font-size:15px}.deriv-rules-section{margin-top:16px}.deriv-rule{background:#f973160f;border:1px solid rgba(249,115,22,.15);border-radius:10px;padding:10px 14px;margin-bottom:6px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px}.deriv-rule .rule-name{color:#fdba74;font-weight:700;font-size:12px}.deriv-rule .rule-formula{color:#e2e8f0;font-family:Courier New,monospace;font-size:13px}.deriv-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#f97316,#fb923c);color:#fff}.deriv-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #f9731666}@media(max-width:700px){.deriv-layout{flex-direction:column}.deriv-info-area{flex:none;width:100%}}.advstats-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.advstats-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.advstats-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1)}.advstats-instruction{background:#ec48991f;border:1px dashed rgba(236,72,153,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.advstats-board{transform-origin:top center;display:flex;justify-content:center}.advstats-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.advstats-input-area{margin-bottom:24px}.advstats-input-area h4{color:#f472b6;margin:0 0 10px;font-size:15px}.advstats-data-input{width:100%;padding:14px 18px;border-radius:14px;border:2px solid rgba(236,72,153,.2);background:#ffffff0f;color:#e2e8f0;font-size:16px;font-family:Courier New,monospace;font-weight:700;outline:none;resize:none}.advstats-data-input:focus{border-color:#ec4899;box-shadow:0 0 0 3px #ec489926}.advstats-freq-table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:24px}.advstats-freq-table th,.advstats-freq-table td{padding:10px 8px;text-align:center;border:1px solid rgba(255,255,255,.08)}.advstats-freq-table th{background:#ec48991f;color:#f472b6;font-weight:800}.advstats-freq-table td{color:#cbd5e1;font-family:Courier New,monospace}.advstats-stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-bottom:24px}.advstats-stat-card{background:#ec48990f;border:1px solid rgba(236,72,153,.15);border-radius:14px;padding:16px;text-align:center}.advstats-stat-card .stat-label{font-size:12px;color:#f472b6;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.advstats-stat-card .stat-value{font-size:24px;font-weight:900;color:#e2e8f0;font-family:Courier New,monospace}.advstats-histogram{margin-top:20px}.advstats-histogram h4{color:#f472b6;margin:0 0 14px;font-size:15px}.hist-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:6px}.hist-bar-row .bar-label{font-size:12px;color:#94a3b8;min-width:60px;text-align:right;font-weight:700;font-family:Courier New,monospace}.hist-bar-row .bar-track{flex:1;height:24px;background:#ffffff0a;border-radius:12px;overflow:hidden}.hist-bar-row .bar-fill{height:100%;border-radius:12px;background:linear-gradient(90deg,#ec489966,#f472b6b3);transition:width .5s ease}.hist-bar-row .bar-val{font-size:13px;color:#e2e8f0;font-weight:800;font-family:Courier New,monospace;min-width:30px}.advstats-presets{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.advstats-preset-btn{padding:8px 16px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:12px;cursor:pointer;transition:all .3s}.advstats-preset-btn:hover{background:#ec489926;border-color:#ec4899;color:#f472b6}.advstats-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#ec4899,#f472b6);color:#fff}.advstats-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #ec489966}.integral-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.integral-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.integral-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1)}.integral-instruction{background:#6366f11f;border:1px dashed rgba(99,102,241,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.integral-board{transform-origin:top center;display:flex;justify-content:center}.integral-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.integral-tabs{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}.integral-tab{padding:12px 22px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s}.integral-tab.active{background:linear-gradient(135deg,#6366f1,#818cf8);color:#fff;border-color:transparent;box-shadow:0 4px 20px #6366f14d}.integral-tab:hover:not(.active){background:#ffffff1a}.integral-layout{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.integral-graph-area{flex:1;min-width:320px;display:flex;flex-direction:column;align-items:center}.integral-info-area{flex:0 0 280px;display:flex;flex-direction:column;gap:14px}.integral-card{background:#6366f114;border:1px solid rgba(99,102,241,.2);border-radius:14px;padding:16px 20px}.integral-card h4{margin:0 0 10px;color:#818cf8;font-size:14px}.integral-slider-row{display:flex;align-items:center;gap:10px;margin-top:8px}.integral-slider-row label{font-weight:700;font-size:13px;color:#94a3b8;min-width:20px}.integral-slider-row input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:#ffffff1f;border-radius:10px;outline:none}.integral-slider-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#6366f1;border-radius:50%;cursor:pointer;border:2px solid #3730a3}.integral-slider-row .val{font-family:Courier New,monospace;color:#818cf8;font-weight:800;min-width:28px;text-align:right}.integral-res-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.05)}.integral-res-row:last-child{border-bottom:none}.integral-res-row .ir-label{color:#94a3b8;font-weight:700;font-size:13px}.integral-res-row .ir-value{color:#e2e8f0;font-weight:900;font-family:Courier New,monospace;font-size:15px}.integral-rule{background:#6366f10f;border:1px solid rgba(99,102,241,.15);border-radius:10px;padding:10px 14px;margin-bottom:6px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px}.integral-rule .rule-name{color:#a5b4fc;font-weight:700;font-size:12px}.integral-rule .rule-formula{color:#e2e8f0;font-family:Courier New,monospace;font-size:13px}.integral-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#6366f1,#818cf8);color:#fff}.integral-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #6366f166}@media(max-width:700px){.integral-layout{flex-direction:column}.integral-info-area{flex:none;width:100%}}.distribution-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.distribution-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.distribution-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1)}.distribution-instruction{background:#14b8a61f;border:1px dashed rgba(20,184,166,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.distribution-board{transform-origin:top center;display:flex;justify-content:center}.distribution-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.dist-tabs{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}.dist-tab{padding:12px 22px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s}.dist-tab.active{background:linear-gradient(135deg,#14b8a6,#2dd4bf);color:#0f172a;border-color:transparent;box-shadow:0 4px 20px #14b8a64d}.dist-tab:hover:not(.active){background:#ffffff1a}.dist-layout{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.dist-graph-area{flex:1;min-width:320px;display:flex;flex-direction:column;align-items:center}.dist-info-area{flex:0 0 280px;display:flex;flex-direction:column;gap:14px}.dist-card{background:#14b8a614;border:1px solid rgba(20,184,166,.2);border-radius:14px;padding:16px 20px}.dist-card h4{margin:0 0 10px;color:#2dd4bf;font-size:14px}.dist-slider-row{display:flex;align-items:center;gap:10px;margin-top:8px}.dist-slider-row label{font-weight:700;font-size:13px;color:#94a3b8;min-width:20px}.dist-slider-row input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:#ffffff1f;border-radius:10px;outline:none}.dist-slider-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#14b8a6;border-radius:50%;cursor:pointer;border:2px solid #0f766e}.dist-slider-row .val{font-family:Courier New,monospace;color:#2dd4bf;font-weight:800;min-width:28px;text-align:right}.dist-res-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.05)}.dist-res-row:last-child{border-bottom:none}.dist-res-row .dr-label{color:#94a3b8;font-weight:700;font-size:13px}.dist-res-row .dr-value{color:#e2e8f0;font-weight:900;font-family:Courier New,monospace;font-size:15px}.dist-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#14b8a6,#2dd4bf);color:#0f172a}.dist-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #14b8a666}@media(max-width:700px){.dist-layout{flex-direction:column}.dist-info-area{flex:none;width:100%}}.space3d-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.space3d-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.space3d-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1)}.space3d-instruction{background:#3b82f61f;border:1px dashed rgba(59,130,246,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.space3d-board{transform-origin:top center;display:flex;justify-content:center}.space3d-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.space3d-tabs{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}.space3d-tab{padding:12px 22px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#94a3b8;font-weight:700;font-size:14px;cursor:pointer;transition:all .3s}.space3d-tab.active{background:linear-gradient(135deg,#3b82f6,#60a5fa);color:#0f172a;border-color:transparent;box-shadow:0 4px 20px #3b82f64d}.space3d-tab:hover:not(.active){background:#ffffff1a}.space3d-layout{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.space3d-graph-area{flex:1;min-width:320px;display:flex;flex-direction:column;align-items:center}.space3d-info-area{flex:0 0 280px;display:flex;flex-direction:column;gap:14px}.space3d-card{background:#3b82f614;border:1px solid rgba(59,130,246,.2);border-radius:14px;padding:16px 20px}.space3d-card h4{margin:0 0 10px;color:#60a5fa;font-size:14px}.space3d-slider-row{display:flex;align-items:center;gap:10px;margin-top:8px}.space3d-slider-row label{font-weight:700;font-size:13px;color:#94a3b8;min-width:20px}.space3d-slider-row input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:#ffffff1f;border-radius:10px;outline:none}.space3d-slider-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#3b82f6;border-radius:50%;cursor:pointer;border:2px solid #1d4ed8}.space3d-slider-row .val{font-family:Courier New,monospace;color:#60a5fa;font-weight:800;min-width:28px;text-align:right}.space3d-res-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.05)}.space3d-res-row:last-child{border-bottom:none}.space3d-res-row .sr-label{color:#94a3b8;font-weight:700;font-size:13px}.space3d-res-row .sr-value{color:#e2e8f0;font-weight:900;font-family:Courier New,monospace;font-size:15px}.space3d-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#3b82f6,#60a5fa);color:#0f172a}.space3d-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #3b82f666}@media(max-width:700px){.space3d-layout{flex-direction:column}.space3d-info-area{flex:none;width:100%}}.induction-container{min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);padding:20px;font-family:Segoe UI,sans-serif;color:#e2e8f0}.induction-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.induction-nav .stat-badge{background:#ffffff14;padding:10px 18px;border-radius:14px;font-weight:700;font-size:14px;color:#94a3b8;border:1px solid rgba(255,255,255,.1)}.induction-instruction{background:#a855f71f;border:1px dashed rgba(168,85,247,.4);border-radius:16px;padding:18px 24px;margin-bottom:24px;max-width:700px;margin-left:auto;margin-right:auto}.induction-board{transform-origin:top center;display:flex;justify-content:center}.induction-board-inner{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:30px;width:100%;max-width:950px}.induct-step-card{background:#a855f70f;border:1px solid rgba(168,85,247,.15);border-radius:16px;padding:20px;margin-bottom:16px;position:relative}.induct-step-card.active{border-color:#a855f7;box-shadow:0 0 15px #a855f733}.induct-step-num{position:absolute;top:-12px;left:20px;background:#a855f7;color:#fff;font-weight:900;font-size:12px;padding:4px 10px;border-radius:10px}.induct-btn{padding:14px 28px;border-radius:14px;border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .3s;background:linear-gradient(135deg,#a855f7,#c084fc);color:#fff;display:block;margin:20px auto 0}.induct-btn:disabled{background:#ffffff1a;color:#64748b;cursor:not-allowed}.induct-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 24px #a855f766}.induct-formula{font-family:Courier New,monospace;font-size:18px;color:#e2e8f0;background:#0003;padding:10px 15px;border-radius:10px;margin-top:10px;display:inline-block;border-left:4px solid #a855f7}@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .4s ease-out}.mobile-bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:70px;background:#ffffffd9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid rgba(255,255,255,.3);box-shadow:0 -10px 40px #0000001a;z-index:9998;justify-content:space-around;align-items:center;padding:0 1rem;padding-bottom:env(safe-area-inset-bottom)}[data-theme=dark] .mobile-bottom-nav{background:#1e293bd9;border-top-color:#ffffff1a;box-shadow:0 -10px 40px #0000004d}.mobile-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;background:none;border:none;color:#94a3b8;gap:4px;padding:8px;transition:all .3s cubic-bezier(.175,.885,.32,1.275);cursor:pointer;flex:1}.mobile-nav-item .mobile-nav-icon{font-size:1.6rem;width:1.6rem;height:1.6rem;transition:transform .3s}.mobile-nav-item .mobile-nav-label{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.mobile-nav-item.active{color:#f59e0b;transform:translateY(-8px)}[data-theme=dark] .mobile-nav-item.active{color:#fbbf24}.mobile-nav-item.active .mobile-nav-icon{filter:drop-shadow(0 4px 6px rgba(245,158,11,.4))}.mobile-nav-item:active{transform:scale(.9)}@media(max-width:768px){.mobile-bottom-nav{display:flex}}.lux-logout-container{position:fixed;top:1rem;right:1rem;z-index:1100;display:flex;align-items:center;gap:.5rem}.lux-logout-btn{background:linear-gradient(135deg,#ff4d4d,#c00);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:2px solid rgba(255,255,255,.2);width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 15px #ef444466;overflow:hidden;position:relative}.lux-logout-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:.5s}.lux-logout-btn:hover{transform:translateY(-2px) scale(1.05);background:linear-gradient(135deg,#f66,#e60000);border-color:#fff6;box-shadow:0 8px 25px #ef444499}.lux-logout-btn:hover:before{left:100%}.lux-logout-btn:active{transform:translateY(0) scale(.9)}.lux-logout-icon{font-size:1.5rem;display:flex;align-items:center;justify-content:center}@media(max-width:768px){.lux-logout-container{top:.75rem;right:.75rem}.lux-logout-btn{width:42px;height:42px}.lux-logout-icon{font-size:1.3rem}}@keyframes luxPulse{0%{box-shadow:0 0 #10b98166}70%{box-shadow:0 0 0 10px #10b98100}to{box-shadow:0 0 #10b98100}}.lux-logout-btn.has-update{animation:luxPulse 2s infinite}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);min-height:100vh;color:var(--text-primary);transition:var(--theme-transition)}@media(max-width:768px){body{padding-bottom:70px}}.app{min-height:100vh}.header{background:var(--bg-card);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border-secondary);padding:1.25rem 2rem;position:sticky;top:0;z-index:100;transition:var(--theme-transition)}.header-content{max-width:1400px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}.header h1{font-size:1.75rem;font-weight:700;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;display:flex;align-items:center;gap:.75rem}.logo-icon{font-size:2rem}.btn-add{display:flex;align-items:center;gap:.5rem;padding:.875rem 1.5rem;background:var(--accent-gradient);color:#fff;border:none;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:var(--shadow-sm)}.btn-add:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn-add span{font-size:1.25rem;font-weight:300}.main-content{max-width:1400px;margin:0 auto;padding:2rem}@media(max-width:768px){.header{padding:1rem}.header-content{flex-direction:column;gap:1rem;text-align:center}.header h1{font-size:1.5rem}.main-content{padding:1rem;padding-bottom:90px}}