:root {
  color-scheme: dark;
  --ink: #09090a;
  --surface: #111114;
  --surface-2: #19181b;
  --surface-3: #211d20;
  --wine: #541e2a;
  --wine-bright: #7b2f40;
  --gold: #b99a64;
  --gold-bright: #d7bd82;
  --ivory: #eee7da;
  --muted: #aaa196;
  --line: rgba(185, 154, 100, .25);
  --success: #81ad8e;
  --danger: #d48182;
  --shadow: 0 20px 60px rgba(0, 0, 0, .42);
  --serif: "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif;
  --sans: Inter, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  color: var(--ivory);
  background:
    radial-gradient(circle at 50% -10%, rgba(105, 42, 53, .32), transparent 36rem),
    linear-gradient(145deg, #070708, #151116 48%, #080809);
  font-family: var(--sans);
  line-height: 1.7;
}
body::before {
  position: fixed;
  inset: 0;
  z-index: -1;
  content: "";
  opacity: .14;
  pointer-events: none;
  background-image: radial-gradient(circle at 20% 20%, rgba(255,255,255,.05) 0 1px, transparent 1px), radial-gradient(circle at 80% 60%, rgba(255,255,255,.035) 0 1px, transparent 1px);
  background-size: 9px 9px, 13px 13px;
}
body.is-locked { overflow: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
:focus-visible { outline: 2px solid var(--gold-bright); outline-offset: 3px; }
[hidden] { display: none !important; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 100; padding: .65rem 1rem; background: var(--gold-bright); color: #111; }
.skip-link:focus { top: 1rem; }
.eyebrow { color: var(--gold-bright); font-size: .68rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; }
.muted { color: var(--muted); }
.gold { color: var(--gold-bright); }
.mobile-header { display: none; }
.site-shell {
  width: min(1180px, calc(100% - 32px));
  margin: 24px auto 0;
  display: grid;
  grid-template-columns: 164px minmax(0, 1fr) 222px;
  gap: 18px;
  align-items: start;
}
.left-rail, .right-rail { position: sticky; top: 18px; }
.left-rail {
  min-height: calc(100vh - 42px);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(32, 27, 30, .96), rgba(9, 9, 10, .98));
  box-shadow: var(--shadow);
}
.brand {
  min-height: 132px;
  padding: 24px 12px 18px;
  display: grid;
  place-items: center;
  text-align: center;
  border-bottom: 1px solid var(--line);
  background: radial-gradient(circle at 50% 10%, rgba(185, 154, 100, .18), transparent 65%);
}
.brand img { width: 122px; max-height: 62px; object-fit: contain; }
.brand small { margin-top: 8px; color: var(--muted); font-size: .56rem; letter-spacing: .24em; }
.primary-nav { padding: 12px 0; }
.primary-nav a {
  position: relative;
  min-height: 52px;
  padding: 7px 10px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  border-left: 2px solid transparent;
  color: var(--muted);
  transition: .2s ease;
}
.primary-nav a:hover, .primary-nav a[aria-current="page"] { color: var(--ivory); border-left-color: var(--gold-bright); background: linear-gradient(90deg, rgba(122, 47, 64, .5), transparent); }
.primary-nav a[aria-current="page"]::after { position: absolute; right: 10px; content: "•"; color: var(--gold-bright); }
.nav-icon { width: 34px; height: 34px; padding: 1px; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(185, 154, 100, .34); border-radius: 50%; background: #080809; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .7), 0 2px 8px rgba(0, 0, 0, .24); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.nav-icon img { width: 100%; height: 100%; aspect-ratio: 1; display: block; border-radius: 50%; object-fit: cover; transform: none; opacity: .94; filter: saturate(.88) brightness(.96); transition: filter .18s ease, opacity .18s ease; }
.nav-label { font-size: .69rem; font-weight: 800; letter-spacing: .12em; }
.rail-reserve { margin: 12px; padding: 13px 8px; display: block; border: 1px solid var(--gold); background: var(--wine); text-align: center; font-family: var(--serif); font-size: .78rem; letter-spacing: .1em; }
.page-column { min-width: 0; border: 1px solid var(--line); background: rgba(10, 10, 11, .9); box-shadow: var(--shadow); }
.page-topline { height: 5px; background: linear-gradient(90deg, var(--wine), var(--gold-bright), var(--wine)); }
.main { min-height: 80vh; }
.page-hero {
  position: relative;
  min-height: 174px;
  padding: 40px clamp(22px, 5vw, 54px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(110deg, rgba(84, 30, 42, .76), rgba(17, 17, 20, .82)), url("assets/v2-campaign-night.webp") center / cover;
}
.page-hero::after { position: absolute; right: 8%; bottom: -48px; content: attr(data-letter); color: rgba(255,255,255,.045); font-family: Georgia, serif; font-size: 9rem; line-height: 1; }
.page-hero h1 { position: relative; z-index: 1; margin: 4px 0 0; font-family: var(--serif); font-size: clamp(2rem, 5vw, 3.6rem); font-weight: 500; letter-spacing: .08em; line-height: 1.05; }
.page-hero p { position: relative; z-index: 1; margin: 12px 0 0; color: #d3c8ba; font-family: var(--serif); font-size: .9rem; }
.content { padding: clamp(22px, 4vw, 42px); }
.section { margin-bottom: 46px; }
.section:last-child { margin-bottom: 0; }
.section-heading { margin-bottom: 20px; display: flex; align-items: end; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); }
.section-heading > div { padding-bottom: 12px; }
.section-heading h2 { margin: 2px 0 0; font-family: var(--serif); font-size: clamp(1.35rem, 3vw, 2rem); font-weight: 500; letter-spacing: .08em; }
.text-link { margin-bottom: 12px; color: var(--gold-bright); font-size: .72rem; font-weight: 800; letter-spacing: .1em; }
.text-link::after { content: "  →"; }
.panel { border: 1px solid var(--line); background: linear-gradient(145deg, rgba(33, 29, 32, .92), rgba(12, 12, 13, .94)); }
.button, .button-ghost { min-height: 46px; padding: 11px 20px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--gold); cursor: pointer; font-size: .76rem; font-weight: 800; letter-spacing: .1em; transition: .2s ease; }
.button { color: #111; background: linear-gradient(135deg, var(--gold-bright), #9e7d48); }
.button-ghost { color: var(--gold-bright); background: rgba(0,0,0,.25); }
.button:hover, .button-ghost:hover { transform: translateY(-2px); filter: brightness(1.08); }
.right-rail { display: grid; gap: 14px; }
.right-card { padding: 17px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(34, 29, 32, .94), rgba(10, 10, 11, .98)); box-shadow: var(--shadow); }
.right-card h2 { margin: 3px 0 12px; font-family: var(--serif); font-size: 1rem; letter-spacing: .08em; }
.open-card strong { display: block; color: var(--gold-bright); font-family: var(--serif); font-size: 1.35rem; }
.open-card p, .rail-news p { margin: 6px 0 0; color: var(--muted); font-size: .72rem; }
.status-lamp { display: inline-flex; align-items: center; gap: 7px; color: var(--success); font-size: .72rem; }
.status-lamp::before { width: 7px; height: 7px; content: ""; border-radius: 50%; background: var(--success); box-shadow: 0 0 10px var(--success); }
.rail-cast { display: grid; grid-template-columns: 52px 1fr; gap: 11px; align-items: center; }
.rail-cast img { width: 52px; aspect-ratio: 1; object-fit: cover; }
.rail-cast strong, .rail-cast small { display: block; }
.rail-cast small { color: var(--gold-bright); font-size: .58rem; letter-spacing: .1em; }
.rail-cast strong { margin-top: 2px; font-family: var(--serif); font-size: .85rem; }
.rail-cta { padding: 20px 16px; text-align: center; background: linear-gradient(rgba(72,22,34,.76), rgba(18,12,14,.9)), url("assets/v2-campaign-night.webp") center / cover; }
.rail-cta p { margin: 4px 0 14px; font-size: .73rem; }
.rail-cta .button { width: 100%; }
.footer { width: min(1180px, calc(100% - 32px)); margin: 18px auto 86px; padding: 24px; border-top: 1px solid var(--line); color: var(--muted); text-align: center; font-size: .65rem; letter-spacing: .12em; }
.mobile-reserve { display: none; }

/* Home */
.home-hero { position: relative; min-height: 500px; overflow: hidden; border-bottom: 1px solid var(--line); background: linear-gradient(90deg, rgba(8,8,9,.92) 0%, rgba(8,8,9,.48) 48%, rgba(8,8,9,.18)), url("assets/v2-hero-lounge.webp") center / cover, linear-gradient(135deg, #3c1b24, #0b0b0d); }
.home-hero::before { position: absolute; inset: 18px; content: ""; border: 1px solid rgba(215,189,130,.26); pointer-events: none; }
.home-hero-copy { position: relative; z-index: 1; max-width: 540px; padding: 100px clamp(30px, 7vw, 68px) 55px; }
.home-hero h1 { margin: 9px 0 14px; font-family: var(--serif); font-size: clamp(2.3rem, 6vw, 4.5rem); font-weight: 400; line-height: 1.05; letter-spacing: .08em; }
.hero-title-ja { display: block; color: var(--ivory); font-size: 1em; letter-spacing: .08em; }
.hero-title-en { display: block; margin-top: .65em; color: var(--gold-bright); font-family: var(--sans); font-size: .35em; font-weight: 700; letter-spacing: .24em; }
.home-hero p { max-width: 400px; color: #d4cabd; font-family: var(--serif); font-size: .92rem; }
.hero-actions { margin-top: 27px; display: flex; flex-wrap: wrap; gap: 10px; }
.status-strip { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid var(--line); }
.status-strip > div { padding: 17px 18px; border-right: 1px solid var(--line); }
.status-strip > div:last-child { border-right: 0; }
.status-strip small { display: block; color: var(--muted); font-size: .58rem; letter-spacing: .16em; }
.status-strip strong { display: block; margin-top: 3px; font-family: var(--serif); font-size: .96rem; }
.home-content { padding-top: 32px; }
.featured-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.feature-cast { min-height: 270px; display: grid; grid-template-columns: 44% 1fr; overflow: hidden; }
.feature-cast img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.feature-cast > div { padding: 26px 20px; align-self: center; }
.feature-cast h3 { margin: 5px 0; font-family: var(--serif); font-size: 1.35rem; font-weight: 500; }
.feature-cast p { margin: 8px 0 16px; color: var(--muted); font-size: .75rem; }
.news-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 14px; }
.news-list { padding: 4px 22px; }
.news-list a { padding: 15px 0; display: grid; grid-template-columns: 84px 1fr; gap: 10px; border-bottom: 1px solid var(--line); font-size: .78rem; }
.news-list a:last-child { border-bottom: 0; }
.news-list time { color: var(--gold-bright); font-size: .68rem; }
.campaign-card { min-height: 230px; padding: 24px; display: flex; flex-direction: column; justify-content: end; background: linear-gradient(transparent, rgba(5,5,6,.94)), url("assets/v2-campaign-night.webp") center / cover, linear-gradient(135deg, #52212e, #101013); }
.campaign-card h3 { margin: 4px 0; font-family: var(--serif); font-size: 1.3rem; }
.cast-mini-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.cast-mini { position: relative; overflow: hidden; border: 1px solid var(--line); background: var(--surface); }
.cast-mini img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; transition: transform .35s ease; }
.cast-mini:hover img { transform: scale(1.035); }
.cast-mini > div { padding: 12px; }
.cast-mini h3 { margin: 2px 0 0; font-family: var(--serif); font-size: .95rem; font-weight: 500; }
.cast-mini small { color: var(--gold-bright); font-size: .55rem; letter-spacing: .12em; }
.shift-chip { margin-top: 8px; display: inline-flex; color: var(--success); font-size: .65rem; }

/* Status */
.status-lead { padding: 26px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.status-lead h2 { margin: 4px 0; font-family: var(--serif); font-size: 1.65rem; font-weight: 500; }
.status-lead p { margin: 0; color: var(--muted); font-size: .8rem; }
.status-badge { min-width: 132px; padding: 16px; border: 1px solid rgba(129,173,142,.4); text-align: center; background: rgba(50, 88, 63, .12); }
.status-badge strong { display: block; color: var(--success); font-family: var(--serif); font-size: 1.25rem; }
.metric-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.metric { padding: 22px; }
.metric h3 { margin: 4px 0 12px; font-family: var(--serif); font-size: 1.05rem; font-weight: 500; }
.metric strong { color: var(--gold-bright); font-size: 1.45rem; }
.metric p { margin: 6px 0 0; color: var(--muted); font-size: .75rem; }
.area-list { display: grid; gap: 10px; }
.area-row { padding: 17px 20px; display: grid; grid-template-columns: 1fr auto auto; gap: 18px; align-items: center; }
.area-row h3 { margin: 0; font-family: var(--serif); font-size: 1rem; }
.area-row span { color: var(--muted); font-size: .72rem; }
.wait { min-width: 78px; padding: 5px 9px; border: 1px solid var(--line); color: var(--gold-bright) !important; text-align: center; }

/* Cast */
.filter-toolbar { margin-bottom: 20px; padding: 16px; display: grid; grid-template-columns: minmax(0, 1.4fr) .75fr .75fr auto; gap: 10px; align-items: end; }
.field { display: grid; gap: 6px; }
.field label, .field > span { color: var(--muted); font-size: .68rem; font-weight: 700; letter-spacing: .08em; }
.field input, .field select, .field textarea {
  width: 100%;
  min-height: 45px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 0;
  color: var(--ivory);
  background: #09090a;
}
.field textarea { min-height: 110px; resize: vertical; }
.filter-toggle { display: none; }
.results-line { margin: 0 0 14px; color: var(--muted); font-size: .73rem; }
.cast-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.cast-card { overflow: hidden; border: 1px solid var(--line); background: linear-gradient(160deg, var(--surface-2), #0b0b0c); }
.cast-card[hidden] { display: none; }
.cast-photo { position: relative; }
.cast-photo img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; }
.cast-state { position: absolute; left: 8px; bottom: 8px; padding: 5px 8px; background: rgba(5,5,6,.86); color: var(--success); font-size: .6rem; }
.cast-state.is-next { color: var(--gold-bright); }
.cast-state.is-off { color: var(--muted); }
.cast-body { padding: 14px; }
.cast-body small { color: var(--gold-bright); font-size: .55rem; letter-spacing: .11em; }
.cast-body h2 { margin: 3px 0; font-family: var(--serif); font-size: 1rem; font-weight: 500; }
.cast-meta { margin: 0; color: var(--muted); font-size: .66rem; }
.tag { margin-top: 9px; padding: 3px 7px; display: inline-block; border: 1px solid var(--line); color: var(--gold-bright); font-size: .55rem; letter-spacing: .1em; }
.empty-state { padding: 34px; border: 1px solid var(--line); color: var(--muted); text-align: center; }
.dialog-backdrop { position: fixed; inset: 0; z-index: 60; padding: 18px; display: grid; place-items: center; background: rgba(0,0,0,.76); backdrop-filter: blur(7px); }
.dialog-panel { width: min(460px, 100%); max-height: calc(100vh - 36px); overflow: auto; border: 1px solid var(--gold); background: #111114; box-shadow: var(--shadow); }
.dialog-head { padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.dialog-head h2 { margin: 0; font-family: var(--serif); font-size: 1.1rem; }
.icon-button { width: 44px; height: 44px; border: 1px solid var(--line); cursor: pointer; color: var(--gold-bright); background: transparent; }
.dialog-filters { padding: 20px; display: grid; gap: 14px; }

/* Schedule */
.date-tabs { margin-bottom: 20px; display: grid; grid-template-columns: repeat(7, 1fr); border: 1px solid var(--line); }
.date-tab { min-width: 0; min-height: 66px; padding: 7px 2px; border: 0; border-right: 1px solid var(--line); cursor: pointer; color: var(--muted); background: transparent; }
.date-tab:last-child { border-right: 0; }
.date-tab span, .date-tab strong { display: block; }
.date-tab span { font-size: .58rem; }
.date-tab strong { font-family: var(--serif); font-size: 1.1rem; }
.date-tab[aria-selected="true"] { color: var(--ivory); background: linear-gradient(180deg, var(--wine), #2b151c); box-shadow: inset 0 -2px var(--gold-bright); }
.schedule-summary { margin-bottom: 20px; padding: 18px 20px; display: flex; justify-content: space-between; gap: 16px; align-items: center; }
.schedule-summary h2 { margin: 2px 0; font-family: var(--serif); font-size: 1.25rem; font-weight: 500; }
.schedule-summary p { margin: 0; color: var(--muted); font-size: .72rem; }
.schedule-summary strong { color: var(--gold-bright); font-family: var(--serif); font-size: 1.8rem; }
.schedule-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.schedule-empty { margin: 12px 0 0; padding: 28px 18px; border: 1px solid var(--line); color: var(--muted); text-align: center; background: var(--surface); }
.schedule-card { min-height: 150px; padding: 14px; display: grid; grid-template-columns: 86px 1fr; gap: 14px; align-items: center; }
.schedule-card[hidden] { display: none; }
.schedule-card img { width: 86px; height: 118px; object-fit: cover; object-position: top; }
.schedule-card h3 { margin: 3px 0; font-family: var(--serif); font-size: 1.05rem; font-weight: 500; }
.schedule-card small { color: var(--gold-bright); font-size: .55rem; letter-spacing: .1em; }
.schedule-time { margin-top: 12px; padding-top: 9px; border-top: 1px solid var(--line); color: var(--success); font-size: .76rem; font-weight: 800; }

/* Ranking */
.ranking-sections { display: grid; gap: 26px; }
.ranking-category { padding: 22px; }
.ranking-category header { margin-bottom: 16px; }
.ranking-category h2 { margin: 3px 0; font-family: var(--serif); font-size: 1.35rem; font-weight: 500; }
.podium { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.rank-card { position: relative; padding: 10px; border: 1px solid var(--line); background: #0a0a0b; }
.rank-card:first-child { border-color: rgba(215,189,130,.65); }
.rank-number { position: absolute; top: 7px; left: 7px; z-index: 1; width: 32px; height: 32px; display: grid; place-items: center; color: #111; background: var(--gold-bright); font-family: Georgia, serif; }
.rank-card img { width: 100%; aspect-ratio: 1; object-fit: cover; object-position: top; }
.rank-card h3 { margin: 10px 0 0; font-family: var(--serif); font-size: .9rem; font-weight: 500; }
.rank-card small { color: var(--muted); font-size: .57rem; }

/* System */
.course-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.course { padding: 24px 16px; text-align: center; }
.course.is-featured { border-color: var(--gold); background: linear-gradient(155deg, rgba(84,30,42,.75), #101012); }
.course h2 { margin: 4px 0 18px; color: var(--gold-bright); font-family: var(--serif); font-size: 1rem; font-weight: 500; }
.duration { font-family: Georgia, serif; font-size: 2.4rem; line-height: 1; }
.duration small { font-size: .7rem; }
.price { margin: 13px 0 5px; font-family: var(--serif); font-size: 1.45rem; }
.course p:last-child { color: var(--muted); font-size: .66rem; }
.fee-table { width: 100%; border-collapse: collapse; }
.fee-table th, .fee-table td { padding: 15px; border-bottom: 1px solid var(--line); text-align: left; font-size: .78rem; }
.fee-table th { width: 52%; color: var(--muted); font-weight: 500; }
.fee-table td { color: var(--gold-bright); text-align: right; font-weight: 800; }
.flow-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.flow-step { padding: 18px 10px; text-align: center; }
.flow-step b { width: 30px; height: 30px; margin: 0 auto 12px; display: grid; place-items: center; border-radius: 50%; color: #111; background: var(--gold-bright); }
.flow-step h3 { margin: 0; font-family: var(--serif); font-size: .8rem; }
.flow-step p { margin: 7px 0 0; color: var(--muted); font-size: .62rem; }
.notice-list { margin: 0; padding: 20px 20px 20px 38px; color: var(--muted); font-size: .75rem; }

/* Guide */
.guide-steps { display: grid; gap: 12px; }
.guide-step { padding: 22px; display: grid; grid-template-columns: 60px 1fr; gap: 18px; align-items: start; }
.step-number { width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid var(--gold); color: var(--gold-bright); font-family: Georgia, serif; font-size: 1.5rem; }
.guide-step h2 { margin: 0 0 6px; font-family: var(--serif); font-size: 1.15rem; font-weight: 500; }
.guide-step p { margin: 0; color: var(--muted); font-size: .76rem; }
.location-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.location-card { overflow: hidden; }
.location-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.location-card div { padding: 15px; }
.location-card h3 { margin: 0; font-family: var(--serif); font-size: .95rem; font-weight: 500; }
.location-card p { margin: 5px 0 0; color: var(--muted); font-size: .67rem; }
.faq-list { display: grid; gap: 8px; }
.faq-item { border: 1px solid var(--line); background: var(--surface); }
.faq-question { width: 100%; padding: 17px 20px; display: flex; justify-content: space-between; gap: 14px; border: 0; cursor: pointer; color: var(--ivory); background: transparent; text-align: left; }
.faq-question::after { content: "+"; color: var(--gold-bright); }
.faq-question[aria-expanded="true"]::after { content: "−"; }
.faq-answer { padding: 0 20px 18px; color: var(--muted); font-size: .75rem; }

/* Reserve */
.reserve-intro { padding: 22px; }
.reserve-intro h2 { margin: 3px 0; font-family: var(--serif); font-size: 1.25rem; font-weight: 500; }
.reserve-intro p { margin: 6px 0 0; color: var(--muted); font-size: .75rem; }
.reserve-form { display: grid; gap: 16px; }
.form-block { margin: 0; padding: 22px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(31,27,30,.92), #0d0d0e); }
.form-block legend { padding: 0 8px; color: var(--gold-bright); font-family: var(--serif); font-size: 1rem; }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.field-wide { grid-column: 1 / -1; }
.required { color: var(--danger); font-size: .6rem; }
.radio-grid, .check-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.choice { position: relative; display: block; min-width: 0; }
.choice input {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 1px;
  height: 1px;
  margin: 0;
  overflow: hidden;
  opacity: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
.choice span { min-height: 44px; padding: 9px; display: grid; place-items: center; border: 1px solid var(--line); cursor: pointer; color: var(--muted); text-align: center; font-size: .7rem; }
.choice input:checked + span { border-color: var(--gold); color: var(--ivory); background: rgba(84,30,42,.58); }
.choice input:focus-visible + span { outline: 2px solid var(--gold-bright); outline-offset: 2px; }
.form-error { margin: 0; color: var(--danger); font-size: .72rem; }
.form-actions { display: flex; justify-content: end; gap: 10px; }
.confirmation { padding: 24px; }
.confirmation h2 { margin: 4px 0 18px; font-family: var(--serif); font-weight: 500; }
.summary-list { margin: 0 0 20px; }
.summary-list div { padding: 12px 0; display: grid; grid-template-columns: 35% 1fr; border-bottom: 1px solid var(--line); }
.summary-list dt { color: var(--muted); font-size: .7rem; }
.summary-list dd { margin: 0; font-size: .75rem; }
.complete-message { padding: 34px; text-align: center; }
.complete-message h2 { margin: 5px 0; font-family: var(--serif); font-weight: 500; }

/* Auth */
.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: linear-gradient(rgba(3,3,4,.42), rgba(3,3,4,.9)), url("assets/v2-guide-entrance-v3.webp") center / cover, #120d10; }
.auth-card { width: min(520px, 100%); padding: clamp(28px, 6vw, 54px); border: 1px solid var(--gold); text-align: center; background: rgba(10,10,11,.92); box-shadow: var(--shadow); }
.auth-card img { width: 180px; margin: 0 auto 24px; }
.auth-card h1 { margin: 4px 0 14px; font-family: var(--serif); font-size: clamp(1.5rem, 5vw, 2.35rem); font-weight: 500; }
.auth-card p { color: var(--muted); font-size: .78rem; }
.auth-actions { margin-top: 24px; display: grid; gap: 10px; }

@media (max-width: 1120px) {
  .site-shell { grid-template-columns: 146px minmax(0, 1fr) 202px; gap: 12px; }
  .cast-grid { grid-template-columns: repeat(2, 1fr); }
  .course-grid { grid-template-columns: 1fr; }
  .flow-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 980px) {
  .mobile-header { position: sticky; top: 0; z-index: 50; height: 68px; padding: 10px 18px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: rgba(10,10,11,.96); backdrop-filter: blur(12px); }
  .mobile-brand img { width: 138px; max-height: 44px; object-fit: contain; }
  .menu-button { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid var(--line); cursor: pointer; color: var(--gold-bright); background: transparent; font-size: .7rem; font-weight: 800; letter-spacing: .08em; }
  .site-shell { width: min(820px, calc(100% - 28px)); margin-top: 14px; display: block; }
  .left-rail { position: fixed; inset: 0 auto 0 0; z-index: 70; width: min(300px, calc(100vw - 54px)); min-height: 100vh; overflow-y: auto; transform: translateX(-105%); transition: transform .25s ease; }
  .left-rail.is-open { transform: translateX(0); }
  .left-rail .brand { min-height: 118px; }
  .right-rail { display: none; }
  .drawer-backdrop { position: fixed; inset: 0; z-index: 65; background: rgba(0,0,0,.72); backdrop-filter: blur(3px); }
  .drawer-backdrop[hidden] { display: none; }
  .home-hero { min-height: 470px; }
}

@media (max-width: 700px) {
  .site-shell, .footer { width: calc(100% - 20px); }
  .footer { margin-bottom: 86px; }
  .content { padding: 20px 14px 30px; }
  .page-hero { min-height: 146px; padding: 32px 20px; }
  .section { margin-bottom: 34px; }
  .section-heading { align-items: center; }
  .home-hero { min-height: 430px; background-position: 61% center; }
  .home-hero-copy { padding: 94px 26px 40px; }
  .home-hero h1 { max-width: 280px; }
  .status-strip { grid-template-columns: repeat(2, 1fr); }
  .status-strip > div:nth-child(2) { border-right: 0; }
  .status-strip > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .featured-grid, .news-grid, .cast-grid, .schedule-grid, .metric-grid, .location-grid, .form-grid { grid-template-columns: 1fr; }
  .feature-cast { min-height: 240px; }
  .cast-mini-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-toolbar { display: none; }
  .filter-toggle { width: 100%; margin-bottom: 14px; display: flex; }
  .date-tabs { grid-template-columns: repeat(7, minmax(0, 1fr)); width: 100%; overflow: hidden; }
  .date-tab { min-height: 58px; font-size: .7rem; }
  .date-tab strong { font-size: .9rem; }
  .schedule-summary, .status-lead { align-items: flex-start; }
  .status-lead { flex-direction: column; }
  .status-badge { width: 100%; }
  .area-row { grid-template-columns: 1fr auto; gap: 8px; }
  .area-row > span:not(.wait) { grid-column: 1 / -1; }
  .podium { grid-template-columns: 1fr; }
  .rank-card { display: grid; grid-template-columns: 96px 1fr; gap: 12px; align-items: center; }
  .rank-card img { width: 96px; height: 96px; }
  .flow-grid { grid-template-columns: 1fr; }
  .guide-step { grid-template-columns: 46px 1fr; padding: 17px; gap: 12px; }
  .step-number { width: 44px; height: 44px; font-size: 1.1rem; }
  .radio-grid, .check-grid { grid-template-columns: repeat(2, 1fr); }
  .field-wide { grid-column: auto; }
  .form-actions { flex-direction: column-reverse; }
  .form-actions .button, .form-actions .button-ghost { width: 100%; }
  .fee-table th, .fee-table td { padding: 12px 10px; }
  .mobile-reserve { position: fixed; left: 10px; right: 10px; bottom: 10px; z-index: 45; min-height: 55px; display: flex; border: 1px solid var(--gold-bright); color: #111; background: linear-gradient(135deg, #dfc98f, #a9854d); box-shadow: 0 10px 30px rgba(0,0,0,.55); }
}

@media (max-width: 430px) {
  .mobile-header { padding-inline: 12px; }
  .mobile-brand img { width: 122px; }
  .site-shell, .footer { width: calc(100% - 12px); }
  .home-hero-copy { padding-inline: 20px; }
  .feature-cast { grid-template-columns: 42% 1fr; }
  .feature-cast > div { padding: 18px 13px; }
  .cast-mini > div { padding: 10px 8px; }
  .schedule-card { grid-template-columns: 76px 1fr; gap: 10px; }
  .schedule-card img { width: 76px; height: 106px; }
  .date-tab span { font-size: .5rem; }
  .date-tab strong { font-size: .78rem; }
  .radio-grid, .check-grid { grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* V2 100-point refinement */
.mobile-only,
.mobile-context-strip { display: none; }

.nav-group { padding: 6px 0 8px; }
.nav-group + .nav-group { border-top: 1px solid var(--line); }
.nav-group-label {
  margin: 0;
  padding: 6px 14px 5px;
  color: #7f776f;
  font-size: .52rem;
  font-weight: 800;
  letter-spacing: .2em;
}
.primary-nav { padding: 4px 0; }
.primary-nav a { min-height: 52px; }
.nav-icon {
  border-color: rgba(215, 189, 130, .3);
}
.primary-nav a:hover .nav-icon,
.primary-nav a:focus-visible .nav-icon,
.primary-nav a[aria-current="page"] .nav-icon {
  border-color: var(--gold-bright);
  transform: translateY(-1px);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .72), 0 0 0 1px rgba(215, 189, 130, .16), 0 3px 9px rgba(0, 0, 0, .3);
}
.primary-nav a:hover .nav-icon img,
.primary-nav a:focus-visible .nav-icon img,
.primary-nav a[aria-current="page"] .nav-icon img {
  opacity: 1;
  filter: saturate(1) brightness(1.12);
}
.rail-hours { margin: 4px 12px 0; padding-top: 12px; display: grid; gap: 2px; border-top: 1px solid var(--line); }
.drawer-close { display: none; }
.rail-hours small { color: var(--muted); font-family: var(--serif); font-size: .7rem; }
.rail-reserve span { display: block; margin-top: 2px; color: #e3d6c1; font-family: var(--sans); font-size: .58rem; letter-spacing: .08em; }
.mobile-open-chip { display: inline-flex; align-items: center; gap: 5px; color: var(--success); font-size: .64rem; font-weight: 800; }
.mobile-open-chip i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 8px currentColor; }
.footer-inner { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 18px; }
.footer a { color: var(--gold-bright); text-decoration: underline; text-underline-offset: 3px; }

.page-hero { min-height: 260px; padding: 24px clamp(22px, 5vw, 52px) 38px; justify-content: flex-start; }
.page-hero-cast,
.page-hero-ranking {
  background: linear-gradient(100deg, rgba(24, 11, 15, .96), rgba(42, 21, 29, .64) 58%, rgba(8, 8, 9, .78)), url("assets/v2-cast-ambient-v3.webp") center / cover, linear-gradient(135deg, #30151d, #09090a);
}
.page-hero-system,
.page-hero-guide,
.page-hero-reserve {
  background: linear-gradient(100deg, rgba(19, 10, 13, .96), rgba(48, 27, 32, .62) 60%, rgba(8, 8, 9, .78)), url("assets/v2-guide-entrance-v3.webp") center / cover, linear-gradient(135deg, #361b22, #09090a);
}
.page-hero-status,
.page-hero-schedule {
  background: linear-gradient(100deg, rgba(27, 12, 17, .95), rgba(59, 25, 35, .62), rgba(8, 8, 9, .82)), url("assets/v2-campaign-night.webp") center / cover, linear-gradient(135deg, #3c1b24, #09090a);
}
.breadcrumb { position: relative; z-index: 2; min-height: 36px; margin-bottom: 18px; display: flex; align-items: center; gap: 8px; color: #a99b8b; font-size: .61rem; font-weight: 700; letter-spacing: .12em; }
.breadcrumb a { min-height: 36px; display: inline-flex; align-items: center; color: var(--gold-bright); }
.page-hero-inner { position: relative; z-index: 2; width: 100%; display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.page-hero-inner > div { max-width: 520px; }
.page-hero h1 { margin-top: 3px; font-size: clamp(2.35rem, 5vw, 3.9rem); }
.page-hero h2 { margin: 10px 0 0; color: #f1e9dc; font-family: var(--serif); font-size: clamp(1rem, 2vw, 1.28rem); font-weight: 500; letter-spacing: .05em; }
.page-hero p { max-width: 520px; margin-top: 7px; font-family: var(--sans); font-size: .78rem; }
.page-hero-cta { flex: 0 0 auto; margin-bottom: 3px; background: rgba(7, 7, 8, .64); backdrop-filter: blur(6px); }
.panel,
.cast-card,
.cast-mini,
.right-card { transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
a.panel:hover,
.cast-card:hover,
.cast-mini:hover,
.right-card:has(a:hover) { border-color: rgba(215, 189, 130, .55); box-shadow: 0 14px 34px rgba(0, 0, 0, .28); }

/* Home */
.home-hero-copy { max-width: 580px; padding-top: 76px; }
.home-hero h1 { max-width: 520px; font-size: clamp(2.5rem, 5.7vw, 4.35rem); }
.hero-now { width: fit-content; margin-top: 20px; padding: 9px 12px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; border: 1px solid rgba(215, 189, 130, .28); background: rgba(4, 4, 5, .56); backdrop-filter: blur(6px); font-size: .7rem; }
.hero-now strong { color: var(--gold-bright); font-family: var(--serif); }
.hero-now > span:last-child { color: #ddd3c4; }
.home-content .section { scroll-margin-top: 90px; }
.cast-mini-grid { align-items: stretch; }
.cast-mini { height: 100%; display: flex; flex-direction: column; }
.cast-mini img,
.photo-pending { width: 100%; aspect-ratio: 3 / 4; }
.cast-mini > div:last-child { position: relative; flex: 1; display: flex; flex-direction: column; align-items: flex-start; }
.photo-pending { display: grid; place-items: center; background: radial-gradient(circle at 50% 25%, rgba(185,154,100,.17), transparent 40%), linear-gradient(145deg, #231c20, #0a0a0b); color: #766c61; text-align: center; font-family: Georgia, serif; font-size: .58rem; letter-spacing: .15em; }
.mini-state { margin: -25px 0 7px; padding: 3px 7px; position: relative; z-index: 1; color: var(--gold-bright); background: rgba(8, 8, 9, .9); font-size: .56rem; font-weight: 800; }
.mini-state.is-ready { color: var(--success); }
.shift-chip { margin-top: auto; padding-top: 8px; }
.news-list a { grid-template-columns: 74px 74px minmax(0, 1fr); align-items: center; }
.news-category { padding: 3px 5px; border: 1px solid var(--line); color: var(--gold-bright); text-align: center; font-size: .52rem; font-weight: 800; letter-spacing: .08em; }
.campaign-card { align-items: flex-start; }
.campaign-card p { margin: 7px 0 15px; color: #cfc3b4; font-size: .7rem; line-height: 1.6; }
.campaign-card .button-ghost { width: fit-content; }

/* Status */
.updated-time { color: var(--gold-bright); font-size: .7rem; }
.congestion { padding: 22px 26px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.congestion h2 { margin: 2px 0 0; font-family: var(--serif); font-size: 1.25rem; font-weight: 500; }
.congestion p { margin: 4px 0 0; color: var(--muted); font-size: .73rem; }
.congestion-meter { width: min(260px, 45%); display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; }
.congestion-meter span { height: 10px; background: #30292c; }
.congestion-meter .is-on { background: linear-gradient(90deg, #5f856a, var(--success)); box-shadow: 0 0 12px rgba(129, 173, 142, .22); }
.area-row { grid-template-columns: minmax(130px, .8fr) minmax(150px, 1.25fr) auto auto; }
.area-row > div { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.availability { padding: 3px 7px; border: 1px solid rgba(215,189,130,.35); color: var(--gold-bright) !important; font-size: .58rem !important; }
.availability.is-roomy { border-color: rgba(129,173,142,.4); color: var(--success) !important; }
.wait small { display: block; color: var(--muted); font-size: .5rem; }
.area-reserve { min-height: 44px; padding: 8px 4px 8px 10px; display: inline-flex; align-items: center; gap: 6px; color: var(--gold-bright); font-size: .67rem; font-weight: 800; }
.next-actions,
.system-cta,
.guide-final-cta { padding: 26px; display: flex; align-items: center; justify-content: space-between; gap: 24px; background: linear-gradient(130deg, rgba(84,30,42,.52), rgba(15,14,16,.96)); }
.next-actions h2,
.system-cta h2,
.guide-final-cta h2 { margin: 4px 0; font-family: var(--serif); font-size: 1.35rem; font-weight: 500; }
.next-actions > div:last-child,
.guide-final-cta > div:last-child { display: flex; flex-wrap: wrap; justify-content: end; gap: 8px; }

/* Cast */
.filter-toolbar { grid-template-columns: minmax(140px, 1fr) minmax(260px, 1.6fr) minmax(120px, .7fr) auto; }
.quick-filter { display: flex; flex-wrap: wrap; gap: 6px; }
.filter-chip { min-height: 36px; padding: 6px 10px; border: 1px solid var(--line); cursor: pointer; color: var(--muted); background: #09090a; font-size: .63rem; font-weight: 700; }
.filter-chip:hover,
.filter-chip.is-active { border-color: var(--gold); color: var(--ivory); background: rgba(84, 30, 42, .6); }
.filter-count-badge { min-width: 20px; height: 20px; padding: 0 5px; display: inline-grid; place-items: center; border-radius: 50%; color: #111; background: var(--gold-bright); font-size: .62rem; }
.cast-grid { align-items: stretch; }
.cast-card { height: 100%; display: flex; flex-direction: column; }
.cast-photo img { aspect-ratio: 3 / 4; }
.cast-body { flex: 1; display: flex; flex-direction: column; align-items: flex-start; }
.cast-body h2 { font-size: 1.04rem; }
.cast-booking { width: 100%; min-height: 44px; margin-top: 13px; padding-top: 10px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); color: var(--gold-bright); font-size: .65rem; font-weight: 800; }
.cast-booking:hover { color: var(--ivory); }
.dialog-description { margin: 0; color: var(--muted); font-size: .72rem; }
.sheet-handle { display: none; }

/* Schedule */
.schedule-tools { margin-bottom: 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.schedule-tools > button { min-width: 230px; }
.schedule-tools p { margin: 0; color: var(--muted); font-size: .7rem; }
.schedule-tools strong { color: var(--gold-bright); font-family: var(--serif); font-size: 1rem; }
.date-tabs { overflow: hidden; }
.date-tab { position: relative; min-height: 72px; }
.date-tab::after { position: absolute; left: 50%; bottom: 5px; width: 4px; height: 4px; content: ""; transform: translateX(-50%); border-radius: 50%; background: transparent; }
.date-tab.has-cast::after { background: var(--success); box-shadow: 0 0 7px rgba(129,173,142,.45); }
.date-tab.is-weekend { color: #c78d92; }
.date-tab.is-today::before { position: absolute; top: 3px; left: 50%; content: "TODAY"; transform: translateX(-50%); color: var(--gold-bright); font-size: .42rem; letter-spacing: .06em; }
.date-tab.is-today { padding-top: 15px; }
.date-tab[aria-selected="true"] { color: var(--ivory); }
.schedule-summary { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; }
.schedule-facts { margin: 0; display: flex; gap: 10px; }
.schedule-facts > div { min-width: 74px; padding: 7px 10px; border-left: 1px solid var(--line); }
.schedule-facts dt { color: var(--muted); font-size: .58rem; }
.schedule-facts dd { margin: 0; color: var(--gold-bright); font-family: var(--serif); font-size: .95rem; white-space: nowrap; }
.schedule-facts strong { font-size: 1.4rem; }
.schedule-summary-actions { display: flex; gap: 7px; }
.schedule-summary-actions .button,
.schedule-summary-actions .button-ghost { padding-inline: 12px; font-size: .63rem; }
.schedule-grid { align-items: stretch; }
.schedule-card { min-height: 196px; height: 100%; grid-template-columns: 86px minmax(0, 1fr); align-content: center; }
.schedule-card > div { min-width: 0; height: 100%; display: flex; flex-direction: column; justify-content: center; }
.schedule-booking { min-height: 44px; margin-top: 8px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); color: var(--gold-bright); font-size: .62rem; font-weight: 800; }
.schedule-time { min-height: 57px; display: block; }
.schedule-time::before { width: 24px; height: 24px; margin-bottom: 5px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: .67rem; line-height: 1; }
.schedule-time.is-working { color: var(--success); }
.schedule-time.is-working::before { content: "✓"; }
.schedule-time.is-off { color: var(--muted); }
.schedule-time.is-off::before { content: "×"; }

/* Ranking */
.ranking-sections { gap: 16px; }
.ranking-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: end; }
.ranking-intro h2 { margin: 3px 0; font-family: var(--serif); font-size: 1.5rem; font-weight: 500; }
.ranking-intro p { margin: 0; color: var(--muted); font-size: .72rem; }
.ranking-tabs { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); }
.ranking-tabs button { min-height: 52px; padding: 10px; border: 0; border-right: 1px solid var(--line); cursor: pointer; color: var(--muted); background: rgba(9,9,10,.6); font-size: .7rem; font-weight: 800; }
.ranking-tabs button:last-child { border-right: 0; }
.ranking-tabs button[aria-selected="true"] { color: var(--ivory); background: linear-gradient(180deg, rgba(84,30,42,.78), rgba(35,18,24,.72)); box-shadow: inset 0 -2px var(--gold-bright); }
.ranking-category { min-height: 440px; }
.podium { align-items: stretch; }
.rank-card { height: 100%; display: flex; flex-direction: column; }
.rank-card:first-child { transform: translateY(-4px); box-shadow: 0 18px 34px rgba(0,0,0,.32); }
.rank-card:first-child .rank-number { width: 40px; height: 40px; font-size: 1.15rem; }
.rank-card img { aspect-ratio: 1; }
.ranking-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.ranking-actions > div { display: flex; gap: 8px; }

/* System */
.course { position: relative; height: 100%; display: flex; flex-direction: column; align-items: stretch; }
.course .price { display: grid; gap: 2px; }
.course .price small { color: var(--muted); font-family: var(--sans); font-size: .58rem; }
.course-includes { margin: 14px 0; padding: 13px 0; display: grid; gap: 6px; border-block: 1px solid var(--line); color: #d2c8ba; text-align: left; font-size: .68rem; list-style: none; }
.course-includes li::before { margin-right: 7px; content: "✓"; color: var(--success); }
.course-for { flex: 1; margin: 0 0 14px !important; text-align: left; line-height: 1.6; }
.course-for span { display: block; color: var(--gold-bright); font-size: .56rem; font-weight: 800; letter-spacing: .08em; }
.course .button,
.course .button-ghost { width: 100%; padding-inline: 8px; }
.recommend-badge { position: absolute; top: -10px; left: 50%; padding: 3px 12px; transform: translateX(-50%); color: #111; background: var(--gold-bright); font-size: .56rem; font-weight: 900; white-space: nowrap; }
.fee-table { table-layout: fixed; }
.system-cta p,
.guide-final-cta p { margin: 5px 0 0; color: var(--muted); font-size: .72rem; }
.system-cta .button { flex: 0 0 auto; }

/* Guide */
.guide-steps { position: relative; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.guide-steps::before { position: absolute; top: 50px; left: 8%; right: 8%; height: 1px; content: ""; background: linear-gradient(90deg, transparent, var(--gold), transparent); }
.guide-step { position: relative; padding: 18px 14px; display: flex; flex-direction: column; gap: 14px; }
.step-number { position: relative; z-index: 1; width: 48px; height: 48px; background: #171417; font-size: 1.05rem; }
.guide-step h2 { margin: 0; font-size: .9rem; }
.guide-step strong { display: block; margin-top: 8px; color: var(--gold-bright); font-size: .67rem; }
.guide-step p { margin: 5px 0 0; }
.location-card img { aspect-ratio: 16 / 10; object-fit: cover; }
.faq-question { min-height: 56px; }

/* Reserve */
.reserve-progress { margin: 0 0 22px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); list-style: none; }
.reserve-progress li { position: relative; min-height: 72px; padding: 10px; display: grid; grid-template-columns: 32px 1fr; grid-template-rows: auto auto; align-content: center; column-gap: 9px; border-right: 1px solid var(--line); color: #776f67; }
.reserve-progress li:last-child { border-right: 0; }
.reserve-progress li::after { position: absolute; left: 0; right: 100%; bottom: 0; height: 2px; content: ""; background: var(--gold-bright); transition: right .25s ease; }
.reserve-progress li[aria-current="step"] { color: var(--ivory); background: rgba(84,30,42,.26); }
.reserve-progress li[aria-current="step"]::after { right: 0; }
.reserve-progress li > span { grid-row: 1 / 3; width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-family: Georgia, serif; }
.reserve-progress strong { align-self: end; font-size: .63rem; letter-spacing: .12em; }
.reserve-progress small { font-size: .6rem; }
.field [aria-invalid="true"] { border-color: var(--danger); box-shadow: 0 0 0 1px rgba(212,129,130,.18); }
.field-error { color: var(--danger); font-size: .64rem; }
.summary-list div { align-items: start; }

/* Age gate */
.auth-card { width: min(620px, 100%); padding: clamp(30px, 5vw, 52px); backdrop-filter: blur(12px); }
.auth-card::before { width: 58px; height: 1px; margin: 0 auto 24px; display: block; content: ""; background: var(--gold); box-shadow: 0 0 18px rgba(215,189,130,.4); }
.auth-card img { width: 188px; height: auto; }
.auth-lead { max-width: 440px; margin-inline: auto; }
.auth-assurance { margin: 24px 0; padding: 16px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; border-block: 1px solid var(--line); list-style: none; text-align: left; }
.auth-assurance li { min-width: 0; padding: 8px; display: grid; grid-template-columns: 32px 1fr; gap: 8px; }
.auth-assurance li > span { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--gold-bright); font-family: Georgia, serif; font-size: .66rem; }
.auth-assurance strong,
.auth-assurance small { display: block; }
.auth-assurance strong { font-family: var(--serif); font-size: .72rem; }
.auth-assurance small { margin-top: 2px; color: var(--muted); font-size: .56rem; line-height: 1.55; }
.auth-actions { grid-template-columns: 1fr 1fr; }
.auth-actions .button,
.auth-actions .button-ghost { min-height: 52px; }
.auth-actions span { font-size: .58rem; letter-spacing: .15em; }
.auth-note { margin-bottom: 0; }

@media (max-width: 1120px) {
  .filter-toolbar { grid-template-columns: 1fr 1fr; }
  .quick-filter-field { grid-column: 1 / -1; grid-row: 2; }
  .guide-steps { grid-template-columns: 1fr; }
  .guide-steps::before { top: 32px; bottom: 32px; left: 43px; right: auto; width: 1px; height: auto; }
  .guide-step { flex-direction: row; padding: 18px; }
  .schedule-summary { grid-template-columns: 1fr auto; }
  .schedule-summary-actions { grid-column: 1 / -1; }
  .schedule-summary-actions > * { flex: 1; }
}

@media (max-width: 980px) {
  body:not(.auth-page) { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  .mobile-header { gap: 12px; }
  .mobile-open-chip { margin-left: auto; }
  .mobile-context-strip { min-height: 46px; padding: 8px 14px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 7px 15px; border-bottom: 1px solid var(--line); color: var(--muted); background: rgba(24,20,23,.94); font-size: .64rem; }
  .mobile-context-strip a { min-height: 30px; padding: 3px 10px; display: inline-flex; align-items: center; border: 1px solid var(--gold); color: var(--gold-bright); }
  .left-rail { padding-bottom: max(18px, env(safe-area-inset-bottom)); }
  .drawer-close { position: absolute; top: 12px; right: 12px; z-index: 2; min-width: 72px; min-height: 44px; padding: 6px 9px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--line); cursor: pointer; color: var(--gold-bright); background: rgba(9,9,10,.82); font-size: .58rem; font-weight: 800; letter-spacing: .08em; }
  .drawer-close span { font-size: 1rem; line-height: 1; }
  .page-hero-inner { align-items: flex-start; flex-direction: column; gap: 15px; }
  .page-hero-cta { margin: 0; }
  .dialog-backdrop { padding: 0; place-items: end center; }
  .dialog-panel.bottom-sheet { width: 100%; max-height: min(82vh, 720px); border-width: 1px 0 0; border-radius: 16px 16px 0 0; padding-bottom: env(safe-area-inset-bottom); }
  .sheet-handle { width: 42px; height: 4px; margin: 9px auto 0; display: block; border-radius: 8px; background: #655c55; }
}

@media (max-width: 700px) {
  .mobile-only { display: block; }
  .page-hero { min-height: 278px; padding: 16px 20px 28px; }
  .breadcrumb { margin-bottom: 12px; }
  .page-hero h1 { font-size: 2.45rem; }
  .page-hero h2 { font-size: 1.05rem; }
  .page-hero-cta { width: 100%; }
  .home-hero { min-height: 520px; }
  .home-hero-copy { max-width: 420px; padding-top: 38px; padding-bottom: 30px; }
  .home-hero h1 { max-width: 330px; font-size: clamp(2.35rem, 12vw, 3.35rem); }
  .hero-title-en { margin-top: .5em; font-size: .3em; }
  .hero-now { max-width: 100%; }
  .hero-actions > * { flex: 1 1 150px; }
  .news-list a { grid-template-columns: 76px 1fr; }
  .news-category { width: fit-content; }
  .news-list a > span:last-child { grid-column: 1 / -1; }
  .status-lead,
  .congestion,
  .next-actions,
  .system-cta,
  .guide-final-cta { flex-direction: column; align-items: stretch; }
  .congestion-meter { width: 100%; max-width: none; }
  .area-row { grid-template-columns: 1fr auto; }
  .area-row > span:not(.wait) { grid-column: 1 / -1; }
  .area-reserve { justify-self: end; }
  .quick-filter { display: grid; grid-template-columns: 1fr 1fr; }
  .cast-card { display: grid; grid-template-columns: minmax(112px, 42%) minmax(0, 1fr); }
  .cast-photo img { height: 100%; aspect-ratio: auto; }
  .cast-body { min-width: 0; }
  .cast-booking { margin-top: auto; }
  .schedule-summary { display: grid; grid-template-columns: 1fr; }
  .schedule-tools { align-items: stretch; flex-direction: column; }
  .schedule-tools > button { width: 100%; min-width: 0; }
  .schedule-tools p { text-align: right; }
  .schedule-facts { width: 100%; }
  .schedule-facts > div { flex: 1; }
  .schedule-summary-actions { display: grid; grid-template-columns: 1fr; }
  .schedule-card { min-height: 184px; }
  .ranking-intro { grid-template-columns: 1fr; gap: 8px; }
  .ranking-tabs button { min-width: 0; padding-inline: 4px; font-size: .62rem; }
  .ranking-category { min-height: 0; }
  .rank-card:first-child { transform: none; }
  .ranking-actions { align-items: stretch; flex-direction: column; }
  .ranking-actions > div { display: grid; grid-template-columns: 1fr; }
  .reserve-progress li { min-height: 64px; padding: 8px 4px; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 2px; text-align: center; }
  .reserve-progress li > span { width: 26px; height: 26px; }
  .auth-page { padding: 12px; }
  .auth-card { padding: 28px 20px; }
  .auth-assurance { grid-template-columns: 1fr; gap: 2px; }
  .auth-assurance li { grid-template-columns: 36px 1fr; }
  .auth-actions { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .mobile-header { gap: 8px; }
  .mobile-open-chip { font-size: .58rem; }
  .menu-button { width: 44px; }
  .home-hero-copy { padding-inline: 18px; padding-top: 34px; padding-bottom: 26px; }
  .status-strip > div { min-width: 0; padding-inline: 12px; }
  .status-strip strong { font-size: .82rem; }
  .cast-mini-grid { gap: 8px; }
  .cast-card { grid-template-columns: minmax(100px, 39%) minmax(0, 1fr); }
  .cast-body { padding: 12px 10px; }
  .cast-body h2 { font-size: .88rem; }
  .tag { font-size: .49rem; }
  .cast-booking { font-size: .57rem; }
  .date-tab { min-height: 62px; }
  .date-tab span { letter-spacing: -.02em; }
  .date-tab.is-today::before { font-size: .37rem; }
  .schedule-card { grid-template-columns: 72px minmax(0, 1fr); padding: 12px 9px; }
  .schedule-card img { width: 72px; height: 102px; }
  .schedule-booking { font-size: .56rem; }
  .ranking-tabs button { font-size: .56rem; }
  .fee-table th,
  .fee-table td { overflow-wrap: anywhere; font-size: .68rem; }
  .summary-list div { grid-template-columns: 1fr; gap: 3px; }
}

/* Stacked mobile chrome / right drawer / quick navigation / action dock */
.mobile-chrome,
.mobile-action-dock { display: none; }

@media (max-width: 980px) {
  html { scroll-padding-top: 190px; }
  body:not(.auth-page) { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }

  .mobile-chrome {
    position: sticky;
    top: 0;
    z-index: 50;
    width: 100%;
    display: block;
    overflow: hidden;
    border-bottom: 1px solid rgba(185, 154, 100, .34);
    background: #09090a;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .34);
  }
  .mobile-kicker {
    height: 22px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(185, 154, 100, .22);
    color: #b8aa99;
    background: linear-gradient(90deg, #080809, #241118 52%, #080809);
    font-size: .5rem;
    font-weight: 800;
    letter-spacing: .16em;
  }
  .mobile-header {
    position: static;
    top: auto;
    z-index: auto;
    width: 100%;
    height: 60px;
    min-height: 60px;
    padding: 6px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid var(--line);
    background: linear-gradient(90deg, rgba(9,9,10,.99), rgba(24,17,21,.99));
    backdrop-filter: none;
  }
  .mobile-brand { min-width: 0; display: flex; align-items: center; }
  .mobile-brand img { width: 132px; max-height: 44px; object-fit: contain; }
  .mobile-header-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 9px; }
  .mobile-open-chip { margin: 0; white-space: nowrap; }
  .menu-button {
    width: 48px;
    height: 48px;
    padding: 5px 6px 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    border-color: rgba(215, 189, 130, .44);
    background: rgba(0, 0, 0, .24);
  }
  .menu-bars { width: 22px; display: grid; gap: 4px; }
  .menu-bars i { width: 100%; height: 1px; display: block; background: var(--gold-bright); }
  .menu-caption { color: #c9b790; font-size: .43rem; line-height: 1; letter-spacing: .1em; }

  .mobile-service-strip {
    min-width: 0;
    height: 40px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid var(--line);
    color: var(--muted);
    background: #111013;
    font-size: .61rem;
  }
  .mobile-service-strip span { min-width: 0; white-space: nowrap; }
  .mobile-service-strip strong { color: var(--success); font-weight: 800; }
  .mobile-service-strip a { min-height: 32px; padding: 3px 0 3px 8px; display: inline-flex; align-items: center; flex: 0 0 auto; color: var(--gold-bright); font-size: .6rem; font-weight: 800; letter-spacing: .04em; }
  .mobile-service-strip a::after { margin-left: 5px; content: "→"; }

  .mobile-quick-nav {
    width: 100%;
    height: 68px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    overflow: hidden;
    background: linear-gradient(180deg, #171417, #0c0c0d);
  }
  .mobile-quick-nav a {
    position: relative;
    min-width: 0;
    min-height: 68px;
    padding: 5px 2px 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    overflow: hidden;
    border-right: 1px solid var(--line);
    color: #c5bbb0;
    text-align: center;
  }
  .mobile-quick-nav a:last-child { border-right: 0; }
  .mobile-quick-nav a[aria-current="page"] { color: var(--ivory); background: linear-gradient(180deg, rgba(84,30,42,.72), rgba(35,17,23,.82)); box-shadow: inset 0 -2px var(--gold-bright); }
  .mobile-quick-icon { width: 24px; height: 24px; display: block; overflow: hidden; border: 1px solid rgba(185,154,100,.34); border-radius: 50%; background: #080809; }
  .mobile-quick-icon img { width: 100%; height: 100%; aspect-ratio: 1; display: block; object-fit: cover; }
  .mobile-quick-label { min-width: 0; display: block; font-size: .67rem; font-weight: 800; line-height: 1.05; white-space: nowrap; }
  .mobile-quick-label small { margin-top: 2px; display: block; color: #8d8278; font-size: .4rem; font-weight: 700; letter-spacing: .04em; }
  .mobile-quick-nav a[aria-current="page"] small { color: var(--gold-bright); }

  .site-shell { width: 100%; max-width: none; margin: 0; }
  .page-column { border-right: 0; border-left: 0; }
  .mobile-context-strip { display: none; }
  .footer { width: 100%; margin-right: 0; margin-left: 0; }

  .left-rail {
    inset: 0 0 0 auto;
    width: min(310px, 78vw);
    height: 100dvh;
    min-height: 100dvh;
    padding-bottom: max(18px, env(safe-area-inset-bottom));
    overflow-y: auto;
    transform: translateX(105%);
  }
  .left-rail.is-open { transform: translateX(0); }
  .left-rail .brand { min-height: 118px; }
  .primary-nav a { min-height: 52px; }
  .primary-nav a[aria-current="page"] { border-left-color: var(--gold-bright); border-right: 2px solid var(--gold-bright); background: linear-gradient(90deg, rgba(84,30,42,.46), rgba(84,30,42,.72)); }
  .drawer-backdrop { background: rgba(0, 0, 0, .72); }

  .mobile-action-dock {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 55;
    height: calc(72px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid rgba(215, 189, 130, .44);
    background: rgba(8, 8, 9, .97);
    box-shadow: 0 -8px 24px rgba(0, 0, 0, .46);
  }
  .mobile-action-dock a {
    position: relative;
    min-width: 0;
    min-height: 72px;
    padding: 6px 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    border-right: 1px solid var(--line);
    color: #c9bfb3;
    text-align: center;
  }
  .mobile-action-dock a:last-child { border-right: 0; }
  .mobile-action-dock a:nth-child(2) { color: var(--ivory); background: linear-gradient(180deg, #692638, #35141e); }
  .mobile-action-dock a[aria-current="page"] { color: var(--gold-bright); box-shadow: inset 0 2px var(--gold-bright); }
  .mobile-action-dock a > span { width: 26px; height: 26px; display: block; overflow: hidden; border: 1px solid rgba(215,189,130,.42); border-radius: 50%; background: #080809; }
  .mobile-action-dock img { width: 100%; height: 100%; aspect-ratio: 1; display: block; object-fit: cover; }
  .mobile-action-dock strong { font-size: .68rem; line-height: 1.1; letter-spacing: .04em; white-space: nowrap; }
}

@media (max-width: 700px) {
  .home-hero { min-height: 480px; }
}

@media (max-width: 430px) {
  html { scroll-padding-top: 184px; }
  .mobile-kicker { height: 22px; padding-inline: 8px; font-size: .45rem; }
  .mobile-header { height: 58px; min-height: 58px; padding: 5px 8px; gap: 6px; }
  .mobile-brand img { width: 116px; }
  .mobile-header-actions { gap: 6px; }
  .mobile-open-chip { font-size: .54rem; }
  .menu-button { width: 46px; height: 46px; }
  .mobile-service-strip { height: 38px; padding-inline: 8px; font-size: .54rem; }
  .mobile-service-strip a { font-size: .53rem; }
  .mobile-quick-nav { height: 66px; }
  .mobile-quick-nav a { min-height: 66px; padding-inline: 1px; }
  .mobile-quick-icon { width: 20px; height: 20px; }
  .mobile-quick-label { font-size: .62rem; }
  .mobile-quick-label small { font-size: .36rem; letter-spacing: 0; }
  .mobile-action-dock strong { font-size: .65rem; }
}