/* Layout shell */
.store-shell { display:grid; grid-template-columns:224px 1fr; max-width:1600px; margin:0 auto; min-height:100vh; }
@media (max-width:1023px) { .store-shell { grid-template-columns:1fr; } .sidebar { display:none; } }

/* Top bar */
.storefront-topbar { display:flex; align-items:center; justify-content:space-between; height:56px; padding:0 24px; background:var(--surface); border-bottom:1px solid var(--border); border-left:1px solid var(--border); border-right:1px solid var(--border); max-width:1600px; margin:0 auto; }
.brand { display:flex; align-items:center; gap:12px; font-weight:600; color:var(--text); }
.brand-mark { width:28px; height:28px; border:1px solid var(--border-strong); border-radius:var(--radius-sm); display:grid; place-items:center; color:var(--gold-soft); font-family:serif; font-size:1rem; }
.topbar-right { display:flex; align-items:center; gap:14px; }
.topbar-link { color:var(--muted); font-size:0.85rem; display:inline-flex; align-items:center; gap:6px; }
.topbar-link:hover { color:var(--text); }
.topbar-link svg { stroke:currentColor; stroke-width:2; fill:none; }
.lang-switch { display:flex; gap:0; border:1px solid var(--border); border-radius:var(--radius-sm); overflow:hidden; }
.lang-switch a { padding:4px 10px; color:var(--muted); font-size:0.78rem; border-right:1px solid var(--border); }
.lang-switch a:last-child { border-right:none; }
.lang-switch a.active { background:var(--gold-soft); color:#100b02; font-weight:700; }
.theme-toggle { width:28px; height:28px; border:1px solid var(--border); border-radius:var(--radius-sm); background:transparent; color:var(--muted); cursor:pointer; display:grid; place-items:center; }
.theme-toggle:hover { color:var(--text); border-color:var(--gold-soft); }
.theme-toggle svg { stroke:currentColor; stroke-width:2; fill:none; }
.user-chip { display:flex; align-items:center; gap:8px; padding:4px 10px 4px 4px; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-sm); font-size:0.85rem; }
.avatar { width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg,#5865f2,#a855f7); color:white; display:grid; place-items:center; font-weight:700; font-size:0.78rem; }
.discord-btn { padding:7px 14px; background:#5865f2; color:white; border-radius:var(--radius-sm); font-weight:600; font-size:0.85rem; }
.logout-btn { width:28px; height:28px; border:1px solid var(--border); background:transparent; color:var(--muted); border-radius:var(--radius-sm); cursor:pointer; display:grid; place-items:center; }
.logout-btn:hover { color:var(--danger); border-color:var(--danger); }
.logout-btn svg { stroke:currentColor; stroke-width:2; fill:none; }

/* Sidebar */
.sidebar { background:var(--surface); border-left:1px solid var(--border); border-right:1px solid var(--border); padding:20px 0; }
.side-h { padding:0 20px; font-size:0.62rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--faint); font-weight:600; margin:0 0 8px; }
.side-h + .side-h { margin-top:18px; }
.nav-item { display:flex; align-items:center; gap:10px; padding:9px 20px; color:var(--muted); font-size:0.92rem; border-left:2px solid transparent; text-decoration:none; }
.nav-item:hover { background:var(--surface-2); color:var(--text); }
.nav-item.active { color:var(--gold-soft); border-left-color:var(--gold); }
.nav-item .ic-box { width:24px; height:24px; border:1px solid var(--border-strong); border-radius:var(--radius-sm); display:grid; place-items:center; font-size:0.62rem; font-weight:700; color:var(--gold-soft); }
.nav-item.soon { color:var(--faint); }
.nav-item.soon .ic-box { color:var(--faint); }

/* Main */
.main { padding:32px; }
.breadcrumb { color:var(--faint); font-size:0.82rem; margin-bottom:14px; }
.breadcrumb a { color:var(--muted); }
.breadcrumb a:hover { color:var(--text); }

/* Headings */
h1.page-title { margin:0; font-size:1.7rem; font-weight:600; letter-spacing:-0.015em; color:var(--text); }
.page-meta { color:var(--faint); font-size:0.86rem; margin:6px 0 22px; }

/* Section labels (uppercase, gold-soft) */
.section-label { font-size:0.62rem; text-transform:uppercase; letter-spacing:0.22em; color:var(--gold-soft); font-weight:700; margin:32px 0 14px; }

/* Buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:9px 16px; border-radius:var(--radius-sm); font-size:0.86rem; font-weight:600; font-family:inherit; cursor:pointer; transition:border-color .15s, background .15s, color .15s; border:1px solid transparent; }
.btn:disabled { opacity:0.5; cursor:not-allowed; }
.btn-primary { background:var(--gold-soft); color:#100b02; border-color:var(--gold-soft); }
.btn-primary:hover:not(:disabled) { filter:brightness(1.1); }
.btn-secondary { background:var(--surface-2); color:var(--text); border-color:var(--border-strong); }
.btn-secondary:hover:not(:disabled) { border-color:var(--gold); color:var(--gold-soft); }
.btn-ghost { background:transparent; color:var(--muted); }
.btn-ghost:hover:not(:disabled) { color:var(--text); }
.btn-danger { background:rgba(224,86,63,0.08); color:var(--danger); border-color:rgba(224,86,63,0.4); }
.btn-danger:hover:not(:disabled) { background:rgba(224,86,63,0.16); }
.btn svg { stroke:currentColor; }

/* Chips */
.chip { display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface-2); color:var(--text); font-size:0.78rem; }
.chip-ok { color:var(--text); }
.chip-ok .chip-check { color:var(--success); font-weight:700; }
.chip-warn { color:var(--warn); border-color:rgba(217,164,65,0.3); background:rgba(217,164,65,0.08); }
.chip-gold { color:var(--gold-soft); border-color:var(--gold); }
.chip-muted { color:var(--muted); }
.flag-svg { display:inline-block; width:18px; height:13px; border-radius:1px; }
.flag-uk { background:linear-gradient(180deg,#012169 33%,#fff 33%,#fff 66%,#c8102e 66%); }
.flag-es { background:linear-gradient(180deg,#aa151b 33%,#f1bf00 33%,#f1bf00 66%,#aa151b 66%); }
.flag-eg { background:linear-gradient(180deg,#ce1126 33%,#fff 33%,#fff 66%,#000 66%); }

/* Stock badge */
.stock-badge { display:inline-flex; align-items:center; gap:6px; font-size:0.78rem; }
.stock-badge.stock-ok { color:var(--success); }
.stock-badge.stock-zero { color:var(--faint); }
.stock-dot { width:6px; height:6px; border-radius:50%; background:var(--success); }

/* Price tag */
.price-tag { color:var(--gold-soft); font-weight:600; }
.price-default { font-size:0.95rem; }
.price-lg { font-size:1.5rem; font-weight:700; }
.price-xl { font-size:1.95rem; font-weight:700; line-height:1; }

/* Quantity stepper */
.qty-stepper { display:inline-flex; align-items:center; border:1px solid var(--border-strong); border-radius:var(--radius-sm); overflow:hidden; }
.qty-stepper button { background:transparent; border:none; color:var(--text); padding:8px 12px; font-weight:700; cursor:pointer; font-family:inherit; }
.qty-stepper button:disabled { opacity:0.3; cursor:not-allowed; }
.qty-stepper button:hover:not(:disabled) { color:var(--gold-soft); }
.qty-display { padding:8px 14px; font-weight:600; border-left:1px solid var(--border-strong); border-right:1px solid var(--border-strong); min-width:80px; text-align:center; }

/* Quantity presets */
.qty-presets { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.qty-preset { background:var(--surface-2); border:1px solid var(--border); color:var(--text); padding:9px 0; border-radius:var(--radius-sm); font-weight:600; font-size:0.86rem; cursor:pointer; font-family:inherit; }
.qty-preset:hover { border-color:var(--gold); color:var(--gold-soft); }
.qty-preset.active { background:var(--gold-soft); color:#100b02; border-color:var(--gold-soft); }

/* Status badges */
.status-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:99px; font-size:0.72rem; font-weight:700; border:1px solid; }
.status-badge .sb-dot { width:5px; height:5px; border-radius:50%; }
.sb-ok { background:rgba(76,203,152,0.12); color:var(--success); border-color:rgba(76,203,152,0.3); }
.sb-ok .sb-dot { background:var(--success); }
.sb-warn { background:rgba(217,164,65,0.12); color:var(--warn); border-color:rgba(217,164,65,0.3); }
.sb-warn .sb-dot { background:var(--warn); }
.sb-info { background:rgba(122,162,200,0.12); color:var(--info); border-color:rgba(122,162,200,0.3); }
.sb-info .sb-dot { background:var(--info); }
.sb-muted { background:rgba(167,167,178,0.10); color:var(--muted); border-color:rgba(167,167,178,0.2); }
.sb-muted .sb-dot { background:var(--muted); }
.sb-bad { background:rgba(224,86,63,0.10); color:var(--danger); border-color:rgba(224,86,63,0.25); }
.sb-bad .sb-dot { background:var(--danger); }

/* Min quantity banner */
.min-qty-banner { background:rgba(217,164,65,0.08); border:1px solid rgba(217,164,65,0.3); border-radius:var(--radius-sm); padding:10px 12px; display:flex; align-items:center; gap:10px; font-size:0.82rem; color:var(--warn); }
.min-qty-banner svg { color:var(--warn); flex-shrink:0; stroke:currentColor; stroke-width:2; fill:none; }
.min-qty-banner strong { color:var(--text); font-weight:700; }

/* Featured product card */
.featured-product { display:grid; grid-template-columns:1fr 300px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); overflow:hidden; transition:border-color .15s, transform .15s; cursor:pointer; color:var(--text); }
.featured-product:hover { border-color:var(--gold-soft); transform:translateY(-2px); }
.featured-product:hover .fp-name { color:var(--gold-soft); }
@media (max-width:640px) { .featured-product { grid-template-columns:1fr; } }
.fp-left { padding:28px; }
.fp-name { font-size:1.5rem; font-weight:600; margin:0; letter-spacing:-0.01em; transition:color .15s; }
.fp-desc { color:var(--muted); margin:10px 0 0; font-size:0.88rem; line-height:1.55; max-width:36ch; }
.fp-servers { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
.fp-right { background:var(--surface-2); border-left:1px solid var(--border); padding:24px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; text-align:center; }
@media (max-width:640px) { .fp-right { border-left:none; border-top:1px solid var(--border); } }
.fp-pricegroup { display:flex; flex-direction:column; align-items:center; }
.fp-from { font-size:0.6rem; text-transform:uppercase; letter-spacing:0.18em; color:var(--faint); margin:0 0 4px; }
.fp-cta { display:inline-flex; align-items:center; gap:6px; color:var(--gold-soft); font-size:0.88rem; font-weight:600; }
.fp-cta svg { stroke:currentColor; stroke-width:2; fill:none; transition:transform .15s; }
.featured-product:hover .fp-cta svg { transform:translateX(4px); }
.badge-gold { display:inline-block; padding:2px 8px; border:1px solid var(--gold); color:var(--gold); font-size:0.62rem; letter-spacing:0.12em; text-transform:uppercase; border-radius:var(--radius-sm); margin-bottom:12px; font-weight:700; }

/* Featured list container + generic card */
.featured-list { display:flex; flex-direction:column; gap:14px; max-width:1024px; }
.card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); padding:18px; }

/* Tier ladder */
.ladder { border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); padding:18px; }
.ladder h4 { margin:0 0 12px; font-size:0.62rem; text-transform:uppercase; letter-spacing:0.18em; color:var(--faint); font-weight:600; }
.ladder-row { display:grid; grid-template-columns:80px 1fr 80px; align-items:center; padding:9px 0; gap:14px; font-size:0.92rem; }
.ladder-row + .ladder-row { border-top:1px solid var(--border); }
.ladder-row .ladder-qty { color:var(--muted); font-weight:600; }
.ladder-row .ladder-bar-cell { height:6px; background:var(--surface-2); border-radius:99px; overflow:hidden; }
.ladder-row .ladder-bar { height:100%; background:var(--gold-soft); border-radius:99px; }
.ladder-row .ladder-price { color:var(--gold-soft); text-align:right; font-weight:600; }
.ladder-row.active .ladder-qty { color:var(--text); }
.ladder-row.active .ladder-price { font-size:1.05rem; }
.ladder-row.unreachable { opacity:0.4; }

/* Server compat strip */
.server-compat { display:flex; gap:8px; flex-wrap:wrap; }

/* Order panel */
.order-panel { border:1px solid var(--border-strong); border-radius:var(--radius-sm); background:var(--surface); position:sticky; top:0; }
.order-panel-head { padding:14px 20px; border-bottom:1px solid var(--border); font-size:0.62rem; text-transform:uppercase; letter-spacing:0.18em; color:var(--faint); }
.order-body { padding:20px; display:flex; flex-direction:column; gap:14px; }
.order-row { display:flex; align-items:center; justify-content:space-between; }
.order-row-label { color:var(--muted); font-size:0.85rem; }
.order-row .num { color:var(--text); font-weight:600; }
.pricing-divider { padding-top:12px; border-top:1px solid var(--border); }
.order-row.total .num { font-size:1.45rem; font-weight:700; color:var(--gold-soft); }
.pay-btn { background:var(--gold-soft); color:#100b02; border:none; padding:12px; border-radius:var(--radius-sm); width:100%; font-weight:700; font-size:0.95rem; cursor:pointer; font-family:inherit; }
.pay-btn:hover:not(:disabled) { filter:brightness(1.1); }
.pay-btn:disabled { background:var(--surface-2); color:var(--faint); cursor:not-allowed; }
.login-gate { background:linear-gradient(180deg, rgba(122,162,200,0.06), transparent); border:1px solid rgba(122,162,200,0.3); border-radius:var(--radius-sm); padding:18px 16px; }
.login-gate h4 { margin:0 0 6px; color:var(--text); font-size:0.95rem; }
.login-gate p { margin:0 0 12px; color:var(--muted); font-size:0.82rem; line-height:1.5; }
.discord-btn.full { display:block; text-align:center; padding:12px; }

/* Coupon + price breakdown (shared desktop/mobile via _CouponAndPricing) */
.order-pricing { display:flex; flex-direction:column; gap:14px; }
.order-pricing [hidden] { display:none !important; }
.coupon-row { display:flex; gap:8px; }
.coupon-input { flex:1; min-width:0; background:var(--surface-2); border:1px solid var(--border); padding:9px 12px; border-radius:var(--radius-sm); color:var(--text); font-size:0.9rem; font-family:inherit; box-sizing:border-box; text-transform:uppercase; }
.coupon-input::placeholder { text-transform:none; color:var(--faint); }
.coupon-input:focus { outline:none; border-color:var(--gold-soft); }
.coupon-apply { background:var(--surface-2); border:1px solid var(--border); color:var(--text); padding:9px 16px; border-radius:var(--radius-sm); font-weight:600; font-size:0.86rem; cursor:pointer; font-family:inherit; white-space:nowrap; }
.coupon-apply:hover:not(:disabled) { border-color:var(--gold); color:var(--gold-soft); }
.coupon-apply:disabled { opacity:0.5; cursor:not-allowed; }
.coupon-applied { display:flex; align-items:center; justify-content:space-between; gap:8px; background:rgba(76,203,152,0.1); border:1px solid rgba(76,203,152,0.3); border-radius:var(--radius-sm); padding:8px 12px; font-size:0.82rem; color:var(--success); }
.coupon-applied-code { font-weight:700; text-transform:uppercase; }
.coupon-clear { background:none; border:none; color:var(--success); cursor:pointer; font-size:0.9rem; line-height:1; padding:2px 6px; }
.coupon-clear:hover { color:var(--text); }
.coupon-error { color:var(--danger); font-size:0.8rem; }
.order-row.order-discount-row .num { color:var(--success); }

/* Product page two-col layout */
.product-grid { display:grid; grid-template-columns:1fr 320px; gap:24px; align-items:flex-start; }
@media (max-width:900px) { .product-grid { grid-template-columns:1fr; } }
.product-desc { color:var(--muted); margin:10px 0 14px; max-width:48ch; font-size:0.9rem; line-height:1.6; }
.product-left .ladder { margin-top:14px; }

/* Order page (6-state machine) */
.order-page { max-width:720px; margin:0 auto; }
.order-head { display:flex; align-items:center; justify-content:space-between; padding:18px 20px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); margin-bottom:18px; }
.order-id { color:var(--gold-soft); font-family:ui-monospace,monospace; font-weight:700; font-size:1rem; }
.order-sub { color:var(--faint); font-size:0.78rem; margin-top:2px; }
.order-body-area { padding:32px 20px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); }

.state-block { text-align:center; }
.state-glyph { width:56px; height:56px; stroke:currentColor; stroke-width:2; fill:none; }
.state-glyph.info { color:var(--info); }
.state-glyph.success { color:var(--success); }
.state-glyph.warn { color:var(--warn); }
.state-glyph.muted { color:var(--faint); opacity:0.5; }
.state-title { margin:14px 0 8px; font-size:1.1rem; font-weight:700; color:var(--text); }
.state-title.success { color:var(--success); }
.state-title.muted { color:var(--muted); }
.state-sub { color:var(--muted); font-size:0.86rem; max-width:340px; margin:0 auto; line-height:1.55; }

.progress-indeterminate { width:240px; margin:18px auto 0; height:4px; background:var(--surface-2); border-radius:99px; overflow:hidden; }
.progress-indeterminate .bar { height:100%; background:var(--info); width:40%; animation:slide 2s infinite linear; border-radius:99px; }
@keyframes slide { 0% { transform:translateX(-100%) } 100% { transform:translateX(250%) } }

.creds-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); overflow:hidden; max-width:600px; margin:24px auto 0; text-align:left; }
.creds-head { padding:12px 18px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.creds-head h5 { margin:0; font-size:0.62rem; text-transform:uppercase; letter-spacing:0.18em; color:var(--faint); font-weight:600; }
.creds-count { color:var(--faint); font-size:0.7rem; }
.creds-box { background:var(--raised); padding:14px 18px; font-family:'JetBrains Mono', ui-monospace, monospace; font-size:0.82rem; color:var(--success); line-height:1.6; max-height:120px; overflow-y:auto; white-space:pre; margin:0; }
.action-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; max-width:600px; margin:14px auto 0; }
.action-btn { display:flex; flex-direction:column; align-items:center; gap:6px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); padding:14px 8px; cursor:pointer; font-family:inherit; color:var(--text); }
.action-btn svg { width:22px; height:22px; stroke:currentColor; stroke-width:2; fill:none; }
.action-btn .action-l { font-size:0.66rem; color:var(--muted); font-weight:700; letter-spacing:0.08em; text-transform:uppercase; }
.action-btn.copy { border-color:var(--gold); }
.action-btn.copy svg { color:var(--gold-soft); }
.action-btn.dl { border-color:var(--info); }
.action-btn.dl svg { color:var(--info); }
.action-btn.destroy { border-color:var(--danger); background:rgba(224,86,63,0.04); }
.action-btn.destroy svg { color:var(--danger); }

