*,::after,::before{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}:root{--accent:#f59e0b;--accent-glow:rgba(245, 158, 11, 0.35);--panel-bg:rgba(10, 15, 30, 0.88);--panel-border:rgba(255, 255, 255, 0.08);--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-muted:#64748b;--surface:rgba(255, 255, 255, 0.06);--surface-hover:rgba(255, 255, 255, 0.10);--panel-width:320px;--radius:14px;--radius-sm:8px}body,html{width:100%;height:100%;overflow:hidden;font-family:Cairo,Tajawal,Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#0a0f1e;direction:rtl;text-align:right}#map{position:absolute;inset:0;z-index:0;outline:0!important}#map canvas,#map canvas:focus,#map:focus,.esri-view,.esri-view-surface,.esri-view-surface:focus,.esri-view-user-storage:focus,.esri-view:focus{outline:0!important;border:none!important;box-shadow:none!important}.esri-view .esri-view-surface:focus::after,.esri-view .esri-view-surface:focus:after{display:none!important;content:none!important;outline:0!important}.esri-ui-top-right{right:350px!important}.esri-widget{background:rgba(10,15,30,.85)!important;color:#f1f5f9!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:8px!important;font-family:inherit!important}.esri-widget--button{background:rgba(10,15,30,.85)!important;color:#94a3b8!important}.esri-widget--button:hover{background:rgba(255,255,255,.1)!important;color:#f1f5f9!important}#controls-wrapper{position:absolute;top:16px;right:16px;z-index:10;display:flex;align-items:flex-start;transition:transform .35s cubic-bezier(.2, .9, .3, 1);direction:ltr}.panel-slide-handle{width:32px;height:42px;background:var(--panel-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--panel-border);border-right:none;border-radius:var(--radius-sm) 0 0 var(--radius-sm);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:-4px 4px 16px rgba(0,0,0,.35);margin-top:16px;transition:all .2s ease;outline:0;padding:0;flex-shrink:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.panel-slide-handle:hover{background:var(--surface-hover);color:var(--accent);border-color:var(--accent)}.panel-slide-handle .slide-arrow{font-size:15px;line-height:1}.panel-slide-handle .slide-arrow::before{content:'▸'}.panel-slide-handle .slide-handle-pill{display:none}#controls-panel{position:relative;top:auto;right:auto;width:var(--panel-width);background:var(--panel-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--panel-border);border-radius:var(--radius);padding:22px;color:var(--text-primary);max-height:calc(100vh - 32px);overflow-y:auto;direction:ltr;box-shadow:0 8px 32px rgba(0,0,0,.4),0 0 0 1px rgba(255,255,255,.03);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#controls-wrapper.collapsed{transform:translateX(calc(100% - 32px))}#controls-wrapper.collapsed .slide-arrow::before{content:'◂'}#controls-panel>*{direction:rtl;text-align:right}#controls-panel::-webkit-scrollbar{width:5px}#controls-panel::-webkit-scrollbar-track{background:0 0}#controls-panel::-webkit-scrollbar-thumb{background:var(--text-muted);border-radius:4px}.panel-header{margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--panel-border);text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.panel-header .panel-title-svg{display:block;max-width:100%;width:200px;height:auto;margin:0 auto;filter:drop-shadow(0 2px 8px rgba(0, 0, 0, .4));-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none;pointer-events:none}.panel-header h2{font-size:22px;font-weight:700;color:var(--text-primary);line-height:1.3;text-align:center}.panel-header .subtitle,.panel-header p{font-size:13px;color:var(--text-secondary);margin-top:4px;font-weight:400;line-height:1.4;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.control-group{margin-bottom:18px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.control-group label{display:block;font-size:12px;font-weight:600;color:var(--text-secondary);margin-bottom:8px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:3px;background:var(--surface);outline:0;cursor:pointer;direction:ltr;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;-webkit-tap-highlight-color:transparent}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--accent);cursor:grab;box-shadow:0 0 8px var(--accent-glow),0 2px 6px rgba(0,0,0,.3);transition:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none}input[type=range]:active::-webkit-slider-thumb{cursor:grabbing;transform:scale(1.15)}input[type=range]::-webkit-slider-thumb:hover{box-shadow:0 0 14px var(--accent-glow),0 2px 8px rgba(0,0,0,.4)}input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent);cursor:grab;border:none;box-shadow:0 0 8px var(--accent-glow),0 2px 6px rgba(0,0,0,.3);transition:none;-moz-user-select:none;user-select:none}input[type=range]:active::-moz-range-thumb{cursor:grabbing;transform:scale(1.15)}.date-display,.time-display{font-size:22px;font-weight:700;color:var(--text-primary);margin-top:6px;font-variant-numeric:tabular-nums;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none}.date-display{font-size:16px;font-weight:600}.season-buttons{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:6px}.season-buttons button{background:var(--surface);border:1px solid var(--panel-border);color:var(--text-secondary);padding:7px 0;border-radius:var(--radius-sm);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;font-family:inherit}.season-buttons button:hover{background:var(--surface-hover);color:var(--text-primary);border-color:var(--accent)}.season-buttons button.active{background:rgba(245,158,11,.15);color:var(--accent);border-color:var(--accent)}.expandable-frame{margin-top:14px;border-top:1px solid var(--panel-border);padding-top:12px}.expandable-toggle{width:100%;background:var(--surface);border:1px solid var(--panel-border);color:var(--text-secondary);padding:9px 12px;border-radius:var(--radius-sm);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:space-between;font-family:inherit;margin-bottom:12px}.expandable-toggle:hover{background:var(--surface-hover);color:var(--text-primary);border-color:rgba(255,255,255,.15)}.expandable-toggle .toggle-title{display:flex;align-items:center;gap:6px}.expandable-toggle .toggle-icon{font-size:13px;color:var(--accent)}.expandable-frame .expandable-content{display:none;animation:fadeIn .25s ease forwards}.expandable-frame.expanded .expandable-content{display:block}@keyframes fadeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.sun-info{background:var(--surface);border-radius:var(--radius-sm);padding:14px;margin-bottom:18px;border:1px solid var(--panel-border)}.sun-info-header{font-size:12px;font-weight:600;color:var(--text-secondary);margin-bottom:10px}.sun-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.sun-info-item{display:flex;flex-direction:column}.sun-info-item .label{font-size:11px;color:var(--text-muted)}.sun-info-item .value{font-size:14px;font-weight:600;color:var(--text-primary);font-variant-numeric:tabular-nums}.night-indicator{text-align:center;padding:8px;color:var(--accent);font-size:13px;font-weight:600}.action-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px}.btn{background:var(--surface);border:1px solid var(--panel-border);color:var(--text-secondary);padding:10px 12px;border-radius:var(--radius-sm);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;font-family:inherit;text-align:center}.btn:hover{background:var(--surface-hover);color:var(--text-primary)}.btn.playing{background:rgba(245,158,11,.15);color:var(--accent);border-color:var(--accent)}.btn-community{width:100%;background:rgba(59,130,246,.15);color:#60a5fa;border:1px solid rgba(59,130,246,.3);padding:10px 12px;font-size:12px;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s ease}.btn-community:hover{background:rgba(59,130,246,.3);color:#93c5fd;border-color:#60a5fa}.community-hint{font-size:11px;color:var(--text-muted);margin-top:6px;line-height:1.4}#loading-overlay{position:absolute;inset:0;z-index:100;background:rgba(10,15,30,.92);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:opacity .5s ease}#loading-overlay.hidden{opacity:0;pointer-events:none}.loading-spinner{width:48px;height:48px;border:3px solid var(--surface);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{color:var(--text-secondary);font-size:15px;margin-top:16px;font-weight:600}.loading-subtext{color:var(--text-muted);font-size:13px;margin-top:6px}#status-container{position:absolute;bottom:12px;right:12px;z-index:10;display:flex;align-items:center;gap:8px;direction:rtl}.status-toggle-btn{width:32px;height:32px;border-radius:50%;background:var(--panel-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--panel-border);color:var(--text-secondary);font-family:'Times New Roman',Georgia,serif;font-size:16px;font-weight:700;font-style:italic;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 4px 16px rgba(0,0,0,.35);flex-shrink:0;outline:0;line-height:1;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.status-toggle-btn:hover{background:var(--surface-hover);color:var(--text-primary);border-color:var(--accent);transform:scale(1.06)}.status-toggle-btn.active{background:rgba(245,158,11,.18);color:var(--accent);border-color:var(--accent)}#status-bar{background:var(--panel-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--panel-border);border-radius:var(--radius-sm);padding:8px 14px;font-size:12px;color:var(--text-muted);display:flex;align-items:center;gap:10px;box-shadow:0 4px 16px rgba(0,0,0,.35)}#status-bar.hidden{display:none}#status-bar .building-count{color:var(--text-secondary);font-weight:600}#status-bar .attribution{color:var(--text-muted)}#status-bar .attribution a{color:var(--text-secondary);text-decoration:none}#night-overlay{position:absolute;inset:0;background:rgba(5,5,20,.45);z-index:1;pointer-events:none;opacity:0;transition:opacity .6s ease}#night-overlay.active{opacity:1}@media (max-width:640px){:root{--panel-width:100%}#controls-wrapper{top:auto;bottom:12px;right:12px;left:12px;width:auto;flex-direction:column;align-items:center;transition:transform .35s cubic-bezier(.2, .9, .3, 1)}.panel-slide-handle{width:100%;max-width:180px;height:26px;margin-top:0;margin-bottom:6px;border-radius:13px;border:1px solid var(--panel-border);border-right:1px solid var(--panel-border);background:var(--panel-bg);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(0,0,0,.35);touch-action:none}.panel-slide-handle .slide-handle-pill{display:block;width:44px;height:5px;border-radius:3px;background:var(--text-secondary);opacity:.8}.panel-slide-handle .slide-arrow{display:none!important}#controls-panel{width:100%;max-height:52vh;border-radius:var(--radius);padding:16px}#controls-wrapper.collapsed{transform:translateY(calc(100% - 32px))}#controls-wrapper.collapsed .slide-arrow::before{content:'▴'}.time-display{font-size:18px}#status-container{bottom:auto;top:12px;right:12px;left:auto;flex-direction:row}#status-bar{font-size:11px;padding:6px 10px;white-space:normal;max-width:calc(100vw - 64px)}}