:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f8fafc;background-color:#0a0f1a;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}body{width:100vw;height:100vh;margin:0;overflow:hidden}#root{width:100%;height:100%}.app-container{background-color:#0a0f1a;width:100%;height:100%;position:relative}.controls-panel{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:10;pointer-events:auto;background:#0f172acc;border:1px solid #334155;border-radius:1rem;flex-direction:column;gap:1rem;width:20rem;max-height:calc(100vh - 2rem);padding:1rem .9rem 1rem 1rem;display:flex;position:relative;overflow-y:auto;box-shadow:0 25px 50px -12px #00000080}.controls-panel-wrapper{z-index:10;position:absolute;top:1rem;right:1rem}.controls-toggle-btn{display:none}.controls-panel::-webkit-scrollbar{width:10px}.controls-panel::-webkit-scrollbar-thumb{background:#94a3b840;border-radius:9999px}@media (width<=768px){.controls-panel-wrapper{pointer-events:none;justify-content:flex-end;padding:0 1rem 1rem;display:flex;position:fixed;inset:auto 0 0}.controls-toggle-btn{z-index:20;pointer-events:auto;color:#f8fafc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f172aeb;border:1px solid #334155;border-radius:9999px;align-items:center;gap:.5rem;padding:.9rem 1rem;font-size:.85rem;font-weight:700;display:inline-flex;position:fixed;bottom:1rem;right:1rem;box-shadow:0 20px 40px #00000059}.controls-panel{opacity:0;visibility:hidden;pointer-events:none;border-radius:1rem 1rem 0 0;width:min(100vw,100%);max-width:100%;max-height:80vh;margin:0 auto;transition:transform .25s,opacity .25s;position:fixed;inset:auto 0 0;overflow:hidden;transform:translateY(100%);box-shadow:0 -20px 45px #0000008c}.controls-panel.open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}.controls-panel.closed{opacity:0;visibility:hidden;transform:translateY(100%)}.controls-panel{max-height:calc(100vh - 5.5rem);padding:1rem .9rem 1rem 1rem}.controls-panel .header{border-bottom:none;padding-bottom:0}.initial-guidance-card{display:none}}.controls-panel::-webkit-scrollbar-track{background:0 0}.mode-switch-row{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.btn-mode{color:#94a3b8;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;background:#0f172a;border:1px solid #334155;border-radius:.5rem;padding:.55rem .6rem;font-size:.75rem;font-weight:700;transition:border-color .2s,color .2s,background-color .2s}.btn-mode.is-active{color:#67e8f9;background:#22d3ee24;border-color:#22d3ee}.header{border-bottom:1px solid #334155cc;align-items:center;gap:.75rem;padding-bottom:1rem;display:flex}.header h1{color:#f1f5f9;margin:0;font-size:1.125rem;font-weight:700}.header p{color:#94a3b8;margin:0;font-size:.75rem}.control-group{flex-direction:column;gap:.5rem;display:flex}.advanced-panel{background:#0f172aa6;border:1px solid #334155;border-radius:.75rem;padding:.75rem}.advanced-panel summary{cursor:pointer;color:#cbd5e1;background:#0f172a;border:1px solid #475569;border-radius:.65rem;justify-content:space-between;align-items:center;gap:.5rem;padding:.65rem .75rem;font-size:.875rem;font-weight:700;list-style:none;display:flex}.advanced-panel summary::-webkit-details-marker{display:none}.advanced-panel summary::marker{display:none}.advanced-panel summary:after{content:"▼";color:#94a3b8;font-size:.8rem;transition:transform .2s;transform:rotate(0)}.advanced-panel[open] summary:after{transform:rotate(-180deg)}.advanced-content{flex-direction:column;gap:.75rem;margin-top:.65rem;display:flex}.control-label{text-transform:uppercase;letter-spacing:.05em;color:#94a3b8;align-items:center;gap:.375rem;font-size:.75rem;font-weight:600;display:flex}.city-search-row{align-items:center;gap:.5rem;display:flex}.city-input,.btn-search{color:#f1f5f9;background:#1e293b;border:1px solid #475569;border-radius:.5rem;padding:.6rem .75rem;font-size:.875rem}.city-input{outline:none;flex:1;min-width:0}.city-input:focus{border-color:#22d3ee;box-shadow:0 0 0 2px #22d3ee33}.btn-search{cursor:pointer;color:#0f172a;background:linear-gradient(#22d3ee 0%,#06b6d4 100%);border-color:#0ea5e9;min-width:5.5rem;font-weight:700;transition:transform .15s,filter .15s}.btn-search:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px)}.btn-search:disabled{opacity:.55;cursor:not-allowed}.btn-toggle{color:#cbd5e1;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;background:#1e293b;border:1px solid #475569;border-radius:.5rem;width:100%;padding:.625rem .75rem;font-size:.8125rem;font-weight:700;transition:border-color .2s,color .2s,background-color .2s}.btn-toggle:hover{border-color:#94a3b8}.btn-toggle.is-active{color:#67e8f9;background:#22d3ee24;border-color:#22d3ee}.boundary-upload-row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.featured-cities-row{flex-wrap:wrap;gap:.4rem;display:flex}.btn-featured{color:#cbd5e1;letter-spacing:.02em;text-transform:uppercase;cursor:pointer;background:#0f172a;border:1px solid #475569;border-radius:.5rem;padding:.4rem .6rem;font-size:.75rem;font-weight:700;transition:border-color .2s,color .2s,background-color .2s}.btn-featured:hover:not(:disabled){color:#67e8f9;border-color:#22d3ee}.btn-featured:disabled{opacity:.55;cursor:not-allowed}.boundary-file-input{display:none}.btn-upload,.btn-clear{color:#f1f5f9;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;background:#1e293b;border:1px solid #475569;border-radius:.5rem;align-items:center;gap:.35rem;padding:.55rem .7rem;font-size:.75rem;font-weight:700;transition:border-color .2s,transform .15s,filter .15s;display:inline-flex}.btn-upload{color:#f8fafc;background:linear-gradient(#8b5cf6 0%,#7c3aed 100%);border-color:#7c3aed}.btn-clear{color:#cbd5e1;background:#0f172a;border-color:#334155}.btn-upload:hover:not(:disabled),.btn-clear:hover:not(:disabled){filter:brightness(1.06);transform:translateY(-1px)}.btn-upload:disabled,.btn-clear:disabled{opacity:.55;cursor:not-allowed}.boundary-status{color:#cbd5e1;font-size:.75rem;line-height:1.35}.boundary-status-muted{color:#94a3b8}.checkbox-row{color:#cbd5e1;align-items:center;gap:.5rem;font-size:.8125rem;display:flex}.checkbox-row input{accent-color:#22d3ee}.btn-export{color:#032b1f;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;background:linear-gradient(#34d399 0%,#10b981 100%);border:1px solid #0891b2;border-radius:.5rem;justify-content:center;align-items:center;gap:.4rem;width:100%;padding:.625rem .75rem;font-size:.8125rem;font-weight:800;transition:transform .15s,filter .15s;display:inline-flex}.btn-export:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-1px)}.btn-export:disabled{opacity:.55;cursor:not-allowed}.select-wrapper{position:relative}.city-select{color:#f1f5f9;appearance:none;cursor:pointer;background-color:#1e293b;border:1px solid #475569;border-radius:.5rem;outline:none;width:100%;padding:.625rem;font-size:.875rem;transition:border-color .2s}.city-select:focus{border-color:#22d3ee}.select-icon{pointer-events:none;color:#94a3b8;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.slider-header{justify-content:space-between;align-items:center;display:flex}.slider-value{border-radius:.25rem;padding:.125rem .375rem;font-size:.75rem}.value-cyan{color:#22d3ee;background:#22d3ee1a}.value-pink{color:#f472b6;background:#f472b61a}.range-input{appearance:none;cursor:pointer;background:#334155;border-radius:.5rem;width:100%;height:.25rem}.range-input::-webkit-slider-thumb{appearance:none;background:currentColor;border-radius:50%;width:1rem;height:1rem}.loading-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:50;background:#0f172a80;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.initial-guidance-overlay{z-index:8;pointer-events:none;isolation:isolate;place-items:center;padding:2rem;display:grid;position:absolute;inset:0;overflow:hidden}.welcome-joyplot-backdrop{pointer-events:none;filter:saturate(.88)brightness(.94)contrast(.96);opacity:.82;width:100%;height:100%;display:block;position:absolute;inset:0;transform:translateZ(0)}.initial-guidance-card{z-index:2;pointer-events:auto;background:#0c172beb;border:1px solid #22d3ee2e;border-radius:1.25rem;width:100%;max-width:36rem;padding:2rem;position:relative;box-shadow:0 30px 60px -24px #000000bf}.guidance-badge{color:#a5f3fc;letter-spacing:.08em;text-transform:uppercase;background:#22d3ee29;border-radius:9999px;align-items:center;gap:.5rem;margin-bottom:1rem;padding:.45rem .85rem;font-size:.75rem;display:inline-flex}.initial-guidance-card h2{color:#f8fafc;margin:0 0 1rem;font-size:clamp(1.55rem,2.5vw,2rem);line-height:1.05}.initial-guidance-card p{color:#cbd5e1;margin:0 0 1rem;line-height:1.7}.guidance-list{gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.guidance-list li{color:#e2e8f0;padding-left:1.5rem;position:relative}.guidance-list li:before{content:"";background:#22d3ee;border-radius:50%;width:.5rem;height:.5rem;position:absolute;top:.55rem;left:0}.loading-card{background:#1e293b;border:1px solid #334155;border-radius:1rem;align-items:center;gap:1rem;padding:1.25rem;display:flex;box-shadow:0 25px 50px -12px #00000080}.loading-info{flex-direction:column;display:flex}.loading-title{color:#f1f5f9;font-weight:600}.loading-status{color:#94a3b8;font-size:.75rem}.animate-spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}