:root{--color-text: #fff;--color-accent: #64ffda;--color-accent-rgb: 100, 255, 218;--color-active: rgb(100, 255, 100);--color-surface: rgba(0, 0, 0, .85);--color-divider: rgba(255, 255, 255, .2);--color-btn-play: linear-gradient(135deg, rgb(100, 255, 100), rgb(80, 200, 80));--color-btn-action: linear-gradient(135deg, rgb(155, 155, 155), rgb(120, 120, 120));--color-btn-neutral-bg: rgba(155, 155, 155, .4);--color-btn-neutral-accent: rgba(155, 155, 155, .6);--color-btn-active-bg: rgba(100, 255, 100, .4);--space-sm: 10px;--space-md: 16px;--space-lg: 20px;--border-radius-s: 6px;--border-radius-l: 12px;--text-size-s: 10;--text-size-m: 14;--text-size-l: 24;--sidebar-width: 300px;--transition-fast: .15s ease;--transition-normal: .3s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden;background:#000;color:var(--color-text)}#country-modal{position:fixed;z-index:1000;display:none;background:var(--color-surface);border:1px solid var(--color-divider);border-radius:8px;padding:12px 16px;min-width:180px;pointer-events:auto}#country-modal h3{font-size:.95rem;margin-bottom:8px;color:var(--color-text)}#country-modal a{color:var(--color-accent);text-decoration:none;font-size:.82rem}#country-modal a:hover{text-decoration:underline}#app{position:relative;width:100vw;height:100vh}#canvas-container{width:100%;height:100%}#background-generator{display:none;width:100%;height:100%;align-items:center;justify-content:center;color:var(--color-accent);font-size:20px;font-style:italic;opacity:.5}#loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:24px;color:#fff}#nav-container{position:fixed;top:0;left:0;height:100vh;z-index:100;transition:transform var(--transition-normal);pointer-events:none}#nav-container>*{pointer-events:auto}#nav-container.nav-collapsed{transform:translate(calc(-100% + 10px))}#nav-container.nav-expanded{transform:translate(0)}.nav-toggle{position:absolute;right:0;top:50%;transform:translateY(-50%) translate(100%);width:60px;height:80px;background:var(--color-btn-neutral-bg);border-radius:0 var(--border-radius-l) var(--border-radius-l) 0;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:101}.nav-toggle:hover{background:#141414e6}.nav-toggle:active{transform:translateY(-50%) translate(100%) scale(.95)}#nav-container.nav-expanded .toggle-icon{transform:rotate(180deg)}#nav-panel{position:relative;width:var(--sidebar-width);height:100vh;background:var(--color-surface);padding:var(--space-lg);backdrop-filter:blur(10px);overflow-y:auto;overflow-x:hidden;box-shadow:4px 0 12px #0006}#nav-panel::-webkit-scrollbar{width:8px}#nav-panel::-webkit-scrollbar-track{background:#0000004d}#nav-panel::-webkit-scrollbar-thumb{background:rgba(var(--color-accent-rgb),.3);border-radius:var(--border-radius-s)}#nav-panel::-webkit-scrollbar-thumb:hover{background:rgba(var(--color-accent-rgb),.5)}#nav-panel h3{color:#fff;margin:0 0 var(--space-md) 0;font-size:18px;font-weight:600;border-bottom:1px solid var(--color-divider);padding-bottom:8px}.view-selector{margin-top:var(--space-md)}.view-button{display:block;width:100%;padding:8px 12px;margin-bottom:6px;background:var(--color-btn-neutral-bg);border:2px solid var(--color-btn-neutral-accent);border-radius:var(--border-radius-s);color:var(--color-text);font-size:13px;cursor:pointer;transition:all var(--transition-fast);text-align:left}.view-button:hover{background:var(--color-btn-neutral-accent)}.view-button.active{background:var(--color-btn-active-bg);border-color:var(--color-active);color:#fff;font-weight:600}#sidebar-container{position:fixed;top:0;right:0;height:100vh;z-index:100;transition:transform var(--transition-normal);pointer-events:none}#sidebar-container>*{pointer-events:auto}#sidebar-container.sidebar-collapsed{transform:translate(calc(100% - 10px))}#sidebar-container.sidebar-expanded{transform:translate(0)}.sidebar-toggle{position:absolute;left:0;top:50%;transform:translateY(-50%) translate(-100%);width:60px;height:80px;background:var(--color-btn-neutral-bg);border-radius:var(--border-radius-l) 0 0 var(--border-radius-l);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:101}.sidebar-toggle:hover{background:#141414e6}.sidebar-toggle:active{transform:translateY(-50%) translate(-100%) scale(.95)}.toggle-icon{color:var(--color-accent);font-size:20px;transition:transform var(--transition-normal);user-select:none}#sidebar-container.sidebar-expanded .toggle-icon{transform:rotate(180deg)}#controls{position:relative;width:var(--sidebar-width);height:100vh;background:var(--color-surface);padding:var(--space-lg);backdrop-filter:blur(10px);overflow-y:auto;overflow-x:hidden;box-shadow:-4px 0 12px #0006}#controls::-webkit-scrollbar{width:8px}#controls::-webkit-scrollbar-track{background:#0000004d}#controls::-webkit-scrollbar-thumb{background:rgba(var(--color-accent-rgb),.3);border-radius:var(--border-radius-s)}#controls::-webkit-scrollbar-thumb:hover{background:rgba(var(--color-accent-rgb),.5)}#controls h3{color:#fff;margin:0 0 var(--space-md) 0;font-size:18px;font-weight:600;padding-bottom:8px}.control-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.control-label{color:#ccc;font-size:13px;flex:0 0 120px}.speed-input{width:80px;padding:6px 8px;background:#0009;border:2px solid #555;border-radius:var(--border-radius-s);color:#fff;font-size:14px;font-family:Courier New,monospace;transition:border-color var(--transition-fast)}.speed-input:focus{outline:none;border-color:var(--color-accent)}.speed-input.invalid{border-color:#f55}.angle-section{margin-bottom:var(--space-sm)}.angle-display{display:inline-block;padding:6px 8px;border:2px solid var(--color-divider);border-radius:var(--border-radius-s);color:var(--color-accent);font-family:Courier New,monospace}.button-row{display:flex;gap:8px;margin:12px 0}.control-button{flex:1;padding:10px 16px;border:none;border-radius:var(--border-radius-s);font-size:var(--text-size-m);font-weight:500;cursor:pointer;transition:all var(--transition-fast);box-shadow:0 2px 4px #0000004d}.btn-toggle{background:var(--color-btn-play);color:#000}.btn-action{background:var(--color-btn-action);color:#000}.control-button:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0006}.control-button:active{transform:translateY(0);box-shadow:0 1px 2px #0000004d}.projection-selector{margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-divider)}.projection-label{color:var(--color-text);font-size:13px;margin-bottom:8px}.projection-button{display:block;width:100%;padding:8px 12px;margin-bottom:6px;background:var(--color-btn-neutral-bg);border:2px solid var(--color-btn-neutral-accent);border-radius:var(--border-radius-s);color:var(--color-text);font-size:var(--text-size-m);cursor:pointer;transition:all var(--transition-fast);text-align:left}.projection-button:hover{background:var(--color-btn-neutral-accent)}.projection-button.active{background:var(--color-btn-active-bg);border-color:var(--color-active);color:#fff;font-weight:600}