:root{
  --bg:#0f1115; --panel:#171a21; --panel-2:#1e222b; --line:#2a2f3a;
  --text:#e8eaef; --muted:#98a0b0;
  --accent:#ff793f; --ok:#00c774; --warn:#ffb020; --danger:#ff4d5e; --info:#00c9fb;
}
@media (prefers-color-scheme: light){
  :root{ --bg:#f4f6fa; --panel:#fff; --panel-2:#f7f9fc; --line:#e3e8ef;
         --text:#1a1d24; --muted:#69707e; }
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:Vazirmatn,"IRANSans","IRANYekan",Tahoma,system-ui,sans-serif;
  font-size:14px; line-height:1.8;
}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:22px 16px 60px}

/* ---------- ناوبری ---------- */
.nav{background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.nav-inner{max-width:1180px;margin:0 auto;padding:0 16px;display:flex;align-items:center;gap:18px;height:58px;flex-wrap:wrap}
.brand{font-weight:700;color:var(--accent);margin-left:10px;white-space:nowrap}
.brand b{color:var(--text)}
.nav a{color:var(--muted);padding:6px 2px;border-bottom:2px solid transparent;white-space:nowrap}
.nav a:hover{color:var(--text)}
.nav a.on{color:var(--text);border-color:var(--accent)}
.grow{flex:1}
.link-btn{background:none;border:none;color:var(--muted);cursor:pointer;font:inherit;padding:0}
.link-btn:hover{color:var(--danger)}

/* ---------- عمومی ---------- */
h1{font-size:19px;margin:0 0 4px}
h2{font-size:16px;margin:26px 0 12px}
.sub{color:var(--muted);margin:0 0 20px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:14px}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.alert{padding:11px 14px;border-radius:10px;margin-bottom:14px;border:1px solid}
.alert.ok{background:rgba(0,199,116,.1);border-color:rgba(0,199,116,.35)}
.alert.err{background:rgba(255,77,94,.1);border-color:rgba(255,77,94,.35)}

/* ---------- فرم ---------- */
label{display:block;font-size:12px;color:var(--muted);margin-bottom:5px}
input,select{
  background:var(--panel-2);border:1px solid var(--line);color:var(--text);
  border-radius:9px;padding:9px 11px;font:inherit;width:100%;
}
input:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}
input[type=checkbox]{width:auto}
.field{min-width:150px;flex:1}
.hint{font-size:11px;color:var(--muted);margin-top:4px}
button.btn,a.btn{
  background:var(--accent);color:#fff;border:none;border-radius:9px;
  padding:9px 16px;font:inherit;cursor:pointer;display:inline-block;white-space:nowrap
}
button.btn:hover,a.btn:hover{filter:brightness(1.1)}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--text)}
.btn.danger{background:var(--danger)}
.btn.sm{padding:5px 11px;font-size:12px}

/* ---------- جدول ---------- */
table{width:100%;border-collapse:collapse}
th,td{padding:10px;text-align:right;border-bottom:1px solid var(--line);vertical-align:middle}
th{color:var(--muted);font-weight:500;font-size:12px}
tbody tr:hover{background:var(--panel-2)}
.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.scroll{overflow-x:auto}