.money-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; max-width:420px; margin:24px auto 0; }
.money-box { border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); padding:14px; text-align:center; }
.money-box.short { border-color:rgba(217,164,65,0.4); background:rgba(217,164,65,0.05); }
.money-n { font-size:1.5rem; font-weight:700; color:var(--text); line-height:1; }
.money-n.warn { color:var(--warn); }
.money-l { font-size:0.62rem; color:var(--faint); margin-top:6px; text-transform:uppercase; letter-spacing:0.18em; font-weight:600; }
.money-l.warn { color:var(--warn); }

/* /account/orders list */
.orders-list { display:flex; flex-direction:column; gap:8px; }
.orders-row { display:grid; grid-template-columns:80px 1fr 80px 90px 130px 130px 90px; gap:14px; align-items:center; padding:14px 16px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); font-size:0.86rem; }
.orders-id { font-family:ui-monospace,monospace; color:var(--gold-soft); font-weight:700; }
.orders-product { color:var(--text); }
.orders-product-sub { color:var(--faint); font-size:0.74rem; }
.orders-qty, .orders-total { color:var(--text); }
.orders-total { font-weight:600; }
.orders-when { color:var(--faint); font-size:0.78rem; }
.orders-open { color:var(--gold-soft); font-weight:600; display:inline-flex; align-items:center; gap:6px; }
.orders-open svg { stroke:currentColor; stroke-width:2; fill:none; }
.orders-link-gone { color:var(--faint); font-size:0.74rem; }

