/* /Components/Layout/MainLayout.razor.rz.scp.css */
.topbar[b-4kxegkxtl4] {
    background: var(--nav-bg);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--nav-border-color);
    display: flex;
    align-items: center;
    padding: 0 28px;
    height: 54px;
    gap: 20px;
    position: sticky;
    top: 0;
    /* Must outrank every in-page overlay z-index (Map.razor.css / EventsMap.razor.css use up
       to 1000 for their status pill and search-results overlay) — those elements sit in
       containers with position:relative but no z-index of their own, so they don't get their
       own stacking context and their z-index competes directly against this navbar's at the
       page root. Otherwise the map renders over the user dropdown menu. */
    z-index: 1100;
}

.logo[b-4kxegkxtl4] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--on-nav);
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.01em;
    text-decoration: none;
    flex-shrink: 0;
    transition: opacity .15s;
}

.logo:hover[b-4kxegkxtl4] { opacity: .85; }

.logo-mark[b-4kxegkxtl4] {
    width: 30px;
    height: 30px;
    border-radius: 7px;
    background: var(--logo-mark-bg);
    border: 1.5px solid var(--logo-mark-border);
    box-shadow: var(--logo-mark-shadow);
    display: grid;
    place-items: center;
    overflow: hidden;
    transition: background .35s, border-color .35s, box-shadow .35s;
    animation: var(--logo-pulse, none);
    flex-shrink: 0;
}

.logo-icon[b-4kxegkxtl4] {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.topbar-nav[b-4kxegkxtl4] {
    display: flex;
    gap: 2px;
    flex: 1;
}

.topbar-right[b-4kxegkxtl4] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.nav-link[b-4kxegkxtl4] {
    color: var(--nav-text);
    font-size: 13.5px;
    padding: 6px 12px;
    border-radius: 5px;
    cursor: pointer;
    transition: color .2s, text-shadow .2s;
    text-decoration: none;
}

.nav-link:hover[b-4kxegkxtl4] {
    color: var(--nav-text-hover-c);
    text-shadow: var(--nav-link-hover-shadow);
}

.theme-toggle[b-4kxegkxtl4] {
    background: transparent;
    color: var(--toggle-color);
    border: 1px solid var(--toggle-border);
    box-shadow: var(--toggle-shadow);
    border-radius: 4px;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
    transition: color .3s, border-color .3s, box-shadow .3s;
}

.theme-toggle:hover[b-4kxegkxtl4] { color: var(--toggle-hover-color); }

/* ── User menu (details/summary dropdown) ── */

.user-menu[b-4kxegkxtl4] {
    position: relative;
}

.user-menu summary[b-4kxegkxtl4] { list-style: none; }
.user-menu summary[b-4kxegkxtl4]::-webkit-details-marker { display: none; }

.user-chip[b-4kxegkxtl4] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 10px 4px 4px;
    border-radius: 22px;
    border: 1px solid var(--user-chip-bd);
    cursor: pointer;
    transition: background .15s, border-color .2s;
    user-select: none;
}

.user-chip:hover[b-4kxegkxtl4] {
    background: var(--user-chip-hover-bg);
    border-color: var(--user-chip-open-bd);
}

.user-menu[open] .user-chip[b-4kxegkxtl4] {
    background: var(--user-chip-open-bg);
    border-color: var(--user-chip-open-bd);
}

.user-avatar[b-4kxegkxtl4] {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    object-fit: cover;
    border: 1.5px solid var(--user-avatar-bd);
    flex-shrink: 0;
}

.user-name[b-4kxegkxtl4] {
    color: var(--user-name-c);
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-caret[b-4kxegkxtl4] {
    color: var(--user-caret-c);
    font-size: 10px;
    transition: transform .2s;
    line-height: 1;
}

.user-menu[open] .user-caret[b-4kxegkxtl4] {
    transform: rotate(180deg);
}

.user-dropdown[b-4kxegkxtl4] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 180px;
    background: var(--dropdown-bg);
    border: 1px solid var(--dropdown-bd);
    border-radius: 10px;
    box-shadow: 0 8px 32px rgba(0,0,0,.18);
    padding: 6px;
    z-index: 200;
    animation: dropdown-in-b-4kxegkxtl4 .12s ease;
}

@keyframes dropdown-in-b-4kxegkxtl4 {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.dropdown-item[b-4kxegkxtl4] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 6px;
    color: var(--dropdown-item-c);
    font-size: 13.5px;
    text-decoration: none;
    transition: background .12s, color .12s;
}

.dropdown-item:hover[b-4kxegkxtl4] {
    background: var(--dropdown-item-hover-bg);
    color: var(--dropdown-item-hover-c);
}

.dropdown-icon[b-4kxegkxtl4] {
    font-size: 14px;
    width: 18px;
    text-align: center;
    opacity: .7;
}

.dropdown-divider[b-4kxegkxtl4] {
    height: 1px;
    background: rgba(192,192,236,.1);
    margin: 4px 6px;
}

.dropdown-item--signout[b-4kxegkxtl4] { color: rgba(255,120,100,.8); }
.dropdown-item--signout:hover[b-4kxegkxtl4] { background: rgba(255,80,60,.08); color: rgba(255,140,120,1); }

.dropdown-item--about[b-4kxegkxtl4] { opacity: 0.7; font-size: 12.5px; }
.dropdown-item--about:hover[b-4kxegkxtl4] { opacity: 1; }

.btn-signin[b-4kxegkxtl4] {
    background: transparent;
    color: var(--tertiary);
    border: 1.5px solid var(--tertiary);
    box-shadow: none;
    padding: 6px 18px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    letter-spacing: .02em;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s, color .3s, border-color .3s;
}

.btn-signin:hover[b-4kxegkxtl4] { background: var(--tertiary-dim); }

.main-content[b-4kxegkxtl4] {
    min-height: calc(100vh - 54px);
}

.not-found[b-4kxegkxtl4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    gap: 12px;
    color: var(--text-2);
}

.not-found h1[b-4kxegkxtl4] {
    font-size: 72px;
    font-weight: 800;
    color: var(--text-3);
    line-height: 1;
}

/* ── Hamburger button ───────────────────────────────── */

.hamburger[b-4kxegkxtl4] {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 36px;
    height: 36px;
    padding: 7px;
    background: none;
    border: none;
    cursor: pointer;
    margin-left: auto;
    flex-shrink: 0;
}

.hamburger span[b-4kxegkxtl4] {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--hamburger-c);
    border-radius: 2px;
    transition: transform .22s ease, opacity .18s ease;
    transform-origin: center;
}

.hamburger.open span:nth-child(1)[b-4kxegkxtl4] { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2)[b-4kxegkxtl4] { opacity: 0; transform: scaleX(0); }
.hamburger.open span:nth-child(3)[b-4kxegkxtl4] { transform: translateY(-7px) rotate(-45deg); }

/* ── Mobile menu panel ──────────────────────────────── */

.mobile-menu[b-4kxegkxtl4] {
    display: none;
    flex-direction: column;
    position: sticky;
    top: 54px;
    z-index: 1099;
    background: var(--mobile-menu-bg);
    border-bottom: 1px solid var(--mobile-menu-bd);
    padding: 8px 0 16px;
    box-shadow: 0 8px 24px rgba(0,0,0,.1);
}

.mobile-menu.open[b-4kxegkxtl4] {
    display: flex;
}

.mobile-nav-link[b-4kxegkxtl4] {
    display: block;
    padding: 12px 24px;
    color: var(--mobile-link-c);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    transition: background .12s, color .12s;
}

.mobile-nav-link:hover[b-4kxegkxtl4],
.mobile-nav-link:active[b-4kxegkxtl4] {
    background: var(--mobile-link-hover-bg);
    color: var(--text);
}

.mobile-nav-link--signout[b-4kxegkxtl4] {
    color: rgba(255,120,100,.8);
}

.mobile-nav-link--signout:hover[b-4kxegkxtl4] {
    background: rgba(255,80,60,.08);
    color: rgba(255,150,130,1);
}

.mobile-menu-divider[b-4kxegkxtl4] {
    height: 1px;
    background: rgba(192,192,236,.1);
    margin: 8px 20px;
}

.mobile-theme-toggle[b-4kxegkxtl4] {
    display: block;
    width: calc(100% - 48px);
    margin: 4px 24px;
    padding: 10px 14px;
    background: transparent;
    color: var(--toggle-color);
    border: 1px solid var(--toggle-border);
    border-radius: 5px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    cursor: pointer;
    text-align: left;
    transition: color .2s, border-color .2s;
}

.mobile-user-row[b-4kxegkxtl4] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 24px 6px;
}

.mobile-user-name[b-4kxegkxtl4] {
    color: var(--mobile-link-c);
    font-size: 13px;
}

.mobile-signin[b-4kxegkxtl4] {
    display: block;
    margin: 8px 24px 0;
    padding: 11px 18px;
    background: transparent;
    color: var(--tertiary);
    border: 1px solid var(--tertiary);
    border-radius: 5px;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    letter-spacing: .03em;
    transition: box-shadow .2s;
}

/* ── Responsive breakpoint ──────────────────────────── */

@media (max-width: 800px) {
    .topbar-nav[b-4kxegkxtl4],
    .topbar-right[b-4kxegkxtl4] {
        display: none;
    }

    .hamburger[b-4kxegkxtl4] {
        display: flex;
    }
}

/* /Components/Pages/About.razor.rz.scp.css */
.about-shell[b-2mh9gegpbl] {
    min-height: calc(100vh - 54px);
    padding: 40px 0 80px;
}

.about-body[b-2mh9gegpbl] {
    max-width: 680px;
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.about-body p[b-2mh9gegpbl] {
    font-size: 16px;
    color: var(--text-2);
    line-height: 1.7;
    margin: 0;
}

.about-body h2[b-2mh9gegpbl] {
    font-size: 20px;
    font-weight: 700;
    color: var(--text);
    margin: 12px 0 0;
}

.about-body ul[b-2mh9gegpbl] {
    margin: 0;
    padding-left: 22px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.about-body li[b-2mh9gegpbl] {
    font-size: 15px;
    color: var(--text-2);
    line-height: 1.6;
}

.about-body a[b-2mh9gegpbl] {
    color: var(--secondary);
}

.about-links[b-2mh9gegpbl] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.about-version[b-2mh9gegpbl] {
    margin-top: 8px;
    font-size: 12px;
    color: var(--text-3);
}
/* /Components/Pages/AddPlace.razor.rz.scp.css */
/* ── Shell ──────────────────────────────────────────────────────── */

.add-shell[b-syl6t6lvmt] {
    padding-bottom: 80px;
}

.section-inner[b-syl6t6lvmt] {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 28px;
}

@media (max-width: 640px) {
    .section-inner[b-syl6t6lvmt] {
        padding: 0 16px;
    }
}

/* ── Headings ───────────────────────────────────────────────────── */

.add-hed[b-syl6t6lvmt] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--text);
    margin: 8px 0 12px;
    line-height: 1.15;
    outline: none;
}

