:root{--primary-950:#021a0d;--primary-900:#052e16;--primary-800:#0a3d2a;--primary-700:#0f5132;--primary-600:#166534;--primary-500:#1b7a3d;--primary-400:#22c55e;--primary-300:#4ade80;--primary-200:#86efac;--primary-100:#bbf7d0;--primary-50:#f0fdf4;--gold-700:#92400e;--gold-600:#b8860b;--gold-500:#d4a53c;--gold-400:#f4c430;--gold-300:#fbbf24;--gold-200:#fde68a;--gold-100:#fef3c7;--gold-50:#fffbeb;--gray-950:#030712;--gray-900:#111827;--gray-800:#1f2937;--gray-700:#374151;--gray-600:#4b5563;--gray-500:#6b7280;--gray-400:#9ca3af;--gray-300:#d1d5db;--gray-200:#e5e7eb;--gray-100:#f3f4f6;--gray-50:#f9fafb;--success:#16a34a;--success-light:#dcfce7;--warning:#f59e0b;--warning-light:#fef3c7;--danger:#ef4444;--danger-light:#fef2f2;--info:#3b82f6;--info-light:#eff6ff;--bg-app:#f0f2ec;--bg-card:#fff;--bg-card-hover:#fafbf8;--bg-header-start:#052e16;--bg-header-mid:#0f5132;--bg-header-end:#166534;--bg-nav:#fff;--bg-input:#f5f6f1;--border-light:#e8eae4;--border-default:#d5d8d0;--border-dark:#b0b5a8;--shadow-xs:0 1px 2px #0000000a;--shadow-sm:0 1px 3px #0000000f, 0 1px 2px #0000000a;--shadow-md:0 4px 6px -1px #00000012, 0 2px 4px -2px #0000000d;--shadow-lg:0 10px 15px -3px #00000014, 0 4px 6px -4px #0000000a;--shadow-xl:0 20px 25px -5px #00000014, 0 8px 10px -6px #0000000a;--shadow-card:0 2px 8px #052e160f;--shadow-card-hover:0 8px 24px #052e161f;--shadow-green:0 4px 14px #16653440;--radius-xs:6px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-2xl:24px;--radius-full:9999px;--font-heading:"Outfit", system-ui, -apple-system, sans-serif;--font-body:"Inter", system-ui, -apple-system, sans-serif;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--transition-fast:.15s ease;--transition-normal:.25s ease;--transition-slow:.35s cubic-bezier(.4, 0, .2, 1);--z-nav:100;--z-header:50;--z-modal:200;--z-toast:300;--glass-bg:#ffffff40;--glass-bg-strong:#ffffff73;--glass-border:#ffffff2e;--glass-border-strong:#ffffff59;--glass-shadow:0 8px 32px #0000001a;--glass-blur:20px;--glass-blur-strong:40px;--glass-light-bg:#fff6;--glass-light-border:#ffffff80;--glass-inset:inset 0 1px 0 #fff6;--gradient-hero:linear-gradient(135deg, #1665341a, #d4a53c1a);--gradient-card-hover:linear-gradient(135deg, #1665340d, #d4a53c0d);--gradient-glass:linear-gradient(135deg, #ffffff1a 0%, #fff0 100%);--shadow-glass:0 4px 30px #0000001a;--shadow-float:0 25px 50px -12px #00000026;--shadow-glow-green:0 0 40px #16c55e26;--shadow-glow-gold:0 0 40px #d4a53c26;--topic-ilmu:linear-gradient(135deg, #3b82f626, #06b6d426);--topic-ekonomi:linear-gradient(135deg, #10b98126, #22c55e26);--topic-khalifah:linear-gradient(135deg, #f59e0b26, #eab30826);--topic-akhlak:linear-gradient(135deg, #ec489926, #f43f5e26);--topic-alam:linear-gradient(135deg, #22c55e26, #10b98126);--topic-kesehatan:linear-gradient(135deg, #ef444426, #f9731626);--topic-keluarga:linear-gradient(135deg, #a855f726, #8b5cf626);--topic-ibadah:linear-gradient(135deg, #14b8a626, #06b6d426);--sidebar-width:280px;--detail-panel-width:380px;--header-height:72px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-body);color:var(--gray-700);background:var(--bg-app);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:1rem;line-height:1.5;overflow-x:hidden}#root{background:linear-gradient(180deg, var(--primary-900) 0%, var(--bg-app) 300px);justify-content:center;min-height:100dvh;display:flex}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--gray-900);font-weight:600;line-height:1.25}h1{font-size:1.75rem}h2{font-size:1.25rem}h3{font-size:1.1rem}p{margin:0;line-height:1.6}a{color:var(--primary-600);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--primary-500)}button{font-family:var(--font-body);cursor:pointer;border:none;outline:none;font-size:.9375rem}button:focus-visible{outline:2px solid var(--primary-400);outline-offset:2px}input,select,textarea{font-family:var(--font-body);font-size:1rem}img{max-width:100%;height:auto;display:block}ul,ol{list-style:none}.text-primary{color:var(--primary-600)}.text-gold{color:var(--gold-600)}.text-success{color:var(--success)}.text-warning{color:var(--warning)}.text-danger{color:var(--danger)}.text-muted{color:var(--gray-500)}.text-dark{color:var(--gray-900)}.font-heading{font-family:var(--font-heading)}.font-bold{font-weight:700}.font-semibold{font-weight:600}.font-medium{font-weight:500}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse-green{0%,to{box-shadow:0 0 #1665344d}50%{box-shadow:0 0 0 8px #16653400}}@keyframes scoreReveal{0%{stroke-dashoffset:var(--circumference)}to{stroke-dashoffset:var(--offset)}}@keyframes countUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.bottom-nav{background:var(--bg-nav);border-top:1px solid var(--border-light);width:100%;max-width:480px;padding:var(--space-2) 0;padding-bottom:calc(var(--space-2) + env(safe-area-inset-bottom,0px));z-index:var(--z-nav);-webkit-backdrop-filter:blur(12px);justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 -2px 10px #0000000a}.nav-item{padding:var(--space-1) var(--space-3);color:var(--gray-400);transition:all var(--transition-fast);border-radius:var(--radius-sm);flex-direction:column;align-items:center;gap:2px;min-width:56px;text-decoration:none;display:flex;position:relative}.nav-item:hover{color:var(--gray-600)}.nav-item.active{color:var(--primary-600)}.nav-item.active:before{content:"";background:var(--primary-600);border-radius:0 0 var(--radius-full) var(--radius-full);width:24px;height:3px;position:absolute;top:-8px;left:50%;transform:translate(-50%)}.nav-icon{width:22px;height:22px;transition:transform var(--transition-fast)}.nav-item.active .nav-icon{transform:scale(1.1)}.nav-label{letter-spacing:.2px;transition:color var(--transition-fast);font-size:.65rem;font-weight:500}.nav-item.active .nav-label{font-weight:700}.nav-item-center{background:linear-gradient(135deg, var(--primary-700), var(--primary-500));width:44px;height:44px;transition:all var(--transition-normal);border-radius:50%;justify-content:center;align-items:center;margin-top:-20px;display:flex;box-shadow:0 4px 12px #1665344d}.nav-item:hover .nav-item-center{transform:scale(1.05);box-shadow:0 6px 16px #16653466}.nav-item.active .nav-item-center{background:linear-gradient(135deg, var(--primary-600), var(--primary-400));animation:2s infinite pulse-green;box-shadow:0 4px 16px #16653466}.nav-icon-center{color:#fff;width:22px;height:22px}.dashboard{background:linear-gradient(135deg, var(--bg-app) 0%, #1665340d 100%);width:100%;min-height:100vh;position:relative;overflow:hidden}.dashboard:before,.dashboard:after{content:"";filter:blur(100px);opacity:.3;pointer-events:none;z-index:0;border-radius:50%;position:absolute}.dashboard:before{background:radial-gradient(circle,#16c55e33 0%,#0000 70%);width:500px;height:500px;animation:25s ease-in-out infinite floatOrb1;top:-150px;right:10%}.dashboard:after{background:radial-gradient(circle,#d4a53c33 0%,#0000 70%);width:400px;height:400px;animation:30s ease-in-out infinite floatOrb2;bottom:20%;left:5%}@keyframes floatOrb1{0%,to{transform:translate(0)scale(1)}50%{transform:translate(30px,50px)scale(1.1)}}@keyframes floatOrb2{0%,to{transform:translate(0)scale(1)}50%{transform:translate(-30px,-40px)scale(1.05)}}.dashboard-header{background:var(--glass-light-bg);-webkit-backdrop-filter:blur(var(--glass-blur-strong));border-bottom:1px solid var(--glass-border);padding:var(--space-6) var(--space-8);z-index:100;position:sticky;top:0}.dashboard-header-content{justify-content:space-between;align-items:center;max-width:1400px;margin:0 auto;display:flex}.dashboard-brand{align-items:center;gap:var(--space-4);display:flex}.dashboard-logo{border-radius:var(--radius-xl);background:linear-gradient(135deg, var(--primary-600), var(--gold-500));width:52px;height:52px;box-shadow:var(--shadow-green);justify-content:center;align-items:center;font-size:1.75rem;display:flex}.dashboard-brand-text h1{font-family:var(--font-heading);color:var(--gray-900);margin:0;font-size:1.5rem;font-weight:700}.dashboard-brand-text p{color:var(--gray-500);margin:0;font-size:.8rem}.dashboard-nav{align-items:center;gap:var(--space-3);display:flex}.dashboard-nav-btn{padding:var(--space-3) var(--space-5);border-radius:var(--radius-lg);background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--gray-600);font-family:var(--font-heading);cursor:pointer;transition:all var(--transition-fast);align-items:center;gap:var(--space-2);font-size:.875rem;font-weight:600;text-decoration:none;display:flex}.dashboard-nav-btn:hover{background:var(--glass-bg-strong);border-color:var(--glass-border-strong);transform:translateY(-2px)}.dashboard-nav-btn.primary{background:linear-gradient(135deg, var(--primary-600), var(--primary-500));color:#fff;box-shadow:var(--shadow-green);border:none}.dashboard-nav-btn.primary:hover{box-shadow:0 8px 20px #1665344d}.dashboard-user{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-full);display:flex}.dashboard-avatar{object-fit:cover;border:2px solid var(--primary-200);border-radius:50%;width:32px;height:32px}.dashboard-avatar-placeholder{background:linear-gradient(135deg, var(--primary-600), var(--gold-500));color:#fff;text-transform:uppercase;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:.875rem;font-weight:700;display:flex}.dashboard-user-name{font-family:var(--font-heading);color:var(--gray-700);font-size:.875rem;font-weight:600}.dashboard-content{max-width:1400px;padding:var(--space-8);z-index:1;margin:0 auto;position:relative}.dashboard-greeting{margin-bottom:var(--space-8)}.greeting-title{font-family:var(--font-heading);color:var(--gray-900);margin-bottom:var(--space-2);align-items:center;gap:var(--space-3);font-size:2.5rem;font-weight:700;display:flex}.greeting-icon{font-size:3rem}.greeting-subtitle{color:var(--gray-500);font-size:1.1rem}.dashboard-grid{gap:var(--space-6);grid-template-columns:repeat(12,1fr);display:grid}.dashboard-card{background:var(--glass-light-bg);-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-2xl);padding:var(--space-6);transition:all var(--transition-normal)}.dashboard-card:hover{box-shadow:var(--shadow-float);border-color:var(--glass-border-strong);transform:translateY(-4px)}.dashboard-card-title{font-family:var(--font-heading);color:var(--gray-700);margin-bottom:var(--space-5);align-items:center;gap:var(--space-3);font-size:1rem;font-weight:600;display:flex}.dashboard-card-title-icon{border-radius:var(--radius-md);background:var(--glass-bg);justify-content:center;align-items:center;width:36px;height:36px;font-size:1.1rem;display:flex}.score-card-wide{grid-column:span 12}.scores-grid{gap:var(--space-5);grid-template-columns:repeat(3,1fr);display:grid}.score-circle-wrapper{padding:var(--space-5);background:var(--glass-bg);border-radius:var(--radius-xl);border:1px solid var(--glass-border);transition:all var(--transition-fast);flex-direction:column;align-items:center;display:flex}.score-circle-wrapper:hover{box-shadow:var(--shadow-glass);transform:translateY(-4px)}.score-svg{margin:0 auto;display:block}.score-bg-ring{fill:none;stroke:var(--primary-50);stroke-width:6px}.score-fill-ring{fill:none;stroke-width:6px;stroke-linecap:round;transform-origin:50%;animation:1.2s forwards scoreReveal;transform:rotate(-90deg)}.score-value-overlay{margin-top:calc(-1 * var(--space-5));justify-content:center;align-items:center;display:flex}.score-number{font-family:var(--font-heading);color:var(--gray-900);font-size:1.75rem;font-weight:700;animation:.6s .4s both countUp}.score-max{color:var(--gray-400);margin-top:4px;font-size:.9rem;font-weight:500}.score-label{text-align:center;color:var(--gray-500);margin-top:var(--space-3);font-size:.85rem;font-weight:600}.stats-card{grid-column:span 12}.stat-card{background:var(--glass-bg);border-radius:var(--radius-xl);padding:var(--space-5);text-align:center;border:1px solid var(--glass-border);transition:all var(--transition-fast)}.stat-card:hover{box-shadow:var(--shadow-glass);transform:translateY(-4px)}.stat-card .stat-icon{margin-bottom:var(--space-2);font-size:2rem}.stat-card .stat-value{font-family:var(--font-heading);color:var(--gray-900);font-size:1.5rem;font-weight:700;line-height:1.3;animation:.5s .6s both countUp}.stat-card .stat-label{color:var(--gray-500);margin-top:var(--space-2);font-size:.85rem;font-weight:500}.stat-card .stat-sublabel{color:var(--gray-400);margin-top:var(--space-1);font-size:.75rem;font-style:italic}.goals-card{grid-column:span 6}.goals-list{gap:var(--space-4);flex-direction:column;display:flex}.goal-item{background:var(--glass-bg);border-radius:var(--radius-lg);padding:var(--space-4);border:1px solid var(--glass-border)}.goal-top{margin-bottom:var(--space-3);justify-content:space-between;align-items:center;display:flex}.goal-info{align-items:center;gap:var(--space-3);display:flex}.goal-emoji{font-size:1.5rem}.goal-name{font-family:var(--font-heading);color:var(--gray-800);font-size:.95rem;font-weight:600}.goal-percent{font-family:var(--font-heading);color:var(--primary-600);font-size:1rem;font-weight:700}.goal-progress{background:var(--glass-bg-strong);border-radius:var(--radius-full);height:8px;overflow:hidden}.goal-progress-fill{background:linear-gradient(90deg, var(--primary-500), var(--primary-400));border-radius:var(--radius-full);height:100%;transition:width 1s}.goal-amounts{color:var(--gray-400);margin-top:var(--space-2);text-align:right;font-size:.75rem}.recommendations-card{grid-column:span 6}.rekomendasi-list{gap:var(--space-3);flex-direction:column;display:flex}.rekomendasi-item{align-items:flex-start;gap:var(--space-3);padding:var(--space-4);background:var(--glass-bg);border-radius:var(--radius-lg);border:1px solid var(--glass-border);color:var(--gray-700);transition:all var(--transition-fast);font-size:.875rem;line-height:1.6;display:flex}.rekomendasi-item:hover{border-color:var(--glass-border-strong);transform:translate(4px)}.rekomendasi-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px;margin-top:6px}.rekomendasi-dot.green{background:var(--success);box-shadow:0 0 8px #16a34a80}.rekomendasi-dot.yellow{background:var(--warning);box-shadow:0 0 8px #f59e0b80}.actions-card{grid-column:span 12}.quick-actions-grid{gap:var(--space-4);grid-template-columns:repeat(4,1fr);display:grid}.action-card{background:var(--glass-bg);border-radius:var(--radius-xl);padding:var(--space-5);text-align:center;box-shadow:var(--shadow-card);border:1px solid var(--glass-border);transition:all var(--transition-normal);align-items:center;gap:var(--space-3);flex-direction:column;text-decoration:none;display:flex}.action-card:hover{box-shadow:var(--shadow-float);border-color:var(--primary-300);transform:translateY(-6px)scale(1.02)}.action-icon{border-radius:var(--radius-lg);background:var(--glass-bg-strong);border:1px solid var(--glass-border);width:56px;height:56px;transition:all var(--transition-fast);justify-content:center;align-items:center;font-size:1.75rem;display:flex}.action-card:hover .action-icon{background:linear-gradient(135deg, var(--primary-100), var(--primary-50));border-color:var(--primary-200)}.action-title{font-family:var(--font-heading);color:var(--gray-700);font-size:.85rem;font-weight:600}.dashboard-section{margin-bottom:var(--space-6)}@media (width<=1024px){.quick-actions-grid{grid-template-columns:repeat(3,1fr)}.goals-card,.recommendations-card{grid-column:span 12}}@media (width<=768px){.dashboard-content{padding:var(--space-5)}.greeting-title{font-size:1.75rem}.scores-grid,.stats-grid{grid-template-columns:1fr}.quick-actions-grid{grid-template-columns:repeat(2,1fr)}.dashboard-header{padding:var(--space-4)}.dashboard-nav{display:none}}.simulasi-period-selector{margin-bottom:var(--space-5)}.simulasi-period-selector .section-title{margin-bottom:var(--space-3)}.chart-container{background:var(--bg-card);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-card);border:1px solid var(--border-light);min-height:220px;margin-bottom:var(--space-5)}.chart-container .card-title{margin-bottom:var(--space-3)}.chart-header{margin-bottom:var(--space-4);justify-content:space-between;align-items:center;display:flex}.chart-header .card-title{margin-bottom:0}.chart-legend{gap:var(--space-4);display:flex}.chart-legend-item{align-items:center;gap:var(--space-1);color:var(--gray-500);font-size:.7rem;font-weight:500;display:flex}.chart-legend-dot{border-radius:var(--radius-full);width:8px;height:8px}.chart-legend-dot.current{background:linear-gradient(180deg, var(--primary-400), var(--primary-600))}.chart-legend-dot.optimal{background:linear-gradient(180deg, var(--gold-400), var(--gold-600))}.chart-area{padding-top:var(--space-2);position:relative}.chart-baseline{border-bottom:1px dashed var(--gray-200);z-index:0;position:absolute;bottom:28px;left:0;right:0}.chart-baseline-label{color:var(--gray-400);font-size:.6rem;font-weight:500;position:absolute;top:-16px;right:0}.chart-bars{padding-bottom:var(--space-4);z-index:1;flex-direction:row;justify-content:space-around;align-items:flex-end;min-height:180px;display:flex;position:relative}.chart-bar-wrapper{align-items:center;gap:var(--space-1);flex-direction:column;flex:1;display:flex}.chart-value{color:var(--gray-700);white-space:nowrap;text-align:center;min-height:16px;font-size:.65rem;font-weight:700;line-height:1.2}.chart-bar-group{align-items:flex-end;gap:3px;display:flex}.chart-bar{background:linear-gradient(180deg, var(--primary-300), var(--primary-600));border-radius:6px 6px 0 0;width:32px;min-height:0;transition:height .8s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 2px 6px #16653426}.chart-bar.optimal{background:linear-gradient(180deg, var(--gold-300), var(--gold-500));width:28px;box-shadow:0 2px 6px #d4a53c26}.chart-label{color:var(--gray-500);margin-top:var(--space-1);font-size:.7rem;font-weight:600}@keyframes growBar{0%{opacity:0;height:0!important}to{opacity:1}}.chart-bar{animation:.8s cubic-bezier(.4,0,.2,1) forwards growBar}.chart-bar-wrapper:first-child .chart-bar{animation-delay:0s}.chart-bar-wrapper:nth-child(2) .chart-bar{animation-delay:.1s}.chart-bar-wrapper:nth-child(3) .chart-bar{animation-delay:.2s}.chart-bar-wrapper:nth-child(4) .chart-bar{animation-delay:.3s}.chart-bar-wrapper:nth-child(5) .chart-bar{animation-delay:.4s}.chart-bar-wrapper:nth-child(6) .chart-bar{animation-delay:.5s}.scenario-grid{gap:var(--space-3);margin-bottom:var(--space-5);grid-template-columns:1fr 1fr;display:grid}.scenario-card{background:var(--bg-card);border-radius:var(--radius-md);padding:var(--space-4);box-shadow:var(--shadow-sm);border:1px solid var(--border-light);transition:all var(--transition-normal);border-left:4px solid #0000}.scenario-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.scenario-card.current{border-left-color:var(--primary-500)}.scenario-card.optimal{border-left-color:var(--gold-500)}.scenario-header{align-items:center;gap:var(--space-2);margin-bottom:var(--space-3);display:flex}.scenario-dot{border-radius:var(--radius-full);flex-shrink:0;width:8px;height:8px}.scenario-card.current .scenario-dot{background:var(--primary-500)}.scenario-card.optimal .scenario-dot{background:var(--gold-500)}.scenario-name{font-family:var(--font-heading);color:var(--gray-600);text-transform:uppercase;letter-spacing:.3px;font-size:.75rem;font-weight:600}.scenario-value{font-family:var(--font-heading);color:var(--gray-900);margin-bottom:var(--space-1);font-size:1.15rem;font-weight:700;line-height:1.3}.scenario-card.current .scenario-value{color:var(--primary-700)}.scenario-card.optimal .scenario-value{color:var(--gold-700)}.scenario-detail{color:var(--gray-500);font-size:.75rem}.scenario-detail span{color:var(--gray-700);font-weight:600}.simulasi-form-card{margin-bottom:var(--space-5)}.simulasi-form-card .form-input{font-variant-numeric:tabular-nums}.simulasi-form-card .form-hint{color:var(--gray-400);margin-top:var(--space-1);font-size:.7rem}.insight-card{background:var(--primary-50);border-radius:var(--radius-lg);padding:var(--space-5);border:1px solid var(--primary-100);border-left:4px solid var(--primary-500);margin-bottom:var(--space-5);animation:.5s .3s both fadeInUp}.insight-card-icon{margin-bottom:var(--space-2);font-size:1.3rem}.insight-card-text{color:var(--primary-800);font-size:.85rem;font-weight:500;line-height:1.6}.insight-card-text strong{color:var(--primary-700);font-weight:700}@media (width<=380px){.scenario-grid{grid-template-columns:1fr}.chart-bar{width:24px}.chart-bar.optimal{width:20px}.chart-value{font-size:.6rem}.scenario-value{font-size:1rem}}.target-card{background:linear-gradient(135deg, var(--primary-50), #e8f5ec);border:1.5px solid var(--primary-100);border-radius:var(--radius-lg);padding:var(--space-6);text-align:center;margin-bottom:var(--space-5);animation:.4s both fadeInUp}.target-card .target-label{color:var(--gray-500);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--space-3);font-size:.8rem;font-weight:600}.target-card .target-value-wrapper{justify-content:center;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2);display:flex}.target-card .target-prefix{font-family:var(--font-heading);color:var(--primary-600);font-size:1.1rem;font-weight:700}.target-value{font-family:var(--font-heading);color:var(--primary-700);border:none;border-bottom:2px dashed var(--primary-300);text-align:center;width:220px;padding:var(--space-1) var(--space-2);transition:all var(--transition-fast);background:0 0;font-size:1.5rem;font-weight:800}.target-value:focus{border-bottom-color:var(--primary-500);border-radius:var(--radius-xs) var(--radius-xs) 0 0;background:#fff9;outline:none}.target-note{color:var(--gray-400);margin-top:var(--space-1);font-size:.78rem}.savings-progress{margin-bottom:var(--space-5);animation:.5s .1s both fadeInUp}.savings-progress .card{padding:var(--space-5)}.savings-input-group{margin-bottom:var(--space-4)}.savings-input-group .form-input{color:var(--primary-700);font-size:1rem;font-weight:600}.progress-info{margin-bottom:var(--space-3)}.progress-labels{margin-bottom:var(--space-2);justify-content:space-between;align-items:center;display:flex}.progress-labels .progress-current{color:var(--primary-600);font-size:.85rem;font-weight:600}.progress-labels .progress-target{color:var(--gray-400);font-size:.85rem;font-weight:500}.progress-percentage{text-align:right;color:var(--primary-500);margin-top:var(--space-1);font-size:.78rem;font-weight:700}.estimation-section{margin-bottom:var(--space-5);animation:.5s .2s both fadeInUp}.estimation-grid{gap:var(--space-3);flex-direction:column;display:flex}.estimation-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-5);border:1px solid var(--border-light);border-left:4px solid var(--primary-400);box-shadow:var(--shadow-sm);transition:all var(--transition-normal);justify-content:space-between;align-items:center;animation:.4s both fadeInUp;display:flex}.estimation-card:first-child{animation-delay:.25s}.estimation-card:nth-child(2){animation-delay:.35s}.estimation-card:nth-child(3){animation-delay:.45s}.estimation-card:hover{box-shadow:var(--shadow-md);transform:translate(4px)}.estimation-card.fastest{border-left-color:var(--gold-500);background:linear-gradient(135deg, var(--gold-50), #fffdf5);border-color:var(--gold-200);box-shadow:var(--shadow-sm), 0 0 0 1px var(--gold-100)}.estimation-card.fastest:hover{box-shadow:var(--shadow-md), 0 0 0 1px var(--gold-200)}.estimation-content{gap:var(--space-1);flex-direction:column;display:flex}.estimation-amount{color:var(--gray-700);font-size:.85rem;font-weight:600}.estimation-duration{color:var(--gray-400);font-size:.75rem}.estimation-right{align-items:flex-end;gap:var(--space-1);flex-direction:column;display:flex}.estimation-year{font-family:var(--font-heading);color:var(--primary-700);font-size:1.3rem;font-weight:800}.estimation-card.fastest .estimation-year{color:var(--gold-700)}.estimation-icon{margin-bottom:var(--space-1);font-size:1.1rem}.estimation-badge{border-radius:var(--radius-full);background:var(--gold-100);color:var(--gold-700);letter-spacing:.3px;align-items:center;gap:4px;padding:2px 10px;font-size:.7rem;font-weight:700;display:inline-flex}.custom-section{margin-bottom:var(--space-5);animation:.5s .3s both fadeInUp}.custom-section .card{border:1.5px solid var(--primary-100)}.custom-result{margin-top:var(--space-4);padding:var(--space-4);background:var(--primary-50);border-radius:var(--radius-md);text-align:center}.custom-result-year{font-family:var(--font-heading);color:var(--primary-700);margin-bottom:var(--space-1);font-size:1.5rem;font-weight:800}.custom-result-info{color:var(--gray-500);font-size:.8rem}.summary-card{margin-bottom:var(--space-5);animation:.5s .35s both fadeInUp}.summary-card .card{padding:var(--space-6)}.summary-layout{align-items:center;gap:var(--space-6);display:flex}.summary-circle{flex-shrink:0;position:relative}.summary-circle svg{transform:rotate(-90deg)}.summary-circle-bg{fill:none;stroke:var(--primary-50);stroke-width:8px}.summary-circle-fill{fill:none;stroke:var(--primary-500);stroke-width:8px;stroke-linecap:round;transition:stroke-dashoffset 1s cubic-bezier(.4,0,.2,1);animation:1.2s ease-out forwards scoreReveal}.summary-circle-text{font-family:var(--font-heading);color:var(--primary-700);font-size:1.1rem;font-weight:800;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.summary-stats{gap:var(--space-3);flex-direction:column;flex:1;display:flex}.summary-stat{flex-direction:column;gap:2px;display:flex}.summary-stat-label{color:var(--gray-400);font-size:.75rem;font-weight:500}.summary-stat-value{font-family:var(--font-heading);color:var(--gray-800);font-size:1rem;font-weight:700}.summary-stat-value.text-primary{color:var(--primary-600)}.summary-stat-value.text-danger{color:var(--danger)}.tips-card{background:var(--gold-50);border:1px solid var(--gold-200);border-left:4px solid var(--gold-500);border-radius:var(--radius-lg);padding:var(--space-5);margin-bottom:var(--space-5);animation:.5s .4s both fadeInUp}.tips-card .tips-title{font-family:var(--font-heading);color:var(--gold-700);margin-bottom:var(--space-2);font-size:.9rem;font-weight:700}.tips-card .tips-text{color:var(--gray-600);font-size:.84rem;line-height:1.65}@media (width<=380px){.target-value{width:180px;font-size:1.25rem}.estimation-card{padding:var(--space-3) var(--space-4)}.estimation-year{font-size:1.1rem}.summary-layout{text-align:center;flex-direction:column}.summary-stats,.summary-stat{align-items:center}}.nisab-card{border-left:4px solid var(--gold-500);justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-5);display:flex}.nisab-card .nisab-info{flex:1}.nisab-card .nisab-label{color:var(--gray-500);margin-bottom:var(--space-1);font-size:.8rem;font-weight:500}.nisab-value{font-family:var(--font-heading);color:var(--gray-900);letter-spacing:-.5px;font-size:1.35rem;font-weight:700}.harta-form{margin-bottom:var(--space-5)}.harta-form .section-title{margin-bottom:var(--space-4)}.harta-form .form-group{animation:.4s both fadeInUp}.harta-form .form-group:first-child{animation-delay:50ms}.harta-form .form-group:nth-child(2){animation-delay:.1s}.harta-form .form-group:nth-child(3){animation-delay:.15s}.harta-form .form-group:nth-child(4){animation-delay:.2s}.harta-form .form-group:nth-child(5){animation-delay:.25s}.harta-form .form-group:nth-child(6){animation-delay:.3s}.input-icon{margin-right:var(--space-2);font-size:.95rem}.form-label-row{align-items:center;display:flex}.form-value-hint{color:var(--gray-400);margin-top:var(--space-1);text-align:right;font-size:.75rem}.status-row{margin-bottom:var(--space-5);justify-content:space-between;align-items:center;animation:.4s .32s both fadeInUp;display:flex}.status-row .status-label{color:var(--gray-600);font-size:.85rem;font-weight:500}.zakat-result{background:linear-gradient(145deg, var(--bg-header-start), var(--bg-header-mid), var(--bg-header-end));border-radius:var(--radius-lg);padding:var(--space-6);color:#fff;margin-bottom:var(--space-5);box-shadow:var(--shadow-green);animation:.5s .35s both scaleIn;position:relative;overflow:hidden}.zakat-result:before{content:"";pointer-events:none;background:#ffffff0d;border-radius:50%;width:160px;height:160px;position:absolute;top:-50px;right:-30px}.zakat-result:after{content:"";pointer-events:none;background:#ffffff08;border-radius:50%;width:140px;height:140px;position:absolute;bottom:-60px;left:-40px}.zakat-result-header{margin-bottom:var(--space-5);z-index:1;justify-content:space-between;align-items:center;display:flex;position:relative}.zakat-result-title{font-family:var(--font-heading);opacity:.85;text-transform:uppercase;letter-spacing:.5px;font-size:.85rem;font-weight:600}.zakat-result-icon{font-size:1.75rem}.zakat-amount{font-family:var(--font-heading);letter-spacing:-.5px;margin-bottom:var(--space-1);z-index:1;font-size:1.75rem;font-weight:800;animation:.6s .5s both countUp;position:relative}.zakat-percentage{opacity:.7;margin-bottom:var(--space-5);z-index:1;font-size:.8rem;position:relative}.zakat-breakdown{z-index:1;padding-top:var(--space-4);border-top:1px solid #ffffff26;position:relative}.breakdown-row{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding:8px 0;font-size:.85rem;display:flex}.breakdown-row:last-child{border-bottom:none}.breakdown-label{opacity:.8;font-weight:400}.breakdown-value{font-weight:600;font-family:var(--font-heading)}.breakdown-row.total{margin-top:var(--space-2);padding-top:var(--space-3);border-top:1px solid #fff3;border-bottom:none}.breakdown-row.total .breakdown-label,.breakdown-row.total .breakdown-value{opacity:1;font-size:.95rem;font-weight:700}.below-nisab-card{text-align:center;padding:var(--space-8) var(--space-5);margin-bottom:var(--space-5);animation:.4s .35s both fadeInUp}.below-nisab-card .info-icon{margin-bottom:var(--space-3);font-size:2.5rem}.below-nisab-card h3{color:var(--info);margin-bottom:var(--space-2)}.below-nisab-card p{color:var(--gray-500);font-size:.85rem;line-height:1.6}.due-date-row{padding:var(--space-4);background:var(--primary-50);border-radius:var(--radius-md);border:1px solid var(--primary-100);margin-bottom:var(--space-5);justify-content:space-between;align-items:center;animation:.4s .4s both fadeInUp;display:flex}.due-date-row .due-label{color:var(--gray-600);align-items:center;gap:var(--space-2);font-size:.85rem;font-weight:500;display:flex}.due-date-row .due-value{color:var(--primary-700);font-size:.9rem;font-weight:700;font-family:var(--font-heading)}.zakat-actions{margin-top:var(--space-2);animation:.4s .45s both fadeInUp}.zakat-actions .btn{margin-bottom:var(--space-3)}.zakat-detail-link{text-align:center;color:var(--primary-600);cursor:pointer;transition:color var(--transition-fast);font-size:.85rem;font-weight:500;display:block}.zakat-detail-link:hover{color:var(--primary-500);text-decoration:underline}.section-divider{align-items:center;gap:var(--space-3);margin:var(--space-5) 0 var(--space-4);display:flex}.section-divider .divider-line{background:var(--border-light);flex:1;height:1px}.section-divider .divider-text{color:var(--gray-400);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;font-size:.75rem;font-weight:600}.riba-detector .analysis-card{margin-bottom:var(--space-5)}.riba-detector .analysis-card .form-group{margin-bottom:var(--space-4)}.verdict-section{text-align:center;padding:var(--space-6) var(--space-4);animation:.5s fadeInUp}.verdict-section .verdict-emoji{margin-bottom:var(--space-3);font-size:3rem;animation:.4s .1s both scaleIn;display:block}.verdict-section .verdict-label{font-family:var(--font-heading);color:var(--gray-700);margin-bottom:var(--space-2);font-size:1rem;font-weight:600}.verdict-section .verdict-name{font-family:var(--font-heading);color:var(--gray-900);margin-bottom:var(--space-4);font-size:1.15rem;font-weight:700}.verdict-section .verdict-description{color:var(--gray-600);max-width:340px;margin:0 auto var(--space-5);font-size:.875rem;line-height:1.65}.risk-badge-large{align-items:center;gap:var(--space-2);border-radius:var(--radius-full);letter-spacing:.3px;padding:12px 24px;font-size:1.1rem;font-weight:700;animation:.4s .2s both scaleIn;display:inline-flex}.risk-badge-large.tinggi{background:var(--danger-light);color:var(--danger);box-shadow:0 4px 14px #ef444433}.risk-badge-large.sedang{background:var(--warning-light);color:var(--warning);box-shadow:0 4px 14px #f59e0b33}.risk-badge-large.rendah{background:var(--info-light);color:var(--info);box-shadow:0 4px 14px #3b82f633}.risk-badge-large.aman{background:var(--success-light);color:var(--success);box-shadow:0 4px 14px #16a34a33}.riba-detector .result-card{animation:.5s both fadeInUp}.riba-detector .result-card:nth-child(2){animation-delay:.1s}.riba-detector .result-card:nth-child(3){animation-delay:.2s}.riba-detector .result-card:nth-child(4){animation-delay:.3s}.indicator-list{gap:var(--space-3);flex-direction:column;display:flex}.indicator-item{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--bg-input);border-radius:var(--radius-md);transition:background var(--transition-fast);display:flex}.indicator-item:hover{background:var(--gray-100)}.indicator-dot{border-radius:var(--radius-full);flex-shrink:0;width:10px;height:10px}.indicator-dot.danger{background:var(--danger);box-shadow:0 0 6px #ef444466}.indicator-dot.success{background:var(--success);box-shadow:0 0 6px #16a34a66}.indicator-dot.warning{background:var(--warning);box-shadow:0 0 6px #f59e0b66}.indicator-text{color:var(--gray-700);font-size:.875rem;font-weight:500}.alternative-list{gap:var(--space-3);flex-direction:column;display:flex}.alternative-item{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--primary-50);border-radius:var(--radius-md);border:1px solid var(--primary-100);transition:all var(--transition-fast);display:flex}.alternative-item:hover{background:var(--primary-100);transform:translate(4px)}.alternative-icon{flex-shrink:0;font-size:1rem}.alternative-text{color:var(--primary-700);font-size:.875rem;font-weight:600}.detail-link-wrapper{text-align:center;margin-top:var(--space-5);animation:.5s .4s both fadeInUp}.detail-link{align-items:center;gap:var(--space-2);color:var(--primary-600);padding:var(--space-3) var(--space-5);border-radius:var(--radius-full);background:var(--primary-50);border:1px solid var(--primary-100);transition:all var(--transition-normal);cursor:pointer;font-size:.875rem;font-weight:600;text-decoration:none;display:inline-flex}.detail-link:hover{background:var(--primary-100);color:var(--primary-700);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.result-sections{gap:var(--space-5);flex-direction:column;display:flex}.planner-page .subpage-header{border-radius:0 0 var(--radius-xl) var(--radius-xl);margin:-var(--space-5) -var(--space-5) var(--space-5) -var(--space-5)}.summary-card{border-left:4px solid var(--primary-500)}.income-input-group{margin-bottom:var(--space-4);border-bottom:1px solid var(--border-light);padding-bottom:var(--space-4)}.income-input-wrapper{align-items:center;display:flex;position:relative}.currency-prefix{color:var(--gray-500);font-weight:600;position:absolute;left:12px}.form-input.income-input{color:var(--primary-700);background:var(--bg-card);padding-left:48px;font-size:1.25rem;font-weight:700}.form-input.income-input:focus{background:var(--bg-card)}.summary-stats{justify-content:space-between;gap:var(--space-3);display:flex}.stat-box{background:var(--bg-app);padding:var(--space-3);border-radius:var(--radius-md);flex-direction:column;flex:1;display:flex}.stat-label{color:var(--gray-500);margin-bottom:4px;font-size:.75rem}.stat-value{font-size:1.1rem;font-weight:700;font-family:var(--font-heading)}.mt-3{margin-top:12px}.progress-text{color:var(--gray-500);text-align:right;margin-top:6px;font-size:.7rem}.progress-fill.overbudget{background:var(--danger)}.add-expense-card{background:var(--primary-50);border:1px solid var(--primary-100)}.flex-2{flex:2}.filter-select{border-radius:var(--radius-sm);border:1px solid var(--border-default);background:var(--bg-card);color:var(--gray-700);outline:none;padding:4px 8px;font-size:.8rem}.timeline-container{gap:var(--space-3);margin-top:var(--space-3);flex-direction:column;display:flex}.timeline-day{gap:var(--space-3);opacity:.7;display:flex}.timeline-day.has-data{opacity:1}.day-badge{background:var(--gray-200);width:50px;height:50px;color:var(--gray-600);border-radius:var(--radius-md);text-align:center;flex-shrink:0;justify-content:center;align-items:center;font-size:.75rem;font-weight:700;line-height:1.2;display:flex}.timeline-day.has-data .day-badge{background:var(--primary-100);color:var(--primary-700);box-shadow:0 2px 4px #16a34a1a}.day-content{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-md);padding:var(--space-3);box-shadow:var(--shadow-xs);flex:1}.empty-day{color:var(--gray-400);padding:var(--space-2) 0;font-size:.85rem;font-style:italic}.expense-list{flex-direction:column;gap:8px;display:flex}.expense-item{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;padding-bottom:8px;display:flex}.expense-info{flex-direction:column;display:flex}.expense-name{color:var(--gray-800);font-size:.85rem;font-weight:500}.expense-amount{color:var(--gray-500);font-size:.8rem}.btn-delete{color:var(--danger);cursor:pointer;opacity:.5;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:1rem;transition:background .2s;display:flex}.expense-item:hover .btn-delete{opacity:1;background:var(--danger-light)}.day-total{text-align:right;color:var(--gray-600);margin-top:4px;font-size:.8rem}.day-total strong{color:var(--primary-700);font-family:var(--font-heading)}.retirement-page .subpage-header{border-radius:0 0 var(--radius-xl) var(--radius-xl);margin:-var(--space-5) -var(--space-5) var(--space-5) -var(--space-5)}.input-card{background:var(--bg-card)}.form-row{gap:var(--space-3);display:flex}.flex-1{flex:1}.result-card{text-align:center;border-top:4px solid var(--primary-500)}.result-card.warning{border-top-color:var(--gold-500)}.result-header h3{color:var(--gray-600);margin-bottom:var(--space-2);font-size:.9rem}.result-header .amount{color:var(--primary-700);font-size:1.8rem;font-weight:800;font-family:var(--font-heading);margin-bottom:var(--space-3)}.status-badge{margin-bottom:var(--space-3);border-radius:20px;padding:6px 16px;font-size:.85rem;font-weight:600;display:inline-block}.result-card.success .status-badge{background:var(--primary-50);color:var(--primary-700)}.result-card.warning .status-badge{background:var(--gold-100);color:var(--gray-800)}.target-info{background:var(--gray-50);padding:var(--space-3);border-radius:var(--radius-md);font-size:.85rem}.target-info .note{color:var(--gray-500);margin-top:4px;font-size:.75rem}.barakah-page .subpage-header{border-radius:0 0 var(--radius-xl) var(--radius-xl);margin:-var(--space-5) -var(--space-5) var(--space-5) -var(--space-5);background:linear-gradient(135deg, var(--gold-500), var(--gold-600));color:var(--gray-900)}.barakah-page .subpage-header p{color:var(--gray-800)}.index-display-card{text-align:center;background:linear-gradient(180deg, var(--bg-card) 0%, var(--primary-50) 100%);flex-direction:column;align-items:center;display:flex}.circular-progress{width:150px;height:150px;margin:var(--space-3) 0;position:relative}.circular-progress svg{width:100%;height:100%;transform:rotate(-90deg)}.circle-bg{fill:none;stroke:var(--gray-200);stroke-width:8px}.circle-value{fill:none;stroke:var(--gold-500);stroke-width:8px;stroke-linecap:round;transition:stroke-dashoffset 1s ease-in-out}.score-text{flex-direction:column;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.score-text .number{color:var(--primary-700);font-size:2.5rem;font-weight:800;line-height:1}.score-text .label{color:var(--gray-500);text-transform:uppercase;letter-spacing:1px;font-size:.8rem;font-weight:600}.index-status h3{color:var(--primary-700);margin-bottom:8px}.index-status p{color:var(--gray-600);font-size:.85rem}.pillars-grid{gap:var(--space-3);flex-direction:column;display:flex}.pillar-card{background:var(--bg-card);padding:var(--space-3);border-radius:var(--radius-md);border:1px solid var(--border-light);box-shadow:var(--shadow-xs)}.pillar-header{align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);display:flex}.pillar-header .icon{background:var(--primary-50);border-radius:var(--radius-sm);justify-content:center;align-items:center;width:40px;height:40px;font-size:1.5rem;display:flex}.pillar-header h4{color:var(--gray-800);margin:0;font-size:.95rem}.pillar-header p{color:var(--gray-500);margin:0;font-size:.75rem}.slider-container{align-items:center;gap:var(--space-3);display:flex}.slider-container input[type=range]{accent-color:var(--primary-500);flex:1}.slider-container .val{color:var(--primary-700);text-align:right;width:30px;font-weight:700}.maqashid-page .subpage-header{border-radius:0 0 var(--radius-xl) var(--radius-xl);margin:-var(--space-5) -var(--space-5) var(--space-5) -var(--space-5)}.total-score-card{text-align:center;background:var(--primary-700);color:#fff}.total-score-card h3{color:var(--primary-100);margin-bottom:var(--space-2);font-weight:500}.score-display{margin-bottom:var(--space-2)}.score-display .big-number{font-size:3rem;font-weight:800;font-family:var(--font-heading);color:var(--gold-400)}.score-display .max-number{color:var(--primary-200);font-size:1.2rem}.total-score-card p{color:var(--primary-100);font-size:.85rem}.pillars-list{gap:var(--space-3);flex-direction:column;display:flex}.maqashid-item{padding:var(--space-3)}.item-header{margin-bottom:var(--space-2);justify-content:space-between;align-items:center;display:flex}.item-header h4{color:var(--gray-800);margin:0;font-size:.95rem}.item-header p{color:var(--gray-500);margin:0;font-size:.75rem}.item-score{font-size:1.2rem;font-weight:800}.maqashid-item .progress-bar{background:var(--gray-200);border-radius:4px;height:8px;overflow:hidden}.maqashid-item .progress-fill{border-radius:4px;height:100%;transition:width 1s ease-in-out}.ai-coach-page .subpage-header{border-radius:0 0 var(--radius-xl) var(--radius-xl);margin:-var(--space-5) -var(--space-5) var(--space-5) -var(--space-5)}.chat-container{border:1px solid var(--border-light);flex-direction:column;height:calc(100vh - 220px);padding:0;display:flex;overflow:hidden}.chat-messages{padding:var(--space-4);gap:var(--space-3);background:var(--bg-app);flex-direction:column;flex:1;display:flex;overflow-y:auto}.chat-bubble-wrapper{gap:var(--space-2);align-items:flex-end;max-width:85%;display:flex}.chat-bubble-wrapper.user{flex-direction:row;align-self:flex-end}.chat-bubble-wrapper.assistant{align-self:flex-start}.chat-avatar{background:var(--primary-500);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;margin-bottom:4px;font-size:.75rem;font-weight:700;display:flex}.user-avatar{background:var(--gold-500);color:var(--gray-900)}.chat-bubble{border-radius:var(--radius-lg);box-shadow:var(--shadow-xs);padding:12px 16px;font-size:.9rem;line-height:1.5}.chat-bubble p{margin:0 0 8px}.chat-bubble p:last-child{margin-bottom:0}.assistant .chat-bubble{background:var(--bg-card);border:1px solid var(--border-light);color:var(--gray-800);border-bottom-left-radius:4px}.user .chat-bubble{background:var(--primary-600);color:#fff;border-bottom-right-radius:4px}.chat-input-area{padding:var(--space-3);background:var(--bg-card);border-top:1px solid var(--border-light);gap:var(--space-2);display:flex}.chat-input{border-radius:20px;flex:1;padding-left:20px}.send-btn{padding:0 var(--space-4);border-radius:20px}.loading-dots span{font-size:1.5rem;line-height:.5;animation:1.4s ease-in-out infinite both bounce;display:inline-block}.loading-dots span:first-child{animation-delay:-.32s}.loading-dots span:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.survey-page .subpage-header{border-radius:0 0 var(--radius-xl) var(--radius-xl);margin:-var(--space-5) -var(--space-5) var(--space-5) -var(--space-5);background:linear-gradient(135deg, var(--primary-600), var(--primary-800))}.survey-form{padding:var(--space-4)}.section-subtitle{color:var(--primary-700);margin-bottom:4px;font-size:1.1rem}.help-text{color:var(--gray-500);margin-bottom:var(--space-3);font-size:.8rem}.divider{border:none;border-top:1px dashed var(--border-light);margin:var(--space-4) 0}.score-grid{gap:var(--space-3);flex-direction:column;display:flex}.score-item{align-items:center;gap:var(--space-3);background:var(--gray-50);padding:var(--space-3);border-radius:var(--radius-md);display:flex}.score-item label{color:var(--gray-800);flex:1;font-size:.9rem;font-weight:600}.score-item input[type=range]{accent-color:var(--gold-500);flex:1}.score-item .score-val{background:var(--primary-100);width:24px;height:24px;color:var(--primary-700);border-radius:4px;justify-content:center;align-items:center;font-size:.9rem;font-weight:800;display:flex}.submit-btn{width:100%;margin-top:var(--space-2);padding:14px;font-size:1rem}.alert{padding:var(--space-3);border-radius:var(--radius-md);margin-bottom:var(--space-4);font-size:.9rem}.alert-error{color:#b91c1c;background:#fee2e2;border:1px solid #fca5a5}.success-card{text-align:center;padding:var(--space-5);background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-top:20vh}.success-card .icon{margin-bottom:var(--space-3);font-size:4rem}.success-card h2{color:var(--primary-700);margin-bottom:var(--space-2)}.success-card p{color:var(--gray-600);margin-bottom:var(--space-4)}.admin-page .subpage-header{border-radius:0 0 var(--radius-xl) var(--radius-xl);margin:-var(--space-5) -var(--space-5) var(--space-5) -var(--space-5);background:linear-gradient(135deg, var(--gray-800), var(--gray-900))}.stats-grid{gap:var(--space-3);margin-bottom:var(--space-4);padding-bottom:var(--space-2);display:flex;overflow-x:auto}.stat-card{background:var(--bg-card);min-width:120px;padding:var(--space-3);border-radius:var(--radius-md);border-left:4px solid var(--primary-500);box-shadow:var(--shadow-xs);flex:1}.stat-card h4{color:var(--gray-500);margin-bottom:4px;font-size:.8rem}.stat-card .val{color:var(--gray-900);font-size:1.5rem;font-weight:800}.admin-actions{margin-bottom:var(--space-3);justify-content:space-between;align-items:center;display:flex}.btn-sm{padding:6px 12px;font-size:.8rem}.survey-list{gap:var(--space-3);flex-direction:column;display:flex}.survey-card{padding:var(--space-4);border-left:3px solid var(--gold-500)}.survey-header{margin-bottom:var(--space-3);justify-content:space-between;align-items:flex-start;display:flex}.survey-header h3{color:var(--gray-900);margin-bottom:2px}.affiliation{color:var(--gray-500);font-size:.85rem}.btn-delete{color:#b91c1c;cursor:pointer;background:#fee2e2;border:none;border-radius:4px;padding:6px 12px;font-size:.8rem;font-weight:700}.score-badges{margin-bottom:var(--space-3);flex-wrap:wrap;gap:8px;display:flex}.badge{background:var(--primary-50);color:var(--primary-700);border-radius:20px;padding:4px 10px;font-size:.8rem}.feedback-box{background:var(--gray-50);padding:var(--space-3);border-radius:var(--radius-sm);margin-bottom:var(--space-3);color:var(--gray-800);font-size:.9rem;line-height:1.5}.survey-footer{text-align:right;color:var(--gray-400)}.quran-bersanad{background:linear-gradient(135deg, var(--bg-app) 0%, #16653408 100%);flex-direction:column;width:100%;min-height:100vh;display:flex;position:relative;overflow:hidden}.quran-bersanad:before,.quran-bersanad:after{content:"";filter:blur(80px);opacity:.4;pointer-events:none;z-index:0;border-radius:50%;position:absolute}.quran-bersanad:before{background:radial-gradient(circle,#16c55e26 0%,#0000 70%);width:400px;height:400px;animation:20s ease-in-out infinite floatOrb1;top:-100px;right:10%}.quran-bersanad:after{background:radial-gradient(circle,#d4a53c26 0%,#0000 70%);width:300px;height:300px;animation:25s ease-in-out infinite floatOrb2;bottom:10%;left:5%}.quran-header{height:var(--header-height);padding:0 var(--space-8);background:var(--glass-light-bg);-webkit-backdrop-filter:blur(var(--glass-blur-strong));border-bottom:1px solid var(--glass-border);z-index:100;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.quran-header-brand{align-items:center;gap:var(--space-4);display:flex}.quran-header-logo{border-radius:var(--radius-lg);background:linear-gradient(135deg, var(--primary-600), var(--gold-500));width:44px;height:44px;box-shadow:var(--shadow-green);justify-content:center;align-items:center;font-size:1.5rem;display:flex}.quran-header-title{font-family:var(--font-heading);color:var(--gray-900);font-size:1.25rem;font-weight:700}.quran-header-subtitle{color:var(--gray-500);font-size:.75rem}.quran-layout{z-index:1;min-height:calc(100vh - var(--header-height));flex:1;display:flex;position:relative}.quran-sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);background:var(--glass-light-bg);-webkit-backdrop-filter:blur(var(--glass-blur));border-right:1px solid var(--glass-border);padding:var(--space-6);gap:var(--space-6);max-height:calc(100vh - var(--header-height));top:var(--header-height);flex-direction:column;display:flex;position:sticky;overflow-y:auto}.quran-sidebar::-webkit-scrollbar{width:4px}.quran-sidebar::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:var(--radius-full)}.sidebar-section-title{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.1em;color:var(--gray-400);margin-bottom:var(--space-3);font-size:.7rem;font-weight:600}.topic-list{gap:var(--space-2);flex-direction:column;display:flex}.topic-item{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-normal);text-align:left;background:0 0;border:1px solid #0000;width:100%;display:flex}.topic-item:hover{background:var(--glass-bg);border-color:var(--glass-border)}.topic-item.active{background:var(--glass-bg-strong);border-color:var(--glass-border-strong);box-shadow:var(--shadow-glass)}.topic-icon{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.25rem;display:flex}.topic-info{flex:1;min-width:0}.topic-name{font-family:var(--font-heading);color:var(--gray-800);white-space:nowrap;text-overflow:ellipsis;font-size:.875rem;font-weight:600;overflow:hidden}.topic-item.active .topic-name{color:var(--gray-900)}.topic-count{color:var(--gray-400);margin-top:2px;font-size:.7rem}.topic-item.active .topic-count{color:var(--gray-500)}.sidebar-stats{border-radius:var(--radius-xl);padding:var(--space-5);border:1px solid var(--glass-border);background:linear-gradient(135deg,#16653414,#d4a53c14)}.stats-grid{gap:var(--space-4);grid-template-columns:1fr 1fr;display:grid}.stat-item{text-align:center}.stat-value{font-family:var(--font-heading);color:var(--primary-700);font-size:1.5rem;font-weight:700}.stat-label{color:var(--gray-500);margin-top:2px;font-size:.7rem}.quran-main{padding:var(--space-8);flex:1;min-width:0;overflow-y:auto}.main-header{margin-bottom:var(--space-6)}.main-header-top{justify-content:space-between;align-items:flex-start;gap:var(--space-6);margin-bottom:var(--space-4);display:flex}.main-title{font-family:var(--font-heading);color:var(--gray-900);align-items:center;gap:var(--space-3);font-size:2rem;font-weight:700;display:flex}.main-title-icon{font-size:2.5rem}.main-description{color:var(--gray-500);max-width:600px;font-size:.95rem}.search-container{width:100%;max-width:400px;position:relative}.search-input{width:100%;padding:var(--space-4) var(--space-5);background:var(--glass-light-bg);-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-xl);color:var(--gray-700);transition:all var(--transition-normal);padding-left:48px;font-size:.95rem}.search-input::placeholder{color:var(--gray-400)}.search-input:focus{border-color:var(--primary-400);box-shadow:0 0 0 3px #16c55e26, var(--shadow-glass);background:var(--bg-card);outline:none}.search-icon{left:var(--space-4);color:var(--gray-400);pointer-events:none;font-size:1.1rem;position:absolute;top:50%;transform:translateY(-50%)}.verse-grid{gap:var(--space-5);grid-template-columns:repeat(auto-fill,minmax(340px,1fr));display:grid}.verse-grid-empty{text-align:center;padding:var(--space-12) var(--space-6);grid-column:1/-1}.empty-state{align-items:center;gap:var(--space-4);flex-direction:column;display:flex}.empty-icon{opacity:.5;font-size:4rem}.empty-title{font-family:var(--font-heading);color:var(--gray-600);font-size:1.25rem;font-weight:600}.empty-text{color:var(--gray-400);font-size:.9rem}.verse-card{background:var(--glass-light-bg);-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:var(--space-6);cursor:pointer;transition:all var(--transition-slow);position:relative;overflow:hidden}.verse-card:before{content:"";opacity:0;height:4px;transition:opacity var(--transition-normal);position:absolute;top:0;left:0;right:0}.verse-card:hover{box-shadow:var(--shadow-float);border-color:var(--glass-border-strong);transform:translateY(-4px)}.verse-card:hover:before{opacity:1}.verse-card-header{margin-bottom:var(--space-4);justify-content:space-between;align-items:center;display:flex}.verse-card-surah{align-items:center;gap:var(--space-2);display:flex}.verse-surah-badge{font-family:var(--font-heading);padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);background:var(--glass-bg);color:var(--gray-600);font-size:.75rem;font-weight:600}.verse-ayah-badge{color:var(--gray-400);font-size:.7rem}.verse-card-arabic{color:var(--gray-900);text-align:right;margin-bottom:var(--space-4);padding:var(--space-4);border-radius:var(--radius-lg);border:1px solid var(--glass-border);direction:rtl;background:#ffffff80;font-family:Amiri Quran,Scheherazade New,Traditional Arabic,serif;font-size:1.5rem;line-height:2.2}.verse-card-translation{color:var(--gray-600);-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:.875rem;line-height:1.7;display:-webkit-box;overflow:hidden}.verse-card-translation.expanded{-webkit-line-clamp:unset;max-height:none;display:block;overflow:visible}.verse-view-more{justify-content:center;align-items:center;gap:var(--space-2);width:100%;padding:var(--space-3);margin-top:var(--space-3);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);color:var(--primary-600);font-family:var(--font-heading);cursor:pointer;transition:all var(--transition-fast);font-size:.8rem;font-weight:600;display:flex}.verse-view-more:hover{background:var(--glass-bg-strong);border-color:var(--primary-300)}.verse-view-more span:first-child{font-size:.6rem}.verse-card-footer{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--glass-border);justify-content:space-between;align-items:center;display:flex}.verse-annotation{color:var(--gray-400);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:.75rem;font-style:italic;overflow:hidden}.verse-action{border-radius:var(--radius-md);cursor:pointer;width:32px;height:32px;color:var(--gray-400);transition:all var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.verse-action:hover{background:var(--glass-bg);color:var(--gray-600)}.quran-detail{width:var(--detail-panel-width);min-width:var(--detail-panel-width);background:var(--glass-light-bg);-webkit-backdrop-filter:blur(var(--glass-blur-strong));border-left:1px solid var(--glass-border);padding:var(--space-6);gap:var(--space-5);max-height:calc(100vh - var(--header-height));top:var(--header-height);flex-direction:column;display:flex;position:sticky;overflow-y:auto}.detail-header{justify-content:space-between;align-items:center;display:flex}.detail-close{border-radius:var(--radius-lg);background:var(--glass-bg);border:1px solid var(--glass-border);cursor:pointer;width:36px;height:36px;color:var(--gray-500);transition:all var(--transition-fast);justify-content:center;align-items:center;font-size:1.25rem;display:flex}.detail-close:hover{background:var(--glass-bg-strong);color:var(--gray-700)}.detail-location{align-items:center;gap:var(--space-3);display:flex}.detail-surah-icon{border-radius:var(--radius-lg);background:linear-gradient(135deg, var(--primary-600), var(--primary-500));color:#fff;width:48px;height:48px;box-shadow:var(--shadow-green);justify-content:center;align-items:center;font-size:1.5rem;display:flex}.detail-location-info h3{font-family:var(--font-heading);color:var(--gray-800);font-size:1rem;font-weight:600}.detail-location-info p{color:var(--gray-500);font-size:.75rem}.detail-arabic-container{border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:var(--space-6);text-align:center;background:linear-gradient(135deg,#1665340d,#d4a53c0d)}.detail-arabic{color:var(--gray-900);margin-bottom:var(--space-4);direction:rtl;font-family:Amiri Quran,Scheherazade New,Traditional Arabic,serif;font-size:2rem;line-height:2.4}.detail-arabic-meta{justify-content:center;align-items:center;gap:var(--space-3);color:var(--gray-400);font-size:.75rem;display:flex}.detail-translation{background:var(--bg-card);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:var(--space-5)}.detail-translation-label{text-transform:uppercase;letter-spacing:.05em;color:var(--primary-600);margin-bottom:var(--space-3);font-size:.7rem;font-weight:600}.detail-translation-text{color:var(--gray-700);font-size:.95rem;line-height:1.8}.detail-annotation{border-radius:var(--radius-xl);padding:var(--space-5);background:linear-gradient(135deg,#d4a53c1a,#d4a53c0d);border:1px solid #d4a53c33}.detail-annotation-label{text-transform:uppercase;letter-spacing:.05em;color:var(--gold-600);margin-bottom:var(--space-3);align-items:center;gap:var(--space-2);font-size:.7rem;font-weight:600;display:flex}.detail-annotation-text{color:var(--gray-700);font-size:.875rem;line-height:1.7}.detail-actions{gap:var(--space-3);margin-top:auto;display:flex}.detail-action-btn{padding:var(--space-4);border-radius:var(--radius-lg);font-family:var(--font-heading);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;gap:var(--space-2);border:none;flex:1;font-size:.875rem;font-weight:600;display:flex}.detail-action-btn.primary{background:linear-gradient(135deg, var(--primary-600), var(--primary-500));color:#fff;box-shadow:var(--shadow-green)}.detail-action-btn.primary:hover{transform:translateY(-2px);box-shadow:0 8px 20px #1665344d}.detail-action-btn.secondary{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--gray-600)}.detail-action-btn.secondary:hover{background:var(--glass-bg-strong);border-color:var(--glass-border-strong)}.loading-container{padding:var(--space-12);justify-content:center;align-items:center;gap:var(--space-4);flex-direction:column;display:flex}.loading-spinner{border:3px solid var(--glass-border);border-top-color:var(--primary-500);border-radius:50%;width:48px;height:48px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{color:var(--gray-500);font-size:.9rem}.mobile-topic-bar{padding:var(--space-4) var(--space-5);background:var(--glass-light-bg);-webkit-backdrop-filter:blur(var(--glass-blur));border-bottom:1px solid var(--glass-border);top:var(--header-height);z-index:50;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;display:none;position:sticky;overflow-x:auto}.mobile-topic-bar::-webkit-scrollbar{display:none}.mobile-topic-scroll{gap:var(--space-2);padding-bottom:var(--space-1);display:flex}.mobile-topic-chip{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--gray-600);cursor:pointer;white-space:nowrap;transition:all var(--transition-fast);flex-shrink:0;font-size:.8rem;font-weight:500;display:flex}.mobile-topic-chip:hover{background:var(--glass-bg-strong)}.mobile-topic-chip.active{background:linear-gradient(135deg, var(--primary-600), var(--primary-500));color:#fff;box-shadow:var(--shadow-green);border-color:#0000}.mobile-topic-chip-icon{font-size:1rem}.mobile-topic-chip-count{opacity:.7;font-size:.7rem}@media (width<=1200px){.quran-detail{width:340px;min-width:340px}}@media (width<=1024px){.quran-sidebar{width:240px;min-width:240px}.verse-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}@media (width<=768px){.quran-sidebar,.quran-detail{display:none}.mobile-topic-bar{display:block}.quran-main{padding:var(--space-5);padding-top:var(--space-3)}.verse-grid{grid-template-columns:1fr}.main-header-top{flex-direction:column;align-items:stretch}.search-container{max-width:100%}.main-header{margin-bottom:var(--space-4)}.main-title{font-size:1.5rem}}.verse-card.topic-ilmu:before{background:linear-gradient(90deg,#3b82f6,#06b6d4)}.verse-card.topic-ekonomi:before{background:linear-gradient(90deg,#10b981,#22c55e)}.verse-card.topic-khalifah:before{background:linear-gradient(90deg,#f59e0b,#eab308)}.verse-card.topic-akhlak:before{background:linear-gradient(90deg,#ec4899,#f43f5e)}.verse-card.topic-alam:before{background:linear-gradient(90deg,#22c55e,#10b981)}.verse-card.topic-kesehatan:before{background:linear-gradient(90deg,#ef4444,#f97316)}.verse-card.topic-keluarga:before{background:linear-gradient(90deg,#a855f7,#8b5cf6)}.verse-card.topic-ibadah:before{background:linear-gradient(90deg,#14b8a6,#06b6d4)}.login-container{min-height:100vh;padding:var(--space-6);background:linear-gradient(135deg, var(--bg-app) 0%, #16653414 100%);flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.login-bg-orb{filter:blur(80px);opacity:.4;pointer-events:none;z-index:0;border-radius:50%;position:absolute}.login-bg-orb.orb-1{background:radial-gradient(circle,#16c55e40 0%,#0000 70%);width:400px;height:400px;animation:20s ease-in-out infinite floatOrb1;top:-100px;right:10%}.login-bg-orb.orb-2{background:radial-gradient(circle,#d4a53c40 0%,#0000 70%);width:300px;height:300px;animation:25s ease-in-out infinite floatOrb2;bottom:10%;left:10%}.login-card{background:var(--glass-light-bg);-webkit-backdrop-filter:blur(var(--glass-blur-strong));border:1px solid var(--glass-border);border-radius:var(--radius-2xl);padding:var(--space-8);text-align:center;z-index:1;width:100%;max-width:420px;box-shadow:var(--shadow-float);position:relative}.login-header{margin-bottom:var(--space-6)}.login-logo{width:72px;height:72px;margin:0 auto var(--space-4);border-radius:var(--radius-xl);background:linear-gradient(135deg, var(--primary-600), var(--gold-500));box-shadow:var(--shadow-green);justify-content:center;align-items:center;font-size:2.5rem;display:flex}.login-header h1{font-family:var(--font-heading);color:var(--gray-900);margin-bottom:var(--space-2);font-size:2rem;font-weight:700}.login-header p{color:var(--gray-500);font-size:.95rem}.login-divider{align-items:center;gap:var(--space-4);margin:var(--space-6) 0;display:flex}.login-divider:before,.login-divider:after{content:"";background:var(--glass-border);flex:1;height:1px}.login-divider span{color:var(--gray-400);font-size:.8rem;font-weight:500}.google-login-btn{justify-content:center;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-4) var(--space-6);background:var(--bg-card);border:1.5px solid var(--glass-border);border-radius:var(--radius-xl);font-family:var(--font-heading);color:var(--gray-700);cursor:pointer;transition:all var(--transition-normal);box-shadow:var(--shadow-sm);font-size:1rem;font-weight:600;display:flex}.google-login-btn:hover{background:var(--glass-bg);border-color:var(--gray-300);box-shadow:var(--shadow-md);transform:translateY(-2px)}.google-login-btn:active{transform:translateY(0)}.google-login-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.google-icon{width:24px;height:24px}.login-spinner{border:3px solid var(--glass-border);border-top-color:var(--primary-500);border-radius:50%;width:24px;height:24px;animation:1s linear infinite spin}.login-info{margin-top:var(--space-6);color:var(--gray-400);font-size:.75rem;line-height:1.6}.login-info a{color:var(--primary-600);font-weight:500;text-decoration:none}.login-info a:hover{text-decoration:underline}.login-success-icon{width:80px;height:80px;margin:0 auto var(--space-4);background:linear-gradient(135deg, var(--primary-100), var(--primary-50));border-radius:50%;justify-content:center;align-items:center;font-size:3rem;display:flex}.login-user-email{color:var(--gray-500);margin-bottom:var(--space-2);font-size:.9rem}.login-user-name{font-family:var(--font-heading);color:var(--gray-900);margin-bottom:var(--space-6);font-size:1.25rem;font-weight:600}.login-actions{gap:var(--space-3);flex-direction:column;display:flex}.btn-primary{width:100%;padding:var(--space-4);background:linear-gradient(135deg, var(--primary-600), var(--primary-500));color:#fff;border-radius:var(--radius-xl);font-family:var(--font-heading);text-align:center;cursor:pointer;box-shadow:var(--shadow-green);transition:all var(--transition-fast);border:none;font-size:1rem;font-weight:600;text-decoration:none;display:block}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 20px #1665344d}.btn-secondary{width:100%;padding:var(--space-4);background:var(--glass-bg);border:1.5px solid var(--glass-border);border-radius:var(--radius-xl);font-family:var(--font-heading);color:var(--gray-600);cursor:pointer;transition:all var(--transition-fast);font-size:1rem;font-weight:600;display:block}.btn-secondary:hover{background:var(--glass-bg-strong);border-color:var(--gray-300)}.login-footer{margin-top:var(--space-6);color:var(--gray-400);z-index:1;font-size:.75rem;position:relative}@media (width<=480px){.login-card{padding:var(--space-6)}.login-logo{width:60px;height:60px;font-size:2rem}.login-header h1{font-size:1.5rem}}.app{background:var(--bg-app);width:100%;max-width:480px;min-height:100dvh;box-shadow:var(--shadow-xl);flex-direction:column;display:flex;position:relative}.main-content{flex:1;padding-bottom:80px;overflow:hidden auto}.page-header{background:linear-gradient(145deg, var(--bg-header-start), var(--bg-header-mid), var(--bg-header-end));color:#fff;padding:var(--space-6) var(--space-5) var(--space-8);position:relative;overflow:hidden}.page-header:before{content:"";pointer-events:none;background:#ffffff0a;border-radius:50%;width:200px;height:200px;position:absolute;top:-60px;right:-40px}.page-header:after{content:"";pointer-events:none;background:#ffffff08;border-radius:50%;width:220px;height:220px;position:absolute;bottom:-80px;left:-60px}.page-header .header-greeting{font-family:var(--font-heading);margin-bottom:var(--space-1);z-index:1;font-size:1.35rem;font-weight:600;position:relative}.page-header .header-subtitle{opacity:.85;z-index:1;font-size:.875rem;font-weight:400;position:relative}.page-header .header-update{opacity:.6;margin-top:var(--space-2);z-index:1;font-size:.75rem;position:relative}.subpage-header{background:linear-gradient(145deg, var(--bg-header-start), var(--bg-header-mid), var(--bg-header-end));color:#fff;padding:var(--space-5) var(--space-5) var(--space-6);position:relative;overflow:hidden}.subpage-header:before{content:"";background:#ffffff0a;border-radius:50%;width:150px;height:150px;position:absolute;top:-40px;right:-30px}.subpage-header .back-btn{align-items:center;gap:var(--space-2);color:#fffc;padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);margin-bottom:var(--space-4);transition:all var(--transition-fast);cursor:pointer;background:#ffffff1a;border:1px solid #ffffff26;font-size:.85rem;font-weight:500;text-decoration:none;display:inline-flex}.subpage-header .back-btn:hover{color:#fff;background:#ffffff2e}.subpage-header h1{color:#fff;margin-bottom:var(--space-1);z-index:1;font-size:1.4rem;position:relative}.subpage-header p{color:#fffc;z-index:1;font-size:.85rem;position:relative}.page-content{padding:var(--space-5);animation:.4s fadeInUp}.card{background:var(--bg-card);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-card);border:1px solid var(--border-light);transition:box-shadow var(--transition-normal), transform var(--transition-normal)}.card:hover{box-shadow:var(--shadow-card-hover)}.card-title{font-family:var(--font-heading);color:var(--gray-500);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--space-4);font-size:.8rem;font-weight:600}.section{margin-bottom:var(--space-5)}.section-header{margin-bottom:var(--space-4);justify-content:space-between;align-items:center;display:flex}.section-title{font-family:var(--font-heading);color:var(--gray-500);text-transform:uppercase;letter-spacing:.5px;font-size:.8rem;font-weight:600}.section-link{color:var(--primary-600);cursor:pointer;transition:color var(--transition-fast);font-size:.8rem;font-weight:500}.section-link:hover{color:var(--primary-500)}.btn{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);transition:all var(--transition-normal);font-size:.9375rem;font-weight:600;display:inline-flex;position:relative;overflow:hidden}.btn-primary{background:linear-gradient(135deg, var(--primary-700), var(--primary-600));color:#fff;box-shadow:var(--shadow-green)}.btn-primary:hover{background:linear-gradient(135deg, var(--primary-600), var(--primary-500));transform:translateY(-1px);box-shadow:0 6px 20px #16653459}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--primary-50);color:var(--primary-700);border:1px solid var(--primary-100)}.btn-secondary:hover{background:var(--primary-100)}.btn-gold{background:linear-gradient(135deg, var(--gold-500), var(--gold-400));color:var(--gray-900);font-weight:700;box-shadow:0 4px 14px #d4a53c4d}.btn-gold:hover{transform:translateY(-1px);box-shadow:0 6px 20px #d4a53c66}.btn-full{width:100%}.btn-sm{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);font-size:.8125rem}.btn-lg{padding:var(--space-4) var(--space-6);border-radius:var(--radius-lg);font-size:1rem}.form-group{margin-bottom:var(--space-4)}.form-label{color:var(--gray-700);margin-bottom:var(--space-2);font-size:.85rem;font-weight:600;display:block}.form-input{width:100%;padding:var(--space-3) var(--space-4);background:var(--bg-input);border:1.5px solid var(--border-light);border-radius:var(--radius-md);color:var(--gray-900);transition:all var(--transition-fast);font-size:.9375rem}.form-input:focus{border-color:var(--primary-400);background:var(--bg-card);outline:none;box-shadow:0 0 0 3px #16c55e1a}.form-input::placeholder{color:var(--gray-400)}.form-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:36px}.badge{align-items:center;gap:var(--space-1);border-radius:var(--radius-full);letter-spacing:.3px;padding:3px 10px;font-size:.75rem;font-weight:600;display:inline-flex}.badge-success{background:var(--success-light);color:var(--success)}.badge-warning{background:var(--warning-light);color:var(--warning)}.badge-danger{background:var(--danger-light);color:var(--danger)}.badge-info{background:var(--info-light);color:var(--info)}.badge-gold{background:var(--gold-100);color:var(--gold-600)}.progress-bar{border-radius:var(--radius-full);background:var(--primary-50);height:8px;position:relative;overflow:hidden}.progress-fill{border-radius:var(--radius-full);background:linear-gradient(90deg, var(--primary-700), var(--primary-500));height:100%;transition:width 1s cubic-bezier(.4,0,.2,1);position:relative}.progress-fill:after{content:"";background:linear-gradient(90deg,#0000,#ffffff4d,#0000) 0 0/200% 100%;animation:2s infinite shimmer;position:absolute;inset:0}.tag-group{gap:var(--space-2);flex-wrap:wrap;display:flex}.tag{padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);background:var(--bg-input);color:var(--gray-600);border:1.5px solid var(--border-light);cursor:pointer;transition:all var(--transition-fast);font-size:.8125rem;font-weight:500}.tag:hover{border-color:var(--primary-300);color:var(--primary-600)}.tag.active{background:var(--primary-600);color:#fff;border-color:var(--primary-600);box-shadow:var(--shadow-green)}@media (width>=481px){.app{border-left:1px solid var(--border-light);border-right:1px solid var(--border-light)}}@media (width<=380px){.page-header{padding:var(--space-5) var(--space-4) var(--space-6)}.page-content{padding:var(--space-4)}.page-header .header-greeting{font-size:1.2rem}}