/* Design Tokens */
:root{--font-display:'Cormorant Garamond',Georgia,serif;--font-body:'Inter',system-ui,sans-serif;--color-bg:#06060a;--color-surface:rgba(255,255,255,0.04);--color-surface-2:rgba(255,255,255,0.07);--color-border:rgba(255,255,255,0.08);--color-text:#e8e6e1;--color-text-muted:#8a877f;--color-text-faint:#4a4840;--color-glow:#d4a54a;--color-glow-dim:#a07030;--color-glow-bright:#f5d98a;--text-xs:clamp(0.65rem,0.6rem + 0.25vw,0.75rem);--text-sm:clamp(0.75rem,0.7rem + 0.25vw,0.875rem);--text-base:clamp(0.875rem,0.8rem + 0.35vw,1rem);--text-lg:clamp(1rem,0.9rem + 0.5vw,1.25rem);--text-xl:clamp(1.25rem,1rem + 1vw,2rem);--text-2xl:clamp(1.75rem,1.2rem + 2vw,3rem);--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--transition-fast:180ms cubic-bezier(0.16,1,0.3,1);--transition-smooth:400ms cubic-bezier(0.16,1,0.3,1)}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{min-height:100dvh;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg);overflow:hidden;line-height:1.5;user-select:none}button{cursor:pointer;background:none;border:none;color:inherit;font:inherit}#loader{position:fixed;inset:0;z-index:1000;background:var(--color-bg);display:flex;align-items:center;justify-content:center;transition:opacity .8s ease,visibility .8s ease}#loader.hidden{opacity:0;visibility:hidden;pointer-events:none}.loader-content{text-align:center}.loader-cross{font-size:2rem;color:var(--color-glow);margin-bottom:var(--space-4);animation:pulse-glow 2s ease-in-out infinite}@keyframes pulse-glow{0%,100%{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.loader-title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:600;letter-spacing:.02em;color:var(--color-text);margin-bottom:var(--space-2)}.loader-subtitle{font-size:var(--text-sm);color:var(--color-text-muted);letter-spacing:.15em;text-transform:uppercase;margin-bottom:var(--space-6)}.loader-bar{width:200px;height:2px;background:var(--color-border);border-radius:1px;margin:0 auto;overflow:hidden}.loader-bar-fill{height:100%;width:0%;background:var(--color-glow);border-radius:1px;transition:width .3s ease}#globe-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0}#header{position:fixed;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-6);background:linear-gradient(to bottom,rgba(6,6,10,.85) 0%,transparent 100%);pointer-events:none}.site-title{font-family:var(--font-display);font-size:var(--text-lg);font-weight:600;letter-spacing:.02em;color:var(--color-text)}.year-display{display:flex;align-items:baseline;gap:var(--space-2)}.year-label{font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.12em}.year-value{font-family:var(--font-display);font-size:var(--text-xl);font-weight:700;color:var(--color-glow-bright);font-variant-numeric:tabular-nums lining-nums;min-width:3ch;text-align:right}.year-suffix{font-size:var(--text-sm);color:var(--color-text-muted)}#narrative-panel{position:fixed;bottom:120px;left:var(--space-6);z-index:10;max-width:380px;background:rgba(6,6,10,.8);backdrop-filter:blur(16px);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);transition:opacity var(--transition-smooth),transform var(--transition-smooth)}.narrative-era{font-family:var(--font-display);font-size:var(--text-lg);font-weight:600;color:var(--color-glow-bright);margin-bottom:var(--space-2)}.narrative-text{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.65;margin-bottom:var(--space-4);max-width:45ch}.narrative-stats{display:flex;gap:var(--space-6);padding-top:var(--space-3);border-top:1px solid var(--color-border)}.stat{display:flex;flex-direction:column;gap:2px}.stat-value{font-size:var(--text-sm);font-weight:600;color:var(--color-text);font-variant-numeric:tabular-nums}.stat-label{font-size:var(--text-xs);color:var(--color-text-faint);text-transform:uppercase;letter-spacing:.08em}.region-modal{position:fixed;top:50%;right:var(--space-6);transform:translateY(-50%);z-index:50;width:340px;max-height:80vh;overflow-y:auto;background:rgba(6,6,10,.92);backdrop-filter:blur(24px);border:1px solid rgba(212,165,74,.2);border-radius:var(--radius-lg);padding:var(--space-6);transition:opacity .35s ease,transform .35s ease}.region-modal.hidden{opacity:0;transform:translateY(-50%) translateX(20px);pointer-events:none}.modal-close{position:absolute;top:var(--space-3);right:var(--space-3);width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:14px;color:var(--color-text-muted);background:var(--color-surface-2);transition:background var(--transition-fast),color var(--transition-fast)}.modal-close:hover{background:rgba(255,255,255,.12);color:var(--color-text)}.modal-header{display:flex;flex-direction:column;gap:var(--space-1);margin-bottom:var(--space-4)}.modal-icon{font-size:1.2rem;color:var(--color-glow);margin-bottom:var(--space-1)}.modal-title{font-family:var(--font-display);font-size:var(--text-xl);font-weight:700;color:var(--color-text);line-height:1.2}.modal-year{font-size:var(--text-xs);color:var(--color-glow-dim);text-transform:uppercase;letter-spacing:.1em}.modal-body{display:flex;flex-direction:column;gap:var(--space-4)}.modal-intensity-bar{display:flex;flex-direction:column;gap:var(--space-1)}.modal-intensity-label{font-size:var(--text-xs);color:var(--color-text-faint);text-transform:uppercase;letter-spacing:.08em}.modal-intensity-track{width:100%;height:4px;background:var(--color-surface-2);border-radius:2px;overflow:hidden}.modal-intensity-fill{height:100%;width:0%;background:linear-gradient(to right,var(--color-glow-dim),var(--color-glow-bright));border-radius:2px;transition:width .5s ease}.modal-intensity-pct{font-size:var(--text-xs);color:var(--color-glow);font-weight:600;align-self:flex-end}.modal-description{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.65}.modal-figures{display:flex;flex-direction:column;gap:var(--space-2)}.modal-figure{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);background:var(--color-surface);border-radius:var(--radius-sm);border-left:2px solid var(--color-glow-dim)}.modal-figure-name{font-size:var(--text-sm);font-weight:600;color:var(--color-text)}.modal-events{display:flex;flex-direction:column;gap:var(--space-2)}.modal-event{font-size:var(--text-xs);color:var(--color-text-muted);padding-left:var(--space-3);border-left:1px solid var(--color-border);line-height:1.5}.modal-event-year{color:var(--color-glow);font-weight:600;margin-right:4px}.event-toast{position:fixed;top:70px;left:50%;transform:translateX(-50%);z-index:40;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-6);background:rgba(6,6,10,.9);backdrop-filter:blur(16px);border:1px solid rgba(212,165,74,.25);border-radius:100px;transition:opacity .5s ease,transform .5s ease;white-space:nowrap}.event-toast.hidden{opacity:0;transform:translateX(-50%) translateY(-10px);pointer-events:none}.event-toast-icon{font-size:1rem}.event-toast-year{font-size:var(--text-xs);color:var(--color-glow);font-weight:600;letter-spacing:.08em}.event-toast-text{font-size:var(--text-sm);color:var(--color-text)}.route-legend{position:fixed;top:var(--space-6);right:var(--space-6);z-index:10;padding:var(--space-3) var(--space-4);background:rgba(6,6,10,.75);backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:opacity .4s ease;margin-top:40px}.route-legend.hidden{opacity:0;pointer-events:none}.route-legend-title{font-size:var(--text-xs);color:var(--color-text-faint);text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--space-2)}.route-legend-items{display:flex;flex-direction:column;gap:var(--space-1)}.route-legend-item{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);color:var(--color-text-muted)}.route-legend-line{width:20px;height:2px;border-radius:1px;flex-shrink:0}.route-legend-line.sea{background:#4a9ede}.route-legend-line.land{background:#d4a54a}.tap-hint{position:fixed;bottom:130px;left:50%;transform:translateX(-50%);z-index:15;display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:rgba(6,6,10,.7);backdrop-filter:blur(8px);border:1px solid var(--color-border);border-radius:100px;font-size:var(--text-xs);color:var(--color-text-faint);animation:hint-fade 6s ease-in-out forwards;pointer-events:none}.tap-hint-icon{font-size:.9rem}@keyframes hint-fade{0%{opacity:0}10%{opacity:1}70%{opacity:1}100%{opacity:0;visibility:hidden}}#timeline-container{position:fixed;bottom:0;left:0;right:0;z-index:10;padding:var(--space-3) var(--space-6) var(--space-4);background:linear-gradient(to top,rgba(6,6,10,.9) 0%,transparent 100%);display:flex;align-items:center;gap:var(--space-4)}.timeline-controls{display:flex;gap:var(--space-2);flex-shrink:0}.timeline-controls button{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--color-surface-2);border:1px solid var(--color-border);transition:background var(--transition-fast),border-color var(--transition-fast)}.timeline-controls button:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15)}#speed-btn{border-radius:var(--radius-sm);width:auto;padding:0 var(--space-2);font-size:var(--text-xs);font-weight:600;letter-spacing:.04em}.timeline-track-wrapper{flex:1;position:relative}.timeline-eras{position:absolute;inset:0;bottom:22px;pointer-events:none;z-index:0}#timeline-slider{-webkit-appearance:none;appearance:none;width:100%;height:4px;background:var(--color-surface-2);border-radius:2px;outline:none;position:relative;z-index:1;cursor:pointer}#timeline-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--color-glow);border:2px solid var(--color-bg);box-shadow:0 0 12px rgba(212,165,74,.5);cursor:grab;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}#timeline-slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 0 20px rgba(212,165,74,.7)}#timeline-slider::-webkit-slider-thumb:active{cursor:grabbing}#timeline-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--color-glow);border:2px solid var(--color-bg);box-shadow:0 0 12px rgba(212,165,74,.5);cursor:grab}.timeline-labels{display:flex;justify-content:space-between;padding-top:var(--space-1);font-size:var(--text-xs);color:var(--color-text-faint);font-variant-numeric:tabular-nums}#legend{position:fixed;bottom:120px;right:var(--space-6);z-index:10}.legend-title{font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--space-2);text-align:right}.legend-bar{width:140px;height:6px;border-radius:3px;background:linear-gradient(to right,rgba(212,165,74,0) 0%,rgba(160,112,48,.3) 20%,rgba(212,165,74,.6) 50%,rgba(245,217,138,.85) 80%,rgba(245,217,138,1) 100%)}.legend-labels{display:flex;justify-content:space-between;padding-top:3px;font-size:10px;color:var(--color-text-faint)}#footer{position:fixed;bottom:76px;right:var(--space-6);z-index:10;font-size:10px;color:var(--color-text-faint);display:flex;align-items:center;gap:var(--space-2)}.footer-sources{opacity:.7}.region-modal::-webkit-scrollbar{width:4px}.region-modal::-webkit-scrollbar-track{background:transparent}.region-modal::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:2px}@media(max-width:768px){#header{padding:var(--space-3) var(--space-4)}#narrative-panel{bottom:100px;left:var(--space-3);right:var(--space-3);max-width:none;padding:var(--space-4)}.narrative-stats{gap:var(--space-4)}#legend,#footer{display:none}#timeline-container{padding:var(--space-2) var(--space-3) var(--space-3)}.region-modal{right:var(--space-3);left:var(--space-3);width:auto;top:auto;bottom:110px;transform:none;max-height:50vh}.region-modal.hidden{transform:translateY(10px)}.route-legend{display:none}.tap-hint{bottom:110px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}