:root {
    --cls-ink: #1b2430;
    --cls-paper: #f3f4f6;
    --cls-card: #ffffff;
    --cls-accent: #f22776;
    --cls-accent-ink: #fff;
    --cls-line: #d7dbe2;
    --cls-mute: #5c6570;
    --cls-soft: #eef1f4;
    --cls-danger: #8a2b2b;
    --cls-sans: "Libre Franklin", "Segoe UI", sans-serif;
    --cls-max: 1120px;
}
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 16px; }
body.cls-shell {
    margin: 0;
    background: var(--cls-paper);
    color: var(--cls-ink);
    font-family: var(--cls-sans);
    line-height: 1.5;
    min-height: 100vh;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--cls-ink); text-decoration: none; }
a:hover { color: var(--cls-accent); }
.cls-hide { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.cls-wrap { width: min(var(--cls-max), calc(100% - 32px)); margin-inline: auto; }

.cls-top {
    background: #000;
    color: #e8edf2;
}
.cls-top-inner {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 0;
    flex-wrap: wrap;
}
.cls-mark {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    color: #fff;
    line-height: 0;
}
.cls-mark img {
    height: 44px;
    width: auto;
    max-width: min(240px, 58vw);
}
.cls-find { position: relative; flex: 1; min-width: 200px; }
.cls-find input {
    width: 100%;
    border: 0;
    border-radius: 3px;
    padding: 9px 12px;
    font: inherit;
}
.cls-suggest {
    position: absolute;
    left: 0; right: 0; top: 100%;
    background: #fff;
    color: var(--cls-ink);
    border: 1px solid var(--cls-line);
    border-radius: 0 0 4px 4px;
    z-index: 20;
    max-height: 280px;
    overflow: auto;
    margin: 0; padding: 0; list-style: none;
}
.cls-suggest a { display: block; padding: 8px 12px; }
.cls-suggest a:hover, .cls-suggest a.is-on { background: var(--cls-soft); }
.cls-menu {
    display: flex;
    gap: 14px;
    align-items: center;
    margin-left: auto;
}
.cls-menu a { color: #d5dde6; font-size: 0.92rem; }
.cls-menu a.cls-cta {
    background: var(--cls-accent);
    color: #fff;
    padding: 7px 12px;
    border-radius: 3px;
}
.cls-burger {
    display: none;
    background: transparent;
    border: 1px solid #4a5564;
    color: #fff;
    padding: 6px 10px;
    border-radius: 3px;
}

.cls-stage { padding: 28px 0 48px; min-height: 60vh; }
.cls-foot {
    background: #11151b;
    color: #9aa3ad;
    padding: 36px 0 28px;
    font-size: 0.86rem;
    border-top: 3px solid var(--cls-accent);
}
.cls-foot a { color: #e4eaef; }
.cls-foot a:hover { color: var(--cls-accent); }
.cls-foot-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 0.8fr)) minmax(0, 0.9fr);
    gap: 28px 32px;
    margin-bottom: 22px;
}
.cls-foot h2 {
    margin: 0 0 10px;
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #6d7680;
    font-weight: 600;
    font-family: var(--cls-sans);
}
.cls-foot-brand p { margin: 0 0 8px; max-width: 28rem; }
.cls-foot-col { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.cls-foot-age {
    font-family: var(--cls-sans);
    font-size: 2.4rem;
    line-height: 1;
    color: var(--cls-accent);
    font-weight: 700;
    margin: 0 0 8px;
}
.cls-foot-end {
    border-top: 1px solid #2a323c;
    padding-top: 16px;
    margin: 0;
    font-size: 0.8rem;
}
.cls-kicker { font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--cls-mute); margin: 0 0 6px; }
.cls-title { font-family: var(--cls-sans); font-size: clamp(1.6rem, 3vw, 2.2rem); margin: 0 0 12px; letter-spacing: -0.02em; font-weight: 700; }
.cls-standfirst {
    font-family: var(--cls-sans);
    font-size: 1.15rem;
    line-height: 1.45;
    max-width: 38rem;
    color: #2b333c;
    margin: 0 0 28px;
}
.cls-split {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 16px;
    margin: 0 0 36px;
}
.cls-split > * {
    background: #fff;
    border: 1px solid var(--cls-line);
    border-radius: 4px;
    padding: 18px 20px;
}
.cls-split h2 {
    margin: 0 0 10px;
    font-size: 0.95rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--cls-accent);
    font-family: var(--cls-sans);
}
.cls-split p { margin: 0 0 10px; color: #3d4650; }
.cls-split p:last-child { margin-bottom: 0; }
.cls-split-aside { background: #1b2430; color: #d5dde6; border-color: #1b2430; }
.cls-split-aside h2 { color: var(--cls-accent); }
.cls-split-aside p { color: #c5ced6; }
.cls-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 32px; padding: 0; list-style: none; }
.cls-chips a {
    display: inline-block;
    background: #fff;
    border: 1px solid var(--cls-line);
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 0.9rem;
}
.cls-chips a:hover { border-color: var(--cls-accent); color: var(--cls-accent); }
.cls-towns { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin: 22px 0 32px; }
.cls-towns a {
    background: var(--cls-card);
    border: 1px solid var(--cls-line);
    padding: 12px 14px;
    border-radius: 4px;
    display: block;
}
.cls-towns a span { display: block; font-size: 0.8rem; color: var(--cls-mute); }
.cls-lead { max-width: 46rem; color: #3d4650; margin: 0 0 18px; }
.cls-trail { font-size: 0.85rem; color: var(--cls-mute); margin: 0 0 18px; }
.cls-trail a { color: var(--cls-mute); text-decoration: underline; text-underline-offset: 2px; }

.cls-intro-place { color: var(--cls-accent); text-decoration: underline; text-underline-offset: 2px; }

.cls-fresh { margin: 0 0 36px; }
.cls-fresh-list { display: grid; gap: 10px; }
.cls-notice {
    display: grid;
    grid-template-columns: 92px 1fr;
    gap: 14px;
    background: var(--cls-card);
    border: 1px solid var(--cls-line);
    border-radius: 4px;
    padding: 10px;
    align-items: start;
}
.cls-notice img { width: 92px; height: 122px; object-fit: cover; border-radius: 3px; background: #ddd; }
.cls-notice h3 { margin: 0 0 4px; font-size: 1.05rem; font-family: var(--cls-sans); font-weight: 700; }
.cls-meta { font-size: 0.85rem; color: var(--cls-mute); display: flex; flex-wrap: wrap; gap: 8px 14px; }
.cls-pill {
    display: inline-block;
    background: var(--cls-soft);
    border-radius: 2px;
    padding: 1px 7px;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.cls-switch { display: flex; gap: 8px; margin: 0 0 14px; }
.cls-switch button {
    border: 1px solid var(--cls-line);
    background: #fff;
    padding: 6px 12px;
    font: inherit;
    border-radius: 3px;
    cursor: pointer;
}
.cls-switch button.is-on { background: var(--cls-ink); color: #fff; border-color: var(--cls-ink); }

.cls-feed { display: flex; flex-direction: column; gap: 10px; }
.cls-feed.is-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}
.cls-feed.is-tiles .cls-notice {
    grid-template-columns: 1fr;
}
.cls-feed.is-tiles .cls-notice img { width: 100%; height: 220px; }

.cls-counties { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.cls-counties a {
    background: #fff;
    border: 1px solid var(--cls-line);
    padding: 14px 16px;
    border-radius: 4px;
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.cls-pager { display: flex; gap: 8px; margin-top: 22px; flex-wrap: wrap; }
.cls-pager a, .cls-pager span {
    border: 1px solid var(--cls-line);
    padding: 6px 11px;
    border-radius: 3px;
    background: #fff;
    font-size: 0.9rem;
}
.cls-pager .is-here { background: var(--cls-ink); color: #fff; border-color: var(--cls-ink); }

.cls-ad {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, 0.9fr);
    gap: 24px;
    align-items: start;
}
.cls-shots { background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; padding: 10px; }
.cls-hero { position: relative; }
.cls-hero img { width: 100%; max-height: 520px; object-fit: contain; background: #111; }
.cls-hero.is-locked img { filter: blur(10px) brightness(0.55); }
.cls-unlock {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    background: var(--cls-accent);
    color: #fff;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 12px 22px;
    border-radius: 3px;
    box-shadow: 0 8px 24px rgba(0,0,0,.35);
}
.cls-unlock:hover { color: #fff; filter: brightness(1.06); }
.cls-unlock[hidden] { display: none !important; }
.cls-gallery-cta { margin: 12px 0 0; }
.cls-gallery-cta .cls-btn { display: block; width: 100%; }
.cls-thumbs button { position: relative; }
.cls-thumbs button.is-locked img { filter: blur(2px) brightness(0.7); }
.cls-thumb-lock {
    position: absolute;
    left: 4px; bottom: 4px;
    background: rgba(0,0,0,.65);
    color: #fff;
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 1px 4px;
    border-radius: 2px;
}
.cls-hero button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(27,36,48,.72);
    color: #fff;
    border: 0;
    width: 36px; height: 36px;
    border-radius: 3px;
    cursor: pointer;
    z-index: 2;
}
.cls-hero .cls-prev { left: 8px; }
.cls-hero .cls-next { right: 8px; }
.cls-count { position: absolute; right: 10px; bottom: 10px; background: rgba(0,0,0,.55); color: #fff; font-size: 0.8rem; padding: 2px 8px; border-radius: 2px; }
.cls-thumbs { display: flex; gap: 6px; overflow-x: auto; margin-top: 8px; }
.cls-thumbs button { border: 2px solid transparent; padding: 0; background: none; cursor: pointer; }
.cls-thumbs button.is-on { border-color: var(--cls-accent); }
.cls-thumbs img { width: 64px; height: 84px; object-fit: cover; }

.cls-facts, .cls-rates, .cls-copy, .cls-side {
    background: #fff;
    border: 1px solid var(--cls-line);
    border-radius: 4px;
    padding: 16px 18px;
    margin-bottom: 14px;
}
.cls-facts table, .cls-rates table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.cls-facts th, .cls-rates th { text-align: left; color: var(--cls-mute); font-weight: 600; width: 42%; padding: 6px 8px 6px 0; }
.cls-facts td, .cls-rates td { padding: 6px 0; }
.cls-rates td { text-align: right; }
.cls-copy p { white-space: pre-wrap; }
.cls-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.cls-tags span { background: var(--cls-soft); padding: 4px 8px; border-radius: 2px; font-size: 0.82rem; }
.cls-id { font-size: 0.82rem; color: var(--cls-mute); }
.cls-actions { display: flex; flex-direction: column; gap: 8px; }
.cls-btn, .cls-btn-ghost {
    display: block;
    text-align: center;
    padding: 10px 12px;
    border-radius: 3px;
    font-weight: 600;
    border: 1px solid transparent;
}
.cls-btn { background: var(--cls-accent); color: #fff; }
.cls-btn:hover { color: #fff; filter: brightness(1.05); }
.cls-btn-ghost { background: #fff; border-color: var(--cls-line); }
.cls-related { display: grid; gap: 10px; margin-top: 8px; }
.cls-nearby { columns: 2; margin: 0; padding-left: 1.1rem; }

.cls-mask {
    position: fixed; inset: 0;
    background: rgba(15,18,22,.55);
    display: grid; place-items: center;
    z-index: 40;
}
.cls-mask[hidden] { display: none; }
.cls-dialog {
    background: #fff;
    width: min(480px, calc(100% - 24px));
    padding: 20px;
    border-radius: 4px;
    position: relative;
}
.cls-dialog h2 { margin-top: 0; font-family: var(--cls-sans); font-weight: 700; }
.cls-dialog label { display: block; margin: 6px 0; }
.cls-dialog textarea { width: 100%; font: inherit; }
.cls-x { position: absolute; right: 10px; top: 8px; border: 0; background: none; font-size: 1.4rem; cursor: pointer; }

.cls-gate { max-width: 36rem; background: #fff; border: 1px solid var(--cls-line); padding: 28px; border-radius: 4px; }
.cls-hop {
    max-width: 420px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--cls-line);
    border-radius: 4px;
    padding: 22px 20px 26px;
}
.cls-hop-media { margin: 0 0 18px; }
.cls-hop-main {
    display: block;
    overflow: hidden;
    border-radius: 4px;
    background: #111;
}
.cls-hop-main img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.cls-hop-locks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 8px;
}
.cls-hop-lock {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 3px;
    background: #111;
}
.cls-hop-lock img {
    width: 100%;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    filter: blur(6px) brightness(0.55);
}
.cls-hop-lock-mark {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    background: rgba(0,0,0,.25);
}
.cls-hop-locks-cap { margin: 8px 0 0; font-size: 0.82rem; color: var(--cls-mute); }
.cls-hop-where { color: var(--cls-mute); font-weight: 500; font-size: 0.85em; }
.cls-hop-hint { margin: 0 0 8px; color: #3d4650; }
.cls-hop-list { margin: 0 0 18px; padding-left: 1.1rem; color: #3d4650; }
.cls-hop-list li { margin: 0 0 6px; }
.cls-hop-go {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    background: var(--cls-accent);
    color: #fff !important;
    text-align: center;
    padding: 12px 14px;
    border-radius: 3px;
    font-weight: 700;
}
.cls-hop-go:hover { filter: brightness(1.05); color: #fff !important; }
.cls-hop-go-age { font-size: 0.78rem; font-weight: 600; opacity: 0.9; }
.cls-hop-fine { margin: 12px 0 8px; font-size: 0.82rem; color: var(--cls-mute); }
.cls-hop-back { color: var(--cls-mute); text-decoration: underline; text-underline-offset: 2px; }
.cls-legal { max-width: 44rem; }
.cls-legal h1 { font-family: var(--cls-sans); font-weight: 700; }
.cls-empty { padding: 24px; background: #fff; border: 1px dashed var(--cls-line); }

.cls-lock {
    max-width: 360px;
    margin: 12vh auto;
    background: #fff;
    border: 1px solid var(--cls-line);
    padding: 24px;
    border-radius: 4px;
}
.cls-lock input { width: 100%; padding: 8px; margin: 8px 0 14px; font: inherit; }

html.cls-age-wait,
html.cls-age-wait body { overflow: hidden; }
.cls-age-veil { display: none; }
html.cls-age-wait .cls-age-veil {
    display: flex;
    position: fixed;
    inset: 0;
    z-index: 500;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    background: rgba(0, 0, 0, 0.72);
}
.cls-age-panel {
    width: min(28rem, 100%);
    background: #11151b;
    color: #e8edf2;
    border-radius: 4px;
    border-left: 5px solid var(--cls-accent);
    padding: 1.6rem 1.45rem 1.35rem;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}
.cls-age-badge {
    display: inline-block;
    margin: 0 0 0.75rem;
    padding: 0.2rem 0.55rem;
    background: var(--cls-accent);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.cls-age-panel h2 {
    margin: 0 0 0.85rem;
    font-size: 1.45rem;
    font-weight: 700;
    line-height: 1.25;
}
.cls-age-panel p {
    margin: 0 0 0.7rem;
    color: #aeb6bf;
    font-size: 0.95rem;
}
.cls-age-panel p:last-of-type { margin-bottom: 0; }
.cls-age-row {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    margin: 1.15rem 0 0.9rem;
}
.cls-age-row .cls-btn,
.cls-age-row .cls-btn-ghost {
    width: 100%;
    cursor: pointer;
    font: inherit;
}
.cls-age-row .cls-btn-ghost {
    background: transparent;
    border-color: #3a4450;
    color: #d5dde6;
}
.cls-age-row .cls-btn-ghost:hover {
    border-color: #6d7680;
    color: #fff;
}
.cls-age-links {
    margin: 0;
    font-size: 0.82rem;
    color: #6d7680;
}
.cls-age-links a { color: #c5ced6; text-decoration: underline; text-underline-offset: 2px; }
.cls-age-links a:hover { color: var(--cls-accent); }

@media (max-width: 820px) {
    .cls-ad { grid-template-columns: 1fr; }
    .cls-burger { display: inline-block; }
    .cls-menu { display: none; width: 100%; flex-direction: column; align-items: flex-start; }
    .cls-menu.is-open { display: flex; }
    .cls-nearby { columns: 1; }
    .cls-split { grid-template-columns: 1fr; }
    .cls-foot-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
    .cls-foot-grid { grid-template-columns: 1fr; }
}