/* Painify monochrome interface */
html body{background:#0b0b0d;color:#f8f8f8;--acc:#ececec}
.pn-container{width:min(1600px,calc(100% - 96px))}
#header nav{max-width:1600px;padding-inline:48px}
.pn-hero h1{font-size:clamp(56px,5.2vw,92px);line-height:1.06;max-width:940px;font-weight:650;letter-spacing:-.055em}
.pn-lead{font-size:22px;max-width:640px;line-height:1.5}
.pn-hero-content{padding-bottom:100px}.pn-eyebrow{color:#aaa}
.pn-hero-shade{background:linear-gradient(90deg,#0b0b0de6,#0b0b0d80 48%,#0b0b0d14),linear-gradient(0deg,#0b0b0d,transparent 24%)}
.pn-red,.pn-blue,.pn-green{background-image:none;background-color:#242426}
.pn-red{background:radial-gradient(ellipse at 80% 15%,#767678,#252527 85%)}
.pn-blue{background:radial-gradient(ellipse at 75% 15%,#525256,#1e1e20 85%)}
.pn-green{background:radial-gradient(ellipse at 75% 15%,#656568,#222224 85%)}
.pn-product{transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}
.pn-product:hover{transform:translateY(-3px);filter:brightness(1.08);box-shadow:0 16px 40px #0004}
.pn-product[aria-disabled=true]:hover{transform:none;filter:none;box-shadow:none}
.pn-button{transition:background-color .2s ease,border-color .2s ease,color .2s ease;transform:none!important}
.pn-button:hover{background:#3d3c3e;border-color:#3d3c3e;color:#fff}
.pn-primary:hover{background:#fffcfccc;border-color:transparent;color:#0c0c0f}
#header a:hover{color:#fff}#header a{transition:color .2s ease}
/* Keep original colors on account downloads, games, and roulette prizes. */
.pcard .pb,.bn,.rl .it{filter:none}
body .um{--acc:#d9d9dc}body .sw-bar{background:#eee;box-shadow:0 0 10px #ffffff44}
body .go,body .bpay,body .btn.pr{background:#ececec;color:#17171c;border-color:#ececec}
body .go:hover,body .bpay:hover,body .btn.pr:hover{background:#d1d1d4;color:#17171c}
body .go:disabled,body .bpay:disabled,body .btn.pr:disabled{background:#27272a;color:#71717a;border-color:#343438}
body .bch button.on,body .ch button.on{background:#343438;border-color:#ececec;color:#fff}
body .av,body a.av-on .uav{border-color:#d5d5d8;background:#202022}body a.av-on:hover .uav{box-shadow:0 0 0 4px #ffffff18}
body .sd a.on{background:#242426}body .pcard.sel{border-color:#ddd}
#features>div.nmtp8,#media>div.nmtp8,footer>div.nmtp8{display:none}
@media(max-width:1024px){.pn-container{width:calc(100% - 64px)}#header nav{padding-inline:32px}.pn-hero h1{font-size:64px}.pn-lead{font-size:20px}}
@media(max-width:640px){.pn-container{width:calc(100% - 36px)}#header nav{padding-inline:18px}.pn-hero h1{font-size:clamp(42px,10vw,60px)}.pn-lead{font-size:17px}.pn-hero-content{padding-bottom:48px}}
@media(max-height:600px){.pn-hero h1{font-size:clamp(36px,8vh,62px)}.pn-hero-content{padding-bottom:24px}.pn-lead{font-size:16px}}
@media(prefers-reduced-motion:reduce){.pn-product,.pn-button{transition:none}}

#features,#media,footer{filter:grayscale(1)}#header .minlj{-webkit-text-stroke-color:#d5d5d8}#header .pn-eyebrow{color:#aaa}

.pn-art-products{text-align:center;padding-top:70px;padding-bottom:90px;position:relative;isolation:isolate}
.pn-art-products::before{content:"";position:absolute;inset:0 -20vw;z-index:-1;background:radial-gradient(ellipse at 50% 50%,#ffffff05,transparent 70%);pointer-events:none}
.pn-category-label{display:inline-block;padding:5px 11px;border:1px solid #ffffff20;border-radius:99px;background:#ffffff05;color:#c6c6ca;font:600 11px/1.4 "Inter Variable",sans-serif;text-transform:uppercase;margin-bottom:16px}
.pn-art-products h2{font-size:clamp(30px,3vw,44px);font-weight:600;letter-spacing:-.035em;margin-bottom:12px}
.pn-art-products .pn-section-lead{max-width:none;margin:0 auto 40px;font-size:16px}
.pn-art-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;max-width:1440px;margin:auto}
.pn-art-card{display:block;position:relative;overflow:hidden;border:1px solid #ffffff20;border-radius:18px;background:#101012;transition:border-color .2s ease,transform .2s ease}
.pn-art-card img{display:block;width:100%;height:auto;aspect-ratio:500/806;object-fit:cover}
.pn-art-card .pn-art-hover{position:absolute;inset:0;opacity:0;transition:opacity .25s ease}
.pn-art-card:hover .pn-art-hover,.pn-art-card:focus-visible .pn-art-hover{opacity:1}
.pn-art-card:hover{border-color:#ffffff50;transform:translateY(-3px)}
.pn-art-card:focus-visible{outline:2px solid #eee;outline-offset:4px}
@media(max-width:900px){.pn-art-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
@media(max-width:440px){.pn-art-grid{gap:12px}.pn-art-card{border-radius:12px}.pn-art-products .pn-section-lead{font-size:14px}}
@media(prefers-reduced-motion:reduce){.pn-art-card,.pn-art-card .pn-art-hover{transition:none}.pn-art-card:hover{transform:none}}

/* Smooth game-card hover, in both directions. */
.pn-art-card{transition:border-color .45s ease,box-shadow .45s ease;transform:none}
.pn-art-card img{transform:scale(1);transition:transform .65s cubic-bezier(.22,1,.36,1)}
.pn-art-card .pn-art-hover{transition:opacity .55s ease,transform .65s cubic-bezier(.22,1,.36,1)}
.pn-art-card:hover,.pn-art-card:focus-visible{transform:none;border-color:#ffffff55;box-shadow:0 12px 30px #0003}
.pn-art-card:hover img,.pn-art-card:focus-visible img{transform:scale(1.035)}
@media(prefers-reduced-motion:reduce){.pn-art-card img,.pn-art-card:hover img,.pn-art-card:focus-visible img{transform:none}.pn-art-card .pn-art-hover{transition:opacity .25s ease}}

/* The More Games card contains background artwork only. */





/* Whiten lettering without brightening a rectangular background overlay. */



/* Header navigation: color-only feedback, without boxes or letter outlines. */
#header .pn-nav-link,#header .pn-nav-link:hover,#header .pn-nav-link:focus,#header .pn-nav-link:active{background:none;border:0;border-radius:0;outline:0;box-shadow:none;text-shadow:none;-webkit-text-stroke:0}
#header .pn-nav-link{color:#fffcfccc;transition:color .2s ease}
#header .pn-nav-link:hover{color:#fffcfc}
#header .pn-nav-link:focus-visible{text-decoration:underline;text-underline-offset:5px;color:#fffcfc}



/* Quiet demo controls and smooth dropdown feedback. */
#umini .um-row .ic,#umini .um-row.on .ic{border-color:transparent;background:transparent;box-shadow:none}
#umini .um-row.on .ic{color:var(--acc)}
#umini .um-rb.on{background:#ffffff08;color:var(--acc);box-shadow:none}
#umini .um-sw,#umini .um-sw.on{border-color:transparent;box-shadow:none}
#umini .um-sw::after{transition:transform .3s cubic-bezier(.22,1,.36,1),background .25s}
#umini .um-cmb{transition:background .25s ease,color .25s ease}
#umini .um-cmb svg{transition:transform .32s cubic-bezier(.22,1,.36,1)}
#umini .um-cmb.bump span{display:inline-block;animation:umValueChange .28s ease both}
#umini .um-pop{animation:umDropdownOpen .3s cubic-bezier(.22,1,.36,1) both;transform-origin:center}
#umini .um-pop.closing{pointer-events:none;animation:umDropdownClose .2s ease both}
#umini .um-pop button{transition:background .2s ease,color .2s ease}
@keyframes umDropdownOpen{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
@keyframes umDropdownClose{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-3px) scale(.98)}}
@keyframes umValueChange{from{opacity:.25;transform:translateY(3px)}to{opacity:1;transform:none}}


/* No glass surface behind individual navigation labels. */
#header .pn-nav-link,#header .pn-nav-link:hover,#header .pn-nav-link:focus{backdrop-filter:none;-webkit-backdrop-filter:none;background:none;box-shadow:none;border:0}

/* Rounded language control with smooth opening and closing. */
#header .lsw button.lgt{height:42px;padding:0 12px;gap:8px;border:0;border-radius:12px;background-color:rgba(236,236,236,0);box-shadow:none;color:#aaa;transition:background-color .25s ease,color .25s ease}
#header .lsw button.lgt:hover{background-color:#ffffff0a;color:#c4c4c8}
#header .lsw.open button.lgt,#header .lsw.open button.lgt:hover{border-radius:12px;background-color:#ececec;color:#6b737b}
#header .lsw .lgt svg:last-child{transition:transform .3s ease;transform:rotate(0deg)}
#header .lsw.open .lgt svg:last-child{transform:rotate(180deg)}
#header .lsw .lgm{border-radius:12px;opacity:0;visibility:hidden;transform:translateY(-7px) scale(.96);transform-origin:top right;transition:opacity .25s ease,transform .3s cubic-bezier(.22,1,.36,1),visibility .3s}
#header .lsw.open .lgm{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
#header .lsw .lgm button{transition:background-color .2s ease,color .2s ease}
