:root{--bg-primary:#0a0a0f;--bg-secondary:#12121a;--bg-elevated:#1a1a2e;--bg-panel:#0d0d15;--text-primary:#e8e6e3;--text-secondary:#9a9a9a;--text-muted:#5a5a6a;--gold:#d4a847;--gold-dim:#9a7a30;--gold-glow:#d4a8474d;--dynasty-rashidun:#40916c;--dynasty-sufyanid:#d4a017;--dynasty-zubayyid:#9b72cf;--dynasty-marwanid:#e07b39;--dynasty-abbasid:#5b8bd4;--death-natural:#4caf50;--death-assassinated:#ff1744;--death-poisoned:#a0f;--death-battle:#ff6d00;--death-abdicated:#ffd600;--kill-line:#ff1744;--font-display:"Amiri", serif;--font-body:"Cairo", sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;font-family:var(--font-body);background:var(--bg-primary);color:var(--text-primary);direction:rtl;overflow:hidden}#loading-screen{z-index:9999;background:var(--bg-primary);justify-content:center;align-items:center;transition:opacity .8s,visibility .8s;display:flex;position:fixed;inset:0}#loading-screen.hidden{opacity:0;visibility:hidden;pointer-events:none}.loading-content{text-align:center}.loading-ornament{color:var(--gold);opacity:.5;margin-bottom:.8rem;font-size:2rem;animation:1s fadeInUp}.loading-title{font-family:var(--font-display);color:var(--gold);margin-bottom:.3rem;font-size:3.5rem;animation:1s fadeInUp}.loading-subtitle{font-family:var(--font-display);color:var(--text-secondary);margin-bottom:.3rem;font-size:1.5rem;animation:1s .2s both fadeInUp}.loading-range{font-family:var(--font-body);color:var(--text-muted);margin-bottom:2rem;font-size:.85rem;animation:1s .4s both fadeInUp}.loading-spinner{border:3px solid var(--bg-elevated);border-top-color:var(--gold);border-radius:50%;width:40px;height:40px;margin:0 auto;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}#app-header{z-index:100;background:linear-gradient(180deg, var(--bg-primary) 60%, transparent 100%);pointer-events:none;padding:14px 24px;position:fixed;top:0;left:0;right:0}.header-inner{text-align:center;pointer-events:auto;max-width:900px;margin:0 auto}.header-title{font-family:var(--font-display);color:var(--gold);font-size:2.2rem;font-weight:700}.header-subtitle{color:var(--text-muted);margin-bottom:10px;font-size:.75rem}#dynasty-filters{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}#dynasty-filters button{font-family:var(--font-body);border:1px solid var(--text-muted);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:20px;padding:5px 16px;font-size:.72rem;transition:all .3s}#dynasty-filters button:hover{border-color:var(--gold);color:var(--gold)}#dynasty-filters button.active{background:var(--gold);color:var(--bg-primary);border-color:var(--gold);font-weight:600}#controls{z-index:100;background:var(--bg-elevated);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #ffffff0f;border-radius:12px;flex-direction:column;gap:6px;padding:8px;display:flex;position:fixed;bottom:60px;right:24px}#controls button{width:40px;height:40px;color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;font-size:1.2rem;transition:all .2s;display:flex}#controls button:hover{color:var(--gold);background:#ffffff14}#controls button.active{color:var(--kill-line);background:#ff174426}.control-divider{background:#ffffff0f;height:1px;margin:2px 4px}#legend{z-index:100;background:var(--bg-elevated);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #ffffff0f;border-radius:12px;min-width:160px;padding:14px 18px;font-size:.72rem;position:fixed;bottom:60px;left:24px}.legend-title{color:var(--gold);margin-bottom:8px;font-size:.8rem;font-weight:700}.legend-item{color:var(--text-secondary);align-items:center;gap:8px;margin-bottom:4px;display:flex}.legend-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px}.legend-icon{text-align:center;width:10px;color:var(--death-natural);flex-shrink:0;font-size:.8rem}.legend-divider{background:#ffffff0f;height:1px;margin:8px 0}#app-footer{z-index:100;background:linear-gradient(0deg, var(--bg-primary) 60%, transparent 100%);pointer-events:none;padding:10px 24px;position:fixed;bottom:0;left:0;right:0}.footer-inner{text-align:center;max-width:900px;color:var(--text-muted);pointer-events:auto;margin:0 auto;font-size:.68rem}.footer-source strong{color:var(--gold-dim)}.footer-divider{opacity:.4;margin:0 8px}.footer-hint{opacity:.6}.html-node{will-change:transform;box-shadow:0 4px 20px #0000004d}.html-node:hover{z-index:10!important}@media (width<=768px){.header-title{font-size:1.4rem}.header-subtitle{font-size:.65rem}#dynasty-filters button{padding:3px 10px;font-size:.62rem}#legend{display:none}#controls{padding:5px;bottom:50px;right:10px}#controls button{width:34px;height:34px;font-size:1rem}#app-footer .footer-inner{font-size:.55rem}.footer-hint,.footer-divider{display:none}#detail-panel{width:100%;max-width:100vw}}@media (width<=480px){.header-title{font-size:1.2rem}#dynasty-filters{gap:5px}#dynasty-filters button{padding:2px 8px;font-size:.58rem}#app-header{padding:8px 12px}}@media (width>=769px) and (width<=1024px){.header-title{font-size:1.8rem}#legend{min-width:130px;padding:10px 14px;font-size:.65rem}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--text-muted);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--gold-dim)}#graph-container{background:var(--bg-primary);background-image:radial-gradient(circle at 20% 20%,#2d6a4f0a 0%,#0000 50%),radial-gradient(circle at 80% 80%,#1a237e0a 0%,#0000 50%);width:100%;height:100%;position:absolute;inset:0}#graph-container svg{display:block}.node{transition:opacity .4s}.node-bg{transition:rx .2s,ry .2s,stroke-width .2s,stroke .2s}.succession-link{transition:opacity .4s}.flowing-edge{animation:3s linear infinite flowDots}@keyframes flowDots{0%{stroke-dashoffset:0}to{stroke-dashoffset:-48px}}#detail-panel{z-index:200;background:var(--bg-panel);border-left:1px solid #d4a84726;width:420px;max-width:90vw;height:100%;padding:0;transition:transform .4s cubic-bezier(.16,1,.3,1);position:fixed;top:0;right:0;overflow-y:auto;transform:translate(100%);box-shadow:-10px 0 40px #00000080}#detail-panel.panel-open{transform:translate(0)}#panel-close{float:right;background:var(--bg-elevated);width:36px;height:36px;color:var(--text-secondary);cursor:pointer;z-index:10;border:none;border-radius:50%;justify-content:center;align-items:center;margin:12px;font-size:1.4rem;transition:all .2s;display:flex;position:sticky;top:0}#panel-close:hover{color:var(--kill-line);background:#ff174433}#panel-content{padding:24px}.panel-header{text-align:center;border-bottom:1px solid #ffffff0f;margin-bottom:20px;padding-bottom:20px}.panel-number{border-radius:50%;width:32px;height:32px;margin-bottom:8px;font-size:.85rem;font-weight:700;line-height:32px;display:inline-block}.panel-name-ar{font-family:var(--font-display);color:var(--gold);margin-bottom:4px;font-size:1.8rem;line-height:1.4}.panel-name-en{color:var(--text-muted);font-size:.85rem;font-style:italic}.panel-dynasty-badge{border-radius:12px;margin-top:10px;padding:3px 14px;font-size:.7rem;font-weight:600;display:inline-block}.panel-section{margin-bottom:20px}.panel-section-title{font-family:var(--font-display);color:var(--gold);border-bottom:1px solid var(--gold-glow);margin-bottom:8px;padding-bottom:4px;font-size:1rem}.panel-section p,.panel-section li{color:var(--text-secondary);margin-bottom:4px;font-size:.85rem;line-height:1.7}.panel-section ul{padding:0;list-style:none}.panel-section li:before{content:"◆";color:var(--gold-dim);vertical-align:middle;margin-left:8px;font-size:.5rem}.death-box{border:1px solid;border-radius:10px;margin-top:8px;padding:14px}.death-box.assassinated{background:#ff17440f;border-color:#ff174433}.death-box.natural{background:#4caf500f;border-color:#4caf5026}.death-box.poisoned{background:#aa00ff0f;border-color:#aa00ff26}.death-box.battle{background:#ff6d000f;border-color:#ff6d0026}.death-box.abdicated{background:#ffd6000f;border-color:#ffd60026}.death-symbol{margin-bottom:6px;font-size:1.5rem}.death-label{margin-bottom:4px;font-size:.85rem;font-weight:700}.death-detail{color:var(--text-secondary);font-size:.8rem;line-height:1.6}.killer-name{color:var(--kill-line);font-weight:700}.killing-entry{background:var(--bg-elevated);border-right:3px solid var(--kill-line);border-radius:8px;margin-bottom:6px;padding:10px 12px;font-size:.78rem}.killing-entry .victim{color:var(--text-primary);font-weight:600}.killing-entry .method{color:var(--text-muted);font-size:.72rem}
