*, *::before, *::after{box-sizing:border-box} *{margin:0} html, body{min-height:100%} body{line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility} img, picture, video, canvas, svg{display:block;max-width:100%} input, button, textarea, select{font:inherit} a{text-decoration:none;color:inherit} ul, ol{padding-left:1.25rem} table{border-collapse:collapse;width:100%} :root{--color-primary-dark:#dde7f3;--color-accent-orange:#f3b45f;--color-accent-coral:#f08b6c;--color-white:#ffffff;--color-text-primary:#e7edf5;--color-text-muted:#b8c7d8;--color-border:#304154;--color-bg-page:#0f1722;--color-bg-surface:#162231;--color-bg-soft:#1c2a3b;--color-link:#dce8f5;--color-link-hover:#f3b45f;--color-input-bg:#101c2a;--color-header-bg:rgba(10, 16, 24, 0.92);--color-header-border:rgba(145, 166, 190, 0.25);--color-header-text:rgba(228, 237, 248, 0.94);--color-header-hover-bg:rgba(148, 170, 194, 0.14);--color-header-hover-border:rgba(148, 170, 194, 0.35);--color-header-chip-bg:rgba(148, 170, 194, 0.12);--color-header-chip-border:rgba(148, 170, 194, 0.34);--color-header-chip-hover-bg:rgba(148, 170, 194, 0.2);--color-header-chip-hover-border:rgba(177, 196, 216, 0.44);--color-header-chip-text:#f3f7fb;--color-menu-bg:#121e2c;--color-menu-border:#2f4154;--color-menu-link-hover:#223346;--color-footer-bg-start:#101925;--color-footer-bg-end:#0b121b;--color-footer-text:rgba(228, 237, 248, 0.84);--color-footer-border:rgba(145, 166, 190, 0.2);--color-btn-outline-bg:rgba(23, 35, 49, 0.9);--color-btn-outline-border:#4f657e;--color-btn-outline-text:#e7eef8;--color-btn-outline-hover-bg:#293d53;--color-btn-outline-hover-border:#6f87a1;--color-btn-outline-hover-text:#ffffff;--color-focus-ring:#7dd3fc;--space-1:0.25rem;--space-2:0.5rem;--space-3:0.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:3rem;--radius-sm:0.375rem;--radius-md:0.625rem;--radius-lg:0.875rem;--radius-pill:999px;--shadow-sm:0 1px 2px rgba(15, 23, 42, 0.08);--shadow-md:0 6px 18px rgba(15, 23, 42, 0.08);--shadow-lg:0 14px 30px rgba(15, 23, 42, 0.12);--shadow-focus:0 0 0 3px #7dd3fc, 0 0 0 6px rgba(8, 15, 25, 0.86);--site-header-sticky-offset:3.7rem;--server-subheader-sticky-height:3.2rem;--motion-fast:140ms;--motion-base:220ms;--motion-slow:420ms;--motion-ease:cubic-bezier(0.2, 0.8, 0.2, 1);--font-family-base:'Poppins', 'Segoe UI', Tahoma, sans-serif} html{font-size:16px;color-scheme:dark} @media screen and (max-width: 640px) and (max-height: 1000px){[data-defer-render]{content-visibility:auto;contain-intrinsic-block-size:auto var(--deferred-block-size);overflow-clip-margin:3rem}} body{font-family:var(--font-family-base);font-weight:400;color:var(--color-text-primary);min-height:100vh;background-color:var(--color-bg-page);background-image:radial-gradient(circle at 14% -8%, rgba(72, 86, 104, 0.13) 0%, rgba(72, 86, 104, 0) 44%), radial-gradient(circle at 88% 12%, rgba(58, 71, 87, 0.1) 0%, rgba(58, 71, 87, 0) 46%), linear-gradient(180deg, #f4f7fb 0%, #edf2f7 54%, #e7edf4 100%);background-attachment:fixed} body::before{content:'';position:fixed;inset:0;background:radial-gradient(circle at 18% 10%, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 36%), radial-gradient(circle at 82% 4%, rgba(123, 138, 158, 0.08) 0%, rgba(123, 138, 158, 0) 42%);pointer-events:none;z-index:0} body::after{content:'';position:fixed;inset:0;background:radial-gradient(circle at 50% 115%, rgba(9, 18, 30, 0.2) 0%, rgba(9, 18, 30, 0) 54%), radial-gradient(circle at 50% -16%, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0) 46%), linear-gradient(180deg, rgba(9, 17, 28, 0.06) 0%, rgba(9, 17, 28, 0) 36%, rgba(9, 17, 28, 0.08) 100%), repeating-linear-gradient( 0deg, rgba(88, 110, 136, 0.055) 0, rgba(88, 110, 136, 0.055) 1px, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0) 112px ), repeating-linear-gradient( 90deg, rgba(88, 110, 136, 0.05) 0, rgba(88, 110, 136, 0.05) 1px, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0) 112px );pointer-events:none;z-index:0} .app-shell{position:relative;z-index:2} .main-container{position:relative} body[data-game-theme-active='1']{--site-theme-accent:#4c73a3;--site-theme-accent-rgb:76, 115, 163} body[data-game-bg-active='1']{--site-game-bg-image:none;--site-game-bg-tilt-x:0;--site-game-bg-tilt-y:0;--site-game-bg-shift-x:0rem;--site-game-bg-shift-y:0rem} body[data-game-theme-active='1'] .hero{position:relative;overflow:hidden;border-top:2px solid rgba(var(--site-theme-accent-rgb), 0.34);box-shadow:inset 0 1px 0 rgba(var(--site-theme-accent-rgb), 0.14)} body[data-game-theme-active='1'] .hero::before{content:'';position:absolute;inset:0 0 auto 0;height:4rem;background:linear-gradient(180deg, rgba(var(--site-theme-accent-rgb), 0.08) 0%, rgba(var(--site-theme-accent-rgb), 0) 100%);pointer-events:none} body[data-game-theme-active='1'] .card{border-color:rgba(var(--site-theme-accent-rgb), 0.18)} body[data-game-theme-active='1'] .btn-outline{border-color:rgba(var(--site-theme-accent-rgb), 0.34)} body[data-game-theme-active='1'] .btn-secondary:hover, body[data-game-theme-active='1'] .btn-outline:hover, body[data-game-theme-active='1'] .btn-secondary:focus-visible, body[data-game-theme-active='1'] .btn-outline:focus-visible{box-shadow:0 0 0 2px rgba(var(--site-theme-accent-rgb), 0.2)} body[data-game-theme-active='1'] .site-breadcrumbs__link{color:rgba(var(--site-theme-accent-rgb), 0.86)} body[data-game-theme-active='1'] .site-breadcrumbs__link:hover{color:rgba(var(--site-theme-accent-rgb), 0.98)} body[data-game-theme-active='1'] .site-breadcrumbs__current{color:rgba(var(--site-theme-accent-rgb), 0.9)} body[data-game-theme-active='1'] .site-breadcrumbs__item:not(:last-child)::after, body[data-game-theme-active='1'] hr{border-top-color:rgba(var(--site-theme-accent-rgb), 0.2);color:rgba(var(--site-theme-accent-rgb), 0.45)} body[data-game-theme-active='1'] .btn-secondary:hover{border-color:rgba(var(--site-theme-accent-rgb), 0.45)} body{background-image:radial-gradient(circle at 14% -10%, rgba(75, 95, 120, 0.16) 0%, rgba(75, 95, 120, 0) 44%), radial-gradient(circle at 90% 8%, rgba(56, 74, 97, 0.12) 0%, rgba(56, 74, 97, 0) 48%), linear-gradient(180deg, #0f1824 0%, #101a28 52%, #0f1723 100%)} body::before{background:radial-gradient(circle at 18% 8%, rgba(95, 117, 142, 0.11) 0%, rgba(95, 117, 142, 0) 40%), radial-gradient(circle at 82% 6%, rgba(70, 88, 111, 0.12) 0%, rgba(70, 88, 111, 0) 44%)} body::after{background:radial-gradient(circle at 50% 115%, rgba(0, 0, 0, 0.48) 0%, rgba(0, 0, 0, 0) 55%), radial-gradient(circle at 50% -18%, rgba(161, 180, 204, 0.08) 0%, rgba(161, 180, 204, 0) 44%), linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 34%, rgba(0, 0, 0, 0.24) 100%), repeating-linear-gradient( 0deg, rgba(129, 151, 179, 0.045) 0, rgba(129, 151, 179, 0.045) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 114px ), repeating-linear-gradient( 90deg, rgba(129, 151, 179, 0.04) 0, rgba(129, 151, 179, 0.04) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 114px )} body[data-game-theme-active='1'] .hero{box-shadow:inset 0 1px 0 rgba(var(--site-theme-accent-rgb), 0.2)} body[data-game-theme-active='1'] .hero::before{background:linear-gradient(180deg, rgba(var(--site-theme-accent-rgb), 0.12) 0%, rgba(var(--site-theme-accent-rgb), 0) 100%)} body[data-game-theme-active='1'] .site-breadcrumbs__link{color:rgba(var(--site-theme-accent-rgb), 0.95)} body[data-game-theme-active='1'] .site-breadcrumbs__link:hover{color:rgba(var(--site-theme-accent-rgb), 1)} body[data-game-theme-active='1'] .site-breadcrumbs__current{color:rgba(var(--site-theme-accent-rgb), 0.98)} main{display:block} h1, h2, h3, h4, h5, h6{color:var(--color-primary-dark);font-weight:600;line-height:1.25;margin-bottom:var(--space-3)} h1{font-size:1.875rem} h2{font-size:1.5rem} h3{font-size:1.25rem} p, ul, ol, table, form{margin-bottom:var(--space-4)} p:last-child, ul:last-child, ol:last-child, table:last-child, form:last-child{margin-bottom:0} a{color:var(--color-link)} a:hover{color:var(--color-link-hover)} small{color:var(--color-text-muted)} label{display:inline-block;font-weight:500;margin-bottom:var(--space-2);cursor:pointer} input, textarea, select{width:100%;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:0.625rem 0.75rem;background:var(--color-input-bg);color:var(--color-text-primary)} input[type='checkbox'], input[type='radio']{width:auto;min-width:1rem;min-height:1rem;margin-right:0.35rem} input:focus, textarea:focus, select:focus{outline:3px solid var(--color-focus-ring);outline-offset:2px;border-color:var(--color-accent-orange)} table{background:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden} th, td{padding:var(--space-3);border-bottom:1px solid var(--color-border);text-align:left;vertical-align:top} thead th{background:var(--color-bg-soft);color:var(--color-primary-dark);font-weight:600} tbody tr:last-child td{border-bottom:0} @media (max-width: 760px){table{display:block;width:100%;overflow-x:auto;white-space:nowrap}} .app-shell{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;margin-bottom:0} .site-header{background:var(--color-header-bg);backdrop-filter:blur(10px);color:var(--color-header-chip-text);box-shadow:0 6px 18px rgba(15, 23, 42, 0.2);position:sticky;top:0;z-index:100;border-bottom:1px solid var(--color-header-border)} .site-header__inner, .site-footer__inner, .main-container{width:min(1100px, 100% - 2rem);margin-inline:auto} .site-header__inner{display:grid;grid-template-columns:minmax(0, 1fr) auto;align-items:center;gap:var(--space-3);min-height:3.55rem;padding-block:0.34rem;margin-bottom:0} .global-header__left{display:flex;align-items:center;gap:var(--space-4);min-width:0;margin-bottom:0} .brand-link{color:var(--color-white);display:inline-flex;align-items:center;gap:0.5rem;min-width:0;white-space:nowrap;line-height:1;transition:opacity var(--motion-base) var(--motion-ease)} .brand-link:hover{opacity:0.92} .brand-link__icon{display:block;width:auto;height:1.62rem;flex:0 0 auto} .brand-link__text{display:inline-block;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:0.98rem;font-weight:600;letter-spacing:0.01em;line-height:1} .global-header__brand .brand-link__icon{height:3.05rem} .global-header__brand .brand-link__text{font-size:1.06rem;transform:translateY(2px)} .global-header__brand{gap:0.12rem} .site-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:0.24rem;margin-bottom:0} .site-nav a{display:inline-flex;align-items:center;justify-content:center;color:var(--color-header-text);font-size:0.9rem;font-weight:500;line-height:1;min-height:1.92rem;padding:0.26rem 0.58rem;border:1px solid transparent;border-radius:var(--radius-pill);margin-bottom:0;transition:color var(--motion-base) var(--motion-ease), border-color var(--motion-base) var(--motion-ease), background-color var(--motion-base) var(--motion-ease)} .site-nav a:hover{color:var(--color-header-chip-text);border-color:var(--color-header-hover-border);background:var(--color-header-hover-bg)} .site-header__auth{display:flex;align-items:center;justify-content:flex-start;flex-wrap:nowrap;gap:var(--space-2);margin-bottom:0} .site-header__auth > *{margin-bottom:0} .site-header__auth .btn{border-color:var(--color-header-chip-border);color:var(--color-header-chip-text);min-height:1.96rem;padding:0.34rem 0.78rem;font-size:0.88rem;line-height:1;border-radius:var(--radius-pill);margin-bottom:0} .site-header__auth .btn-secondary{color:#102033;border-color:var(--color-accent-orange)} .global-header__wallet{margin-bottom:0;display:inline-flex;align-items:center;justify-content:center;min-height:1.96rem;gap:0.4rem;border:1px solid var(--color-header-chip-border);border-radius:var(--radius-pill);background:var(--color-header-chip-bg);color:var(--color-header-chip-text);padding:0.35rem 0.7rem;line-height:1.1;white-space:nowrap;list-style:none;cursor:pointer} .global-header__wallet-wrap{position:relative;display:inline-flex;flex-direction:column;align-items:flex-start} .global-header__wallet--guest{align-self:center} .global-header__wallet:hover{color:var(--color-header-chip-text);border-color:var(--color-header-chip-hover-border);background:var(--color-header-chip-hover-bg)} .global-header__wallet:focus-visible{outline:none;box-shadow:var(--shadow-focus)} .global-header__wallet-label{display:inline-flex;align-items:center;font-size:0.75rem;color:var(--color-header-text);text-transform:uppercase;letter-spacing:0.06em;line-height:1} .global-header__wallet-value{display:inline-flex;align-items:center;gap:0.34rem;font-size:0.92rem;font-weight:500;line-height:1} .global-header__wallet-value .ui-icon{display:block;width:0.95em;height:0.95em;flex:0 0 auto} .global-header__wallet-value [data-header-wallet-balance-number]{display:inline-block;line-height:1} .global-header__wallet-value.is-updating{color:#1f7a43;text-shadow:0 0 0 rgba(31, 122, 67, 0.18);animation:wallet-balance-pulse 0.72s ease} .global-header__wallet-reward-toast{position:absolute;top:calc(100% + 0.4rem);left:0;margin:0;padding:0.34rem 0.64rem;border-radius:0.62rem;background:#1f7a43;border:1px solid #1a6b3a;color:#f4fff8;font-size:0.76rem;font-weight:700;line-height:1.25;letter-spacing:0.01em;white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(8px) scale(0.985);box-shadow:0 10px 20px rgba(12, 51, 30, 0.28);z-index:160} .global-header__wallet-reward-toast.is-visible{animation:wallet-reward-toast 3.95s cubic-bezier(0.22, 0.61, 0.36, 1) both} @keyframes wallet-reward-toast{ 0% { opacity: 0; transform: translateY(8px) scale(0.985); } 16% { opacity: 1; transform: translateY(0) scale(1); } 76% { opacity: 1; transform: translateY(0) scale(1); } 100% { opacity: 0; transform: translateY(-5px) scale(0.995); } } @keyframes wallet-balance-pulse{ 0% { transform: translateY(0) scale(1); } 45% { transform: translateY(-1px) scale(1.03); } 100% { transform: translateY(0) scale(1); } } .global-header__notifications{position:relative;width:auto;border:1px solid var(--color-header-chip-border);border-radius:var(--radius-pill);background:var(--color-header-chip-bg);color:var(--color-header-text);font-size:0.82rem;font-weight:500;line-height:1.1;padding:0.35rem 0.68rem;cursor:pointer} .global-account-menu, .global-notifications-menu, .global-wallet-menu, .global-mobile-nav{margin-bottom:0;position:relative} .global-account-menu > summary, .global-notifications-menu > summary, .global-mobile-nav > summary{list-style:none;display:inline-flex;align-items:center;justify-content:center;gap:0.3rem;border:1px solid var(--color-header-chip-border);border-radius:var(--radius-pill);background:var(--color-header-chip-bg);color:var(--color-header-chip-text);padding:0.36rem 0.72rem;font-size:0.86rem;font-weight:600;line-height:1.1;cursor:pointer;margin-bottom:0;transition:border-color var(--motion-base) var(--motion-ease), background-color var(--motion-base) var(--motion-ease), box-shadow var(--motion-base) var(--motion-ease), color var(--motion-base) var(--motion-ease)} .global-account-menu > summary:hover, .global-notifications-menu > summary:hover, .global-mobile-nav > summary:hover{border-color:var(--color-header-chip-hover-border);background:var(--color-header-chip-hover-bg)} .global-account-menu > summary:focus-visible, .global-notifications-menu > summary:focus-visible, .global-mobile-nav > summary:focus-visible{outline:none;box-shadow:var(--shadow-focus)} .global-mobile-nav__toggle{width:2.15rem;height:2.15rem;padding:0;gap:0} .global-mobile-nav__toggle .ui-icon{width:1.05rem;height:1.05rem} .global-header__account-icon{display:none} .global-account-menu > summary::-webkit-details-marker, .global-notifications-menu > summary::-webkit-details-marker, .global-wallet-menu > summary::-webkit-details-marker, .global-mobile-nav > summary::-webkit-details-marker{display:none} .global-wallet-menu > summary::marker{content:''} .global-account-menu[open] > summary, .global-notifications-menu[open] > summary, .global-mobile-nav[open] > summary{border-color:var(--color-header-chip-hover-border);background:var(--color-header-chip-hover-bg)} .global-wallet-menu[open] > summary{border-color:var(--color-header-chip-hover-border);background:var(--color-header-chip-hover-bg)} .global-account-menu__panel, .global-notifications-menu__panel, .global-wallet-menu__panel, .global-mobile-nav__panel{margin-bottom:0;border:1px solid var(--color-menu-border);border-radius:var(--radius-md);background:var(--color-menu-bg);box-shadow:var(--shadow-md);padding:0.42rem} .global-account-menu__panel{position:absolute;right:0;top:calc(100% + 0.5rem);min-width:13rem;z-index:140} .global-notifications-menu__panel{position:absolute;right:0;top:calc(100% + 0.5rem);width:min(22rem, calc(100vw - 1.5rem));z-index:140} .global-wallet-menu__panel{position:absolute;right:0;top:calc(100% + 0.5rem);width:min(15rem, calc(100vw - 1.5rem));z-index:140;display:grid;gap:0.2rem} .global-wallet-menu.is-ready > .global-wallet-menu__panel{opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity 170ms ease, transform 170ms ease} .global-wallet-menu.is-ready[open].is-open > .global-wallet-menu__panel{opacity:1;transform:translateY(0);pointer-events:auto} .global-wallet-menu.is-ready[open].is-closing > .global-wallet-menu__panel{opacity:0;transform:translateY(-6px);pointer-events:none} .global-wallet-menu__title{margin:0;padding:0.36rem 0.5rem 0.26rem;font-size:0.78rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:0.05em} .global-wallet-menu__link{display:flex;align-items:center;width:100%;border:0;background:transparent;border-radius:var(--radius-sm);color:var(--color-primary-dark);font-size:0.88rem;font-weight:500;line-height:1.2;padding:0.5rem 0.58rem;margin-bottom:0} .global-wallet-menu__link:hover{background:var(--color-menu-link-hover);color:var(--color-text-primary)} .global-wallet-menu__upsell{margin:0.22rem 0.08rem 0.08rem;padding:0.42rem 0.48rem 0.1rem;border-top:1px solid var(--color-menu-border);color:var(--color-text-muted);font-size:0.75rem;line-height:1.3} .global-wallet-menu__upsell a{color:var(--color-primary-dark);font-weight:600} .global-notifications-menu.is-ready > .global-notifications-menu__panel{opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity 170ms ease, transform 170ms ease} .global-notifications-menu.is-ready[open].is-open > .global-notifications-menu__panel{opacity:1;transform:translateY(0);pointer-events:auto} .global-notifications-menu.is-ready[open].is-closing > .global-notifications-menu__panel{opacity:0;transform:translateY(-6px);pointer-events:none} .global-account-menu__panel a, .global-mobile-nav__panel a, .global-account-menu__logout{display:flex;align-items:center;width:100%;border:0;background:transparent;border-radius:var(--radius-sm);color:var(--color-primary-dark);font-size:0.9rem;font-weight:500;line-height:1.2;padding:0.55rem 0.65rem;margin-bottom:0;box-shadow:none;text-align:left} .global-account-menu__panel a:hover, .global-mobile-nav__panel a:hover, .global-account-menu__logout:hover{background:var(--color-menu-link-hover);color:var(--color-text-primary);transform:none} .global-account-menu__panel form{margin-bottom:0} .global-notifications-menu__count{min-width:1rem;height:1rem;border-radius:999px;padding:0 0.22rem;background:var(--color-accent-coral);color:#fff;font-size:0.66rem;font-weight:700;line-height:1;display:inline-flex;align-items:center;justify-content:center;opacity:1;transform:translateY(0) scale(1);transition:opacity 160ms ease, transform 160ms ease} .global-notifications-menu__count.is-fading-out{opacity:0;transform:translateY(-2px) scale(0.85)} .global-notifications-menu__head{margin:0;padding:0.36rem 0.5rem 0.48rem;display:flex;align-items:center;justify-content:flex-start} .global-notifications-menu__title{margin:0;font-size:0.78rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:0.05em} .global-notifications-menu__empty{margin:0;padding:0.5rem 0.5rem 0.7rem;display:grid;gap:0.22rem} .global-notifications-menu__empty-title{margin:0;color:var(--color-text-primary);font-size:0.85rem;font-weight:600;line-height:1.3} .global-notifications-menu__empty-subtitle{margin:0;color:var(--color-text-muted);font-size:0.78rem;line-height:1.35} .global-notifications-menu__empty-actions{margin:0.18rem 0 0} .global-notifications-menu__empty-actions .btn{min-height:1.7rem;padding:0.28rem 0.58rem;font-size:0.74rem;border-radius:var(--radius-pill)} .global-notifications-menu__list{list-style:none;margin:0;padding:0;max-height:19rem;overflow:auto} .global-notifications-menu__item{margin:0;padding:0.5rem;border-top:1px solid var(--color-menu-border);background:transparent;opacity:1;transform:translateY(0);transition:opacity 150ms ease, transform 150ms ease, border-color var(--motion-base) var(--motion-ease), background-color var(--motion-base) var(--motion-ease)} .global-notifications-menu__item.is-clearing{opacity:0;transform:translateY(-4px)} .global-notifications-menu__item--unread{background:rgba(238, 168, 73, 0.08)} .global-notifications-menu__item:hover, .global-notifications-menu__item:focus-within{border-top-color:var(--color-border)} .global-notifications-menu__item-row{display:flex;align-items:flex-start;gap:var(--space-2)} .global-notifications-menu__item-body{min-width:0;flex:1 1 auto} .global-notifications-menu__dismiss{width:1.65rem;height:1.65rem;min-height:1.65rem;border-radius:var(--radius-pill);border:1px solid var(--color-menu-border);background:transparent;color:var(--color-text-muted);box-shadow:none;padding:0;flex:0 0 auto} .global-notifications-menu__dismiss:hover{background:var(--color-menu-link-hover);border-color:var(--color-border);color:var(--color-text-primary);transform:none;box-shadow:none} .global-notifications-menu__dismiss:disabled{opacity:0.5;cursor:default} .global-notifications-menu__item-link{display:block;border-radius:var(--radius-sm);padding:0.12rem;color:inherit;transition:background-color var(--motion-base) var(--motion-ease), box-shadow var(--motion-base) var(--motion-ease)} .global-notifications-menu__item-link:hover{background:var(--color-menu-link-hover);color:inherit} .global-notifications-menu__item-link:focus-visible{outline:none;box-shadow:var(--shadow-focus)} .global-notifications-menu__item-title{margin:0;color:var(--color-text-primary);font-size:0.85rem;font-weight:600;line-height:1.25;display:inline-flex;align-items:center;gap:0.38rem} .global-notifications-menu__item-dot{width:0.42rem;height:0.42rem;border-radius:999px;background:var(--color-accent-coral);box-shadow:0 0 0 2px rgba(244, 107, 69, 0.15);flex:0 0 auto} .global-notifications-menu__item-summary{margin:0.2rem 0 0;color:var(--color-text-muted);font-size:0.78rem;line-height:1.35} .global-notifications-menu__item-meta{margin:0.28rem 0 0;color:var(--color-text-muted);font-size:0.72rem;line-height:1.2} .global-notifications-menu__item-cta{margin-left:0.5rem;color:var(--color-primary-dark);font-weight:600} .global-notifications-menu__footer{margin:0;padding:0.45rem 0.5rem 0.3rem;border-top:1px solid var(--color-menu-border);display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);flex-wrap:wrap} .global-notifications-menu__footer a{color:var(--color-primary-dark);font-size:0.82rem;font-weight:600} .global-notifications-menu__footer a:hover{color:var(--color-text-primary)} .global-notifications-menu__clear-all{border:1px solid var(--color-menu-border);background:transparent;color:var(--color-primary-dark);border-radius:var(--radius-pill);padding:0.18rem 0.52rem;min-height:1.65rem;font-size:0.72rem;font-weight:600;line-height:1;box-shadow:none} .global-notifications-menu__clear-all:hover{background:var(--color-menu-link-hover);border-color:var(--color-border);transform:none;box-shadow:none} .global-notifications-menu__clear-all:disabled{opacity:0.55;cursor:default} @media (max-width: 700px){.global-notifications-menu__footer{flex-direction:column;align-items:stretch} .global-notifications-menu__clear-all{width:100%;justify-content:center}} .global-mobile-nav{display:none} .global-mobile-nav__panel{position:absolute;right:0;top:calc(100% + 0.5rem);width:min(19rem, calc(100vw - 1rem));max-height:calc(100vh - 5.5rem);max-height:calc(100dvh - 5.5rem);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;z-index:140} .global-mobile-nav__divider{display:block;height:1px;margin:0.42rem 0;background:var(--color-menu-border)} .global-mobile-nav__section-label{margin:0.5rem 0.6rem 0.24rem;color:var(--color-text-muted);font-size:0.7rem;font-weight:600;letter-spacing:0.05em;line-height:1.2;text-transform:uppercase} .main-container{flex:1;padding-block:var(--space-6)} .site-footer{margin-top:auto;margin-bottom:0;border-top:1px solid var(--color-footer-border);color:var(--color-footer-text)} .global-footer h2, .global-footer h3{color:#ffffff;margin-bottom:var(--space-2)} .global-footer h2{font-size:1.08rem} .global-footer h3{font-size:0.9rem;text-transform:uppercase;letter-spacing:0.04em} @media (max-width: 980px){.site-header__inner{grid-template-columns:1fr auto} .global-header__left{gap:var(--space-3)} .global-nav{display:none} .global-mobile-nav{display:block} } @media (max-width: 700px){.site-header__inner, .site-footer__inner, .main-container{width:min(1100px, 100% - 1.25rem)} .site-header__inner{grid-template-columns:minmax(0, 1fr) auto;gap:0.42rem} .global-header__left{min-width:0} .global-header__brand{min-width:0} .global-header__brand .brand-link__text{font-size:0.96rem} .site-header__auth{flex:0 0 auto;gap:0.34rem} .site-header__auth .btn, .global-header__wallet, .global-account-menu > summary, .global-mobile-nav > summary{width:2.05rem;min-width:2.05rem;height:2.05rem;min-height:2.05rem;padding:0;border-radius:var(--radius-pill);gap:0;flex:0 0 auto} .site-header__auth .btn .ui-icon, .global-header__wallet .ui-icon, .global-mobile-nav__toggle .ui-icon{width:1.02rem;height:1.02rem} .global-header__wallet-label, .global-header__wallet-amount, .global-header__wallet-units, .global-header__account-label, .global-header__auth-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0} .global-header__wallet-value{gap:0} .global-header__account-icon{display:inline-flex;align-items:center;justify-content:center} .global-header__account-icon .ui-icon{width:1.02rem;height:1.02rem} .global-header__wallet-reward-toast{font-size:0.72rem;padding:0.32rem 0.56rem;max-width:min(78vw, 16rem);white-space:normal} .global-header__wallet-value{font-size:0.83rem} .global-header__notifications{display:none} .global-notifications-menu__panel{right:-0.2rem} .global-wallet-menu__panel{right:-0.2rem} .global-header__brand .brand-link__icon{height:1.92rem} } @media (max-width: 380px){.site-header__inner{width:min(1100px, 100% - 0.8rem);gap:0.28rem} .site-header__auth{gap:0.26rem} .site-header__auth .btn, .global-header__wallet, .global-account-menu > summary, .global-mobile-nav > summary{width:1.92rem;min-width:1.92rem;height:1.92rem;min-height:1.92rem} .global-header__brand .brand-link__icon{height:1.72rem} .global-header__brand .brand-link__text{font-size:0.88rem} .global-header__auth-link--register{order:1} .global-header__auth-link--login, .global-account-menu{order:2} .global-mobile-nav{order:3} .global-header__wallet-wrap, .global-header__wallet--guest{order:5}} @media (prefers-reduced-motion: reduce){.global-wallet-menu.is-ready > .global-wallet-menu__panel, .global-wallet-menu.is-ready[open].is-open > .global-wallet-menu__panel, .global-wallet-menu.is-ready[open].is-closing > .global-wallet-menu__panel, .global-notifications-menu.is-ready > .global-notifications-menu__panel, .global-notifications-menu.is-ready[open].is-open > .global-notifications-menu__panel, .global-notifications-menu.is-ready[open].is-closing > .global-notifications-menu__panel{transition:none;transform:none} .global-header__wallet-reward-toast.is-visible{animation:none;opacity:1;transform:none}} button, input[type='submit']{color:#fff} .sr-only{position:absolute !important;clip:rect(0, 0, 0, 0);white-space:nowrap} .section-stack{gap:var(--space-5)} .hero{border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-4)} .homepage-hero{grid-template-columns:2fr 1fr;padding-block:clamp(0.95rem, 2vw, 1.3rem);width:100%} .homepage-hero__content{max-width:100%;box-sizing:border-box} .homepage-directory .hero.homepage-hero{padding:clamp(1rem, 1.8vw, 1.35rem) clamp(1.5rem, 3vw, 2rem);background-image:linear-gradient(135deg, rgba(48, 78, 108, 0.28), rgba(20, 39, 60, 0.13) 58%, rgba(65, 90, 116, 0.2)), linear-gradient(90deg, rgba(10, 18, 28, 0.08), rgba(10, 18, 28, 0.02) 58%, rgba(10, 18, 28, 0.07)), url('/assets/images/components/01_background_only_clean.png');background-image:linear-gradient(135deg, rgba(48, 78, 108, 0.28), rgba(20, 39, 60, 0.13) 58%, rgba(65, 90, 116, 0.2)), linear-gradient(90deg, rgba(10, 18, 28, 0.08), rgba(10, 18, 28, 0.02) 58%, rgba(10, 18, 28, 0.07)), image-set(url('/assets/images/components/01_background_only_clean.webp?rev=b8c3870ace940749') type('image/webp'), url('/assets/images/components/01_background_only_clean.png') type('image/png'));background-size:cover;background-position:center;background-repeat:no-repeat;background-blend-mode:screen, normal, normal} .homepage-hero__eyebrow, .homepage-section__kicker{margin:0;font-size:0.82rem;letter-spacing:0.06em;text-transform:uppercase;font-weight:700;color:#52606d} .homepage-directory .homepage-hero__eyebrow{display:inline-flex;align-items:center;gap:0.08rem;margin-bottom:0.35rem;color:var(--color-accent-orange)} .homepage-hero__eyebrow-marker{display:block;width:2.65em;height:2.65em;object-fit:contain;flex:0 0 auto} .hero__title{margin:0;font-size:clamp(1.6rem, 3.8vw, 2.2rem);overflow-wrap:anywhere} .homepage-directory .homepage-hero .hero__title{max-width:100%;font-size:clamp(1.85rem, 5.2vw, 3.05rem);line-height:1.08;white-space:normal;overflow-wrap:anywhere;word-break:normal} .homepage-hero__title-divider{display:block;width:min(34rem, 100%);height:0.72rem;margin:-0.24rem 0 0.02rem;background:url('/assets/images/components/05_glowing_underline_accent_transparent.png') center / 100% 100% no-repeat} .hero__subtitle{margin:0} .homepage-hero__actions{margin:0;min-width:0;box-sizing:border-box} .homepage-hero__actions .btn{max-width:100%;min-width:0;box-sizing:border-box;white-space:normal;overflow-wrap:anywhere} .homepage-hero__button-icon{display:block;width:1.1em;height:1.1em;object-fit:contain;flex:0 0 auto} .homepage-hero__promo-link{margin-top:0.25rem} .homepage-directory .homepage-hero .hero__title{margin-bottom:0.45rem} .homepage-directory .homepage-hero .hero__subtitle{margin-bottom:0.75rem} .homepage-hero__promo-anchor{display:inline-grid;gap:0.14rem;max-width:100%;text-decoration:none} .homepage-hero__promo-text{display:inline-flex;align-items:center;gap:var(--space-2);min-width:0;max-width:100%} .homepage-hero__promo-text span{min-width:0;overflow-wrap:anywhere} .homepage-hero__promo-icon{display:block;width:2.15em;height:2.15em;object-fit:contain;flex:0 0 auto} .homepage-hero__promo-underline{display:block;width:100%;max-width:none;height:0.62rem;background:url('/assets/images/components/06_dotted_underline_accent_transparent.png') center / 100% 100% no-repeat} .homepage-hero__stats{display:grid;gap:var(--space-2);align-content:start} .homepage-hero__stats-title{margin:0} .platform-stats-grid{width:100%;max-width:100%;box-sizing:border-box} .platform-stat-card{margin:0;width:100%;max-width:100%;box-sizing:border-box} .platform-stat-card h3{margin:0} .platform-stat-card__value{margin:0;font-size:clamp(1.3rem, 2.4vw, 1.75rem);color:var(--color-accent-orange)} .homepage-hero__stats .platform-stat-card__value{color:var(--color-accent-orange)} .platform-stat-card__hint{margin:0} .homepage-section{border-radius:var(--radius-md);background:var(--color-bg-card);box-shadow:var(--shadow-sm);padding:var(--space-4);max-width:100%;box-sizing:border-box} .homepage-section--band{background:linear-gradient(180deg, #fff 0%, #fff8f0 100%)} .homepage-section__head, .homepage-section__content{display:grid;gap:var(--space-2)} .homepage-section__head > *{margin:0} .homepage-section__lead{margin:0} .homepage-featured-servers{margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid rgba(168, 189, 209, 0.24);position:relative;overflow:visible} .homepage-featured-server-grid{--featured-server-card-gap:clamp(0.72rem, 1.6vw, 1rem);display:flex;gap:var(--featured-server-card-gap);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none} .homepage-featured-server-grid::-webkit-scrollbar{display:none} .state-message{border-radius:var(--radius-sm);padding:var(--space-3);background:var(--color-bg-soft)} .state-message--empty{color:var(--color-text-muted)} .homepage-empty-state, .homepage-empty-state__hint, .homepage-empty-state__actions{margin:0} .homepage-game-grid{grid-template-columns:repeat(auto-fit, minmax(16rem, 1fr));gap:var(--space-3)} .homepage-game-card{background:linear-gradient(160deg, rgba(var(--game-accent-rgb), 0.09) 0%, rgba(var(--game-accent-rgb), 0.03) 100%);padding:var(--space-3);max-width:100%;box-sizing:border-box} .homepage-game-card > *{position:relative;z-index:1} .homepage-game-card h3, .homepage-game-card p{margin:0} .homepage-game-card__visual{border:1px solid rgba(var(--game-accent-rgb), 0.28);background:#fff} .homepage-game-card__logo, .homepage-game-card__visual > .game-logo, .homepage-game-card__visual > .game-icon{width:100%;height:100%;object-fit:contain;border:0;background:transparent;box-shadow:none;padding:0} .homepage-game-card__actions{margin:0;max-width:100%;min-width:0} .homepage-game-card__actions .btn{max-width:100%;white-space:normal} .homepage-section.homepage-faq-section{border:0;padding:clamp(1.25rem, 3vw, 2rem) 0 0;gap:clamp(1.35rem, 2.6vw, 2rem)} .homepage-faq-section .homepage-section__head{justify-items:center;gap:0.55rem;text-align:center} .homepage-faq-section .homepage-section__head h2{color:#f5f8fc;font-size:clamp(2.35rem, 5.5vw, 4.15rem);line-height:1.02} .homepage-faq-section .homepage-section__lead{max-width:48rem;color:#aebdca;font-size:clamp(1rem, 1.8vw, 1.18rem);line-height:1.5} .homepage-support-cta{position:relative;display:grid;grid-template-columns:minmax(0, 1.25fr) 1px minmax(15rem, 0.8fr);align-items:center;gap:clamp(1.25rem, 3vw, 2.35rem);margin-top:var(--space-3);padding:clamp(1rem, 2vw, 1.35rem) clamp(1.1rem, 2.5vw, 1.8rem);border:1px solid rgba(120, 143, 168, 0.45);border-radius:var(--radius-md);overflow:hidden} .homepage-support-cta::before{content:'';position:absolute;inset:0.08rem 0.55rem auto;height:1px;opacity:0.85;pointer-events:none} @media (max-width: 900px){ .homepage-support-cta{grid-template-columns:1fr;justify-items:center;text-align:center} } @media (max-width: 768px){.page-hierarchy.homepage-directory, .page-hierarchy.homepage-directory .hero.homepage-hero, .page-hierarchy.homepage-directory .homepage-hero__content, .page-hierarchy.homepage-directory .homepage-hero__stats, .page-hierarchy.homepage-directory .homepage-section, .page-hierarchy.homepage-directory .homepage-section__head, .page-hierarchy.homepage-directory .homepage-section__content, .page-hierarchy.homepage-directory .card, .page-hierarchy.homepage-directory .card-body, .page-hierarchy.homepage-directory .homepage-game-grid, .page-hierarchy.homepage-directory .homepage-game-card, .page-hierarchy.homepage-directory .homepage-growth-cta__cards, .page-hierarchy.homepage-directory .homepage-growth-card, .page-hierarchy.homepage-directory .platform-stats-grid, .page-hierarchy.homepage-directory .platform-stat-card{width:100%;max-width:100%;box-sizing:border-box;min-width:0} .page-hierarchy.homepage-directory .hero.homepage-hero{padding:clamp(0.9rem, 4vw, var(--space-3)) clamp(0.75rem, 3.5vw, var(--space-3))} .page-hierarchy.homepage-directory .homepage-hero .hero__title{font-size:clamp(1.7rem, 8vw, 2.4rem);line-height:1.08;overflow-wrap:normal;word-break:normal} .page-hierarchy.homepage-directory .homepage-hero__actions, .page-hierarchy.homepage-directory .homepage-empty-state__actions{display:grid;grid-template-columns:minmax(0, 1fr);width:100%;max-width:100%} .page-hierarchy.homepage-directory .homepage-hero__actions .btn, .page-hierarchy.homepage-directory .homepage-empty-state__actions .btn{width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere} .page-hierarchy.homepage-directory .homepage-hero__promo-anchor, .page-hierarchy.homepage-directory .homepage-hero__promo-text{max-width:100%;min-width:0} .page-hierarchy.homepage-directory .homepage-hero__promo-text span{min-width:0;overflow-wrap:anywhere} .page-hierarchy.homepage-directory .platform-stats-grid, .page-hierarchy.homepage-directory .homepage-game-grid, .page-hierarchy.homepage-directory .homepage-growth-cta__cards{grid-template-columns:minmax(0, 1fr)} .page-hierarchy.homepage-directory .platform-stat-card, .page-hierarchy.homepage-directory .homepage-game-card, .page-hierarchy.homepage-directory .homepage-growth-card{width:100%;max-width:100%;min-width:0} .page-hierarchy.homepage-directory .homepage-game-card__actions{display:grid;grid-template-columns:minmax(0, 1fr);width:100%;max-width:100%} .page-hierarchy.homepage-directory .homepage-game-card__actions .btn{width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere} .page-hierarchy.homepage-directory .homepage-featured-servers, .page-hierarchy.homepage-directory .homepage-featured-server-carousel, .page-hierarchy.homepage-directory .homepage-featured-server-grid{width:100%;max-width:100%;box-sizing:border-box;min-width:0} .page-hierarchy.homepage-directory .homepage-featured-server-grid{padding-inline:0} .page-hierarchy.homepage-directory .homepage-game-card__visual{width:6rem;height:6rem} .page-hierarchy.homepage-directory .homepage-faq-section .homepage-section__head h2{font-size:clamp(2rem, 10vw, 2.85rem);overflow-wrap:anywhere}} .homepage-directory .homepage-section--cta{position:relative;overflow:hidden;display:grid;gap:clamp(1.25rem, 2.4vw, 1.8rem);min-height:clamp(27rem, 50vw, 34rem);padding:clamp(1.6rem, 3vw, 2.3rem);border-color:rgba(243, 180, 95, 0.42);background-color:#101b29} @media (max-width: 980px){ } @media (max-width: 620px){.homepage-directory .homepage-section--cta{padding:var(--space-3)} } .homepage-section__kicker, .homepage-hero__eyebrow{color:#a8bdd1} .homepage-directory .homepage-game-card, .homepage-directory .homepage-game-card__visual{transition-property:transform, opacity} @media (prefers-reduced-motion: reduce){.homepage-directory .homepage-game-card, .homepage-directory .homepage-game-card__visual{transition:none !important;transform:none !important}} .homepage-directory .hero.homepage-hero{border-radius:var(--radius-lg);box-shadow:var(--shadow-md);grid-template-columns:minmax(0, 1.2fr) minmax(18rem, 0.8fr);align-items:start} .homepage-directory .homepage-hero__eyebrow{font-weight:600;letter-spacing:0.08em} .homepage-directory .homepage-hero .hero__subtitle{max-width:56ch} .homepage-directory .homepage-hero__stats{border:1px solid #3b5166;border-radius:var(--radius-md);padding:var(--space-3)} .homepage-directory .homepage-hero__stats-title{margin-bottom:var(--space-2);font-size:0.82rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase} .homepage-directory .homepage-hero .platform-stat-card{box-shadow:0 6px 14px rgba(23, 38, 56, 0.08);gap:0.22rem;align-content:start} .homepage-directory .homepage-hero .platform-stat-card h3{font-size:0.92rem} .homepage-directory .homepage-hero .platform-stat-card__value{font-size:clamp(1.35rem, 2.4vw, 1.75rem)} @media (max-width: 900px){.homepage-directory .hero.homepage-hero{grid-template-columns:1fr;gap:var(--space-3)}} @media screen and (max-width: 768px) and (max-height: 1000px){.homepage-directory .homepage-game-grid > .homepage-game-card:nth-child(n + 5){content-visibility:auto;contain-intrinsic-size:auto 22rem} .homepage-directory[data-homepage-defer-lower] > .homepage-growth-cta{content-visibility:auto;contain-intrinsic-size:auto 88rem}} @media screen and (min-width: 621px) and (max-width: 768px) and (max-height: 1000px){.homepage-directory[data-homepage-defer-lower] > .homepage-growth-cta{contain-intrinsic-size:auto 78rem}} .gaming-updates-section, .gaming-update-card__body{display:grid;gap:var(--space-2)} .gaming-updates-section > *, .gaming-update-card__body > *{margin-bottom:0} .gaming-update-card-grid{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:var(--space-3)} @media (max-width: 980px){.gaming-update-card-grid{grid-template-columns:repeat(2, minmax(0, 1fr))}} @media (max-width: 640px){ .gaming-update-card-grid{grid-template-columns:1fr}} .btn, button, input[type='submit']{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);border-radius:var(--radius-sm);border:1px solid transparent;padding:0.64rem 1.05rem;font-weight:600;letter-spacing:0.01em;line-height:1.2;cursor:pointer;box-shadow:0 1px 0 rgba(15, 23, 42, 0.08);transition:background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.14s ease, box-shadow 0.2s ease} .btn:active, button:active, input[type='submit']:active{transform:translateY(1px);box-shadow:0 1px 0 rgba(15, 23, 42, 0.05)} .btn:focus-visible, button:focus-visible, input[type='submit']:focus-visible{outline:3px solid var(--color-focus-ring);outline-offset:3px;box-shadow:0 0 0 6px rgba(8, 15, 25, 0.86)} .btn:disabled, button:disabled, input[type='submit']:disabled, .btn[aria-disabled='true']{cursor:not-allowed;opacity:0.65;filter:saturate(0.8)} button, input[type='submit']{background:linear-gradient(160deg, #4b5968 0%, #3c4857 100%);border-color:#34404e;color:var(--color-white)} button:hover, input[type='submit']:hover{background:linear-gradient(160deg, #556577 0%, #42505f 100%);border-color:#2f3a46;box-shadow:0 6px 12px rgba(31, 41, 51, 0.18)} .btn-secondary{background:linear-gradient(160deg, #f3b45f 0%, #eea849 100%)} .btn-secondary:hover{background:linear-gradient(160deg, #f6bf70 0%, #f0af58 100%);box-shadow:0 6px 12px rgba(238, 168, 73, 0.3)} .btn-outline{background:var(--color-btn-outline-bg);border-color:var(--color-btn-outline-border);color:var(--color-btn-outline-text)} .btn-outline:hover{background:var(--color-btn-outline-hover-bg);border-color:var(--color-btn-outline-hover-border);color:var(--color-btn-outline-hover-text);box-shadow:0 4px 10px rgba(44, 55, 67, 0.14)} .card{background:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:hidden;transition:border-color 0.2s ease, box-shadow 0.2s ease, transform 0.16s ease} .card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)} .card-body{padding:var(--space-3)} .card-body> :last-child{margin-bottom:0} details>summary:focus-visible{outline:none;box-shadow:var(--shadow-focus);border-radius:var(--radius-sm)} .hero{background:linear-gradient(140deg, #ffffff 0%, #fff4e6 100%);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--space-7) var(--space-6)} .hero__title{font-size:clamp(2rem, 4vw, 3.25rem);margin-bottom:var(--space-3)} .hero__subtitle{color:var(--color-text-muted);max-width:50rem;margin-bottom:var(--space-5)} .section-stack{display:grid;gap:var(--space-4)} .section-stack>*{margin-bottom:0} .page-hierarchy{gap:var(--space-5)} .page-hierarchy>*{margin-bottom:0} .section-surface{border-radius:var(--radius-lg)} .section-surface--band{border:1px solid #d9e5f1;background:linear-gradient(180deg, #f8fbff 0%, #f2f7fc 100%)} .section-surface>.card-body>h2, .section-surface>.card-body>h3{margin-bottom:var(--space-1);font-size:clamp(1.12rem, 1.7vw, 1.34rem);line-height:1.24} .homepage-section__head h2{font-size:clamp(1.12rem, 1.75vw, 1.34rem)} .section-surface>.card-body>p:last-child{margin-bottom:0} .state-message{border-radius:var(--radius-md);border:1px solid var(--color-border);padding:var(--space-4)} .state-message[data-reward-earned='1']{position:relative;overflow:hidden} .state-message.is-reward-highlight{animation:reward-earned-highlight 720ms var(--motion-ease) both} .state-message>*:last-child{margin-bottom:0} .tilt-plus-mark{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-pill);border:1px solid #d9ab3a;background:linear-gradient(150deg, #ffe8a6 0%, #f2c560 100%);font-size:0.74rem;font-weight:800;letter-spacing:0.02em;line-height:1.1;padding:0.14rem 0.46rem;vertical-align:middle;white-space:nowrap} .state-message--empty{background:#fff8ef;border-color:#f2d7ae} .state-message--loading{background:linear-gradient(165deg, #f5f8fc 0%, #edf3f9 100%);border-color:#d3dee9} .homepage-directory{display:grid;gap:var(--space-5)} .homepage-section{display:grid;gap:var(--space-3);border-radius:var(--radius-lg);padding:clamp(0.95rem, 2vw, 1.3rem);border:1px solid #d9e4ef} .homepage-section--band{background:linear-gradient(180deg, #f8fbff 0%, #f2f7fc 100%)} .homepage-section__head{display:grid;gap:0.42rem;margin-bottom:var(--space-1)} .homepage-section__kicker{margin-bottom:0;font-size:0.74rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase} .homepage-section__head h2{margin-bottom:0;font-size:clamp(1.15rem, 1.85vw, 1.36rem);line-height:1.25} .homepage-section__content>*:last-child{margin-bottom:0} .homepage-empty-state{margin-bottom:0;display:grid;gap:var(--space-1)} .homepage-empty-state__hint{margin-bottom:0;color:var(--color-text-muted)} .homepage-empty-state__actions{margin-bottom:0} .homepage-hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:0;max-width:100%} .homepage-hero{display:grid;grid-template-columns:minmax(0, 1.2fr) minmax(18rem, 0.8fr);align-items:start;gap:var(--space-4);max-width:100%;box-sizing:border-box} .homepage-hero__content{margin-bottom:0;min-width:0} .homepage-hero__stats{margin-bottom:0;border:1px solid #d6e1ec;border-radius:var(--radius-md);background:linear-gradient(160deg, #f8fbfe 0%, #edf3f9 100%);padding:var(--space-3);min-width:0;max-width:100%;box-sizing:border-box} .homepage-hero__stats-title{margin-bottom:var(--space-2);font-size:0.82rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase} .homepage-hero__eyebrow{margin-bottom:var(--space-2);font-size:0.82rem;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--color-text-muted)} .homepage-hero .hero__title{max-width:18ch;margin-bottom:var(--space-3);overflow-wrap:anywhere} .homepage-hero .hero__subtitle{max-width:56ch;margin-bottom:var(--space-4)} .homepage-section__lead{margin-bottom:var(--space-2);color:var(--color-text-muted);font-size:1rem;line-height:1.5} .platform-stats-grid{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--space-2);list-style:none;margin:0;padding:0} .platform-stat-card{margin-bottom:0;padding:var(--space-3);border:1px solid #d4deea;border-radius:var(--radius-sm);background:linear-gradient(160deg, #f9fbfe 0%, #edf3f9 100%);box-shadow:0 6px 14px rgba(23, 38, 56, 0.08);display:grid;gap:0.22rem;align-content:start;min-width:0} .platform-stat-card h3{margin-bottom:0;font-size:0.92rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:0.04em} .platform-stat-card__value{margin-bottom:0;font-size:clamp(1.35rem, 2.4vw, 1.75rem);font-weight:700;color:var(--color-primary-dark);overflow-wrap:anywhere} .platform-stat-card__hint{margin-bottom:0;color:var(--color-text-muted);font-size:0.8rem} .ad-banner-region{margin-bottom:var(--space-3)} .ad-banner-slot{display:flex;justify-content:center;align-items:center;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:linear-gradient(165deg, #fafcfe 0%, #f2f7fc 100%);padding:0.42rem} .ad-banner-slot__link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none} .ad-banner-slot__image{display:block;width:auto;max-width:min(100%, 728px);height:auto;max-height:90px;border-radius:0.3rem} .homepage-game-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));gap:var(--space-4)} .homepage-game-card{margin-bottom:0;border:1px solid #d7e1eb;border-radius:var(--radius-md);padding:var(--space-4);background:linear-gradient(155deg, #ffffff 0%, #f5f9fd 100%);box-shadow:var(--shadow-sm);display:grid;gap:0.9rem;position:relative;overflow:hidden;min-height:100%;transition:transform var(--motion-base) var(--motion-ease), box-shadow var(--motion-base) var(--motion-ease), border-color var(--motion-base) var(--motion-ease), background var(--motion-base) var(--motion-ease);isolation:isolate} .homepage-game-card>*{position:relative;z-index:1} .homepage-game-card--has-bg{border-color:rgba(var(--game-accent-rgb), 0.48);box-shadow:0 12px 24px rgba(31, 41, 51, 0.18);color:#ffffff} .homepage-game-card--has-bg::before{content:none} .homepage-game-card::after{content:'';position:absolute;inset:auto -20% -55% auto;width:11rem;height:11rem;background:radial-gradient(circle, rgba(var(--game-accent-rgb), 0.18) 0%, rgba(var(--game-accent-rgb), 0) 70%);pointer-events:none} .homepage-game-card--has-bg::after{inset:auto -18% -48% auto;background:radial-gradient(circle, rgba(var(--game-accent-rgb), 0.35) 0%, rgba(var(--game-accent-rgb), 0) 72%);z-index:0} .homepage-game-card__visual{width:5.15rem;height:5.15rem;border-radius:var(--radius-md);display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(var(--game-accent-rgb), 0.32);background:linear-gradient(160deg, rgba(var(--game-accent-rgb), 0.15) 0%, rgba(var(--game-accent-rgb), 0.06) 100%);box-shadow:0 8px 16px rgba(var(--game-accent-rgb), 0.17);margin-bottom:var(--space-2);overflow:hidden;padding:0.12rem;position:relative;z-index:1;transition:transform var(--motion-base) var(--motion-ease), box-shadow var(--motion-base) var(--motion-ease)} .homepage-game-card__visual::after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.38);pointer-events:none} .homepage-game-card__logo{width:100%;height:100%;border-radius:calc(var(--radius-md) - 0.12rem);object-fit:contain;border:0;background:transparent;box-shadow:none;padding:0} .homepage-game-card h3{margin-bottom:0;position:relative;z-index:1;font-size:1.08rem;line-height:1.2} .homepage-game-card__count{margin-bottom:0;font-size:0.92rem;position:relative;z-index:1;font-weight:600} .homepage-game-card__meta{margin-bottom:0;font-size:0.84rem;position:relative;z-index:1} .homepage-game-card__actions{margin-bottom:0;display:flex;flex-wrap:wrap;gap:0.44rem;position:relative;z-index:1;margin-top:auto;padding-top:var(--space-1)} .homepage-game-card__actions .btn{min-width:0;min-height:2.2rem;padding-inline:0.72rem} .homepage-game-card__actions .btn-secondary{box-shadow:0 8px 14px rgba(238, 168, 73, 0.22);font-weight:700} .homepage-game-card__actions .btn-secondary:hover{box-shadow:0 10px 18px rgba(238, 168, 73, 0.3)} .homepage-game-card__links{margin-bottom:0;display:flex;flex-wrap:wrap;align-items:center;gap:0.45rem 0.9rem;position:relative;z-index:1} .homepage-game-card--has-bg h3, .homepage-game-card--has-bg .homepage-game-card__count, .homepage-game-card--has-bg .homepage-game-card__meta, .homepage-game-card--has-bg .ui-inline{text-shadow:0 1px 2px rgba(0, 0, 0, 0.42)} .homepage-game-card--has-bg .homepage-game-card__visual{border-color:rgba(255, 255, 255, 0.5);background:rgba(255, 255, 255, 0.9);box-shadow:0 10px 22px rgba(7, 13, 20, 0.26)} .homepage-game-card__actions .btn-secondary{flex:1 1 100%} .homepage-game-card__actions .btn-outline{flex:1 1 calc(50% - 0.22rem)} .homepage-game-card:hover{transform:translateY(-3px);border-color:rgba(var(--game-accent-rgb), 0.4);box-shadow:0 12px 22px rgba(var(--game-accent-rgb), 0.2)} .homepage-game-card:hover .homepage-game-card__visual{transform:translateY(-1px) scale(1.02);box-shadow:0 10px 20px rgba(var(--game-accent-rgb), 0.25)} @media (max-width: 900px){.hero{padding:var(--space-6) var(--space-4);max-width:100%;box-sizing:border-box} .homepage-hero{grid-template-columns:1fr;gap:var(--space-3)} .page-hierarchy{gap:var(--space-4)} .homepage-directory{gap:var(--space-4)} .homepage-section{gap:var(--space-2);padding:var(--space-3)} .homepage-hero .hero__title{max-width:100%}} @media (max-width: 760px){.homepage-directory, .homepage-directory .hero.homepage-hero, .card, .card-body{width:100%;max-width:100%;box-sizing:border-box} .homepage-directory .hero.homepage-hero{padding:var(--space-4) var(--space-3)} .homepage-hero__actions{display:grid;grid-template-columns:minmax(0, 1fr);width:100%} .homepage-hero__actions .btn, .homepage-empty-state__actions .btn{width:100%;min-width:0;white-space:normal} .platform-stats-grid{grid-template-columns:1fr} .homepage-game-card__actions .btn{width:100%;white-space:normal} .homepage-game-card__visual{width:4.25rem;height:4.25rem}} .state-message--success{background:linear-gradient(165deg, #e9f8f0 0%, #dff3e8 100%)} .state-message--error{background:linear-gradient(165deg, #fff2ef 0%, #ffe8e2 100%)} .state-message--info{background:linear-gradient(165deg, #f5f8fc 0%, #edf3f9 100%);border-color:#d3dee9} .state-message--warning{background:linear-gradient(165deg, #fff8ed 0%, #fff1df 100%);border-color:#efcc98} @keyframes flash-in{ from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } } @keyframes reward-earned-highlight{ 0% { transform: translateY(0); } 30% { transform: translateY(-1px); } 100% { transform: translateY(0); } } @keyframes reward-earned-burst{ from { opacity: 0.75; transform: scale(0.5); } to { opacity: 0; transform: scale(1.15); } } @keyframes reward-earned-badge{ 0% { opacity: 0; transform: translateY(6px) scale(0.92); } 20% { opacity: 1; transform: translateY(0) scale(1); } 100% { opacity: 0; transform: translateY(-8px) scale(1.02); } } @keyframes credit-reward-pulse{ 0%, 100% { opacity: 1; } 50% { opacity: 0.72; } } @media (prefers-reduced-motion: reduce){.state-message.is-reward-highlight{animation:none} } .sr-only{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px} .site-breadcrumbs{margin-bottom:var(--space-3)} .site-breadcrumbs__list{display:flex;flex-wrap:wrap;align-items:center;gap:0.35rem 0.55rem;margin:0;padding:0;list-style:none;color:var(--color-text-muted);font-size:0.84rem} .site-breadcrumbs__item{display:inline-flex;align-items:center;gap:0.55rem} .site-breadcrumbs__item:not(:last-child)::after{content:'/';color:#a7b4c2} .site-breadcrumbs__link{color:#48617b;text-decoration:none} .site-breadcrumbs__link:hover{color:#2e4359;text-decoration:underline;text-underline-offset:0.14em} .site-breadcrumbs__current{color:#42576c;font-weight:600} @media (max-width: 420px){ } .faq-accordion{display:grid;gap:clamp(0.75rem, 1.4vw, 1rem);width:100%;max-width:100%;box-sizing:border-box} @supports selector(::details-content){ } @media (max-width: 760px){ } .ui-inline{display:inline-flex;align-items:center;gap:0.45rem} .ui-icon{width:1em;height:1em;flex:0 0 auto} .ui-icon--sm{width:0.95em;height:0.95em} .game-accent{--game-accent:var(--color-accent-coral);--game-accent-rgb:244, 107, 69} .game-icon, .game-logo{width:2.2rem;height:1.45rem;display:inline-block;border-radius:0.48rem;border:1px solid rgba(var(--game-accent-rgb), 0.24);background:linear-gradient(160deg, rgba(var(--game-accent-rgb), 0.13) 0%, rgba(var(--game-accent-rgb), 0.06) 100%);object-fit:contain;vertical-align:middle;flex:0 0 auto;padding:0.12rem 0.16rem;box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.45);image-rendering:auto} .game-icon--sm, .game-logo--sm{width:1.9rem;height:1.2rem;border-radius:0.42rem;padding:0.1rem 0.14rem} .game-icon--lg, .game-logo--lg{width:3.05rem;height:2rem;border-radius:0.6rem;padding:0.16rem 0.2rem} .game-icon--fallback, .game-logo--fallback{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.28)} .homepage-game-card__visual>.game-logo, .homepage-game-card__visual>.game-icon{width:100%;height:100%;border:0;background:transparent;box-shadow:none;padding:0;object-fit:contain} .card:hover{border-color:#3a4d61} .hero{background:linear-gradient(140deg, #162334 0%, #1b2a3d 100%)} .section-surface--band{border-color:#3f5670;background:linear-gradient(180deg, #1a2b3f 0%, #162739 100%)} .homepage-hero__stats{border-color:#3b5166;background:linear-gradient(160deg, #19293b 0%, #172638 100%)} .homepage-section{border-color:#3a5168} .homepage-section--cta{border-color:#816635} .homepage-section--band{border-color:#3b5470;background:linear-gradient(180deg, #1c2e42 0%, #18293b 100%)} .homepage-section__kicker{color:#a8bdd1} .homepage-hero__stats-title{color:#adc0d3} .state-message--success{background:linear-gradient(165deg, #143427 0%, #173d2d 100%);border-color:#2c7f5b} .state-message--error{background:linear-gradient(165deg, #3a1f23 0%, #452428 100%);border-color:#8b4a50} .state-message--info, .state-message--loading{background:linear-gradient(165deg, #17273a 0%, #152436 100%);border-color:#3b5268} .state-message--warning, .state-message--empty{background:linear-gradient(165deg, #3b2e1f 0%, #463523 100%);border-color:#8b6a44} .btn-secondary{background:linear-gradient(160deg, #d8a14e 0%, #c68638 100%);border-color:#b7772d;color:#102033} .btn-secondary:hover{background:linear-gradient(160deg, #e0ad60 0%, #cf9247 100%);border-color:#c08137;color:#102033;box-shadow:0 6px 12px rgba(207, 146, 71, 0.28)} .tilt-plus-mark{border-color:#a6802e;color:#f6dfaa;background:linear-gradient(150deg, #6f541b 0%, #9d7423 100%)} .platform-stat-card{border-color:#3b5166;background:linear-gradient(160deg, #19293b 0%, #172638 100%)} .ad-banner-slot{border-color:#3a5168;background:linear-gradient(165deg, #1a2a3c 0%, #162536 100%)} .homepage-game-card{border-color:#3a5168;background:linear-gradient(155deg, #182738 0%, #162536 100%)} .homepage-game-card h3{color:#e6eff8} .homepage-game-card__count{color:#bed1e4} .homepage-game-card__meta{color:#a4b8cc} .homepage-game-card__visual{border-color:rgba(var(--game-accent-rgb), 0.42);background:linear-gradient(160deg, rgba(var(--game-accent-rgb), 0.2) 0%, rgba(var(--game-accent-rgb), 0.1) 100%)} .homepage-game-card__actions .btn-secondary{border-color:#c58338;box-shadow:0 8px 14px rgba(207, 146, 71, 0.24)} .homepage-game-card__visual::after{box-shadow:inset 0 0 0 1px rgba(175, 194, 214, 0.16)} .homepage-game-card--has-bg{border-color:rgba(var(--game-accent-rgb), 0.52);background:var(--game-card-bg-image);background-position:center;background-size:cover} .homepage-game-card--has-bg h3, .homepage-game-card--has-bg .homepage-game-card__count, .homepage-game-card--has-bg .homepage-game-card__meta, .homepage-game-card--has-bg .ui-inline{color:#ffffff} .game-icon, .game-logo{border-color:rgba(var(--game-accent-rgb), 0.36);background:linear-gradient(160deg, rgba(var(--game-accent-rgb), 0.18) 0%, rgba(var(--game-accent-rgb), 0.1) 100%);box-shadow:inset 0 0 0 1px rgba(168, 188, 210, 0.2)} .game-icon--fallback, .game-logo--fallback{border-color:#435a72;background:#1a2a3b} .btn:focus-visible, button:focus-visible, input[type='submit']:focus-visible, .btn-secondary:focus-visible, .btn-outline:focus-visible{outline:3px solid #7dd3fc;outline-offset:3px;box-shadow:0 0 0 6px rgba(8, 15, 25, 0.86), 0 0 0 8px rgba(125, 211, 252, 0.28)}