/* DreamPlayz unified page layer — loaded after legacy and admin styles. */
:root {
    --dp-bg: #050814;
    --dp-panel: rgba(10, 16, 31, .9);
    --dp-panel-soft: rgba(14, 22, 41, .76);
    --dp-border: rgba(142, 173, 219, .16);
    --dp-border-active: rgba(25, 216, 255, .38);
    --dp-cyan: #19d8ff;
    --dp-blue: #2684ff;
    --dp-text: #f7fbff;
    --dp-muted: #aebbd0;
    --dp-subtle: #71809b;
    --dp-radius: 14px;
    --dp-shadow: 0 24px 70px rgba(0, 2, 12, .34);
}

body {
    color: var(--dp-text);
    background-color: var(--dp-bg);
    background-image: radial-gradient(circle at 88% 5%, rgba(38,132,255,.08), transparent 29rem), linear-gradient(rgba(5,8,20,.7),rgba(5,8,20,.88)), url('/assets/images/dreamplayz-site-bg-2026.png');
    background-position: center top;
    background-size: auto, auto, cover;
    background-attachment: scroll;
}

body > main:not(.home-main):not(.spin-page):not(.social-apply-page) {
    width: min(1240px, calc(100% - 32px)) !important;
    max-width: 1240px !important;
    margin: 0 auto 80px !important;
    padding: 128px 0 0 !important;
    box-sizing: border-box;
}

/* Shared page headings */
body > main:not(.home-main) > h1:first-child,
.page-header h1, .auth-card h1, .panel-content h1,
.checkout-page h1, .store-header h1 {
    color: var(--dp-text) !important;
    font-family: var(--font-display) !important;
    font-size: clamp(2.2rem, 5vw, 4.3rem) !important;
    line-height: .98 !important;
    letter-spacing: -.05em !important;
    text-shadow: none !important;
}

.page-header, .section-header {
    margin-bottom: 28px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--dp-border);
}

/* One surface language everywhere */
:where(.card, .content-card, .panel-card, .auth-card, .widget, .leaderboard-card,
    .command-category, .info-card, .contact-card, .legal-card, .cart-item,
    .checkout-section, .order-card, .ticket-card, .application-card,
    .store-item, .product-card, .rank-card, .spin-card, .reward-card) {
    color: var(--dp-text);
    border: 1px solid var(--dp-border) !important;
    border-radius: var(--dp-radius) !important;
    background: var(--dp-panel) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    backdrop-filter: none;
}

:where(.card, .content-card, .panel-card, .auth-card, .widget, .cart-item,
    .checkout-section, .order-card, .ticket-card, .application-card):hover {
    border-color: var(--dp-border-active) !important;
}

:where(.card, .content-card, .panel-card, .auth-card, .widget) p,
:where(.card, .content-card, .panel-card, .auth-card, .widget) li {
    color: var(--dp-muted);
    text-shadow: none;
}

/* Controls */
:where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    min-height: 44px;
    color: var(--dp-text) !important;
    border: 1px solid var(--dp-border) !important;
    border-radius: 9px !important;
    outline: 0;
    background: rgba(3, 7, 16, .78) !important;
    box-shadow: none !important;
}

:where(input, select, textarea):focus {
    border-color: var(--dp-cyan) !important;
    box-shadow: 0 0 0 3px rgba(25,216,255,.1) !important;
}

:where(.btn, .button, button[type="submit"]):not(.hero-btn):not(.mobile-menu-toggle) {
    min-height: 42px;
    border: 1px solid rgba(25,216,255,.3) !important;
    border-radius: 8px !important;
    color: #8ceaff !important;
    background: #0d2434 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-family: var(--font-ui) !important;
    font-size: .76rem !important;
    font-weight: 700 !important;
    letter-spacing: .02em !important;
    text-decoration: none;
    animation: none !important;
}