body.dark .add-hed[b-syl6t6lvmt] {
    text-transform: uppercase;
    letter-spacing: .02em;
}

.add-sub[b-syl6t6lvmt] {
    font-size: 15px;
    color: var(--text-2);
    line-height: 1.65;
    max-width: 52ch;
    margin-bottom: 32px;
}

/* ── Step 1 input ───────────────────────────────────────────────── */

.add-input-group[b-syl6t6lvmt] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.add-input[b-syl6t6lvmt] {
    flex: 1;
    min-width: 240px;
    padding: 11px 16px;
    border-radius: 8px;
    border: 1.5px solid var(--card-border);
    background: var(--card-bg);
    color: var(--text);
    font-size: 14px;
    font-family: inherit;
    outline: none;
    transition: border-color .15s;
}

.add-input:focus[b-syl6t6lvmt] { border-color: var(--accent); }

/* ── Error ──────────────────────────────────────────────────────── */

.add-error[b-syl6t6lvmt] {
    background: rgba(229, 57, 53, .08);
    border: 1px solid rgba(229, 57, 53, .3);
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 13.5px;
    color: #C62828;
    margin-top: 12px;
    line-height: 1.5;
}

body.dark .add-error[b-syl6t6lvmt] {
    background: rgba(229, 57, 53, .15);
    border-color: rgba(229, 57, 53, .45);
    color: #EF9A9A;
}

/* ── Map ────────────────────────────────────────────────────────── */

.add-map-wrap[b-syl6t6lvmt] {
    margin-bottom: 0;
    isolation: isolate;
}

.add-map[b-syl6t6lvmt] {
    height: 280px;
    background: var(--page-bg-soft);
}

.add-map-hint[b-syl6t6lvmt] {
    font-size: 11.5px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    letter-spacing: .05em;
    padding: 8px 28px;
    background: var(--page-bg-soft);
    margin: 0;
}

/* ── Form ───────────────────────────────────────────────────────── */

.add-form[b-syl6t6lvmt] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-top: 28px;
}

.form-field[b-syl6t6lvmt] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.form-field--row[b-syl6t6lvmt] {
    flex-direction: row;
    gap: 16px;
}

.form-field--half[b-syl6t6lvmt] {
    flex: 1;
}

.form-label[b-syl6t6lvmt] {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
}

.form-label-row[b-syl6t6lvmt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.btn-generate[b-syl6t6lvmt] {
    font-size: 12px;
    font-weight: 600;
    color: var(--accent, #6366f1);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    white-space: nowrap;
}

    .btn-generate:disabled[b-syl6t6lvmt] {
        opacity: .4;
        cursor: default;
    }

    .btn-generate--busy[b-syl6t6lvmt] {
        opacity: .6;
        cursor: default;
        text-decoration: none;
    }

.add-generate-hint[b-syl6t6lvmt] {
    font-size: 12px;
    color: var(--text-3);
}

.add-ai-notice[b-syl6t6lvmt] {
    font-size: 12px;
    color: #d97706;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
    padding: 6px 10px;
}

.add-citations[b-syl6t6lvmt] {
    margin-top: 8px;
    font-size: 12px;
    color: var(--text-muted, #6b7280);
}

.add-citations__label[b-syl6t6lvmt] {
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 10px;
    display: block;
    margin-bottom: 4px;
}

.add-citations__list[b-syl6t6lvmt] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.add-citations__list a[b-syl6t6lvmt] {
    color: var(--accent, #CE7C38);
    text-decoration: none;
    word-break: break-all;
}

.add-citations__list a:hover[b-syl6t6lvmt] {
    text-decoration: underline;
}

.form-required[b-syl6t6lvmt] {
    color: var(--accent);
}

.form-input[b-syl6t6lvmt] {
    padding: 10px 14px;
    border-radius: 8px;
    border: 1.5px solid var(--card-border);
    background: var(--card-bg);
    color: var(--text);
    font-size: 14px;
    font-family: inherit;
    outline: none;
    transition: border-color .15s, background .3s;
    width: 100%;
    box-sizing: border-box;
}

.form-input:focus[b-syl6t6lvmt] { border-color: var(--accent); }

.form-input--readonly[b-syl6t6lvmt] {
    background: var(--page-bg-soft);
    color: var(--text-2);
    cursor: default;
    border-color: transparent;
}

.form-select[b-syl6t6lvmt] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 36px;
    cursor: pointer;
}

.form-textarea[b-syl6t6lvmt] {
    resize: vertical;
    min-height: 96px;
    line-height: 1.6;
}

/* ── Actions ────────────────────────────────────────────────────── */

.add-actions[b-syl6t6lvmt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 8px;
    flex-wrap: wrap;
}

.add-actions--centered[b-syl6t6lvmt] {
    justify-content: center;
}

.add-submit-group[b-syl6t6lvmt] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

/* ── Success ────────────────────────────────────────────────────── */

.add-success[b-syl6t6lvmt] {
    padding-top: 72px;
    text-align: center;
    max-width: 480px;
    margin: 0 auto;
}

.success-icon[b-syl6t6lvmt] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--tertiary);
    color: #fff;
    font-size: 26px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
}

/* The recovery picker on the success panel: the place is saved, its stop is not (#189). */
.add-recovery[b-syl6t6lvmt] {
    margin: 0 auto 20px;
    max-width: 420px;
    text-align: left;
    border: 1px solid var(--accent);
}

/* ── Manual entry (#212) ─────────────────────────────────────────── */

.add-manual-offer[b-syl6t6lvmt] {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}

.add-manual-hint[b-syl6t6lvmt] {
    margin: 0;
    font-size: 12.5px;
    color: var(--text-2);
}

/* A prompt, not an error: nothing has gone wrong, there is simply no pin yet. */
.add-locate-prompt[b-syl6t6lvmt] {
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--accent);
}

.add-locate-actions[b-syl6t6lvmt] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 12px;
}

.btn-small[b-syl6t6lvmt] {
    font-size: 12px;
    padding: 5px 10px;
}

.add-locate-error[b-syl6t6lvmt] {
    font-size: 12.5px;
    color: var(--text-2);
}
/* /Components/Pages/CompleteProfile.razor.rz.scp.css */
.picker-shell[b-wsgeqrmq75] {
    min-height: calc(100vh - 54px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.picker-card[b-wsgeqrmq75] {
    background: #fff;
    border: 1px solid rgba(160, 148, 210, .22);
    border-radius: 16px;
    padding: 2.5rem 2rem;
    width: 100%;
    max-width: 440px;
    box-shadow: 0 4px 32px rgba(51, 90, 255, .07);
}

.picker-title[b-wsgeqrmq75] {
    font-size: 1.75rem;
    font-weight: 800;
    color: #16122e;
    margin: .25rem 0 .5rem;
    line-height: 1.2;
    text-wrap: balance;
}

.picker-sub[b-wsgeqrmq75] {
    color: #5a5280;
    font-size: .9375rem;
    line-height: 1.55;
    margin: 0 0 1.75rem;
}

/* Validation state rings on the input */
.form-input--ok[b-wsgeqrmq75] {
    border-color: #22c55e !important;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, .15) !important;
    outline: none;
}

.form-input--err[b-wsgeqrmq75] {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, .15) !important;
    outline: none;
}

.field-hint[b-wsgeqrmq75] {
    font-size: .8125rem;
    color: #a098c0;
    margin: .375rem 0 0;
    min-height: 1.2em;
}

.hint--ok[b-wsgeqrmq75]  { color: #22c55e; }
.hint--err[b-wsgeqrmq75] { color: #ef4444; }

.submit-error[b-wsgeqrmq75] {
    color: #ef4444;
    font-size: .875rem;
    margin: .75rem 0 0;
}

.picker-submit[b-wsgeqrmq75] {
    width: 100%;
    justify-content: center;
    margin-top: 1.5rem;
}

/* Dark mode */
body.dark .picker-card[b-wsgeqrmq75] {
    background: #0f1525;
    border-color: rgba(160, 148, 210, .15);
    box-shadow: 0 4px 32px rgba(0, 0, 0, .3);
}

body.dark .picker-title[b-wsgeqrmq75] {
    color: #d8d8f0;
}

body.dark .picker-sub[b-wsgeqrmq75] {
    color: #a098c0;
}
/* /Components/Pages/EventDetail.razor.rz.scp.css */
/* ── Shell (mirrors PlaceDetail.razor.css — CSS isolation scopes per-component) ─ */

.detail-shell[b-31o4af51i3] {
    padding-bottom: 72px;
}

.section-inner[b-31o4af51i3] {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 28px;
}

.detail-map-wrap[b-31o4af51i3] {
    width: 100%;
    margin-bottom: 0;
}

.detail-map[b-31o4af51i3] {
    height: 320px;
    background: var(--page-bg-soft);
}

.detail-back[b-31o4af51i3] {
    display: inline-block;
    margin-top: 28px;
    margin-bottom: 20px;
    font-size: 13px;
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
    letter-spacing: .03em;
    transition: opacity .15s;
}

.detail-back:hover[b-31o4af51i3] { opacity: .72; }

.detail-meta[b-31o4af51i3] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.detail-date[b-31o4af51i3] {
    font-size: 11.5px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    letter-spacing: .06em;
}

.detail-name[b-31o4af51i3] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 38px;
    font-weight: 800;
    letter-spacing: -.025em;
    color: var(--text);
    line-height: 1.15;
    margin-bottom: 12px;
    text-wrap: balance;
}

body.dark .detail-name[b-31o4af51i3] {
    text-transform: uppercase;
    letter-spacing: .01em;
}

.detail-desc[b-31o4af51i3] {
    font-size: 16px;
    line-height: 1.75;
    color: var(--text-2);
    max-width: 65ch;
    margin-bottom: 24px;
}

.detail-facts[b-31o4af51i3] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    border-top: 1px solid var(--card-border);
    padding-top: 24px;
    margin-top: 24px;
}

.detail-fact[b-31o4af51i3] {
    display: flex;
    gap: 16px;
    align-items: baseline;
    flex-wrap: wrap;
}

.detail-fact-label[b-31o4af51i3] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    min-width: 120px;
}

.detail-fact-value[b-31o4af51i3] {
    font-size: 14px;
    color: var(--text);
}

a.detail-fact-value[b-31o4af51i3] {
    color: var(--accent);
    text-decoration: none;
    transition: opacity .15s;
}

a.detail-fact-value:hover[b-31o4af51i3] { opacity: .72; }

.detail-missing[b-31o4af51i3] {
    color: var(--text-2);
    font-size: 15px;
    padding: 40px 0;
}

.chip[b-31o4af51i3] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: var(--tertiary-dim);
    color: var(--tertiary);
}

/* ── Event-specific ─────────────────────────────────────────────── */

