:root{--primary:#6366f1;--primary-light:#818cf8;--primary-dark:#4f46e5;--accent:#f472b6;--accent-light:#f9a8d4;--success:#34d399;--warning:#fbbf24;--error:#f87171;--bg:#fff;--bg-secondary:#f8fafc;--bg-tertiary:#f1f5f9;--surface:#fff;--surface-hover:#f8fafc;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--text-inverse:#fff;--border:#e2e8f0;--border-light:#f1f5f9;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--shadow-xl:0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--font-sans:"Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", system-ui, sans-serif;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-base:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.35s cubic-bezier(.4, 0, .2, 1);--z-map:0;--z-panel:10;--z-header:20;--z-dialog:30;--z-toast:40}@media (prefers-color-scheme:dark){:root{--bg:#0f172a;--bg-secondary:#1e293b;--bg-tertiary:#334155;--surface:#1e293b;--surface-hover:#334155;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--text-muted:#64748b;--border:#334155;--border-light:#1e293b;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 4px 6px -1px #0006, 0 2px 4px -2px #0000004d;--shadow-lg:0 10px 15px -3px #0006, 0 4px 6px -4px #0000004d}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{font-family:var(--font-sans);color:var(--text-primary);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px;line-height:1.6}#root{flex-direction:column;height:100%;display:flex}.map-container{flex:1;min-height:0;position:relative}.map-container .geolonia{width:100%;height:100%}.editor-layout{flex-direction:column;height:100%;display:flex}@media (width>=768px){.editor-layout{flex-direction:row}}.editor-panel{background:var(--surface);border-top:1px solid var(--border);flex-direction:column;max-height:50vh;display:flex;overflow-y:auto}@media (width>=768px){.editor-panel{border-top:none;border-left:1px solid var(--border);order:1;width:380px;min-width:380px;height:100%;max-height:none}}.editor-panel-header{border-bottom:1px solid var(--border);background:var(--bg-secondary);z-index:1;justify-content:space-between;align-items:center;padding:12px 16px;display:flex;position:sticky;top:0}.editor-panel-header h2{color:var(--text-primary);font-size:16px;font-weight:600}.editor-panel-content{flex-direction:column;flex:1;gap:16px;padding:16px;display:flex;overflow-y:auto}.viewer-layout{height:100%;position:relative}.info-panel-overlay{z-index:var(--z-panel);opacity:0;pointer-events:none;transition:opacity var(--transition-base);background:#0000004d;position:fixed;inset:0}.info-panel-overlay.visible{opacity:1;pointer-events:auto}.info-panel{background:var(--surface);z-index:calc(var(--z-panel) + 1);transition:transform var(--transition-slow);border-radius:var(--radius-xl) var(--radius-xl) 0 0;max-height:70vh;box-shadow:var(--shadow-xl);position:fixed;bottom:0;left:0;right:0;overflow-y:auto;transform:translateY(100%)}.info-panel.visible{transform:translateY(0)}@media (width>=768px){.info-panel{border-radius:0;width:380px;max-height:none;inset:0 0 0 auto;transform:translate(100%)}.info-panel.visible{transform:translate(0)}}.info-panel-handle{background:var(--border);border-radius:var(--radius-full);width:36px;height:4px;margin:8px auto 4px}@media (width>=768px){.info-panel-handle{display:none}}.info-panel-content{padding:16px 20px 24px}.info-panel-content h3{color:var(--text-primary);margin-bottom:12px;font-size:20px;font-weight:700}.info-panel-field{margin-bottom:12px}.info-panel-field-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px;font-size:12px;font-weight:600}.info-panel-field-value{color:var(--text-secondary);font-size:14px;line-height:1.5}.btn{border-radius:var(--radius-md);font-family:var(--font-sans);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:none;justify-content:center;align-items:center;gap:8px;padding:8px 16px;font-size:14px;font-weight:500;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:var(--text-inverse)}.btn-primary:hover:not(:disabled){background:var(--primary-dark);box-shadow:var(--shadow-md)}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary)}.btn-secondary:hover:not(:disabled){background:var(--border)}.btn-accent{background:linear-gradient(135deg, var(--primary), var(--accent));color:var(--text-inverse)}.btn-accent:hover:not(:disabled){box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn-sm{border-radius:var(--radius-sm);padding:6px 12px;font-size:12px}.btn-icon{border-radius:var(--radius-md);padding:8px}.input-group{flex-direction:column;gap:4px;display:flex}.input-label{color:var(--text-secondary);font-size:12px;font-weight:600}.input{border:1px solid var(--border);border-radius:var(--radius-md);font-family:var(--font-sans);color:var(--text-primary);background:var(--bg);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:8px 12px;font-size:14px}.input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #6366f126}.input::placeholder{color:var(--text-muted)}.textarea{resize:vertical;min-height:60px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);transition:box-shadow var(--transition-fast);overflow:hidden}.card:hover{box-shadow:var(--shadow-md)}.card-header{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.card-body{padding:16px}.dialog-overlay{z-index:var(--z-dialog);animation:fadeIn var(--transition-fast) ease-out;background:#00000080;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.dialog{background:var(--surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);width:100%;max-width:480px;max-height:90vh;animation:slideUp var(--transition-base) ease-out;overflow-y:auto}.dialog-header{justify-content:space-between;align-items:center;padding:20px 24px 0;display:flex}.dialog-header h3{color:var(--text-primary);font-size:18px;font-weight:700}.dialog-body{padding:16px 24px 24px}.dialog-close{width:32px;height:32px;color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);transition:background var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;font-size:18px;display:flex}.dialog-close:hover{background:var(--bg-tertiary);color:var(--text-primary)}.poi-list{flex-direction:column;gap:8px;display:flex}.poi-item{border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);background:var(--surface);align-items:center;gap:12px;padding:10px 12px;display:flex}.poi-item:hover{border-color:var(--primary-light);background:var(--bg-secondary)}.poi-item.active{border-color:var(--primary);background:#6366f10d}.poi-item-color{border-radius:var(--radius-full);border:1px solid var(--border);flex-shrink:0;width:12px;height:12px}.poi-item-name{color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:14px;font-weight:500;overflow:hidden}.poi-item-actions{gap:4px;display:flex}.selector-grid{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.selector-option{border:2px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);background:var(--surface);font-family:var(--font-sans);color:var(--text-secondary);flex-direction:column;align-items:center;gap:4px;padding:10px 8px;font-size:12px;display:flex}.selector-option:hover{border-color:var(--primary-light)}.selector-option.active{border-color:var(--primary);color:var(--primary);background:#6366f10d;font-weight:600}.color-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.color-option{aspect-ratio:1;border:2px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;display:flex}.color-option.active{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}.color-swatch{border-radius:var(--radius-full);border:1px solid #0000001a;width:24px;height:24px}.share-url-box{background:var(--bg-tertiary);border-radius:var(--radius-md);word-break:break-all;color:var(--text-secondary);max-height:80px;margin-bottom:16px;padding:12px;font-family:monospace;font-size:12px;overflow-y:auto}.share-qr{border-radius:var(--radius-md);background:#fff;justify-content:center;margin-bottom:16px;padding:16px;display:flex}.share-actions{gap:8px;display:flex}.share-actions .btn{flex:1}.url-length-warning{border-radius:var(--radius-sm);align-items:center;gap:8px;margin-bottom:12px;padding:8px 12px;font-size:12px;display:flex}.url-length-warning.warning{color:#b45309;background:#fbbf241a}.url-length-warning.error{color:#b91c1c;background:#f871711a}.section-heading{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;font-size:12px;font-weight:700}.empty-state{text-align:center;color:var(--text-muted);flex-direction:column;align-items:center;gap:8px;padding:24px 16px;display:flex}.empty-state-icon{margin-bottom:4px;font-size:32px}.empty-state-text{font-size:14px}.empty-state-hint{font-size:12px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.marker-bounce{animation:.4s ease-in-out bounce}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.coordinate-input-wrapper{gap:8px;display:flex}.coordinate-input-wrapper .input{flex:1}.style-selector-grid{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.style-option{border:2px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);background:var(--surface);text-align:left;padding:10px 12px}.style-option:hover{border-color:var(--primary-light)}.style-option.active{border-color:var(--primary);background:#6366f10d}.style-option-label{color:var(--text-primary);font-size:13px;font-weight:600}.style-option-desc{color:var(--text-muted);margin-top:2px;font-size:11px}.maplibregl-ctrl-bottom-left,.maplibregl-ctrl-bottom-right{z-index:1!important}