/* Shared visual layer; page behavior and game-specific artwork stay independent. */
:root{color-scheme:dark;--void:#101015;--deep:#14141b;--bg:#101015;--surface:#17171fe8;--card:#1b1b24eb;--border:#ffffff24;--line:#ffffff24;--text:#f5f6fc;--white:#fff;--muted:#bbc0ce;--orange:#ff7a18;--orange-light:#ffb35b}
body{background:#101015 url('home-pattern.png') center top/1536px auto repeat-y;color:var(--text)}
h1,h2,h3,.section-title,.mode-section-title{letter-spacing:0}
nav,header{border-color:var(--border)}
body>nav,.mod-page>nav,header{background:#101015f2;backdrop-filter:blur(16px)}
.nav-links a,.links a{color:#f5f6fc;font-weight:600}
.nav-links a:hover,.links a:hover{color:#ffad55}
.nav-links [aria-current="page"],.links [aria-current="page"]{color:#ffb35b}
.price-popular{background:#ff7418}
.price-card.featured::before{background:#ff7418}
.mode-hero-media:not(.has-video){background:#14141b url('home-pattern.png') center/cover;border-color:var(--border);border-radius:8px}
.mode-video-play{background:#ff7418}
.mode-video-placeholder{color:var(--text)}
.nav-cta,.btn-primary,.price-btn-solid,.button:not(.outline),body.agency-theme button:not(.ghost):not(.danger):not([aria-selected="false"]),body.reset-theme .btn{background:#ff7418;color:#fff;border:1px solid #ffab48;border-radius:7px;box-shadow:0 3px 18px #ff780025;transition:transform .2s,background .2s,box-shadow .2s}
.nav-cta:hover,.btn-primary:hover,.price-btn-solid:hover,.button:not(.outline):hover,body.agency-theme button:not(.ghost):not(.danger):hover,body.reset-theme .btn:hover{background:#ff8529;box-shadow:0 5px 24px #ff780040;transform:translateY(-2px)}
.btn-secondary,.price-btn-outline,.button.outline{background:#191921b8;color:#f5f6fc;border:1px solid #ffffff40;border-radius:7px}
.btn-secondary:hover,.price-btn-outline:hover,.button.outline:hover{background:#252530;border-color:#ff9a3c}
.mods-section,#intro-video.hero-video-section,.mod-features-section,.access-band{background:#15151bac;border-color:var(--border)}
.feature-card,.mod-feature,.step-card,.faq-item,.commands-table-wrap,.mode-article,.mode-sidebar,.mode-side-card{background:var(--card);border-color:var(--border);border-radius:8px}
.feature-card:hover{background:#24242e;border-color:#ff9a3c}
.price-card,.price-card.featured,#main-page .price-card,#main-page .price-card.featured{background:var(--card);border-color:var(--border);border-radius:8px}
.price-card.featured,#main-page .price-card.featured{border-color:#ff9a3c}
.price-badge,.mod-card-arrow,.mode-cta{background:#ff7418}
.agency-offer,#main-page .agency-offer,.agency-offer-side{background:#191921d9;border-color:var(--border);border-radius:0;box-shadow:none}
.cta-glow{display:none}
.mod-page{background:transparent}
.mode-section-block{max-width:none}
.mode-article,.mode-side-card{box-shadow:none}
.mode-group-intro,.mode-command-group{background:#191921d9;border-color:var(--border);border-radius:8px}
.mode-lead,.mode-group-intro p,.mode-feature-chip,.mode-command-name,.mode-command-desc,.mode-effect-chip{color:var(--text)}
.mode-command-code{background:#12303b;color:#80ecff}
.mode-sidebar{background:transparent;border:0}
dialog{background:#1b1b24;border-color:var(--border)}
footer{background:#101015e8;border-color:var(--border)}
.theme-price{color:#ffb35b}
.theme-price.included{color:var(--muted)}
body.agency-theme .hero-copy{background:transparent;border:0;box-shadow:none;border-radius:0}
body.agency-theme .hero-copy::after{display:none}
body.agency-theme .login-card,body.agency-theme .card,body.agency-theme .stat,body.reset-theme .card{background:var(--card);border-color:var(--border);border-radius:8px}
body.agency-theme .admin-panel{background:var(--card)}
body.agency-theme input,body.agency-theme select,body.reset-theme input{background:#121219;border-color:#ffffff35;color:var(--text)}
body.reset-theme{font-family:Inter,Arial,sans-serif}
body.reset-theme .logo,body.reset-theme .card-title{font-family:'Space Grotesk',Inter,Arial,sans-serif}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #39dff4;outline-offset:3px}
@media(min-width:1001px){
 .wrap{max-width:none;width:100%;padding-left:3%;padding-right:3%}
 body.agency-theme .shell{width:94%;max-width:none}
 body>nav,.mod-page>nav{padding-left:3%;padding-right:3%}
 .mode-detail-shell,.mod-install-section,.commands-section,.mod-video-section,.mod-features-inner{max-width:none;width:100%;padding-left:3%;padding-right:3%}
 .mod-features-section{padding-left:0;padding-right:0}
}
@media(max-width:1000px){
 body>nav,.mod-page>nav,.nav{flex-wrap:wrap;gap:12px;padding:12px 16px}
 .mod-page>nav .nav-links,body>nav .nav-links,.nav .links{display:flex;order:3;width:100%;justify-content:center;flex-wrap:wrap;gap:10px 18px}
 .nav-links a,.links a{font-size:13px}
 .nav .brand small{display:none}
}
@media(max-width:600px){.nav .brand b{font-size:17px}.nav .button{font-size:12px;padding:8px 10px}.nav .brand img{width:32px;height:32px}.nav{gap:10px}.wrap{padding-left:16px;padding-right:16px}body.agency-theme .nav-brand-sub{display:none}}
/* Compact media, readable copy; keep the shared wide layout. */
#main-page .hero h1{font-size:64px}
#main-page .hero{min-height:400px;padding-bottom:24px}
#main-page .hero-sub,.experience p,.section-sub{font-size:18px;line-height:1.65}
.experience-grid{gap:28px}
.experience-grid article{grid-template-rows:auto minmax(70px,auto) auto auto auto}
.experience-media{max-width:560px;justify-self:center}
.experience-bottom{font-size:16px;min-height:48px}
.experience small{font-size:14px;line-height:1.5}
.experience-bottom .btn-primary{font-size:16px;min-height:44px}
.app-game-card-title{font-size:20px;line-height:1.25}
.app-game-card-sub{font-size:13px;line-height:1.5}
.mod-card-desc,.mode-lead,.mode-command-desc,.feature-desc{font-size:16px;line-height:1.65}
.themes{gap:24px}
.theme .cover{max-width:320px;margin-inline:auto}
.theme h3{font-size:22px}
.theme-bottom{font-size:15px;flex-wrap:wrap}
.access-grid p,.catalog>p,.details p{font-size:16px;line-height:1.65}
.theme-price small,.access-note,.one-time{font-size:14px}
.links{font-size:16px}
@media(min-width:1101px){.app-game-showcase{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px;margin-top:28px}}
@media(max-width:760px){
 #main-page .hero h1{font-size:40px;white-space:normal;overflow-wrap:anywhere}
 #main-page .hero-sub{font-size:16px;max-width:440px}
 .experience p{font-size:16px}
 .experience-grid article{grid-template-rows:auto auto auto auto auto}
 .experience-media{max-width:480px}
 .theme .cover{max-width:280px}
 .app-game-card-title{font-size:18px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}