.event-cancelled-chip[b-31o4af51i3] {
    background: var(--text-3);
    color: #fff;
}

.event-series-link[b-31o4af51i3] {
    font-size: 14px;
    color: var(--text-2);
    margin-bottom: 16px;
}

.event-series-link a[b-31o4af51i3] {
    color: var(--accent);
    text-decoration: none;
}

.event-series-link a:hover[b-31o4af51i3] { opacity: .72; }

.event-venue[b-31o4af51i3] {
    font-size: 15px;
    color: var(--text-2);
    margin-bottom: 20px;
}

.event-venue a[b-31o4af51i3] {
    color: var(--accent);
    text-decoration: none;
    font-weight: 600;
}

.event-links[b-31o4af51i3] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 24px;
}

.event-link-btn[b-31o4af51i3] {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    background: var(--card-bg);
    border: 1.5px solid var(--card-border);
    color: var(--text);
}

.event-link-btn--primary[b-31o4af51i3] {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}

.event-link-btn:hover[b-31o4af51i3] { opacity: .85; }

.event-calendar-btn[b-31o4af51i3] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 20px;
    margin-top: 12px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    background: var(--tertiary);
    color: #fff;
}

.event-calendar-btn:hover[b-31o4af51i3] { opacity: .88; }
/* /Components/Pages/Events.razor.rz.scp.css */
/* ── Header band ───────────────────────────────────────────────── */

.events-header[b-dt57ek8h0d] {
    background: var(--page-bg-soft);
    padding: 40px 0 28px;
}

.section-inner[b-dt57ek8h0d] {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 28px;
}

.events-hed-row[b-dt57ek8h0d] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.events-hed[b-dt57ek8h0d] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 36px;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--text);
    margin: 8px 0 0;
    line-height: 1.15;
}

.events-map-link[b-dt57ek8h0d] {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-2);
    text-decoration: none;
    white-space: nowrap;
}

.events-map-link:hover[b-dt57ek8h0d] {
    color: var(--text);
    text-decoration: underline;
}

body.dark .events-hed[b-dt57ek8h0d] {
    text-transform: uppercase;
    letter-spacing: .02em;
}

/* ── Body ───────────────────────────────────────────────────────── */

.events-body[b-dt57ek8h0d] {
    padding: 36px 0 64px;
}

.events-empty[b-dt57ek8h0d] {
    color: var(--text-2);
    font-size: 15px;
    padding: 40px 0;
}

.events-group-header[b-dt57ek8h0d] {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
    margin: 32px 0 12px;
}

.events-group-header:first-child[b-dt57ek8h0d] {
    margin-top: 0;
}

/* ── List ───────────────────────────────────────────────────────── */

.events-list[b-dt57ek8h0d] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.event-card[b-dt57ek8h0d] {
    display: block;
    text-decoration: none;
    color: inherit;
    transition: box-shadow .2s, transform .2s;
}

.event-card:hover[b-dt57ek8h0d] {
    box-shadow: var(--card-hover-shadow);
    transform: translateY(-1px);
}

.event-card--cancelled[b-dt57ek8h0d] {
    opacity: .55;
}

.event-card-body[b-dt57ek8h0d] {
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.event-card-title-row[b-dt57ek8h0d] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.event-card-name[b-dt57ek8h0d] {
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
}

.event-card-repeat[b-dt57ek8h0d] {
    font-size: 12px;
    opacity: .7;
}

.event-card-cancelled-badge[b-dt57ek8h0d] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #fff;
    background: var(--text-3);
    border-radius: 4px;
    padding: 2px 6px;
}

.event-card-venue[b-dt57ek8h0d] {
    font-size: 12.5px;
    color: var(--text-2);
}

.event-card-category[b-dt57ek8h0d] {
    color: var(--text-3);
}

.event-card-datetime[b-dt57ek8h0d] {
    font-size: 12px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    letter-spacing: .03em;
}

.event-card-recurrence[b-dt57ek8h0d] {
    font-size: 11.5px;
    color: var(--text-3);
    font-style: italic;
}
/* /Components/Pages/EventSeries.razor.rz.scp.css */
/* ── Shell (mirrors PlaceDetail.razor.css — CSS isolation scopes per-component) ─ */

.detail-shell[b-gqax32yog2] {
    padding-bottom: 72px;
}

.section-inner[b-gqax32yog2] {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 28px;
}

.detail-back[b-gqax32yog2] {
    display: inline-block;
    margin-top: 28px;
    margin-bottom: 20px;
    font-size: 13px;
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
    letter-spacing: .03em;
}

.detail-back:hover[b-gqax32yog2] { opacity: .72; }

.detail-meta[b-gqax32yog2] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.detail-date[b-gqax32yog2] {
    font-size: 11.5px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    letter-spacing: .06em;
}

.detail-name[b-gqax32yog2] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 38px;
    font-weight: 800;
    letter-spacing: -.025em;
    color: var(--text);
    line-height: 1.15;
    margin-bottom: 12px;
    text-wrap: balance;
}

.detail-desc[b-gqax32yog2] {
    font-size: 16px;
    line-height: 1.75;
    color: var(--text-2);
    max-width: 65ch;
    margin-bottom: 24px;
}

.detail-missing[b-gqax32yog2] {
    color: var(--text-2);
    font-size: 15px;
    padding: 20px 0;
}

.chip[b-gqax32yog2] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: var(--tertiary-dim);
    color: var(--tertiary);
}

.event-venue[b-gqax32yog2] {
    font-size: 15px;
    color: var(--text-2);
    margin-bottom: 20px;
}

.event-venue a[b-gqax32yog2] {
    color: var(--accent);
    text-decoration: none;
    font-weight: 600;
}

.event-links[b-gqax32yog2] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 24px;
}

.event-link-btn[b-gqax32yog2] {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    background: var(--card-bg);
    border: 1.5px solid var(--card-border);
    color: var(--text);
}

.event-link-btn--primary[b-gqax32yog2] {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}

/* ── Occurrence dates list ──────────────────────────────────────── */

.series-dates-header[b-gqax32yog2] {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
    border-top: 1px solid var(--card-border);
    padding-top: 24px;
    margin: 24px 0 12px;
}

.series-dates-list[b-gqax32yog2] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.series-date-row[b-gqax32yog2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    text-decoration: none;
    color: var(--text);
    font-size: 14px;
    transition: box-shadow .15s;
}

.series-date-row:hover[b-gqax32yog2] {
    box-shadow: var(--card-hover-shadow);
}

.series-date-row--cancelled[b-gqax32yog2] {
    opacity: .55;
}

.event-card-cancelled-badge[b-gqax32yog2] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #fff;
    background: var(--text-3);
    border-radius: 4px;
    padding: 2px 6px;
}
/* /Components/Pages/EventsMap.razor.rz.scp.css */
/* ── Page shell — flex column so the map fills whatever height is left after the
   toolbar and (optional) chip row, instead of a fixed calc() that would need updating
   every time either row wraps to a second line. ─────────────────────────────────── */

.events-map-page[b-cav690i7y7] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 54px);
}

/* ── Toolbar ────────────────────────────────────────────────────── */

.events-map-toolbar[b-cav690i7y7] {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    padding: 14px 24px;
    border-bottom: 1px solid var(--card-border);
    background: var(--card-bg);
}

.events-list-link[b-cav690i7y7] {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-2);
    text-decoration: none;
    white-space: nowrap;
}

.events-list-link:hover[b-cav690i7y7] {
    color: var(--text);
    text-decoration: underline;
}

.search-box[b-cav690i7y7] {
    flex: 1 1 220px;
    min-width: 160px;
    max-width: 320px;
    padding: 7px 12px;
    border-radius: 8px;
    border: 1px solid var(--card-border);
    background: var(--page-bg-soft);
    color: var(--text);
    font-size: 13.5px;
}

.date-filter-group[b-cav690i7y7] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.filter-btn[b-cav690i7y7] {
    padding: 6px 13px;
    border-radius: 18px;
    border: 1px solid var(--card-border);
    background: var(--card-bg);
    color: var(--text-2);
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s, color .15s, border-color .15s;
}

.filter-btn:hover[b-cav690i7y7] {
    color: var(--text);
}

.filter-btn--active[b-cav690i7y7] {
    background: var(--tertiary);
    color: #fff;
    border-color: var(--tertiary-dark);
}

.custom-range[b-cav690i7y7] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--text-2);
}

.custom-range input[type="date"][b-cav690i7y7] {
    padding: 5px 8px;
    border-radius: 6px;
    border: 1px solid var(--card-border);
    background: var(--page-bg-soft);
    color: var(--text);
    font-size: 13px;
}

/* ── Category chips ─────────────────────────────────────────────── */

.category-chips-row[b-cav690i7y7] {
    padding: 10px 24px;
    border-bottom: 1px solid var(--card-border);
    background: var(--card-bg);
}

.category-chips[b-cav690i7y7] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.chip[b-cav690i7y7] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: var(--tertiary-dim);
    color: var(--tertiary);
    border: 1px solid transparent;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    font-family: inherit;
}

.chip--active[b-cav690i7y7] {
    background: var(--tertiary);
    color: #fff;
    border-color: var(--tertiary-dark);
}

/* ── Map shell ──────────────────────────────────────────────────── */

.events-map-shell[b-cav690i7y7] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
}

#events-map[b-cav690i7y7] {
    height: 100%;
    width: 100%;
}

.map-overlay[b-cav690i7y7] {
    position: absolute;
    z-index: 1000;
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: 8px;
    box-shadow: var(--card-shadow);
}

.map-search-results[b-cav690i7y7] {
    top: 14px;
    left: 14px;
    width: 300px;
    max-height: 280px;
    overflow-y: auto;
    padding: 6px;
}

.search-hint[b-cav690i7y7] {
    padding: 8px 10px;
    font-size: 13px;
    color: var(--text-3);
}

.search-result[b-cav690i7y7] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 6px;
    font-size: 13.5px;
    color: var(--text);
    cursor: pointer;
}

.search-result:hover[b-cav690i7y7] {
    background: var(--tertiary-dim);
}

.search-result-type[b-cav690i7y7] {
    font-size: 13px;
}

/* ── Status pill ────────────────────────────────────────────────── */

.map-status[b-cav690i7y7] {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 900;
    background: rgba(22,18,46,.88);
    color: #fff;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .03em;
    padding: 7px 18px;
    border-radius: 20px;
    pointer-events: none;
    backdrop-filter: blur(6px);
    white-space: nowrap;
    max-width: min(90vw, 560px);
    text-overflow: ellipsis;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,.25);
    transition: opacity .2s;
}

.map-status--loading[b-cav690i7y7] {
    background: rgba(206,124,56,.9);
}

.map-status--truncated[b-cav690i7y7] {
    background: rgba(206, 124, 56, 0.92);
}

.map-status--empty[b-cav690i7y7] {
    background: rgba(90,82,128,.9);
    white-space: normal;
}

/* ── Legend ─────────────────────────────────────────────────────── */

