:root{--bg: #0d0d0d;--surface: #141414;--card: #1a1a1a;--card-hover: #202020;--border: #2a2a2a;--text: #f0f0f0;--text-secondary: #777;--accent: #d4a853;--accent-dim: #9e7c3e;--tag-bg: #252525;--tag-text: #bbb;--red: #e74c3c;--yellow: #f0a500;--green: #2ecc71;--input-bg: #111;--input-border: #333;--nav-bg: #0a0a0a;--font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none}#root{max-width:480px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column}.header{position:sticky;top:0;z-index:100;background:var(--bg);padding:16px 16px 0;border-bottom:1px solid var(--border)}.header-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.app-title{font-size:20px;font-weight:700;letter-spacing:2px;color:var(--accent)}.spot-count{font-size:12px;color:var(--text-secondary);font-weight:400}.search-bar{position:relative;margin-bottom:12px}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-secondary);font-size:14px;pointer-events:none}.search-input{width:100%;padding:10px 12px 10px 36px;background:var(--input-bg);border:1px solid var(--input-border);border-radius:10px;color:var(--text);font-size:14px;font-family:var(--font);outline:none;transition:border-color .2s}.search-input::placeholder{color:var(--text-secondary)}.search-input:focus{border-color:var(--accent-dim)}.search-clear{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:var(--tag-bg);border:none;color:var(--text-secondary);font-size:12px;cursor:pointer;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center}.filters{display:flex;gap:8px;overflow-x:auto;padding-bottom:12px;-ms-overflow-style:none;scrollbar-width:none}.filters::-webkit-scrollbar{display:none}.filter-chip{flex-shrink:0;padding:6px 14px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--text-secondary);font-size:12px;font-family:var(--font);font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.filter-chip.active{background:var(--accent);color:#000;border-color:var(--accent)}.filter-chip:hover{border-color:var(--accent-dim)}.hood-select{flex-shrink:0;padding:6px 24px 6px 14px;border-radius:20px;border:1px solid var(--border);background:var(--input-bg);color:var(--text-secondary);font-size:12px;font-family:var(--font);font-weight:500;cursor:pointer;outline:none;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23777' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}.hood-select.active{border-color:var(--accent);color:var(--accent)}.content{flex:1;overflow-y:auto;padding:12px 16px 80px}.empty-state{text-align:center;padding:60px 20px;color:var(--text-secondary)}.empty-state h3{font-size:16px;margin-bottom:8px;color:var(--text)}.empty-state p{font-size:13px;line-height:1.5}.spot-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px;margin-bottom:10px;transition:background .2s}.spot-card:active{background:var(--card-hover)}.spot-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.spot-name{font-size:15px;font-weight:600;line-height:1.3}.spot-status{flex-shrink:0;width:10px;height:10px;border-radius:50%;margin-top:4px}.spot-status.green{background:var(--green);box-shadow:0 0 6px var(--green)}.spot-status.yellow{background:var(--yellow);box-shadow:0 0 6px var(--yellow)}.spot-status.red{background:var(--red);box-shadow:0 0 6px var(--red)}.spot-hood{font-size:12px;color:var(--accent);font-weight:500;margin-top:2px}.spot-address{font-size:12px;color:var(--text-secondary);margin-top:2px}.spot-meta{display:flex;align-items:center;gap:12px;margin-top:8px;flex-wrap:wrap}.spot-types{display:flex;gap:6px;flex-wrap:wrap}.type-tag{font-size:10px;padding:3px 8px;border-radius:12px;background:var(--tag-bg);color:var(--tag-text);font-weight:500;text-transform:uppercase;letter-spacing:.5px}.spot-distance{font-size:12px;color:var(--accent);font-weight:600;margin-left:auto}.spot-closing{font-size:11px;font-weight:500;margin-left:auto}.spot-closing.green{color:var(--green)}.spot-closing.yellow{color:var(--yellow)}.spot-closing.red{color:var(--red)}.spot-notes{font-size:12px;color:var(--text-secondary);margin-top:6px;font-style:italic;line-height:1.4}.spot-footer{display:flex;align-items:center;justify-content:space-between;margin-top:8px}.spot-link{font-size:12px;color:var(--accent);text-decoration:none;font-weight:500}.spot-link:hover{text-decoration:underline}.spot-delete{background:none;border:none;color:var(--text-secondary);font-size:16px;cursor:pointer;padding:2px 6px;border-radius:4px;opacity:.5;transition:opacity .2s}.spot-delete:hover{opacity:1;color:var(--red)}.late-night-header{text-align:center;padding:12px 0 16px}.current-time{font-size:32px;font-weight:700;color:var(--text);letter-spacing:1px}.late-night-label{font-size:12px;color:var(--text-secondary);margin-top:4px;text-transform:uppercase;letter-spacing:1px}.legend{display:flex;justify-content:center;gap:16px;margin-top:12px}.legend-item{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--text-secondary)}.legend-dot{width:8px;height:8px;border-radius:50%}.legend-dot.green{background:var(--green)}.legend-dot.yellow{background:var(--yellow)}.legend-dot.red{background:var(--red)}.nearby-header{text-align:center;padding:12px 0 16px}.locate-btn{padding:12px 28px;border-radius:25px;border:1px solid var(--accent);background:transparent;color:var(--accent);font-size:14px;font-family:var(--font);font-weight:600;cursor:pointer;transition:all .2s}.locate-btn:hover{background:var(--accent);color:#000}.locate-btn:disabled{opacity:.5;cursor:not-allowed}.locate-btn.active{background:var(--accent);color:#000}.location-status{font-size:12px;color:var(--text-secondary);margin-top:8px}.add-form{padding:4px 0}.add-form h2{font-size:18px;font-weight:600;margin-bottom:20px;color:var(--accent)}.form-group{margin-bottom:16px}.form-label{display:block;font-size:12px;font-weight:600;color:var(--text-secondary);margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}.form-input,.form-select,.form-textarea{width:100%;padding:10px 12px;background:var(--input-bg);border:1px solid var(--input-border);border-radius:10px;color:var(--text);font-size:14px;font-family:var(--font);outline:none;transition:border-color .2s}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--accent-dim)}.form-select{-moz-appearance:none;appearance:none;-webkit-appearance:none;padding-right:30px;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23777' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}.form-textarea{resize:vertical;min-height:60px}.type-checkboxes{display:flex;flex-wrap:wrap;gap:8px}.type-checkbox{display:flex;align-items:center;gap:4px;padding:6px 12px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--text-secondary);font-size:12px;font-family:var(--font);cursor:pointer;transition:all .2s}.type-checkbox.selected{background:var(--accent);color:#000;border-color:var(--accent)}.closing-time-input{display:flex;align-items:center;gap:12px}.closing-time-input input[type=range]{flex:1;accent-color:var(--accent)}.closing-time-display{font-size:14px;font-weight:600;color:var(--accent);min-width:60px;text-align:right}.submit-btn{width:100%;padding:14px;border-radius:12px;border:none;background:var(--accent);color:#000;font-size:15px;font-family:var(--font);font-weight:700;cursor:pointer;transition:opacity .2s;margin-top:8px}.submit-btn:hover{opacity:.9}.submit-btn:disabled{opacity:.4;cursor:not-allowed}.reset-btn{width:100%;padding:12px;border-radius:12px;border:1px solid var(--border);background:transparent;color:var(--text-secondary);font-size:13px;font-family:var(--font);font-weight:500;cursor:pointer;margin-top:24px}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;background:var(--nav-bg);border-top:1px solid var(--border);display:flex;z-index:100;padding-bottom:env(safe-area-inset-bottom,0)}.nav-btn{flex:1;padding:12px 0 10px;background:none;border:none;color:var(--text-secondary);font-size:11px;font-family:var(--font);font-weight:500;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;transition:color .2s;letter-spacing:.3px}.nav-btn.active{color:var(--accent)}.nav-icon{font-size:18px;line-height:1}.toast{position:fixed;bottom:80px;left:50%;transform:translate(-50%);background:var(--accent);color:#000;padding:10px 20px;border-radius:8px;font-size:13px;font-weight:600;z-index:200;animation:fadeInOut 2s ease}@keyframes fadeInOut{0%{opacity:0;transform:translate(-50%) translateY(10px)}15%{opacity:1;transform:translate(-50%) translateY(0)}85%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-10px)}}.spot-card.late-green{border-left:3px solid var(--green)}.spot-card.late-yellow{border-left:3px solid var(--yellow)}.spot-card.late-red{border-left:3px solid var(--red)}.confirm-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:300;padding:20px}.confirm-dialog{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;max-width:320px;width:100%;text-align:center}.confirm-dialog h3{font-size:16px;margin-bottom:8px}.confirm-dialog p{font-size:13px;color:var(--text-secondary);margin-bottom:20px}.confirm-actions{display:flex;gap:12px}.confirm-cancel,.confirm-delete{flex:1;padding:10px;border-radius:10px;font-size:14px;font-family:var(--font);font-weight:600;cursor:pointer;border:none}.confirm-cancel{background:var(--tag-bg);color:var(--text)}.confirm-delete{background:var(--red);color:#fff}