:root {
  --bg: #111111;
  --well: #FFF6D8;
  --card: #FFFFFF;
  --soft: #F3E4B0;
  --title: #16140F;
  --text: #2A261C;
  --muted: #5C5648;
  --assist: #8A8370;
  --yellow: #F5C518;
  --rust: #C45A2A;
  --teal: #2A6B6B;
  --border: rgba(245,197,24,0.28);
  --shadow: 0 14px 34px rgba(0,0,0,0.28);
  --max: 1200px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; background: var(--bg); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif; font-size: 16px; line-height: 1.75; overflow-x: hidden; }
body.ui-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
a, button, input { -webkit-tap-highlight-color: transparent; }
button, input { font: inherit; }
button { cursor: pointer; }
img { display: block; max-width: 100%; height: auto; }
.site-width { width: min(calc(100% - 32px), var(--max)); margin: 0 auto; }
.skip-link { position: fixed; left: 16px; top: -64px; z-index: 9999; background: var(--yellow); color: var(--bg); padding: 8px 12px; }
.skip-link:focus { top: 8px; }
.site-header { position: fixed; inset: 0 0 auto; z-index: 1000; box-shadow: 0 8px 24px rgba(0,0,0,.24); }
.ticket-strip { height: 22px; background: var(--bg); color: var(--yellow); border-bottom: 1px solid rgba(245,197,24,.15); font-size: 12px; line-height: 22px; letter-spacing: .04em; }
.ticket-strip-inner { height: 22px; display: flex; align-items: center; justify-content: space-between; }
.text-button { min-height: 22px; padding: 0 6px; border: 0; background: transparent; color: var(--yellow); }
.marquee-bar { height: 72px; background: var(--bg); color: var(--yellow); }
.marquee-inner { height: 72px; display: grid; grid-template-columns: minmax(120px,1fr) auto minmax(120px,1fr); align-items: center; gap: 16px; }
.brand-mark { justify-self: start; display: inline-flex; align-items: center; min-height: 44px; max-width: 220px; color: var(--yellow); font-size: 24px; font-weight: 900; letter-spacing: .06em; }
.brand-mark img { max-height: 38px; width: auto; }
.ticket-window-button, .app-link { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--yellow); padding: 8px 18px; font-weight: 800; }
.ticket-window-button { justify-self: center; background: var(--yellow); color: var(--bg); }
.app-link { justify-self: end; background: var(--bg); color: var(--yellow); }
.session-bar { height: 44px; background: var(--yellow); color: var(--bg); }
.session-links { height: 44px; display: flex; align-items: center; gap: 8px; overflow: hidden; }
.session-links a { min-height: 32px; padding: 3px 12px; display: inline-flex; align-items: center; font-weight: 800; white-space: nowrap; }
.session-links a.is-current { background: var(--bg); color: var(--yellow); }
.site-main { padding: 162px 16px 72px; }
.page-shell { width: min(100%, var(--max)); margin: 0 auto; background: var(--well); box-shadow: var(--shadow); overflow: hidden; }
.page-shell > section, .page-shell > article, .page-shell > aside, .page-shell > header { padding-left: clamp(18px, 4vw, 48px); padding-right: clamp(18px, 4vw, 48px); }
.page-hero { padding-top: 36px; padding-bottom: 28px; display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,.75fr); gap: 28px; align-items: center; border-bottom: 1px solid rgba(17,17,17,.13); }
.home-hero { padding-top: 22px; }
.page-hero-copy h1, .section-heading h2, .content-card h2, .number-card h2, .faq-item h2, .policy-section h2 { color: var(--title); }
h1 { font-size: clamp(28px, 4vw, 32px); line-height: 1.2; margin: 8px 0 16px; }
h2 { font-size: clamp(20px, 2.4vw, 24px); line-height: 1.3; margin: 0 0 10px; }
h3 { font-size: 18px; line-height: 1.35; margin: 0 0 8px; }
p { margin: 0 0 14px; }
.eyebrow { margin: 0; color: var(--rust); font-size: 13px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.lead { max-width: 760px; color: var(--muted); font-size: 17px; }
.media-frame { margin: 0; overflow: hidden; background: var(--bg); min-height: 180px; max-height: 300px; display: flex; align-items: center; justify-content: center; }
.media-frame img { width: 100%; max-height: 300px; object-fit: cover; }
.media-placeholder { color: var(--yellow); border: 1px solid rgba(245,197,24,.32); min-height: 190px; }
.media-placeholder span { font-size: clamp(20px, 4vw, 34px); font-weight: 900; letter-spacing: .08em; padding: 24px; text-align: center; }
.home-cover { grid-column: 1 / -1; max-height: 300px; }
.home-cover img { max-height: 300px; object-fit: cover; }
.hero-actions, .section-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.btn-primary, .btn-secondary, .text-link { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 8px 16px; border: 1px solid var(--bg); font-weight: 900; }
.btn-primary { background: var(--yellow); color: var(--bg); }
.btn-secondary { background: var(--bg); color: var(--yellow); }
.text-link { padding: 8px 0; border-width: 0 0 2px; color: var(--teal); }
.section-block { padding-top: 36px; padding-bottom: 36px; border-bottom: 1px solid rgba(17,17,17,.12); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.section-heading p { max-width: 760px; color: var(--muted); margin: 0; }
.ticket-grid, .triple-grid, .genre-grid, .card-grid, .mini-grid { display: grid; gap: 16px; }
.ticket-grid { grid-template-columns: repeat(4, 1fr); }
.triple-grid { grid-template-columns: repeat(3, 1fr); }
.genre-grid { grid-template-columns: repeat(3, 1fr); }
.card-grid { grid-template-columns: repeat(2, 1fr); }
.mini-grid { grid-template-columns: repeat(4,1fr); }
.ticket-card, .content-card, .genre-card, .number-card, .step-card, .policy-section, .faq-item { background: var(--card); color: var(--text); border: 1px solid rgba(17,17,17,.12); box-shadow: 0 5px 18px rgba(0,0,0,.07); }
.ticket-card { position: relative; padding: 18px; border-left: 6px solid var(--yellow); min-height: 170px; }
.ticket-card:nth-child(3n+2) { border-left-color: var(--rust); }
.ticket-card:nth-child(3n+3) { border-left-color: var(--teal); }
.ticket-card::before, .ticket-card::after { content:""; position:absolute; left:-8px; width:12px; height:12px; background:var(--well); border-radius:50%; }
.ticket-card::before { top: 18px; }
.ticket-card::after { bottom: 18px; }
.ticket-card h3 { color: var(--title); }
.ticket-card p, .content-card p, .genre-card p, .number-card p, .step-card p { color: var(--muted); }
.content-card, .genre-card, .number-card, .step-card, .policy-section { padding: 22px; }
.content-card .media-frame { margin: -22px -22px 18px; min-height: 150px; }
.number-list { display: grid; gap: 12px; }
.number-row { display: grid; grid-template-columns: 64px 1fr; gap: 16px; align-items: start; padding: 18px 0; border-top: 1px solid rgba(17,17,17,.15); }
.number-row:first-child { border-top: 0; }
.number { font-size: 34px; line-height: 1; font-weight: 900; color: var(--yellow); background: var(--bg); padding: 10px 7px; text-align: center; }
.number-row h3 { color: var(--title); }
.directory-list { display: grid; gap: 10px; }
.directory-item { display: grid; grid-template-columns: minmax(120px,.4fr) 1fr auto; gap: 16px; align-items: center; padding: 16px 0; border-top: 1px solid rgba(17,17,17,.14); }
.directory-item:first-child { border-top: 0; }
.directory-item strong { color: var(--title); }
.directory-item span { color: var(--muted); }
.directory-item a { color: var(--teal); font-weight: 800; min-height: 44px; display: inline-flex; align-items: center; }
.timeline { position: relative; padding-left: 26px; }
.timeline::before { content:""; position:absolute; left:7px; top:8px; bottom:8px; width:2px; background:var(--bg); opacity:.22; }
.timeline-item { position:relative; padding: 0 0 24px 22px; }
.timeline-item::before { content:""; position:absolute; left:-25px; top:7px; width:12px; height:12px; background:var(--yellow); border:3px solid var(--bg); border-radius:50%; }
.status { display:inline-flex; align-items:center; min-height:30px; padding:2px 9px; background:var(--bg); color:var(--yellow); font-size:13px; font-weight:900; margin-bottom:8px; }
.note-box { background: var(--soft); border-left: 4px solid var(--rust); padding: 18px 20px; margin: 20px 0; }
.editor-note { background: #fff; border: 1px solid rgba(196,90,42,.35); padding: 18px; }
.editor-note strong { color: var(--rust); }
.policy-stack, .faq-list, .steps { display: grid; gap: 16px; }
.policy-section p:last-child, .faq-item p:last-child { margin-bottom: 0; }
.index-two-col { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(260px,.9fr); gap: 24px; align-items: start; }
.dark-panel { background: var(--bg); color: #E8D9A0; padding: 22px; }
.dark-panel h2, .dark-panel h3 { color: var(--yellow); }
.dark-panel p { color: #E8D9A0; }
.app-product { display:grid; grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr); gap:24px; align-items:center; }
.app-icon { width:92px; height:92px; background:var(--bg); border:1px solid var(--yellow); display:flex; align-items:center; justify-content:center; margin-bottom:16px; overflow:hidden; }
.app-icon img { width:100%; height:100%; object-fit:cover; }
.small-print { color: var(--assist); font-size: 14px; }
.site-footer { background: var(--bg); color: var(--yellow); padding: 44px 16px 80px; border-top: 1px solid rgba(245,197,24,.22); }
.footer-grid { display: grid; grid-template-columns: 1.35fr repeat(4, 1fr); gap: 24px; }
.footer-brand { display: flex; gap: 12px; align-items: flex-start; }
.footer-brand span { display:block; color:#E8D9A0; font-size:12px; margin-top:4px; letter-spacing:.08em; }
.footer-logo { display:inline-flex; min-height:44px; align-items:center; }
.footer-logo img { max-height:34px; width:auto; }
.footer-grid nav { display:flex; flex-direction:column; gap:8px; }
.footer-grid h2 { color: var(--yellow); font-size:16px; margin:0 0 4px; }
.footer-grid a { color:#E8D9A0; min-height:32px; display:flex; align-items:center; }
.footer-note { border-top: 1px solid rgba(245,197,24,.18); margin-top: 32px; padding-top: 20px; color:#E8D9A0; font-size:14px; }
.ui-overlay { position: fixed; inset: 0; z-index: 1500; background: rgba(0,0,0,.64); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .2s ease, visibility .2s ease; }
.ui-overlay.is-active { opacity: 1; visibility: visible; pointer-events: auto; }
.ticket-window { position: fixed; top: 0; right: 0; bottom: 0; width: 380px; max-width: 88vw; z-index: 1700; background: var(--well); color: var(--text); box-shadow: -16px 0 40px rgba(0,0,0,.4); transform: translateX(104%); visibility: hidden; pointer-events: none; transition: transform .26s ease, visibility .26s ease; overflow-y: auto; }
.ticket-window.is-open { transform: translateX(0); visibility: visible; pointer-events: auto; }
.ticket-window-head { position: sticky; top:0; z-index:2; background:var(--bg); color:var(--yellow); display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px; border-bottom:1px solid rgba(245,197,24,.2); }
.ticket-window-brand { display:flex; align-items:center; gap:10px; }
.ticket-window-brand img { max-height:30px; width:auto; }
.ticket-window-brand span { display:block; font-size:11px; color:#E8D9A0; }
.close-button { min-height:44px; min-width:56px; border:1px solid var(--yellow); background:var(--bg); color:var(--yellow); font-weight:900; }
.ticket-window-groups { padding: 8px 18px 32px; }
.ticket-window-groups section { padding: 16px 0; border-bottom:1px solid rgba(17,17,17,.13); }
.ticket-window-groups h2 { font-size:15px; color:var(--rust); margin:0 0 8px; }
.ticket-window-groups a { display:block; padding:10px 0; min-height:56px; border-top:1px dashed rgba(17,17,17,.1); }
.ticket-window-groups a:first-of-type { border-top:0; }
.ticket-window-groups b { display:block; color:var(--title); }
.ticket-window-groups span { display:block; color:var(--muted); font-size:13px; }
.search-layer { position: fixed; left: 50%; top: 94px; z-index: 1650; width: min(760px, calc(100% - 32px)); transform: translate(-50%, -18px); opacity: 0; visibility: hidden; pointer-events: none; transition: .22s ease; }
.search-layer.is-open { opacity:1; visibility:visible; pointer-events:auto; transform:translate(-50%,0); }
.search-card { position:relative; background:var(--well); color:var(--text); border:2px solid var(--yellow); box-shadow:var(--shadow); padding:22px; }
.search-card::before, .search-card::after { content:""; position:absolute; top:50%; width:18px; height:34px; background:rgba(0,0,0,.68); border-radius:50%; transform:translateY(-50%); }
.search-card::before { left:-11px; } .search-card::after { right:-11px; }
.search-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.search-head h2 { margin:4px 0 12px; color:var(--title); }
.search-look { display:block; margin:14px 0; }
.search-look span { display:block; font-size:13px; font-weight:900; color:var(--muted); margin-bottom:6px; }
.search-look input { width:100%; min-height:46px; border:1px solid rgba(17,17,17,.3); background:#fff; color:var(--text); padding:8px 12px; }
.search-note { color:var(--muted); }
.preset-links { display:flex; flex-wrap:wrap; gap:8px; }
.preset-links a { min-height:44px; display:inline-flex; align-items:center; padding:7px 12px; background:var(--bg); color:var(--yellow); font-weight:800; }
.mobile-bottom-nav { display:none; }
:focus-visible { outline:3px solid var(--teal); outline-offset:3px; }
.btn-primary:hover, .session-links a:hover, .mobile-bottom-nav a:hover { filter:brightness(.96); }
.btn-secondary:hover, .preset-links a:hover { background:#272727; }
@media (max-width: 900px) {
  .ticket-grid, .mini-grid { grid-template-columns: repeat(2, 1fr); }
  .triple-grid, .genre-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: repeat(2,1fr); }
  .footer-brand { grid-column:1 / -1; }
  .page-hero, .index-two-col, .app-product { grid-template-columns: 1fr; }
  .page-hero-media { max-height: 280px; }
}
@media (max-width: 700px) {
  .site-width { width: min(calc(100% - 32px), var(--max)); }
  .session-bar { display:none; }
  .site-main { padding: 118px 0 calc(86px + env(safe-area-inset-bottom)); }
  .marquee-inner { grid-template-columns: minmax(0,1fr) auto auto; gap:8px; }
  .brand-mark { min-width:0; max-width:none; font-size:20px; overflow:hidden; }
  .brand-mark img { max-width:120px; max-height:34px; }
  .ticket-window-button, .app-link { min-width:68px; min-height:44px; padding:7px 9px; font-size:14px; }
  .page-shell { width:100%; box-shadow:none; }
  .page-hero { padding-top:26px; }
  .ticket-grid, .card-grid, .mini-grid { grid-template-columns: 1fr; }
  .directory-item { grid-template-columns:1fr; gap:4px; }
  .number-row { grid-template-columns:52px 1fr; }
  .number { font-size:26px; }
  .search-layer { inset:0; width:100%; transform:none; background:var(--bg); padding:calc(22px + env(safe-area-inset-top)) 16px calc(68px + env(safe-area-inset-bottom)); overflow:auto; }
  .search-layer.is-open { transform:none; }
  .search-card { min-height:100%; background:var(--bg); color:var(--yellow); border:0; box-shadow:none; padding:12px 0; }
  .search-card::before, .search-card::after { display:none; }
  .search-head h2, .search-card .eyebrow { color:var(--yellow); }
  .search-note, .search-look span { color:#E8D9A0; }
  .search-look input { background:#1d1d1d; border-color:rgba(245,197,24,.4); color:#E8D9A0; }
  .ticket-window { width:88%; max-width:88%; }
  .mobile-bottom-nav { position:fixed; left:0; right:0; bottom:0; z-index:1200; display:grid; grid-template-columns:repeat(5,1fr); min-height:50px; padding-bottom:env(safe-area-inset-bottom); background:var(--bg); border-top:1px solid rgba(245,197,24,.28); }
  .mobile-bottom-nav a { min-height:50px; display:flex; align-items:center; justify-content:center; color:#E8D9A0; font-size:13px; font-weight:800; }
  .mobile-bottom-nav a.is-current { background:var(--yellow); color:var(--bg); }
  .site-footer { padding-bottom:calc(88px + env(safe-area-inset-bottom)); }
  .footer-grid { grid-template-columns:1fr; }
}
@media (max-width: 430px) {
  .ticket-strip { font-size:11px; }
  .marquee-inner { gap:6px; }
  .brand-mark { font-size:18px; }
  .brand-mark img { max-width:96px; }
  .ticket-window-button, .app-link { min-width:62px; padding:6px 7px; font-size:13px; }
}