.map-legend[b-cav690i7y7] {
    bottom: 14px;
    right: 14px;
    padding: 8px 12px;
    font-size: 11.5px;
    color: var(--text-2);
}

.legend-dot[b-cav690i7y7] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 6px;
    vertical-align: middle;
}
/* /Components/Pages/Explore.razor.rz.scp.css */
/* ── Page shell — flex column so the map fills whatever height is left after the
   toolbar and (optional) chip row, instead of a fixed calc() that would need updating
   every time either row wraps to a second line. ─────────────────────────────────── */

.explore-map-page[b-vmykaa4fyo] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 54px);
}

/* ── Toolbar ────────────────────────────────────────────────────── */

.explore-map-toolbar[b-vmykaa4fyo] {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    padding: 14px 24px;
    border-bottom: 1px solid var(--card-border);
    background: var(--card-bg);
}

.explore-list-link[b-vmykaa4fyo] {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-2);
    text-decoration: none;
    white-space: nowrap;
}

.explore-list-link:hover[b-vmykaa4fyo] {
    color: var(--text);
    text-decoration: underline;
}

.search-box[b-vmykaa4fyo] {
    flex: 1 1 220px;
    min-width: 160px;
    max-width: 320px;
    padding: 7px 12px;
    border-radius: 8px;
    border: 1px solid var(--card-border);
    background: var(--page-bg-soft);
    color: var(--text);
    font-size: 13.5px;
}

/* ── Category chips ─────────────────────────────────────────────── */

.category-chips-row[b-vmykaa4fyo] {
    padding: 10px 24px;
    border-bottom: 1px solid var(--card-border);
    background: var(--card-bg);
}

.category-chips[b-vmykaa4fyo] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.chip[b-vmykaa4fyo] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: var(--tertiary-dim);
    color: var(--tertiary);
    border: 1px solid transparent;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    font-family: inherit;
}

.chip--active[b-vmykaa4fyo] {
    background: var(--tertiary);
    color: #fff;
    border-color: var(--tertiary-dark);
}

/* ── Map shell ──────────────────────────────────────────────────── */

.explore-map-shell[b-vmykaa4fyo] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
}

#explore-map[b-vmykaa4fyo] {
    height: 100%;
    width: 100%;
}

.map-overlay[b-vmykaa4fyo] {
    position: absolute;
    z-index: 1000;
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: 8px;
    box-shadow: var(--card-shadow);
}

.map-search-results[b-vmykaa4fyo] {
    top: 14px;
    left: 14px;
    width: 300px;
    max-height: 280px;
    overflow-y: auto;
    padding: 6px;
}

.search-hint[b-vmykaa4fyo] {
    padding: 8px 10px;
    font-size: 13px;
    color: var(--text-3);
}

.search-result[b-vmykaa4fyo] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 6px;
    font-size: 13.5px;
    color: var(--text);
    cursor: pointer;
}

.search-result:hover[b-vmykaa4fyo] {
    background: var(--tertiary-dim);
}

/* ── Status bar ──────────────────────────────────── */

.map-status[b-vmykaa4fyo] {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 900;
    background: rgba(22,18,46,.88);
    color: #fff;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .03em;
    padding: 7px 18px;
    border-radius: 20px;
    pointer-events: none;
    backdrop-filter: blur(6px);
    white-space: nowrap;
    box-shadow: 0 2px 12px rgba(0,0,0,.25);
    transition: opacity .2s;
}

.map-status--loading[b-vmykaa4fyo] {
    background: rgba(123,92,240,.88);
}

.map-status--truncated[b-vmykaa4fyo] {
    background: rgba(206, 124, 56, 0.92);
}

/* ── Add to trip (#189) ──────────────────────────────────────────

   Bottom-left, which is the one free corner: Leaflet's zoom control defaults to top-left
   and .map-search-results already sits on top of it, the geolocation control is top-right,
   and .map-status runs along the bottom centre.

   Sized in min()/% rather than the hard 300px .map-search-results uses. This file has no
   media query at all, so that panel takes 300 of a 375px viewport; a second overlay should
   not repeat it. The internal scroll is what keeps Cancel reachable when the trip list is
   long -- /me/trips is not paginated. */
/* One panel, not two. A failed add leaves the picker open *and* produces a message, and
   two overlays pinned to the same corner put the message over the picker's own Cancel. */
.map-add-panel[b-vmykaa4fyo] {
    bottom: 14px;
    left: 14px;
    width: min(320px, calc(100% - 28px));
    max-height: min(70%, 480px);
    overflow-y: auto;
}

.map-add-result[b-vmykaa4fyo] {
    padding: 10px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.map-add-viewtrip[b-vmykaa4fyo] {
    margin-left: 6px;
    font-weight: 700;
    color: var(--accent);
}

/* The button inside a Leaflet popup, which is outside this component's scope -- popups are
   built as HTML strings by tripperist-map.js, so a scoped selector would never match. */
[b-vmykaa4fyo] .leaflet-popup-content .map-popup-add {
    margin-top: 6px;
    font-size: 12px;
    font-weight: 600;
    padding: 5px 9px;
    border: 1px solid var(--card-border, #d7d7e0);
    border-radius: 8px;
    background: transparent;
    color: var(--accent, #335AFF);
    cursor: pointer;
}

[b-vmykaa4fyo] .leaflet-popup-content .map-popup-add:hover { border-color: var(--accent, #335AFF); }
/* /Components/Pages/ExploreList.razor.rz.scp.css */
/* ── Header band ───────────────────────────────────────────────── */

.explore-header[b-ydo7evtbma] {
    background: var(--page-bg-soft);
    padding: 40px 0 28px;
}

.section-inner[b-ydo7evtbma] {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 28px;
}

.explore-hed-row[b-ydo7evtbma] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

.explore-hed[b-ydo7evtbma] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 36px;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--text);
    margin: 8px 0 0;
    line-height: 1.15;
}

.explore-map-link[b-ydo7evtbma] {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-2);
    text-decoration: none;
    white-space: nowrap;
}

.explore-map-link:hover[b-ydo7evtbma] {
    color: var(--text);
    text-decoration: underline;
}

body.dark .explore-hed[b-ydo7evtbma] {
    text-transform: uppercase;
    letter-spacing: .02em;
}

/* ── Search ─────────────────────────────────────────────────────── */

.explore-controls[b-ydo7evtbma] {
    margin-bottom: 18px;
}

.search-input[b-ydo7evtbma] {
    width: 100%;
    max-width: 480px;
    padding: 10px 16px;
    border-radius: 8px;
    border: 1.5px solid var(--card-border);
    background: var(--card-bg);
    color: var(--text);
    font-size: 14px;
    font-family: inherit;
    outline: none;
    transition: border-color .15s, background .15s;
}

.search-input[b-ydo7evtbma]::placeholder { color: var(--text-3); }

.search-input:focus[b-ydo7evtbma] {
    border-color: var(--accent);
    background: var(--card-bg);
}

/* ── Category chips ─────────────────────────────────────────────── */

.category-chips[b-ydo7evtbma] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.chip[b-ydo7evtbma] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: var(--tertiary-dim);
    color: var(--tertiary);
    border: 1px solid transparent;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    font-family: inherit;
    text-decoration: none;
}

.chip--active[b-ydo7evtbma] {
    background: var(--tertiary);
    color: #fff;
    border-color: var(--tertiary-dark);
}

/* ── Body ───────────────────────────────────────────────────────── */

.explore-body[b-ydo7evtbma] {
    padding: 36px 0 64px;
}

.explore-count[b-ydo7evtbma] {
    font-size: 12px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    letter-spacing: .06em;
    margin-bottom: 20px;
}

.explore-empty[b-ydo7evtbma] {
    color: var(--text-2);
    font-size: 15px;
    padding: 40px 0;
}

/* ── Grid ───────────────────────────────────────────────────────── */

.explore-grid[b-ydo7evtbma] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 16px;
}

.explore-card[b-ydo7evtbma] {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    min-height: 160px;
    transition: box-shadow .2s, transform .2s;
}

.explore-card:hover[b-ydo7evtbma] {
    box-shadow: var(--card-hover-shadow);
    transform: translateY(-2px);
}

.explore-card-body[b-ydo7evtbma] {
    padding: 20px 20px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.explore-card-name[b-ydo7evtbma] {
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
    line-height: 1.3;
}

.explore-card-desc[b-ydo7evtbma] {
    font-size: 12.5px;
    color: var(--text-2);
    line-height: 1.55;
    margin: 0;
}

/* The body is the link; the footer is not, so it can hold a real button (#189). */
.explore-card-link[b-ydo7evtbma] {
    display: flex;
    flex-direction: column;
    flex: 1;
    text-decoration: none;
    color: inherit;
}

.explore-card-footer[b-ydo7evtbma] {
    padding: 12px 20px 16px;
    border-top: 1px solid var(--card-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.explore-card-cta[b-ydo7evtbma] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--accent);
    text-decoration: none;
}

.explore-card-add[b-ydo7evtbma] {
    font-size: 12px;
    font-weight: 600;
    padding: 6px 10px;
    border: 1px solid var(--card-border);
    border-radius: 8px;
    background: transparent;
    color: var(--text);
    cursor: pointer;
    white-space: nowrap;
}

.explore-card-add:hover:not(:disabled)[b-ydo7evtbma] {
    border-color: var(--accent);
    color: var(--accent);
}

.explore-card-add:disabled[b-ydo7evtbma] { opacity: .5; cursor: default; }

.explore-viewtrip[b-ydo7evtbma] { margin-left: 6px; font-weight: 700; color: var(--accent); }

/* ── Pagination ─────────────────────────────────────────────────── */

.explore-pagination[b-ydo7evtbma] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 32px;
}

.pagination-btn[b-ydo7evtbma] {
    padding: 7px 16px;
    border-radius: 8px;
    border: 1px solid var(--card-border);
    background: var(--card-bg);
    color: var(--text);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
}

.pagination-btn:disabled[b-ydo7evtbma] {
    opacity: .4;
    cursor: default;
}

.pagination-status[b-ydo7evtbma] {
    font-size: 12.5px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
}

/* The picker is a child component now, so ::deep is what reaches it. The separator and the
   banner's frame belong to the host: the same picker renders with a card around it and, for a
   resumed add, with none. */
.explore-card[b-ydo7evtbma]  .trip-picker { border-top: 1px solid var(--card-border); }

.explore-resume[b-ydo7evtbma] {
    margin-bottom: 20px;
    border: 1px solid var(--accent);
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* ── Sections ──────────────────────────────────────────────────────── */

.home-section[b-lceaamoc1b] {
    padding: 36px 0 48px;
}

.home-section--alt[b-lceaamoc1b] {
    background: var(--page-bg-soft);
}

.home-section--dark[b-lceaamoc1b] {
    background: var(--dark-section-bg);
    padding: 72px 0;
}

.section-inner--centered[b-lceaamoc1b] {
    text-align: center;
}

.section-hed[b-lceaamoc1b] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--text);
    margin-top: 6px;
    margin-bottom: 4px;
    transition: color .3s;
}

