.app{min-height:100vh;display:flex;flex-direction:column}.app-content{flex:1;padding:20px;max-width:1400px;margin:0 auto;width:100%;box-sizing:border-box;overflow-x:hidden}@media (max-width: 768px){.app-content{padding:10px;width:100%;max-width:100vw}}@media (max-width: 480px){.app-content{padding:8px;width:100%;max-width:100vw}}.glossary{padding:20px}.glossary-header{text-align:center;margin-bottom:30px;color:#fff}.glossary-header h1{font-size:36px;font-weight:300;margin-bottom:10px}.subtitle{font-size:18px;opacity:.9}.category-selector{display:flex;gap:20px;justify-content:center;margin-bottom:30px;flex-wrap:wrap;padding:30px;background:#ffffff26;border-radius:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.3);box-shadow:0 4px 20px #0000001a}.category-btn{padding:20px 40px;border:3px solid white;background:#ffffff26;color:#fff;border-radius:12px;cursor:pointer;font-size:18px;font-weight:600;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;gap:8px;min-width:220px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 8px #0000001a}.category-btn:hover{background:#ffffff40;transform:translateY(-3px);box-shadow:0 6px 20px #0000004d;border-color:#fffc}.category-btn.active{background:#fff;color:#667eea;border-color:#667eea;box-shadow:0 6px 24px #667eea80;transform:translateY(-2px);font-weight:700}.term-count{font-size:14px;opacity:.8;font-weight:400}.category-info{margin-bottom:30px;max-width:800px;margin-left:auto;margin-right:auto}.info-box{padding:20px;border-radius:12px;text-align:center;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.basic-info{background:#10b98133;border:2px solid rgba(16,185,129,.5)}.advanced-info{background:#667eea33;border:2px solid rgba(102,126,234,.5)}.info-box strong{display:block;margin-bottom:10px;font-size:18px}.info-box p{margin:0;font-size:14px;opacity:.9;line-height:1.6}.glossary-content{display:grid;grid-template-columns:300px 1fr;gap:30px;margin-top:30px}.terms-list{display:flex;flex-direction:column;gap:15px}.terms-header{background:#fff;padding:20px;border-radius:12px;margin-bottom:10px;box-shadow:0 2px 8px #0000001a}.terms-header h3{font-size:20px;color:#667eea;margin-bottom:5px;font-weight:500}.terms-subtitle{font-size:14px;color:#666;margin:0}.term-card{background:#fff;padding:20px;border-radius:12px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #0000001a;border:2px solid transparent;position:relative;display:flex;flex-direction:column}.term-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.term-card.active{border-color:#667eea;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.term-card-header{display:flex;align-items:center;gap:12px;margin-bottom:10px}.term-order{background:#667eea1a;color:#667eea;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0}.term-card.active .term-order{background:#ffffff4d;color:#fff}.term-card h3{font-size:18px;font-weight:500;margin:0;flex:1}.term-card .analogy{font-size:14px;opacity:.8;font-style:italic;margin:8px 0 0;padding-left:0;line-height:1.5}.term-detail{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 20px #0000001a}.term-info{margin-bottom:30px}.term-badge{margin-bottom:15px}.badge{display:inline-block;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:500}.badge-basic{background:#f0fdf4;color:#10b981;border:1px solid #10b981}.badge-advanced{background:#f0f4ff;color:#667eea;border:1px solid #667eea}.term-info h2{font-size:28px;color:#667eea;margin-bottom:15px;font-weight:400}.analogy-large{font-size:18px;color:#764ba2;margin-bottom:15px;font-style:italic;padding:15px;background:#f8f9ff;border-radius:8px;border-left:4px solid #667eea}.description{font-size:16px;line-height:1.6;color:#555}.visualization{margin-top:30px;padding-top:30px;border-top:2px solid #eee}.visualization h3{font-size:20px;color:#667eea;margin-bottom:20px;font-weight:400}.visualization-placeholder{margin-top:30px;padding-top:30px;border-top:2px solid #eee}.visualization-placeholder h3{font-size:20px;color:#667eea;margin-bottom:20px;font-weight:400}.placeholder-content{background:#f8f9ff;padding:25px;border-radius:12px;border-left:4px solid #667eea}.placeholder-content p{font-size:16px;color:#555;line-height:1.6;margin-bottom:20px}.next-steps{margin-top:20px;padding-top:20px;border-top:1px solid #e0e0e0}.next-steps strong{display:block;margin-bottom:10px;color:#667eea;font-size:16px}.next-steps ul{list-style:none;padding:0;margin:0}.next-steps li{padding:10px;background:#fff;border-radius:8px;margin-bottom:8px;color:#666;line-height:1.6}.next-steps li strong{display:inline;color:#667eea;font-weight:500}@media (max-width: 1024px){.glossary-content{grid-template-columns:1fr}.terms-list{flex-direction:row;overflow-x:auto;padding-bottom:10px;-webkit-overflow-scrolling:touch}.term-card{min-width:200px}}@media (max-width: 768px){.glossary{padding:15px}.glossary-header h1{font-size:24px}.subtitle{font-size:14px}.category-selector{padding:20px 15px;gap:15px}.category-btn{min-width:160px;padding:15px 20px;font-size:16px}.category-info{margin-bottom:20px}.info-box{padding:15px}.info-box strong{font-size:16px}.info-box p{font-size:13px}.terms-header{padding:15px}.terms-header h3{font-size:18px}.term-card{padding:15px}.term-card-header{margin-bottom:8px}.term-card h3{font-size:16px}.term-card .analogy{font-size:12px;padding-left:0;margin-top:8px}.term-detail{padding:20px}.term-info h2{font-size:22px}.analogy-large{font-size:16px;padding:12px}.description{font-size:14px}}@media (max-width: 480px){.glossary{padding:10px}.glossary-header h1{font-size:20px}.subtitle{font-size:12px}.category-selector{padding:15px 10px;gap:10px}.category-btn{min-width:140px;padding:12px 15px;font-size:14px}.term-count{font-size:12px}.terms-header h3{font-size:16px}.terms-subtitle{font-size:12px}.term-card{padding:12px;min-width:180px}.term-card-header{margin-bottom:6px;gap:8px}.term-order{width:24px;height:24px;font-size:12px}.term-card h3{font-size:14px}.term-card .analogy{font-size:11px;padding-left:0;margin-top:6px;line-height:1.4}.term-detail{padding:15px}.term-info h2{font-size:20px}.analogy-large{font-size:14px;padding:10px}.description{font-size:13px}.visualization h3,.visualization-placeholder h3{font-size:18px}}.chart-container{background:#fff;padding:20px;border-radius:12px;margin-bottom:20px;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.chart-explanation{background:#f8f9ff;padding:15px;border-radius:8px;margin-bottom:20px;border-left:4px solid #667eea}.chart-explanation p{margin:8px 0;font-size:14px;line-height:1.6;color:#555}.chart-explanation h4{margin-bottom:10px;font-size:18px;font-weight:500}.chart-notes{margin-top:20px;padding:15px;background:#fff9e6;border-radius:8px;border-left:4px solid #f59e0b}.chart-notes p{margin:0;font-size:14px;color:#666}.trend-selector{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}.trend-btn{padding:10px 20px;border:2px solid #667eea;background:#fff;color:#667eea;border-radius:8px;cursor:pointer;font-size:14px;transition:all .3s ease}.trend-btn:hover{background:#f0f4ff}.trend-btn.active{background:#667eea;color:#fff}.candlestick-chart{position:relative;margin:20px 0}.candlestick-labels{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap;font-size:11px}.candle-label{padding:5px;background:#f8f9ff;border-radius:4px;min-width:80px}.candle-label div{margin:2px 0}.risk-calculation{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.risk-calculation h4{margin-bottom:15px;color:#667eea}.calc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px}.calc-item{padding:15px;background:#fff;border-radius:8px;border:1px solid #e0e0e0}.calc-item.highlight{background:#fff9e6;border-color:#f59e0b}.volatility-comparison{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}.vol-chart{background:#f8f9ff;padding:15px;border-radius:8px}.vol-chart h4{margin-bottom:15px;text-align:center;color:#667eea}.long-short-comparison{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}.position-chart{background:#f8f9ff;padding:15px;border-radius:8px}.position-chart h4{margin-bottom:10px;text-align:center;color:#667eea}.position-desc{text-align:center;font-size:14px;color:#666;margin-bottom:15px;font-style:italic}.leverage-scenarios{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:20px 0}.leverage-card{padding:20px;background:#fff;border-radius:12px;border:2px solid #e0e0e0;box-shadow:0 2px 8px #0000001a}.leverage-card h4{margin-bottom:15px;font-size:18px}.leverage-details{display:flex;flex-direction:column;gap:10px}.detail-item{display:flex;justify-content:space-between;padding:10px;background:#f8f9ff;border-radius:6px}.detail-item.profit{background:#f0fdf4}.detail-item.loss{background:#fef2f2}.leverage-warning{margin-top:15px;padding:10px;background:#fef2f2;border-radius:6px;border-left:4px solid #ef4444}.leverage-warning p{margin:0;font-size:12px;color:#dc2626}.leverage-visual{margin-top:30px;padding:20px;background:#f8f9ff;border-radius:8px}.leverage-visual h4{margin-bottom:20px;color:#667eea}.bar-chart{display:flex;flex-direction:column;gap:15px}.bar-item{display:flex;align-items:center;gap:15px}.bar-label{min-width:150px;font-size:14px;color:#666}.bar-container{flex:1;height:40px;background:#e0e0e0;border-radius:6px;position:relative;overflow:hidden}.bar{height:100%;display:flex;align-items:center;justify-content:flex-end;padding-right:10px;transition:width .5s ease}.bar-value{color:#fff;font-weight:700;font-size:12px}.spread-examples{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin:20px 0}.spread-card{padding:20px;background:#fff;border-radius:12px;border:2px solid #e0e0e0;box-shadow:0 2px 8px #0000001a}.spread-card h4{text-align:center;margin-bottom:20px;color:#667eea;font-size:20px}.spread-visual{display:flex;flex-direction:column;gap:15px}.price-row{display:flex;justify-content:space-between;align-items:center;gap:10px}.price-item{flex:1;padding:15px;background:#f8f9ff;border-radius:8px;text-align:center}.price-item.bid{background:#fef2f2}.price-item.ask{background:#f0fdf4}.price-label{display:block;font-size:12px;color:#666;margin-bottom:5px}.price-value{display:block;font-size:20px;font-weight:700;color:#333}.spread-indicator{padding:10px 15px;border-radius:8px;color:#fff;font-weight:700;font-size:14px}.spread-arrow{position:relative;height:30px;display:flex;align-items:center;justify-content:center}.arrow-line{width:100%;height:2px;border-top:2px solid #667eea}.arrow-head{position:absolute;right:0;width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid #667eea}.spread-cost{padding:15px;background:#fff9e6;border-radius:8px;text-align:center}.spread-cost strong{display:block;margin-bottom:8px;color:#f59e0b}.spread-cost p{margin:0;font-size:12px;color:#666}.spread-impact{margin-top:30px;padding:20px;background:#f8f9ff;border-radius:8px}.spread-impact h4{margin-bottom:15px;color:#667eea}.impact-scenario{display:flex;flex-direction:column;gap:15px}.scenario-item strong{display:block;margin-bottom:8px;color:#667eea}.pattern-selector{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}.pattern-btn{padding:10px 20px;border:2px solid #667eea;background:#fff;color:#667eea;border-radius:8px;cursor:pointer;font-size:14px;transition:all .3s ease}.pattern-btn:hover{background:#f0f4ff}.pattern-btn.active{background:#667eea;color:#fff}.candlestick-pattern-chart{margin:20px 0;background:#f8f9ff;padding:20px;border-radius:8px}.pattern-details{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.pattern-details h4{margin-bottom:15px;color:#667eea}.pattern-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px}.candle-detail{padding:15px;background:#fff;border-radius:8px;border:1px solid #e0e0e0}.candle-detail strong{display:block;margin-bottom:8px;color:#667eea}.candle-detail div{font-size:12px;color:#666;margin:4px 0}.ma-crossover-info{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.ma-crossover-info h4{margin-bottom:15px;color:#667eea}.crossover-examples{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.crossover-item{padding:15px;background:#fff;border-radius:8px;border-left:4px solid #667eea}.crossover-item.bullish{border-left-color:#10b981;background:#f0fdf4}.crossover-item.bearish{border-left-color:#ef4444;background:#fef2f2}.crossover-item strong{display:block;margin-bottom:8px;color:#333}.crossover-item p{margin:0;font-size:14px;color:#666}.volume-analysis{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.volume-analysis h4{margin-bottom:15px;color:#667eea}.volume-scenarios{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.scenario-item{padding:15px;background:#fff;border-radius:8px;border-left:4px solid #667eea}.scenario-item.good{border-left-color:#10b981;background:#f0fdf4}.scenario-item.warning{border-left-color:#f59e0b;background:#fffbeb}.scenario-item.bad{border-left-color:#ef4444;background:#fef2f2}.scenario-item strong{display:block;margin-bottom:8px;color:#333}.scenario-item p{margin:0;font-size:14px;color:#666}.risk-calculator{margin:20px 0;padding:20px;background:#f8f9ff;border-radius:8px}.risk-calculator h4{margin-bottom:15px;color:#667eea}.calculator-inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-bottom:15px}.input-group{display:flex;flex-direction:column;gap:8px}.input-group label{font-size:14px;color:#666;font-weight:500}.input-group input{padding:10px;border:2px solid #e0e0e0;border-radius:6px;font-size:16px;transition:border-color .3s}.input-group input:focus{outline:none;border-color:#667eea}.risk-display{padding:15px;background:#fff;border-radius:8px;border:2px solid #667eea}.risk-item{display:flex;justify-content:space-between;align-items:center}.risk-value{font-size:24px;font-weight:700;color:#667eea}.trading-scenarios{margin:20px 0}.trading-scenarios h4{margin-bottom:15px;color:#667eea}.scenario-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-top:20px}.summary-item{padding:15px;background:#f8f9ff;border-radius:8px;text-align:center}.summary-item.highlight{background:#fff9e6;border:2px solid #f59e0b}.summary-item strong{display:block;margin-bottom:8px;color:#666}.summary-item span{font-size:20px;font-weight:700}.risk-rules{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.risk-rules h4{margin-bottom:15px;color:#667eea}.rules-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.rule-item{padding:15px;background:#fff;border-radius:8px;border-left:4px solid #667eea}.rule-item strong{display:block;margin-bottom:8px;color:#667eea}.rule-item p{margin:4px 0;font-size:14px;color:#666;line-height:1.6}.psychology-comparison{margin:20px 0}.psychology-comparison h4{margin-bottom:15px;color:#667eea;text-align:center}.psychology-traps{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.psychology-traps h4{margin-bottom:15px;color:#667eea}.traps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.trap-item{padding:15px;background:#fff;border-radius:8px;border-left:4px solid #667eea}.trap-item.fear{border-left-color:#3b82f6;background:#eff6ff}.trap-item.greed{border-left-color:#f59e0b;background:#fffbeb}.trap-item.hope{border-left-color:#8b5cf6;background:#f5f3ff}.trap-item.fomo{border-left-color:#ef4444;background:#fef2f2}.trap-item strong{display:block;margin-bottom:8px;color:#333}.trap-item p{margin:4px 0;font-size:14px;color:#666;line-height:1.6}.trap-item .solution{margin-top:10px;padding-top:10px;border-top:1px solid #e0e0e0;color:#10b981}.psychology-tips{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.psychology-tips h4{margin-bottom:15px;color:#667eea}.tips-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.tip-item{padding:15px;background:#fff;border-radius:8px;border-left:4px solid #10b981}.tip-item strong{display:block;margin-bottom:8px;color:#10b981}.tip-item p{margin:0;font-size:14px;color:#666;line-height:1.6}.market-selector{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}.market-btn{padding:12px 24px;border:2px solid #667eea;background:#fff;color:#667eea;border-radius:8px;cursor:pointer;font-size:16px;transition:all .3s ease}.market-btn:hover{background:#f0f4ff}.market-btn.active{background:#667eea;color:#fff}.market-features{margin-top:15px;padding-top:15px;border-top:1px solid #e0e0e0}.market-features strong{display:block;margin-bottom:10px;color:#333}.market-features ul{list-style:none;padding:0;margin:0}.market-features li{padding:5px 0 5px 20px;position:relative;color:#666}.market-features li:before{content:"•";position:absolute;left:0;color:#667eea;font-weight:700}.indonesian-market-info{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.indonesian-market-info h4{margin-bottom:15px;color:#667eea}.market-comparison{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.comparison-item{padding:15px;background:#fff;border-radius:8px;border-left:4px solid #667eea}.comparison-item strong{display:block;margin-bottom:8px;color:#667eea}.comparison-item p{margin:0;font-size:14px;color:#666;line-height:1.6}.syariah-principles{margin-top:20px;padding:20px;background:#f0f9ff;border-radius:8px;border-left:4px solid #3b82f6}.syariah-principles h4{margin-bottom:15px;color:#3b82f6}.principles-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px}.principle-item{padding:15px;background:#fff;border-radius:8px;border:1px solid #e0e0e0}.principle-item strong{display:block;margin-bottom:8px;color:#3b82f6}.principle-item p{margin:0;font-size:14px;color:#666;line-height:1.6}@media (max-width: 768px){.volatility-comparison,.long-short-comparison{grid-template-columns:1fr}.bar-item{flex-direction:column;align-items:flex-start}.bar-label{min-width:auto}.bar-container{width:100%}.pattern-selector{justify-content:center}.pattern-info,.crossover-examples,.volume-scenarios,.traps-grid,.tips-list{grid-template-columns:1fr}.market-selector{justify-content:center}.market-comparison,.principles-grid{grid-template-columns:1fr}}.dual-chart{display:flex;flex-direction:column;gap:20px;margin:20px 0}.chart-section{background:#f8f9ff;padding:15px;border-radius:8px}.chart-section h4{margin-bottom:15px;text-align:center;color:#667eea}.indicator-usage{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.indicator-usage h4{margin-bottom:15px;color:#667eea}.usage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.usage-item{padding:15px;background:#fff;border-radius:8px;border-left:4px solid #667eea}.usage-item.bullish{border-left-color:#10b981;background:#f0fdf4}.usage-item.bearish{border-left-color:#ef4444;background:#fef2f2}.usage-item strong{display:block;margin-bottom:8px;color:#333}.usage-item p{margin:0;font-size:14px;color:#666;line-height:1.6}.fibonacci-levels{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.fibonacci-levels h4{margin-bottom:15px;color:#667eea}.levels-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px}.level-item{padding:15px;background:#fff;border-radius:8px;border-left:4px solid #667eea}.level-item strong{display:block;margin-bottom:8px;color:#333}.level-item p{margin:0;font-size:14px;color:#666;line-height:1.6}.fundamental-metrics{margin:20px 0}.fundamental-metrics h4{margin-bottom:20px;color:#667eea}.metric-card{padding:20px;background:#f8f9ff;border-radius:8px;margin-bottom:20px;border-left:4px solid #667eea}.metric-header h5{font-size:20px;color:#667eea;margin-bottom:10px}.metric-header .analogy{font-size:14px;color:#764ba2;font-style:italic;margin-bottom:15px}.metric-explanation{padding:15px;background:#fff;border-radius:6px;margin-bottom:15px}.metric-explanation p{margin:0;color:#666;line-height:1.6}.metric-ranges{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:15px}.range-item{padding:10px;border-radius:6px;text-align:center;font-size:14px}.range-item.good{background:#f0fdf4;color:#10b981}.range-item.warning{background:#fffbeb;color:#f59e0b}.range-item.bad{background:#fef2f2;color:#ef4444}.metric-when{padding:10px;background:#fff9e6;border-radius:6px;font-size:14px;color:#666}.metric-when strong{color:#f59e0b}.fundamental-checklist{margin-top:30px;padding:20px;background:#f8f9ff;border-radius:8px}.fundamental-checklist h4{margin-bottom:20px;color:#667eea}.checklist-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.checklist-category{padding:15px;background:#fff;border-radius:8px;border-left:4px solid #667eea}.checklist-category h5{color:#667eea;margin-bottom:10px}.checklist-category ul{list-style:none;padding:0}.checklist-category li{padding:5px 0;color:#666;font-size:14px}.fundamental-vs-technical{margin-top:30px;padding:20px;background:#f8f9ff;border-radius:8px}.fundamental-vs-technical h4{margin-bottom:20px;color:#667eea}.comparison-table{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;background:#e0e0e0;border-radius:8px;overflow:hidden}.comparison-row{display:contents}.comparison-row>div{background:#fff;padding:15px;font-size:14px;color:#666}.comparison-row.header>div{background:#667eea;color:#fff;font-weight:700;text-align:center}.comparison-row>div:first-child{font-weight:500;color:#333}.technical-elements{margin-top:20px;padding:20px;background:#f8f9ff;border-radius:8px}.technical-elements h4{margin-bottom:15px;color:#667eea}.elements-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.element-item{padding:15px;background:#fff;border-radius:8px;border-left:4px solid #667eea}.element-item strong{display:block;margin-bottom:8px;color:#667eea}.element-item p{margin:0;font-size:14px;color:#666;line-height:1.6}@media (max-width: 768px){.chart-container{padding:15px}.chart-explanation{padding:12px}.chart-explanation p{font-size:13px}.chart-explanation h4{font-size:16px}.trend-selector,.pattern-selector,.market-selector{gap:8px}.trend-btn,.pattern-btn,.market-btn{padding:8px 16px;font-size:13px}.dual-chart{gap:15px}.chart-section{padding:12px}.chart-section h4{font-size:16px}.indicator-usage,.fibonacci-levels,.ma-crossover-info,.volume-analysis{padding:15px}.indicator-usage h4,.fibonacci-levels h4{font-size:18px}.usage-grid,.levels-grid,.checklist-grid,.elements-grid{grid-template-columns:1fr;gap:12px}.usage-item,.level-item,.criterion{padding:12px}.usage-item strong,.level-item strong{font-size:14px}.usage-item p,.level-item p{font-size:13px}.risk-calculator,.risk-rules{padding:15px}.calculator-inputs{grid-template-columns:1fr}.risk-value{font-size:20px}.scenario-summary,.rules-list{grid-template-columns:1fr}.fundamental-metrics{margin:15px 0}.metric-card{padding:15px}.metric-header h5{font-size:18px}.metric-ranges,.comparison-table{grid-template-columns:1fr}.comparison-row{display:flex;flex-direction:column}.comparison-row.header{display:none}.comparison-row>div:first-child{background:#667eea;color:#fff;font-weight:700}.psychology-comparison h4{font-size:18px}.traps-grid,.tips-list{grid-template-columns:1fr}.trap-item,.tip-item,.chart-notes{padding:12px}.chart-notes p{font-size:13px}}@media (max-width: 480px){.chart-container{padding:12px}.chart-explanation{padding:10px}.chart-explanation p{font-size:12px}.trend-btn,.pattern-btn,.market-btn{padding:6px 12px;font-size:12px}.indicator-usage h4,.fibonacci-levels h4{font-size:16px}.usage-item,.level-item{padding:10px}.usage-item strong,.level-item strong{font-size:13px}.usage-item p,.level-item p{font-size:12px}.metric-card{padding:12px}.metric-header h5{font-size:16px}.metric-explanation p{font-size:13px}}@media (max-width: 768px){.chart-container .recharts-wrapper{min-height:250px}.dual-chart .recharts-wrapper{min-height:200px}}@media (max-width: 480px){.chart-container .recharts-wrapper{min-height:200px}.dual-chart .recharts-wrapper{min-height:150px}}.book-chapters{padding:20px;width:100%;max-width:100%;overflow-x:hidden;box-sizing:border-box}.book-chapters-header{text-align:center;margin-bottom:40px;color:#fff}.book-chapters-header h1{font-size:36px;font-weight:300;margin-bottom:10px}.book-chapters-content{display:grid;grid-template-columns:250px 1fr;gap:30px;width:100%;max-width:100%;box-sizing:border-box}.books-sidebar{display:flex;flex-direction:column;gap:15px;width:100%;max-width:100%;box-sizing:border-box}.books-sidebar h3{color:#fff;font-size:20px;margin-bottom:10px;font-weight:400}.book-card{background:#fff;padding:20px;border-radius:12px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #0000001a;border:2px solid transparent}.book-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.book-card.active{border-color:#667eea;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.book-card h4{font-size:16px;font-weight:500;margin-bottom:8px}.book-card .author{font-size:12px;opacity:.8;font-style:italic;margin:0}.chapters-content{display:grid;grid-template-columns:200px 1fr;gap:30px;width:100%;max-width:100%;box-sizing:border-box}.chapters-sidebar{display:flex;flex-direction:column;gap:10px;width:100%;max-width:100%;box-sizing:border-box}.chapters-sidebar h3{color:#fff;font-size:18px;margin-bottom:10px;font-weight:400}.chapter-card{background:#fff;padding:15px;border-radius:8px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 6px #0000001a;border:2px solid transparent;font-size:14px;text-align:center}.chapter-card:hover{transform:translate(5px);box-shadow:0 4px 12px #00000026}.chapter-card.active{border-color:#667eea;background:#667eea;color:#fff}.chapter-detail{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 20px #0000001a;width:100%;max-width:100%;box-sizing:border-box;overflow-x:hidden}.chapter-header{margin-bottom:30px;padding-bottom:20px;border-bottom:2px solid #eee}.chapter-header h2{font-size:28px;color:#667eea;margin-bottom:10px;font-weight:400}.book-title{font-size:14px;color:#999;font-style:italic;margin:0}.key-points{margin-bottom:30px}.key-points h3{font-size:20px;color:#667eea;margin-bottom:15px;font-weight:400}.key-points ul{list-style:none;padding:0}.key-points li{padding:15px;margin-bottom:10px;background:#f8f9ff;border-radius:8px;border-left:4px solid #667eea;line-height:1.6;color:#555}.chapter-visualization{margin-top:30px;padding-top:30px;border-top:2px solid #eee;width:100%;max-width:100%;box-sizing:border-box;overflow-x:auto;-webkit-overflow-scrolling:touch}.chapter-visualization>*{max-width:100%;box-sizing:border-box}.chapter-visualization h3{font-size:20px;color:#667eea;margin-bottom:20px;font-weight:400}.chapter-notes{margin-top:30px;padding:20px;background:#fff9e6;border-radius:8px;border-left:4px solid #f59e0b}.chapter-notes h3{font-size:18px;color:#f59e0b;margin-bottom:10px;font-weight:400}.chapter-notes p{margin:0;color:#666;line-height:1.6}@media (max-width: 1200px){.book-chapters{padding:15px}.book-chapters-content{grid-template-columns:1fr;gap:20px}.books-sidebar{flex-direction:row;overflow-x:auto;overflow-y:hidden;padding-bottom:10px;-webkit-overflow-scrolling:touch;scrollbar-width:thin;margin:0 -15px;padding-left:15px;padding-right:15px}.books-sidebar::-webkit-scrollbar{height:6px}.books-sidebar::-webkit-scrollbar-track{background:#ffffff1a;border-radius:3px}.books-sidebar::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:3px}.book-card{min-width:200px;flex-shrink:0}.chapters-content{grid-template-columns:1fr;gap:20px}.chapters-sidebar{flex-direction:row;overflow-x:auto;overflow-y:hidden;padding-bottom:10px;-webkit-overflow-scrolling:touch;scrollbar-width:thin;margin:0 -15px;padding-left:15px;padding-right:15px}.chapters-sidebar::-webkit-scrollbar{height:6px}.chapters-sidebar::-webkit-scrollbar-track{background:#ffffff1a;border-radius:3px}.chapters-sidebar::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:3px}.chapter-card{min-width:150px;flex-shrink:0}}@media (max-width: 768px){.book-chapters{padding:10px;margin:0;width:100%;max-width:100vw;box-sizing:border-box}.book-chapters-header{margin-bottom:20px;padding:0 5px}.book-chapters-header h1{font-size:24px}.subtitle{font-size:14px;padding:0 5px}.book-chapters-content{gap:15px;width:100%}.books-sidebar{margin:0 -10px;padding-left:10px;padding-right:10px}.books-sidebar h3{font-size:18px;padding-left:5px}.book-card{padding:15px;min-width:180px;max-width:180px}.book-card h4{font-size:14px;word-wrap:break-word;overflow-wrap:break-word}.book-card .author{font-size:11px;word-wrap:break-word;overflow-wrap:break-word}.chapters-content{gap:15px;width:100%}.chapters-sidebar{margin:0 -10px;padding-left:10px;padding-right:10px}.chapters-sidebar h3{font-size:16px;padding-left:5px}.chapter-card{padding:12px;font-size:13px;min-width:130px;max-width:130px;word-wrap:break-word;overflow-wrap:break-word;white-space:normal;text-align:center}.chapter-detail{padding:15px;margin:0;width:100%;max-width:100%;box-sizing:border-box}.chapter-header{margin-bottom:20px;padding-bottom:15px}.chapter-header h2{font-size:22px;word-wrap:break-word;overflow-wrap:break-word}.book-title{font-size:12px;word-wrap:break-word;overflow-wrap:break-word}.key-points{margin-bottom:20px}.key-points h3{font-size:18px}.key-points li{padding:12px;font-size:14px;word-wrap:break-word;overflow-wrap:break-word}.chapter-visualization{margin-top:20px;padding-top:20px;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.chapter-visualization h3{font-size:18px}.chapter-notes{padding:15px;margin-top:20px}.chapter-notes h3{font-size:16px}.chapter-notes p{font-size:13px;word-wrap:break-word;overflow-wrap:break-word}}@media (max-width: 480px){.book-chapters{padding:8px;margin:0;width:100%;max-width:100vw;box-sizing:border-box}.book-chapters-header{margin-bottom:15px;padding:0}.book-chapters-header h1{font-size:20px}.subtitle{font-size:12px;padding:0}.book-chapters-content{gap:12px}.books-sidebar{gap:8px;margin:0 -8px;padding-left:8px;padding-right:8px}.books-sidebar h3{font-size:16px;padding-left:0}.book-card{padding:12px;min-width:160px;max-width:160px}.book-card h4{font-size:13px}.chapters-content{gap:12px}.chapters-sidebar{gap:8px;margin:0 -8px;padding-left:8px;padding-right:8px}.chapters-sidebar h3{font-size:14px;padding-left:0}.chapter-card{padding:10px;font-size:12px;min-width:120px;max-width:120px}.chapter-detail{padding:12px;margin:0}.chapter-header{margin-bottom:15px;padding-bottom:12px}.chapter-header h2{font-size:18px}.key-points{margin-bottom:15px}.key-points h3{font-size:16px}.key-points li{padding:10px;font-size:13px}.chapter-visualization{margin-top:15px;padding-top:15px}.chapter-visualization h3{font-size:16px}.chapter-notes{padding:12px;margin-top:15px}.chapter-notes h3{font-size:14px}.chapter-notes p{font-size:12px}}.indonesian-market{padding:20px}.indonesian-market-header{text-align:center;margin-bottom:40px;color:#fff}.indonesian-market-header h1{font-size:36px;font-weight:300;margin-bottom:10px}.market-intro{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-bottom:40px}.intro-card{background:#fff;padding:30px;border-radius:12px;box-shadow:0 4px 20px #0000001a}.intro-card.ihsg-card{border-left:4px solid #10b981}.intro-card.syariah-card{border-left:4px solid #3b82f6}.intro-card h3{font-size:24px;margin-bottom:15px;color:#667eea}.intro-card p{font-size:16px;line-height:1.6;color:#555;margin-bottom:15px}.intro-card ul{list-style:none;padding:0}.intro-card li{padding:8px 0 8px 25px;position:relative;color:#666}.intro-card li:before{content:"✓";position:absolute;left:0;color:#10b981;font-weight:700}.market-visualization{background:#fff;padding:30px;border-radius:12px;box-shadow:0 4px 20px #0000001a;margin-bottom:40px}.market-visualization h2{font-size:28px;color:#667eea;margin-bottom:20px;font-weight:400}.trading-indonesia{background:#fff;padding:30px;border-radius:12px;box-shadow:0 4px 20px #0000001a;margin-bottom:40px}.trading-indonesia h2{font-size:28px;color:#667eea;margin-bottom:30px;font-weight:400}.trading-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.info-card{padding:20px;background:#f8f9ff;border-radius:8px;border-left:4px solid #667eea}.info-card h4{font-size:20px;color:#667eea;margin-bottom:15px;font-weight:400}.info-card ul{list-style:none;padding:0}.info-card li{padding:8px 0;color:#666;line-height:1.6}.trading-hours{display:flex;flex-direction:column;gap:10px}.session{padding:10px;background:#fff;border-radius:6px}.session strong{display:block;margin-bottom:5px;color:#667eea}.session p{margin:0;color:#666}.syariah-details{background:#fff;padding:30px;border-radius:12px;box-shadow:0 4px 20px #0000001a;margin-bottom:40px}.syariah-details h2{font-size:28px;color:#667eea;margin-bottom:30px;font-weight:400}.syariah-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}.syariah-section{padding:20px;background:#f8f9ff;border-radius:8px;border-left:4px solid #3b82f6}.syariah-section h4{font-size:20px;color:#3b82f6;margin-bottom:15px;font-weight:400}.syariah-section ul,.syariah-section ol{padding-left:20px}.syariah-section li{margin:8px 0;color:#666;line-height:1.6}.criteria-list{display:flex;flex-direction:column;gap:15px}.criterion{padding:15px;background:#fff;border-radius:6px;border:1px solid #e0e0e0}.criterion strong{display:block;margin-bottom:8px;color:#3b82f6}.criterion p{margin:0;color:#666;line-height:1.6}@media (max-width: 768px){.indonesian-market{padding:15px}.indonesian-market-header h1{font-size:24px}.subtitle{font-size:14px}.market-intro{grid-template-columns:1fr;gap:20px}.intro-card{padding:20px}.intro-card h3{font-size:20px}.intro-card p{font-size:14px}.market-visualization{padding:20px}.market-visualization h2{font-size:22px}.trading-indonesia{padding:20px}.trading-indonesia h2{font-size:22px}.trading-info-grid,.syariah-content{grid-template-columns:1fr;gap:15px}.info-card{padding:15px}.info-card h4{font-size:18px}.syariah-details{padding:20px}.syariah-details h2{font-size:22px}.syariah-section{padding:15px}.syariah-section h4{font-size:18px}}@media (max-width: 480px){.indonesian-market{padding:10px}.indonesian-market-header h1{font-size:20px}.subtitle{font-size:12px}.intro-card{padding:15px}.intro-card h3{font-size:18px}.market-visualization,.trading-indonesia,.syariah-details{padding:15px}.market-visualization h2,.trading-indonesia h2,.syariah-details h2{font-size:20px}.info-card h4,.syariah-section h4{font-size:16px}}.best-practice{padding:20px}.best-practice-header{text-align:center;margin-bottom:40px;color:#fff}.best-practice-header h1{font-size:36px;font-weight:300;margin-bottom:10px}.best-practice-content{display:grid;grid-template-columns:300px 1fr;gap:30px}.steps-sidebar{display:flex;flex-direction:column;gap:15px}.steps-sidebar h3{color:#fff;font-size:20px;margin-bottom:10px;font-weight:400}.step-card{background:#fff;padding:15px;border-radius:12px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #0000001a;border:2px solid transparent;display:flex;align-items:center;gap:15px;position:relative}.step-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.step-card.active{border-color:#667eea;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.step-card.completed{border-left:4px solid #10b981}.step-icon{font-size:32px}.step-info h4{font-size:14px;font-weight:500;margin-bottom:4px;opacity:.8}.step-info p{font-size:16px;font-weight:500;margin:0}.checkmark{position:absolute;top:10px;right:10px;background:#10b981;color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}.step-detail{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 20px #0000001a}.step-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:20px;border-bottom:2px solid #eee}.step-header h2{font-size:28px;color:#667eea;font-weight:400;display:flex;align-items:center;gap:10px}.step-number{background:#667eea;color:#fff;padding:8px 16px;border-radius:8px;font-size:20px}.complete-btn{padding:12px 24px;border:2px solid #10b981;background:#fff;color:#10b981;border-radius:8px;cursor:pointer;font-size:16px;font-weight:500;transition:all .3s ease}.complete-btn:hover{background:#f0fdf4}.complete-btn.completed{background:#10b981;color:#fff}.step-description{font-size:18px;color:#666;margin-bottom:30px;font-style:italic}.step-items{display:flex;flex-direction:column;gap:25px;margin-bottom:30px}.step-item{padding:20px;background:#f8f9ff;border-radius:8px;border-left:4px solid #667eea}.step-item h4{font-size:20px;color:#667eea;margin-bottom:10px;font-weight:500}.step-item>p{font-size:16px;color:#555;line-height:1.6;margin-bottom:15px}.checklist{display:flex;flex-direction:column;gap:8px}.checklist-item{padding:10px;background:#fff;border-radius:6px;font-size:14px;color:#666;line-height:1.5}.step-visualization{margin-top:30px;padding-top:30px;border-top:2px solid #eee}.step-visualization h3{font-size:20px;color:#667eea;margin-bottom:20px;font-weight:400}.step-tips{margin-top:30px;padding:20px;background:#fff9e6;border-radius:8px;border-left:4px solid #f59e0b}.step-tips h3{font-size:18px;color:#f59e0b;margin-bottom:15px;font-weight:400}.step-tips ul{list-style:none;padding:0}.step-tips li{padding:10px 0 10px 25px;position:relative;color:#666;line-height:1.6}.step-tips li:before{content:"💡";position:absolute;left:0}@media (max-width: 1024px){.best-practice-content{grid-template-columns:1fr}.steps-sidebar{flex-direction:row;overflow-x:auto;padding-bottom:10px;-webkit-overflow-scrolling:touch}.step-card{min-width:200px}.step-header{flex-direction:column;align-items:flex-start;gap:15px}}@media (max-width: 768px){.best-practice{padding:15px}.best-practice-header h1{font-size:24px}.subtitle{font-size:14px}.steps-sidebar h3{font-size:18px}.step-card{padding:12px;min-width:180px;gap:10px}.step-icon{font-size:24px}.step-info h4{font-size:12px}.step-info p{font-size:14px}.step-detail{padding:20px}.step-header h2{font-size:22px}.step-number{padding:6px 12px;font-size:18px}.complete-btn{padding:10px 20px;font-size:14px}.step-description{font-size:16px}.step-item{padding:15px}.step-item h4{font-size:18px}.step-item>p{font-size:14px}.checklist-item{padding:8px;font-size:13px}.step-tips{padding:15px}.step-tips h3{font-size:16px}.step-tips li{font-size:13px}}@media (max-width: 480px){.best-practice{padding:10px}.best-practice-header h1{font-size:20px}.subtitle{font-size:12px}.step-card{padding:10px;min-width:160px}.step-icon{font-size:20px}.step-info p{font-size:13px}.step-detail{padding:15px}.step-header h2{font-size:18px;flex-direction:column;gap:10px}.step-number{padding:5px 10px;font-size:16px}.complete-btn{width:100%;padding:12px;font-size:13px}.step-description{font-size:14px}.step-item{padding:12px}.step-item h4{font-size:16px}.step-item>p{font-size:13px}.checklist-item{padding:6px;font-size:12px}}.navigation{background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 20px #0000001a;padding:20px;position:sticky;top:0;z-index:100}.nav-container{max-width:1400px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px}.nav-title{font-size:24px;font-weight:300;color:#667eea;margin:0}.nav-buttons{display:flex;gap:10px}.nav-btn{padding:12px 24px;border:2px solid #667eea;background:#fff;color:#667eea;border-radius:8px;cursor:pointer;font-size:16px;font-weight:500;transition:all .3s ease;font-family:Avenir Light,sans-serif}.nav-btn:hover{background:#667eea;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.nav-btn.active{background:#667eea;color:#fff}@media (max-width: 768px){.navigation{padding:15px}.nav-container{flex-direction:column;gap:15px}.nav-title{font-size:18px;text-align:center}.nav-buttons{width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.nav-btn{flex:1;padding:10px 12px;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}@media (max-width: 480px){.navigation{padding:12px}.nav-title{font-size:16px}.nav-buttons{grid-template-columns:1fr}.nav-btn{padding:12px;font-size:13px}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Avenir Light,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:#333;overflow-x:hidden}@supports (-webkit-touch-callout: none){body{min-height:-webkit-fill-available}}button,.nav-btn,.category-btn,.term-card,.book-card,.chapter-card,.step-card{min-height:44px;min-width:44px}*{-webkit-overflow-scrolling:touch}button,.nav-btn,.category-btn{-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{min-height:100vh}