@font-face{font-family:Vazirmatn;src:url(/shop/assets/vazirmatn.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{color-scheme:light;
  --accent:#e97635;--accent-dark:#c85c1f;--accent-soft:#fdf0e7;--on-accent:#fff;--link:#c85c1f;
  --ink:#17191b;--text-2:#3c4146;--muted:#6f747a;--muted-2:#8b9095;
  --page:radial-gradient(90% 70% at 85% 0%,#5a3424 0%,transparent 60%),radial-gradient(70% 60% at 0% 100%,#43302a 0%,transparent 60%),#1c1b1d;
  --stage:#ebebeb;--card:#fff;--soft:#f5f5f5;--hover:#f1f1f1;--line:#e2e3e4;--line-2:#f0f0f0;--line-strong:#d0d2d5;--track:#eceded;
  --field:#fff;--field-line:#d6d8db;
  --inverse:#17191b;--on-inverse:#fff;--inverse-hover:#2c3034;
  --photo:linear-gradient(180deg,#f6f6f6,#ececec);--photo-flat:#f3f3f3;
  --foot:#e3e3e3;--foot-line:#d3d4d6;--foot-head:#55595e;
  --star:#e3a008;--diff:#fff8ee;--danger:#c0392b;--danger-dark:#a12f23;--on-status:#fff;
  --good:#1f8a4c;--good-soft:#e5f4ea;--good-ink:#155f35;--warn:#b7791f;--warn-soft:#fbf1dc;--warn-ink:#7a5212;
  --bad:#c0392b;--bad-soft:#fbe7e4;--bad-ink:#8b2a1f;--critical-soft:#f6c9c2;--info:#2563a8;--info-soft:#e4eef9;--info-ink:#1d4a7c;
  --frame:clamp(8px,2vw,24px);--radius:24px;--r:16px}
@media screen{
/* Dark theme: near-black navy surfaces separated by hairlines, IMEN blue (#264593) as the brand colour for primary
   actions, active states and glows, orange only for the main calls to action, white text in three tones. */
[data-theme="dark"]{color-scheme:dark;
  --accent:#f07a35;--accent-dark:#d8662a;--accent-soft:rgba(240,122,53,.14);--on-accent:#fff;--link:#ff9d62;
  --ink:#f3f5fa;--text-2:#c6cee0;--muted:#8e99b3;--muted-2:#6c7894;
  --page:radial-gradient(70% 55% at 88% -8%,rgba(38,69,147,.55) 0%,transparent 62%),radial-gradient(55% 45% at 0% 108%,rgba(240,122,53,.10) 0%,transparent 60%),#05080f;
  --stage:#0a101e;--card:#111a2e;--soft:#162038;--hover:#1b2742;--line:#1f2b46;--line-2:#18223a;--line-strong:#2c3b5e;--track:#1b2640;
  --field:#0d1527;--field-line:#26344f;
  --inverse:#264593;--on-inverse:#fff;--inverse-hover:#2f53ad;
  --photo:radial-gradient(110% 95% at 50% 100%,#1c2b4f 0%,#131d35 55%,#0f1729 100%);--photo-flat:#141f37;
  --foot:#070c18;--foot-line:#18223a;--foot-head:#8e99b3;
  --star:#f5a524;--diff:rgba(240,122,53,.10);--danger:#e5484d;--danger-dark:#c93a3f;--on-status:#06120c;
  --good:#3ecf8e;--good-soft:rgba(62,207,142,.12);--good-ink:#7ee2b3;--warn:#f5a524;--warn-soft:rgba(245,165,36,.12);--warn-ink:#f8c56b;
  --bad:#f2555a;--bad-soft:rgba(242,85,90,.12);--bad-ink:#f79a9d;--critical-soft:rgba(242,85,90,.26);--info:#8fb0ff;--info-soft:rgba(38,69,147,.38);--info-ink:#c3d3ff}
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Vazirmatn,Tahoma,sans-serif;color:var(--ink);line-height:1.7;background:var(--page);background-attachment:fixed;-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:inherit;text-decoration:none}
a:hover{color:var(--link)}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img{max-width:100%}
svg{display:block}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--muted)}
.ltr{direction:ltr;unicode-bidi:isolate}
.nowrap{white-space:nowrap}
h1,h2,h3{line-height:1.4;letter-spacing:-.3px}

.shell{margin:var(--frame);min-height:calc(100vh - 2 * var(--frame));background:var(--stage);border-radius:var(--radius);display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:minmax(0,1fr);overflow:clip;box-shadow:0 30px 80px #0006}

/* Header */
.top{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:22px 28px 0;min-width:0;position:relative;z-index:30}
.logo{display:flex;align-items:center;gap:10px;flex:none}
.mark{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#f08a4c,var(--accent) 45%,var(--accent-dark));color:#fff;font:800 22px/1 Arial,sans-serif;letter-spacing:-2px;box-shadow:0 8px 18px #e9763540,inset 0 1px 0 #ffffff55}
.mark b{color:#ffe2cf}
.word{font:700 12px/1.2 Arial,sans-serif;letter-spacing:2.5px;display:flex;flex-direction:column}
.word small{font:500 10px Vazirmatn,sans-serif;letter-spacing:0;color:var(--muted);margin-top:3px;text-align:right}
.pills{display:flex;gap:6px;min-width:0;flex:0 1 auto;align-items:center;overflow-x:auto;scrollbar-width:none;padding:2px 0}
.pills::-webkit-scrollbar{display:none}
.pill{background:var(--card);border-radius:30px;padding:9px 16px;font-size:13px;font-weight:500;white-space:nowrap;transition:background .2s,color .2s;display:inline-flex;align-items:center;gap:6px}
.pill:hover{background:var(--hover);color:var(--ink)}
.pill.is-active{background:var(--inverse);color:var(--on-inverse)}
.more{position:relative;flex:none;margin-left:auto}
.more>summary{list-style:none;cursor:pointer}
.more>summary::-webkit-details-marker{display:none}
.more[open]>summary{background:var(--inverse);color:var(--on-inverse)}
.mega{position:absolute;top:calc(100% + 10px);right:0;width:min(640px,90vw);background:var(--card);border-radius:20px;box-shadow:0 24px 60px #0003;padding:18px;display:grid;grid-template-columns:repeat(3,1fr);gap:4px 18px;z-index:40}
.mega h4{font-size:11px;color:var(--muted);font-weight:600;margin:6px 0 2px}
.mega a{font-size:13px;padding:5px 0;display:block}
.actions{display:flex;align-items:center;gap:8px;flex:none}
.icon-btn{width:42px;height:42px;border-radius:50%;background:var(--card);display:grid;place-items:center;position:relative;flex:none}
.icon-btn svg{width:20px;height:20px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.icon-btn .count{position:absolute;top:-2px;left:-2px;min-width:18px;height:18px;border-radius:9px;background:var(--accent);color:var(--on-accent);font-size:10px;font-weight:700;display:grid;place-items:center;padding:0 4px}
.order{background:var(--inverse);color:var(--on-inverse);border-radius:30px;padding:10px 22px;font-size:13px;font-weight:600;white-space:nowrap;transition:background .2s}
.order:hover{background:var(--accent);color:var(--on-accent)}
.search{position:relative;display:flex;align-items:center;gap:8px;height:42px;width:clamp(170px,20vw,300px);padding:0 14px;border-radius:30px;background:var(--card);transition:box-shadow .2s}
.search:focus-within{box-shadow:0 0 0 2px var(--accent)}
.search>svg{width:18px;height:18px;flex:none;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round}
.search input,.search input[type="search"]{flex:1;min-width:0;border:0;border-radius:0;outline:0;background:none;box-shadow:none;font:inherit;font-size:13px;color:var(--ink);-webkit-appearance:none;appearance:none;padding:0}
.search input::placeholder{color:var(--muted-2)}
.search input::-webkit-search-cancel-button{display:none}
.search-results{position:absolute;top:calc(100% + 8px);right:0;left:0;min-width:300px;list-style:none;background:var(--card);border-radius:16px;padding:6px;box-shadow:0 18px 40px #0002;z-index:50;max-height:420px;overflow:auto}
.search-results li{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:11px;cursor:pointer}
.search-results li[aria-selected="true"]{background:var(--hover)}
.search-results img{width:72px;height:36px;object-fit:contain;flex:none}
.search-results strong{display:block;font-size:13px}
.search-results small{font-size:11px;color:var(--muted)}
.search-results .hint{font-size:11px;color:var(--muted);padding:6px 8px;cursor:default}

/* Page */
.page{padding:22px 28px 40px;min-width:0}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.page-head h1{font-size:clamp(24px,3vw,34px);font-weight:800}
.page-head p{color:var(--muted);font-size:14px;margin-top:2px}
.crumbs{display:flex;gap:6px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-bottom:8px}
.crumbs a:after{content:'/shop/';margin-right:6px;color:var(--muted-2)}
.section{margin-top:28px}
.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px}
.section-head h2{font-size:20px;font-weight:800}
.section-head a{font-size:13px;color:var(--link);font-weight:600}
.card{background:var(--card);border-radius:var(--r)}
.pad{padding:18px 20px}
.stack{display:grid;gap:12px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.spread{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:18px;align-items:start}
.layout-wide{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;align-items:start}
.sticky{position:sticky;top:16px}
hr{border:0;border-top:1px solid var(--line);margin:14px 0}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:30px;padding:10px 22px;font-size:14px;font-weight:600;background:var(--inverse);color:var(--on-inverse);transition:background .2s,transform .1s;white-space:nowrap}
.btn:hover{background:var(--inverse-hover);color:var(--on-inverse)}
.btn:active{transform:translateY(1px)}
.btn-accent,.btn-accent:hover{color:var(--on-accent)}
.btn-accent{background:var(--accent)}
.btn-accent:hover{background:var(--accent-dark)}
.btn-ghost{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.btn-ghost:hover{background:var(--soft);color:var(--ink)}
.btn-danger,.btn-danger:hover{color:#fff}
.btn-danger{background:var(--danger)}
.btn-danger:hover{background:var(--danger-dark)}
.btn-sm{padding:6px 14px;font-size:12px}
.btn-block{width:100%}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.5;pointer-events:none}
.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.link{color:var(--link);font-weight:600}

/* Badges & chips */
.badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;border-radius:20px;padding:2px 9px;background:var(--soft);color:var(--text-2);white-space:nowrap}
.badge.good{background:var(--good-soft);color:var(--good)}
.badge.warn{background:var(--warn-soft);color:var(--warn)}
.badge.bad{background:var(--bad-soft);color:var(--bad)}
.badge.info{background:var(--info-soft);color:var(--info)}
.badge.accent{background:var(--accent-soft);color:var(--link)}
.badge.dark{background:var(--inverse);color:var(--on-inverse)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--card);border-radius:20px;padding:5px 12px;font-size:12px;box-shadow:inset 0 0 0 1px var(--line)}
.chip.on{background:var(--inverse);color:var(--on-inverse);box-shadow:none}
.chip svg{width:14px;height:14px}
.chip button,.chip a.x{font-size:14px;line-height:1;color:inherit;opacity:.6}

/* Listing cards */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.lcard{background:var(--card);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;position:relative;transition:box-shadow .2s,transform .2s}
.lcard:hover{box-shadow:0 12px 30px #0000001a;transform:translateY(-2px)}
.lcard.highlight{box-shadow:0 0 0 2px var(--accent)}
.lcard .media{background:var(--photo);aspect-ratio:16/9;display:grid;place-items:center;position:relative;overflow:hidden}
.lcard .media img{width:92%;height:92%;object-fit:contain}
.lcard .tags{position:absolute;top:8px;right:8px;left:8px;display:flex;gap:4px;flex-wrap:wrap}
.lcard .demo{position:absolute;bottom:6px;left:8px;font-size:9px;color:#8b9095;background:#ffffffcc;padding:0 6px;border-radius:8px}
.lcard .fav{position:absolute;bottom:8px;right:8px;width:32px;height:32px;border-radius:50%;background:var(--card);display:grid;place-items:center;box-shadow:0 2px 8px #0002}
.lcard .fav svg{width:16px;height:16px;fill:none;stroke:var(--ink);stroke-width:1.8}
.lcard .fav[aria-pressed="true"] svg{fill:var(--accent);stroke:var(--accent)}
.lcard .body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:4px;flex:1}
.lcard h3{font-size:14px;font-weight:700;line-height:1.5}
.lcard .meta{font-size:12px;color:var(--muted);display:flex;gap:6px;flex-wrap:wrap}
.lcard .meta span+span:before{content:'·';margin-left:6px}
.lcard .price{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:8px;gap:6px}
.lcard .price strong{font-size:15px;font-weight:800}
.lcard .compare-toggle{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:4px}

/* Forms */
.form{display:grid;gap:14px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px}
.form-grid .full{grid-column:1/-1}
.field{display:grid;gap:5px;min-width:0}
.field>span,.field>label{font-size:12.5px;font-weight:600;color:var(--text-2)}
.field .hint{font-size:11px;color:var(--muted)}
.field .error,.form-error{font-size:12px;color:var(--bad)}
.form-error{background:var(--bad-soft);padding:8px 12px;border-radius:10px}
input[type=text],input[type=tel],input[type=password],input[type=number],input[type=date],input[type=time],input[type=email],input[type=search],input[type=url],select,textarea{
  font:inherit;font-size:14px;color:var(--ink);background:var(--field);border:1px solid var(--field-line);border-radius:12px;padding:9px 12px;width:100%;min-width:0;outline:none;transition:border-color .2s,box-shadow .2s}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #e9763522}
input[aria-invalid="true"],select[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:var(--bad)}
textarea{min-height:110px;resize:vertical;line-height:1.8}
input[type=range]{width:100%;accent-color:var(--accent)}
.check{display:flex;align-items:center;gap:8px;font-size:13px;cursor:pointer}
.check input{width:17px;height:17px;accent-color:var(--accent)}
.segmented{display:flex;flex-wrap:wrap;gap:6px}
.segmented label{position:relative}
.segmented input{position:absolute;opacity:0;pointer-events:none}
.segmented span{display:inline-block;padding:7px 14px;border-radius:20px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);font-size:13px;cursor:pointer}
.segmented input:checked+span{background:var(--inverse);color:var(--on-inverse);box-shadow:none}
.segmented input:focus-visible+span{outline:2px solid var(--accent)}
.form-actions{display:flex;gap:10px;justify-content:flex-start;flex-wrap:wrap}
fieldset{border:0;display:grid;gap:10px}
legend{font-weight:700;font-size:14px;margin-bottom:6px}

/* Filters sidebar */
.filters{display:grid;gap:4px}
.filters details{border-bottom:1px solid var(--line);padding:10px 0}
.filters details:last-of-type{border-bottom:0}
.filters summary{cursor:pointer;font-size:13px;font-weight:700;list-style:none;display:flex;justify-content:space-between}
.filters summary::-webkit-details-marker{display:none}
.filters summary:after{content:'+';color:var(--muted)}
.filters details[open] summary:after{content:'−'}
.filters .opts{display:grid;gap:6px;margin-top:8px;max-height:220px;overflow:auto}
.filters .range{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.smart-box{display:flex;gap:8px;background:var(--card);border-radius:18px;padding:8px 8px 8px 14px;align-items:center}
.smart-box>svg{flex:none;color:var(--accent)}
.smart-box input,.smart-box input[type="search"]{border:0;box-shadow:none;background:none;font-size:15px;padding:8px 4px}
.smart-box input:focus{box-shadow:none}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0}
.toolbar select{width:auto}

/* Tables */
.table-wrap{overflow-x:auto;background:var(--card);border-radius:var(--r)}
table.table{width:100%;border-collapse:collapse;font-size:13px}
.table th{text-align:right;font-size:11.5px;color:var(--muted);font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.table td{padding:10px 12px;border-bottom:1px solid var(--line-2);vertical-align:middle}
.table tr:last-child td{border-bottom:0}
.table .num{text-align:left;direction:ltr;unicode-bidi:isolate;white-space:nowrap}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;font-size:13px}
.kv dt{color:var(--muted)}
.kv dd{font-weight:600}
.specs{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1px;background:var(--line);border-radius:12px;overflow:hidden}
.specs div{background:var(--card);padding:10px 12px;display:flex;flex-direction:column}
.specs small{font-size:11px;color:var(--muted)}
.specs strong{font-size:13.5px}

/* Stats */
.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.stat{background:var(--card);border-radius:var(--r);padding:14px 16px}
.stat small{font-size:12px;color:var(--muted);display:block}
.stat strong{font-size:24px;font-weight:800;letter-spacing:-.5px;display:block;margin-top:2px}
.stat em{font-style:normal;font-size:11px;color:var(--muted)}

/* Tabs */
.tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;background:var(--card);border-radius:30px;padding:4px;width:max-content;max-width:100%}
.tabs a,.tabs button{padding:7px 16px;border-radius:24px;font-size:13px;white-space:nowrap}
.tabs .is-active{background:var(--inverse);color:var(--on-inverse)}
.side-nav{display:grid;gap:2px}
.side-nav a{padding:8px 12px;border-radius:12px;font-size:13px;display:flex;justify-content:space-between}
.side-nav a.is-active{background:var(--inverse);color:var(--on-inverse)}
.side-nav a:hover:not(.is-active){background:var(--soft)}

/* Pagination & empty */
.pagination{display:flex;gap:6px;justify-content:center;margin-top:22px;flex-wrap:wrap}
.pagination a,.pagination span{min-width:38px;height:38px;border-radius:19px;background:var(--card);display:grid;place-items:center;font-size:13px;padding:0 10px}
.pagination .is-active{background:var(--inverse);color:var(--on-inverse)}
.empty{text-align:center;padding:40px 20px;background:var(--card);border-radius:var(--r);color:var(--muted)}
.empty strong{display:block;color:var(--ink);font-size:16px;margin-bottom:4px}
.empty .btn{margin-top:14px}

/* Score ring & meters */
.ring{--v:0;--c:var(--good);width:86px;height:86px;border-radius:50%;background:conic-gradient(var(--c) calc(var(--v)*1%),var(--track) 0);display:grid;place-items:center;flex:none}
.ring>span{width:70px;height:70px;border-radius:50%;background:var(--card);display:grid;place-items:center;font-weight:800;font-size:20px}
.ring small{font-size:10px;color:var(--muted);font-weight:500;display:block;line-height:1}
.meter{height:8px;border-radius:4px;background:var(--track);overflow:hidden}
.meter>i{display:block;height:100%;background:var(--good);border-radius:4px}
.meter.warn>i{background:var(--warn)}
.meter.bad>i{background:var(--bad)}
.scorelist{display:grid;gap:8px}
.scorelist div{display:grid;grid-template-columns:120px 1fr 34px;align-items:center;gap:10px;font-size:12.5px}

/* Price intelligence */
.pricebar{position:relative;height:10px;border-radius:5px;background:linear-gradient(90deg,var(--good),#d8c24a 50%,var(--bad));margin:28px 4px 22px}
.pricebar .marker{position:absolute;top:-24px;transform:translateX(50%);font-size:11px;font-weight:700;background:var(--inverse);color:var(--on-inverse);border-radius:8px;padding:1px 7px;white-space:nowrap}
.pricebar .marker:after{content:'';position:absolute;bottom:-5px;right:calc(50% - 5px);border:5px solid transparent;border-top-color:var(--inverse);border-bottom:0}
.pricebar .ends{position:absolute;top:14px;font-size:11px;color:var(--muted);white-space:nowrap}
.chart{width:100%;height:220px}
.chart svg{width:100%;height:100%}
.chart .line{fill:none;stroke:var(--accent);stroke-width:2.2}
.chart .band{fill:#e9763518}
.chart .axis{stroke:var(--line);stroke-width:1}
.chart text{font-size:10px;fill:var(--muted);font-family:Vazirmatn,sans-serif}

/* Gallery */
.gallery{display:grid;gap:8px}
.gallery .main{background:var(--photo);border-radius:var(--r);aspect-ratio:16/9;display:grid;place-items:center;position:relative;overflow:hidden}
.gallery .main img{width:90%;height:90%;object-fit:contain}
.gallery .thumbs{display:flex;gap:8px;overflow-x:auto}
.gallery .thumbs button{flex:none;width:96px;aspect-ratio:16/10;border-radius:10px;background:var(--photo-flat);overflow:hidden;box-shadow:inset 0 0 0 2px transparent}
.gallery .thumbs button[aria-current="true"]{box-shadow:inset 0 0 0 2px var(--accent)}
.gallery .thumbs img{width:100%;height:100%;object-fit:contain}
.gallery .note{position:absolute;bottom:10px;left:12px;font-size:11px;color:#6b7075;background:#fff;padding:2px 10px;border-radius:12px}

/* Body map */
.bodymap{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:16px;align-items:start}
.bodymap svg{width:100%;height:auto}
.bodymap .part{fill:#dfe9e1;stroke:var(--card);stroke-width:3;cursor:default;transition:fill .2s}
.bodymap.editable .part{cursor:pointer}
.bodymap.editable .part:hover{filter:brightness(.95)}
.part[data-status="healthy"]{fill:#dfe9e1}
.part[data-status="scratch"]{fill:#f4e3a3}
.part[data-status="painted"]{fill:#f2b47c}
.part[data-status="repaired"]{fill:#e9a07a}
.part[data-status="dent"]{fill:#e8806b}
.part[data-status="replaced"]{fill:#c0392b}
.legend{display:flex;flex-wrap:wrap;gap:8px 14px;font-size:12px}
.legend i{display:inline-block;width:12px;height:12px;border-radius:4px;margin-left:5px;vertical-align:middle}

/* Condition grid */
.cond{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.cond div{background:var(--card);border-radius:12px;padding:10px 12px;display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:13px;box-shadow:inset 0 0 0 1px var(--line)}

/* Wizard */
.steps{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin-bottom:16px;counter-reset:step}
.steps li{list-style:none;flex:none;display:flex;align-items:center;gap:6px;font-size:12px;padding:6px 12px;border-radius:20px;background:var(--card);color:var(--muted)}
.steps li:before{counter-increment:step;content:counter(step);width:20px;height:20px;border-radius:50%;background:var(--soft);display:grid;place-items:center;font-size:11px;font-weight:700}
.steps li.is-active{background:var(--inverse);color:var(--on-inverse)}
.steps li.is-active:before{background:var(--accent);color:var(--on-accent)}
.steps li.is-done:before{content:'✓';background:var(--good);color:var(--on-status)}
.wizard-step[hidden]{display:none}
.photo-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.photo-slot{background:var(--card);border:1.5px dashed var(--field-line);border-radius:14px;aspect-ratio:4/3;display:grid;place-items:center;text-align:center;font-size:12px;color:var(--muted);position:relative;overflow:hidden;cursor:pointer}
.photo-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.photo-slot .q{position:absolute;bottom:6px;right:6px;left:6px;font-size:10px;background:#fff;border-radius:8px;padding:2px 6px;color:#17191b}
.photo-slot input{position:absolute;inset:0;opacity:0;cursor:pointer}

/* Chat */
.chat{display:flex;flex-direction:column;gap:8px;max-height:56vh;overflow-y:auto;padding:14px;background:var(--soft);border-radius:var(--r)}
.bubble{max-width:78%;padding:8px 12px;border-radius:14px;font-size:13.5px;background:var(--card);align-self:flex-start;box-shadow:0 1px 2px #0000000d}
.bubble.mine{align-self:flex-end;background:var(--inverse);color:var(--on-inverse)}
.bubble time{display:block;font-size:10px;opacity:.6;margin-top:2px}
.bubble img{border-radius:10px;margin-top:6px;max-height:200px}
.templates{display:flex;flex-wrap:wrap;gap:6px}

/* Kanban */
.kanban{display:grid;grid-template-columns:repeat(7,minmax(200px,1fr));gap:10px;overflow-x:auto;padding-bottom:6px}
.kanban .col{background:var(--soft);border-radius:14px;padding:10px;min-height:120px}
.kanban .col h3{font-size:12.5px;display:flex;justify-content:space-between;margin-bottom:8px}
.kanban .lead{background:var(--card);border-radius:12px;padding:10px;font-size:12px;display:grid;gap:4px;margin-bottom:8px}

/* Notifications & toasts */
.notice{background:var(--info-soft);color:var(--info-ink);border-radius:12px;padding:10px 14px;font-size:13px}
.notice.warn{background:var(--warn-soft);color:var(--warn-ink)}
.notice.good{background:var(--good-soft);color:var(--good-ink)}
.notice.bad{background:var(--bad-soft);color:var(--bad-ink)}
.toasts{position:fixed;bottom:20px;left:20px;display:grid;gap:8px;z-index:100}
.toast{background:var(--inverse);color:var(--on-inverse);border-radius:14px;padding:10px 16px;font-size:13px;box-shadow:0 12px 30px #0004;animation:toast .3s ease}
.toast.bad{background:var(--danger);color:#fff}
@keyframes toast{from{opacity:0;transform:translateY(10px)}}
.list{display:grid;gap:8px}
.list-item{background:var(--card);border-radius:14px;padding:12px 14px;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.list-item.unread{box-shadow:inset 3px 0 0 var(--accent)}
.thumb{width:96px;aspect-ratio:16/10;border-radius:10px;background:var(--photo-flat);display:grid;place-items:center;overflow:hidden;flex:none}
.thumb img{width:100%;height:100%;object-fit:contain}
.rating{color:var(--star);letter-spacing:1px;font-size:13px}
.compare-bar{position:fixed;bottom:16px;right:50%;transform:translateX(50%);background:var(--inverse);color:var(--on-inverse);border-radius:30px;padding:8px 8px 8px 18px;display:flex;gap:12px;align-items:center;font-size:13px;z-index:60;box-shadow:0 14px 40px #0006}
.compare-bar[hidden]{display:none}
.compare-table td.best{background:var(--good-soft);font-weight:700}
.compare-table td.diff{background:var(--diff)}
.compare-table th[scope=row]{color:var(--muted);font-weight:600;text-align:right;white-space:nowrap}

/* Footer */
.foot{padding:28px;background:var(--foot);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;font-size:12.5px}
.foot h4{font-size:12px;color:var(--foot-head);margin-bottom:6px}
.foot a{display:block;padding:2px 0;color:var(--text-2)}
.foot .legal{grid-column:1/-1;border-top:1px solid var(--foot-line);padding-top:12px;color:var(--muted);font-size:11.5px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}

/* Error page */
.error-page{display:grid;place-items:center;text-align:center;padding:60px 20px;gap:8px}
.error-page b{font-size:64px;font-weight:900;color:var(--accent);line-height:1}

@media(max-width:1380px){.word{display:none}.search{width:clamp(150px,16vw,240px)}}
@media(max-width:1180px){
  .search{width:clamp(150px,18vw,220px)}
  .word{display:none}
  .layout{grid-template-columns:250px minmax(0,1fr)}
  .layout-wide{grid-template-columns:minmax(0,1fr) 320px}
  .foot{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:980px){
  .top{flex-wrap:wrap}
  .pills{order:3;flex:1 1 calc(100% - 110px)}
  .more{order:4;margin-left:0}
  .mega{position:fixed;top:auto;right:12px;left:12px;width:auto;grid-template-columns:repeat(2,1fr)}
  .layout,.layout-wide{grid-template-columns:minmax(0,1fr)}
  .filters-panel{order:2}
  .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sticky{position:static}
}
@media(max-width:640px){
  :root{--radius:18px}
  .top{padding:14px 14px 0;gap:10px}
  .actions{gap:6px;flex:1 1 220px;min-width:0}
  .search{flex:1 1 auto;width:auto;min-width:0;padding:0 12px}
  .icon-btn{width:38px;height:38px}
  .order{padding:9px 14px;font-size:12px}
  .page{padding:16px 14px 30px}
  .grid-2,.grid-3,.grid-4,.form-grid{grid-template-columns:minmax(0,1fr)}
  .cards-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
  .lcard h3{font-size:13px}
  .bodymap{grid-template-columns:minmax(0,1fr)}
  .foot{grid-template-columns:repeat(2,minmax(0,1fr));padding:20px 16px}
  .scorelist div{grid-template-columns:96px 1fr 30px}
  .compare-bar{width:calc(100% - 24px)}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{body{background:#fff}.shell{box-shadow:none;margin:0}.top,.foot,.no-print{display:none!important}}
.bubble.assistant-bubble{max-width:100%;width:100%}
.bubble p+p{margin-top:6px}

/* Theme switch (moon in light mode, sun in dark mode). */
.theme-toggle .i-sun,[data-theme="dark"] .theme-toggle .i-moon{display:none}
[data-theme="dark"] .theme-toggle .i-sun{display:block}
@media screen{
  /* Surfaces are separated by hairlines rather than by colour. */
  [data-theme="dark"] .shell{box-shadow:0 0 0 1px rgba(255,255,255,.06),0 40px 100px #000d}
  [data-theme="dark"] :is(.card,.pill,.icon-btn,.search,.stat,.table-wrap,.list-item,.tabs,.empty,.specs,.cond div,.kanban .lead,.pagination a,.steps li,.smart-box,.mega,.search-results,.bubble:not(.mine),.lcard){box-shadow:inset 0 0 0 1px var(--line)}
  [data-theme="dark"] .lcard:hover{box-shadow:inset 0 0 0 1px var(--line-strong),0 18px 40px #0009}
  [data-theme="dark"] .lcard.highlight{box-shadow:inset 0 0 0 1px var(--accent)}
  [data-theme="dark"] .mega,[data-theme="dark"] .search-results{box-shadow:inset 0 0 0 1px var(--line),0 24px 60px #000b}
  [data-theme="dark"] .pill.is-active,[data-theme="dark"] .more[open]>summary{box-shadow:inset 0 0 0 1px #3a5fc0}
  [data-theme="dark"] .btn:not(.btn-accent):not(.btn-ghost):not(.btn-danger){box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
  [data-theme="dark"] .order{background:var(--accent);color:var(--on-accent)}
  [data-theme="dark"] .order:hover{background:var(--accent-dark);color:var(--on-accent)}
  [data-theme="dark"] .mark{box-shadow:0 8px 22px rgba(240,122,53,.35),inset 0 1px 0 #ffffff55}
  [data-theme="dark"] .foot{border-top:1px solid var(--line-2)}
  [data-theme="dark"] ::selection{background:rgba(38,69,147,.75);color:#fff}
}