.section-sub[b-lceaamoc1b] {
    font-size: 14.5px;
    color: var(--text-2);
    line-height: 1.65;
    margin-top: 4px;
    margin-bottom: 20px;
    max-width: 520px;
}

.section-hed--light[b-lceaamoc1b] {
    color: #ffffff;
    font-size: 32px;
}

body.dark .section-hed[b-lceaamoc1b] {
    text-transform: uppercase;
    letter-spacing: .02em;
}

/* ── Place of the Day ──────────────────────────────────────────────── */

.potd-card[b-lceaamoc1b] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    box-shadow: var(--card-shadow);
    border-radius: 14px;
    padding: 32px 36px;
    text-decoration: none;
    color: inherit;
    transition: box-shadow .2s, transform .2s, background .35s, border-color .35s;
    max-width: 680px;
}

.potd-card:hover[b-lceaamoc1b] {
    box-shadow: var(--card-hover-shadow);
    transform: translateY(-2px);
}

.potd-meta[b-lceaamoc1b] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.potd-date[b-lceaamoc1b] {
    font-size: 11.5px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    letter-spacing: .06em;
}

.potd-name[b-lceaamoc1b] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--text);
    margin-bottom: 8px;
    line-height: 1.15;
}

.potd-desc[b-lceaamoc1b] {
    font-size: 14.5px;
    color: var(--text-2);
    line-height: 1.65;
    margin-bottom: 24px;
}

.potd-cta[b-lceaamoc1b] {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--accent);
}

/* ── Bento grid ────────────────────────────────────────────────────── */

.bento-grid[b-lceaamoc1b] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
}

.bento-card[b-lceaamoc1b] {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    min-height: 140px;
}

.bento-img[b-lceaamoc1b] {
    height: 110px;
    background: var(--accent-dim);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 38px;
    flex-shrink: 0;
    border-bottom: 1px solid var(--card-border);
}

.bento-card-body[b-lceaamoc1b] {
    padding: 16px 20px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.bento-name[b-lceaamoc1b] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.3;
}

.bento-desc[b-lceaamoc1b] {
    font-size: 12.5px;
    color: var(--text-2);
    line-height: 1.5;
    margin: 0;
    flex: 1;
}

.bento-foot[b-lceaamoc1b] {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
    padding: 10px 20px 14px;
    border-top: 1px solid var(--card-border);
    font-size: 11.5px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    letter-spacing: .02em;
}

.bento-contributor[b-lceaamoc1b] {
    color: var(--accent);
    font-weight: 600;
}

.bento-foot-sep[b-lceaamoc1b] {
    color: var(--text-3);
    opacity: .5;
}

.bento-age[b-lceaamoc1b] {
    color: var(--text-3);
    white-space: nowrap;
}

/* ── Map ───────────────────────────────────────────────────────────── */

.map-container[b-lceaamoc1b] {
    position: relative;
    height: 360px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--card-border);
    box-shadow: var(--card-shadow);
    background: var(--page-bg-soft);
}

.map-overlay-btn[b-lceaamoc1b] {
    position: absolute;
    bottom: 14px;
    right: 14px;
    z-index: 500;
    font-size: 13px;
    padding: 9px 18px;
    background: #335AFF !important;
    color: #FFFFFF !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.28);
}

/* ── Geolocation control ───────────────────────────────────────────── */

.map-geo-btn[b-lceaamoc1b] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 7px 12px;
    background: #fff;
    border: 2px solid rgba(0,0,0,.2);
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    color: #333;
    cursor: pointer;
    box-shadow: 0 1px 5px rgba(0,0,0,.2);
    white-space: nowrap;
    transition: background .15s;
    margin-top: 10px;
    margin-right: 10px;
}

.map-geo-btn:hover:not(:disabled)[b-lceaamoc1b] {
    background: #f4f4f4;
}

.map-geo-btn:disabled[b-lceaamoc1b] {
    opacity: .7;
    cursor: default;
}

.map-geo-notice[b-lceaamoc1b] {
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    background: rgba(26, 47, 85, 0.92);
    color: #fff;
    font-size: 13px;
    padding: 10px 18px;
    border-radius: 8px;
    max-width: 340px;
    text-align: center;
    pointer-events: none;
    backdrop-filter: blur(4px);
}

/* ── Download section ──────────────────────────────────────────────── */

.download-sub[b-lceaamoc1b] {
    color: rgba(255,255,255,.6);
    font-size: 15px;
    max-width: 42ch;
    margin: 0 auto 32px;
    line-height: 1.65;
}

.download-badges[b-lceaamoc1b] {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

.badge-placeholder[b-lceaamoc1b] {
    display: inline-flex;
    align-items: center;
    border: 1.5px solid rgba(255,255,255,.2);
    color: rgba(255,255,255,.5);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .06em;
    padding: 10px 24px;
    border-radius: 8px;
    font-family: 'SF Mono', 'Courier New', monospace;
}

/* ── Footer ────────────────────────────────────────────────────────── */

.site-footer[b-lceaamoc1b] {
    background: var(--footer-bg);
    border-top: 1px solid rgba(255,255,255,.06);
    padding: 28px 0;
}

.footer-inner[b-lceaamoc1b] {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 28px;
    display: flex;
    align-items: center;
    gap: 28px;
    flex-wrap: wrap;
}

.footer-brand[b-lceaamoc1b] {
    font-size: 15px;
    font-weight: 700;
    color: rgba(255,255,255,.5);
    letter-spacing: -.01em;
}

.footer-nav[b-lceaamoc1b] {
    display: flex;
    gap: 20px;
    flex: 1;
}

.footer-nav a[b-lceaamoc1b] {
    font-size: 13px;
    color: rgba(255,255,255,.4);
    text-decoration: none;
    transition: color .15s;
}

.footer-nav a:hover[b-lceaamoc1b] { color: rgba(255,255,255,.75); }

.footer-copy[b-lceaamoc1b] {
    font-size: 12px;
    color: rgba(255,255,255,.25);
    font-family: 'SF Mono', 'Courier New', monospace;
}
/* /Components/Pages/MyPlaces.razor.rz.scp.css */
.my-shell[b-ls6ehmfi8m] {
    padding: 40px 0 64px;
}

.my-hed[b-ls6ehmfi8m] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: clamp(2rem, 5vw, 3rem);
    font-weight: 800;
    letter-spacing: -.025em;
    color: var(--text);
    margin: 0 0 32px;
}

/* Mirrors .trips-new on the Trips page — same page shape (a list of the user's own
   things plus a create action), so the same treatment rather than a second idiom.
   An anchor rather than a button because this navigates to /add-place instead of
   expanding a form in place, hence the explicit inline-block and text-decoration
   that .trips-new gets for free. */
.my-new[b-ls6ehmfi8m] {
    display: inline-block;
    border: 1px dashed var(--card-border);
    background: none;
    border-radius: 10px;
    padding: 9px 15px;
    margin-bottom: 20px;
    color: var(--tertiary-dark);
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}

.my-new:hover[b-ls6ehmfi8m] {
    border-style: solid;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
}

/* ── Tabs ─────────────────────────────────────────── */
.my-tabs[b-ls6ehmfi8m] {
    display: flex;
    gap: 4px;
    border-bottom: 2px solid var(--card-border);
    margin-bottom: 28px;
}

.my-tab[b-ls6ehmfi8m] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 20px;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    font-family: inherit;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-2);
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}

.my-tab:hover[b-ls6ehmfi8m] {
    color: var(--text);
}

.my-tab--active[b-ls6ehmfi8m] {
    color: var(--text);
    border-bottom-color: var(--accent);
}

.my-tab-badge[b-ls6ehmfi8m] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    background: var(--accent);
    color: #fff;
    border-radius: 9px;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
}

/* ── Empty states ─────────────────────────────────── */
.my-empty[b-ls6ehmfi8m] {
    color: var(--text-2);
    font-size: 0.95rem;
    padding: 32px 0;
}

.my-empty--error[b-ls6ehmfi8m] {
    color: var(--status-rejected);
}

.my-empty a[b-ls6ehmfi8m] {
    color: var(--accent);
    text-decoration: none;
}

.my-empty a:hover[b-ls6ehmfi8m] {
    text-decoration: underline;
}

/* ── Card grid ────────────────────────────────────── */
.my-grid[b-ls6ehmfi8m] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

.my-card[b-ls6ehmfi8m] {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: 10px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: background .35s, border-color .35s;
}

.my-card-header[b-ls6ehmfi8m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.my-card-date[b-ls6ehmfi8m] {
    font-size: 0.78rem;
    color: var(--text-3);
}

.my-card-name[b-ls6ehmfi8m] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -.01em;
    color: var(--text);
    margin: 0;
    line-height: 1.3;
}

.my-card-category[b-ls6ehmfi8m] {
    font-size: 0.82rem;
    color: var(--text-2);
    margin: 0;
}

/* ── Status badges ────────────────────────────────── */
.my-badge[b-ls6ehmfi8m] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.my-badge--private[b-ls6ehmfi8m] {
    background: var(--accent-dim);
    color: var(--text-2);
}

.my-badge--submitted[b-ls6ehmfi8m] {
    background: rgba(51,90,255,.10);
    color: var(--accent);
}

.my-badge--approved[b-ls6ehmfi8m] {
    background: #EBF7EC;
    color: #2E7D32;
}

.my-badge--rejected[b-ls6ehmfi8m] {
    background: #FEECEC;
    color: #C62828;
}

body.dark .my-badge--approved[b-ls6ehmfi8m] {
    background: rgba(82,192,90,.1);
    color: #52C05A;
}

body.dark .my-badge--rejected[b-ls6ehmfi8m] {
    background: rgba(240,80,80,.1);
    color: #F05050;
}

/* ── Reviewer note ────────────────────────────────── */
.my-card-note[b-ls6ehmfi8m] {
    background: rgba(229,57,53,.06);
    border-left: 3px solid #E53935;
    padding: 8px 12px;
    border-radius: 0 6px 6px 0;
    font-size: 0.83rem;
    color: var(--text);
    line-height: 1.4;
}

.my-card-note-label[b-ls6ehmfi8m] {
    font-weight: 600;
    display: block;
    margin-bottom: 2px;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #C62828;
}

/* ── Card actions ─────────────────────────────────── */
.my-card-actions[b-ls6ehmfi8m] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.my-confirm-inline[b-ls6ehmfi8m] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.83rem;
    color: var(--text);
}

.my-action-error[b-ls6ehmfi8m] {
    font-size: 0.82rem;
    color: #C62828;
    margin: 0;
}

