.loading-spinner-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-xl);min-height:100px}.loading-spinner-container.fullscreen{position:fixed;inset:0;background:rgba(var(--color-background),.95);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:var(--z-modal);min-height:100vh}.loading-spinner{position:relative;display:inline-block}.loading-spinner.small{width:24px;height:24px}.loading-spinner.medium{width:40px;height:40px}.loading-spinner.large{width:60px;height:60px}.spinner-ring{position:absolute;width:100%;height:100%;border:3px solid transparent;border-top-color:var(--period-color-primary);border-radius:50%;animation:spin var(--duration-slowest) linear infinite}.spinner-ring:nth-child(2){border-top-color:rgba(var(--period-color-rgb),.5);animation-duration:calc(var(--duration-slowest) * 1.5);animation-direction:reverse}.spinner-ring:nth-child(3){border-top-color:rgba(var(--period-color-rgb),.25);animation-duration:calc(var(--duration-slowest) * 2)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-message{margin-top:var(--space-md);font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-text-secondary);text-align:center;animation:fadeIn var(--duration-base) var(--ease-standard)}@media(prefers-reduced-motion:reduce){.spinner-ring{animation-duration:2s}}.toast{display:flex;align-items:center;gap:var(--space-md);min-width:300px;max-width:500px;padding:var(--space-md) var(--space-lg);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideIn var(--duration-slow) var(--ease-bounce);position:relative;overflow:hidden}@keyframes slideIn{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}.toast:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:currentColor}.toast-success{color:var(--color-success);border-left-color:var(--color-success)}.toast-error{color:var(--color-error);border-left-color:var(--color-error)}.toast-warning{color:var(--color-warning);border-left-color:var(--color-warning)}.toast-info{color:var(--color-primary);border-left-color:var(--color-primary)}.toast-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center}.toast-message{flex:1;font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-text-primary);line-height:var(--leading-snug)}.toast-close{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:var(--radius-sm);color:var(--color-text-secondary);background:transparent;transition:all var(--transition-base)}.toast-close:hover{background:var(--color-border-light);color:var(--color-text-primary)}.toast-close:active{transform:scale(.9)}.toast-container{position:fixed;top:var(--space-xl);right:var(--space-xl);z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--space-md);pointer-events:none}.toast-container>*{pointer-events:all}.toast-exit{animation:slideOut var(--duration-slow) var(--ease-in) forwards}@keyframes slideOut{0%{transform:translate(0);opacity:1}to{transform:translate(400px);opacity:0}}@media(max-width:768px){.toast-container{top:var(--space-md);right:var(--space-md);left:var(--space-md)}.toast{min-width:100%;max-width:100%}}@media(prefers-reduced-motion:reduce){.toast{animation:fadeIn var(--duration-base) var(--ease-standard)}.toast-exit{animation:fadeOut var(--duration-base) var(--ease-standard) forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}}.swipe-hint{position:fixed;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-lg) var(--space-xl);background:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl);z-index:var(--z-hint);cursor:pointer;transition:opacity var(--duration-slow) var(--ease-out);animation:swipePulse 2s var(--ease-in-out) infinite}.swipe-hint:hover{opacity:.7}.swipe-hint-left{left:var(--space-2xl);top:50%;transform:translateY(-50%)}.swipe-hint-right{right:var(--space-2xl);top:50%;transform:translateY(-50%)}.swipe-hint-up{top:var(--space-2xl);left:50%;transform:translate(-50%)}.swipe-hint-down{bottom:var(--space-2xl);left:50%;transform:translate(-50%)}.swipe-hint-icon{display:flex;align-items:center;justify-content:center;width:56px;height:56px;background:#ffffff1a;border-radius:var(--radius-full);margin-bottom:var(--space-sm);animation:swipeIconBounce 1.5s var(--ease-bounce) infinite}.swipe-hint-message{margin:0;font-size:var(--text-sm);font-weight:var(--font-semibold);text-align:center;white-space:nowrap}@keyframes swipePulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes swipeIconBounce{0%,to{transform:translate(0)}50%{transform:translate(8px)}}.swipe-hint-left .swipe-hint-icon{animation:swipeIconBounceLeft 1.5s var(--ease-bounce) infinite}.swipe-hint-right .swipe-hint-icon{animation:swipeIconBounceRight 1.5s var(--ease-bounce) infinite}.swipe-hint-up .swipe-hint-icon{animation:swipeIconBounceUp 1.5s var(--ease-bounce) infinite}.swipe-hint-down .swipe-hint-icon{animation:swipeIconBounceDown 1.5s var(--ease-bounce) infinite}@keyframes swipeIconBounceLeft{0%,to{transform:translate(0)}50%{transform:translate(-8px)}}@keyframes swipeIconBounceRight{0%,to{transform:translate(0)}50%{transform:translate(8px)}}@keyframes swipeIconBounceUp{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes swipeIconBounceDown{0%,to{transform:translateY(0)}50%{transform:translateY(8px)}}@media(max-width:768px){.swipe-hint{padding:var(--space-md) var(--space-lg)}.swipe-hint-left,.swipe-hint-right{inset:auto auto 120px 50%;transform:translate(-50%)}.swipe-hint-icon{width:48px;height:48px}.swipe-hint-message{font-size:var(--text-xs)}}@media(hover:hover)and (pointer:fine){.swipe-hint{display:none}}@media(prefers-reduced-motion:reduce){.swipe-hint,.swipe-hint-icon{animation:none}}:root.dark .swipe-hint{background:#ffffff1a;border:1px solid rgba(255,255,255,.2)}.bottom-sheet-overlay{position:fixed;inset:0;z-index:var(--z-sheet);display:flex;align-items:flex-end;animation:fadeIn .2s ease-out}.bottom-sheet-backdrop{position:absolute;inset:0;background:#00000080;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:fadeIn .2s ease-out}.bottom-sheet-container{position:relative;width:100%;height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));background:var(--color-surface);border-radius:var(--radius-2xl) var(--radius-2xl) 0 0;box-shadow:0 -8px 32px #0003;display:flex;flex-direction:column;animation:slideUp .3s cubic-bezier(.32,.72,0,1);overflow:hidden}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.bottom-sheet-handle{display:flex;justify-content:center;padding:var(--space-sm) 0;cursor:grab;-webkit-tap-highlight-color:transparent}.bottom-sheet-handle-bar{width:40px;height:4px;background:var(--color-border);border-radius:var(--radius-full);transition:background var(--transition-base)}.bottom-sheet-handle:active .bottom-sheet-handle-bar{background:var(--color-text-secondary);cursor:grabbing}.bottom-sheet-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-border)}.bottom-sheet-title{margin:0;font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary)}.bottom-sheet-close{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:transparent;border:none;border-radius:var(--radius-md);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-base);-webkit-tap-highlight-color:transparent}.bottom-sheet-close:hover{background:var(--color-surface-elevated);color:var(--color-text-primary)}.bottom-sheet-close:active{transform:scale(.95)}.bottom-sheet-content{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:var(--space-lg);-webkit-overflow-scrolling:touch}.bottom-sheet-content::-webkit-scrollbar{width:8px}.bottom-sheet-content::-webkit-scrollbar-track{background:transparent}.bottom-sheet-content::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--radius-full)}.bottom-sheet-content::-webkit-scrollbar-thumb:hover{background:var(--color-text-tertiary)}:root.dark .bottom-sheet-backdrop{background:#000000b3}:root.dark .bottom-sheet-container{background:var(--color-surface);box-shadow:0 -8px 32px #00000080}:root.dark .bottom-sheet-handle-bar{background:var(--color-border)}:root.dark .bottom-sheet-close:hover{background:var(--color-surface-elevated)}@media(prefers-reduced-motion:reduce){.bottom-sheet-overlay,.bottom-sheet-backdrop,.bottom-sheet-container{animation:none}}@media(min-width:769px){.bottom-sheet-overlay{align-items:center;justify-content:center}.bottom-sheet-container{width:90%;max-width:600px;max-height:80vh;border-radius:var(--radius-2xl);animation:scaleIn .3s cubic-bezier(.32,.72,0,1)}@keyframes scaleIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}.bottom-sheet-handle{display:none}}.bottom-sheet-close:focus-visible{outline:2px solid var(--period-color-primary);outline-offset:2px}.floating-action-button{position:fixed;bottom:var(--space-2xl);right:var(--space-lg);z-index:var(--z-fab);display:flex;align-items:center;justify-content:center;width:56px;height:56px;background:linear-gradient(135deg,var(--period-color-primary) 0%,rgba(var(--period-color-rgb),.8) 100%);border:none;border-radius:var(--radius-full);color:#fff;cursor:pointer;box-shadow:0 4px 16px #0003,0 8px 32px rgba(var(--period-color-rgb),.3);transition:all var(--transition-base);-webkit-tap-highlight-color:transparent;animation:fabEntrance .4s cubic-bezier(.34,1.56,.64,1)}@keyframes fabEntrance{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.floating-action-button:hover{transform:scale(1.1);box-shadow:0 6px 20px #00000040,0 12px 40px rgba(var(--period-color-rgb),.4)}.floating-action-button:active{transform:scale(.95)}.fab-badge{position:absolute;top:-4px;right:-4px;display:flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 var(--space-xs);background:#dc2626;color:#fff;font-size:.75rem;font-weight:var(--font-bold);border-radius:var(--radius-full);border:2px solid var(--color-background);box-shadow:0 2px 8px #0003;animation:badgePop .3s cubic-bezier(.34,1.56,.64,1)}@keyframes badgePop{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}.floating-action-button:focus-visible{outline:3px solid rgba(var(--period-color-rgb),.5);outline-offset:4px}:root.dark .floating-action-button{box-shadow:0 4px 16px #00000080,0 8px 32px rgba(var(--period-color-rgb),.4)}:root.dark .floating-action-button:hover{box-shadow:0 6px 20px #0009,0 12px 40px rgba(var(--period-color-rgb),.5)}:root.dark .fab-badge{border-color:var(--color-surface)}@media(max-width:640px){.floating-action-button{bottom:var(--space-xl);right:var(--space-md);width:52px;height:52px}}@media(max-width:480px){.floating-action-button{bottom:var(--space-lg);right:var(--space-sm)}}@media(min-width:1024px){.floating-action-button{width:64px;height:64px;bottom:var(--space-3xl);right:var(--space-xl)}}@media(prefers-reduced-motion:reduce){.floating-action-button{animation:none}.floating-action-button:hover{transform:none}.fab-badge{animation:none}}@media(hover:none)and (pointer:coarse){.floating-action-button:hover{transform:scale(1)}.floating-action-button:active{transform:scale(.92)}}.keyboard-shortcuts-overlay{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--space-xl);animation:fadeIn var(--duration-base) var(--ease-out)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.keyboard-shortcuts-modal{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-2xl);max-width:600px;width:100%;max-height:80vh;overflow:hidden;box-shadow:var(--shadow-2xl);display:flex;flex-direction:column;animation:slideUp var(--duration-slow) var(--ease-bounce)}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.keyboard-shortcuts-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-xl);border-bottom:1px solid var(--color-border);background:var(--color-background)}.keyboard-shortcuts-title-container{display:flex;align-items:center;gap:var(--space-md);color:var(--color-text-primary)}.keyboard-shortcuts-title-container h2{margin:0;font-size:var(--text-2xl);font-weight:var(--font-bold)}.keyboard-shortcuts-close{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);color:var(--color-text-secondary);background:transparent;transition:all var(--transition-base)}.keyboard-shortcuts-close:hover{background:var(--color-border-light);color:var(--color-text-primary)}.keyboard-shortcuts-close:active{transform:scale(.95)}.keyboard-shortcuts-content{flex:1;overflow-y:auto;padding:var(--space-xl)}.shortcut-category{margin-bottom:var(--space-2xl)}.shortcut-category:last-child{margin-bottom:0}.shortcut-category h3{margin:0 0 var(--space-md) 0;font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary);font-family:var(--font-display)}.shortcut-list{display:flex;flex-direction:column;gap:var(--space-md)}.shortcut-item{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md);background:var(--color-background);border-radius:var(--radius-lg);border:1px solid var(--color-border-light);transition:all var(--transition-base)}.shortcut-item:hover{border-color:var(--period-color-primary);background:var(--period-bg-subtle)}.shortcut-keys{display:flex;align-items:center;gap:var(--space-xs);flex-wrap:wrap}.shortcut-key{display:inline-flex;align-items:center;justify-content:center;min-width:32px;padding:var(--space-xs) var(--space-sm);background:var(--color-surface);border:2px solid var(--color-border);border-bottom-width:4px;border-radius:var(--radius-sm);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-primary);box-shadow:var(--shadow-sm)}.shortcut-or{font-size:var(--text-xs);color:var(--color-text-tertiary);margin:0 var(--space-xs);font-weight:var(--font-medium)}.shortcut-description{color:var(--color-text-secondary);font-size:var(--text-base);text-align:right}.keyboard-shortcuts-footer{padding:var(--space-lg) var(--space-xl);border-top:1px solid var(--color-border);background:var(--color-background);text-align:center}.keyboard-shortcuts-footer p{margin:0;font-size:var(--text-sm);color:var(--color-text-tertiary)}.keyboard-shortcuts-footer kbd{margin:0 var(--space-xs)}@media(max-width:768px){.keyboard-shortcuts-overlay{padding:var(--space-md)}.keyboard-shortcuts-modal{max-height:90vh}.keyboard-shortcuts-header{padding:var(--space-lg)}.keyboard-shortcuts-title-container h2{font-size:var(--text-xl)}.keyboard-shortcuts-content{padding:var(--space-lg)}.shortcut-item{flex-direction:column;align-items:flex-start;gap:var(--space-sm)}.shortcut-description{text-align:left}}.error-boundary{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-xl);background:var(--color-background)}.error-boundary-content{max-width:600px;width:100%;text-align:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-2xl);padding:var(--space-3xl) var(--space-2xl);box-shadow:var(--shadow-xl)}.error-icon{color:var(--color-error);margin-bottom:var(--space-xl);display:flex;justify-content:center;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.error-boundary-content h1{margin-bottom:var(--space-md);color:var(--color-text-primary);font-size:var(--text-3xl)}.error-message{margin-bottom:var(--space-xl);color:var(--color-text-secondary);font-size:var(--text-lg);line-height:var(--leading-relaxed)}.error-details{margin:var(--space-xl) 0;text-align:left;background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-lg);cursor:pointer}.error-details summary{font-weight:var(--font-semibold);color:var(--color-text-primary);margin-bottom:var(--space-md);-webkit-user-select:none;user-select:none}.error-details[open] summary{margin-bottom:var(--space-lg)}.error-stack{font-family:Monaco,Courier New,monospace;font-size:var(--text-sm);color:var(--color-text-secondary)}.error-stack strong{display:block;margin-bottom:var(--space-md);color:var(--color-error)}.error-stack pre{white-space:pre-wrap;word-break:break-word;max-height:300px;overflow-y:auto;padding:var(--space-md);background:var(--color-surface);border-radius:var(--radius-sm);border:1px solid var(--color-border)}.error-actions{display:flex;gap:var(--space-md);justify-content:center;flex-wrap:wrap}.error-button{display:inline-flex;align-items:center;gap:var(--space-sm);padding:var(--space-md) var(--space-xl);border-radius:var(--radius-lg);font-size:var(--text-base);font-weight:var(--font-semibold);transition:all var(--transition-base);border:2px solid transparent}.error-button.primary{background:var(--color-primary);color:#fff}.error-button.primary:hover{background:var(--color-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.error-button.secondary{background:var(--color-surface-elevated);color:var(--color-text-primary);border-color:var(--color-border)}.error-button.secondary:hover{background:var(--color-background);border-color:var(--color-primary);transform:translateY(-2px)}.error-button:active{transform:translateY(0)}@media(max-width:768px){.error-boundary-content{padding:var(--space-2xl) var(--space-lg)}.error-boundary-content h1{font-size:var(--text-2xl)}.error-message{font-size:var(--text-base)}.error-actions{flex-direction:column}.error-button{width:100%;justify-content:center}}*{box-sizing:border-box}:root{--font-display: "Playfair Display", Georgia, serif;--font-body: "Inter", "Amiri", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--safe-area-inset-top: env(safe-area-inset-top, 0px);--safe-area-inset-right: env(safe-area-inset-right, 0px);--safe-area-inset-bottom: env(safe-area-inset-bottom, 0px);--safe-area-inset-left: env(safe-area-inset-left, 0px);--touch-target-min: 44px;--touch-target-comfortable: 48px;--time-travel-height: 185px;--color-background: #fafbfc;--color-surface: #ffffff;--color-surface-elevated: #ffffff;--color-text-primary: #1a1a1a;--color-text-secondary: #525252;--color-text-tertiary: #737373;--color-text-inverse: #ffffff;--color-border: #e5e7eb;--color-border-light: #f3f4f6;--color-sudan-red: #d32f2f;--color-sudan-green: #388e3c;--color-sudan-black: #1e1e1e;--color-nile-blue: #0288d1;--color-desert-gold: #ffc107;--color-sandstone: #b39a73;--period-color-primary: var(--color-desert-gold);--period-color-rgb: 255, 193, 7;--period-bg-subtle: rgba(255, 193, 7, .03);--period-bg-light: rgba(255, 193, 7, .08);--period-accent: rgba(255, 193, 7, .15);transition:--period-color-primary 2s cubic-bezier(.4,0,.2,1),--period-color-rgb 2s cubic-bezier(.4,0,.2,1),--period-bg-subtle 2s cubic-bezier(.4,0,.2,1),--period-bg-light 2s cubic-bezier(.4,0,.2,1),--period-accent 2s cubic-bezier(.4,0,.2,1);--color-primary: var(--color-desert-gold);--color-primary-dark: #e0ac06;--color-primary-light: #ffd54f;--color-accent: var( --color-nile-blue );--color-success: var(--color-sudan-green);--color-warning: var(--color-desert-gold);--color-error: var(--color-sudan-red);--gradient-primary: linear-gradient( 135deg, var(--color-desert-gold) 0%, var(--color-nile-blue) 100% );--gradient-warm: linear-gradient( 135deg, var(--color-sudan-red) 0%, var(--color-sandstone) 100% );--gradient-cool: linear-gradient( 135deg, var(--color-nile-blue) 0%, #00f2fe 100% );--gradient-sunset: linear-gradient( 135deg, #fa709a 0%, var(--color-desert-gold) 100% );--gradient-ocean: linear-gradient( 135deg, #a8edea 0%, #fed6e3 100% );--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--space-3xl: 4rem;--space-4xl: 6rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .25);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .2s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1);--transition-slower: .5s cubic-bezier(.4, 0, .2, 1);--ease-standard: cubic-bezier(.4, 0, .2, 1);--ease-in: cubic-bezier(.4, 0, 1, 1);--ease-out: cubic-bezier(0, 0, .2, 1);--ease-in-out: cubic-bezier(.4, 0, .2, 1);--ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--duration-fast: .15s;--duration-base: .2s;--duration-slow: .3s;--duration-slower: .5s;--duration-slowest: .8s;--text-scale: 1;--text-xs: calc( clamp(.75rem, .7rem + .25vw, .875rem) * var(--text-scale) );--text-sm: calc(clamp(.875rem, .825rem + .25vw, 1rem) * var(--text-scale));--text-base: calc( clamp(1rem, .95rem + .25vw, 1.125rem) * var(--text-scale) );--text-lg: calc( clamp(1.125rem, 1.05rem + .375vw, 1.25rem) * var(--text-scale) );--text-xl: calc(clamp(1.25rem, 1.15rem + .5vw, 1.5rem) * var(--text-scale));--text-2xl: calc( clamp(1.5rem, 1.35rem + .75vw, 1.875rem) * var(--text-scale) );--text-3xl: calc( clamp(1.875rem, 1.65rem + 1.125vw, 2.25rem) * var(--text-scale) );--text-4xl: calc(clamp(2.25rem, 1.95rem + 1.5vw, 3rem) * var(--text-scale));--text-5xl: calc(clamp(3rem, 2.5rem + 2.5vw, 4rem) * var(--text-scale));--leading-tight: 1.25;--leading-snug: 1.375;--leading-normal: 1.5;--leading-relaxed: 1.625;--leading-loose: 2;--font-light: 300;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--font-extrabold: 800;--font-black: 900;--z-base: 0;--z-content: 1;--z-sticky: 100;--z-fab: 800;--z-hint: 850;--z-overlay: 900;--z-sheet: 950;--z-modal: 1000;--z-toast: 1100;--z-debug: 1200;font-family:var(--font-body);line-height:var(--leading-normal);font-weight:var(--font-normal);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media(min-width:1024px){html{font-size:10px}:root{--text-scale: .9}}:root.dark{--color-background: #0a0a0b;--color-surface: #141416;--color-surface-elevated: #1c1c1f;--color-text-primary: #e5e5e7;--color-text-secondary: #a3a3a6;--color-text-tertiary: #737376;--color-text-inverse: #1a1a1a;--color-border: #2a2a2d;--color-border-light: #1f1f22;--period-bg-subtle: rgba(var(--period-color-rgb), .05);--period-bg-light: rgba(var(--period-color-rgb), .12);--period-accent: rgba(var(--period-color-rgb), .2);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -1px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -2px rgba(0, 0, 0, .4);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .6), 0 10px 10px -5px rgba(0, 0, 0, .5);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .7)}body{margin:0;padding:0;min-width:320px;max-width:100vw;min-height:100vh;color:var(--color-text-primary);background:var(--color-background);overflow-x:hidden;min-height:-webkit-fill-available;text-size-adjust:100%;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(var(--period-color-rgb, 99, 102, 241),.1)}h1,h2,h3,h4,h5,h6{margin:0;font-family:var(--font-display);font-weight:var(--font-bold);line-height:var(--leading-tight);letter-spacing:-.02em;color:var(--color-text-primary)}h1{font-size:var(--text-5xl);font-weight:var(--font-extrabold)}h2{font-size:var(--text-3xl)}h3{font-size:var(--text-2xl)}h4{font-size:var(--text-xl);font-weight:var(--font-semibold)}h5{font-size:var(--text-lg);font-weight:var(--font-semibold)}h6{font-size:var(--text-base);font-weight:var(--font-semibold)}p{margin:0;font-size:var(--text-base);line-height:var(--leading-relaxed);color:var(--color-text-secondary)}button{font-family:var(--font-body);font-weight:var(--font-medium);cursor:pointer;border:none;background:none;transition:all var(--transition-base)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-dark);text-decoration:underline}.text-gradient{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.p-sm{padding:var(--space-sm)}.p-md{padding:var(--space-md)}.p-lg{padding:var(--space-lg)}.p-xl{padding:var(--space-xl)}.p-2xl{padding:var(--space-2xl)}.p-x-sm{padding-left:var(--space-sm);padding-right:var(--space-sm)}.p-x-md{padding-left:var(--space-md);padding-right:var(--space-md)}.p-x-lg{padding-left:var(--space-lg);padding-right:var(--space-lg)}.p-x-xl{padding-left:var(--space-xl);padding-right:var(--space-xl)}.p-y-sm{padding-top:var(--space-sm);padding-bottom:var(--space-sm)}.p-y-md{padding-top:var(--space-md);padding-bottom:var(--space-md)}.p-y-lg{padding-top:var(--space-lg);padding-bottom:var(--space-lg)}.p-y-xl{padding-top:var(--space-xl);padding-bottom:var(--space-xl)}.m-sm{margin:var(--space-sm)}.m-md{margin:var(--space-md)}.m-lg{margin:var(--space-lg)}.m-xl{margin:var(--space-xl)}.m-x-lg{margin-left:var(--space-lg);margin-right:var(--space-lg)}.m-y-lg{margin-top:var(--space-lg);margin-bottom:var(--space-lg)}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.gap-xl{gap:var(--space-xl)}.overlay-light{background-color:#0000004d}.overlay-medium{background-color:#00000080}.overlay-dark{background-color:#000000b3}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}html{scroll-behavior:smooth}::selection{background-color:var(--color-primary-light);color:var(--color-text-inverse)}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}@media(max-width:768px){*{max-width:100%}html,body,#root{max-width:100vw}button:not(.leaflet-control-zoom-in):not(.leaflet-control-zoom-out):not(.leaflet-popup-close-button),a:not(.leaflet-popup-content a):not(.leaflet-control-attribution a),[role=button],[onclick]{min-height:var(--touch-target-min);min-width:var(--touch-target-min);-webkit-tap-highlight-color:rgba(var(--period-color-rgb, 99, 102, 241),.15);-webkit-user-select:none;user-select:none}input,textarea,select{font-size:16px;min-height:var(--touch-target-comfortable);padding:var(--space-md);line-height:1.5}body{padding-left:var(--safe-area-inset-left);padding-right:var(--safe-area-inset-right)}h1{font-size:clamp(2rem,8vw + .5rem,3rem);line-height:1.1}h2{font-size:clamp(1.5rem,6vw + .5rem,2.25rem);line-height:1.2}h3{font-size:clamp(1.25rem,5vw + .25rem,1.875rem);line-height:1.3}p{font-size:clamp(.9375rem,2.5vw,1.0625rem);line-height:1.65;margin-bottom:var(--space-md)}.p-md{padding:var(--space-sm)}.p-lg{padding:var(--space-md)}.p-xl{padding:var(--space-lg)}.p-x-md{padding-left:var(--space-md);padding-right:var(--space-md)}.p-x-lg{padding-left:var(--space-lg);padding-right:var(--space-lg)}.p-y-md{padding-top:var(--space-md);padding-bottom:var(--space-md)}.p-y-lg{padding-top:var(--space-lg);padding-bottom:var(--space-lg)}.gap-md{gap:var(--space-sm)}.gap-lg{gap:var(--space-md)}.gap-xl{gap:var(--space-lg)}}@media(max-width:374px){:root{--space-xs: .25rem;--space-sm: .375rem;--space-md: .75rem;--space-lg: 1rem;--space-xl: 1.5rem;--space-2xl: 2rem}body{font-size:14px}h1{font-size:clamp(1.75rem,10vw,2.5rem)}}@media(max-height:500px)and (orientation:landscape){:root{--space-md: .5rem;--space-lg: .75rem;--space-xl: 1rem}h1,h2,h3{line-height:1.1;margin-bottom:var(--space-sm)}}@supports (padding-bottom: env(safe-area-inset-bottom)){.safe-bottom{padding-bottom:calc(var(--space-md) + var(--safe-area-inset-bottom))}}@media(max-width:768px){::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:rgba(var(--period-color-rgb, 99, 102, 241),.3);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:rgba(var(--period-color-rgb, 99, 102, 241),.5)}}@media print{*{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;color-adjust:exact!important}html,body{background:#fff!important;color:#000!important;font-size:12pt;line-height:1.5}.timeline-hero-header,.scroll-progress,.timeline-map-dock,.bottom-sheet-overlay,.floating-action-button,.leaflet-container,.mapPanel,.mapPanelContent,.topBar,.statusShelf,.miniMapContainer,.returnButton{display:none!important}.timeline-container{max-width:100%!important;background:#fff!important;padding:0!important;margin:0!important}.timeline-container:before{display:none!important}.timeline-main-content{padding:0!important;max-width:100%!important;margin:0!important}.compact-timeline-period{page-break-inside:avoid;margin-bottom:24pt;border:1pt solid #000;padding:10pt;background:#fff!important}.compact-timeline-period.sub-period{border-left:2pt solid #666;margin-left:10pt}.compact-period-header{background:#f0f0f0!important;padding:8pt!important;margin:-10pt -10pt 10pt}.compact-period-name{font-size:16pt!important;font-weight:700;color:#000!important}.compact-period-years{font-size:11pt!important;color:#333!important}.compact-period-description{font-size:11pt;color:#333!important;margin:8pt 0;line-height:1.6}.compact-period-content{max-height:none!important;overflow:visible!important}.compact-period-collapse-btn{display:none!important}.compact-events-title,.compact-subperiods-title{font-size:9pt;letter-spacing:.05em;color:#333!important}.compact-event-row{page-break-inside:avoid;margin:8pt 0;padding:8pt;border-left:3pt solid #333!important;background:#fff!important;box-shadow:none!important;transform:none!important}.compact-event-title{font-size:12pt!important;font-weight:700;color:#000!important}.compact-event-year{font-weight:700;font-size:10pt;color:#000!important}.compact-event-description{font-size:10pt;color:#333!important;margin:4pt 0;line-height:1.5}.compact-event-category{display:inline-block;padding:2pt 6pt;border:1pt solid #333;border-radius:3pt;font-size:8pt;font-weight:700;color:#000!important;background:#f0f0f0!important;text-transform:uppercase}a{color:#000!important;text-decoration:underline}a[href^=http]:after{content:" (" attr(href) ")";font-size:9pt;color:#666}@page{margin:2cm;size:A4;@top-right{content:counter(page) " of " counter(pages);font-size:9pt;color:#666}@top-left{content:"Sudan Timeline";font-size:9pt;color:#666}}@page :first{margin-top:1cm;@top-left{content:none}@top-right{content:none}}p,.compact-event-row,.compact-event-description{orphans:3;widows:3}}@media print{.print-hide{display:none!important}.print-show{display:block!important}.page-break-before{page-break-before:always}.page-break-after{page-break-after:always}.page-break-inside-avoid{page-break-inside:avoid}}.MapPanel-module__mapPanel__DF9cG,.MapPanel-module__mapPanelContent__stCBt{width:100%;height:100%;display:flex;flex-direction:column}.MapPanel-module__mapContentWrapper__YKX8x{width:100%;height:100%;background:var(--color-surface);border-radius:var(--radius-2xl);border:1px solid var(--color-border);box-shadow:var(--shadow-xl);overflow:hidden;display:flex;flex-direction:column}.MapPanel-module__dock__heXR4 .MapPanel-module__mapContentWrapper__YKX8x{background:var(--color-surface)}.MapPanel-module__fullscreen__u-4Fk .MapPanel-module__mapContentWrapper__YKX8x{border-radius:0;border:none;box-shadow:none;background:var(--color-background)}.MapPanel-module__mapContentWrapper__YKX8x [data-map-context]{height:100%;display:flex;flex-direction:column}.dark .MapPanel-module__mapContentWrapper__YKX8x{border-color:#ffffff14}.dark .MapPanel-module__fullscreen__u-4Fk .MapPanel-module__mapContentWrapper__YKX8x{background:var(--color-surface-elevated)}@media(prefers-reduced-motion:reduce){.MapPanel-module__mapContentWrapper__YKX8x{transition:none}}.current-flag-container{position:relative;display:inline-block;cursor:pointer;filter:drop-shadow(0 4px 12px rgba(0,0,0,.15));transition:all .5s ease}.current-flag-container.loaded{animation:flagEntrance 1.2s cubic-bezier(.34,1.56,.64,1)}.current-flag{display:block;position:relative;z-index:calc(var(--z-content) + 1)}.current-flag.animated .stripe{animation:gentleWave 6s ease-in-out infinite}.current-flag.animated .red-stripe{animation-delay:0s}.current-flag.animated .white-stripe{animation-delay:.2s}.current-flag.animated .black-stripe{animation-delay:.4s}.flag-text{font-family:Arial,sans-serif;text-transform:uppercase;pointer-events:none}.struggle-text{fill:#fff}.peace-text{fill:#333}.people-text{fill:#fff}.green-triangle-group .green-triangle{transition:transform .3s ease}.green-triangle-group .donate-icon{transition:transform .3s ease,opacity .3s ease}.shine-layer{animation:shimmer 8s ease-in-out infinite;pointer-events:none}.current-flag-glow{position:absolute;inset:-10px;background:radial-gradient(ellipse at center,rgba(191,10,48,.2) 0%,rgba(255,255,255,.15) 33%,rgba(0,0,0,.2) 66%,transparent 100%);opacity:0;transition:opacity .5s ease;z-index:var(--z-content);filter:blur(15px)}.current-flag-container:hover{transform:translateY(-4px) scale(1.05);filter:drop-shadow(0 12px 24px rgba(0,0,0,.25))}.current-flag-container:hover .current-flag-glow{opacity:1}.current-flag-container:hover .shine-layer{opacity:.8}.current-flag-container:hover .green-triangle-group .green-triangle{transform:scale(1.05)}.current-flag-container:hover .green-triangle-group .donate-icon{transform:scale(1.7);opacity:1}.current-flag-container:active{transform:translateY(-2px) scale(1.02);transition:all .1s ease}:root.dark .current-flag-container{filter:drop-shadow(0 6px 20px rgba(0,102,204,.3))}:root.dark .current-flag-container:hover{filter:drop-shadow(0 12px 32px rgba(0,102,204,.5))}:root.dark .current-flag-glow{background:radial-gradient(ellipse at center,rgba(0,102,204,.4) 0%,rgba(255,255,255,.3) 33%,rgba(0,0,0,.4) 66%,transparent 100%)}@media(prefers-reduced-motion:reduce){.current-flag-container.loaded{animation:fadeIn .5s ease}.current-flag.animated .stripe{animation:none}.shine-layer{animation:none;opacity:.4}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}}.enhanced-flag-container{position:relative;display:inline-block;filter:drop-shadow(0 4px 12px rgba(0,0,0,.15));transition:all var(--transition-slow)}.enhanced-flag-container.loaded{animation:flagEntrance 1.2s cubic-bezier(.34,1.56,.64,1)}@keyframes flagEntrance{0%{opacity:0;transform:scale(.8) rotateY(-20deg)}60%{transform:scale(1.05) rotateY(5deg)}to{opacity:1;transform:scale(1) rotateY(0)}}.enhanced-flag{display:block;position:relative;z-index:calc(var(--z-content) + 1)}.enhanced-flag.animated .stripe{animation:gentleWave 6s ease-in-out infinite}.enhanced-flag.animated .blue-stripe{animation-delay:0s}.enhanced-flag.animated .yellow-stripe{animation-delay:.2s}.enhanced-flag.animated .green-stripe{animation-delay:.4s}@keyframes gentleWave{0%,to{transform:translate(0) scaleX(1)}50%{transform:translate(1px) scaleX(1.002)}}.shine-layer{animation:shimmer 8s ease-in-out infinite}@keyframes shimmer{0%,to{opacity:.3}50%{opacity:.6}}.flag-glow{position:absolute;inset:-10px;background:radial-gradient(ellipse at center,rgba(0,102,204,.2) 0%,rgba(255,204,0,.15) 33%,rgba(0,153,51,.2) 66%,transparent 100%);opacity:0;transition:opacity var(--transition-slow);z-index:var(--z-content);filter:blur(15px)}.enhanced-flag-container:hover{transform:translateY(-4px) scale(1.05);filter:drop-shadow(0 12px 24px rgba(0,0,0,.25))}.enhanced-flag-container:hover .flag-glow{opacity:1}.enhanced-flag-container:hover .shine-layer{opacity:.8}.enhanced-flag-container:active{transform:translateY(-2px) scale(1.02);transition:all .1s ease}:root.dark .enhanced-flag-container{filter:drop-shadow(0 6px 20px rgba(0,102,204,.3))}:root.dark .enhanced-flag-container:hover{filter:drop-shadow(0 12px 32px rgba(0,102,204,.5))}:root.dark .flag-glow{background:radial-gradient(ellipse at center,rgba(0,102,204,.4) 0%,rgba(255,204,0,.3) 33%,rgba(0,153,51,.4) 66%,transparent 100%)}@media(prefers-reduced-motion:reduce){.enhanced-flag-container.loaded{animation:fadeIn .5s ease}.enhanced-flag.animated .stripe{animation:none}.shine-layer{animation:none;opacity:.4}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}}.timeline-container{--timeline-left-width: 40vw;--timeline-right-width: 60vw;--timeline-side-padding: var(--space-xl);max-width:1600px;margin:0 auto;padding:0;background:radial-gradient(circle at 20% 20%,var(--period-bg-light) 0%,transparent 50%),radial-gradient(circle at 80% 80%,var(--period-bg-subtle) 0%,transparent 50%),var(--color-background);min-height:100vh;transition:background 2s var(--ease-standard);position:relative;touch-action:pan-y pan-x;-webkit-overflow-scrolling:touch}.timeline-container:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 50% 0%,var(--period-accent) 0%,transparent 40%),radial-gradient(circle at 0% 50%,var(--period-bg-light) 0%,transparent 30%),radial-gradient(circle at 100% 50%,var(--period-bg-subtle) 0%,transparent 30%);opacity:.6;pointer-events:none;z-index:0;transition:opacity 2s var(--ease-standard)}.timeline-main-content{padding:var(--space-2xl) var(--space-xl);max-width:1400px;margin:0 auto;position:relative;z-index:1}.timeline-main-layout{position:relative;z-index:1}.timeline-map-surface{position:fixed;inset:0;z-index:var(--z-modal);opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity var(--transition-base),transform var(--transition-base)}.timeline-map-surface.is-open{opacity:1;pointer-events:auto;transform:translateY(0)}@media(min-width:1024px){.timeline-container{max-width:none}.timeline-main-layout{display:grid;grid-template-columns:var(--timeline-left-width) var(--timeline-right-width);gap:0;align-items:start;max-width:none;margin:0;padding:var(--space-2xl) 0}.timeline-main-content{padding:0 var(--timeline-side-padding);max-width:none;margin:0}.timeline-map-surface{position:fixed;inset:auto;top:var(--safe-area-inset-top);right:0;left:auto;width:var(--timeline-right-width);height:calc(100dvh - (var(--safe-area-inset-top) + var(--safe-area-inset-bottom)));opacity:1;pointer-events:auto;transform:none;z-index:var(--z-content)}}.compact-timeline-list{display:flex;flex-direction:column;gap:0}.timeline-content{margin-bottom:var(--space-3xl);position:relative}.timeline-content>div{animation:fadeInUp .6s ease-out backwards}.timeline-content>div:nth-child(1){animation-delay:.1s}.timeline-content>div:nth-child(2){animation-delay:.2s}.timeline-content>div:nth-child(3){animation-delay:.3s}.timeline-content>div:nth-child(4){animation-delay:.4s}.timeline-content>div:nth-child(5){animation-delay:.5s}.timeline-content>div:nth-child(6){animation-delay:.6s}.timeline-content>div:nth-child(7){animation-delay:.7s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.no-results{text-align:center;padding:var(--space-4xl) var(--space-xl);background:var(--color-surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);border:1px solid var(--color-border-light)}.no-results-icon{margin:0 auto var(--space-xl);width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:var(--period-bg-light);border-radius:var(--radius-full);color:var(--period-color-primary)}.no-results h3{margin:0 0 var(--space-md) 0;font-size:var(--text-2xl);color:var(--color-text-secondary);font-family:var(--font-display)}.no-results p{margin:0 0 var(--space-xl) 0;font-size:var(--text-base);color:var(--color-text-tertiary);max-width:500px;margin-left:auto;margin-right:auto}.btn-clear-filters{padding:var(--space-md) var(--space-xl);background:var(--period-color-primary);color:#fff;border-radius:var(--radius-lg);font-size:var(--text-base);font-weight:var(--font-semibold);cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-md)}.btn-clear-filters:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);background:var(--color-primary-dark)}.btn-clear-filters:active{transform:translateY(0);box-shadow:var(--shadow-sm)}@media(max-width:1024px){.timeline-main-content{padding:var(--space-2xl) var(--space-lg)}}@media(max-width:768px){.timeline-container:before{opacity:.3}.timeline-container{padding-bottom:var(--safe-area-inset-bottom)}.timeline-main-content{padding:var(--space-sm) calc(var(--space-md) + var(--safe-area-inset-left)) calc(var(--space-2xl) + var(--safe-area-inset-bottom)) calc(var(--space-md) + var(--safe-area-inset-right))}.no-results{padding:var(--space-2xl) var(--space-lg)}.no-results h3{font-size:var(--text-xl)}.no-results p{font-size:var(--space-sm)}.btn-clear-filters{min-height:var(--touch-target-comfortable);padding:var(--space-md) var(--space-2xl)}}@media(max-width:480px){.timeline-container:before{display:none}.timeline-container{padding:0}.timeline-main-content{padding:var(--space-xs) var(--space-sm) calc(var(--space-xl) + var(--safe-area-inset-bottom))}.no-results{padding:var(--space-xl) var(--space-md)}.no-results h3{font-size:var(--text-lg)}.no-results p{font-size:var(--text-sm)}.btn-clear-filters{font-size:var(--text-sm);padding:var(--space-sm) var(--space-lg)}}@media(max-width:768px)and (max-height:500px)and (orientation:landscape){.timeline-main-content{padding:var(--space-xs) var(--space-lg)}.no-results{padding:var(--space-lg) var(--space-md)}.no-results-icon{width:60px;height:60px;margin-bottom:var(--space-md)}}.smart-search{position:relative;width:100%}.smart-search-input-wrapper{position:relative;display:flex;align-items:center;gap:var(--space-sm);background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-sm) var(--space-md);transition:all var(--transition-base);box-shadow:var(--shadow-sm)}.smart-search.focused .smart-search-input-wrapper{border-color:#06c;box-shadow:0 0 0 3px #0066cc1a,var(--shadow-md);background:var(--color-surface-elevated)}.smart-search-icon{color:var(--color-text-tertiary);flex-shrink:0;transition:color var(--transition-base)}.smart-search.focused .smart-search-icon{color:#06c}.smart-search-input{flex:1;border:none;background:transparent;font-size:var(--text-sm);color:var(--color-text-primary);font-family:var(--font-body);font-weight:var(--font-medium);outline:none;width:100%}.smart-search-input::placeholder{color:var(--color-text-tertiary);font-weight:var(--font-normal)}.smart-search-clear{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border-radius:var(--radius-full);background:var(--color-border-light);color:var(--color-text-tertiary);transition:all var(--transition-fast);flex-shrink:0}.smart-search-clear:hover{background:var(--color-border);color:var(--color-text-secondary);transform:scale(1.1)}.smart-search-clear:active{transform:scale(.95)}.smart-search-dropdown{position:absolute;top:calc(100% + var(--space-xs));left:0;right:0;background:var(--color-surface-elevated);border:2px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);overflow:hidden;z-index:50;animation:slideDownFadeIn .2s ease-out;-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);max-height:400px;overflow-y:auto}@keyframes slideDownFadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.smart-search-dropdown-header{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--color-border-light);font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.05em;background:var(--color-background)}.smart-search-dropdown-header span{flex:1}.smart-search-clear-recent{font-size:var(--text-xs);color:#06c;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);transition:all var(--transition-fast)}.smart-search-clear-recent:hover{background:#0066cc1a;color:#05a}.smart-search-dropdown-list{display:flex;flex-direction:column}.smart-search-dropdown-item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:transparent;border:none;text-align:left;font-size:var(--text-sm);color:var(--color-text-primary);cursor:pointer;transition:all var(--transition-fast);position:relative;overflow:hidden}.smart-search-dropdown-item:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#06c;transform:scaleY(0);transition:transform var(--transition-base)}.smart-search-dropdown-item:hover:before{transform:scaleY(1)}.smart-search-dropdown-item:hover{background:var(--color-border-light);padding-left:calc(var(--space-md) + 3px)}.smart-search-dropdown-item:active{background:var(--period-bg-light)}.smart-search-dropdown-item svg{flex-shrink:0;color:var(--color-text-tertiary);transition:color var(--transition-fast)}.smart-search-dropdown-item.recent:hover svg{color:#06c}.smart-search-dropdown-item.suggestion:hover svg{color:#fc0}.smart-search-dropdown-item span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.smart-search-dropdown-item mark{background:#06c3;color:#06c;font-weight:var(--font-semibold);border-radius:2px;padding:1px 2px}:root.dark .smart-search-input-wrapper{background:var(--color-surface);border-color:var(--color-border)}:root.dark .smart-search.focused .smart-search-input-wrapper{background:var(--color-surface-elevated);box-shadow:0 0 0 3px #0066cc26,var(--shadow-xl)}:root.dark .smart-search-dropdown{background:var(--color-surface);border-color:var(--color-border);box-shadow:0 20px 40px #0009}:root.dark .smart-search-dropdown-header{background:var(--color-surface-elevated);border-bottom-color:var(--color-border)}:root.dark .smart-search-dropdown-item mark{background:#0066cc4d;color:#66b3ff}@media(prefers-reduced-motion:reduce){.smart-search-dropdown{animation:none}.smart-search-dropdown-item:before,.smart-search-clear{transition:none}}@media(max-width:768px){.smart-search-dropdown{max-height:300px}.smart-search-input{font-size:var(--text-base)}}.active-filter-chips{display:flex;flex-direction:column;gap:var(--space-sm);padding:var(--space-md);background:var(--color-surface);border:2px solid var(--color-border-light);border-radius:var(--radius-lg);animation:slideInFromTop .3s ease-out}@keyframes slideInFromTop{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.active-filter-chips-header{display:flex;align-items:center;gap:var(--space-xs);font-size:var(--text-xs);font-weight:var(--font-bold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.05em}.active-filter-chips-header svg{color:var(--period-color-primary)}.active-filter-chips-header span{flex:1}.active-filter-chips-clear-all{font-size:var(--text-xs);font-weight:var(--font-semibold);color:#ef4444;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);transition:all var(--transition-fast);text-transform:uppercase;letter-spacing:.05em}.active-filter-chips-clear-all:hover{background:#ef44441a;transform:translateY(-1px)}.active-filter-chips-clear-all:active{transform:translateY(0)}.active-filter-chips-list{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.active-filter-chip{display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--font-medium);transition:all var(--transition-fast);position:relative;overflow:hidden;animation:chipPop .3s cubic-bezier(.68,-.55,.265,1.55)}@keyframes chipPop{0%{transform:scale(0);opacity:0}60%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.active-filter-chip:before{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;background:linear-gradient(135deg,#06c,#fc0,#093);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity var(--transition-base)}.active-filter-chip:hover:before{opacity:1}.active-filter-chip.search{background:#0066cc1a;border:2px solid rgba(0,102,204,.3);color:#06c}.active-filter-chip.search:hover{background:#0066cc26;border-color:#06c;transform:translateY(-2px);box-shadow:0 4px 8px #06c3}.active-filter-chip.category{background:#ffcc001a;border:2px solid rgba(255,204,0,.3);color:var(--color-text-primary)}.active-filter-chip.category:hover{background:#ffcc0026;border-color:#fc0;transform:translateY(-2px);box-shadow:0 4px 8px #fc03}.active-filter-chip svg{flex-shrink:0}.active-filter-chip.search svg{color:#06c}.active-filter-chip-icon{font-size:14px;line-height:1;flex-shrink:0}.active-filter-chip-label{display:flex;align-items:center;gap:var(--space-xs);line-height:1}.active-filter-chip-type{font-weight:var(--font-semibold);opacity:.7;font-size:var(--text-xs)}.active-filter-chip-value{font-weight:var(--font-bold);max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.active-filter-chip-remove{display:flex;align-items:center;justify-content:center;width:18px;height:18px;padding:0;border-radius:var(--radius-full);background:#0000001a;color:currentColor;opacity:.6;transition:all var(--transition-fast);flex-shrink:0}.active-filter-chip-remove:hover{opacity:1;background:#ef444433;color:#ef4444;transform:rotate(90deg) scale(1.2)}.active-filter-chip-remove:active{transform:rotate(90deg) scale(.9)}:root.dark .active-filter-chips{background:var(--color-surface-elevated);border-color:var(--color-border)}:root.dark .active-filter-chip.search{background:#0066cc26;border-color:#06c6;color:#66b3ff}:root.dark .active-filter-chip.search:hover{background:#06c3;border-color:#66b3ff}:root.dark .active-filter-chip.search svg{color:#66b3ff}:root.dark .active-filter-chip.category{background:#ffcc0026;border-color:#fc06}:root.dark .active-filter-chip.category:hover{background:#fc03;border-color:#ffd633}:root.dark .active-filter-chip-remove{background:#ffffff1a}:root.dark .active-filter-chip-remove:hover{background:#ef44444d;color:#ff6b6b}@media(prefers-reduced-motion:reduce){.active-filter-chips,.active-filter-chip{animation:none}.active-filter-chip:before,.active-filter-chip-remove{transition:none}}@media(max-width:768px){.active-filter-chips{padding:var(--space-sm)}.active-filter-chip{font-size:var(--text-xs)}.active-filter-chip-value{max-width:120px}}.controls-tabbed{display:flex;flex-direction:column;gap:1.5rem;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--color-text-primary)}.tabs-header{display:flex;gap:.5rem;border-bottom:1px solid var(--color-border);padding-bottom:.5rem;overflow-x:auto}.tab-btn{display:flex;align-items:center;gap:.4rem;padding:.5rem 1rem;background:none;border:none;cursor:pointer;position:relative;font-size:.875rem;font-weight:600;color:var(--color-text-secondary);transition:all .2s ease;border-radius:.5rem;flex-shrink:0}.tab-btn:hover{background:var(--color-surface-hover)}.tab-btn.active{background:var(--color-surface-elevated);color:var(--color-text-primary);font-weight:700}.tab-badge{background:var(--period-color-primary);color:#fff;font-size:.625rem;font-weight:600;padding:.1rem .4rem;border-radius:9999px;margin-left:.3rem}.tabs-panel{display:flex;flex-direction:column;gap:1.25rem}.tab-content{display:flex;flex-direction:column;gap:1rem}.tab-loading{font-size:.8125rem;color:var(--color-text-secondary);padding:.5rem .25rem}.support-tab{gap:1rem}.support-intro h3{margin:0 0 .35rem;font-size:1rem;font-weight:700;color:var(--color-text-primary)}.support-intro p{margin:0;font-size:.875rem;color:var(--color-text-secondary);line-height:1.5}.support-grid{display:grid;gap:.75rem}.support-card{display:flex;align-items:center;gap:.75rem;padding:.85rem 1rem;border-radius:.9rem;border:1px solid var(--color-border);background:var(--color-surface-elevated);color:var(--color-text-primary);text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.support-card:hover{box-shadow:0 10px 20px #0f172a14;transform:translateY(-1px)}.support-card-icon{width:38px;height:38px;border-radius:.75rem;display:inline-flex;align-items:center;justify-content:center;background:rgba(var(--period-color-rgb),.1);color:var(--color-primary);flex-shrink:0}.support-card-content{display:flex;flex-direction:column;gap:.2rem;flex:1;min-width:0}.support-card-title{font-weight:700;font-size:.95rem}.support-card-subtitle{font-size:.8rem;color:var(--color-text-secondary)}.support-card.watani{border-color:#ffffff14;background:linear-gradient(135deg,#ffc10714,#0288d114)}.support-card.donate{border-color:#0099334d;background:linear-gradient(135deg,#0099331f,#00aa3b14)}.controls-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary)}.active-filters-section{display:flex;flex-direction:column;gap:.5rem}.controls-label-row{display:flex;justify-content:space-between;align-items:center}.controls-clear-btn{background:none;border:none;color:var(--period-color-primary);font-weight:600;cursor:pointer;font-size:.75rem;padding:.25rem .5rem;border-radius:.375rem;transition:all .2s ease}.controls-clear-btn:hover{background:var(--period-bg-light)}.active-filters-container{display:flex;flex-wrap:wrap;gap:.5rem}.filter-chip{display:flex;align-items:center;gap:.3rem;background:var(--period-bg-light);border:1px solid rgba(var(--period-color-rgb),.3);border-radius:9999px;padding:.25rem .5rem;font-size:.75rem}.filter-chip-label{font-weight:500}.filter-chip-remove{display:flex;align-items:center;justify-content:center;width:18px;height:18px;background:rgba(var(--period-color-rgb),.2);border:none;border-radius:9999px;cursor:pointer;transition:all .2s ease}.filter-chip-remove:hover{background:rgba(var(--period-color-rgb),.3);transform:scale(1.1)}.filter-chip-remove:active{transform:scale(.95)}.accordion-actions{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.accordion-btn{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.75rem 1rem;font-weight:600;font-size:.875rem;border-radius:.75rem;border:2px solid var(--color-border);background:var(--color-surface-elevated);cursor:pointer;transition:all .2s ease}.accordion-btn svg{flex-shrink:0}.expand-btn:active{background:linear-gradient(135deg,#0099331a,#0099330d);border-color:#093;color:#007a29}.collapse-btn:active{background:linear-gradient(135deg,#0066cc1a,#0066cc0d);border-color:#06c;color:#0052a3}.map-explorer-btn{display:flex;align-items:center;gap:1rem;width:100%;padding:1rem;background:linear-gradient(135deg,var(--color-primary) 0%,rgba(var(--period-color-rgb),.8) 100%);border:2px solid rgba(255,255,255,.2);border-radius:1rem;color:#fff;cursor:pointer;transition:all .2s ease;min-height:3.5rem}.map-explorer-btn svg{flex-shrink:0;opacity:.9}.map-explorer-content{display:flex;flex-direction:column;gap:.2rem;text-align:left;flex:1}.map-explorer-title{font-size:.875rem;font-weight:700}.map-explorer-subtitle{font-size:.75rem;font-weight:500;opacity:.9}.map-explorer-btn:active{transform:scale(.97);box-shadow:0 2px 6px rgba(var(--period-color-rgb),.2)}.controls-results{display:flex;flex-direction:column;gap:.5rem;padding:.75rem 1rem;background:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:.75rem;text-align:center}.results-text{font-size:.875rem;font-weight:600;color:var(--color-text-secondary)}.results-text strong{color:var(--period-color-primary);font-weight:700}.results-map-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:none;border-radius:9999px;padding:.5rem .9rem;background:var(--color-primary);color:#fff;font-size:.8125rem;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;align-self:center}.results-map-btn:hover{box-shadow:0 8px 18px #4f46e540}.results-map-btn:active{transform:scale(.97)}.tab-btn:focus-visible,.controls-clear-btn:focus-visible,.filter-chip-remove:focus-visible,.accordion-btn:focus-visible,.map-explorer-btn:focus-visible,.results-map-btn:focus-visible,.ethnic-map-close:focus-visible{outline:2px solid var(--period-color-primary);outline-offset:2px}@media(hover:none)and (pointer:coarse){.accordion-btn:active,.filter-chip-remove:active,.map-explorer-btn:active{opacity:.9;transform:none}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}.ethnic-tab{gap:1rem}.ethnic-intro h3{margin:0 0 .35rem;font-size:1rem;font-weight:700;color:var(--color-text-primary)}.ethnic-intro p{margin:0;font-size:.875rem;color:var(--color-text-secondary);line-height:1.5}.ethnic-list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}.ethnic-item{display:flex;align-items:center;justify-content:space-between;padding:.6rem .75rem;border:1px solid var(--color-border);border-radius:.75rem;background:var(--color-surface-elevated)}.ethnic-name{font-weight:600;color:var(--color-text-primary);font-size:.875rem}.ethnic-note{font-size:.75rem;color:var(--color-text-tertiary)}.ethnic-section{display:flex;flex-direction:column;gap:.75rem;padding-bottom:.5rem;border-bottom:1px solid var(--color-border)}.ethnic-section:last-child{border-bottom:none;padding-bottom:0}.ethnic-source{font-size:.75rem;color:var(--color-text-tertiary)}.ethnic-notes{display:grid;gap:.35rem;font-size:.75rem;color:var(--color-text-tertiary)}.ethnic-source a{color:var(--color-primary);text-decoration:none;font-weight:600}.ethnic-source a:hover{text-decoration:underline}.ethnic-map-grid{display:grid;gap:.75rem}.ethnic-map-card{display:flex;flex-direction:column;gap:.35rem;padding:.75rem .9rem;border-radius:.85rem;border:1px solid var(--color-border);background:var(--color-surface-elevated);text-align:left;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;color:inherit;text-decoration:none}.ethnic-map-card:hover{box-shadow:0 10px 20px #0f172a14;transform:translateY(-1px)}.ethnic-map-card.link{background:rgba(var(--period-color-rgb),.08)}.ethnic-map-card-title{font-weight:700;font-size:.9rem;color:var(--color-text-primary)}.ethnic-map-card-source{font-size:.75rem;color:var(--color-text-tertiary);display:inline-flex;align-items:center;gap:.35rem}.ethnic-map-overlay{position:fixed;inset:0;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:1rem}.ethnic-map-backdrop{position:absolute;inset:0;background:#0000008c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.ethnic-map-card{position:relative;width:min(960px,100%);max-height:92vh;background:var(--color-surface);border-radius:1rem;border:1px solid var(--color-border);box-shadow:var(--shadow-2xl);overflow:hidden;display:flex;flex-direction:column;z-index:var(--z-modal)}.ethnic-map-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 1rem;background:var(--color-surface-elevated);border-bottom:1px solid var(--color-border)}.ethnic-map-title{font-weight:700;font-size:.95rem;color:var(--color-text-primary)}.ethnic-map-close{width:36px;height:36px;border-radius:.75rem;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text-secondary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.ethnic-map-close:hover{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.ethnic-map-image-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:1rem;background:radial-gradient(circle at 20% 20%,#ffffffe6,#e2e8f0a6);overflow:auto}.ethnic-map-image{max-width:100%;max-height:70vh;object-fit:contain;border-radius:.75rem;background:var(--color-surface);box-shadow:var(--shadow-md)}.ethnic-map-caption{padding:.75rem 1rem;font-size:.8rem;color:var(--color-text-secondary);display:grid;gap:.4rem;border-top:1px solid var(--color-border)}.ethnic-map-meta{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}.controls-section{display:flex;flex-direction:column;gap:.75rem}.controls-section+.controls-section{margin-top:.5rem;padding-top:1.5rem;border-top:1px solid var(--color-border)}.compact-event-row{display:flex;align-items:flex-start;gap:var(--space-md);padding:var(--space-md);border-radius:var(--radius-md);background:var(--color-surface);border:2px solid var(--color-border-light);cursor:pointer;transition:all var(--transition-fast);margin-bottom:var(--space-sm);position:relative;overflow:hidden}.compact-event-row:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--event-color);transform:scaleY(0);transition:transform var(--transition-base)}.compact-event-row:hover:before{transform:scaleY(1)}.compact-event-row:hover{background:var(--color-surface-elevated);border-color:rgba(var(--event-color-rgb),.3);transform:translate(4px);box-shadow:var(--shadow-md)}.compact-event-row:active{transform:translate(2px) scale(.99)}.compact-event-row:focus-visible{outline:2px solid var(--event-color);outline-offset:2px}.compact-event-icon{font-size:calc(1.5rem * var(--text-scale));line-height:1;flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:rgba(var(--event-color-rgb),.1);border-radius:var(--radius-md);transition:all var(--transition-base)}.compact-event-row:hover .compact-event-icon{background:rgba(var(--event-color-rgb),.2);transform:scale(1.1) rotate(5deg)}.compact-event-content{flex:1;min-width:0}.compact-event-header{display:flex;align-items:baseline;gap:var(--space-sm);margin-bottom:var(--space-xs);flex-wrap:wrap}.compact-event-title{margin:0;font-size:var(--text-base);font-weight:var(--font-bold);font-family:var(--font-body);color:var(--color-text-primary);line-height:1.3;flex:1;min-width:0}.compact-event-year{font-size:var(--text-sm);font-weight:var(--font-semibold);padding:2px 8px;background:rgba(var(--event-color-rgb),.15);color:var(--event-color);border-radius:var(--radius-full);font-variant-numeric:tabular-nums;flex-shrink:0;white-space:nowrap}.compact-event-description{margin:0 0 var(--space-xs) 0;font-size:var(--text-sm);line-height:var(--leading-relaxed);color:var(--color-text-secondary);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.compact-event-category{display:inline-flex;align-items:center;font-size:var(--text-xs);font-weight:var(--font-semibold);padding:2px 8px;background:var(--color-surface-elevated);color:var(--color-text-tertiary);border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.05em}.compact-event-arrow{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-md);background:rgba(var(--event-color-rgb),.1);color:var(--event-color);flex-shrink:0;transition:all var(--transition-fast);margin-top:4px}.compact-event-row:hover .compact-event-arrow{background:rgba(var(--event-color-rgb),.2);transform:translate(4px)}:root.dark .compact-event-row{background:var(--color-surface);border-color:var(--color-border)}:root.dark .compact-event-row:hover{background:var(--color-surface-elevated);border-color:rgba(var(--event-color-rgb),.4)}:root.dark .compact-event-icon{background:rgba(var(--event-color-rgb),.15)}:root.dark .compact-event-row:hover .compact-event-icon{background:rgba(var(--event-color-rgb),.25)}:root.dark .compact-event-year{background:rgba(var(--event-color-rgb),.2)}:root.dark .compact-event-category{background:var(--color-surface-elevated)}:root.dark .compact-event-arrow{background:rgba(var(--event-color-rgb),.15)}:root.dark .compact-event-row:hover .compact-event-arrow{background:rgba(var(--event-color-rgb),.25)}@media(prefers-reduced-motion:reduce){.compact-event-row,.compact-event-row:before,.compact-event-icon,.compact-event-arrow{transition:none}}@media(max-width:768px){.compact-event-row{padding:var(--space-sm);gap:var(--space-sm)}.compact-event-icon{width:36px;height:36px;font-size:calc(1.25rem * var(--text-scale))}.compact-event-title{font-size:var(--text-sm)}.compact-event-year{font-size:var(--text-xs);padding:2px 6px}.compact-event-description{font-size:var(--text-xs);-webkit-line-clamp:1}.compact-event-arrow{width:28px;height:28px}.compact-event-arrow svg{width:16px;height:16px}}@media(max-width:480px){.compact-event-row{flex-direction:column;gap:var(--space-xs)}.compact-event-header{flex-direction:column;align-items:flex-start;gap:var(--space-xs)}.compact-event-arrow{align-self:flex-end}}.compact-timeline-period{border-left:8px solid var(--period-color);background:linear-gradient(90deg,rgba(var(--period-color-rgb),.08) 0%,rgba(var(--period-color-rgb),.03) 30%,transparent 100%);border-radius:0 var(--radius-lg) var(--radius-lg) 0;margin-bottom:var(--space-xs);transition:all var(--transition-base);overflow:hidden;position:relative}.compact-timeline-period:before{content:"";position:absolute;top:0;left:-8px;bottom:0;width:8px;background:linear-gradient(180deg,var(--period-color) 0%,rgba(var(--period-color-rgb),.7) 100%);opacity:0;transition:opacity var(--transition-base)}.compact-timeline-period:hover:before{opacity:1}.compact-timeline-period:hover{transform:translate(4px);background:linear-gradient(90deg,rgba(var(--period-color-rgb),.12) 0%,rgba(var(--period-color-rgb),.05) 30%,transparent 100%);box-shadow:var(--shadow-md)}@media(hover:none)and (pointer:coarse){.compact-timeline-period:hover:before{opacity:0}.compact-timeline-period:hover{transform:none;background:linear-gradient(90deg,rgba(var(--period-color-rgb),.08) 0%,rgba(var(--period-color-rgb),.03) 30%,transparent 100%);box-shadow:none}.compact-timeline-period.sub-period:hover{transform:none}.compact-period-header:hover{background:transparent}}.compact-timeline-period.expanded{margin-bottom:var(--space-md);box-shadow:var(--shadow-lg)}.compact-timeline-period.sub-period{margin-left:var(--space-xl);margin-bottom:var(--space-xs);border-left-width:4px}.compact-timeline-period.sub-period:hover{transform:translate(2px)}.compact-period-header{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);min-height:60px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all var(--transition-base);position:relative;z-index:1}.sub-period .compact-period-header{min-height:50px;padding:var(--space-sm) var(--space-md)}.compact-period-header:hover{background:rgba(var(--period-color-rgb),.05)}.compact-period-header:focus-visible{outline:2px solid var(--period-color);outline-offset:2px}.compact-period-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-md);background:rgba(var(--period-color-rgb),.15);color:var(--period-color);flex-shrink:0;transition:all var(--transition-base)}.sub-period .compact-period-icon{width:28px;height:28px}.compact-timeline-period:hover>.compact-period-header .compact-period-icon{background:rgba(var(--period-color-rgb),.25);transform:scale(1.1)}.compact-timeline-period.expanded>.compact-period-header .compact-period-icon{background:var(--period-color);color:#fff;box-shadow:0 2px 8px rgba(var(--period-color-rgb),.4)}.compact-period-info{flex:1;min-width:0}.compact-period-name{margin:0;font-size:calc(1.5rem * var(--text-scale));font-weight:800;font-family:var(--font-display);letter-spacing:-.02em;line-height:1.2;color:var(--color-text-primary);margin-bottom:var(--space-xs)}.sub-period .compact-period-name{font-size:calc(1.25rem * var(--text-scale));font-weight:700}.compact-period-meta{display:flex;align-items:center;gap:var(--space-md);flex-wrap:wrap;font-size:var(--text-sm);color:var(--color-text-tertiary)}.compact-period-years,.compact-period-subcount,.compact-period-count{display:flex;align-items:center;gap:var(--space-xs);font-weight:var(--font-semibold);font-variant-numeric:tabular-nums}.compact-period-years{padding:4px 10px;background:rgba(var(--period-color-rgb),.12);color:var(--period-color);border-radius:var(--radius-full);font-weight:600}.compact-period-subcount,.compact-period-count{padding:4px 10px;background:var(--color-surface-elevated);border-radius:var(--radius-full)}.compact-period-content{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(.4,0,.2,1);background:var(--color-surface);contain:layout paint;will-change:max-height}.compact-timeline-period.expanded>.compact-period-content{max-height:10000px}.compact-period-content-inner{padding:var(--space-xl) var(--space-lg);border-top:1px solid rgba(var(--period-color-rgb),.15);content-visibility:auto;contain-intrinsic-size:1px 600px}.sub-period .compact-period-content-inner{padding:var(--space-lg) var(--space-md)}.compact-period-description{margin:0 0 var(--space-lg) 0;font-size:var(--text-base);line-height:var(--leading-relaxed);color:var(--color-text-secondary);font-style:italic;padding:var(--space-md);background:var(--color-surface-elevated);border-radius:var(--radius-md);border-left:3px solid var(--period-color)}.sub-period .compact-period-description{font-size:var(--text-sm);padding:var(--space-sm)}.compact-events-list{margin-bottom:var(--space-lg)}.compact-events-title{font-size:var(--text-sm);font-weight:var(--font-bold);text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-tertiary);margin:0 0 var(--space-md) 0;display:flex;align-items:center;gap:var(--space-xs)}.compact-events-title:before{content:"";width:4px;height:16px;background:var(--period-color);border-radius:2px}.compact-sub-periods{margin-top:var(--space-lg);padding-top:var(--space-lg);border-top:2px dashed var(--color-border)}.compact-subperiods-title{font-size:var(--text-sm);font-weight:var(--font-bold);text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-tertiary);margin:0 0 var(--space-md) 0;display:flex;align-items:center;gap:var(--space-xs)}.compact-subperiods-title:before{content:"";width:4px;height:16px;background:var(--period-color);border-radius:2px}.compact-period-collapse-btn{display:flex;align-items:center;justify-content:center;gap:var(--space-xs);width:100%;padding:var(--space-sm);margin-top:var(--space-lg);background:rgba(var(--period-color-rgb),.08);border:1px solid rgba(var(--period-color-rgb),.2);border-radius:var(--radius-md);color:var(--period-color);font-size:var(--text-sm);font-weight:var(--font-semibold);cursor:pointer;transition:all var(--transition-fast)}.compact-period-collapse-btn:hover{background:rgba(var(--period-color-rgb),.15);border-color:var(--period-color);transform:translateY(-2px);box-shadow:0 4px 8px rgba(var(--period-color-rgb),.2)}.compact-period-collapse-btn:active{transform:translateY(0)}@media(hover:none)and (pointer:coarse){.compact-period-collapse-btn:hover{background:rgba(var(--period-color-rgb),.08);border-color:rgba(var(--period-color-rgb),.2);transform:none;box-shadow:none}.compact-period-collapse-btn:active{background:rgba(var(--period-color-rgb),.15);transform:scale(.98)}}@media(max-width:1024px){.compact-period-header{min-height:56px;padding:var(--space-sm) var(--space-md)}.compact-period-info h3{font-size:var(--text-lg)}}@media(max-width:768px){.compact-timeline-period{border-left-width:6px;margin-bottom:var(--space-sm)}.compact-timeline-period.sub-period{margin-left:var(--space-lg);border-left-width:3px}.compact-period-header{min-height:64px;padding:var(--space-md);gap:var(--space-sm)}.sub-period .compact-period-header{min-height:56px;padding:var(--space-sm) var(--space-md)}.compact-period-icon{width:36px;height:36px}.sub-period .compact-period-icon{width:28px;height:28px}.compact-period-info h3{font-size:var(--text-base);line-height:1.4}.compact-period-info .date-range{font-size:.75rem}.compact-period-meta{font-size:.6875rem;gap:var(--space-xs)}.compact-period-description{font-size:var(--text-sm);padding:var(--space-sm);margin-bottom:var(--space-md)}.compact-period-collapse-btn{min-height:44px;padding:var(--space-md);margin-top:var(--space-md)}}@media(max-width:480px){.compact-timeline-period{border-left-width:4px;border-radius:0 var(--radius-md) var(--radius-md) 0}.compact-timeline-period.sub-period{margin-left:var(--space-md);border-left-width:2px}.compact-period-header{min-height:60px;padding:var(--space-sm);gap:var(--space-xs)}.sub-period .compact-period-header{min-height:52px;padding:var(--space-xs) var(--space-sm)}.compact-period-icon{width:32px;height:32px}.compact-period-icon svg{width:18px;height:18px}.sub-period .compact-period-icon{width:24px;height:24px}.sub-period .compact-period-icon svg{width:14px;height:14px}.compact-period-info h3{font-size:.9375rem}.sub-period .compact-period-info h3{font-size:.875rem}.compact-period-info .date-range{font-size:.6875rem}.compact-period-meta{font-size:.625rem;flex-wrap:wrap}.compact-period-description{font-size:.8125rem;padding:var(--space-xs) var(--space-sm);margin-bottom:var(--space-sm)}.compact-events-title,.compact-subperiods-title{font-size:.6875rem;margin-bottom:var(--space-sm)}.compact-period-collapse-btn{font-size:.75rem;padding:var(--space-sm);min-height:40px}}.compact-period-collapse-btn svg{transition:transform var(--transition-base)}.compact-period-collapse-btn:hover svg{transform:translateY(2px)}:root.dark .compact-timeline-period{background:linear-gradient(90deg,rgba(var(--period-color-rgb),.12) 0%,rgba(var(--period-color-rgb),.05) 30%,transparent 100%)}:root.dark .compact-timeline-period:hover{background:linear-gradient(90deg,rgba(var(--period-color-rgb),.18) 0%,rgba(var(--period-color-rgb),.08) 30%,transparent 100%)}:root.dark .compact-period-content{background:var(--color-surface)}:root.dark .compact-period-description{background:var(--color-surface-elevated)}@media(prefers-reduced-motion:reduce){.compact-timeline-period,.compact-period-header,.compact-period-icon,.compact-period-content{transition:none}.compact-period-content{transition:max-height .2s linear}}@media(max-width:768px){.compact-timeline-period{border-left-width:6px}.compact-period-header{padding:var(--space-sm) var(--space-md);min-height:50px;gap:var(--space-sm)}.compact-period-icon{width:28px;height:28px}.compact-period-name{font-size:calc(1.25rem * var(--text-scale))}.sub-period .compact-period-name{font-size:calc(1.125rem * var(--text-scale))}.compact-period-meta{gap:var(--space-sm);font-size:var(--text-xs)}.compact-period-years,.compact-period-subcount,.compact-period-count{padding:3px 8px}.compact-period-content-inner{padding:var(--space-md)}.compact-timeline-period.sub-period{margin-left:var(--space-md)}}@media(max-width:480px){.compact-period-meta{flex-direction:column;align-items:flex-start}.compact-period-years,.compact-period-subcount,.compact-period-count{font-size:11px}}.south-sudan-flag-container{position:relative;display:inline-block;cursor:pointer;filter:drop-shadow(0 4px 12px rgba(0,0,0,.15));transition:all .5s ease}.south-sudan-flag-container.loaded{animation:southSudanFlagEntrance 1.2s cubic-bezier(.34,1.56,.64,1)}@keyframes southSudanFlagEntrance{0%{opacity:0;transform:scale(.8) rotateY(-20deg)}60%{transform:scale(1.05) rotateY(5deg)}to{opacity:1;transform:scale(1) rotateY(0)}}.south-sudan-flag{display:block;position:relative;z-index:calc(var(--z-content) + 1)}.south-sudan-flag.animated .stripe{animation:southSudanWave 6s ease-in-out infinite}.south-sudan-flag.animated .black-stripe{animation-delay:0s}.south-sudan-flag.animated .red-stripe{animation-delay:.2s}.south-sudan-flag.animated .green-stripe{animation-delay:.4s}@keyframes southSudanWave{0%,to{transform:translate(0) scaleX(1)}50%{transform:translate(1px) scaleX(1.002)}}.south-sudan-shine-layer{animation:southSudanShimmer 8s ease-in-out infinite}@keyframes southSudanShimmer{0%,to{opacity:.3}50%{opacity:.6}}.south-sudan-flag-glow{position:absolute;inset:-10px;background:radial-gradient(ellipse at center,rgba(15,71,175,.22) 0%,rgba(252,209,22,.18) 30%,rgba(218,18,26,.16) 55%,rgba(7,137,48,.2) 75%,transparent 100%);opacity:0;transition:opacity .5s ease;z-index:var(--z-content);filter:blur(15px)}.south-sudan-flag-container:hover{transform:translateY(-4px) scale(1.05);filter:drop-shadow(0 12px 24px rgba(0,0,0,.25))}.south-sudan-flag-container:hover .south-sudan-flag-glow{opacity:1}.south-sudan-flag-container:hover .south-sudan-shine-layer{opacity:.8}.south-sudan-flag-container:active{transform:translateY(-2px) scale(1.02);transition:all .1s ease}:root.dark .south-sudan-flag-container{filter:drop-shadow(0 6px 20px rgba(15,71,175,.35))}:root.dark .south-sudan-flag-container:hover{filter:drop-shadow(0 12px 32px rgba(15,71,175,.5))}@media(prefers-reduced-motion:reduce){.south-sudan-flag-container.loaded{animation:southSudanFadeIn .5s ease}.south-sudan-flag.animated .stripe,.south-sudan-shine-layer{animation:none}.south-sudan-shine-layer{opacity:.4}@keyframes southSudanFadeIn{0%{opacity:0}to{opacity:1}}}.timeline-hero-header{position:relative;padding:clamp(.75rem,1.8vw,1.75rem) clamp(.75rem,2vw,1.5rem);overflow:visible;transition:all var(--transition-slower);background:var(--color-background);min-height:10vh;display:flex;flex-direction:column;justify-content:center}.timeline-hero-header.scrolled{padding:clamp(.75rem,2vw,1.5rem) clamp(1rem,3vw,2rem);min-height:auto}.hero-background{position:absolute;inset:0;overflow:hidden;z-index:0}.gradient-orb{position:absolute;border-radius:50%;filter:blur(clamp(40px,8vw,80px));opacity:.15;animation:orbFloat 20s ease-in-out infinite;will-change:transform}.orb-1{width:clamp(250px,40vw,400px);height:clamp(250px,40vw,400px);background:radial-gradient(circle,#0066cc 0%,transparent 70%);top:clamp(-150px,-20vh,-200px);left:clamp(-75px,-10vw,-100px);animation-delay:0s}.orb-2{width:clamp(200px,35vw,350px);height:clamp(200px,35vw,350px);background:radial-gradient(circle,#ffcc00 0%,transparent 70%);top:clamp(-75px,-10vh,-100px);right:clamp(-40px,-5vw,-50px);animation-delay:-7s}.orb-3{width:clamp(180px,30vw,300px);height:clamp(180px,30vw,300px);background:radial-gradient(circle,#009933 0%,transparent 70%);bottom:clamp(-100px,-15vh,-150px);left:50%;transform:translate(-50%);animation-delay:-14s}@keyframes orbFloat{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,-30px) scale(1.1)}66%{transform:translate(-30px,30px) scale(.9)}}.hero-content{position:relative;z-index:1;max-width:85vw;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-md);transition:transform .1s ease-out}.hero-title-section{max-width:1300px;margin:0 auto;width:100%}.hero-main{display:flex;flex-direction:column;gap:clamp(.4rem,1.2vw,.8rem);cursor:pointer;padding:clamp(.4rem,1.1vw,.8rem);border-radius:var(--radius-2xl);border:none;background:transparent;text-align:left;width:100%;transition:all var(--transition-slow)}.hero-main:hover{background:var(--color-surface);transform:translateY(-4px);box-shadow:var(--shadow-2xl)}.hero-main:active{transform:translateY(-2px)}.hero-main:focus-visible{outline:3px solid var(--period-color-primary);outline-offset:4px}.hero-top-row{display:flex;flex-direction:row;align-items:center;gap:clamp(1rem,2vw,2rem);width:100%}.hero-title-subtitle-container{display:flex;flex-direction:column;gap:var(--space-sm);flex:1 1 auto;min-width:0;max-width:fit-content}.flags-container{display:flex;flex-direction:row;padding:6px;align-items:center;gap:clamp(.35rem,1vw,.6rem);flex-shrink:0}.hero-title{margin:0;font-size:calc(clamp(1rem,2vw,2rem) * var(--text-scale));font-weight:var(--font-black);font-family:var(--font-display);line-height:.95;letter-spacing:-.03em;display:flex;flex-wrap:wrap;gap:clamp(.5rem,2vw,1rem);min-width:0;max-width:100%;overflow-wrap:break-word;word-break:break-word}.title-word{display:inline-block;background:linear-gradient(135deg,var(--color-text-primary) 0%,var(--period-color-primary) 50%,var(--color-text-primary) 100%);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:titleEntrance var(--duration-slowest) var(--ease-bounce) backwards,gradientShift 8s var(--ease-standard) infinite;text-shadow:0 4px 30px rgba(0,0,0,.1)}@keyframes titleEntrance{0%{opacity:0;transform:translateY(30px) rotateX(-20deg);filter:blur(10px)}to{opacity:1;transform:translateY(0) rotateX(0);filter:blur(0)}}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.hero-main:hover .title-word{animation:gradientShift 2s var(--ease-standard) infinite,titlePulse var(--duration-slower) var(--ease-standard)}@keyframes titlePulse{50%{transform:scale(1.02)}}.hero-subtitle{animation:subtitleSlide var(--duration-slowest) var(--ease-standard) backwards;animation-delay:var(--duration-slow)}@keyframes subtitleSlide{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.subtitle-text{display:flex;flex-direction:column;gap:var(--space-xs)}.subtitle-en{font-size:calc(clamp(.82rem,1.1vw,1rem) * var(--text-scale));font-weight:var(--font-semibold);font-family:var(--font-body);color:var(--color-text-primary);letter-spacing:.01em}.subtitle-ar{font-size:calc(clamp(.72rem,1vw,.92rem) * var(--text-scale));font-weight:var(--font-medium);font-family:var(--font-body);color:var(--color-text-secondary);direction:rtl;opacity:.9}.hero-right-rail{display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-xs)}@keyframes taglineFade{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.title-word-ar{font-family:Amiri,Traditional Arabic,serif;font-size:.9em;direction:rtl}.hero-bottom-gradient{position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent 0%,#0066cc 25%,#ffcc00 50%,#009933 75%,transparent 100%);opacity:.5}@media(max-width:899px){.hero-top-row{align-items:flex-start;gap:clamp(.75rem,2vw,1rem)}.hero-title{font-size:calc(clamp(2rem,5vw,3rem) * var(--text-scale))}.flags-container{align-self:flex-start}}@media(min-width:1024px){.timeline-hero-header{width:var(--timeline-left-width, 40vw);margin-left:0;margin-right:auto;padding-left:var(--timeline-side-padding, var(--space-xl));padding-right:var(--timeline-side-padding, var(--space-xl));height:10vh;min-height:10vh;max-height:10vh;padding-top:0;padding-bottom:0;overflow:hidden}.timeline-hero-header.scrolled{padding-top:0;padding-bottom:0;min-height:10vh;height:10vh}.hero-content{max-width:100%;margin:0;gap:var(--space-xs)}.hero-title-section{max-width:100%}.hero-main{padding:.2rem .4rem;gap:var(--space-xs)}.hero-main:hover{transform:translateY(-1px)}.hero-top-row{align-items:center;gap:var(--space-sm)}.hero-title-subtitle-container{flex-direction:row;align-items:center;gap:var(--space-sm);min-width:0;max-width:100%}.hero-title{font-size:calc(clamp(1.15rem,1.4vw,1.6rem) * var(--text-scale));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.hero-subtitle{display:none}.flags-container{padding:2px;gap:.25rem}}@media(max-width:640px){.timeline-hero-header{min-height:auto;padding:var(--space-lg) var(--space-sm) var(--space-md)}.hero-content{gap:var(--space-md)}.hero-main{padding:var(--space-sm);-webkit-tap-highlight-color:rgba(var(--period-color-rgb),.1);gap:var(--space-sm)}.hero-top-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:var(--space-sm);row-gap:var(--space-xs);align-items:start}.hero-title{font-size:calc(clamp(1.75rem,5vw,2.5rem) * var(--text-scale))}.title-word{text-align:left}.hero-title-subtitle-container{grid-column:1;grid-row:1}.hero-right-rail{display:contents}.flags-container{grid-column:2;grid-row:1 / span 2;flex-direction:column;align-items:center;padding:4px;gap:var(--space-xs)}.hero-main:active{transform:translateY(-1px)}.hero-main:hover{transform:translateY(-2px)}}@media(max-width:480px){.timeline-hero-header{padding:var(--space-md) var(--space-sm) var(--space-sm)}.hero-content{gap:var(--space-sm)}.hero-top-row{gap:var(--space-xs)}.hero-title{font-size:calc(clamp(1.5rem,6vw,2rem) * var(--text-scale))}.hero-title-subtitle-container{gap:var(--space-xs)}.subtitle-en,.subtitle-ar{font-size:calc(clamp(.75rem,2vw,.9rem) * var(--text-scale))}}@media(max-width:900px)and (orientation:landscape){.timeline-hero-header{padding:clamp(.75rem,2vh,1.25rem) clamp(1rem,3vw,2rem);min-height:auto}.hero-main{gap:clamp(.75rem,2vw,1.25rem)}.gradient-orb{filter:blur(40px)}}:root.dark .timeline-hero-header{background:linear-gradient(180deg,rgba(10,10,11,.95) 0%,var(--color-background) 100%)}:root.dark .gradient-orb{opacity:.25}:root.dark .hero-main:hover{background:var(--color-surface-elevated);box-shadow:var(--shadow-2xl),0 0 50px rgba(var(--period-color-rgb),.2)}:root.dark .subtitle-en{color:var(--color-text-primary)}:root.dark .subtitle-ar{color:var(--color-text-secondary)}:root.dark .hero-bottom-gradient{opacity:.8;box-shadow:0 0 20px rgba(var(--period-color-rgb),.5)}@media(prefers-reduced-motion:reduce){.gradient-orb{animation:none}.title-word{animation:fadeIn var(--duration-slower) var(--ease-standard) backwards}.hero-main:hover .title-word{animation:none}.hero-main:hover,.hero-main:active{transform:none}.hero-content{transition:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}}@media(prefers-contrast:high){.timeline-hero-header,.hero-main{border:2px solid currentColor}.title-word{-webkit-text-fill-color:currentColor;background:none}.gradient-orb{opacity:.05}.hero-bottom-gradient{opacity:1;height:3px}}@media print{.timeline-hero-header{padding:1rem;background:#fff!important;page-break-after:avoid}.hero-background,.gradient-orb,.hero-bottom-gradient,.hero-right-rail{display:none}.title-word{-webkit-text-fill-color:black;color:#000}.hero-main{background:none;box-shadow:none}}@media(max-width:768px){.gradient-orb{filter:blur(clamp(30px,6vw,60px))}.hero-main,.title-word{transform:translateZ(0);backface-visibility:hidden}}@supports (container-type: inline-size){.timeline-hero-header{container-type:inline-size;container-name:hero}@container hero (max-width: 768px){.hero-main{flex-direction:column}}}@supports not (backdrop-filter: blur(10px)){.hero-main:hover{background:rgba(var(--color-surface-rgb, 255, 255, 255),.95)}}.gradient-orb,.hero-content,.title-word{will-change:transform;transform:translateZ(0)}.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;background:#0000000d;z-index:var(--z-sticky);overflow:hidden}.scroll-progress-bar{height:100%;background:linear-gradient(90deg,var(--period-color-primary),rgba(var(--period-color-rgb),.6));transition:width .1s ease-out,background 2s cubic-bezier(.4,0,.2,1);box-shadow:0 0 15px rgba(var(--period-color-rgb),.6);position:relative}.scroll-progress-bar:after{content:"";position:absolute;right:0;top:0;bottom:0;width:100px;background:linear-gradient(90deg,transparent,var(--period-color-primary));filter:blur(10px)}#root{width:100%;max-width:100vw;margin:0;padding:0;overflow-x:hidden}