/* RavePin after-party flyers (sample, Nov 2 2026) — loaded after theme32.css. Layout A = .fl-a (banner), B = .fl-b (thumbnail). */
.card.party{overflow:hidden}
.fl-banner,.fl-thumb{position:relative;display:block;padding:0;border:0;cursor:zoom-in;overflow:hidden;background:#0b0b0f;-webkit-tap-highlight-color:transparent;touch-action:manipulation;isolation:isolate}
.fl-banner::before,.fl-thumb::before{content:"";position:absolute;inset:-24px;background:var(--fl) center/cover no-repeat;filter:blur(18px) saturate(1.25) brightness(.55);transform:scale(1.1);z-index:-1}
.fl-banner img,.fl-thumb img{display:block;width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none}
/* A: big flyer banner across the top of the card */
.fl-a .fl-banner{margin:-14px -14px 12px;width:calc(100% + 28px);height:236px;border-radius:21px 21px 0 0;border-bottom:1px solid rgba(255,255,255,.08)}
.fl-a .fl-banner.fl-artist img{object-fit:cover}
.fl-hint{position:absolute;right:10px;bottom:10px;font:500 11px/1 var(--sans,system-ui);letter-spacing:.06em;color:#fff;background:rgba(10,10,14,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.18);padding:7px 10px 7px 26px;border-radius:99px}
.fl-hint::before{content:"";position:absolute;left:9px;top:50%;width:11px;height:11px;margin-top:-5.5px;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M15%203h6v6%22%20/%3E%3Cpath%20d%3D%22m21%203-7%207%22%20/%3E%3Cpath%20d%3D%22m3%2021%207-7%22%20/%3E%3Cpath%20d%3D%22M9%2021H3v-6%22%20/%3E%3C/svg%3E") center/contain no-repeat}
/* B: compact flyer thumbnail on the left, text on the right */
.fl-b .fl-row{display:flex;gap:12px;align-items:flex-start}
.fl-b .fl-txt{flex:1;min-width:0}
.fl-b .fl-thumb{flex:none;width:88px;height:110px;border-radius:12px;border:1px solid rgba(255,255,255,.12);box-shadow:0 6px 14px -8px rgba(0,0,0,.8)}
.fl-b .fl-thumb.fl-artist img{object-fit:cover}
.fl-exp{position:absolute;right:5px;bottom:5px;width:22px;height:22px;border-radius:50%;background:rgba(10,10,14,.6) url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M15%203h6v6%22%20/%3E%3Cpath%20d%3D%22m21%203-7%207%22%20/%3E%3Cpath%20d%3D%22m3%2021%207-7%22%20/%3E%3Cpath%20d%3D%22M9%2021H3v-6%22%20/%3E%3C/svg%3E") center/12px no-repeat;border:1px solid rgba(255,255,255,.2)}
.fl-exp{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
/* no flyer + no artist photo: coloured card with the party's name (pink→purple only) */
.fl-none{display:flex;align-items:center;justify-content:center;text-align:center;padding:12px;background:linear-gradient(135deg,hsl(var(--h1) 70% 42%),hsl(var(--h2) 65% 28%));color:#fff;font:600 15px/1.15 var(--serif,serif)}
.fl-a .fl-none{margin:-14px -14px 12px;height:120px;border-radius:21px 21px 0 0;font-size:22px}
.fl-b .fl-none{flex:none;width:88px;height:110px;border-radius:12px;font-size:12px}
/* full-screen flyer viewer (only this zooms; the app stays at 1x) */
.flv{position:fixed;inset:0;z-index:2400;background:rgba(6,6,10,.94);display:flex;flex-direction:column;opacity:0;transition:opacity .18s ease}
.flv.in{opacity:1}
.flv-bg{position:absolute;inset:-40px;background:var(--fl) center/cover no-repeat;filter:blur(40px) brightness(.35) saturate(1.2);z-index:-1}
.flv-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none;padding:calc(env(safe-area-inset-top) + 58px) 10px calc(env(safe-area-inset-bottom) + 96px)}
.flv-img{max-width:100%;max-height:100%;object-fit:contain;transform-origin:50% 50%;border-radius:6px;box-shadow:0 20px 60px -20px rgba(0,0,0,.9);will-change:transform;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.flv-top{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;gap:10px;padding:calc(env(safe-area-inset-top) + 10px) 12px 10px 18px;background:linear-gradient(180deg,rgba(6,6,10,.75),rgba(6,6,10,0));pointer-events:none}
.flv-name{flex:1;min-width:0;color:#fff;font:600 15px/1.25 var(--sans,system-ui);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flv-x{pointer-events:auto;flex:none;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(20,20,26,.6);color:#fff;font-size:17px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);touch-action:manipulation}
.flv-bot{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 16px calc(env(safe-area-inset-bottom) + 14px);background:linear-gradient(0deg,rgba(6,6,10,.8),rgba(6,6,10,0));pointer-events:none}
.flv-tix{pointer-events:auto;min-width:200px;text-align:center;text-decoration:none}
.flv-cr{font:400 11px/1.2 var(--sans,system-ui);color:rgba(255,255,255,.6);letter-spacing:.04em}
body.flv-on{overflow:hidden}

/* combined preview (Nov 2): light look (theme C by day) — keep the thumbnail edge visible on ivory */
html.th-light .fl-b .fl-thumb{border-color:rgba(60,20,70,.16);box-shadow:0 6px 14px -8px rgba(60,20,70,.45)}