:where(.btn, .button, button[type="submit"]):not(.hero-btn):not(.mobile-menu-toggle):hover {
    color: #061018 !important;
    border-color: #39d9f7 !important;
    background: #39d9f7 !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Authentication */
.auth-shell, .auth-page {
    width: min(1080px, calc(100% - 32px)) !important;
    min-height: 620px;
    margin: 0 auto 80px !important;
    padding-top: 128px !important;
}

.auth-shell { display: grid; place-items: center; }
.auth-shell .auth-card, .auth-page .auth-card, .auth-container {
    width: min(520px, 100%) !important;
    margin-inline: auto !important;
    padding: clamp(24px, 5vw, 46px) !important;
}

/* Information and legal pages */
.page-main, .legal-page, .info-page, .contact-page {
    min-height: 70vh;
}

.page-main > .card, body > main:not(.home-main) > .card {
    padding: clamp(22px, 4vw, 38px);
}

/* Player panel */
.panel-shell { padding-top: 128px !important; }
.panel-layout { gap: 16px !important; }
.panel-sidebar {
    border: 1px solid var(--dp-border) !important;
    border-radius: var(--dp-radius) !important;
    background: var(--dp-panel) !important;
    box-shadow: none !important;
}
.panel-sidebar a { border-radius: 8px !important; color: var(--dp-muted) !important; }
.panel-sidebar a:hover, .panel-sidebar a.active { color: var(--dp-text) !important; background: rgba(25,216,255,.07) !important; }
.panel-hero { border-radius: 11px !important; background: rgba(25,216,255,.045) !important; }

/* Store, cart and checkout */
.store-hero, .store-banner {
    min-height: 330px;
    border: 1px solid var(--dp-border) !important;
    border-radius: 20px !important;
    background-image: linear-gradient(90deg,rgba(3,5,12,.94),rgba(3,5,12,.38)),url('/assets/images/dreamplayz-hero-2026.webp') !important;
    background-position: center !important;
    background-size: cover !important;
    box-shadow: var(--dp-shadow) !important;
}
.store-sidebar, .cart-summary, .checkout-summary {
    border: 1px solid var(--dp-border) !important;
    border-radius: var(--dp-radius) !important;
    background: var(--dp-panel) !important;
    box-shadow: none !important;
}
.product-grid, .store-grid { gap: 14px !important; }
.product-card img, .store-item img { object-fit: contain; }

/* Tables */
:where(table) {
    width: 100%;
    overflow: hidden;
    border: 1px solid var(--dp-border) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: 11px;
    color: var(--dp-muted);
    background: var(--dp-panel);
}
:where(th) { color: var(--dp-text) !important; background: rgba(25,216,255,.055) !important; }
:where(th,td) { padding: 12px 14px !important; border-color: var(--dp-border) !important; }
:where(tr:hover td) { background: rgba(25,216,255,.025); }

/* Application pages use the same artwork and surfaces. */
.partner-hero, .staff-hero, .social-apply-hero, .application-hero {
    border: 1px solid var(--dp-border) !important;
    border-radius: 20px !important;
    background-image: linear-gradient(90deg,rgba(3,5,12,.93),rgba(5,8,20,.46)),url('/assets/images/dreamplayz-hero-2026.webp') !important;
    background-position: center !important;
    background-size: cover !important;
    box-shadow: var(--dp-shadow) !important;
}
.partner-page, .staff-application, .social-apply-page {
    color: var(--dp-text);
    background: transparent !important;
}

/* Rewards and spin */
.spin-page, .rewards-page {
    min-height: 100vh;
    padding-top: 128px !important;
    background: transparent !important;
}
.spin-container, .rewards-container { width: min(1100px, calc(100% - 32px)); margin-inline: auto; }

/* Admin stays functional while sharing the same palette. */
.admin-page { color: var(--dp-text); }
.admin-shell, .admin-card, .admin-panel, .admin-stat {
    border-color: var(--dp-border) !important;
    background: var(--dp-panel) !important;
    box-shadow: none !important;
}

/* Missing/broken images never distort layouts. */
img { max-width: 100%; }
img[src=""], img:not([src]) { display: none !important; }
.gallery-grid img, .map-gallery img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 10px; }

@media (max-width: 900px) {
    .panel-layout, .checkout-layout, .cart-layout { grid-template-columns: 1fr !important; }
    .panel-sidebar { position: static !important; }
    body > main:not(.home-main):not(.spin-page):not(.social-apply-page) { padding-top: 108px !important; }
}

@media (max-width: 600px) {
    body > main:not(.home-main):not(.spin-page):not(.social-apply-page),
    .auth-shell, .auth-page { width: calc(100% - 20px) !important; padding-top: 98px !important; }
    :where(th,td) { padding: 9px 10px !important; font-size: .72rem; }
    .store-hero, .store-banner, .partner-hero, .staff-hero { min-height: 260px; border-radius: 14px !important; }
}

@media (prefers-reduced-motion: reduce) {
    *,*::before,*::after { animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important; }
}

/* Performance layer: avoid continuous repaints on long catalog and panel pages. */
body::before, body::after, #particles-canvas, .leaf { display:none!important; }
.navbar { background:rgba(5,8,20,.97)!important;backdrop-filter:none!important; }
:where(.card,.widget,.panel-card,.auth-card,.admin-card,.store-sidebar,.home-action-strip,.server-tiles-container) { backdrop-filter:none!important; }
.home-action-tile,.home-feature-card,.card { will-change:auto!important; }