:root{--bg-dark:#0a0a1a;--bg-panel:#1a1a2e;--bg-parchment:#2a1f14;--gold:#d4a017;--gold-light:#f0c040;--text:#e8e8e8;--text-dim:#888;--green:#2d5a27;--red:#8b2020;--blue:#1e3a5f;--font-pixel:"Press Start 2P", monospace;--font-arabic:"Amiri", serif;--panel-border:2px solid var(--gold);--panel-radius:4px;--panel-shadow:0 0 20px #d4a01726, inset 0 0 30px #0006;--transition-fast:.15s ease;--transition-normal:.3s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:var(--bg-dark);width:100%;min-height:100%;color:var(--text);font-family:var(--font-pixel);image-rendering:pixelated;font-size:10px;line-height:1.6}.game-loading{background:var(--bg-dark);justify-content:center;align-items:center;width:100%;height:100vh;display:flex}.game-loading-text{color:var(--gold);font-size:12px;animation:1.5s ease-in-out infinite pulse}.pixel-font{font-family:var(--font-pixel)}.arabic-font{font-family:var(--font-arabic);font-size:1.4em;line-height:1.8}.rtl{text-align:right;direction:rtl}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-dark)}::-webkit-scrollbar-thumb{background:var(--gold);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--gold-light)}*{scrollbar-width:thin;scrollbar-color:var(--gold) var(--bg-dark)}.btn{border:2px solid var(--gold);border-radius:var(--panel-radius);color:var(--text);font-family:var(--font-pixel);cursor:pointer;transition:all var(--transition-fast);text-transform:uppercase;letter-spacing:1px;-webkit-user-select:none;user-select:none;background:0 0;justify-content:center;align-items:center;gap:6px;padding:10px 20px;font-size:10px;display:inline-flex;position:relative;overflow:hidden}.btn:after{content:"";pointer-events:none;background:linear-gradient(#ffffff0d 0%,#0000 50%);position:absolute;inset:0}.btn:hover:not(:disabled){border-color:var(--gold-light);color:var(--gold-light);background:#d4a01726;transform:translateY(-1px);box-shadow:0 0 12px #d4a01740}.btn:active:not(:disabled){box-shadow:none;transform:translateY(1px)}.btn:disabled{opacity:.4;cursor:not-allowed;border-color:var(--text-dim);color:var(--text-dim)}.btn-primary{background:var(--blue);border-color:#2a5a8f}.btn-primary:hover:not(:disabled){background:#264d7a;border-color:#3a7abf}.btn-gold{background:linear-gradient(180deg, var(--gold) 0%, #b8860b 100%);border-color:var(--gold-light);color:var(--bg-dark);text-shadow:0 1px #fff3;font-weight:700}.btn-gold:hover:not(:disabled){background:linear-gradient(180deg, var(--gold-light) 0%, var(--gold) 100%);color:var(--bg-dark);box-shadow:0 0 20px #f0c04066}.btn-secondary{border-color:var(--text-dim);color:var(--text-dim)}.btn-secondary:hover:not(:disabled){border-color:var(--text);color:var(--text);background:#ffffff0d}.panel-overlay{z-index:100;background:#000000b3;justify-content:center;align-items:center;animation:.2s forwards fade-in;display:flex;position:fixed;inset:0}.panel{background:var(--bg-panel);border:var(--panel-border);border-radius:var(--panel-radius);width:min(90vw,720px);max-height:80vh;box-shadow:var(--panel-shadow);flex-direction:column;animation:.2s forwards fade-in;display:flex;position:relative}.panel-header{background:linear-gradient(#d4a0171a 0%,#0000 100%);border-bottom:1px solid #d4a0174d;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.panel-header-title{color:var(--gold);text-transform:uppercase;letter-spacing:2px;font-size:12px}.panel-close{border:1px solid var(--gold);width:28px;height:28px;color:var(--gold);cursor:pointer;transition:all var(--transition-fast);font-size:14px;font-family:var(--font-pixel);background:0 0;border-radius:2px;justify-content:center;align-items:center;display:flex}.panel-close:hover{color:var(--gold-light);background:#d4a01733}.panel-body{flex:1;padding:16px;overflow-y:auto}.hud-container{z-index:50;pointer-events:none;position:fixed;inset:0}.hud-container>*{pointer-events:auto}.top-bar{color:var(--gold);text-transform:uppercase;letter-spacing:1px;background:linear-gradient(#0a0a1aeb 0%,#0a0a1a99 80%,#0000 100%);align-items:center;gap:16px;padding:10px 16px;font-size:9px;display:flex;position:absolute;top:0;left:0;right:0}.top-bar-separator{color:var(--text-dim);font-size:8px}.top-bar-location{color:var(--text-dim)}.bottom-bar{color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;background:linear-gradient(#0000 0%,#0a0a1a66 20%,#0a0a1ad9 100%);justify-content:center;align-items:center;gap:20px;padding:8px 16px;font-size:7px;display:flex;position:absolute;bottom:0;left:0;right:0}.bottom-bar-key{color:var(--gold)}.quest-tracker{border-radius:var(--panel-radius);background:#1a1a2ee0;border:1px solid #d4a0174d;min-width:200px;max-width:280px;padding:10px 14px;font-size:8px;position:absolute;top:44px;right:12px}.quest-tracker-title{color:var(--gold);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;font-size:7px}.quest-tracker-name{color:var(--text);margin-bottom:6px;font-size:8px}.quest-tracker-objective{color:var(--text-dim);align-items:flex-start;gap:6px;font-size:7px;line-height:1.4;display:flex}.quest-tracker-checkbox{border:1px solid var(--gold);border-radius:1px;flex-shrink:0;width:8px;height:8px;margin-top:2px;display:inline-block}.quest-tracker-checkbox.completed{background:var(--gold)}.quest-tracker-done{opacity:.5;text-decoration:line-through}.geo-map-mini{background:var(--bg-parchment);border-radius:var(--panel-radius);border:2px solid #d4a01780;justify-content:center;align-items:center;width:150px;height:100px;display:flex;position:absolute;bottom:40px;right:12px;overflow:hidden;box-shadow:inset 0 0 20px #0009}.geo-map-mini-label{color:#d4a01780;text-transform:uppercase;letter-spacing:1px;text-align:center;font-size:6px;position:absolute;bottom:6px;left:0;right:0}.geo-map-marker{background:var(--gold);border-radius:50%;width:8px;height:8px;animation:2s ease-in-out infinite pulse,2s ease-in-out infinite glow;position:relative}.interaction-prompt{border:1px solid var(--gold);border-radius:var(--panel-radius);color:var(--gold-light);text-align:center;white-space:nowrap;background:#1a1a2eeb;padding:10px 24px;font-size:9px;animation:.2s forwards fade-in;position:absolute;bottom:80px;left:50%;transform:translate(-50%);box-shadow:0 0 16px #d4a01726}.interaction-prompt-key{border:1px solid var(--gold);color:var(--gold-light);font-size:10px;font-family:var(--font-pixel);background:#d4a01733;border-radius:2px;margin:0 4px;padding:2px 8px;display:inline-block}.item-popup{border:1px solid var(--green);border-radius:var(--panel-radius);color:var(--gold-light);white-space:nowrap;pointer-events:none;background:#2d5a27e6;padding:10px 24px;font-size:10px;animation:2s forwards float-up;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.dialogue-panel{z-index:80;padding:0 24px 24px;animation:.2s forwards fade-in;position:fixed;bottom:0;left:0;right:0}.dialogue-box{background:var(--bg-panel);border:var(--panel-border);border-radius:var(--panel-radius);box-shadow:var(--panel-shadow);gap:16px;min-height:120px;padding:20px;display:flex;position:relative}.dialogue-portrait-area{flex-shrink:0;align-items:flex-start;display:flex}.dialogue-portrait{border:2px solid var(--gold);border-radius:2px;justify-content:center;align-items:center;width:64px;height:64px;font-size:24px;display:flex}.dialogue-content{flex-direction:column;flex:1;gap:8px;display:flex}.dialogue-speaker-tab{background:var(--bg-panel);border:var(--panel-border);border-radius:var(--panel-radius) var(--panel-radius) 0 0;color:var(--gold);text-transform:uppercase;letter-spacing:1px;border-bottom:none;padding:4px 16px;font-size:9px;position:absolute;top:-14px;left:20px}.dialogue-text{color:var(--text);min-height:48px;font-size:10px;line-height:1.8}.dialogue-continue{color:var(--text-dim);text-align:right;font-size:7px;animation:1.5s ease-in-out infinite pulse}.prophetic-box{border:2px solid var(--gold-light);border-radius:var(--panel-radius);text-align:center;background:linear-gradient(#2a1f14f2 0%,#1a1a2ef2 100%);padding:24px 32px;position:relative;box-shadow:0 0 30px #f0c04033,inset 0 0 30px #0006}.prophetic-box:before,.prophetic-box:after{content:"✦";color:var(--gold-light);font-size:12px;animation:2s ease-in-out infinite glow;position:absolute}.prophetic-box:before{top:8px;left:16px}.prophetic-box:after{bottom:8px;right:16px}.prophetic-text{color:var(--gold-light);text-shadow:0 0 8px #f0c0404d;font-size:11px;line-height:2}.prophetic-attribution{color:var(--gold);margin-top:12px;font-size:8px;font-style:italic}.narration-overlay{z-index:90;background:#0a0a1ae0;justify-content:center;align-items:center;animation:.5s forwards fade-in;display:flex;position:fixed;inset:0}.narration-text{max-width:600px;color:var(--text);text-align:center;opacity:.9;padding:40px;font-size:11px;font-style:italic;line-height:2.2}.narration-continue{color:var(--text-dim);font-size:7px;animation:1.5s ease-in-out infinite pulse;position:absolute;bottom:60px;left:50%;transform:translate(-50%)}.response-choices{flex-direction:column;gap:6px;margin-top:8px;display:flex}.response-choice{color:var(--text);font-family:var(--font-pixel);cursor:pointer;transition:all var(--transition-fast);text-align:left;background:0 0;border:1px solid #d4a0174d;border-radius:2px;align-items:center;gap:8px;width:100%;padding:8px 12px;font-size:9px;display:flex}.response-choice:hover{border-color:var(--gold);color:var(--gold-light);background:#d4a0171a;padding-left:18px}.response-choice-marker{color:var(--gold);flex-shrink:0;font-size:8px}.title-screen{background:var(--bg-dark);z-index:200;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0;overflow:hidden}.title-star-field{position:absolute;inset:0;overflow:hidden}.title-star{background:var(--text);width:2px;height:2px;animation:pulse var(--star-duration,3s) ease-in-out infinite;animation-delay:var(--star-delay,0s);opacity:var(--star-opacity,.6);border-radius:50%;position:absolute}.title-content{z-index:1;flex-direction:column;align-items:center;gap:8px;display:flex;position:relative}.title-logo{text-align:center;margin-bottom:24px}.title-main{color:var(--gold);text-shadow:0 0 20px #d4a01766,0 0 40px #d4a01733;letter-spacing:2px;font-size:20px;animation:3s ease-in-out infinite glow}.title-arabic{font-family:var(--font-arabic);color:var(--gold-light);text-shadow:0 0 20px #f0c0404d;direction:rtl;margin-top:8px;font-size:28px}.title-subtitle{color:var(--text-dim);text-transform:uppercase;letter-spacing:4px;margin-top:16px;font-size:8px}.title-menu{flex-direction:column;gap:12px;min-width:220px;margin-top:40px;display:flex}.title-lang-toggle{z-index:1;position:absolute;top:20px;right:20px}.settings-screen{z-index:200;background:#0a0a1af2;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.settings-panel{background:var(--bg-panel);border:var(--panel-border);border-radius:var(--panel-radius);width:min(90vw,480px);box-shadow:var(--panel-shadow)}.settings-header{border-bottom:1px solid #d4a0174d;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.settings-title{color:var(--gold);text-transform:uppercase;letter-spacing:2px;font-size:12px}.settings-body{flex-direction:column;gap:20px;padding:20px;display:flex}.settings-section{flex-direction:column;gap:12px;display:flex}.settings-section-title{color:var(--gold);text-transform:uppercase;letter-spacing:1px;border-bottom:1px solid #d4a01726;padding-bottom:6px;font-size:8px}.settings-footer{border-top:1px solid #d4a0174d;justify-content:center;padding:16px 20px;display:flex}.volume-control{align-items:center;gap:12px;display:flex}.volume-label{color:var(--text-dim);min-width:80px;font-size:8px}.volume-slider{appearance:none;background:var(--bg-dark);cursor:pointer;border:1px solid #d4a0174d;border-radius:3px;outline:none;flex:1;height:6px}.volume-slider::-webkit-slider-thumb{appearance:none;background:var(--gold);border:2px solid var(--gold-light);cursor:pointer;width:14px;height:14px;transition:all var(--transition-fast);border-radius:2px}.volume-slider::-webkit-slider-thumb:hover{background:var(--gold-light);box-shadow:0 0 8px #f0c04066}.volume-slider::-moz-range-thumb{background:var(--gold);border:2px solid var(--gold-light);cursor:pointer;border-radius:2px;width:14px;height:14px}.volume-value{color:var(--text-dim);text-align:right;min-width:30px;font-size:8px}.language-toggle{border:1px solid var(--gold);border-radius:var(--panel-radius);display:flex;overflow:hidden}.language-toggle-btn{color:var(--text-dim);font-family:var(--font-pixel);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;padding:6px 14px;font-size:9px}.language-toggle-btn.active{background:var(--gold);color:var(--bg-dark)}.language-toggle-btn:hover:not(.active){color:var(--gold);background:#d4a01726}.toggle-row{justify-content:space-between;align-items:center;display:flex}.toggle-label{color:var(--text-dim);font-size:8px}.toggle-switch{background:var(--bg-dark);border:1px solid var(--text-dim);cursor:pointer;width:36px;height:18px;transition:all var(--transition-fast);border-radius:2px;position:relative}.toggle-switch.on{border-color:var(--gold);background:#d4a0174d}.toggle-switch-knob{background:var(--text-dim);width:12px;height:12px;transition:all var(--transition-fast);border-radius:1px;position:absolute;top:2px;left:2px}.toggle-switch.on .toggle-switch-knob{background:var(--gold);left:20px}.inventory-content{gap:16px;min-height:300px;display:flex}.item-grid{flex:1;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));align-content:start;gap:8px;display:grid}.item-card{cursor:pointer;transition:all var(--transition-fast);background:#0000004d;border:1px solid #d4a01726;border-radius:2px;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;display:flex;position:relative}.item-card:hover{border-color:var(--gold);background:#d4a0171a;transform:translateY(-2px)}.item-card.selected{border-color:var(--gold-light);background:#d4a01726;box-shadow:0 0 8px #d4a01733}.item-card-icon{font-size:24px;line-height:1}.item-card-name{color:var(--text-dim);text-align:center;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:6px;overflow:hidden}.item-card-quantity{color:var(--gold);background:#0a0a1acc;border-radius:2px;padding:1px 4px;font-size:7px;position:absolute;top:4px;right:4px}.item-detail{background:#0000004d;border:1px solid #d4a01733;border-radius:2px;flex-direction:column;gap:12px;width:200px;padding:16px;display:flex}.item-detail-icon{text-align:center;font-size:36px}.item-detail-name{color:var(--gold);text-align:center;font-size:10px}.item-detail-category{color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;text-align:center;font-size:7px}.item-detail-description{color:var(--text);font-size:8px;line-height:1.6}.item-detail-empty{height:100%;color:var(--text-dim);justify-content:center;align-items:center;font-size:8px;font-style:italic;display:flex}.codex-layout{gap:0;height:360px;min-height:360px;display:flex}.codex-tabs{border-right:1px solid #d4a01733;flex-direction:column;flex-shrink:0;gap:2px;width:120px;padding-right:8px;display:flex}.codex-tab{color:var(--text-dim);font-family:var(--font-pixel);cursor:pointer;transition:all var(--transition-fast);text-align:left;text-transform:uppercase;background:0 0;border:none;border-radius:2px;padding:10px 12px;font-size:8px}.codex-tab:hover{color:var(--text);background:#d4a01714}.codex-tab.active{color:var(--gold);border-left:2px solid var(--gold);background:#d4a01726}.codex-entries{border-right:1px solid #d4a01733;flex-direction:column;flex-shrink:0;gap:2px;width:180px;padding:0 8px;display:flex;overflow-y:auto}.codex-entry-item{color:var(--text-dim);font-family:var(--font-pixel);cursor:pointer;transition:all var(--transition-fast);text-align:left;background:0 0;border:none;border-radius:2px;padding:8px 10px;font-size:7px}.codex-entry-item:hover{color:var(--text);background:#d4a01714}.codex-entry-item.active{color:var(--gold-light);background:#d4a0171f}.codex-entry-item.locked{color:var(--text-dim);opacity:.5;font-style:italic}.codex-detail{flex:1;padding:0 16px;overflow-y:auto}.codex-detail-title{color:var(--gold);border-bottom:1px solid #d4a01733;margin-bottom:12px;padding-bottom:8px;font-size:11px}.codex-detail-content{color:var(--text);max-height:380px;font-size:9px;line-height:2;overflow-y:auto}.codex-paragraph{margin:0 0 12px}.codex-paragraph:last-child{margin-bottom:0}.codex-verse-quote{border-left:2px solid var(--gold);color:var(--gold-light);background:#d4a01714;margin:12px 0;padding:10px 16px;font-style:italic;line-height:2.2}.rtl .codex-verse-quote{border-left:none;border-right:2px solid var(--gold)}.codex-verse-ref{color:var(--text-dim);letter-spacing:.5px;margin:4px 0 16px;font-size:8px}.codex-locked{flex-direction:column;justify-content:center;align-items:center;gap:12px;height:100%;display:flex}.codex-locked-icon{opacity:.3;font-size:32px}.codex-locked-text{color:var(--text-dim);font-size:8px;font-style:italic}.codex-empty{height:100%;color:var(--text-dim);justify-content:center;align-items:center;font-size:8px;display:flex}.codex-unlock-container{z-index:90;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;top:48px;right:16px}.codex-unlock-notification{border:1px solid var(--gold);border-radius:var(--panel-radius);background:linear-gradient(135deg,#1e140af2,#32230ff2);align-items:center;gap:12px;min-width:220px;max-width:320px;padding:12px 18px;animation:.5s cubic-bezier(.34,1.56,.64,1) forwards codex-unlock-slide-in;display:flex;box-shadow:0 0 16px #d4a01766,0 0 32px #d4a01726}.codex-unlock-icon{background:linear-gradient(135deg, var(--gold), var(--gold-light));width:32px;height:32px;color:var(--bg-dark);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;font-weight:700;animation:2s ease-in-out infinite codex-unlock-glow;display:flex}.codex-unlock-text{flex-direction:column;gap:2px;min-width:0;display:flex}.codex-unlock-label{color:var(--gold);text-transform:uppercase;letter-spacing:1.5px;font-size:7px}.codex-unlock-title{color:var(--gold-light);white-space:nowrap;text-overflow:ellipsis;font-size:9px;overflow:hidden}.codex-unlock-category{color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;font-size:7px}@keyframes codex-unlock-slide-in{0%{opacity:0;transform:translate(100px)}to{opacity:1;transform:translate(0)}}@keyframes codex-unlock-glow{0%,to{box-shadow:0 0 4px #d4a01766}50%{box-shadow:0 0 12px #d4a017cc,0 0 24px #d4a0174d}}.quest-log-content{flex-direction:column;gap:12px;min-height:300px;display:flex}.quest-log-section-title{color:var(--gold);text-transform:uppercase;letter-spacing:1px;border-bottom:1px solid #d4a01726;padding-bottom:6px;font-size:8px}.quest-card{transition:all var(--transition-fast);background:#0000004d;border:1px solid #d4a01726;border-radius:2px;flex-direction:column;gap:8px;padding:12px 16px;display:flex}.quest-card:hover{border-color:#d4a0174d}.quest-card-header{justify-content:space-between;align-items:center;display:flex}.quest-card-name{color:var(--text);font-size:9px}.quest-card-badge{text-transform:uppercase;letter-spacing:1px;border-radius:2px;padding:2px 8px;font-size:6px}.quest-card-badge.active{color:var(--gold);border:1px solid var(--gold);background:#d4a01733}.quest-card-badge.completed{color:#5a9a50;border:1px solid var(--green);background:#2d5a274d}.quest-card-description{color:var(--text-dim);font-size:7px;line-height:1.6}.objective-list{flex-direction:column;gap:6px;display:flex}.objective-item{color:var(--text-dim);align-items:flex-start;gap:8px;font-size:7px;display:flex}.objective-marker{border:1px solid var(--gold);border-radius:1px;flex-shrink:0;justify-content:center;align-items:center;width:10px;height:10px;margin-top:1px;font-size:7px;display:flex}.objective-marker.completed{background:var(--gold);color:var(--bg-dark)}.objective-text{line-height:1.4}.objective-text.completed{opacity:.5;text-decoration:line-through}.quest-log-empty{height:200px;color:var(--text-dim);justify-content:center;align-items:center;font-size:9px;font-style:italic;display:flex}.character-content{flex-direction:column;gap:20px;min-height:300px;display:flex}.character-info{background:#0000004d;border:1px solid #d4a01726;border-radius:2px;align-items:center;gap:16px;padding:16px;display:flex}.character-avatar{background:var(--bg-parchment);border:2px solid var(--gold);border-radius:2px;justify-content:center;align-items:center;width:64px;height:64px;font-size:28px;display:flex}.character-details{flex-direction:column;gap:4px;display:flex}.character-name{color:var(--gold);font-size:11px}.character-role{color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;font-size:8px}.character-era{color:var(--text-dim);font-size:7px}.character-section-title{color:var(--gold);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;font-size:8px}.moral-traits{flex-direction:column;gap:10px;display:flex}.moral-trait-row{align-items:center;gap:10px;display:flex}.moral-trait-label{color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;min-width:90px;font-size:7px}.moral-trait-bar{background:var(--bg-dark);border:1px solid #d4a01733;border-radius:1px;flex:1;height:10px;position:relative;overflow:hidden}.moral-trait-fill{border-radius:1px;height:100%;transition:width .5s;position:relative}.moral-trait-fill:after{content:"";background:linear-gradient(#ffffff26 0%,#0000 50%);position:absolute;inset:0}.moral-trait-value{color:var(--text-dim);text-align:right;min-width:24px;font-size:7px}.faith-meter{flex-direction:column;gap:8px;display:flex}.faith-meter-bar-wrapper{align-items:center;gap:10px;display:flex}.faith-meter-bar{background:var(--bg-dark);border:2px solid #d4a0174d;border-radius:2px;flex:1;height:16px;position:relative;overflow:hidden}.faith-meter-fill{background:linear-gradient(90deg, var(--blue), var(--gold), var(--gold-light));border-radius:1px;height:100%;transition:width .5s;position:relative}.faith-meter-fill:after{content:"";background:linear-gradient(#ffffff26 0%,#0000 50%);position:absolute;inset:0}.faith-meter-value{color:var(--gold);text-align:right;min-width:32px;font-size:10px}.faith-meter-label{color:var(--text-dim);text-align:center;text-transform:uppercase;letter-spacing:1px;font-size:7px}.geo-map-panel-content{flex-direction:column;gap:16px;min-height:400px;display:flex}.geo-map-canvas{background:var(--bg-parchment);border:2px solid #d4a0174d;border-radius:2px;flex:1;justify-content:center;align-items:center;min-height:300px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 40px #00000080}.geo-map-title{color:#d4a01766;text-transform:uppercase;letter-spacing:3px;font-size:14px}.geo-map-annotation{color:#d4a01759;letter-spacing:1px;pointer-events:none;font-size:7px;position:absolute}.geo-map-current-marker{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.geo-map-sidebar{flex-direction:column;gap:8px;display:flex}.location-history{flex-direction:column;gap:4px;display:flex}.location-history-title{color:var(--gold);text-transform:uppercase;letter-spacing:1px;margin-bottom:4px;font-size:8px}.location-history-item{color:var(--text-dim);align-items:center;gap:8px;padding:4px 8px;font-size:7px;display:flex}.location-history-dot{background:var(--gold);opacity:.5;border-radius:50%;flex-shrink:0;width:4px;height:4px}.location-history-item:first-child .location-history-dot{opacity:1;animation:2s ease-in-out infinite pulse}.tooltip-wrapper{display:inline-flex;position:relative}.tooltip-content{background:var(--bg-dark);border:1px solid var(--gold);color:var(--text);white-space:nowrap;pointer-events:none;z-index:300;border-radius:2px;padding:6px 12px;font-size:8px;animation:.1s forwards fade-in;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.tooltip-content:after{content:"";border:4px solid #0000;border-top-color:var(--gold);position:absolute;top:100%;left:50%;transform:translate(-50%)}.transition-overlay{z-index:500;background:var(--bg-dark);animation:.5s forwards fade-in;position:fixed;inset:0}.transition-overlay.out{animation:.5s forwards fade-out}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes float-up{0%{opacity:1;transform:translate(-50%,-50%)}70%{opacity:1}to{opacity:0;transform:translate(-50%,calc(-50% - 60px))}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes glow{0%,to{text-shadow:0 0 10px #d4a0174d,0 0 20px #d4a01726}50%{text-shadow:0 0 20px #d4a01780,0 0 40px #d4a01740}}@keyframes typewriter{0%{width:0}to{width:100%}}.site-layout{flex-direction:column;min-height:100vh;display:flex}.site-main{flex:1}.site-header{z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0a0a1af2;border-bottom:1px solid #d4a01733;position:sticky;top:0}.site-header-inner{justify-content:space-between;align-items:center;gap:24px;max-width:1100px;margin:0 auto;padding:12px 24px;display:flex}.site-header-logo{text-decoration:none}.site-header-logo-text{font-family:var(--font-pixel);color:var(--gold);letter-spacing:1px;font-size:12px}.site-header-nav{gap:24px;display:flex}.site-header-link{color:var(--text-dim);font-family:var(--font-pixel);text-transform:uppercase;letter-spacing:1px;transition:color var(--transition-fast);border-bottom:2px solid #0000;padding:6px 0;font-size:8px;text-decoration:none}.site-header-link:hover{color:var(--text)}.site-header-link.active{color:var(--gold);border-bottom-color:var(--gold)}.site-header-actions{align-items:center;gap:12px;display:flex}.site-header-github{color:var(--text-dim);font-family:var(--font-pixel);transition:all var(--transition-fast);border:1px solid #d4a0174d;border-radius:2px;padding:4px 10px;font-size:9px;text-decoration:none}.site-header-github:hover{color:var(--gold);border-color:var(--gold)}.landing{overflow-x:hidden}.landing-hero{text-align:center;justify-content:center;align-items:center;min-height:70vh;padding:80px 24px;display:flex;position:relative}.landing-hero-bg{background:radial-gradient(ellipse at center, #d4a0170f 0%, transparent 70%), linear-gradient(180deg, var(--bg-dark) 0%, #2a1f144d 100%);pointer-events:none;position:absolute;inset:0}.landing-hero-content{z-index:1;flex-direction:column;align-items:center;gap:16px;display:flex;position:relative}.landing-hero-title{font-family:var(--font-pixel);color:var(--gold);text-shadow:0 0 30px #d4a01766,0 0 60px #d4a01726;letter-spacing:3px;font-size:32px;animation:3s ease-in-out infinite glow}.landing-hero-title-ar{font-family:var(--font-arabic);color:var(--gold-light);text-shadow:0 0 20px #f0c0404d;direction:rtl;font-size:36px}.landing-hero-subtitle{color:var(--text-dim);max-width:500px;font-size:11px;line-height:2}.landing-hero-ctas{gap:16px;margin-top:24px;display:flex}.landing-section{padding:64px 24px}.landing-section-dark{background:#0003}.landing-container{max-width:1000px;margin:0 auto}.landing-section-title{font-family:var(--font-pixel);color:var(--gold);text-align:center;letter-spacing:2px;margin-bottom:32px;font-size:16px}.landing-about-text{text-align:center;max-width:700px;margin:0 auto 32px}.landing-about-text p{color:var(--text);margin-bottom:16px;font-size:9px;line-height:2}.landing-features-mini{flex-wrap:wrap;justify-content:center;gap:24px;display:flex}.landing-feature-mini{color:var(--text-dim);align-items:center;gap:8px;font-size:8px;display:flex}.landing-feature-icon{font-size:16px;font-style:normal}.landing-eras{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;display:grid}.landing-era-card{background:var(--bg-panel);border-radius:var(--panel-radius);transition:all var(--transition-normal);border:1px solid #d4a01733;flex-direction:column;gap:12px;padding:24px;display:flex}.landing-era-card:hover{border-color:var(--gold);box-shadow:0 0 20px #d4a0171a}.landing-era-card-locked{opacity:.4;pointer-events:none}.landing-era-card-header{flex-direction:column;gap:4px;display:flex}.landing-era-card-name{color:var(--gold);font-size:11px}.landing-era-card-period{color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;font-size:7px}.landing-era-card-desc{color:var(--text);font-size:8px;line-height:1.8}.landing-era-card-desc-locked{font-style:italic}.landing-era-card-meta{color:var(--text-dim);gap:16px;font-size:7px;display:flex}.landing-era-card-themes{flex-wrap:wrap;gap:6px;display:flex}.landing-era-card-theme{color:var(--text-dim);background:#d4a01714;border:1px solid #d4a01726;border-radius:2px;padding:3px 8px;font-size:6px}.landing-era-card-btn{align-self:flex-start;margin-top:auto}.landing-features-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;display:grid}.landing-feature-card{border-radius:var(--panel-radius);text-align:center;transition:all var(--transition-normal);background:#0003;border:1px solid #d4a0171a;padding:24px}.landing-feature-card:hover{background:#d4a01708;border-color:#d4a0174d}.landing-feature-card-icon{margin-bottom:12px;font-size:28px;display:block}.landing-feature-card-title{color:var(--gold);margin-bottom:8px;font-size:9px}.landing-feature-card-desc{color:var(--text-dim);font-size:7px;line-height:1.6}.landing-opensource{text-align:center}.landing-opensource-text{color:var(--text);max-width:600px;margin:0 auto 24px;font-size:9px;line-height:2}.landing-tech-stack{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.landing-tech-badge{color:var(--gold);background:#d4a01714;border:1px solid #d4a01733;border-radius:2px;padding:6px 14px;font-size:8px}.landing-footer{text-align:center;border-top:1px solid #d4a0171a;padding:32px 24px}.landing-footer-text{color:var(--text-dim);margin-bottom:12px;font-size:8px;font-style:italic}.landing-footer-links{justify-content:center;gap:12px;font-size:7px;display:flex}.landing-footer-links a{color:var(--gold);transition:color var(--transition-fast);text-decoration:none}.landing-footer-links a:hover{color:var(--gold-light)}.landing-footer-sep{color:var(--text-dim)}.story-reader{min-height:calc(100vh - 52px);display:flex}.story-sidebar{background:#00000026;border-right:1px solid #d4a01726;flex-shrink:0;width:240px;max-height:calc(100vh - 52px);padding:20px 16px;position:sticky;top:52px;overflow-y:auto}.story-sidebar-title{color:var(--gold);text-transform:uppercase;letter-spacing:1px;border-bottom:1px solid #d4a01726;margin-bottom:16px;padding-bottom:8px;font-size:8px}.story-sidebar-era{margin-bottom:12px}.story-sidebar-era-name{color:var(--text);transition:all var(--transition-fast);border-radius:2px;padding:8px 10px;font-size:9px;text-decoration:none;display:block}.story-sidebar-era-name:hover{color:var(--gold);background:#d4a01714}.story-sidebar-era-name.active{color:var(--gold);background:#d4a0171a}.story-sidebar-chapters{flex-direction:column;gap:2px;margin-top:4px;padding-left:12px;display:flex}.story-sidebar-chapter{color:var(--text-dim);transition:all var(--transition-fast);border-left:2px solid #0000;border-radius:2px;padding:6px 10px;font-size:7px;text-decoration:none;display:block}.story-sidebar-chapter:hover{color:var(--text);background:#d4a0170d}.story-sidebar-chapter.active{color:var(--gold);border-left-color:var(--gold);background:#d4a01714}.story-content{flex:1;max-width:800px;padding:32px;position:relative}.story-era-index{padding:20px 0}.story-era-index-title{color:var(--text);margin-bottom:32px;font-size:12px}.story-era-cards{flex-direction:column;gap:20px;display:flex}.story-era-card{background:var(--bg-panel);border-radius:var(--panel-radius);transition:all var(--transition-normal);border:1px solid #d4a01733;padding:24px;text-decoration:none;display:block}.story-era-card:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:0 0 16px #d4a0171a}.story-era-card h3{color:var(--gold);margin-bottom:6px;font-size:12px}.story-era-card-period{color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;font-size:7px;display:block}.story-era-card-desc{color:var(--text);margin-bottom:12px;font-size:8px;line-height:1.8}.story-era-card-chapters{color:var(--gold);font-size:7px}.story-chapter-list{padding:20px 0}.story-chapter-list-header{margin-bottom:32px}.story-chapter-list-header h2{color:var(--gold);margin-bottom:12px;font-size:16px}.story-chapter-list-desc{color:var(--text);margin-bottom:16px;font-size:8px;line-height:1.8}.story-chapter-list-meta{color:var(--text-dim);gap:16px;font-size:7px;display:flex}.story-chapter-cards{flex-direction:column;gap:16px;display:flex}.story-chapter-card{border-radius:var(--panel-radius);transition:all var(--transition-normal);background:#0003;border:1px solid #d4a01726;padding:20px;text-decoration:none;display:block}.story-chapter-card:hover{border-color:var(--gold);background:#d4a01708;transform:translateY(-1px)}.story-chapter-card-num{color:var(--gold);text-transform:uppercase;letter-spacing:1px;font-size:7px}.story-chapter-card h3{color:var(--text);margin:8px 0;font-size:10px}.story-chapter-card p{color:var(--text-dim);font-size:8px;line-height:1.8}.story-chapter-card-duration{color:var(--text-dim);border:1px solid #d4a01726;border-radius:2px;margin-top:8px;padding:2px 8px;font-size:7px;display:inline-block}.story-chapter-header{border-bottom:1px solid #d4a01726;margin-bottom:32px;padding-bottom:20px}.story-chapter-era-label{color:var(--gold);text-transform:uppercase;letter-spacing:1px;font-size:7px}.story-chapter-title{color:var(--text);margin-top:8px;font-size:16px}.story-chapter-duration{color:var(--text-dim);margin-top:8px;font-size:7px;display:inline-block}.story-segments{flex-direction:column;gap:20px;display:flex}.story-chapter-intro{border-left:3px solid var(--gold);border-radius:0 var(--panel-radius) var(--panel-radius) 0;background:#2a1f144d;padding:24px}.rtl .story-chapter-intro{border-left:none;border-right:3px solid var(--gold);border-radius:var(--panel-radius) 0 0 var(--panel-radius)}.story-chapter-intro p{color:var(--text);font-size:9px;font-style:italic;line-height:2}.story-dialogue-block{border-radius:var(--panel-radius);background:#1a1a2e80;border:1px solid #d4a0171a;padding:16px 20px}.story-dialogue-player{background:#2d5a2726;border-color:#2d5a274d;margin-left:32px}.rtl .story-dialogue-player{margin-left:0;margin-right:32px}.story-dialogue-speaker{color:var(--gold);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;font-size:8px;display:block}.story-dialogue-text{color:var(--text);font-size:9px;line-height:2}.story-dialogue-text p{margin-bottom:8px}.story-dialogue-text p:last-child{margin-bottom:0}.story-verse-quote{border-left:2px solid var(--gold);color:var(--gold-light);background:#d4a01714;margin:12px 0;padding:12px 16px;font-style:italic;line-height:2.2}.rtl .story-verse-quote{border-left:none;border-right:2px solid var(--gold)}.story-knowledge-block{border:1px solid var(--gold);border-radius:var(--panel-radius);background:linear-gradient(135deg,#1e140a99,#32230f66);padding:20px;box-shadow:0 0 12px #d4a0171a}.story-knowledge-header{align-items:center;gap:8px;margin-bottom:12px;display:flex}.story-knowledge-icon{font-size:16px}.story-knowledge-label{color:var(--gold);text-transform:uppercase;letter-spacing:1px;font-size:7px}.story-knowledge-title{color:var(--gold-light);margin-bottom:10px;font-size:10px}.story-knowledge-content{color:var(--text);font-size:8px;line-height:2}.story-knowledge-content p{margin-bottom:8px}.story-chapter-nav{border-top:1px solid #d4a01726;justify-content:space-between;align-items:center;margin-top:48px;padding-top:24px;display:flex}.story-empty{text-align:center;color:var(--text-dim);padding:48px 24px;font-size:10px;font-style:italic}.story-play-fab{background:linear-gradient(180deg, var(--gold) 0%, #b8860b 100%);border:2px solid var(--gold-light);border-radius:var(--panel-radius);color:var(--bg-dark);font-family:var(--font-pixel);text-transform:uppercase;letter-spacing:1px;transition:all var(--transition-fast);z-index:50;padding:12px 20px;font-size:9px;font-weight:700;text-decoration:none;position:fixed;bottom:24px;right:24px;box-shadow:0 0 20px #d4a0174d}.story-play-fab:hover{background:linear-gradient(180deg, var(--gold-light) 0%, var(--gold) 100%);transform:translateY(-2px);box-shadow:0 0 30px #f0c04080}@media (width<=768px){.site-header-inner{padding:10px 16px}.site-header-nav{gap:12px}.site-header-link{font-size:7px}.landing-hero-title{font-size:20px}.landing-hero-title-ar{font-size:24px}.landing-hero-ctas{flex-direction:column;align-items:center}.story-reader{flex-direction:column}.story-sidebar{border-bottom:1px solid #d4a01726;border-right:none;width:100%;max-height:none;padding:12px 16px;position:static}.story-sidebar-chapters{flex-flow:wrap;padding-left:0}.story-content{padding:20px 16px}.story-dialogue-player{margin-left:16px}.rtl .story-dialogue-player{margin-left:0;margin-right:16px}.landing-eras,.landing-features-grid{grid-template-columns:1fr}}