body.dark .my-action-error[b-ls6ehmfi8m] { color: #F05050; }

/* ── Small button variants ────────────────────────── */
.btn-sm[b-ls6ehmfi8m] {
    padding: 5px 14px;
    font-size: 0.82rem;
}

.btn-danger[b-ls6ehmfi8m] {
    background: #E53935;
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-family: inherit;
    font-weight: 600;
    transition: background 0.15s;
}

.btn-danger:hover[b-ls6ehmfi8m] {
    background: #C62828;
}

.btn-ghost[b-ls6ehmfi8m] {
    background: none;
    color: var(--text-2);
    border: none;
    cursor: pointer;
    font-family: inherit;
    font-weight: 500;
    padding: 5px 8px;
    border-radius: 6px;
    transition: color 0.15s, background 0.15s;
}

.btn-ghost:hover[b-ls6ehmfi8m] {
    color: var(--text);
    background: var(--accent-dim);
}
/* /Components/Pages/PlaceDetail.razor.rz.scp.css */
/* ── Shell ──────────────────────────────────────────────────────── */

.detail-shell[b-nfylaj3w5m] {
    padding-bottom: 72px;
}

.section-inner[b-nfylaj3w5m] {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 28px;
}

/* ── Map ────────────────────────────────────────────────────────── */

.detail-map-wrap[b-nfylaj3w5m] {
    width: 100%;
    margin-bottom: 0;
}

.detail-map[b-nfylaj3w5m] {
    height: 320px;
    background: var(--page-bg-soft);
}

/* ── Back link ──────────────────────────────────────────────────── */

.detail-back[b-nfylaj3w5m] {
    display: inline-block;
    margin-top: 28px;
    margin-bottom: 20px;
    font-size: 13px;
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
    letter-spacing: .03em;
    transition: opacity .15s;
}

.detail-back:hover[b-nfylaj3w5m] { opacity: .72; }

/* ── Meta row ───────────────────────────────────────────────────── */

.detail-meta[b-nfylaj3w5m] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.detail-date[b-nfylaj3w5m] {
    font-size: 11.5px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    letter-spacing: .06em;
}

/* ── Name ───────────────────────────────────────────────────────── */

.detail-name[b-nfylaj3w5m] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 38px;
    font-weight: 800;
    letter-spacing: -.025em;
    color: var(--text);
    line-height: 1.15;
    margin-bottom: 20px;
    text-wrap: balance;
    outline: none;
}

body.dark .detail-name[b-nfylaj3w5m] {
    text-transform: uppercase;
    letter-spacing: .01em;
}

/* ── Description ────────────────────────────────────────────────── */

.detail-desc[b-nfylaj3w5m] {
    font-size: 16px;
    line-height: 1.75;
    color: var(--text-2);
    max-width: 65ch;
    margin-bottom: 36px;
}

/* ── Facts ──────────────────────────────────────────────────────── */

.detail-facts[b-nfylaj3w5m] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    border-top: 1px solid var(--card-border);
    padding-top: 24px;
}

.detail-fact[b-nfylaj3w5m] {
    display: flex;
    gap: 16px;
    align-items: baseline;
    flex-wrap: wrap;
}

.detail-fact-label[b-nfylaj3w5m] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    min-width: 120px;
}

.detail-fact-value[b-nfylaj3w5m] {
    font-size: 14px;
    color: var(--text);
}

a.detail-fact-value[b-nfylaj3w5m] {
    color: var(--accent);
    text-decoration: none;
    transition: opacity .15s;
}

a.detail-fact-value:hover[b-nfylaj3w5m] { opacity: .72; }

.detail-source-link[b-nfylaj3w5m] {
    font-size: 14px;
    color: var(--accent);
    text-decoration: none;
    transition: opacity .15s;
}

.detail-source-link:hover[b-nfylaj3w5m] { opacity: .72; }

/* ── Upcoming events ────────────────────────────────────────────── */

.place-events-header[b-nfylaj3w5m] {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
    border-top: 1px solid var(--card-border);
    padding-top: 24px;
    margin: 24px 0 12px;
}

.place-events-list[b-nfylaj3w5m] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.place-event-row[b-nfylaj3w5m] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    text-decoration: none;
    color: var(--text);
    font-size: 14px;
    transition: box-shadow .15s;
}

.place-event-row:hover[b-nfylaj3w5m] {
    box-shadow: var(--card-hover-shadow);
}

.place-event-row--cancelled[b-nfylaj3w5m] {
    opacity: .55;
}

.place-event-name[b-nfylaj3w5m] {
    font-weight: 600;
}

.place-event-date[b-nfylaj3w5m] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: var(--text-3);
    white-space: nowrap;
}

.event-card-cancelled-badge[b-nfylaj3w5m] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #fff;
    background: var(--text-3);
    border-radius: 4px;
    padding: 2px 6px;
}

/* ── Missing / error ────────────────────────────────────────────── */

.detail-missing[b-nfylaj3w5m] {
    color: var(--text-2);
    font-size: 15px;
    padding: 40px 0;
}
/* /Components/Pages/Releases.razor.rz.scp.css */
.releases-shell[b-ru25qw4ut8] {
    min-height: calc(100vh - 54px);
    padding: 40px 0 80px;
}

.releases-list[b-ru25qw4ut8] {
    margin-top: 32px;
    max-width: 680px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.release-card[b-ru25qw4ut8] {
    border: 1px solid var(--card-border);
    border-radius: 12px;
    background: var(--card-bg);
    padding: 20px 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.release-header[b-ru25qw4ut8] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.release-version-row[b-ru25qw4ut8] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.release-version[b-ru25qw4ut8] {
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.release-current[b-ru25qw4ut8] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--accent, #CE7C38);
    background: color-mix(in srgb, var(--accent, #CE7C38) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent, #CE7C38) 30%, transparent);
    border-radius: 20px;
    padding: 2px 9px;
}

.release-date[b-ru25qw4ut8] {
    font-size: 13px;
    color: var(--text-3);
}

.release-notes[b-ru25qw4ut8] {
    margin: 0;
    padding-left: 20px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.release-notes li[b-ru25qw4ut8] {
    font-size: 15px;
    color: var(--text-2);
    line-height: 1.6;
}
/* /Components/Pages/Settings.razor.rz.scp.css */
.settings-shell[b-0t958zkqna] {
    min-height: calc(100vh - 54px);
    padding: 40px 0 80px;
}

.settings-grid[b-0t958zkqna] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
    margin-top: 32px;
}

.settings-card[b-0t958zkqna] {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: 14px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.settings-card-header[b-0t958zkqna] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.settings-card-icon[b-0t958zkqna] {
    font-size: 20px;
    line-height: 1;
}

.settings-card-title[b-0t958zkqna] {
    font-size: 16px;
    font-weight: 700;
    color: var(--text);
    margin: 0;
}

.settings-card-desc[b-0t958zkqna] {
    font-size: 14px;
    color: var(--text-2);
    line-height: 1.6;
    margin: 0;
}

.settings-note[b-0t958zkqna] {
    font-size: 13px;
    color: var(--text-3);
    line-height: 1.55;
}

.settings-profile-row[b-0t958zkqna] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.settings-avatar[b-0t958zkqna] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--card-border);
    flex-shrink: 0;
}

.settings-profile-name[b-0t958zkqna] {
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
}

.settings-profile-email[b-0t958zkqna] {
    font-size: 13px;
    color: var(--text-2);
    margin-top: 2px;
}

.settings-card-actions[b-0t958zkqna] {
    margin-top: 4px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.settings-footer-note[b-0t958zkqna] {
    margin-top: 40px;
    font-size: 13px;
    color: var(--text-3);
    text-align: center;
}

/* ── Privacy toggles ───────────────────────────────────────────────── */

.settings-toggle-row[b-0t958zkqna] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    cursor: pointer;
}

.settings-toggle-row--disabled[b-0t958zkqna] {
    opacity: .55;
    cursor: default;
}

.settings-toggle-label[b-0t958zkqna] {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
}

.settings-toggle-sub[b-0t958zkqna] {
    display: block;
    font-size: 12.5px;
    color: var(--text-3);
    margin-top: 2px;
}

.settings-privacy-error[b-0t958zkqna] {
    font-size: 13px;
    color: #d64545;
    margin: 0;
}
/* /Components/Pages/SharedProfile.razor.rz.scp.css */
/* ── Shell ──────────────────────────────────────────────────────── */

.profile-shell[b-2bu23s169k] {
    min-height: calc(100vh - 54px);
    padding: 48px 0 80px;
}

.section-inner[b-2bu23s169k] {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 28px;
}

.profile-loading[b-2bu23s169k] {
    color: var(--text-2);
    font-size: 15px;
    padding: 40px 0;
}

/* ── Empty / private state ──────────────────────────────────────── */

.profile-empty[b-2bu23s169k] {
    text-align: center;
    padding: 80px 0;
}

.profile-empty-icon[b-2bu23s169k] {
    font-size: 40px;
    display: block;
    margin-bottom: 16px;
}

.profile-empty-title[b-2bu23s169k] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 24px;
    font-weight: 800;
    color: var(--text);
    margin-bottom: 8px;
}

.profile-empty-sub[b-2bu23s169k] {
    color: var(--text-2);
    font-size: 14.5px;
}

/* ── Header ─────────────────────────────────────────────────────── */

.profile-header[b-2bu23s169k] {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.profile-avatar[b-2bu23s169k] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--card-border);
    flex-shrink: 0;
}

.profile-header-info[b-2bu23s169k] {
    flex: 1;
    min-width: 200px;
}

.profile-name[b-2bu23s169k] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--text);
    margin-bottom: 4px;
}

.profile-member-since[b-2bu23s169k] {
    font-size: 13px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    letter-spacing: .02em;
}

.profile-share-btn[b-2bu23s169k] {
    flex-shrink: 0;
}

/* ── Places ─────────────────────────────────────────────────────── */

.profile-places-hed[b-2bu23s169k] {
    margin-bottom: 20px;
}

.profile-places-count[b-2bu23s169k] {
    font-size: 14px;
    font-weight: 400;
    color: var(--text-3);
    margin-left: 8px;
}

.profile-places-empty[b-2bu23s169k] {
    color: var(--text-2);
    font-size: 14.5px;
    padding: 20px 0;
}

/* ── Bento grid (duplicated from Home.razor.css — CSS isolation means it
     can't be shared directly; this repo's own convention for this). ──── */

.bento-grid[b-2bu23s169k] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
}

.bento-card[b-2bu23s169k] {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    min-height: 140px;
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: 14px;
    overflow: hidden;
}

.bento-img[b-2bu23s169k] {
    height: 110px;
    background: var(--accent-dim);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 38px;
    flex-shrink: 0;
    border-bottom: 1px solid var(--card-border);
}

.bento-card-body[b-2bu23s169k] {
    padding: 16px 20px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.bento-name[b-2bu23s169k] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.3;
}

.bento-desc[b-2bu23s169k] {
    font-size: 12.5px;
    color: var(--text-2);
    line-height: 1.5;
    margin: 0;
    flex: 1;
}