/* Form fields (contact / reply / etc.) */
.field { margin-bottom:14px; }
.field-label { color:var(--muted); font-size:0.78rem; font-weight:600; margin-bottom:6px; display:block; }
.input, select.input, textarea.input { width:100%; background:var(--surface-2); border:1px solid var(--border); padding:9px 12px; border-radius:var(--radius-sm); color:var(--text); font-size:0.9rem; font-family:inherit; box-sizing:border-box; }
.input:focus { outline:none; border-color:var(--gold-soft); }

/* Support tickets list + thread */
.tickets-list { display:flex; flex-direction:column; gap:8px; }
.ticket-row { display:grid; grid-template-columns:80px 1fr 130px 130px 90px; gap:14px; align-items:center; padding:14px 16px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); font-size:0.86rem; color:inherit; }
.ticket-row:hover { border-color:var(--gold-soft); }
.thread { display:flex; flex-direction:column; gap:10px; max-width:600px; }
.thread-msg { padding:12px 14px; border-radius:var(--radius-sm); border:1px solid var(--border); background:var(--surface); }
.thread-msg.op { background:var(--surface-2); border-color:var(--border-strong); margin-left:48px; }
.thread-msg.buyer { margin-right:48px; }
.thread-meta { color:var(--faint); font-size:0.72rem; margin-bottom:4px; }
.thread-body { color:var(--text); font-size:0.9rem; line-height:1.55; white-space:pre-wrap; }

