/* ==============================================================================
   LAND GO v4.2 - Core Glassmorphism Engine
   ============================================================================== */

:root {
    --landgo-app-height: 100vh;
    --landgo-bg: #001117;
    --landgo-surface: #07191f;
    --landgo-surface-elevated: #0b2027;
    --landgo-cyan: #00e5d4;
    --landgo-orange: #ffb45c;
    --landgo-gray: #5f6772;
    --landgo-light: #f3f5f7;
    --landgo-text: #f3f5f7;
    --landgo-muted: #5f6772;
    --landgo-border: rgba(243, 245, 247, 0.14);
    --landgo-border-strong: rgba(243, 245, 247, 0.28);
    --landgo-success: #00e5d4;
    --landgo-warning: #ffb45c;
    --landgo-danger: #ff6b6b;
    --landgo-radius-sm: 12px;
    --landgo-radius-md: 20px;
    --landgo-radius-lg: 28px;

    /* Core Colors */
    --glass-background-base: #08090A;
    --glass-surface: rgba(28, 29, 33, 0.7);
    --glass-stroke: rgba(255, 255, 255, 0.08);
    --glass-highlight: rgba(255, 255, 255, 0.12);

    /* Gradient Colors */
    --glass-glow-top: #FBC392;
    --glass-glow-bottom: #C5F1FE;

    /* Effects */
    --glass-blur: blur(24px);
    --glass-saturate: saturate(180%);
    --glass-radius: 32px;
    --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}

@supports (height: 100dvh) {
    :root {
        --landgo-app-height: 100dvh;
    }
}

