
/* Pianoland Pass Sprint 1 */
.pass-nav{display:flex!important;align-items:center;gap:8px}
.pass-nav span{color:#d9ff57}
.pass-dashboard-panel{position:relative}
.pass-page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}
.pass-page-heading h2{margin:4px 0 8px;font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.05em}
.pass-foundation-label{padding:9px 13px;border:1px solid rgba(217,255,87,.28);border-radius:999px;background:rgba(217,255,87,.08);color:#ddff71;font-size:.68rem;font-weight:800;letter-spacing:.15em}
.pass-loading{display:grid;place-items:center;min-height:420px;border:1px solid rgba(255,255,255,.1);border-radius:30px;background:rgba(255,255,255,.035);color:rgba(255,255,255,.56)}
.pass-loading span{width:40px;height:40px;border:3px solid rgba(255,255,255,.12);border-top-color:#d9ff57;border-radius:50%;animation:pass-spin 1s linear infinite}
@keyframes pass-spin{to{transform:rotate(360deg)}}
.pass-experience{display:grid;gap:22px}
.pianoland-pass-card{position:relative;isolation:isolate;overflow:hidden;min-height:355px;padding:32px;border:1px solid rgba(255,255,255,.17);border-radius:34px;background:linear-gradient(145deg,#101710 0%,#0b0e0b 43%,#15121e 100%);box-shadow:0 38px 100px rgba(0,0,0,.48),inset 0 1px rgba(255,255,255,.15)}
.pass-card-grid{position:absolute;inset:0;z-index:-5;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,#000,transparent)}
.pass-card-glow{position:absolute;z-index:-4;border-radius:50%;filter:blur(45px);opacity:.65}
.pass-card-glow-one{width:270px;height:270px;right:-60px;top:-95px;background:#baff32}
.pass-card-glow-two{width:220px;height:220px;left:-60px;bottom:-120px;background:#5d34d9}
.pass-card-shimmer{position:absolute;inset:-100% auto -100% -20%;z-index:-2;width:30%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.11),transparent);animation:pass-shimmer 7s ease-in-out infinite}
@keyframes pass-shimmer{0%,55%{left:-40%}90%,100%{left:130%}}
.pass-card-top,.pass-card-bottom{display:flex;justify-content:space-between;gap:24px}
.pass-wordmark{display:flex;align-items:center;gap:13px}
.pass-wordmark img{width:48px;height:48px;object-fit:contain;border-radius:13px;background:#d9ff57;padding:7px}
.pass-wordmark small,.pass-card-member span,.pass-card-bottom span{display:block;color:rgba(255,255,255,.5);font-size:.66rem;font-weight:800;letter-spacing:.17em}
.pass-wordmark strong{font-size:1.15rem;letter-spacing:.12em}
.pass-status{display:inline-flex;align-items:center;height:32px;padding:0 13px;border-radius:999px;font-size:.68rem;font-weight:900;letter-spacing:.13em}
.pass-status.active{background:#d9ff57;color:#0a0d08}
.pass-status.frozen,.pass-status.lost,.pass-status.blocked{background:#ff735f;color:#170704}
.pass-status.replaced,.pass-status.expired{background:#b9bbc1;color:#111}
.pass-card-member{margin:72px 0 58px}
.pass-card-member h3{margin:8px 0 0;font-size:clamp(2.25rem,5vw,4.5rem);line-height:.95;letter-spacing:-.06em;text-transform:uppercase}
.pass-card-bottom{align-items:flex-end}
.pass-card-bottom strong{display:block;margin:8px 0;font-family:Manrope,sans-serif;font-size:1.2rem;letter-spacing:.08em}
.pass-card-bottom small{color:rgba(255,255,255,.44)}
.pass-balance{text-align:right}
.pass-balance strong{font-size:clamp(2rem,4vw,3.3rem);letter-spacing:-.05em;color:#e8ffa2}
.pass-action-row{display:flex;gap:10px;flex-wrap:wrap}
.pass-action{min-height:48px;padding:0 19px;border:1px solid rgba(255,255,255,.14);border-radius:15px;background:rgba(255,255,255,.06);color:#fff;font-weight:800;cursor:pointer}
.pass-action.primary{border-color:#d9ff57;background:#d9ff57;color:#090c08}
.pass-action:hover:not(:disabled){transform:translateY(-2px)}
.pass-action:disabled{opacity:.42;cursor:not-allowed}
.pass-grid-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(310px,.65fr);gap:18px}
.pass-block{padding:24px;border:1px solid rgba(255,255,255,.1);border-radius:26px;background:rgba(255,255,255,.035)}
.pass-block-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:18px}
.pass-block-heading span{color:#8dc8ff;font-size:.66rem;font-weight:800;letter-spacing:.17em}
.pass-block-heading h3{margin:5px 0 0;font-size:1.45rem}
.pass-block-heading small{max-width:250px;color:rgba(255,255,255,.42);text-align:right}
.pass-empty-ledger{display:grid;place-items:center;min-height:220px;text-align:center;border:1px dashed rgba(255,255,255,.12);border-radius:20px;color:rgba(255,255,255,.48)}
.pass-empty-ledger span{font-size:2.2rem;color:#d9ff57}
.pass-transaction{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.pass-transaction:last-child{border-bottom:0}
.pass-transaction-copy strong{display:block}.pass-transaction-copy span{color:rgba(255,255,255,.46);font-size:.8rem}
.pass-transaction-amount{font-weight:900}.pass-transaction-amount.credit{color:#d9ff57}.pass-transaction-amount.debit{color:#ff9b8d}
.pass-security-list{display:grid;gap:8px}
.pass-security-list article{display:grid;grid-template-columns:42px 1fr;gap:13px;padding:14px;border-radius:17px;background:rgba(255,255,255,.035)}
.pass-security-icon{display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(217,255,87,.22);border-radius:13px;color:#d9ff57}
.pass-security-list strong{display:block}.pass-security-list p{margin:5px 0 0;color:rgba(255,255,255,.47);font-size:.82rem;line-height:1.5}
.pass-qr-modal{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:20px}
.pass-qr-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.77);backdrop-filter:blur(15px)}
.pass-qr-card{position:relative;z-index:1;width:min(440px,100%);padding:34px;border:1px solid rgba(255,255,255,.16);border-radius:30px;background:linear-gradient(145deg,#141914,#080b09);box-shadow:0 40px 120px rgba(0,0,0,.7);text-align:center}
.pass-qr-card h2{margin:6px 0 9px;font-size:2rem}.pass-qr-card p{color:rgba(255,255,255,.55);line-height:1.6}
.pass-qr-close{position:absolute;right:14px;top:12px;width:36px;height:36px;border:1px solid rgba(255,255,255,.12);border-radius:50%;background:rgba(255,255,255,.06);color:#fff;font-size:1.3rem;cursor:pointer}
.pass-qr-code{display:grid;place-items:center;width:210px;height:210px;margin:24px auto 16px;padding:15px;border-radius:24px;background:#fff}
.pass-qr-code canvas,.pass-qr-code img{width:180px!important;height:180px!important}
.pass-qr-card>strong{display:block;font-family:Manrope,sans-serif;font-size:1.15rem;letter-spacing:.13em}
.pass-qr-card>small{display:block;margin-top:10px;color:rgba(255,255,255,.42)}
@media(max-width:850px){.pass-grid-layout{grid-template-columns:1fr}.pass-page-heading{align-items:flex-start;flex-direction:column}.pass-block-heading{align-items:flex-start;flex-direction:column}.pass-block-heading small{text-align:left}.pass-card-member{margin:58px 0 48px}}
@media(max-width:600px){.pianoland-pass-card{min-height:410px;padding:22px;border-radius:27px}.pass-card-bottom{align-items:flex-start;flex-direction:column}.pass-balance{text-align:left}.pass-card-member h3{font-size:2.25rem}.pass-action{flex:1 1 100%}}
@media(prefers-reduced-motion:reduce){.pass-card-shimmer,.pass-loading span{animation:none}}

/* Venue account-linked passes */
.venue-linked-passes{margin:22px 0;padding:20px;border:1px solid rgba(255,255,255,.09);border-radius:22px;background:rgba(255,255,255,.035)}
.venue-linked-pass-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:14px}.venue-linked-pass-card{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:18px;border-radius:18px;background:linear-gradient(135deg,rgba(204,255,51,.1),rgba(255,255,255,.035));border:1px solid rgba(204,255,51,.17)}.venue-linked-pass-card span{font-size:.7rem;letter-spacing:.12em;color:#cfff42}.venue-linked-pass-card h4{margin:4px 0;font-size:1rem}.venue-linked-pass-card small{color:#aab0bc}.venue-linked-pass-balance{text-align:right}.venue-linked-pass-balance strong{display:block;margin-top:6px;font-size:1.15rem}@media(max-width:600px){.venue-linked-passes{padding:15px;margin:16px 0}.venue-linked-pass-list{grid-template-columns:1fr}.venue-linked-pass-card{padding:15px}}

/* Sprint 3.4 three-tier Pianoland Pass */
.pianoland-pass-card.pass-tier-silver {
  background:
    radial-gradient(circle at 87% 10%, rgba(255,255,255,.38), transparent 24%),
    linear-gradient(135deg, #525861 0%, #191d24 48%, #767d86 100%);
  border-color: rgba(236,242,249,.4);
}

.pianoland-pass-card.pass-tier-silver .pass-card-glow-one { background:#dce4eb; }
.pianoland-pass-card.pass-tier-silver .pass-card-glow-two { background:#68737f; }
.pianoland-pass-card.pass-tier-silver .pass-balance strong { color:#f0f5f8; }
.pianoland-pass-card.pass-tier-silver .pass-wordmark img { background:#e5ebef; }

.pianoland-pass-card.pass-tier-vip {
  background:
    linear-gradient(125deg, rgba(255,255,255,.08), transparent 30%),
    radial-gradient(circle at 85% 15%, rgba(53,229,255,.42), transparent 28%),
    radial-gradient(circle at 18% 84%, rgba(255,67,215,.33), transparent 30%),
    linear-gradient(135deg, #07141c 0%, #20102e 48%, #09242b 100%);
  border-color: rgba(124,237,255,.48);
}

.pianoland-pass-card.pass-tier-vip::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:.5;
  background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.17) 33%,transparent 46%,rgba(74,227,255,.13) 62%,transparent 75%);
  background-size:220% 100%;
  animation:vip-hologram 8s linear infinite;
}

.pianoland-pass-card.pass-tier-vip .pass-card-glow-one { background:#45e8ff; }
.pianoland-pass-card.pass-tier-vip .pass-card-glow-two { background:#ff43d7; }
.pianoland-pass-card.pass-tier-vip .pass-balance strong { color:#9af5ff; }
.pianoland-pass-card.pass-tier-vip .pass-wordmark img { background:#9af5ff; }

@keyframes vip-hologram {
  from { background-position:200% 0; }
  to { background-position:-20% 0; }
}

.pass-tier-showcase {
  margin: 24px 0;
  padding: 24px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 26px;
  background: rgba(255,255,255,.035);
}

.pass-tier-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}

.pass-tier-preview {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 205px;
  padding: 20px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 21px;
  background: linear-gradient(145deg,#111711,#080b09);
  opacity: .68;
}

.pass-tier-preview.silver {
  background: linear-gradient(145deg,#646b74,#171b20);
}

.pass-tier-preview.vip {
  background:
    radial-gradient(circle at 85% 10%,rgba(66,224,255,.38),transparent 35%),
    radial-gradient(circle at 10% 90%,rgba(250,77,220,.25),transparent 35%),
    linear-gradient(145deg,#11152a,#21102c);
}

.pass-tier-preview.current {
  opacity: 1;
  border-color: rgba(217,255,87,.64);
  box-shadow: inset 0 0 0 1px rgba(217,255,87,.15);
}

.pass-tier-preview.included {
  opacity: .85;
}

.pass-tier-preview-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.pass-tier-preview-top span,
.pass-tier-preview-top strong {
  font-size:.65rem;
  font-weight:900;
  letter-spacing:.12em;
}

.pass-tier-preview-top span { color:rgba(255,255,255,.58); }
.pass-tier-preview-top strong {
  padding:6px 8px;
  border-radius:999px;
  background:rgba(0,0,0,.32);
  color:#fff;
}

.pass-tier-preview.current .pass-tier-preview-top strong {
  background:#d9ff57;
  color:#080b08;
}

.pass-tier-preview h4 {
  margin:48px 0 8px;
  font:700 1.45rem Manrope,sans-serif;
}

.pass-tier-preview p {
  margin:0;
  color:rgba(255,255,255,.62);
  font-size:.82rem;
  line-height:1.55;
}

.pass-tier-notice {
  margin:16px 2px 0;
  color:rgba(255,255,255,.45);
  font-size:.78rem;
  line-height:1.55;
}

@media(max-width:850px) {
  .pass-tier-grid { grid-template-columns:1fr; }
  .pass-tier-preview { min-height:175px; }
  .pass-tier-preview h4 { margin-top:34px; }
}

@media(prefers-reduced-motion:reduce) {
  .pianoland-pass-card.pass-tier-vip::after { animation:none; }
}
