:root {
  --bg: #e9dccb; --bg-2: #dfd0bc; --paper: #f4ece2; --paper-2: #fbf6ee;
  --ink: #1a1613; --ink-2: #5d534a; --accent: #ff0000; --accent-2: #c40000; --accent-ink: #fff;
  --stamp: #c8102e; --carbon: #3c3835;
  --line: rgba(26,22,19,0.3); --line-2: rgba(26,22,19,0.12);
  --font-display: 'Le Murmure', 'Akzidenz', 'Oswald', 'Arial Narrow', Impact, sans-serif;
  --font-cn: 'Akzidenz', 'Oswald', 'Arial Narrow', Impact, sans-serif;
  --font-type: 'Courier Prime', 'Courier New', ui-monospace, Menlo, monospace;
  --top-bg: #0b0a09; --top-ink: #f4ece2;
  --quick-bg: #fbf6ee; --quick-line: #1a1613;
  --field-bg: #fffaf3; --field-ink: #1a1613; --field-line: rgba(26,22,19,0.4);
  --chip-bg: transparent; --chip-ink: #1a1613; --chip-on-bg: #1a1613; --chip-on-ink: #f4ece2;
  --btn-o-ink: #1a1613; --btn-o-line: #1a1613;
  --card-bg: #f6efe4; --card-ink: #1a1613; --dlg-bg: #f4ece2; --dlg-ink: #1a1613;
  --map-bg: #f7f0e5; --map-room: rgba(26,22,19,0.035); --map-line: #3c3835; --map-fix: rgba(60,56,53,0.14);
  --map-table: #fffdf8; --map-table-line: #3c3835; --map-table-ink: #1a1613;
  --map-busy: rgba(60,56,53,0.1); --map-busy-line: rgba(60,56,53,0.55); --map-on: #ff0000; --map-on-ink: #fff;
  --smoke-rgb: 255,252,246; --intro-ms: 3000;
  --shadow: 0 1px 2px rgba(40,30,20,0.18), 0 18px 34px -12px rgba(40,30,20,0.45);
  --shadow-paper: 0 1px 1px rgba(40,30,20,0.16), 3px 12px 20px -10px rgba(40,30,20,0.32), -8px 18px 24px -18px rgba(40,30,20,0.24);
  --radius: 2px;
}

