/* ساخته‌شده با website/themes/build.js — دستی ویرایش نکن؛ منبع در website/themes/ است. */

/* ---------- neu ---------- */
:root[data-style="neu"] { --bg: #e6eaf0; --surface: #e6eaf0; --surface-2: #e6eaf0; --fill: #e6eaf0; --fill-2: #dde2ea; --glass: #e6eaf0; --line: transparent; --line-2: rgba(163, 177, 198, .35); --nm-light: #ffffff; --nm-dark: #b8c1cf; --nm-out: 7px 7px 16px var(--nm-dark), -7px -7px 16px var(--nm-light); --nm-out-sm: 4px 4px 9px var(--nm-dark), -4px -4px 9px var(--nm-light); --nm-out-lg: 12px 12px 28px var(--nm-dark), -12px -12px 28px var(--nm-light); --nm-in: inset 4px 4px 9px var(--nm-dark), inset -4px -4px 9px var(--nm-light); --nm-in-sm: inset 2px 2px 5px var(--nm-dark), inset -2px -2px 5px var(--nm-light); --nm-text: 1px 1px 1px rgba(255, 255, 255, .9), -1px -1px 1px rgba(120, 135, 160, .18); --e1: var(--nm-out-sm); --e2: var(--nm-out); --e3: var(--nm-out); --e4: var(--nm-out-lg); --shadow: var(--nm-out); }
:root[data-style="neu"][data-theme="dark"] { --bg: #1d222b; --surface: #1d222b; --surface-2: #1d222b; --fill: #1d222b; --fill-2: #222833; --glass: #1d222b; --line: transparent; --line-2: rgba(255, 255, 255, .06); --nm-light: #262d38; --nm-dark: #12161c; --nm-text: 1px 1px 1px rgba(0, 0, 0, .55), -1px -1px 1px rgba(255, 255, 255, .06); }
:root[data-style="neu"] body { background: var(--bg); }
:root[data-style="neu"] .glass,
:root[data-style="neu"] .p-card,
:root[data-style="neu"] .cat-tile,
:root[data-style="neu"] .finder,
:root[data-style="neu"] .faq details,
:root[data-style="neu"] .empty,
:root[data-style="neu"] .contact-card,
:root[data-style="neu"] .spec,
:root[data-style="neu"] .stats > div,
:root[data-style="neu"] .opt label,
:root[data-style="neu"] .addr-opt,
:root[data-style="neu"] .brand-pill,
:root[data-style="neu"] .step,
:root[data-style="neu"] .install-banner,
:root[data-style="neu"] .table-wrap,
:root[data-style="neu"] .sp-panel,
:root[data-style="neu"] .cmdk,
:root[data-style="neu"] .toast,
:root[data-style="neu"] .filters,
:root[data-style="neu"] .tree,
:root[data-style="neu"] .acc-nav,
:root[data-style="neu"] .qty,
:root[data-style="neu"] .compare-bar,
:root[data-style="neu"] .reach,
:root[data-style="neu"] .hero-badges span,
:root[data-style="neu"] .chip,
:root[data-style="neu"] .sum,
:root[data-style="neu"] .result { background: var(--bg) !important; border-color: transparent !important; box-shadow: var(--nm-out) !important; }
:root[data-style="neu"] .p-card,
:root[data-style="neu"] .cat-tile,
:root[data-style="neu"] .glass { border-radius: var(--r-lg) !important; }
:root[data-style="neu"] .p-card:hover,
:root[data-style="neu"] .cat-tile:hover { box-shadow: var(--nm-out-lg) !important; transform: translateY(-2px); }
:root[data-style="neu"] .site-header { background: var(--bg) !important; box-shadow: 0 6px 16px -8px var(--nm-dark), 0 -1px 0 var(--nm-light) inset !important; border: 0 !important; backdrop-filter: none !important; }
:root[data-style="neu"] .site-footer { background: var(--bg) !important; color: var(--text) !important; box-shadow: inset 0 8px 18px -10px var(--nm-dark); }
:root[data-style="neu"] .site-footer a,
:root[data-style="neu"] .site-footer h4,
:root[data-style="neu"] .footer-mark,
:root[data-style="neu"] .footer-claim { color: var(--text) !important; }
:root[data-style="neu"] .btn,
:root[data-style="neu"] .icon-btn,
:root[data-style="neu"] .search-trigger,
:root[data-style="neu"] .add-btn,
:root[data-style="neu"] .fav-btn,
:root[data-style="neu"] .cmp-btn,
:root[data-style="neu"] .sp-chip,
:root[data-style="neu"] .sp-x,
:root[data-style="neu"] .main-nav a,
:root[data-style="neu"] .bottom-bar a,
:root[data-style="neu"] .socials a { background: var(--bg) !important; border: 0 !important; box-shadow: var(--nm-out-sm) !important; color: var(--text) !important; transition: box-shadow var(--d-2) var(--ease), transform var(--d-1) var(--ease) !important; }
:root[data-style="neu"] .btn:hover,
:root[data-style="neu"] .icon-btn:hover,
:root[data-style="neu"] .search-trigger:hover,
:root[data-style="neu"] .sp-chip:hover { box-shadow: var(--nm-out) !important; }
:root[data-style="neu"] .btn:active,
:root[data-style="neu"] .icon-btn:active,
:root[data-style="neu"] .add-btn:active,
:root[data-style="neu"] .sp-chip:active,
:root[data-style="neu"] .main-nav a.on,
:root[data-style="neu"] .main-nav a[aria-current],
:root[data-style="neu"] .bottom-bar a.on { box-shadow: var(--nm-in-sm) !important; transform: none; }
:root[data-style="neu"] .main-nav a { border-radius: var(--r-full); padding: 7px 10px; }
:root[data-style="neu"] .main-nav a::after { display: none !important; }
:root[data-style="neu"] .main-nav a.on,
:root[data-style="neu"] .bottom-bar a.on { color: var(--brand-ink) !important; }
:root[data-style="neu"] .btn-primary,
:root[data-style="neu"] .sp-send-btn,
:root[data-style="neu"] .sp-fab,
:root[data-style="neu"] .btn-primary.magnetic { background: linear-gradient(145deg, #e8313d, #b8141f) !important; color: #fff !important; box-shadow: 6px 6px 14px var(--nm-dark), -6px -6px 14px var(--nm-light), inset 0 1px 0 rgba(255,255,255,.25) !important; text-shadow: 0 1px 1px rgba(0,0,0,.2) !important; }
:root[data-style="neu"] .btn-primary:active,
:root[data-style="neu"] .sp-send-btn:active { box-shadow: inset 3px 3px 7px rgba(90,0,6,.45), inset -3px -3px 7px rgba(255,120,120,.25) !important; }
:root[data-style="neu"] .input,
:root[data-style="neu"] input.input,
:root[data-style="neu"] textarea.input,
:root[data-style="neu"] select.input,
:root[data-style="neu"] .sp-input,
:root[data-style="neu"] .cmdk-field input,
:root[data-style="neu"] .otp input,
:root[data-style="neu"] .f-sum { background: var(--bg) !important; border: 0 !important; box-shadow: var(--nm-in) !important; border-radius: var(--r-md) !important; }
:root[data-style="neu"] .input:focus,
:root[data-style="neu"] .sp-input:focus { box-shadow: var(--nm-in), 0 0 0 2px var(--ring) !important; outline: none !important; }
:root[data-style="neu"] h1,
:root[data-style="neu"] h2,
:root[data-style="neu"] h3,
:root[data-style="neu"] h4,
:root[data-style="neu"] .logo b,
:root[data-style="neu"] .section-head h2,
:root[data-style="neu"] .stats b,
:root[data-style="neu"] .price,
:root[data-style="neu"] .pl-price,
:root[data-style="neu"] .cat-tile .ico,
:root[data-style="neu"] .cat-tile b,
:root[data-style="neu"] .p-card .name,
:root[data-style="neu"] .e-ico,
:root[data-style="neu"] .r-ico,
:root[data-style="neu"] .btn:not(.btn-primary),
:root[data-style="neu"] .icon-btn,
:root[data-style="neu"] .main-nav a,
:root[data-style="neu"] .bottom-bar a,
:root[data-style="neu"] .reach,
:root[data-style="neu"] .eyebrow,
:root[data-style="neu"] .hero-badges span { text-shadow: var(--nm-text); }
:root[data-style="neu"] .icon-btn svg,
:root[data-style="neu"] .bottom-bar svg,
:root[data-style="neu"] .socials svg,
:root[data-style="neu"] .search-trigger svg { filter: drop-shadow(1px 1px 0 var(--nm-light)) drop-shadow(-1px -1px 0 rgba(120,135,160,.22)); }
:root[data-style="neu"] .hero h1 em { text-shadow: 1px 1px 0 rgba(255,255,255,.7), 2px 3px 6px rgba(214,31,43,.25); }
:root[data-style="neu"] .logo-mark { border-radius: 50%; box-shadow: var(--nm-out-sm); padding: 2px; background: var(--bg); }
:root[data-style="neu"] .pl-table th,
:root[data-style="neu"] .pl-table td,
:root[data-style="neu"] .cmp-table td,
:root[data-style="neu"] .invoice-table td { border-color: rgba(163,177,198,.25) !important; }
:root[data-style="neu"] .pl-table thead th { background: var(--bg) !important; }
:root[data-style="neu"] .p-visual,
:root[data-style="neu"] .pd-visual,
:root[data-style="neu"] .pd-thumb { background: var(--bg) !important; box-shadow: var(--nm-in-sm) !important; border-radius: var(--r-md); }
:root[data-style="neu"] .sp-head { background: var(--bg) !important; color: var(--ink) !important; box-shadow: 0 6px 12px -8px var(--nm-dark); }
:root[data-style="neu"] .sp-head .sp-title small { color: var(--muted) !important; }
:root[data-style="neu"] .sp-body { background: var(--bg) !important; }
:root[data-style="neu"] .sp-bubble { background: var(--bg) !important; border: 0 !important; box-shadow: var(--nm-out-sm) !important; }
:root[data-style="neu"] .sp-me .sp-bubble { background: linear-gradient(145deg, #e8313d, #b8141f) !important; color: #fff !important; }
:root[data-style="neu"] .sp-foot { background: var(--bg) !important; border: 0 !important; }
:root[data-style="neu"] .hero { background: var(--bg) !important; }
:root[data-style="neu"] .hero::before,
:root[data-style="neu"] .hero::after { opacity: .35; }
@media print {
:root[data-style="neu"] .glass,
:root[data-style="neu"] .p-card,
:root[data-style="neu"] .btn,
:root[data-style="neu"] .input,
:root[data-style="neu"] .table-wrap { box-shadow: none !important; }
:root[data-style="neu"] * { text-shadow: none !important; }
}
@media (prefers-reduced-motion: reduce) {
:root[data-style="neu"] .p-card:hover,
:root[data-style="neu"] .cat-tile:hover { transform: none; }
}

/* ---------- skeuo ---------- */
:root[data-style="skeuo"] { --bg: #d9dadc; --surface: #eeeff1; --surface-2: #e4e5e8; --fill: #e4e5e8; --fill-2: #d4d6da; --glass: #eeeff1; --ink: #1a1c20; --text: #25282e; --muted: #4d525b; --line: #a9adb4; --line-2: #8e939b; --metal: linear-gradient(180deg, #fbfbfc 0%, #e6e7ea 45%, #d2d4d8 100%); --metal-press: linear-gradient(180deg, #cfd1d5 0%, #e2e3e6 100%); --bevel: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(0, 0, 0, .18), 0 1px 0 rgba(255, 255, 255, .6), 0 3px 6px rgba(0, 0, 0, .28); --engrave: 0 1px 0 rgba(255, 255, 255, .85); --e1: var(--bevel); --e2: var(--bevel); --e3: var(--bevel), 0 10px 22px rgba(0, 0, 0, .18); --e4: var(--e3); --shadow: var(--bevel); }
:root[data-style="skeuo"] body { background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .06) 0 1px, rgba(0, 0, 0, .025) 1px 3px), linear-gradient(180deg, #e2e3e6, #cbcdd1) !important; background-attachment: fixed !important; }
:root[data-style="skeuo"] .glass,
:root[data-style="skeuo"] .p-card,
:root[data-style="skeuo"] .cat-tile,
:root[data-style="skeuo"] .finder,
:root[data-style="skeuo"] .faq details,
:root[data-style="skeuo"] .empty,
:root[data-style="skeuo"] .contact-card,
:root[data-style="skeuo"] .spec,
:root[data-style="skeuo"] .stats > div,
:root[data-style="skeuo"] .opt label,
:root[data-style="skeuo"] .addr-opt,
:root[data-style="skeuo"] .brand-pill,
:root[data-style="skeuo"] .step,
:root[data-style="skeuo"] .install-banner,
:root[data-style="skeuo"] .table-wrap,
:root[data-style="skeuo"] .sp-panel,
:root[data-style="skeuo"] .cmdk,
:root[data-style="skeuo"] .toast,
:root[data-style="skeuo"] .filters,
:root[data-style="skeuo"] .tree,
:root[data-style="skeuo"] .acc-nav,
:root[data-style="skeuo"] .qty,
:root[data-style="skeuo"] .compare-bar,
:root[data-style="skeuo"] .reach,
:root[data-style="skeuo"] .hero-badges span,
:root[data-style="skeuo"] .chip,
:root[data-style="skeuo"] .sum,
:root[data-style="skeuo"] .result { background: var(--metal) !important; border: 1px solid var(--line) !important; box-shadow: var(--bevel) !important; }
:root[data-style="skeuo"] .p-card,
:root[data-style="skeuo"] .cat-tile,
:root[data-style="skeuo"] .glass { border-radius: 12px !important; }
:root[data-style="skeuo"] .p-card:hover,
:root[data-style="skeuo"] .cat-tile:hover { box-shadow: var(--e3) !important; }
:root[data-style="skeuo"] .site-header { background: linear-gradient(180deg, #f3f4f5, #d6d8db) !important; border-bottom: 1px solid #9a9ea5 !important; box-shadow: 0 2px 6px rgba(0, 0, 0, .2) !important; backdrop-filter: none !important; }
:root[data-style="skeuo"] .site-footer { background: linear-gradient(180deg, #2a2d32, #16181b) !important; }
:root[data-style="skeuo"] .btn,
:root[data-style="skeuo"] .icon-btn,
:root[data-style="skeuo"] .search-trigger,
:root[data-style="skeuo"] .add-btn,
:root[data-style="skeuo"] .fav-btn,
:root[data-style="skeuo"] .cmp-btn,
:root[data-style="skeuo"] .sp-chip,
:root[data-style="skeuo"] .sp-x,
:root[data-style="skeuo"] .socials a,
:root[data-style="skeuo"] .main-nav a { background: var(--metal) !important; border: 1px solid #9ea2a9 !important; border-bottom-color: #7f848c !important; box-shadow: var(--bevel) !important; color: var(--text) !important; text-shadow: var(--engrave); }
:root[data-style="skeuo"] .btn:active,
:root[data-style="skeuo"] .icon-btn:active,
:root[data-style="skeuo"] .add-btn:active,
:root[data-style="skeuo"] .sp-chip:active,
:root[data-style="skeuo"] .main-nav a.on,
:root[data-style="skeuo"] .main-nav a[aria-current] { background: var(--metal-press) !important; box-shadow: inset 0 2px 4px rgba(0, 0, 0, .3), 0 1px 0 rgba(255, 255, 255, .7) !important; }
:root[data-style="skeuo"] .main-nav a { border-radius: 8px; padding: 6px 10px; }
:root[data-style="skeuo"] .main-nav a::after { display: none !important; }
:root[data-style="skeuo"] .btn-primary,
:root[data-style="skeuo"] .sp-send-btn,
:root[data-style="skeuo"] .sp-fab { background: radial-gradient(120% 90% at 50% 10%, #ff6b73 0%, #d61f2b 45%, #8e0d15 100%) !important; color: #fff !important; border: 1px solid #6d0a10 !important; text-shadow: 0 -1px 0 rgba(0, 0, 0, .4) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 2px 0 #5c070c, 0 4px 10px rgba(214, 31, 43, .45) !important; }
:root[data-style="skeuo"] .input,
:root[data-style="skeuo"] input.input,
:root[data-style="skeuo"] textarea.input,
:root[data-style="skeuo"] select.input,
:root[data-style="skeuo"] .sp-input,
:root[data-style="skeuo"] .cmdk-field input,
:root[data-style="skeuo"] .otp input { background: linear-gradient(180deg, #d4d6da, #eceef0) !important; border: 1px solid #8b9098 !important; box-shadow: inset 0 2px 5px rgba(0, 0, 0, .25) !important; border-radius: 8px !important; color: var(--ink) !important; }
:root[data-style="skeuo"] h1,
:root[data-style="skeuo"] h2,
:root[data-style="skeuo"] h3,
:root[data-style="skeuo"] h4,
:root[data-style="skeuo"] .logo b,
:root[data-style="skeuo"] .stats b,
:root[data-style="skeuo"] .eyebrow,
:root[data-style="skeuo"] .section-head h2 { text-shadow: var(--engrave); }
:root[data-style="skeuo"] .logo-mark { border-radius: 50%; background: var(--metal); box-shadow: var(--bevel); padding: 2px; }
:root[data-style="skeuo"] .p-visual,
:root[data-style="skeuo"] .pd-visual { background: linear-gradient(180deg, #cfd1d5, #eceef0) !important; box-shadow: inset 0 2px 6px rgba(0, 0, 0, .25) !important; }
:root[data-style="skeuo"] .sp-head { background: linear-gradient(180deg, #2a2d32, #16181b) !important; }
:root[data-style="skeuo"] .hero { background: transparent !important; }
:root[data-style="skeuo"] .theme-dark-row { display: none !important; }

/* ---------- glass ---------- */
:root[data-style="glass"] { --bg: #cfe0f0; --surface: rgba(255, 255, 255, .55); --surface-2: rgba(255, 255, 255, .4); --fill: rgba(255, 255, 255, .45); --fill-2: rgba(255, 255, 255, .6); --glass: rgba(255, 255, 255, .55); --ink: #0b1a2c; --text: #16263a; --muted: #3d5068; --line: rgba(255, 255, 255, .6); --line-2: rgba(255, 255, 255, .75); --gl: 0 8px 32px rgba(20, 50, 90, .18), inset 0 1px 0 rgba(255, 255, 255, .85), inset 0 -1px 0 rgba(255, 255, 255, .25); --e1: var(--gl); --e2: var(--gl); --e3: var(--gl); --e4: 0 20px 50px rgba(20, 50, 90, .25), inset 0 1px 0 rgba(255, 255, 255, .9); --shadow: var(--gl); }
:root[data-style="glass"] body { background: radial-gradient(60% 45% at 80% 12%, rgba(255, 255, 255, .9), transparent 60%), radial-gradient(45% 35% at 15% 30%, rgba(170, 210, 245, .9), transparent 70%), radial-gradient(70% 50% at 50% 100%, rgba(40, 110, 170, .55), transparent 70%), linear-gradient(180deg, #a9cdec 0%, #dbe9f5 45%, #7fb0d6 100%) !important; background-attachment: fixed !important; }
:root[data-style="glass"] .glass,
:root[data-style="glass"] .p-card,
:root[data-style="glass"] .cat-tile,
:root[data-style="glass"] .finder,
:root[data-style="glass"] .faq details,
:root[data-style="glass"] .empty,
:root[data-style="glass"] .contact-card,
:root[data-style="glass"] .spec,
:root[data-style="glass"] .stats > div,
:root[data-style="glass"] .opt label,
:root[data-style="glass"] .addr-opt,
:root[data-style="glass"] .brand-pill,
:root[data-style="glass"] .step,
:root[data-style="glass"] .install-banner,
:root[data-style="glass"] .table-wrap,
:root[data-style="glass"] .sp-panel,
:root[data-style="glass"] .cmdk,
:root[data-style="glass"] .toast,
:root[data-style="glass"] .filters,
:root[data-style="glass"] .tree,
:root[data-style="glass"] .acc-nav,
:root[data-style="glass"] .qty,
:root[data-style="glass"] .compare-bar,
:root[data-style="glass"] .reach,
:root[data-style="glass"] .hero-badges span,
:root[data-style="glass"] .chip,
:root[data-style="glass"] .sum,
:root[data-style="glass"] .result,
:root[data-style="glass"] .site-header { background: rgba(255, 255, 255, .42) !important; border: 1px solid rgba(255, 255, 255, .7) !important; box-shadow: var(--gl) !important; -webkit-backdrop-filter: blur(18px) saturate(1.5); backdrop-filter: blur(18px) saturate(1.5); }
:root[data-style="glass"] .p-card,
:root[data-style="glass"] .cat-tile,
:root[data-style="glass"] .glass,
:root[data-style="glass"] .finder { border-radius: 26px !important; }
:root[data-style="glass"] .p-card:hover,
:root[data-style="glass"] .cat-tile:hover { background: rgba(255, 255, 255, .55) !important; transform: translateY(-3px); }
:root[data-style="glass"] .site-footer { background: rgba(10, 30, 55, .6) !important; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); }
:root[data-style="glass"] .btn,
:root[data-style="glass"] .icon-btn,
:root[data-style="glass"] .search-trigger,
:root[data-style="glass"] .add-btn,
:root[data-style="glass"] .fav-btn,
:root[data-style="glass"] .cmp-btn,
:root[data-style="glass"] .sp-chip,
:root[data-style="glass"] .sp-x,
:root[data-style="glass"] .socials a,
:root[data-style="glass"] .main-nav a { background: rgba(255, 255, 255, .35) !important; border: 1px solid rgba(255, 255, 255, .75) !important; box-shadow: 0 4px 14px rgba(20, 50, 90, .12), inset 0 1px 0 rgba(255, 255, 255, .9) !important; color: var(--ink) !important; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-radius: var(--r-full) !important; }
:root[data-style="glass"] .main-nav a { padding: 6px 10px; }
:root[data-style="glass"] .main-nav a::after { display: none !important; }
:root[data-style="glass"] .main-nav a.on,
:root[data-style="glass"] .main-nav a[aria-current] { background: rgba(255, 255, 255, .75) !important; }
:root[data-style="glass"] .btn-primary,
:root[data-style="glass"] .sp-send-btn,
:root[data-style="glass"] .sp-fab { background: linear-gradient(180deg, rgba(240, 70, 80, .92), rgba(190, 20, 32, .92)) !important; color: #fff !important; border: 1px solid rgba(255, 190, 195, .8) !important; box-shadow: 0 8px 24px rgba(214, 31, 43, .35), inset 0 1px 0 rgba(255, 255, 255, .55) !important; }
:root[data-style="glass"] .input,
:root[data-style="glass"] input.input,
:root[data-style="glass"] textarea.input,
:root[data-style="glass"] select.input,
:root[data-style="glass"] .sp-input,
:root[data-style="glass"] .cmdk-field input,
:root[data-style="glass"] .otp input { background: rgba(255, 255, 255, .55) !important; border: 1px solid rgba(255, 255, 255, .85) !important; box-shadow: inset 0 1px 3px rgba(20, 50, 90, .12) !important; border-radius: 16px !important; color: var(--ink) !important; }
:root[data-style="glass"] .p-visual,
:root[data-style="glass"] .pd-visual { background: rgba(255, 255, 255, .35) !important; border-radius: 18px; }
:root[data-style="glass"] .sp-head { background: rgba(10, 30, 55, .7) !important; }
:root[data-style="glass"] .sp-bubble { background: rgba(255, 255, 255, .7) !important; }
:root[data-style="glass"] .hero { background: transparent !important; }
:root[data-style="glass"] .theme-dark-row { display: none !important; }

/* ---------- clay ---------- */
:root[data-style="clay"] { --bg: #efeafc; --surface: #fbf9ff; --surface-2: #f4f0ff; --fill: #f4f0ff; --fill-2: #e9e2fb; --glass: #fbf9ff; --ink: #2b2150; --text: #33295c; --muted: #5a5182; --line: transparent; --line-2: rgba(120, 100, 190, .25); --clay: 0 12px 24px rgba(110, 90, 180, .18), inset -6px -8px 14px rgba(110, 90, 180, .12), inset 6px 8px 14px rgba(255, 255, 255, .85); --clay-sm: 0 6px 12px rgba(110, 90, 180, .18), inset -3px -4px 8px rgba(110, 90, 180, .14), inset 3px 4px 8px rgba(255, 255, 255, .85); --e1: var(--clay-sm); --e2: var(--clay); --e3: var(--clay); --e4: var(--clay); --shadow: var(--clay); }
:root[data-style="clay"] body { background: radial-gradient(60% 40% at 90% 0%, #fde8f2, transparent 70%), radial-gradient(50% 40% at 0% 30%, #e3f4ee, transparent 70%), #efeafc !important; }
:root[data-style="clay"] .glass,
:root[data-style="clay"] .p-card,
:root[data-style="clay"] .cat-tile,
:root[data-style="clay"] .finder,
:root[data-style="clay"] .faq details,
:root[data-style="clay"] .empty,
:root[data-style="clay"] .contact-card,
:root[data-style="clay"] .spec,
:root[data-style="clay"] .stats > div,
:root[data-style="clay"] .opt label,
:root[data-style="clay"] .addr-opt,
:root[data-style="clay"] .brand-pill,
:root[data-style="clay"] .step,
:root[data-style="clay"] .install-banner,
:root[data-style="clay"] .table-wrap,
:root[data-style="clay"] .sp-panel,
:root[data-style="clay"] .cmdk,
:root[data-style="clay"] .toast,
:root[data-style="clay"] .filters,
:root[data-style="clay"] .tree,
:root[data-style="clay"] .acc-nav,
:root[data-style="clay"] .qty,
:root[data-style="clay"] .compare-bar,
:root[data-style="clay"] .reach,
:root[data-style="clay"] .hero-badges span,
:root[data-style="clay"] .chip,
:root[data-style="clay"] .sum,
:root[data-style="clay"] .result { background: var(--surface) !important; border: 0 !important; box-shadow: var(--clay) !important; border-radius: 28px !important; }
:root[data-style="clay"] .cat-tile:nth-child(4n+1),
:root[data-style="clay"] .p-card:nth-child(4n+1) { background: #ffe4ec !important; }
:root[data-style="clay"] .cat-tile:nth-child(4n+2),
:root[data-style="clay"] .p-card:nth-child(4n+2) { background: #dff5ec !important; }
:root[data-style="clay"] .cat-tile:nth-child(4n+3),
:root[data-style="clay"] .p-card:nth-child(4n+3) { background: #fff4d9 !important; }
:root[data-style="clay"] .cat-tile:nth-child(4n+4),
:root[data-style="clay"] .p-card:nth-child(4n+4) { background: #e0ecff !important; }
:root[data-style="clay"] .p-card:hover,
:root[data-style="clay"] .cat-tile:hover { transform: translateY(-4px); }
:root[data-style="clay"] .site-header { background: rgba(251, 249, 255, .94) !important; box-shadow: 0 8px 20px rgba(110, 90, 180, .12) !important; border: 0 !important; backdrop-filter: none !important; }
:root[data-style="clay"] .site-footer { background: #e6ddfb !important; color: var(--text) !important; }
:root[data-style="clay"] .site-footer a,
:root[data-style="clay"] .site-footer h4,
:root[data-style="clay"] .footer-mark,
:root[data-style="clay"] .footer-claim { color: var(--text) !important; }
:root[data-style="clay"] .btn,
:root[data-style="clay"] .icon-btn,
:root[data-style="clay"] .search-trigger,
:root[data-style="clay"] .add-btn,
:root[data-style="clay"] .fav-btn,
:root[data-style="clay"] .cmp-btn,
:root[data-style="clay"] .sp-chip,
:root[data-style="clay"] .sp-x,
:root[data-style="clay"] .socials a,
:root[data-style="clay"] .main-nav a { background: var(--surface) !important; border: 0 !important; box-shadow: var(--clay-sm) !important; color: var(--ink) !important; border-radius: 18px !important; }
:root[data-style="clay"] .btn:active,
:root[data-style="clay"] .icon-btn:active,
:root[data-style="clay"] .sp-chip:active { transform: scale(.96); }
:root[data-style="clay"] .main-nav a { padding: 6px 10px; }
:root[data-style="clay"] .main-nav a::after { display: none !important; }
:root[data-style="clay"] .main-nav a.on,
:root[data-style="clay"] .main-nav a[aria-current] { background: #e4dbff !important; }
:root[data-style="clay"] .btn-primary,
:root[data-style="clay"] .sp-send-btn,
:root[data-style="clay"] .sp-fab { background: linear-gradient(180deg, #ff6f7c, #d42535) !important; color: #fff !important; box-shadow: 0 10px 20px rgba(224, 48, 62, .35), inset -4px -6px 10px rgba(120, 0, 10, .25), inset 4px 5px 10px rgba(255, 255, 255, .45) !important; }
:root[data-style="clay"] .input,
:root[data-style="clay"] input.input,
:root[data-style="clay"] textarea.input,
:root[data-style="clay"] select.input,
:root[data-style="clay"] .sp-input,
:root[data-style="clay"] .cmdk-field input,
:root[data-style="clay"] .otp input { background: #f6f2ff !important; border: 0 !important; box-shadow: inset 3px 4px 8px rgba(110, 90, 180, .18), inset -3px -4px 8px rgba(255, 255, 255, .9) !important; border-radius: 18px !important; color: var(--ink) !important; }
:root[data-style="clay"] .logo-mark { border-radius: 16px; box-shadow: var(--clay-sm); padding: 2px; background: #fff; }
:root[data-style="clay"] .p-visual,
:root[data-style="clay"] .pd-visual { background: rgba(255, 255, 255, .6) !important; border-radius: 22px; }
:root[data-style="clay"] .sp-head { background: #6b52e8 !important; }
:root[data-style="clay"] .hero { background: transparent !important; }
:root[data-style="clay"] .theme-dark-row { display: none !important; }