:root{color-scheme:dark;--ink:#f5f3f9;--muted:#aaa5b7;--violet:#d1b9fb;--rise:32px}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{background:radial-gradient(ellipse at 50% 42%,#191922 0,#0c0d12 46%,#090a0e 85%);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;-webkit-tap-highlight-color:transparent;cursor:pointer}button:focus,a:focus,article:focus,dialog:focus{outline:none}html[data-input="keyboard"] :is(button,a,article):focus-visible{outline:1px solid var(--violet);outline-offset:3px}.screen{height:100vh;height:100dvh;max-width:1240px;margin:auto;padding:16px 32px 10px;display:grid;grid-template-rows:36px minmax(70px,.65fr) 34px minmax(300px,1.2fr) 26px;gap:8px}header{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px}.brand{font-size:27px;line-height:28px;letter-spacing:-.8px;font-weight:600}.brand span{color:#b896e2}.header-note{font-size:10px;color:#787383}.hero{position:relative;min-height:0;text-align:center;isolation:isolate}.hero img{height:100%;width:100%;object-fit:contain;mask-image:linear-gradient(transparent,#000 9%,#000 79%,transparent);animation:float 10s ease-in-out infinite}.ambient{position:absolute;inset:5% 25%;z-index:-1;background:radial-gradient(ellipse,#81649224,transparent 65%)}h1{font-size:27px;line-height:34px;letter-spacing:-.8px;text-align:center;margin:0;font-weight:550}.gallery{display:grid;grid-template-rows:minmax(0,1fr);min-height:0}.package-grid{min-height:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:15px;padding-top:var(--rise);position:relative}.package{position:relative;min-width:0;min-height:0;border:1px solid #9c8bb5;border-radius:20px;background:linear-gradient(150deg,#29233185,#15161be6 67%,#211c2da6);box-shadow:inset 0 1px 0 #e0caff25;isolation:isolate}.package::after{content:'';pointer-events:none;position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 13px #bb9aeb0a}.breakout-art{position:absolute;pointer-events:none;user-select:none;left:0;top:calc(-1 * var(--rise));width:100%;height:calc(57% + var(--rise));object-fit:fill;z-index:1}.copy{position:absolute;left:18px;right:18px;bottom:15px;z-index:2;display:grid;gap:9px}.label{font-size:11px;font-weight:450;letter-spacing:2.5px;text-transform:uppercase;color:#bbb3cb;overflow-wrap:anywhere}.price-row strong{font-size:35px;line-height:1.06;letter-spacing:-1px;font-weight:750;color:#f5f2fb;text-shadow:0 1px 0 #fff4}.credits{display:flex;flex-wrap:wrap;align-items:center;gap:5px 9px;font-size:13px;color:#ebe6f5}.quantity{font-size:11px;color:#c3bbd1}.separator{color:#aaa2b9}.description{color:#a69eb5;font-size:11px;line-height:1.5;min-height:33px}.buy{width:100%;border:1px solid #e1c9ff;border-radius:12px;background:linear-gradient(155deg,#d4c0f3,#aa8ad9 47%,#ceb6ef 87%);color:#170e29;padding:12px 10px;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:space-between;gap:4px;box-shadow:inset 0 2px 4px #fff9,inset 0 -2px 5px #fff6,0 0 0 2px #bd94ee40,0 0 15px #956bdd30;transition:filter .2s,transform .2s}.buy:hover{filter:brightness(1.08)}.buy:active{transform:scale(.985)}.card-payment-note{font-size:8px;color:#958ba7;text-align:center}.package-nav{display:none}footer{display:flex;align-items:center;justify-content:center;color:#9c94ac;font-size:10px;line-height:1.45;text-align:center}footer p{margin:0}dialog{max-width:330px;padding:27px;background:#19171f;color:#eee8f5;border:1px solid #776485;border-radius:22px}dialog::backdrop{background:#000a;backdrop-filter:blur(8px)}dialog h2{font-size:21px;margin:0 0 12px}dialog p{font-size:14px;line-height:1.6;color:#b9afc5}dialog button{background:#d9c8ed;border:0;border-radius:10px;padding:12px 22px;color:#231b2d;width:100%;font:inherit}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media(max-width:850px){.screen{padding:calc(8px + env(safe-area-inset-top)) 12px calc(9px + env(safe-area-inset-bottom));grid-template-rows:36px minmax(70px,.7fr) 30px minmax(320px,1.7fr) 27px;gap:8px;max-width:550px}.brand{font-size:25px}.header-note{font-size:9px}.hero{margin:0 -8px}.hero img{object-fit:cover;object-position:center 43%;mask-image:linear-gradient(transparent,#000 7%,#000 75%,transparent)}h1{font-size:25px;line-height:30px}.gallery{grid-template-rows:minmax(0,1fr) 29px;margin:0 -12px}.package-grid{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x pinch-zoom;padding:var(--rise) 48px 4px;gap:18px}.package-grid::-webkit-scrollbar{display:none}.package{flex:0 0 100%;height:100%;border-radius:23px;scroll-snap-align:center;scroll-snap-stop:always}.copy{left:20px;right:20px;bottom:14px;gap:10px}.label{font-size:13px;letter-spacing:4px}.price-row strong{font-size:43px}.credits{font-size:16px;gap:8px}.quantity{font-size:13px}.description{font-size:12px;min-height:0;line-height:1.5}.buy{font-size:15px;padding:14px 16px;border-radius:13px;margin-top:6px}.card-payment-note{font-size:10px}.package-nav{display:flex;justify-content:center;align-items:center;gap:3px}.package-nav button{border:0;background:transparent;width:30px;height:25px;padding:0;display:flex;align-items:center;justify-content:center}.package-nav button::after{content:'';width:7px;height:7px;border-radius:20px;background:#625c74;box-shadow:inset 0 1px 1px #fff2;transition:width .2s,background .2s}.package-nav button[aria-current=true]::after{width:21px;background:linear-gradient(#e0ccff,#a182d1);box-shadow:0 0 9px #b39cdb60}footer{font-size:9px}}
@media(max-width:850px) and (max-height:620px){:root{--rise:23px}.screen{grid-template-rows:30px minmax(25px,.32fr) 27px minmax(300px,1.8fr) 24px;gap:5px}.brand{font-size:23px;line-height:24px}.header-note{font-size:8px}.hero img{object-fit:contain}h1{font-size:21px;line-height:27px}.gallery{grid-template-rows:minmax(0,1fr) 23px}.copy{left:16px;right:16px;bottom:11px;gap:7px}.label{font-size:11px;letter-spacing:3px}.price-row strong{font-size:34px}.credits{font-size:13px;gap:6px}.quantity{font-size:11px}.description{font-size:10px}.buy{font-size:13px;padding:11px 13px;margin-top:3px}.card-payment-note{font-size:9px}footer{font-size:8px}}
@media(min-width:851px) and (max-height:560px){.screen{grid-template-rows:30px minmax(10px,.25fr) 27px minmax(235px,1fr) 20px;gap:5px;padding-top:8px}h1{font-size:23px;line-height:27px}.copy{bottom:10px;gap:6px;left:13px;right:13px}.label{font-size:9px;letter-spacing:1.5px}.price-row strong{font-size:25px}.credits{font-size:11px}.quantity{font-size:9px}.description{font-size:9px;min-height:27px}.buy{padding:10px 8px;font-size:10px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Natural proportions and space above the frame for the transparent silhouette. */
:root{--rise:48px}.package{container-type:inline-size}.breakout-art{height:auto;top:-28cqw;object-fit:contain;mask-image:linear-gradient(to bottom,#000 0%,#000 67%,transparent 88%)}.art-1 .breakout-art{top:-17cqw}.art-3 .breakout-art{top:-12cqw}
@media(max-width:850px){.screen{grid-template-rows:36px minmax(60px,.6fr) 30px minmax(320px,1.95fr) 27px}}
@media(max-width:850px) and (max-height:620px){:root{--rise:35px}.screen{grid-template-rows:30px minmax(25px,.28fr) 27px minmax(300px,1.8fr) 24px}.breakout-art{top:-26cqw}.art-1 .breakout-art{top:-15cqw}.art-3 .breakout-art{top:-10cqw}}
/* Desktop Dock-like hover, without reflow or mobile touch effects. */
@media(min-width:851px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .package{transform-origin:50% 100%;transition:transform .38s cubic-bezier(.22,1,.36,1),box-shadow .38s ease,border-color .28s ease}
 .package:hover,html[data-input="keyboard"] .package:focus-within{transform:translateY(-4px) scale(1.05);z-index:4;border-color:#d5b9ff;box-shadow:0 12px 36px #0006,0 0 22px #b390e01c,inset 0 1px 0 #e0caff35}
 .package:has(+ .package:hover),.package:hover + .package{transform:scale(1.015);z-index:3}
}
/* Feathered contrast behind package name and price; no visible panel edge. */
.copy{isolation:isolate}
.copy::before{content:'';position:absolute;z-index:-1;pointer-events:none;top:-18px;left:-25px;right:-25px;height:112px;background:radial-gradient(ellipse at 40% 46%,#00000038 0%,#00000029 38%,#0000000d 64%,transparent 82%);filter:blur(14px)}
.label{color:#d1c9df;text-shadow:0 2px 7px #0006}
.price-row strong{text-shadow:0 2px 9px #0005}
@media(max-width:850px){.copy::before{top:-21px;height:130px;left:-28px;right:-28px;filter:blur(16px)}}
/* Compact seller footer and a readable requisites sheet. */
.screen{grid-template-rows:36px minmax(70px,.65fr) 34px minmax(300px,1.2fr) 55px}
footer{flex-direction:column;gap:4px;font-size:9px}.seller-name{font-size:10px;color:#b4aabd}.footer-links{display:flex;justify-content:center;align-items:center;gap:10px;font-size:10px;color:#b8a8cf}.footer-links button{padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer}.footer-links a:hover,.footer-links button:hover{color:#e3d5fa}.requisites-dialog{width:min(90vw,420px);max-width:420px;max-height:85dvh;overflow:auto;padding:27px;border:1px solid #574b67;box-shadow:0 20px 70px #0008}.legal-eyebrow{font-size:9px;letter-spacing:1.6px;color:#a78cbe;margin-bottom:15px}.requisites-dialog h2{font-size:23px;line-height:1.25;letter-spacing:-.6px;margin-bottom:20px}.requisites-dialog .legal-seller{font-size:12px;line-height:1.7;color:#a69aaf}.legal-seller strong{font-size:15px;font-weight:550;color:#f1eaf8}.legal-details{margin:20px 0}.legal-details>div{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid #ffffff12}.legal-details dt{font-size:11px;color:#a99ab5}.legal-details dd{margin:0;font-size:13px;color:#eee6f7}.legal-support{display:grid;gap:7px;padding:17px 0 22px}.legal-support span{font-size:11px;color:#a99ab5}.legal-support strong{font-size:14px;font-weight:500;color:#d8bfee}.requisites-dialog form button{font-size:13px;padding:13px}
@media(max-width:850px){.screen{grid-template-rows:36px minmax(60px,.6fr) 30px minmax(320px,1.95fr) 55px}footer{font-size:8px}.seller-name{font-size:9px}.footer-links{font-size:10px}}
@media(max-width:850px) and (max-height:620px){.screen{grid-template-rows:30px minmax(25px,.28fr) 27px minmax(290px,1.8fr) 55px;gap:5px}footer{font-size:7px;gap:3px}.seller-name{font-size:8px}.footer-links{font-size:9px}}
@media(min-width:851px) and (max-height:560px){.screen{grid-template-rows:30px minmax(10px,.25fr) 27px minmax(235px,1fr) 48px}}
