/* Urban night edition: shared across all four languages and all page types. */
:root{--paper:#080e19;--ink:#f1f4f8;--muted:#aebccc;--line:#ffffff20;--night:#132132;--accent:#f0c585;--soft:#111d2c;--gold:#f0c585}
body{background:radial-gradient(ellipse at 90% 5%,#192741 0,transparent 38%),#080e19;color:var(--ink)}
.site-header{min-height:104px;border-color:#ffffff18}.brand{color:#fff}.brand-mark{color:var(--gold);background:linear-gradient(145deg,#263d51,#111c2b);border:1px solid #e7b77a70;box-shadow:0 0 25px #e7b77a13}.brand small{color:#ddc09b}.site-header nav{color:#c2cbd7}.languages [aria-current]{color:var(--gold)}
main{margin-top:22px}.explorer{position:relative;isolation:isolate;grid-template-columns:minmax(0,1fr) 380px;gap:28px;min-height:700px;padding:46px 36px 46px 46px;border-color:#b4c5dd35;background:linear-gradient(90deg,#070d18b8 0%,#070d1820 58%,#070d1850 100%),linear-gradient(0deg,#070d18d9 0%,transparent 65%),url('assets/city-night.png') center 56%/cover;box-shadow:0 28px 80px #0005}
.explorer-copy{padding:12px 12px 0 0;display:flex;flex-direction:column;align-items:flex-start}.explorer-copy>.eyebrow{color:#f0c585;letter-spacing:2.6px}.explorer h1{color:#fff;font-size:clamp(40px,4.5vw,64px);line-height:1.2;letter-spacing:-.04em;text-shadow:0 3px 30px #0008;margin:12px 0 22px}.explorer .intro{color:#e1e6ef;max-width:450px;font-size:16px;line-height:1.9;text-shadow:0 2px 8px #000}.explorer .area-label{margin-top:auto;padding-top:55px;color:#f3d0a2}.city-links{width:100%;max-width:470px;gap:0 30px}.city-links a{border-color:#d9e5f83d;color:#fff;font-size:15px;padding:8px 0;text-shadow:0 2px 8px #000}.city-links a:hover{color:var(--gold);border-color:var(--gold)}.city-links span:last-child{color:var(--gold)}.small-link{color:#d1d8e3;font-size:12px}.small-link:hover{color:#fff}
.map-surface{align-self:center;min-height:480px;padding:26px 18px 20px;border:1px solid #c3d5e338;background:linear-gradient(160deg,#152338ed,#09111eb8);backdrop-filter:blur(13px);box-shadow:0 14px 50px #0004;border-radius:2px}.map-caption{color:var(--gold);font-size:11px;letter-spacing:3px;margin:0 5px 12px}.japan-map{height:390px;max-width:330px;filter:drop-shadow(0 0 14px #82b5da12)}.region{fill:#627c91;stroke:#162235;stroke-width:4}.japan-map .inactive{fill:#2b3e51}.japan-map a:hover .region,.japan-map a:focus .region{fill:#d9b87f;filter:drop-shadow(0 0 9px #f0c58580)}.japan-map text{fill:#fff;font-size:15px;text-shadow:0 1px 4px #000}.compass{color:#f0c585;right:20px;top:20px}.map-surface p{color:#c1ccda;font-size:11px;line-height:1.7;max-width:275px;margin:12px 0 0}.visual-credit{position:absolute;left:46px;bottom:13px;color:#cbd1db;font-size:10px;letter-spacing:.3px;text-shadow:0 1px 5px #000}
.principles{border-color:var(--line);color:#bec8d5;background:#0b1422;padding:21px 20px}.principles span:first-child{color:#ecd0a8}.section{margin:82px 0}.section-heading .eyebrow,.first-visit .eyebrow,.story-card .eyebrow,.article>.eyebrow{color:#dfb778}.section-heading h2{color:#f4f6fa}.section-heading>.text-link{color:#e3be87}
.genre-grid{gap:26px}.genre-card{border-color:#ffffff20;background:#101a29;box-shadow:0 15px 40px #0003}.genre-card:hover{border-color:#f0c58590;box-shadow:0 16px 45px #0006}.genre-art{height:215px;background:linear-gradient(0deg,#10213a80,#0b102c28),url('assets/city-night.png') 12% 67%/230%;color:#fff}.genre-concept .genre-art{background:linear-gradient(0deg,#59233199,#35142315),url('assets/city-night.png') 65% 70%/235%}.genre-alternative .genre-art{background:linear-gradient(0deg,#153b4866,#13162822),url('assets/city-night.png') 95% 55%/220%}.genre-art>span{display:inline-block;background:#070e1ca8;backdrop-filter:blur(6px);padding:4px 9px;border:1px solid #fff3;color:#f0d2a4}.genre-art i{display:none}.genre-copy{padding:27px}.genre-copy h3{color:#f4f5f8}.genre-copy p{color:#b5c0ce}.genre-copy .text-link{color:var(--gold)}
.first-visit{background:radial-gradient(ellipse at 0 0,#20374a 0,transparent 65%),#111c2b;border-color:#bdc7d32b;box-shadow:0 15px 55px #0003}.first-visit h2{color:#fff}.first-visit p{color:#b9c5d3}.guide-list li{border-color:#ffffff25}.guide-list li::marker{color:var(--gold)}.guide-list a span{color:var(--gold)}.story-card{border-color:#c5d5e32b}.story-card h3 a{color:#f1f4f9}.story-card h3 a:hover{color:var(--gold)}.story-card .text-link{color:var(--gold)}.story-card p:not(.eyebrow){color:#aebdcd}.site-footer{border-color:#ffffff24;background:transparent}.footer-brand{color:#f5f6f9}.site-footer nav{color:#c7cfda}.site-footer small,.copyright{color:#98a9bd}.site-footer p{color:#b8c3d3}.copyright{border-color:#ffffff20}
.article h1,.article-body h2,.article-body h3,.article-callout h2{color:#f5f7fb}.article-intro{color:#bfcbda}.article-body{color:#d0d9e5}.article-body a{color:#f0c585}.article-callout,.notice,.x-embed,.ad-link{background:#111e30;border-color:#ffffff25}.button{background:linear-gradient(120deg,#f2d4a1,#d4aa72);color:#131b27;border-color:#d4aa72;font-weight:700;box-shadow:0 5px 22px #e6bd7614}.button:hover{background:#ffe0ad;color:#101824}.filters{background:#111c2d;border-color:#ffffff25}.filters input,.filters select{background:#09121f;border-color:#6f81944d;color:#eef3f9}.filters>a{color:#e3c18f}.empty-state h2{color:#f2f5f9}.skip{background:#172b3d;color:#fff}
@media(min-width:1500px){.explorer{min-height:730px}}
@media(max-width:1050px){.explorer{grid-template-columns:minmax(0,1fr) 320px;padding:30px;gap:20px}.explorer h1{font-size:46px}.map-surface{min-height:440px}.japan-map{height:340px}.city-links{gap:0 18px}.visual-credit{left:30px}.genre-art{height:185px}}
@media(max-width:780px){.explorer{grid-template-columns:1fr;padding:32px 24px 38px;gap:30px;background-position:38% center}.explorer-copy{min-height:390px;padding:0}.explorer h1{font-size:44px}.explorer .area-label{padding-top:35px}.city-links{max-width:none}.map-surface{width:100%;max-width:none;min-height:365px;background:#0b1626dc}.japan-map{height:310px;max-width:320px}.map-caption{align-self:flex-start}.map-surface p{max-width:100%}.visual-credit{left:24px;bottom:12px}.genre-grid{grid-template-columns:1fr}.genre-art{height:220px;background-size:cover}.genre-concept .genre-art,.genre-alternative .genre-art{background-size:cover}.section{margin:55px 0}}
@media(max-width:400px){.explorer h1{font-size:36px}.explorer{padding-left:20px;padding-right:20px}.map-surface{padding-left:10px;padding-right:10px}.site-header .languages{font-size:11px}.city-links{gap:0 16px}}

.venue-disclaimer{grid-column:1/-1;padding:20px;border:1px solid #766447;background:#151c2c;color:#e9dcc5;font-size:13px;line-height:1.9}.venue-disclaimer p{margin:0 0 8px}

.venue-visual{margin:0 0 24px;position:relative;overflow:hidden;background:#0c1827}.venue-visual img{display:block;width:100%;height:100%;object-fit:cover}.venue-thumb{aspect-ratio:16/9}.venue-banner{aspect-ratio:2/1}.venue-visual figcaption{position:absolute;bottom:0;left:0;right:0;padding:8px 12px;background:rgba(5,12,23,.88);color:#f2d7ab;font-size:11px;line-height:1.5}.story-card:nth-child(3n+2) .venue-visual img{object-position:25% 70%}.story-card:nth-child(3n) .venue-visual img{object-position:75% 30%}

.venue-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px}.venue-tag{display:inline-block;padding:5px 12px;border:1px solid #d8af7055;border-radius:999px;background:#d8af7010;color:var(--gold);font-size:13px;line-height:1.6}.venue-tag:hover{background:#d8af7028;color:#ffe1aa}.story-card .venue-tags{margin-bottom:16px}

/* Edge-to-edge city bokeh behind the entire home page, including its gutters. */
html{min-height:100%;background:#080e19}
body.hapbar-home{position:relative;isolation:isolate;min-height:100vh;background:transparent}
.hapbar-home::before{content:"";position:fixed;inset:-24px;z-index:-2;pointer-events:none;background:linear-gradient(180deg,#07102066 0%,#0b14274d 50%,#080e1999 100%),url('assets/city-night.png') center 65%/cover no-repeat;filter:blur(10px) saturate(1.45) brightness(.85);transform:scale(1.025)}
.hapbar-home::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 7% 24%,#ffd5929c 0, #e4b97838 6px,transparent 22px),radial-gradient(circle at 94% 38%,#8aceffb0 0,#529aff40 8px,transparent 29px),radial-gradient(circle at 4% 72%,#e2a4ff99 0,#a479de22 10px,transparent 32px),radial-gradient(circle at 89% 78%,#ffcf85a6 0,#db9a4e35 12px,transparent 40px),radial-gradient(circle at 22% 8%,#fff0ca70 0,transparent 15px),radial-gradient(ellipse at 0 45%,#d68c3433,transparent 37%),radial-gradient(ellipse at 100% 30%,#437bcc40,transparent 42%);animation:night-shimmer 7s ease-in-out infinite alternate}
.hapbar-home .site-header{background:#080f1c91;backdrop-filter:blur(16px);box-shadow:0 12px 40px #02081730;padding-left:32px;padding-right:32px}
.hapbar-home .explorer{border-color:#f0cf9852;box-shadow:0 25px 90px #0007,0 0 45px #e3b87712}
.hapbar-home .section-heading{text-shadow:0 2px 15px #000,0 1px 5px #000}
.hapbar-home .site-footer{background:#080f1ce8;padding:32px;backdrop-filter:blur(14px)}
.hapbar-home .story-card{background:#0a1422e8;padding:24px;border:1px solid #d9c5a52e}
@keyframes night-shimmer{from{opacity:.65}to{opacity:1}}
@media(max-width:680px){.hapbar-home::before{filter:blur(7px) saturate(1.35) brightness(.8);background-position:58% center}.hapbar-home .site-header{padding:18px 20px}.hapbar-home .site-footer{padding:24px 18px}}
@media(prefers-reduced-motion:reduce){.hapbar-home::after{animation:none}}

/* Reader reviews */
.review-score{display:inline-flex;align-items:center;gap:.4rem;flex-wrap:wrap;text-decoration:none;font-size:.9rem;margin:.5rem 0 1rem;color:#f6d39c}
.review-score>span,.review-stars{color:#ffc66f}.venue-reviews{margin-top:3rem;padding-top:2rem;border-top:1px solid #536071;scroll-margin-top:2rem}
.review-note{font-size:.85rem;color:#b8c9dc}.review-notice{padding:1rem;background:#173c36;border:1px solid #4c9882}
.reader-review{padding:1.3rem 0;border-bottom:1px solid #394553}.reader-review header{display:flex;gap:1rem;justify-content:space-between;flex-wrap:wrap}.reader-review time{font-size:.85rem;color:#acbdcf}.review-content{white-space:pre-wrap;overflow-wrap:anywhere}
.review-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.review-form label{display:grid;gap:.5rem;font-size:.9rem}.review-form input,.review-form select,.review-form textarea{box-sizing:border-box;width:100%;min-width:0;background:#101d2d;color:#fff;border:1px solid #697a90;border-radius:4px;padding:.8rem;font:inherit}.review-full{grid-column:1/-1}.review-form textarea{resize:vertical}.review-form .button{justify-self:start;grid-column:1/-1}.review-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.review-pagination{display:flex;gap:1.5rem;justify-content:center;margin:1.5rem 0}
@media(max-width:600px){.review-form{grid-template-columns:1fr}.review-score{font-size:.85rem}}

/* Geographic labels */
.venue-visual{position:relative}.venue-location-labels{position:absolute;top:14px;left:14px;right:14px;z-index:2;display:flex;flex-wrap:wrap;gap:8px}
.location-label{display:inline-block;padding:7px 12px;border:1px solid #f4cb8580;background:#121b2bf0;color:#ffe1ab;border-radius:4px;text-decoration:none;font-size:.85rem;font-weight:700;line-height:1.4;box-shadow:0 2px 12px #0008}.location-prefecture{background:#f4cd8f;color:#111b29}.location-unknown{background:#152033e8;color:#c5d0de;border-color:#94a3b84d;font-size:.75rem}.location-label:hover{filter:brightness(1.15)}
.venue-location-path{display:flex;gap:6px;flex-wrap:wrap;font-size:.82rem;margin:10px 0;color:#bfd0e3}.venue-location-path a{text-decoration:none}.venue-location-path a:hover{text-decoration:underline}
.venue-filters{display:flex;flex-wrap:wrap;gap:16px;align-items:end}.venue-filters>label{flex:1 1 170px;min-width:0}.geo-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;flex:1 0 100%}.geo-filters label{min-width:0}.venue-filters select,.venue-filters input{width:100%;min-width:0;box-sizing:border-box}
@media(max-width:600px){.geo-filters{grid-template-columns:1fr}.venue-location-labels{top:10px;left:10px;right:10px;gap:6px}.location-label{font-size:.8rem;padding:6px 9px}}

/* Reserved banner space prevents layout shifts while the ad provider loads. */
.hb-display-ad{margin:32px auto;padding:16px 0;text-align:center;max-width:100%;clear:both}
.hb-display-ad-label{margin:0 0 10px;font:500 11px/1.4 sans-serif;letter-spacing:.12em;color:#aebcce}
.hb-display-ad-slot{width:300px;min-height:250px;max-width:100%;margin:0 auto;overflow:hidden;background:rgba(9,18,30,.35)}
.hb-display-ad-slot ins{display:block;text-decoration:none}

.venue-image-link{display:block;width:100%;height:100%}.venue-image-link:focus-visible{outline:3px solid #f2bf73;outline-offset:-3px}.venue-thumb figcaption{pointer-events:none}

.venue-pagination{margin:36px 0}.venue-pagination ul{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;list-style:none;padding:0}.venue-pagination a,.venue-pagination span{display:block;padding:8px 14px;border:1px solid #40536b;border-radius:4px}.venue-pagination .current{background:#edbd76;color:#101c2c;border-color:#edbd76}.article-body dt{margin-top:16px;font-weight:700;color:#edbd76}.article-body dd{margin:4px 0 16px;overflow-wrap:anywhere}

/* In-list advertisements occupy their own row, away from venue links. */
.story-grid > .hb-display-ad{grid-column:1 / -1;width:100%;margin:24px 0;padding:24px 0;border-block:1px solid rgba(174,188,206,.16)}

/* Keep venue search actions readable on narrow screens. */
.venue-filters > .button{flex-shrink:0;white-space:nowrap;min-width:88px;display:inline-flex;align-items:center;justify-content:center;line-height:1.2}
@media(max-width:680px){.venue-filters > label{flex:1 0 100%;min-width:0}.venue-filters > .button{flex:1 1 auto}.venue-filters > a{flex:0 0 auto;white-space:nowrap;padding:10px 4px}}

/* DMM official banners share a labeled ad row with existing display ads. */
.hb-ad-pair{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:24px;max-width:100%}
.hb-ad-pair>.hb-display-ad-slot{margin:0}
.hb-dmm-slot{width:300px;min-height:250px;max-width:100%;margin:0 auto;overflow:hidden;line-height:0}
.hb-ad-pair>.hb-dmm-slot{margin:0}
.hb-dmm-slot ins{display:block;text-decoration:none}
.hb-dmm-slot img,.hb-dmm-slot iframe{max-width:100%}
.hb-dmm-slot img{height:auto}
.hb-dmm-footer{padding:24px 0;border-top:1px solid #aebcce29}

/* A processed ExoClick response may contain only an empty div and styles.
   Keep actual creative media visible, but do not reserve 250px for no-fill. */
.hb-display-ad-slot:has(ins[data-processed="true"]):not(:has(iframe,img,video,object,canvas,a[href])){display:none}

.hb-station-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.hb-station-group{background:#0e1928e6;border:1px solid #aebcce29;padding:24px;min-width:0}.hb-station-group h3{margin:0 0 16px;color:#f4c47a}.hb-station-group ul{list-style:none;padding:0;margin:0}.hb-station-group li+li{border-top:1px solid #aebcce20}.hb-station-group a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;text-decoration:none}.hb-station-group a:hover,.hb-station-group a:focus-visible{color:#f4c47a}.hb-station-count{font-size:12px;white-space:nowrap;color:#b9c9da}.hb-station-empty{color:#b9c9da;padding:12px 0}@media(max-width:1000px){.hb-station-groups{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.hb-station-groups{grid-template-columns:1fr;gap:16px}.hb-station-group{padding:20px}}