.landgo-page {
    background:
        radial-gradient(circle at 50% 3%, rgba(0, 229, 212, 0.1), transparent 18rem),
        linear-gradient(180deg, #001117 0, #001216 12rem, #08090A 23rem, #08090A 100%);
}

.landgo-view {
    padding-bottom: 1rem;
}

.landgo-event-article { background: #101114; color: rgba(255,255,255,.78); }
.landgo-event-article-hero { display: block; width: 100%; max-height: 360px; aspect-ratio: 16 / 9; object-fit: cover; }
.landgo-event-article-title { margin: 0; color: #fff; font-size: clamp(1.55rem, 6.5vw, 2.15rem); line-height: 1.1; font-weight: 900; letter-spacing: 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.landgo-event-article-subtitle { margin: .7rem 0 0; color: rgba(255,255,255,.62); font-size: 1rem; line-height: 1.55; }
.landgo-event-article-meta { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1rem; }
.landgo-event-article-meta span { padding: .35rem .55rem; border: 1px solid rgba(255,255,255,.12); border-radius: .45rem; color: rgba(255,255,255,.72); font-size: .7rem; }
.landgo-event-article-body { padding: .5rem 1.25rem 0; }
.landgo-event-article-paragraph { margin: 1.1rem 0; color: rgba(255,255,255,.78); font-size: 1rem; line-height: 1.72; }
.landgo-event-article-heading { margin: 1.7rem 0 .6rem; color: #fff; font-size: 1.35rem; line-height: 1.25; font-weight: 850; }
.landgo-event-article-quote { margin: 1.2rem 0; padding-left: .9rem; border-left: 2px solid var(--landgo-orange); color: rgba(255,255,255,.64); font-size: 1rem; line-height: 1.65; }
.landgo-event-article-figure { margin: 1.25rem -1.25rem; }
.landgo-event-article-figure img { display: block; width: 100%; height: auto; max-height: 520px; object-fit: contain; background: #0b0d0f; }
.landgo-event-article-figure figcaption, .landgo-event-article-caption { padding: .45rem 1.25rem 0; color: rgba(255,255,255,.43); font-size: .75rem; line-height: 1.45; }
.landgo-event-article-schedule, .landgo-event-article-info, .landgo-event-article-good-to-know { margin-top: 1.25rem; padding: .9rem 1rem; border: 1px solid rgba(255,255,255,.1); border-radius: .7rem; background: rgba(255,255,255,.035); }
.landgo-event-article-schedule h3, .landgo-event-article-info h3, .landgo-event-article-good-to-know h3, .landgo-event-article-sources h3 { margin: 0 0 .55rem; color: var(--landgo-orange); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 900; }
.landgo-event-article-schedule div { display: grid; gap: .15rem; padding: .55rem 0; border-top: 1px solid rgba(255,255,255,.07); }
.landgo-event-article-schedule div:first-of-type { border-top: 0; }
.landgo-event-article-schedule b { color: rgba(255,255,255,.82); font-size: .78rem; }
.landgo-event-article-schedule span, .landgo-event-article-info p, .landgo-event-article-good-to-know p { margin: .2rem 0 0; color: rgba(255,255,255,.62); font-size: .8rem; line-height: 1.5; }
.landgo-event-article-address { margin: .65rem 0 0; color: rgba(255,255,255,.46); font-size: .78rem; line-height: 1.5; }
.landgo-event-article-sources { padding: .85rem 1.25rem 0; }
.landgo-event-article-sources a { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .65rem 0; border-top: 1px solid rgba(255,255,255,.08); color: rgba(255,255,255,.56); font-size: .78rem; }
.landgo-event-article-sources i { color: var(--landgo-cyan); }

.guide-hub-intro {
    padding: 0.5rem 0.2rem 0.25rem;
}

.guide-hub-heading {
    padding: 0.55rem 0.28rem 0.2rem;
}

.guide-live-badge {
    display: inline-flex;
    align-items: center;
    min-height: 1.7rem;
    padding: 0 0.58rem;
    border: 1px solid rgba(255, 180, 92, 0.3);
    border-radius: 0.48rem;
    color: var(--landgo-orange);
    background: rgba(255, 180, 92, 0.08);
    font-size: 0.56rem;
    font-weight: 950;
    letter-spacing: 0.12em;
}

.guide-safehouse {
    width: 100%;
    margin: 0.78rem 0 0.95rem;
    padding: 0.82rem;
}

.guide-content-switch,
.guide-place-search,
.guide-safehouse,
.guide-map-result-card,
.guide-shot-card.soft-card,
.guide-article-card.soft-card,
.guide-food-card {
    border: 1px solid rgba(179, 229, 225, 0.14);
    border-radius: 0.9rem;
    background: rgba(10, 31, 34, 0.8);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 0.7rem 1.7rem rgba(0, 0, 0, 0.12);
}

.immersive-mode-toggle {
    position: relative;
    display: inline-grid;
    width: 2.25rem;
    height: 2.25rem;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid rgba(0, 229, 212, 0.24);
    border-radius: 0.72rem;
    background: rgba(0, 229, 212, 0.08);
    color: #00e5d4;
    font-size: 0.86rem;
    transition: transform 150ms ease, background-color 150ms ease;
}

.immersive-mode-toggle:active {
    transform: scale(0.94);
}

.immersive-mode-toggle::after {
    position: absolute;
    top: calc(100% + 0.45rem);
    right: 0;
    z-index: 80;
    width: max-content;
    max-width: 12rem;
    padding: 0.38rem 0.52rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0.45rem;
    background: #101114;
    color: rgba(255, 255, 255, 0.82);
    content: attr(data-tooltip);
    font-size: 0.62rem;
    font-weight: 800;
    line-height: 1.2;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-0.2rem);
    transition: opacity 150ms ease, transform 150ms ease;
}

.immersive-mode-toggle:hover::after,
.immersive-mode-toggle:focus-visible::after {
    opacity: 1;
    transform: translateY(0);
}

.home-hero {
    padding: 0.5rem 0 0.82rem;
}

.home-weekly-section {
    margin-top: 0.35rem;
}

.guide-place-search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.55rem;
    min-height: 3.2rem;
    margin-top: 0.9rem;
    padding: 0.38rem 0.42rem 0.38rem 0.82rem;
    border: 1px solid rgba(179, 229, 225, 0.14);
}

.guide-place-search > i {
    color: var(--landgo-orange);
    font-size: 0.82rem;
}

.guide-place-search input {
    min-width: 0;
    height: 2.3rem;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--landgo-text);
    font-size: 0.95rem;
    font-weight: 750;
}

.guide-place-search input::placeholder {
    color: rgba(243, 245, 247, 0.42);
    font-weight: 650;
}

.guide-place-search button {
    width: 2.3rem;
    height: 2.3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 0.7rem;
    color: rgba(243, 245, 247, 0.62);
    background: transparent;
}

.guide-place-search button[type="submit"] {
    color: #08090a;
    background: var(--landgo-orange);
}

.guide-place-search button:active {
    transform: scale(0.94);
}

.guide-content-switch {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.42rem;
    margin-top: 0.82rem;
    padding: 0.28rem;
    border: 1px solid rgba(179, 229, 225, 0.14);
}

.guide-content-switch button {
    min-height: 2.48rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.48rem;
    border: 0;
    border-radius: 0.64rem;
    background: transparent;
    color: rgba(243, 245, 247, 0.52);
    font-size: 0.76rem;
    font-weight: 950;
}

.guide-content-switch button i {
    color: var(--landgo-orange);
}

.guide-content-switch button.is-active {
    color: #081013;
    background: var(--landgo-cyan);
}

.guide-content-switch button.is-active i {
    color: inherit;
}

.guide-food-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.guide-food-count {
    min-width: 1.85rem;
    height: 1.85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(0, 229, 212, 0.22);
    border-radius: 0.56rem;
    color: var(--landgo-cyan);
    background: rgba(0, 229, 212, 0.08);
    font-size: 0.7rem;
    font-weight: 950;
}

.guide-food-filter {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.42rem;
}

.guide-food-filter button {
    min-height: 2.38rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.38rem;
    padding: 0 0.62rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.66rem;
    background: rgba(255, 255, 255, 0.035);
    color: rgba(243, 245, 247, 0.58);
    font-size: 0.63rem;
    font-weight: 900;
    text-align: left;
}

.guide-food-filter button span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.guide-food-filter button em {
    flex: 0 0 auto;
    color: rgba(243, 245, 247, 0.38);
    font-size: 0.58rem;
    font-style: normal;
    font-weight: 900;
}

.guide-food-filter button.is-active {
    border-color: rgba(255, 180, 92, 0.48);
    color: #081013;
    background: var(--landgo-orange);
}

.guide-food-filter button.is-active em {
    color: rgba(8, 16, 19, 0.62);
}

.guide-food-card {
    display: grid;
    grid-template-columns: 6.25rem minmax(0, 1fr);
    gap: 0.75rem;
    height: 10.25rem;
    padding: 0.72rem;
    border: 1px solid rgba(179, 229, 225, 0.14);
    overflow: hidden;
}

.guide-food-media {
    position: relative;
    min-height: 7.8rem;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.72rem;
    background: #111416;
}

.guide-food-media > img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.guide-food-media-fallback {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: var(--landgo-orange);
    background: #16191b;
    font-size: 1.4rem;
}

.guide-food-media > span {
    position: absolute;
    left: 0.38rem;
    bottom: 0.38rem;
    max-width: calc(100% - 0.76rem);
    overflow: hidden;
    padding: 0.28rem 0.38rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 0.38rem;
    color: #fff;
    background: rgba(8, 9, 10, 0.76);
    font-size: 0.53rem;
    font-weight: 950;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.guide-food-copy {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.guide-food-topline,
.guide-food-actions,
.guide-food-facts {
    display: flex;
    align-items: center;
    gap: 0.44rem;
}

.guide-food-topline {
    justify-content: space-between;
}

.guide-food-topline p,
.guide-food-topline small {
    margin: 0;
    overflow: hidden;
    color: var(--landgo-cyan);
    font-size: 0.57rem;
    font-weight: 950;
    line-height: 1.2;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.guide-food-topline small {
    max-width: 44%;
    color: rgba(243, 245, 247, 0.43);
    text-align: right;
    text-transform: none;
}

.guide-food-copy h3 {
    margin: 0.3rem 0 0;
    color: var(--landgo-text);
    font-size: 0.95rem;
    font-weight: 950;
    line-height: 1.15;
}

.guide-food-description {
    display: -webkit-box;
    margin: 0.42rem 0 0;
    overflow: hidden;
    color: rgba(243, 245, 247, 0.54);
    font-size: 0.67rem;
    line-height: 1.42;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.guide-food-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.28rem;
    margin-top: 0.4rem;
}

.guide-food-chips span {
    max-width: 100%;
    overflow: hidden;
    padding: 0.22rem 0.36rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0.38rem;
    color: rgba(243, 245, 247, 0.62);
    background: rgba(255, 255, 255, 0.045);
    font-size: 0.55rem;
    font-weight: 800;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.guide-food-facts {
    flex-wrap: wrap;
    margin-top: 0.35rem;
}

.guide-food-facts span {
    display: inline-flex;
    align-items: center;
    gap: 0.26rem;
    color: rgba(243, 245, 247, 0.42);
    font-size: 0.55rem;
    font-weight: 800;
    line-height: 1.2;
}

.guide-food-facts i {
    color: var(--landgo-orange);
}

.guide-food-actions {
    justify-content: flex-end;
    margin-top: auto;
    padding-top: 0.42rem;
}

.guide-food-add,
.guide-food-route {
    min-height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.54rem;
    color: rgba(243, 245, 247, 0.8);
    background: rgba(255, 255, 255, 0.055);
    font-size: 0.58rem;
    font-weight: 950;
}

.guide-food-add {
    padding: 0 0.62rem;
}

.guide-food-route {
    width: 2rem;
    color: #081013;
    background: var(--landgo-orange);
}

.guide-food-empty {
    padding: 2.5rem 1rem;
    border: 1px dashed rgba(255, 255, 255, 0.16);
    border-radius: 1rem;
    color: rgba(243, 245, 247, 0.5);
    text-align: center;
}

.guide-food-empty i {
    color: var(--landgo-orange);
    font-size: 1.4rem;
}

.guide-food-empty h3 {
    margin: 0.7rem 0 0;
    color: var(--landgo-text);
    font-size: 0.92rem;
    font-weight: 950;
}

.guide-food-empty p {
    margin: 0.36rem auto 0;
    max-width: 17rem;
    font-size: 0.68rem;
    line-height: 1.45;
}

.route-food-selection {
    display: grid;
    gap: 0.65rem;
    padding: 0.78rem;
    border: 1px solid rgba(0, 229, 212, 0.18);
    border-radius: 0.9rem;
    background: rgba(0, 229, 212, 0.045);
}

.route-food-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
}

.route-food-option {
    position: relative;
    min-width: 0;
    display: block;
    cursor: pointer;
}

.route-food-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.route-food-option span {
    min-height: 3.25rem;
    display: grid;
    align-content: center;
    gap: 0.2rem;
    padding: 0.52rem 0.58rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.7rem;
    background: rgba(255, 255, 255, 0.035);
}

.route-food-option input:checked + span {
    border-color: rgba(0, 229, 212, 0.46);
    background: rgba(0, 229, 212, 0.12);
}

.route-food-option b,
.route-food-option small {
    overflow: hidden;
    color: rgba(243, 245, 247, 0.78);
    font-size: 0.63rem;
    font-weight: 900;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.route-food-option small {
    color: rgba(243, 245, 247, 0.4);
    font-size: 0.55rem;
    font-weight: 750;
}

.guide-map-result-card {
    display: grid;
    grid-template-columns: 2.65rem minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.75rem;
    min-height: 7.4rem;
    padding: 0.85rem;
    border: 1px solid rgba(179, 229, 225, 0.14);
}

.guide-map-result-icon {
    width: 2.65rem;
    height: 2.65rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(0, 229, 212, 0.22);
    border-radius: 0.8rem;
    color: var(--landgo-cyan);
    background: rgba(0, 229, 212, 0.08);
}

.guide-map-result-copy {
    min-width: 0;
}

.guide-map-result-copy h3,
.guide-map-result-copy .guide-map-result-local {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.guide-map-result-copy h3 {
    margin: 0.18rem 0 0;
    color: var(--landgo-text);
    font-size: 0.93rem;
    line-height: 1.2;
    font-weight: 900;
}

.guide-map-result-copy p {
    margin: 0.22rem 0 0;
    color: rgba(243, 245, 247, 0.46);
    font-size: 0.72rem;
    line-height: 1.35;
}

.guide-map-result-copy .guide-map-result-address {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: normal;
}

.guide-map-result-copy span {
    display: inline-flex;
    padding: 0.22rem 0.42rem;
    border: 1px solid rgba(0, 229, 212, 0.18);
    border-radius: 0.28rem;
    color: rgba(163, 255, 247, 0.82);
    background: rgba(0, 229, 212, 0.08);
    font-size: 0.52rem;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.guide-map-result-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.28rem 0.45rem;
    margin-top: 0.45rem;
}

.guide-map-result-meta strong,
.guide-map-result-meta em {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.59rem;
    font-style: normal;
    line-height: 1.2;
}

.guide-map-result-meta strong {
    color: var(--landgo-orange);
    font-weight: 900;
}

.guide-map-result-meta em {
    color: rgba(243, 245, 247, 0.38);
}

.guide-map-result-card button {
    align-self: center;
    height: 2.35rem;
    padding: 0 0.78rem;
    border: 0;
    border-radius: 0.72rem;
    color: #08090a;
    background: var(--landgo-orange);
    font-size: 0.68rem;
    font-weight: 950;
}

.guide-search-sort {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    width: fit-content;
    padding: 0.24rem;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 0.78rem;
    background: rgba(255, 255, 255, 0.035);
}

.guide-search-sort button {
    min-height: 2rem;
    padding: 0 0.68rem;
    border: 0;
    border-radius: 0.56rem;
    color: rgba(243, 245, 247, 0.5);
    background: transparent;
    font-size: 0.64rem;
    font-weight: 900;
    letter-spacing: 0;
}

.guide-search-sort button.is-active {
    color: #08090a;
    background: var(--landgo-orange);
}

.guide-search-focus {
    animation: guideSearchFocus 1.45s ease-out;
}

@keyframes guideSearchFocus {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 229, 212, 0.56), 0 12px 30px rgba(0, 0, 0, 0.18);
        border-color: rgba(0, 229, 212, 0.78);
    }
    55% {
        box-shadow: 0 0 0 0.5rem rgba(0, 229, 212, 0), 0 16px 34px rgba(0, 0, 0, 0.24);
        border-color: rgba(0, 229, 212, 0.42);
    }
    100% {
        box-shadow: none;
        border-color: rgba(255, 255, 255, 0.1);
    }
}

.ogo-hero-asset {
    animation: ogoFloat 4.8s ease-in-out infinite;
}
.home-ogo-refresh-hook { display:block; width:100%; height:100%; padding:0; border:0; background:transparent; cursor:pointer; }
.home-ogo-refresh-hook:focus-visible { outline:2px solid #00e5d4; outline-offset:4px; border-radius:999px; }

.ogo-pulse-pin {
    animation: ogoPulse 2.8s ease-in-out infinite;
}

.brand-entry-icon {
    width: 2.15rem;
    height: 2.15rem;
    object-fit: contain;
    padding: 0.16rem;
    border-radius: 0.95rem;
    border: 1px solid rgba(0, 229, 212, 0.22);
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.24), 0 0 18px rgba(0, 229, 212, 0.08);
    background: rgba(243, 245, 247, 0.08);
}

.guide-place-filter {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

.guide-place-filter button {
    min-height: 3.2rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.2rem 0.45rem;
    padding: 0.6rem 0.7rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.035);
    color: rgba(243, 245, 247, 0.5);
    text-align: left;
}

.guide-place-filter button.is-active {
    border-color: rgba(0, 229, 212, 0.36);
    background: rgba(0, 229, 212, 0.1);
    color: var(--landgo-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 12px 30px rgba(0, 0, 0, 0.22);
}

.guide-place-filter span {
    color: currentColor;
    font-size: 0.82rem;
    line-height: 1;
    font-weight: 1000;
}

.guide-place-filter em {
    min-width: 1.35rem;
    height: 1.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: currentColor;
    font-size: 0.62rem;
    font-style: normal;
    font-weight: 1000;
}

.guide-place-filter small {
    grid-column: 1 / -1;
    color: rgba(243, 245, 247, 0.38);
    font-size: 0.58rem;
    font-weight: 800;
    line-height: 1.2;
}

.guide-shot-card {
    display: grid;
    grid-template-columns: 6.5rem minmax(0, 1fr);
    gap: 0.72rem;
    min-height: 8.8rem;
    height: 8.8rem;
    padding: 0.58rem;
    border-radius: 0.9rem;
}

.guide-shot-media {
    position: relative;
    width: 6.5rem;
    height: 100%;
    align-self: stretch;
    overflow: hidden;
    border-radius: 0.76rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #0d0e10;
}

.guide-shot-media img {
    width: 100%;
    height: 100%;
    display: block;
}

.guide-shot-media .guide-shot-media-backdrop {
    position: absolute;
    inset: -0.8rem;
    width: calc(100% + 1.6rem) !important;
    height: calc(100% + 1.6rem) !important;
    object-fit: cover;
    object-position: center;
    filter: blur(1.1rem);
    opacity: 0.22;
    transform: scale(1.04);
}

.guide-shot-media-image {
    position: relative;
    z-index: 1;
    object-fit: cover;
    object-position: center;
    background: transparent;
}

.guide-shot-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(8, 9, 10, 0.08) 58%, rgba(8, 9, 10, 0.24));
    pointer-events: none;
}

.guide-shot-fallback {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 0.25rem;
    padding: 0.8rem;
    background: radial-gradient(circle at top left, rgba(0, 229, 212, 0.18), transparent 42%), #101114;
}

.guide-shot-fallback span,
.guide-shot-body p {
    color: var(--landgo-orange);
    font-size: 0.55rem;
    font-weight: 1000;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.guide-shot-fallback strong {
    color: var(--landgo-text);
    font-size: 1rem;
    line-height: 1.05;
}

.guide-shot-content {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
}

.guide-shot-topline {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    min-height: 0.95rem;
}

.guide-shot-kicker {
    color: var(--landgo-orange);
    font-size: 0.52rem;
    font-weight: 1000;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.guide-shot-heading {
    display: flex;
    align-items: center;
    gap: 0.38rem;
    min-width: 0;
}

.guide-shot-rank {
    color: var(--landgo-orange);
    font-size: 0.56rem;
    font-weight: 1000;
    letter-spacing: 0.08em;
}

.guide-shot-time {
    max-width: 10rem;
    padding: 0.16rem 0.36rem;
    border: 1px solid rgba(255, 180, 92, 0.28);
    border-radius: 0.28rem;
    background: rgba(255, 180, 92, 0.08);
    color: var(--landgo-orange);
    font-size: 0.5rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.guide-shot-topline em {
    color: var(--landgo-text);
    font-size: 0.72rem;
    font-style: normal;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-weight: 1000;
    white-space: nowrap;
}

.guide-shot-title-row {
    min-width: 0;
    margin-top: 0.06rem;
}

.guide-shot-title-row h3 {
    margin: 0;
    color: var(--landgo-text);
    font-size: 0.96rem;
    line-height: 1.05;
    font-weight: 1000;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.guide-shot-note {
    margin: 0.24rem 0 0;
    font-size: 0.66rem;
    line-height: 1.25;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.guide-shot-bottomline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.42rem;
    min-width: 0;
    margin-top: 0.24rem;
}

.guide-shot-tags {
    display: flex;
    align-items: center;
    gap: 0.28rem;
    min-width: 0;
    overflow: hidden;
}

.guide-shot-tags span {
    max-width: 5rem;
    padding: 0.16rem 0.36rem;
    border: 1px solid rgba(243, 245, 247, 0.09);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.045);
    color: rgba(243, 245, 247, 0.48);
    font-size: 0.5rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.guide-shot-actions {
    display: flex;
    align-items: center;
    gap: 0.34rem;
    flex: 0 0 auto;
}

.guide-shot-route,
.guide-shot-add,
.guide-shot-copy {
    width: 2rem;
    height: 2rem;
    min-height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.62rem;
    font-size: 0.72rem;
    font-weight: 1000;
}

.guide-shot-route {
    flex: 0 0 auto;
    background: var(--landgo-orange);
    color: #08090a;
}

@media (max-width: 400px) {
    .guide-shot-card {
        grid-template-columns: 6rem minmax(0, 1fr);
        gap: 0.62rem;
    }

    .guide-shot-media {
        width: 6rem;
        height: 100%;
    }

    .guide-shot-title-row h3 {
        font-size: 0.9rem;
    }
}

.guide-shot-copy {
    width: 2.15rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.045);
    color: rgba(243, 245, 247, 0.68);
}

.guide-shot-add {
    width: 2rem;
    min-height: 2rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.075);
    color: rgba(255, 255, 255, 0.82);
}

.guide-place-detail-hero {
    aspect-ratio: 3 / 4;
}

.guide-place-detail-hero-image {
    z-index: 1;
    filter: contrast(1.08) saturate(1.08);
}

.guide-place-detail-hero-overlay {
    z-index: 2;
    background:
        linear-gradient(180deg, rgba(5, 7, 8, 0.34) 0%, rgba(5, 7, 8, 0.04) 16%, rgba(5, 7, 8, 0) 74%, rgba(11, 13, 15, 0.18) 80%, rgba(11, 13, 15, 0.78) 94%, #101114 100%),
        linear-gradient(90deg, rgba(5, 7, 8, 0.15), transparent 26%, transparent 74%, rgba(5, 7, 8, 0.15));
}

.guide-place-detail-hero > div:last-child {
    bottom: 1rem;
}

.guide-inline-place-card {
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 0.9rem;
    background: rgba(255, 255, 255, 0.028);
    padding: 0.7rem;
}

.guide-inline-place-main {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    min-width: 0;
}

.guide-inline-place-thumb {
    width: 4.5rem;
    height: 4.5rem;
    flex: 0 0 4.5rem;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.65rem;
    background: rgba(251, 195, 146, 0.08);
}

.guide-inline-place-thumb img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.guide-inline-place-thumb > span {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--survival-orange, #fbc392);
    font-size: 1rem;
}

.guide-inline-place-title {
    color: #fff;
    font-size: 0.88rem;
    line-height: 1.18;
    font-weight: 800;
}

.guide-inline-place-status {
    flex: 0 0 auto;
    color: rgba(255, 255, 255, 0.36);
    font-size: 0.53rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.guide-inline-place-status.is-ready {
    color: #6ee7b7;
}

.guide-inline-place-address,
.guide-inline-place-note {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    margin-top: 0.3rem;
    color: rgba(255, 255, 255, 0.48);
    font-size: 0.67rem;
    line-height: 1.35;
}

.guide-inline-place-address {
    -webkit-line-clamp: 1;
}

.guide-inline-place-note {
    -webkit-line-clamp: 2;
    color: rgba(255, 255, 255, 0.63);
}

.guide-inline-place-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
    margin-top: 0.65rem;
}

.guide-inline-place-actions button {
    min-width: 0;
    height: 2.1rem;
    border-radius: 0.6rem;
    font-size: 0.58rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.guide-inline-place-secondary {
    border: 1px solid rgba(255, 255, 255, 0.11);
    background: rgba(255, 255, 255, 0.055);
    color: rgba(255, 255, 255, 0.82);
}

.guide-inline-place-primary {
    background: var(--survival-orange, #fbc392);
    color: #08090a;
}

.guide-place-detail-hero h2,
.guide-place-detail-hero p {
    text-shadow: 0 0.125rem 0.65rem rgba(0, 0, 0, 0.7);
}

.guide-place-detail-hero button,
.guide-place-detail-hero > div:last-child {
    z-index: 3;
}

.brand-nav-icon {
    width: 1.15rem;
    height: 1.15rem;
    object-fit: contain;
    border-radius: 999px;
    opacity: 0.72;
    filter: saturate(0.78) brightness(0.82);
    transition: opacity 0.18s ease, filter 0.18s ease, box-shadow 0.18s ease;
}

.nav-tab.text-white .brand-nav-icon {
    opacity: 1;
    filter: saturate(1.08) brightness(1);
    box-shadow: 0 0 14px rgba(0, 229, 212, 0.22);
}

.brand-card-icon-shell {
    padding: 0.2rem;
    overflow: hidden;
}

.brand-card-icon {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 0.85rem;
}

.city-switch-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    width: 7.15rem;
    height: 3.05rem;
    padding: 0.48rem 0.58rem;
    border-radius: 0.95rem;
    border: 1px solid rgba(243, 245, 247, 0.14);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.02));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
    transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.city-switch-pill:hover {
    border-color: rgba(0, 229, 212, 0.28);
    background: linear-gradient(135deg, rgba(0, 229, 212, 0.08), rgba(255, 255, 255, 0.025));
}

.city-switch-icon {
    width: 1.45rem;
    height: 1.45rem;
    object-fit: contain;
    filter: drop-shadow(0 0 10px rgba(0, 229, 212, 0.18));
    flex: 0 0 auto;
}

.explore-liveboard {
    position: relative;
    margin-top: 0.2rem;
    padding: 0.92rem;
    border-radius: 1.35rem;
    border: 1px solid rgba(243, 245, 247, 0.11);
    background:
        linear-gradient(135deg, rgba(0, 229, 212, 0.12), transparent 38%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.02));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.explore-liveboard-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.explore-liveboard h2 {
    margin-top: 0.24rem;
    color: #f3f5f7;
    font-size: 1.58rem;
    line-height: 0.95;
    font-weight: 900;
    letter-spacing: 0;
}

.explore-live-badge {
    flex: 0 0 auto;
    padding: 0.38rem 0.58rem;
    border-radius: 999px;
    border: 1px solid rgba(0, 229, 212, 0.24);
    background: rgba(0, 229, 212, 0.08);
    color: #00e5d4;
    font-size: 0.54rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.explore-quick-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.48rem;
    margin-top: 0.58rem;
}

.explore-quick-stats span {
    min-width: 0;
    padding: 0.48rem 0.55rem;
    border-radius: 0.82rem;
    background: rgba(255, 255, 255, 0.035);
    color: rgba(243, 245, 247, 0.36);
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.explore-quick-stats strong {
    display: block;
    color: #ffb45c;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.explore-feature-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.56rem;
}

.explore-feature-card {
    min-width: 0;
    min-height: 4.85rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.56rem;
    border-radius: 1.12rem;
    border: 1px solid rgba(243, 245, 247, 0.095);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.018));
    text-align: left;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
    transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.explore-feature-card:hover {
    border-color: rgba(0, 229, 212, 0.24);
    background:
        linear-gradient(145deg, rgba(0, 229, 212, 0.08), rgba(255, 255, 255, 0.022));
}

.explore-feature-icon {
    position: relative;
    width: 3.35rem;
    height: 3.55rem;
    flex: 0 0 3.35rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1.05rem;
    border: 1px solid rgba(0, 229, 212, 0.12);
    background:
        radial-gradient(circle at 56% 35%, rgba(0, 229, 212, 0.16), transparent 62%),
        rgba(0, 229, 212, 0.065);
    overflow: visible;
}

.explore-feature-icon--search {
    background:
        radial-gradient(circle at 48% 38%, rgba(255, 180, 92, 0.2), transparent 64%),
        rgba(255, 180, 92, 0.045);
}

.explore-feature-icon--guide {
    background:
        radial-gradient(circle at 50% 40%, rgba(0, 229, 212, 0.18), transparent 64%),
        rgba(0, 229, 212, 0.045);
}

.explore-feature-icon--route {
    background:
        radial-gradient(circle at 50% 40%, rgba(197, 241, 254, 0.16), transparent 64%),
        rgba(197, 241, 254, 0.04);
}

.explore-feature-icon--support {
    background:
        radial-gradient(circle at 50% 40%, rgba(255, 180, 92, 0.16), transparent 64%),
        rgba(243, 245, 247, 0.035);
}

.guide-circle-tips { padding: 13px; border: 1px solid rgba(0,229,212,.16); border-radius: 8px; background: rgba(0,229,212,.035); }
.guide-circle-tip { display: grid; gap: 4px; width: 100%; padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,.07); text-align: left; background: transparent; }
.guide-circle-tip b { color: rgba(255,255,255,.5); font-size: 10px; }.guide-circle-tip span { color: #fff; font-size: 12px; line-height: 1.4; }

/* Travel Circles: community stays inside the existing LandGo mobile shell. */
.circles-shell { padding: 16px 14px calc(110px + env(safe-area-inset-bottom)); }
.circles-header { display: grid; grid-template-columns: 42px 1fr 42px; gap: 10px; align-items: start; }
.circles-header p { margin: 2px 0 0; color: #00e5d4; font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.circles-header h2 { margin: 4px 0 0; color: #fff; font-size: 25px; line-height: 1.05; font-weight: 950; }
.circles-header span { display: block; margin-top: 6px; color: rgba(255,255,255,.46); font-size: 12px; line-height: 1.35; }
.circles-icon-button { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; color: rgba(255,255,255,.76); background: rgba(255,255,255,.045); }
.circles-icon-button.is-accent { border-color: rgba(0,229,212,.35); color: #001117; background: #00e5d4; }
.circles-tabs, .circles-filter { display: flex; gap: 7px; margin-top: 20px; }
.circles-tabs { padding: 4px; border: 1px solid rgba(255,255,255,.08); border-radius: 8px; background: rgba(255,255,255,.03); }
.circles-tabs button { flex: 1; min-height: 36px; border-radius: 6px; color: rgba(255,255,255,.48); font-size: 12px; font-weight: 900; background: transparent; }
.circles-tabs button.is-active { color: #001117; background: #00e5d4; }
.circles-filter button { min-width: 68px; min-height: 30px; padding: 0 11px; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; color: rgba(255,255,255,.55); font-size: 11px; font-weight: 850; background: rgba(255,255,255,.025); }
.circles-filter button.is-active { border-color: rgba(0,229,212,.45); color: #00e5d4; }
.circles-content { min-height: 300px; }.circles-list { display: grid; gap: 11px; margin-top: 13px; }
.circle-post, .circle-question { border: 1px solid rgba(255,255,255,.1); border-radius: 8px; padding: 14px; background: #151619; }
.circle-author { display: grid; grid-template-columns: 34px 1fr 30px; gap: 9px; align-items: center; }.circle-avatar { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; color: #001117; font-size: 13px; font-weight: 950; background: #ffb45c; }.circle-author b { color: #fff; font-size: 12px; }.circle-author small { display: block; margin-top: 2px; color: rgba(255,255,255,.35); font-size: 10px; }.circle-author button { color: rgba(255,255,255,.45); background: transparent; }
.circles-role, .circles-type { display: inline-block; margin-left: 5px; color: #00e5d4; font-size: 9px; font-weight: 900; text-transform: uppercase; }.circles-type { margin: 13px 0 0; color: #ffb45c; letter-spacing: .08em; }
.circle-post h3, .circle-question h3 { margin: 10px 0 0; color: #fff; font-size: 16px; line-height: 1.25; font-weight: 900; }.circle-body, .circle-question p { margin: 9px 0 0; color: rgba(255,255,255,.64); font-size: 13px; line-height: 1.55; white-space: pre-wrap; }
.circles-media { display: grid; grid-template-columns: repeat(2, 1fr); gap: 5px; margin-top: 12px; }.circles-media img { width: 100%; aspect-ratio: 1.2; border-radius: 6px; object-fit: cover; background: #090a0b; }
.circle-place { display: inline-flex; gap: 6px; align-items: center; margin-top: 12px; color: #00e5d4; font-family: monospace; font-size: 11px; background: transparent; }.circle-actions { display: flex; gap: 17px; margin-top: 14px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.07); }.circle-actions button { color: rgba(255,255,255,.5); font-size: 11px; background: transparent; }.circle-actions button.is-active { color: #ffb45c; }
.circles-route { display: grid; grid-template-columns: 29px 1fr auto; gap: 8px; align-items: center; margin-top: 12px; padding: 10px; border: 1px solid rgba(0,229,212,.18); border-radius: 7px; background: rgba(0,229,212,.045); }.circles-route i { color: #00e5d4; }.circles-route b, .circles-route small { display: block; }.circles-route b { color: #fff; font-size: 12px; }.circles-route small { margin-top: 3px; color: rgba(255,255,255,.42); font-size: 10px; }.circles-route button { color: #00e5d4; font-size: 10px; font-weight: 900; background: transparent; }
.circle-question { cursor: pointer; }.circle-question > span { color: #ffb45c; font-size: 10px; font-weight: 900; letter-spacing: .1em; }.circle-question small, .circle-question footer { display: block; margin-top: 11px; color: rgba(255,255,255,.43); font-size: 10px; }.circle-question small i { margin-right: 5px; color: #00e5d4; }
.circles-state { display: grid; justify-items: center; gap: 9px; padding: 64px 24px; color: rgba(255,255,255,.42); text-align: center; font-size: 12px; }.circles-state i { color: #00e5d4; font-size: 23px; }.circles-state strong { color: #fff; font-size: 15px; }.circles-state span { line-height: 1.5; }.circles-state button, .circle-publish { min-height: 42px; padding: 0 15px; border-radius: 7px; color: #001117; font-size: 11px; font-weight: 950; letter-spacing: .06em; background: #00e5d4; }.circles-state.is-error strong { color: #ff8e8e; }
.circles-context { display: flex; gap: 7px; align-items: center; margin-top: 12px; padding: 9px 10px; border: 1px solid rgba(0,229,212,.2); border-radius: 6px; color: #00e5d4; font-size: 11px; }.circles-context button { margin-left: auto; color: rgba(255,255,255,.5); font-size: 10px; background: transparent; }.circles-share-row { display: flex; justify-content: flex-end; margin-top: 14px; }.circles-share-fab { min-height: 43px; padding: 0 15px; border-radius: 7px; color: #001117; font-size: 11px; font-weight: 950; background: #00e5d4; box-shadow: 0 10px 24px rgba(0,0,0,.3); }
.circle-composer { display: grid; gap: 13px; }.circle-composer-head { display: flex; align-items: start; justify-content: space-between; gap: 10px; }.circle-composer-head p { margin: 0; color: #00e5d4; font-size: 10px; font-weight: 900; letter-spacing: .14em; }.circle-composer-head h2 { margin: 4px 0 0; color: #fff; font-size: 21px; font-weight: 950; }.circle-composer-head button { color: rgba(255,255,255,.65); background: transparent; }.circle-type-picker { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; }.circle-type-picker button { min-height: 36px; border: 1px solid rgba(255,255,255,.1); border-radius: 6px; color: rgba(255,255,255,.55); font-size: 11px; font-weight: 850; background: transparent; }.circle-type-picker button.is-active { border-color: rgba(0,229,212,.5); color: #00e5d4; }.circle-composer label { display: grid; gap: 6px; color: rgba(255,255,255,.55); font-size: 11px; font-weight: 800; }.circle-composer input, .circle-composer textarea, .circle-composer select, .circle-comments textarea { width: 100%; border: 1px solid rgba(255,255,255,.11); border-radius: 6px; padding: 10px; outline: none; color: #fff; font: inherit; font-size: 13px; background: rgba(255,255,255,.035); }.circle-composer textarea, .circle-comments textarea { resize: vertical; }.circle-upload { display: flex !important; grid-template-columns: 1fr; align-items: center; min-height: 44px; padding: 0 12px; border: 1px dashed rgba(255,255,255,.18); border-radius: 6px; color: rgba(255,255,255,.65) !important; }.circle-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; }.circle-media-preview { display: flex; gap: 7px; overflow-x: auto; }.circle-media-preview img { width: 66px; height: 66px; border-radius: 6px; object-fit: cover; }.circle-route-preview { padding: 12px; border: 1px solid rgba(0,229,212,.18); border-radius: 6px; color: #00e5d4; }.circle-route-preview b, .circle-route-preview span { display: block; margin-left: 24px; }.circle-route-preview b { margin-top: -15px; color: #fff; font-size: 13px; }.circle-route-preview span { margin-top: 4px; color: rgba(255,255,255,.42); font-size: 10px; }.circle-prefill { margin: -5px 0 0; color: #00e5d4; font-size: 10px; }.circle-moderation { display: grid; gap: 4px; margin-bottom: 12px; padding: 10px; border: 1px solid rgba(255,180,92,.38); border-radius: 6px; color: #ffb45c; font-size: 11px; line-height: 1.4; }.circle-moderation span { color: rgba(255,255,255,.58); }.circle-comment-list { display: grid; gap: 10px; max-height: 40vh; overflow-y: auto; }.circle-comment-list article { padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,.08); }.circle-comment-list b { color: #fff; font-size: 12px; }.circle-comment-list small { margin-left: 6px; color: rgba(255,255,255,.36); font-size: 10px; }.circle-comment-list p, .circles-empty-inline { margin: 5px 0 0; color: rgba(255,255,255,.62); font-size: 12px; line-height: 1.5; }

.explore-feature-icon img {
    width: 4.15rem;
    height: 4.15rem;
    object-fit: contain;
    transform: translateY(0.04rem);
    filter: drop-shadow(0 10px 14px rgba(0, 0, 0, 0.28));
}

.explore-feature-icon--search img {
    width: 4rem;
    height: 4rem;
    transform: translate(-0.12rem, 0.03rem);
}

.explore-feature-copy {
    min-width: 0;
    display: block;
}

.explore-feature-copy strong,
.explore-feature-copy em {
    display: block;
    min-width: 0;
}

.explore-feature-copy strong {
    color: #f3f5f7;
    font-size: 0.74rem;
    line-height: 1.05;
    font-weight: 900;
}

.explore-feature-copy em {
    margin-top: 0.28rem;
    color: rgba(243, 245, 247, 0.38);
    font-size: 0.58rem;
    line-height: 1.1;
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.event-image-fallback {
    background:
        radial-gradient(circle at top left, rgba(255, 180, 92, 0.22), transparent 44%),
        linear-gradient(135deg, #11171b, #08090a);
}

.event-feature-card,
.event-row-card {
    border: 1px solid rgba(243, 245, 247, 0.1);
    background: rgba(255, 255, 255, 0.032);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.16);
}

.event-feature-card {
    overflow: hidden;
    border-radius: 1.35rem;
}

.event-feature-media {
    position: relative;
    height: 10.85rem;
    overflow: hidden;
    background: #0d0e10;
}

.event-pick-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.36rem 0.52rem;
    border-radius: 999px;
    background: rgba(255, 180, 92, 0.94);
    color: #001117;
    font-size: 0.56rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.event-score-chip {
    min-width: 2.35rem;
    height: 2.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.55);
    color: #ffb45c;
    font-size: 0.86rem;
    font-weight: 900;
    font-family: 'JetBrains Mono', monospace;
}

.event-meta-strip {
    display: flex;
    flex-direction: column;
    gap: 0.42rem;
    padding: 0.78rem 0.85rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.035);
    color: rgba(243, 245, 247, 0.52);
    font-size: 0.68rem;
    font-weight: 700;
}

.event-meta-strip span {
    display: flex;
    align-items: center;
    gap: 0.42rem;
    min-width: 0;
}

.event-meta-strip i {
    color: #00e5d4;
    width: 0.8rem;
}

.event-primary-action,
.event-secondary-action {
    height: 2.45rem;
    border-radius: 0.9rem;
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    transition: transform 0.16s ease;
}

.event-primary-action:active,
.event-secondary-action:active {
    transform: scale(0.97);
}

.event-primary-action {
    padding: 0 0.95rem;
    background: #ffb45c;
    color: #001117;
}

.event-secondary-action {
    border: 1px solid rgba(243, 245, 247, 0.1);
    background: rgba(255, 255, 255, 0.045);
    color: rgba(243, 245, 247, 0.7);
}

.event-row-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    gap: 0.5rem;
    border-radius: 1.08rem;
    padding: 0.48rem;
}

.event-row-main {
    width: 100%;
    display: flex;
    align-items: stretch;
    gap: 0.72rem;
    text-align: left;
}

.event-row-thumb {
    position: relative;
    width: 4.55rem;
    min-height: 4.92rem;
    flex: 0 0 4.55rem;
    overflow: hidden;
    border-radius: 0.84rem;
    background: #0d0e10;
}

.event-row-actions {
    display: flex;
    align-items: center;
}

.event-row-add {
    width: 2.55rem;
    height: 100%;
    min-height: 4.92rem;
    border-radius: 0.88rem;
    background: #ffb45c;
    color: #001117;
    font-size: 0.74rem;
    font-weight: 900;
}

.explore-note-card {
    width: 100%;
    border-radius: 1rem;
    border: 1px solid rgba(243, 245, 247, 0.085);
    background: rgba(255, 255, 255, 0.028);
    padding: 0.78rem;
    text-align: left;
    transition: transform 0.16s ease, border-color 0.16s ease;
}

.explore-note-card:active,
.explore-service-card:active {
    transform: scale(0.98);
}

.official-guide-card {
    position: relative;
    min-height: 8.1rem;
    overflow: hidden;
    isolation: isolate;
    border-color: rgba(243, 245, 247, 0.12);
    background: #141518;
    padding: 1rem;
}

.official-guide-card-image,
.official-guide-card-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.official-guide-card-image {
    z-index: 0;
    opacity: 0.68;
}

.official-guide-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.official-guide-card-overlay {
    z-index: 1;
    background: linear-gradient(90deg, rgba(12, 13, 15, 0.86) 0%, rgba(12, 13, 15, 0.62) 58%, rgba(12, 13, 15, 0.24) 100%);
}

.official-guide-card-content {
    position: relative;
    z-index: 2;
    display: flex;
    min-height: 6.1rem;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    max-width: 92%;
}

.official-guide-card-kicker {
    color: #ffb45c;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1.1;
    text-transform: uppercase;
}

.official-guide-card-title {
    display: block;
    margin-top: 0.32rem;
    color: #fff;
    font-size: 1.08rem;
    font-weight: 900;
    line-height: 1.14;
}

.official-guide-card-summary {
    display: block;
    margin-top: 0.38rem;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.7rem;
    line-height: 1.38;
}

.explore-note-mark {
    width: 2.28rem;
    height: 2.28rem;
    border-radius: 0.86rem;
    border: 1px solid rgba(0, 229, 212, 0.18);
    background: rgba(0, 229, 212, 0.07);
    color: #00e5d4;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.explore-service-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}

.explore-service-card {
    min-height: 5.2rem;
    border-radius: 1rem;
    border: 1px solid rgba(243, 245, 247, 0.085);
    background: rgba(255, 255, 255, 0.028);
    padding: 0.82rem;
    text-align: left;
}

.explore-service-card i {
    color: #ffb45c;
    font-size: 1rem;
}

.explore-service-card p {
    margin-top: 0.62rem;
    color: #f3f5f7;
    font-size: 0.78rem;
    line-height: 1.1;
    font-weight: 900;
}

.explore-service-card span {
    display: block;
    margin-top: 0.3rem;
    color: rgba(243, 245, 247, 0.38);
    font-size: 0.66rem;
    line-height: 1.35;
}

.explore-channel-list {
    display: grid;
    gap: 0.65rem;
}

.explore-channel-card {
    width: 100%;
    display: grid;
    grid-template-columns: 5rem minmax(0, 1fr);
    gap: 0.72rem;
    align-items: stretch;
    padding: 0.55rem;
    border-radius: 1rem;
    border: 1px solid rgba(243, 245, 247, 0.09);
    background: rgba(255, 255, 255, 0.032);
    text-align: left;
}

.explore-channel-thumb {
    position: relative;
    min-height: 5.2rem;
    border-radius: 0.82rem;
    overflow: hidden;
    background: #0d0e10;
}

.translation-mode-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
    margin-top: 0.9rem;
}

.translation-mode-tab {
    min-width: 0;
    height: 2.45rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.38rem;
    border-radius: 0.88rem;
    border: 1px solid rgba(243, 245, 247, 0.085);
    background: rgba(255, 255, 255, 0.032);
    color: rgba(243, 245, 247, 0.52);
    font-size: 0.66rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.translation-mode-tab.is-active {
    border-color: rgba(0, 229, 212, 0.28);
    background: rgba(0, 229, 212, 0.11);
    color: #00e5d4;
}

.my-ogo-status,
.my-trip-overview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    border-radius: 1.18rem;
    border: 1px solid rgba(243, 245, 247, 0.09);
    background: rgba(255, 255, 255, 0.032);
    padding: 0.78rem;
    margin-bottom: 0.72rem;
}

.trip-build-entry {
    display: grid;
    gap: 0.8rem;
    border: 1px solid rgba(0, 229, 212, 0.2);
    border-radius: 1.18rem;
    background: linear-gradient(135deg, rgba(0, 229, 212, 0.1), rgba(255, 255, 255, 0.028));
    padding: 0.95rem;
    margin-bottom: 0.72rem;
}

.trip-build-kicker {
    color: #00e5d4;
    font-size: 0.6rem;
    font-weight: 900;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.trip-build-entry h2 {
    color: #f3f5f7;
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: -0.02em;
    margin-top: 0.25rem;
}

.trip-build-entry > div:first-child p:last-child {
    color: rgba(243, 245, 247, 0.5);
    font-size: 0.7rem;
    line-height: 1.45;
    margin-top: 0.3rem;
}

.trip-build-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

.trip-build-action {
    min-height: 2.7rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    border-radius: 0.85rem;
    border: 1px solid rgba(243, 245, 247, 0.1);
    background: rgba(255, 255, 255, 0.045);
    color: rgba(243, 245, 247, 0.8);
    font-size: 0.64rem;
    font-weight: 900;
    letter-spacing: 0.04em;
}

.trip-build-action--primary {
    border-color: transparent;
    background: #ffb45c;
    color: #001117;
}

.trip-import-row,
.trip-add-place-row {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    border: 1px solid rgba(243, 245, 247, 0.08);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.03);
    padding: 0.75rem;
}

.trip-import-row.is-selected,
.trip-add-place-row.is-selected {
    border-color: rgba(0, 229, 212, 0.42);
    background: rgba(0, 229, 212, 0.08);
}

.trip-import-row img,
.trip-add-place-row img {
    width: 3rem;
    height: 3rem;
    flex: 0 0 3rem;
    border-radius: 0.75rem;
    object-fit: cover;
    background: #0d0e10;
}

.my-ogo-avatar {
    width: 4.25rem;
    height: 4.25rem;
    flex: 0 0 4.25rem;
    object-fit: cover;
    border-radius: 1.25rem;
    border: 1px solid rgba(0, 229, 212, 0.18);
    background: rgba(0, 229, 212, 0.06);
}

.my-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.56rem;
}

.my-feature-card {
    min-height: 5.1rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0.82rem;
    border-radius: 1rem;
    border: 1px solid rgba(243, 245, 247, 0.085);
    background: rgba(255, 255, 255, 0.03);
    text-align: left;
    transition: transform 0.16s ease, border-color 0.16s ease;
}

.my-feature-card:active {
    transform: scale(0.98);
}

.my-feature-card--primary {
    background: #ffb45c;
    color: #001117;
}

.my-feature-card:not(.my-feature-card--primary) {
    color: #f3f5f7;
}

.my-feature-card i {
    font-size: 1rem;
    color: inherit;
    opacity: 0.9;
}

.my-feature-card span {
    display: block;
    margin-top: 0.68rem;
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.my-feature-card em {
    display: block;
    margin-top: 0.18rem;
    color: currentColor;
    opacity: 0.46;
    font-size: 0.62rem;
    font-style: normal;
    font-weight: 800;
}

.city-sheet-row {
    width: 100%;
    min-height: 3.7rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem;
    border-radius: 1rem;
    border: 1px solid rgba(0, 229, 212, 0.22);
    background: rgba(0, 229, 212, 0.07);
    text-align: left;
}

.navigation-mode-grid {
    display: grid;
    gap: 0.55rem;
}

.navigation-mode-option {
    width: 100%;
    min-height: 4.2rem;
    display: flex;
    align-items: center;
    gap: 0.78rem;
    padding: 0.72rem;
    border-radius: 1.05rem;
    border: 1px solid rgba(243, 245, 247, 0.09);
    background: rgba(255, 255, 255, 0.032);
    color: rgba(243, 245, 247, 0.74);
    text-align: left;
    transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.navigation-mode-option.is-active {
    border-color: rgba(255, 180, 92, 0.32);
    background: rgba(255, 180, 92, 0.1);
    color: #f3f5f7;
}

.navigation-mode-icon {
    width: 2.72rem;
    height: 2.72rem;
    flex: 0 0 2.72rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.95rem;
    border: 1px solid rgba(0, 229, 212, 0.18);
    background: rgba(0, 229, 212, 0.07);
    color: #00e5d4;
}

.navigation-mode-option.is-active .navigation-mode-icon {
    border-color: rgba(255, 180, 92, 0.35);
    background: rgba(255, 180, 92, 0.16);
    color: #ffb45c;
}

@keyframes ogoFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}

@keyframes ogoPulse {
    0%, 100% { opacity: .72; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.04); }
}

@media (prefers-reduced-motion: reduce) {
    .ogo-hero-asset,
    .ogo-pulse-pin,
    .animate-slide-up,
    .animate-fade-in,
    .recording-active {
        animation: none !important;
        transition: none !important;
    }
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background: var(--glass-background-base);
    color: #FFFFFF;
    min-height: var(--landgo-app-height);
    overflow-x: hidden;
    position: relative;
    -webkit-font-smoothing: antialiased;
}

/* 动态环境光背景 */
.ambient-flow {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(circle at 85% 15%, var(--glass-glow-top) 0%, transparent 50%),
        radial-gradient(circle at 15% 85%, var(--glass-glow-bottom) 0%, transparent 40%),
        var(--glass-background-base);
    opacity: 0.25;
}

/* 核心毛玻璃面板 */
.glass-surface {
    background: var(--glass-surface);
    backdrop-filter: var(--glass-blur) var(--glass-saturate);
    -webkit-backdrop-filter: var(--glass-blur) var(--glass-saturate);
    border: 1px solid var(--glass-stroke);
    box-shadow: var(--glass-shadow), inset 0 1px 0 var(--glass-highlight);
    position: relative;
    overflow: hidden;
}

/* 顶部高光反射边 */
.glass-surface::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15) 20%, rgba(255, 255, 255, 0.15) 80%, transparent);
    z-index: 1;
}

/* Toast 提示框动画 */
#toast {
    box-shadow: 0 0 20px rgba(0,0,0,0.5);
}
#toast.show {
    opacity: 1;
    transform: translate(-50%, 10px);
}

/* 视图切换的渐入动画 */
.animate-fade-in {
    animation: fadeIn 0.3s ease-out forwards;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (prefers-color-scheme: dark) {
    .glass-surface {
        background: rgba(28, 29, 33, 0.85);
    }
}

/* Tailwind CDN fallback for Studio iframe/live preview.
   The app normally uses Tailwind CDN utilities. When the CDN is slow or blocked,
   the backend preview must still look like the public mobile page. */
.font-sans { font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.font-mono { font-family: "JetBrains Mono", Consolas, monospace; }
.fixed { position: fixed; }
.absolute { position: absolute; }
.relative { position: relative; }
.sticky { position: sticky; }
.inset-0 { inset: 0; }
.inset-6 { inset: 1.5rem; }
.left-0 { left: 0; }
.left-4 { left: 1rem; }
.left-5 { left: 1.25rem; }
[class~="left-[5px]"] { left: 5px; }
.left-1\/2 { left: 50%; }
.right-4 { right: 1rem; }
.right-5 { right: 1.25rem; }
.top-0 { top: 0; }
.top-4 { top: 1rem; }
.top-5 { top: 1.25rem; }
.top-8 { top: 2rem; }
.top-12 { top: 3rem; }
.bottom-4 { bottom: 1rem; }
.bottom-5 { bottom: 1.25rem; }
.bottom-10 { bottom: 2.5rem; }
[class~="bottom-[-0.85rem]"] { bottom: -0.85rem; }
.-translate-x-1\/2 { transform: translateX(-50%); }
.block { display: block; }
.hidden { display: none; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.grid { display: grid; }
.flex-1 { flex: 1 1 0%; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.shrink-0 { flex-shrink: 0; }
.items-start { align-items: flex-start; }
.items-center { align-items: center; }
.items-end { align-items: flex-end; }
.justify-start { justify-content: flex-start; }
.justify-center { justify-content: center; }
.justify-end { justify-content: flex-end; }
.justify-between { justify-content: space-between; }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
[class~="grid-cols-[1fr_auto]"] { grid-template-columns: minmax(0, 1fr) auto; }
[class~="grid-cols-[5.25rem_minmax(0,1fr)]"] { grid-template-columns: 5.25rem minmax(0, 1fr); }
[class~="grid-cols-[6.25rem_minmax(0,1fr)]"] { grid-template-columns: 6.25rem minmax(0, 1fr); }
.gap-1 { gap: 0.25rem; }
.gap-1\.5 { gap: 0.375rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
[class~="gap-[2px]"] { gap: 2px; }
[class~="gap-[3px]"] { gap: 3px; }
.min-w-0 { min-width: 0; }
[class~="min-w-[6rem]"] { min-width: 6rem; }
[class~="min-w-[8rem]"] { min-width: 8rem; }
[class~="min-h-[7.25rem]"] { min-height: 7.25rem; }
[class~="min-h-[150px]"] { min-height: 150px; }
.w-full { width: 100%; }
.w-1\/5 { width: 20%; }
.w-4\/5 { width: 80%; }
.w-3 { width: 0.75rem; }
.w-8 { width: 2rem; }
.w-9 { width: 2.25rem; }
.w-10 { width: 2.5rem; }
.w-11 { width: 2.75rem; }
.w-12 { width: 3rem; }
.w-14 { width: 3.5rem; }
.w-20 { width: 5rem; }
[class~="w-[2.5rem]"] { width: 2.5rem; }
[class~="w-[96%]"] { width: 96%; }
.h-full { height: 100%; }
.h-1 { height: 0.25rem; }
.h-3 { height: 0.75rem; }
.h-8 { height: 2rem; }
.h-9 { height: 2.25rem; }
.h-10 { height: 2.5rem; }
.h-11 { height: 2.75rem; }
.h-12 { height: 3rem; }
.h-14 { height: 3.5rem; }
.h-20 { height: 5rem; }
.h-28 { height: 7rem; }
.h-36 { height: 9rem; }
.h-44 { height: 11rem; }
.h-56 { height: 14rem; }
[class~="h-[2.1rem]"] { height: 2.1rem; }
[class~="h-[2.9rem]"] { height: 2.9rem; }
[class~="h-[4.8rem]"] { height: 4.8rem; }
.max-w-md { max-width: 28rem; }
[class~="max-w-[10.9rem]"] { max-width: 10.9rem; }
[class~="max-w-[85%]"] { max-width: 85%; }
[class~="max-w-[88%]"] { max-width: 88%; }
.max-h-60 { max-height: 15rem; }
[class~="max-h-[220px]"] { max-height: 220px; }
[class~="max-h-[75vh]"] { max-height: 75vh; }
[class~="max-h-[88vh]"] { max-height: 88vh; }
[class~="aspect-[3/4]"] { aspect-ratio: 3 / 4; }
.mx-auto { margin-left: auto; margin-right: auto; }
.mx-3 { margin-left: 0.75rem; margin-right: 0.75rem; }
.mt-auto { margin-top: auto; }
.mt-0\.5 { margin-top: 0.125rem; }
.mt-1 { margin-top: 0.25rem; }
.mt-1\.5 { margin-top: 0.375rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-2\.5 { margin-top: 0.625rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mt-5 { margin-top: 1.25rem; }
.mb-0\.5 { margin-bottom: 0.125rem; }
.mb-1 { margin-bottom: 0.25rem; }
.mb-1\.5 { margin-bottom: 0.375rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-2\.5 { margin-bottom: 0.625rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-5 { margin-bottom: 1.25rem; }
.ml-0\.5 { margin-left: 0.125rem; }
.mr-1 { margin-right: 0.25rem; }
.mr-2 { margin-right: 0.5rem; }
.p-0 { padding: 0; }
.p-1 { padding: 0.25rem; }
.p-2 { padding: 0.5rem; }
.p-3 { padding: 0.75rem; }
.p-3\.5 { padding: 0.875rem; }
.p-4 { padding: 1rem; }
.p-5 { padding: 1.25rem; }
.px-1 { padding-left: 0.25rem; padding-right: 0.25rem; }
.px-1\.5 { padding-left: 0.375rem; padding-right: 0.375rem; }
.px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
.px-2\.5 { padding-left: 0.625rem; padding-right: 0.625rem; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.py-0\.5 { padding-top: 0.125rem; padding-bottom: 0.125rem; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-1\.5 { padding-top: 0.375rem; padding-bottom: 0.375rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-8 { padding-top: 2rem; padding-bottom: 2rem; }
.py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.pt-3 { padding-top: 0.75rem; }
.pt-4 { padding-top: 1rem; }
.pb-1 { padding-bottom: 0.25rem; }
.pb-2 { padding-bottom: 0.5rem; }
.pb-3 { padding-bottom: 0.75rem; }
.pb-4 { padding-bottom: 1rem; }
.pb-7 { padding-bottom: 1.75rem; }
.pb-8 { padding-bottom: 2rem; }
.pb-24 { padding-bottom: 6rem; }
.pb-28 { padding-bottom: 7rem; }
.pl-2 { padding-left: 0.5rem; }
.pl-6 { padding-left: 1.5rem; }
.pr-1 { padding-right: 0.25rem; }
.pr-2 { padding-right: 0.5rem; }
.space-y-2 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.5rem; }
.space-y-3 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.75rem; }
.space-y-4 > :not([hidden]) ~ :not([hidden]) { margin-top: 1rem; }
.overflow-hidden { overflow: hidden; }
.overflow-y-auto { overflow-y: auto; }
.overflow-x-auto { overflow-x: auto; }
.object-cover { object-fit: cover; }
.object-contain { object-fit: contain; }
.resize-none { resize: none; }
.pointer-events-none { pointer-events: none; }
.select-none { user-select: none; }
.cursor-pointer { cursor: pointer; }
.outline-none { outline: 0; }
.border { border-width: 1px; border-style: solid; }
.border-t { border-top-width: 1px; border-top-style: solid; }
.border-b { border-bottom-width: 1px; border-bottom-style: solid; }
.border-l { border-left-width: 1px; border-left-style: solid; }
.border-none { border: 0; }
.border-dashed { border-style: dashed; }
[class~="border-white/5"] { border-color: rgba(255,255,255,0.05); }
[class~="border-white/8"] { border-color: rgba(255,255,255,0.08); }
[class~="border-white/10"] { border-color: rgba(255,255,255,0.10); }
[class~="border-white/15"] { border-color: rgba(255,255,255,0.15); }
[class~="border-[#00E5D4]/20"] { border-color: rgba(0,229,212,0.20); }
[class~="border-[#00E5D4]/45"] { border-color: rgba(0,229,212,0.45); }
[class~="border-survival-orange/15"] { border-color: rgba(255,180,92,0.15); }
[class~="border-survival-orange/20"] { border-color: rgba(255,180,92,0.20); }
[class~="border-survival-orange/35"] { border-color: rgba(255,180,92,0.35); }
[class~="border-survival-orange/50"] { border-color: rgba(255,180,92,0.50); }
[class~="border-cyan-300/15"] { border-color: rgba(103,232,249,0.15); }
[class~="border-red-500/30"] { border-color: rgba(239,68,68,0.30); }
.rounded { border-radius: 0.25rem; }
.rounded-lg { border-radius: 0.5rem; }
.rounded-xl { border-radius: 0.75rem; }
.rounded-2xl { border-radius: 1rem; }
.rounded-full { border-radius: 9999px; }
[class~="rounded-[1rem]"] { border-radius: 1rem; }
[class~="rounded-[1.1rem]"] { border-radius: 1.1rem; }
[class~="rounded-[1.25rem]"] { border-radius: 1.25rem; }
[class~="rounded-[1.3rem]"] { border-radius: 1.3rem; }
[class~="rounded-[1.5rem]"] { border-radius: 1.5rem; }
[class~="rounded-t-[1.5rem]"] { border-top-left-radius: 1.5rem; border-top-right-radius: 1.5rem; }
[class~="rounded-t-[1.6rem]"] { border-top-left-radius: 1.6rem; border-top-right-radius: 1.6rem; }
[class~="rounded-t-[2rem]"] { border-top-left-radius: 2rem; border-top-right-radius: 2rem; }
.bg-transparent { background-color: transparent; }
.bg-black { background-color: #000; }
[class~="bg-black/25"] { background-color: rgba(0,0,0,0.25); }
[class~="bg-black/30"] { background-color: rgba(0,0,0,0.30); }
[class~="bg-black/55"] { background-color: rgba(0,0,0,0.55); }
[class~="bg-black/65"] { background-color: rgba(0,0,0,0.65); }
[class~="bg-black/70"] { background-color: rgba(0,0,0,0.70); }
[class~="bg-[#08090A]"] { background-color: #08090A; }
[class~="bg-[#08090A]/95"] { background-color: rgba(8,9,10,0.95); }
[class~="bg-[#0d0e10]"] { background-color: #0d0e10; }
[class~="bg-[#101114]"] { background-color: #101114; }
[class~="bg-[#101114]/95"] { background-color: rgba(16,17,20,0.95); }
[class~="bg-[#101114]/98"] { background-color: rgba(16,17,20,0.98); }
[class~="bg-[#121214]"] { background-color: #121214; }
[class~="bg-[#1C1D21]/95"] { background-color: rgba(28,29,33,0.95); }
[class~="bg-[#00E5D4]/10"] { background-color: rgba(0,229,212,0.10); }
[class~="bg-[#FFB45C]"], .bg-survival-orange { background-color: #ffb45c; }
[class~="bg-survival-orange/10"] { background-color: rgba(255,180,92,0.10); }
[class~="bg-survival-orange/20"] { background-color: rgba(255,180,92,0.20); }
[class~="bg-cyan-300/5"] { background-color: rgba(103,232,249,0.05); }
[class~="bg-cyan-300/10"] { background-color: rgba(103,232,249,0.10); }
[class~="bg-cyan-300/[0.045]"] { background-color: rgba(103,232,249,0.045); }
[class~="bg-white/5"] { background-color: rgba(255,255,255,0.05); }
[class~="bg-white/15"] { background-color: rgba(255,255,255,0.15); }
[class~="bg-white/[0.02]"] { background-color: rgba(255,255,255,0.02); }
[class~="bg-white/[0.025]"] { background-color: rgba(255,255,255,0.025); }
[class~="bg-white/[0.035]"] { background-color: rgba(255,255,255,0.035); }
[class~="bg-white/[0.04]"] { background-color: rgba(255,255,255,0.04); }
[class~="bg-white/[0.045]"] { background-color: rgba(255,255,255,0.045); }
[class~="bg-white/[0.05]"] { background-color: rgba(255,255,255,0.05); }
[class~="bg-white/[0.055]"] { background-color: rgba(255,255,255,0.055); }
[class~="bg-white/[0.06]"] { background-color: rgba(255,255,255,0.06); }
.bg-gradient-to-t { background-image: linear-gradient(to top, var(--tw-gradient-stops)); }
.from-\[\#101114\] { --tw-gradient-from: #101114; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(16,17,20,0)); }
[class~="from-black/88"] { --tw-gradient-from: rgba(0,0,0,0.88); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(0,0,0,0)); }
[class~="via-black/18"] { --tw-gradient-stops: var(--tw-gradient-from), rgba(0,0,0,0.18), var(--tw-gradient-to, rgba(0,0,0,0)); }
[class~="via-black/30"] { --tw-gradient-stops: var(--tw-gradient-from), rgba(0,0,0,0.30), var(--tw-gradient-to, rgba(0,0,0,0)); }
[class~="to-black/5"] { --tw-gradient-to: rgba(0,0,0,0.05); }
[class~="to-black/10"] { --tw-gradient-to: rgba(0,0,0,0.10); }
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-xs { font-size: 0.75rem; line-height: 1rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-base { font-size: 1rem; line-height: 1.5rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
.text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
.text-5xl { font-size: 3rem; line-height: 1; }
[class~="text-[8px]"] { font-size: 8px; }
[class~="text-[9px]"] { font-size: 9px; }
[class~="text-[10px]"] { font-size: 10px; }
[class~="text-[11px]"] { font-size: 11px; }
[class~="text-[13px]"] { font-size: 13px; }
[class~="text-[15px]"] { font-size: 15px; }
[class~="text-[18px]"] { font-size: 18px; }
[class~="text-[1.08rem]"] { font-size: 1.08rem; }
[class~="text-[1.55rem]"] { font-size: 1.55rem; }
[class~="text-[2.82rem]"] { font-size: 2.82rem; }
.font-bold { font-weight: 700; }
.font-black { font-weight: 900; }
.uppercase { text-transform: uppercase; }
.italic { font-style: italic; }
.leading-none { line-height: 1; }
.leading-tight { line-height: 1.1; }
.leading-snug { line-height: 1.375; }
.leading-relaxed { line-height: 1.625; }
[class~="leading-[0.9]"] { line-height: 0.9; }
[class~="leading-[0.96]"] { line-height: 0.96; }
.tracking-tight { letter-spacing: -0.025em; }
.tracking-tighter { letter-spacing: -0.05em; }
.tracking-wider { letter-spacing: 0.05em; }
.tracking-widest { letter-spacing: 0.1em; }
[class~="tracking-[0.08em]"] { letter-spacing: 0.08em; }
[class~="tracking-[0.1em]"] { letter-spacing: 0.1em; }
[class~="tracking-[0.14em]"] { letter-spacing: 0.14em; }
[class~="tracking-[0.16em]"] { letter-spacing: 0.16em; }
[class~="tracking-[0.18em]"] { letter-spacing: 0.18em; }
[class~="tracking-[0.2em]"] { letter-spacing: 0.2em; }
[class~="tracking-[0.22em]"] { letter-spacing: 0.22em; }
[class~="tracking-[0.24em]"] { letter-spacing: 0.24em; }
.text-white { color: #fff; }
[class~="text-white/20"] { color: rgba(255,255,255,0.20); }
[class~="text-white/25"] { color: rgba(255,255,255,0.25); }
[class~="text-white/28"] { color: rgba(255,255,255,0.28); }
[class~="text-white/30"] { color: rgba(255,255,255,0.30); }
[class~="text-white/32"] { color: rgba(255,255,255,0.32); }
[class~="text-white/35"] { color: rgba(255,255,255,0.35); }
[class~="text-white/38"] { color: rgba(255,255,255,0.38); }
[class~="text-white/40"] { color: rgba(255,255,255,0.40); }
[class~="text-white/42"] { color: rgba(255,255,255,0.42); }
[class~="text-white/45"] { color: rgba(255,255,255,0.45); }
[class~="text-white/48"] { color: rgba(255,255,255,0.48); }
[class~="text-white/50"] { color: rgba(255,255,255,0.50); }
[class~="text-white/52"] { color: rgba(255,255,255,0.52); }
[class~="text-white/55"] { color: rgba(255,255,255,0.55); }
[class~="text-white/60"] { color: rgba(255,255,255,0.60); }
[class~="text-white/62"] { color: rgba(255,255,255,0.62); }
[class~="text-white/64"] { color: rgba(255,255,255,0.64); }
[class~="text-white/65"] { color: rgba(255,255,255,0.65); }
[class~="text-white/70"] { color: rgba(255,255,255,0.70); }
[class~="text-white/75"] { color: rgba(255,255,255,0.75); }
[class~="text-white/80"] { color: rgba(255,255,255,0.80); }
[class~="text-white/90"] { color: rgba(255,255,255,0.90); }
[class~="text-[#001117]"] { color: #001117; }
[class~="text-[#08090A]"] { color: #08090A; }
[class~="text-[#00E5D4]"] { color: #00E5D4; }
[class~="text-[#00E5D4]/70"] { color: rgba(0,229,212,0.70); }
[class~="text-[#00E5D4]/75"] { color: rgba(0,229,212,0.75); }
[class~="text-[#FFB45C]"], .text-survival-orange { color: #ffb45c; }
[class~="text-survival-orange/60"] { color: rgba(255,180,92,0.60); }
[class~="text-survival-orange/70"] { color: rgba(255,180,92,0.70); }
[class~="text-survival-orange/80"] { color: rgba(255,180,92,0.80); }
.text-cyan-200 { color: #a5f3fc; }
.text-emerald-300 { color: #6ee7b7; }
.text-red-300 { color: #fca5a5; }
[class~="text-red-300/80"] { color: rgba(252,165,165,0.80); }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.break-words { overflow-wrap: break-word; }
.whitespace-pre-line { white-space: pre-line; }
.whitespace-pre-wrap { white-space: pre-wrap; }
.line-clamp-1,
.line-clamp-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.line-clamp-1 { -webkit-line-clamp: 1; line-clamp: 1; }
.line-clamp-2 { -webkit-line-clamp: 2; line-clamp: 2; }
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-40 { z-index: 40; }
.z-50 { z-index: 50; }
[class~="z-[176]"] { z-index: 176; }
[class~="z-[180]"] { z-index: 180; }
[class~="z-[190]"] { z-index: 190; }
[class~="z-[200]"] { z-index: 200; }
[class~="z-[300]"] { z-index: 300; }
.opacity-0 { opacity: 0; }
.opacity-55 { opacity: 0.55; }
.opacity-90 { opacity: 0.9; }
.opacity-100 { opacity: 1; }
.shadow-lg { box-shadow: 0 10px 15px rgba(0,0,0,0.1), 0 4px 6px rgba(0,0,0,0.1); }
.shadow-2xl { box-shadow: 0 25px 50px rgba(0,0,0,0.25); }
[class~="shadow-[0_0_16px_rgba(251,195,146,0.55)]"] { box-shadow: 0 0 16px rgba(251,195,146,0.55); }
[class~="drop-shadow-[0_24px_34px_rgba(0,0,0,0.42)]"] { filter: drop-shadow(0 24px 34px rgba(0,0,0,0.42)); }
.backdrop-blur-sm { backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.backdrop-blur-xl { backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); }
.transition { transition-property: color, background-color, border-color, transform, opacity, box-shadow; transition-duration: 150ms; }
.transition-all { transition: all 150ms ease; }
.transition-colors { transition-property: color, background-color, border-color; transition-duration: 150ms; }
.transition-opacity { transition-property: opacity; transition-duration: 150ms; }
[class~="active:scale-95"]:active { transform: scale(0.95); }
[class~="active:scale-[0.98]"]:active { transform: scale(0.98); }
[class~="active:scale-[0.99]"]:active { transform: scale(0.99); }
[class~="hover:text-white/80"]:hover { color: rgba(255,255,255,0.80); }
[class~="placeholder:text-white/25"]::placeholder { color: rgba(255,255,255,0.25); }
[class~="focus:ring-0"]:focus { box-shadow: none; }
[class~="focus:border-survival-orange/50"]:focus { border-color: rgba(255,180,92,0.50); }

.landgo-page {
    min-height: var(--landgo-app-height);
}

.landgo-page > main {
    width: 100%;
    padding-bottom: calc(5.65rem + env(safe-area-inset-bottom));
}

.landgo-bottom-nav {
    width: min(96%, 28rem);
    bottom: max(0.45rem, env(safe-area-inset-bottom));
    margin: 0;
}

/* Service request MVP */
.service-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid rgba(255, 255, 255, 0.10);
    background: rgba(255, 255, 255, 0.035);
    color: rgba(255, 255, 255, 0.62);
    border-radius: 999px;
    padding: 0.55rem 0.7rem;
    font-size: 0.68rem;
    font-weight: 900;
}

.service-chip input { accent-color: #FFB45C; }
.service-chip:has(input:checked),
.service-chip.is-active {
    border-color: rgba(255, 180, 92, 0.48);
    background: rgba(255, 180, 92, 0.12);
    color: #FFB45C;
}

.service-stepper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
}

.service-stepper span {
    height: 0.32rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.10);
    text-indent: -999px;
    overflow: hidden;
}

.service-stepper span.is-active { background: #FFB45C; }

.service-empty,
.service-info-box {
    border: 1px solid rgba(255, 255, 255, 0.10);
    background: rgba(255, 255, 255, 0.035);
    border-radius: 1.25rem;
    padding: 1rem;
    color: rgba(255, 255, 255, 0.58);
    font-size: 0.78rem;
    line-height: 1.55;
}

.service-empty h3 {
    color: #fff;
    font-weight: 1000;
    font-size: 1rem;
    margin-bottom: 0.35rem;
}

.service-info-box strong { color: #FFB45C; }
.service-link { display: inline-flex; margin-top: 0.75rem; color: #00E5D4; font-weight: 900; }
.service-section-label { color: rgba(255,255,255,.35); font-size: .66rem; font-weight: 1000; letter-spacing: .18em; text-transform: uppercase; }

.service-request-card {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.10);
    background: rgba(255, 255, 255, 0.035);
    border-radius: 1.15rem;
    padding: 0.85rem;
}

.service-request-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.9rem;
    display: grid;
    place-items: center;
    color: #08090A;
    background: #FFB45C;
    flex: 0 0 auto;
}

.service-request-icon--route { background: #00E5D4; }
.service-status { color: #00E5D4; font-size: .62rem; font-weight: 1000; text-transform: uppercase; letter-spacing: .08em; }

.service-delivered-route {
    border: 1px solid rgba(0, 229, 212, 0.18);
    background: rgba(0, 229, 212, 0.045);
    border-radius: 1.25rem;
    padding: 1rem;
}

.service-route-stop {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    border: 1px solid rgba(255, 255, 255, 0.09);
    background: rgba(0, 0, 0, 0.22);
    border-radius: 1rem;
    padding: 0.8rem;
    margin-top: 0.5rem;
}

.service-mini-btn {
    height: 1.75rem;
    min-width: 2.75rem;
    border-radius: 0.7rem;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.10);
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.6rem;
    font-weight: 1000;
    text-transform: uppercase;
}

/* Tickets entry + Ogo quick help */
.home-need-section {
    margin-top: 1.1rem;
    padding: 1rem;
    border: 1px solid rgba(255,255,255,.09);
    background: rgba(255,255,255,.035);
    border-radius: 1.35rem;
}

.home-need-section h2 {
    color: #fff;
    font-weight: 1000;
    font-size: 1.05rem;
    line-height: 1.05;
}

.home-need-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
    margin-top: .8rem;
}

.home-need-card {
    min-height: 4.75rem;
    border: 1px solid rgba(255,255,255,.09);
    background: rgba(0,0,0,.22);
    border-radius: 1rem;
    padding: .75rem;
    text-align: left;
    color: #fff;
}

.home-need-card.is-primary {
    background: linear-gradient(135deg, rgba(255,180,92,.24), rgba(0,229,212,.08));
    border-color: rgba(255,180,92,.34);
}

.home-need-card i {
    color: #FFB45C;
    font-size: .95rem;
}

.home-need-card strong {
    display: block;
    margin-top: .5rem;
    font-size: .78rem;
    line-height: 1.05;
    font-weight: 1000;
}

.home-need-card span {
    display: block;
    margin-top: .2rem;
    color: rgba(255,255,255,.45);
    font-size: .58rem;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.tickets-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    border: 1px solid rgba(0,229,212,.16);
    background:
        radial-gradient(circle at 15% 0%, rgba(0,229,212,.14), transparent 34%),
        linear-gradient(135deg, rgba(0,229,212,.08), rgba(255,180,92,.06));
    border-radius: 1.25rem;
    padding: .86rem .9rem;
}

.tickets-hero h2 {
    margin-top: .18rem;
    color: #f3f5f7;
    font-size: 1.34rem;
    line-height: 1;
    font-weight: 1000;
    letter-spacing: 0;
}

.tickets-hero p:not(.ticket-hero-kicker) {
    margin-top: .34rem;
    color: rgba(243,245,247,.48);
    font-size: .68rem;
    line-height: 1.3;
    font-weight: 750;
}

.ticket-hero-kicker {
    color: #00E5D4;
    font-size: .58rem;
    font-weight: 1000;
    letter-spacing: .2em;
    text-transform: uppercase;
}

.ticket-hero-action {
    flex: 0 0 auto;
    min-width: 5.6rem;
    height: 2.45rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .42rem;
    border-radius: .92rem;
    border: 1px solid rgba(255,180,92,.22);
    background: #FFB45C;
    color: #08090A;
    font-size: .62rem;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ticket-product-list {
    display: grid;
    gap: .72rem;
}

.ticket-category-tabs {
    display: flex;
    gap: .45rem;
    overflow-x: auto;
    padding: .15rem 0 .25rem;
    scrollbar-width: none;
}

.ticket-category-tabs::-webkit-scrollbar { display: none; }

.ticket-category-tabs button {
    flex: 0 0 auto;
    height: 2.25rem;
    border-radius: 999px;
    padding: 0 .85rem;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.045);
    color: rgba(255,255,255,.62);
    font-size: .62rem;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ticket-category-tabs button.is-active {
    background: #00E5D4;
    color: #081111;
    border-color: #00E5D4;
}

.ticket-product-card {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 2.55rem;
    gap: .55rem;
    align-items: center;
    border: 1px solid rgba(255,255,255,.10);
    background:
        linear-gradient(135deg, rgba(255,255,255,.052), rgba(255,255,255,.02));
    border-radius: 1.1rem;
    padding: .46rem;
    text-align: left;
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.055);
}

.ticket-product-main {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .78rem;
    align-items: stretch;
    text-align: left;
    color: inherit;
    border: 0;
    background: transparent;
    padding: 0;
}

.ticket-product-cover {
    position: relative;
    width: 5.15rem;
    height: 5.15rem;
    min-height: 0;
    border-radius: .95rem;
    background: rgba(0,0,0,.28);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
}

.ticket-product-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ticket-product-cover > i {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #FFB45C;
    font-size: 1rem;
    background: rgba(255,180,92,.1);
}

.ticket-product-cover span {
    position: absolute;
    left: .42rem;
    bottom: .42rem;
    padding: .24rem .42rem;
    border-radius: 999px;
    background: rgba(8,9,10,.72);
    border: 1px solid rgba(255,255,255,.12);
    color: #FFB45C;
    font-size: .48rem;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ticket-product-copy {
    min-width: 0;
    align-self: center;
    padding: .18rem 0;
}

.ticket-product-type,
.event-ticket-badge {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    color: #00E5D4;
    font-size: .52rem;
    font-weight: 1000;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.ticket-product-copy h3 {
    display: -webkit-box;
    margin-top: .25rem;
    color: #fff;
    font-size: .92rem;
    font-weight: 1000;
    line-height: 1.08;
    letter-spacing: 0;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.ticket-product-local {
    margin-top: .16rem;
    color: rgba(255,255,255,.46);
    font-size: .62rem;
    font-weight: 900;
    line-height: 1.15;
}

.ticket-product-desc {
    display: -webkit-box;
    margin-top: .34rem;
    color: rgba(255,255,255,.48);
    font-size: .62rem;
    line-height: 1.26;
    font-weight: 720;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.ticket-product-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .55rem;
    color: rgba(255,255,255,.55);
    font-size: .55rem;
    font-weight: 900;
}

.ticket-product-meta span {
    border: 1px solid rgba(255,255,255,.09);
    background: rgba(0,0,0,.18);
    border-radius: 999px;
    padding: .24rem .42rem;
}

.ticket-product-cta {
    width: 2.45rem;
    min-height: 5.15rem;
    border-radius: .9rem;
    background: #FFB45C;
    color: #08090A;
    display: grid;
    place-items: center;
    font-size: .8rem;
    border: 0;
}

.ticket-custom-card {
    width: 100%;
    display: grid;
    grid-template-columns: 2.35rem minmax(0, 1fr) auto;
    gap: .7rem;
    align-items: center;
    border: 1px dashed rgba(255,255,255,.12);
    background: rgba(255,255,255,.032);
    border-radius: 1rem;
    padding: .78rem;
    text-align: left;
    color: #fff;
}

.ticket-custom-icon {
    width: 2.35rem;
    height: 2.35rem;
    display: grid;
    place-items: center;
    border-radius: .82rem;
    background: rgba(0,229,212,.1);
    color: #00E5D4;
}

.ticket-custom-card h3 {
    margin-top: .16rem;
    color: #fff;
    font-size: .86rem;
    line-height: 1.1;
    font-weight: 1000;
}

.ticket-custom-card p:last-child {
    margin-top: .22rem;
    color: rgba(255,255,255,.45);
    font-size: .62rem;
    line-height: 1.3;
    font-weight: 760;
}

.ticket-custom-card button {
    min-width: 4.9rem;
    height: 2.35rem;
    border-radius: .82rem;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    color: rgba(255,255,255,.76);
    font-size: .58rem;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.event-ticket-badge {
    margin-left: .3rem;
    padding: .2rem .38rem;
    border-radius: 999px;
    background: rgba(255,180,92,.13);
    color: #FFB45C;
    border: 1px solid rgba(255,180,92,.18);
    letter-spacing: .06em;
}

.ticket-detail-hero {
    min-height: 14.5rem;
    height: 14.5rem;
}

.ticket-place-panel {
    border: 1px solid rgba(0,229,212,.15);
    background: rgba(0,229,212,.045);
    border-radius: 1.1rem;
    padding: .85rem;
}

.ticket-mini-action {
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.76);
    border-radius: .75rem;
    padding: .45rem .65rem;
    font-size: .6rem;
    font-weight: 1000;
}

.ticket-note-toggle {
    width: 100%;
    text-align: left;
    color: #FFB45C;
    font-size: .68rem;
    font-weight: 1000;
}

.ticket-guest-stepper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.035);
    border-radius: 1rem;
    padding: .7rem;
}

.ticket-guest-stepper button {
    width: 2rem;
    height: 2rem;
    border-radius: .75rem;
    background: rgba(255,255,255,.08);
    color: #fff;
    font-weight: 1000;
}

.ticket-option-help,
.ticket-option-list {
    display: grid;
    gap: .45rem;
    margin-top: .55rem;
}

.ticket-option-help p,
.ticket-option-row {
    margin: 0;
    border: 1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.035);
    border-radius: .78rem;
    padding: .55rem .62rem;
    color: rgba(255,255,255,.54);
    font-size: .62rem;
    line-height: 1.35;
}

.ticket-option-help strong,
.ticket-option-row strong {
    color: rgba(255,255,255,.86);
    font-weight: 1000;
}

.ticket-option-row span,
.ticket-option-row em {
    display: block;
    margin-top: .18rem;
    color: #FFB45C;
    font-size: .58rem;
    font-style: normal;
    font-weight: 900;
}

.ticket-option-row em {
    color: rgba(255,255,255,.46);
}

.ticket-option-group-label {
    margin: .2rem 0 .38rem;
    color: #00E5D4;
    font-size: .56rem;
    font-weight: 1000;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.place-spot-selector {
    margin-top: .8rem;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.035);
    border-radius: 1rem;
    padding: .65rem;
}

.place-reference-gallery {
    padding-top: .1rem;
}

.place-reference-gallery-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .75rem;
    margin: 0 0 .55rem;
}

.place-reference-gallery-head p {
    margin: 0;
    color: #00E5D4;
    font-size: .58rem;
    font-weight: 1000;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.place-reference-gallery-head span {
    color: rgba(255,255,255,.42);
    font-size: .63rem;
    font-weight: 750;
}

.place-reference-gallery-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .45rem;
}

.place-reference-gallery-item {
    display: block;
    min-width: 0;
    overflow: hidden;
    aspect-ratio: 4 / 5;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: .85rem;
    background: #0a0b0d;
}

.place-reference-gallery-item:active {
    transform: scale(.98);
}

.place-reference-gallery-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.place-spot-selector-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    color: rgba(255,255,255,.42);
}

.place-spot-selector-head span,
.place-spot-selector-head strong {
    display: block;
}

.place-spot-selector-head span {
    color: #00E5D4;
    font-size: .54rem;
    font-weight: 1000;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.place-spot-selector-head strong {
    margin-top: .12rem;
    color: rgba(255,255,255,.76);
    font-size: .68rem;
    line-height: 1.15;
}

.place-spot-grid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(13.2rem, 82%);
    gap: .55rem;
    margin-top: .55rem;
    overflow-x: auto;
    padding-bottom: .1rem;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
}

.place-spot-grid::-webkit-scrollbar {
    display: none;
}

.place-spot-card {
    display: grid;
    grid-template-columns: 4.7rem minmax(0, 1fr);
    gap: .62rem;
    min-height: 6.2rem;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(7,25,31,.72);
    border-radius: .9rem;
    padding: .45rem;
    scroll-snap-align: start;
}

.place-spot-card.is-recommended {
    border-color: rgba(255,180,92,.34);
    box-shadow: inset 0 0 0 1px rgba(255,180,92,.08);
}

.place-spot-thumb {
    position: relative;
    overflow: hidden;
    width: 4.7rem;
    min-height: 5.2rem;
    border-radius: .7rem;
    background: rgba(255,255,255,.06);
}

.place-spot-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.place-spot-thumb span {
    height: 100%;
    display: grid;
    place-items: center;
    color: rgba(255,255,255,.48);
    font-size: .7rem;
    font-weight: 1000;
}

.place-spot-thumb em {
    position: absolute;
    left: .28rem;
    top: .28rem;
    padding: .16rem .3rem;
    border-radius: 999px;
    background: rgba(255,180,92,.94);
    color: #08090A;
    font-size: .5rem;
    font-style: normal;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.place-spot-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .22rem;
}

.place-spot-title-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: .25rem;
}

.place-spot-title-row strong {
    min-width: 0;
    color: rgba(255,255,255,.9);
    font-size: .72rem;
    font-weight: 1000;
    line-height: 1.15;
}

.place-spot-title-row span {
    max-width: 100%;
    border: 1px solid rgba(0,229,212,.18);
    background: rgba(0,229,212,.09);
    color: #00E5D4;
    border-radius: 999px;
    padding: .14rem .34rem;
    font-size: .5rem;
    font-weight: 1000;
    line-height: 1.1;
    text-transform: uppercase;
}

.place-spot-copy p,
.place-spot-copy small {
    margin: 0;
    color: rgba(255,255,255,.48);
    font-size: .58rem;
    line-height: 1.25;
}

.place-spot-copy small {
    color: rgba(255,255,255,.62);
}

.place-spot-route {
    align-self: flex-start;
    margin-top: auto;
    height: 1.8rem;
    padding: 0 .58rem;
    border-radius: .64rem;
    background: rgba(255,180,92,.95);
    color: #08090A;
    font-size: .52rem;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.place-spot-route.is-muted {
    background: rgba(255,255,255,.08);
    color: rgba(255,255,255,.55);
}

@media (min-width: 420px) {
    .place-spot-grid {
        grid-auto-columns: minmax(14.4rem, 58%);
    }

    .place-spot-title-row {
        flex-direction: row;
    }

    .place-spot-title-row span {
        flex: 0 0 auto;
        max-width: 4.8rem;
    }
}

.ogo-floating-button {
    width: 3.05rem;
    height: 3.05rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(0,229,212,.34);
    background: rgba(0,17,17,.86);
    box-shadow: 0 16px 34px rgba(0,0,0,.34), 0 0 0 5px rgba(0,229,212,.08);
}
.landgo-utility-row { display: flex; justify-content: flex-end; width: min(96%, 28rem); margin: 0.75rem auto 0.45rem; }
.circle-question-author { display:flex; align-items:center; gap:6px; margin-bottom:8px; color:rgba(255,255,255,.78); font-size:11px; }
.circle-question-author img, .circle-answer-avatar { width:24px; height:24px; border-radius:50%; object-fit:cover; }
.circle-question-author .circle-answer-avatar { flex: 0 0 24px; }
.circle-avatar-m, .circle-avatar-j, .circle-avatar-p, .circle-avatar-l { display:inline-grid; place-items:center; width:24px; height:24px; border-radius:50%; color:#071012; font-size:10px; font-weight:950; }
.circle-avatar-m { background:#ffb45c; }.circle-avatar-j { background:#8fd3ff; }.circle-avatar-p { background:#d8a7ff; }.circle-avatar-l { background:#8de0b6; }
.circle-question-author .circles-role, .circle-comments .circles-role { color:#00e5d4; font-size:9px; text-transform:uppercase; letter-spacing:.08em; }

.ogo-floating-button img {
    width: 2.5rem;
    height: 2.5rem;
    object-fit: contain;
}

.ogo-sheet-backdrop {
    transition: background 0.18s ease, backdrop-filter 0.18s ease;
}

#ogo-sheet.is-ogo-popover,
#ogo-sheet.is-quick-translate {
    align-items: flex-end;
    justify-content: flex-end;
    pointer-events: none;
}

#ogo-sheet.is-ogo-popover .ogo-sheet-backdrop,
#ogo-sheet.is-quick-translate .ogo-sheet-backdrop {
    pointer-events: auto;
    background: rgba(0, 0, 0, 0.12);
    backdrop-filter: none;
}

#ogo-sheet.is-ogo-popover .ogo-sheet-panel,
#ogo-sheet.is-quick-translate .ogo-sheet-panel {
    pointer-events: auto;
    position: fixed;
    right: max(0.72rem, calc((100vw - 430px) / 2 + 0.72rem));
    bottom: calc(8.92rem + env(safe-area-inset-bottom));
    width: min(20.35rem, calc(100vw - 1.15rem));
    max-height: min(68vh, 32rem);
    margin: 0;
    padding: 0.86rem;
    overflow-y: auto;
    border-radius: 1.28rem;
    border: 1px solid rgba(243, 245, 247, 0.16);
    background:
        linear-gradient(145deg, rgba(0, 229, 212, 0.095), transparent 34%),
        linear-gradient(180deg, rgba(14, 22, 25, 0.72), rgba(8, 9, 10, 0.54));
    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.36),
        inset 0 1px 0 rgba(255, 255, 255, 0.11);
    backdrop-filter: blur(22px) saturate(150%);
    animation: ogoPopoverIn 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

#ogo-sheet.is-quick-translate .ogo-sheet-panel {
    width: min(19.45rem, calc(100vw - 1.15rem));
    padding: 0.8rem;
}

.ogo-sheet-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.ogo-sheet-head img {
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    background: rgba(0,229,212,.08);
}

.ogo-sheet-head h2 {
    color: #f3f5f7;
    font-size: 1.05rem;
    line-height: 1.05;
    font-weight: 1000;
    letter-spacing: 0;
}

.ogo-close-btn {
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 999px;
    border: 1px solid rgba(243, 245, 247, 0.1);
    background: rgba(255, 255, 255, 0.055);
    color: rgba(243, 245, 247, 0.7);
    transition: transform 0.16s ease, background 0.16s ease;
}

.ogo-close-btn:active {
    transform: scale(0.94);
}

.ogo-action-list {
    display: grid;
    gap: .48rem;
    margin-top: .72rem;
}

.ogo-action-card {
    width: 100%;
    display: flex;
    align-items: center;
    gap: .62rem;
    min-height: 3.6rem;
    padding: .56rem .64rem;
    border-radius: .92rem;
    border: 1px solid rgba(255,255,255,.095);
    background: rgba(255,255,255,.045);
    text-align: left;
    color: #fff;
    transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.ogo-action-card:active {
    transform: scale(0.985);
}

.ogo-action-card i {
    width: 2.15rem;
    height: 2.15rem;
    flex: 0 0 2.15rem;
    display: grid;
    place-items: center;
    border-radius: .78rem;
    background: rgba(0,229,212,.12);
    color: #00E5D4;
}

.ogo-action-card strong,
.driver-card strong {
    display: block;
    color: #fff;
    font-weight: 1000;
    font-size: .8rem;
}

.ogo-action-card span,
.driver-card span {
    display: block;
    color: rgba(255,255,255,.5);
    font-size: .58rem;
    font-weight: 800;
    margin-top: .12rem;
}

.quick-translate-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .34rem;
    margin: .66rem 0 .55rem;
    padding: .18rem;
    border-radius: 999px;
    border: 1px solid rgba(243, 245, 247, 0.09);
    background: rgba(8, 9, 10, 0.32);
}

.quick-translate-tabs button {
    min-height: 1.92rem;
    border-radius: 999px;
    color: rgba(243, 245, 247, 0.58);
    font-size: .6rem;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.quick-translate-tabs button.is-active {
    background: rgba(0, 229, 212, 0.15);
    color: #00E5D4;
    box-shadow: inset 0 0 0 1px rgba(0, 229, 212, 0.18);
}

.quick-translate-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 2.45rem;
    gap: .44rem;
    align-items: stretch;
}

.quick-translate-box textarea {
    width: 100%;
    min-height: 4.85rem;
    max-height: 8.2rem;
    resize: vertical;
    border-radius: .92rem;
    border: 1px solid rgba(243, 245, 247, 0.11);
    background: rgba(8, 9, 10, 0.38);
    color: #f3f5f7;
    padding: .68rem .72rem;
    font-size: .88rem;
    line-height: 1.35;
    outline: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.quick-translate-box textarea::placeholder {
    color: rgba(243, 245, 247, 0.32);
}

.quick-translate-box textarea:focus {
    border-color: rgba(0, 229, 212, 0.38);
    box-shadow: 0 0 0 3px rgba(0, 229, 212, 0.08);
}

.quick-mic-btn {
    min-height: 4.85rem;
    border-radius: .92rem;
    border: 1px solid rgba(255, 180, 92, 0.22);
    background: rgba(255, 180, 92, 0.12);
    color: #FFB45C;
    font-size: 1rem;
}

.quick-mic-btn.is-listening {
    background: #FFB45C;
    color: #08090A;
    box-shadow: 0 0 0 4px rgba(255, 180, 92, 0.16);
}

.quick-translate-submit {
    width: 100%;
    min-height: 2.25rem;
    margin-top: .48rem;
    border-radius: .86rem;
    background: #FFB45C;
    color: #08090A;
    font-size: .68rem;
    font-weight: 1000;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.quick-result-card {
    min-height: 3.25rem;
    margin-top: .48rem;
    padding: .64rem;
    border-radius: .92rem;
    border: 1px solid rgba(0, 229, 212, 0.13);
    background: rgba(0, 229, 212, 0.06);
    color: rgba(243, 245, 247, 0.88);
}

.quick-result-card.is-empty {
    display: flex;
    align-items: center;
    min-height: 2.65rem;
    color: rgba(243, 245, 247, 0.42);
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(243, 245, 247, 0.08);
}

.quick-result-card p {
    color: #f3f5f7;
    font-size: .92rem;
    line-height: 1.32;
    font-weight: 850;
}

.quick-result-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .34rem;
    margin-top: .58rem;
}

.quick-result-actions button {
    min-height: 1.9rem;
    border-radius: .68rem;
    padding: 0 .52rem;
    border: 1px solid rgba(243, 245, 247, 0.1);
    background: rgba(8, 9, 10, 0.34);
    color: rgba(243, 245, 247, 0.74);
    font-size: .56rem;
    font-weight: 1000;
    letter-spacing: .04em;
}

.quick-mode-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .45rem;
    margin: .9rem 0;
}

.quick-mode-tabs button {
    min-height: 2.25rem;
    border-radius: .85rem;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.04);
    color: rgba(255,255,255,.6);
    font-size: .65rem;
    font-weight: 1000;
}

.quick-mode-tabs button.is-active {
    background: rgba(0,229,212,.13);
    color: #00E5D4;
    border-color: rgba(0,229,212,.28);
}

.quick-textarea,
.quick-result {
    width: 100%;
    border-radius: 1rem;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.28);
    color: #fff;
    padding: .8rem;
    font-size: .85rem;
    line-height: 1.45;
}

.quick-textarea { min-height: 6.6rem; resize: vertical; }
.quick-result { min-height: 4.4rem; color: rgba(255,255,255,.82); }

.quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: .75rem;
}

.quick-actions button,
.open-full-translator {
    border-radius: .8rem;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.76);
    padding: .55rem .72rem;
    font-size: .62rem;
    font-weight: 1000;
}

.open-full-translator {
    width: 100%;
    min-height: 2.15rem;
    margin-top: .48rem;
    border-radius: .82rem;
    background: rgba(255, 255, 255, 0.045);
    color: rgba(243, 245, 247, 0.64);
    letter-spacing: .08em;
    text-transform: uppercase;
}

.quick-actions button.is-primary {
    background: #FFB45C;
    border-color: #FFB45C;
    color: #08090A;
}

.driver-card {
    border: 1px solid rgba(0,229,212,.20);
    background: rgba(0,229,212,.055);
    border-radius: 1.15rem;
    padding: .9rem;
}

@keyframes ogoPopoverIn {
    from {
        opacity: 0;
        transform: translateY(0.7rem) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.driver-card pre {
    white-space: pre-wrap;
    margin: .7rem 0 0;
    color: #fff;
    font-size: .9rem;
    line-height: 1.55;
    font-family: inherit;
}

@media (max-width: 390px) {
    .home-need-grid { grid-template-columns: 1fr; }
    .ticket-product-card { grid-template-columns: minmax(0, 1fr) 2.28rem; }
    .ticket-product-main { grid-template-columns: auto minmax(0, 1fr); gap: .7rem; }
    .ticket-product-cover { width: 4.82rem; height: 4.82rem; }
    .ticket-product-cta { min-height: 4.82rem; }
    .ticket-custom-card { grid-template-columns: 2.2rem minmax(0, 1fr); }
    .ticket-custom-card button { grid-column: 1 / -1; width: 100%; }
}

/* Food is a visual guide to real places, not a directory of dish names. */
.guide-food-heading { align-items: center; }
.guide-food-filter {
    display: flex;
    grid-template-columns: none;
    gap: .45rem;
    overflow-x: auto;
    padding: .08rem .06rem .38rem;
    scrollbar-width: none;
}
.guide-food-filter::-webkit-scrollbar { display: none; }
.guide-food-filter button {
    flex: 0 0 auto;
    min-height: 2.15rem;
    padding: 0 .72rem;
    border-radius: .56rem;
}
.guide-food-card {
    display: grid;
    grid-template-columns: 6.25rem minmax(0, 1fr);
    gap: .75rem;
    height: 10.25rem;
    padding: .72rem;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: .75rem;
    background: #0d1011;
    cursor: pointer;
    outline: none;
}
.guide-food-card:focus-visible { box-shadow: 0 0 0 2px rgba(0,229,212,.7); }
.guide-food-media {
    width: auto;
    min-height: 7.8rem;
    aspect-ratio: auto;
    background: #15191a;
}
.guide-food-media > img { object-fit: cover; }
.guide-food-media > .guide-food-photo-count {
    right: .48rem;
    bottom: .48rem;
    left: auto;
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    padding: .28rem .42rem;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: .38rem;
    color: rgba(255,255,255,.88);
    background: rgba(5,7,8,.75);
    font-size: .57rem;
    font-weight: 900;
}
.guide-food-copy { min-height: 0; padding: 0; }
.guide-food-topline { justify-content: flex-start; }
.guide-food-topline > div,
.guide-food-topline:not(.guide-food-detail-body .guide-food-topline) {
    display: flex;
    flex-wrap: wrap;
    gap: .34rem;
}
.guide-food-topline span {
    display: inline-flex;
    align-items: center;
    min-height: 1.28rem;
    padding: 0 .38rem;
    border: 1px solid rgba(197,241,254,.22);
    border-radius: .32rem;
    color: rgba(220,246,250,.85);
    background: rgba(197,241,254,.06);
    font-size: .54rem;
    font-weight: 900;
    line-height: 1;
}
.guide-food-topline span + span { border-color: rgba(255,195,146,.25); color: rgba(255,219,190,.9); background: rgba(251,195,146,.06); }
.guide-food-copy h3 { margin-top: .3rem; font-size: .95rem; }
.guide-food-description { -webkit-line-clamp: 2; font-size: .67rem; }
.guide-food-chips { margin-top: .4rem; }
.guide-food-chips span { border-radius: .3rem; }
.guide-food-facts { margin-top: .35rem; }
.guide-food-actions { justify-content: flex-end; padding-top: .42rem; }
.guide-food-add,
.guide-food-route,
.guide-food-route-text {
    min-height: 2.15rem;
    border-radius: .48rem;
    font-size: .61rem;
}
.guide-food-add { padding: 0 .72rem; }
.guide-food-route { width: 2.15rem; }
.guide-food-route-text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .38rem;
    padding: 0 .82rem;
    border: 1px solid rgba(251,195,146,.42);
    color: #101415;
    background: var(--landgo-orange);
    font-weight: 950;
}

.guide-food-detail-overlay { position: fixed; inset: 0; z-index: 190; display: flex; align-items: flex-end; justify-content: center; }
.guide-food-detail-backdrop { position: absolute; inset: 0; border: 0; background: rgba(0,0,0,.72); }
.guide-food-detail-sheet {
    position: relative;
    width: min(100%, 38rem);
    max-height: min(92dvh, 48rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid rgba(255,255,255,.12);
    border-bottom: 0;
    border-radius: .9rem .9rem 0 0;
    background: #0b0e0f;
    box-shadow: 0 -1.1rem 3rem rgba(0,0,0,.35);
}
.guide-food-detail-head { position: relative; z-index: 3; height: 0; display: flex; justify-content: flex-end; }
.guide-food-detail-head > button {
    width: 2.35rem;
    height: 2.35rem;
    display: grid;
    place-items: center;
    margin: .7rem .7rem 0 0;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: .5rem;
    color: #fff;
    background: rgba(8,10,11,.8);
}
.guide-food-gallery { position: relative; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; background: #141819; }
.guide-food-gallery::-webkit-scrollbar { display: none; }
.guide-food-gallery-image { position: relative; flex: 0 0 86%; aspect-ratio: 4 / 3; scroll-snap-align: start; overflow: hidden; border: 0; border-right: 1px solid rgba(255,255,255,.08); background: #15191a; }
.guide-food-gallery-image > img { width: 100%; height: 100%; object-fit: cover; }
.guide-food-gallery-image > i { position: absolute; right: .65rem; bottom: .65rem; width: 1.9rem; height: 1.9rem; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.18); border-radius: .42rem; color: rgba(255,255,255,.86); background: rgba(0,0,0,.6); font-size: .68rem; }
.guide-food-gallery-image.is-broken > img { display: none; }
.guide-food-gallery-image.is-broken::after { content: 'Image unavailable'; position: absolute; inset: 0; display: grid; place-items: center; color: rgba(255,255,255,.45); font-size: .72rem; }
.guide-food-gallery-count { position: absolute; bottom: .62rem; left: .72rem; z-index: 2; padding: .25rem .42rem; border: 1px solid rgba(255,255,255,.14); border-radius: .34rem; color: rgba(255,255,255,.86); background: rgba(0,0,0,.65); font-size: .58rem; font-weight: 900; }
.guide-food-detail-empty-image { min-height: 13rem; display: grid; place-items: center; color: var(--landgo-orange); background: #15191a; font-size: 2rem; }
.guide-food-detail-body { padding: 1rem .95rem calc(1rem + env(safe-area-inset-bottom)); }
.guide-food-detail-title h2 { margin: .52rem 0 0; color: var(--landgo-text); font-size: 1.42rem; line-height: 1.12; font-weight: 950; }
.guide-food-detail-title > div > p { margin: .55rem 0 0; color: rgba(243,245,247,.62); font-size: .77rem; line-height: 1.52; }
.guide-food-detail-section { margin-top: 1.25rem; padding-top: 1.05rem; border-top: 1px solid rgba(255,255,255,.09); }
.guide-food-detail-eyebrow { margin: 0; color: var(--landgo-orange); font-size: .59rem; font-weight: 950; letter-spacing: .1em; text-transform: uppercase; }
.guide-food-detail-copy { margin: .52rem 0 0; color: rgba(243,245,247,.77); font-size: .78rem; line-height: 1.58; }
.guide-food-dishes { display: flex; gap: .66rem; margin-top: .72rem; overflow-x: auto; padding-bottom: .2rem; scrollbar-width: none; }
.guide-food-dishes::-webkit-scrollbar { display: none; }
.guide-food-dish { flex: 0 0 9.35rem; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: .58rem; background: #111516; }
.guide-food-dish > img,
.guide-food-dish-placeholder { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.guide-food-dish-placeholder { display: grid; place-items: center; color: rgba(255,195,146,.75); background: #171b1c; }
.guide-food-dish > div:last-child { padding: .58rem; }
.guide-food-dish span { color: var(--landgo-orange); font-size: .5rem; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; }
.guide-food-dish h3 { margin: .2rem 0 0; color: var(--landgo-text); font-size: .72rem; line-height: 1.24; font-weight: 900; }
.guide-food-dish p { display: -webkit-box; margin: .34rem 0 0; overflow: hidden; color: rgba(243,245,247,.5); font-size: .61rem; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.guide-food-practical { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .55rem; margin: .72rem 0 0; }
.guide-food-practical > div { min-width: 0; padding: .62rem; border: 1px solid rgba(255,255,255,.08); border-radius: .45rem; background: rgba(255,255,255,.025); }
.guide-food-practical dt { color: rgba(243,245,247,.42); font-size: .55rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.guide-food-practical dd { margin: .3rem 0 0; overflow-wrap: anywhere; color: rgba(243,245,247,.8); font-size: .66rem; line-height: 1.4; }
.guide-food-detail-actions { display: flex; gap: .5rem; margin-top: 1.2rem; }
.guide-food-detail-actions > * { flex: 1 1 0; }

@media (max-width: 390px) {
    .guide-food-copy { min-height: 0; }
    .guide-food-practical { grid-template-columns: 1fr; }
}

/* Food Street drawer: compact rows keep the street context visible while allowing one dish at a time to expand. */
.guide-food-street-dishes { display: grid; gap: .45rem; margin-top: .7rem; }
.guide-food-street-dish { overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: .62rem; background: rgba(255,255,255,.035); }
.guide-food-street-dish summary { display: flex; align-items: center; gap: .62rem; min-height: 3.55rem; padding: .38rem .55rem; cursor: pointer; list-style: none; }
.guide-food-street-dish summary::-webkit-details-marker { display: none; }
.guide-food-street-dish summary:focus-visible { outline: 2px solid var(--landgo-orange); outline-offset: -2px; }
.guide-food-street-thumb { display: grid; flex: 0 0 2.65rem; place-items: center; width: 2.65rem; height: 2.65rem; overflow: hidden; border-radius: .45rem; color: rgba(255,195,146,.8); background: #171b1c; }
.guide-food-street-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.guide-food-street-dish-name { display: grid; min-width: 0; flex: 1 1 auto; gap: .14rem; }
.guide-food-street-dish-name strong { overflow: hidden; color: var(--landgo-text); font-size: .73rem; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.guide-food-street-dish-name small { overflow: hidden; color: rgba(243,245,247,.42); font-size: .59rem; text-overflow: ellipsis; white-space: nowrap; }
.guide-food-street-meta { display: flex; flex: 0 0 auto; align-items: center; gap: .42rem; color: rgba(243,245,247,.42); font-size: .54rem; }
.guide-food-spice { color: var(--landgo-orange); font-size: .46rem; letter-spacing: .08em; white-space: nowrap; }
.guide-food-mild { color: #8bd7c6; font-size: .55rem; font-weight: 800; }
.guide-food-street-meta .fa-chevron-down { transition: transform .2s ease; }
.guide-food-street-dish[open] .guide-food-street-meta .fa-chevron-down { transform: rotate(180deg); }
.guide-food-street-dish-detail { display: grid; grid-template-columns: 6.4rem minmax(0,1fr); gap: .7rem; padding: .1rem .62rem .68rem 3.82rem; }
.guide-food-street-large-image { position: relative; display: block; width: 6.4rem; height: 5.15rem; overflow: hidden; padding: 0; border: 0; border-radius: .45rem; background: #171b1c; }
.guide-food-street-large-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.guide-food-street-large-image i { position: absolute; right: .35rem; bottom: .3rem; color: white; font-size: .65rem; filter: drop-shadow(0 1px 2px #000); }
.guide-food-street-dish-copy { min-width: 0; }
.guide-food-street-dish-copy p { margin: 0; color: rgba(243,245,247,.62); font-size: .61rem; line-height: 1.45; }
.guide-food-street-dish-copy p + p { margin-top: .35rem; }
.guide-food-street-dish-copy p span { display: block; margin-bottom: .08rem; color: var(--landgo-orange); font-size: .49rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.guide-food-street-dish-copy .guide-food-note { color: rgba(243,245,247,.5); }
.guide-food-street-dish-copy .guide-food-allergens { color: rgba(255,190,154,.75); }
.guide-food-street-dish-copy .guide-food-reference { color: rgba(139,215,198,.72); }
@media (max-width: 390px) {
    .guide-food-street-dish-detail { grid-template-columns: 5.65rem minmax(0,1fr); padding-left: 3.72rem; }
    .guide-food-street-large-image { width: 5.65rem; height: 4.6rem; }
}