/* How it works page */
.step { display:grid; grid-template-columns:64px 1fr; gap:18px; align-items:flex-start; padding:18px 20px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); margin-bottom:10px; max-width:760px; }
.step-num { width:48px; height:48px; border:1px solid var(--border-strong); border-radius:var(--radius-sm); display:grid; place-items:center; font-family:serif; font-size:1.4rem; color:var(--gold-soft); }
.step-body h3 { margin:0; font-size:1rem; color:var(--text); font-weight:600; display:flex; align-items:center; gap:10px; }
.step-body h3 svg { color:var(--gold-soft); width:20px; height:20px; stroke:currentColor; stroke-width:2; fill:none; }
.step-body p { color:var(--muted); font-size:0.86rem; line-height:1.55; margin:6px 0 0; max-width:54ch; }
.qa { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); margin-bottom:8px; max-width:760px; }
.qa summary { padding:14px 18px; cursor:pointer; display:flex; align-items:center; gap:12px; color:var(--text); font-size:0.92rem; font-weight:600; }
.qa summary svg { color:var(--warn); width:18px; height:18px; stroke:currentColor; stroke-width:2; fill:none; }
.qa p { padding:0 18px 14px 46px; color:var(--muted); font-size:0.85rem; line-height:1.55; margin:0; }
.support-cta { display:flex; align-items:center; gap:16px; padding:20px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); margin-top:24px; max-width:760px; }
.support-cta svg { color:var(--gold-soft); stroke:currentColor; stroke-width:2; fill:none; }
.support-cta h4 { margin:0; color:var(--text); font-size:1rem; font-weight:600; }
.support-cta p { margin:4px 0 0; color:var(--muted); font-size:0.86rem; }