.bento-foot[b-2bu23s169k] {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
    padding: 10px 20px 14px;
    border-top: 1px solid var(--card-border);
    font-size: 11.5px;
    color: var(--text-3);
    font-family: 'SF Mono', 'Courier New', monospace;
    letter-spacing: .02em;
}

.bento-age[b-2bu23s169k] {
    color: var(--text-3);
    white-space: nowrap;
}

.section-hed[b-2bu23s169k] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--text);
}
/* /Components/Pages/TripDetail.razor.rz.scp.css */
/* Trip detail (#151 stage 3). Built to docs/mockups/web-trip-detail.html.
   The notice styles are Trips.razor.css's and are reached through the shared
   .trips-shell / .trips-notice classes rather than duplicated here. */

.trip-crumb[b-g8zg6swk4g] {
    display: flex;
    gap: 8px;
    align-items: baseline;
    font-size: 0.85rem;
    color: var(--text-2);
    margin-bottom: 14px;
}

.trip-crumb a[b-g8zg6swk4g] {
    color: var(--tertiary-dark);
    text-decoration: none;
}

.trip-crumb a:hover[b-g8zg6swk4g] {
    text-decoration: underline;
}

.trip-sub[b-g8zg6swk4g] {
    color: var(--text-2);
    font-size: 0.9rem;
    margin: 0 0 22px;
}

/* ── Days ─────────────────────────────────────────── */

.trip-days[b-g8zg6swk4g] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.trip-day[b-g8zg6swk4g] {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: 14px;
    box-shadow: var(--card-shadow);
    /* Deliberately NOT overflow:hidden — stage 5 adds a day menu that would be clipped by it,
       and the mockup hit exactly that. The edge children carry the corners instead. */
}

.trip-day-head[b-g8zg6swk4g] {
    display: flex;
    align-items: baseline;
    gap: 12px;
    padding: 15px 18px 12px;
    border-bottom: 1px solid var(--card-border);
    border-radius: 13px 13px 0 0;
}

.trip-day-name[b-g8zg6swk4g] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.trip-day-date[b-g8zg6swk4g] {
    color: var(--text-3);
    font-size: 0.82rem;
}

.trip-day-ends[b-g8zg6swk4g] {
    margin-left: auto;
    color: var(--text-2);
    font-size: 0.82rem;
    min-width: 0;
}

/* The truncation lives on the LABEL, not on its container.
   It was on .trip-day-ends until stage 5 made that element the positioning context for
   the day ⋮ menu — at which point `overflow: hidden` silently clipped the popover out of
   existence. The menu was in the DOM, visible, and 232px wide, and rendered as nothing.
   The mockup carries the same warning about its own .day rule, which is how this was
   recognised rather than chased.
   A long overnight name still gives way before the layout does; only the element
   responsible for that changed. */
.trip-day-ends-label[b-g8zg6swk4g] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.trip-day-ends strong[b-g8zg6swk4g] {
    color: var(--text);
    font-weight: 600;
}

.trip-day-empty[b-g8zg6swk4g] {
    margin: 0;
    padding: 16px 18px;
    color: var(--text-3);
    font-size: 0.87rem;
    font-style: italic;
}

/* ── Stops ────────────────────────────────────────── */

.trip-stops[b-g8zg6swk4g] {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Three tracks, with the name on the only one that may shrink. #129 was this exact bug on
   the phone: a long name pushed the trailing content off the row. Place.Name allows 500
   characters and nothing validates it. */
.trip-stop[b-g8zg6swk4g] {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 13px;
    align-items: center;
    padding: 11px 18px;
    border-top: 1px solid color-mix(in srgb, var(--card-border) 55%, transparent);
}

.trip-stop:last-child[b-g8zg6swk4g] {
    border-radius: 0 0 13px 13px;
}

.trip-stop--night[b-g8zg6swk4g] {
    background: color-mix(in srgb, var(--status-approved) 5%, var(--card-bg));
}

.trip-stop-num[b-g8zg6swk4g] {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--accent);
    color: #fff;
    font-size: 0.8rem;
    font-weight: 700;
    /* Two-digit numbers line up with one-digit ones. */
    font-variant-numeric: tabular-nums;
}

.trip-stop--night .trip-stop-num[b-g8zg6swk4g] {
    background: var(--status-approved);
}

.trip-stop-body[b-g8zg6swk4g] {
    min-width: 0;
}

.trip-stop-name[b-g8zg6swk4g] {
    display: block;
    font-weight: 600;
    letter-spacing: -0.01em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* The stop is real; its place is gone. Said quietly, because the stop still counts. */
.trip-stop-name--missing[b-g8zg6swk4g] {
    color: var(--text-3);
    font-style: italic;
    font-weight: 500;
}

.trip-stop-cat[b-g8zg6swk4g] {
    display: block;
    color: var(--text-3);
    font-size: 0.78rem;
}

/* Name and badge share one line; the name is the only part that may shrink. */
.trip-stop-head[b-g8zg6swk4g] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
}

/* Sits beside the name rather than in a grid track of its own — see the comment in the
   markup for what that cost. */
.trip-stop-night[b-g8zg6swk4g] {
    flex: none;
    color: var(--status-approved);
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

/* Private Places (#116). Deliberately quieter than the overnight badge: it states a fact
   about visibility rather than marking the one stop that anchors the day. */
.trip-stop-private[b-g8zg6swk4g] {
    flex: none;
    color: var(--text-3);
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.trip-back[b-g8zg6swk4g] {
    display: inline-block;
    margin-top: 22px;
    color: var(--tertiary-dark);
    text-decoration: none;
    font-size: 0.88rem;
    font-weight: 600;
}

.trip-back:hover[b-g8zg6swk4g] {
    text-decoration: underline;
}

@media (max-width: 560px) {
    .trip-day-head[b-g8zg6swk4g] {
        flex-wrap: wrap;
    }

    /* Below the name rather than crushed against it. */
    .trip-day-ends[b-g8zg6swk4g] {
        margin-left: 0;
        flex-basis: 100%;
    }
}

/* ── Editing affordances (#151 stage 4) ────────────────────────────────────
   All of these render only behind WebTripEditing. They are deliberately always
   visible rather than revealed on hover: the mockup built hover-only row
   controls and rejected them, because they are unreachable without a pointer
   and this page is responsive. */

/* Sits in the implicit fourth grid column of .trip-stop. */
.trip-stop-x[b-g8zg6swk4g] {
    border: 0;
    background: none;
    padding: 4px 6px;
    border-radius: 7px;
    color: var(--text-3);
    font-size: 0.9rem;
    line-height: 1;
    cursor: pointer;
}

.trip-stop-x:hover:not(:disabled)[b-g8zg6swk4g] {
    background: color-mix(in srgb, var(--status-rejected) 12%, transparent);
    color: var(--status-rejected);
}

.trip-stop-x:disabled[b-g8zg6swk4g] {
    opacity: 0.4;
    cursor: default;
}

.trip-day-foot[b-g8zg6swk4g] {
    padding: 10px 18px 14px;
    border-top: 1px solid color-mix(in srgb, var(--card-border) 55%, transparent);
}

.trip-day-add[b-g8zg6swk4g] {
    border: 1px dashed var(--card-border);
    background: none;
    border-radius: 9px;
    padding: 7px 12px;
    color: var(--tertiary-dark);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
}

.trip-day-add:hover:not(:disabled)[b-g8zg6swk4g] {
    border-style: solid;
    background: color-mix(in srgb, var(--accent) 7%, transparent);
}

.trip-day-add:disabled[b-g8zg6swk4g] {
    opacity: 0.5;
    cursor: default;
}

/* Expands in place rather than opening a dialog — the same idiom the day menu
   uses when it becomes a stop picker. */
.trip-picker[b-g8zg6swk4g] {
    padding: 12px 18px 16px;
    border-top: 1px solid color-mix(in srgb, var(--card-border) 55%, transparent);
    background: color-mix(in srgb, var(--accent) 4%, transparent);
}

.trip-picker-input[b-g8zg6swk4g] {
    width: 100%;
    box-sizing: border-box;
    padding: 9px 12px;
    border: 1px solid var(--card-border);
    border-radius: 9px;
    background: var(--card-bg);
    color: var(--text);
    font: inherit;
    font-size: 0.9rem;
}

.trip-picker-results[b-g8zg6swk4g] {
    list-style: none;
    margin: 10px 0;
    padding: 0;
    /* Long result sets scroll inside the panel instead of pushing the rest of
       the trip off screen. */
    max-height: 260px;
    overflow-y: auto;
}

.trip-picker-result[b-g8zg6swk4g] {
    display: flex;
    align-items: baseline;
    gap: 9px;
    width: 100%;
    text-align: left;
    border: 0;
    background: none;
    padding: 8px 10px;
    border-radius: 8px;
    color: var(--text);
    font: inherit;
    cursor: pointer;
}

.trip-picker-result:hover:not(:disabled)[b-g8zg6swk4g] {
    background: color-mix(in srgb, var(--accent) 12%, transparent);
}

.trip-picker-result:disabled[b-g8zg6swk4g] {
    opacity: 0.5;
    cursor: default;
}

.trip-picker-name[b-g8zg6swk4g] {
    font-weight: 600;
    font-size: 0.9rem;
    /* The category keeps its width; a long place name ellipsises instead of
       pushing it out of the row. Same rule as .trip-stop. */
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.trip-picker-note[b-g8zg6swk4g] {
    margin: 10px 2px;
    color: var(--text-2);
    font-size: 0.85rem;
}

/* ── The combined list (#178) ──────────────────────────────────────────────── */

/* A row is no longer a single button: the annotations sit outside it so the
   dimming on a blocked row does not fall on the sentence explaining why it is
   blocked. The row wraps rather than clipping, because both annotations are
   whole sentences. */
.trip-picker-result[b-g8zg6swk4g] {
    flex-wrap: wrap;
}

/* 🔒 + "Private", after the name, so every row aligns on the name. The old
   markup put the glyph in front, which indented private rows out of line. */
.trip-picker-private[b-g8zg6swk4g] {
    flex: 0 0 auto;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--text-3);
    border: 1px solid var(--card-border);
    border-radius: 999px;
    padding: 1px 7px;
    white-space: nowrap;
}

/* Blocked rows are marked with aria-disabled, not the disabled attribute: a
   disabled button is not focusable, so a screen reader would never reach the
   reason. Dimmed here instead, and the pointer still says "not this one". */
.trip-picker-result[aria-disabled="true"][b-g8zg6swk4g] {
    opacity: 0.55;
    cursor: not-allowed;
}

.trip-picker-result[aria-disabled="true"]:hover[b-g8zg6swk4g] {
    background: none;
}

.trip-picker-already[b-g8zg6swk4g],
.trip-picker-blocked[b-g8zg6swk4g] {
    margin: 0 10px 8px;
    font-size: 0.78rem;
    line-height: 1.35;
}

.trip-picker-already[b-g8zg6swk4g] {
    color: var(--text-2);
}

.trip-picker-blocked[b-g8zg6swk4g] {
    color: var(--status-pending);
}

/* The rows stay put while a new search runs rather than the panel collapsing to
   "Searching…" on every keystroke — the height would jump on each letter, and
   the previous rows are still the best answer available. */
.trip-picker-results.is-searching[b-g8zg6swk4g] {
    opacity: 0.6;
}

.trip-picker-add-private[b-g8zg6swk4g] {
    display: inline-block;
    margin: 4px 2px 10px;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--accent);
}

/* ── Reordering and the day menu (#151 stage 5) ────────────────────────────── */

.trip-stop-ctl[b-g8zg6swk4g] {
    display: flex;
    gap: 3px;
    align-items: center;
    /* Quietened, never hidden. The hover-only treatment was built and rejected: there is
       no hover on a touch laptop, and this page is responsive. */
    opacity: 0.5;
    transition: opacity .12s;
}

.trip-stop:hover .trip-stop-ctl[b-g8zg6swk4g],
.trip-stop:focus-within .trip-stop-ctl[b-g8zg6swk4g] {
    opacity: 1;
}

.trip-arrow[b-g8zg6swk4g] {
    width: 29px;
    height: 29px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--card-border);
    border-radius: 7px;
    background: var(--card-bg);
    color: var(--tertiary-dark);
    font-size: 0.72rem;
    cursor: pointer;
}

