/* Physical foil wrapper: sealed edges, side thickness, embossed print and crinkles. */
/* Rare-card reveal: one soft burst, no strobing. */
#referral-panel{margin:25px 0;padding:24px;border:1px solid #d9fb8b35;border-radius:18px;background:linear-gradient(125deg,#d9fb8b0c,#9770ed13)}#referral-panel[hidden]{display:none}#referral-panel h2{font-size:24px}#referral-panel p{font-size:13px;color:#cec8da;line-height:1.6}#referral-link{max-width:620px}#referral-copy{margin-top:12px}
#admin-users{display:grid;gap:10px;margin:18px 0 40px}#admin-user-search{max-width:600px}.admin-user-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;text-align:left;padding:18px;border:1px solid #ffffff25;border-radius:14px;background:#ffffff07;color:#fff}.admin-user-row:hover{border-color:#d9fb8b}.admin-user-row span{display:grid;gap:7px;font-size:12px}.admin-user-row progress{width:100%;height:8px;accent-color:#d9fb8b}#user-albums{width:min(950px,94vw);max-height:90dvh;overflow:auto;padding:30px;box-sizing:border-box}#user-albums select{padding:12px;background:#242033;color:white;border:1px solid #ffffff30;border-radius:9px}#user-albums-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:18px;background:linear-gradient(90deg,#33263f,#493553 49%,#24182e 50%,#40304a);border-radius:16px}#user-albums-grid .slot{min-width:0;aspect-ratio:63/88}#user-albums-grid .empty strong{font-size:12px;overflow-wrap:anywhere}#user-albums-grid img{width:100%;height:100%;object-fit:contain}#user-albums-grid .empty span{font-size:10px}@media(max-width:600px){.admin-user-row{grid-template-columns:1fr;gap:10px}#user-albums{padding:28px 12px 12px}#user-albums-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:8px}#user-albums .album-controls{gap:7px;font-size:11px}#user-albums .album-controls button{padding:9px;font-size:11px}}
#studio .reference-pack.onepiece-pack#pack{height:auto;aspect-ratio:590/970}
#grant-set{display:block;width:100%;box-sizing:border-box;margin-top:8px;padding:13px 14px;border:1px solid #ffffff30;border-radius:10px;background:#242033;color:#fff;font:inherit;color-scheme:dark}#grant-set:focus-visible{outline:2px solid #d9fb8b;outline-offset:3px}
#reveal .card.glorious{animation:gloriousArrival 1.35s cubic-bezier(.18,.7,.25,1) both;transform-style:preserve-3d}
#reveal .card.glorious.leaving{animation:none}
.rare-flare{position:absolute;inset:0;z-index:4;pointer-events:none;border-radius:inherit;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#fff9, #ffe8a644 25%,transparent 65%);opacity:0;animation:rareBurst 1.5s ease-out both}
.rare-flare:before{content:'';position:absolute;inset:-40%;background:linear-gradient(115deg,transparent 38%,#ffefa655 45%,#fff 50%,#bffaff66 54%,transparent 62%);animation:rareSweep 1.4s ease-out both}
.rare-flare:after{content:'';position:absolute;inset:6%;background:radial-gradient(circle at 15% 20%,#fff 0 1px,transparent 3px),radial-gradient(circle at 85% 35%,#ffe392 0 2px,transparent 4px),radial-gradient(circle at 30% 80%,#fff 0 1px,transparent 3px),radial-gradient(circle at 80% 85%,#a6f5ff 0 2px,transparent 4px);animation:rareSparks 1.6s ease-out both}
@keyframes gloriousArrival{0%{transform:perspective(1000px) rotateY(-14deg) rotateX(6deg) scale(.9);filter:drop-shadow(0 0 0 #fbdc88)}38%{transform:perspective(1000px) rotateY(7deg) rotateX(-3deg) scale(.97);filter:drop-shadow(0 0 20px #fbdc88aa)}70%{transform:perspective(1000px) rotateY(-3deg) scale(.99)}100%{transform:none;filter:drop-shadow(0 0 6px #fbdc8840)}}
@keyframes rareBurst{0%{opacity:0}25%{opacity:.85}100%{opacity:0}}
@keyframes rareSweep{from{transform:translateX(-80%)}to{transform:translateX(80%)}}
@keyframes rareSparks{0%{transform:scale(.6);opacity:0}35%{opacity:1}100%{transform:scale(1.1);opacity:0}}
@media(prefers-reduced-motion:reduce){#reveal .card.glorious{animation:none}.rare-flare{display:none}}
.set-picker{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:20px 0 0;font-size:12px}.set-picker select{font:inherit;color:#fff;background:#242033;border:1px solid #ffffff30;border-radius:10px;padding:11px;max-width:100%}.set-picker span{color:var(--muted);font-size:11px}.onepiece-pack .pack-artwork{width:169.492%!important;height:103.093%!important;left:-34.576%!important;top:-1.031%!important}.onepiece-pack .foil{background:#dfad20}.onepiece-stage .emerging-card{background:#162a4a url('op-card-back.webp') center/100% 100% no-repeat;border:0}.onepiece-stage .emerging-card:after{content:'';display:grid;place-items:center;font-weight:800;font-size:22px;color:#c6b88c;letter-spacing:1px}.onepiece-stage .opening-halo{background:radial-gradient(circle,#edd37988,#dcac1622 40%,transparent 70%)}@media(max-width:760px){.set-picker{padding-top:12px;gap:6px}.set-picker label{font-size:10px}.set-picker select{flex:1;padding:9px;font-size:11px}.set-picker span{width:100%;text-align:center;font-size:10px}.onepiece-stage .emerging-card:after{font-size:15px}}
nav [hidden]{display:none!important}#grant-form{max-width:600px;padding:25px;background:#ffffff08;border:1px solid #ffffff1a;border-radius:18px;display:grid;gap:18px}#grant-form p{margin:0;font-size:13px}#grant-preview{color:#d9fb8b}#grant-result{overflow-wrap:anywhere}#grant-history{max-width:800px}@media(max-width:480px){nav button{font-size:11px!important;padding:9px 5px!important}#grant-form{padding:18px}}
/* Keep the card and its controls inside the actual mobile visual viewport. */
.account-actions{display:flex;gap:8px;align-items:center}.account-actions [hidden]{display:none!important}#create-account{background:#d9fb8b;color:#222b14;border:0;font-weight:700}.mobile-open-controls{display:none}
@media(max-width:760px){#studio .stage{overflow:clip}body{overflow-x:clip}}
nav button.active{color:var(--lime);background:#d9fb8b0e;box-shadow:inset 0 -2px var(--lime)}#mode-label{margin-top:35px}#pack.unavailable{opacity:.5;cursor:default;animation:none}#pack.ready{cursor:pointer}@media(max-width:480px){nav{gap:0}nav button{padding:10px 9px;font-size:12px}}
#reveal #card-wrap{width:min(340px,68vw,calc((100dvh - 270px)*.718));aspect-ratio:63/88}#reveal .card{height:100%;width:100%;background:transparent;border:0;padding:0;border-radius:12px}#reveal .card img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:auto}#reveal .card.holo:after,#reveal .card.reverse:after,#reveal .card.textured:after{opacity:.19;mix-blend-mode:soft-light}#reveal .card.textured:before{opacity:.16}.slot img{object-fit:contain;max-height:100%}#reveal .energy-card:before,#reveal .energy-card:after{display:none}
.stage{isolation:isolate;height:590px;perspective:1400px;overflow:visible}
#pack{width:250px;height:380px;padding:26px 0 22px;border-radius:4px 7px 7px 4px;background:#c8c9d4;filter:none;box-shadow:22px 30px 34px #0007,inset 0 0 8px #fff;transform:rotateY(-16deg) rotateZ(5deg);animation:packBreathe 7s ease-in-out infinite;transition:transform .35s,opacity .3s;z-index:3}
#pack:not(.ready){opacity:1}#pack.ready{animation:none;transform:rotateY(-5deg) rotateZ(0);cursor:crosshair}#pack.cutting{transform:rotateY(0) rotateZ(-1deg) scale(1.04)}
.pack-back{position:absolute;inset:2px;background:linear-gradient(90deg,#787989,#ededf4 20%,#9599aa 75%,#e8e6ef);border-radius:8px;transform:translateZ(-15px);box-shadow:0 0 0 1px #fff4}
.pack-gusset{position:absolute;right:-1px;top:8px;bottom:8px;width:16px;transform-origin:right;transform:rotateY(-90deg);background:linear-gradient(90deg,#e0dfea,#626579,#d6d8e6);border-radius:40%}
.foil{border-radius:12% 10% 11% 8% / 3% 3% 3% 3%;padding:27px 20px 14px;background:radial-gradient(ellipse at 70% 35%,#fff9,transparent 38%),linear-gradient(112deg,#9da6b6 0%,#e4e0db 6%,#fbf4ee 12%,#d4d6e6 18%,#f5e7ed 36%,#efecdf 52%,#dadfe8 68%,#eef7e9 85%,#989eae 98%);box-shadow:inset 5px 0 9px #0003,inset -6px 0 8px #0004,inset 0 2px 3px #fff;transform:translateZ(3px);overflow:hidden}
.foil-creases{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:.7;background:linear-gradient(163deg,transparent 6%,#fff8 6.5%,#41435230 7%,transparent 8%),linear-gradient(23deg,transparent 14%,#fff9 14.4%,#5b566530 15%,transparent 16%),linear-gradient(172deg,transparent 85%,#8a859140 85.5%,#fff9 86%,transparent 87%),linear-gradient(75deg,transparent 89%,#fff9 90%,#5555 91%,transparent 94%),repeating-linear-gradient(91deg,transparent 0 29px,#fff2 30px,transparent 31px 47px)}
.foil:after{z-index:4;background:linear-gradient(110deg,transparent 20%,#ffffffb0 39%,transparent 45%,#dfb9ff66 49%,#97ebf455 54%,transparent 60%);background-size:270% 100%;mix-blend-mode:soft-light}
.foil strong{position:relative;font-size:103px;color:#956278;text-shadow:0 1px 0 #fffc,0 -1px 0 #5b3b6388,1px 2px 1px #fff8,3px 4px 0 #836e8530;filter:drop-shadow(0 5px 5px #79667a22)}
.orb{position:relative;width:91px;height:91px;margin:5px auto 12px;display:grid;place-items:center;border:2px solid #956e9855;border-radius:50%;background:radial-gradient(circle at 35% 25%,#fff9,#c6adc966 60%,#88719c44);box-shadow:inset 0 2px 4px #fff,0 2px 3px #81778b66;font-size:60px;text-shadow:1px 2px #fff9}
.pack-title{font-size:15px;letter-spacing:4px;text-shadow:0 1px #fff}.pack-bottom{margin-top:15px;position:relative;z-index:5}
.pack-top,.pack-bottom-seal{position:absolute;left:0;right:0;height:27px;background:repeating-linear-gradient(90deg,#b6b9c8 0px,#f2f1f6 1px,#aaaebd 2px,#e1e0ea 3px);box-shadow:inset 0 6px 7px #fff6,inset 0 -2px 2px #5555;clip-path:polygon(0 6%,2% 0,4% 6%,6% 0,8% 6%,10% 0,12% 6%,14% 0,16% 6%,18% 0,20% 6%,22% 0,24% 6%,26% 0,28% 6%,30% 0,32% 6%,34% 0,36% 6%,38% 0,40% 6%,42% 0,44% 6%,46% 0,48% 6%,50% 0,52% 6%,54% 0,56% 6%,58% 0,60% 6%,62% 0,64% 6%,66% 0,68% 6%,70% 0,72% 6%,74% 0,76% 6%,78% 0,80% 6%,82% 0,84% 6%,86% 0,88% 6%,90% 0,92% 6%,94% 0,96% 6%,98% 0,100% 6%,100% 100%,0 100%);z-index:6;transform:translateZ(5px)}
.pack-top span{display:block;text-align:center;color:#424153;font-size:8px;letter-spacing:2px;padding-top:9px;font-weight:800}.pack-bottom-seal{bottom:0;transform:rotate(180deg) translateZ(5px);height:22px}.cut{top:26px;z-index:8}
#pack.opened{scale:1;animation:wrapperDrop 2.2s cubic-bezier(.22,.6,.25,1) forwards}
#pack.opened .pack-top{animation:tearSeal 1s ease-out forwards;transition:none}
.opening-halo{position:absolute;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,#eddaff77,#ba86fb22 40%,transparent 70%);opacity:0;pointer-events:none;z-index:0}
.stage.extracting .opening-halo{animation:haloBloom 2s ease-out both}
#emerging-cards{position:absolute;width:205px;height:286px;top:50%;left:50%;transform:translate(-50%,-42%);pointer-events:none;z-index:2;perspective:1300px}
.emerging-card{position:absolute;inset:0;border:0;border-radius:9px;background:#064575 url('card-back.jpg') center/100% 100% no-repeat;box-shadow:0 8px 18px #0006,1px 1px 0 #c2c9da;opacity:0;transform:translateY(35px) scale(.9);backface-visibility:hidden}
.emerging-card:after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff20;background:linear-gradient(120deg,#fff1,transparent 50%);pointer-events:none}
.stage.extracting .emerging-card{animation:cardsExtract 2.35s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i)*65ms)}
.stage.extracting #gesture{color:#dcc5ff}.stage.extracting #emerging-cards{z-index:4}
#card-wrap{position:relative;isolation:isolate}#card-wrap:before,#card-wrap:after{content:'';position:absolute;inset:0;border:1px solid #b6b0c955;border-radius:12px;background:#3c3559;z-index:-1;transform:translate(7px,5px) rotate(3deg)}#card-wrap:before{transform:translate(13px,10px) rotate(5deg);opacity:.6}
.card.leaving{animation:cardAway .32s ease-in forwards}.card{animation:cardArrive .65s cubic-bezier(.16,.8,.22,1) both}#reveal[open]{animation:revealEntrance .5s ease both}
/* A stationary book cover and spine, two independent nine-pocket leaves. */
#binder{max-width:1000px;margin:auto;padding:20px 24px 24px;border-radius:13px 18px 18px 13px;background:linear-gradient(90deg,#261b33,#503b61 48%,#1d1429 50%,#503b61 52%,#261b33);box-shadow:0 28px 50px #0007,inset 0 0 0 5px #1e152a,0 5px 0 #4c3b5a,0 9px 0 #19131f;transform:none;perspective:2200px}
#slots{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:22px;transform:none!important;animation:none!important;transform-style:preserve-3d}
.album-page{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;position:relative;padding:15px 12px 30px;background:linear-gradient(100deg,#332d42,#42374f 85%,#211b2c);border-radius:5px;box-shadow:inset 0 0 0 1px #ffffff16,3px 3px 0 #191422,5px 5px 0 #6a586733;min-width:0;align-content:start}
.album-page.right-page{background:linear-gradient(90deg,#211b2c,#42374f 15%,#332d42)}
.album-page:after{content:attr(data-page);position:absolute;bottom:9px;left:0;right:0;text-align:center;font-size:10px;letter-spacing:2px;color:#a99bb6}.slot{width:100%;margin:0;padding:5px;border-radius:5px;aspect-ratio:.70;background:linear-gradient(125deg,#fff1,#ffffff03);box-shadow:inset 0 1px 1px #fff2,0 3px 4px #0002;overflow:hidden}.slot:after{content:'';position:absolute;inset:0;background:linear-gradient(125deg,#fff0 30%,#ffffff0b 45%,#ffffff02 52%,#fff0 70%);pointer-events:none}.slot.empty{opacity:1;cursor:default;color:#a699b6}.slot.empty strong{color:#a99cbb77}.slot small{z-index:2}.slot:hover{transform:none;background-color:#fff1}.slot img{border-radius:4px}.binder-spine{position:absolute;width:18px;left:calc(50% - 9px);top:20px;bottom:24px;z-index:8;pointer-events:none;background:linear-gradient(90deg,#0f0b1599,#68547066,#0f0b1599);border-radius:3px}.binder-spine:before{content:'';position:absolute;inset:10% -5px;background:repeating-linear-gradient(0deg,transparent 0 25%,#19171e 25.3%,#aaa2b3 25.6%,#ddd8e3 26%,#494051 26.5%,transparent 27% 36%);filter:drop-shadow(0 3px 2px #0008)}
.turn-leaf{position:absolute;top:0;bottom:0;width:calc((100% - 22px)/2);z-index:5;transform-style:preserve-3d;pointer-events:none}.turn-leaf.forward{right:0;transform-origin:left center}.turn-leaf.backward{left:0;transform-origin:right center}.leaf-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex}.leaf-face>.album-page{width:100%;height:100%;box-shadow:0 12px 25px #0007}.leaf-back{transform:rotateY(180deg)}.leaf-face:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0008,transparent 35%,#fff1);opacity:0;animation:leafShade 1.05s ease-in-out}.turn-leaf.forward{animation:turnForward 1.05s cubic-bezier(.32,.08,.28,1) forwards}.turn-leaf.backward{animation:turnBackward 1.05s cubic-bezier(.32,.08,.28,1) forwards}.album-controls button:disabled{cursor:default}
@keyframes packBreathe{0%,100%{transform:rotateY(-16deg) rotateZ(5deg) translateY(0)}50%{transform:rotateY(10deg) rotateZ(2deg) translateY(-12px)}}
@keyframes tearSeal{0%{transform:translateZ(5px)}30%{transform:translate3d(15px,-20px,20px) rotate(-8deg)}100%{transform:translate3d(160px,-155px,65px) rotate(70deg);opacity:0}}
@keyframes wrapperDrop{0%,22%{transform:rotateY(0) rotateZ(0);opacity:1}65%{transform:translateY(90px) rotateX(16deg) rotateZ(-10deg);opacity:1}100%{transform:translateY(145px) rotateX(24deg) rotateZ(-16deg) scale(.86);opacity:0}}
@keyframes cardsExtract{0%,12%{opacity:0;transform:translateY(35px) scale(.9)}24%{opacity:1}55%{opacity:1;transform:translateY(-125px) rotate(calc((var(--i) - 2)*3deg))}80%{opacity:1;transform:translate(calc((var(--i) - 2)*26px),-80px) rotate(calc((var(--i) - 2)*9deg)) scale(1.05)}100%{opacity:0;transform:translate(0,-65px) rotate(0) scale(1.16)}}
@keyframes haloBloom{0%{opacity:0;transform:scale(.5)}45%{opacity:1;transform:scale(1.5)}100%{opacity:0;transform:scale(1.8)}}
@keyframes cardAway{to{opacity:0;transform:translateX(-90px) rotateZ(-16deg) rotateY(-25deg)}}@keyframes cardArrive{from{opacity:0;transform:translateX(25px) rotateY(65deg) scale(.94)}to{opacity:1;transform:none}}@keyframes revealEntrance{from{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:none}}@keyframes turnForward{to{transform:rotateY(-180deg)}}@keyframes turnBackward{to{transform:rotateY(180deg)}}@keyframes leafShade{50%{opacity:1}}
@media(max-width:760px){.stage{height:490px}#pack{width:220px;height:345px}.foil{padding:23px 15px 12px}.foil strong{font-size:87px}.orb{width:75px;height:75px;font-size:49px}.pack-title{font-size:13px}.pack-bottom{font-size:6px}#emerging-cards{width:175px;height:245px}.opening-halo{width:270px;height:270px}#binder{padding:13px 13px 18px 22px;max-width:450px;perspective:1300px}#slots{grid-template-columns:1fr;gap:0}.album-page{padding:12px 10px 27px;gap:8px}.album-page.right-page{display:none}.binder-spine{left:7px;width:11px;top:14px;bottom:18px}.binder-spine:before{inset:10% -2px}.turn-leaf{width:100%}.turn-leaf .right-page{display:grid}.turn-leaf.forward,.turn-leaf.backward{left:0;right:auto;transform-origin:left center}.turn-leaf.backward{animation:mobileBackward 1.05s cubic-bezier(.32,.08,.28,1) forwards}.turn-leaf.backward .leaf-front{transform:rotateY(180deg)}.turn-leaf.backward .leaf-back{transform:none}.slot.empty strong{font-size:22px}.album-controls{margin:20px 0}.stage-shadow{bottom:35px}#gesture{bottom:0;max-width:100%}}
@keyframes mobileBackward{from{transform:rotateY(-180deg)}to{transform:rotateY(0)}}
.reference-pack#pack{height:445px;width:250px;padding:0;background:#eae6e2}.reference-pack .foil{padding:0;border:0;border-radius:2px;height:100%;background:#fff}.reference-pack .foil>.pack-kicker,.reference-pack .foil>strong,.reference-pack .foil>.orb,.reference-pack .foil>.pack-title,.reference-pack .foil>.pack-bottom{display:none}.pack-artwork{position:absolute!important;max-width:none!important;width:239%!important;height:111.5%!important;left:-10.5%;top:-5.8%;user-select:none;pointer-events:none;object-fit:fill}.reference-pack .foil:before{content:'';position:absolute;inset:0;z-index:5;pointer-events:none;box-shadow:inset 5px 0 9px #0004,inset -6px 0 10px #0004,inset 0 2px 4px #fff9;border-radius:3px;background:linear-gradient(100deg,#0001,transparent 9%,#fff2 16%,transparent 21%,transparent 82%,#fff4 88%,#0002 98%)}.reference-pack .foil-creases{z-index:6;opacity:.38}.reference-pack .foil:after{z-index:7}.reference-pack .pack-top{height:15px}.reference-pack .pack-top span{display:none}.reference-pack .pack-bottom-seal{height:12px}.reference-pack .cut{top:16px}.reference-pack .pack-gusset{z-index:-1}.reference-pack .pack-top{background:repeating-linear-gradient(90deg,#a5a5a4 0,#dedacf 1px,#aaa89d 2px,#d5d1c8 3px)}
@media(max-width:760px){.reference-pack#pack{width:205px;height:365px}.stage{height:510px}#binder{touch-action:pan-y;background:linear-gradient(90deg,#21162d,#493553 12%,#302139)}.turn-leaf .slot{pointer-events:none}}
@media(prefers-reduced-motion:reduce){.turn-leaf,.emerging-card,.opening-halo{animation:none!important}.stage.extracting #pack{opacity:0}#reveal[open]{animation:none}*{scroll-behavior:auto!important}}
@media(max-width:760px){header{padding:12px 4%;gap:10px}.brand{font-size:12px;letter-spacing:1px}.brand span{font-size:9px}.account-actions{margin-left:auto;gap:5px}.account-actions button,#account{font-size:10px;padding:9px 8px;border-radius:9px}nav{justify-content:space-between;gap:3px}nav button{flex:1;padding:10px 7px;font-size:12px}main{padding:0 4%}#studio{padding:12px 0 25px;gap:0;min-height:0;grid-template-columns:minmax(0,1fr)}#studio .intro{padding:0}#studio .intro>h1,#studio .intro>p:not(#mode-label):not(#quota),#studio .intro>.eyebrow{display:none}#studio .intro #mode-label{display:block;margin:5px 0;font-size:10px;letter-spacing:2px}#studio #quota{font-size:11px;line-height:1.5;margin:5px auto 0;max-width:320px}#studio .stage{height:clamp(280px,51svh,430px);margin:0;width:100%}#studio .reference-pack#pack{width:min(205px,42vw,28svh);height:auto;aspect-ratio:250/445}#studio .orbit{width:min(310px,80vw);height:min(310px,80vw)}#studio .stage-shadow{bottom:25px;width:160px}#studio #gesture{bottom:2px;font-size:11px;margin:0;line-height:1.3}#studio #emerging-cards{width:min(172px,36vw,24svh);height:auto;aspect-ratio:63/88}#studio .mobile-open-controls{display:flex;flex-direction:column;align-items:center;gap:9px;margin:17px 0 0}.mobile-open-controls .primary{width:100%;max-width:340px;padding:17px;font-size:16px;border-radius:15px;box-shadow:0 5px 24px #d9fb8b16}.mobile-open-controls span{font-size:10px;color:var(--muted)}#studio .reference-pack#pack.unavailable{opacity:.7}.details{margin-top:10px;padding:18px 0}#auth{width:min(94vw,420px);padding:34px 22px}#auth h2{font-size:24px}#reveal{padding:25px 20px 20px}#reveal #card-wrap{width:min(72vw,calc((100dvh - 245px)*.718));margin-top:15px}#reveal .primary{padding:14px 22px}footer{font-size:9px;padding:20px 4%}}
@media(max-width:760px),(max-height:500px) and (max-width:1000px){
 #reveal[open]{display:grid;grid-template-rows:18px minmax(0,1fr) auto auto 46px auto;gap:7px;width:calc(100vw - 24px);max-width:440px;height:calc(100svh - 24px);height:calc(var(--reveal-vh,100dvh) - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));max-height:780px;padding:20px 16px 14px;margin:auto;overflow:hidden;border-radius:18px;box-sizing:border-box;animation:none}
 #reveal #card-wrap{width:100%;height:100%;min-height:0;min-width:0;max-width:100%;margin:0;aspect-ratio:auto;display:grid;place-items:center;overflow:clip;isolation:isolate}
 #reveal #card-wrap:before,#reveal #card-wrap:after{display:none}
 #reveal #card-wrap .card{height:100%;width:100%;min-height:0;max-width:100%;background:transparent;box-shadow:none;border-radius:0;overflow:hidden}
 #reveal #card-wrap .card img{width:100%;height:100%;object-fit:contain;display:block}
 #reveal #card-wrap .card:before,#reveal #card-wrap .card:after{display:none}
 #reveal h2{font-size:clamp(17px,5vw,23px);line-height:1.15;margin:0;overflow-wrap:anywhere}
 #reveal #card-rarity{font-size:11px;line-height:1.3;margin:0;overflow-wrap:anywhere}
 #reveal #reveal-count{font-size:9px;letter-spacing:2px;padding:0 20px;line-height:18px}
 #reveal #reveal-next{width:100%;height:46px;min-height:46px;padding:10px 14px;margin:0;align-self:end;font-size:14px}
 #reveal #saved-note{font-size:10px;line-height:1.25;margin:0;overflow-wrap:anywhere}
 #reveal .close{top:5px;right:5px;z-index:10;width:32px;height:32px;padding:0}
}
@media(max-height:500px) and (max-width:1000px){#reveal[open]{max-width:700px;grid-template-columns:minmax(0,1fr) minmax(150px,.8fr);grid-template-rows:20px 1fr auto 46px auto;gap:6px 16px}#reveal #card-wrap{grid-column:1;grid-row:1/6}#reveal #reveal-count,#reveal h2,#reveal #card-rarity,#reveal #reveal-next,#reveal #saved-note{grid-column:2}#reveal h2{align-self:end;font-size:20px}}