/* ---------- برچسب وضعیت ---------- */
.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:11.5px;white-space:nowrap}
.pill-live{background:rgba(255,77,94,.15);color:var(--danger);border:1px solid rgba(255,77,94,.4)}
.pill-dry{background:rgba(255,176,32,.15);color:var(--warn);border:1px solid rgba(255,176,32,.4)}
.st-leading{background:rgba(0,199,116,.15);color:var(--ok)}
.st-won{background:var(--ok);color:#062}
.st-outbid{background:rgba(255,176,32,.15);color:var(--warn)}
.st-cap_reached{background:rgba(255,121,63,.15);color:var(--accent)}
.st-lost,.st-error{background:rgba(255,77,94,.15);color:var(--danger)}
.st-idle{background:var(--panel-2);color:var(--muted)}

.muted{color:var(--muted)}
.small{font-size:12px}
.car{display:flex;align-items:center;gap:10px}
.car img{width:56px;height:42px;object-fit:cover;border-radius:7px;background:var(--panel-2);flex:none}
.warnbox{background:rgba(255,176,32,.08);border:1px solid rgba(255,176,32,.35);border-radius:12px;padding:14px;margin-bottom:16px}
details summary{cursor:pointer;color:var(--muted);font-size:12px}
.center{max-width:380px;margin:12vh auto}

/* ---------- راهنمای بازشو ---------- */
.helpbox summary{color:var(--accent)}
.helpbox table th,.helpbox table td{padding:7px 8px;font-size:12.5px}
.helpbox .warnbox{font-size:12.5px;line-height:1.9}
.alert.warn{background:rgba(255,176,32,.1);border-color:rgba(255,176,32,.4)}

/* ---------- صفحه‌بندی ---------- */
.pager{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;margin-top:18px
}
.pager-summary{color:var(--muted);font-size:12.5px}
.pager-summary b{color:var(--text);font-variant-numeric:tabular-nums}
.pager-links{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.pager-item{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:36px;height:36px;padding:0 11px;
  border:1px solid var(--line);border-radius:9px;
  background:var(--panel);color:var(--text);
  font-size:13px;font-variant-numeric:tabular-nums;
  transition:background .12s,border-color .12s
}
a.pager-item:hover{border-color:var(--accent);color:var(--accent)}
.pager-item.is-current{
  background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700
}
.pager-item.is-disabled{opacity:.4;cursor:default}
.pager-gap{color:var(--muted);padding:0 4px}

@media (max-width:600px){
  .pager{justify-content:center}
  .pager-summary{width:100%;text-align:center}
}

/* ---------- گالری عکس ---------- */
.gallery-overlay{
  position:fixed;inset:0;z-index:100;display:none;
  background:rgba(6,8,12,.88);backdrop-filter:blur(3px);
  align-items:center;justify-content:center;padding:18px
}
.gallery-overlay.is-open{display:flex}
.gallery-box{
  background:var(--panel);border:1px solid var(--line);border-radius:14px;
  width:min(1000px,100%);max-height:100%;display:flex;flex-direction:column;overflow:hidden
}
.gallery-head{
  display:flex;align-items:center;gap:12px;padding:12px 16px;
  border-bottom:1px solid var(--line)
}
.gallery-title{font-weight:700}
.gallery-counter{color:var(--muted);font-size:12.5px;font-variant-numeric:tabular-nums;margin-inline-start:auto}
.gallery-close{
  background:transparent;border:1px solid var(--line);color:var(--text);
  border-radius:8px;padding:5px 11px;font:inherit;font-size:12.5px;cursor:pointer
}
.gallery-close:hover{border-color:var(--danger);color:var(--danger)}

.gallery-stage{
  position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;
  background:#0b0d11;padding:8px
}
.gallery-stage img{max-width:100%;max-height:min(62vh,560px);object-fit:contain;border-radius:8px}
.gallery-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:42px;height:42px;border-radius:999px;border:1px solid rgba(255,255,255,.25);
  background:rgba(10,10,10,.55);color:#fff;font-size:26px;line-height:1;cursor:pointer
}
.gallery-nav:hover{background:var(--accent);border-color:var(--accent)}
.gallery-prev{right:12px}
.gallery-next{left:12px}

.gallery-caption{padding:10px 16px;color:var(--text);font-size:13px;min-height:38px}
.gallery-thumbs{
  display:flex;gap:7px;overflow-x:auto;padding:10px 16px 14px;border-top:1px solid var(--line)
}
/* جای هر بندانگشتی از اول رزرو می‌شود تا چیدمان موقع بارگذاری نپرد */
.gallery-thumb{
  width:74px;height:56px;border-radius:7px;flex:none;cursor:pointer;overflow:hidden;
  border:2px solid transparent;background:var(--panel-2);
  transition:opacity .15s,border-color .12s
}
.gallery-thumb img{
  width:100%;height:100%;object-fit:cover;display:block;
  opacity:.65;transition:opacity .15s
}
.gallery-thumb:hover img{opacity:1}
.gallery-thumb.is-active{border-color:var(--accent)}
.gallery-thumb.is-active img{opacity:1}

/* تا وقتی نوبت نمایشش نرسیده، اسکلت متحرک نشان داده می‌شود */
.gallery-thumb.is-loading{
  background:linear-gradient(100deg,var(--panel-2) 30%,var(--line) 50%,var(--panel-2) 70%);
  background-size:220% 100%;animation:thumb-shimmer 1.1s linear infinite;
  cursor:default
}
.gallery-thumb.is-loading img{visibility:hidden}
@keyframes thumb-shimmer{from{background-position:220% 0}to{background-position:-20% 0}}

/* اسپینر عکس بزرگ */
.gallery-spinner{
  width:38px;height:38px;border-radius:999px;
  border:3px solid rgba(255,255,255,.18);border-top-color:var(--accent);
  animation:gallery-spin .8s linear infinite
}
@keyframes gallery-spin{to{transform:rotate(360deg)}}

.gallery-progress{
  padding:0 16px 8px;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums
}

.btn-gallery{
  background:transparent;border:1px solid var(--line);color:var(--muted);
  border-radius:8px;padding:4px 10px;font:inherit;font-size:12px;cursor:pointer;white-space:nowrap
}
.btn-gallery:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}
.btn-gallery:disabled{opacity:.6;cursor:wait}
.car img{cursor:zoom-in}

