/* Display the supplied QQ code at its original aspect ratio, with a generous quiet zone. */
.qq-code-crop{position:relative;display:block;flex:none;width:160px;aspect-ratio:1;overflow:hidden;background:#f3f9ff;border-radius:12px}
.qq-code-crop img{position:absolute;display:block;width:133.2%;max-width:none;height:auto;left:-16.6%;top:-73.1%}
.qq-code-crop:focus-visible,.header-qq:focus-visible,.qq-join-button:focus-visible,.hero-qq-link:focus-visible{outline:3px solid #66d4ef;outline-offset:4px}
.site-header .header-qq{display:flex;align-items:center;justify-content:center;flex:none;gap:7px;min-height:42px;padding:8px 13px;border:1px solid #d9fcff;border-radius:24px;background:linear-gradient(115deg,#187e9a,#298799);color:#fff;text-shadow:none;box-shadow:0 3px 18px #153d4240;font-size:13px;font-weight:700;white-space:nowrap}
.header-qq img{display:block;width:24px;height:27px;object-fit:contain}
.site-header .header-qq:hover{background:#176b80;box-shadow:0 3px 22px #65d8ef60}
.hero-qq-card{position:absolute;z-index:5;left:2.2%;bottom:max(62px,7%);width:184px;padding:12px;border:1px solid #e8fcf5bd;border-radius:18px;background:linear-gradient(145deg,#fffef3f5,#effbfae8);box-shadow:0 12px 32px #102d3045;color:#34594f;text-align:center}
.hero-qq-card .qq-code-crop{width:100%;border-radius:10px}
.hero-qq-copy{display:flex;flex-direction:column;align-items:center;gap:6px;padding-top:9px}
.hero-qq-tag{font-size:10px;line-height:1.3;letter-spacing:2px;color:#638259}
.hero-qq-copy strong{font-size:14px;line-height:1.5}
.hero-qq-number{font-size:11px;color:#6f8379;line-height:1.5}
.hero-qq-link{font-size:12px;font-weight:700;line-height:1.5;border-top:1px solid #cfdfd3;padding:7px 0 0;width:100%;color:#267890}
.hero-qq-link span{margin-left:12px}
.reservation-success{padding-top:7px}
.reservation-success .success-check{width:45px;height:45px;margin-bottom:12px;font-size:25px}
.reservation-success h3{font-size:22px;margin-bottom:8px}
.reservation-success>p{font-size:14px;line-height:1.8;margin-bottom:0}
.success-qq{margin:15px auto 0}
.success-qq .qq-code-crop{width:184px;margin:0 auto}
.reservation-success .success-qq p{margin:7px 0 11px;font-size:12px;line-height:1.6;color:#738678}
.qq-join-button{display:flex;align-items:center;justify-content:center;gap:15px;padding:12px 20px;border-radius:10px;background:#2b8292;color:white;font-size:16px;font-weight:700;line-height:1.5}
.qq-join-button:hover{background:#226e7b}
.reservation-success .reservation-submit{margin-top:11px;font-size:15px;padding:11px 20px;background:#f0f4ea;color:#637557;box-shadow:none}
.reservation-dialog:has(#reservation-success:not([hidden])){padding-top:24px;padding-bottom:20px}
.reservation-dialog:has(#reservation-success:not([hidden])) .reservation-logo{width:76px;height:45px;margin-bottom:7px}
.reservation-dialog:has(#reservation-success:not([hidden])) h2{font-size:14px;margin-bottom:11px}
.reservation-dialog:has(#reservation-success:not([hidden])) .reservation-method{padding-block:8px;margin-bottom:10px}
.reservation-dialog:has(#reservation-success:not([hidden])) .reservation-footnote{margin-top:13px;font-size:11px}
@media(min-width:781px) and (max-width:1500px){
 .site-header .site-nav{margin-left:0}.site-header .site-nav a{padding-inline:clamp(8px,1.2vw,18px);font-size:16px}.site-header .header-actions{gap:10px}
 .site-header .header-qq{padding-inline:10px}.header-qq span{display:none}
 .hero-qq-card{width:158px;padding:10px}.hero-qq-copy strong{font-size:12px}
}
@media(max-width:1199px){
 .hero-qq-card{bottom:43px;left:4%;width:min(420px,92%);display:flex;align-items:center;gap:12px;padding:9px 13px;border-radius:14px;text-align:left}
 .hero-qq-card .qq-code-crop{width:88px;border-radius:7px}.hero-qq-copy{align-items:flex-start;padding-top:0;gap:3px;flex:1}.hero-qq-tag{font-size:10px;letter-spacing:1px}.hero-qq-copy strong{font-size:14px}.hero-qq-number{font-size:11px}.hero-qq-link{border-top:0;padding-top:1px;font-size:12px}
 .static-hero .reservation-counter{bottom:163px}.static-hero .reservation-counter output{font-size:35px}.static-hero .reservation-counter-heading{font-size:12px}
 .static-hero .hero-reservation{bottom:255px}
}
@media(min-width:781px) and (max-width:1100px){
 .site-header .site-nav{display:none}.site-header .header-actions{margin-left:auto}.site-header .menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;background:none;width:26px;height:30px;padding:5px 0}
 .site-header .menu-toggle span{display:block;width:23px;height:2px;background:currentColor}
 .site-header .site-nav.is-open{display:flex;position:absolute;top:90px;left:0;right:0;justify-content:center;padding:18px;gap:10px;border-radius:0 0 18px 18px;background:#f4f8f0fa;--nav-ink:#35483f;--nav-accent:#187b70}
 .site-header .site-nav.is-open a{text-shadow:none}
}
@media(max-width:780px){
 .site-header .header-actions{gap:6px}.site-header .header-qq{width:38px;min-height:38px;padding:6px;border-radius:50%}.header-qq span{display:none}.header-qq img{width:23px;height:25px}
 .site-header .header-pv-button{width:32px}.site-header .header-pv-button .pv-frame{width:30px;height:36px}.site-header .nav-reserve{padding-inline:9px;font-size:13px}
 .hero-qq-card{bottom:43px;left:4%;width:92%;display:flex;align-items:center;gap:12px;padding:9px 13px;border-radius:14px;text-align:left}
 .hero-qq-card .qq-code-crop{width:88px;border-radius:7px}.hero-qq-copy{align-items:flex-start;padding-top:0;gap:3px;flex:1}.hero-qq-tag{font-size:10px;letter-spacing:1px}.hero-qq-copy strong{font-size:14px}.hero-qq-number{font-size:11px}.hero-qq-link{border-top:0;padding-top:1px;font-size:12px}
 .static-hero .reservation-counter{bottom:163px}.static-hero .reservation-counter output{font-size:35px}.static-hero .reservation-counter-heading{font-size:12px}
 .static-hero .hero-reservation{bottom:255px}
 .reservation-dialog:has(#reservation-success:not([hidden])){padding:22px 23px 19px}.success-qq .qq-code-crop{width:168px}
}
@media(max-width:360px){.site-header .header-actions{gap:4px}.site-header .header-qq{width:34px;min-height:34px}.site-header .site-brand img{width:54px}.site-header .nav-reserve{font-size:12px;padding-inline:8px}.site-header .music-toggle{width:25px}.site-header .age-badge{width:32px}.hero-qq-copy strong{font-size:13px}}
@media(prefers-reduced-motion:reduce){.header-qq{transition:none}}