:root { --bg:#fff; --fg:#111; --muted:#666; --chip:#ddd; --brand:#111; --ok:#136f63; --warn:#f4c95d; --bad:#c94f4f; }
* { box-sizing: border-box; }
html, body { height:100%; margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial; color:var(--fg); background:var(--bg); }
#app { display:grid; grid-template-rows: auto 1fr; height: 100dvh; }
.toolbar { display:flex; align-items:center; gap:.6rem; padding:0 .8rem; height:56px; border-bottom:1px solid #e65f00; background:#ff6a00; color:#fff; position:sticky; top:0; z-index:1000; }
.toolbar h1 { font-size:1.1rem; font-weight:800; margin:0; color:#fff; }
.toolbar .spacer { flex:1; }
a.tiny { font-size:.85rem; color:#fff; text-decoration:none; }
.header-menu { position: relative; margin-left: auto; }
.menu-btn { background: transparent; border: 0; width: 38px; height: 38px; padding: 0; line-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; cursor: pointer; position: relative; }
.menu-btn::after { content: ""; position: absolute; inset: -6px; }
.menu-btn:focus-visible { outline:2px solid #fff; outline-offset:2px; border-radius:8px; }
.menu-line { display: block; width: 22px; height: 2px; background: #fff; border-radius: 2px; }
.menu-dropdown { position:absolute; top:calc(100% + 8px); right:0; background:#fff; border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.18); min-width:200px; padding:8px; z-index:9999; }
.menu-dropdown[hidden] { display:none; }
.menu-dropdown a { display:block; padding:12px; color:#111; text-decoration:none; font-weight:600; border-radius:10px; }
.menu-dropdown a:hover,
.menu-dropdown a:active { background: rgba(0,0,0,.06); }
#map { width:100%; height:100%; min-height:60vh; }

.locate-control{pointer-events:auto;margin:0 0 calc(10px + env(safe-area-inset-bottom)) 10px;}
.locate-button{width:44px;height:44px;border-radius:12px;border:1px solid #e5e7eb;background:#fff;box-shadow:0 10px 25px rgba(15,23,42,0.18);display:grid;place-items:center;cursor:pointer;transition:transform 0.15s ease,box-shadow 0.15s ease;}
.locate-button svg{width:22px;height:22px;fill:#111;}
.locate-button:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(15,23,42,0.22);}
.locate-button:active{transform:translateY(0);}
.locate-button:disabled{opacity:0.6;cursor:default;}
.locate-button.is-loading svg{animation:locate-spin 1s linear infinite;}
@keyframes locate-spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}


/* Filters button */
.fab { position: fixed; right: 12px; bottom: calc(92px + env(safe-area-inset-bottom)); z-index: 1100; border: none; border-radius: 999px; padding: .6rem .9rem; background: var(--brand); color: #fff; font-weight: 600; box-shadow: 0 6px 20px rgba(0,0,0,.2); }

/* Bottom carousel */
.carousel { position: fixed; left:0; right:0; bottom:0; z-index:1050; background:linear-gradient(to top, rgba(255,255,255,0.95), rgba(255,255,255,0.85)); padding: .5rem .5rem calc(.5rem + env(safe-area-inset-bottom)); border-top:1px solid #eee; }
.carousel-header { display:flex; align-items:center; justify-content:space-between; padding:0 .25rem .35rem; }
.view-toggle { display:flex; gap:.25rem; }
.view-toggle button { border:1px solid #ddd; background:#fff; border-radius:10px; padding:.35rem .6rem; }
.view-toggle .active { background:#111; color:#fff; border-color:#111; }
.cards { display:flex; gap:.5rem; overflow-x:auto; padding:.25rem; scroll-snap-type: x proximity; }
.card { min-width: 260px; max-width: 280px; flex:0 0 auto; border:2px solid #ff6a00; border-radius:14px; background:#fff; padding:.6rem .7rem; box-shadow: 0 4px 14px rgba(0,0,0,.06); scroll-snap-align: start; }
.card h3 { margin:.1rem 0 .25rem; font-size:1rem; }
.badges { display:flex; flex-wrap:wrap; gap:.25rem; margin:.25rem 0 .35rem; }
.badge { font-size:.75rem; border:1px solid #ddd; border-radius:999px; padding:2px 6px; }
.b-sun-full { background:#136f63; color:#fff; border-color:#136f63; }
.b-sun-some { background:#f4c95d; color:#111; border-color:#f4c95d; }
.b-outdoor { background:#f1f1f1; }
.meta { font-size:.82rem; color:var(--muted); }
.actions { display:flex; gap:.4rem; margin-top:.5rem; flex-wrap: wrap; }
.actions a, .actions button { border:1px solid #ddd; background:#fff; border-radius:10px; padding:.35rem .6rem; text-decoration:none; color:inherit; }
.actions .primary { background:#111; color:#fff; border-color:#111; }

/* List panel */
.list-panel { position: fixed; left:0; right:0; bottom:0; background:#fff; z-index:1060; max-height: 45vh; overflow:auto; border-top:1px solid #eee; display:none; }
.list-panel.show { display:block; }
.list-item { display:flex; justify-content:space-between; align-items:flex-start; gap:.6rem; padding:.6rem .8rem; border-bottom:1px solid #f1f1f1; }
.list-item h4 { margin:.1rem 0; }

/* Detail modal */
.modal-backdrop { position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:1300; display:none; }
.modal-backdrop.show { display:block; }
.modal { position:fixed; left:0; right:0; bottom:0; z-index:1310; background:#fff; border-radius:16px 16px 0 0; box-shadow:0 -10px 30px rgba(0,0,0,.2); transform: translateY(100%); transition: transform .22s ease; }
.modal.show { transform: translateY(0); }
.modal-head { display:flex; align-items:center; justify-content:space-between; padding:.9rem 1rem; border-bottom:1px solid #eee; }
.modal-body { padding: .8rem 1rem 1rem; display:grid; gap:.6rem; }
.detail-map { height:180px; border-radius:12px; overflow:hidden; }

/* Bottom sheet (filters) */
.backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 1200; opacity: 0; pointer-events: none; transition: opacity .18s ease; }
.sheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1300; max-height: 85vh; background: #fff; border-radius: 16px 16px 0 0; box-shadow: 0 -10px 30px rgba(0,0,0,.2); transform: translateY(100%); transition: transform .22s ease; }
.sheet-head { display:flex; align-items:center; justify-content:space-between; padding: .9rem 1rem; border-bottom: 1px solid #eee; }
.sheet-body { padding: .8rem 1rem 1rem; overflow-y: auto; max-height: calc(85vh - 56px); display: grid; gap: 1rem; }
.icon-btn { background: transparent; border: 1px solid #ddd; border-radius: 8px; padding: .3rem .5rem; }
.sheet-actions { display:flex; gap:.6rem; justify-content:flex-end; padding-top: .5rem; }
.primary { background:#111; color:#fff; border:0; border-radius: 10px; padding:.6rem 1rem; }
.secondary { background:#f6f6f6; color:#111; border:1px solid #ddd; border-radius: 10px; padding:.6rem 1rem; }
.pill-row { display:flex; flex-wrap:wrap; gap:.5rem; }
.pill { border:1px solid #ddd; border-radius:999px; padding:.35rem .7rem; }
.pill input { margin-right:.35rem; }
.hidden { display:none; }
.backdrop.show { opacity: 1; pointer-events: auto; }
.sheet.show { transform: translateY(0); }

/* Pre-permission card */
.loc-card { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(56px + env(safe-area-inset-bottom)); width: min(540px, calc(100% - 24px)); z-index: 1200; background:#fff; border:1px solid #eee; border-radius:14px; padding:.8rem; box-shadow:0 8px 30px rgba(0,0,0,.18); display:none; }
.loc-card.show { display:block; }
.loc-card h4 { margin:.1rem 0 .4rem; }
.loc-card .row { display:flex; gap:.5rem; }
.loc-card button { flex:1; border:1px solid #ddd; border-radius:10px; padding:.5rem .7rem; background:#fff; }
.loc-card .primary { background:#111; color:#fff; border-color:#111; }

/* Empty state */
.empty { padding:.6rem .8rem; color:var(--muted); }

/* Venue status + intro tip */
.venue-status { position: fixed; top: calc(56px + 12px); left: 50%; transform: translateX(-50%); z-index: 1200; background: rgba(17,17,17,0.92); color: #fff; padding: 8px 14px; border-radius: 999px; font-weight: 700; font-size: .9rem; box-shadow: 0 10px 25px rgba(15,23,42,0.18); text-align: center; max-width: min(90vw, 420px); pointer-events: none; }
.venue-status[hidden] { display: none; }
.venue-status[data-state="empty"] { background: #fff7ed; color: #9a3412; border: 1px solid #fdba74; }
.venue-status[data-state="error"] { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; }

.intro-tip { position: fixed; top: calc(56px + 64px); left: 50%; transform: translateX(-50%); z-index: 1200; background: #fff; color: #111; border: 2px solid #ff6a00; border-radius: 14px; padding: 12px 14px; box-shadow: 0 12px 30px rgba(0,0,0,.18); display: flex; align-items: center; gap: 12px; max-width: min(92vw, 520px); flex-wrap: wrap; }
.intro-tip[hidden] { display: none; }
.intro-tip__text { font-weight: 600; }
.intro-tip__button { border: 0; background: #111; color: #fff; border-radius: 999px; padding: 6px 14px; font-weight: 700; cursor: pointer; }
.intro-tip__button:active { transform: translateY(1px); }

/* Venue detail card */
.venue-card { position: fixed; left:0; right:0; bottom:0; display:flex; justify-content:center; padding:0 8px; z-index:1250; pointer-events:none; opacity:0; transform: translateY(12px); transition: opacity .18s ease, transform .18s ease; }
.venue-card.show { opacity:1; transform: translateY(0); pointer-events:auto; }
.venue-card__inner { position:relative; width:min(640px, calc(100% - 16px)); background:#fff; border:2px solid #ff6a00; border-radius:18px 18px 0 0; box-shadow:0 -10px 30px rgba(0,0,0,.22); padding:1rem 1rem calc(1rem + env(safe-area-inset-bottom)); display:grid; gap:.55rem; }
.venue-card__handle { width:44px; height:4px; background:#e5e7eb; border-radius:999px; margin:0 auto .15rem; }
.venue-card__header { display:flex; justify-content:space-between; gap:.75rem; align-items:flex-start; }
.venue-card__name { font-size:1.15rem; font-weight:800; }
.venue-card__meta { color:var(--muted); font-size:.9rem; margin:.15rem 0; }
.venue-card__address { color:#374151; font-size:.95rem; }
.venue-card__close { border:1px solid #e5e7eb; background:#fff; border-radius:12px; width:36px; height:36px; font-size:1.1rem; cursor:pointer; }
.venue-card__section-title { font-size:.85rem; font-weight:700; color:#374151; }
.venue-card__badges { display:flex; gap:.35rem; flex-wrap:wrap; }
.chip { display:inline-flex; align-items:center; gap:.35rem; border:1px solid #e5e7eb; border-radius:999px; padding:6px 10px; font-size:.85rem; background:#f9fafb; color:#111; }
.chip-emoji { font-size:1rem; }
.chip-good { background:#e8f7ef; border-color:#bbf7d0; color:#166534; }
.chip-warn { background:#fff1f2; border-color:#fecdd3; color:#9f1239; }
.chip-info { background:#eff6ff; border-color:#bfdbfe; color:#1d4ed8; }
.chip-muted { background:#f3f4f6; border-color:#e5e7eb; color:#4b5563; }
.venue-card__hours { color:#374151; font-size:.9rem; }
.venue-card__hours-next { color:#6b7280; font-size:.85rem; }
.venue-card__note { color:#4b5563; font-size:.95rem; }
.venue-card__name-row { display:flex; align-items:center; justify-content:space-between; gap:.6rem; flex-wrap:wrap; }
.venue-card__rating-inline { display:flex; align-items:center; gap:.35rem; flex-wrap:wrap; }
.rating-display { display:flex; align-items:center; gap:.35rem; }
.rating-display.hidden { display:none; }
.rating-display__stars { display:flex; gap:.2rem; }
.rating-star--display { width:34px; height:34px; border:2px solid #000; border-radius:10px; background:#fff; display:grid; place-items:center; font-size:18px; color:#111; }
.rating-star--display.is-active { color:#ff6a00; }
.rating-display__label { font-weight:800; color:#111; font-size:.95rem; }
.venue-card__rate-btn { border:1px solid #111; background:#fff; border-radius:10px; padding:.5rem .8rem; font-weight:800; cursor:pointer; box-shadow:0 3px 10px rgba(0,0,0,.06); }
.venue-card__rate-btn:hover { background:#ff6a00; color:#fff; border-color:#ff6a00; }
.venue-card__rate-btn:disabled { opacity:.5; cursor:default; }
.venue-card__actions { display:flex; gap:.5rem; flex-wrap:wrap; }
.venue-card__actions .action { border:1px solid #e5e7eb; border-radius:12px; padding:.6rem .9rem; text-decoration:none; color:#111; font-weight:700; background:#fff; box-shadow:0 3px 10px rgba(0,0,0,.06); }
.venue-card__actions .action.primary { background:#111; color:#fff; border-color:#111; }
.venue-card__actions .action.muted { color:#0a66c2; }
.venue-card__fab { position:absolute; right:12px; bottom:12px; display:flex; flex-direction:column; align-items:flex-end; gap:.45rem; pointer-events:none; }
.venue-card__fab-toggle { width:52px; height:52px; border-radius:50%; border:0; background:#111; color:#fff; font-size:28px; font-weight:800; box-shadow:0 10px 28px rgba(0,0,0,.2); cursor:pointer; pointer-events:auto; }
.venue-card__fab-toggle:active { transform:translateY(1px); }
.venue-card__fab-menu { display:none; background:#fff; border:1px solid #e5e7eb; border-radius:14px; box-shadow:0 12px 32px rgba(0,0,0,.2); padding:6px; min-width:180px; pointer-events:auto; }
.venue-card.fab-open .venue-card__fab-menu { display:block; }
.venue-card__fab-item { width:100%; border:0; background:transparent; text-align:left; padding:10px 12px; border-radius:10px; font-weight:800; cursor:pointer; }
.venue-card__fab-item:hover { background:#f9fafb; }
.venue-card__upload-hint { position:absolute; left:12px; right:88px; bottom:84px; background:#f9fafb; border:1px solid #e5e7eb; border-radius:12px; padding:.65rem .75rem; color:#4b5563; font-size:.9rem; box-shadow:0 10px 25px rgba(0,0,0,.12); display:flex; align-items:flex-start; gap:.5rem; }
.venue-card__upload-hint.hidden { display:none !important; }
.venue-card__upload-dismiss { border:0; background:transparent; color:#6b7280; font-size:1rem; cursor:pointer; line-height:1; }
.venue-card__upload-dismiss:hover { color:#111; }

/* Rating card */
.rating-card { position:fixed; inset:0; display:flex; align-items:flex-end; justify-content:center; padding:0 8px; z-index:1400; opacity:0; pointer-events:none; transform: translateY(12px); transition: opacity .18s ease, transform .18s ease; }
.rating-card.show { opacity:1; pointer-events:auto; transform: translateY(0); }
.rating-card__backdrop { position:absolute; inset:0; background:rgba(0,0,0,.35); }
.rating-card__panel { position:relative; width:min(540px, calc(100% - 16px)); background:#fff; border:2px solid #111; border-radius:16px 16px 0 0; box-shadow:0 -10px 30px rgba(0,0,0,.24); padding:1rem; z-index:1; display:grid; gap:.75rem; }
.rating-card__header { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.rating-card__title { font-size:1.05rem; font-weight:800; }
.rating-card__subtitle { color:#4b5563; font-size:.95rem; }
.rating-card__close { border:1px solid #e5e7eb; background:#fff; border-radius:12px; width:36px; height:36px; font-size:1.1rem; cursor:pointer; }
.rating-card__stars { display:flex; gap:.5rem; justify-content:center; }
.rating-star { width:48px; height:48px; border:2px solid #000; border-radius:12px; background:#fff; display:grid; place-items:center; font-size:24px; color:#111; cursor:pointer; transition: transform .1s ease; }
.rating-star:hover { transform: translateY(-1px); }
.rating-star.is-active { color:#ff6a00; }
.rating-card__submit { border:1px solid #111; background:#111; color:#fff; border-radius:12px; padding:.65rem; font-weight:800; cursor:pointer; }
.rating-card__submit:disabled { opacity:.5; cursor:default; }

/* Pub crawl */
.crawl-fab { position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 1250; border: none; border-radius: 999px; padding: .75rem 1.1rem; background: #ff6a00; color: #fff; font-weight: 800; box-shadow: 0 8px 24px rgba(0,0,0,.2); cursor: pointer; }
.crawl-fab.hidden { display: none; }
.crawl-fab:active { transform: translateY(1px); }

.crawl-builder { position: fixed; inset: 0; z-index: 1400; display: flex; align-items: flex-end; justify-content: center; }
.crawl-builder.hidden { display: none; }
.crawl-builder__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.45); }
.crawl-builder__panel { position: relative; width: min(580px, 100%); background: #fff; border-radius: 18px 18px 0 0; box-shadow: 0 -10px 30px rgba(0,0,0,.25); padding: 1rem 1rem calc(1rem + env(safe-area-inset-bottom)); z-index: 1; }
.crawl-builder__header { display: flex; align-items: center; justify-content: space-between; }
.crawl-builder__header h2 { margin: 0; font-size: 1.25rem; }
.crawl-builder__close { border: 1px solid #e5e7eb; background: #fff; border-radius: 12px; width: 36px; height: 36px; font-size: 1.1rem; cursor: pointer; }
.crawl-builder__body { display: grid; gap: .75rem; margin-top: .5rem; }
.crawl-builder__section { display: grid; gap: .6rem; }
.crawl-option { width: 100%; border: 2px solid #ff6a00; border-radius: 14px; padding: .75rem .9rem; font-weight: 800; background: #fff; color: #111; text-align: left; cursor: pointer; }
.crawl-option.is-selected { background: #ff6a00; color: #fff; }
.crawl-option:disabled { border-color: #ddd; color: #9ca3af; background: #f3f4f6; cursor: not-allowed; }
.crawl-option.is-loading { opacity: .7; }
.crawl-builder__label { font-weight: 700; color: #374151; }
.crawl-builder__input { width: 100%; border: 1px solid #ddd; border-radius: 12px; padding: .6rem .7rem; font-size: 1rem; }
.crawl-builder__input:disabled { background: #f3f4f6; color: #9ca3af; }
.crawl-builder__suggestions { display: grid; gap: .35rem; }
.crawl-builder__suggestion { border: 1px solid #e5e7eb; border-radius: 10px; padding: .5rem .6rem; text-align: left; background: #fff; font-weight: 600; cursor: pointer; }
.crawl-builder__suggestion:hover { border-color: #ff6a00; }
.crawl-builder__status { font-size: .9rem; color: #4b5563; min-height: 1.2em; }
.crawl-builder__status.error { color: #b91c1c; }
.crawl-builder__status.success { color: #15803d; }
.crawl-order h3 { margin: 0; font-size: 1rem; }
.crawl-builder__order-options { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.crawl-order-option { border: 2px solid #ff6a00; border-radius: 12px; padding: .6rem .7rem; font-weight: 700; background: #fff; cursor: pointer; }
.crawl-order-option.is-selected { background: #ff6a00; color: #fff; }
.crawl-start h3 { margin: 0; font-size: 1rem; }
.crawl-builder__start-options { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.crawl-start-option { border: 2px solid #ff6a00; border-radius: 12px; padding: .6rem .7rem; font-weight: 700; background: #fff; cursor: pointer; }
.crawl-start-option.is-selected { background: #ff6a00; color: #fff; }
.crawl-builder__time-input { border: 1px solid #ddd; border-radius: 12px; padding: .55rem .6rem; font-size: 1rem; }

.crawl-controls { position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 1230; display: flex; gap: .5rem; align-items: center; }
.crawl-controls.hidden { display: none; }
.crawl-control { border: none; border-radius: 999px; padding: .6rem .9rem; background: #ff6a00; color: #fff; font-weight: 700; box-shadow: 0 8px 24px rgba(0,0,0,.2); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.crawl-control--icon { width: 46px; height: 46px; font-size: 1.4rem; padding: 0; }
.crawl-control--icon svg { width: 20px; height: 20px; fill: currentColor; }

.crawl-marker__pin { width: 36px; height: 44px; border-radius: 18px 18px 18px 0; background: #ff6a00; color: #fff; display: grid; place-items: center; font-weight: 800; box-shadow: 0 6px 18px rgba(0,0,0,.25); transform: rotate(-45deg); }
.crawl-marker__pin span { transform: rotate(45deg); }

.crawl-card { position: fixed; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; padding: 0 8px; z-index: 1350; opacity: 0; pointer-events: none; transform: translateY(12px); transition: opacity .18s ease, transform .18s ease; }
.crawl-card.show { opacity: 1; transform: translateY(0); pointer-events: auto; }
.crawl-card__inner { width: min(720px, calc(100% - 16px)); background: #fff; border: 2px solid #ff6a00; border-radius: 20px 20px 0 0; box-shadow: 0 -12px 32px rgba(0,0,0,.22); padding: 1rem 1rem calc(1rem + env(safe-area-inset-bottom)); display: grid; gap: .75rem; }
.crawl-card__handle { width: 48px; height: 4px; background: #e5e7eb; border-radius: 999px; margin: 0 auto; }
.crawl-card__header { display: flex; justify-content: space-between; gap: .6rem; }
.crawl-card__title { font-size: 1.2rem; font-weight: 800; }
.crawl-card__subtitle { color: #6b7280; font-size: .95rem; }
.crawl-card__address { color: #374151; font-size: .95rem; margin-top: .2rem; }
.crawl-card__close { border: 1px solid #e5e7eb; background: #fff; border-radius: 12px; width: 36px; height: 36px; font-size: 1.1rem; cursor: pointer; }
.crawl-card__section-title { font-size: .85rem; font-weight: 700; color: #374151; }
.crawl-card__time-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.crawl-card__time-controls { display: inline-flex; align-items: center; gap: .5rem; }
.crawl-card__time-btn { width: 32px; height: 32px; border-radius: 8px; border: 1px solid #ddd; background: #fff; font-size: 1.2rem; cursor: pointer; }
.crawl-card__time-length { font-weight: 700; }
.crawl-card__controls { border-top: 1px solid #f3f4f6; padding-top: .75rem; display: grid; gap: .75rem; }
.crawl-card__remove-btn { border: 1px solid #f87171; background: #fee2e2; color: #991b1b; border-radius: 12px; padding: .6rem .75rem; font-weight: 800; cursor: pointer; text-align: left; }
.crawl-card__toggle { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .6rem; font-weight: 700; color: #111; }
.crawl-card__toggle-input { display: none; }
.crawl-card__toggle-track { width: 44px; height: 24px; background: #e5e7eb; border-radius: 999px; position: relative; transition: background .2s ease; }
.crawl-card__toggle-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform .2s ease; box-shadow: 0 2px 6px rgba(0,0,0,.2); }
.crawl-card__toggle-input:checked + .crawl-card__toggle-track { background: #ff6a00; }
.crawl-card__toggle-input:checked + .crawl-card__toggle-track::after { transform: translateX(20px); }
.crawl-card__toggle-label { font-size: .95rem; }
.crawl-card__continue { display: flex; align-items: center; justify-content: space-between; gap: .5rem; border: 1px solid #ff6a00; background: #fff7ed; color: #9a3412; border-radius: 12px; padding: .6rem .75rem; font-weight: 800; cursor: pointer; text-align: left; }
.crawl-card__continue.hidden { display: none; }
.crawl-card__continue-icon { width: 28px; height: 28px; border-radius: 999px; background: #ff6a00; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem; }
.crawl-card__uber { display: grid; gap: .4rem; }
.crawl-card__uber.hidden { display: none; }
.crawl-card__uber-text { color: #111; font-size: .95rem; font-weight: 800; }
.crawl-card__uber-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.crawl-card__uber-btn,
.crawl-card__didi-btn { border: 1px solid #111; background: #111; color: #fff; border-radius: 999px; padding: .4rem .8rem; font-weight: 800; text-decoration: none; }

.crawl-list { position: fixed; left: 0; right: 0; bottom: 0; max-height: 50vh; background: #fff; z-index: 1340; border-top: 1px solid #eee; box-shadow: 0 -10px 30px rgba(0,0,0,.2); overflow: auto; }
.crawl-list.hidden { display: none; }
.crawl-list__header { display: flex; align-items: center; justify-content: space-between; padding: .9rem 1rem; border-bottom: 1px solid #f3f4f6; }
.crawl-list__header h3 { margin: 0; }
.crawl-list__subtitle { margin: .2rem 0 0; color: #6b7280; font-size: .9rem; }
.crawl-list__close { border: 1px solid #e5e7eb; background: #fff; border-radius: 12px; width: 36px; height: 36px; font-size: 1.1rem; cursor: pointer; }
.crawl-list__item { display: flex; justify-content: space-between; gap: .75rem; padding: .75rem 1rem; border-bottom: 1px solid #f3f4f6; cursor: pointer; }
.crawl-list__title { font-weight: 800; }
.crawl-list__meta { color: #6b7280; font-size: .9rem; margin-top: .2rem; }
.crawl-list__time { font-weight: 700; white-space: nowrap; color: #111; }
.crawl-list__uber { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: .35rem; color: #374151; font-size: .9rem; }
.crawl-list__uber-btn { border: 1px solid #111; background: #111; color: #fff; border-radius: 999px; padding: .25rem .7rem; font-weight: 700; text-decoration: none; }
.crawl-list__uber-btn[aria-disabled="true"] { opacity: .5; pointer-events: none; }

.crawl-add { position: fixed; inset: 0; z-index: 1450; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.45); padding: 16px; }
.crawl-add.hidden { display: none; }
.crawl-add__panel { width: min(560px, 100%); background: #fff; border-radius: 18px; padding: 1rem; display: grid; gap: .75rem; box-shadow: 0 10px 30px rgba(0,0,0,.3); }
.crawl-add__header { display: flex; align-items: center; justify-content: space-between; }
.crawl-add__input { border: 1px solid #ddd; border-radius: 12px; padding: .6rem .7rem; font-size: 1rem; }
.crawl-add__close { border: 1px solid #e5e7eb; background: #fff; border-radius: 12px; width: 36px; height: 36px; font-size: 1.1rem; cursor: pointer; }
.crawl-add__results { display: grid; gap: .5rem; max-height: 50vh; overflow: auto; }
.crawl-add__row { border: 1px solid #e5e7eb; border-radius: 12px; padding: .6rem .7rem; text-align: left; background: #fff; display: flex; justify-content: space-between; gap: .6rem; cursor: pointer; font-weight: 700; }
.crawl-add__meta { display: block; color: #6b7280; font-size: .85rem; font-weight: 500; margin-top: .2rem; }
.crawl-add__action { color: #ff6a00; font-weight: 800; }
.crawl-add__empty { color: #6b7280; font-size: .9rem; padding: .5rem; }

/* Header height overrides */
.toolbar { height: 52px; min-height: 52px; padding: 0 .8rem; align-items: center; }
.toolbar h1 { margin: 0; line-height: 1; }
.menu-btn { width: 36px; height: 36px; padding: 0; }