.front-pass-list, .front-pass-detail { color:#1a1a1a; background:#fff; min-height:100%; }
.front-pass-list__header { position:sticky; top:52px; z-index:30; background:#fff; border-bottom:1px solid #ececec; padding:14px 16px 12px; }
.front-pass-list__title-row { display:flex; align-items:center; gap:9px; }
.front-pass-list__title-row h1 { margin:0; font-size:21px; font-weight:800; letter-spacing:-.4px; }
.front-pass-list__back { display:flex; margin-left:-2px; color:#1a1a1a; text-decoration:none; }
.front-pass-list__back .material-symbols-outlined { font-size:24px; }
.front-pass-list__header p { margin:2px 0 0 31px; color:#767676; font-size:13px; }
.front-pass-list__cards { display:flex; flex-direction:column; gap:16px; padding:16px; }
.front-pass-card { overflow:hidden; border-radius:18px; background:#fff; box-shadow:0 3px 12px rgba(0,0,0,.09); color:inherit; text-decoration:none; }
.front-pass-card__media { position:relative; aspect-ratio:16/9; overflow:hidden; }
.front-pass-card__media img { width:100%; height:100%; display:block; object-fit:cover; }
.front-pass-card__tag { position:absolute; top:11px; left:11px; padding:4px 9px; border-radius:7px; background:#e6007e; color:#fff; font-size:10px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; }
.front-pass-card__body { padding:13px 15px 15px; }
.front-pass-card__body h2 { margin:0; font-size:16.5px; font-weight:800; letter-spacing:-.3px; line-height:1.2; }
.front-pass-card__body p { margin:4px 0 0; color:#767676; font-size:12.5px; }
.front-pass-card__meta { display:flex; align-items:center; gap:5px; margin-top:9px; color:#e6007e; font-size:12.5px; font-weight:700; }
.front-pass-card__meta .material-symbols-outlined { font-size:16px; }
.front-pass-list__empty { padding:50px 18px; text-align:center; color:#767676; }
.front-pass-list__empty > .material-symbols-outlined { color:#d8d8d8; font-size:42px; }
.front-pass-list__empty h2 { margin:10px 0 0; color:#1a1a1a; font-size:16px; }
.front-pass-list__empty p { margin:5px 0 0; font-size:13px; }
.front-pass-detail__hero { position:relative; min-height:210px; padding:16px 18px 28px; overflow:hidden; color:#fff; display:flex; flex-direction:column; }
.front-pass-detail__hero > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.front-pass-detail__gradient { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.06) 30%,rgba(120,0,66,.62),rgba(88,0,48,.8)); pointer-events:none; }
.front-pass-detail__back { position:relative; z-index:1; width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.28); backdrop-filter:blur(4px); color:#fff; text-decoration:none; }
.front-pass-detail__back .material-symbols-outlined { font-size:20px; }
.front-pass-detail__hero-copy { position:relative; margin-top:auto; pointer-events:none; }
.front-pass-detail__kicker { margin:0; font-size:11px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; opacity:.9; text-shadow:0 1px 4px rgba(0,0,0,.4); }
.front-pass-detail__hero h1 { margin:6px 0 0; font-size:26px; font-weight:800; letter-spacing:-.6px; line-height:1.12; text-shadow:0 1px 6px rgba(0,0,0,.45); }
.front-pass-detail__hero-meta { display:flex; align-items:center; gap:8px; margin-top:11px; font-size:12.5px; font-weight:600; }
.front-pass-detail__hero-meta span { padding:4px 10px; border-radius:20px; background:rgba(255,255,255,.22); backdrop-filter:blur(4px); }
.front-pass-detail__hero-meta strong { font-weight:600; text-shadow:0 1px 4px rgba(0,0,0,.4); }
.front-pass-detail__content { padding:18px 16px 145px; }
.front-pass-detail__summary { margin:0 0 6px; color:#e6007e; font-size:13px; font-weight:700; }
.front-pass-detail__description { margin:0; color:#2b2b2b; font-size:14.5px; line-height:1.65; }
.front-pass-detail__section-title { display:flex; align-items:center; justify-content:space-between; margin-top:22px; }
.front-pass-detail__section-title h2, .front-pass-detail__quantity-title { margin:0; color:#9a9a9a; font-size:11.5px; font-weight:800; letter-spacing:1px; text-transform:uppercase; }
.front-pass-detail__section-title > span { display:flex; align-items:center; gap:4px; color:#e6007e; font-size:11.5px; font-weight:700; }
.front-pass-detail__section-title .material-symbols-outlined { font-size:15px; }
.front-pass-detail__inclusions { display:flex; flex-direction:column; gap:9px; margin-top:12px; }
.front-pass-inclusion { display:flex; align-items:center; gap:12px; padding:12px 13px; border:1px solid #eee; border-radius:14px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.04); }
.front-pass-inclusion__icon { flex:0 0 auto; width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:#fff4fa; color:#e6007e; font-size:21px; }
.front-pass-inclusion h3 { margin:0; font-size:14px; font-weight:700; line-height:1.3; }
.front-pass-inclusion p { margin:3px 0 0; color:#767676; font-size:11.5px; }
.front-pass-detail__quantity-title { margin-top:24px; }
.front-pass-quantity { margin-top:12px; padding:15px; border:1px solid #eee; border-radius:16px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.04); }
.front-pass-quantity__top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.front-pass-quantity__top h3 { margin:0; font-size:14px; font-weight:700; line-height:1.3; }
.front-pass-quantity__top p { display:flex; align-items:center; gap:6px; margin:4px 0 0; }
.front-pass-quantity__top del { color:#ababab; font-size:12px; }
.front-pass-quantity__top strong { color:#e6007e; font-size:15px; font-weight:800; }
.front-pass-quantity__top p span { color:#767676; font-size:11px; }
.front-pass-stepper { flex:0 0 auto; display:flex; align-items:center; gap:2px; padding:3px; border:1px solid #e2e2e2; border-radius:11px; }
.front-pass-stepper button { width:34px; height:34px; padding:0; border:0; border-radius:9px; display:flex; align-items:center; justify-content:center; background:transparent; color:#1a1a1a; cursor:pointer; }
.front-pass-stepper button:disabled { color:#d3d3d3; cursor:default; }
.front-pass-stepper output { min-width:30px; text-align:center; font-size:16px; font-weight:800; }
.front-pass-quantity__rule { height:1px; margin:14px 0 12px; background:#f0f0f0; }
.front-pass-quantity__row { display:flex; align-items:center; justify-content:space-between; color:#767676; font-size:13px; }
.front-pass-quantity__row--discount { margin-top:6px; color:#e6007e; font-weight:700; }
.front-pass-quantity__total { display:flex; align-items:flex-end; justify-content:space-between; margin-top:12px; font-size:14px; font-weight:700; }
.front-pass-quantity__total strong { color:#e6007e; font-size:26px; font-weight:800; letter-spacing:-.8px; }
.front-pass-notice { margin-top:16px; padding:14px 15px; border-radius:14px; background:#fafafa; }
.front-pass-notice h2 { margin:0; color:#5a5a5a; font-size:12px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; }
.front-pass-notice p { margin:7px 0 0; color:#767676; font-size:12.5px; line-height:1.7; }
.front-pass-purchase { position:fixed; z-index:35; bottom:74px; left:0; right:0; width:375px; max-width:100%; margin:0 auto; padding:12px 16px; box-sizing:border-box; border-top:1px solid #ececec; display:flex; align-items:center; gap:10px; background:#fff; }
.front-pass-purchase > div { flex:0 0 auto; display:flex; flex-direction:column; font-size:11px; color:#767676; }
.front-pass-purchase > div strong { color:#1a1a1a; font-size:15px; }
.front-pass-purchase button { flex:1; padding:13px; border:0; border-radius:13px; background:#e6007e; color:#fff; font-size:14px; font-weight:700; white-space:nowrap; }
.front-pass-purchase button:disabled { opacity:1; cursor:not-allowed; }
@media (prefers-reduced-motion:reduce) {
  .front-pass-card, .front-pass-stepper button { transition:none; animation:none; }
}
