/* Photographic faces. Supporting content lives in the accessible detail dialog. */
.card,.cinema{--halo:#d7e8dc;--rarity-light:#d7e8dc}
:is(.card,.cinema)[data-rarity=uncommon]{--halo:#9ddeaf;--rarity-light:#b3edbd}
:is(.card,.cinema)[data-rarity=rare]{--halo:#92cafa;--rarity-light:#b1daff}
:is(.card,.cinema)[data-rarity=super_rare]{--halo:#c5a3ee;--rarity-light:#e1c6ff}
:is(.card,.cinema)[data-rarity=epic]{--halo:#edaed8;--rarity-light:#ffc5e9}
:is(.card,.cinema)[data-rarity=mythic]{--halo:#f0ad76;--rarity-light:#ffd0a4}
:is(.card,.cinema)[data-rarity=legendary]{--halo:#efca79;--rarity-light:#ffe3a3}
.card{border:0;border-radius:13px;background:transparent;box-shadow:none;overflow:visible;transform:none;transition:none}
.card:before,.card:after{display:none}
.card-portrait{position:relative;aspect-ratio:5/7;isolation:isolate;overflow:hidden;border-radius:13px;background:#173e35;box-shadow:inset 0 0 0 1px #fff5,0 18px 28px -22px #081e26aa}
.card-portrait:after{content:'';position:absolute;inset:0;border:1px solid #ffffff4d;border-bottom:2px solid var(--halo);border-radius:inherit;pointer-events:none}
.card-portrait>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.card-shade{position:absolute;inset:0;background:linear-gradient(180deg,#07181150,transparent 30%,#07181115 42%,#071811c9 77%,#071811fa)}
.card-engraving{position:absolute;top:17px;left:17px;right:17px;display:flex;align-items:center;justify-content:space-between;color:#fff;font-size:9px;letter-spacing:2px;text-shadow:0 1px 6px #000}
.rarity-symbol{font-size:23px;color:var(--rarity-light)}
.card .card-copy{position:absolute;bottom:22px;left:18px;right:18px;padding:0;color:#fff}
.card .card-country{font-size:10px;text-transform:uppercase;letter-spacing:1.6px;color:#eee;margin:0;line-height:1.5;overflow-wrap:anywhere}
.card .card-copy h3{font:400 clamp(22px,2vw,30px)/1.12 Georgia,serif;letter-spacing:-.5px;margin:11px 0 15px;color:#fff;overflow-wrap:anywhere}
.card .card-copy .badge{display:flex;align-items:center;gap:8px;border:0;min-height:0;padding:0;font-size:10px;letter-spacing:1.5px;font-weight:500;color:var(--rarity-light)}
.card .badge:before{content:'';display:block;width:22px;height:2px;background:var(--rarity-light);flex-shrink:0}
.card-footer{padding:8px 2px 0;display:flex;flex-direction:column;gap:2px}
.card .card-footer .state{font-size:11px;padding:0;margin:5px 0;background:none;color:var(--muted);line-height:1.5}
.card-footer .inspect-card{border:0;padding:4px 0;min-height:44px;font-size:12px;color:var(--ink);width:auto;align-self:start}
.card-glare{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at var(--light-x,38%) var(--light-y,25%),#fff4,transparent 65%);mix-blend-mode:screen;opacity:0;transition:opacity .3s}
[data-effects=rich] .finish-active .card-glare{opacity:.55}
@media(hover:hover){.card:has(.inspect-card:hover){transform:none;box-shadow:none}.card:has(.inspect-card:hover) .card-portrait{box-shadow:0 18px 30px -18px #081e2670}}
.card-odds{font-size:12px;line-height:1.7;color:var(--muted);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.album-members li[data-rarity]{border-inline-start:3px solid var(--rarity);padding:9px;background:color-mix(in srgb,var(--rarity) 5%,var(--surface));border-radius:0 7px 7px 0}
.album-member-copy{min-width:0}.album-member-copy>span{display:block}.album-rarity{color:var(--rarity);font-size:10px;font-weight:700;margin-top:4px}.album-placeholder{color:var(--rarity);border:1px dashed var(--rarity)}
.sound-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px}.sound-controls button{font-size:12px}.sound-controls label{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted)}.sound-controls input{width:100px;padding:0;accent-color:var(--accent)}#sound-status{font-size:12px;color:var(--muted)}
.reveal-status{font-size:13px;color:var(--muted);text-align:center;min-height:20px}.reveal-status:empty{display:none}
#reveal-cards.sequential{display:grid;grid-template-columns:minmax(0,300px);justify-content:center;padding:38px 24px 18px;border-radius:18px;background:radial-gradient(ellipse at 50% 42%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 68%),var(--wash);min-height:540px;position:relative;overflow:hidden}
#reveal-cards.sequential.is-suspense{display:block;padding:0}
.sequential>.card{width:100%;align-self:center}.sequential .card-copy h3{font-size:30px}.sequential .card-footer{text-align:center;align-items:center}.sequential .inspect-card{align-self:center}
.reveal-navigation{display:flex;justify-content:center;margin-top:20px}.reveal-navigation:has([hidden]){display:none}.reveal-navigation button{min-width:230px}
#dialog-card .card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;padding:24px;border:0;box-shadow:none;background:none}
#dialog-card .card-portrait{aspect-ratio:auto;height:fit-content;border:0;background:var(--wash);box-shadow:none;position:sticky;top:90px}
#dialog-card .card-portrait>img{position:static;width:100%;height:auto;object-fit:contain}
#dialog-card .card-portrait:after,#dialog-card .card-copy,#dialog-card .card-shade{display:none}
#dialog-card .card-information{min-width:0}#dialog-card .card-information h3{font:20px Georgia,serif}
#dialog-card .story{font-size:14px;line-height:1.75}#dialog-card .detail-rarity{font-size:12px;color:var(--rarity);font-weight:650}
#dialog-card .gps,#dialog-card .place-tag{font-size:12px}#dialog-card details{display:block}#dialog-card .place-tag{padding:5px 8px;border-radius:20px}
.detail-albums{display:flex;gap:7px;flex-wrap:wrap}.detail-albums button{font-size:12px;padding:8px 10px}
/* Original finite light choreography, ported from the accepted study. */
.cinema{position:relative;display:grid;place-items:center;min-height:540px;padding:38px 24px 82px;overflow:hidden;isolation:isolate;perspective:1200px}
.cinema-object{width:min(300px,100%);aspect-ratio:5/7;position:relative;perspective:1300px;z-index:3}
.cinema-flight,.cinema-turn{position:absolute;inset:0;transform-style:preserve-3d}
.cinema-front,.cinema-back{position:absolute;inset:0;backface-visibility:hidden;border-radius:13px;overflow:hidden;background:#173e35}
.cinema-front .card{width:100%;height:100%}.cinema-front .card-footer{display:none}.cinema-front .card-portrait{height:100%}
.cinema-back{transform:rotateY(180deg);display:flex;align-items:center;justify-content:center;gap:20px;flex-direction:column;background:radial-gradient(ellipse at 70% 20%,#305d4a,#123a30 70%);border:1px solid #bfa878;color:#f2e4bd}
.cinema-back:after{content:'';position:absolute;inset:11px;border:1px solid #d1bd8045;border-radius:6px;pointer-events:none}.cinema-back:before{content:'';position:absolute;width:350px;height:350px;border:1px solid #d1bd8030;border-radius:50%;transform:rotate(-35deg) scaleX(.5)}.cinema-back strong{font:25px Georgia,serif;letter-spacing:3px}.cinema-back span{font-size:46px;color:#e4c887}
.cinema-night{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 48%,#182424,#070d13 72%);opacity:0;pointer-events:none;z-index:0}
.cinema-aura{position:absolute;z-index:1;width:680px;max-width:150%;height:600px;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--halo) 75%,transparent),color-mix(in srgb,var(--halo) 25%,transparent) 30%,transparent 66%);mix-blend-mode:screen;opacity:0;pointer-events:none}
.cinema-rays{position:absolute;z-index:1;inset:-40%;background:repeating-conic-gradient(from 13deg at 50% 50%,transparent 0deg 12deg,color-mix(in srgb,var(--halo) 23%,transparent) 16deg,transparent 20deg 40deg);mask-image:radial-gradient(ellipse,transparent 8%,#000 24%,transparent 65%);filter:blur(3px);opacity:0;pointer-events:none}
.cinema-ring{position:absolute;z-index:2;width:min(380px,85%);aspect-ratio:1;border:1px solid var(--halo);border-radius:50%;box-shadow:0 0 18px var(--halo),inset 0 0 14px color-mix(in srgb,var(--halo) 50%,transparent);opacity:0;pointer-events:none}
.cinema-dust{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden}.cinema-mote{position:absolute;left:50%;top:50%;border-radius:50%;background:#fff6d8;box-shadow:0 0 8px var(--halo);opacity:0}.cinema-bokeh{filter:blur(2px);background:var(--halo);box-shadow:none}
.cinema-bloom{position:absolute;inset:-2px;border:1px solid var(--halo);border-radius:15px;box-shadow:0 0 5px #fff6da,0 0 18px var(--halo),0 0 42px color-mix(in srgb,var(--halo) 70%,transparent);opacity:0;pointer-events:none}
.cinema-rim{position:absolute;inset:-2px;border-radius:15px;padding:2px;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;overflow:hidden;opacity:0;pointer-events:none}.cinema-rim:before{content:'';position:absolute;inset:-80%;background:conic-gradient(from 35deg,transparent 5%,var(--halo) 17%,#fffde8 24%,transparent 30% 54%,var(--halo) 64%,#fff 70%,transparent 78%)}
.cinema-flare{position:absolute;left:-48%;top:24%;width:196%;height:24%;background:radial-gradient(ellipse,#fffce9 0%,color-mix(in srgb,var(--halo) 80%,transparent) 5%,transparent 60%);mix-blend-mode:screen;opacity:0;pointer-events:none;filter:blur(1px)}.cinema-flare:after{content:'';position:absolute;inset:43% 0;background:linear-gradient(90deg,transparent,#fff2b388,#fffcec,#fff2b388,transparent);filter:blur(2px)}
.cinema-foil{position:absolute;inset:0;border-radius:13px;background:linear-gradient(118deg,transparent 15%,#e8d1ff14 30%,#c6edff38 40%,#ffedb85c 47%,#ffffffa8 50%,#ddc7ff3d 54%,transparent 67%);background-size:240% 100%;mix-blend-mode:screen;opacity:0;pointer-events:none}
[data-effects=static] .card-glare{display:none}
@media(max-width:760px){.card .card-copy{left:13px;right:13px;bottom:17px}.card .card-copy h3{font-size:21px;margin:8px 0 12px}.card .card-country{font-size:9px;letter-spacing:1px}.card .card-copy .badge{font-size:9px;letter-spacing:.6px}.card-engraving{left:13px;right:13px;top:12px;font-size:8px;letter-spacing:1px}.card-footer .state{font-size:10px}.card-footer .inspect-card{font-size:11px}.sequential .card-copy h3{font-size:29px}.sequential .card-copy{left:21px;right:21px;bottom:24px}.sequential .card-country{font-size:11px}.sequential .badge{font-size:11px}.cinema,#reveal-cards.sequential{min-height:490px}#dialog-card .card{grid-template-columns:1fr;padding:18px;gap:12px}#dialog-card .card-portrait{position:relative;top:auto}#dialog-card .card-portrait>img{max-height:45dvh}.sound-controls{gap:10px}}
@media(max-width:360px){.cards{grid-template-columns:1fr}.card .card-copy h3{font-size:29px}.card .card-country{font-size:11px}.card .card-copy{left:20px;right:20px;bottom:24px}}