@media (max-width:600px){
  .gallery-stage img{max-height:46vh}
  .gallery-nav{width:36px;height:36px;font-size:22px}
}

/* ---------- گزارش کارشناسی ---------- */
.inspect-box{max-height:92vh}
.inspect-body{padding:16px;overflow-y:auto}
.inspect-h{font-size:14px;margin:20px 0 10px;color:var(--muted);font-weight:500}
.inspect-h:first-child{margin-top:0}

.rate-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.rate-card{background:var(--panel-2);border:1px solid var(--line);border-radius:10px;padding:11px}
.rate-top{display:flex;justify-content:space-between;align-items:baseline;font-size:13px}
.rate-top b{font-size:15px;color:var(--accent);font-variant-numeric:tabular-nums}
.rate-bar{height:5px;background:var(--line);border-radius:999px;margin:8px 0 6px;overflow:hidden}
.rate-bar span{display:block;height:100%;background:var(--ok);border-radius:999px}
.rate-note{font-size:11.5px;color:var(--muted)}

.spec-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:7px}
.spec{
  display:flex;justify-content:space-between;gap:10px;
  background:var(--panel-2);border:1px solid var(--line);
  border-radius:9px;padding:8px 11px;font-size:12.5px
}
.spec-label{color:var(--muted);white-space:nowrap}
.spec-value{text-align:left}
.spec.is-warn{border-color:rgba(255,77,94,.45);background:rgba(255,77,94,.08)}
.spec.is-warn .spec-value{color:var(--danger);font-weight:700}

.defect-section{margin-bottom:14px}
.defect-section-name{
  font-size:12.5px;color:var(--accent);margin-bottom:7px;
  padding-bottom:5px;border-bottom:1px solid var(--line)
}
.defect{
  display:flex;align-items:flex-start;gap:10px;
  padding:9px 0;border-bottom:1px solid var(--line)
}
.defect:last-child{border-bottom:none}
.defect-dot{width:11px;height:11px;border-radius:999px;flex:none;margin-top:5px}
.defect-text{flex:1;min-width:0;font-size:12.5px;line-height:1.9}
.defect-images{display:flex;gap:5px;flex:none}
.defect-images img{
  width:58px;height:44px;object-fit:cover;border-radius:6px;
  border:1px solid var(--line);cursor:zoom-in
}

.btn-inspect{
  background:transparent;border:1px solid var(--line);color:var(--muted);
  border-radius:8px;padding:4px 10px;font:inherit;font-size:12px;cursor:pointer;white-space:nowrap
}
.btn-inspect:hover:not(:disabled){border-color:var(--info);color:var(--info)}
.btn-inspect:disabled{opacity:.6;cursor:wait}

@media (max-width:600px){
  .defect{flex-wrap:wrap}
  .defect-images{width:100%}
}