:root{--bg:#070b16;--panel:#111827;--line:rgba(255,255,255,.09);--text:#f5f7ff;--muted:#9ca8bf;--p:#8b5cf6;--c:#22d3ee;--green:#34d399;--r:22px;--max:1220px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:radial-gradient(circle at 15% -10%,rgba(139,92,246,.2),transparent 34%),radial-gradient(circle at 90% 10%,rgba(34,211,238,.12),transparent 28%),var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.55}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.topbar{position:sticky;top:0;z-index:20;width:min(calc(100% - 32px),var(--max));margin:16px auto 0;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);background:rgba(7,11,22,.78);backdrop-filter:blur(18px);border-radius:18px}.brand{display:flex;align-items:center;gap:10px;font-weight:900}.brand img{width:38px;height:38px}.brand.small img{width:30px;height:30px}.topbar nav{display:flex;align-items:center;gap:10px;color:#d9deeb;font-size:14px}.nav-toggle{display:none;background:none;border:0;color:#fff;font-size:23px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 18px;border:1px solid transparent;border-radius:12px;font-weight:800;transition:.2s}.btn:hover{transform:translateY(-1px)}.primary{background:linear-gradient(135deg,var(--p),#6d5dfc 48%,var(--c));box-shadow:0 12px 32px rgba(109,93,252,.28)}.secondary,.ghost{background:rgba(255,255,255,.055);border-color:var(--line)}.large{min-height:50px;padding:13px 22px}.full{width:100%}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.flash{width:min(calc(100% - 32px),var(--max));margin:14px auto 0;padding:13px 16px;border:1px solid rgba(52,211,153,.25);background:rgba(52,211,153,.1);color:#baf7df;border-radius:14px}.hero{width:min(calc(100% - 32px),var(--max));margin:74px auto 28px;display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;min-height:590px}.hero h1,.page-hero h1,.auth h1,.dash-head h1{margin:10px 0 18px;font-size:clamp(42px,6vw,76px);line-height:.98;letter-spacing:-.055em}.hero>div>p,.page-hero p,.auth-copy>p{color:var(--muted);font-size:18px;max-width:700px}.eyebrow{color:#9fdff0;font-size:12px;font-weight:900;letter-spacing:.18em}.actions{display:flex;gap:12px;margin:30px 0 24px}.trust{display:flex;flex-wrap:wrap;gap:16px;color:#b7c0d3;font-size:13px}.trust span:before{content:"✓";margin-right:7px;color:var(--green)}.hero-art{position:relative;min-height:480px;display:grid;place-items:center}.orb{position:absolute;border-radius:50%}.orb.a{width:260px;height:260px;background:rgba(139,92,246,.22);top:38px;left:40px}.orb.b{width:220px;height:220px;background:rgba(34,211,238,.17);right:26px;bottom:46px}.feature-card,.panel,.stats article,.auth-card,.verify-card,.chat{border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));backdrop-filter:blur(20px)}.feature-card{position:relative;width:min(100%,400px);padding:28px;border-radius:26px;z-index:2;box-shadow:0 24px 80px rgba(0,0,0,.35)}.row,.price,.section-head,.group-head,.dash-head,.chat-head,.verify-head{display:flex;align-items:center;justify-content:space-between;gap:18px}.mark{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:rgba(139,92,246,.22);font-weight:900}.badge{display:inline-flex;align-items:center;padding:5px 10px;border:1px solid var(--line);border-radius:999px;font-size:12px;font-weight:900;color:#cbd5e1}.badge.ok{color:#a7f3d0;background:rgba(52,211,153,.11)}.feature-card h3{font-size:28px;margin:24px 0 8px}.feature-card p{color:var(--muted)}.price{margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}.price small,.price strong{display:block}.price strong{font-size:22px}.chip{position:absolute;z-index:3;padding:12px 16px;border:1px solid var(--line);border-radius:14px;background:rgba(9,14,27,.9);font-weight:800;font-size:13px}.chip.c1{top:36px;right:10px}.chip.c2{bottom:50px;left:0}.section,.page-hero{width:min(calc(100% - 32px),var(--max));margin:96px auto}.section.narrow{max-width:820px}.section h2{font-size:clamp(30px,4vw,46px);margin:8px 0 0;letter-spacing:-.035em}.section-head{align-items:end;margin-bottom:30px}.platform-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.platform{min-height:260px;padding:24px;border:1px solid var(--line);border-radius:var(--r);background:rgba(255,255,255,.035);transition:.2s}.platform:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.22)}.platform>b{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:rgba(255,255,255,.08)}.platform h3{font-size:24px;margin:42px 0 8px}.platform p,.muted{color:var(--muted)}.platform.purple{background:linear-gradient(180deg,rgba(139,92,246,.13),rgba(255,255,255,.025))}.platform.green{background:linear-gradient(180deg,rgba(52,211,153,.11),rgba(255,255,255,.025))}.platform.blue{background:linear-gradient(180deg,rgba(34,211,238,.12),rgba(255,255,255,.025))}.platform.red{background:linear-gradient(180deg,rgba(251,113,133,.1),rgba(255,255,255,.025))}.split{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}.steps{display:grid;gap:14px}.steps article{display:flex;gap:18px;padding:22px;border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:18px}.steps article>span{color:#9fdff0;font-weight:900}.steps h3{margin:0 0 6px}.steps p{margin:0;color:var(--muted)}.cta{padding:34px;display:flex;justify-content:space-between;gap:32px;align-items:center;border:1px solid var(--line);border-radius:28px;background:linear-gradient(135deg,rgba(139,92,246,.15),rgba(34,211,238,.08))}.page-hero{min-height:250px;display:flex;flex-direction:column;justify-content:center;margin-top:60px}.page-hero h1{font-size:clamp(38px,5vw,62px);max-width:850px}.catalog{display:grid;grid-template-columns:200px 1fr;gap:42px;align-items:start}.catalog aside{position:sticky;top:110px;display:grid;gap:8px;padding:14px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.03)}.catalog aside a{padding:10px 12px;border-radius:10px}.catalog aside a:hover{background:rgba(255,255,255,.06)}.catalog-main{display:grid;gap:64px}.group{scroll-margin-top:120px}.group-head{margin-bottom:20px}.group-head h2{margin:0}.group-head p{margin:4px 0 0;color:var(--muted)}.products{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.products article{padding:22px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.035)}.products small{color:#9fdff0;font-weight:900}.products h3{margin:26px 0 6px;font-size:23px}.products p{color:var(--muted)}.products strong{display:block;font-size:21px;margin:18px 0}.auth{width:min(calc(100% - 32px),1040px);margin:70px auto 100px;display:grid;grid-template-columns:1fr 460px;gap:64px;align-items:center}.auth h1{font-size:clamp(38px,5vw,62px)}.auth-card{padding:30px;border-radius:24px}.auth-card h2{margin:0 0 5px;font-size:30px}.auth-card label{display:grid;gap:8px;margin:18px 0}.auth-card input,.chat-form textarea{width:100%;color:white;background:rgba(2,6,23,.6);border:1px solid var(--line);border-radius:12px;padding:13px 14px;outline:none}.auth-card input:focus,.chat-form textarea:focus{border-color:rgba(139,92,246,.8);box-shadow:0 0 0 4px rgba(139,92,246,.12)}.demo,.error{padding:16px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);display:grid;gap:6px}.error{color:#fecdd3;border-color:rgba(251,113,133,.25);background:rgba(251,113,133,.09)}.center{text-align:center}.dashboard{width:min(calc(100% - 32px),var(--max));margin:48px auto 90px;display:grid;grid-template-columns:250px 1fr;gap:24px;align-items:start}.side{position:sticky;top:110px;padding:18px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.035)}.profile{display:flex;gap:12px;align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line)}.profile b,.profile span{display:block}.profile span{color:var(--muted);font-size:12px}.avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(135deg,var(--p),var(--c));font-weight:900}.side nav{display:grid;gap:6px;margin:18px 0}.side nav a{padding:11px 12px;border-radius:11px;color:#c1cadb}.side nav a.active,.side nav a:hover{background:rgba(139,92,246,.13);color:#fff}.level{padding:14px;border-radius:14px;background:rgba(34,211,238,.07);border:1px solid rgba(34,211,238,.12)}.level span,.level b{display:block}.level span{color:var(--muted);font-size:12px}.side-title{font-weight:900;padding-bottom:12px;border-bottom:1px solid var(--line)}.dash-head{margin-bottom:22px}.dash-head h1{font-size:clamp(32px,4vw,52px);margin:8px 0 0}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stats article{min-height:150px;padding:20px;border-radius:18px}.stats span,.stats strong,.stats small{display:block}.stats span,.stats small{color:var(--muted)}.stats strong{margin:18px 0 8px;font-size:24px}.dash-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:14px;margin-top:14px}.panel{padding:22px;border-radius:20px}.panel-head h2{margin:0}.panel-head p{margin:4px 0;color:var(--muted)}.empty{min-height:250px;display:grid;place-items:center;align-content:center;text-align:center;color:var(--muted)}.empty h3{color:white;margin:8px 0}.empty>div{width:52px;height:52px;display:grid;place-items:center;border-radius:16px;background:rgba(139,92,246,.12);font-size:24px}.quick,.integration{display:grid;gap:8px;margin-top:20px}.quick a,.integration>div{display:flex;justify-content:space-between;gap:15px;padding:13px 14px;border-radius:12px;background:rgba(255,255,255,.035);border:1px solid var(--line)}.verify-card{padding:30px;border-radius:22px}.verify-head{justify-content:flex-start}.verify-head>div:last-child span{color:var(--muted)}.verify-head h2{margin:2px 0}.status{width:54px;height:54px;display:grid;place-items:center;border-radius:17px;font-size:26px;font-weight:900}.pending{color:#fde68a;background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.24)}.success{color:#a7f3d0;background:rgba(52,211,153,.12);border:1px solid rgba(52,211,153,.24)}.verify-card>p{color:var(--muted);font-size:17px}.verified{color:#a7f3d0}.chat{border-radius:22px;overflow:hidden}.chat-head{padding:18px 20px;border-bottom:1px solid var(--line)}.chat-head span{display:block;color:var(--muted);font-size:12px}.online{color:#a7f3d0!important}.messages{min-height:360px;max-height:520px;overflow:auto;padding:20px;display:grid;gap:12px;align-content:start}.message{max-width:74%;padding:13px 15px;border-radius:16px}.message p{margin:4px 0}.message small{color:var(--muted)}.admin-msg{background:rgba(255,255,255,.06);border:1px solid var(--line)}.user-msg{justify-self:end;background:rgba(139,92,246,.18);border:1px solid rgba(139,92,246,.25)}.chat-form{display:grid;grid-template-columns:1fr auto;gap:12px;padding:16px;border-top:1px solid var(--line)}.connector{display:flex;justify-content:space-between;align-items:center;gap:30px}.connector p{color:var(--muted);max-width:720px}.mapping{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:16px;align-items:center;margin-top:24px}.mapping div{padding:18px;border-radius:15px;background:rgba(255,255,255,.035);border:1px solid var(--line)}.mapping span,.mapping b{display:block}.mapping span{color:var(--muted);font-size:12px}footer{width:min(calc(100% - 32px),var(--max));margin:110px auto 24px;padding:26px 0 10px;display:grid;grid-template-columns:1fr auto auto;gap:28px;align-items:center;border-top:1px solid var(--line);color:var(--muted);font-size:13px}@media(max-width:980px){.topbar nav{display:none;position:absolute;top:calc(100% + 10px);left:0;right:0;padding:16px;flex-direction:column;align-items:stretch;background:#0b1020;border:1px solid var(--line);border-radius:16px}.topbar nav.open{display:flex}.nav-toggle{display:block}.hero,.auth,.dashboard,.split{grid-template-columns:1fr}.hero{gap:24px}.platform-grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}.dash-grid{grid-template-columns:1fr}.side{position:static}.catalog{grid-template-columns:1fr}.catalog aside{position:static;grid-template-columns:repeat(4,1fr)}}@media(max-width:640px){.topbar{width:calc(100% - 20px)}.hero,.section,.page-hero,.dashboard,footer{width:calc(100% - 24px)}.hero{min-height:auto}.hero h1{font-size:46px}.actions{flex-direction:column}.hero-art{min-height:360px}.chip{display:none}.platform-grid,.products,.stats{grid-template-columns:1fr}.cta,.dash-head,.connector{align-items:flex-start;flex-direction:column}.catalog aside{grid-template-columns:repeat(2,1fr)}.auth{width:calc(100% - 24px);margin-top:42px}.auth-card{padding:22px}.chat-form{grid-template-columns:1fr}.mapping{grid-template-columns:1fr}.mapping i{transform:rotate(90deg);justify-self:center}footer{grid-template-columns:1fr}}

.flash-warning{border-color:rgba(245,158,11,.28);background:rgba(245,158,11,.1);color:#fde68a}.flash-error{border-color:rgba(251,113,133,.28);background:rgba(251,113,133,.1);color:#fecdd3}.footer-links{display:flex;gap:18px}.product-detail{padding:30px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035))}.detail-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:28px}.detail-list>div{padding:16px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}.detail-list span,.detail-list b{display:block}.detail-list span{color:var(--muted);font-size:12px}.detail-list b{margin-top:4px}.table-list{display:grid;margin-top:18px}.table-list>a,.table-list>div{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line)}.table-list span,.table-list b,.table-list small{display:block}.table-list small{color:var(--muted);margin-top:3px}.status-success{color:#86efac!important}.status-danger{color:#fda4af!important}.status-warning{color:#fde68a!important}.status-info{color:#93c5fd!important}.orders-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:20px}.order-card{padding:20px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.03)}.order-card h3{margin:22px 0 4px}.order-card>p{margin:0 0 18px;color:var(--muted)}.order-meta{display:grid;gap:8px}.order-meta span{display:flex;justify-content:space-between;gap:15px;color:var(--muted)}.order-meta b{color:#fff}.user-admin-list{display:grid;gap:14px}.user-admin-card{padding:22px}.user-title{display:flex;justify-content:space-between;gap:20px;align-items:start}.user-title h2{margin:0}.user-title p{margin:4px 0 0;color:var(--muted)}.admin-forms{display:grid;grid-template-columns:.7fr 1.3fr;gap:14px;margin-top:18px}.admin-forms form{display:flex;gap:10px;align-items:end;padding:14px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}.admin-forms label,.product-admin-card label{display:grid;gap:6px;flex:1;color:var(--muted);font-size:13px}.admin-forms input,.admin-forms select,.admin-order-list select,.product-admin-card input,.product-admin-card select{width:100%;padding:10px 11px;border:1px solid var(--line);border-radius:10px;background:#080d18;color:#fff}.user-balance{margin-top:14px;color:var(--muted)}.user-balance b{color:#fff}.admin-order-list{display:grid}.admin-order-list article{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line)}.admin-order-list b,.admin-order-list small{display:block}.admin-order-list small{color:var(--muted);margin-top:4px}.admin-order-list form{display:flex;gap:9px}.product-admin-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.product-admin-card h2{margin:20px 0 5px}.product-admin-card p{color:var(--muted);min-height:44px}.check-line{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center!important;margin:12px 0}.check-line input{width:auto}.support-admin{display:grid;grid-template-columns:260px 1fr;gap:14px}.thread-list{display:grid;align-content:start;gap:8px;padding:12px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.03)}.thread-list a{display:grid;padding:12px;border-radius:12px}.thread-list a.active,.thread-list a:hover{background:rgba(139,92,246,.14)}.thread-list span,.thread-list small{color:var(--muted);font-size:12px}.admin-chat{min-height:320px}.center p{color:var(--muted)}
@media(max-width:980px){.admin-forms{grid-template-columns:1fr}.support-admin{grid-template-columns:1fr}.thread-list{grid-template-columns:repeat(2,1fr)}.product-admin-grid{grid-template-columns:1fr}}
@media(max-width:640px){.detail-list,.orders-grid{grid-template-columns:1fr}.table-list>a,.table-list>div,.user-title,.admin-order-list article{align-items:flex-start;flex-direction:column}.admin-forms form,.admin-order-list form{align-items:stretch;flex-direction:column}.thread-list{grid-template-columns:1fr}.footer-links{flex-wrap:wrap}}
.support-admin>.panel{min-width:0}
.messages.admin-chat{max-width:100%;min-width:0;overflow-x:hidden;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none;scroll-behavior:smooth}
.messages.admin-chat::-webkit-scrollbar{display:none}
.messages.admin-chat .message{min-width:0;max-width:74%}
.messages.admin-chat .message p{overflow-wrap:anywhere}


/* v0.3 Revizor analytics */
.upgrade-card{padding:32px}.upgrade-card h2{font-size:30px;margin:18px 0 8px}.text-link{color:#a5f3fc;font-weight:800}.analytics-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:14px;margin-top:14px}.bar-chart{height:240px;display:flex;align-items:flex-end;gap:7px;padding:24px 6px 0;overflow-x:auto}.bar-col{min-width:22px;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px;height:210px}.bar-col span{display:block;width:100%;max-width:32px;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,var(--c),var(--p));box-shadow:0 8px 25px rgba(34,211,238,.15)}.bar-col small{font-size:10px;color:var(--muted);white-space:nowrap;transform:rotate(-45deg);margin-bottom:-8px}.platform-stats,.batch-list{display:grid;gap:9px;margin-top:18px}.platform-stats>div,.batch-list>div{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}.platform-stats span,.batch-list span{color:var(--muted)}.rev-table{display:grid;margin-top:18px}.rev-row{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.rev-row b,.rev-row small{display:block}.rev-row small{color:var(--muted);margin-top:3px}.rev-row>div:last-child{text-align:right}.compact-empty{min-height:160px}.import-panel{display:flex;align-items:center;justify-content:space-between;gap:24px}.import-panel p{color:var(--muted);max-width:700px}.import-panel form{display:flex;align-items:center;gap:10px}.file-field{position:relative;overflow:hidden}.file-field input{position:absolute;inset:0;opacity:0;cursor:pointer}.file-field span{display:inline-flex;min-height:42px;align-items:center;padding:10px 16px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.055);font-weight:800}.filter-row{display:flex;gap:12px;align-items:end;margin-bottom:18px}.filter-row label,.classification-form label{display:grid;gap:6px;flex:1;color:var(--muted);font-size:13px}.filter-row select,.classification-form select,.classification-form input{width:100%;padding:10px 11px;border:1px solid var(--line);border-radius:10px;background:#080d18;color:#fff}.revizor-list{display:grid;gap:13px}.revizor-card{padding:18px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.025)}.rev-fact{display:grid;grid-template-columns:1.2fr 1fr .8fr 1fr 1.1fr;gap:10px;padding-bottom:15px;border-bottom:1px solid var(--line)}.rev-fact span,.rev-fact b{display:block}.rev-fact span{color:var(--muted);font-size:11px}.rev-fact b{margin-top:3px}.classification-form{display:grid;grid-template-columns:1fr 1.2fr auto;gap:10px;align-items:end;margin-top:15px}.pagination{display:flex;flex-wrap:wrap;gap:6px;margin-top:20px}.pagination a{display:grid;place-items:center;min-width:36px;height:36px;border:1px solid var(--line);border-radius:9px}.pagination a.active{background:rgba(139,92,246,.25);border-color:rgba(139,92,246,.5)}
@media(max-width:980px){.analytics-grid{grid-template-columns:1fr}.import-panel{align-items:flex-start;flex-direction:column}.rev-fact{grid-template-columns:repeat(2,1fr)}.classification-form{grid-template-columns:1fr}}
@media(max-width:640px){.filter-row,.import-panel form,.rev-row{align-items:stretch;flex-direction:column}.rev-row>div:last-child{text-align:left}.rev-fact{grid-template-columns:1fr}.bar-col{min-width:26px}}

.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}.settings-grid label{display:grid;gap:8px;color:#d9e1f0}.settings-grid label:nth-of-type(3){grid-column:1/-1}.settings-grid input,.filter-row select,.classification-form select,.classification-form input{width:100%;color:#fff;background:rgba(2,6,23,.6);border:1px solid var(--line);border-radius:12px;padding:12px 13px;outline:none}.settings-grid input:focus,.classification-form input:focus,.classification-form select:focus{border-color:rgba(139,92,246,.8);box-shadow:0 0 0 4px rgba(139,92,246,.12)}.cron-box{display:grid;gap:8px;margin-top:18px;padding:16px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}.cron-box span{color:var(--muted);font-size:12px}.cron-box code{display:block;overflow-wrap:anywhere;color:#bfefff}.actions-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.batch-list{display:grid;gap:8px;margin-top:18px}.batch-list>div{display:flex;justify-content:space-between;gap:18px;padding:12px 0;border-bottom:1px solid var(--line)}.batch-list span{color:var(--muted)}.filter-row{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-bottom:18px}.filter-row label{display:grid;gap:7px;min-width:180px}.revizor-list{display:grid;gap:14px}.revizor-card{padding:18px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025)}.rev-fact{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.rev-fact>div{padding:12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025)}.rev-fact span,.rev-fact b{display:block}.rev-fact span{color:var(--muted);font-size:11px}.rev-fact b{margin-top:4px;font-size:13px}.classification-form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end;margin-top:14px}.classification-form label{display:grid;gap:7px}.pagination{display:flex;gap:7px;flex-wrap:wrap;margin-top:20px}.pagination a{display:grid;place-items:center;min-width:36px;height:36px;border:1px solid var(--line);border-radius:9px}.pagination a.active{background:rgba(139,92,246,.2);border-color:rgba(139,92,246,.45)}.status-info{color:#93c5fd}.status-danger{color:#fda4af}.status-warning{color:#fde68a}.status-success{color:#a7f3d0}@media(max-width:980px){.rev-fact{grid-template-columns:repeat(3,1fr)}.classification-form{grid-template-columns:1fr}}@media(max-width:640px){.settings-grid{grid-template-columns:1fr}.settings-grid label:nth-of-type(3){grid-column:auto}.rev-fact{grid-template-columns:1fr 1fr}.batch-list>div{display:grid}.filter-row{display:grid}.filter-row label{min-width:0}}

.connection-grid{display:grid;gap:16px;margin-top:20px}.connection-grid label{display:grid;gap:8px;color:#d9e1f0}.copy-field{display:grid;grid-template-columns:1fr auto;gap:10px}.copy-field input{width:100%;min-width:0;color:#dff8ff;background:rgba(2,6,23,.62);border:1px solid var(--line);border-radius:12px;padding:12px 13px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rev-fact{grid-template-columns:repeat(3,1fr)}@media(max-width:780px){.copy-field{grid-template-columns:1fr}.rev-fact{grid-template-columns:1fr 1fr}}@media(max-width:480px){.rev-fact{grid-template-columns:1fr}}

/* v0.5.0 game-service classification and closed statistics */
.service-stats-hero{margin-bottom:42px}.service-statistics{margin-top:0}.service-analytics-grid{grid-template-columns:1fr 1fr}.public-bar-chart{min-width:0}.service-ranking,.public-operation-list{display:grid;margin-top:18px}.service-ranking>div,.public-operation-list>div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;padding:14px 0;border-bottom:1px solid var(--line)}.public-operation-list>div{grid-template-columns:1fr auto}.service-ranking b,.service-ranking small,.public-operation-list b,.public-operation-list small{display:block}.service-ranking small,.public-operation-list small{margin-top:3px;color:var(--muted)}.service-ranking>div>span:last-child,.public-operation-list>div>span:last-child{text-align:right}.rank-number{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:rgba(139,92,246,.12);font-weight:900;color:#c4b5fd}.classification-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:18px}.classification-summary>div,.upgrade-result-grid>div{padding:15px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}.classification-summary span,.classification-summary b,.upgrade-result-grid span,.upgrade-result-grid b{display:block}.classification-summary span,.upgrade-result-grid span{font-size:12px;color:var(--muted)}.classification-summary b,.upgrade-result-grid b{margin-top:5px;font-size:22px}.classification-control-panel,.classification-summary-panel{margin-top:14px}.classification-form-v050{grid-template-columns:1fr .65fr 1.15fr auto}.upgrade-result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:22px 0}.admin-ranking>div{grid-template-columns:auto 1fr auto}.service-statistics .stats{margin-bottom:14px}
@media(max-width:980px){.service-analytics-grid{grid-template-columns:1fr}.classification-summary,.upgrade-result-grid{grid-template-columns:repeat(2,1fr)}.classification-form-v050{grid-template-columns:1fr 1fr}.classification-form-v050 .btn{grid-column:1/-1}}
@media(max-width:640px){.classification-summary,.upgrade-result-grid{grid-template-columns:1fr}.classification-form-v050{grid-template-columns:1fr}.classification-form-v050 .btn{grid-column:auto}.service-ranking>div,.public-operation-list>div{grid-template-columns:auto 1fr}.service-ranking>div>span:last-child,.public-operation-list>div>span:last-child{grid-column:2;text-align:left}}

/* v0.6.3: dashboard, orders and scoped reporting accounts */
.btn{color:#fff;cursor:pointer}.btn.primary{color:#fff}.compact-stats{margin-bottom:14px}.reporting-dashboard-grid,.admin-live-grid{grid-template-columns:1.3fr .7fr}.reporting-bar-chart{min-width:0}.reporting-recent-panel{margin-top:14px}.reporting-scope-badge{margin-top:14px;width:max-content}.reporting-orders-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.reporting-orders-grid .order-card{min-height:280px}.reporting-create-panel{margin-bottom:14px}.reporting-create-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px;align-items:end}.reporting-create-form label,.reporting-scope-form label,.reporting-password-form label,.order-classification-form label,.order-filter-row label{display:grid;gap:7px;color:var(--muted);font-size:13px}.reporting-create-form input,.reporting-create-form select,.reporting-scope-form input,.reporting-scope-form select,.reporting-password-form input,.order-classification-form input,.order-classification-form select,.order-filter-row input,.order-filter-row select{width:100%;min-height:44px;padding:11px 12px;color:#fff;background:rgba(2,6,23,.64);border:1px solid var(--line);border-radius:11px;outline:none}.reporting-create-form input:focus,.reporting-create-form select:focus,.reporting-scope-form input:focus,.reporting-scope-form select:focus,.reporting-password-form input:focus,.order-classification-form input:focus,.order-classification-form select:focus,.order-filter-row input:focus,.order-filter-row select:focus{border-color:rgba(139,92,246,.8);box-shadow:0 0 0 4px rgba(139,92,246,.12)}.reporting-scope-field{grid-column:1/-1}.reporting-create-form>.btn{grid-column:1/-1}.reporting-account-list{display:grid;gap:14px}.reporting-account-card{padding:24px}.reporting-account-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.reporting-account-head h2{margin:0;font-size:25px}.reporting-account-head p{margin:5px 0 0;color:var(--muted)}.reporting-account-stats{margin:18px 0}.reporting-account-actions{display:grid;grid-template-columns:1fr;gap:12px;border-top:1px solid var(--line);padding-top:18px}.reporting-scope-form{display:grid;grid-template-columns:.7fr 1.3fr auto;gap:12px;align-items:end}.reporting-password-form{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end;max-width:650px}.order-filter-panel{margin-bottom:14px}.order-filter-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:end;margin:0}.order-filter-row>*{min-width:0}.order-filter-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:10px}.order-filter-actions .btn{min-width:140px;white-space:nowrap}.admin-paylink-orders{display:grid;gap:14px}.paylink-order-row{display:block;padding:20px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025)}.paylink-order-main h3{margin:16px 0 4px;font-size:23px}.paylink-order-main>p{margin:0;color:var(--muted)}.order-data-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:16px}.order-data-grid span{padding:11px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.025);color:var(--muted);font-size:11px}.order-data-grid b{display:block;margin-top:4px;color:#fff;font-size:13px;overflow-wrap:anywhere}.order-classification-form{display:grid;gap:10px;align-content:start;padding-left:18px;border-left:1px solid var(--line)}.flash-warning{border-color:rgba(251,191,36,.25);background:rgba(251,191,36,.1);color:#fde68a}.flash-error{border-color:rgba(251,113,133,.25);background:rgba(251,113,133,.09);color:#fecdd3}
@media(max-width:1100px){.order-filter-row{grid-template-columns:repeat(2,minmax(0,1fr))}.paylink-order-row{grid-template-columns:1fr}.order-classification-form{padding-left:0;padding-top:16px;border-left:0;border-top:1px solid var(--line)}}
@media(max-width:980px){.reporting-dashboard-grid,.admin-live-grid{grid-template-columns:1fr}.reporting-orders-grid{grid-template-columns:1fr}.reporting-scope-form{grid-template-columns:1fr 1fr}.reporting-scope-form .btn{grid-column:1/-1}.order-data-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.reporting-create-form,.reporting-scope-form,.reporting-password-form,.order-filter-row{grid-template-columns:1fr}.reporting-scope-field,.reporting-create-form>.btn,.reporting-scope-form .btn{grid-column:auto}.reporting-account-head{flex-direction:column}.order-data-grid{grid-template-columns:1fr}.reporting-account-card{padding:18px}}

/* v0.6.2: reporting accounts and calendar/table statistics */
.reporting-login-note{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px}.reporting-login-note div{display:grid;gap:4px}.reporting-login-note span{color:var(--muted)}.reporting-login-note code{padding:11px 13px;border:1px solid var(--line);border-radius:11px;background:rgba(2,6,23,.64);color:#bfefff;overflow-wrap:anywhere}.statistics-calendar-panel{margin-bottom:14px}.statistics-date-form{display:grid;grid-template-columns:minmax(190px,.7fr) minmax(190px,.7fr) auto auto;gap:12px;align-items:end;margin-top:20px}.statistics-date-form label{display:grid;gap:7px;color:var(--muted);font-size:13px}.statistics-date-form input{width:100%;min-height:44px;padding:11px 12px;color:#fff;color-scheme:dark;background:rgba(2,6,23,.64);border:1px solid var(--line);border-radius:11px;outline:none}.statistics-date-form input:focus{border-color:rgba(139,92,246,.8);box-shadow:0 0 0 4px rgba(139,92,246,.12)}.statistics-presets{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.statistics-presets a{padding:8px 11px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.025);font-size:13px}.statistics-presets a:hover{border-color:rgba(139,92,246,.55);background:rgba(139,92,246,.1)}.statistics-period-label{margin-top:14px;color:#c4b5fd;font-weight:800}.reporting-table-panel{margin-top:14px}.reporting-table-wrap{overflow-x:auto;margin-top:18px;border:1px solid var(--line);border-radius:14px}.reporting-table{width:100%;min-width:1050px;border-collapse:collapse}.reporting-table th,.reporting-table td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.reporting-table th{position:sticky;top:0;background:#111827;color:var(--muted);font-size:12px;letter-spacing:.03em;text-transform:uppercase}.reporting-table tbody tr:last-child td{border-bottom:0}.reporting-table tbody tr:hover{background:rgba(255,255,255,.025)}.reporting-table td{font-size:13px}.reporting-table td b,.reporting-table td small{display:block}.reporting-table td small{margin-top:3px;color:var(--muted)}.reporting-table-amount{white-space:nowrap;font-weight:900}.reporting-table-empty{text-align:center!important;color:var(--muted);padding:38px!important}
@media(max-width:900px){.statistics-date-form{grid-template-columns:1fr 1fr}.statistics-date-form .btn{width:100%}.reporting-login-note{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.statistics-date-form{grid-template-columns:1fr}.statistics-presets{display:grid;grid-template-columns:1fr 1fr}.statistics-presets a{text-align:center}}

/* v0.6.3 neutral reporting dashboard */
.reporting-dashboard-single{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}

/* v0.6.4: live identity verification */
.verification-settings-panel{margin-bottom:14px}.verification-settings-form{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px;align-items:end}.verification-settings-form label{display:grid;gap:7px;color:var(--muted);font-size:13px}.verification-settings-form input[type=password],.verification-settings-form input[type=text],.verification-settings-form input:not([type]){width:100%;min-height:44px;padding:11px 12px;color:#fff;background:rgba(2,6,23,.64);border:1px solid var(--line);border-radius:11px;outline:none}.verification-settings-form .verification-enabled{display:flex;align-items:center;gap:10px;min-height:44px}.verification-settings-form .verification-enabled input{width:18px;height:18px}.verification-settings-form .btn{grid-column:1/-1}.verification-webhook-box{display:grid;gap:9px;margin:20px 0;padding:17px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}.verification-webhook-box>span{font-weight:900}.verification-webhook-box small{color:var(--muted)}.verification-live-card{padding:28px}.verification-sdk-container{margin-top:22px;min-height:0;border-radius:16px;overflow:hidden}.verification-status-stats{margin-bottom:14px}.status.danger{background:rgba(251,113,133,.14);color:#fecdd3}.verified{display:inline-flex;padding:10px 14px;border:1px solid rgba(52,211,153,.25);border-radius:12px;background:rgba(52,211,153,.1);color:#bbf7d0}.verification-live-card .error{margin-top:16px}
@media(max-width:720px){.verification-settings-form{grid-template-columns:1fr}.verification-settings-form .btn{grid-column:auto}}

/* v0.6.8 — order chat */
.order-data-grid .order-date-created{grid-column:1}
.order-data-grid .order-date-paid{grid-column:2}
.order-chat-cell{grid-column:3;display:flex;align-items:stretch;min-height:62px}
.order-chat-cell .btn{width:100%;min-height:100%;border-radius:11px}
.order-chat-unavailable{display:flex;align-items:center;padding:11px;border:1px solid var(--line);border-radius:11px;color:var(--muted);font-size:12px}
.order-chat-dialog{width:min(720px,calc(100% - 28px));max-height:calc(100vh - 40px);padding:0;border:1px solid var(--line);border-radius:22px;background:#0c1220;color:var(--text);box-shadow:0 28px 100px rgba(0,0,0,.65)}
.order-chat-dialog::backdrop{background:rgba(2,6,23,.78);backdrop-filter:blur(8px)}
.order-chat-modal{padding:24px}
.order-chat-modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.order-chat-modal-head h2{margin:5px 0 0;font-size:28px}
.order-chat-close{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.05);color:#fff;font-size:27px;cursor:pointer}
.order-chat-messages{display:grid;gap:14px;padding:22px 0}
.order-chat-message{max-width:85%;padding:15px 17px;border:1px solid var(--line);border-radius:17px}
.order-chat-message b,.order-chat-message small{display:block}
.order-chat-message p{margin:7px 0 9px;font-size:16px}
.order-chat-message small{color:var(--muted)}
.admin-chat-message{justify-self:start;background:rgba(139,92,246,.13)}
.client-chat-message{justify-self:end;background:rgba(52,211,153,.11)}
.order-chat-state{padding:12px 14px;border:1px solid var(--line);border-radius:13px;color:var(--muted)}
.order-chat-state.read{color:#bfdbfe;background:rgba(59,130,246,.08)}
.order-chat-state.waiting{background:rgba(255,255,255,.025)}
.order-chat-share{display:grid;gap:8px;padding-top:18px;border-top:1px solid var(--line)}
.order-chat-share>label{font-weight:800}
.order-chat-share>div{display:grid;grid-template-columns:1fr auto;gap:10px}
.order-chat-share input{min-width:0;padding:12px;border:1px solid var(--line);border-radius:11px;background:#060b16;color:#dbeafe}
.order-chat-share small{color:var(--muted)}
.purchase-chat-hero{margin-bottom:28px}
.purchase-chat-page{margin-top:28px}
.purchase-client-chat{overflow:hidden;border-radius:22px}
.purchase-client-chat .chat-head{padding:20px;border-bottom:1px solid var(--line)}
.purchase-client-chat .chat-head span{display:block;color:var(--muted);font-size:13px}
.purchase-client-chat .messages{padding:20px;min-height:270px}
.purchase-chat-intro{padding:22px;text-align:center}
.purchase-chat-intro h2{margin:0 0 8px}
.purchase-chat-intro p{color:var(--muted);margin:0 0 20px}
.purchase-code-message{max-width:86%}
.purchase-code-box{margin:14px 0;padding:15px;border:1px solid rgba(34,211,238,.22);border-radius:14px;background:rgba(34,211,238,.07)}
.purchase-code-box span,.purchase-code-box strong{display:block}
.purchase-code-box span{color:var(--muted);font-size:12px}
.purchase-code-box strong{margin-top:4px;font-size:24px;letter-spacing:.08em;overflow-wrap:anywhere}
.purchase-save-confirm{margin-top:16px}
@media(max-width:640px){.order-data-grid .order-date-created,.order-data-grid .order-date-paid,.order-chat-cell{grid-column:auto}.order-chat-share>div{grid-template-columns:1fr}.order-chat-modal{padding:18px}.order-chat-message{max-width:95%}.purchase-code-box strong{font-size:19px}}

.orders-summary-stats{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;margin-bottom:18px}.orders-summary-stats article{min-height:170px}.order-filter-panel{margin-top:0;margin-bottom:18px}.order-filter-row{display:grid;grid-template-columns:repeat(4,minmax(180px,1fr));gap:14px;align-items:end;margin:0}.order-filter-row>*{min-width:0}.order-filter-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}

.client-order-chat{display:grid;gap:12px;margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}
.client-order-chat .message{max-width:100%}
.client-order-confirm{display:flex;justify-content:flex-end}
.client-order-confirm .btn{width:min(100%,300px)}
@media(max-width:1100px){.order-filter-row{grid-template-columns:repeat(2,minmax(0,1fr))}.orders-summary-stats{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:16px}.orders-summary-stats article{min-height:160px}}
@media(max-width:760px){.orders-summary-stats{grid-template-columns:1fr;margin-bottom:14px}.orders-summary-stats article{min-height:auto}.order-filter-actions{justify-content:stretch}.order-filter-actions .btn{flex:1;min-width:0}}
@media(max-width:640px){.order-filter-row{grid-template-columns:1fr}.order-filter-actions{grid-column:auto;display:grid;grid-template-columns:1fr}.client-order-confirm .btn{width:100%}}

/* v0.7.0 — demonstrational order dialogue */
.order-chat-dialog{width:min(920px,calc(100% - 28px));overflow:auto}
.order-chat-demo-note{display:flex;align-items:center;gap:10px;margin-top:18px;padding:11px 13px;border:1px solid rgba(34,211,238,.2);border-radius:13px;background:rgba(34,211,238,.06)}
.order-chat-demo-note small{color:var(--muted)}
.order-chat-demo-note.compact{margin:0 0 4px;padding:9px 11px}
.order-chat-rich-text{line-height:1.62;overflow-wrap:anywhere}
.order-chat-rich-text br+br{content:"";display:block;margin-top:7px}
.manager-message{max-width:92%}
.manager-final-message{background:rgba(139,92,246,.09)}
.success-message{border-color:rgba(52,211,153,.25);background:rgba(52,211,153,.13)}
.chat-message-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.chat-message-head b{margin:0}
.chat-message-head .badge{font-size:10px;white-space:nowrap}
.client-order-chat .manager-message,.client-order-chat .manager-final-message{justify-self:start}
.client-order-chat .user-msg{justify-self:end;width:min(92%,720px)}
@media(max-width:640px){
    .order-chat-demo-note{align-items:flex-start;flex-direction:column}
    .manager-message,.manager-final-message,.client-order-chat .user-msg{max-width:100%;width:100%}
    .chat-message-head{align-items:flex-start;flex-direction:column}
}

/* v0.7.5 — admin responsive recomposition and overflow guard */
html,body{max-width:100%;overflow-x:hidden}
.dashboard{grid-template-columns:220px minmax(0,1fr);max-width:var(--max)}
.dashboard>.dash-main,.dash-main{min-width:0;width:100%;max-width:100%}
.dash-head{min-width:0;flex-wrap:wrap}
.dash-head>div{min-width:0}
.dash-head h1,.dash-head .eyebrow{max-width:100%;overflow-wrap:anywhere}
.stats{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));min-width:0}
.stats article{min-width:0;overflow:hidden}
.stats strong{overflow-wrap:anywhere}
.panel,.analytics-grid,.analytics-grid>section,.classification-summary-panel{min-width:0;max-width:100%}
.analytics-grid{grid-template-columns:minmax(0,1.25fr) minmax(270px,.75fr)}
.bar-chart{width:100%;max-width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-inline:contain}
.platform-stats>div,.batch-list>div,.rev-row{min-width:0}
.platform-stats>div>*:first-child,.batch-list>div>*:first-child,.rev-row>div:first-child{min-width:0;overflow-wrap:anywhere}
.platform-stats b,.batch-list b,.rev-row>div:last-child{flex:0 1 auto;min-width:0;overflow-wrap:anywhere}
.classification-summary{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.service-ranking>div,.admin-ranking>div{min-width:0}

@media(max-width:1180px){
  .dashboard{grid-template-columns:200px minmax(0,1fr);gap:18px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .analytics-grid{grid-template-columns:minmax(0,1fr)}
  .bar-chart{min-height:240px}
}
@media(max-width:980px){
  .dashboard{grid-template-columns:minmax(0,1fr)}
  .side{position:static;min-width:0}
  .side nav{grid-template-columns:repeat(3,minmax(0,1fr))}
  .side nav a{text-align:center;min-width:0;overflow-wrap:anywhere}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .side nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stats{grid-template-columns:minmax(0,1fr)}
  .panel{padding:18px}
  .analytics-grid{gap:12px}
  .platform-stats>div,.batch-list>div,.rev-row{align-items:flex-start;flex-direction:column;gap:5px}
  .rev-row>div:last-child{text-align:left}
}
@media(max-width:420px){
  .side nav{grid-template-columns:minmax(0,1fr)}
}

/* v0.8.1 — footer, contacts and legal pages */
.site-footer{grid-template-columns:minmax(230px,1.2fr) repeat(3,minmax(150px,.7fr));align-items:start;padding:34px 0 18px}
.footer-brand-block{display:grid;gap:10px;max-width:310px}
.footer-brand-block p{margin:0;color:var(--muted)}
.footer-copy{margin-top:8px;color:#7f8aa1}
.footer-column{display:grid;align-content:start;gap:9px;min-width:0}
.footer-column>b{margin-bottom:4px;color:#fff;font-size:13px}
.footer-column>a{color:var(--muted);overflow-wrap:anywhere;transition:.2s}
.footer-column>a:hover{color:#fff;transform:translateX(2px)}
.footer-documents{min-width:240px}
.legal-hero{margin-bottom:44px}
.legal-page{margin-top:0}
.contact-actions-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px}
.contact-action-card{display:flex;align-items:center;gap:16px;min-width:0;padding:22px;border:1px solid var(--line);border-radius:19px;background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.03));transition:.2s}
.contact-action-card:hover{transform:translateY(-3px);border-color:rgba(139,92,246,.45)}
.contact-action-icon{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,rgba(139,92,246,.28),rgba(34,211,238,.2));font-weight:900;color:#dcecff}
.contact-action-card>span:last-child{display:grid;min-width:0}
.contact-action-card small{color:var(--muted)}
.contact-action-card strong{margin:2px 0;color:#fff;overflow-wrap:anywhere}
.contact-action-card em{color:#9fdff0;font-size:12px;font-style:normal}
.legal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.legal-card{position:relative;padding:26px;border:1px solid var(--line);border-radius:21px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.028));overflow:hidden}
.legal-card-head{display:flex;align-items:flex-start;gap:15px;margin-bottom:22px}
.legal-card-head>span,.legal-section-number{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:1px solid rgba(139,92,246,.25);border-radius:11px;background:rgba(139,92,246,.1);color:#c4b5fd;font-size:12px;font-weight:900}
.legal-card-head small{color:#9fdff0;font-size:11px;font-weight:900;letter-spacing:.12em}
.legal-card h2{margin:3px 0 0;font-size:clamp(23px,3vw,31px);letter-spacing:-.025em}
.requisites-list{display:grid;margin:0}
.requisites-list>div{display:grid;grid-template-columns:minmax(130px,.55fr) minmax(0,1.45fr);gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}
.requisites-list>div:last-child{border-bottom:0}
.requisites-list dt{color:var(--muted);font-size:13px}
.requisites-list dd{margin:0;color:#fff;font-weight:750;overflow-wrap:anywhere}
.requisites-list dd a{color:#bfefff}
.requisites-list.compact>div{padding:10px 0}
.legal-note{margin-top:14px;padding:20px 22px;border:1px solid rgba(34,211,238,.2);border-radius:17px;background:rgba(34,211,238,.065)}
.legal-note b{display:block;color:#d8f8ff}
.legal-note p{margin:5px 0 0;color:var(--muted)}
.policy-page{display:grid;grid-template-columns:250px minmax(0,1fr);gap:20px;align-items:start}
.legal-toc{position:sticky;top:110px;display:grid;gap:7px;padding:17px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.035)}
.legal-toc>b{margin-bottom:5px;color:#fff}
.legal-toc>a{padding:7px 9px;border-radius:9px;color:var(--muted);font-size:12px}
.legal-toc>a:hover{background:rgba(139,92,246,.12);color:#fff}
.legal-document{display:grid;gap:14px;min-width:0}
.legal-document.single-column{max-width:920px;margin:0 auto}
.legal-section-card{scroll-margin-top:115px;padding-left:30px}
.legal-section-card>.legal-section-number{position:absolute;top:22px;right:22px}
.legal-section-card h2{padding-right:55px;margin:0 0 15px}
.legal-section-card p{margin:10px 0;color:#c2cada}
.legal-section-card a{color:#9fdff0;text-decoration:underline;text-decoration-color:rgba(159,223,240,.35);text-underline-offset:3px}
.legal-list{display:grid;gap:8px;margin:14px 0;padding-left:21px;color:#c2cada}
.legal-list li::marker{color:#8b5cf6}
.legal-list.ordered li::marker{font-weight:900;color:#22d3ee}
.refund-highlight{display:flex;align-items:flex-start;gap:20px;margin-bottom:16px;padding:28px;border:1px solid rgba(52,211,153,.25);border-radius:23px;background:linear-gradient(135deg,rgba(52,211,153,.11),rgba(34,211,238,.05))}
.refund-highlight>span{display:grid;place-items:center;flex:0 0 54px;width:54px;height:54px;border-radius:16px;background:rgba(52,211,153,.16);color:#a7f3d0;font-size:25px;font-weight:900}
.refund-highlight small{color:#a7f3d0;font-weight:900;letter-spacing:.13em}
.refund-highlight h2{margin:4px 0 6px;font-size:clamp(27px,4vw,40px)}
.refund-highlight p{margin:0;color:#bdd0cc}
.refund-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.refund-steps article{padding:20px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.03)}
.refund-steps article>span{color:#9fdff0;font-size:12px;font-weight:900}
.refund-steps h3{margin:13px 0 6px}
.refund-steps p{margin:0;color:var(--muted);font-size:13px}
@media(max-width:1080px){.site-footer{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-brand-block{max-width:none}.policy-page{grid-template-columns:1fr}.legal-toc{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.legal-toc>b{grid-column:1/-1}.refund-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.contact-actions-grid,.legal-grid{grid-template-columns:1fr}.requisites-list>div{grid-template-columns:1fr;gap:4px}.legal-section-card{padding:22px}.legal-section-card>.legal-section-number{position:static;margin-bottom:14px}.legal-section-card h2{padding-right:0}.refund-highlight{padding:22px}.refund-highlight>span{flex-basis:44px;width:44px;height:44px}.legal-toc{grid-template-columns:1fr}.legal-toc>b{grid-column:auto}}
@media(max-width:560px){.site-footer{grid-template-columns:1fr;gap:24px}.footer-documents{min-width:0}.refund-steps{grid-template-columns:1fr}.refund-highlight{flex-direction:column}.contact-action-card{padding:18px}}

/* platform card icons */
.platform>img{display:block;width:36px;height:36px;padding:6px;border-radius:10px;background:rgba(255,255,255,.08);object-fit:contain;box-sizing:border-box}

.header-user{display:flex;align-items:center;gap:10px;flex-shrink:0}
.header-profile{position:relative}
.header-profile-btn{display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(255,255,255,.06);cursor:pointer;transition:.2s ease;position:relative;overflow:hidden;backdrop-filter:blur(12px)}
.header-profile-btn:hover,.header-profile.is-open .header-profile-btn{border-color:rgba(139,92,246,.35);background:rgba(139,92,246,.1);box-shadow:0 8px 24px rgba(139,92,246,.15);transform:translateY(-1px)}
.header-profile-btn:active{transform:scale(.96) translateY(0)}
.header-profile-btn > *{position:relative;z-index:1}
.header-profile-avatar{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:linear-gradient(135deg,var(--p),var(--c));font-size:12px;font-weight:900;color:#fff;line-height:1}
.header-profile-dropdown{position:absolute;top:calc(100% + 10px);right:0;min-width:220px;padding:8px;border:1px solid var(--line);border-radius:14px;background:rgba(11,16,32,.96);backdrop-filter:blur(18px);box-shadow:0 18px 48px rgba(0,0,0,.35);opacity:0;visibility:hidden;transform:translateY(-6px);transition:.15s;z-index:30}
.header-profile:hover .header-profile-dropdown,.header-profile.is-open .header-profile-dropdown{opacity:1;visibility:visible;transform:translateY(0)}
.header-profile-head{display:grid;gap:3px;padding:10px 12px 12px;border-bottom:1px solid var(--line);margin-bottom:6px}
.header-profile-head b{font-size:14px;line-height:1.2}
.header-profile-head span{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.header-profile-head small{font-size:11px;font-weight:800;color:#9fdff0}
.header-profile-dropdown a{display:block;padding:10px 12px;border-radius:9px;font-size:14px;font-weight:700;color:#d9deeb;transition:.12s}
.header-profile-dropdown a:hover{background:rgba(255,255,255,.06);color:#fff}
.header-profile-logout{margin-top:4px;border-top:1px solid var(--line);border-radius:0 0 9px 9px;padding-top:14px;color:#fda4af!important}
.header-profile-logout:hover{background:rgba(251,113,133,.1)!important;color:#fecdd3!important}
@media(max-width:980px){.header-profile-dropdown{right:0;left:auto}}
@media(max-width:640px){.header-profile-btn{width:32px;height:32px}.header-profile-avatar{width:22px;height:22px;font-size:11px}}

/* v0.8.4 — раздел игр на главной и в каталоге */
.games-section .section-head{margin-bottom:0;align-items:center;flex-wrap:wrap;gap:16px}
.games-tabs{display:flex;gap:8px;flex-wrap:wrap}
.games-tab{padding:7px 16px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);font-size:13px;font-weight:700;cursor:pointer;transition:.15s;white-space:nowrap}
.games-tab:hover{border-color:rgba(139,92,246,.55);color:#fff}
.games-tab.active{background:linear-gradient(135deg,var(--p),#6d5dfc 48%,var(--c));border-color:transparent;color:#fff}
.games-strip-inner{position:relative;margin-top:22px;padding:0 2px}
.section-gradient-flow .games-strip-inner{margin-top:18px}
.section-gradient-flow .games-strip-inner--slider{padding-bottom:8px}
.section-gradient-flow .games-strip-inner--slider .games-track{padding-bottom:12px}
.games-strip-inner > .banner-arrow{top:calc(50% - 14px);transform:translateY(-50%)}
.games-strip-inner > .banner-arrow-prev{left:-6px}
.games-strip-inner > .banner-arrow-next{right:-6px}
.games-track{display:grid;grid-template-rows:repeat(2,auto);grid-auto-flow:column;grid-auto-columns:270px;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:0 2px 12px;-ms-overflow-style:none;scrollbar-width:none;cursor:grab;user-select:none}
.games-track.is-dragging{cursor:grabbing}
.games-track::-webkit-scrollbar{display:none}
.game-card{display:block;transition:.18s;scroll-snap-align:start}
.game-card:hover{transform:translateY(-4px)}
.game-card-img{width:100%;height:165px;border-radius:14px;background-size:cover;background-position:center;background-color:rgba(255,255,255,.04);overflow:hidden}
.game-card-empty .game-card-img{background-image:linear-gradient(135deg,rgba(139,92,246,.2),rgba(34,211,238,.1))}
.game-card-body{padding:10px 4px 0}
.game-card-title{margin:0 0 7px;font-size:14px;font-weight:800;line-height:1.3;color:var(--text);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.game-card-price{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:900;color:var(--text);flex-wrap:wrap}
.game-card-badge{display:inline-flex;align-items:center;padding:2px 7px;background:linear-gradient(135deg,var(--p),#6d5dfc 60%,var(--c));border-radius:6px;font-size:11px;font-weight:900;color:#fff;flex-shrink:0}
.game-card-price del{color:var(--muted);font-weight:400;font-size:11px;text-decoration:line-through}
.cat-admin-list{display:grid;gap:8px;margin-top:14px}
.cat-admin-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:11px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025)}
.cat-admin-add{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:12px}
.cat-admin-add input{padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#080d18;color:#fff}
.game-admin-list{display:grid;gap:8px;margin-top:14px}
.ingame-admin-groups{display:grid;gap:18px;margin-top:16px}
.ingame-admin-cat{display:grid;gap:8px;min-width:0}
.ingame-admin-cat-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0 2px}
.ingame-admin-cat-head h3{margin:0;font-size:14px;font-weight:800;color:#fff}
.ingame-admin-cat-head span{font-size:12px;color:var(--muted);white-space:nowrap}
.ingame-admin-cat-scroll{
    --ingame-admin-row:58px;
    --ingame-admin-gap:8px;
    display:grid;
    gap:var(--ingame-admin-gap);
    max-height:calc(var(--ingame-admin-row) * 3 + var(--ingame-admin-gap) * 2);
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    -ms-overflow-style:none;
    scrollbar-width:none;
}
.ingame-admin-cat-scroll::-webkit-scrollbar{display:none;width:0;height:0}
.ingame-admin-cat-scroll.is-overflowing{
    -webkit-mask-image:linear-gradient(#000 0,#000 90%,transparent);
    mask-image:linear-gradient(#000 0,#000 90%,transparent);
}
.ingame-admin-cat-scroll .game-admin-row{min-height:var(--ingame-admin-row)}
.ingame-admin-cat-scroll .game-admin-row-title{flex-wrap:nowrap;min-width:0}
.ingame-admin-cat-scroll .game-admin-row-title>div{min-width:0}
.ingame-admin-cat-scroll .game-admin-row-title>div>div:first-child{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.game-admin-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:11px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025)}
.game-admin-row-title{display:flex;align-items:center;gap:10px;min-width:0;flex-wrap:wrap;font-weight:700;color:#fff;overflow-wrap:anywhere}
.game-admin-hidden{color:var(--muted);font-size:12px;font-weight:400}
.game-admin-row-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.game-admin-row-actions .btn{min-height:34px;padding:6px 12px;font-size:13px}
.game-admin-row-actions form{margin:0}
.game-admin-field-label{display:grid;gap:5px;color:var(--muted);font-size:13px}
.game-admin-field-label input,.game-admin-field-label select,.game-admin-field-label textarea{padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:#080d18;color:#fff}
.game-admin-field-label textarea{resize:vertical;min-height:72px;font:inherit}
.catalog-add-details{margin-top:14px}
.catalog-add-details>summary{list-style:none;cursor:pointer;width:fit-content}
.catalog-add-details>summary::-webkit-details-marker{display:none}
.catalog-add-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:14px;padding:16px;border:1px solid rgba(139,92,246,.2);border-radius:14px;background:rgba(139,92,246,.07);align-items:end}
.catalog-add-form .btn.primary{align-self:end}
.catalog-picker{margin-top:16px;display:grid;gap:12px}
.catalog-picker-label{display:grid;gap:8px;color:var(--muted);font-size:13px}
.catalog-picker-label select{
    width:100%;
    min-height:48px;
    padding:12px 40px 12px 14px;
    border:1px solid rgba(139,92,246,.28);
    border-radius:14px;
    background:#080d18 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23a78bfa' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center;
    color:#fff;
    font:inherit;
    font-weight:700;
    appearance:none;
    -webkit-appearance:none;
    box-shadow:0 0 0 3px rgba(139,92,246,.08);
}
.catalog-picker-label select:focus{
    outline:none;
    border-color:rgba(139,92,246,.7);
    box-shadow:0 0 0 4px rgba(139,92,246,.16);
}
.catalog-picker-card{
    display:grid;
    gap:12px;
    padding:16px;
    border:1px solid rgba(139,92,246,.22);
    border-radius:16px;
    background:linear-gradient(180deg,rgba(139,92,246,.10),rgba(255,255,255,.03));
}
.catalog-picker-card[hidden]{display:none}
.catalog-picker-head{display:grid;gap:4px}
.catalog-picker-head b{color:#fff;font-size:18px}
@media(max-width:640px){
    .catalog-picker-card .game-admin-row-actions{width:100%;flex-wrap:wrap}
    .catalog-picker-card .game-admin-row-actions .btn,
    .catalog-picker-card .game-admin-row-actions form{flex:1 1 calc(50% - 4px)}
}
.platform-price{display:block;margin:0 0 10px;font-size:18px;font-weight:900;color:#fff}
.platform-edit-icon{display:grid;place-items:center;width:72px;height:72px;margin-bottom:4px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.04)}
.platform-edit-icon img{width:42px;height:42px;object-fit:contain}
.game-admin-field-label input[type=file]{padding:7px 0;color:var(--muted)}
.game-edit-panel{max-width:520px}
.platform-edit-panel{max-width:640px}
.platform-topup-settings{display:grid;gap:12px;padding:14px;border:1px solid rgba(139,92,246,.28);border-radius:14px;background:rgba(139,92,246,.08)}
.platform-topup-settings h3{margin:0;font-size:15px;color:#fff}
.platform-topup-settings-note{margin:0;font-size:12px;line-height:1.4}
.platform-region-selected{display:flex;flex-wrap:wrap;gap:8px;min-height:34px}
.platform-region-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 8px 7px 10px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.04);color:#e5e7eb;font-size:13px;font-weight:600}
.platform-region-chip img{width:20px;height:15px;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.12)}
.platform-region-chip button{display:grid;place-items:center;width:22px;height:22px;border:0;border-radius:999px;background:rgba(255,255,255,.08);color:#fff;cursor:pointer;font-size:16px;line-height:1}
.platform-region-chip button:hover{background:rgba(251,113,133,.25)}
.platform-region-picker{position:relative}
.platform-region-picker-btn{width:100%;justify-content:space-between}
.platform-region-dropdown{position:absolute;z-index:20;top:calc(100% + 6px);left:0;right:0;display:grid;gap:8px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#0b1220;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.platform-region-dropdown[hidden]{display:none!important}
.platform-region-dropdown input[type=search]{width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:#080d18;color:#fff}
.platform-region-options{display:grid;gap:4px;max-height:260px;overflow:auto}
.platform-region-option{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:0;border-radius:10px;background:transparent;color:#e5e7eb;text-align:left;cursor:pointer;font:inherit}
.platform-region-option:hover{background:rgba(139,92,246,.16)}
.platform-region-option img{width:20px;height:15px;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.12);flex-shrink:0}
.platform-region-option.is-selected{opacity:.45}
.game-edit-form{display:grid;gap:12px}
.game-edit-preview{aspect-ratio:270/165;max-width:270px;height:auto;display:grid;place-items:center;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);background-size:cover;background-position:center;color:var(--muted);font-size:13px;overflow:hidden}
.game-cover-field{display:grid;gap:10px;max-width:270px}
.game-cover-field-actions{display:flex;gap:8px;flex-wrap:wrap}
.game-cover-field-actions .btn{min-height:34px;padding:6px 12px;font-size:13px}
.game-cover-input-hidden{display:none!important}
.game-cover-dialog{border:0;padding:0;background:transparent;max-width:min(760px,calc(100vw - 24px));width:100%}
.game-cover-dialog::backdrop{background:rgba(2,6,23,.78);backdrop-filter:blur(6px)}
.game-cover-dialog-card{position:relative;padding:22px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(17,24,39,.98))}
.game-cover-dialog-card h2{margin:0 0 6px;font-size:22px}
.game-cover-dialog-card .muted{margin:0 0 16px;font-size:13px}
.game-cover-dialog-close{position:absolute;top:10px;right:12px;border:0;background:rgba(255,255,255,.08);color:#fff;width:30px;height:30px;border-radius:10px;cursor:pointer;font-size:18px}
.game-cover-workspace{display:grid;gap:14px}
.game-cover-viewport{position:relative;width:100%;max-width:540px;margin:0 auto;aspect-ratio:270/165;border-radius:14px;overflow:hidden;background:#05070f;border:1px solid rgba(255,255,255,.12);touch-action:none;cursor:grab}
.game-cover-viewport.is-dragging{cursor:grabbing}
.game-cover-image-layer{position:absolute;top:0;left:0;transform-origin:top left;will-change:transform;user-select:none;-webkit-user-drag:none}
.game-cover-image-layer img{display:block;max-width:none;pointer-events:none}
.game-cover-controls{display:grid;gap:8px;max-width:540px;margin:0 auto}
.game-cover-controls label{display:grid;gap:6px;color:var(--muted);font-size:13px}
.game-cover-controls input[type=range]{width:100%}
.game-cover-preview-block{display:grid;gap:8px;max-width:270px;margin:4px auto 0}
.game-cover-preview-block>span{color:var(--muted);font-size:12px;text-align:center}
.game-cover-card-preview{aspect-ratio:270/165;border-radius:14px;border:1px solid var(--line);background-color:rgba(255,255,255,.04);background-size:cover;background-position:center;background-repeat:no-repeat}
.game-cover-viewport.is-icon-frame,.game-cover-card-preview.is-icon-frame{border-radius:26%}
.game-cover-viewport.is-transparent{
    background-color:#1a2236;
    background-image:
        linear-gradient(45deg,rgba(255,255,255,.07) 25%,transparent 25%),
        linear-gradient(-45deg,rgba(255,255,255,.07) 25%,transparent 25%),
        linear-gradient(45deg,transparent 75%,rgba(255,255,255,.07) 75%),
        linear-gradient(-45deg,transparent 75%,rgba(255,255,255,.07) 75%);
    background-size:16px 16px;
    background-position:0 0,0 8px,8px -8px,-8px 0;
}
.game-cover-card-preview.is-transparent{
    background-color:transparent;
    background-image:
        linear-gradient(45deg,rgba(255,255,255,.07) 25%,transparent 25%),
        linear-gradient(-45deg,rgba(255,255,255,.07) 25%,transparent 25%),
        linear-gradient(45deg,transparent 75%,rgba(255,255,255,.07) 75%),
        linear-gradient(-45deg,transparent 75%,rgba(255,255,255,.07) 75%);
    background-size:16px 16px;
    background-position:0 0,0 8px,8px -8px,-8px 0;
}
.game-cover-dialog-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:18px}
@media(max-width:640px){.game-cover-dialog-actions .btn{flex:1 1 100%}}
.game-edit-form .check-line{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}
.game-edit-form .check-line input{width:auto}
.game-edit-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.product-edit-meta{display:grid;gap:8px;margin-bottom:4px}
.product-edit-meta p{margin:0;color:var(--muted);font-size:13px}
.panel-head-actions{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.panel-head-actions .btn{flex-shrink:0}
.subscription-dialog{border:0;padding:0;background:transparent;max-width:min(520px,calc(100vw - 32px))}
.subscription-dialog::backdrop{background:rgba(2,6,23,.72);backdrop-filter:blur(6px)}
.subscription-dialog-card{position:relative;padding:22px 22px 20px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(17,24,39,.98))}
.subscription-dialog-card h2{margin:0 0 16px;font-size:22px}
.subscription-dialog-close{position:absolute;top:10px;right:12px;border:0;background:rgba(255,255,255,.08);color:#fff;width:30px;height:30px;border-radius:10px;cursor:pointer;font-size:18px}
.subscription-dialog-form{display:grid;gap:12px}
.subscription-icon-preview{display:grid;place-items:center;min-height:72px;padding:10px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.03);color:var(--muted);font-size:13px;text-align:center}
.subscription-icon-preview img{width:42px;height:42px;object-fit:contain}
.subscription-active-field{margin-top:2px}
@media(max-width:640px){.panel-head-actions{align-items:stretch}.panel-head-actions .btn{width:100%}}
.game-admin-row-title small{display:inline}
@media(max-width:980px){.games-section .section-head{flex-direction:column;align-items:flex-start}}
@media(max-width:640px){.games-track{grid-template-rows:repeat(1,auto);grid-auto-columns:72vw}.games-tabs{gap:6px}.game-admin-row{align-items:flex-start;flex-direction:column}.game-admin-row-actions{width:100%;justify-content:flex-end}.ingame-admin-cat-scroll{--ingame-admin-row:110px}.games-strip-inner > .banner-arrow{width:34px;height:34px;font-size:17px}.games-strip-inner > .banner-arrow-prev{left:-4px}.games-strip-inner > .banner-arrow-next{right:-4px}}

/* v0.8.2 — рекламные панели на главной */
.banner-strip{width:min(calc(100% - 32px),var(--max));margin:20px auto 0;--banner-aspect:6140/1000;--banner-min-h:clamp(150px,calc(248px - 10.5vw),210px)}
.banner-strip ~ .hero{margin-top:24px;min-height:auto}
@media(max-width:640px){
    .hero > div > h1{
        font-size:clamp(28px,7.6vw,34px);
        line-height:1.06;
        letter-spacing:-.04em;
        margin:8px 0 12px;
    }
    .hero > div > p{
        font-size:14px;
        line-height:1.5;
    }
}
.banner-strip-inner{position:relative;border-radius:20px;overflow:hidden}
.banner-strip-inner > .banner-arrow{top:50%;transform:translateY(-50%)}
.banner-strip-inner > .banner-arrow-prev{left:12px}
.banner-strip-inner > .banner-arrow-next{right:12px}
.banner-track{display:flex;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:0;-ms-overflow-style:none;scrollbar-width:none}
.banner-track::-webkit-scrollbar{display:none}
.banner-card{position:relative;flex:0 0 100%;width:100%;aspect-ratio:var(--banner-aspect);height:auto;min-height:var(--banner-min-h);display:block;border:none;border-radius:20px;background-color:rgba(255,255,255,.035);background-image:var(--banner-bg-desktop,none);background-size:cover;background-position:center;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden;transition:border-color .2s}
@media(max-width:980px){.banner-strip{--banner-aspect:2647/1000}.banner-card{background-image:var(--banner-bg-mobile,var(--banner-bg-desktop,none))}}
.banner-card:hover{border-color:rgba(255,255,255,.25)}
.banner-card-empty{background-image:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02))}
.banner-card-title,.banner-card-btn{display:none}
.banner-dots{position:absolute;left:0;right:0;bottom:16px;z-index:2;display:flex;justify-content:center;align-items:center;gap:5px;pointer-events:none}
.banner-dot{
  position:relative;
  pointer-events:auto;
  width:7px;
  height:4px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.32);
  cursor:pointer;
  overflow:hidden;
  transition:width .38s cubic-bezier(.4,0,.2,1), background .25s;
}
.banner-dot.is-active{
  width:30px;
  background:rgba(255,255,255,.22);
}
.banner-dot::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:#fff;
  transform:scaleX(0);
  transform-origin:left center;
  will-change:transform;
}
/* delay equals the width-expand transition so fill starts when pill is fully open */
.banner-dot.is-filling::after{
  animation:banner-dot-fill var(--banner-autoplay-ms,4500ms) linear forwards;
  animation-delay:.38s;
}
.banner-strip-inner:is(:hover,:focus-within) .banner-dot.is-filling::after{animation-play-state:paused}
@keyframes banner-dot-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){
  .banner-dot{transition:none}
  .banner-dot.is-active::after{transform:scaleX(1);animation:none}
}
.banner-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;display:grid;place-items:center;width:40px;height:40px;border:1px solid rgba(255,255,255,.18);border-radius:50%;background:rgba(7,11,22,.62);backdrop-filter:blur(8px);color:#fff;font-size:20px;line-height:1;cursor:pointer;transition:.15s}
.banner-arrow:hover{border-color:rgba(255,255,255,.35);background:rgba(7,11,22,.82)}
.banner-admin-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:14px}
.banner-admin-grid{display:grid;grid-template-columns:1fr;gap:16px}
.banner-admin-grid-compact{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.banner-admin-card{display:grid;gap:14px}
.banner-admin-card-compact{padding:12px;gap:0}
.banner-admin-card-summary{display:flex;align-items:center;gap:12px;min-width:0}
.banner-admin-card-previews{display:grid;gap:4px;flex-shrink:0;width:88px}
.banner-admin-thumb{border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.03) center/cover no-repeat;overflow:hidden}
.banner-admin-thumb-desktop{aspect-ratio:6140/1000;min-height:14px}
.banner-admin-thumb-mobile{aspect-ratio:2647/1000;min-height:24px}
.banner-admin-thumb.is-empty{background-image:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02))}
.banner-admin-card-info{display:grid;gap:4px;min-width:0;flex:1}
.banner-admin-card-info strong{font-size:13px;color:#fff}
.banner-admin-card-title{font-size:12px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.banner-admin-card-title.is-muted{color:var(--muted)}
.banner-admin-card-tags{display:flex;flex-wrap:wrap;gap:4px}
.banner-admin-card-tags .badge{font-size:10px;padding:2px 7px}
.banner-admin-edit-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex-shrink:0;min-width:38px;min-height:38px;padding:0 10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.04);color:#fff;font-size:12px;font-weight:600;cursor:pointer;transition:.15s}
.banner-admin-edit-btn span{display:none}
.banner-admin-edit-btn:hover{border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.08)}
.banner-admin-dialog{border:0;padding:0;background:transparent;max-width:min(760px,calc(100vw - 24px));width:100%;max-height:calc(100vh - 24px);overflow:visible}
.banner-admin-dialog::backdrop{background:rgba(2,6,23,.78);backdrop-filter:blur(6px)}
.banner-admin-dialog-card{position:relative;max-height:calc(100vh - 24px);overflow:auto;padding:22px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(17,24,39,.98))}
.banner-admin-dialog-card h2{margin:0 0 14px;font-size:22px;padding-right:36px}
.banner-admin-dialog-close{position:absolute;top:10px;right:12px;border:0;background:rgba(255,255,255,.08);color:#fff;width:30px;height:30px;border-radius:10px;cursor:pointer;font-size:18px;z-index:1}
.banner-admin-dialog-form{display:grid;gap:10px}
.banner-admin-dialog-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.banner-admin-preview{aspect-ratio:6140/1000;height:auto;max-width:none;width:100%;display:grid;place-items:center;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);background-size:cover;background-position:center;color:var(--muted);font-size:13px;overflow:hidden}
.banner-admin-preview-mobile{aspect-ratio:2647/1000}
.promo-showcase-cover-field.game-cover-field{max-width:220px}
.promo-showcase-admin-preview{aspect-ratio:280/626;max-width:200px;width:100%;height:auto;display:grid;place-items:center;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.03);background-size:cover;background-position:center top;background-repeat:no-repeat;color:var(--muted);font-size:13px;overflow:hidden}
.game-promo-remove-check{margin:0}
.banner-cover-field.game-cover-field{max-width:none;width:100%}
.banner-admin-card form{display:grid;gap:10px}
.banner-admin-card label{display:grid;gap:6px;color:var(--muted);font-size:13px}
.banner-admin-card input[type=text],.banner-admin-card input[type=number],.banner-admin-card input:not([type]){width:100%;padding:10px 11px;border:1px solid var(--line);border-radius:10px;background:#080d18;color:#fff}
.banner-admin-card input[type=file]{padding:8px 0;color:var(--muted)}
.banner-admin-delete{margin:0}
.icon-strip-admin-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.icon-strip-cover-field.game-cover-field{max-width:168px}
.icon-strip-admin-preview{width:168px;height:168px;max-width:100%;aspect-ratio:1;border-radius:26%;border:1px solid var(--line);background-color:transparent;color:var(--muted);font-size:12px;display:grid;place-items:center;text-align:center;padding:0;overflow:hidden;box-shadow:0 4px 18px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.12);background-image:linear-gradient(45deg,rgba(255,255,255,.07) 25%,transparent 25%),linear-gradient(-45deg,rgba(255,255,255,.07) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(255,255,255,.07) 75%),linear-gradient(-45deg,transparent 75%,rgba(255,255,255,.07) 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}
.icon-strip-admin-preview img{width:100%;height:100%;object-fit:contain}
.ingame-product-admin-media{display:grid;grid-template-columns:auto auto 1fr;gap:24px;align-items:start;margin-bottom:16px}
.ingame-product-cover-field.game-cover-field{max-width:270px}
.ingame-product-icon-field.game-cover-field{max-width:270px}
.ingame-product-banner-field.game-cover-field{max-width:none;width:100%;margin-bottom:8px}
.ingame-product-icon-admin-preview{width:48px;height:48px;border-radius:10px;border:1px solid var(--line);background-color:rgba(255,255,255,.03);background-size:contain;background-position:center;background-repeat:no-repeat;color:var(--muted);font-size:11px;display:grid;place-items:center;overflow:hidden}
.ingame-product-banner-admin-preview{position:relative;aspect-ratio:3/1;width:100%;max-height:280px;height:auto;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;background:#161B2E;background-size:cover;background-position:center;background-repeat:no-repeat;color:var(--muted);font-size:13px;overflow:hidden}
.ingame-product-banner-admin-preview::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to top,rgba(10,14,26,.9),transparent 55%),linear-gradient(to right,rgba(10,14,26,.6),transparent 50%)}
.ingame-product-banner-admin-preview span{position:relative;z-index:1}
@media(max-width:900px){.ingame-product-admin-media{grid-template-columns:1fr}}
.ingame-product-admin-preview{aspect-ratio:1;max-width:140px;width:100%;height:auto;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.03);background-size:contain;background-position:center;background-repeat:no-repeat;color:var(--muted);font-size:13px;overflow:hidden}
.icon-strip-admin-card select{width:100%;padding:10px 11px;border:1px solid var(--line);border-radius:10px;background:#080d18;color:#fff}
@media(max-width:640px){.banner-strip{width:calc(100% - 24px)}.banner-strip ~ .hero{margin-top:18px}.banner-arrow{width:34px;height:34px;font-size:17px}.banner-arrow-prev{left:8px}.banner-arrow-next{right:8px}.banner-dots{bottom:10px;gap:4px}.banner-dot{width:5px;height:3px}.banner-dot.is-active{width:20px}.banner-admin-intro{align-items:flex-start;flex-direction:column}.banner-admin-grid-compact{grid-template-columns:1fr}.banner-admin-edit-btn span{display:inline}.icon-strip-admin-grid{grid-template-columns:1fr}}

/* section with flowing gradient background — like brand accent */
.section-gradient-flow {
    padding: 28px 32px 32px;
    border-radius: 26px;
    position: relative;
    overflow: hidden;
    isolation: isolate;
}
.section-gradient-flow::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(
        100deg,
        rgba(221,214,254,.13) 0%,
        rgba(167,139,250,.10) 20%,
        rgba(139,92,246,.12) 38%,
        rgba(34,211,238,.10) 58%,
        rgba(139,92,246,.11) 78%,
        rgba(221,214,254,.13) 100%
    );
    background-size: 260% 100%;
    background-position: 0% 50%;
    animation: section-gradient-sweep 7s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: -1;
}
.section-gradient-flow::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    border: 1px solid transparent;
    background: linear-gradient(var(--bg), var(--bg)) padding-box,
                linear-gradient(100deg, rgba(167,139,250,.4), rgba(34,211,238,.3), rgba(167,139,250,.4)) border-box;
    background-size: auto, 260% 100%;
    background-position: auto, 0% 50%;
    animation: section-border-sweep 7s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: -1;
}
@keyframes section-gradient-sweep {
    from { background-position: 0% 50%; }
    to   { background-position: 100% 50%; }
}
@keyframes section-border-sweep {
    from { background-position: auto, 0% 50%; }
    to   { background-position: auto, 100% 50%; }
}
@media(max-width:640px){.section-gradient-flow{padding:20px 18px 22px;border-radius:20px}}
@media(prefers-reduced-motion:reduce){
    .section-gradient-flow::before { animation: none; }
    .section-gradient-flow::after  { animation: none; }
}

.section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: clamp(10px, 2vw, 16px);
}
.section-head > div {
    min-width: 0;
    flex: 1 1 auto;
}
.section-head > div h2 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.section-head > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex: 0 0 auto;
    min-width: 0;
    max-width: none;
    min-height: clamp(34px, 7vw, 42px);
    padding: clamp(6px, 1.2vw, 10px) clamp(10px, 2.4vw, 18px);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    color: #e2e8f0;
    font-size: clamp(11px, 2.6vw, 13px);
    font-weight: 800;
    letter-spacing: .01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 8px 24px rgba(0,0,0,.22);
    transition: transform .28s cubic-bezier(.25,.8,.25,1), box-shadow .28s ease, border-color .28s ease, color .28s ease;
    position: relative;
}
.section-head > a::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(135deg, rgba(139,92,246,.22), rgba(34,211,238,.16));
    opacity: 0;
    transition: opacity .3s ease;
}
.section-head > a:hover {
    color: #fff;
    border-color: rgba(139,92,246,.45);
    transform: translateY(-2px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 12px 32px rgba(139,92,246,.22);
}
.section-head > a:hover::before {
    opacity: 1;
}
.section-head > a:active {
    transform: translateY(0) scale(.98);
}
.section-gradient-flow .section-head > a {
    background: rgba(8,12,28,.32);
}

/* glass section — like feature-card */
.section-glass{
    padding: 18px 20px 22px;
    border: 1px solid rgba(255,255,255,.05);
    border-radius: 26px;
    background:
        linear-gradient(160deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 100%),
        linear-gradient(160deg, rgba(139,92,246,.10) 0%, rgba(34,211,238,.06) 100%),
        rgba(10,14,28,.72);
    box-shadow: 0 24px 80px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.07);
    position: relative;
    overflow: visible;
    isolation: isolate;
    contain: layout style paint;
    content-visibility: auto;
    contain-intrinsic-size: auto 420px;
}
.section-glass::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(100deg, #8b5cf6 0%, #a78bfa 16%, #7c3aed 30%, #3b82f6 50%, #60a5fa 62%, #6366f1 78%, #8b5cf6 100%);
    background-size: 220% 100%;
    background-position: 0% 50%;
    opacity: .28;
    animation: brand-wordmark-flow 5s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: -1;
}

/* neon glow — pulses in sync with the gradient sweep */
.section-glass::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(100deg, #8b5cf6 0%, #a78bfa 30%, #3b82f6 50%, #6366f1 78%, #8b5cf6 100%);
    background-size: 220% 100%;
    background-position: 0% 50%;
    -webkit-mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
    mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
    animation: brand-wordmark-flow 5s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: -1;
}

@keyframes section-neon-pulse {
    from {
        opacity: .55;
        filter: drop-shadow(0 0 6px rgba(167,139,250,.5)) drop-shadow(0 0 18px rgba(139,92,246,.28));
    }
    to {
        opacity: .95;
        filter: drop-shadow(0 0 10px rgba(59,130,246,.6)) drop-shadow(0 0 28px rgba(59,130,246,.35));
    }
}

.section-glass .section-head{
    margin-bottom:14px;
    align-items:center;
    gap:12px;
}
.section-glass .section-head h2{
    margin-top:4px;
}
.section-glass .section-head > a{
    min-height:clamp(32px,6.5vw,36px);
    padding:clamp(5px,1vw,8px) clamp(8px,2vw,14px);
    font-size:clamp(10px,2.4vw,12px);
}
@media(max-width:640px){.section-glass{padding:14px 14px 18px;border-radius:20px}}
@media(prefers-reduced-motion:reduce){
    .section-glass::before,
    .section-glass::after { animation: none; }
}
.section-glass.is-offscreen::before,
.section-glass.is-offscreen::after,
.section-gradient-flow.is-offscreen::before,
.section-gradient-flow.is-offscreen::after { animation-play-state: paused; }

/* hero feature card hover animation */
.feature-card{transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s ease,border-color .45s ease}
.feature-card:hover{transform:perspective(900px) rotateY(-8deg) rotateZ(-2.5deg) translateY(-8px);box-shadow:-24px 32px 90px rgba(0,0,0,.45),0 0 0 1px rgba(139,92,246,.25);border-color:rgba(139,92,246,.4)}
.hero-art .orb{transition:transform .6s cubic-bezier(.22,1,.36,1)}
.hero-art:has(.feature-card:hover) .orb.a{transform:translate(-56px,-40px) scale(1.08)}
.hero-art:has(.feature-card:hover) .orb.b{transform:translate(56px,44px) scale(1.08)}

@media(min-width:641px) and (max-width:980px){
    .hero-art .orb.a{
        top:32px;
        left:calc(50% - 190px);
        width:200px;
        height:200px;
    }
    .hero-art .orb.b{
        right:auto;
        left:calc(50% + 10px);
        bottom:44px;
        width:170px;
        height:170px;
    }
    .hero-art:has(.feature-card:hover) .orb.a{transform:translate(-24px,-20px) scale(1.06)}
    .hero-art:has(.feature-card:hover) .orb.b{transform:translate(24px,24px) scale(1.06)}
}

@media(max-width:640px){
    .hero-art .orb.a{
        top:20px;
        left:8%;
        width:min(200px,52vw);
        height:min(200px,52vw);
    }
    .hero-art .orb.b{
        right:8%;
        left:auto;
        bottom:28px;
        width:min(170px,46vw);
        height:min(170px,46vw);
    }
    .hero-art:has(.feature-card:hover) .orb.a{transform:translate(-16px,-12px) scale(1.05)}
    .hero-art:has(.feature-card:hover) .orb.b{transform:translate(16px,16px) scale(1.05)}
}

/* v0.8.7 — карусель популярных платформ */
.platform-strip-inner{position:relative}
.platform-strip-inner > .banner-arrow{display:none}
.platform-track{display:flex;gap:16px;overflow-x:auto;overflow-y:visible;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:20px 4px 28px;-ms-overflow-style:none;scrollbar-width:none;-webkit-overflow-scrolling:touch;touch-action:pan-x;cursor:grab;user-select:none}
.platform-track.is-dragging{cursor:grabbing}
.platform-track::-webkit-scrollbar{display:none}
.platform-track .platform{flex:0 0 280px;scroll-snap-align:start}
.platform-track .game-card{flex:0 0 270px;scroll-snap-align:start}
.platform-strip-inner--slider .platform-track{padding-bottom:12px}
.platform-strip-inner--slider{padding-bottom:8px}
.section-glass .platform-strip-inner--slider .platform-track{padding-bottom:12px}
.section-glass .platform-strip-inner--slider{padding-bottom:8px}
.section-gradient-flow .platform-strip-inner--slider .platform-track{padding-bottom:12px}
.section-gradient-flow .platform-strip-inner--slider{padding-bottom:8px}
.platform-scroll-slider{
    width:min(100%,calc(100% - 8px));
    margin:10px auto 0;
    padding:0 2px;
    box-sizing:border-box;
}
.platform-scroll-slider[hidden]{display:none}
.platform-scroll-slider-rail{
    position:relative;
    height:4px;
    border-radius:999px;
    background:rgba(226,232,240,.22);
    cursor:pointer;
    touch-action:none;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.platform-scroll-slider-thumb{
    position:absolute;
    top:50%;
    left:0;
    height:4px;
    min-width:56px;
    border-radius:999px;
    background:linear-gradient(90deg,#22d3ee,#8b5cf6);
    box-shadow:0 0 12px rgba(34,211,238,.55),0 0 24px rgba(139,92,246,.25);
    transform:translateY(-50%);
    transition:width .12s ease,left .08s linear,box-shadow .18s ease;
    pointer-events:none;
}
.platform-scroll-slider.is-static .platform-scroll-slider-thumb{
    opacity:.55;
    box-shadow:none;
}
.platform-scroll-slider-rail:hover .platform-scroll-slider-thumb,
.platform-scroll-slider-rail:active .platform-scroll-slider-thumb{
    box-shadow:0 0 16px rgba(34,211,238,.7),0 0 28px rgba(139,92,246,.35);
}
@media(max-width:640px){.platform-track .platform{flex-basis:78vw}.platform-track .game-card{flex-basis:72vw}.section-glass .platform-track-single,.section-glass .platform-track:not(:has(> :nth-child(2))){justify-content:center;overflow-x:hidden;scroll-snap-type:none;padding-inline:14px}.section-glass .platform-track-single .game-card,.section-glass .platform-track-single .platform,.section-glass .platform-track:not(:has(> :nth-child(2))) .game-card,.section-glass .platform-track:not(:has(> :nth-child(2))) .platform{flex-basis:min(100%,320px);max-width:100%}}
@media(prefers-reduced-motion:reduce){.feature-card,.hero-art .orb{transition:none}.feature-card:hover{transform:none}.hero-art:has(.feature-card:hover) .orb.a,.hero-art:has(.feature-card:hover) .orb.b{transform:none}}

/* ===== Catalog Hero Banner ===== */
.catalog-hero-banner{
    position:relative;
    padding:0;
    overflow:hidden;
    border-radius:28px;
    margin-top:36px;
    margin-bottom:0;
    background-color:#070a16;
    background-image:var(--banner-bg, none);
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    border:1px solid rgba(255,255,255,0.08);
    box-shadow:0 30px 80px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.06);
    isolation:isolate;
}
.catalog-hero-banner::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:rgba(7, 10, 22, 0.35);
    z-index:0;
}

/* Full-bleed category background for the hero panel */
.catalog-hero-visual{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    pointer-events:none;
    z-index:0;
    overflow:hidden;
}
.catalog-hero-visual-glow{
    display:none;
}
.catalog-hero-visual-layer{
    position:absolute;
    inset:0;
    opacity:0;
    transition:opacity .35s ease;
    pointer-events:none;
}
.catalog-hero-visual-layer.is-active{
    opacity:1;
}
.catalog-hero-visual-img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    z-index:2;
}
.catalog-hero-visual-fallback{
    position:absolute;
    inset:0;
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
    z-index:1;
}

.catalog-hero-banner-inner{
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    gap:32px;
    padding:clamp(28px, 3.8vw, 44px);
}

/* Header copy */
.catalog-hero-banner-copy{
    max-width:none;
    position:relative;
    z-index:3;
}
.catalog-hero-banner-copy .eyebrow{
    color:#38bdf8;
    font-size:13px;
    font-weight:800;
    letter-spacing:.22em;
    text-transform:uppercase;
    margin-bottom:8px;
}
.catalog-hero-banner-title{
    font-family:"Outfit",Inter,system-ui,sans-serif;
    font-weight:900;
    font-size:clamp(30px, 3.6vw, 42px);
    line-height:1.05;
    letter-spacing:-.03em;
    text-transform:uppercase;
    color:#ffffff;
    margin:0 0 12px;
    text-shadow:0 2px 18px rgba(0,0,0,.6);
    white-space:nowrap;
}
@media(max-width:980px){
    .catalog-hero-banner-title{
        white-space:normal;
    }
}
.catalog-hero-banner-sub{
    color:#94a3b8;
    font-size:14px;
    line-height:1.55;
    max-width:440px;
    margin:0;
}

/* ---- Asymmetric Cards Grid ---- */
/* ---- Asymmetric Cards Grid ---- */
.catalog-hero-grid{
    display:grid;
    grid-template-columns:32% 1fr 1fr;
    grid-template-rows:1fr 1fr;
    gap:18px;
    min-height:310px;
    position:relative;
    z-index:2;
}
.catalog-hero-grid::before {
    content:'';
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    width:80%;
    height:80%;
    background:radial-gradient(ellipse at center, rgba(139, 92, 246, 0.15) 0%, rgba(59, 130, 246, 0.15) 40%, transparent 70%);
    filter:blur(40px);
    pointer-events:none;
    z-index:-1;
}
.catalog-hcard-topup{
    grid-column:1;
    grid-row:1 / span 2;
}
.catalog-hcard-subscriptions{
    grid-column:2 / span 2;
    grid-row:1;
}
.catalog-hcard-games{
    grid-column:2;
    grid-row:2;
}
.catalog-hcard-promos{
    grid-column:3;
    grid-row:2;
}

/* Card item */
.catalog-hcard{
    position:relative;
    display:flex;
    flex-direction:row;
    align-items:center;
    min-width:0;
    padding:16px 20px;
    border-radius:18px;
    background:rgba(20, 24, 45, 0.4);
    border:1px solid rgba(255, 255, 255, 0.08);
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 4px 20px rgba(0, 0, 0, 0.35);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    overflow:hidden;
    text-decoration:none;
    color:inherit;
    cursor:pointer;
    transition:border-color .22s ease, box-shadow .22s ease, transform .22s cubic-bezier(.16,1,.3,1), background-color .22s ease;
    isolation:isolate;
}
.catalog-hcard-topup {
    flex-direction:column;
    justify-content:space-between;
    align-items:center;
    padding:24px;
}
.catalog-hcard:hover{
    border-color:rgba(96, 165, 250, 0.4);
    transform:translateY(-2px);
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 10px 30px rgba(0, 0, 0, 0.45), 0 0 20px rgba(59, 130, 246, 0.12);
}
.catalog-hcard.is-active{
    border:1px solid #3b82f6;
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 0 26px rgba(59, 130, 246, 0.35), inset 0 0 16px rgba(59, 130, 246, 0.08);
    background:rgba(20, 24, 45, 0.6);
}

/* Card Art Element */
.catalog-hcard-art {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:88px;
    height:88px;
    margin-right:16px;
    flex-shrink:0;
}
.catalog-hcard-topup .catalog-hcard-art {
    width:160px;
    height:140px;
    margin-right:0;
    margin-bottom:20px;
}
.catalog-hcard-art img {
    width:100%;
    height:100%;
    object-fit:contain;
    position:relative;
    z-index:2;
    transition:transform .3s ease;
}
.catalog-hcard:hover .catalog-hcard-art img,
.catalog-hcard.is-active .catalog-hcard-art img {
    transform:scale(1.06);
}
.catalog-hcard-art-glow {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    width:80%;
    height:80%;
    background:rgba(139, 92, 246, 0.4);
    filter:blur(16px);
    z-index:1;
    border-radius:50%;
    transition:background .3s ease;
}
.catalog-hcard.is-active .catalog-hcard-art-glow {
    background:rgba(59, 130, 246, 0.5);
}

/* Overlay gradient from left/bottom for text readability */
.catalog-hcard-overlay{
    display:none; /* Disabled for liquid glass look */
}

/* Card footer and text */
.catalog-hcard-footer{
    position:relative;
    z-index:3;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    min-width:0;
    flex:1;
}
.catalog-hcard-topup .catalog-hcard-footer{
    align-items:flex-end;
    gap:18px;
    flex:none;
    width:100%;
}
.catalog-hcard-info{
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:0;
    flex:1;
}
.catalog-hcard-name{
    font-family:"Outfit",Inter,system-ui,sans-serif;
    font-size:19px;
    font-weight:700;
    color:#ffffff;
    line-height:1.2;
    letter-spacing:-.01em;
}
.catalog-hcard-desc{
    font-size:13px;
    line-height:1.4;
    color:#94a3b8;
}

/* Circular arrow button */
.catalog-hcard-arrow{
    flex:0 0 38px;
    width:38px;
    height:38px;
    border-radius:50%;
    background:rgba(30, 27, 75, 0.85);
    border:1px solid rgba(139, 92, 246, 0.28);
    color:#ffffff;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
    box-shadow:0 2px 8px rgba(0, 0, 0, 0.3);
}
.catalog-hcard-arrow svg{
    width:18px;
    height:18px;
    stroke:currentColor;
    transition:transform .2s ease;
}
.catalog-hcard:hover .catalog-hcard-arrow{
    background:rgba(49, 46, 129, 0.95);
    border-color:rgba(167, 139, 250, 0.6);
    box-shadow:0 0 16px rgba(139, 92, 246, 0.4);
}
.catalog-hcard:hover .catalog-hcard-arrow svg{
    transform:translateX(2px);
}
.catalog-hcard.is-active .catalog-hcard-arrow{
    background:linear-gradient(135deg, #60a5fa 0%, #2563eb 100%);
    border-color:rgba(255, 255, 255, 0.2);
    box-shadow:0 4px 14px rgba(59, 130, 246, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

/* Catalog tab panel switcher */
.catalog-panel{
    display:none;
}
.catalog-panel.is-active{
    display:block;
}

/* Responsive adjustments */
@media(max-width:980px){
    .catalog-hero-banner-inner{
        padding:clamp(22px, 3.5vw, 32px);
        gap:24px;
    }
    .catalog-hero-banner-copy{
        max-width:100%;
    }
    .catalog-hero-banner-title{
        font-size:clamp(22px, 6.4vw, 36px);
        white-space:normal;
    }
    .catalog-hero-grid{
        grid-template-columns:38% 1fr 1fr;
        gap:14px;
        min-height:270px;
    }
    .catalog-hcard{
        padding:16px;
    }
    .catalog-hcard-art{
        width:64px;
        height:64px;
        margin-right:12px;
    }
    .catalog-hcard-topup .catalog-hcard-art{
        width:120px;
        height:110px;
    }
    .catalog-hcard-name{
        font-size:17px;
    }
    .catalog-hcard-desc{
        font-size:12px;
    }
    .catalog-hero-visual{
        inset:0;
        width:100%;
        height:100%;
    }
}
@media(max-width:680px){
    .catalog-hero-banner{
        border-radius:20px;
        margin-top:20px;
    }
    .catalog-hero-banner-inner{
        padding:18px 14px 16px;
        gap:18px;
    }
    .catalog-hero-visual{
        inset:0;
        width:100%;
        height:100%;
        opacity:1;
    }
    .catalog-hero-grid{
        grid-template-columns:1fr 1fr;
        grid-template-rows:auto auto auto;
        gap:10px;
        min-height:auto;
    }
    .catalog-hero-banner-title{
        white-space:normal;
    }
    .catalog-hcard{
        padding:14px;
        border-radius:14px;
        overflow:hidden;
    }
    .catalog-hcard-topup{
        grid-column:1 / span 2;
        grid-row:1;
        min-height:130px;
        flex-direction:row;
        align-items:center;
    }
    .catalog-hcard-topup .catalog-hcard-art {
        width:56px;
        height:56px;
        margin-right:12px;
        margin-bottom:0;
    }
    .catalog-hcard-topup .catalog-hcard-footer{
        flex-direction:row;
        align-items:center;
        gap:12px;
        flex:1;
        width:auto;
        min-width:0;
    }
    .catalog-hcard-art {
        width:40px;
        height:40px;
        margin-right:10px;
    }
    .catalog-hcard-subscriptions{
        grid-column:1 / span 2;
        grid-row:2;
        min-height:90px;
    }
    .catalog-hcard-games{
        grid-column:1;
        grid-row:3;
        min-height:90px;
    }
    .catalog-hcard-promos{
        grid-column:2;
        grid-row:3;
        min-height:90px;
    }
    .catalog-hcard-name{
        font-size:16px;
    }
    .catalog-hcard-desc{
        font-size:12px;
    }
    .catalog-hcard-games .catalog-hcard-desc,
    .catalog-hcard-promos .catalog-hcard-desc{
        display:none;
    }
    .catalog-hcard-arrow{
        flex:0 0 34px;
        width:34px;
        height:34px;
    }
    .catalog-hcard-arrow svg{
        width:16px;
        height:16px;
    }
}
@media(prefers-reduced-motion:reduce){
    .catalog-hcard{transition:none}
    .catalog-hcard:hover{transform:none}
}

/* iOS 18 Liquid Glass Header */
.topbar {
    background: rgba(8, 12, 28, 0.38) !important;
    backdrop-filter: blur(48px) saturate(180%) brightness(1.06) !important;
    -webkit-backdrop-filter: blur(48px) saturate(180%) brightness(1.06) !important;
    border: 1px solid transparent !important;
    background-clip: padding-box !important;
    border-image: none !important;
    outline: 1px solid rgba(255, 255, 255, 0.1) !important;
    outline-offset: 0 !important;
    box-shadow:
        0 0 0 0.5px rgba(255, 255, 255, 0.12) inset,
        0 1px 0 rgba(255, 255, 255, 0.14) inset,
        0 24px 64px rgba(0, 0, 0, 0.45),
        0 4px 16px rgba(0, 0, 0, 0.22) !important;
    padding: 11px 18px !important;
    justify-content: flex-start !important;
    gap: 12px;
    border-radius: 22px !important;
    position: relative !important;
    transition: background 0.35s ease, box-shadow 0.35s ease, backdrop-filter 0.35s ease;
    overflow: visible !important;
}

/* liquid specular shimmer on top edge */
.topbar::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(
        160deg,
        rgba(255, 255, 255, 0.1) 0%,
        rgba(255, 255, 255, 0.04) 30%,
        rgba(139, 92, 246, 0.04) 60%,
        rgba(34, 211, 238, 0.03) 100%
    );
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom-color: rgba(255, 255, 255, 0.04);
    z-index: 0;
}

.topbar > * {
    position: relative;
    z-index: 1;
}

.brand {
    flex-shrink: 0;
}

.brand img {
    width: 50px;
    height: 50px;
    display: block;
    flex-shrink: 0;
}

.brand.small img {
    width: 34px;
    height: 34px;
}

.brand-wordmark {
    display: inline-flex;
    align-items: baseline;
    font-family: "Outfit", Inter, system-ui, sans-serif;
    font-size: 1.28rem;
    font-weight: 800;
    letter-spacing: -0.045em;
    line-height: 1;
    white-space: nowrap;
}

.brand-wordmark-base {
    color: #f8fafc;
    text-shadow: 0 0 18px rgba(255, 255, 255, 0.12);
}

.brand-wordmark-accent {
    background: linear-gradient(100deg, #ddd6fe 0%, #a78bfa 20%, #8b5cf6 38%, #22d3ee 58%, #8b5cf6 78%, #ddd6fe 100%);
    background-size: 220% 100%;
    background-position: 0% 50%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.brand .brand-wordmark-accent {
    animation: brand-wordmark-flow 5s ease-in-out infinite alternate;
}

@keyframes brand-wordmark-flow {
    from { background-position: 0% 50%; }
    to { background-position: 100% 50%; }
}

.brand:hover .brand-wordmark-base {
    color: #fff;
}

.brand:hover .brand-wordmark-accent {
    filter: brightness(1.12) saturate(1.08);
    animation-duration: 2.4s;
}

@media (prefers-reduced-motion: reduce) {
    .brand .brand-wordmark-accent {
        animation: none;
    }
}

.brand.small .brand-wordmark {
    font-size: 1.02rem;
    letter-spacing: -0.04em;
}

.hero h1.hero-headline {
    font-family: "Outfit", Inter, system-ui, sans-serif;
    font-weight: 800;
    letter-spacing: -0.045em;
    line-height: 1.02;
}

.hero h1.hero-headline .brand-wordmark-base {
    text-shadow: 0 0 28px rgba(255, 255, 255, 0.1);
}

.topbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    flex-shrink: 0;
}

.topbar nav {
    gap: 10px !important;
}

.topbar nav a:not(.btn) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 15px;
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.02);
    color: #b9c5d6;
    font-size: 13px;
    font-weight: 700;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.topbar nav a:not(.btn):hover {
    border-color: rgba(139, 92, 246, 0.35);
    background: rgba(139, 92, 246, 0.07);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(139, 92, 246, 0.12);
}

.topbar nav a:not(.btn).active {
    background: rgba(139, 92, 246, 0.15);
    border-color: rgba(139, 92, 246, 0.45);
    color: #fff;
    box-shadow: 0 4px 15px rgba(139, 92, 246, 0.15);
}

/* Beautiful login button in the same style */
.topbar nav a[href="/auth/login.php"] {
    border-color: rgba(34, 211, 238, 0.2);
    background: rgba(34, 211, 238, 0.02);
    color: #a5f3fc;
}

.topbar nav a[href="/auth/login.php"]:hover {
    border-color: rgba(34, 211, 238, 0.5);
    background: rgba(34, 211, 238, 0.08);
    color: #fff;
    box-shadow: 0 8px 24px rgba(34, 211, 238, 0.15);
}

/* Update header user section styles */
.header-user {
    gap: 12px !important;
}

/* iOS 18 Liquid Glass icon buttons */
.nav-toggle,
.header-search-btn {
    display: none;
    place-items: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px);
    color: #b9c5d6;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
}

.nav-toggle { font-size: 16px; line-height: 1; }

.header-search-btn svg {
    width: 16px;
    height: 16px;
}

.nav-toggle:hover,
.header-search-btn:hover {
    color: #fff;
    border-color: rgba(34, 211, 238, 0.35);
    background: rgba(34, 211, 238, 0.08);
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(34, 211, 238, 0.12);
}
.nav-toggle:active,
.header-search-btn:active {
    transform: scale(.94);
    transition-duration: .12s;
}

@media(max-width:980px){
    .topbar {
        gap: 10px !important;
    }
    .topbar-actions {
        gap: 6px;
    }
    .nav-toggle {
        display: grid;
    }
    .topbar nav {
        gap: 8px !important;
    }
    .topbar nav a:not(.btn) {
        width: 100%;
        text-align: center;
        padding: 10px;
    }
}

@media(max-width:980px){
    .topbar nav {
        position: absolute;
        top: calc(100% + 12px);
        left: auto !important;
        right: 0;
        z-index: 5;
        display: grid !important;
        width: min(292px, calc(100vw - 32px));
        max-width: calc(100vw - 32px);
        padding: 12px;
        gap: 8px !important;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 22px;
        background:
            radial-gradient(circle at 18% 0%, rgba(139, 92, 246, 0.34), transparent 42%),
            radial-gradient(circle at 90% 15%, rgba(34, 211, 238, 0.2), transparent 36%),
            linear-gradient(145deg, rgba(24, 32, 55, 0.74), rgba(9, 15, 30, 0.58));
        backdrop-filter: blur(34px) saturate(160%);
        -webkit-backdrop-filter: blur(34px) saturate(160%);
        box-shadow:
            0 1px 0 rgba(255, 255, 255, 0.14) inset,
            0 22px 58px rgba(0, 0, 0, 0.42),
            0 0 36px rgba(34, 211, 238, 0.08);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-8px) scale(0.98);
        transform-origin: top right;
        transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
        overflow: hidden;
    }

    .topbar nav::before {
        content: '';
        position: absolute;
        inset: 0;
        border-radius: inherit;
        pointer-events: none;
        background: linear-gradient(155deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.03) 44%, rgba(34, 211, 238, 0.05));
    }

    .topbar nav.open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0) scale(1);
    }

    .topbar nav a:not(.btn),
    .topbar nav a.btn {
        position: relative;
        z-index: 1;
        min-height: 44px;
        justify-content: flex-start;
        padding: 11px 14px;
        border-color: rgba(255, 255, 255, 0.1);
        border-radius: 15px;
        background: rgba(255, 255, 255, 0.055);
        color: #d7e2f2;
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08) inset;
    }

    .topbar nav a:not(.btn):hover,
    .topbar nav a.btn:hover,
    .topbar nav a:not(.btn).active {
        border-color: rgba(34, 211, 238, 0.32);
        background: linear-gradient(135deg, rgba(139, 92, 246, 0.24), rgba(34, 211, 238, 0.12));
        color: #fff;
        box-shadow:
            0 1px 0 rgba(255, 255, 255, 0.14) inset,
            0 12px 28px rgba(34, 211, 238, 0.14);
        transform: translateY(-1px);
    }
}

/* Guest CTA banner */
.cta-guest {
    margin-top: 20px !important;
}
.cta-actions {
    display: flex;
    gap: 12px;
    flex-shrink: 0;
}
@media(max-width:640px) {
    .cta-actions {
        flex-direction: column;
        width: 100%;
    }
    .cta-actions .btn {
        width: 100%;
        text-align: center;
    }
}

/* Header Search Widget */
.header-search {
    position: relative;
    flex-shrink: 0;
}

.header-search-btn {
    display: grid; /* overridden by media query to show */
}

.header-search.is-open .header-search-btn {
    color: #fff;
    border-color: rgba(34, 211, 238, 0.35);
    background: rgba(34, 211, 238, 0.08);
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(34, 211, 238, 0.12);
}

.header-search-popup {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    width: 380px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 18px;
    background: rgba(9,14,27,.97);
    backdrop-filter: blur(24px);
    box-shadow: 0 24px 60px rgba(0,0,0,.5), 0 0 0 1px rgba(139,92,246,.08);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px) scale(.98);
    transform-origin: top right;
    transition: opacity .2s ease, transform .2s ease, visibility .2s;
    z-index: 40;
    overflow: hidden;
}

.header-search.is-open .header-search-popup {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}

.header-search-field {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.header-search-icon {
    flex-shrink: 0;
    color: #5a6a84;
}

.header-search-input {
    flex: 1;
    min-width: 0;
    background: none;
    border: none;
    outline: none;
    color: #f5f7ff;
    font-size: 15px;
    font-weight: 600;
    caret-color: var(--p);
}

.header-search-input::placeholder {
    color: #4a5a72;
    font-weight: 500;
}

.header-search-clear {
    display: none;
    place-items: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: rgba(255,255,255,.07);
    color: #7a8a9e;
    cursor: pointer;
    transition: .15s;
    flex-shrink: 0;
}

.header-search-clear.visible {
    display: grid;
}

.header-search-clear:hover {
    background: rgba(251,113,133,.15);
    color: #fca5a5;
}

.header-search-results {
    max-height: 380px;
    overflow-y: auto;
    padding: 8px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.1) transparent;
}

.header-search-results::-webkit-scrollbar {
    width: 4px;
}

.header-search-results::-webkit-scrollbar-track {
    background: transparent;
}

.header-search-results::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.1);
    border-radius: 4px;
}

.search-group-label {
    padding: 8px 10px 4px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #4a5a72;
}

.search-result-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    text-decoration: none;
    color: #d9deeb;
    transition: background .15s, color .15s;
    cursor: pointer;
}

.search-result-item:hover,
.search-result-item.is-focused {
    background: rgba(139,92,246,.12);
    color: #fff;
}

.search-result-thumb {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(255,255,255,.06);
    display: grid;
    place-items: center;
    overflow: hidden;
    font-size: 18px;
    border: 1px solid rgba(255,255,255,.06);
}

.search-result-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.search-result-thumb-icon {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 8px;
}

.search-result-body {
    flex: 1;
    min-width: 0;
}

.search-result-name {
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.search-result-sub {
    font-size: 12px;
    color: #5a6a84;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.search-result-price {
    flex-shrink: 0;
    font-size: 13px;
    font-weight: 800;
    color: #a7f3d0;
    white-space: nowrap;
}

.search-type-badge {
    flex-shrink: 0;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .05em;
    padding: 3px 8px;
    border-radius: 999px;
}

.search-type-platform { background: rgba(139,92,246,.2); color: #c4b5fd; }
.search-type-game     { background: rgba(34,211,238,.15); color: #67e8f9; }
.search-type-product  { background: rgba(52,211,153,.15); color: #6ee7b7; }

.search-empty {
    padding: 28px 16px;
    text-align: center;
    color: #4a5a72;
    font-size: 14px;
}

.search-empty-icon {
    font-size: 28px;
    margin-bottom: 8px;
}

.search-hint {
    padding: 16px;
    text-align: center;
    color: #4a5a72;
    font-size: 13px;
}

@media(max-width:640px) {
    .header-search-popup {
        width: calc(100vw - 24px);
        right: -8px;
    }
}

.promo-old-price{
    display:block;
    margin-top:6px;
    color:var(--muted);
    font-size:12px;
}
.promo-old-price del{
    color:#7f8aa3;
}

.hero{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
.hero > div,
.hero-art{min-width:0;max-width:100%}
.hero-art{width:100%}

/* Hero top-up platforms ticker */
.hero-platforms-ticker{
    --hero-ticker-gap:1.35em;
    position:relative;
    overflow:hidden;
    width:100%;
    max-width:100%;
    color:#9fdff0;
    font-size:12px;
    font-weight:900;
    letter-spacing:.18em;
    text-transform:uppercase;
    line-height:1.4;
    -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);
    mask-image:linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);
    user-select:none;
}
.hero-platforms-track{
    display:flex;
    width:max-content;
    animation:hero-platforms-marquee 38s linear infinite;
    will-change:transform;
}
.hero-platforms-ticker:hover .hero-platforms-track,
.hero-platforms-ticker:focus-within .hero-platforms-track{
    animation-play-state:paused;
}
.hero-platforms-set{
    display:flex;
    align-items:center;
    flex-shrink:0;
    gap:var(--hero-ticker-gap);
    padding-right:var(--hero-ticker-gap);
}
.hero-platforms-name{
    white-space:nowrap;
    color:inherit;
}
.hero-platforms-sep{
    flex-shrink:0;
    opacity:.72;
}
@keyframes hero-platforms-marquee{
    from{transform:translateX(0)}
    to{transform:translateX(-50%)}
}
@media(prefers-reduced-motion:reduce){
    .hero-platforms-track{
        animation:none;
        flex-wrap:wrap;
        width:auto;
        max-width:100%;
        will-change:auto;
    }
    .hero-platforms-set:last-child{display:none}
    .hero-platforms-set{padding-right:0}
}

/* CTA between icon strip and promos */
.hero-platforms-band{
    --hero-platforms-gap:clamp(24px,5vw,48px);
    --hero-platforms-cta-gap:clamp(40px,7vw,72px);
    width:min(calc(100% - 32px),var(--max));
    margin:0 auto var(--hero-platforms-gap);
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:var(--hero-platforms-cta-gap);
}
.hero-platforms-cta{
    width:100%;
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
}
.hero-platforms-all{
    width:min(100%,400px);
    min-height:48px;
    border-radius:16px;
    font-size:15px;
    letter-spacing:.01em;
    box-shadow:0 14px 36px rgba(109,93,252,.35);
}
.hero-platforms-all:hover{
    box-shadow:0 18px 42px rgba(34,211,238,.28);
}
.feature-card{
    width:min(100%,400px);
    max-width:100%;
    overflow:hidden;
    box-sizing:border-box;
}
.feature-card-carousel {
    touch-action: pan-y;
    cursor: grab;
    user-select: none;
}

.feature-card-carousel:active {
    cursor: grabbing;
}

.feature-slides {
    display: grid;
    min-width: 0;
    overflow: hidden;
}

.feature-slide {
    grid-area: 1 / 1;
    opacity: 0;
    transform: translateX(-36px);
    transition: opacity .55s ease, transform .55s cubic-bezier(.22,1,.36,1);
    pointer-events: none;
}

.feature-slide.is-active {
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
    z-index: 2;
}

.feature-slide.is-leaving {
    opacity: 0;
    transform: translateX(36px);
    z-index: 1;
}

.feature-slide .mark {
    overflow: hidden;
}

.feature-slide .mark img {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.feature-dots {
    display: flex;
    justify-content: center;
    gap: 7px;
    margin-top: 20px;
}

.feature-dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(255,255,255,.18);
    cursor: pointer;
    transition: all .25s ease;
}

.feature-dot:hover {
    background: rgba(255,255,255,.4);
}

.feature-dot.is-active {
    width: 22px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--p), var(--c));
}

@media(prefers-reduced-motion:reduce) {
    .feature-slide { transition: none; }
}

/* Beautiful Hero discount label */
.hero-discount-label {
    display: inline-flex;
    align-items: center;
    padding: 5px 11px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(251,113,133,.18), rgba(244,63,94,.12));
    color: #fda4af;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .02em;
    border: 1px solid rgba(251,113,133,.24);
    box-shadow: 0 4px 12px rgba(251,113,133,.06);
    text-transform: uppercase;
    animation: pulse-discount 2.2s infinite;
}

@keyframes pulse-discount {
    0% { transform: scale(1); box-shadow: 0 4px 12px rgba(251,113,133,.06); }
    50% { transform: scale(1.02); box-shadow: 0 6px 16px rgba(251,113,133,.12); border-color: rgba(251,113,133,.38); }
    100% { transform: scale(1); box-shadow: 0 4px 12px rgba(251,113,133,.06); }
}

/* Platform carousel cards — same glass recipe as .feature-card */
.platform-track .platform.catalog-product-card,
.platform-track .game-card.catalog-game-card {
    position: relative;
    display: grid;
    grid-template-columns: 48px 1fr;
    grid-template-rows: auto auto 1fr auto auto;
    grid-template-areas:
        "icon   badge"
        "title  title"
        "spacer spacer"
        "price  price"
        "old    old";
    align-content: start;
    min-height: 264px !important;
    padding: 28px !important;
    border: 1px solid var(--line) !important;
    border-radius: 26px !important;
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.035)) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    box-shadow: 0 24px 80px rgba(0,0,0,.35) !important;
    transition: transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s ease, border-color .45s ease !important;
    text-decoration: none;
    overflow: visible;
}

.platform-track .platform.catalog-product-card::before,
.platform-track .platform.catalog-product-card::after,
.platform-track .game-card.catalog-game-card::before,
.platform-track .game-card.catalog-game-card::after {
    display: none;
}

.platform-track .platform.catalog-product-card:hover,
.platform-track .game-card.catalog-game-card:hover {
    transform: perspective(900px) rotateY(-8deg) rotateZ(-2.5deg) translateY(-8px) !important;
    box-shadow: -24px 32px 90px rgba(0,0,0,.45), 0 0 0 1px rgba(139,92,246,.25) !important;
    border-color: rgba(139,92,246,.4) !important;
}

.platform-track .platform.catalog-product-card.purple,
.platform-track .platform.catalog-product-card.green,
.platform-track .platform.catalog-product-card.blue,
.platform-track .platform.catalog-product-card.red,
.platform-track .game-card.catalog-game-card {
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.035)) !important;
}

.platform-track .platform.catalog-product-card > img {
    grid-area: icon !important;
    display: grid !important;
    place-items: center !important;
    width: 48px !important;
    height: 48px !important;
    padding: 9px !important;
    margin: 0 !important;
    border-radius: 14px !important;
    background: rgba(139,92,246,.22) !important;
    border: none !important;
    box-shadow: none !important;
    object-fit: contain !important;
    box-sizing: border-box !important;
    align-self: start;
    justify-self: start;
}

.platform-track .game-card.catalog-game-card > .catalog-game-card-thumb {
    grid-area: icon !important;
    display: block !important;
    width: 48px !important;
    height: 48px !important;
    margin: 0 !important;
    border-radius: 14px !important;
    border: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    align-self: start;
    justify-self: start;
    background-color: rgba(255,255,255,.04);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.platform-track .game-card.catalog-game-card.game-card-empty > .catalog-game-card-thumb {
    background-image: linear-gradient(135deg, rgba(139,92,246,.2), rgba(34,211,238,.1)) !important;
}

.platform-track .platform.catalog-product-card > .catalog-product-platform,
.platform-track .game-card.catalog-game-card > .catalog-product-platform {
    grid-area: badge !important;
    justify-self: end !important;
    align-self: start !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 5px 10px !important;
    margin: 0 !important;
    border: 1px solid var(--line) !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: #a7f3d0 !important;
    background: rgba(52,211,153,.11) !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.platform-track .platform.catalog-product-card:not(:has(> img)) > .catalog-product-platform,
.platform-track .game-card.catalog-game-card:not(:has(> .catalog-game-card-thumb[style*="background-image"])) > .catalog-product-platform {
    grid-column: 1 / -1 !important;
    justify-self: start !important;
}

.platform-track .platform.catalog-product-card h3,
.platform-track .game-card.catalog-game-card h3 {
    grid-area: title !important;
    font-size: 28px !important;
    font-weight: 900 !important;
    margin: 24px 0 8px !important;
    letter-spacing: -.02em !important;
    color: #fff !important;
    line-height: 1.15 !important;
}

.platform-track .platform.catalog-product-card .platform-price,
.platform-track .game-card.catalog-game-card .platform-price {
    grid-area: price !important;
    display: block !important;
    margin-top: 28px !important;
    padding-top: 20px !important;
    border-top: 1px solid var(--line) !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    color: #fff !important;
    align-self: end;
}

.platform-track .platform.catalog-product-card > .promo-old-price,
.platform-track .game-card.catalog-game-card > .promo-old-price {
    grid-area: old !important;
    margin-top: 6px !important;
    color: var(--muted) !important;
}

.platform-track .platform.catalog-product-card p {
    grid-area: spacer !important;
    margin: 0 !important;
    min-height: 0 !important;
    color: var(--muted) !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    align-self: end;
}

.platform-track .platform.catalog-product-card .game-card-badge,
.platform-track .game-card.catalog-game-card .game-card-badge {
    display: inline-flex !important;
    align-items: center !important;
    padding: 5px 10px !important;
    margin-left: 8px !important;
    border: 1px solid var(--line) !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    color: #cbd5e1 !important;
    background: rgba(255,255,255,.06) !important;
    vertical-align: middle;
}

@media(max-width:640px) {
    .platform-track .platform.catalog-product-card,
    .platform-track .game-card.catalog-game-card {
        padding: 22px !important;
        min-height: 240px !important;
    }
    .platform-track .platform.catalog-product-card h3,
    .platform-track .game-card.catalog-game-card h3 {
        font-size: 22px !important;
        margin-top: 18px !important;
    }
    .platform-track .platform.catalog-product-card .platform-price,
    .platform-track .game-card.catalog-game-card .platform-price {
        font-size: 18px !important;
        margin-top: 20px !important;
        padding-top: 16px !important;
    }
    .section-gradient-flow .platform-track-single,
    .section-gradient-flow .platform-track:not(:has(> :nth-child(2))) {
        justify-content: center;
        overflow-x: hidden;
        scroll-snap-type: none;
        padding-inline: 14px;
    }
    .section-gradient-flow .platform-track-single .game-card,
    .section-gradient-flow .platform-track-single .platform,
    .section-gradient-flow .platform-track:not(:has(> :nth-child(2))) .game-card,
    .section-gradient-flow .platform-track:not(:has(> :nth-child(2))) .platform {
        flex-basis: min(100%, 320px);
        max-width: 100%;
    }
}

@media(prefers-reduced-motion:reduce) {
    .platform-track .platform.catalog-product-card:hover,
    .platform-track .game-card.catalog-game-card:hover {
        transform: none !important;
    }
}

/* v0.9.3 — Game detail page */
.game-page{width:min(calc(100% - 32px),var(--max));margin:26px auto 90px}
.game-breadcrumbs{display:flex;align-items:center;gap:8px;margin-bottom:18px;color:var(--muted);font-size:13px;flex-wrap:wrap}
.game-breadcrumbs a:hover{color:#fff}
.game-breadcrumbs b{color:#fff;font-weight:700}
.game-layout{display:grid;grid-template-columns:300px minmax(0,1fr) 300px;gap:22px;align-items:start}
.game-side{display:grid;gap:14px}
.game-cover{height:170px;border:1px solid var(--line);border-radius:16px;background-color:rgba(255,255,255,.04);background-size:cover;background-position:center}
.game-meta-card{display:grid;gap:0;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.03);padding:6px 16px}
.game-meta-row{display:grid;grid-template-columns:100px 1fr;gap:10px;padding:11px 0;border-bottom:1px solid var(--line);font-size:12px}
.game-meta-row:last-child{border-bottom:0}
.game-meta-row span{color:var(--muted)}
.game-meta-row b{font-weight:600;color:#dbe3f2;min-height:16px;overflow-wrap:anywhere}
.game-title{margin:0 0 12px;font-size:clamp(28px,3.4vw,42px);line-height:1.08;letter-spacing:-.03em}
.game-short-desc{margin:0 0 22px;color:var(--muted);font-size:14px;min-height:20px}
.game-option-label{margin:18px 0 10px;font-weight:800;font-size:14px}
.game-delivery-list{display:flex;gap:10px;flex-wrap:wrap}
.game-delivery{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);color:var(--text);cursor:pointer;text-align:left;transition:.18s}
.game-delivery:hover{border-color:rgba(139,92,246,.45)}
.game-delivery.is-selected{border-color:#fff;background:rgba(255,255,255,.06)}
.game-delivery-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(255,255,255,.07);overflow:hidden;flex-shrink:0}
.game-delivery-icon img{width:22px;height:22px;object-fit:contain}
.game-delivery-body{display:grid}
.game-delivery-body b{font-size:14px}
.game-delivery-body small{color:var(--muted);font-size:11px;max-width:170px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.game-delivery-price-wrap{display:flex;align-items:center;gap:6px;margin-left:6px;flex-wrap:wrap;justify-content:flex-end}
.game-delivery-price{margin-left:0;font-weight:900;font-size:13px;color:#a5f3fc;white-space:nowrap}
.game-delivery-price-old{color:var(--muted);font-size:11px;text-decoration:line-through;white-space:nowrap}
.game-delivery-empty{margin:0;padding:12px 14px;border:1px dashed var(--line);border-radius:14px;width:100%}
.game-region-list{display:flex;gap:8px;flex-wrap:wrap}
.game-region{padding:8px 15px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.03);color:#d9deeb;font-size:13px;font-weight:700;cursor:pointer;transition:.15s}
.game-region:hover{border-color:rgba(139,92,246,.5)}
.game-region.is-selected{background:#fff;border-color:#fff;color:#0b1020}
.game-edition-list{display:flex;gap:8px;flex-wrap:wrap}
.game-edition{padding:10px 16px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.03);color:#d9deeb;font-size:13px;font-weight:700;cursor:pointer;transition:.15s;text-align:left}
.game-edition.is-selected,.game-edition:hover{border-color:rgba(139,92,246,.55);background:rgba(139,92,246,.1);color:#fff}
.game-buy-panel{position:sticky;top:100px;padding:18px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.035)}
.game-buy-head{display:flex;gap:11px;align-items:center}
.game-buy-thumb{width:52px;height:52px;border-radius:11px;background-color:rgba(255,255,255,.06);background-size:cover;background-position:center;flex-shrink:0}
.game-buy-title{font-weight:800;font-size:13px;line-height:1.3}
.game-buy-badges{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0 4px}
.game-buy-badge{padding:4px 9px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.05);font-size:11px;font-weight:800;color:#cbd5e1}
.game-pay-list{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}
.game-pay{padding:10px 6px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.03);color:#cbd5e1;font-size:11.5px;font-weight:800;cursor:pointer;transition:.15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.game-pay:hover{border-color:rgba(139,92,246,.5)}
.game-pay.is-selected{background:rgba(255,255,255,.1);border-color:#fff;color:#fff}
.game-promo-input{width:100%;margin-top:12px;padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:rgba(2,6,23,.6);color:#fff;outline:none}
.game-promo-input:focus{border-color:rgba(139,92,246,.8);box-shadow:0 0 0 4px rgba(139,92,246,.12)}
.game-total-row{display:flex;justify-content:space-between;align-items:center;margin-top:16px;padding:13px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(2,6,23,.5)}
.game-total-row span{color:var(--muted);font-size:13px}
.game-total-row b{font-size:21px}
.game-old-price-row{display:flex;align-items:center;gap:8px;margin-top:8px;color:var(--muted);font-size:12px}
.game-old-price-row del{color:var(--muted)}
.game-buy-btn{width:100%;margin-top:14px;min-height:48px;background:linear-gradient(135deg,#34d399,#22d3ee);color:#052014;font-weight:900;font-size:15px;border-radius:13px}
.game-buy-btn:hover{box-shadow:0 12px 32px rgba(52,211,153,.3)}
.game-buy-note{margin:12px 0 0;color:var(--muted);font-size:10.5px;line-height:1.5;text-align:center}
.game-buy-note a{color:#a5f3fc}
.game-shots-head{display:flex;justify-content:space-between;align-items:center;margin:40px 0 16px}
.game-shots-head h2{margin:0;font-size:24px}
.game-shots-head a{color:var(--muted);font-size:13px}
.game-shots-head a:hover{color:#fff}
.game-shots-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.game-shot{height:120px;border:1px solid var(--line);border-radius:13px;background-color:rgba(255,255,255,.04);background-size:cover;background-position:center;transition:.18s}
.game-shot:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.25)}
.game-tabs{margin-top:42px;padding:24px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.02)}
.game-tabs-nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.game-tab{padding:8px 16px;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--muted);font-size:13px;font-weight:800;cursor:pointer;transition:.15s}
.game-tab:hover{color:#fff}
.game-tab.is-active{background:#fff;border-color:#fff;color:#0b1020}
.game-tab-pane{display:none}
.game-tab-pane.is-active{display:block}
.game-text{color:#c7d0e0;font-size:14px;line-height:1.7;white-space:normal}
.game-markdown{display:grid;gap:12px}
.game-markdown>:first-child{margin-top:0}
.game-markdown>:last-child{margin-bottom:0}
.game-markdown h1,.game-markdown h2,.game-markdown h3{margin:0;color:#fff;font-weight:900;line-height:1.35}
.game-markdown h1{font-size:22px}
.game-markdown h2{font-size:18px}
.game-markdown h3{font-size:15px;color:#e2e8f0}
.game-markdown p{margin:0}
.game-markdown ul,.game-markdown ol{margin:0;padding-left:1.25rem;display:grid;gap:6px}
.game-markdown li::marker{color:#7dffa8}
.game-markdown strong{color:#fff;font-weight:800}
.game-markdown em{color:#dbe3f2}
.game-markdown code{padding:1px 6px;border:1px solid var(--line);border-radius:6px;background:rgba(255,255,255,.06);font-size:.92em}
.game-text-empty{min-height:44px;border:1px dashed var(--line);border-radius:12px}
.product-features-list{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.product-features-list li{position:relative;padding:10px 12px 10px 34px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.03);color:#d7deea;font-size:13px;line-height:1.45}
.product-features-list li::before{content:"✓";position:absolute;left:12px;top:10px;color:#7dffa8;font-weight:800}
.product-page .game-buy-form .game-admin-field-label{display:grid;gap:6px;color:var(--muted);font-size:12px}
.product-page .game-buy-form .game-admin-field-label input{width:100%;min-height:42px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.04);color:#fff}
.game-shots-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.game-shot-large{height:190px}
.game-edit-section-title{margin-top:10px;padding-top:14px;border-top:1px solid var(--line);font-weight:900;font-size:14px}
.game-admin-platform-hint{margin:6px 0 14px;color:var(--muted);font-size:12px}
.game-platform-prices-grid{display:grid;gap:10px}
.game-platform-price-row{display:grid;grid-template-columns:140px 1fr 1fr;gap:10px;align-items:end;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02)}
.game-platform-price-row.game-platform-inactive{opacity:.45}
.game-services{margin:32px 0 42px;display:grid;gap:28px}.game-services-group h2{margin:0 0 14px;font-size:22px}.game-services-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.game-service-card{display:grid;grid-template-columns:112px 1fr;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.035)}.game-service-card-image,.game-service-admin-image{min-height:100%;background:#111827 center/cover no-repeat}.game-service-card-body{padding:16px}.game-service-card h3{margin:0;font-size:18px}.game-service-card p{margin:6px 0 13px;color:var(--muted);font-size:13px}.game-service-card-bottom{display:flex;align-items:center;gap:8px;margin-bottom:12px}.game-service-price{font-weight:900;font-size:17px}.game-service-admin-list{display:grid;gap:14px}.game-service-admin-form{display:grid;grid-template-columns:100px repeat(3,minmax(130px,1fr));gap:12px;align-items:end;padding:16px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}.game-service-admin-form label{display:grid;gap:6px;color:var(--muted);font-size:12px}.game-service-admin-form input,.game-service-admin-form select,.game-service-admin-form textarea{width:100%;color:#fff;background:rgba(2,6,23,.6);border:1px solid var(--line);border-radius:10px;padding:9px}.game-service-admin-form .check-line{display:flex;align-items:center;color:#d9e1f0}.game-service-admin-form .check-line input{width:auto}.game-service-admin-image{min-height:92px;border-radius:9px}.game-service-admin-description{grid-column:span 2}.game-service-admin-delete{margin-top:-9px;text-align:right}.game-service-admin-form-new{grid-template-columns:repeat(3,minmax(130px,1fr))}
@media(max-width:760px){.game-services-grid{grid-template-columns:1fr}.game-service-admin-form,.game-service-admin-form-new{grid-template-columns:1fr}.game-service-admin-image{min-height:150px}.game-service-admin-description{grid-column:auto}}
.game-platform-price-name{font-weight:700;font-size:13px;color:#dbe3f2;align-self:center}
.game-platform-price-name small{color:var(--muted);font-weight:400}
@media(max-width:640px){.game-platform-price-row{grid-template-columns:1fr 1fr}.game-platform-price-name{grid-column:1/-1}}
.game-shot-admin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}
.game-shot-admin-item{display:grid;gap:8px}
.game-shot-admin-img{height:100px;border:1px solid var(--line);border-radius:11px;background-size:cover;background-position:center;background-color:rgba(255,255,255,.04)}
.game-shot-admin-item .btn{min-height:32px;padding:4px 10px;font-size:12px}
@media(max-width:1100px){.game-layout{grid-template-columns:260px minmax(0,1fr)}.game-buy-panel{grid-column:1/-1;position:static}}
@media(max-width:760px){.game-layout{grid-template-columns:1fr}.game-cover{height:190px}.game-shots-strip{grid-template-columns:repeat(2,1fr)}.game-shots-grid{grid-template-columns:1fr}.game-shot-admin-grid{grid-template-columns:repeat(2,1fr)}}

/* v0.9.3 — оплата через SBP Business (pay.php) */
.pay-page{width:min(calc(100% - 32px),var(--max));margin:40px auto 90px}
.pay-card{max-width:880px;margin:22px auto 0;padding:34px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));backdrop-filter:blur(20px)}
.pay-state h1{margin:8px 0 10px;font-size:clamp(28px,4vw,42px);letter-spacing:-.03em}
.pay-sub{margin:0 0 26px;color:var(--muted);font-size:16px}
.pay-flex{display:grid;grid-template-columns:300px 1fr;gap:34px;align-items:start}
.pay-qr-box{display:grid;gap:14px;justify-items:center;padding:20px;border:1px solid var(--line);border-radius:20px;background:#fff}
.pay-qr{width:100%;max-width:250px;border-radius:12px}
.pay-waiting-note{display:flex;align-items:center;gap:10px;color:#475569;font-weight:800;font-size:14px}
.pay-spinner{width:16px;height:16px;border:2.5px solid rgba(139,92,246,.25);border-top-color:var(--p);border-radius:50%;animation:pay-spin .9s linear infinite}
@keyframes pay-spin{to{transform:rotate(360deg)}}
.pay-details{display:grid;gap:12px}
.pay-details-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.pay-cancel-form{margin:0}
.pay-summary{display:grid;gap:9px;margin:6px 0 12px}
.pay-summary>div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line)}
.pay-summary span{color:var(--muted)}
.pay-amount b{font-size:20px;color:#a7f3d0}
.pay-hint{margin:6px 0 0;color:var(--muted);font-size:13px}
.pay-hint a{color:#a5f3fc;font-weight:800}
.pay-state-success,.pay-state-error{text-align:center;display:grid;justify-items:center;gap:6px}
.pay-state-success .pay-summary,.pay-state-error .pay-summary{width:min(420px,100%);text-align:left}
.pay-state-icon{display:grid;place-items:center;width:74px;height:74px;margin-bottom:10px;border-radius:22px;background:rgba(52,211,153,.14);border:1px solid rgba(52,211,153,.3);color:#6ee7b7;font-size:38px;font-weight:900}
.pay-state-icon-error{background:rgba(251,113,133,.12);border-color:rgba(251,113,133,.3);color:#fda4af}
.pay-state-success p,.pay-state-error p{max-width:560px;color:var(--muted)}
.pay-actions{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap;justify-content:center}
.pay-activation-code b{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:18px;letter-spacing:.06em;color:#a5f3fc}
.topup-code-value{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.05em;color:#a5f3fc}
.topup-buy-btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
@media(max-width:760px){.pay-card{padding:22px}.pay-flex{grid-template-columns:1fr}.pay-qr-box{justify-self:center;width:min(320px,100%)}.pay-details-actions{grid-template-columns:1fr}}

/* v0.9.4 — страница пополнения платформы */
.topup-page{width:min(calc(100% - 32px),var(--max));margin:26px auto 90px}
.topup-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start}
.topup-main{display:grid;gap:16px;min-width:0}
.topup-hero{display:flex;align-items:center;gap:18px;padding:22px 24px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(135deg,rgba(139,92,246,.22),rgba(17,24,39,.95) 48%,rgba(34,211,238,.12));overflow:hidden;position:relative}
.topup-hero.accent-green{background:linear-gradient(135deg,rgba(52,211,153,.22),rgba(17,24,39,.95) 48%,rgba(34,211,238,.1))}
.topup-hero.accent-blue{background:linear-gradient(135deg,rgba(34,211,238,.22),rgba(17,24,39,.95) 48%,rgba(139,92,246,.12))}
.topup-hero.accent-red{background:linear-gradient(135deg,rgba(251,113,133,.22),rgba(17,24,39,.95) 48%,rgba(139,92,246,.1))}
.topup-hero-logo{display:grid;place-items:center;width:72px;height:72px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);flex-shrink:0}
.topup-hero-logo img{width:42px;height:42px;object-fit:contain}
.topup-hero-logo span{font-weight:900;font-size:22px}
.topup-hero-text h1{margin:0 0 6px;font-size:clamp(22px,3vw,32px);letter-spacing:-.03em;line-height:1.15}
.topup-hero-text p{margin:0;color:var(--muted);font-size:14px}
.topup-trust{display:flex;flex-wrap:wrap;gap:10px 18px;padding:12px 16px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}
.topup-trust-item{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700}
.topup-trust-item.muted{color:var(--muted);font-weight:600}
.topup-trust-check{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:rgba(52,211,153,.18);color:#6ee7b7;font-size:12px;font-weight:900}
.topup-modes{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.topup-mode{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);color:#dbe3f2;font-weight:800;font-size:14px;cursor:pointer;transition:.15s}
.topup-mode:hover{border-color:rgba(139,92,246,.45)}
.topup-mode.is-selected{background:#fff;border-color:#fff;color:#0b1020}
.topup-mode-badge{position:absolute;top:-9px;right:12px;padding:3px 8px;border-radius:999px;background:linear-gradient(135deg,var(--p),var(--c));color:#fff;font-size:10px;font-weight:900;letter-spacing:.02em}
.topup-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px;flex-wrap:wrap}
.topup-section-head h2{margin:0;font-size:15px;font-weight:800}
.topup-section-head .req{color:#fb7185}
.topup-link-btn{border:0;background:none;color:#a5f3fc;font-size:12px;font-weight:700;cursor:pointer;padding:0}
.topup-link-btn:hover{text-decoration:underline}
.topup-regions{display:flex;flex-wrap:wrap;gap:8px}
.topup-region{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.03);color:#d9deeb;font-size:13px;font-weight:700;cursor:pointer;transition:.15s}
.topup-region:hover{border-color:rgba(139,92,246,.5)}
.topup-region.is-selected{background:#fff;border-color:#fff;color:#0b1020}
.topup-region-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:16px;border-radius:3px;overflow:hidden;flex-shrink:0;box-shadow:0 0 0 1px rgba(255,255,255,.12)}
.topup-region-icon img{width:100%;height:100%;object-fit:cover;display:block}
.topup-field{display:grid;gap:10px}
.topup-input{display:flex;align-items:center;gap:10px;padding:4px 12px 4px 10px;border:1px solid var(--line);border-radius:14px;background:rgba(2,6,23,.55)}
.topup-input:focus-within{border-color:rgba(139,92,246,.8);box-shadow:0 0 0 4px rgba(139,92,246,.12)}
.topup-input-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.07);flex-shrink:0;font-size:11px;font-weight:900}
.topup-input-icon img{width:20px;height:20px;object-fit:contain}
.topup-input input{flex:1;min-width:0;border:0;background:transparent;color:#fff;outline:none;padding:12px 0;font-size:15px;font-weight:700}
.topup-amount-clear{border:0;background:rgba(255,255,255,.08);color:#fff;width:28px;height:28px;border-radius:8px;cursor:pointer;font-size:16px;line-height:1}
.topup-presets{display:flex;flex-wrap:wrap;gap:8px}
.topup-preset{padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.03);color:#cbd5e1;font-size:13px;font-weight:800;cursor:pointer;transition:.15s}
.topup-preset:hover{border-color:rgba(139,92,246,.5)}
.topup-preset.is-selected{background:rgba(139,92,246,.18);border-color:rgba(139,92,246,.7);color:#fff}
.topup-gift-note{margin:0;color:var(--muted);font-size:13px;line-height:1.55}
.topup-promo-strip{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid rgba(139,92,246,.35);border-radius:16px;background:linear-gradient(90deg,rgba(139,92,246,.16),rgba(34,211,238,.08))}
.topup-promo-zero{display:grid;place-items:center;min-width:54px;height:54px;border-radius:14px;background:rgba(255,255,255,.08);font-weight:900;font-size:18px;color:#a5f3fc}
.topup-promo-strip strong{display:block;font-size:14px}
.topup-side{position:sticky;top:100px;padding:18px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.035);display:grid;gap:12px}
.topup-option-label{font-weight:800;font-size:14px}
.topup-pay-list{display:grid;gap:8px}
.topup-pay{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.03);color:#cbd5e1;font-size:13px;font-weight:700;cursor:pointer;text-align:left;transition:.15s}
.topup-pay.is-selected,.topup-pay:hover{border-color:#fff;background:rgba(255,255,255,.08);color:#fff}
.topup-pay-logo{display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;border-radius:8px;background:linear-gradient(135deg,#1d4ed8,#22d3ee);color:#fff;font-size:11px;font-weight:900;letter-spacing:.04em}
.topup-promo-input{width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:rgba(2,6,23,.6);color:#fff;outline:none}
.topup-promo-input:focus{border-color:rgba(139,92,246,.8);box-shadow:0 0 0 4px rgba(139,92,246,.12)}
.topup-summary{padding:14px;border:1px solid rgba(34,211,238,.35);border-radius:14px;background:rgba(2,6,23,.45);display:grid;gap:10px}
.topup-summary-brand{font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:#a5f3fc}
.topup-summary-row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px}
.topup-summary-row span{color:var(--muted)}
.topup-summary-row b{font-size:16px}
.topup-summary-row [data-topup-credit]{color:#fde68a}
.topup-summary-commission b{color:#fda4af}
.topup-summary-commission[hidden]{display:none!important}
.pay-region-credit b{color:#fde68a;font-size:18px}
.pay-rate-note{margin:0;color:var(--muted);font-size:12px;line-height:1.4}
.topup-buy-btn{width:100%;min-height:50px;border-radius:13px;background:linear-gradient(135deg,var(--p),#6d5dfc 55%,var(--c));color:#fff;font-weight:900;font-size:15px;border:0;cursor:pointer}
.topup-buy-btn:hover{box-shadow:0 12px 32px rgba(139,92,246,.35)}
.topup-agree{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-size:11.5px;line-height:1.45;cursor:pointer}
.topup-agree input{margin-top:2px;flex-shrink:0}
.topup-legal{margin:0;text-align:center;color:var(--muted);font-size:11px}
.topup-legal a{color:#a5f3fc}
.topup-legal a:hover{text-decoration:underline}
.topup-dialog{border:0;padding:0;background:transparent;max-width:min(440px,calc(100vw - 32px))}
.topup-dialog::backdrop{background:rgba(2,6,23,.72);backdrop-filter:blur(6px)}
.topup-dialog-card{position:relative;padding:22px 22px 20px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(17,24,39,.98))}
.topup-dialog-card h3{margin:0 0 10px;font-size:18px}
.topup-dialog-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.topup-dialog-close{position:absolute;top:10px;right:12px;border:0;background:rgba(255,255,255,.08);color:#fff;width:30px;height:30px;border-radius:10px;cursor:pointer;font-size:18px}
@media(max-width:980px){.topup-layout{grid-template-columns:1fr}.topup-side{position:static}}
@media(max-width:560px){.topup-modes{grid-template-columns:1fr}.topup-hero{padding:18px}.topup-hero-logo{width:58px;height:58px}}

/* catalog navigation & sections */
.page-hero:has(+ .section.catalog){min-height:0;margin-bottom:18px;justify-content:flex-start}
.page-hero:has(+ .section.catalog) h1{margin-bottom:10px}
.section.catalog{margin-top:28px}
.catalog-hero-banner ~ .section.catalog{margin-top:clamp(40px,6vw,56px)}
.section.catalog{display:flex;flex-direction:column;align-items:center;gap:28px;width:100%;min-width:0;max-width:100%}
.catalog-main{width:100%;min-width:0;max-width:100%}
.catalog-panel{min-width:0;max-width:100%}
.catalog aside.catalog-nav{position:sticky;top:110px;z-index:5;display:block;width:fit-content;max-width:100%;margin:0 auto;padding:8px;border:1px solid rgba(141,173,255,.24);border-radius:16px;background:linear-gradient(180deg,rgba(67,82,130,.6),rgba(31,43,75,.78));backdrop-filter:blur(18px);box-shadow:0 18px 50px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.16),inset 0 -1px 0 rgba(2,6,23,.28);gap:0}
.catalog-nav-list{display:flex;align-items:stretch;justify-content:center;flex-wrap:nowrap;gap:6px;max-width:100%;overflow-x:auto;overflow-y:hidden;-ms-overflow-style:none;scrollbar-width:none}
.catalog-nav-list::-webkit-scrollbar{display:none}
.catalog aside.catalog-nav .catalog-nav-item{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:76px;min-height:0;padding:10px 12px 8px;border-radius:12px;color:#d7dff2;font-size:9px;font-weight:800;line-height:1.15;text-transform:uppercase;letter-spacing:.04em;white-space:normal;text-align:center;transition:border-color .18s,background .18s,color .18s,box-shadow .18s,transform .18s;border:1px solid transparent;flex:0 0 auto}
.catalog aside.catalog-nav .catalog-nav-item:hover{color:#fff;background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12);transform:translateY(-1px)}
.catalog aside.catalog-nav .catalog-nav-item.is-active{color:#fff;background:linear-gradient(135deg,rgba(34,211,238,.24),rgba(51,105,167,.34));border-color:rgba(103,232,249,.44);box-shadow:0 0 0 1px rgba(34,211,238,.16),0 0 24px rgba(34,211,238,.34),inset 0 1px 0 rgba(255,255,255,.18)}
.catalog aside.catalog-nav .catalog-nav-item.is-active::before{content:"";position:absolute;inset:-2px;border-radius:14px;background:linear-gradient(90deg,rgba(34,211,238,.42),rgba(139,92,246,.22));filter:blur(10px);opacity:.78;z-index:-1}
.catalog-nav-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:rgba(116,140,190,.24);color:#c8d3ea;flex-shrink:0;transition:.18s}
.catalog-nav-icon svg{width:22px;height:22px}
.catalog aside.catalog-nav .catalog-nav-item.is-active .catalog-nav-icon{background:linear-gradient(135deg,#44e8ff,#7c6cff);color:#fff;box-shadow:0 0 18px rgba(34,211,238,.52)}
.catalog-nav-label{line-height:1.15;max-width:72px}
.catalog-section{scroll-margin-top:120px;min-width:0;max-width:100%}
.catalog-section-head{margin-bottom:24px}
.catalog-section-head h2{margin:0;font-size:clamp(28px,3vw,36px)}
.catalog-section-head p{margin:6px 0 0;color:var(--muted);max-width:560px}
.catalog-scroll-strip-inner,
.catalog-topup-strip-inner{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:hidden;
    padding:10px 0 18px;
}
[data-catalog-scroll-track]{
    display:flex;
    flex-wrap:nowrap;
    align-items:stretch;
    gap:16px;
    width:100%;
    max-width:100%;
    min-width:0;
    overflow-x:auto;
    overflow-y:visible;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:2px;
    padding:8px 2px 12px;
    -ms-overflow-style:none;
    scrollbar-width:none;
    touch-action:pan-x;
    cursor:grab;
    user-select:none;
}
[data-catalog-scroll-track].catalog-games-grid,
[data-catalog-scroll-track].catalog-promos-grid{
    gap:14px;
}
[data-catalog-scroll-track]::-webkit-scrollbar{display:none}
[data-catalog-scroll-track].is-dragging{cursor:grabbing}
[data-catalog-scroll-track] > .catalog-topup-card{
    flex:0 0 260px;
    width:260px;
    max-width:78vw;
    scroll-snap-align:start;
}
[data-catalog-scroll-track] > .game-card{
    flex:0 0 270px;
    width:270px;
    max-width:72vw;
    scroll-snap-align:start;
}
[data-catalog-scroll-track] > .catalog-promo-card,
[data-catalog-scroll-track] > .banner-card.catalog-promo-card{
    flex:0 0 280px;
    width:280px;
    max-width:80vw;
    scroll-snap-align:start;
}

/* ===== Catalog topup cards — neon style ===== */
.catalog-topup-card{
    --tc:#22d3ee;
    --tc2:#8b5cf6;
    display:flex;
    flex-direction:column;
    min-height:260px;
    padding:22px;
    border-radius:20px;
    border:1.5px solid color-mix(in srgb,var(--tc) 38%,transparent);
    background:linear-gradient(160deg,color-mix(in srgb,var(--tc) 8%,rgba(5,11,26,.85)) 0%,rgba(5,11,26,.92) 100%);
    backdrop-filter:blur(14px);
    box-shadow:
        0 0 0 1px color-mix(in srgb,var(--tc) 7%,transparent),
        0 22px 58px rgba(0,0,0,.42),
        inset 0 1px 0 rgba(255,255,255,.07);
    transition:border-color .25s,box-shadow .25s,transform .25s cubic-bezier(.22,1,.36,1);
    position:relative;
    overflow:hidden;
    isolation:isolate;
}
.catalog-topup-card::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:linear-gradient(155deg,color-mix(in srgb,var(--tc) 9%,transparent) 0%,transparent 52%);
    pointer-events:none;
    z-index:0;
}
.catalog-topup-card:hover{
    border-color:color-mix(in srgb,var(--tc) 70%,transparent);
    box-shadow:
        0 0 30px color-mix(in srgb,var(--tc) 20%,transparent),
        0 0 68px color-mix(in srgb,var(--tc) 9%,transparent),
        0 28px 70px rgba(0,0,0,.48),
        inset 0 1px 0 rgba(255,255,255,.1);
    transform:translateY(-5px);
}
.catalog-topup-card.purple{--tc:#8b5cf6;--tc2:#22d3ee}
.catalog-topup-card.indigo{--tc:#6366f1;--tc2:#a78bfa}
.catalog-topup-card.blue{--tc:#3b82f6;--tc2:#22d3ee}
.catalog-topup-card.cyan{--tc:#06b6d4;--tc2:#67e8f9}
.catalog-topup-card.teal{--tc:#14b8a6;--tc2:#34d399}
.catalog-topup-card.green{--tc:#22c55e;--tc2:#4ade80}
.catalog-topup-card.lime{--tc:#84cc16;--tc2:#a3e635}
.catalog-topup-card.yellow{--tc:#eab308;--tc2:#fbbf24}
.catalog-topup-card.orange{--tc:#f97316;--tc2:#fb923c}
.catalog-topup-card.red{--tc:#ef4444;--tc2:#fb7185}
.catalog-topup-card.rose{--tc:#f43f5e;--tc2:#fda4af}
.catalog-topup-card.pink{--tc:#ec4899;--tc2:#f472b6}
.catalog-topup-card.fuchsia{--tc:#d946ef;--tc2:#e879f9}
.platform.purple,.catalog-product-card.purple{--tc:#8b5cf6;--tc2:#22d3ee}
.platform.indigo,.catalog-product-card.indigo{--tc:#6366f1;--tc2:#a78bfa}
.platform.blue,.catalog-product-card.blue{--tc:#3b82f6;--tc2:#22d3ee}
.platform.cyan,.catalog-product-card.cyan{--tc:#06b6d4;--tc2:#67e8f9}
.platform.teal,.catalog-product-card.teal{--tc:#14b8a6;--tc2:#34d399}
.platform.green,.catalog-product-card.green{--tc:#22c55e;--tc2:#4ade80}
.platform.lime,.catalog-product-card.lime{--tc:#84cc16;--tc2:#a3e635}
.platform.yellow,.catalog-product-card.yellow{--tc:#eab308;--tc2:#fbbf24}
.platform.orange,.catalog-product-card.orange{--tc:#f97316;--tc2:#fb923c}
.platform.red,.catalog-product-card.red{--tc:#ef4444;--tc2:#fb7185}
.platform.rose,.catalog-product-card.rose{--tc:#f43f5e;--tc2:#fda4af}
.platform.pink,.catalog-product-card.pink{--tc:#ec4899;--tc2:#f472b6}
.platform.fuchsia,.catalog-product-card.fuchsia{--tc:#d946ef;--tc2:#e879f9}
.platform.purple,
.platform.indigo,
.platform.blue,
.platform.cyan,
.platform.teal,
.platform.green,
.platform.lime,
.platform.yellow,
.platform.orange,
.platform.red,
.platform.rose,
.platform.pink,
.platform.fuchsia{
    background:linear-gradient(180deg,color-mix(in srgb,var(--tc) 13%,transparent),rgba(255,255,255,.025));
}
.accent-palette-field{
    display:grid;
    gap:10px;
    margin:0;
    padding:0;
    border:0;
    min-width:0;
}
.accent-palette-field legend{
    color:var(--muted);
    font-size:13px;
    margin-bottom:2px;
    padding:0;
}
.accent-palette{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(92px,1fr));
    gap:10px;
}
.accent-palette-option{
    position:relative;
    display:grid;
    gap:8px;
    justify-items:center;
    padding:10px 8px 9px;
    border:1px solid var(--line);
    border-radius:14px;
    background:rgba(255,255,255,.03);
    cursor:pointer;
    transition:border-color .18s,box-shadow .18s,transform .18s,background .18s;
}
.accent-palette-option:hover{
    border-color:rgba(255,255,255,.18);
    background:rgba(255,255,255,.05);
    transform:translateY(-1px);
}
.accent-palette-option.is-selected,
.accent-palette-option:has(input:checked){
    border-color:color-mix(in srgb,var(--accent-color) 70%,transparent);
    background:color-mix(in srgb,var(--accent-color) 10%,rgba(255,255,255,.03));
    box-shadow:0 0 0 1px color-mix(in srgb,var(--accent-color) 24%,transparent),0 10px 24px color-mix(in srgb,var(--accent-color) 18%,transparent);
}
.accent-palette-option input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}
.accent-palette-swatch{
    width:34px;
    height:34px;
    border-radius:999px;
    background:linear-gradient(135deg,var(--accent-color),var(--accent-color-2));
    box-shadow:0 0 18px color-mix(in srgb,var(--accent-color) 34%,transparent),inset 0 1px 0 rgba(255,255,255,.24);
}
.accent-palette-label{
    color:#dbe4f4;
    font-size:11px;
    font-weight:700;
    line-height:1.2;
    text-align:center;
}
@media(max-width:640px){
    .accent-palette{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.catalog-topup-card > img{
    position:relative;
    z-index:1;
    display:block;
    width:46px;
    height:46px;
    padding:9px;
    border-radius:13px;
    background:color-mix(in srgb,var(--tc) 14%,rgba(5,11,26,.7));
    border:1px solid color-mix(in srgb,var(--tc) 28%,transparent);
    box-shadow:0 0 22px color-mix(in srgb,var(--tc) 22%,transparent),inset 0 1px 0 rgba(255,255,255,.12);
    object-fit:contain;
    box-sizing:border-box;
    transition:box-shadow .22s,background .22s;
}
.catalog-topup-card:hover > img{
    background:color-mix(in srgb,var(--tc) 22%,rgba(5,11,26,.7));
    box-shadow:0 0 32px color-mix(in srgb,var(--tc) 36%,transparent),inset 0 1px 0 rgba(255,255,255,.18);
}
.catalog-topup-card h3{
    position:relative;
    z-index:1;
    margin:18px 0 6px;
    font-size:22px;
    font-weight:900;
    letter-spacing:-.025em;
    color:#fff;
    line-height:1.15;
}
.catalog-topup-card p{
    position:relative;
    z-index:1;
    color:var(--muted);
    font-size:13px;
    line-height:1.5;
    margin:0;
}
.catalog-topup-card .platform-price{
    position:relative;
    z-index:1;
    display:block;
    margin:auto 0 12px;
    padding-top:12px;
    font-size:16px;
    font-weight:900;
    color:color-mix(in srgb,var(--tc) 90%,#fff);
    text-shadow:0 0 18px color-mix(in srgb,var(--tc) 45%,transparent);
}
.catalog-topup-btn{
    position:relative;
    z-index:1;
    margin-top:auto;
    width:fit-content;
    min-height:36px;
    padding:6px 18px;
    font-size:13px;
    font-weight:800;
    border-radius:11px;
    background:linear-gradient(135deg,var(--tc),var(--tc2));
    box-shadow:0 8px 22px color-mix(in srgb,var(--tc2) 32%,transparent),inset 0 1px 0 rgba(255,255,255,.22);
    border:none;
    color:#fff;
    transition:box-shadow .22s,transform .18s;
}
.catalog-topup-card:hover .catalog-topup-btn{
    box-shadow:0 12px 32px color-mix(in srgb,var(--tc2) 46%,transparent),inset 0 1px 0 rgba(255,255,255,.28);
    transform:translateY(-1px);
}
@media(prefers-reduced-motion:reduce){
    .catalog-topup-card{transition:none}
    .catalog-topup-card:hover{transform:none}
    .catalog-topup-btn{transition:none}
}
.catalog-product-card h3{margin:10px 0 6px;font-size:20px}
.catalog-product-platform{display:block;margin-top:4px;color:#9fdff0;font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}
.catalog-games-grid:not([data-catalog-scroll-track]){display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.catalog-promos-mixed{align-items:stretch}
.catalog-promos-mixed > .game-card{min-height:0}
.catalog-promos-grid:not([data-catalog-scroll-track]){display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.catalog-topup-grid.catalog-products-grid:not([data-catalog-scroll-track]){display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.catalog-promo-card{min-height:180px}
.group-head h3{margin:0;font-size:24px}
@media(max-width:980px){
.catalog aside.catalog-nav{position:static;width:min(100%,720px);margin:0 auto 8px}
.catalog aside.catalog-nav .catalog-nav-item{padding:9px 10px 7px;transform:none!important}
.catalog aside.catalog-nav .catalog-nav-item:hover{transform:none!important}
.catalog-nav-label{font-size:9px}
.catalog-nav-icon{width:40px;height:40px}
.catalog-nav-icon svg{width:21px;height:21px}
}
@media(max-width:640px){
.catalog aside.catalog-nav{width:100%;padding:6px;border-radius:15px}
.catalog-nav-list{gap:4px;justify-content:space-between}
.catalog aside.catalog-nav .catalog-nav-item{gap:5px;min-width:0;flex:1 1 0;padding:8px 6px 6px;font-size:8px}
.catalog-nav-icon{width:36px;height:36px;border-radius:10px}
.catalog-nav-icon svg{width:19px;height:19px}
.catalog-nav-label{max-width:100%}
.catalog-games-grid:not([data-catalog-scroll-track]),
.catalog-topup-grid.catalog-products-grid:not([data-catalog-scroll-track]){grid-template-columns:1fr}
.catalog-promos-grid:not([data-catalog-scroll-track]){grid-template-columns:1fr}
[data-catalog-scroll-track] > .catalog-topup-card{flex-basis:min(260px,78vw);width:min(260px,78vw)}
[data-catalog-scroll-track] > .game-card{flex-basis:min(270px,72vw);width:min(270px,72vw)}
[data-catalog-scroll-track] > .catalog-promo-card,
[data-catalog-scroll-track] > .banner-card.catalog-promo-card{flex-basis:min(280px,80vw);width:min(280px,80vw)}
}

/* v0.9.6 — страница поддержки */
.support-hero{margin-bottom:0}
.support-hero p{max-width:680px}
.support-page{width:min(calc(100% - 32px),760px);margin:32px auto 0}
.support-guest{display:grid;place-items:center}
.support-guest-card{max-width:520px;padding:36px 32px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));text-align:center}
.support-guest-icon{width:64px;height:64px;margin:0 auto 16px;display:grid;place-items:center;border-radius:18px;background:rgba(139,92,246,.15);font-size:28px}
.support-guest-card h2{margin:0 0 10px;font-size:26px}
.support-guest-card p{margin:0 0 22px;color:var(--muted);font-size:15px;line-height:1.55}
.support-guest-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.support-chat{display:grid;border:1px solid rgba(139,92,246,.22);border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));overflow:visible;box-shadow:0 24px 80px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.06)}
.support-chat-head{border-radius:24px 24px 0 0}
.support-chat-compose{border-radius:0 0 24px 24px}
.support-chat-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid var(--line);background:rgba(2,6,23,.35)}
.support-chat-brand{display:flex;align-items:center;gap:12px;min-width:0}
.support-chat-avatar{display:block;width:44px;height:44px;border-radius:14px;flex-shrink:0;overflow:hidden;line-height:0}
.support-chat-avatar img{display:block;width:100%;height:100%;object-fit:cover}
.support-chat-brand b{display:block;font-size:15px}
.support-chat-brand>div span{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.support-chat-status{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:rgba(52,211,153,.1);border:1px solid rgba(52,211,153,.22);color:#a7f3d0;font-size:12px;font-weight:800;white-space:nowrap}
.support-chat-dot{width:8px;height:8px;border-radius:50%;background:#34d399;box-shadow:0 0 10px rgba(52,211,153,.8);animation:support-pulse 2s ease-in-out infinite}
@keyframes support-pulse{0%,100%{opacity:1}50%{opacity:.45}}
.support-chat-messages{min-height:320px;max-height:420px;overflow-y:auto;overflow-x:hidden;padding:20px;display:grid;gap:12px;align-content:start;scroll-behavior:smooth;-ms-overflow-style:none;scrollbar-width:none}
.support-chat-messages::-webkit-scrollbar{display:none}
.support-msg{max-width:82%;padding:12px 14px;border-radius:16px;border:1px solid var(--line)}
.support-msg-admin{background:rgba(255,255,255,.05);justify-self:start;border-top-left-radius:6px}
.support-msg-user{justify-self:end;background:linear-gradient(135deg,rgba(139,92,246,.22),rgba(34,211,238,.1));border-color:rgba(139,92,246,.28);border-top-right-radius:6px}
.support-msg-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}
.support-msg-meta b{font-size:12px}
.support-msg-meta small{color:var(--muted);font-size:11px;white-space:nowrap}
.support-msg p{margin:0;font-size:14px;line-height:1.55;overflow-wrap:anywhere}
.support-quick{padding:14px 16px 0;border-top:1px solid var(--line);background:rgba(2,6,23,.2)}
.support-quick-label{display:block;margin-bottom:10px;color:var(--muted);font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.support-quick-picker{position:relative;z-index:8;margin-bottom:14px}
.support-quick-picker.is-open{z-index:20}
.support-quick-trigger{display:flex;align-items:center;gap:10px;width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(2,6,23,.72));color:#fff;font-size:13px;font-weight:700;text-align:left;cursor:pointer;transition:.15s}
.support-quick-trigger:hover{border-color:rgba(139,92,246,.45);background:linear-gradient(180deg,rgba(139,92,246,.12),rgba(2,6,23,.78))}
.support-quick-trigger:focus-visible,.support-quick-picker.is-open .support-quick-trigger{border-color:rgba(139,92,246,.75);box-shadow:0 0 0 4px rgba(139,92,246,.12);outline:none}
.support-quick-trigger-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,rgba(139,92,246,.22),rgba(34,211,238,.12));color:#c4b5fd;flex-shrink:0}
.support-quick-trigger-text{flex:1;min-width:0;color:#dbe3f2;line-height:1.35}
.support-quick-trigger-chevron{display:grid;place-items:center;color:var(--muted);transition:transform .15s}
.support-quick-picker.is-open .support-quick-trigger-chevron{transform:rotate(180deg);color:#fff}
.support-quick-menu{position:absolute;left:0;right:0;bottom:calc(100% + 8px);top:auto;z-index:12;margin:0;padding:8px 8px 12px;list-style:none;border:1px solid rgba(139,92,246,.28);border-radius:16px;background:linear-gradient(180deg,rgba(17,24,39,.98),rgba(7,11,22,.98));box-shadow:0 18px 48px rgba(0,0,0,.45);max-height:min(420px,58vh);overflow-y:auto;overscroll-behavior:contain;scroll-padding-bottom:8px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}
.support-quick-menu::-webkit-scrollbar{width:5px}
.support-quick-menu::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px}
.support-quick-menu li:last-child .support-quick-option{padding-bottom:12px}
.support-quick-option{display:block;width:100%;padding:11px 12px;border:0;border-radius:11px;background:transparent;color:#dbe3f2;font-size:13px;font-weight:600;line-height:1.4;text-align:left;cursor:pointer;transition:.15s}
.support-quick-option:hover,.support-quick-option:focus-visible{background:rgba(139,92,246,.14);color:#fff;outline:none}
.support-quick-option:active{background:rgba(34,211,238,.12)}
.support-chat-compose{padding:14px 16px 16px;border-top:1px solid var(--line);background:rgba(2,6,23,.45)}
.support-compose-box{display:flex;align-items:center;gap:10px;padding:6px 8px 6px 10px;border:1px solid var(--line);border-radius:16px;background:rgba(2,6,23,.72);transition:.15s}
.support-compose-box:focus-within{border-color:rgba(139,92,246,.75);box-shadow:0 0 0 4px rgba(139,92,246,.12)}
.support-compose-box textarea{flex:1;min-width:0;min-height:24px;max-height:140px;resize:none;border:0;background:transparent;color:#fff;outline:none;padding:6px 0;line-height:1.45;font-size:14px;overflow-y:auto}
.support-send-btn{display:grid;place-items:center;width:42px;height:42px;border:0;border-radius:12px;background:linear-gradient(135deg,var(--p),var(--c));color:#fff;cursor:pointer;flex-shrink:0;transition:.15s}
.support-send-btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(139,92,246,.35)}
.chat-form{display:grid;grid-template-columns:1fr;gap:10px;padding:16px;border-top:1px solid var(--line)}
.chat-compose-box{display:flex;align-items:center;gap:10px;padding:6px 8px 6px 10px;border:1px solid var(--line);border-radius:16px;background:rgba(2,6,23,.72);transition:.15s}
.chat-compose-box:focus-within{border-color:rgba(139,92,246,.75);box-shadow:0 0 0 4px rgba(139,92,246,.12)}
.chat-compose-box textarea,.chat-form textarea{flex:1;min-width:0;min-height:24px;max-height:120px;resize:none;border:0;background:transparent;color:#fff;outline:none;padding:8px 0;line-height:1.45;font-size:14px;overflow-y:auto}
.chat-compose-box textarea:focus{outline:none;border:0;box-shadow:none}
.chat-attach-btn{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.04);color:var(--muted);cursor:pointer;flex-shrink:0;transition:.15s}
.chat-attach-btn:hover{color:#fff;border-color:rgba(139,92,246,.55);background:rgba(139,92,246,.12)}
.chat-send-btn{min-height:42px;padding:10px 16px;white-space:nowrap;flex-shrink:0}
.chat-attach-preview{display:flex;align-items:center;gap:10px;margin-top:10px;padding:10px 12px;border:1px dashed rgba(139,92,246,.35);border-radius:12px;background:rgba(139,92,246,.08);color:#dbe3f2;font-size:13px}
.chat-attach-preview[hidden]{display:none!important}
.chat-attach-preview-thumb{width:40px;height:40px;border-radius:10px;object-fit:cover;border:1px solid var(--line);flex-shrink:0}
.chat-attach-preview-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-attach-preview-clear{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:18px;line-height:1;padding:0 4px;flex-shrink:0}
.chat-attach-preview-clear:hover{color:#fff}
.chat-attachment{display:block;margin-top:8px}
.chat-attachment-image img{display:block;max-width:min(100%,280px);max-height:220px;border-radius:12px;border:1px solid var(--line);object-fit:cover}
.chat-attachment-file{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.04);font-size:13px;font-weight:700;transition:.15s}
.chat-attachment-file:hover{border-color:rgba(139,92,246,.55);background:rgba(139,92,246,.12)}
.support-msg .chat-attachment-image img{max-width:min(100%,240px)}
.support-faq{margin-top:72px}
.support-faq-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px;flex-wrap:wrap}
.support-faq-head h2{margin:8px 0 0}
.support-faq-head p{margin:0;max-width:320px;text-align:right}
.support-faq-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.support-faq-group{padding:20px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.03)}
.support-faq-group h3{margin:0 0 14px;font-size:18px}
.support-faq-list{display:grid;gap:8px}
.support-faq-item{border:1px solid var(--line);border-radius:14px;background:rgba(2,6,23,.35);overflow:hidden}
.support-faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;font-size:14px;font-weight:700;cursor:pointer;list-style:none}
.support-faq-item summary::-webkit-details-marker{display:none}
.support-faq-item summary::after{content:"+";color:var(--muted);font-size:18px;font-weight:400;flex-shrink:0}
.support-faq-item[open] summary::after{content:"−"}
.support-faq-item[open] summary{border-bottom:1px solid var(--line);background:rgba(139,92,246,.08)}
.support-faq-item p{margin:0;padding:14px 16px 16px;color:var(--muted);font-size:13px;line-height:1.6}
@media(max-width:760px){.support-page{width:calc(100% - 24px)}.support-faq-grid{grid-template-columns:1fr}.support-faq-head p{text-align:left;max-width:none}.support-chat-messages{max-height:360px;padding:16px 14px}.support-msg{max-width:78%;padding:10px 12px}.support-quick-trigger{padding:10px 12px;font-size:12px}.support-quick-trigger-icon{width:30px;height:30px}.support-quick-menu{max-height:min(400px,56vh)}}

/* v0.9.7 — модальное окно «Моментальная покупка» */
.instant-purchase-dialog{border:0;padding:0;background:transparent;width:min(720px,calc(100vw - 28px));max-height:calc(100vh - 32px)}
.instant-purchase-dialog::backdrop{background:rgba(2,6,23,.78);backdrop-filter:blur(8px)}
.instant-purchase-card{display:grid;grid-template-rows:auto auto 1fr;max-height:calc(100vh - 32px);overflow:hidden;border:1px solid var(--line);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(7,11,22,.98));box-shadow:0 28px 80px rgba(0,0,0,.55)}
.instant-purchase-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:22px 22px 14px;border-bottom:1px solid var(--line)}
.instant-purchase-head h2{margin:6px 0 0;font-size:clamp(22px,3vw,28px);color:#fff}
.instant-purchase-close{border:0;background:rgba(255,255,255,.08);color:#fff;width:34px;height:34px;border-radius:10px;cursor:pointer;font-size:20px;flex-shrink:0}
.instant-purchase-tabs{display:flex;gap:8px;padding:12px 22px 0;overflow-x:auto}
.instant-purchase-tab{padding:10px 16px;border:1px solid transparent;border-radius:999px;background:transparent;color:var(--muted);font-size:13px;font-weight:800;cursor:pointer;white-space:nowrap;transition:.15s}
.instant-purchase-tab.is-active,.instant-purchase-tab:hover{color:#fff;border-color:rgba(139,92,246,.45);background:rgba(139,92,246,.12)}
.instant-purchase-body{overflow:auto;padding:18px 22px 22px}
.instant-purchase-panel{display:none}
.instant-purchase-panel.is-active{display:block}
.instant-section-label{margin:0 0 8px;color:var(--muted);font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.instant-section-label:not(:first-child){margin-top:16px}
.instant-platform-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px}
.instant-platform{display:grid;gap:6px;justify-items:center;padding:12px 8px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);color:#fff;cursor:pointer;transition:.15s}
.instant-platform img,.instant-platform>span{width:36px;height:36px;border-radius:10px;object-fit:contain}
.instant-platform>span{display:grid;place-items:center;background:rgba(255,255,255,.08);font-size:12px;font-weight:800}
.instant-platform small{font-size:11px;font-weight:700;color:var(--muted);text-align:center;line-height:1.2}
.instant-platform.is-selected{border-color:rgba(34,211,238,.65);box-shadow:0 0 0 1px rgba(34,211,238,.25) inset;background:rgba(34,211,238,.08)}

/* Custom platform picker — copied from mini-app */
.instant-platform-picker{position:relative;margin:0;z-index:2}
.instant-platform-trigger{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    width:100%;padding:13px 14px;
    border:1px solid var(--line);border-radius:14px;
    background:rgba(2,6,23,.55);color:#fff;
    font:inherit;font-size:15px;font-weight:700;
    cursor:pointer;transition:border-color .15s,box-shadow .15s,background .15s;
    -webkit-tap-highlight-color:transparent;
}
.instant-platform-trigger:hover{border-color:rgba(139,92,246,.45)}
.instant-platform-picker.is-open .instant-platform-trigger{
    border-color:rgba(139,92,246,.65);
    box-shadow:0 0 0 4px rgba(139,92,246,.12);
}
.instant-platform-current{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.instant-platform-current-icon{
    width:28px;height:28px;border-radius:8px;object-fit:contain;flex-shrink:0;
    background:rgba(255,255,255,.07);
}
.instant-platform-current-icon--empty{
    display:grid;place-items:center;
    background:rgba(255,255,255,.08);
    font-size:11px;font-weight:800;letter-spacing:.02em;color:#e2e8f0;
}
.instant-platform-current-name{
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;
}
.instant-platform-chevron{
    flex-shrink:0;transition:transform .2s ease;color:var(--muted);
}
.instant-platform-picker.is-open .instant-platform-chevron{transform:rotate(180deg);color:#fff}

.instant-platform-dropdown{
    display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:100;
    padding:6px;
    border:1px solid rgba(132,166,225,.30);border-radius:16px;
    background:
        linear-gradient(180deg,rgba(255,255,255,.10),transparent 38%),
        linear-gradient(145deg,rgba(18,28,52,.96),rgba(8,12,26,.98));
    backdrop-filter:blur(40px) saturate(200%);
    -webkit-backdrop-filter:blur(40px) saturate(200%);
    box-shadow:
        0 24px 52px rgba(0,0,0,.72),
        0 0 0 1px rgba(139,92,246,.14),
        inset 0 1px 0 rgba(255,255,255,.14);
    max-height:230px;overflow-y:auto;overscroll-behavior:contain;
    scrollbar-width:none;isolation:isolate;
}
.instant-platform-dropdown::-webkit-scrollbar{display:none}
.instant-platform-picker.is-open .instant-platform-dropdown{
    display:block;
    animation:instant-picker-in .2s cubic-bezier(.22,.68,0,1.2) both;
}
@keyframes instant-picker-in{
    from{opacity:0;transform:translateY(-6px) scale(.98)}
    to{opacity:1;transform:translateY(0) scale(1)}
}

.instant-picker-option{
    display:flex;align-items:center;gap:10px;width:100%;
    padding:10px 12px;border:0;border-radius:10px;
    background:transparent;color:rgba(255,255,255,.6);
    font:inherit;font-size:15px;font-weight:700;text-align:left;
    cursor:pointer;transition:background .14s,color .14s;
    -webkit-tap-highlight-color:transparent;
}
.instant-picker-option:hover,.instant-picker-option:focus{
    background:rgba(255,255,255,.07);color:#fff;outline:none;
}
.instant-picker-option.is-active{
    background:linear-gradient(135deg,rgba(139,92,246,.28),rgba(34,211,238,.14));
    color:#fff;
}
.instant-picker-icon{
    width:26px;height:26px;border-radius:7px;object-fit:contain;flex-shrink:0;
    background:rgba(255,255,255,.07);
}
.instant-picker-icon--empty{
    display:grid;place-items:center;
    background:rgba(255,255,255,.08);
    font-size:10px;font-weight:800;letter-spacing:.02em;color:#e2e8f0;
}
.instant-picker-name{
    flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.instant-picker-check{
    flex-shrink:0;opacity:0;color:#67e8f9;transition:opacity .14s;
}
.instant-picker-option.is-active .instant-picker-check{opacity:1}
.instant-input{display:block}
.instant-input input,.instant-amount-field input{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(2,6,23,.55);color:#fff;font-size:15px;font-weight:700;outline:none}
.instant-input input:focus,.instant-amount-field input:focus{border-color:rgba(139,92,246,.65);box-shadow:0 0 0 4px rgba(139,92,246,.12)}
.instant-presets,.instant-regions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.instant-preset,.instant-region{padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.03);color:#cbd5e1;font-size:12px;font-weight:800;cursor:pointer;transition:.15s}
.instant-preset.is-selected,.instant-region.is-selected{border-color:#fff;background:rgba(255,255,255,.1);color:#fff}
.instant-game-platforms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}
.instant-game-platform{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);color:#fff;cursor:pointer;text-align:left;transition:.18s}
.instant-game-platform:hover{border-color:rgba(139,92,246,.45);background:rgba(255,255,255,.05)}
.instant-game-platform.is-selected{border-color:rgba(139,92,246,.75);background:linear-gradient(135deg,rgba(139,92,246,.16),rgba(34,211,238,.08));box-shadow:0 0 0 1px rgba(139,92,246,.22) inset}
.instant-game-platform-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:rgba(255,255,255,.08);overflow:hidden;flex-shrink:0}
.instant-game-platform-icon img{width:22px;height:22px;object-fit:contain}
.instant-game-platform-icon>span{font-size:11px;font-weight:900;letter-spacing:.02em;color:#e2e8f0}
.instant-game-platform.accent-purple .instant-game-platform-icon{background:rgba(139,92,246,.18)}
.instant-game-platform.accent-green .instant-game-platform-icon{background:rgba(34,197,94,.16)}
.instant-game-platform.accent-blue .instant-game-platform-icon{background:rgba(59,130,246,.18)}
.instant-game-platform.accent-red .instant-game-platform-icon{background:rgba(239,68,68,.16)}
.instant-game-platform-body{display:grid;gap:1px;flex:1;min-width:0}
.instant-game-platform-body b{font-size:13px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.instant-game-platform-body small{color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.03em;text-transform:uppercase}
.instant-game-platform-price{font-size:12px;font-weight:900;color:#a5f3fc;white-space:nowrap;flex-shrink:0}
.instant-delivery-empty{margin:10px 0 0;padding:14px;border:1px dashed var(--line);border-radius:12px;color:var(--muted);font-size:13px;line-height:1.45;text-align:center}
.instant-product-list,.instant-game-list{display:grid;gap:8px;max-height:280px;overflow:auto;margin-bottom:14px;padding-right:4px}
.instant-product,.instant-game{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;width:100%;padding:12px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);color:#fff;text-align:left;cursor:pointer;transition:.15s}
.instant-product.is-selected,.instant-game.is-selected{border-color:rgba(139,92,246,.55);background:rgba(139,92,246,.1)}
.instant-product-icon,.instant-game-cover{width:44px;height:44px;border-radius:10px;overflow:hidden;background:rgba(255,255,255,.08);display:grid;place-items:center;flex-shrink:0}
.instant-product-icon img{width:100%;height:100%;object-fit:contain}
.instant-game-cover{background-size:cover;background-position:center}
.instant-product-body,.instant-game-body{display:grid;gap:2px;min-width:0}
.instant-product-body small,.instant-game-body span{color:var(--muted);font-size:11px;font-weight:700}
.instant-product-body b,.instant-game-body b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.instant-product-price-wrap,.instant-price-wrap,.instant-game-price-wrap{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.instant-product-price-old,.instant-price-old{color:var(--muted);font-size:11px;text-decoration:line-through;white-space:nowrap}
.instant-game-price-wrap{justify-content:flex-start}
.instant-game-body .instant-game-price-wrap span:not(.game-card-badge){color:var(--muted);font-size:11px;font-weight:700}
.instant-product-price{margin-left:0;font-size:14px;font-weight:800;color:#c4b5fd;white-space:nowrap}
.instant-actions{display:grid;gap:10px;margin-top:18px}
.instant-note{margin:0;color:var(--muted);font-size:13px;line-height:1.5;text-align:center}
.instant-note a{color:#c4b5fd}
@media(max-width:640px){.instant-purchase-head,.instant-purchase-body,.instant-purchase-tabs{padding-left:16px;padding-right:16px}.instant-product,.instant-game{grid-template-columns:auto 1fr;gap:10px}.instant-product-price{grid-column:2;text-align:left}.instant-game-platforms{grid-template-columns:1fr}}

/* iOS icon strip */
.ios-icons-dock{
  --ios-icon-size:clamp(96px,14vw,128px);
  --ios-icon-inner:calc(var(--ios-icon-size)*.56);
  --ios-icon-gap:clamp(16px,2.6vw,24px);
  width:100%;
  margin:0;
}

.ios-icons-strip{
  overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);
}
.ios-icons-track{
  display:flex;
  gap:var(--ios-icon-gap);
  width:max-content;
  padding:8px 0 10px;
  animation:ios-marquee 32s linear infinite;
  will-change:transform;
}
.ios-icons-strip:hover .ios-icons-track,
.ios-icons-strip:focus-within .ios-icons-track{
  animation-play-state:paused;
}
@keyframes ios-marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
.ios-icon-item{
  display:flex;
  flex-shrink:0;
  flex:0 0 var(--ios-icon-size);
  width:var(--ios-icon-size);
  color:inherit;
  text-decoration:none;
  transition:transform .3s cubic-bezier(.22,1,.36,1);
}
.ios-icon-item:hover{transform:translateY(-4px)}
.ios-icon-mark{
  position:relative;
  display:grid;
  place-items:center;
  width:var(--ios-icon-size);
  height:var(--ios-icon-size);
  border-radius:calc(var(--ios-icon-size)*.26);
  overflow:hidden;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  box-shadow:0 4px 18px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.12);
  transition:border-color .25s,box-shadow .25s;
}
.ios-icon-item:hover .ios-icon-mark{
  border-color:rgba(139,92,246,.38);
  box-shadow:0 8px 28px rgba(139,92,246,.18),inset 0 1px 0 rgba(255,255,255,.16);
}
.ios-icon-mark img{
  width:var(--ios-icon-inner);
  height:var(--ios-icon-inner);
  object-fit:contain;
}
@media(max-width:640px){
  .ios-icons-dock{--ios-icon-size:clamp(88px,22vw,108px)}
  .hero-platforms-band{width:calc(100% - 24px);--hero-platforms-gap:20px;--hero-platforms-cta-gap:clamp(28px,6vw,40px)}
  .ios-icons-strip{-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 5%,#000 95%,transparent 100%);mask-image:linear-gradient(to right,transparent 0%,#000 5%,#000 95%,transparent 100%)}
  .ios-icons-track{gap:14px}
}
@media(prefers-reduced-motion:reduce){
  .ios-icons-track{animation:none}
}

/* GameTopUp landing hero */
.gt-hero,
.gt-benefits,
.gt-categories{
  --gt-bg:#050714;
  --gt-text:#f6f7ff;
  --gt-muted:#9aa3bd;
  --gt-neo-hi:rgba(255,255,255,.16);
  --gt-neo-lo:rgba(0,0,0,.55);
  --gt-radius-sm:999px;
  --gt-radius-md:16px;
  --gt-radius-card:18px;
}
.gt-hero{
  --gt-border:rgba(133,112,255,.28);
  position:relative;
  isolation:isolate;
  width:min(calc(100% - 32px),var(--max));
  min-height:428px;
  height:auto;
  margin:44px auto 20px;
  padding:clamp(36px,4vw,56px);
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr);
  gap:clamp(20px,3vw,36px);
  align-items:stretch;
  overflow:hidden;
  border:1px solid var(--gt-border);
  border-radius:var(--r);
  background:radial-gradient(ellipse 52% 80% at 82% 48%,rgba(109,64,230,.22),transparent 58%),var(--gt-bg);
  box-shadow:0 0 0 1px rgba(255,255,255,.025) inset,0 22px 70px rgba(3,4,15,.35);
}
.gt-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:radial-gradient(circle,rgba(180,178,255,.26) 0 1px,transparent 1.5px);
  background-size:95px 95px;
  opacity:.18;
  mask-image:linear-gradient(110deg,transparent 0%,#000 25%,#000 76%,transparent 100%);
}
.gt-hero-stars{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
}
.gt-hero-copy{
  position:relative;
  z-index:2;
  grid-column:1;
  max-width:560px;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  text-align:left;
}
.gt-hero-kicker{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  margin-bottom:14px;
  padding:7px 16px;
  border:1px solid rgba(139,92,246,.28);
  border-radius:var(--gt-radius-sm);
  background:linear-gradient(100deg,rgba(139,92,246,.38),rgba(88,70,220,.22));
  color:#efeaff;
  font-size:11px;
  font-weight:800;
  letter-spacing:.1em;
}
.gt-hero #hero-title{
  width:100%;
  max-width:100%;
  margin:0 0 16px;
  color:var(--gt-text);
  font-size:clamp(28px,3.5vw,40px);
  line-height:1.2;
  letter-spacing:-.04em;
  font-weight:800;
}
.gt-hero h1 span{
  background:linear-gradient(90deg,#4ea7ff 0%,#7b6cff 52%,#b06bff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.gt-hero-copy>p{
  max-width:480px;
  margin:0 0 24px;
  color:var(--gt-muted);
  font-size:clamp(14px,1.4vw,16px);
  line-height:1.6;
}
.gt-hero-cta{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  width:min(100%,340px);
  min-height:56px;
  margin:0;
  padding:14px 22px 14px 18px;
  gap:16px;
  border-radius:var(--gt-radius-md);
  background:linear-gradient(105deg,#7544f5 0%,#5566fa 48%,#27cbe2 100%);
  box-shadow:0 14px 32px rgba(92,76,243,.32);
  font-weight:800;
  color:#fff;
  transition:transform .2s,box-shadow .2s;
}
.gt-hero-cta:hover{
  transform:translateY(-2px) scale(1.015);
  box-shadow:0 18px 42px rgba(92,76,243,.48);
}
.gt-hero-cta:focus-visible,
.gt-category:focus-visible{
  outline:2px solid var(--c);
  outline-offset:3px;
}
.gt-hero-cta-label{
  flex:1;
  text-align:center;
  font-size:16px;
  line-height:1.2;
}
.gt-icon{
  display:grid;
  place-items:center;
  flex:0 0 28px;
  width:28px;
  height:28px;
}
.gt-icon svg,
.gt-benefit-icon svg,
.gt-chevron svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.gt-chevron{
  display:grid;
  place-items:center;
  flex:0 0 22px;
  width:22px;
  height:22px;
}
.gt-chevron svg{width:20px;height:20px;stroke-width:2.2}
.gt-hero-visual{
  position:static;
  grid-column:2;
  min-width:0;
  min-height:0;
  display:block;
  pointer-events:none;
}
.gt-hero-visual::before{
  content:"";
  position:absolute;
  right:4%;
  top:50%;
  width:46%;
  height:82%;
  transform:translateY(-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(124,77,255,.42),rgba(34,211,238,.08) 42%,transparent 70%);
  filter:blur(28px);
  pointer-events:none;
}
.gt-hero-character{
  position:absolute;
  z-index:1;
  top:50%;
  right:0;
  transform:translateY(-50%);
  width:64%;
  max-width:none;
  height:auto;
  max-height:96%;
  object-fit:contain;
  object-position:right center;
}
.gt-benefits{
  width:min(calc(100% - 32px),var(--max));
  margin:0 auto 22px;
  padding:22px 28px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:center;
  column-gap:24px;
  border:1px solid rgba(126,139,198,.16);
  border-radius:var(--r);
  background:rgba(10,14,28,.92);
  box-shadow:0 12px 34px rgba(3,4,15,.18);
}
.gt-benefit{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  min-width:0;
  padding:4px 0;
}
.gt-benefit--stat{
  display:none !important;
}
.gt-benefit-icon,
.gt-category-icon{
  display:grid;
  place-items:center;
  border-radius:50%;
  background:
    radial-gradient(120% 80% at 32% 18%,rgba(255,255,255,.16),transparent 48%),
    linear-gradient(160deg,#222a42 0%,#12182b 54%,#0a0e1c 100%);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:
    inset 1px 2px 3px var(--gt-neo-hi),
    inset -3px -5px 8px var(--gt-neo-lo),
    0 8px 16px rgba(0,0,0,.42),
    0 1px 0 rgba(255,255,255,.05);
}
.gt-benefit-icon{
  flex:0 0 52px;
  width:52px;
  height:52px;
  color:#8ecbff;
}
.gt-benefit--blue .gt-benefit-icon{color:#5ee4f5}
.gt-benefit b,
.gt-benefit small{display:block}
.gt-benefit b{
  font-size:14px;
  line-height:1.25;
  color:#eef0fa;
  font-weight:800;
}
.gt-benefit small{
  margin-top:4px;
  color:#858da8;
  font-size:12px;
  line-height:1.25;
}
.gt-benefit-value{
  display:block;
  white-space:nowrap;
  color:#7dd7ff;
  font-size:32px;
  line-height:1;
  font-weight:800;
  letter-spacing:-.03em;
}
.gt-benefit--stat{
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:6px;
  padding-left:8px;
}
.gt-benefit--stat small{
  margin-top:0;
  font-weight:400;
  font-size:13px;
}
/* ── Categories Section (.gt-categories) ───────────────────────── */
.gt-categories {
  width: calc(100% - 24px);
  max-width: var(--max, 1200px);
  margin: 0 auto 36px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  box-sizing: border-box;
}

.gt-category {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  grid-column: auto;
  width: 100%;
  min-width: 0;
  min-height: 120px;
  height: 100%;
  padding: 14px 10px;
  background-color: #0e1020;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  box-sizing: border-box;
  border: 1.5px solid #1f2230;
  border-radius: 14px;
  box-shadow: 0 4px 14px rgba(3, 4, 15, 0.25);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease, background-color .25s ease, border-radius .25s ease;
}

.gt-category:hover,
.gt-category.is-active,
.gt-category.active {
  z-index: 2;
  border-color: #8b5cf6;
  border-radius: 14px;
  background-color: #151830;
  box-shadow: 0 0 18px rgba(139, 92, 246, 0.4);
}

.gt-category:hover {
  transform: translateY(-2px);
}

.gt-category-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  margin: 0 0 10px;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}

.gt-category-icon img {
  display: block;
  width: 44px;
  height: 44px;
  max-width: 100%;
  object-fit: contain;
}

.gt-category-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  width: 100%;
  text-align: center;
}

.gt-category-body b {
  display: block;
  width: 100%;
  font-size: 13px;
  line-height: 1.25;
  color: #ffffff;
  font-weight: 600;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
}

.gt-category-body small {
  display: block;
  width: 100%;
  margin-top: 4px;
  font-size: 11px;
  line-height: 1.25;
  color: #858da8;
  font-weight: 400;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
  transition: color .25s ease;
}

.gt-category:hover .gt-category-body small,
.gt-category.is-active .gt-category-body small,
.gt-category.active .gt-category-body small {
  color: #8b9aff;
}

.gt-category:last-child {
  grid-column: 1 / -1;
}

/* ── Брейкпоинт sm (от 640px до 1023px): grid-cols-3, gap-4 ──── */
@media (min-width: 640px) {
  .gt-categories {
    width: min(calc(100% - 32px), var(--max, 1200px));
    margin: 0 auto 48px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
  }

  .gt-category {
    padding: 18px 12px;
    min-height: 136px;
  }

  .gt-category-icon {
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
  }

  .gt-category-icon img {
    width: 46px;
    height: 46px;
  }

  .gt-category-body b {
    font-size: 14px;
  }

  .gt-category-body small {
    font-size: 12px;
  }

  .gt-category:last-child {
    grid-column: span 2;
  }
}

/* ── Брейкпоинт lg (от 1024px, Desktop): в один ряд ───────────── */
@media (min-width: 1024px) {
  .gt-categories {
    width: min(calc(100% - 32px), var(--max, 1200px));
    margin: 0 auto 72px;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: 0;
    border-radius: 16px;
    background: #0d0f1a;
    box-shadow: 0 12px 30px rgba(3, 4, 15, .28);
    overflow: visible;
  }

  .gt-category {
    grid-column: auto !important;
    min-height: 184px;
    padding: 24px 10px 20px;
    background-color: #0e1020;
    border: 1.5px solid transparent;
    border-radius: 0;
    box-shadow: none;
    transform: none;
  }

  .gt-category:not(:last-child) {
    border-right: 1.5px solid #1f2230;
  }

  .gt-category:first-child {
    border-top-left-radius: 16px;
    border-bottom-left-radius: 16px;
  }

  .gt-category:last-child {
    border-top-right-radius: 16px;
    border-bottom-right-radius: 16px;
    border-right: 1.5px solid transparent;
  }

  .gt-category.is-active,
  .gt-category.active {
    z-index: 2;
    border: 1.5px solid #8b5cf6;
    border-radius: 14px;
    background-color: #151830;
    box-shadow: 0 0 20px rgba(139, 92, 246, .45);
    transform: none;
  }

  .gt-category:first-child.is-active,
  .gt-category:first-child.active {
    border-radius: 16px 14px 14px 16px;
  }

  .gt-category:last-child.is-active,
  .gt-category:last-child.active {
    border-radius: 14px 16px 16px 14px;
  }

  .gt-category:hover {
    z-index: 3;
    border: 1.5px solid #8b5cf6;
    border-radius: 14px;
    background-color: #151830;
    box-shadow: 0 0 20px rgba(139, 92, 246, .45);
    transform: scale(1.04);
  }

  .gt-category:first-child:hover {
    border-radius: 16px 14px 14px 16px;
  }

  .gt-category:last-child:hover {
    border-radius: 14px 16px 16px 14px;
  }

  .gt-category-icon {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    margin: 0 0 14px;
  }

  .gt-category-icon img {
    width: 52px;
    height: 52px;
  }

  .gt-category-body b {
    font-size: 15px;
    line-height: 1.3;
  }

  .gt-category-body small {
    margin-top: 5px;
    font-size: 12px;
    line-height: 1.25;
  }
}

/* ── Tailwind utility helpers for grid ─────────────────────────── */
.grid { display: grid; }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gap-3 { gap: 12px; }
.items-stretch { align-items: stretch; }
.col-span-1 { grid-column: span 1 / span 1; }
.col-span-2 { grid-column: span 2 / span 2; }
.whitespace-normal { white-space: normal; }

@media (min-width: 640px) {
  .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sm\:gap-4 { gap: 16px; }
  .sm\:col-span-1 { grid-column: span 1 / span 1; }
}

@media (min-width: 1024px) {
  .lg\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .lg\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .lg\:grid-flow-col { grid-auto-flow: column; }
  .lg\:auto-cols-fr { grid-auto-columns: minmax(0, 1fr); }
  .lg\:gap-0 { gap: 0; }
}
@media(max-width:1100px){
  .gt-hero{padding:48px 40px;gap:20px 24px}
  .gt-benefit b{font-size:13px}
  .gt-benefit small{font-size:11px}
  .gt-benefit-value{font-size:26px}
  .gt-category-body b{font-size:13px}
}
@media(max-width:980px){
  .hero{
    grid-template-columns:1fr;
    gap:28px;
    min-height:auto;
  }
  .gt-hero{
    grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr);
    min-height:0;
    height:auto;
    gap:clamp(16px,2.5vw,28px);
    padding:clamp(24px,3vw,36px) clamp(20px,3vw,32px);
    margin:24px auto 16px;
  }
  .gt-hero-copy{
    grid-column:1;
    max-width:100%;
    width:100%;
  }
  .gt-hero-kicker{
    margin-bottom:10px;
    font-size:11px;
    padding:6px 14px;
    min-height:28px;
  }
  .gt-hero #hero-title{
    width:100%;
    max-width:100%;
    margin:0 0 12px;
    font-size:clamp(22px,2.6vw,30px);
    line-height:1.22;
  }
  .gt-hero-copy>p{
    margin:0 0 18px;
    font-size:clamp(13px,1.5vw,15px);
    line-height:1.5;
    max-width:100%;
  }
  .gt-hero-cta{
    width:min(100%,300px);
    min-height:48px;
    padding:12px 18px;
    margin:0;
  }
  .gt-hero-cta-label{
    font-size:14px;
  }
  .gt-hero-visual{
    grid-column:2;
    width:100%;
    min-width:0;
    min-height:0;
  }
  .gt-hero-character{
    width:64%;
    max-width:none;
    max-height:96%;
  }
  .gt-benefits{
    grid-template-columns:repeat(3,minmax(0,1fr));
    padding:16px 20px;
    row-gap:14px;
    column-gap:12px;
  }
  .gt-benefit{gap:10px}
  .gt-benefit-icon{flex:0 0 44px;width:44px;height:44px}
  .gt-benefit-icon svg{width:18px;height:18px}
  .gt-benefit b{font-size:13px}
  .gt-benefit small{font-size:11px}
  .gt-benefit-value{font-size:24px}
  .gt-benefit--stat{padding-left:0}
}

/* Mobile adaptive layout: ~768px and below */
@media(max-width:768px){
  /* Section: .hero */
  .hero{
    width:min(calc(100% - 32px),var(--max));
    margin:28px auto 20px;
    grid-template-columns:1fr;
    gap:28px;
    min-height:auto;
    overflow-x:hidden;
  }
  .banner-strip ~ .hero{margin-top:20px}
  .hero > div > .eyebrow,
  .hero > div > .hero-platforms-ticker{font-size:11px;letter-spacing:.12em}
  .hero h1,
  .hero > div > h1{
    font-size:clamp(30px,6.5vw,40px);
    line-height:1.1;
    letter-spacing:-.035em;
    margin:8px 0 14px;
  }
  .hero > div > p{
    font-size:16px;
    line-height:1.55;
    color:var(--muted);
    max-width:100%;
  }
  .hero .actions{
    display:flex;
    flex-direction:column;
    gap:12px;
    width:100%;
    margin:22px 0 18px;
  }
  .hero .actions .btn{
    width:100%;
    min-height:48px;
    padding:13px 20px;
    font-size:15px;
  }
  .hero .trust{
    gap:12px 16px;
    font-size:13px;
  }
  .hero-art{
    position:relative;
    width:min(100%,400px);
    max-width:100%;
    margin:0 auto;
    min-height:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    overflow:visible;
  }
  .hero-art .feature-card{
    position:relative;
    width:100%;
    max-width:100%;
    padding:clamp(20px,5vw,28px);
    border-radius:26px;
    z-index:2;
    box-shadow:0 24px 80px rgba(0,0,0,.35);
    border:1px solid var(--line);
    background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    box-sizing:border-box;
  }
  .hero-art .feature-card h3{
    font-size:28px;
    font-weight:800;
    margin:24px 0 8px;
    color:var(--text,#fff);
    line-height:1.15;
  }
  .hero-art .feature-card p{
    color:var(--muted);
    font-size:14px;
    line-height:1.5;
    margin:0;
  }
  .hero-art .feature-card .mark{
    width:48px;
    height:48px;
    border-radius:14px;
    background:rgba(139,92,246,.22);
    display:grid;
    place-items:center;
  }
  .hero-art .feature-card .mark img{
    width:30px;
    height:30px;
    object-fit:contain;
  }
  .hero-art .feature-card .badge.ok{
    display:inline-flex;
    align-items:center;
    padding:5px 10px;
    border:1px solid var(--line);
    border-radius:999px;
    font-size:12px;
    font-weight:900;
    color:#a7f3d0;
    background:rgba(52,211,153,.11);
  }
  .hero-art .feature-card .price{
    margin-top:28px;
    padding-top:20px;
    border-top:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
  }
  .hero-art .feature-card .price .btn{
    min-height:38px !important;
    padding:6px 16px !important;
    font-size:13px !important;
    margin-left:auto !important;
    border-radius:12px;
    font-weight:800;
  }
  .hero-art .feature-dots{
    display:flex;
    justify-content:center;
    gap:7px;
    margin-top:20px;
  }
  .hero-art .feature-dot{
    position:relative;
    width:8px;
    height:8px;
    min-width:8px;
    min-height:8px;
    padding:0;
    border:none;
    border-radius:50%;
    background:rgba(255,255,255,.18);
    cursor:pointer;
    transition:all .25s ease;
  }
  .hero-art .feature-dot::after{
    display:none;
  }
  .hero-art .feature-dot.is-active{
    width:22px;
    border-radius:999px;
    background:linear-gradient(90deg,var(--p),var(--c));
  }
  .hero-art .orb{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
  }
  .hero-art .orb.a{
    width:clamp(180px,46vw,240px);
    height:clamp(180px,46vw,240px);
    background:rgba(139,92,246,.25);
    top:20px;
    left:calc(50% - clamp(130px,32vw,180px));
  }
  .hero-art .orb.b{
    width:clamp(160px,40vw,200px);
    height:clamp(160px,40vw,200px);
    background:rgba(34,211,238,.18);
    bottom:24px;
    right:calc(50% - clamp(130px,32vw,180px));
  }

  /* Section: .gt-hero */
  .gt-hero{
    width:min(calc(100% - 32px),var(--max));
    height:auto;
    min-height:auto;
    margin:20px auto 16px;
    padding:32px 24px 20px;
    display:flex;
    flex-direction:column;
    gap:16px;
    border-radius:var(--gt-radius-card,18px);
    overflow:hidden;
  }
  .gt-hero-copy{
    width:100%;
    max-width:100%;
    justify-self:stretch;
    align-self:auto;
    text-align:left;
  }
  .gt-hero-kicker{
    top:0;
    left:0;
    min-height:30px;
    padding:6px 14px;
    font-size:11px;
    margin-bottom:8px;
  }
  .gt-hero #hero-title{
    top:0;
    left:0;
    width:100%;
    max-width:100%;
    margin:12px 0;
    font-size:clamp(28px,6vw,36px);
    line-height:1.15;
    letter-spacing:-.03em;
  }
  .gt-hero-copy > p{
    top:0;
    left:0;
    width:100%;
    max-width:100%;
    font-size:15px;
    line-height:1.5;
    color:var(--gt-muted);
    margin:0 0 20px;
  }
  .gt-hero-cta{
    width:100%;
    max-width:320px;
    min-height:48px;
    margin:0;
    padding:12px 18px;
    border-radius:var(--gt-radius-md,16px);
    box-sizing:border-box;
  }
  .gt-hero-cta-label{font-size:14px}
  .gt-hero-visual{
    position:relative;
    grid-column:auto;
    width:100%;
    min-height:auto;
    display:flex;
    justify-content:center;
    align-items:center;
    margin-top:8px;
    pointer-events:auto;
  }
  .gt-hero-visual::before{
    right:auto;
    top:auto;
    left:auto;
    transform:none;
    width:min(260px,70vw);
    height:min(260px,70vw);
  }
  .gt-hero-character{
    position:relative;
    top:auto;
    right:auto;
    transform:none;
    width:100%;
    max-width:min(100%,420px);
    height:auto;
    max-height:280px;
    object-fit:contain;
    object-position:center;
  }

  /* Section: .gt-benefits */
  .gt-benefits{
    width:min(calc(100% - 32px),var(--max));
    margin:0 auto 16px;
    padding:18px 20px;
    display:grid;
    grid-template-columns:1fr;
    row-gap:14px;
    column-gap:0;
    border-radius:var(--gt-radius-card,18px);
    overflow:hidden;
  }
  .gt-benefit{
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:center;
    gap:14px;
    min-width:0;
    padding:8px 0;
    border-bottom:1px solid rgba(255,255,255,.05);
  }
  .gt-benefit:last-child,
  .gt-benefit:nth-child(3){
    border-bottom:none;
    padding-bottom:0;
  }
  .gt-benefit-icon{
    flex:0 0 46px;
    width:46px;
    height:46px;
  }
  .gt-benefit-icon svg{width:20px;height:20px}
  .gt-benefit > div{
    margin-left:auto;
    margin-right:auto;
    text-align:center;
    min-width:0;
  }
  .gt-benefit b{
    font-size:15px;
    line-height:1.3;
    color:var(--gt-text,#f6f7ff);
    font-weight:700;
    text-align:center;
  }
  .gt-benefit small{
    margin-top:2px;
    color:var(--gt-muted,#9aa3bd);
    font-size:14px;
    line-height:1.35;
    text-align:center;
  }
  .gt-benefit--stat,
  .gt-benefits > .gt-benefit:nth-child(n+4){
    display:none !important;
  }
}

/* Narrow mobile screens: ~480px and below */
@media(max-width:480px){
  /* Section: .hero */
  .hero{
    width:calc(100% - 24px);
    margin:20px auto 16px;
    gap:22px;
  }
  .banner-strip ~ .hero{margin-top:14px}
  .hero h1,
  .hero > div > h1{
    font-size:clamp(26px,7.8vw,32px);
    line-height:1.15;
    margin:6px 0 12px;
  }
  .hero > div > p{
    font-size:14px;
    line-height:1.5;
  }
  .hero .actions{
    margin:18px 0 16px;
    gap:10px;
  }
  .hero .actions .btn{
    min-height:46px;
    padding:12px 16px;
    font-size:14px;
  }
  .hero .trust{
    gap:8px 12px;
    font-size:12px;
  }


  /* Section: .gt-hero */
  .gt-hero{
    width:calc(100% - 24px);
    margin:16px auto 12px;
    padding:24px 18px 16px;
    border-radius:16px;
    gap:12px;
  }
  .gt-hero-kicker{
    font-size:10px;
    padding:5px 12px;
    min-height:26px;
  }
  .gt-hero #hero-title{
    font-size:clamp(24px,7.5vw,30px);
    line-height:1.18;
    margin:10px 0;
  }
  .gt-hero-copy > p{
    font-size:14px;
    line-height:1.45;
    margin-bottom:16px;
  }
  .gt-hero-cta{
    max-width:100%;
    width:100%;
    min-height:46px;
    padding:11px 16px;
    margin:0;
  }
  .gt-hero-cta-label{font-size:13px}
  .gt-hero-visual{
    margin-top:4px;
    width:100%;
    display:flex;
    justify-content:center;
  }
  .gt-hero-character{
    position:relative;
    top:auto;
    right:auto;
    transform:none;
    width:100%;
    max-width:min(100%,320px);
    max-height:240px;
  }

  /* Section: .gt-benefits */
  .gt-benefits{
    width:calc(100% - 24px);
    margin:0 auto 12px;
    padding:14px 16px;
    row-gap:10px;
    border-radius:16px;
  }
  .gt-benefit{
    gap:12px;
    padding:7px 0;
    justify-content:center;
  }
  .gt-benefit:last-child,
  .gt-benefit:nth-child(3){
    border-bottom:none;
    padding-bottom:0;
  }
  .gt-benefit-icon{
    flex:0 0 42px;
    width:42px;
    height:42px;
  }
  .gt-benefit-icon svg{width:18px;height:18px}
  .gt-benefit > div{
    margin-left:auto;
    margin-right:auto;
    text-align:center;
  }
  .gt-benefit b{
    font-size:15px;
    text-align:center;
  }
  .gt-benefit small{
    font-size:13px;
    text-align:center;
  }
  .gt-benefit--stat,
  .gt-benefits > .gt-benefit:nth-child(n+4){
    display:none !important;
  }
}

@media(prefers-reduced-motion:reduce){
  .gt-category,.gt-hero-cta{animation:none;transition:none}
}

/* ── Ingame Hero Section (catalog-ingame.php) ──────────────── */
.ingame-hero{
  width:min(calc(100% - 32px),var(--max));
  margin:56px auto 28px;
  display:grid;
  grid-template-columns:1.14fr .86fr;
  gap:36px;
  align-items:center;
}
.ingame-hero-left{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.ingame-platforms-label{
  --ingame-ticker-gap:1.35em;
  position:relative;
  overflow:hidden;
  width:100%;
  margin-bottom:16px;
  color:#8b93a7;
  font-size:11px;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  line-height:1.4;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);
  user-select:none;
}
.ingame-games-track{
  display:flex;
  width:max-content;
  animation:ingame-games-marquee 38s linear infinite;
  will-change:transform;
}
.ingame-platforms-label:hover .ingame-games-track,
.ingame-platforms-label:focus-within .ingame-games-track{
  animation-play-state:paused;
}
.ingame-games-set{
  display:flex;
  align-items:center;
  flex-shrink:0;
  gap:var(--ingame-ticker-gap);
  padding-right:var(--ingame-ticker-gap);
}
.ingame-games-name{
  white-space:nowrap;
  color:rgba(186,196,216,.78);
}
.ingame-games-sep{
  flex-shrink:0;
  width:4px;
  height:4px;
  border-radius:1px;
  background:linear-gradient(135deg,#8b7cff 0%,#38bdf8 100%);
  opacity:.7;
  box-shadow:0 0 8px rgba(56,189,248,.4);
  transform:rotate(45deg);
}
@keyframes ingame-games-marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@media(prefers-reduced-motion:reduce){
  .ingame-games-track{
    animation:none;
    flex-wrap:wrap;
    width:auto;
    max-width:100%;
    will-change:auto;
  }
  .ingame-games-set:last-child{
    display:none;
  }
  .ingame-games-set{
    flex-wrap:wrap;
    padding-right:0;
    row-gap:6px;
  }
  .ingame-platforms-label{
    -webkit-mask-image:none;
    mask-image:none;
  }
}
.ingame-hero-title{
  margin:0 0 14px;
  font-size:clamp(34px,4.2vw,50px);
  font-weight:800;
  line-height:1.06;
  letter-spacing:-.03em;
  color:#fff;
  word-break:break-word;
  overflow-wrap:break-word;
}
.ingame-hero-desc{
  margin:0 0 24px;
  color:#9ca8bf;
  font-size:15px;
  line-height:1.6;
  max-width:460px;
}
.ingame-feature-strip{
  display:inline-flex;
  align-items:center;
  gap:0;
  padding:8px 16px;
  background:linear-gradient(180deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,.02) 100%);
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 8px 32px rgba(0,0,0,.35);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  margin-top:6px;
  width:fit-content;
  max-width:100%;
  box-sizing:border-box;
}
.ingame-feature-item{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 14px;
  font-size:13px;
  font-weight:600;
  color:#c8d4e6;
  white-space:nowrap;
  position:relative;
  flex:0 1 auto;
}
.ingame-feature-item:first-child{
  padding-left:0;
}
.ingame-feature-item:last-child{
  padding-right:0;
}
.ingame-feature-item+.ingame-feature-item::before{
  content:'';
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  height:16px;
  width:1px;
  background:rgba(255,255,255,.1);
}
.ingame-feature-icon{
  width:18px;
  height:18px;
  color:#38bdf8;
  flex-shrink:0;
}
.ingame-promo-wrap{
  position:relative;
  min-width:0;
  width:100%;
  padding-top:96px;
  margin-top:-96px;
}
.ingame-promo-card{
  position:relative;
  border-radius:20px;
  overflow:visible;
  min-height:280px;
  background-color:#090d18;
  background-image:
    radial-gradient(ellipse 75% 72% at 90% 82%, rgba(14, 132, 188, 0.6) 0%, rgba(11, 88, 132, 0.32) 36%, rgba(6, 42, 75, 0.1) 60%, transparent 76%),
    radial-gradient(ellipse 70% 60% at 6% 8%, rgba(98, 48, 162, 0.48) 0%, rgba(56, 24, 102, 0.22) 42%, transparent 72%),
    linear-gradient(135deg, #17102b 0%, #0d1222 45%, #07101d 100%);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 24px 70px rgba(0,0,0,.45), 0 0 40px rgba(14,132,188,.08);
  user-select:none;
  -webkit-user-select:none;
}
.ingame-promo-slides{
  display:grid;
  grid-template-areas:"slide";
  width:100%;
  position:relative;
  touch-action:pan-y pinch-zoom;
}
.ingame-promo-slide{
  grid-area:slide;
  min-width:100%;
  width:100%;
  position:relative;
  min-height:280px;
  display:flex;
  align-items:flex-end;
  box-sizing:border-box;
  opacity:0;
  visibility:hidden;
  transition:opacity .35s ease, visibility .35s ease;
  pointer-events:none;
}
.ingame-promo-slide.is-active{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.ingame-slide-bg{
  position:absolute;
  inset:0;
  border-radius:20px;
  overflow:hidden;
  background-color:#090d18;
  background-image:
    radial-gradient(ellipse 75% 72% at 90% 82%, rgba(14, 132, 188, 0.6) 0%, rgba(11, 88, 132, 0.32) 36%, rgba(6, 42, 75, 0.1) 60%, transparent 76%),
    radial-gradient(ellipse 70% 60% at 6% 8%, rgba(98, 48, 162, 0.48) 0%, rgba(56, 24, 102, 0.22) 42%, transparent 72%),
    linear-gradient(135deg, #17102b 0%, #0d1222 45%, #07101d 100%);
  background-size:cover;
  background-position:center right;
  background-repeat:no-repeat;
  z-index:1;
}
.ingame-slide-bg::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  display:none;
}
.ingame-slide-bg[style*="background-image"]::after{
  display:block;
  background:linear-gradient(90deg,rgba(11,15,28,.92) 0%,rgba(11,15,28,.68) 42%,rgba(11,15,28,.15) 75%,transparent 100%);
}
.ingame-slide-character{
  position:absolute;
  top:-96px;
  right:-12px;
  bottom:0;
  height:calc(100% + 96px);
  width:min(85%,420px);
  max-width:85%;
  object-fit:contain;
  object-position:bottom right;
  z-index:4;
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
  filter:drop-shadow(0 14px 28px rgba(0,0,0,.55));
}
.ingame-slide-character.character-genshin{
  top:-53px;
  right:40px;
  bottom:0;
  height:calc(100% + 53px);
  width:auto;
  max-width:44%;
  object-fit:contain;
  object-position:bottom right;
}
.ingame-slide-character.character-fortnite,
.ingame-slide-character.character-pubg,
.ingame-slide-character.character-valorant{
  right:0;
  object-position:bottom right;
}
.ingame-slide-character.character-fortnite{
  right:-28px;
}
.ingame-slide-character.character-valorant{
  width:min(72%,340px);
  max-width:72%;
  top:-64px;
  height:calc(100% + 64px);
  right:-36px;
}
@media(min-width:981px){
  .ingame-slide-character.character-pubg{
    width:min(72%,360px);
    max-width:72%;
    top:-80px;
    height:calc(100% + 80px);
  }
}
.ingame-slide-overlay{
  position:absolute;
  inset:0;
  border-radius:20px;
  pointer-events:none;
  z-index:3;
  background:linear-gradient(90deg,
    #090d18 0%,
    rgba(9, 13, 24, 0.95) 32%,
    rgba(9, 13, 24, 0.72) 50%,
    rgba(9, 13, 24, 0.25) 70%,
    transparent 88%
  );
}
.ingame-slide-content{
  position:relative;
  z-index:4;
  padding:28px 28px 34px;
  display:flex;
  flex-direction:column;
  gap:6px;
  max-width:58%;
  box-sizing:border-box;
}
.ingame-slide-game{
  font-size:13px;
  font-weight:600;
  color:rgba(255,255,255,.7);
  letter-spacing:.03em;
}
.ingame-slide-title{
  font-size:clamp(24px,2.8vw,32px);
  font-weight:800;
  color:#fff;
  line-height:1.1;
  letter-spacing:-.02em;
  margin:2px 0 4px;
}
.ingame-slide-desc{
  font-size:13px;
  color:rgba(255,255,255,.65);
  line-height:1.5;
  margin-bottom:12px;
}
.ingame-slide-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:10px 26px;
  border-radius:12px;
  font-size:14px;
  font-weight:700;
  color:#fff;
  background:linear-gradient(90deg, #6644ff 0%, #5146f6 36%, #0ea5e9 100%);
  box-shadow:0 6px 20px rgba(99,102,241,.38);
  border:none;
  cursor:pointer;
  width:fit-content;
  transition:.18s ease;
  text-decoration:none;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
.ingame-slide-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 28px rgba(99,102,241,.5);
}
.ingame-slide-btn:active{
  transform:scale(.98);
}
.ingame-promo-dots{
  position:relative;
  z-index:6;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top:14px;
  padding:4px 0;
}
.ingame-promo-dot{
  position:relative;
  width:8px;
  height:8px;
  border-radius:999px;
  background:rgba(255,255,255,.2);
  border:none;
  cursor:pointer;
  padding:0;
  transition:all .25s ease;
  -webkit-tap-highlight-color:transparent;
}
.ingame-promo-dot::before{
  content:'';
  position:absolute;
  top:-10px;
  bottom:-10px;
  left:-6px;
  right:-6px;
}
.ingame-promo-dot.is-active{
  width:24px;
  background:linear-gradient(90deg, #6644ff, #38bdf8);
}

/* Medium desktop & small laptops (<=1150px) */
@media(max-width:1150px){
  .ingame-hero{
    gap:28px;
  }
  .ingame-slide-character{
    top:-88px;
    height:calc(100% + 88px);
    width:min(82%,380px);
    max-width:82%;
    right:-10px;
  }
  .ingame-slide-character.character-genshin{
    top:-48px;
    right:32px;
    height:calc(100% + 48px);
  }
  .ingame-slide-character.character-fortnite,
  .ingame-slide-character.character-pubg,
  .ingame-slide-character.character-valorant{
    right:0;
  }
  .ingame-slide-character.character-fortnite{
    right:-24px;
  }
  .ingame-slide-character.character-valorant{
    width:min(64%,300px);
    max-width:64%;
    top:-56px;
    height:calc(100% + 56px);
    right:-30px;
  }
  .ingame-feature-strip{
    padding:6px 12px;
  }
  .ingame-feature-item{
    padding:0 10px;
    font-size:12px;
    gap:6px;
  }
  .ingame-feature-icon{
    width:16px;
    height:16px;
  }
}

/* Tablet screens (<=980px) */
@media(max-width:980px){
  .ingame-hero{
    grid-template-columns:1fr;
    gap:32px;
    margin:36px auto 24px;
  }
  .ingame-hero-desc{
    max-width:100%;
  }
  .ingame-promo-wrap{
    padding-top:80px;
    margin-top:-80px;
  }
  .ingame-slide-content{
    max-width:62%;
  }
  .ingame-slide-character{
    top:-80px;
    height:calc(100% + 80px);
    width:min(78%,340px);
    max-width:78%;
    right:-8px;
  }
  .ingame-slide-character.character-genshin{
    top:-44px;
    right:24px;
    height:calc(100% + 44px);
  }
  .ingame-slide-character.character-fortnite,
  .ingame-slide-character.character-pubg,
  .ingame-slide-character.character-valorant{
    right:0;
  }
  .ingame-slide-character.character-fortnite{
    right:-22px;
  }
  .ingame-slide-character.character-valorant{
    width:min(58%,260px);
    max-width:58%;
    top:-48px;
    height:calc(100% + 48px);
    right:-24px;
  }
}

/* Mobile screens (<=640px) */
@media(max-width:640px){
  .ingame-feature-strip{
    display:none !important;
  }
  .ingame-hero{
    margin:24px auto 20px;
    gap:22px;
  }
  .ingame-platforms-label{
    font-size:10.5px;
    letter-spacing:.12em;
    margin-bottom:12px;
  }
  .ingame-hero-title{
    font-size:clamp(28px,7.8vw,36px);
    line-height:1.12;
    margin-bottom:12px;
  }
  .ingame-hero-desc{
    font-size:14px;
    line-height:1.5;
    margin-bottom:18px;
  }
  .ingame-desc-br,
  .ingame-hero-desc br{
    display:none;
  }
  .ingame-promo-wrap{
    padding-top:72px;
    margin-top:-48px;
  }
  .ingame-promo-card{
    border-radius:16px;
    min-height:240px;
  }
  .ingame-promo-slide{
    min-height:240px;
  }
  .ingame-slide-bg{
    border-radius:16px;
  }
  .ingame-slide-overlay{
    border-radius:16px;
    background:linear-gradient(90deg,
      rgba(9, 13, 24, 0.96) 0%,
      rgba(9, 13, 24, 0.88) 42%,
      rgba(9, 13, 24, 0.45) 70%,
      transparent 92%
    );
  }
  .ingame-slide-character{
    top:-72px;
    height:calc(100% + 72px);
    width:min(74%,300px);
    max-width:74%;
    right:-6px;
  }
  .ingame-slide-character.character-genshin{
    top:-40px;
    right:16px;
    height:calc(100% + 40px);
  }
  .ingame-slide-character.character-fortnite,
  .ingame-slide-character.character-pubg,
  .ingame-slide-character.character-valorant{
    right:0;
  }
  .ingame-slide-character.character-fortnite{
    right:-20px;
  }
  .ingame-slide-character.character-valorant{
    width:min(56%,230px);
    max-width:56%;
    top:-40px;
    height:calc(100% + 40px);
    right:-12px;
  }
  .ingame-slide-bg[style*="background-image"]::after{
    display:block;
    background:linear-gradient(180deg,rgba(11,15,28,.45) 0%,rgba(11,15,28,.88) 50%,rgba(11,15,28,.98) 100%),
               linear-gradient(90deg,rgba(11,15,28,.85) 0%,rgba(11,15,28,.5) 100%);
  }
  .ingame-slide-content{
    max-width:68%;
    padding:20px 18px 22px;
    gap:5px;
  }
  .ingame-slide-game{
    font-size:11px;
    letter-spacing:.1em;
  }
  .ingame-slide-title{
    font-size:22px;
    line-height:1.15;
    margin:1px 0 3px;
  }
  .ingame-slide-desc{
    font-size:13px;
    line-height:1.45;
    margin-bottom:12px;
  }
  .ingame-slide-btn{
    min-height:44px;
    padding:11px 22px;
    font-size:14px;
  }
  .ingame-promo-dots{
    margin-top:12px;
  }
}

/* Narrow mobile screens (<=480px) */
@media(max-width:480px){
  .ingame-hero{
    width:calc(100% - 24px);
    margin:16px auto 16px;
    gap:18px;
  }
  .ingame-platforms-label{
    font-size:10px;
    letter-spacing:.08em;
    margin-bottom:10px;
  }
  .ingame-hero-title{
    font-size:clamp(24px,7.5vw,30px);
    line-height:1.15;
    margin-bottom:10px;
  }
  .ingame-hero-desc{
    font-size:13.5px;
    line-height:1.45;
    margin-bottom:14px;
  }
  .ingame-promo-wrap{
    padding-top:64px;
    margin-top:-40px;
  }
  .ingame-promo-card{
    border-radius:14px;
    min-height:220px;
  }
  .ingame-promo-slide{
    min-height:220px;
  }
  .ingame-slide-bg{
    border-radius:14px;
  }
  .ingame-slide-overlay{
    border-radius:14px;
    background:linear-gradient(90deg,
      rgba(9, 13, 24, 0.96) 0%,
      rgba(9, 13, 24, 0.85) 45%,
      rgba(9, 13, 24, 0.38) 72%,
      transparent 94%
    );
  }
  .ingame-slide-character{
    top:-64px;
    height:calc(100% + 64px);
    width:min(70%,280px);
    max-width:70%;
    right:-4px;
  }
  .ingame-slide-character.character-genshin{
    top:-34px;
    right:10px;
    height:calc(100% + 34px);
  }
  .ingame-slide-character.character-fortnite,
  .ingame-slide-character.character-pubg,
  .ingame-slide-character.character-valorant{
    right:0;
  }
  .ingame-slide-character.character-fortnite{
    right:-18px;
  }
  .ingame-slide-character.character-valorant{
    width:min(52%,200px);
    max-width:52%;
    top:-34px;
    height:calc(100% + 34px);
    right:-10px;
  }
  .ingame-slide-content{
    max-width:70%;
    padding:16px 14px 18px;
    gap:4px;
  }
  .ingame-slide-game{
    font-size:10.5px;
  }
  .ingame-slide-title{
    font-size:20px;
    margin:1px 0 2px;
  }
  .ingame-slide-desc{
    font-size:12.5px;
    line-height:1.4;
    margin-bottom:10px;
  }
  .ingame-slide-btn{
    min-height:42px;
    padding:10px 20px;
    font-size:13.5px;
    border-radius:9px;
  }
  .ingame-promo-dots{
    margin-top:10px;
  }
}

/* ── Ingame Catalog Section (sidebar + product grid) ─────── */
.ingame-catalog{
  width:min(calc(100% - 32px),var(--max));
  margin:0 auto 60px;
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  gap:32px;
  align-items:start;
  scroll-margin-top:100px;
}

/* ─ Sidebar ─ */
.ingame-sidebar{
  position:sticky;
  top:110px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.ingame-sidebar-label{
  font-size:11px;
  font-weight:800;
  color:#6b7280;
  letter-spacing:.18em;
  text-transform:uppercase;
  padding:0 6px;
  margin-bottom:2px;
}
.ingame-sidebar-nav{
  display:grid;
  gap:4px;
}
.ingame-sidebar-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 14px;
  border:1px solid transparent;
  border-radius:12px;
  color:#b3bdd1;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:.15s;
  text-decoration:none;
  background:transparent;
}
.ingame-sidebar-item:hover{
  background:rgba(255,255,255,.04);
  color:#e2e8f0;
}
.ingame-sidebar-item.is-active{
  background:rgba(139,92,246,.1);
  border-color:rgba(139,92,246,.35);
  color:#fff;
  box-shadow:0 0 18px rgba(139,92,246,.12), inset 0 0 0 1px rgba(139,92,246,.15);
}
.ingame-sidebar-icon{
  width:20px;
  height:20px;
  flex-shrink:0;
  opacity:.55;
}
.ingame-sidebar-item.is-active .ingame-sidebar-icon{
  opacity:1;
}

/* Sidebar CTA card */
.ingame-sidebar-cta{
  margin-top:12px;
  padding:24px 18px;
  border:1px dashed rgba(255,255,255,.12);
  border-radius:16px;
  background:rgba(255,255,255,.025);
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
.ingame-cta-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:linear-gradient(135deg,rgba(139,92,246,.22),rgba(34,211,238,.14));
  color:#c4b5fd;
  flex-shrink:0;
}
.ingame-cta-icon svg{
  width:22px;
  height:22px;
}
.ingame-sidebar-cta h3{
  margin:0;
  font-size:15px;
  font-weight:800;
  color:#fff;
}
.ingame-sidebar-cta p{
  margin:0;
  font-size:13px;
  color:var(--muted);
  line-height:1.45;
}
.ingame-cta-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:42px;
  padding:10px 16px;
  border:none;
  border-radius:12px;
  background:linear-gradient(135deg,var(--p),#6d5dfc 50%,var(--c));
  color:#fff;
  font-weight:800;
  font-size:14px;
  cursor:pointer;
  text-decoration:none;
  transition:.18s;
  box-shadow:0 8px 24px rgba(109,93,252,.3);
}
.ingame-cta-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(109,93,252,.42);
}

/* ─ Main content area ─ */
.ingame-main{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:20px;
}

.ingame-catalog{
  scroll-margin-top:90px;
}
/* Toolbar: title + search + sort */
.ingame-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.ingame-toolbar-left{
  display:flex;
  align-items:baseline;
  gap:10px;
}
.ingame-section-title{
  margin:0;
  font-size:clamp(24px,3vw,32px);
  font-weight:800;
  letter-spacing:-.03em;
  color:#fff;
  white-space:nowrap;
}
.ingame-products-counter{
  font-size:14px;
  font-weight:600;
  color:var(--muted);
}
.ingame-toolbar-controls{
  display:flex;
  align-items:center;
  gap:10px;
  flex-shrink:0;
}
.ingame-search{
  position:relative;
  display:flex;
  align-items:center;
}
.ingame-search-icon{
  position:absolute;
  left:12px;
  width:16px;
  height:16px;
  color:var(--muted);
  pointer-events:none;
}
.ingame-search-input{
  width:210px;
  min-height:40px;
  padding:9px 12px 9px 36px;
  border:1px solid var(--line);
  border-radius:11px;
  background:rgba(255,255,255,.04);
  color:#fff;
  font-size:14px;
  outline:none;
  transition:.15s;
}
.ingame-search-input::placeholder{
  color:var(--muted);
}
.ingame-search-input:focus{
  border-color:rgba(139,92,246,.55);
  background:rgba(255,255,255,.06);
  box-shadow:0 0 0 3px rgba(139,92,246,.1);
}
.ingame-sort{
  position:relative;
}
.ingame-sort-select{
  min-height:40px;
  padding:9px 36px 9px 14px;
  border:1px solid var(--line);
  border-radius:11px;
  background:rgba(255,255,255,.04) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%239ca8bf' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;
  color:#e2e8f0;
  font-size:14px;
  font-weight:600;
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
  outline:none;
  transition:.15s;
}
.ingame-sort-select:focus{
  border-color:rgba(139,92,246,.55);
  box-shadow:0 0 0 3px rgba(139,92,246,.1);
}

/* ─ Product grid ─ */
.ingame-products{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.ingame-product-card{
  display:flex;
  flex-direction:column;
  padding:16px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.03);
  transition:.2s;
}
.ingame-product-card:hover{
  border-color:rgba(255,255,255,.18);
  transform:translateY(-3px);
  box-shadow:0 16px 40px rgba(0,0,0,.3);
}
.ingame-product-head{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:4px;
}
.ingame-product-game-icon{
  width:24px;
  height:24px;
  border-radius:6px;
  object-fit:contain;
  flex-shrink:0;
  background:rgba(255,255,255,.06);
}
.ingame-product-game-name{
  font-size:12px;
  color:var(--muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ingame-product-title{
  margin:0 0 8px;
  font-size:15px;
  font-weight:800;
  color:#fff;
  line-height:1.3;
  height:2.6em;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.ingame-product-image{
  width:100%;
  aspect-ratio:1;
  border-radius:10px;
  margin-bottom:12px;
  background:rgba(255,255,255,.02);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  flex-shrink:0;
}
.ingame-product-image img{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:10px;
  display:block;
  padding:6px;
  box-sizing:border-box;
}
/* Placeholder for product image */
.ingame-product-image-placeholder{
  width:100%;
  aspect-ratio:1;
  border-radius:10px;
  margin-bottom:12px;
  background:linear-gradient(135deg,rgba(139,92,246,.12),rgba(34,211,238,.08));
  display:grid;
  place-items:center;
  color:rgba(255,255,255,.12);
  font-size:32px;
  flex-shrink:0;
}
.ingame-product-qty{
  font-size:13px;
  color:var(--muted);
  margin-bottom:8px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ingame-product-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-top:auto;
}
.ingame-product-price{
  display:flex;
  align-items:baseline;
  gap:5px;
}
.ingame-product-price-from{
  font-size:13px;
  color:var(--muted);
  font-weight:500;
}
.ingame-product-price-value{
  font-size:16px;
  font-weight:800;
  color:#fff;
}
.ingame-cart-btn{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(255,255,255,.04);
  color:#c8d4e6;
  cursor:pointer;
  transition:.18s;
  flex-shrink:0;
  padding:0;
}
.ingame-cart-btn:hover{
  background:linear-gradient(135deg,var(--p),#6d5dfc 50%,var(--c));
  border-color:transparent;
  color:#fff;
  box-shadow:0 6px 18px rgba(109,93,252,.3);
}
.ingame-cart-btn svg{
  width:16px;
  height:16px;
}

/* ── Mobile category chips (shown on mobile only) ── */
.ingame-mobile-cats{
  display:none;
  overflow-x:auto;
  gap:8px;
  padding:4px 0 8px;
  -ms-overflow-style:none;
  scrollbar-width:none;
}
.ingame-mobile-cats::-webkit-scrollbar{display:none}
.ingame-mobile-chip{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.04);
  color:#b3bdd1;
  font-size:13px;
  font-weight:600;
  white-space:nowrap;
  cursor:pointer;
  transition:.15s;
  flex-shrink:0;
  text-decoration:none;
}
.ingame-mobile-chip.is-active{
  background:linear-gradient(135deg,rgba(109,93,252,.25),rgba(56,189,248,.18));
  border-color:rgba(139,92,246,.55);
  color:#fff;
  box-shadow:0 0 16px rgba(109,93,252,.2);
}

/* Empty state for category */
.ingame-empty-state{
  grid-column:1/-1;
  width:100%;
  padding:48px 24px;
  text-align:center;
  background:rgba(255,255,255,.02);
  border:1px dashed rgba(255,255,255,.1);
  border-radius:16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
.ingame-empty-icon{
  font-size:36px;
  line-height:1;
  margin-bottom:4px;
  opacity:.8;
}
.ingame-empty-title{
  margin:0;
  font-size:18px;
  font-weight:700;
  color:#fff;
}
.ingame-empty-desc{
  margin:0;
  font-size:14px;
  color:var(--muted);
  max-width:380px;
  line-height:1.45;
}

/* ── Responsive ── */

/* Tablet */
@media(max-width:1024px){
  .ingame-catalog{
    grid-template-columns:200px minmax(0,1fr);
    gap:24px;
  }
  .ingame-products{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

/* Small tablet / large mobile */
@media(max-width:768px){
  .ingame-catalog{
    grid-template-columns:minmax(0,1fr);
  }
  .ingame-sidebar{
    display:none;
  }
  .ingame-mobile-cats{
    display:flex;
  }
  .ingame-products{
    display:flex;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    gap:12px;
    padding:4px 2px 14px;
    -webkit-overflow-scrolling:touch;
    -ms-overflow-style:none;
    scrollbar-width:none;
  }
  .ingame-products::-webkit-scrollbar{
    display:none;
  }
  .ingame-products .ingame-product-card{
    flex:0 0 170px;
    min-width:170px;
    scroll-snap-align:start;
    padding:14px;
  }
  .ingame-toolbar{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
    min-width:0;
  }
  .ingame-toolbar-controls{
    display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(128px,.9fr);
    align-items:stretch;
    width:100%;
    min-width:0;
    flex-shrink:1;
    gap:8px;
  }
  .ingame-search,
  .ingame-sort{
    min-width:0;
  }
  .ingame-search-input,
  .ingame-sort-select{
    width:100%;
    min-width:0;
  }
  .ingame-sort-select{
    padding:9px 28px 9px 10px;
    font-size:13px;
    background-position:right 8px center;
  }
  .ingame-sidebar-cta-mobile{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    padding:24px 18px;
    border:1px dashed rgba(255,255,255,.12);
    border-radius:16px;
    background:rgba(255,255,255,.025);
    text-align:center;
    margin-top:12px;
  }
  .ingame-sidebar-cta-mobile h3{
    margin:0;
    font-size:15px;
    font-weight:800;
    color:#fff;
  }
  .ingame-sidebar-cta-mobile p{
    margin:0;
    font-size:13px;
    color:var(--muted);
    line-height:1.45;
  }
}

/* Hide mobile CTA on desktop */
.ingame-sidebar-cta-mobile{
  display:none;
}
@media(max-width:768px){
  .ingame-sidebar-cta-mobile{
    display:flex;
  }
}

/* Very narrow mobile */
@media(max-width:380px){
  .ingame-products .ingame-product-card{
    flex:0 0 155px;
    min-width:155px;
    padding:12px;
  }
  .ingame-product-title{
    font-size:14px;
  }
  .ingame-product-price-value{
    font-size:15px;
  }
}

@media(prefers-reduced-motion:reduce){
  .ingame-promo-slides,
  .ingame-promo-slide,
  .ingame-slide-btn,
  .ingame-promo-dot{
    transition:none !important;
  }
}

/* ══ Promo Banner — Battle Pass (layout mirrors .ingame-promo-card) ══ */
.ingame-promo-banner{
  position:relative;
  width:min(calc(100% - 32px),var(--max));
  margin:48px auto;
  padding-top:96px;
  isolation:isolate;
  overflow:visible;
}
.promo-banner-card{
  position:relative;
  border-radius:20px;
  overflow:visible;
  min-height:280px;
  display:flex;
  align-items:flex-end;
  box-sizing:border-box;
  user-select:none;
  -webkit-user-select:none;
}
.promo-banner-bg{
  position:absolute;
  inset:0;
  border-radius:20px;
  overflow:hidden;
  z-index:1;
  background-color:#090d18;
  background-image:
    radial-gradient(ellipse 75% 72% at 90% 82%, rgba(14, 132, 188, 0.6) 0%, rgba(11, 88, 132, 0.32) 36%, rgba(6, 42, 75, 0.1) 60%, transparent 76%),
    radial-gradient(ellipse 70% 60% at 6% 8%, rgba(98, 48, 162, 0.48) 0%, rgba(56, 24, 102, 0.22) 42%, transparent 72%),
    linear-gradient(135deg, #17102b 0%, #0d1222 45%, #07101d 100%);
  background-size:cover;
  background-position:center right;
  background-repeat:no-repeat;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 24px 70px rgba(0,0,0,.45), 0 0 40px rgba(14,132,188,.08);
}
.promo-banner-overlay{
  position:absolute;
  inset:0;
  border-radius:20px;
  pointer-events:none;
  z-index:3;
  background:linear-gradient(90deg,
    #090d18 0%,
    rgba(9, 13, 24, 0.95) 32%,
    rgba(9, 13, 24, 0.72) 50%,
    rgba(9, 13, 24, 0.25) 70%,
    transparent 88%
  );
}
.promo-banner-character{
  position:absolute;
  top:-96px;
  right:-12px;
  bottom:0;
  height:calc(100% + 96px);
  width:min(85%,420px);
  max-width:85%;
  object-fit:contain;
  object-position:bottom right;
  z-index:4;
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
  filter:drop-shadow(0 14px 28px rgba(0,0,0,.55));
}
.promo-banner-content{
  position:relative;
  z-index:5;
  padding:28px 28px 34px;
  display:flex;
  flex-direction:column;
  gap:6px;
  max-width:58%;
  box-sizing:border-box;
}
.promo-banner-badge{
  font-size:13px;
  font-weight:600;
  color:rgba(255,255,255,.7);
  letter-spacing:.03em;
}
.promo-banner-title{
  margin:2px 0 4px;
  font-size:clamp(24px,2.8vw,32px);
  font-weight:800;
  color:#fff;
  line-height:1.1;
  letter-spacing:-.02em;
}
.promo-banner-subtitle{
  margin:0 0 12px;
  font-size:13px;
  color:rgba(255,255,255,.65);
  line-height:1.5;
}
.promo-banner-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:10px 26px;
  border-radius:12px;
  font-size:14px;
  font-weight:700;
  color:#fff;
  background:linear-gradient(90deg, #6644ff 0%, #5146f6 36%, #0ea5e9 100%);
  box-shadow:0 6px 20px rgba(99,102,241,.38);
  border:none;
  cursor:pointer;
  width:fit-content;
  transition:.18s ease;
  text-decoration:none;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
.promo-banner-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 28px rgba(99,102,241,.5);
}
.promo-banner-btn:active{
  transform:scale(.98);
}

@media(max-width:1150px){
  .promo-banner-character{
    top:-88px;
    height:calc(100% + 88px);
    width:min(82%,380px);
    max-width:82%;
    right:-10px;
  }
}

@media(max-width:980px){
  .ingame-promo-banner{
    padding-top:80px;
  }
  .promo-banner-content{
    max-width:62%;
  }
  .promo-banner-character{
    top:-80px;
    height:calc(100% + 80px);
    width:min(78%,340px);
    max-width:78%;
    right:-8px;
  }
}

@media(max-width:640px){
  .ingame-promo-banner{
    padding-top:72px;
    margin:32px auto;
  }
  .promo-banner-card{
    border-radius:16px;
    min-height:240px;
  }
  .promo-banner-bg,
  .promo-banner-overlay{
    border-radius:16px;
  }
  .promo-banner-overlay{
    background:linear-gradient(90deg,
      rgba(9, 13, 24, 0.96) 0%,
      rgba(9, 13, 24, 0.88) 42%,
      rgba(9, 13, 24, 0.45) 70%,
      transparent 92%
    );
  }
  .promo-banner-character{
    top:-72px;
    height:calc(100% + 72px);
    width:min(74%,300px);
    max-width:74%;
    right:-6px;
  }
  .promo-banner-content{
    max-width:68%;
    padding:20px 18px 22px;
    gap:5px;
  }
  .promo-banner-badge{
    font-size:11px;
    letter-spacing:.1em;
  }
  .promo-banner-title{
    font-size:22px;
    line-height:1.15;
    margin:1px 0 3px;
  }
  .promo-banner-subtitle{
    font-size:13px;
    line-height:1.45;
    margin-bottom:12px;
  }
  .promo-banner-btn{
    min-height:44px;
    padding:11px 22px;
    font-size:14px;
  }
}

@media(max-width:480px){
  .ingame-promo-banner{
    width:calc(100% - 24px);
    padding-top:64px;
    margin:24px auto;
  }
  .promo-banner-card{
    border-radius:14px;
    min-height:220px;
  }
  .promo-banner-bg,
  .promo-banner-overlay{
    border-radius:14px;
  }
  .promo-banner-overlay{
    background:linear-gradient(90deg,
      rgba(9, 13, 24, 0.96) 0%,
      rgba(9, 13, 24, 0.85) 45%,
      rgba(9, 13, 24, 0.38) 72%,
      transparent 94%
    );
  }
  .promo-banner-character{
    top:-64px;
    height:calc(100% + 64px);
    width:min(70%,280px);
    max-width:70%;
    right:-4px;
  }
  .promo-banner-content{
    max-width:70%;
    padding:16px 14px 18px;
    gap:4px;
  }
  .promo-banner-badge{
    font-size:10.5px;
  }
  .promo-banner-title{
    font-size:20px;
    margin:1px 0 2px;
  }
  .promo-banner-subtitle{
    font-size:12.5px;
    line-height:1.4;
    margin-bottom:10px;
  }
  .promo-banner-btn{
    min-height:42px;
    padding:10px 20px;
    font-size:13.5px;
    border-radius:9px;
  }
}

/* ══ POPULAR SECTIONS ════════════════════════════════════════ */
.ingame-popular {
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto 48px;
}
.ingame-popular-title {
  margin: 0 0 20px;
  font-size: clamp(20px, 3vw, 24px);
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.02em;
}
.ingame-popular-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  padding-top: 72px;
}
.ingame-popular-card {
  position: relative;
  display: flex;
  align-items: flex-end;
  overflow: visible;
  text-decoration: none;
  min-height: 220px;
  isolation: isolate;
  box-sizing: border-box;
}
.ingame-popular-bg {
  position: absolute;
  inset: 0;
  border-radius: 16px;
  overflow: hidden;
  z-index: 1;
  background-color: #090d18;
  background-image:
    radial-gradient(ellipse 75% 72% at 90% 82%, rgba(14, 132, 188, 0.6) 0%, rgba(11, 88, 132, 0.32) 36%, rgba(6, 42, 75, 0.1) 60%, transparent 76%),
    radial-gradient(ellipse 70% 60% at 6% 8%, rgba(98, 48, 162, 0.48) 0%, rgba(56, 24, 102, 0.22) 42%, transparent 72%),
    linear-gradient(135deg, #17102b 0%, #0d1222 45%, #07101d 100%);
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.4), 0 0 28px rgba(14, 132, 188, 0.06);
  transition: border-color 0.2s, box-shadow 0.2s;
}
.ingame-popular-card:hover .ingame-popular-bg {
  border-color: rgba(255, 255, 255, 0.16);
  box-shadow: 0 22px 48px rgba(0, 0, 0, 0.5), 0 0 32px rgba(14, 132, 188, 0.1);
}
.ingame-popular-overlay {
  position: absolute;
  inset: 0;
  border-radius: 16px;
  pointer-events: none;
  z-index: 3;
  background: linear-gradient(90deg,
    #090d18 0%,
    rgba(9, 13, 24, 0.95) 32%,
    rgba(9, 13, 24, 0.72) 50%,
    rgba(9, 13, 24, 0.25) 70%,
    transparent 88%
  );
}
.ingame-popular-character {
  position: absolute;
  top: -72px;
  right: -6px;
  bottom: 0;
  height: calc(100% + 72px);
  width: min(78%, 180px);
  max-width: 78%;
  object-fit: contain;
  object-position: bottom right;
  z-index: 4;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  filter: drop-shadow(0 12px 22px rgba(0, 0, 0, 0.5));
}
.ingame-popular-content {
  position: relative;
  z-index: 5;
  padding: 18px 16px 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: 62%;
  box-sizing: border-box;
}
.ingame-popular-name {
  margin: 0 0 6px;
  font-size: 19px;
  font-weight: 800;
  color: #fff;
  line-height: 1.15;
  letter-spacing: -0.02em;
}
.ingame-popular-desc {
  margin: 0 0 14px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.65);
  line-height: 1.4;
}
.ingame-popular-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 36px;
  padding: 8px 16px;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(90deg, #6644ff 0%, #5146f6 36%, #0ea5e9 100%);
  box-shadow: 0 6px 18px rgba(99, 102, 241, 0.32);
  transition: 0.18s ease;
}
.ingame-popular-link svg {
  width: 14px;
  height: 14px;
  transition: transform 0.2s;
}
.ingame-popular-card:hover .ingame-popular-link {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(99, 102, 241, 0.45);
}
.ingame-popular-card:hover .ingame-popular-link svg {
  transform: translateX(3px);
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .ingame-popular-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    padding-top: 64px;
  }
  .ingame-popular-character {
    top: -64px;
    height: calc(100% + 64px);
    width: min(74%, 200px);
  }
}

@media (max-width: 768px) {
  .ingame-popular {
    width: 100%;
    margin: 0 0 32px;
  }
  .ingame-popular-title {
    padding: 0 16px;
    font-size: 22px;
  }
  .ingame-popular-grid {
    display: flex;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    gap: 12px;
    padding: 64px 16px 12px;
    -ms-overflow-style: none;
    scrollbar-width: none;
    scroll-padding-left: 16px;
  }
  .ingame-popular-grid::-webkit-scrollbar {
    display: none;
  }
  .ingame-popular-card {
    flex: 0 0 calc(100% - 48px);
    scroll-snap-align: start;
    min-height: 220px;
  }
  .ingame-popular-character {
    top: -64px;
    height: calc(100% + 64px);
    width: min(70%, 240px);
    right: -4px;
  }
}

@media (max-width: 480px) {
  .ingame-popular-grid {
    padding-top: 56px;
  }
  .ingame-popular-card {
    flex: 0 0 calc(100% - 32px);
    min-height: 200px;
  }
  .ingame-popular-bg,
  .ingame-popular-overlay {
    border-radius: 14px;
  }
  .ingame-popular-character {
    top: -56px;
    height: calc(100% + 56px);
    width: min(68%, 220px);
  }
  .ingame-popular-content {
    max-width: 66%;
    padding: 16px 14px 18px;
  }
  .ingame-popular-name {
    font-size: 17px;
  }
  .ingame-popular-desc {
    font-size: 12px;
    margin-bottom: 12px;
  }
}
/* Update catalog-hcard design */
.catalog-hcard {
    background: linear-gradient(180deg, rgba(30,35,60,0.18), rgba(15,17,30,0.28)) !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 4px 20px rgba(0,0,0,0.3) !important;
    border-radius: 18px !important;
}

.catalog-hcard.is-active {
    background: linear-gradient(180deg, rgba(40,46,75,0.28), rgba(20,23,40,0.38)) !important;
    border: 1.5px solid #3b82f6 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 0 20px rgba(59,130,246,0.25), 0 4px 20px rgba(0,0,0,0.3) !important;
}

.catalog-hcard-thumb {
    position: absolute !important;
    bottom: -15px !important;
    right: -15px !important;
    width: 140px !important;
    height: 140px !important;
    background-image: var(--card-art, none);
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    opacity: 1 !important;
    z-index: 1 !important;
    pointer-events: none;
    filter: drop-shadow(0 0 15px rgba(139,92,246,0.4));
}

.catalog-hcard-topup .catalog-hcard-thumb {
    width: 200px !important;
    height: 200px !important;
    bottom: 20px !important;
    right: 10px !important;
}

.catalog-hcard-footer {
    z-index: 2 !important;
}

.catalog-hcard-info {
    z-index: 2 !important;
}

.catalog-hcard-arrow {
    background: #2d2a4a !important;
    border: none !important;
    box-shadow: none !important;
    color: #fff !important;
}

.catalog-hcard.is-active .catalog-hcard-arrow {
    background: linear-gradient(135deg, #3b82f6, #38bdf8) !important;
    box-shadow: 0 0 12px rgba(59,130,246,0.5) !important;
    border: none !important;
    color: #fff !important;
}
.catalog-hcard:hover {
    border-color: rgba(96, 165, 250, 0.4) !important;
    transform: translateY(-2px) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 10px 30px rgba(0, 0, 0, 0.45), 0 0 20px rgba(59, 130, 246, 0.12) !important;
}

.catalog-hcard.is-active:hover {
    border-color: #3b82f6 !important;
    transform: none !important;
}
@media(min-width:981px){
    .catalog-hcard {
        overflow: visible !important;
    }
}

/* ── Mobile Aside Navigation Dropdown ────────────────────────────── */
.side-dropdown-toggle {
    display: none;
}

@media (max-width: 980px) {
    .dashboard {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .side {
        position: relative !important;
        top: 0 !important;
        z-index: 10;
        padding: 12px 16px !important;
        border-radius: 16px !important;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025)) !important;
        border: 1px solid var(--line) !important;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
        margin-bottom: 14px !important;
    }

    .side > .side-title,
    .side > .profile,
    .side > .level {
        display: none !important;
    }

    .side-dropdown-toggle {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        background: none;
        border: none;
        padding: 2px 0;
        color: #fff;
        font-weight: 700;
        font-size: 15px;
        cursor: pointer;
        text-align: left;
        -webkit-tap-highlight-color: transparent;
    }

    .side-dropdown-label {
        display: flex;
        align-items: center;
        gap: 8px;
        flex-wrap: wrap;
        min-width: 0;
    }

    .side-dropdown-title {
        color: var(--muted);
        font-size: 13px;
        font-weight: 600;
    }

    .side-dropdown-active {
        color: #fff;
        font-weight: 800;
        background: linear-gradient(135deg, rgba(139, 92, 246, 0.35), rgba(34, 211, 238, 0.2));
        padding: 4px 12px;
        border-radius: 8px;
        border: 1px solid rgba(139, 92, 246, 0.45);
        font-size: 13px;
        box-shadow: 0 2px 8px rgba(139, 92, 246, 0.2);
    }

    .side-dropdown-arrow {
        transition: transform 0.25s ease, color 0.2s ease;
        color: var(--muted);
        flex-shrink: 0;
    }

    .side.is-dropdown-open .side-dropdown-arrow {
        transform: rotate(180deg);
        color: #fff;
    }

    .side nav {
        display: none;
        margin: 12px 0 4px !important;
        padding-top: 12px;
        border-top: 1px solid var(--line);
        gap: 6px !important;
    }

    .side.is-dropdown-open nav {
        display: grid !important;
    }

    .side nav a {
        display: flex;
        align-items: center;
        padding: 10px 14px !important;
        border-radius: 10px !important;
        font-size: 14px !important;
        font-weight: 600;
        color: #c1cadb !important;
        transition: background 0.15s ease, color 0.15s ease;
    }

    .side nav a.active,
    .side nav a:hover {
        background: rgba(139, 92, 246, 0.18) !important;
        color: #fff !important;
    }
}

/* ══ ADMIN TIER MANAGEMENT STYLES ══════════════════════════════════ */
.tier-admin-section {
    display: grid;
    gap: 12px;
}
.tier-admin-list {
    display: grid;
    gap: 10px;
}
.tier-admin-row {
    display: flex;
    align-items: flex-end;
    gap: 12px 15px;
    padding: 16px 14px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--line);
    border-radius: 12px;
    transition: background 0.15s, border-color 0.15s, transform 0.15s;
    flex-wrap: wrap;
}
.tier-admin-row:hover {
    border-color: rgba(139, 92, 246, 0.35);
    background: rgba(255, 255, 255, 0.05);
}
.tier-admin-row.is-dragging {
    opacity: 0.4;
    border-style: dashed;
}
.tier-drag-handle {
    cursor: grab;
    user-select: none;
    font-size: 18px;
    color: var(--muted);
    padding: 0 4px;
    line-height: 1;
    margin-bottom: 12px;
}
.tier-drag-handle:active {
    cursor: grabbing;
}
.tier-field {
    min-width: 0;
}
.tier-field input[type="text"],
.tier-field input[type="number"] {
    width: 100%;
    box-sizing: border-box;
}
.tier-field-amount { width: 160px; }
.tier-field-label { width: 140px; }
.tier-field-price { width: 110px; }
.tier-field-icon { width: 180px; }
.tier-field-actions { margin-left: auto; margin-bottom: 2px; }

.tier-icon-picker {
    display: flex;
    align-items: center;
    gap: 8px;
}
.tier-icon-preview {
    width: 28px;
    height: 28px;
    object-fit: contain;
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--line);
}
.btn-danger {
    color: #f87171 !important;
}
.btn-danger:hover {
    background: rgba(239, 68, 68, 0.15) !important;
    border-color: rgba(239, 68, 68, 0.4) !important;
}


