/* Storefront-only black / gold theme. Order logic and admin are unchanged. */
:root {
  color-scheme: dark;
  --bg: #0b0b09;
  --surface: #141410;
  --ink: #f5f1e7;
  --muted: #aaa392;
  --line: #3d3522;
  --lime: #f3cf76;
  --violet: #e0b950;
  --radius: 20px;
  --shadow: 0 16px 40px #0005;
  --gold-fill: linear-gradient(115deg, #ffe394, #e4b84d 58%, #b8841e);
}
body { background: radial-gradient(ellipse at 90% 0, #6d511b26, transparent 38%), var(--bg); }
body:before { display: none; }
::selection { background: #e0b950; color: #111; }
:focus-visible { outline: 2px solid #ffe394; outline-offset: 4px; }
input, textarea, select { color: var(--ink); }
input::placeholder, textarea::placeholder { color: #9c9688; }
.topbar { width: min(1332px, calc(100% - 40px)); height: 76px; gap: 24px; }
.brand { font-family: inherit; font-size: 20px; letter-spacing: -.03em; }
.brand small { color: #b5a783; }
.brand-mark { border-radius: 12px; background: var(--gold-fill); color: #201805; }
.topbar nav { gap: 8px; }
.topbar nav a, .topbar nav button { padding: 12px 16px; border-radius: 24px; font-size: 13px; }
.topbar nav .active { color: var(--violet); background: #302814; border: 0; }
.topbar nav a:hover, .topbar nav button:hover { color: #f4d78b; background: #252117; }
.topbar nav a[href="#agency"] { background: var(--gold-fill); color: #241b08; font-weight: 700; }
.header-actions { margin-left: 12px; }
.header-actions .dark { border-radius: 24px !important; background: var(--gold-fill) !important; color: #241b08 !important; border-color: transparent !important; }
main { width: min(1332px, calc(100% - 40px)); }
.hero { position: relative; isolation: isolate; overflow: hidden; min-height: 300px; margin: 28px 0; padding: 36px 40px; border: 1px solid var(--line); border-radius: 26px; background: linear-gradient(110deg, #201a0e, #0c0c09 65%); }
.hero:after { content: ""; position: absolute; z-index: -1; width: 260px; height: 260px; right: 5%; top: 70px; border-radius: 50%; border: 1px solid #b393422e; background: radial-gradient(circle at 23% 18%, #ac87373b, #0c0c09 65%); box-shadow: -36px -30px 65px #d3a8491c; pointer-events: none; }
.hero h1 { font-family: inherit; font-weight: 750; font-size: clamp(34px, 4vw, 52px); line-height: 1.2; letter-spacing: -.035em; }
.hero>div:first-child { min-width: 0; }
.hero h1.hero-title { margin: 0; font-size: clamp(38px, 4.2vw, 56px); line-height: 1.2; color: var(--ink); }
.hero .hero-subtitle { margin: 18px 0 0; font-size: clamp(18px, 2vw, 24px); font-weight: 500; line-height: 1.5; color: var(--violet); }
.hero-intro { margin: 18px 0; max-width: 620px; font-size: 14px; }
.hero-buttons { margin-top: 24px; flex-wrap: wrap; }
.hero-cta, .hero-partner { border-radius: 12px; padding: 14px 22px; font-size: 13px; text-align: center; }
.hero-cta { background: var(--gold-fill); color: #241b08; border: 1px solid transparent; }
.hero-partner { background: #1a170f; border-color: #79612b; color: #efd28a; }
.hero-cta:hover { filter: brightness(1.08); }
.hero-partner:hover { background: #302714; }
.hero-note { border-radius: 16px; background: #11110cd9; transform: none; padding: 20px; }
.shop-layout { gap: 28px; grid-template-columns: 250px minmax(0, 1fr); }
.sidebar { top: 24px; }
.panel, .support-card { border-radius: 20px; background: var(--surface); }
.categories-panel { padding: 4px 16px 8px; border: 1px solid var(--line); }
.panel-title { border: 0; }
.panel-title small { color: #b1a27b; }
.panel-title h2, .catalog-head h2 { font-family: inherit; font-weight: 700; }
.categories-panel h2 { font-size: 17px; }
.categories { padding: 0; }
.category { border: 0; border-radius: 24px; color: var(--muted); }
.category:hover { background: #252217; color: var(--ink); }
.category.active { background: #302916; color: #efc965; }
.category-icon, .category.active .category-icon { background: #3b321c; color: #efc965; }
.category b { color: #c9bd9d; }
.support-card { background: linear-gradient(145deg, #312711, #11110e 70%); }
.support-card p, .badge, .trust-row { color: #b7ae9b; }
.support-card h3 { color: var(--ink); }
.support-card button { background: var(--gold-fill); color: #241b08; border-radius: 12px; }
.badge { border-color: #65542b; }
.qr-demo { border-radius: 12px; }
.catalog-panel { background: transparent; border: 0; min-width: 0; }
.catalog-head .panel-title h2 { font-size: 28px; }
.search { border-radius: 12px; background: #151510; color: var(--muted); }
.tools, .search, .search input { min-width: 0; }
.search kbd { background: #272319; border-color: var(--line); color: #bfb6a3; }
.tools .dark { border-radius: 12px !important; background: var(--gold-fill) !important; color: #241b08 !important; border-color: transparent !important; }
.filter-btn { border-radius: 12px !important; background: #201d13; color: #efd28a; border-color: #65542b; }
.stats, .stats select, .stats strong { color: #bcb39e; }
.stats select option { background: #171610; color: var(--ink); }
.product-list { gap: 16px; }
.product { border-radius: 18px; background: #151510; }
.product:hover { background: #1c1a11; border-color: #947332; border-radius: 18px; transform: translateY(-3px); box-shadow: 0 12px 32px #0006; }
.product-cover { aspect-ratio: 1 / 1; background: #0c0913; border-bottom: 1px solid var(--line); }
.product-cover img { object-fit: contain; }
.product-body { padding: 18px; }
.product h3 { font-family: inherit; color: var(--ink); font-size: 15px; font-weight: 650; line-height: 1.65; }
.product p { color: var(--muted); font-size: 11px; line-height: 1.7; }
.tags { flex-wrap: wrap; }
.tags span { background: #2c2615; color: #e3c474; border-radius: 20px; border: 1px solid #55451f; font-size: 9px; }
.card-price strong { font-family: inherit; font-size: 26px; color: #f3cc6b; font-variant-numeric: tabular-nums; }
.card-stats { border-color: var(--line); color: #b9b19e; font-size: 11px; }
.product .buy { display: block; border: 0; border-radius: 12px; padding: 12px; background: var(--gold-fill); color: #241b08; font-size: 12px; }
.product .buy:hover { background: var(--gold-fill); color: #241b08; filter: brightness(1.12); }
.product .buy:disabled { background: #302e26; color: #b2aa95; cursor: not-allowed; }
.empty-state, .empty-state h3 { color: var(--muted); }
.market-stats { margin-top: 26px; border-radius: 18px; overflow: hidden; background: #151510; }
.market-stats strong { font-family: inherit; font-size: 25px; }
.market-stats span { font-size: 12px; }
.buy-guide h2, .section-heading h2, .agency h2 { font-family: inherit; font-weight: 650; letter-spacing: -.03em; }
.guide-grid article, .process-line article { background: #141410; }
.guide-grid article { border-radius: 18px; }
.guide-grid h3, .process-line h3, .faq summary { font-family: inherit; color: var(--ink); }
.guide-grid p, .process-line p, .faq details p { font-size: 13px; }
.guide-grid b, .process-line>article>span { color: #d0ad61; }
.process-line { border-radius: 18px; overflow: hidden; }
.agency { border: 1px solid var(--line); border-radius: 26px; background: linear-gradient(125deg, #30240f, #12120f 60%); }
.agency:before, .agency:after { display: none; }
.agency h2 em { color: var(--violet); }
.agency-head>p { font-size: 14px; }
.agency-head { border-color: var(--line); }
.agency-model { border-color: var(--line); border-radius: 18px; background: #151510; }
.model-flow article h3, .agency-apply h3 { font-family: inherit; }
.model-flow article b, .model-flow>i { color: #cfb376; }
.agency-fit { border-color: var(--line); }
.agency-fit span { border-color: #57482b; color: #c9bb99; border-radius: 20px; }
.agency-apply { background: #10100d; border: 1px solid #655029; border-radius: 18px; color: var(--ink); }
.agency-apply h3 { margin-top: 30px; font-size: 26px; }
.agency-apply>p { color: #bcb29c; font-size: 13px; }
.agency-apply>.hero-cta { width: 100%; margin-top: 22px; }
.agency-badge { background: #342a13; color: #f0cd76; border-radius: 6px; }
.apply-action { border-radius: 12px; background: #242015; color: var(--ink); }
.apply-action img { border-radius: 6px; }
.apply-action span { color: #e0be72; }
.apply-action small, .apply-top>b, .apply-note { color: #b8ac91; }
footer { width: min(1332px, calc(100% - 40px)); color: var(--muted); }
/* Keep all checkout and lookup surfaces readable in the dark theme. */
.modal-mask { background: #000b; backdrop-filter: blur(4px); }
.modal-card { border-radius: 22px; border: 1px solid #685329; background: #151510; box-shadow: 0 24px 80px #0009; }
.modal-card h2 { font-family: inherit; font-size: 26px; }
.modal-card>p, .secure-note, .manual-payment-panel>p { color: #b7ad99; }
.modal-close, .quantity button { border-radius: 10px; background: #282316; color: #f0d188; }
.checkout, .query-form button, .query-help button { border-radius: 12px; background: var(--gold-fill); color: #241b08; }
.order-tip, .payment-fee-note, .ready-instruction, .query-help { background: #292313; border-color: #5c4923; color: #cabe9f; border-radius: 12px; }
.order-field input, .order-field textarea, .query-form input { border-radius: 10px; background: #0d0d0b; color: var(--ink); border-color: #5c5034; font-size: 14px; }
.order-field input:focus, .order-field textarea:focus, .query-form input:focus { border-color: #e0b950; box-shadow: 0 0 0 3px #e0b95020; }
.query-form label, .order-field>label { color: #c9bea4; }
.order-field>p { color: #aaa18e; font-size: 11px; line-height: 1.7; }
#captchaRefresh { margin-top: 10px; padding: 9px 15px; border-radius: 9px; border: 1px solid #685329; background: #292313; color: #f0cd76; }
#orderEntry [role="alert"] { color: #ffac95 !important; }
.order-field small { color: #ffac95; }
.payment-option { border-radius: 12px; background: #1b1912; }
.payment-option:hover, .payment-option.active { background: #302713; border-color: #d2aa4d; box-shadow: 0 0 0 2px #d2aa4d16; }
.payment-option small { color: #bfb49c; }
.ready-contact { background: #242015; border-color: #57482b; border-radius: 12px; }
.ready-contact span { color: #bdb29a; }
.usdt-payment-box { background: #11221c; border-color: #37674e; border-radius: 12px; }
.usdt-payment-box>strong { color: #84dbb4; }
.usdt-payment-box>code { background: #0a1711; color: #e4eee7; }
.usdt-payment-box>small { color: #dec786; }
.manual-payment-panel dd.expired { color: #ffac95; }
.query-symbol { border-radius: 16px; background: #302713; }
.query-result { background: #211e14; border-color: #685329; }
.query-result.success { background: #132319; border-color: #3b674a; }
.query-result.error { background: #301b15; border-color: #905844; }
.query-result p { color: #c1b6a1; }
.query-result strong { overflow-wrap: anywhere; min-width: 0; }
.recent-order { border-color: var(--line); }
.recent-orders button, .recent-order small { color: #b8af9c; }
.status-pill { background: #493817; color: #f5d68a; }
@media (max-width: 1100px) {
  .topbar { gap: 12px; }
  .topbar nav { gap: 2px; }
  .topbar nav a, .topbar nav button { padding: 11px 10px; }
  .shop-layout { gap: 22px; grid-template-columns: 220px minmax(0, 1fr); }
  .product-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .topbar { height: 66px; }
  .shop-layout { grid-template-columns: minmax(0, 1fr); }
  .sidebar { top: 12px; background: #11110e; border: 1px solid var(--line); border-radius: 20px; padding: 18px; }
  .hero { min-height: 280px; padding: 30px; }
  .hero-note { display: none; }
  .market-stats div { border-color: var(--line); }
}
@media (max-width: 620px) {
  main, .topbar, footer { width: calc(100% - 24px); }
  .hero { margin: 18px 0 24px; padding: 26px 22px; border-radius: 20px; min-height: 0; }
  .hero h1 { font-size: 34px; }
  .hero-intro { font-size: 13px; }
  .hero:after { width: 180px; height: 180px; right: -90px; top: 10px; opacity: .65; }
  .hero-buttons { display: grid; gap: 10px; }
  .hero>div:first-child { width: 100%; }
  .hero-cta, .hero-partner { padding: 13px 14px; font-size: 12px; }
  .catalog-head .panel-title h2 { font-size: 25px; }
  .catalog-head { padding: 0 0 16px; }
  .product-list { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .product h3 { font-size: 16px; }
  .product-cover { aspect-ratio: 1 / 1; }
  .product .buy { display: block; }
  .agency { margin-top: 48px; padding: 30px 16px; }
  .agency h2 { font-size: 31px; line-height: 1.3; }
  .agency-model, .agency-apply { padding: 22px 16px; }
  .apply-action { grid-template-columns: 96px minmax(0, 1fr); gap: 12px; }
  .model-flow>i { background: #79612b; }
  .modal-card { padding: 40px 22px; border-radius: 18px; }
  .modal-card h2 { font-size: 23px; line-height: 1.4; }
  .payment-option small { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .product:hover { transform: none; }
}

/* Black, violet and champagne gold — matched to the existing product artwork. */
:root {
  --bg: #0b0811;
  --surface: #15101f;
  --ink: #f5f0fc;
  --muted: #b3a7c2;
  --line: #3d2a54;
  --violet: #d2acff;
  --shadow: 0 16px 40px #0006;
  --gold-fill: linear-gradient(115deg, #ffe4a0, #e7bc61 58%, #bd8833);
}
body { background: radial-gradient(ellipse at 90% 0, #712cb333, transparent 40%), radial-gradient(ellipse at 0 35%, #4d22691c, transparent 35%), var(--bg); }
::selection { background: #9c63d9; color: #fff; }
:focus-visible { outline-color: #d6afff; }
.brand small, .panel-title small { color: #c0a7dc; }
.brand-mark { box-shadow: 0 0 20px #9b56f333; }
.topbar nav .active { background: #2e1a46; color: #e0bfff; }
.topbar nav a:hover, .topbar nav button:hover { background: #281a39; color: #f0d6ff; }
.topbar nav a[href="#agency"]:hover { background: var(--gold-fill); color: #241b08; }
.hero { background: radial-gradient(ellipse at 82% 45%, #6b2b9938, transparent 52%), linear-gradient(110deg, #1d112d, #100b18 65%); border-color: #64427f; box-shadow: inset 0 1px 0 #cba0ff12; }
.hero:after { border-color: #b67aff66; background: radial-gradient(circle at 23% 18%, #b378ed4d, #140c1e 65%); box-shadow: -36px -30px 65px #a750eb26, 18px 25px 50px #e4b7530f; }
.hero .hero-subtitle { color: #e9c881; }
.hero-partner { background: #281539; border-color: #9962c7; color: #e4c5ff; }
.hero-partner:hover { background: #39214e; }
.hero-note { background: #170f23df; border-color: #5e3d7c; }
.category { border-color: var(--line); }
.category:hover { background: #251731; color: #f2e7ff; }
.category.active { background: #302040; color: #e5c3ff; }
.category-icon, .category.active .category-icon { background: #47285f; color: #ecc9ff; }
.category b { color: #c9b4dc; }
.support-card { background: linear-gradient(145deg, #302040, #15101e 70%); border-color: #66477f; }
.support-card p, .badge, .trust-row { color: #c0b0ce; }
.badge { border-color: #70558b; }
.search { background: #17101f; border-color: #5a3e73; }
.search kbd { background: #281c36; border-color: #5a3e73; color: #c4b2d3; }
.filter-btn { background: #291c3a; color: #e4c5ff; border-color: #76549a; }
.stats, .stats select, .stats strong { color: #b9aac9; }
.stats select option { background: #17101f; }
.product { background: #161020; border-color: #4b3262; }
.product:hover { background: #20142b; border-color: #b882e7; box-shadow: 0 10px 32px #0006, 0 0 20px #9a47e61a; }
.tags span { background: #30213f; color: #ddbeff; border-color: #674580; }
.card-stats { color: #c1b0d0; }
.card-price strong { color: #f3cf80; }
.market-stats, .guide-grid article, .process-line article { background: #15101f; }
.market-stats strong { color: #efcb7e; }
.agency { background: radial-gradient(ellipse at 0 0, #7634a630, transparent 60%), linear-gradient(125deg, #241333, #120d1b 65%); border-color: #61407b; }
.agency h2 em { color: #e8c481; }
.agency-model { background: #191022; }
.agency-fit span { border-color: #694980; color: #cbb4df; }
.agency-apply { background: #160e22; border-color: #79603f; }
.agency-apply>p, .apply-note, .apply-top>b { color: #c5b4d2; }
.agency-badge { background: #342042; color: #efcb7e; }
.apply-action, .ready-contact { background: #291c37; border-color: #63447d; }
.apply-action small, .ready-contact span { color: #bcabcd; }
.modal-card { background: #17101f; border-color: #845da6; }
.modal-close, .quantity button { background: #312040; color: #e8c7ff; }
.modal-card>p, .secure-note, .manual-payment-panel>p { color: #bdaccd; }
.order-tip, .payment-fee-note, .ready-instruction, .query-help { background: #291b37; border-color: #66487d; color: #d4c1e3; }
.order-field input, .order-field textarea, .query-form input { background: #100b16; border-color: #674d7d; }
input::placeholder, textarea::placeholder { color: #b4a2c4; }
.order-field input:focus, .order-field textarea:focus, .query-form input:focus { border-color: #c28aef; box-shadow: 0 0 0 3px #b578ed22; }
.query-form label, .order-field>label { color: #ddc7ef; }
.order-field>p { color: #bfaacd; }
#captchaRefresh { background: #302040; border-color: #845da6; color: #dfb8fc; }
.payment-option { background: #201429; }
.payment-option:hover, .payment-option.active { background: #372149; border-color: #c593f0; box-shadow: 0 0 0 2px #b878f21a; }
.payment-option small { color: #c9b3d9; }
.query-symbol { background: #302040; }
.query-result:not(.error):not(.success) { background: #25182f; border-color: #694b81; }
.query-result p, .recent-orders button, .recent-order small { color: #c7b5d5; }
.model-flow>i { color: #ac80c6; }
@media(max-width:900px) { .sidebar { background: #130d1c; border-color: #61407b; } }
@media(max-width:620px) { .model-flow>i { background: #795397; } }
