:root { color-scheme: dark; }
html { scroll-behavior: smooth; scroll-padding-top: 5.5rem; }
body { overflow-x: hidden; background: #070b0e; }
::selection { background: #55c7f3; color: #061018; }
.site-header { border-bottom: 1px solid rgba(255,255,255,.07); background: rgba(7,11,14,.86); backdrop-filter: blur(18px); }
.nav-links.open { display: flex; }
.nav-active { background: #12232c; color: #fff; box-shadow: inset 0 0 0 1px rgba(85,199,243,.1); }
.logo-cube { position: relative; display: grid; width: 38px; height: 38px; place-items: center; transform: rotate(45deg); border: 1px solid rgba(85,199,243,.75); border-radius: 8px; background: linear-gradient(135deg,#55c7f3,#17658d); box-shadow: 0 0 28px rgba(85,199,243,.25); }
.logo-cube i { transform: rotate(-45deg); color: white; font: 900 11px/1 Montserrat,sans-serif; }
.status-pill { align-items: center; gap: 7px; padding: 8px 12px; border: 1px solid #253740; border-radius: 999px; color: #9fadb5; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.status-pill i { width: 7px; height: 7px; border-radius: 50%; background: #64d77c; box-shadow: 0 0 10px #64d77c; }
.store-button { display: flex; align-items: center; gap: 12px; padding: 10px 15px; border-radius: 9px; background: #f4f1e9; color: #11100e; font-size: 13px; font-weight: 800; }
.cart-open.store-button { border:1px solid #8edcff; background:linear-gradient(135deg,#55c7f3,#267eab); color:#061018; box-shadow:0 10px 24px -14px rgba(85,199,243,.75); }
.cart-open.store-button:hover { filter:brightness(1.08); }
.hero-grid { background-color: #070b0e; background-image: linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px); background-size: 72px 72px; }
.hero-grid:before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 49.85%,rgba(85,199,243,.12) 50%,transparent 50.15%),linear-gradient(0deg,#080806 0,transparent 20%); pointer-events:none; }
.hero-glow { position:absolute; width:520px; height:520px; right:4%; top:10%; border-radius:50%; background:radial-gradient(circle,rgba(38,126,171,.13),transparent 68%); }
.eyebrow { display:flex; align-items:center; gap:10px; color:#c4bfb5; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.eyebrow span { width:28px; height:2px; background:#55c7f3; box-shadow:0 0 10px #55c7f3; }
.eyebrow.gold span { background:#f5bd4f; box-shadow:0 0 10px #f5bd4f; }
h1 span,.community-copy h2 span { color:#55c7f3; text-shadow:0 0 35px rgba(85,199,243,.18); }
.primary-button,.secondary-button { display:inline-flex; min-height:52px; align-items:center; justify-content:center; gap:22px; border-radius:10px; padding:0 22px; font-size:13px; font-weight:800; transition:.2s ease; }
.primary-button { border:1px solid #8edcff; background:linear-gradient(135deg,#55c7f3,#267eab); color:#061018; box-shadow:0 14px 32px -16px rgba(85,199,243,.8); }
.primary-button:hover { transform:translateY(-2px); filter:brightness(1.08); }
.secondary-button { border:1px solid #293b44; background:rgba(255,255,255,.025); color:#e4f0f5; }
.secondary-button:hover { border-color:#426273; background:rgba(85,199,243,.06); }
.hero-art:before { content:""; position:absolute; width:78%; aspect-ratio:1; border:1px solid rgba(85,199,243,.1); transform:rotate(45deg); }
.art-frame { position:absolute; inset:10% 7%; border:1px solid rgba(255,255,255,.05); border-radius:18px; background:rgba(85,199,243,.025); }
.steps-grid { display:grid; gap:16px; grid-template-columns:repeat(3,1fr); }
.step-card { position:relative; min-height:335px; overflow:hidden; border:1px solid #263740; border-radius:18px; background:linear-gradient(145deg,#111a1f,#0a1013); padding:32px; }
.step-card.featured { border-color:rgba(85,199,243,.4); background:radial-gradient(circle at 80% 10%,rgba(85,199,243,.17),transparent 40%),linear-gradient(145deg,#111a1f,#0e0d0b); }
.step-number { position:absolute; right:22px; top:14px; color:rgba(255,255,255,.045); font:900 64px/1 Montserrat,sans-serif; }
.step-icon { display:grid; width:52px; height:52px; place-items:center; border:1px solid #2c3c45; border-radius:12px; background:#111b20; color:#55c7f3; font-size:23px; }
.step-card h3 { margin-top:35px; font:800 19px/1.2 Montserrat,sans-serif; }
.step-card p { margin-top:12px; color:#98958d; font-size:14px; line-height:1.7; }
.address-copy { display:flex; width:100%; justify-content:space-between; margin-top:25px; border:1px solid #2b414c; border-radius:9px; background:#091115; padding:12px 14px; color:#dcecf3; font-size:12px; }
.address-copy b,.text-link { color:#55c7f3; }
.mini-label,.text-link { display:inline-block; margin-top:28px; font-size:12px; font-weight:700; }
.mini-label { border:1px solid rgba(85,199,243,.25); border-radius:99px; padding:7px 10px; color:#79d4f8; }
.feature-band { border-block:1px solid #22333c; background:linear-gradient(90deg,#080e11,#0d171c 50%,#080e11); }
.feature-art { position:relative; display:grid; min-height:440px; place-items:center; }
.feature-art img { position:relative; z-index:2; width:min(90%,480px); filter:drop-shadow(0 35px 35px rgba(0,0,0,.65)); }
.crate-halo { position:absolute; width:68%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(245,189,79,.2),rgba(85,199,243,.06) 48%,transparent 70%); }
.gold-button { border-color:#ffcf70; background:linear-gradient(135deg,#f5bd4f,#b77024); color:#211509; box-shadow:0 14px 32px -16px rgba(245,189,79,.75); }
.community-panel { position:relative; display:grid; min-height:430px; overflow:hidden; border:1px solid rgba(85,199,243,.32); border-radius:24px; background:radial-gradient(circle at 78% 32%,rgba(85,199,243,.23),transparent 30%),linear-gradient(120deg,#0d171c,#102835); grid-template-columns:1.1fr .9fr; }
.community-panel:before { content:""; position:absolute; inset:0; opacity:.12; background-image:linear-gradient(rgba(255,255,255,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.1) 1px,transparent 1px); background-size:44px 44px; }
.community-copy { position:relative; z-index:2; align-self:center; padding:50px; }
.community-panel img { position:relative; z-index:2; align-self:end; width:100%; max-height:440px; object-fit:contain; filter:drop-shadow(0 30px 25px rgba(0,0,0,.5)); }
.footer-title { font-size:11px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.footer-links { display:flex; flex-direction:column; gap:10px; margin-top:17px; color:#8f8b83; font-size:13px; }
.footer-links a:hover { color:#fff; }
.store-page main,.donators-page main { background-color:#070b0e; }
.store-grid,.donators-grid:before { background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px),radial-gradient(circle at 15% 8%,rgba(85,199,243,.13),transparent 28%),radial-gradient(circle at 88% 48%,rgba(245,189,79,.08),transparent 32%);background-size:64px 64px,64px 64px,auto,auto; }
.store-page main:before { content:"";position:absolute;inset:0 0 auto;height:520px;background:linear-gradient(180deg,rgba(85,199,243,.06),transparent);pointer-events:none; }
.store-page nav[aria-label="Store categories"] { border-radius:12px;background:rgba(8,15,19,.92);box-shadow:0 18px 40px rgba(0,0,0,.25); }
.store-page nav[aria-label="Store categories"] .store-category-active { background:#12232c;color:#79d4f8; }
.product-card { overflow:hidden;background:radial-gradient(circle at 50% 0,rgba(85,199,243,.075),transparent 35%),linear-gradient(155deg,#111b20,#091115);box-shadow:0 20px 45px -35px #000;transition:transform .22s,border-color .22s; }
.product-card:before { content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--accent);opacity:.75; }
.product-card:hover { transform:translateY(-5px);border-color:color-mix(in srgb,var(--accent),transparent 45%); }
#rank-options .product-card { min-height:255px; }
.product-card .buy-button,.store-page .buy-button { border:1px solid rgba(255,255,255,.15);border-radius:9px;box-shadow:0 12px 28px -18px var(--accent);transition:filter .2s,transform .2s; }
.product-card .buy-button:hover,.store-page .buy-button:hover { transform:translateY(-1px);filter:brightness(1.12); }
.store-page table { background:linear-gradient(145deg,#111a1f,#091115); }
.store-page table tr { border-color:#292620; }
.donators-page { background-image:radial-gradient(circle at 50% 0,rgba(85,199,243,.09),transparent 30%); }
.donators-grid { position:relative; }
.donator-card { background:linear-gradient(155deg,#111b20,#091115);box-shadow:0 24px 50px -38px #000;transition:transform .22s,border-color .22s; }
.donator-card:hover { transform:translateY(-5px);border-color:#51493d; }
.donator-card>div:first-child { background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),radial-gradient(circle at 50% 100%,rgba(85,199,243,.12),transparent 60%);background-size:32px 32px,32px 32px,auto; }
.cart-count { display:grid; min-width:22px; height:22px; place-items:center; border-radius:6px; background:#071219; color:#8edcff; font-size:11px; }
.modal-open { overflow:hidden; }
.cart-modal { position:fixed; inset:0; z-index:100; display:none; }
.cart-modal.open { display:block; }
.cart-backdrop { position:absolute; inset:0; width:100%; border:0; background:rgba(2,7,10,.78); backdrop-filter:blur(6px); }
.cart-dialog { position:absolute; top:0; right:0; display:flex; width:min(100%,500px); height:100%; flex-direction:column; overflow-y:auto; border-left:1px solid #29404b; background:#091115; padding:28px; box-shadow:-30px 0 80px rgba(0,0,0,.5); animation:cart-in .2s ease-out; }
@keyframes cart-in { from { transform:translateX(30px); opacity:0; } }
.cart-heading { display:flex; align-items:flex-start; justify-content:space-between; border-bottom:1px solid #243139; padding-bottom:22px; }
.cart-close { display:grid; width:40px; height:40px; place-items:center; border:1px solid #2b414c; border-radius:9px; color:#a9b7be; font-size:24px; line-height:1; }
.cart-close:hover { border-color:#55c7f3; color:#fff; }
.cart-items { display:flex; flex-direction:column; gap:12px; padding:22px 0; }
.cart-item { display:flex; align-items:center; justify-content:space-between; gap:18px; border:1px solid #243640; border-radius:12px; background:#0e191f; padding:16px; }
.cart-item strong { display:block; font:700 14px/1.3 Montserrat,sans-serif; }
.cart-item small { display:block; margin-top:5px; color:#8e9ca4; }
.cart-item-actions { display:flex; align-items:center; gap:9px; }
.cart-item-actions button:not(.cart-remove) { display:grid; width:30px; height:30px; place-items:center; border:1px solid #304955; border-radius:7px; color:#d9e7ed; }
.cart-item-actions button:hover { border-color:#55c7f3; }
.cart-item-actions span { min-width:16px; text-align:center; font-size:13px; font-weight:700; }
.cart-remove { margin-left:5px; color:#81919a; font-size:11px; }
.cart-remove:hover { color:#8edcff; }
.cart-empty { margin:auto 0; padding:50px 20px; text-align:center; }
.cart-empty strong { font:700 18px/1.3 Montserrat,sans-serif; }
.cart-empty p { margin-top:8px; color:#8e9ca4; font-size:14px; }
.checkout-form { margin-top:auto; border-top:1px solid #243139; padding-top:22px; }
.cart-total { display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
.cart-total span { color:#8e9ca4; font-size:13px; }
.cart-total strong { font:800 24px/1 Montserrat,sans-serif; }
.checkout-form label { display:block; margin-bottom:8px; font-size:12px; font-weight:700; }
.checkout-form input { width:100%; border:1px solid #304955; border-radius:10px; outline:0; background:#0d181e; padding:13px 14px; color:#f1f7fa; font-size:14px; }
.checkout-form input:focus { border-color:#55c7f3; box-shadow:0 0 0 3px rgba(85,199,243,.1); }
.checkout-error { min-height:20px; margin-top:8px; color:#8edcff; font-size:12px; }
.checkout-button { width:100%; margin-top:8px; }
.checkout-button:disabled { cursor:wait; opacity:.55; }
.checkout-note { margin-top:13px; color:#7f8e96; font-size:11px; line-height:1.55; text-align:center; }
.toast { position:fixed; left:50%; bottom:1.5rem; z-index:100; padding:.8rem 1.3rem; border:1px solid #31505f; border-radius:.75rem; background:#0d1a20; color:#f1f7fa; font-size:.875rem; font-weight:600; box-shadow:0 20px 50px -20px #000; opacity:0; pointer-events:none; transform:translate(-50%,12px); transition:opacity .25s,transform .25s; }
.toast.show { opacity:1; transform:translate(-50%,0); }
@media (max-width:767px) { .steps-grid,.community-panel{grid-template-columns:1fr}.hero-art{min-height:360px}.community-copy{padding:36px 28px 0}.community-panel img{max-height:330px}.cart-dialog{padding:22px 18px}.cart-item{align-items:flex-start;flex-direction:column}.cart-item-actions{width:100%}.cart-remove{margin-left:auto} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}*{transition:none!important} }
