/* Storefront additions. Existing support and admin styles remain in styles.css. */
.store-body { font-size: 16px; }
.store-body main { overflow: clip; }
.store-body .shell { width: min(1240px, calc(100% - 48px)); }
.store-body .nav { gap: 22px; height: 84px; }
.store-body .nav-links { gap: 26px; }
.store-body .nav-links a { font-size: 14px; }
.store-body .nav-links a.active:after { display: none; }
.account-actions { display: flex; align-items: center; gap: 23px; }
.sign-in { color: #b8c9dd; text-decoration: none; font-size: 14px; font-weight: 600; }
.store-body .btn { min-height: 46px; font-size: 14px; line-height: 1.4; }
.store-body .kicker { font-size: 12px; line-height: 1.5; letter-spacing: .15em; }
.store-body .section { padding: 88px 0; scroll-margin-top: 92px; }
.store-body .section-heading { margin-bottom: 36px; }
.store-body .section-heading h2 { font-size: clamp(32px, 4.5vw, 56px); line-height: 1.07; }
.store-body .section-heading > p { font-size: 16px; }
.store-body p { line-height: 1.7; }
.store-body a:focus-visible, .store-body button:focus-visible, .store-body summary:focus-visible, .store-body input:focus-visible { outline: 2px solid #76d3ff; outline-offset: 4px; }
.skip-link { position: fixed; top: -80px; left: 20px; background: #fff; color: #030711; padding: 16px; z-index: 99; }
.skip-link:focus { top: 10px; }
.store-hero { display: grid; grid-template-columns: 1.3fr 1fr; gap: 65px; padding: 162px 0 72px; position: relative; align-items: center; }
.store-hero > div:not(.hero-glow), .hero-offer { position: relative; }
.store-hero h1 { font: 700 clamp(48px, 5.8vw, 76px)/1.05 var(--display); letter-spacing: -.065em; margin: 23px 0; }
.store-hero h1 span { color: #2aa4ff; }
.store-hero p { max-width: 535px; color: #9bafc6; font-size: 17px; }
.store-hero .hero-actions { justify-content: flex-start; }
.hero-footnote { display: flex; gap: 18px; flex-wrap: wrap; color: #8398b2; font-size: 12px; margin-top: 35px; }
.hero-offer { border: 1px solid #174776; background: linear-gradient(135deg, #091c33, #060d19 70%); box-shadow: 0 35px 85px #0006, 0 0 80px #008cff09; padding: 26px; }
.offer-heading { display: flex; justify-content: space-between; gap: 16px; font-size: 12px; letter-spacing: .12em; color: #8ebcde; }
.offer-brand { font: 700 clamp(64px, 8vw, 118px)/1 var(--display); letter-spacing: -.075em; text-align: center; color: #c5eaff; padding: 36px 0 24px; }
.offer-brand span { display: block; margin-top: 13px; font: 500 12px/1.5 var(--font); letter-spacing: .19em; color: #6591b4; }
.hero-offer > a { display: flex; justify-content: space-between; gap: 20px; text-decoration: none; border-top: 1px solid #26445c; padding: 18px 0; color: #e9f6ff; font-size: 16px; }
.hero-offer > a:hover { color: #54beff; }
.hero-offer > a b span { padding-left: 15px; color: #269fff; }
.hero-offer > small { display: block; color: #8da6bd; font-size: 12px; margin-top: 10px; }
.catalog-section { border-top: 1px solid var(--line); }
.catalog-notice { border-left: 2px solid #1766a6; padding: 6px 0 6px 14px; color: #9eb2c9; font-size: 14px; margin: 0 0 28px; }
.products-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.product-card { border: 1px solid #1b2b40; background: #070f1b; transition: border-color .2s, transform .2s; }
.product-card:hover { border-color: #276499; transform: translateY(-4px); }
.product-visual { min-height: 208px; padding: 20px 24px; display: flex; flex-direction: column; position: relative; border-bottom: 1px solid #233a53; background: radial-gradient(ellipse at 75% 80%, #0062ca55, transparent 65%), linear-gradient(145deg, #10243b, #070f1b); overflow: hidden; }
.product-visual.tone-02 { background: radial-gradient(ellipse at 30% 10%, #069cd044, transparent 70%), #081322; }
.product-visual.tone-03 { background: radial-gradient(ellipse at 90% 50%, #2252d855, transparent 65%), #0a1224; }
.product-visual > span { font-size: 12px; color: #94b9dd; letter-spacing: .2em; }
.product-visual b { font: 600 102px/1 var(--display); letter-spacing: -.05em; align-self: flex-end; color: #6bb8fc; margin: 4px 0; opacity: .55; }
.product-visual small { font-size: 12px; color: #7196b6; letter-spacing: .22em; }
.product-content { padding: 25px; }
.sample-tag { color: #88aac8; font-size: 12px; border: 1px solid #253c53; display: inline-block; padding: 5px 8px; }
.product-content h3 { font: 600 28px var(--display); margin: 18px 0 10px; }
.product-content p { font-size: 16px; color: #91a6bd; margin-bottom: 25px; }
.product-bottom { display: flex; justify-content: space-between; gap: 16px; align-items: flex-end; padding-top: 23px; border-top: 1px solid var(--line); flex-wrap: wrap; }
.product-bottom small { font-size: 12px; display: block; color: #9eb3ca; }
.product-bottom strong { display: block; font: 600 29px var(--display); margin: 4px 0; }
.product-bottom strong span { font-size: 19px; }
.product-bottom .btn { padding: 10px 14px; }
.plans-section { background: linear-gradient(180deg, #060e1b, #07101e 50%, #040a14); border-block: 1px solid #12283e; }
.plans-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.plan-card { border: 1px solid #233247; background: #07111e; padding: 30px; }
.plan-featured { background: linear-gradient(150deg, #08274a, #081321 70%); border-color: #148bed; box-shadow: 0 0 35px #008cff0f; }
.plan-top { display: flex; justify-content: space-between; font-size: 12px; letter-spacing: .12em; color: #8ba7c1; min-height: 22px; gap: 10px; }
.plan-featured .plan-top { color: #61bcff; }
.plan-card h3 { font: 600 26px var(--display); margin: 24px 0 26px; }
.plan-price { font: 600 64px/1 var(--display); letter-spacing: -.06em; }
.plan-price > span { font-size: 22px; color: #90a5ba; letter-spacing: -.02em; }
.plan-price small { font-size: 27px; }
.plan-period { color: #9eafc4; font-size: 14px; margin: 9px 0 21px; }
.plan-note { border-bottom: 1px solid #273a50; padding-bottom: 23px; font-size: 14px; color: #a3bdd5; min-height: 72px; }
.plan-card ul { list-style: none; margin: 24px 0 30px; padding: 0; }
.plan-card li { font-size: 14px; padding: 8px 0; color: #b5c5d6; line-height: 1.4; }
.plan-card li:before { content: '✓'; color: #2fafff; margin-right: 10px; }
.plan-card .btn { width: 100%; }
.store-body .testimonial { padding: 28px; }
.store-body .testimonial blockquote { font-size: 16px; }
.store-body .testimonial footer b { font-size: 14px; }
.store-body .testimonial footer small { font-size: 12px; color: #94a7bd; }
.store-body .stars { font-size: 14px; }
.store-body .avatar { font-size: 14px; }
.store-body .page-hero { padding: 146px 0 60px; }
.store-body .page-hero h1 { font-size: clamp(42px, 6.3vw, 72px); line-height: 1.04; }
.store-body .page-hero:after { display: none; }
.catalog-toolbar { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 25px; font-size: 14px; color: #a8bdd3; }
.selection-banner { padding: 16px; border: 1px solid #1e6ba1; background: #092847; color: #bae4ff; font-size: 14px; line-height: 1.6; margin-bottom: 24px; }
.store-body .footer { grid-template-columns: .7fr 1fr 1.6fr; gap: 22px; padding-bottom: 100px; }
.store-body .footer > div { flex-wrap: wrap; gap: 16px; }
.store-body .footer a { font-size: 14px; }
.store-body .footer p, .store-body .footer small { font-size: 12px; color: #8a9fb6; }
.store-body .support-fab { font-size: 14px; }
.store-body .join-form label, .store-body .join-form input, .store-body .join-form textarea, .store-body .join-form select { font-size: 16px; }
.store-body .demo-note { font-size: 12px !important; }
.store-body .chat-status { font-size: 12px; }
.store-body .demo-warning { font-size: 14px; }
.store-body .chat-setup label { font-size: 14px; }
.store-body .chat-setup input, .store-body .chat-setup select, .store-body .message-form input { font-size: 16px; }
.store-body .message p { font-size: 16px; overflow-wrap: anywhere; }
.store-body .message small { font-size: 12px; }
.store-body .support-points small { font-size: 14px; }
.store-body .support-points b { font-size: 16px; }
.auth-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: center; padding: 140px 0 75px; min-height: 88vh; }
.auth-story h1 { font: 600 clamp(38px, 5vw, 64px)/1.1 var(--display); letter-spacing: -.05em; margin: 24px 0; }
.auth-story > p { color: #96acc5; font-size: 17px; max-width: 440px; }
.auth-wordmark { width: clamp(130px, 14vw, 190px); margin: 32px 0; }
.auth-wordmark img { display: block; width: 100%; height: auto; filter: drop-shadow(0 18px 35px #0008); }
.auth-card { background: #07101e; border: 1px solid #1a3652; padding: 34px; box-shadow: 0 30px 70px #0004; }
.auth-tabs { display: flex; border-bottom: 1px solid #27384c; margin-bottom: 30px; }
.auth-tabs a { color: #91a8bf; width: 50%; text-align: center; padding: 14px; font-size: 16px; text-decoration: none; }
.auth-tabs a[aria-current] { color: #fff; border-bottom: 2px solid #009dff; }
.auth-card h2 { font: 600 30px var(--display); margin: 0 0 10px; }
.auth-card > p { font-size: 16px; color: #93a9c0; }
.auth-notice { font-size: 13px; line-height: 1.6; padding: 14px; border-left: 2px solid #3471a3; background: #0d2035; color: #a7bfd6; margin: 20px 0; }
.account-form { display: flex; flex-direction: column; gap: 9px; }
.account-form label { margin-top: 9px; color: #c0cede; font-size: 14px; }
.account-form input { padding: 14px; font-size: 16px; color: #fff; background: #030a14; border: 1px solid #293d54; min-width: 0; width: 100%; border-radius: 2px; }
.password-input { display: flex; border: 1px solid #293d54; border-radius: 2px; background: #030a14; }
.password-input input { border: 0; flex: 1; }
.password-input button { color: #7cc7ff; background: none; border: 0; cursor: pointer; padding: 10px 14px; font-size: 12px; }
.account-form .btn { margin-top: 18px; }
.auth-forgot { align-self: flex-end; color: #7cc7ff; font-size: 14px; text-decoration: none; padding: 9px 0; }
.auth-switch { text-align: center; padding-top: 12px; font-size: 14px !important; }
.auth-switch a { color: #71c4ff; }
.auth-result { padding: 14px; border: 1px solid #4978a3; color: #c2e4ff; background: #10273e; font-size: 14px; line-height: 1.6; }
.product-dialog { color: #fff; background: #07101e; border: 1px solid #22689e; padding: 32px; width: min(600px, calc(100% - 32px)); max-height: 90dvh; overflow-y: auto; }
.product-dialog::backdrop { background: #010611db; backdrop-filter: blur(7px); }
.product-dialog h2 { font: 600 30px var(--display); margin: 22px 0 12px; }
.product-dialog p { color: #9eb5cc; font-size: 16px; }
.product-dialog .close-product { position: absolute; right: 16px; top: 12px; border: 0; background: none; color: #fff; font-size: 26px; cursor: pointer; min-width: 44px; min-height: 44px; }
.product-dialog fieldset { border: 0; margin: 24px 0; padding: 0; }
.product-dialog legend { font-size: 14px; color: #a8bfd6; margin-bottom: 10px; }
.plan-option { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 17px; border: 1px solid #253e55; margin-bottom: 9px; cursor: pointer; font-size: 16px; }
.plan-option:has(input:checked) { border-color: #1599ff; background: #082a49; }
.plan-option > span { display: flex; align-items: center; gap: 10px; }
.plan-option input { width: 18px; height: 18px; accent-color: #0c9bff; }
.order-total { display: flex; justify-content: space-between; gap: 15px; padding: 16px 0; border-top: 1px solid #233c55; font-size: 16px; }
.order-total b { color: #61bfff; }
.product-dialog .btn { width: 100%; }
.product-dialog .catalog-notice { font-size: 13px; }
.product-dialog .existing-account { text-align: center; font-size: 14px; }
.existing-account a { color: #79c6ff; }
@media (max-width: 1080px) {
 .store-body .nav-links { gap: 16px; }
 .store-body .nav { gap: 16px; }
 .account-actions { gap: 14px; }
 .store-hero { gap: 35px; }
 .plan-card, .product-content { padding: 23px; }
 .auth-layout { gap: 38px; }
}
@media (max-width: 920px) {
 .store-body .nav-links { display: none; }
 .store-body .account-actions { margin-left: auto; }
 .store-body .menu-button { display: block; }
 .store-body .menu-button span { width: 22px; height: 1px; background: white; display: block; margin: 6px; }
 .store-body .menu-button { border: 0; background: none; min-width: 38px; min-height: 44px; }
 .store-body .mobile-menu { display: flex; top: 84px; flex-direction: column; gap: 18px; background: #050c17; padding: 24px; position: absolute; left: 0; right: 0; transform-origin: top; transform: scaleY(0); opacity: 0; max-height: calc(100dvh - 84px); overflow: auto; }
 .store-body .mobile-menu.open { transform: scaleY(1); opacity: 1; }
 .store-body .mobile-menu a { color: #c1d2e6; text-decoration: none; font-size: 16px; }
 .store-hero, .auth-layout { grid-template-columns: 1fr; }
 .hero-offer { max-width: 540px; width: 100%; }
 .store-hero h1 { max-width: 700px; }
 .products-grid, .plans-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .auth-wordmark { display: none; }
 .auth-story .text-link { display: inline-block; margin-top: 12px; }
 .auth-card { max-width: 600px; width: 100%; }
 .store-body .footer { grid-template-columns: 1fr; text-align: center; }
 .store-body .footer > div { justify-content: center; }
}
@media (max-width: 620px) {
 .store-body .shell { width: calc(100% - 32px); }
 .store-body .nav { gap: 10px; }
 .store-body .brand { gap: 6px; font-size: 16px; }
 .account-actions { gap: 10px; }
 .account-actions .btn { font-size: 13px; padding: 10px; }
 .account-actions .btn span { display: none; }
 .sign-in { font-size: 13px; }
 .store-hero { padding-top: 126px; }
 .store-hero h1 { font-size: clamp(39px, 10vw, 56px); }
 .store-body .section { padding: 58px 0; }
 .store-body .section-heading { display: block; }
 .store-body .section-heading > .text-link { display: inline-block; margin-top: 20px; }
 .products-grid, .plans-grid { grid-template-columns: 1fr; }
 .product-visual { min-height: 190px; }
 .plan-card { padding: 28px; }
 .hero-footnote { gap: 10px; flex-direction: column; }
 .auth-layout { padding-top: 123px; gap: 28px; }
 .auth-card { padding: 24px; }
 .product-dialog { padding: 24px; }
 .store-body .chat-setup { padding: 25px; }
 .store-body .chat-card > header { padding: 0 16px; gap: 12px; }
 .catalog-toolbar { flex-wrap: wrap; }
 .store-body .support-fab { width: 48px; height: 48px; border-radius: 50%; justify-content: center; padding: 0; }
 .store-body .support-fab span:first-child { display: inline; font-size: 28px; }
 .store-body .support-fab span:last-child { display: none; }
}
@media (prefers-reduced-motion: reduce) {
 .product-card { transition: none; }
}

/* Counter-Strike product art direction */
.store-hero { width: 100%; min-height: 790px; padding: 84px 0 0; display: block; position: relative; isolation: isolate; border-bottom: 1px solid #14304b; background: #030811; }
.hero-backdrop { position: absolute; inset: 0; z-index: -3; background-image: linear-gradient(90deg, #020711 3%, #020711e8 34%, #02071180 63%, #020711e3 100%), linear-gradient(0deg, #030811 0%, transparent 42%), url('assets/cs2-action.jpg'); background-size: cover; background-position: center; filter: saturate(.8) contrast(1.08); }
.hero-backdrop:after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 74% 42%, #008cff2a, transparent 25%), linear-gradient(120deg, transparent 55%, #008cff14); mix-blend-mode: screen; }
.hero-grid { position: absolute; inset: 0; z-index: -2; opacity: .16; background-image: linear-gradient(#4aaeff33 1px, transparent 1px), linear-gradient(90deg, #4aaeff33 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(90deg, #000 0%, transparent 72%); }
.hero-shell { min-height: 706px; position: relative; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(370px, .7fr); gap: 74px; align-items: center; padding: 70px 0 100px; }
.hero-copy { max-width: 710px; }
.hero-status { display: flex; justify-content: space-between; gap: 24px; max-width: 550px; margin-bottom: 48px; color: #7f99b5; font-size: 12px; letter-spacing: .16em; }
.hero-status i { display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: #21a9ff; box-shadow: 0 0 14px #21a9ff; animation: dma-pulse 2.3s ease-in-out infinite; }
.store-hero h1 { font: 700 clamp(58px, 7vw, 96px)/.9 var(--display); letter-spacing: -.075em; margin: 21px 0 28px; text-shadow: 0 12px 44px #000; }
.store-hero h1 span { color: #22a5ff; text-shadow: 0 0 38px #008cff44; }
.store-hero p { max-width: 590px; color: #afc2d6; font-size: 18px; text-shadow: 0 2px 20px #000; }
.store-hero .hero-actions { justify-content: flex-start; margin-top: 34px; }
.hero-metrics { display: flex; margin-top: 50px; border-top: 1px solid #37608088; max-width: 590px; }
.hero-metrics div { flex: 1; padding: 19px 18px 0 0; border-right: 1px solid #37608088; }
.hero-metrics div + div { padding-left: 22px; }
.hero-metrics b { display: block; font: 600 24px/1 var(--display); color: #e8f6ff; }
.hero-metrics span { display: block; margin-top: 8px; color: #7892ad; text-transform: uppercase; letter-spacing: .12em; font-size: 11px; }
.hero-loadout { position: relative; align-self: center; border: 1px solid #368dd0a8; background: linear-gradient(145deg, #06111ee8, #061528c7); box-shadow: 0 32px 90px #000a, inset 0 0 55px #0b77d111; backdrop-filter: blur(12px); padding: 24px; clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%); }
.hero-loadout:before { content: ''; position: absolute; top: 0; right: 0; width: 24px; height: 24px; background: #148fe0; opacity: .7; clip-path: polygon(0 0, 100% 100%, 100% 0); }
.loadout-top { display: flex; justify-content: space-between; gap: 15px; color: #77a3c7; font-size: 10px; letter-spacing: .16em; }
.loadout-mark { text-align: center; padding: 43px 0 36px; }
.loadout-mark small, .loadout-mark span { display: block; color: #6d9abd; letter-spacing: .2em; font-size: 10px; }
.loadout-mark strong { display: block; font: 700 clamp(72px, 8vw, 108px)/.9 var(--display); color: #dff4ff; letter-spacing: -.09em; margin: 8px 0 17px; text-shadow: 0 0 35px #148fe066; }
.loadout-plans { border-top: 1px solid #1f4f73; }
.loadout-plans a { color: #d9ecfb; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 17px 5px; border-bottom: 1px solid #1f4f73; text-decoration: none; font-size: 13px; letter-spacing: .05em; transition: background .2s, padding .2s; }
.loadout-plans a:hover { padding-inline: 13px; background: #1188e016; }
.loadout-plans a.featured { color: #55bdff; }
.loadout-plans em { font-style: normal; color: #07101d; background: #32adff; padding: 4px 6px; margin-left: 7px; font-size: 9px; font-weight: 800; }
.loadout-features { border-top: 1px solid #1f4f73; }
.loadout-features > span { display: grid; grid-template-columns: 34px 1fr; gap: 3px 12px; padding: 17px 5px; border-bottom: 1px solid #1f4f73; }
.loadout-features i { grid-row: 1 / 3; align-self: center; color: #269fe9; font: 600 17px var(--display); font-style: normal; }
.loadout-features b { color: #d9ecfb; font-size: 12px; letter-spacing: .1em; }
.loadout-features small { color: #7590aa; font-size: 11px; }
.round-bar { position: absolute; left: 0; right: 0; bottom: 26px; display: flex; align-items: center; gap: 22px; color: #6987a3; font-size: 10px; letter-spacing: .18em; }
.round-line { height: 1px; background: #2e5879; flex: 1; }
.round-bar b { color: #2aabff; font-size: 18px; margin-left: 9px; }
.single-product { border-top: 0; }
.product-showcase { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(350px, .75fr); min-height: 560px; border: 1px solid #1a405f; background: #07101c; box-shadow: 0 38px 100px #0005; overflow: hidden; }
.product-shot { min-height: 500px; position: relative; background-image: linear-gradient(90deg, transparent 30%, #07101c 100%), linear-gradient(0deg, #06101e 0%, transparent 45%), url('assets/cs2-hero.jpg'); background-size: cover; background-position: 67% center; overflow: hidden; }
.product-shot:before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 51% 47%, transparent 0 16%, #03101a22 38%, #03101a7d 100%), linear-gradient(130deg, #008cff22, transparent 35%); }
.shot-hud { position: absolute; left: 22px; right: 22px; top: 20px; display: flex; justify-content: space-between; color: #a8cee9; font-size: 10px; letter-spacing: .2em; }
.shot-crosshair { position: absolute; width: 52px; height: 52px; left: 50%; top: 50%; transform: translate(-50%, -50%); border: 1px solid #66c7ff9c; border-radius: 50%; box-shadow: 0 0 35px #0099ff38; }
.shot-crosshair:before, .shot-crosshair:after { content: ''; position: absolute; background: #7bcfff; }
.shot-crosshair:before { width: 72px; height: 1px; left: -11px; top: 25px; }
.shot-crosshair:after { width: 1px; height: 72px; top: -11px; left: 25px; }
.shot-caption { position: absolute; left: 25px; bottom: 24px; padding: 9px 12px; border-left: 2px solid #22a9ff; background: #030911ba; color: #d8efff; font-size: 11px; letter-spacing: .17em; }
.product-details { padding: 54px 42px; display: flex; flex-direction: column; justify-content: center; }
.product-details h3, .product-details h2 { font: 600 clamp(35px, 4vw, 52px)/1.04 var(--display); letter-spacing: -.05em; margin: 23px 0 18px; }
.product-details p { color: #92a9c0; font-size: 16px; }
.feature-strip { margin: 24px 0 30px; display: grid; gap: 1px; background: #1a344b; }
.feature-strip span { display: flex; gap: 17px; padding: 13px 0; color: #368fd2; background: #07101c; font-size: 12px; }
.feature-strip b { color: #c1d8e9; font-weight: 500; }
.product-details .product-bottom { margin-top: auto; }
.product-action { align-items: center; }
.product-action p { max-width: 230px; margin: 0; font-size: 13px; line-height: 1.55; }
.legal-note { color: #5f7690 !important; font-size: 12px !important; margin-top: 16px; }
.game-world { position: relative; background: #030914; border-block: 1px solid #132b42; }
.game-world:before { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 16% 24%, #087dcc18, transparent 25%), linear-gradient(90deg, transparent 49.9%, #1b4c7126 50%, transparent 50.1%); }
.game-world .shell { position: relative; }
.game-gallery { display: grid; grid-template-columns: 1.35fr .8fr .72fr; grid-template-rows: 520px; gap: 18px; }
.gallery-main, .gallery-team { position: relative; overflow: hidden; border: 1px solid #245170; background-size: cover; background-position: center; isolation: isolate; }
.gallery-main { background-image: url('assets/cs2-tactical.jpg'); }
.gallery-team { background-image: url('assets/cs2-team.jpg'); background-position: 70% center; }
.gallery-main:before, .gallery-team:before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, #020914f2 0%, #0209140c 68%), linear-gradient(120deg, #008cff24, transparent 45%); }
.gallery-hud { position: absolute; top: 18px; left: 18px; right: 18px; display: flex; justify-content: space-between; align-items: center; color: #c6e9ff; font-size: 10px; letter-spacing: .15em; }
.gallery-hud b { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid #55bdff; background: #061321b8; color: #48b7ff; font: 600 17px var(--display); }
.gallery-copy { position: absolute; left: 26px; right: 26px; bottom: 25px; }
.gallery-copy small { color: #51b9ff; font-size: 10px; letter-spacing: .18em; }
.gallery-copy h3 { font: 600 clamp(24px, 3vw, 39px)/1.08 var(--display); letter-spacing: -.04em; margin: 10px 0; }
.gallery-copy p { color: #a9bfd3; max-width: 490px; font-size: 14px; line-height: 1.6; }
.gallery-team .gallery-copy h3 { font-size: 28px; }
.gallery-data { border: 1px solid #1a3e5c; background: linear-gradient(150deg, #071a2c, #050d18); padding: 34px 28px; display: flex; flex-direction: column; }
.gallery-data h3 { font: 600 clamp(29px, 3vw, 39px)/1.08 var(--display); letter-spacing: -.045em; margin: 27px 0; }
.gallery-data ul { list-style: none; margin: 0 0 35px; padding: 0; }
.gallery-data li { border-top: 1px solid #1d3c55; padding: 16px 0; color: #aec3d6; font-size: 13px; }
.gallery-data li:last-child { border-bottom: 1px solid #1d3c55; }
.gallery-data li b { color: #279eea; margin-right: 12px; }
.gallery-data .text-link { margin-top: auto; }
.product-page-hero { width: 100%; max-width: none; min-height: 570px; display: flex; align-items: center; position: relative; background-image: linear-gradient(90deg, #030811 4%, #030811df 46%, #0308118c 74%, #030811 100%), linear-gradient(0deg, #030811, transparent 55%), url('assets/cs2-hero.jpg'); background-size: cover; background-position: center; border-bottom: 1px solid #14304b; }
.product-page-hero:before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 70% 42%, #008cff21, transparent 27%); }
.product-page-hero > .shell { position: relative; padding-top: 55px; }
.product-page-hero h1 { margin-block: 20px; }
.product-page-hero p { max-width: 560px; }
.product-page-hero .hero-actions { justify-content: flex-start; }
.product-page-card { min-height: 590px; }
@keyframes dma-pulse { 50% { opacity: .4; box-shadow: 0 0 4px #21a9ff; } }

@media (max-width: 920px) {
 .store-hero { min-height: 0; }
 .hero-shell { grid-template-columns: 1fr; gap: 42px; padding-top: 80px; }
 .hero-loadout { max-width: 560px; }
 .product-showcase { grid-template-columns: 1fr; }
 .product-shot { min-height: 430px; background-image: linear-gradient(0deg, #07101c 0%, transparent 55%), url('assets/cs2-hero.jpg'); }
 .round-bar { position: static; grid-column: 1; margin-top: 0; }
 .game-gallery { grid-template-columns: 1.3fr .7fr; grid-template-rows: 430px auto; }
 .gallery-data { grid-column: 1 / -1; min-height: 320px; }
}
@media (max-width: 620px) {
 .store-hero { padding-top: 84px; }
 .hero-shell { padding: 55px 0 65px; }
 .hero-status { margin-bottom: 34px; }
 .store-hero h1 { font-size: clamp(48px, 15vw, 68px); }
 .store-hero p { font-size: 16px; }
 .hero-metrics div { padding-right: 8px; }
 .hero-metrics div + div { padding-left: 12px; }
 .hero-metrics span { letter-spacing: .06em; }
 .hero-loadout { padding: 18px; }
 .loadout-mark { padding: 34px 0 28px; }
 .round-bar { display: none; }
 .product-shot { min-height: 320px; background-position: 63% center; }
 .product-details { padding: 34px 24px; }
 .product-page-hero { min-height: 630px; }
 .game-gallery { grid-template-columns: 1fr; grid-template-rows: 390px 390px auto; }
 .gallery-data { grid-column: auto; min-height: 350px; }
 .gallery-main, .gallery-team { background-position: center; }
 .gallery-team { background-position: 66% center; }
}
@media (prefers-reduced-motion: reduce) { .hero-status i { animation: none; } }

/* User-supplied visual layer */
.hero-backdrop { background-image: linear-gradient(90deg, #020711 2%, #020711e8 38%, #02071165 72%, #020711cf 100%), linear-gradient(0deg, #030811 0%, transparent 46%), url('assets/dma-user-scene.jpeg'); background-position: center; filter: saturate(.82) contrast(1.08); }
.hero-backdrop:after { background: radial-gradient(circle at 79% 48%, #008cff24, transparent 25%), linear-gradient(110deg, transparent 48%, #007fd51c 76%, transparent); }
.single-product { position: relative; isolation: isolate; }
.single-product:before { content: ''; position: absolute; z-index: -2; top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%); background-color: #040a13; background-image: linear-gradient(90deg, #040a13 0%, #040a13f5 43%, #07111dd1 67%, #06111b 100%), radial-gradient(circle at 77% 48%, #008cff2c, transparent 27%), url('assets/dma-user-squad.jpeg'); background-repeat: no-repeat; background-size: cover, cover, min(930px, 62vw) auto; background-position: center, center, right bottom; background-blend-mode: normal, screen, multiply; border-bottom: 1px solid #142d43; }
.single-product:after { content: ''; position: absolute; z-index: -1; inset: 0; pointer-events: none; background-image: linear-gradient(#45b5ff0d 1px, transparent 1px), linear-gradient(90deg, #45b5ff0d 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(90deg, #000 0%, transparent 82%); }
.single-product .section-heading h2, .single-product .section-heading .kicker { text-shadow: 0 4px 35px #000; }
.product-showcase { background: #06101be8; backdrop-filter: blur(5px); box-shadow: 0 38px 100px #0009; }
.product-shot { background-color: #07111d; background-image: linear-gradient(90deg, #06101a1a 0%, #07101c 100%), linear-gradient(0deg, #06101e 0%, transparent 48%), url('assets/dma-user-squad.jpeg'); background-size: cover, cover, cover; background-position: center, center, center 28%; background-blend-mode: normal, normal, multiply; }
.game-world { background-color: #030914; background-image: linear-gradient(90deg, #030914f5 0%, #030914a8 52%, #030914d9 100%), linear-gradient(0deg, #030914 0%, transparent 46%, #030914b5 100%), url('assets/dma-user-scene.jpeg'); background-size: cover; background-position: center; background-blend-mode: normal, normal, luminosity; }
.game-world:before { background: radial-gradient(circle at 74% 42%, #078dd22c, transparent 28%), linear-gradient(90deg, #020713a8, transparent 58%, #0207138c); }
.plans-section { position: relative; isolation: isolate; background-color: #050d18; background-image: linear-gradient(90deg, #050d18 0%, #050d18f7 50%, #071424ce 73%, #050d18 100%), radial-gradient(circle at 80% 47%, #008cff30, transparent 30%), url('assets/dma-user-soldier.jpeg'); background-repeat: no-repeat; background-size: cover, cover, auto 128%; background-position: center, center, 88% 52%; background-blend-mode: normal, screen, multiply; }
.plans-section:after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, #040a14 0%, transparent 22%, transparent 78%, #060e1b 100%); pointer-events: none; }
.plans-section .plan-card { background: #07111ee8; backdrop-filter: blur(7px); }
.plans-section .plan-featured { background: linear-gradient(150deg, #08274aef, #081321ef 70%); }

@media (max-width: 920px) {
 .single-product:before { background-size: cover, cover, 760px auto; background-position: center, center, 118% bottom; }
 .plans-section { background-size: cover, cover, auto 92%; background-position: center, center, 116% 40%; }
}
@media (max-width: 620px) {
 .hero-backdrop { background-position: 67% center; }
 .single-product:before { background-image: linear-gradient(0deg, #040a13 0%, #040a13e8 62%, #040a139c 100%), radial-gradient(circle at 70% 30%, #008cff20, transparent 35%), url('assets/dma-user-squad.jpeg'); background-size: cover, cover, 680px auto; background-position: center, center, 53% top; }
 .product-shot { min-height: 350px; background-size: cover, cover, 610px auto; background-position: center, center, center 18%; }
 .plans-section { background-image: linear-gradient(0deg, #050d18 0%, #050d18e8 70%, #050d18a8 100%), radial-gradient(circle at 65% 18%, #008cff24, transparent 32%), url('assets/dma-user-soldier.jpeg'); background-size: cover, cover, 540px auto; background-position: center, center, 50% top; }
}

/* Home correction: supplied artwork is used only as first-fold scenery. */
.hero-backdrop:before { content: ''; position: absolute; inset: 0; background-image: url('assets/dma-user-squad.jpeg'); background-repeat: no-repeat; background-size: min(980px, 66vw) auto; background-position: 103% 105%; mix-blend-mode: multiply; opacity: .84; filter: saturate(1.2) contrast(1.04); }
.store-hero:before { content: ''; position: absolute; inset: 84px 0 0; z-index: -1; background-image: url('assets/dma-user-soldier.jpeg'); background-repeat: no-repeat; background-size: auto 93%; background-position: 61% 115%; mix-blend-mode: multiply; opacity: .18; pointer-events: none; }
.hero-backdrop:after { background: radial-gradient(circle at 78% 45%, #008cff32, transparent 26%), linear-gradient(90deg, #020711 0%, transparent 43%, #02071124 76%, #020711b8 100%), linear-gradient(0deg, #030811 0%, transparent 44%); }
.single-product:before { background-color: #040a13; background-image: radial-gradient(circle at 82% 46%, #008cff1f, transparent 28%), linear-gradient(125deg, #040a13 0%, #071421 58%, #040a13 100%); background-size: cover; background-position: center; background-blend-mode: normal; }
.single-product .product-showcase { grid-template-columns: 1fr; width: min(650px, 100%); margin-left: auto; background: linear-gradient(145deg, #071625f2, #050d18f2); }
.single-product .product-details { min-height: 520px; }
.plans-section { background: linear-gradient(180deg, #060e1b, #07101e 50%, #040a14); }
.plans-section:after { display: none; }

@media (max-width: 920px) {
 .hero-backdrop:before { background-size: 900px auto; background-position: 112% 100%; opacity: .72; }
 .store-hero:before { background-position: 78% 112%; opacity: .13; }
 .single-product .product-showcase { margin-left: 0; }
}
@media (max-width: 620px) {
 .hero-backdrop:before { background-size: 720px auto; background-position: 61% 12%; opacity: .55; }
 .store-hero:before { display: none; }
 .hero-backdrop:after { background: linear-gradient(0deg, #030811 0%, #030811e2 48%, #0308118c 100%); }
 .single-product:before { background-image: radial-gradient(circle at 50% 15%, #008cff1c, transparent 28%), linear-gradient(145deg, #040a13, #071421 55%, #040a13); }
 .single-product .product-details { min-height: 0; }
}

/* First fold — clean Counter-Strike composition */
.store-body { --font: 'DM Sans', sans-serif; --display: 'Space Grotesk', sans-serif; --orange: #ff6b1a; }
.store-hero { min-height: 820px; background: #05080d; border-bottom-color: #263444; }
.hero-backdrop { background-image: linear-gradient(90deg, #05080d 0%, #05080df5 31%, #05080d94 55%, #05080d33 76%, #05080dc7 100%), linear-gradient(0deg, #05080d 0%, transparent 35%), url('assets/dma-user-scene.jpeg'); background-position: center; filter: saturate(.92) contrast(1.12); }
.hero-backdrop:before { display: none; }
.hero-backdrop:after { background: linear-gradient(90deg, #05080d 0%, transparent 43%, #05080d17 74%, #05080dba 100%), radial-gradient(circle at 71% 44%, #00a8ff38, transparent 29%), linear-gradient(0deg, #05080d 0%, transparent 39%); }
.hero-grid { opacity: .1; background-size: 84px 84px; mask-image: linear-gradient(90deg, #000 0 39%, transparent 76%); }
.store-hero:before { content: ''; position: absolute; inset: auto 0 0; height: 180px; z-index: -1; background: linear-gradient(0deg, #05080d 12%, transparent); opacity: 1; }
.hero-shell { min-height: 736px; grid-template-columns: minmax(470px, .88fr) minmax(570px, 1.12fr); gap: 0; padding: 64px 0 88px; }
.hero-copy { position: relative; z-index: 3; max-width: 650px; padding-top: 10px; }
.hero-status { max-width: 475px; margin-bottom: 42px; }
.hero-status i { background: var(--orange); box-shadow: 0 0 14px var(--orange); }
.store-hero h1 { max-width: 680px; font-size: clamp(60px, 6.2vw, 92px); line-height: .91; letter-spacing: 0; }
.store-hero h1 span { color: #00a8ff; text-shadow: 0 0 34px #00a8ff38; }
.store-hero p { max-width: 520px; color: #b2c0cf; }
.store-hero .btn-primary { background: #00a8ff; }
.store-hero .btn-ghost { border-color: #6d7d8d75; background: #05080d66; backdrop-filter: blur(8px); }
.hero-metrics { max-width: 520px; border-color: #55697e70; }
.hero-metrics div { border-color: #55697e70; }
.hero-operators { position: absolute; z-index: 2; right: -92px; bottom: 0; width: min(790px, 62vw); pointer-events: none; filter: drop-shadow(-26px 24px 35px #000b); }
.hero-operators:before { content: ''; position: absolute; z-index: -1; inset: 12% 8% 9% 20%; border: 1px solid #00a8ff2b; background: linear-gradient(135deg, #00a8ff0f, transparent 46%, #ff6b1a0c); clip-path: polygon(7% 0, 100% 0, 100% 88%, 91% 100%, 0 100%, 0 9%); }
.hero-operators img { display: block; width: 100%; height: auto; -webkit-mask-image: linear-gradient(180deg, #000 58%, transparent 100%); mask-image: linear-gradient(180deg, #000 58%, transparent 100%); }
.hero-operators::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 26%; background: linear-gradient(0deg, #05080d 0%, transparent 100%); pointer-events: none; }
.operator-index, .operator-lock { position: absolute; color: #a9c4da; font: 600 10px/1 var(--display); letter-spacing: .16em; }
.operator-index { top: 15%; left: 8%; padding-left: 27px; }
.operator-index:before { content: ''; position: absolute; left: 0; top: 4px; width: 18px; height: 2px; background: var(--orange); box-shadow: 0 0 10px #ff6b1a; }
.operator-lock { right: 5%; top: 24%; color: #ff9a62; }
.operator-crosshair { position: absolute; right: 22%; top: 35%; width: 42px; height: 42px; border: 1px solid #00a8ff8f; border-radius: 50%; box-shadow: 0 0 22px #00a8ff38; }
.operator-crosshair:before, .operator-crosshair:after { content: ''; position: absolute; background: #00a8ff; }
.operator-crosshair:before { width: 56px; height: 1px; left: -8px; top: 20px; }
.operator-crosshair:after { width: 1px; height: 56px; left: 20px; top: -8px; }
.round-bar { z-index: 4; }
.round-bar b { color: var(--orange); }

@media (max-width: 1080px) {
 .hero-shell { grid-template-columns: minmax(420px, .9fr) minmax(460px, 1.1fr); }
 .hero-operators { right: -120px; width: 720px; }
}
@media (max-width: 920px) {
 .store-hero { min-height: 920px; }
 .hero-shell { display: block; min-height: 836px; padding-top: 66px; }
 .hero-copy { max-width: 610px; }
 .hero-operators { z-index: 1; right: -150px; bottom: 0; width: 700px; opacity: .78; }
 .hero-copy:after { content: ''; position: absolute; z-index: -1; inset: -30px -60px -30px -24px; background: linear-gradient(90deg, #05080df7 0 68%, transparent); }
 .hero-metrics { max-width: 500px; }
}
@media (max-width: 620px) {
 .store-hero { min-height: 840px; padding-top: 84px; }
 .hero-shell { min-height: 756px; padding: 50px 0 34px; }
 .hero-status { margin-bottom: 30px; }
 .store-hero h1 { font-size: clamp(46px, 14.2vw, 61px); line-height: .93; }
 .store-hero p { max-width: 350px; }
 .hero-copy:after { inset: -24px -20px -28px -16px; background: linear-gradient(90deg, #05080df5 0 45%, #05080da8 68%, transparent 100%); }
 .hero-operators { right: -140px; top: auto; bottom: -10px; width: 600px; opacity: .88; filter: drop-shadow(-20px 20px 30px #000d); }
 .hero-operators::after { height: 46%; }
 .hero-operators img { -webkit-mask-image: linear-gradient(180deg, #000 52%, transparent 100%); mask-image: linear-gradient(180deg, #000 52%, transparent 100%); }
 .hero-operators:before { inset: 10% 7% 8% 14%; border-color: #00a8ff52; }
 .operator-index, .operator-lock, .operator-crosshair { display: none; }
 .hero-metrics { position: relative; z-index: 3; margin-top: 40px; backdrop-filter: blur(10px); background: #05080dcf; }
 .hero-backdrop { background-position: 69% center; }
 .hero-backdrop:after { background: linear-gradient(180deg, #05080d8f 0%, #05080d66 46%, #05080d 100%), linear-gradient(90deg, #05080df0 0%, #05080dc7 47%, transparent 88%); }
}

/* Tactical elite — clean rounded surfaces and physical interactions */
.store-body {
 --surface-clean: #0b131ee8;
 --surface-raised: #101a26f2;
 --line-clean: #6e8ba629;
 --line-active: #00a8ff8f;
 --orange-soft: #ff6b1a38;
}
.store-body .btn {
 position: relative;
 isolation: isolate;
 overflow: hidden;
 border-radius: 12px;
 border: 1px solid #6e8ba640;
 transform: translateZ(0);
 transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .35s, box-shadow .35s, background-color .35s, color .35s;
}
.store-body .btn::before {
 content: '';
 position: absolute;
 z-index: -1;
 inset: -2px;
 background: linear-gradient(110deg, transparent 22%, #ffffff42 46%, #ffffff12 54%, transparent 76%);
 transform: translateX(-120%) skewX(-18deg);
 transition: transform .72s cubic-bezier(.16,1,.3,1);
}
.store-body .btn::after {
 content: '';
 position: absolute;
 z-index: -1;
 width: 0;
 aspect-ratio: 1;
 left: var(--press-x, 50%);
 top: var(--press-y, 50%);
 border-radius: 50%;
 background: #ffffff45;
 transform: translate(-50%, -50%);
 opacity: 0;
 pointer-events: none;
}
.store-body .btn:hover {
 transform: translateY(-3px);
 border-color: #7dd4ff9e;
 box-shadow: 0 12px 30px #0007, 0 0 0 1px #00a8ff24, 0 0 28px #00a8ff20;
}
.store-body .btn:hover::before { transform: translateX(120%) skewX(-18deg); }
.store-body .btn:active { transform: translateY(1px) scale(.975); transition-duration: .09s; }
.store-body .btn.is-pressing::after { animation: dma-button-ripple .58s ease-out; }
.store-body .btn span[aria-hidden] { display: inline-block; transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.store-body .btn:hover span[aria-hidden] { transform: translateX(4px); }
.store-body .btn-primary {
 border-color: #40bdff80;
 box-shadow: 0 4px 0 #006b9e, 0 10px 25px #00a8ff21;
}
.store-body .btn-primary:hover { box-shadow: 0 6px 0 #006b9e, 0 15px 36px #00a8ff3b; }
.store-body .btn-primary:active { box-shadow: 0 1px 0 #006b9e, 0 6px 14px #00a8ff28; }
.store-body .btn-ghost { background: #0b131eb8; backdrop-filter: blur(12px); }

.single-product {
 padding-block: 108px;
}
.single-product:before {
 background-color: #05080d;
 background-image: radial-gradient(circle at 76% 46%, #00a8ff20, transparent 30%), linear-gradient(90deg, #05080d 0 36%, #05080d00 70%), url('assets/dma-operator-squad-full.png');
 background-size: cover, cover, min(820px, 61vw) auto;
 background-position: center, center, calc(100% + 35px) bottom;
 background-repeat: no-repeat;
 background-blend-mode: normal, screen, normal;
 -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 10%, #000 96%, transparent 100%);
 mask-image: linear-gradient(180deg, transparent 0, #000 10%, #000 96%, transparent 100%);
}
.single-product:after {
 border-radius: 0;
 background-size: 80px 80px;
 opacity: .72;
}
.single-product .product-showcase {
 width: min(680px, 100%);
 border-radius: 20px;
 border-color: var(--line-clean);
 background: linear-gradient(145deg, #0b1622ee, #07101aee);
 box-shadow: 0 34px 80px #0008, inset 0 1px #ffffff08;
 transition: transform .45s cubic-bezier(.2,.8,.2,1), border-color .35s, box-shadow .45s;
 transform: perspective(1000px) rotateX(var(--tilt-y, 0deg)) rotateY(var(--tilt-x, 0deg));
}
.single-product .product-showcase:hover {
 border-color: #00a8ff62;
 box-shadow: 0 40px 100px #000a, 0 0 40px #00a8ff12, inset 0 1px #ffffff0d;
}
.sample-tag {
 border-radius: 999px;
 border-color: #5e7d9938;
 background: #00a8ff0d;
 padding: 7px 12px;
}
.feature-strip { gap: 0; background: transparent; }
.feature-strip span {
 margin-top: 8px;
 border: 1px solid var(--line-clean);
 border-radius: 10px;
 padding: 14px 16px;
 background: #08121c9e;
 transition: border-color .3s, background .3s, transform .3s;
}
.feature-strip span:hover { border-color: #00a8ff65; background: #0a1c2b; transform: translateX(5px); }

.plans-section {
 isolation: isolate;
 background: #05080d;
}
.plans-section:before {
 content: '';
 position: absolute;
 z-index: -1;
 inset: 0;
 background-image: linear-gradient(90deg, #05080df5 0 30%, #05080dca 52%, #05080d38 75%, #05080de8 100%), radial-gradient(circle at 72% 38%, #ff6b1a20, transparent 28%), url('assets/dma-operator-squad-full.png');
 background-size: cover, cover, min(860px, 64vw) auto;
 background-position: center, center, calc(100% + 20px) bottom;
 background-repeat: no-repeat;
 background-blend-mode: normal, screen, normal;
 -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 10%, #000 96%, transparent 100%);
 mask-image: linear-gradient(180deg, transparent 0, #000 10%, #000 96%, transparent 100%);
}
.plans-section:after {
 display: block;
 content: '';
 position: absolute;
 z-index: -1;
 inset: 0;
 pointer-events: none;
 background-image: linear-gradient(#43baff0a 1px, transparent 1px), linear-gradient(90deg, #43baff0a 1px, transparent 1px), linear-gradient(180deg, #05080d 0%, transparent 18%, transparent 80%, #05080d 100%);
 background-size: 80px 80px, 80px 80px, cover;
}
.plans-section .plan-card,
.store-body .testimonial,
.store-body .faq-list details,
.product-card,
.auth-card,
.product-dialog,
.selection-banner {
 border-radius: 18px;
}
.plans-section .plan-card {
 position: relative;
 overflow: hidden;
 border-color: var(--line-clean);
 background: var(--surface-clean);
 backdrop-filter: blur(14px);
 box-shadow: 0 24px 60px #0005, inset 0 1px #ffffff08;
 transform: perspective(900px) rotateX(var(--tilt-y, 0deg)) rotateY(var(--tilt-x, 0deg));
 transition: transform .42s cubic-bezier(.2,.8,.2,1), border-color .35s, box-shadow .42s;
 display: flex;
 flex-direction: column;
 min-height: 510px;
}
.plans-section .plan-card:before {
 content: '';
 position: absolute;
 inset: 0;
 pointer-events: none;
 background: radial-gradient(330px circle at var(--pointer-x, 50%) var(--pointer-y, 50%), #00a8ff1f, transparent 42%);
 opacity: 0;
 transition: opacity .35s;
}
.plans-section .plan-card:hover {
 border-color: var(--line-active);
 box-shadow: 0 32px 75px #0009, 0 0 34px #00a8ff17, inset 0 1px #ffffff12;
}
.plans-section .plan-card:hover:before { opacity: 1; }
.plans-section .plan-featured {
 border-color: #00a8ff8a;
 background: linear-gradient(145deg, #0b263bf0, #09131ff0);
 box-shadow: 0 25px 70px #0007, 0 0 30px #00a8ff1b, inset 0 1px #56c6ff20;
}
.plans-section .plan-top {
 min-height: auto;
 padding-bottom: 18px;
 border-bottom: 1px solid #6e8ba621;
 align-items: center;
}
.plans-section .plan-top span:first-child {
 color: #a9bed2;
 font-weight: 700;
 letter-spacing: .15em;
}
.plans-section .plan-featured .plan-top span:first-child { color: #ff9a62; }
.plans-section .plan-card h3 { margin: 25px 0 16px; font-size: 30px; }
.plans-section .plan-price { color: #eff8ff; }
.plans-section .plan-price > span { font-size: 17px; }
.plans-section .plan-period { margin: 10px 0 18px; }
.plans-section .plan-note {
 min-height: 58px;
 margin: 0;
 padding: 0 0 20px;
 border-bottom-color: #6e8ba62d;
 color: #c0cfdd;
}
.plans-section .plan-card ul { margin: 20px 0 26px; }
.plans-section .plan-card li { padding: 7px 0; }
.plans-section .plan-card .btn { margin-top: auto; }
.plans-section .plan-featured:after {
 content: '';
 position: absolute;
 top: 0;
 left: 24px;
 right: 24px;
 height: 2px;
 background: linear-gradient(90deg, transparent, var(--orange), transparent);
 box-shadow: 0 0 18px var(--orange);
}

#feedbacks { position: relative; padding-block: 108px; }
#feedbacks:before {
 content: '';
 position: absolute;
 z-index: -1;
 top: 0;
 bottom: 0;
 left: 50%;
 width: 100vw;
 transform: translateX(-50%);
 background-image: linear-gradient(90deg, #05080df9 0%, #05080de3 55%, #05080db8 100%), url('assets/dma-user-scene.jpeg');
 background-size: cover;
 background-position: center 42%;
 background-blend-mode: normal, luminosity;
}
.store-body .testimonial {
 position: relative;
 border: 1px solid var(--line-clean);
 background: #0a131de8;
 backdrop-filter: blur(12px);
 box-shadow: 0 20px 48px #00045;
 transition: transform .4s cubic-bezier(.2,.8,.2,1), border-color .35s, box-shadow .4s;
}
.store-body .testimonial:hover {
 transform: translateY(-7px);
 border-color: #ff6b1a70;
 box-shadow: 0 28px 65px #0008, 0 0 25px var(--orange-soft);
}
.store-body .avatar { border-radius: 10px; }
.store-body .faq-list details {
 border: 1px solid var(--line-clean);
 background: #0a131dbd;
 margin-bottom: 10px;
 overflow: hidden;
 transition: border-color .3s, background .3s, transform .3s;
}
.store-body .faq-list details:hover { border-color: #00a8ff5c; transform: translateX(4px); }
.store-body .faq-list details[open] { border-color: #00a8ff78; background: #0c1a27e8; }
.store-body .faq-list summary { border-bottom: 0; padding-inline: 22px; }
.store-body .faq-list details p { padding-inline: 22px; }
.store-body .faq-list summary span { transition: transform .35s cubic-bezier(.2,.8,.2,1), color .3s; }
.store-body .faq-list details[open] summary span { transform: rotate(45deg); color: var(--orange); }
.store-body .footer { border-radius: 20px 20px 0 0; }
.store-body .support-fab { border-radius: 14px; box-shadow: 0 14px 35px #0008, 0 0 22px #00a8ff22; }

.reveal-ready {
 opacity: 0;
 transform: translateY(28px);
 transition: opacity .75s ease, transform .75s cubic-bezier(.16,1,.3,1);
}
.reveal-ready.is-visible { opacity: 1; transform: translateY(0); }
.plans-grid .reveal-ready:nth-child(2), .testimonial-grid .reveal-ready:nth-child(2) { transition-delay: .1s; }
.plans-grid .reveal-ready:nth-child(3), .testimonial-grid .reveal-ready:nth-child(3) { transition-delay: .2s; }

@keyframes dma-button-ripple {
 0% { width: 0; opacity: .55; }
 100% { width: 280%; opacity: 0; }
}

@media (max-width: 920px) {
 .single-product:before { background-size: cover, cover, 730px auto; background-position: center, center, calc(100% + 80px) bottom; }
 .plans-section:before { background-size: cover, cover, 760px auto; background-position: center, center, calc(100% + 70px) bottom; }
}
@media (max-width: 620px) {
 .single-product, #feedbacks { padding-block: 72px; }
 .single-product:before { background-image: linear-gradient(0deg, #05080df8 0%, #05080dd2 52%, #05080d69 100%), radial-gradient(circle at 60% 18%, #00a8ff24, transparent 30%), url('assets/dma-operator-squad-full.png'); background-size: cover, cover, 560px auto; background-position: center, center, 50% 36px; -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 94%, transparent 100%); mask-image: linear-gradient(180deg, #000 0%, #000 94%, transparent 100%); }
 .single-product .product-showcase { border-radius: 16px; }
 .single-product .product-details { padding: 28px 22px; }
 .plans-section:before { background-image: linear-gradient(0deg, #05080dfb 0%, #05080de8 65%, #05080d85 100%), radial-gradient(circle at 62% 13%, #ff6b1a21, transparent 30%), url('assets/dma-operator-squad-full.png'); background-size: cover, cover, 560px auto; background-position: center, center, 50% 40px; -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 94%, transparent 100%); mask-image: linear-gradient(180deg, #000 0%, #000 94%, transparent 100%); }
 .plans-section .plan-card, .store-body .testimonial, .store-body .faq-list details { border-radius: 16px; }
 .plans-section .plan-card { min-height: 0; padding: 24px; }
 .plans-section .plan-card h3 { margin-top: 22px; }
 .plans-section .plan-note { min-height: 0; }
 #feedbacks:before { background-image: linear-gradient(0deg, #05080dfb, #05080dc7), url('assets/dma-user-scene.jpeg'); background-position: 66% center; }
 .store-body .btn:hover { transform: none; }
 .store-body .btn:active { transform: scale(.97); }
}
@media (hover: none) {
 .single-product .product-showcase, .plans-section .plan-card { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
 .store-body .btn, .store-body .btn::before, .store-body .btn::after,
 .single-product .product-showcase, .plans-section .plan-card, .store-body .testimonial,
 .store-body .faq-list details, .reveal-ready { transition: none; animation: none; transform: none; }
 .reveal-ready { opacity: 1; }
}

/* Reference-led homepage structure — cinematic, compact and easy to scan */
.hero-quote { position: absolute; z-index: 4; top: 194px; right: 0; width: 190px; text-align: center; color: #dce8f3; }
.hero-quote > span { display: block; width: 38px; height: 2px; margin: 0 auto 18px; background: var(--orange); box-shadow: 0 0 14px var(--orange); }
.hero-quote p { margin: 0; color: #eef6fc; font: 600 22px/1.3 var(--display); }
.hero-quote small { display: block; margin-top: 15px; color: #6f8498; font: 700 9px/1.4 var(--display); letter-spacing: .16em; }
.hero-metrics { position: absolute; z-index: 5; left: 0; bottom: 70px; width: 520px; margin: 0; background: #07101ad9; backdrop-filter: blur(12px); border-radius: 12px; }
.hero-metrics div:first-child { border-radius: 12px 0 0 12px; }
.hero-metrics div:last-child { border-radius: 0 12px 12px 0; }

.feature-overview { position: relative; background: #05080d; border-bottom: 1px solid var(--line-clean); }
.overview-grid { display: grid; grid-template-columns: 1fr 1fr; }
.overview-panel { min-width: 0; padding: 76px 42px 70px 0; }
.overview-panel + .overview-panel { padding-left: 42px; padding-right: 0; border-left: 1px solid var(--line-clean); }
.compact-heading { display: block; margin-bottom: 28px; }
.compact-heading h2, .assurance-heading h2, .experience-fold h2 { margin: 13px 0 10px; font: 700 clamp(28px, 3vw, 42px)/1.02 var(--display); letter-spacing: 0; }
.compact-heading p, .assurance-heading p, .preview-copy p { color: #91a4b7; font-size: 14px; line-height: 1.55; }
.overview-items, .assurance-items { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.overview-items a, .assurance-items > div { min-height: 108px; padding: 17px; border: 1px solid var(--line-clean); border-radius: 10px; background: #0a131db8; text-decoration: none; transition: transform .3s, border-color .3s, background .3s; }
.overview-items a:hover, .assurance-items > div:hover { transform: translateY(-4px); border-color: var(--line-active); background: #0c1b29; }
.overview-items span, .assurance-items span { display: block; margin-bottom: 13px; color: #00a8ff; font: 700 15px/1 var(--display); }
.overview-items b, .overview-items small, .assurance-items b, .assurance-items small { display: block; }
.overview-items b, .assurance-items b { color: #e8eef5; font-size: 13px; }
.overview-items small, .assurance-items small { margin-top: 7px; color: #788b9e; font-size: 11px; line-height: 1.45; }
.assurance-heading { display: grid; grid-template-columns: 1fr 120px; gap: 24px; align-items: start; margin-bottom: 28px; }
.assurance-mark { text-align: center; padding-top: 10px; color: #00a8ff; }
.assurance-mark span { display: block; font: 700 46px/1 var(--display); text-shadow: 0 0 28px #00a8ff52; }
.assurance-mark small { display: block; margin-top: 8px; color: #a7bacb; font: 700 9px/1.4 var(--display); letter-spacing: .12em; }

.experience-fold { padding: 74px 0 34px; background: linear-gradient(180deg, #07101a, #05080d); border-bottom: 1px solid var(--line-clean); }
.experience-grid { display: grid; grid-template-columns: 1.25fr .72fr .74fr; border: 1px solid var(--line-clean); border-radius: 14px; overflow: hidden; background: #07111bd9; box-shadow: 0 34px 90px #0006; }
.experience-preview, .access-steps, .plan-snapshot { min-width: 0; padding: 30px; }
.access-steps, .plan-snapshot { border-left: 1px solid var(--line-clean); }
.preview-copy { max-width: 520px; }
.preview-frame { position: relative; overflow: hidden; aspect-ratio: 16/8.2; margin: 22px 0 18px; border: 1px solid #4e718d63; border-radius: 10px; background: #02070c; }
.preview-frame:after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 45%, #06101a96), linear-gradient(0deg, #06101ac7, transparent 42%); pointer-events: none; }
.preview-frame img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.76) contrast(1.08); transition: transform .7s cubic-bezier(.16,1,.3,1), filter .5s; }
.experience-preview:hover .preview-frame img { transform: scale(1.035); filter: saturate(.95) contrast(1.08); }
.preview-frame span, .preview-frame small { position: absolute; z-index: 2; left: 14px; font: 700 9px/1 var(--display); letter-spacing: .14em; }
.preview-frame span { top: 14px; color: #69c9ff; }
.preview-frame small { bottom: 14px; color: #d5e4f0; }
.access-steps ol { list-style: none; padding: 0; margin: 22px 0; }
.access-steps li { display: grid; grid-template-columns: 36px 1fr; gap: 12px; padding: 15px 0; border-top: 1px solid var(--line-clean); }
.access-steps li > span { color: #00a8ff; font: 700 12px/1.3 var(--display); }
.access-steps li b, .access-steps li small { display: block; }
.access-steps li b { color: #e7f0f7; font-size: 12px; }
.access-steps li small { margin-top: 5px; color: #71869a; font-size: 10px; line-height: 1.45; }
.access-steps .btn { width: 100%; }
.plan-snapshot > div { margin: 22px 0 18px; }
.plan-snapshot > div a { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 5px 12px; padding: 15px 0; border-top: 1px solid var(--line-clean); color: #cbd9e4; text-decoration: none; }
.plan-snapshot > div a:last-child { border-bottom: 1px solid var(--line-clean); }
.plan-snapshot > div a.active { padding-inline: 12px; border-color: #00a8ff70; border-radius: 8px; background: #00a8ff0f; }
.plan-snapshot a span { font-size: 12px; }
.plan-snapshot a b { color: #f2f7fb; font-size: 13px; }
.plan-snapshot a small { grid-column: 1/-1; color: #ff995f; font: 700 9px/1.2 var(--display); text-transform: uppercase; }
.experience-fold .legal-note { margin: 20px 0 0; }

@media (max-width: 1080px) {
 .hero-quote { display: none; }
 .experience-grid { grid-template-columns: 1.1fr .9fr; }
 .plan-snapshot { grid-column: 1/-1; border-left: 0; border-top: 1px solid var(--line-clean); }
 .plan-snapshot > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
 .plan-snapshot > div a, .plan-snapshot > div a:last-child { border: 1px solid var(--line-clean); border-radius: 8px; padding: 15px; }
}
@media (max-width: 850px) {
 .overview-grid { grid-template-columns: 1fr; }
 .overview-panel, .overview-panel + .overview-panel { padding: 64px 0; border-left: 0; }
 .overview-panel + .overview-panel { border-top: 1px solid var(--line-clean); }
 .experience-grid { grid-template-columns: 1fr; }
 .access-steps, .plan-snapshot { border-left: 0; border-top: 1px solid var(--line-clean); }
}
@media (max-width: 620px) {
 .store-hero { min-height: 780px; }
 .hero-shell { min-height: 696px; padding-top: 38px; }
 .hero-status { margin-bottom: 20px; }
 .store-hero h1 { font-size: clamp(42px, 13.3vw, 58px); margin-block: 16px 20px; }
 .store-hero .hero-actions { margin-top: 24px; }
 .hero-metrics { left: 0; right: 0; bottom: 42px; width: 100%; }
 .hero-metrics div { padding-inline: 8px; }
 .hero-operators { right: -188px; bottom: 6px; width: 590px; opacity: .76; }
 .hero-operators img { -webkit-mask-image: linear-gradient(180deg, #000 45%, transparent 92%); mask-image: linear-gradient(180deg, #000 45%, transparent 92%); }
 .overview-panel, .overview-panel + .overview-panel { padding: 52px 0; }
 .overview-items, .assurance-items { grid-template-columns: 1fr 1fr; gap: 8px; }
 .overview-items a, .assurance-items > div { min-height: 126px; padding: 15px; }
 .assurance-heading { grid-template-columns: 1fr 86px; }
 .assurance-mark span { font-size: 38px; }
 .experience-fold { padding-top: 52px; }
 .experience-grid { border-radius: 12px; }
 .experience-preview, .access-steps, .plan-snapshot { padding: 24px 20px; }
 .preview-frame { aspect-ratio: 16/10; }
 .plan-snapshot > div { grid-template-columns: 1fr; gap: 8px; }
}

/* Exact reference composition: copy, density and three horizontal folds */
.store-hero { min-height: 650px; }
.hero-shell { min-height: 566px; padding: 52px 0 92px; }
.hero-copy { max-width: 590px; }
.hero-status { margin-bottom: 24px; }
.store-hero h1 { max-width: 640px; margin: 14px 0 18px; font-size: clamp(46px, 5.4vw, 74px); line-height: .91; }
.store-hero p { font-size: 16px; line-height: 1.45; }
.store-hero .hero-actions { margin-top: 24px; }
.hero-operators { right: 110px; width: min(680px, 55vw); }
.hero-quote { top: 140px; width: 220px; }
.hero-quote p { font-family: Georgia, serif; font-style: italic; font-weight: 400; }
.hero-benefits { position: absolute; z-index: 6; left: 0; bottom: 28px; display: flex; gap: 38px; color: #a8bacd; font-size: 12px; }
.hero-benefits span { display: flex; align-items: center; gap: 9px; white-space: nowrap; }
.hero-benefits i { color: #00a8ff; font: 700 18px/1 var(--display); font-style: normal; text-shadow: 0 0 14px #00a8ff80; }

.reference-features { background: #05080d; border-block: 1px solid var(--line-clean); }
.reference-features-grid { display: grid; grid-template-columns: 1fr 1fr; }
.resource-panel, .security-panel { padding: 58px 28px 58px 0; }
.security-panel { padding-left: 28px; padding-right: 0; border-left: 1px solid var(--line-clean); }
.reference-features h2, .reference-results h2 { margin: 10px 0 7px; color: #eef6fc; font: 700 clamp(27px, 2.8vw, 40px)/1.02 var(--display); letter-spacing: 0; }
.reference-features p, .reference-results p { margin: 0; color: #899caf; font-size: 12px; line-height: 1.55; }
.resource-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 18px; }
.resource-cards article, .security-cards article { min-height: 128px; padding: 16px; border: 1px solid var(--line-clean); border-radius: 8px; background: linear-gradient(145deg, #0a1521e8, #07101ae8); transition: transform .3s, border-color .3s, box-shadow .3s; }
.resource-cards article:hover, .security-cards article:hover { transform: translateY(-4px); border-color: var(--line-active); box-shadow: 0 16px 34px #0008, 0 0 22px #00a8ff12; }
.resource-cards i, .security-cards i { display: block; margin-bottom: 12px; color: #00a8ff; font: 600 25px/1 var(--display); font-style: normal; text-shadow: 0 0 14px #00a8ff5c; }
.resource-cards b, .resource-cards small, .security-cards b, .security-cards small { display: block; }
.resource-cards b, .security-cards b { color: #e7eff6; font-size: 11px; line-height: 1.25; }
.resource-cards small, .security-cards small { margin-top: 8px; color: #7e91a4; font-size: 9px; line-height: 1.45; }
.security-heading { display: grid; grid-template-columns: 1fr 142px; gap: 25px; }
.security-badge { padding: 5px 0 0 24px; border-left: 1px solid var(--line-clean); }
.security-badge i { float: left; margin: 0 10px 18px 0; color: #00a8ff; font: 700 43px/1 var(--display); font-style: normal; }
.security-badge b, .security-badge span { display: block; }
.security-badge b { color: #edf7ff; font: 700 24px/1 var(--display); }
.security-badge span { margin-top: 5px; color: #00a8ff; font: 700 10px/1 var(--display); }
.security-badge small { display: block; clear: both; color: #8799aa; font-size: 9px; line-height: 1.45; }
.security-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 18px; }

.reference-results { padding: 58px 0 22px; background: linear-gradient(180deg, #07101a, #05080d); border-bottom: 1px solid var(--line-clean); }
.results-grid { display: grid; grid-template-columns: 1.25fr .78fr 1.08fr; border: 1px solid var(--line-clean); border-radius: 8px; overflow: hidden; background: #07111bd9; box-shadow: 0 34px 90px #0006; }
.difference-panel, .how-panel, .community-panel { min-width: 0; padding: 26px; }
.how-panel, .community-panel { border-left: 1px solid var(--line-clean); }
.difference-shot { position: relative; overflow: hidden; height: 235px; margin-top: 18px; border: 1px solid #4e718d63; border-radius: 8px; background: #02070c; }
.difference-shot:after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, #030b14d9 0%, transparent 42%); pointer-events: none; }
.difference-shot img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.76) contrast(1.08); }
.difference-shot > span { position: absolute; z-index: 3; left: 14px; bottom: 12px; color: #d6e5ef; font-size: 9px; line-height: 1.45; }
.esp-box { position: absolute; z-index: 2; width: 44px; height: 76px; border: 1px solid #ff4b43; color: #ff756f; font: 700 7px/1.3 var(--display); text-align: center; }
.esp-box small { display: block; }
.esp-box.one { left: 32%; top: 31%; }
.esp-box.two { left: 55%; top: 28%; }
.how-panel ol { list-style: none; margin: 20px 0; padding: 0; }
.how-panel li { display: grid; grid-template-columns: 42px 1fr; gap: 12px; padding: 14px 0; border-top: 1px solid var(--line-clean); }
.how-panel li i { color: #00a8ff; font: 700 12px var(--display); font-style: normal; }
.how-panel li b, .how-panel li small { display: block; }
.how-panel li b { color: #e5eef6; font-size: 11px; }
.how-panel li small { margin-top: 4px; color: #74879a; font-size: 9px; line-height: 1.45; }
.how-panel .btn { width: 100%; }
.result-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 26px 0; }
.result-metrics b, .result-metrics small { display: block; }
.result-metrics b { color: #eaf4fb; font: 700 18px/1 var(--display); }
.result-metrics b:before { content: '✦'; margin-right: 8px; color: #00a8ff; font-size: 13px; }
.result-metrics small { margin: 8px 0 0 21px; color: #768a9e; font-size: 8px; }
.community-panel blockquote { margin: 0; padding: 18px; border: 1px solid #00a8ff55; border-radius: 8px; background: #071725b8; color: #d7e5ef; font-size: 11px; line-height: 1.55; }
.community-panel blockquote footer { margin-top: 13px; color: #7790a5; font-size: 9px; }
.community-panel blockquote span { color: #00a8ff; letter-spacing: .12em; }

@media (max-width: 1080px) {
 .resource-cards, .security-cards { grid-template-columns: repeat(2, 1fr); }
 .hero-operators { right: -10px; }
 .results-grid { grid-template-columns: 1fr 1fr; }
 .community-panel { grid-column: 1/-1; border-left: 0; border-top: 1px solid var(--line-clean); }
}
@media (max-width: 850px) {
 .reference-features-grid { grid-template-columns: 1fr; }
 .resource-panel, .security-panel { padding: 52px 0; }
 .security-panel { border-left: 0; border-top: 1px solid var(--line-clean); }
 .results-grid { grid-template-columns: 1fr; }
 .how-panel, .community-panel { border-left: 0; border-top: 1px solid var(--line-clean); }
}
@media (max-width: 620px) {
 .store-hero { min-height: 790px; }
 .hero-shell { min-height: 706px; padding-top: 34px; }
 .store-hero h1 { max-width: 390px; font-size: clamp(39px, 11.7vw, 52px); }
 .store-hero p { font-size: 14px; }
 .hero-operators { right: -188px; bottom: 60px; width: 590px; }
 .hero-benefits { left: 0; right: 0; bottom: 20px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; padding: 12px; border-radius: 10px; background: #05080dd9; backdrop-filter: blur(10px); }
 .hero-benefits span { font-size: 10px; }
 .resource-cards, .security-cards { grid-template-columns: repeat(2, 1fr); }
 .resource-cards article, .security-cards article { min-height: 140px; padding: 14px; }
 .security-heading { grid-template-columns: 1fr; }
 .security-badge { padding: 20px 0 0; border-left: 0; border-top: 1px solid var(--line-clean); }
 .difference-panel, .how-panel, .community-panel { padding: 24px 20px; }
 .difference-shot { height: 220px; }
 .result-metrics { gap: 7px; }
 .result-metrics b { font-size: 15px; }
}

/* Account page (/conta) and API error state, reusing the auth card palette. */
.auth-result[data-state="error"] { border-color: #a8573a; color: #ffd6c2; background: #2a140c; }
.account-details { margin: 24px 0 8px; }
.account-details > div { display: flex; justify-content: space-between; gap: 15px; padding: 14px 0; border-top: 1px solid #233c55; font-size: 15px; }
.account-details dt { color: #93a9c0; }
.account-details dd { margin: 0; color: #fff; text-align: right; overflow-wrap: anywhere; }
.account-subtitle { font: 600 20px var(--display); margin: 26px 0 12px; }
.account-empty { color: #93a9c0; font-size: 15px; }
.account-orders { list-style: none; margin: 0; padding: 0; }
.account-orders li { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 14px 0; border-top: 1px solid #233c55; font-size: 15px; }
.account-orders small { display: block; color: #93a9c0; font-size: 13px; margin-top: 4px; }
.account-orders b { color: #61bfff; white-space: nowrap; }
[data-account-page] .btn { margin-top: 26px; width: 100%; }