/* N NEXORIS Store — light by default, dark via [data-theme=dark]. RTL first. */
:root{--bg:#f4f7fb;--surface:#fff;--surface-2:#f0f4f9;--surface-3:#e6edf6;--ink:#0b1b33;--ink-2:#26384f;--muted:#5d6e84;--line:#e1e8f1;
  --brand:#185bc6;--brand-600:#124ba8;--brand-2:#0aa5a0;--navy:#0b2545;--danger:#d7344c;--success:#0f9d6b;--warning:#c98a08;
  --grad:linear-gradient(135deg,#185bc6 0%,#1677ff 48%,#0aa5a0 100%);--shadow-sm:0 1px 2px rgba(11,27,51,.05),0 6px 18px -10px rgba(11,27,51,.18);
  --shadow:0 2px 6px rgba(11,27,51,.05),0 22px 48px -28px rgba(11,27,51,.35);--radius:16px;--radius-sm:11px;--wrap:1240px;color-scheme:light}
:root[data-theme=dark]{--bg:#070f1d;--surface:#0d1a2d;--surface-2:#122238;--surface-3:#182c46;--ink:#eaf1fb;--ink-2:#c7d5e8;--muted:#8fa4bf;--line:rgba(148,177,214,.14);
  --brand:#4d8dff;--brand-600:#3b7bf0;--brand-2:#2dd4bf;--shadow-sm:0 1px 2px rgba(0,0,0,.3),0 8px 22px -12px rgba(0,0,0,.6);--shadow:0 2px 8px rgba(0,0,0,.3),0 26px 54px -30px rgba(0,0,0,.8);color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"EYEN Ammon","Readex Pro","IBM Plex Sans Arabic",system-ui,sans-serif;font-size:15px;line-height:1.75;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0;line-height:1.4;font-weight:700;letter-spacing:-.005em}
p{margin:0}
.ic{width:20px;height:20px;flex-shrink:0;stroke-width:1.9}
.wrap{width:min(var(--wrap),calc(100% - 32px));margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.muted{color:var(--muted)}
[dir=ltr]{unicode-bidi:isolate}

/* ---------- buttons & forms ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:11px 22px;border:1px solid transparent;border-radius:12px;font-weight:700;font-size:14.5px;cursor:pointer;transition:transform .2s,box-shadow .25s,background .2s,border-color .2s;white-space:nowrap}
.btn .ic{width:18px;height:18px}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 14px 30px -14px rgba(22,119,255,.75)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 18px 36px -14px rgba(22,119,255,.85)}
.btn-dark{background:var(--navy);color:#fff}
:root[data-theme=dark] .btn-dark{background:#eaf1fb;color:#0b1b33}
.btn-ghost{background:var(--surface);border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:var(--brand)}
.btn-soft{background:color-mix(in srgb,var(--brand) 10%,transparent);color:var(--brand)}
.btn-block{width:100%}
.btn-sm{min-height:38px;padding:7px 14px;font-size:13px;border-radius:10px}
.btn[disabled]{opacity:.55;pointer-events:none}
.field{display:grid;gap:6px}
.field>span{font-size:13px;font-weight:600;color:var(--ink-2)}
.field i{color:var(--danger);font-style:normal}
.input,.field input,.field select,.field textarea{width:100%;min-height:48px;padding:11px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:96px;resize:vertical}
.input:focus,.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 16%,transparent)}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.span-2{grid-column:1/-1}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-2);cursor:pointer}
.check input{width:19px;height:19px;margin-top:4px;accent-color:var(--brand);flex-shrink:0}
.alert{padding:13px 16px;border-radius:12px;font-size:14px;border:1px solid}
.alert ul{margin:4px 0 0;padding-inline-start:18px}
.alert-error{background:color-mix(in srgb,var(--danger) 8%,var(--surface));border-color:color-mix(in srgb,var(--danger) 30%,transparent);color:var(--danger)}
.alert-success{background:color-mix(in srgb,var(--success) 8%,var(--surface));border-color:color-mix(in srgb,var(--success) 30%,transparent);color:var(--success)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:99px;font-size:12px;font-weight:700}

/* ---------- header ---------- */
.topbar{background:var(--navy);color:#dce8f8;font-size:12.5px}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:36px}
.topbar a{color:#fff;opacity:.85}
.topbar a:hover{opacity:1}
.topbar .ic{width:15px;height:15px}
.topbar-links{display:flex;gap:18px;align-items:center}
.topbar-links a{display:inline-flex;gap:6px;align-items:center}
.header{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(14px) saturate(160%);border-bottom:1px solid var(--line)}
.header-main{display:flex;align-items:center;gap:22px;min-height:76px}
.logo{display:flex;align-items:center;gap:10px;flex-shrink:0}
.logo img{width:46px;height:46px}
.logo b{display:block;font-size:17px;letter-spacing:.04em;color:var(--ink);line-height:1.2}
.logo small{display:block;font-size:11.5px;color:var(--muted)}
.search{flex:1;display:flex;align-items:stretch;max-width:700px;min-height:48px;border-radius:14px;border:1.5px solid var(--line);background:var(--surface-2);overflow:hidden;transition:border-color .2s,box-shadow .2s}
.search:focus-within{border-color:var(--brand);background:var(--surface);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 14%,transparent)}
.search-scope{max-width:150px;border:0;border-inline-end:1px solid var(--line);background:var(--surface-3);padding:0 12px;font-size:13px;font-weight:600;color:var(--ink-2);cursor:pointer}
.search-scope:focus{outline:0}
.search input{flex:1;min-width:0;border:0;background:none;padding:10px 14px}
.search input:focus{outline:0}
.search button{flex-shrink:0;width:56px;border:0;background:var(--grad);color:#fff;display:grid;place-items:center;cursor:pointer}
.search button .ic{width:20px;height:20px}
.actions{display:flex;align-items:center;gap:6px;margin-inline-start:auto}
.act{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 12px;border-radius:12px;color:var(--ink-2);font-size:13.5px;font-weight:600;background:none;border:0;cursor:pointer}
.act:hover{background:var(--surface-2);color:var(--ink)}
.act .ic{width:22px;height:22px}
.act-count{position:absolute;top:4px;inset-inline-start:24px;min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--danger);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;line-height:1}
.act-count[data-empty]{display:none}
.theme-btn .ic-moon{display:block}.theme-btn .ic-sun{display:none}
:root[data-theme=dark] .theme-btn .ic-moon{display:none}:root[data-theme=dark] .theme-btn .ic-sun{display:block}
.menu-btn{display:none}
.catnav{border-top:1px solid var(--line)}
.catnav .wrap{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;min-height:48px;align-items:center}
.catnav a{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:10px;font-size:13.5px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.catnav a .ic{width:17px;height:17px;color:var(--brand)}
.catnav a:hover,.catnav a.on{background:color-mix(in srgb,var(--brand) 9%,transparent);color:var(--brand)}

/* ---------- hero ---------- */
.hero{padding:22px 0 8px}
.slider{position:relative;border-radius:24px;overflow:hidden;min-height:340px;box-shadow:var(--shadow)}
.slide{position:absolute;inset:0;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:30px;padding:34px 52px;color:#fff;opacity:0;transform:scale(1.02);transition:opacity .7s ease,transform 1.2s ease;pointer-events:none}
.slide.on{opacity:1;transform:none;pointer-events:auto}
.slide.navy{background:radial-gradient(60% 90% at 0% 100%,rgba(10,165,160,.35),transparent 60%),radial-gradient(70% 90% at 100% 0%,rgba(22,119,255,.5),transparent 60%),linear-gradient(135deg,#0b2545,#0e3a72)}
.slide.teal{background:radial-gradient(60% 90% at 100% 0%,rgba(255,255,255,.18),transparent 60%),linear-gradient(135deg,#076b75,#0aa5a0 55%,#1677ff)}
.slide.dark{background:radial-gradient(60% 80% at 0% 0%,rgba(77,141,255,.35),transparent 60%),linear-gradient(135deg,#050b16,#0d1a2d)}
.slide:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse at 70% 40%,#000 20%,transparent 70%);mask-image:radial-gradient(ellipse at 70% 40%,#000 20%,transparent 70%);pointer-events:none}
.slide-copy{position:relative;max-width:560px}
.slide-kicker{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);font-size:12.5px;font-weight:600;backdrop-filter:blur(8px)}
.slide-kicker i{width:7px;height:7px;border-radius:50%;background:#5eead4;box-shadow:0 0 0 0 rgba(94,234,212,.7);animation:ping 2s infinite}
@keyframes ping{70%{box-shadow:0 0 0 9px rgba(94,234,212,0)}}
.slide h2{margin:12px 0 10px;font-size:clamp(26px,3.1vw,40px);line-height:1.35;font-weight:800}
.slide p{font-size:16px;line-height:1.95;color:rgba(235,244,255,.86);max-width:500px}
.slide .btn{margin-top:18px}
.slide .btn-light{background:#fff;color:var(--navy);box-shadow:0 18px 36px -16px rgba(0,0,0,.55)}
.slide-art{position:relative;height:100%;min-height:260px;display:grid;place-items:center}
.slide-art img{max-height:340px;object-fit:contain;filter:drop-shadow(0 30px 40px rgba(0,0,0,.35))}
.orbit{position:relative;width:260px;height:260px}
.orbit-core{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:120px;height:120px;border-radius:32px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(10px);display:grid;place-items:center;box-shadow:0 30px 60px -20px rgba(0,0,0,.5)}
.orbit-core img{width:76px;height:76px}
.orbit-ring{position:absolute;inset:0;border:1.5px dashed rgba(255,255,255,.3);border-radius:50%;animation:spin 40s linear infinite}
.orbit-ring.r2{inset:44px;animation-duration:28s;animation-direction:reverse}
@keyframes spin{to{transform:rotate(360deg)}}
.orbit-node{position:absolute;width:62px;height:62px;border-radius:18px;background:rgba(255,255,255,.95);color:var(--navy);display:grid;place-items:center;box-shadow:0 18px 30px -14px rgba(0,0,0,.5);animation:bob 5s ease-in-out infinite}
.orbit-node .ic{width:28px;height:28px}
.orbit-node:nth-child(3){top:-6px;left:50%;margin-left:-31px}
.orbit-node:nth-child(4){bottom:30px;left:-6px;animation-delay:-1.6s}
.orbit-node:nth-child(5){bottom:30px;right:-6px;animation-delay:-3.2s}
@keyframes bob{50%{transform:translateY(-8px)}}
.slider-nav{position:absolute;bottom:22px;inset-inline-start:56px;display:flex;gap:8px;z-index:3}
.slider-nav button{width:26px;height:6px;border-radius:99px;border:0;background:rgba(255,255,255,.35);cursor:pointer;transition:width .3s,background .3s}
.slider-nav button.on{width:44px;background:#fff}
.slider-arrows{position:absolute;bottom:14px;inset-inline-end:22px;display:flex;gap:8px;z-index:3}
.slider-arrows button{width:42px;height:42px;border-radius:12px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.12);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(6px)}
.slider-arrows button:hover{background:rgba(255,255,255,.24)}

/* ---------- trust strip ---------- */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px auto 6px}
.trust div{display:flex;align-items:center;gap:12px;padding:16px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line)}
.trust .ic{width:24px;height:24px;color:var(--brand)}
.trust span{display:grid;width:46px;height:46px;place-items:center;border-radius:13px;background:color-mix(in srgb,var(--brand) 10%,transparent);flex-shrink:0}
.trust b{display:block;font-size:14px}
.trust small{color:var(--muted);font-size:12.5px}

/* ---------- sections ---------- */
.section{padding:40px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px}
.sec-head h2{font-size:clamp(21px,2.2vw,28px)}
.sec-head p{color:var(--muted);font-size:14px;margin-top:3px}
.sec-head a{display:inline-flex;align-items:center;gap:6px;color:var(--brand);font-weight:700;font-size:14px}
.sec-head a .ic{width:17px;height:17px}
.cats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.cat{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;padding:22px 12px 18px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);text-align:center;transition:transform .3s,box-shadow .3s,border-color .3s}
.cat:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:color-mix(in srgb,var(--brand) 35%,transparent)}
.cat span{display:grid;place-items:center;width:62px;height:62px;border-radius:18px;background:var(--grad);color:#fff;box-shadow:0 14px 26px -12px rgba(22,119,255,.65)}
.cat span .ic{width:28px;height:28px}
.cat b{font-size:14px}

/* ---------- product cards ---------- */
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.pcard{position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .3s,box-shadow .3s,border-color .3s}
.pcard:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:color-mix(in srgb,var(--brand) 30%,transparent)}
.pcard-media{position:relative;aspect-ratio:1/1;background:linear-gradient(160deg,var(--surface-2),var(--surface));display:grid;place-items:center;overflow:hidden}
.pcard-media img{width:84%;height:84%;object-fit:contain;transition:transform .6s}
.pcard:hover .pcard-media img{transform:scale(1.06)}
.pcard-media .ph{color:var(--muted);opacity:.5}
.pcard-media .ph .ic{width:64px;height:64px}
.pcard-tags{position:absolute;top:12px;inset-inline-start:12px;display:flex;flex-direction:column;gap:6px}
.tag-sale{background:var(--danger);color:#fff}
.tag-new{background:var(--brand-2);color:#fff}
.tag-out{background:var(--ink-2);color:#fff}
.pcard-body{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px;flex:1}
.pcard-cat{font-size:12px;color:var(--brand);font-weight:600}
.pcard-body h3{font-size:15px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pcard-body p{font-size:12.5px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:8px}
.price b{font-size:19px;font-weight:800;color:var(--ink)}
.price s{font-size:13px;color:var(--muted)}
.cur{font-size:12px;font-weight:600;color:var(--muted);margin-inline-start:2px}
.pcard form{margin-top:10px}
.pcard .btn{width:100%;min-height:42px;font-size:13.5px}

/* ---------- listing ---------- */
.page-head{padding:28px 0 6px}
.crumbs{display:flex;gap:6px;align-items:center;font-size:12.5px;color:var(--muted);margin-bottom:10px;flex-wrap:wrap}
.crumbs a:hover{color:var(--brand)}
.crumbs .ic{width:14px;height:14px}
.page-head h1{font-size:clamp(24px,2.6vw,32px)}
.page-head p{color:var(--muted);margin-top:4px}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0;flex-wrap:wrap}
.toolbar select{min-height:42px;padding:6px 12px;border-radius:11px;border:1px solid var(--line);background:var(--surface)}
.empty{display:grid;justify-items:center;gap:12px;padding:56px 20px;text-align:center;border:1.5px dashed var(--line);border-radius:var(--radius);background:var(--surface)}
.empty span{display:grid;place-items:center;width:76px;height:76px;border-radius:22px;background:color-mix(in srgb,var(--brand) 10%,transparent);color:var(--brand)}
.empty span .ic{width:36px;height:36px}
.empty p{color:var(--muted);max-width:420px}
.pager{display:flex;gap:10px;justify-content:center;margin-top:26px}

/* ---------- product page ---------- */
.pd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;padding:10px 0 30px;align-items:start}
.gallery{position:sticky;top:140px;display:grid;gap:12px}
.gallery-main{aspect-ratio:1/1;border-radius:22px;background:linear-gradient(160deg,var(--surface-2),var(--surface));border:1px solid var(--line);display:grid;place-items:center;overflow:hidden}
.gallery-main img{width:86%;height:86%;object-fit:contain}
.gallery-thumbs{display:flex;gap:10px;flex-wrap:wrap}
.gallery-thumbs button{width:76px;height:76px;padding:6px;border-radius:14px;border:1.5px solid var(--line);background:var(--surface);cursor:pointer}
.gallery-thumbs button.on{border-color:var(--brand)}
.gallery-thumbs img{width:100%;height:100%;object-fit:contain}
.pd-info h1{font-size:clamp(24px,2.6vw,32px);margin:6px 0 6px}
.pd-sub{color:var(--muted);font-size:15px}
.pd-price{display:flex;align-items:baseline;gap:12px;margin:20px 0 6px;flex-wrap:wrap}
.pd-price b{font-size:32px;font-weight:800}
.pd-price s{color:var(--muted)}
.pd-vat{font-size:12.5px;color:var(--muted)}
.stock{display:inline-flex;align-items:center;gap:7px;margin-top:12px;font-size:13.5px;font-weight:600}
.stock .ic{width:17px;height:17px}
.stock.in{color:var(--success)}.stock.out{color:var(--danger)}
.buybox{display:flex;gap:10px;margin:22px 0 14px;flex-wrap:wrap}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden}
.qty button{width:44px;height:48px;border:0;background:none;cursor:pointer;display:grid;place-items:center;color:var(--ink-2)}
.qty button:hover{background:var(--surface-2)}
.qty input{width:52px;height:48px;border:0;text-align:center;background:none;font-weight:700;-moz-appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none}
.buybox .btn-primary{flex:1;min-width:200px}
.paybadges{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
/* official payment acceptance marks */
.paymarks{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;vertical-align:middle}
.pm{display:inline-grid;place-items:center;height:26px;min-width:44px;padding:0 7px;border-radius:6px;background:#fff;border:1px solid #d9e1ec}
.pm img{max-height:15px;width:auto}
img.pm-apple{height:26px;width:auto;min-width:0;padding:0;border:0;background:none}
.paymarks-top{margin-inline-start:12px;gap:5px}
.paymarks-top .pm{height:22px;min-width:38px;padding:0 6px;border-color:transparent}
.paymarks-top .pm img{max-height:12px}
.paymarks-top img.pm-apple{height:22px}
.perks{display:grid;gap:10px;margin:22px 0;padding:16px;border-radius:var(--radius);background:var(--surface-2)}
.perks div{display:flex;gap:10px;align-items:center;font-size:14px}
.perks .ic{color:var(--brand-2)}
.tabs-body{margin-top:8px}
.prose{color:var(--ink-2);line-height:2;white-space:pre-line}
.specs{width:100%;border-collapse:collapse;font-size:14px;margin-top:8px}
.specs th,.specs td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:start}
.specs th{width:38%;color:var(--muted);font-weight:500;background:var(--surface-2)}

/* ---------- cart / checkout ---------- */
.two-col{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:24px;align-items:start;padding:10px 0 40px}
.lines{display:grid;gap:12px}
.line{display:grid;grid-template-columns:96px 1fr auto;gap:16px;align-items:center;padding:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.line-img{width:96px;height:96px;border-radius:14px;background:var(--surface-2);display:grid;place-items:center;overflow:hidden}
.line-img img{width:86%;height:86%;object-fit:contain}
.line h3{font-size:15px}
.line small{color:var(--muted)}
.line-end{display:grid;justify-items:end;gap:10px}
.line-end b{font-size:16px}
.link-danger{display:inline-flex;align-items:center;gap:5px;border:0;background:none;color:var(--danger);font-size:12.5px;cursor:pointer}
.link-danger .ic{width:15px;height:15px}
.summary{position:sticky;top:140px;padding:22px}
.summary h2{font-size:18px;margin-bottom:14px}
.sum-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:14.5px}
.sum-row.total{border-top:1px solid var(--line);margin-top:6px;padding-top:14px;font-size:18px;font-weight:800}
.sum-note{font-size:12px;color:var(--muted)}
.freebar{margin:14px 0;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--brand-2) 9%,transparent);font-size:13px}
.freebar i{display:block;height:6px;margin-top:8px;border-radius:99px;background:var(--surface-3);overflow:hidden}
.freebar i b{display:block;height:100%;background:var(--grad);border-radius:99px}
.steps{display:flex;gap:8px;margin:6px 0 20px;flex-wrap:wrap}
.steps span{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:99px;background:var(--surface);border:1px solid var(--line);font-size:13px;color:var(--muted)}
.steps span.on{background:var(--grad);color:#fff;border-color:transparent}
.steps b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--surface-3);font-size:11px}
.steps .on b{background:rgba(255,255,255,.25)}
.addr-list{display:grid;gap:10px;margin-bottom:16px}
.addr{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1.5px solid var(--line);border-radius:14px;background:var(--surface);cursor:pointer}
.addr:has(input:checked){border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 12%,transparent)}
.addr input{margin-top:5px;accent-color:var(--brand)}
.addr b{display:block}
.addr small{color:var(--muted)}
.block{padding:22px}
.block h2{font-size:17px;margin-bottom:14px;display:flex;align-items:center;gap:9px}
.block h2 .ic{color:var(--brand)}
.mysr-wrap{padding:22px}
.mode-pill{display:inline-flex;gap:6px;align-items:center;padding:4px 12px;border-radius:99px;background:color-mix(in srgb,var(--warning) 14%,transparent);color:var(--warning);font-size:12px;font-weight:700}

/* ---------- account / auth ---------- */
.auth{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - 230px);margin:28px auto;max-width:1040px;border-radius:24px;overflow:hidden;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow)}
.auth-side{position:relative;padding:44px;color:#fff;background:radial-gradient(70% 80% at 0 100%,rgba(10,165,160,.45),transparent 60%),linear-gradient(140deg,#0b2545,#0e3a72);display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.auth-side h2{font-size:28px;line-height:1.45}
.auth-side p{color:rgba(230,240,255,.82)}
.auth-side ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.auth-side li{display:flex;gap:10px;align-items:center}
.auth-side li .ic{color:#5eead4}
.auth-form{padding:44px;display:grid;align-content:center;gap:14px}
.auth-form h1{font-size:26px}
.auth-form .sub{color:var(--muted);margin-top:-6px}
.auth-alt{text-align:center;font-size:14px;color:var(--muted)}
.auth-alt a{color:var(--brand);font-weight:700}
.pass{position:relative}
.pass button{position:absolute;inset-inline-end:8px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--muted);cursor:pointer;display:grid;place-items:center;width:36px;height:36px}
.acc{display:grid;grid-template-columns:260px 1fr;gap:24px;padding:28px 0 40px;align-items:start}
.acc-nav{position:sticky;top:140px;padding:14px;display:grid;gap:4px}
.acc-user{display:flex;gap:12px;align-items:center;padding:8px 8px 14px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.avatar{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--grad);color:#fff;font-weight:800;font-size:18px;flex-shrink:0}
.acc-user small{display:block;color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis}
.acc-nav a,.acc-nav button{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:11px;font-size:14px;font-weight:600;color:var(--ink-2);background:none;border:0;cursor:pointer;width:100%;text-align:start}
.acc-nav a:hover,.acc-nav button:hover{background:var(--surface-2)}
.acc-nav a.on{background:color-mix(in srgb,var(--brand) 10%,transparent);color:var(--brand)}
.acc-main{display:grid;gap:16px}
.acc-main>h1{font-size:24px}
.table{width:100%;border-collapse:collapse;font-size:14px}
.table th,.table td{padding:13px 14px;text-align:start;border-bottom:1px solid var(--line)}
.table th{font-size:12.5px;color:var(--muted);font-weight:600}
.table tr:last-child td{border-bottom:0}
.status{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:99px;font-size:12px;font-weight:700;background:var(--surface-3);color:var(--ink-2)}
.st-PAID,.st-PROCESSING{background:color-mix(in srgb,var(--brand) 12%,transparent);color:var(--brand)}
.st-SHIPPED{background:color-mix(in srgb,var(--warning) 14%,transparent);color:var(--warning)}
.st-DELIVERED{background:color-mix(in srgb,var(--success) 14%,transparent);color:var(--success)}
.st-CANCELLED,.st-REFUNDED{background:color-mix(in srgb,var(--danger) 12%,transparent);color:var(--danger)}

/* ---------- tracking timeline ---------- */
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:18px 0}
.tl{position:relative;display:grid;justify-items:center;gap:8px;text-align:center;font-size:13px;color:var(--muted)}
.tl:before{content:"";position:absolute;top:22px;inset-inline-end:50%;width:100%;height:3px;background:var(--surface-3);z-index:0}
.tl:first-child:before{display:none}
.tl span{position:relative;z-index:1;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--surface-3);color:var(--muted)}
.tl.done{color:var(--ink);font-weight:600}
.tl.done span{background:var(--grad);color:#fff;box-shadow:0 10px 22px -10px rgba(22,119,255,.7)}
.tl.done:before{background:var(--grad)}
.history{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.history li{display:flex;gap:12px;font-size:14px}
.history li:before{content:"";width:10px;height:10px;margin-top:8px;border-radius:50%;background:var(--brand);flex-shrink:0}
.history small{display:block;color:var(--muted)}

/* ---------- footer ---------- */
.footer{margin-top:40px;background:var(--navy);color:#c9d7ea}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;padding:44px 0 30px}
.footer h4{color:#fff;font-size:15px;margin-bottom:12px}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14px}
.footer a:hover{color:#fff}
.footer-brand p{font-size:14px;margin:12px 0;color:#aebfd6}
.footer-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 0;border-top:1px solid rgba(255,255,255,.1);font-size:13px}
.footer .pm{border-color:#fff}

/* ---------- toast ---------- */
.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,30px);z-index:80;display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:14px;background:var(--navy);color:#fff;box-shadow:0 24px 50px -20px rgba(0,0,0,.6);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;font-size:14px;max-width:calc(100% - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.toast .ic{color:#5eead4}
.toast a{color:#93c5fd;font-weight:700;white-space:nowrap}
.flash-wrap{display:grid;gap:8px;margin-top:16px}

/* ================= v2: marketplace layout ================= */
.act-icon{width:48px;padding:0;justify-content:center}
.act-icon .act-count{inset-inline-start:auto;inset-inline-end:2px;top:2px}
.logo-main img{width:88px;height:88px;filter:drop-shadow(0 6px 14px rgba(11,37,69,.18))}
.header-main{min-height:96px}
[dir=ltr] .flip{transform:scaleX(-1)}
.ic.end{margin-inline-start:auto;width:16px;height:16px;opacity:.5}
.topbar-msg{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px;padding:5px 0}
.act-label small{display:block;font-size:11px;font-weight:500;color:var(--muted);line-height:1.2}
.act-label{line-height:1.25}
.catnav-all{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:10px;border:0;background:var(--navy);color:#fff;font-size:13.5px;font-weight:700;cursor:pointer;white-space:nowrap}
.catnav-all .ic{width:18px;height:18px}
:root[data-theme=dark] .catnav-all{background:var(--brand)}

/* drawer */
.drawer-mask{position:fixed;inset:0;z-index:90;background:rgba(5,12,24,.55);backdrop-filter:blur(2px)}
.drawer{position:fixed;top:0;bottom:0;inset-inline-start:0;z-index:91;width:min(360px,88vw);background:var(--surface);box-shadow:0 0 60px rgba(0,0,0,.35);display:flex;flex-direction:column;transform:translateX(105%);transition:transform .3s ease;visibility:hidden}
[dir=ltr] .drawer{transform:translateX(-105%)}
.drawer.on{transform:none;visibility:visible}
.drawer-head{display:flex;align-items:center;gap:10px;padding:18px 18px;background:var(--navy);color:#fff}
.drawer-head .ic{width:26px;height:26px}
.drawer-head b{font-size:16px}
.drawer-head button{margin-inline-start:auto;border:0;background:rgba(255,255,255,.12);color:#fff;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;cursor:pointer}
.drawer-body{overflow-y:auto;padding:6px 0 30px;flex:1}
.drawer-body h5{margin:0;padding:16px 20px 6px;font-size:15px;font-weight:800;color:var(--ink);border-top:1px solid var(--line)}
.drawer-body h5:first-child{border-top:0}
.drawer-body a,.drawer-body button{display:flex;align-items:center;gap:12px;width:100%;padding:11px 20px;border:0;background:none;font-size:14px;color:var(--ink-2);text-align:start;cursor:pointer}
.drawer-body a:hover,.drawer-body button:hover{background:var(--surface-2);color:var(--ink)}
.drawer-body a .ic,.drawer-body button .ic{width:19px;height:19px;color:var(--brand)}
.drawer-body .more{color:var(--brand);font-weight:700}
.drawer-langs{display:flex;align-items:center;gap:8px;padding:12px 20px;border-top:1px solid var(--line);margin-top:8px}
.drawer-langs .ic{color:var(--brand)}
.drawer-langs a{width:auto;padding:6px 12px;border-radius:99px;border:1px solid var(--line)}
.drawer-langs a.on{background:var(--brand);border-color:var(--brand);color:#fff}
.drawer-theme .ic-sun{display:none}
:root[data-theme=dark] .drawer-theme .ic-sun{display:block}:root[data-theme=dark] .drawer-theme .ic-moon{display:none}
body.no-scroll{overflow:hidden}

/* mobile tab bar */
.tabbar{display:none}
.tab-count{position:absolute;top:2px;inset-inline-start:calc(50% + 4px);min-width:17px;height:17px;padding:0 4px;border-radius:99px;background:var(--danger);color:#fff;font-size:10.5px;font-style:normal;font-weight:700;display:grid;place-items:center;line-height:1}
.tab-count[data-empty]{display:none}

/* hero with photo */
.slide.has-img{grid-template-columns:minmax(0,1fr)}
.slide-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.slide.has-img:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,16,32,.15),rgba(6,16,32,.78) 75%);z-index:0}
[dir=ltr] .slide.has-img:after{background:linear-gradient(270deg,rgba(6,16,32,.15),rgba(6,16,32,.78) 75%)}
.slide.has-img .slide-copy{z-index:1}
.slide-bg img{width:100%;height:100%;object-fit:cover}

/* full-artwork banners (theme "image"): the picture is the whole slide, clickable, no overlay */
.slider.photo{min-height:260px;aspect-ratio:2400/700;background:var(--surface-3)}
.slide-art-only{display:block;padding:0;background:#111}
.slide-art-only:before{display:none}
.slide-art-only picture,.slide-art-only img{display:block;width:100%;height:100%}
.slide-art-only img{object-fit:cover;object-position:center;transition:transform 6s ease}
.slide-art-only.on img{transform:scale(1.025)}
.promo picture,.wide-ad picture{position:absolute;inset:0;z-index:0}
.promo picture img,.wide-ad picture img{position:static;width:100%;height:100%;object-fit:cover}
.promo.art,.wide-ad.art{padding:0;background:var(--surface-3)}
.promo.art:after,.wide-ad.art:after{display:none}
.promo.art{min-height:0;aspect-ratio:4/3}
.wide-ad.art{min-height:0;aspect-ratio:4/1}
.slider.photo .slider-nav button{box-shadow:0 1px 6px rgba(0,0,0,.35)}
.slider.photo .slider-arrows button{background:rgba(0,0,0,.35);border-color:rgba(255,255,255,.35)}

/* promo tiles (ads) */
.promos{display:grid;gap:14px;margin-top:16px;grid-template-columns:repeat(4,minmax(0,1fr))}
.promos-1{grid-template-columns:1fr}.promos-2{grid-template-columns:repeat(2,minmax(0,1fr))}.promos-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.promo{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:200px;padding:20px;border-radius:var(--radius);overflow:hidden;color:#fff;box-shadow:var(--shadow-sm);transition:transform .3s,box-shadow .3s}
.promo:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.promo.navy{background:linear-gradient(140deg,#0b2545,#164a8c)}.promo.teal{background:linear-gradient(140deg,#076b75,#0aa5a0)}.promo.dark{background:linear-gradient(140deg,#050b16,#1b2b44)}
.promo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.promo:has(img):after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,12,24,.05) 30%,rgba(5,12,24,.8));z-index:0}
.promo-copy{position:relative;z-index:1;display:flex;flex-direction:column;gap:4px;margin-top:auto}
.promo small{font-size:12px;font-weight:700;opacity:.85}
.promo b{font-size:19px;line-height:1.4}
.promo em{font-style:normal;font-size:13px;opacity:.85}
.promo-cta{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-weight:700;font-size:13.5px;color:#93e5ff}
.promo-cta .ic{width:16px;height:16px}

/* wide ad banner */
.wide-sec{padding:6px 0 10px}
.wide-ad{position:relative;display:flex;align-items:center;gap:20px;justify-content:space-between;min-height:150px;padding:26px 34px;border-radius:20px;overflow:hidden;color:#fff;box-shadow:var(--shadow-sm)}
.wide-ad.navy{background:radial-gradient(60% 120% at 100% 0%,rgba(22,119,255,.55),transparent 60%),linear-gradient(135deg,#0b2545,#0e3a72)}
.wide-ad.teal{background:linear-gradient(120deg,#076b75,#0aa5a0 60%,#1677ff)}
.wide-ad.dark{background:linear-gradient(120deg,#050b16,#13233b)}
.wide-ad img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.wide-ad:has(img):after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,12,24,.1),rgba(5,12,24,.75))}
[dir=ltr] .wide-ad:has(img):after{background:linear-gradient(270deg,rgba(5,12,24,.1),rgba(5,12,24,.75))}
.wide-copy{position:relative;z-index:1;display:flex;flex-direction:column;gap:4px;max-width:640px}
.wide-copy small{font-weight:700;opacity:.85}
.wide-copy b{font-size:clamp(20px,2.4vw,28px);line-height:1.4}
.wide-copy em{font-style:normal;opacity:.85}
.wide-ad .btn{position:relative;z-index:1;background:#fff;color:var(--navy);flex-shrink:0}

/* categories with images */
.cat img{width:72px;height:72px;object-fit:contain;border-radius:18px;background:var(--surface-2)}
.cats{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}

/* product rails */
.rail-sec{padding:26px 0}
.rail{position:relative}
.rail-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 5*14px)/6);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 2px 10px;overscroll-behavior-x:contain}
.rail-track::-webkit-scrollbar{display:none}
.rail-track>*{scroll-snap-align:start}
.rail-btn{position:absolute;top:38%;z-index:3;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);box-shadow:var(--shadow);display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .2s}
.rail:hover .rail-btn{opacity:1}
.rail-btn.prev{inset-inline-start:-14px}.rail-btn.next{inset-inline-end:-14px}
.pcard-compact .pcard-body{padding:11px 12px 13px}
.pcard-compact h3{font-size:13.5px}
.pcard-compact .price b{font-size:16px}
.pcard-compact .btn{min-height:38px;font-size:12.5px}
.pcard-ship{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--success)}
.pcard-ship .ic{width:14px;height:14px}
.tag-soft{background:#6d28d9;color:#fff}.tag-svc{background:var(--warning);color:#fff}
.badge .ic{width:13px;height:13px}
.pd-tags{display:flex;gap:8px;flex-wrap:wrap}
.tag-cat,.tag-brand{background:color-mix(in srgb,var(--brand) 10%,transparent);color:var(--brand)}
.tag-brand{background:var(--surface-3);color:var(--ink-2)}

/* listing filters */
.filters{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:14px 0 2px}
.chip{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;padding:7px 14px;border-radius:99px;border:1px solid var(--line);background:var(--surface);font-size:13px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.chip .ic{width:15px;height:15px}
.chip:hover{border-color:var(--brand)}
.chip.on{background:var(--ink);border-color:var(--ink);color:var(--surface)}

/* all-categories page */
.kind-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}
.kind-tiles a{display:flex;align-items:center;gap:12px;padding:16px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);font-weight:700}
.kind-tiles span{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;background:var(--grad);color:#fff;flex-shrink:0}
.cat-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-bottom:40px}
.cat-row{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);transition:border-color .2s}
.cat-row:hover{border-color:var(--brand)}
.cat-row>span{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:color-mix(in srgb,var(--brand) 10%,transparent);color:var(--brand);flex-shrink:0}
.cat-row img{width:52px;height:52px;object-fit:contain;border-radius:12px;background:var(--surface-2)}
.cat-row div{flex:1;min-width:0}
.cat-row b{display:block}
.cat-row small{display:block;color:var(--muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cat-row em{font-style:normal;font-size:12px;color:var(--muted);white-space:nowrap}

/* footer extras */
.to-top{display:block;padding:14px;text-align:center;background:#123a6b;color:#fff;font-size:13.5px;font-weight:600}
.to-top:hover{background:#174a87}
.footer-langs{display:flex;gap:6px;flex-wrap:wrap}
.footer-langs a{padding:3px 10px;border-radius:99px;border:1px solid rgba(255,255,255,.2);font-size:12.5px}
.footer-langs a.on{background:#fff;color:var(--navy)}

/* paid downloads */
.dl-list{display:grid;gap:10px}
.dl{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.dl-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--surface-2);color:var(--brand)}
.dl-meta{display:grid;min-width:0}
.dl-meta b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dl-meta small{color:var(--muted);font-size:12.5px}
.dl-hash{font-family:ui-monospace,monospace;font-size:11px!important}
.dl-left{grid-column:3;justify-self:end;color:var(--muted);font-size:11.5px;margin-top:-6px}
.dl-preview .dl{grid-template-columns:auto 1fr}
@media (max-width:640px){.dl{grid-template-columns:auto 1fr}.dl .btn,.dl .badge{grid-column:1/-1}.dl-left{grid-column:1/-1;justify-self:start;margin:0}}

/* ================= light theme: black palette (black surfaces & icons, black text) ================= */
:root:not([data-theme=dark]){
  --ink:#000;--ink-2:#111214;--muted:#3f444b;
  --brand:#000;--brand-600:#000;--brand-2:#000;--navy:#0a0a0a;
  --grad:linear-gradient(135deg,#1c1c1c 0%,#0a0a0a 55%,#000 100%);
  --line:#dcdee2;--surface-2:#f1f2f4;--surface-3:#e4e6e9;--bg:#f5f6f7}
:root:not([data-theme=dark]) .slide.navy,:root:not([data-theme=dark]) .slide.teal,:root:not([data-theme=dark]) .slide.dark,
:root:not([data-theme=dark]) .wide-ad.navy,:root:not([data-theme=dark]) .wide-ad.teal,:root:not([data-theme=dark]) .wide-ad.dark{
  background:radial-gradient(70% 90% at 100% 0%,rgba(255,255,255,.08),transparent 60%),linear-gradient(135deg,#1a1a1a,#0a0a0a 60%,#000)}
:root:not([data-theme=dark]) .promo.navy,:root:not([data-theme=dark]) .promo.teal,:root:not([data-theme=dark]) .promo.dark,
:root:not([data-theme=dark]) .auth-side{background:linear-gradient(140deg,#1a1a1a,#000)}
:root:not([data-theme=dark]) .slide-kicker i{background:#fff;animation:none}
:root:not([data-theme=dark]) .promo-cta,:root:not([data-theme=dark]) .auth-side li .ic,:root:not([data-theme=dark]) .toast .ic{color:#fff}
:root:not([data-theme=dark]) .toast a{color:#fff;text-decoration:underline}
:root:not([data-theme=dark]) .to-top{background:#1a1a1a}:root:not([data-theme=dark]) .to-top:hover{background:#262626}
:root:not([data-theme=dark]) .footer{color:#e9eaec}
:root:not([data-theme=dark]) .btn-primary,:root:not([data-theme=dark]) .search button{box-shadow:0 12px 26px -14px rgba(0,0,0,.55)}
:root:not([data-theme=dark]) .cat span,:root:not([data-theme=dark]) .tl.done span{box-shadow:0 12px 24px -12px rgba(0,0,0,.5)}
:root:not([data-theme=dark]) .pcard-ship,:root:not([data-theme=dark]) .perks .ic{color:#000}
:root:not([data-theme=dark]) .tag-soft,:root:not([data-theme=dark]) .tag-svc,:root:not([data-theme=dark]) .tag-new{background:#000}
:root:not([data-theme=dark]) .chip.on{background:#000;border-color:#000;color:#fff}

/* ================= dark theme: black & gray (no blue) ================= */
:root[data-theme=dark]{
  --bg:#0a0a0a;--surface:#141414;--surface-2:#1c1c1c;--surface-3:#262626;
  --ink:#f5f5f5;--ink-2:#d6d6d6;--muted:#9b9b9b;--line:rgba(255,255,255,.1);
  --brand:#e6e6e6;--brand-600:#ffffff;--brand-2:#bdbdbd;--navy:#000;
  --grad:linear-gradient(135deg,#3d3d3d 0%,#2a2a2a 55%,#1c1c1c 100%);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4),0 8px 22px -12px rgba(0,0,0,.7);--shadow:0 2px 8px rgba(0,0,0,.4),0 26px 54px -30px rgba(0,0,0,.9)}
:root[data-theme=dark] .slide.navy,:root[data-theme=dark] .slide.teal,:root[data-theme=dark] .slide.dark,
:root[data-theme=dark] .wide-ad.navy,:root[data-theme=dark] .wide-ad.teal,:root[data-theme=dark] .wide-ad.dark{
  background:radial-gradient(70% 90% at 100% 0%,rgba(255,255,255,.07),transparent 60%),linear-gradient(135deg,#262626,#141414 60%,#050505)}
:root[data-theme=dark] .promo.navy,:root[data-theme=dark] .promo.teal,:root[data-theme=dark] .promo.dark,
:root[data-theme=dark] .auth-side{background:linear-gradient(140deg,#262626,#0a0a0a)}
:root[data-theme=dark] .header{background:color-mix(in srgb,#0f0f0f 90%,transparent)}
:root[data-theme=dark] .topbar,:root[data-theme=dark] .footer{background:#000}
:root[data-theme=dark] .to-top{background:#1a1a1a}:root[data-theme=dark] .to-top:hover{background:#262626}
:root[data-theme=dark] .catnav-all{background:#2a2a2a;color:#fff}
:root[data-theme=dark] .btn-primary,:root[data-theme=dark] .search button{color:#fff;box-shadow:0 12px 26px -14px rgba(0,0,0,.8)}
:root[data-theme=dark] .cat span,:root[data-theme=dark] .tl.done span,:root[data-theme=dark] .kind-tiles span{box-shadow:0 12px 24px -12px rgba(0,0,0,.8);color:#fff}
:root[data-theme=dark] .slide-kicker i{background:#fff;animation:none}
:root[data-theme=dark] .promo-cta,:root[data-theme=dark] .auth-side li .ic,:root[data-theme=dark] .toast .ic{color:#fff}
:root[data-theme=dark] .toast{background:#1c1c1c}:root[data-theme=dark] .toast a{color:#fff;text-decoration:underline}
:root[data-theme=dark] .pcard-ship,:root[data-theme=dark] .perks .ic{color:#d6d6d6}
:root[data-theme=dark] .tag-soft,:root[data-theme=dark] .tag-svc,:root[data-theme=dark] .tag-new{background:#3a3a3a}
:root[data-theme=dark] .chip.on{background:#f5f5f5;border-color:#f5f5f5;color:#0a0a0a}
:root[data-theme=dark] .freebar{background:#1c1c1c}
:root[data-theme=dark] .freebar i b{background:#d6d6d6}
:root[data-theme=dark] .drawer-langs a.on{background:#f5f5f5;border-color:#f5f5f5;color:#0a0a0a}
:root[data-theme=dark] .drawer-mask{background:rgba(0,0,0,.65)}
:root[data-theme=dark] .footer-langs a.on{background:#f5f5f5;color:#0a0a0a}

/* ---------- responsive ---------- */
@media (max-width:1100px){.cats{grid-template-columns:repeat(3,1fr)}.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:900px){
  .header-main{flex-wrap:wrap;gap:10px;padding:10px 0;min-height:0}
  .search{order:3;flex-basis:100%;max-width:none}
  .act-label{display:none}
  .slide{grid-template-columns:1fr;padding:26px 22px 64px;text-align:start}
  .slide-art{display:none}
  .slider{min-height:330px}
  .slider-nav{inset-inline-start:26px}
  .trust{grid-template-columns:1fr 1fr}
  .pd,.two-col,.acc,.auth{grid-template-columns:1fr}
  .gallery,.summary,.acc-nav{position:static}
  .auth-side{display:none}
}
@media (max-width:640px){
  body{font-size:14.5px}
  .topbar-links{display:none}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .cats{grid-template-columns:repeat(2,1fr)}
  .trust{grid-template-columns:1fr;gap:8px}.trust div{padding:12px 14px}
  .pcard-body{padding:11px 12px 13px}
  .price b{font-size:16px}
  .grid-2{grid-template-columns:1fr}
  .line{grid-template-columns:72px 1fr;}
  .line-img{width:72px;height:72px}
  .line-end{grid-column:1/-1;grid-template-columns:auto auto;justify-content:space-between;align-items:center}
  .timeline{grid-template-columns:repeat(2,1fr);row-gap:18px}
  .tl:nth-child(3):before{display:none}
  .footer-grid{grid-template-columns:1fr}
  .auth-form{padding:26px 20px}
  .logo small{display:none}
}
@media (max-width:1100px){.rail-track{grid-auto-columns:calc((100% - 3*14px)/4)}.promos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .menu-btn{display:inline-flex;padding:0 8px}
  .logo-main img{width:66px;height:66px}
  .lang-btn,.theme-btn,.catnav-all,.search-scope{display:none}
  .header-main .act[href*="account"]{display:none}
  .tabbar{position:fixed;bottom:0;inset-inline:0;z-index:60;display:grid;grid-template-columns:repeat(6,1fr);padding:6px 4px calc(6px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(14px) saturate(160%);border-top:1px solid var(--line);box-shadow:0 -10px 30px -18px rgba(11,27,51,.35)}
  .tabbar a,.tabbar button{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 0;border:0;background:none;color:var(--muted);font-size:10.5px;font-weight:600;cursor:pointer}
  .tabbar .ic{width:23px;height:23px}
  .tabbar .on{color:var(--brand)}
  .tabbar .on:before{content:"";position:absolute;top:-6px;width:28px;height:3px;border-radius:0 0 3px 3px;background:var(--brand)}
  .toast{bottom:calc(78px + env(safe-area-inset-bottom))}
  .kind-tiles{grid-template-columns:repeat(2,1fr)}
  .cat-list{grid-template-columns:1fr}
  .rail-btn{display:none}
  .wide-ad{flex-direction:column;align-items:flex-start;padding:22px}
  .footer{margin-bottom:0}
}
@media (max-width:640px){
  .slider.photo{aspect-ratio:1080/1080;min-height:0}
  .wide-ad.art{aspect-ratio:1080/1350}
  .wide-ad.art:not(:has(source)){aspect-ratio:2/1}
  .slider.photo .slider-arrows{display:none}
  .slider.photo .slider-nav{inset-inline-start:50%;transform:translateX(50%);bottom:14px}
  [dir=ltr] .slider.photo .slider-nav{transform:translateX(-50%)}
  .rail-track{grid-auto-columns:44%;gap:10px}
  .promos,.promos-3,.promos-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .promos-1{grid-template-columns:1fr}
  .promo{min-height:150px;padding:14px}
  .promo b{font-size:15px}
  .promo em{display:none}
  .topbar .wrap{justify-content:center;text-align:center}
  .cats{grid-template-columns:repeat(3,1fr);gap:8px}
  .cat{padding:14px 6px 12px}
  .cat span,.cat img{width:50px;height:50px}
  .cat b{font-size:12.5px}
  .filters{margin-inline:-16px;padding-inline:16px}
  .trust{grid-template-columns:1fr 1fr;gap:8px}
  .trust div{flex-direction:column;align-items:flex-start;gap:8px;padding:12px}
  .trust span{width:38px;height:38px;border-radius:11px}
  .trust .ic{width:20px;height:20px}
  .trust b{font-size:13px}.trust small{font-size:11.5px;line-height:1.5;display:block}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ================= mobile pro layer (≤ 900px / ≤ 640px) ================= */
.m-bar{display:none}
@media (max-width:900px){
  /* compact sticky header: [menu][logo][cart] + search; nav chips collapse while scrolling down */
  .header-main{display:grid;grid-template-columns:44px 1fr 44px;grid-template-areas:"menu logo cart" "search search search";gap:8px 6px;padding:8px 0 10px;min-height:0}
  .menu-btn{grid-area:menu;width:44px;height:44px;padding:0;justify-content:center}
  .logo-main{grid-area:logo;justify-self:center}
  .logo-main img{width:52px;height:52px}
  .actions{grid-area:cart;margin:0;justify-content:flex-end;gap:0}
  .actions .act:not(.cart-act){display:none}
  .act-icon{width:44px;min-height:44px}
  .search{grid-area:search;max-width:none;min-height:44px;border-radius:12px}
  .search input{font-size:16px;padding:8px 12px}
  .search button{width:48px}
  .header{transition:transform .25s ease}
  .header .catnav,.header .header-main>.logo-main,.header .menu-btn,.header .actions{transition:max-height .25s ease,opacity .2s ease,margin .25s ease}
  .catnav{max-height:60px;overflow:hidden}
  .header.compact .catnav{max-height:0;opacity:0;border-top-color:transparent}
  .header.compact .header-main{grid-template-areas:"menu search cart";grid-template-columns:44px 1fr 44px;padding:6px 0}
  .header.compact .logo-main{display:none}
  .catnav .wrap{min-height:44px;gap:6px;padding-block:6px}
  .catnav a{padding:6px 12px;border-radius:99px;border:1px solid var(--line);background:var(--surface);font-size:12.5px}
  .catnav a .ic{width:15px;height:15px}
  .catnav a.on{border-color:var(--brand)}
  /* forms: 16px avoids iOS zoom */
  .input,.field input,.field select,.field textarea,.qty input{font-size:16px}
  /* sticky action bar above the tab bar */
  .m-bar{position:fixed;inset-inline:0;bottom:calc(62px + env(safe-area-inset-bottom));z-index:55;display:flex;align-items:center;gap:8px;padding:10px 14px;
    background:color-mix(in srgb,var(--surface) 96%,transparent);backdrop-filter:blur(14px);border-top:1px solid var(--line);box-shadow:0 -12px 30px -20px rgba(0,0,0,.45)}
  .m-bar-price{display:grid;line-height:1.25;margin-inline-end:auto;min-width:0}
  .m-bar-price b{font-size:19px;font-weight:800;white-space:nowrap}
  .m-bar-price small{font-size:11px;color:var(--muted);font-weight:600}
  .m-bar-price s{font-size:12px;color:var(--muted)}
  .m-bar .btn{min-height:46px;padding:10px 16px;font-size:14px}
  body:has(.m-bar){padding-bottom:calc(132px + env(safe-area-inset-bottom))}
  .toast{bottom:calc(140px + env(safe-area-inset-bottom))}
  /* product page */
  .pd{gap:18px;padding-top:0}
  .page-head .crumbs{display:none}
  .gallery-main{aspect-ratio:1/1;max-height:62vh;margin-inline:auto;width:100%;border-radius:18px}
  .gallery-thumbs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .gallery-thumbs button{width:64px;height:64px;flex-shrink:0}
  .pd-info h1{font-size:21px}
  .pd-price b{font-size:26px}
  .buybox .btn{display:none}
  .perks{margin:16px 0}
  /* cart */
  .two-col:has(+ .m-bar) .summary .btn-primary{display:none}
  /* account: menu becomes a scrollable chip row */
  .acc{gap:14px;padding-top:14px}
  .acc-nav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:8px;border-radius:14px}
  .acc-user{display:none}
  .acc-nav a,.acc-nav button{flex-shrink:0;width:auto;padding:8px 14px;border-radius:99px;font-size:13px;border:1px solid var(--line);white-space:nowrap}
  .acc-nav a .ic,.acc-nav button .ic{width:16px;height:16px}
  .acc-nav form{flex-shrink:0}
  .acc-main>h1{font-size:21px}
}
@media (max-width:640px){
  body{font-size:14px}
  /* one-line announcement bar */
  .topbar .wrap{min-height:30px;justify-content:center}
  .topbar-msg{display:block;padding:0;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .paymarks-top{display:none}
  .wrap{width:calc(100% - 24px)}
  .section{padding:20px 0}
  .rail-sec{padding:16px 0}
  .sec-head{margin-bottom:12px;align-items:center}
  .sec-head h2{font-size:18px}
  .sec-head p{font-size:12.5px}
  .sec-head a{font-size:13px}
  .page-head{padding:16px 0 4px}
  .page-head h1{font-size:22px}
  /* hero */
  .hero{padding:12px 0 4px}
  .slider{border-radius:18px;min-height:250px}
  .slide{padding:22px 18px 54px}
  .slide h2{font-size:22px;margin:8px 0 6px}
  .slide p{font-size:13.5px;line-height:1.8;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .slide .btn{margin-top:12px;min-height:42px;padding:8px 18px;font-size:13.5px}
  .slider-nav{bottom:16px}
  /* trust strip: horizontal swipe row */
  .trust{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:12px -12px 0;padding:0 12px 2px;scroll-snap-type:x mandatory}
  .trust div{flex:0 0 64%;flex-direction:row;align-items:center;gap:10px;padding:10px 12px;scroll-snap-align:start}
  .trust span{width:36px;height:36px}
  .trust b{font-size:12.5px}.trust small{font-size:11px}
  /* categories: Amazon-style round tiles in one swipe row */
  .cats{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;margin:0 -12px;padding:2px 12px 6px}
  .cat{flex:0 0 76px;padding:0;border:0;background:none;box-shadow:none;gap:6px}
  .cat:hover{transform:none;box-shadow:none}
  .cat span,.cat img{width:66px;height:66px;border-radius:50%}
  .cat span .ic{width:26px;height:26px}
  .cat b{font-size:11.5px;line-height:1.4;font-weight:600}
  /* product grid & cards */
  .grid{gap:8px}
  .pcard{border-radius:14px}
  .pcard:hover{transform:none}
  .pcard-media img{width:88%;height:88%}
  .pcard-tags{top:8px;inset-inline-start:8px}
  .pcard-tags .badge{font-size:10.5px;padding:2px 7px}
  .pcard-body{padding:9px 10px 10px;gap:3px}
  .pcard-body h3{font-size:12.5px;line-height:1.55}
  .pcard-body p,.pcard-ship{display:none}
  .pcard-cat{font-size:11px}
  .price{padding-top:4px;gap:6px}
  .price b{font-size:15px}
  .price s{font-size:11px}
  .pcard form{margin-top:6px}
  .pcard .btn{min-height:36px;font-size:12px;padding:6px 8px;gap:6px;border-radius:10px}
  .pcard .btn .ic{width:16px;height:16px}
  .rail-track{grid-auto-columns:42%;gap:8px}
  .promos{gap:8px}
  .promo{border-radius:14px}
  .wide-ad{border-radius:16px;padding:18px}
  /* listing */
  .filters{padding-top:8px}
  .chip{padding:6px 12px;font-size:12px}
  .toolbar{margin:10px 0}
  .empty{padding:36px 16px}
  /* cart lines */
  .line{padding:12px;gap:12px;border-radius:14px}
  .two-col{gap:14px;padding-bottom:20px}
  .summary{padding:16px}
  /* footer: compact two-column */
  .footer{margin-top:24px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:20px 16px;padding:28px 0 18px}
  .footer-brand{grid-column:1/-1}
  .footer h4{font-size:14px;margin-bottom:8px}
  .footer ul{font-size:13px;gap:6px}
  .footer-bottom{font-size:12px;justify-content:center;text-align:center}
  /* tab bar */
  .tabbar{padding-top:4px}
  .tabbar a,.tabbar button{font-size:10px}
  .tabbar .ic{width:22px;height:22px}
}

/* ================= assurance band (above the footer) ================= */
.assure{margin-top:40px;background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.assure-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.assure-item{display:flex;align-items:center;gap:14px;padding:26px 22px;position:relative}
.assure-item+.assure-item:before{content:"";position:absolute;inset-inline-start:0;top:24px;bottom:24px;width:1px;background:var(--line)}
.assure-ic{display:grid;place-items:center;flex-shrink:0;width:54px;height:54px;border-radius:50%;background:var(--ink);color:var(--surface);box-shadow:0 10px 22px -12px rgba(0,0,0,.55);transition:transform .3s}
.assure-ic .ic{width:24px;height:24px}
.assure-item:hover .assure-ic{transform:translateY(-3px) rotate(-6deg)}
.assure-item div{display:grid;gap:2px;min-width:0}
.assure-item b{font-size:15px;color:var(--ink)}
.assure-item small{font-size:12.5px;color:var(--muted);line-height:1.6}
.assure+.footer{margin-top:0}
:root[data-theme=dark] .assure{background:#111}
:root[data-theme=dark] .assure-ic{background:#f5f5f5;color:#0a0a0a}
@media (max-width:900px){
  .assure-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .assure-item{padding:18px 14px}
  .assure-item:nth-child(3):before{display:none}
  .assure-item:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (max-width:640px){
  .assure{margin-top:24px}
  .assure-item{flex-direction:column;align-items:flex-start;gap:10px;padding:16px 14px}
  .assure-item+.assure-item:before{top:16px;bottom:16px}
  .assure-ic{width:42px;height:42px}
  .assure-ic .ic{width:20px;height:20px}
  .assure-item b{font-size:13.5px}
  .assure-item small{font-size:11.5px}
}
/* assurance icons: plain glyphs, no circle */
.assure-ic,:root[data-theme=dark] .assure-ic{width:auto;height:auto;border-radius:0;background:none;box-shadow:none;color:var(--ink)}
.assure-ic .ic{width:32px;height:32px;stroke-width:1.6}
@media (max-width:640px){.assure-ic,:root[data-theme=dark] .assure-ic{width:auto;height:auto}.assure-ic .ic{width:26px;height:26px}}
/* ================= e-mail verification (OTP) ================= */
.otp-box{text-align:center;justify-items:center}
.otp-box .sub{line-height:1.9}
.otp-ic{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;background:var(--surface-2);color:var(--ink)}
.otp-ic .ic{width:30px;height:30px}
.otp-form{display:grid;gap:16px;width:100%;max-width:380px}
.otp{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.otp input{width:100%;aspect-ratio:1/1.15;border:1.5px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);text-align:center;font-size:24px;font-weight:800;font-family:ui-monospace,Consolas,monospace;transition:border-color .15s,box-shadow .15s,transform .15s}
.otp input:focus{outline:0;border-color:var(--ink);box-shadow:0 0 0 4px color-mix(in srgb,var(--ink) 12%,transparent);transform:translateY(-1px)}
.otp-resend{display:flex;gap:6px;justify-content:center;align-items:center;font-size:14px;color:var(--muted)}
.link-btn{border:0;background:none;padding:0;color:var(--ink);font-weight:700;cursor:pointer;font:inherit;text-decoration:underline;text-underline-offset:3px}
.link-btn[disabled]{color:var(--muted);text-decoration:none;cursor:default}
/* ================= AI assistant ================= */
.ai{position:fixed;z-index:70;bottom:22px;inset-inline-end:22px}
.ai-fab{position:relative;width:60px;height:60px;border-radius:50%;border:0;background:var(--ink);color:var(--surface);display:grid;place-items:center;cursor:pointer;box-shadow:0 16px 34px -12px rgba(0,0,0,.55);transition:transform .25s}
.ai-fab:hover{transform:translateY(-2px) scale(1.04)}
.ai-fab .ic{width:26px;height:26px}
.ai-fab-x{display:none}.ai.open .ai-fab-x{display:block}.ai.open .ai-fab-ic{display:none}
.ai-ping{position:absolute;top:4px;inset-inline-end:4px;width:12px;height:12px;border-radius:50%;background:#22c55e;border:2px solid var(--surface)}
.ai.open .ai-ping{display:none}
.ai-panel{position:absolute;bottom:74px;inset-inline-end:0;width:min(390px,calc(100vw - 24px));height:min(600px,calc(100vh - 140px));display:flex;flex-direction:column;
  background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:0 30px 70px -24px rgba(0,0,0,.5);overflow:hidden;animation:ai-in .25s cubic-bezier(.2,.7,.2,1)}
.ai-panel[hidden]{display:none}
@keyframes ai-in{from{opacity:0;transform:translateY(12px) scale(.98)}}
.ai-head{display:flex;align-items:center;gap:10px;padding:14px 14px;background:var(--ink);color:var(--surface)}
.ai-head div{flex:1;min-width:0;display:grid;line-height:1.35}
.ai-head b{font-size:15px}
.ai-head small{display:flex;align-items:center;gap:6px;font-size:12px;opacity:.8}
.ai-head small i{width:8px;height:8px;border-radius:50%;background:#22c55e}
.ai-head small.off i{background:#ef4444}
.ai-avatar{width:40px;height:40px;border-radius:12px;background:#fff;display:grid;place-items:center;flex-shrink:0}
.ai-avatar img{width:30px;height:30px}
.ai-head button{width:34px;height:34px;border-radius:10px;border:0;background:rgba(255,255,255,.12);color:inherit;display:grid;place-items:center;cursor:pointer}
.ai-head button .ic{width:17px;height:17px}
.ai-msgs{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:10px;background:var(--bg);overscroll-behavior:contain}
.ai-msg{max-width:86%;padding:10px 14px;border-radius:16px;font-size:14px;line-height:1.85;word-wrap:break-word}
.ai-msg p{margin:0 0 4px}.ai-msg p:last-child{margin:0}
.ai-msg ul{margin:4px 0;padding-inline-start:18px}
.ai-msg a{font-weight:700;text-decoration:underline;text-underline-offset:3px}
.ai-msg.bot{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-start-start-radius:6px}
.ai-msg.me{align-self:flex-end;background:var(--ink);color:var(--surface);border-start-end-radius:6px;white-space:pre-wrap}
.ai-msg.err{border-color:color-mix(in srgb,var(--danger) 40%,transparent);color:var(--danger)}
.ai-msg.typing{display:flex;gap:4px;padding:14px 16px}
.ai-msg.typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:ai-dot 1.2s infinite}
.ai-msg.typing i:nth-child(2){animation-delay:.15s}.ai-msg.typing i:nth-child(3){animation-delay:.3s}
@keyframes ai-dot{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.ai-chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:8px 12px;background:var(--bg);border-top:1px solid var(--line)}
.ai-chips[hidden]{display:none}
.ai-chips button{flex-shrink:0;padding:7px 12px;border-radius:99px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:12.5px;cursor:pointer;white-space:nowrap}
.ai-chips button:hover{border-color:var(--ink)}
.ai-form{display:flex;gap:8px;align-items:flex-end;padding:10px 12px;border-top:1px solid var(--line);background:var(--surface)}
.ai-form textarea{flex:1;resize:none;min-height:44px;max-height:120px;padding:11px 14px;border-radius:14px;border:1px solid var(--line);background:var(--surface-2);color:var(--ink);font:inherit;font-size:15px;line-height:1.5}
.ai-form textarea:focus{outline:0;border-color:var(--ink);background:var(--surface)}
.ai-send{width:44px;height:44px;flex-shrink:0;border-radius:14px;border:0;background:var(--ink);color:var(--surface);display:grid;place-items:center;cursor:pointer}
.ai-send[disabled]{opacity:.45}
.ai-note{display:block;padding:0 12px 10px;font-size:11px;color:var(--muted);text-align:center;background:var(--surface)}
:root[data-theme=dark] .ai-head{background:#1c1c1c;color:#f5f5f5}
:root[data-theme=dark] .ai-fab{background:#f5f5f5;color:#0a0a0a}
@media (max-width:900px){
  .ai{bottom:calc(76px + env(safe-area-inset-bottom));inset-inline-end:14px}
  body:has(.m-bar) .ai{bottom:calc(146px + env(safe-area-inset-bottom))}
  .ai-fab{width:52px;height:52px}
  .ai.open{inset:0;bottom:0}
  .ai.open .ai-fab{display:none}
  .ai-panel{position:fixed;inset:0;width:100%;height:100%;max-height:none;border-radius:0;bottom:0;z-index:95}
  .ai-form textarea{font-size:16px}
}
/* home SEO intro (H1) */
.intro{padding:22px 0 0}
.intro .wrap{display:grid;gap:6px;padding:18px 22px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line)}
.intro h1{font-size:clamp(18px,1.9vw,23px);line-height:1.5}
.intro p{color:var(--muted);font-size:14px;line-height:1.9}
@media (max-width:640px){.intro{padding-top:14px}.intro .wrap{width:calc(100% - 24px);padding:14px 16px}.intro h1{font-size:17px}.intro p{font-size:13px}}