.trip-arrow:hover:not(:disabled)[b-g8zg6swk4g] {
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    border-color: var(--accent);
}

.trip-arrow:disabled[b-g8zg6swk4g] {
    color: var(--text-3);
    background: color-mix(in srgb, var(--card-border) 22%, transparent);
    border-color: transparent;
    cursor: default;
}

/* An arrow that leaves the day is a different action from a nudge within it (TC-05),
   so it does not look identical to one. The tooltip names the destination. */
.trip-arrow--cross:not(:disabled)[b-g8zg6swk4g] {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 9%, transparent);
}

.trip-day-ends[b-g8zg6swk4g] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
}

.trip-kebab[b-g8zg6swk4g] {
    border: 0;
    background: none;
    padding: 2px 7px;
    border-radius: 6px;
    line-height: 1;
    color: var(--text-3);
    font-size: 1.05rem;
    cursor: pointer;
}

.trip-kebab:hover:not(:disabled)[b-g8zg6swk4g] {
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    color: var(--tertiary-dark);
}

/* Sits above the backdrop, which sits above the page. */
.trip-backdrop[b-g8zg6swk4g] {
    position: fixed;
    inset: 0;
    z-index: 20;
}

.trip-menu[b-g8zg6swk4g] {
    position: absolute;
    right: 0;
    top: 28px;
    z-index: 30;
    min-width: 232px;
    padding: 5px;
    border: 1px solid var(--card-border);
    border-radius: 11px;
    background: var(--card-bg);
    box-shadow: 0 8px 32px rgba(60, 40, 120, .18);
}

.trip-menu button[b-g8zg6swk4g] {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    background: none;
    padding: 8px 11px;
    border-radius: 7px;
    font: inherit;
    font-size: 0.87rem;
    color: var(--text);
    cursor: pointer;
}

.trip-menu button:hover:not(:disabled)[b-g8zg6swk4g] {
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    color: var(--tertiary-dark);
}

.trip-menu button:disabled[b-g8zg6swk4g] {
    color: var(--text-3);
    cursor: default;
}

.trip-menu-danger[b-g8zg6swk4g] { color: var(--status-rejected) !important; }

.trip-menu-danger:hover:not(:disabled)[b-g8zg6swk4g] {
    background: color-mix(in srgb, var(--status-rejected) 8%, transparent) !important;
    color: var(--status-rejected) !important;
}

.trip-menu hr[b-g8zg6swk4g] {
    border: 0;
    border-top: 1px solid var(--card-border);
    margin: 5px 3px;
}

.trip-menu-hd[b-g8zg6swk4g] {
    padding: 7px 11px 4px;
    color: var(--text-3);
    font-size: 0.66rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
}

/* Stated, not hidden: a vanished menu item makes the reader guess why. */
.trip-menu-why[b-g8zg6swk4g] {
    padding: 3px 11px 7px;
    color: var(--text-3);
    font-size: 0.72rem;
    line-height: 1.35;
}

.trip-menu-pick[b-g8zg6swk4g] {
    display: flex;
    gap: 8px;
    align-items: baseline;
}

.trip-menu-pick i[b-g8zg6swk4g] {
    font-style: normal;
    width: 13px;
    flex: none;
    color: var(--status-approved);
}

.trip-menu-form[b-g8zg6swk4g] { padding: 4px 7px 7px; }

.trip-menu-form input[b-g8zg6swk4g] {
    width: 100%;
    box-sizing: border-box;
    padding: 7px 10px;
    border: 1px solid var(--card-border);
    border-radius: 8px;
    background: var(--card-bg);
    color: var(--text);
    font: inherit;
    font-size: 0.87rem;
}

.trip-menu-actions[b-g8zg6swk4g] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}

.trip-menu-quiet[b-g8zg6swk4g] {
    margin-top: 4px;
    color: var(--text-2) !important;
    font-size: 0.79rem !important;
}

.trip-day-actions[b-g8zg6swk4g] {
    display: flex;
    gap: 10px;
    margin-top: 4px;
}

.trip-form-note[b-g8zg6swk4g] {
    margin: 10px 0 0;
    color: var(--text-2);
    font-size: 0.85rem;
}

/* ── Editing the trip's own fields ─────────────────────────────────────────
   The form itself reuses .trip-new-form and .trip-field from the create form on
   /trips — same three fields, same shape, so it should not look like a second
   idea. Only the entry point and the hint are new here. */

.trip-hed-row[b-g8zg6swk4g] {
    display: flex;
    align-items: baseline;
    gap: 14px;
    flex-wrap: wrap;
}

.trip-hed-edit[b-g8zg6swk4g] {
    border: 1px dashed var(--card-border);
    background: none;
    border-radius: 9px;
    padding: 6px 12px;
    color: var(--tertiary-dark);
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
}

.trip-hed-edit:hover[b-g8zg6swk4g] {
    border-style: solid;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
}

/* Says the constraint before it is hit, rather than only as a refusal. The
   refusal still has to exist — the itinerary can change in another tab — but a
   rule a reader only meets by breaking it is a worse rule. */
/* /Components/Pages/Trips.razor.rz.scp.css */

/* ── Card grid ────────────────────────────────────── */
.trips-grid[b-tfchcx5kzo] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

.trips-card[b-tfchcx5kzo] {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: 10px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: background .35s, border-color .35s;
}

.trips-card-name[b-tfchcx5kzo] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -.01em;
    color: var(--text);
    margin: 0;
    line-height: 1.3;
}

.trips-card-hook[b-tfchcx5kzo] {
    font-size: 0.85rem;
    color: var(--text-2);
    font-style: italic;
    margin: 0;
    line-height: 1.4;
}

.trips-card-meta[b-tfchcx5kzo] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.78rem;
    color: var(--text-3);
    margin-top: 4px;
}

/* ── Card as link (#151 stage 3) ───────────────────────
   .trips-card became an <a> so the whole card is the target, not just its heading.
   These undo the anchor defaults the card never wanted and add the affordances a
   link needs — including a visible focus ring, since the card is now tab-stop. */
a.trips-card[b-tfchcx5kzo] {
    display: block;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

a.trips-card:hover[b-tfchcx5kzo] {
    box-shadow: var(--card-hover-shadow);
    border-color: color-mix(in srgb, var(--accent) 40%, var(--card-border));
}

a.trips-card:focus-visible[b-tfchcx5kzo] {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    a.trips-card[b-tfchcx5kzo] {
        transition: none;
    }
}

/* ── Creating a trip (#151 stage 4) ────────────────────────────────────────
   Behind WebTripEditing, and hidden entirely while a failure blocks editing —
   a form that swallows what someone typed is worse than no form. */

.trips-new[b-tfchcx5kzo] {
    border: 1px dashed var(--card-border);
    background: none;
    border-radius: 10px;
    padding: 9px 15px;
    margin-bottom: 20px;
    color: var(--tertiary-dark);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
}

.trips-new:hover[b-tfchcx5kzo] {
    border-style: solid;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
}

/* Two dates side by side on a desktop, stacked where that would crush them. */
/* Shared with the trip detail page's edit form — see the note there. */
/* /Components/Shared/AddToTripPicker.razor.rz.scp.css */
/* Scoped to the picker component, so it travels with the markup rather than being
   inherited from whichever page happens to host it -- the card, the resume banner,
   and in due course Explore's map overlay and the trip page (#189). */

.trip-picker[b-nevgst886n] {
    padding: 12px 20px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.trip-picker-heading[b-nevgst886n] {
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
    margin: 0;
}

.trip-picker-step[b-nevgst886n] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--text-2);
    margin: 0;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.trip-picker-note[b-nevgst886n] { font-size: 12.5px; color: var(--text-2); margin: 0; }

.trip-picker-rows[b-nevgst886n] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;

    /* An unbounded trip list: /me/trips is not paginated, so this scrolls rather than
       growing the card without limit. */
    max-height: 220px;
    overflow-y: auto;
}

.trip-picker-row[b-nevgst886n] {
    width: 100%;
    text-align: left;
    padding: 8px 10px;
    border: 1px solid var(--card-border);
    border-radius: 8px;
    background: transparent;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.trip-picker-row:hover:not(:disabled)[b-nevgst886n] { border-color: var(--accent); }

/* Blocked rows stay focusable so the reason can be announced -- they are aria-disabled,
   not disabled, and the click is refused in the handler. */
.trip-picker-row[aria-disabled="true"][b-nevgst886n] { opacity: .65; }

.trip-picker-name[b-nevgst886n]    { font-size: 13px; font-weight: 600; color: var(--text); }
.trip-picker-already[b-nevgst886n] { font-size: 11.5px; color: var(--text-2); }
.trip-picker-blocked[b-nevgst886n] { font-size: 11.5px; color: var(--warning, #b4690e); line-height: 1.4; }

.trip-picker-back[b-nevgst886n],
.trip-picker-cancel[b-nevgst886n] {
    font-size: 11.5px;
    font-weight: 600;
    background: transparent;
    border: 0;
    padding: 0;
    color: var(--accent);
    cursor: pointer;
    text-transform: none;
    letter-spacing: normal;
}

.trip-picker-cancel[b-nevgst886n] { align-self: flex-start; }

.trip-picker-refusal[b-nevgst886n] {
    font-size: 12px;
    color: var(--warning, #b4690e);
    line-height: 1.4;
    margin: 0;
}

.trip-picker-erroraction[b-nevgst886n] {
    margin-left: 6px;
    font-weight: 700;
    color: var(--accent);
}