/* MRWINNER444 visual revision v4:
   compact royal black with more visible but contained velvet emerald green.
   25-30% smaller UI surface than the earlier preview. */
:root{
 --bg:#050805;--surface:#08120e;--panel:#0d1a13;--panel2:#13271d;
 --green:#123322;--gold:#dab16a;--gold-light:#f0d6a5;
 --line:rgba(204,162,89,.33);
}
body{font-size:13px;background:#050805}
.site-header{height:58px;background:rgba(5,12,8,.98);border-bottom:1px solid rgba(215,169,92,.4)}
.container{width:min(1350px,calc(100% - 80px))}
.site-header-inner{gap:19px}
.brand{font-size:21px}
.brand-crown{font-size:27px}
.nav-main{gap:15px}
.nav-link{font-size:11px}
.header-actions{gap:6px}
.header-actions .btn{font-size:11px;padding:7px 13px}
.header-search{height:32px;width:32px}
.language{font-size:11px}
.hero{height:425px;min-height:425px;background:#060d09}
.hero-art{width:66%;background-position:50% center}
.hero-vignette{background:linear-gradient(90deg,#050805 2%,rgba(5,11,7,.97) 29%,rgba(5,11,7,.72) 42%,rgba(5,11,7,.19) 63%,rgba(5,11,7,.04) 86%),linear-gradient(0deg,rgba(5,10,6,.25),transparent 35%)}
.hero-copy{max-width:475px;padding:0 0 10px}
.hero .eyebrow{font-size:9px}
.hero h1{font-size:clamp(39px,3.5vw,51px);line-height:1.07;letter-spacing:-.024em;margin:14px 0 12px}
.hero p{font-size:12px;line-height:1.55;max-width:357px;margin-bottom:19px}
.btn-large{min-width:0;font-size:11px;padding:12px 17px}
.hero-actions .btn-gold{font-size:12px}
.hero-footnotes{font-size:10px;margin-top:22px;gap:12px}
.hero-footnotes i{font-size:15px}
.hero-prev,.hero-next{width:30px;height:30px;top:48%;font-size:22px}
.hero-next{right:10px}.hero-prev{left:10px}
.quick-perks{padding:9px 0 12px;background:#08150d}
.perks-grid{gap:10px}
.perk{height:129px;border-color:rgba(197,151,72,.49);background:linear-gradient(110deg,#0b2114,#08110b 80%);border-radius:7px}
.perk-words{padding:10px 13px 10px 10px}
.perk strong{font-size:16px}
.perk small{font-size:10px;margin-top:6px;min-height:0}
.perk-cta{font-size:9px;padding:5px 11px;margin-top:8px}
.perk-media{width:47%}
.section-pad{padding-block:31px}
.section-heading{margin-bottom:12px}
.section-heading h2{font-size:24px}
.section-heading .small-eyebrow{font-size:9px;letter-spacing:.2em}
.section-heading p{font-size:10px;margin-top:3px}
.small-text-link{font-size:11px}
.chip{font-size:10px;padding:5px 10px}
.chip-strip{padding-bottom:10px}
.games-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:11px}
.game-image-wrap{aspect-ratio:1.28;border-color:rgba(206,163,86,.48)}
.game-title{font-size:10px;margin-top:5px}
.game-provider{font-size:9px}
.vip-spotlight{padding-block:22px 27px;background:linear-gradient(100deg,#07130c,#142519 50%,#07100b)}
.vip-grid{min-height:218px;grid-template-columns:1fr 1.1fr .75fr;gap:15px}
.vip-copy h2{font-size:clamp(28px,2.8vw,39px)}
.vip-copy p{font-size:11px;margin-bottom:15px}
.vip-visual{min-height:218px}
.vip-card{width:min(285px,95%);height:180px}
.vip-card strong{font-size:49px}
.vip-card strong span{font-size:36px}
.vip-card-crown{font-size:33px}
.vip-benefits{padding-left:18px}
.vip-benefits>div{padding:7px 0;gap:9px}
.vip-benefits strong{font-size:13px}
.vip-benefits small{font-size:10px}
.feature-promo{padding-block:25px;background:linear-gradient(90deg,#0c1f13,#16190d 80%)}
.feature-promo-content{min-height:170px}
.orbit-circle{width:129px;height:129px}
.orbit-circle span{font-size:70px}
.promo-story h2{font-size:34px}
.promo-story p{font-size:11px;margin-bottom:12px}
.promo-stat strong{font-size:29px}
.jackpot-section{padding:20px 0;background:linear-gradient(90deg,#0c180e,#1c170a 55%,#0a160f)}
.jackpot-layout{min-height:115px}
.jackpot-copy h2{font-size:31px}
.jackpot-medallion strong{font-size:44px}
.jackpot-medallion span{font-size:49px}
.mobile-showcase{padding-top:31px;background:linear-gradient(100deg,#091c11,#0b120c 55%,#191908)}
.mobile-showcase-layout{min-height:220px}
.mobile-copy h2{font-size:29px}
.mobile-preview{height:210px}
.preview-phone{transform:rotate(8deg) translateY(79px)}
.provider-name{height:54px;min-width:125px;font-size:13px}
.providers-section{padding-block:29px;background:#08140d}
.trust-inner{min-height:55px}
.trust-inner span{font-size:10px}
.footer-primary{padding-top:33px;padding-bottom:29px}
.footer-primary h3{font-size:10px}
.footer-primary a:not(.brand){font-size:11px}
.footer-brand p{font-size:11px}
.inner-hero{min-height:300px}
.catalogue-page{padding-top:16px}
.inner-hero-copy{padding:30px 35px}
.catalogue-page .inner-hero h1{font-size:48px}
.catalogue-page .inner-hero p{font-size:11px;max-width:430px}
.catalogue-shortcuts button{min-height:76px}
.shortcut-icon{width:35px;height:36px;font-size:25px;background:#152b1d}
.catalogue-shortcuts strong{font-size:14px}
.catalogue-shortcuts small{font-size:9px}
.catalogue-toolbar{padding:12px}
.catalogue-grid{grid-template-columns:repeat(7,minmax(0,1fr))}
.info-layout{min-height:370px}
.info-hero-art{height:345px}
.info-copy{padding:35px 0}
.inner-info-page h1{font-size:55px}
.info-feature-card{min-height:168px;padding:19px}
.info-feature-card h3{font-size:19px}
.info-feature-card-icon{font-size:32px;margin-bottom:9px}
/* Real account forms */
#auth-panel{margin-top:18px;text-align:left}
.auth-form{display:grid;gap:13px}
.auth-form label{display:grid;gap:6px;font-size:12px;color:#e9d6b2;font-weight:600}
.auth-form input:not([type=checkbox]){width:100%;min-width:0;min-height:42px;background:#08150e;border:1px solid rgba(211,175,106,.36);border-radius:5px;padding:10px 12px;color:#fff;font-size:13px;outline:none}
.auth-form input:focus{border-color:#d6b172}
.auth-form input::placeholder{color:#718075}
.auth-form .auth-agree{display:flex;align-items:flex-start;gap:10px;color:#b6c1b5;font-weight:400;line-height:1.5}
.auth-form .auth-agree input{margin-top:4px;accent-color:#c9a460}
.auth-submit{width:100%;margin-top:3px}
.auth-submit:disabled{opacity:.45;cursor:wait}
.auth-error{background:#391916;color:#ffcabf;padding:9px 12px;border-radius:5px;font-size:12px}
.auth-secondary{background:none;border:0;color:#f0c987;text-align:center;font-size:12px;padding:8px}
.auth-account-card{text-align:center;border:1px solid var(--line);border-radius:8px;background:#102016;padding:22px}
.auth-account-crown{font-size:38px;color:#ebc67f}
.auth-account-name{font:600 24px var(--serif);color:#f2ddae}
.auth-account-email{font-size:12px;color:#c4c6b7;overflow-wrap:anywhere}
.auth-account-status{font-size:11px;color:#dfb577;margin:11px 0}
.auth-account-note{font-size:11px;color:#9ba99c;margin-bottom:17px}
.dialog{max-height:min(90vh,800px);overflow:auto;padding:26px 27px}
.dialog h2{font-size:26px}
.dialog p{font-size:12px}
.dialog-icon{font-size:34px}
@media(max-width:1100px){
 .container{width:calc(100% - 40px)}
 .games-grid,.catalogue-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
 .site-header-inner{gap:12px}
 .nav-main{gap:9px}
 .nav-link{font-size:10px}
 .hero h1{font-size:46px}
 .vip-grid{grid-template-columns:1fr 1fr}
 .vip-benefits{grid-column:1/-1;display:flex;padding:0;border-left:0;border-top:1px solid var(--line)}
 .vip-benefits>div{flex:1}
}
@media(max-width:800px){
 .container{width:calc(100% - 34px)}
 .site-header{height:58px}.nav-main{top:58px}
 .games-grid,.catalogue-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
 .vip-grid{grid-template-columns:1fr 1fr}
 .hero-art{width:80%}
 .catalogue-page .inner-hero h1{font-size:42px}
}
@media(max-width:640px){
 .container{width:calc(100% - 26px)}
 .brand{font-size:18px}
 .hero{height:555px;min-height:555px}
 .hero-art{height:63%;width:100%;background-position:55% 25%}
 .hero-layout{min-height:555px;padding-bottom:35px}
 .hero-copy{padding:0}
 .hero-vignette{background:linear-gradient(0deg,#050906 5%,rgba(5,10,6,.97) 30%,rgba(5,9,6,.21) 67%,rgba(5,9,6,.1))}
 .hero h1{font-size:clamp(20px,6.2vw,28px);line-height:1.15;margin:12px 0;word-break:normal}
 .hero p{font-size:11px}
 .hero-footnotes{font-size:9px}
 .hero-prev,.hero-next{top:36%}
 .quick-perks{padding:9px 0}
 .perks-grid{gap:7px}
 .perk{height:104px}
 .perk-words{padding:7px 9px}
 .perk strong{font-size:14px}
 .perk small{font-size:9px}
 .perk-cta{margin-top:4px;font-size:8px}
 .section-pad{padding-block:23px}
 .section-heading h2{font-size:23px}
 .games-grid,.catalogue-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .vip-grid{grid-template-columns:1fr}
 .vip-benefits{grid-column:1;display:grid}
 .vip-copy h2{font-size:31px}
 .vip-visual{min-height:195px}
 .vip-card{height:150px;width:255px}
 .vip-card strong{font-size:39px}
 .feature-promo-content{grid-template-columns:1fr}
 .jackpot-layout{grid-template-columns:1fr}
 .mobile-showcase-layout{grid-template-columns:1fr}
 .trust-inner{grid-template-columns:1fr 1fr}
 .inner-hero{min-height:390px}
 .inner-hero-copy{padding:155px 19px 20px}
 .inner-hero-art{height:65%;width:100%}
 .catalogue-page .inner-hero h1{font-size:36px}
 .info-layout{min-height:590px}
 .info-hero-art{height:255px}
 .info-copy{padding-top:235px;padding-bottom:33px}
 .inner-info-page h1{font-size:40px}
 .info-feature-grid{grid-template-columns:1fr}
}


/* Original user-directed editorial hero artwork, cropped from the v4 art. */
.hero-art{
  background-image:url('/static/assets/hero-editorial-v4.webp');
  background-position:55% 49%;
  filter:saturate(1.01) contrast(1.05);
}
@media(max-width:640px){.hero-art{background-position:55% 46%}}


/* Navigation exposes real account entry on phones, where header auth is hidden. */
.mobile-auth-buttons{display:none}
@media(max-width:980px){
 .mobile-auth-buttons{display:flex;gap:10px;padding-top:14px;
    margin-top:8px;border-top:1px solid rgba(222,177,91,.23)}
 .mobile-auth-buttons .btn{flex:1;padding:11px 12px;font-size:12px}
}