.coin-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:12px; max-width:1024px; margin-bottom:24px; }
.coin-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); padding:18px; display:flex; flex-direction:column; gap:8px; }
.coin-card .coin-head { display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
.coin-card .coin-sym { font-weight:700; font-size:1.05rem; color:var(--text); letter-spacing:-0.01em; }
.coin-card .coin-net { font-size:0.7rem; color:var(--faint); text-transform:uppercase; letter-spacing:0.08em; font-weight:600; }
.coin-card .coin-time { font-size:1.5rem; font-weight:700; color:var(--gold-soft); line-height:1; }
.coin-card .coin-note { margin:0; color:var(--muted); font-size:0.82rem; line-height:1.5; }

.admin-chip { padding:4px 10px; border-radius:var(--radius-sm); font-size:0.7rem; font-weight:700; background:transparent; color:var(--gold-soft); border:1px solid var(--gold); letter-spacing:0.06em; text-transform:uppercase; }
.admin-chip:hover { background:var(--gold-soft); color:#100b02; }

.account-icons { display:flex; gap:8px; padding:6px 20px 0; }
.account-icon { display:grid; place-items:center; width:36px; height:36px; border:1px solid var(--border-strong); border-radius:var(--radius-sm); color:var(--muted); }
.account-icon svg { stroke:currentColor; stroke-width:2; fill:none; }
.account-icon:hover { color:var(--gold-soft); border-color:var(--gold); background:var(--surface-2); }

/* Sidebar nav-item ic-box hosting an SVG icon (not a letter) */
.sidebar .nav-item .ic-box svg { stroke: currentColor; stroke-width: 2; fill: none; color: var(--gold-soft); }
.sidebar .nav-item.soon .ic-box svg { color: var(--faint); }

/* Wordmark — Spectral 800 (storefront + mobile + admin) */
.brand-word, .m-brand-word { font-family: 'Spectral', Georgia, serif; font-weight: 800; font-size: 1.2rem; letter-spacing: 0.005em; }
.m-brand-word { font-size: 1.05rem; }

/* Guides */
.guide { max-width: 760px; }
.guide .guide-body { color: var(--text); font-size: 0.95rem; line-height: 1.7; }
.guide .guide-body h2 { color: var(--text); font-size: 1.25rem; font-weight: 700; margin: 26px 0 10px; letter-spacing: -0.01em; }
.guide .guide-body h3 { color: var(--text); font-size: 1.05rem; font-weight: 700; margin: 20px 0 8px; }
.guide .guide-body p { margin: 0 0 14px; }
.guide .guide-body ul, .guide .guide-body ol { margin: 0 0 14px 1.2rem; }
.guide .guide-body li { margin-bottom: 6px; }
.guide .guide-body a { color: var(--gold-soft); text-decoration: underline; }
.guide .guide-body strong { color: var(--text); }
.guide .guide-body table { width: 100%; border-collapse: collapse; margin: 0 0 14px; font-size: 0.88rem; }
.guide .guide-body th, .guide .guide-body td { border: 1px solid var(--border); padding: 8px 10px; text-align: left; }
.guide .guide-body th { background: var(--surface-2); color: var(--faint); font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.05em; }
.guide .guide-body blockquote { margin: 0 0 14px; padding: 10px 14px; border-inline-start: 3px solid var(--gold-soft); background: var(--surface-2); color: var(--muted); }
.guide .guide-body .guide-cta { display: block; background: var(--gold-soft); color: #100b02 !important; text-align: center; padding: 14px; border-radius: var(--radius-sm); font-weight: 700; text-decoration: none !important; margin: 20px 0; }
.guide-list { display: flex; flex-direction: column; gap: 12px; max-width: 760px; }
.guide-card { display: block; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 16px 18px; color: var(--text); text-decoration: none; }
.guide-card:hover { border-color: var(--gold-soft); }
.guide-card h3 { font-size: 1rem; font-weight: 700; margin: 0 0 6px; }
.guide-card p { color: var(--muted); font-size: 0.85rem; margin: 0 0 8px; line-height: 1.55; }
.guide-card .guide-meta { color: var(--faint); font-size: 0.72rem; }

/* ── Reviews & testimonials ─────────────────────────────────────── */
.rating-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 0.85rem; color: var(--muted); }
.rating-chip .stars { color: var(--gold-soft); letter-spacing: 1px; }
.rating-chip .rating-count { color: var(--faint); }

.reviews { max-width: 760px; margin: 28px 0 0; }
.reviews .reviews-h { font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.22em; color: var(--gold-soft); font-weight: 700; margin: 0 0 14px; }
.reviews .no-reviews { color: var(--faint); font-size: 0.85rem; }
.review-item { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 14px 16px; margin-bottom: 10px; }
.review-item .review-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.review-item .review-author { font-weight: 700; color: var(--text); font-size: 0.9rem; }
.review-item .stars { color: var(--gold-soft); letter-spacing: 1px; font-size: 0.9rem; }
.review-item .review-body { color: var(--muted); font-size: 0.88rem; line-height: 1.55; margin: 0; }
.review-item .review-date { color: var(--faint); font-size: 0.72rem; }

/* Buyer submit form on the delivered order page */
.review-form-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 16px 18px; margin-top: 16px; text-align: left; }
.review-form-card .review-form-title { font-size: 0.95rem; font-weight: 700; color: var(--text); margin: 0 0 12px; }
.review-form-card .review-field { margin-bottom: 12px; }
.review-form-card .review-label { display: block; color: var(--muted); font-size: 0.78rem; font-weight: 600; margin-bottom: 6px; }
.review-form-card .review-textarea { width: 100%; background: var(--surface-2); border: 1px solid var(--border); padding: 9px 12px; border-radius: var(--radius-sm); color: var(--text); font-size: 0.9rem; font-family: inherit; box-sizing: border-box; resize: vertical; }
.review-form-card .review-textarea:focus { outline: none; border-color: var(--gold-soft); }
.review-form-card .review-thanks { color: var(--muted); font-size: 0.9rem; margin: 0; }
/* CSS-only star rating selector (radios laid out high→low so :hover/:checked siblings light up) */
.star-input { display: inline-flex; flex-direction: row-reverse; gap: 2px; font-size: 1.5rem; }
.star-input input { position: absolute; opacity: 0; width: 0; height: 0; }
.star-input label { color: var(--border-strong); cursor: pointer; transition: color .12s; }
.star-input input:checked ~ label,
.star-input label:hover,
.star-input label:hover ~ label { color: var(--gold-soft); }