*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background-color:#fdfbf7;margin:0;padding:0;color:#333;line-height:1.5;padding-bottom:80px}.app-header{background:#fff;border-bottom:1px solid #f0f0f0;padding:10px 15px;position:sticky;top:0;z-index:100;box-shadow:0 2px 5px rgba(0,0,0,.03);display:block}.header-content{position:relative;display:flex;justify-content:center;align-items:center;width:100%;height:40px}.logo-area{display:flex;align-items:center;gap:8px}.logo-area h1{margin:0;font-size:18px;color:#b8860b;font-weight:700;line-height:1.2}.header-content button{position:absolute;right:0;top:50%;transform:translateY(-50%);padding:5px;display:flex;align-items:center;justify-content:center}.tagline{margin:5px 0 0;font-size:11px;color:#888;text-align:center;display:block}.gold-icon{color:#b8860b;font-size:20px}.app-header h1{margin:0;font-size:18px;color:#b8860b;font-weight:700}.header-actions i{font-size:18px;color:#666;cursor:pointer;padding:5px}.app-content{padding:15px;max-width:600px;margin:0 auto}.view-section{display:none;animation:fadeIn .3s ease-in-out}.view-section.active{display:block}.sub-content{display:none;animation:slideIn .3s ease-out}.sub-content.active{display:block}.bottom-nav{position:fixed;bottom:0;left:0;width:100%;height:70px;background:#fff;display:flex;justify-content:center;align-items:center;padding:0;border-radius:20px 20px 0 0;box-shadow:0 -5px 15px rgba(0,0,0,.1);z-index:1000;overflow:visible}.nav-item{position:relative;width:20%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;color:#888;font-size:11px;transition:.2s}.nav-item i{font-size:20px;margin-bottom:4px}.nav-item.active{color:#b8860b;font-weight:700}.nav-item.active i{transform:translateY(-2px)}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideIn{from{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}#receiptArea{padding:25px!important;background:#fff;border:1px solid #ddd;border-radius:5px;margin-bottom:15px}.cart-detail-row{background-color:#f9f9f9;font-size:11px;color:#666}.cart-detail-content{padding:8px 10px;line-height:1.6;border-bottom:1px dashed #ccc;text-align:left}#addPortModal{display:none;align-items:flex-start!important;padding:0!important}#addPortModal .modal-content{height:100%!important;width:100%!important;max-width:none!important;border-radius:0!important;display:flex;flex-direction:column;overflow:hidden}#addPortModal .modal-header{flex-shrink:0;background:#fff8e1;z-index:10}#addPortModal .modal-body{flex-grow:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:100px!important;text-align:left}#splashScreen{position:fixed;top:0;left:0;width:100%;height:100%;background:#fff;display:flex;align-items:center;justify-content:center;z-index:9999;text-align:center;overflow:hidden}.splash-background{position:absolute;width:200%;height:200%;background:radial-gradient(circle,rgba(184,134,11,.1) 0,rgba(255,255,255,0) 70%);animation:rotateBg 20s linear infinite}.logo-container{position:relative;width:100px;height:100px;margin:0 auto 20px;display:flex;justify-content:center;align-items:center}.logo-circle{width:100%;height:100%;border-radius:50%;background:#fff;padding:0;overflow:hidden;box-shadow:0 10px 30px rgba(184,134,11,.3);border:2px solid #b8860b;position:relative;z-index:2;animation:floatLogo 3s ease-in-out infinite}.splash-img{width:100%;height:100%;object-fit:cover}.shine-effect{position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(to right,transparent,rgba(255,255,255,.8),transparent);transform:skewX(-25deg);animation:shineLogo 3s infinite}.ripple{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;border-radius:50%;border:2px solid rgba(184,134,11,.5);animation:rippleEffect 2s linear infinite;z-index:1}.splash-title{font-size:22px;color:#b8860b;font-weight:700;margin-bottom:5px;opacity:0;animation:fadeUp .8s ease-out .3s forwards}.splash-tagline{font-size:12px;color:#666;margin-bottom:30px;opacity:0;animation:fadeUp .8s ease-out .6s forwards}.gold-loader{width:150px;height:6px;background:#eee;margin:0 auto;border-radius:10px;overflow:hidden;position:relative;box-shadow:inset 0 1px 3px rgba(0,0,0,.1)}.liquid-gold{width:0;height:100%;background:linear-gradient(90deg,#b8860b,#ffd700,#b8860b);background-size:200% 100%;border-radius:10px;animation:loadingFill 2.5s ease-in-out forwards,shimmerGold 2s linear infinite}.loading-text{font-size:10px;color:#999;margin-top:8px;animation:blinkText 1.5s infinite}@keyframes rotateBg{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes floatLogo{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes shineLogo{0%{left:-100%}20%{left:200%}100%{left:200%}}@keyframes rippleEffect{0%{width:100%;height:100%;opacity:1}100%{width:200%;height:200%;opacity:0}}@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes loadingFill{0%{width:0}100%{width:100%}}@keyframes shimmerGold{0%{background-position:100% 0}100%{background-position:-100% 0}}@keyframes blinkText{0%,100%{opacity:1}50%{opacity:.5}}#greetingBanner{position:fixed;top:70px;left:50%;transform:translateX(-50%);width:90%;max-width:400px;background:rgba(40,40,40,.95);color:#fff;padding:12px 20px;border-radius:50px;display:flex;align-items:center;gap:15px;box-shadow:0 5px 15px rgba(0,0,0,.2);z-index:5000;opacity:0;transition:opacity .5s,transform .5s;pointer-events:none}#greetingBanner.show{opacity:1;transform:translateX(-50%) translateY(10px);pointer-events:auto}.greet-icon{font-size:24px;animation:waveHand 1s infinite alternate}.greet-text h4{margin:0;font-size:14px;color:#ffd700}.greet-text p{margin:0;font-size:12px;opacity:.9}@keyframes pulseGold{0%{box-shadow:0 0 0 0 rgba(184,134,11,.4)}70%{box-shadow:0 0 0 15px rgba(184,134,11,0)}100%{box-shadow:0 0 0 0 rgba(184,134,11,0)}}@keyframes loadFill{0%{width:0}100%{width:100%}}@keyframes waveHand{from{transform:rotate(0)}to{transform:rotate(20deg)}}@keyframes slideUpFade{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-slide-up{animation:slideUpFade .5s ease-out forwards}@keyframes pulseText{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.7}100%{transform:scale(1);opacity:1}}.pulse-active{animation:pulseText .3s ease-in-out}.btn-primary:active,.btn-secondary:active{transform:scale(.95);transition:transform .1s}input:focus,select:focus{transition:all .3s ease;box-shadow:0 4px 8px rgba(184,134,11,.15);border-color:#b8860b}#gramDashboardBox{transition:transform .3s,box-shadow .3s}#gramDashboardBox:hover{transform:translateY(-2px);box-shadow:0 6px 12px rgba(0,0,0,.1)}@keyframes shake{0%,100%{transform:translateX(0)}25%,75%{transform:translateX(-10px)}50%{transform:translateX(10px)}}.shake-anim{animation:shake .4s ease-in-out;border-color:#d32f2f!important;color:#d32f2f!important}#loginLogoAnim{animation:pulse-wave 2s infinite}@keyframes pulse-wave{0%{transform:scale(1);box-shadow:0 0 0 0 rgba(21,101,192,.7)}70%{transform:scale(1.05);box-shadow:0 0 0 20px rgba(21,101,192,0)}100%{transform:scale(1);box-shadow:0 0 0 0 rgba(21,101,192,0)}}#loginLogoAnim i{display:inline-block;animation:float-icon 3s ease-in-out infinite}@keyframes float-icon{0%{transform:translateY(0)}50%{transform:translateY(-5px)}100%{transform:translateY(0)}}#dash-slide-1{position:relative;overflow:hidden;background:linear-gradient(135deg,#fffde7 0,#fff 100%)}#dash-slide-1::after{content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,215,0,.2) 50%,rgba(255,255,255,0) 100%);transform:skewX(-25deg);animation:shine 3s infinite}@keyframes shine{100%{left:200%}}.pulse-text{display:inline-block;animation:heartbeat 1.5s infinite}@keyframes heartbeat{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}button[onclick="openAddPortModal()"]{animation:bounce-btn 5s infinite}@keyframes bounce-btn{0%,90%,100%{transform:translateY(0)}92%{transform:translateY(-10px)}95%{transform:translateY(0)}97%{transform:translateY(-5px)}}.radio-group.row{flex-wrap:nowrap;gap:10px;justify-content:center}.radio-group label{white-space:nowrap!important;width:auto!important;margin:0!important;display:flex;align-items:center;font-size:14px}.custom-price-box{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:10px;padding:15px!important}.custom-price-box .checkbox-label{width:auto!important;white-space:nowrap;margin:0!important}.custom-price-box input[type=text],.custom-price-box input[type=number]{flex:1;margin-top:0!important}.dashboard-slide>div{background:linear-gradient(to bottom,#f3e5f5,#fff)!important;border:1px solid #ce93d8!important;border-radius:10px!important;padding:15px!important;box-shadow:0 2px 5px rgba(0,0,0,.05)}.dashboard-slide>div>div:first-child{border-bottom:1px dashed #ce93d8!important;padding-bottom:8px;margin-bottom:8px;color:#4a148c!important;font-weight:700}@media screen and (min-width:768px){.app-content{max-width:700px!important;width:95%;margin:0 auto;padding:30px 20px!important;border:none!important;box-shadow:none!important;background:0 0!important}#settingsModal .modal-content{width:50%!important;max-width:450px;box-shadow:-5px 0 20px rgba(0,0,0,.15)}#calcDashboardContainer,#gramDashboardContainer{height:100px!important;margin-bottom:5px}#portfolioListArea .result-card{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;padding:15px!important;text-align:left!important;gap:15px}#portfolioListArea input[type=checkbox]{width:20px!important;height:20px!important;margin:0 15px 0 0!important}.sub-content{display:none}.sub-content.active{display:block!important}#sub-home-budget,#sub-home-calc,#sub-home-profit{display:none}#sub-home-budget.active,#sub-home-calc.active,#sub-home-profit.active{display:block!important}.btn-primary,.btn-secondary,.global-settings-box,.input-group,.result-card,.weight-row,input,select{width:100%!important;max-width:100%!important}body{font-size:17px}button,input,select{font-size:18px!important}input[type=date],input[type=number],input[type=text],select{padding:15px!important;padding-right:60px!important}#dash-slide-1{padding:25px 30px!important;height:auto!important;min-height:160px}#dash-slide-1 div[style*="font-size:11px"],#dash-slide-1 div[style*="color:#666"],#dash-slide-1 div[style*="color:#555"]{font-size:15px!important;margin-bottom:5px!important}#dashCurrentVal div:first-child,#dashProfit,#dashTotalCost{font-size:24px!important;line-height:1.4!important;margin-bottom:5px!important}#dashTotalWeight{font-size:16px!important}#dash-slide-1 span[style*="font-size:9px"],#dashGrossVal,#dashTotalGram{font-size:13px!important;color:#888!important;margin-top:5px!important}#dash-slide-1>div{gap:20px;padding-bottom:15px!important;margin-bottom:15px!important}#dash-slide-3{padding:30px!important;display:flex;flex-direction:column;justify-content:center}#dash-slide-3 div:first-child{font-size:20px!important;margin-bottom:20px!important}#dash-slide-3 div[style*="font-size:10px"],#dash-slide-3 div[style*="font-size:12px"]{font-size:16px!important}#dash-slide-3 b,#dash-slide-3 strong{font-size:22px!important}#dash-slide-2{padding:25px 30px!important}#userCashInput{font-size:28px!important;height:50px!important}#dashNetWorth{font-size:24px!important}#dash-slide-2 div[style*="font-size:10px"],#dash-slide-2 div[style*="font-size:11px"]{font-size:14px!important;margin-bottom:5px!important}#dash-slide-2>div:last-child>div{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:20px}#bpPurity{width:50%!important;font-size:16px!important;padding:10px!important}#bpResult{width:50%!important;text-align:right!important;font-size:22px!important;white-space:nowrap}#profileLock{margin-top:180px!important;transform:scale(1.1);margin-bottom:100px}#view-extras{display:none!important}#view-extras.active{display:block!important}#view-extras .sub-content{display:none!important;width:100%}#view-extras .sub-content.active{display:block!important}}@media screen and (min-width:1024px){.app-content{max-width:1000px!important;width:97%!important}#settingsModal .modal-content{width:50%!important;max-width:600px!important;box-shadow:-5px 0 25px rgba(0,0,0,.2)}#profileLock{margin-top:250px!important;transform:scale(1)}}.input-wrapper input{padding-right:60px!important}#sub-weight-interest .global-settings-box{padding:20px!important}.checkbox-label,.custom-price-box{display:flex;align-items:center;width:auto!important}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b8860b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 15px center;background-size:16px;padding-right:45px!important;background-color:#fff;cursor:pointer}select::-ms-expand{display:none}.nav-item .icon-container{position:relative;font-size:20px;color:#999;transition:.5s;z-index:3;line-height:1}.nav-item .text{position:absolute;bottom:8px;font-size:10px;font-weight:500;color:#999;opacity:1;transition:.5s;transform:translateY(0)}.nav-item.active .icon-container{transform:translateY(-32px);color:#fff}.nav-item.active .text{transform:translateY(-2px);color:#b8860b;font-weight:700}.nav-indicator{position:absolute;top:-25px;left:0;width:50px;height:50px;background:linear-gradient(135deg,#b8860b,#e6b800);border-radius:50%;border:5px solid #fdfbf7;transition:.5s cubic-bezier(.68,-.55,.265,1.55);z-index:1;box-shadow:0 5px 10px rgba(184,134,11,.4);opacity:0}.chapter-card{display:flex;align-items:center;background:#fff;padding:12px;margin-bottom:10px;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.05);border:1px solid #eee;cursor:pointer;transition:.2s}.chapter-card:active{transform:scale(.98);background:#f9f9f9}.chap-icon{width:35px;height:35px;background:#fff3e0;color:#f57f17;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-right:12px}.chap-info{flex:1}.chap-num{font-size:10px;color:#888;text-transform:uppercase;font-weight:700}.chap-title{font-size:13px;color:#333;font-weight:700;line-height:1.4}.arrow{color:#ccc;font-size:12px}.reader-body{font-size:14px;line-height:1.8;color:#333;text-align:justify}.reader-body h3{font-size:15px;color:#b8860b;margin-top:20px;border-left:3px solid #b8860b;padding-left:8px}.reader-body p{margin-bottom:10px}.reader-body ul{padding-left:20px;margin-bottom:15px}.reader-body li{margin-bottom:5px}.highlight-box{background:#e3f2fd;padding:10px;border-radius:5px;border-left:3px solid #2196f3;font-size:13px;margin:10px 0}.formula-box{background:#fff3e0;padding:15px;border-radius:5px;text-align:center;font-weight:700;color:#e65100;border:1px dashed #ff9800;margin:15px 0}.warning-text{background:#ffebee;padding:10px;border-radius:5px;color:#c62828;font-size:12px}.book-table{width:100%;border-collapse:collapse;margin:15px 0;font-size:12px}.book-table th{background:#f0f0f0;padding:8px;border:1px solid #ddd}.book-table td{padding:8px;border:1px solid #ddd;text-align:center}.quiz-card{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:15px;margin-bottom:15px}.q-text{font-weight:700;margin-bottom:10px;font-size:13px}.tf-group{display:flex;gap:10px}.btn-tf{flex:1;padding:8px;border:1px solid #ccc;background:#fff;border-radius:5px}.btn-mcq{width:100%;text-align:left;padding:10px;border:1px solid #eee;background:#f9f9f9;margin-bottom:5px;border-radius:5px;font-size:13px}.input-quiz-group{display:flex;gap:5px}.input-quiz-group input{flex:1;padding:8px;border:1px solid #ccc;border-radius:5px}.btn-check{background:#b8860b;color:#fff;border:0;padding:0 15px;border-radius:5px}.q-feedback{margin-top:10px;padding:10px;border-radius:5px;font-size:13px;animation:fadeIn .3s}.q-feedback.correct{background:#e8f5e9;color:#2e7d32;border:1px solid #c8e6c9}.q-feedback.wrong{background:#ffebee;color:#c62828;border:1px solid #ffcdd2}.correct-sel{background:#2e7d32!important;color:#fff!important;border-color:#2e7d32!important}.wrong-sel{background:#c62828!important;color:#fff!important;border-color:#c62828!important}.chapter-nav-footer{display:flex;justify-content:space-between;margin-top:20px;padding-top:15px;border-top:1px dashed #ccc}.nav-btn{background:#fff;border:1px solid #b8860b;color:#b8860b;padding:10px 20px;border-radius:25px;font-size:13px;cursor:pointer;transition:.2s;display:flex;align-items:center;gap:5px}.nav-btn:hover{background:#b8860b;color:#fff}.nav-btn:active{transform:scale(.95)}.quiz-dashboard{padding:15px}.quiz-header-card{text-align:center;background:linear-gradient(135deg,#fff 0,#fff8e1 100%);border:1px solid #ffe082;padding:20px;border-radius:10px;margin-bottom:20px;box-shadow:0 4px 6px rgba(0,0,0,.05)}.quiz-header-card h3{color:#b8860b;margin:0}.quiz-header-card p{font-size:12px;color:#666;margin:5px 0 0}.level-card{display:flex;align-items:center;width:100%;background:#fff;border:1px solid #eee;border-radius:10px;padding:15px;margin-bottom:10px;text-align:left;cursor:pointer;transition:.2s}.level-card:active{transform:scale(.98);background:#f5f5f5}.lvl-icon{width:40px;height:40px;border-radius:50%;color:#fff;font-weight:700;font-size:18px;display:flex;align-items:center;justify-content:center;margin-right:15px}.lvl-icon.basic{background:#4caf50}.lvl-icon.inter{background:#2196f3}.lvl-icon.adv{background:#9c27b0}.lvl-info h4{margin:0;font-size:14px;color:#333}.lvl-info p{margin:2px 0 0;font-size:11px;color:#888}.quiz-status-bar{display:flex;justify-content:space-between;padding:10px 15px;background:#333;color:#fff;font-size:12px;font-weight:700;border-radius:0 0 10px 10px;margin-bottom:20px}.score-badge{color:#fbc02d}.live-quiz-card{background:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 10px rgba(0,0,0,.1);margin:0 15px;text-align:center}.live-q-text{font-size:16px;margin-bottom:20px;line-height:1.5;color:#333}#liveQuizInput{width:100%;padding:12px;font-size:18px;text-align:center;border:2px solid #b8860b;border-radius:8px;color:#b8860b;font-weight:700}.quiz-result-card{text-align:center;padding:40px 20px;background:#fff;border-radius:10px;margin:20px;box-shadow:0 5px 15px rgba(0,0,0,.1);animation:zoomIn .3s}.final-score{font-size:30px;font-weight:700;color:#2e7d32;margin:15px 0}#view-extras .sub-content{display:none!important}#view-extras .sub-content.active{display:block!important}.view-section{display:none!important}.view-section.active{display:block!important;animation:fadeIn .3s ease-in-out}.pro-glow{border:none!important;box-shadow:none!important;transition:all .5s ease}.pro-badge{background:linear-gradient(45deg,#ffd700,#b8860b);color:#fff;padding:3px 8px;border-radius:12px;font-size:10px;font-weight:700;margin-left:5px;display:inline-block;box-shadow:0 2px 5px rgba(0,0,0,.2);animation:pulse 2s infinite}@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.9}}.free-badge{background:#eee;color:#757575;border:1px solid #bdbdbd;padding:3px 8px;border-radius:12px;font-size:10px;font-weight:700;margin-left:5px;display:inline-block;cursor:pointer;transition:all .3s}.free-badge:hover{background:#e0e0e0;color:#d32f2f;border-color:#d32f2f}.ad-container{position:relative;width:100%;aspect-ratio:4/1;overflow:hidden;border-radius:8px;box-shadow:0 2px 5px rgba(0,0,0,.1)}.ad-slide{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:opacity 1s ease-in-out;display:flex;justify-content:center;align-items:center}.ad-slide.active{opacity:1;z-index:1}.ad-slide img{width:100%;height:100%;object-fit:cover}