body { background: #e9dccb; }
body::before { content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; background: image-set(url("img/paper-smoke.webp") type("image/webp"), url("img/paper-smoke.jpg") type("image/jpeg")) center / cover no-repeat, image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / cover no-repeat; background-blend-mode: soft-light, normal; }
main, footer, .hp-tick { position: relative; z-index: 1; }
::selection { background: var(--accent); color: #fff; }
h1, h2 { font-family: var(--font-display); font-weight: 400; letter-spacing: 0.012em; }
h2 { font-size: clamp(38px, 6vw, 84px); line-height: 0.95; }
h3, h4, .hp-card-num, .hp-addr, .hp-cab-bal, .hp-ref-code b, .hp-stepper b, .hp-sheet-t, .hpn-list a, .hpn-list b, .hp-auth-t, .hp-cab-sec h2, .hp-teaser h2 { font-family: var(--font-cn); letter-spacing: 0.01em; }
.hp-cab-hero h1, .hp-cab-auth h1, .hp-done h2, .hp-bk-title { font-family: var(--font-display); }
select.hp-field option { color: #1a1613; background: #fffaf3; }
.hp-eyebrow { font-family: var(--font-type); font-weight: 700; font-size: 13.5px; letter-spacing: 0.2em; color: var(--stamp); }
.hp-eyebrow::before { content: "// "; opacity: 0.6; }
.hp-lede { color: var(--ink); }
.hp-sec-h .hp-lede { color: var(--ink-2); }
.hp-sec-h.center { margin-left: auto; margin-right: auto; text-align: center; }

.splash, .hp-splash { position: relative; z-index: 0; color: #fff; padding: 0 0.12em; }
.splash::before, .hp-splash::before { content: ""; position: absolute; inset: -0.06em -0.1em -0.02em; z-index: -1; background: image-set(url("img/splash-2.webp") type("image/webp"), url("img/splash-2.png") type("image/png")) center / 100% 100% no-repeat; }

.hp-tarot-sym svg, .hp-pass svg { filter: url(#hp-ink); }
.hp-tarot-sym .k, .hp-pass .k { stroke-width: 2.6; }
.hp-tarot-sym .f, .hp-pass .f { stroke-width: 1.9; }
.hp-tarot-sym .h, .hp-pass .h { stroke-width: 1.4; opacity: 0.8; }
.hp-tarot-sym svg, .hp-pass svg { opacity: 0.94; }

.hp-top { background: #0b0a09; color: var(--paper); border-bottom: 1px solid rgba(244,236,226,0.1); backdrop-filter: none; transition: box-shadow 0.3s ease; }
.hp-top.hpn-off { box-shadow: none; }
.hp-top.scrolled { box-shadow: 0 6px 30px rgba(0,0,0,0.35); }
.hp-brand b { font-size: 17px; letter-spacing: 0.1em; }
.hp-brand small { font-size: 10px; letter-spacing: 0.2em; color: #bbb5ad; }
@media (max-width: 30rem) {
  .hp-brand span { display: flex; flex-direction: column; line-height: 1.05; }
  .hp-brand small { margin-left: 0; }
}
.hp-secnav { background: #0b0a09; color: var(--paper); border-bottom: 1px solid rgba(244,236,226,0.1); backdrop-filter: none; }
.hp-secnav a { position: relative; border-bottom: 0; color: #bbb5ad; font-family: var(--font-type); font-weight: 700; font-size: 12px; letter-spacing: 0.18em; }
.hp-secnav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 10px; height: 2px; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform 0.35s cubic-bezier(0.2, 1, 0.3, 1); }
.hp-secnav a:hover, .hp-secnav a.on { color: var(--paper); }
.hp-secnav a:hover::after, .hp-secnav a:focus-visible::after, .hp-secnav a.on::after { transform: scaleX(1); }
.hp-venue-pick { display: none !important; }
.hp-top .hp-icon-btn { color: var(--paper); }
.hp-top .hp-icon-btn:hover { border-color: transparent; }
.hp-bk .hp-icon-btn, .hp-auth-dlg .hp-icon-btn, .hp-chap .hp-icon-btn, .hp-sheet .hp-icon-btn { color: var(--ink); border-color: var(--line-2); }
.hp-bk .hp-icon-btn:hover, .hp-auth-dlg .hp-icon-btn:hover, .hp-chap .hp-icon-btn:hover, .hp-sheet .hp-icon-btn:hover { border-color: var(--ink); background: rgba(26,22,19,0.06); }
.hp-account { width: 44px; padding: 0; }
.hp-account.in svg { color: #ff4a3a; }
:root {
  --hpn-paper: var(--paper-2); --hpn-ink: var(--ink); --hpn-muted: var(--ink-2);
  --hpn-line: var(--line-2); --hpn-accent: var(--accent); --hpn-font: var(--font-cn);
}
.hpn-panel { background: var(--paper-2) image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / 900px repeat; }

.hp-foot-links a { position: relative; }
.hp-foot-links a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 1.5px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform 0.3s cubic-bezier(0.2, 1, 0.3, 1); }
.hp-foot-links a:hover { text-decoration: none; }
.hp-foot-links a:hover::after { transform: scaleX(1); }

.hp-secnav a, .hp-foot-links a, .hp-btn, .hp-lnk, .hp-rev .go { will-change: transform; }

.hp-hero { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: calc(var(--hpn-bars-h, calc(var(--top-h) + var(--secnav-h))) + 36px) 0 48px; }
.hp-hero-grid { display: grid; gap: 40px; align-items: center; }
@media (min-width: 900px) { .hp-hero-grid { grid-template-columns: 1fr 1fr; gap: 40px; } }
.hp-stamp-line { display: inline-block; margin: 0 0 34px; padding: 6px 12px 5px 16px; border: 2px solid var(--stamp); color: var(--stamp); font-family: var(--font-type); font-size: 15px; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; transform: rotate(-2.2deg); filter: url(#hp-worn); mix-blend-mode: multiply; opacity: 0.9; }
.hp-stamp-line sup { font-size: 0.9em; line-height: 0; }
.hp-h1 { font-size: clamp(58px, 11vw, 160px); line-height: 0.88; margin: 0 0 20px; }
.hp-h1 .w { display: inline-block; }
.hp-hero-sub { max-width: 40ch; font-size: clamp(17px, 1.8vw, 21px); margin: 0 0 10px; }
.hp-hours { margin: 0 0 26px; font-size: clamp(16px, 1.5vw, 18px); color: var(--ink); }
.hp-smoke { z-index: 0; opacity: 0.8; }
.hp-hero-in { z-index: 1; }

.hp-board { position: relative; width: min(100%, 560px); aspect-ratio: 1 / 1; margin: 20px auto 0; }
@media (min-width: 900px) { .hp-board { width: 118%; max-width: none; aspect-ratio: 1 / 0.92; margin: 0; } }
.hp-sheet-doc { position: absolute; left: 0; top: 6%; width: 72%; z-index: 1; padding: 22px 22px 46px; background: var(--paper-2) image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / 700px repeat; box-shadow: var(--shadow-paper); transform: rotate(-2deg); font-family: var(--font-type); font-size: 12.5px; line-height: 1.7; cursor: pointer; transition: transform 0.35s cubic-bezier(0.2, 1, 0.3, 1); }
.hp-sheet-doc.front { z-index: 6; transform: rotate(-1deg) translate(4%, -3%); }
.hp-sheet-doc:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.hp-sheet-doc p { margin: 0 0 8px; }
.hp-doc-head { display: flex; justify-content: space-between; gap: 10px; font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-2); border-bottom: 1px solid var(--line); padding-bottom: 8px; margin-bottom: 12px; }
.hp-redact { background: var(--ink); color: transparent; box-shadow: 0 0 0 1.5px var(--ink); border-radius: 1px; transition: background-color 0.45s ease, color 0.45s ease, box-shadow 0.45s ease; }
.open .hp-redact { background: rgba(255,0,0,0.13); color: var(--ink); box-shadow: 0 0 0 1.5px rgba(255,0,0,0.13); }
.hp-doc-hint { font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-2); margin: 12px 0 0 !important; }
.open .hp-doc-hint { opacity: 0.4; }
.hp-doc-stamp { position: absolute; right: 14px; bottom: 12px; font-family: var(--font-type); font-weight: 700; font-size: 13px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--stamp); border: 2px solid var(--stamp); padding: 6px 10px 5px 14px; transform: rotate(-9deg) scale(1.3); opacity: 0; filter: url(#hp-worn); mix-blend-mode: multiply; transition: opacity 0.35s ease, transform 0.45s cubic-bezier(0.2, 1.4, 0.4, 1); }
.open .hp-doc-stamp { opacity: 0.9; transform: rotate(-12deg) scale(1); }
.hp-photo { position: absolute; margin: 0; padding: 7px 7px 24px; background: linear-gradient(160deg, #fdf9f2, #f3ebdf); box-shadow: var(--shadow-paper); }
.hp-photo img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: sepia(0.3) contrast(1.06); }
.hp-photo figcaption { position: absolute; left: 9px; bottom: 6px; font-family: var(--font-type); font-size: 9.5px; letter-spacing: 0.18em; color: var(--ink-2); }
.hp-photo.p1 { right: -4%; top: 0; width: 58%; transform: rotate(4deg); z-index: 3; }
.hp-photo.p2 { right: 8%; bottom: 6%; width: 52%; transform: rotate(-6deg); z-index: 2; }
.hp-photo.p3 { left: 12%; bottom: -2%; width: 46%; transform: rotate(2.5deg); z-index: 4; }
.hp-board .hp-photo:hover { z-index: 9; }
.hp-clip { position: absolute; left: 26px; top: -18px; width: 22px; height: 56px; z-index: 3; transform: rotate(9deg); filter: drop-shadow(1px 2px 1px rgba(40,30,20,0.35)); }

.intro .hp-h1 .w, .intro .hp-hero-sub, .intro .hp-hours, .intro .hp-cta, .intro .hp-board, .intro .hp-stamp-line, .intro .hp-tick { opacity: 0; }
.intro-go .hp-stamp-line { animation: stamp 0.5s cubic-bezier(0.2, 1.4, 0.4, 1) forwards 1.5s; }
.intro-go .hp-h1 .w { animation: stamp 0.5s cubic-bezier(0.2, 1.4, 0.4, 1) forwards; }
.intro-go .hp-h1 .w:nth-child(1) { animation-delay: 1.65s; } .intro-go .hp-h1 .w:nth-child(2) { animation-delay: 1.8s; } .intro-go .hp-h1 .w:nth-child(3) { animation-delay: 1.95s; } .intro-go .hp-h1 .w:nth-child(4) { animation-delay: 2.1s; }
.intro-go .hp-hero-sub { animation: rise 0.6s ease forwards 2.25s; }
.intro-go .hp-hours { animation: rise 0.6s ease forwards 2.35s; }
.intro-go .hp-cta { animation: rise 0.6s ease forwards 2.45s; }
.intro-go .hp-board { animation: rise 0.7s ease forwards 2s; }
.intro-go .hp-tick { animation: rise 0.6s ease forwards 2.6s; }
@keyframes stamp { from { opacity: 0; transform: scale(1.35) rotate(-2deg); } 60% { opacity: 1; } to { opacity: 1; transform: none; } }
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.intro-done .hp-stamp-line { transform: rotate(-2.2deg); }

.hp-revsec { padding-top: clamp(70px, 10vw, 130px); }
.hp-revs { grid-template-columns: 1fr; gap: 0; border-top: 1px solid var(--line-2); border-bottom: 1px solid var(--line-2); }
@media (min-width: 720px) { .hp-revs { grid-template-columns: repeat(3, 1fr); } }
.hp-rev { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 36px 20px 34px; text-align: center; background: none; border: 0; border-radius: 0; box-shadow: none; transform: none; }
.hp-rev + .hp-rev { border-top: 1px solid var(--line-2); }
@media (min-width: 720px) { .hp-rev + .hp-rev { border-top: 0; border-left: 1px solid var(--line-2); } }
.hp-rev:hover { background: rgba(255,250,243,0.5); transform: none; box-shadow: none; }
.hp-rev .plat { font-family: var(--font-type); font-weight: 700; font-size: 13px; letter-spacing: 0.26em; color: var(--ink); }
.hp-rev .score { font-family: var(--font-display); font-size: 76px; line-height: 0.95; color: var(--ink); }
.hp-rev .score i { font-family: var(--font-cn); font-size: 22px; color: var(--ink-2); }
.hp-rev .stars { color: var(--stamp); font-size: 12px; letter-spacing: 7px; padding-left: 7px; }
.hp-rev .note { max-width: 26ch; font-size: 14.5px; color: var(--ink-2); }
.hp-rev .go { margin-top: 8px; font-family: var(--font-type); font-weight: 700; font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; text-decoration: none; color: var(--ink); border-bottom: 1px solid var(--stamp); padding-bottom: 3px; }
.hp-quote-hero { max-width: 62ch; margin: 56px auto 0; text-align: center; }
.hp-quote-hero p { margin: 0; font-family: var(--font-display); font-size: clamp(26px, 2.9vw, 40px); line-height: 1.12; letter-spacing: 0.01em; }
.hp-quote-hero p::before { content: "« "; color: var(--stamp); }
.hp-quote-hero p::after { content: " »"; color: var(--stamp); }
.hp-quote-hero footer { margin-top: 18px; font-family: var(--font-type); font-weight: 700; font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-2); }
.hp-quotes { display: grid; gap: 0; margin-top: 46px; border-top: 1px solid var(--line-2); }
@media (min-width: 720px) { .hp-quotes { grid-template-columns: 1fr 1fr; } }
.hp-quotes blockquote { margin: 0; padding: 26px 30px 24px; font-size: 16px; line-height: 1.55; color: var(--ink); }
.hp-quotes blockquote + blockquote { border-top: 1px solid var(--line-2); }
@media (min-width: 720px) { .hp-quotes blockquote + blockquote { border-top: 0; border-left: 1px solid var(--line-2); } }
.hp-quotes footer { margin-top: 10px; font-family: var(--font-type); font-weight: 700; font-size: 11.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-2); }

.hp-about { padding-bottom: 0; }
.hp-about-grid { display: grid; gap: 40px; }
@media (min-width: 900px) { .hp-about-grid { grid-template-columns: 1.05fr 0.95fr; gap: 64px; align-items: start; } }
.hp-protocol .hp-lede { font-size: clamp(18px, 2vw, 22px); }
.hp-logo-cap { float: left; width: 54px; height: 54px; margin: 6px 16px 4px 0; }
.hp-pull { clear: both; margin: 26px 0; padding-left: 20px; border-left: 4px solid var(--accent); font-family: var(--font-display); font-size: clamp(30px, 3.6vw, 48px); line-height: 1; }
.hp-spravka { margin: 26px 0 0; font-family: var(--font-type); font-weight: 700; font-size: 13.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink); }
.hp-spravka div { display: flex; align-items: baseline; gap: 10px; padding: 9px 0; border-bottom: 1px dashed var(--line); }
.hp-spravka dt { flex: 1; display: flex; gap: 10px; align-items: baseline; color: var(--ink); }
.hp-spravka dt::after { content: ""; flex: 1; border-bottom: 2px dotted var(--line); transform: translateY(-4px); min-width: 24px; }
.hp-spravka dd { margin: 0; color: var(--stamp); text-align: right; max-width: 60%; }
.hp-spravka.dark { --line: rgba(244,236,226,0.35); margin: 0 0 22px; color: var(--paper); }
.hp-spravka.dark dt { color: var(--paper); }
.hp-spravka.dark dd { color: #ff4a3a; font-family: var(--font-display); font-weight: 400; font-size: 28px; letter-spacing: 0.02em; text-transform: none; line-height: 1; }
.hp-sign { position: relative; margin: 0; padding: 30px 30px 22px; background: var(--paper-2) image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / 700px repeat; box-shadow: var(--shadow-paper); transform: rotate(1.2deg); overflow: hidden; }
.hp-sign-img { display: block; width: 100%; height: auto; filter: drop-shadow(0 6px 10px rgba(40,30,20,0.25)); }
.hp-sign figcaption { margin-top: 16px; font-family: var(--font-type); font-weight: 700; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-2); line-height: 1.5; }
.hp-lens { position: absolute; left: -200px; top: -200px; width: 168px; height: 168px; border-radius: 50%; border: 3px solid var(--ink); box-shadow: 0 10px 30px rgba(40,30,20,0.35), inset 0 0 0 4px rgba(255,255,255,0.5); background: var(--paper-2) image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / 700px repeat; overflow: hidden; opacity: 0; transform: translate(-50%, -50%); transition: opacity 0.2s ease; z-index: 3; }
.hp-lens svg { position: absolute; left: 0; top: 0; max-width: none; }
.hp-lens .mark path { stroke-dashoffset: 0 !important; animation: none !important; }
.hp-lens .guides, .hp-lens .dims { opacity: 1 !important; }
.hp-sign:hover .hp-lens { opacity: 1; }
.hp-kinetic-wrap { position: relative; margin-top: clamp(40px, 6vw, 80px); height: clamp(250px, calc(30vw + 100px), 460px); padding: 50px 0; overflow: hidden; background: #12100e; }
.hp-kinetic { display: block; width: 100%; height: 100%; }
.hp-kinetic-fallback { position: absolute; inset: 0; margin: 0; display: flex; align-items: center; justify-content: center; text-align: center; color: var(--paper); font-family: var(--font-display); font-size: clamp(34px, 7vw, 96px); text-transform: uppercase; line-height: 1; padding: 0 20px; }
.js .hp-kinetic-fallback { display: none; }

.hp-story { background: transparent; overflow: hidden; }
.hp-story .hp-sec-h { margin-bottom: 8px; }
.hp-tarot-wrap { overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; cursor: grab; -webkit-overflow-scrolling: touch; }
.hp-tarot-wrap::-webkit-scrollbar { display: none; }
.hp-tarot-wrap.drag { cursor: grabbing; scroll-snap-type: none; }
.hp-tarot { display: flex; gap: 22px; width: max-content; min-width: 100%; justify-content: center; padding: 36px 24px 44px; }
.hp-tarot-card { flex: 0 0 clamp(250px, 23vw, 320px); aspect-ratio: 7 / 12; scroll-snap-align: center; perspective: 1400px; cursor: pointer; }
.hp-tarot-card:focus-visible { outline: 3px solid var(--accent); outline-offset: 6px; }
@media (max-width: 719px) { .hp-tarot-card { flex-basis: 62vw; } .hp-tarot { gap: 14px; } }
.hp-tarot-in { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transition: transform 0.9s cubic-bezier(0.2, 0.8, 0.2, 1); }
.js .hp-tarot-card:not(.up) .hp-tarot-in, .hp-tarot-card.flip .hp-tarot-in { transform: rotateY(180deg); }
.hp-tarot-card.up:not(.flip):hover .hp-tarot-in, .hp-tarot-card.up:not(.flip):focus-visible .hp-tarot-in { transform: translateY(-10px) rotateZ(-1.6deg); transition-duration: 0.35s; }
.hp-tarot-face, .hp-tarot-back { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; border-radius: 10px; border: 0; box-shadow: 0 1px 2px rgba(0,0,0,0.22), 0 16px 30px -10px rgba(40,30,20,0.5), inset 0 0 24px rgba(120,90,50,0.16); }
.hp-tarot-face { background: var(--paper-2) image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / 600px repeat; display: flex; flex-direction: column; align-items: center; padding: 12px 10px 10px; color: var(--ink); }
.hp-tarot-face::before { content: ""; position: absolute; inset: 6px; border: 1px solid rgba(26,22,19,0.55); border-radius: 6px; pointer-events: none; }

.hp-tarot-back { transform: rotateY(180deg); background: #1c1815; background-image: repeating-linear-gradient(45deg, rgba(255,255,255,0.05) 0 5px, transparent 5px 11px), repeating-linear-gradient(-45deg, rgba(255,255,255,0.05) 0 5px, transparent 5px 11px), radial-gradient(circle at 30% 20%, rgba(255,255,255,0.08), transparent 60%); display: flex; align-items: center; justify-content: center; }
.hp-tarot-back::before { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(244,236,226,0.35); border-radius: 6px; }
.hp-tarot-back img { width: 42%; height: auto; }
.hp-tarot-num { font-family: var(--font-display); font-size: 40px; line-height: 1; margin-top: 8px; }
.hp-tarot-when { font-family: var(--font-type); font-weight: 700; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--stamp); margin-top: 6px; text-align: center; }
.hp-tarot-sym { flex: 1; width: 74%; margin: 4px 0; display: flex; align-items: center; justify-content: center; }
.hp-tarot-sym svg { width: 100%; height: 100%; max-height: 220px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
.hp-tarot-title { width: 100%; font-family: var(--font-cn); font-size: 19px; letter-spacing: 0.14em; text-transform: uppercase; text-align: center; border-top: 1px solid var(--ink); padding: 8px 4px 2px; margin: 0; line-height: 1.2; }
.hp-tarot-open { font-family: var(--font-type); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-2); margin-top: 4px; }
.hp-tarot-hint { text-align: center; font-family: var(--font-type); font-weight: 700; font-size: 11.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-2); margin: -10px 0 0; }
.hp-chap { width: min(560px, 100vw); max-width: 100vw; height: 100vh; max-height: 100vh; margin: 0 0 0 auto; border-radius: 0; border-left: 2px solid var(--ink); box-shadow: -20px 0 50px rgba(0,0,0,0.3); background: var(--paper-2) image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / 900px repeat; transition: transform 0.5s cubic-bezier(0.2, 1, 0.3, 1); }
.hp-chap[open] { transform: none; }
@starting-style { .hp-chap[open] { transform: translateX(100%); } }
.hp-chap-in { height: 100%; max-height: 100vh; padding: 36px 32px 30px; }
.hp-chap-body h3 { font-family: var(--font-display); font-size: clamp(34px, 4.6vw, 54px); }
.hp-chap-eyebrow .hp-card-num { font-family: var(--font-display); }
.hp-chap-eyebrow .hp-card-when { font-family: var(--font-type); font-weight: 700; color: var(--stamp); }
@media (max-width: 899px) {
  .hp-chap { width: 100vw; height: auto; max-height: 86vh; margin: auto 0 0 0; border-left: 0; border-top: 2px solid var(--ink); border-radius: 16px 16px 0 0; box-shadow: 0 -20px 50px rgba(0,0,0,0.3); }
  .hp-chap::before { content: ""; position: absolute; left: 50%; top: 8px; width: 44px; height: 4px; border-radius: 2px; background: var(--line); transform: translateX(-50%); }
  @starting-style { .hp-chap[open] { transform: translateY(100%); } }
  .hp-chap-in { max-height: 86vh; padding: 28px 20px 22px; }
}

.hp-shots { gap: 16px; }
@media (min-width: 720px) { .hp-shots { grid-template-columns: repeat(4, 1fr); gap: 18px; } }
.hp-shot { position: relative; aspect-ratio: auto; padding: 8px 8px 28px; background: linear-gradient(160deg, #fdf9f2, #f3ebdf); box-shadow: var(--shadow-paper); border-radius: 0; transform: rotate(var(--rot, 0deg)); }
.hp-shot:nth-child(4n+1) { --rot: -1.4deg; } .hp-shot:nth-child(4n+2) { --rot: 0.9deg; } .hp-shot:nth-child(4n+3) { --rot: -0.6deg; } .hp-shot:nth-child(4n+4) { --rot: 1.3deg; }
.hp-shot:hover { z-index: 2; }
.hp-shot img { aspect-ratio: 1; filter: sepia(0.28) contrast(1.05); transform: none; transition: none; }
.hp-shot:hover img { transform: none; }
.hp-shot::after { content: attr(data-n); position: absolute; left: 10px; bottom: 7px; font-family: var(--font-type); font-size: 10.5px; letter-spacing: 0.18em; color: var(--ink-2); text-transform: uppercase; }

.hp-box { overflow: visible; }
.hp-box img { cursor: pointer; }
.hp-box-ui { position: absolute; inset: 0; pointer-events: none; }
.hp-box-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 64px; height: 96px; padding: 0; border: 0; background: none; color: rgba(244,236,226,0.55); cursor: pointer; pointer-events: auto; transition: color 0.25s ease, transform 0.25s ease; }
.hp-box-nav svg { width: 22px; height: 38px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.hp-box-nav:hover { color: var(--accent); }
.hp-box-nav.prev { left: 4px; } .hp-box-nav.next { right: 4px; }
.hp-box-nav.prev:hover { transform: translateY(-50%) translateX(-3px); }
.hp-box-nav.next:hover { transform: translateY(-50%) translateX(3px); }
.hp-box-x { position: absolute; right: 22px; top: 22px; display: inline-flex; align-items: center; gap: 9px; padding: 6px 4px; border: 0; background: none; color: rgba(244,236,226,0.65); font-family: var(--font-type); font-weight: 700; font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; cursor: pointer; pointer-events: auto; transition: color 0.25s ease; }
.hp-box-x svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.hp-box-x:hover { color: var(--accent); }
.hp-box-n { position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); font-family: var(--font-type); font-weight: 700; font-size: 11.5px; letter-spacing: 0.28em; color: rgba(244,236,226,0.6); }

.hp-club { background: var(--ink); color: var(--paper); --ink-2: #c9bcab; --line: rgba(244,236,226,0.28); --line-2: rgba(244,236,226,0.12); --btn-o-ink: #f4ece2; --btn-o-line: #f4ece2; --bg: #1a1613; }
.hp-club .hp-eyebrow { color: #ff4a3a; }
.hp-club .hp-lede { color: var(--paper); }
.hp-club-grid { display: grid; gap: 40px; align-items: center; }
@media (min-width: 900px) { .hp-club-grid { grid-template-columns: 1fr 1fr; gap: 64px; } }
.hp-pass-wrap { perspective: 1200px; padding: 24px 0; }
.hp-pass-card { position: relative; aspect-ratio: 1.586; padding: 16px 22px 18px; background: linear-gradient(135deg, #f8f1e5 0%, #ebe0cf 48%, #f7efe2 100%); color: var(--ink); border-radius: 14px; border: 0; box-shadow: 0 30px 60px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.8), inset 0 -2px 0 rgba(0,0,0,0.08); transform-style: preserve-3d; transition: transform 0.2s ease; display: flex; flex-direction: column; font-family: var(--font-type); overflow: hidden; }
.hp-pass-card::before { content: ""; position: absolute; inset: 0; border-radius: 14px; background: radial-gradient(circle at var(--gx, 30%) var(--gy, 20%), rgba(255,255,255,0.7), transparent 42%), linear-gradient(115deg, transparent 38%, rgba(255,255,255,0.28) 50%, transparent 62%); pointer-events: none; mix-blend-mode: screen; }
.hp-pass-card::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: var(--accent); opacity: 0.9; }
.hp-pass-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 8px 0 10px; border-bottom: 1.5px solid rgba(26,22,19,0.7); font-size: 10.5px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-2); }
.hp-pass-head span:first-child { font-family: var(--font-display); font-weight: 400; font-size: 24px; letter-spacing: 0.02em; text-transform: none; color: var(--ink); }
.hp-pass-head span:last-child { color: var(--stamp); font-size: 12px; text-shadow: 0 1px 0 rgba(255,255,255,0.7); }
.hp-pass-body { display: grid; grid-template-columns: 28% 1fr; gap: 16px; align-items: start; padding-top: 14px; flex: 1; }
.hp-pass-photo { aspect-ratio: 3 / 4; border-radius: 6px; border: 0; background: rgba(26,22,19,0.08); display: flex; align-items: center; justify-content: center; box-shadow: inset 0 1px 3px rgba(0,0,0,0.15); }
.hp-pass-photo img { width: 60%; height: auto; filter: grayscale(1) contrast(1.15); opacity: 0.85; }
.hp-pass-fields { margin: 0; }
.hp-pass-fields div { display: grid; grid-template-columns: 36% 1fr; gap: 8px; padding: 4px 0; border-bottom: 1px dotted var(--line); font-size: 10.5px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.hp-pass-fields dt { color: var(--ink-2); }
.hp-pass-fields dd { margin: 0; color: var(--ink); }
.hp-pass-fields .hp-redact { box-shadow: 0 0 0 1px var(--ink); }
.hp-pass-card:hover .hp-redact { background: rgba(255,0,0,0.13); color: var(--ink); box-shadow: 0 0 0 1px rgba(255,0,0,0.13); }
.hp-pass-stamp { position: absolute; right: 16px; bottom: 12px; font-family: var(--font-type); font-weight: 700; font-size: 13px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--stamp); border: 2px solid var(--stamp); padding: 6px 10px 5px 14px; transform: rotate(-12deg) scale(1.4); opacity: 0; filter: url(#hp-worn); mix-blend-mode: multiply; transition: opacity 0.35s ease, transform 0.45s cubic-bezier(0.2, 1.4, 0.4, 1); }
.hp-pass-card:hover .hp-pass-stamp { opacity: 0.9; transform: rotate(-12deg) scale(1); }
@media (max-width: 480px) { .hp-pass-card { aspect-ratio: auto; } .hp-pass-body { grid-template-columns: 1fr; } .hp-pass-photo { width: 34%; } }
.hp-perks { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 10px; font-size: 15.5px; }
.hp-perks li { position: relative; padding-left: 26px; }
.hp-perks li::before { content: "★"; position: absolute; left: 0; top: 0; color: #ff3b2b; }
.hp-club .hp-cta { margin-bottom: 0; align-items: center; }
.hp-club .hp-lnk { color: var(--ink-2); }

.hp-rules { list-style: none; margin: 22px 0 36px; padding: 0; display: grid; gap: 8px 24px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); font-size: 14.5px; color: var(--ink-2); }
.hp-rules li { display: flex; gap: 12px; align-items: flex-start; padding: 0; }
.hp-rules svg { flex: 0 0 auto; width: 24px; height: 24px; margin-top: -1px; fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; filter: url(#hp-ink); opacity: 0.92; }
.hp-halls-h { font-family: var(--font-cn); font-size: 22px; letter-spacing: 0.04em; margin: 0 0 14px; }
.hp-booksec .hp-map-stage { box-shadow: var(--shadow-paper); background: var(--map-bg) image-set(url("img/plan-paper.webp") type("image/webp"), url("img/plan-paper.jpg") type("image/jpeg")) right bottom / cover no-repeat; }
.hp-map .rname { fill: #3c3835; }
.hp-halls-side .hp-pick { background: var(--paper-2); border: 0; border-left: 3px solid var(--accent); box-shadow: var(--shadow-paper); }
.hp-zones div { background: rgba(255,250,243,0.7); }

.hp-geo-grid { display: grid; gap: 30px; }
@media (min-width: 900px) { .hp-geo-grid { grid-template-columns: 0.85fr 1.15fr; gap: 48px; align-items: start; } }
.hp-geo .hp-addr { font-family: var(--font-display); font-size: clamp(34px, 4.6vw, 60px); margin-bottom: 14px; }
.hp-route { position: relative; margin: 0; padding: 10px; background: var(--paper-2) image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / 700px repeat; border: 0; box-shadow: var(--shadow-paper); }
.hp-route svg { display: block; width: 100%; height: auto; }
.hp-route figcaption { margin-top: 8px; font-family: var(--font-type); font-weight: 700; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-2); }
.hp-route .st { fill: none; stroke: #d8cdb9; stroke-linecap: round; stroke-linejoin: round; }
.hp-route .ped { stroke: #efe4d2; }
.hp-route .srv { stroke: #e3d8c5; }
.hp-route .bld { fill: rgba(26,22,19,0.13); stroke: none; filter: drop-shadow(0.8px 1.4px 1px rgba(40,30,20,0.35)); }
.hp-route .bld.hot { fill: rgba(255,0,0,0.16); stroke: var(--accent); stroke-width: 2; }
.hp-route .yard { fill: var(--paper-2); stroke: none; filter: drop-shadow(0 1px 1px rgba(40,30,20,0.3)); }
.hp-route .fence { fill: none; stroke: var(--carbon); stroke-width: 3; stroke-dasharray: 3 2.5; }
.hp-route .gate { fill: none; stroke: var(--accent); stroke-width: 2.5; stroke-linecap: round; }
.hp-route .lbl { font-family: var(--font-type); font-weight: 700; font-size: 9.5px; fill: var(--ink-2); letter-spacing: 0.04em; text-transform: uppercase; }
.hp-route .lbl.big { font-family: var(--font-cn); font-weight: 400; font-size: 15px; fill: var(--ink); letter-spacing: 0.1em; }
.hp-route .lbl.red { fill: var(--stamp); }
.hp-route .num { font-family: var(--font-type); font-size: 8px; fill: var(--ink-2); }
.hp-route .num.hot { fill: var(--stamp); font-weight: 700; font-size: 10px; }
.hp-route-path { fill: none; stroke: var(--accent); stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; transition: stroke-dashoffset 2.8s cubic-bezier(0.4, 0, 0.2, 1); }
.hp-route-arrow { fill: var(--accent); opacity: 0; transition: opacity 0.4s ease 1s; }
.go .hp-route-arrow { opacity: 1; }
.hp-route-pin { fill: var(--paper-2); stroke: var(--ink); stroke-width: 1.5; }
.hp-route-step { opacity: 0; transition: opacity 0.5s ease var(--d, 0s); }
.go .hp-route-step, html:not(.js) .hp-route-step { opacity: 1; }
.hp-route-goal { transform-origin: center; transform-box: fill-box; animation: hp-goal 2s ease-in-out infinite; }
.hp-route-goal circle { fill: rgba(255,0,0,0.15); stroke: var(--accent); stroke-width: 1.5; }
@keyframes hp-goal { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
.hp-pass { list-style: none; margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; counter-reset: p; }
@media (max-width: 719px) { .hp-pass { grid-template-columns: 1fr 1fr; } }
.hp-pass li { position: relative; padding: 14px 14px 14px; background: var(--paper-2) image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / 700px repeat; border: 0; box-shadow: 0 1px 1px rgba(40,30,20,0.14); transform: rotate(var(--rot, 0deg)); }
.hp-pass li:nth-child(1) { --rot: -0.7deg; } .hp-pass li:nth-child(2) { --rot: 0.6deg; } .hp-pass li:nth-child(3) { --rot: -0.5deg; } .hp-pass li:nth-child(4) { --rot: 0.8deg; }
.hp-pass li::after { content: ""; position: absolute; z-index: -1; pointer-events: none; }
.hp-pass li:nth-child(odd)::after { left: 18%; right: 18%; bottom: 4px; height: 22px; border-radius: 50%; box-shadow: 0 10px 12px 2px rgba(40,30,20,0.2); clip-path: inset(calc(100% + 4px) -40px -60px -40px); }
.hp-pass li:nth-child(2)::after { left: 10px; width: 55%; bottom: 12px; height: 30%; box-shadow: 0 14px 10px rgba(40,30,20,0.2); transform: rotate(-3deg); clip-path: inset(calc(100% + 12px) -40px -60px -40px); }
.hp-pass li:nth-child(4)::after { right: 10px; width: 55%; bottom: 12px; height: 30%; box-shadow: 0 14px 10px rgba(40,30,20,0.2); transform: rotate(3deg); clip-path: inset(calc(100% + 12px) -40px -60px -40px); }
.hp-pass li:hover { animation: hp-shiver 0.5s ease-in-out; }
@keyframes hp-shiver {
  0%, 100% { transform: rotate(var(--rot, 0deg)); }
  20% { transform: rotate(calc(var(--rot, 0deg) - 1.1deg)) translate(-1px, 1px); }
  45% { transform: rotate(calc(var(--rot, 0deg) + 1deg)) translate(1px, -1px); }
  70% { transform: rotate(calc(var(--rot, 0deg) - 0.5deg)) translate(0, 1px); }
}
.hp-pass li::before { counter-increment: p; content: counter(p, decimal-leading-zero); font-family: var(--font-type); font-weight: 700; font-size: 11px; letter-spacing: 0.18em; color: var(--stamp); }
.hp-pass svg { display: block; width: 50px; height: 50px; margin: 8px 0 6px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
.hp-pass b { display: block; font-family: var(--font-cn); font-size: 15px; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 2px; }
.hp-pass span { font-size: 13.5px; color: var(--ink-2); line-height: 1.45; }

.hp-faq details { border-bottom: 1px solid var(--line); }
.hp-faq summary { font-family: var(--font-cn); font-weight: 400; font-size: clamp(20px, 2.2vw, 26px); letter-spacing: 0.02em; padding: 20px 0; justify-content: flex-start; align-items: baseline; gap: 16px; }
.hp-faq summary i { font-family: var(--font-type); font-style: normal; font-weight: 700; font-size: 13px; letter-spacing: 0.16em; color: var(--stamp); min-width: 2.4em; }
.hp-faq summary::after { margin-left: auto; font-size: 26px; }
.hp-faq p { margin: 0 0 22px; padding-left: calc(2.4em + 16px); font-size: 16px; }

.hp-bk, .hp-auth-dlg, .hp-sheet { background: var(--paper-2) image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / 900px repeat; }
.hp-bk-dots i { background: rgba(26,22,19,0.2); }
.hp-bk-dots i.now { background: var(--accent); }
.hp-bk-head { border-bottom: 2px dashed var(--line); }
.hp-sum > div { border-bottom: 1px dashed var(--line); }
.hp-cab-card { background: var(--paper-2); border: 0; box-shadow: var(--shadow-paper); }
.hp-cab-bal { color: var(--accent); }
.hp-ref { background: var(--paper-2); border: 2px solid var(--accent); box-shadow: var(--shadow-paper); }
.hp-bk-row, .hp-links li, .hp-inv li { background: rgba(255,250,243,0.6); }

.hp-foot { border-top: 0; padding: 60px 0 40px; }
.hp-foot .name { font-family: var(--font-display); font-size: 30px; letter-spacing: 0.02em; }
.hp-foot .name small { font-family: var(--font-type); font-size: 11px; letter-spacing: 0.2em; margin-left: 6px; }
.hp-foot-fn { margin: 14px 0 0; font-family: var(--font-type); font-size: 11.5px; line-height: 1.5; max-width: 60ch; }
.hp-sticky { display: none; }

@media (prefers-reduced-motion: reduce) {
  .hp-loader, .hp-cur { display: none !important; }
  .hp-tick-in { animation: none; }
  .hp-tarot-in { transform: none !important; }
  .hp-route-goal { animation: none; }
  .hp-shot .hp-fx { display: none; }
}

.hp-sign.hp-draft { padding: 22px 22px 18px; }
.hp-draft .g { fill: none; stroke: rgba(26,22,19,0.16); stroke-width: 0.25; }
.hp-draft .frame { fill: none; stroke: var(--ink); stroke-width: 0.5; }
.hp-draft .guides * { fill: none; stroke: var(--ink-2); stroke-width: 0.3; }
.hp-draft .guides .dash { stroke-dasharray: 1.6 1.2; }
.hp-draft .mark path { fill: rgba(200,16,46,0.06); stroke: var(--stamp); stroke-width: 1.7px; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-dasharray: 1000; stroke-dashoffset: 1000; }
.hp-draft.in .mark path { animation: hp-draw 3.4s cubic-bezier(0.4, 0, 0.2, 1) 0.2s infinite alternate; }
@keyframes hp-draw { to { stroke-dashoffset: 0; } }
.js .hp-draft .guides, .js .hp-draft .dims { opacity: 0; transition: opacity 0.9s ease 1.6s; }
.hp-draft.in .guides, .hp-draft.in .dims { opacity: 1; }
.hp-draft .dims .dim, .hp-draft .dims .tick { fill: none; stroke: var(--ink); stroke-width: 0.3; }
.hp-draft .dims text { font-family: var(--font-type); font-weight: 700; font-size: 3.4px; fill: var(--ink); letter-spacing: 0.08em; }
.hp-draft .dims .note { font-size: 2.8px; fill: var(--ink-2); text-transform: uppercase; }
html:not(.js) .hp-draft .mark path { stroke-dashoffset: 0; }
@media (prefers-reduced-motion: reduce) { .hp-draft .mark path { stroke-dashoffset: 0 !important; } .hp-draft .guides, .hp-draft .dims { opacity: 1 !important; } }

.hp-gl { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 150; pointer-events: none; opacity: 0; transition: opacity 0.18s ease; }
.hp-gl.on { opacity: 1; }
.hp-gl.over { z-index: 200; }
.hp-zoom-veil { position: fixed; inset: 0; z-index: 149; background: rgba(0,0,0,0.78); opacity: 0; transition: opacity 0.6s ease; pointer-events: none; }
.hp-zoom-veil.on { opacity: 1; }
.hp-flying img { opacity: 0; }

.hp-chip-list { margin-left: 0; }
.hp-map.list-mode .hp-map-stage, .hp-map.list-mode .hp-map-legend { display: none; }
.hp-map.list-mode .hp-map-list summary { display: none; }
.hp-map.list-mode .hp-map-list { margin-top: 4px; }
@media (min-width: 900px) { .hp-halls-side { padding-top: 54px; } }

.hp-btn { position: relative; overflow: hidden; box-shadow: none; transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; }
.hp-btn::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,0.16); opacity: 0; transition: opacity 0.2s ease; pointer-events: none; }
.hp-btn:hover { background: var(--accent-2); border-color: var(--accent-2); }
.hp-btn:hover::after { opacity: 1; }
.hp-btn-o { box-shadow: none; }
.hp-btn-o:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.hp-btn-o:hover::after { opacity: 0; }

.hp-book-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin: 4px 0 8px; }
.hp-book-note { margin: 0; max-width: 44ch; font-family: var(--font-type); font-size: 13px; line-height: 1.6; color: var(--ink-2); }

.hp-bk-head { padding: 10px 14px; }
.hp-bk-head .hp-icon-btn { font-size: 22px; }
.hp-bk-count { color: var(--ink-2); }

.hp-photo[role="button"] { cursor: pointer; border: 0; padding: 7px 7px 24px; }
.hp-photo:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }

.hp-cur-label { position: fixed; left: 0; top: 0; z-index: 121; margin: -13px 0 0 -7px; font: 26px/1 var(--font-cn); color: var(--paper); opacity: 0; transition: opacity 0.2s ease; pointer-events: none; will-change: transform; }
.hp-cur.box .hp-cur-label { opacity: 1; }
.hp-cur.box .hp-cur-ring, .hp-cur.box .hp-cur-dot { opacity: 0; }
.hp-cur.box .hp-cur-blob { opacity: 1; }
.hp-cur.box .hp-cur-blob rect { fill: rgba(26,22,19,0.55); stroke: var(--paper); stroke-width: 1.4; }
.hp-cur.box.down .hp-cur-blob rect { fill: rgba(255,0,0,0.35); }

.hp-box { width: 100%; max-width: 100%; height: 100%; max-height: 100%; padding: 0; margin: 0; border: 0; background: transparent; overflow: hidden; }
.hp-box::backdrop { background: rgba(11,10,9,0.97); }
.hp-box-track { position: absolute; inset: 0; overflow: hidden; }
.hp-box-slide { position: absolute; left: 0; top: 0; width: 100%; height: 100%; margin: 0; overflow: hidden; will-change: transform; background: #0b0a09; }
.hp-box-slide img { display: block; width: 100%; height: 100%; object-fit: cover; will-change: transform; transform-origin: center; }

.hp-box-slide.on img { opacity: 1; }
@media (min-width: 720px) { .hp-box-track { padding: 0 12px; } .hp-box-slide { margin: 0 14px; } }
.hp-box-ui { position: fixed; inset: 0; pointer-events: none; z-index: 2; }
@media (max-width: 719px) {
  .hp-box-track { flex-direction: column; overflow-x: hidden; overflow-y: auto; scroll-snap-type: y mandatory; padding: 12px 0; height: 100%; }
  .hp-box-slide { margin: 8px 0; }
  
  .hp-box-nav { display: none; }
}

.hp-faq summary span, .hp-rev .go, .hp-lnk, .hp-tarot-open, .hp-zones dt { background-image: linear-gradient(var(--accent), var(--accent)); background-repeat: no-repeat; background-position: 0 100%; background-size: 0 1.5px; transition: background-size 0.35s cubic-bezier(0.2, 1, 0.3, 1); }
.hp-faq summary:hover span, .hp-rev:hover .go, .hp-lnk:hover, .hp-tarot-card:hover .hp-tarot-open, .hp-zones div:hover dt { background-size: 100% 1.5px; }
.hp-lnk { text-decoration: none; }
.hp-rev .go { border-bottom: 0; padding-bottom: 3px; }

.hp-halls-side .hp-map-legend { margin: 0 0 16px; }
.hp-halls-side .hp-map-legend .note { color: var(--ink-2); }
.hp-map-list summary[hidden] { display: none !important; }
.hp-map .hp-map-list { margin-top: 0; }

.hp-games { list-style: none; margin: 40px 0 0; padding: 0; border-top: 1px solid var(--line); display: grid; }
@media (min-width: 900px) { .hp-games { grid-template-columns: 1fr 1fr; column-gap: 56px; } }
.hp-games li { display: flex; gap: 16px; align-items: baseline; padding: 18px 0 16px; border-bottom: 1px solid var(--line-2); }
.hp-games li > i { font-family: var(--font-type); font-style: normal; font-weight: 700; font-size: 13px; letter-spacing: 0.16em; color: var(--stamp); min-width: 2.4em; }
.hp-games h3 { margin: 0; font-weight: 400; font-size: clamp(20px, 2.1vw, 25px); line-height: 1.1; }
.hp-game-meta { margin: 6px 0 0; font-family: var(--font-type); font-weight: 700; font-size: 12.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-2); }
.hp-game-meta em { font-style: normal; color: var(--stamp); }
.hp-games li > div > p:last-child { margin: 8px 0 0; font-size: 15.5px; line-height: 1.5; color: var(--ink); }

@media (max-width: 719px) { .hp-box-x span { display: none; } .hp-box-x { right: 14px; top: 14px; } }
@media (prefers-reduced-motion: reduce) { .hp-pass li:hover { animation: none; } }

.hp-route-from { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 10px; }
.hp-route-from .hp-chip { font-size: 12px; }
.hp-compass .ring { fill: none; stroke: var(--ink); stroke-width: 1.2; opacity: 0.55; }
.hp-compass .n { fill: var(--accent); } .hp-compass .s { fill: var(--ink); opacity: 0.6; }
.hp-compass text { font-family: var(--font-type); font-weight: 700; font-size: 9px; fill: var(--ink); letter-spacing: 0.05em; }

.hp-h1 .w:nth-child(1), .hp-h1 .w:nth-child(4) { display: block; }
@media (min-width: 900px) { .hp-h1 { font-size: clamp(58px, 7.6vw, 112px); } }
html[lang^="zh"] .hp-h1 { word-spacing: -0.3em; }
@media (min-width: 900px) { .hp-sec { padding: clamp(44px, 6.3vw, 84px) 0; } }
.hp-route-from { margin: 0 0 14px; }
.hp-map-tabs { flex-wrap: wrap; align-items: center; }
.hp-map-tabs .hp-chip-cta { margin-left: auto; }
.hp-book-cta { margin: 0; }
.hp-halls-side .hp-map-legend { margin: 18px 0 0; }
.hp-box-tools { position: absolute; right: 22px; top: 22px; display: flex; gap: 22px; pointer-events: auto; }
.hp-box-x { position: static; }
.hp-box-tool { display: inline-flex; align-items: center; gap: 9px; padding: 6px 4px; border: 0; background: none; color: rgba(244,236,226,0.65); font-family: var(--font-type); font-weight: 700; font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; cursor: pointer; pointer-events: auto; transition: color 0.25s ease; }
.hp-box-tool svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.hp-box-tool:hover { color: var(--accent); }
.hp-box-toast { position: absolute; left: 50%; bottom: 48px; transform: translateX(-50%) translateY(8px); padding: 8px 14px; background: rgba(244,236,226,0.92); color: var(--ink); font-family: var(--font-type); font-weight: 700; font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; opacity: 0; transition: opacity 0.25s ease, transform 0.25s ease; pointer-events: none; }
.hp-box-toast.on { opacity: 1; transform: translateX(-50%); }
@media (max-width: 719px) { .hp-box-tool span { display: none; } .hp-box-tools { right: 14px; top: 14px; gap: 18px; } }

.hp-geo-map { align-self: start; }
.hp-pick .hp-lnk { margin-left: 14px; font-size: 13px; }

.hp-zoom-veil.snap { transition: none !important; }

.hp-pass-fields dd, .hp-spravka dd { font-variant-numeric: tabular-nums; }

.hp-hours { font-size: clamp(17px, 1.8vw, 21px); }

.hp-gl-over { position: fixed; inset: 0; z-index: 151; pointer-events: none; }
.hp-clip-over { right: auto; bottom: auto; }

.hp-top { z-index: 60; }
.hp-map-tabs { display: none !important; }
.hp-halls { display: grid; gap: 28px; align-items: start; }
@media (min-width: 900px) { .hp-halls { grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.82fr); gap: 36px; } }
@media (min-width: 900px) { .hp-booksec .hp-map-stage { aspect-ratio: 1 / 1.22; } }
@media (min-width: 900px) { .hp-halls { align-items: stretch; } }
.hp-map-legend { background: linear-gradient(to top, var(--paper-2) 62%, rgba(244,236,226,0)); }
.hp-map-legend .note { color: var(--ink-2); }
.hp-book-inline { padding: 22px 22px 26px; background: var(--paper-2) image-set(url("img/paper.webp") type("image/webp"), url("img/paper.jpg") type("image/jpeg")) center / 900px repeat; box-shadow: var(--shadow-paper); }
.hp-book-inline .hp-bk-foot { margin-top: 22px; }
.hp-book-inline .hp-bk-foot .hp-btn { width: 100%; }
.hp-book-inline .hp-strip { max-width: none; width: auto; margin-left: -22px; margin-right: -22px; padding-left: 22px; padding-right: 22px; scroll-padding-inline: 22px; }
.hp-games li { cursor: pointer; }
@media (max-width: 899px) {
  .hp-stamp-line { display: block; width: 100%; box-sizing: border-box; }
  .hp-hours span { display: block; }
  .hp-hours .hp-sep { display: none; }
}
@media (max-width: 719px) {
  .hp-hero .hp-cta { flex-direction: column; }
  .hp-hero .hp-cta .hp-btn { width: 100%; }
  .hp-shots { gap: 0; padding: 8px 6px 16px; }
  .hp-shot { margin: -10px -3px; }
  .hp-shot:nth-child(4n+1) { --rot: -3.2deg; z-index: 2; }
  .hp-shot:nth-child(4n+2) { --rot: 2.6deg; margin-top: -22px; z-index: 1; }
  .hp-shot:nth-child(4n+3) { --rot: 1.8deg; z-index: 3; }
  .hp-shot:nth-child(4n+4) { --rot: -2.4deg; margin-top: -20px; z-index: 2; }
  .hp-shot:hover { z-index: 4; }
}

.hp-halls > * { min-width: 0; }
.hp-book-inline { overflow: hidden; box-sizing: border-box; max-width: 100%; }
.hp-book-inline .hp-phone { display: flex; gap: 8px; }
.hp-book-inline .hp-phone .hp-field { min-width: 0; }

@media (max-width: 899px) { .hp-h1 { white-space: nowrap; } }
.hp-hero-grid > * { min-width: 0; }

.hp-menu-list { list-style: none; margin: 40px 0 0; padding: 0; border-top: 1px solid var(--line); display: grid; }
@media (min-width: 900px) { .hp-menu-list { grid-template-columns: 1fr 1fr; column-gap: 56px; } }
.hp-menu-list li { display: flex; gap: 16px; align-items: baseline; padding: 16px 0 14px; border-bottom: 1px solid var(--line-2); cursor: pointer; }
.hp-menu-list li > i { font-family: var(--font-type); font-style: normal; font-weight: 700; font-size: 13px; letter-spacing: 0.16em; color: var(--stamp); min-width: 2.4em; }
.hp-menu-list h3 { margin: 0; font-weight: 400; font-size: clamp(20px, 2.1vw, 25px); line-height: 1.1; }
.hp-menu-list h3 a { color: inherit; text-decoration: none; background-image: linear-gradient(var(--accent), var(--accent)); background-repeat: no-repeat; background-position: 0 100%; background-size: 0 1.5px; transition: background-size 0.35s cubic-bezier(0.2, 1, 0.3, 1); }
.hp-menu-list h3 a:hover, .hp-menu-list h3 a:focus-visible { background-size: 100% 1.5px; }
.hp-menu-list li > div > p { margin: 7px 0 0; font-size: 15.5px; line-height: 1.5; color: var(--ink-2); }
.hp-menusec .hp-cta { margin-top: 34px; }

.hp-msheet { --red: var(--stamp); --green: #3e9c4f; --bean: #6b4a2f; --paper: var(--paper-2); }
.hp-sheet-wait { margin: 0; font-family: var(--font-type); font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-2); }
.hp-msheet .group + .group { margin-top: 34px; }
.hp-msheet .sec + .sec { margin-top: 26px; }
.hp-msheet .sec-h { display: flex; align-items: baseline; gap: 12px; margin: 0 0 12px; }
.hp-msheet .sec-h h2 { margin: 0; font-family: var(--font-cn); font-weight: 400; font-size: 22px; letter-spacing: 0.06em; text-transform: uppercase; line-height: 1.1; }
.hp-msheet .sec-note { font-family: var(--font-type); font-weight: 700; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-2); }
.hp-msheet .items { list-style: none; margin: 0; padding: 0; }
.hp-msheet .it { padding: 8px 0; border-bottom: 1px solid var(--line-2); }
.hp-msheet .it:last-child { border-bottom: 0; }
.hp-msheet .it-r { display: flex; align-items: baseline; gap: 8px; }
.hp-msheet .it-n { margin: 0; font-family: var(--font-text); font-weight: 400; font-size: 16px; line-height: 1.4; letter-spacing: 0; text-transform: none; }
.hp-msheet .dots { flex: 1; min-width: 18px; border-bottom: 1px dotted var(--line); transform: translateY(-3px); }
.hp-msheet .it-p { font-family: var(--font-type); font-weight: 700; font-size: 14px; letter-spacing: 0.04em; white-space: nowrap; }
.hp-msheet .it-d { margin: 3px 0 0; font-size: 14px; line-height: 1.45; color: var(--ink-2); }
.hp-msheet .marks { display: inline-flex; gap: 5px; margin-left: 7px; }
.hp-msheet .marks svg { width: 15px; height: 15px; }
.hp-msheet .club { margin: 14px 0 0; padding: 12px 16px; border-left: 2px solid var(--stamp); }
.hp-msheet .club p { margin: 0; font-family: var(--font-type); font-size: 13.5px; line-height: 1.5; }
.hp-msheet .club small { display: block; margin-top: 5px; font-size: 12px; color: var(--ink-2); }

.hp-csheet .hp-gsheet-body { padding: 0; }
.hp-sheet-frame { display: block; width: 100%; height: 100%; min-height: 60vh; border: 0; background: var(--paper-2); }

.hp-gl { z-index: 55; }
.hp-gl-over { z-index: 56; }
.hp-gl.over { z-index: 200; }

#menu .hp-cta { justify-content: center; }

[data-fill] { color: var(--stamp); border-bottom: 1px dashed var(--stamp); font-family: var(--font-type); font-size: 0.92em; }
.hp-legal h2 { margin-top: 30px; }
.hp-legal .hp-spravka { margin-bottom: 8px; }
.hp-nb { white-space: nowrap; }
