/* furnitura ro'yxati overlay */
#furn{position:fixed;top:60px;left:10px;right:10px;bottom:12px;background:#ffffffF7;backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:14px;z-index:8;display:none;flex-direction:column;overflow:hidden}
#furn .dh{display:flex;align-items:center;gap:10px;padding:11px 14px;border-bottom:1px solid var(--line);font-size:14px;font-weight:600}
#furn .dh #furnClose{margin-left:auto;background:none;border:1px solid var(--line);border-radius:9px;color:var(--txt);font-size:17px;cursor:pointer;width:34px;height:34px;display:flex;align-items:center;justify-content:center;flex:none}
#furnTot{padding:9px 14px;color:var(--mut);font-size:12.5px;border-bottom:1px solid var(--line)}
#furnList{flex:1;overflow-y:auto;padding:2px 0}
.fr{padding:11px 14px;font-size:14px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #e6eaef}
/* 📎 biriktirilgan fayllar paneli — furn bilan bir xil qolip */
#filesp{position:fixed;top:60px;left:10px;right:10px;bottom:12px;background:#ffffffF7;backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:14px;z-index:8;display:none;flex-direction:column;overflow:hidden}
#filesp .dh{display:flex;align-items:center;gap:10px;padding:11px 14px;border-bottom:1px solid var(--line);font-size:14px;font-weight:600}
#filesp .dh #filesClose{margin-left:auto;background:none;border:1px solid var(--line);border-radius:9px;color:var(--txt);font-size:17px;cursor:pointer;width:34px;height:34px;display:flex;align-items:center;justify-content:center;flex:none}
#filesList{flex:1;overflow-y:auto;padding:2px 0}
#filesList a.fr{color:var(--txt);text-decoration:none;cursor:pointer;align-items:center}
#filesList .fi{font-size:22px;flex:none}
#filesList .fnm{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
#filesList .fnm b{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#filesList .fnm i{font-style:normal;font-size:12px;color:var(--mut)}
#filesList .fgo{flex:none;font-size:16px;opacity:.8}
#filesList a.fr:active{background:#00000008}
#filesList .co{margin-left:auto;color:var(--mut);font-size:12.5px;flex:none}
.fr .dot{width:13px;height:13px;border-radius:50%;flex:none}
.fr .co{margin-left:auto;font-weight:700;font-variant-numeric:tabular-nums}
/* skaner overlay (kamera) */
#camwrap{position:fixed;inset:0;background:#000c;z-index:20;display:none;flex-direction:column;align-items:center;justify-content:center;padding:16px}
#reader{width:min(92vw,420px);border-radius:14px;overflow:hidden}
#camclose{margin-top:14px;background:var(--card);border:1px solid var(--line);color:var(--txt);padding:11px 22px;border-radius:10px;cursor:pointer;font-size:15px}
#camst{color:#fff;margin-top:10px;font-size:13px;text-align:center}
/* ===== BREND ZAGRUZKA OYNASI (splash) =====
   Ssilka orqali kirilganda foydalanuvchini AVVAL brend logosi kutib oladi: brendni
   tanitadi va model server'dan uzoq yuklansa ham nima bo'layotgani ko'rinib turadi
   (avval xira spinner bor edi — foydalanuvchi nima bo'layotganini bilmasdi).
   Logo iloji boricha KATTA: telefonda ekran enining ~56%, kompyuterda 320px gacha. */
#splash{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  background:var(--bg);transition:opacity .6s cubic-bezier(.4,0,.2,1);padding:24px}
#splash.hide{opacity:0;pointer-events:none}
#splash .sp-box{display:flex;flex-direction:column;align-items:center;gap:0;max-width:min(92vw,420px);width:100%;
  transition:transform .6s cubic-bezier(.3,0,.2,1),opacity .45s ease,filter .6s ease}
/* Yopilayotganda yuklash oynasi HIRALASHIB yo'qoladi: logo/yozuv xiralashadi (blur) va
   bir oz "ochilib" uzoqlashadi, fon esa shaffoflashib model orqasidan ochiladi.
   Blur faqat kichik .sp-box ga qo'yiladi (butun ekranga emas) — telefonda ham arzon. */
#splash.hide .sp-box{transform:scale(1.09);opacity:0;filter:blur(12px)}
#spLogo{width:100px;height:100px;background:linear-gradient(135deg, #FFC700, #E5A800);border-radius:24px;display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:56px;color:#07080a;box-shadow:0 12px 36px rgba(255,199,0,0.35);margin-bottom:6px}
@keyframes spPop{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:scale(1)}}
#spName{margin-top:18px;font-size:clamp(19px,4.6vw,26px);font-weight:800;letter-spacing:.2px;text-align:center;min-height:1.2em}
#spBar{margin-top:22px;width:min(72vw,300px);height:6px;border-radius:99px;background:var(--line);overflow:hidden}
/* MUHIM: animatsiya TRANSFORM bilan (margin-left EMAS). margin-left — layout xossasi,
   uni faqat asosiy oqim yuritadi; model qurilayotganda (buildScene ~10 s) oqim bloklanib,
   animatsiya QOTIB qolardi. transform/opacity esa KOMPOZITOR oqimida ishlaydi va JS band
   bo'lsa ham silliq davom etadi. */
#spFill{display:block;height:100%;width:34%;border-radius:99px;background:var(--acc);
  will-change:transform;animation:spSlide 1.25s ease-in-out infinite}
/* Aniq foiz rejimida ham KOMPOZITOR xossasi (transform: scaleX) ishlatiladi — `width`
   layout xossasi bo'lib, model qurilayotganda asosiy oqim band bo'lsa animatsiya QOTIB
   qolardi (yuqoridagi izohga qarang: aynan shu sabab spSlide ham translateX bilan). */
#spBar.det #spFill{animation:none;width:100%;transform:scaleX(.04);transform-origin:left center;
  transition:transform .25s ease;will-change:transform}
@keyframes spSlide{0%{transform:translateX(-110%)}100%{transform:translateX(300%)}}
/* logo "nafas olib" turadi — qotib qolgandek ko'rinmasin (bu ham transform) */
#spLogo{animation:spPop .5s cubic-bezier(.2,.9,.3,1.2) both, spBreathe 2.6s ease-in-out .5s infinite}
@keyframes spBreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
#spTxt{margin-top:12px;font-size:13.5px;color:var(--mut);text-align:center;min-height:1.2em}
body.shot #splash{display:none}                     /* server render — splash kerak emas */
/* Tizimda "animatsiyani kamaytirish" yoqilgan bo'lsa (vestibulyar sezgirlik, arzon qurilma):
   nafas olish, yugurish, xiralashish va kattalashish o'chadi — faqat qisqa so'nish qoladi.
   Kamera "yaqinlashishi" ham o'chadi (JS tomonda, splashHide ichida tekshiriladi). */
@media (prefers-reduced-motion: reduce){
  #spLogo{animation:none}
  #spFill{animation:none}
  #splash{transition-duration:.15s}
  #splash .sp-box{transition-duration:.15s}
  #splash.hide .sp-box{filter:none;transform:none}
}
/* yuklanish spinneri */
#loading{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:15;background:#f1f4f8cc}
#loading.on{display:flex}
.spin{width:46px;height:46px;border:4px solid var(--line);border-top-color:var(--acc);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
/* qo'lda kiritish */
#manwrap{position:fixed;inset:0;background:#00000066;z-index:20;display:none;align-items:center;justify-content:center;padding:20px}
#manbox{background:var(--card);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:14px;padding:18px;width:min(92vw,360px)}
#manbox h3{font-size:15px;margin-bottom:12px}
#manbox input{width:100%;background:#eef1f5;border:1px solid var(--line);color:var(--txt);border-radius:10px;padding:12px;font-size:17px;text-align:center}
#manbox .row{display:flex;gap:8px;margin-top:12px}
#manbox button{flex:1;border:none;border-radius:10px;padding:11px;font-weight:700;cursor:pointer;font-size:15px}
#manbox .ok{background:var(--acc);color:#1a1006}
#manbox .cancel{background:#eef1f5;color:var(--txt);border:1px solid var(--line)}
/* toast */
#toast{position:fixed;top:96px;left:50%;transform:translateX(-50%);background:#e2f5e9;color:#157a3d;font-size:13px;padding:7px 14px;border-radius:9px;z-index:25;display:none;border:1px solid #b9e6c9;box-shadow:0 4px 16px #0000001f;max-width:88%;text-align:center;line-height:1.4}
/* ONBOARDING: kirishda tugma nomlari (coach) + 10s idle qo'l imo-ishorasi */
#coach{position:fixed;inset:0;z-index:9;pointer-events:none}
.coachB{position:absolute;background:#1c2530f2;color:#fff;font-size:11px;font-weight:600;padding:3px 8px;border-radius:7px;white-space:nowrap;transform:translateX(-50%);opacity:0;transition:opacity .35s;box-shadow:0 2px 9px #0004}
.coachB::before{content:'';position:absolute;top:-4px;left:50%;transform:translateX(-50%);border:5px solid transparent;border-bottom-color:#1c2530f2;border-top:none}
.coachB.show{opacity:1}
/* BOSQICHMA-BOSQICH PODSKAZKA (2026-08-22, foydalanuvchi tanlovi).
   Avval bitta uzun gap edi va u KOMPYUTERDA ham "barmoq bilan suring" deb turardi.
   Endi 4 ta qadam navbat bilan 3 soniyadan ko'rsatiladi; o'rtadagi belgi harakatni
   JONLI qilib ko'rsatadi (sichqoncha yoki barmoq — qurilmaga qarab), kartochkada esa
   natija ikonkasi + qisqa matn va pastda 4 ta nuqta (nechanchi qadam ekani). */
#ghand{position:fixed;z-index:9;pointer-events:none;font-size:46px;left:50%;top:52%;opacity:0;transition:opacity .22s;filter:drop-shadow(0 4px 7px #0005);will-change:transform}
#ghand .rng{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border:3px solid #ffffffcc;border-radius:50%;opacity:0;transform:scale(.4)}
#gtext{position:fixed;z-index:9;pointer-events:none;left:50%;bottom:96px;transform:translateX(-50%);color:#1c2530;background:#fffffff0;padding:11px 18px 9px;border-radius:16px;font-size:14px;font-weight:600;opacity:0;transition:opacity .22s;backdrop-filter:blur(6px);box-shadow:0 6px 20px #00000024;text-align:center;max-width:min(92vw,380px);display:flex;flex-direction:column;align-items:center;gap:8px}
#gtext .grow{display:flex;align-items:center;justify-content:center;gap:9px}
#gtIco{font-size:19px;line-height:1;flex:none}
#gdots{display:flex;gap:5px;font-style:normal}
#gdots b{width:6px;height:6px;border-radius:50%;background:#ccd4de;transition:background .25s,width .25s}
#gdots b.on{background:var(--ok);width:17px;border-radius:3px}
@keyframes gdrag{0%{transform:translate(-72px,6px)}25%{transform:translate(0,-4px)}50%{transform:translate(72px,6px)}75%{transform:translate(0,-4px)}100%{transform:translate(-72px,6px)}}
@keyframes gring{0%,100%{opacity:0;transform:scale(.4)}40%{opacity:.9;transform:scale(1)}70%{opacity:0;transform:scale(1.15)}}
@keyframes gwheel{0%,100%{transform:translateY(13px)}50%{transform:translateY(-13px)}}
@keyframes gpinch{0%,100%{transform:scale(.78)}50%{transform:scale(1.2)}}
@keyframes gtap{0%,100%{transform:translateY(0) scale(1)}45%{transform:translateY(7px) scale(.9)}}
@keyframes gtap2{0%,100%{transform:translateY(0) scale(1)}14%{transform:translateY(7px) scale(.9)}28%{transform:translateY(0) scale(1)}42%{transform:translateY(7px) scale(.9)}56%{transform:translateY(0) scale(1)}}
#ghand.on{opacity:.96}
#ghand.on.gaDrag {animation:gdrag  2.6s ease-in-out infinite}
#ghand.on.gaWheel{animation:gwheel 1.7s ease-in-out infinite}
#ghand.on.gaPinch{animation:gpinch 1.9s ease-in-out infinite}
#ghand.on.gaTap  {animation:gtap   1.5s ease-in-out infinite}
#ghand.on.gaTap2 {animation:gtap2  2.2s ease-in-out infinite}
#ghand.on.gaDrag .rng{animation:gring 2.6s ease-in-out infinite}
#ghand.on.gaTap  .rng{animation:gring 1.5s ease-in-out infinite}
#ghand.on.gaTap2 .rng{animation:gring 2.2s ease-in-out infinite}
#ghand.on.gaTap2 .rng.r2{animation-delay:.3s}
#gtext.on{opacity:1}
#ghand.gfade,#gtext.gfade{opacity:0}
@media (prefers-reduced-motion: reduce){ #ghand.on{animation:none!important} #ghand .rng{animation:none!important} }
#toast.err{background:#fce4dd;color:#c0392b;border-color:#f3c2b6}
/* Pastdagi maslahat yozuvi ("Kamera tugmasini bosing...") — model ochiq turganda
   keraksiz shovqin edi, foydalanuvchi so'rovi bilan olib tashlandi (2026-08-22).
   Element o'zi qoldirildi: uni yashiradigan/yozadigan eski kod xatosiz ishlayveradi. */
#hint{display:none!important;position:fixed;bottom:14px;left:50%;transform:translateX(-50%);color:var(--mut);font-size:12px;z-index:4;background:var(--card);border-radius:8px;padding:5px 11px;text-align:center;max-width:92%}
/* lineyka — nuqta tanlashda aniqroq bosish uchun lupa (kattalashtiruvchi doira) */
#loupe{position:fixed;width:150px;height:150px;border-radius:50%;border:3px solid #fff;box-shadow:0 8px 24px #00000055;pointer-events:none;z-index:26;display:none;background:#0a0e13;overflow:hidden}
/* lineyka faol bo'lganda ko'rinadigan "to'xtatish" tugmasi — bosilgandagina o'lchovlar tozalanadi */
#rulerMode{position:fixed;top:66px;left:50%;transform:translateX(calc(-50% - 96px));z-index:10;background:#1f2733;color:#eaf2ff;border:1px solid #3a4a5e;border-radius:22px;padding:9px 14px;font-size:13px;font-weight:700;display:none;align-items:center;gap:7px;cursor:pointer;box-shadow:0 4px 16px #0006}
#rulerMode svg{width:16px;height:16px}
#rulerMode.out{background:#2a4a6e;border-color:#4a7ab0}
#rulerMode:active{transform:translateX(calc(-50% - 96px)) scale(.96)}
#rulerStop{position:fixed;top:66px;left:50%;transform:translateX(calc(-50% + 60px));z-index:10;background:#ff8a2a;color:#1a1006;border:none;border-radius:22px;padding:9px 18px;font-size:13px;font-weight:700;display:none;align-items:center;gap:7px;cursor:pointer;box-shadow:0 4px 16px #ff8a2a55}
#rulerFrame{position:fixed;top:66px;left:50%;transform:translateX(calc(-50% - 238px));z-index:10;background:#1f2733;color:#eaf2ff;border:1px solid #3a4a5e;border-radius:22px;padding:9px 14px;font-size:13px;font-weight:700;display:none;align-items:center;gap:7px;cursor:pointer;box-shadow:0 4px 16px #0006}
#rulerFrame svg{width:16px;height:16px}
#rulerFrame.on{background:#1f6e46;border-color:#3ec06a}
#rulerFrame:active{transform:translateX(calc(-50% - 238px)) scale(.96)}
@media(max-width:640px){
  #list{
    top:auto;
    bottom:calc(68px + env(safe-area-inset-bottom, 0px));
    left:8px;
    right:8px;
    width:auto;
    max-height:65vh;
    border-radius:16px;
    box-shadow:0 -10px 40px rgba(0,0,0,0.6);
  }
  #cabixPortal{
    padding:0 14px calc(env(safe-area-inset-bottom, 0px) + 80px);
  }
  .portal-nav{
    padding:12px 0;
    gap:8px;
  }
  .portal-brand{
    gap:8px;
  }
  .portal-brand-logo{
    width:32px;
    height:32px;
    font-size:17px;
    border-radius:9px;
  }
  .portal-brand-name{
    font-size:15px;
  }
  .portal-brand-sub{
    font-size:9.5px;
  }
  .portal-nav-actions{
    gap:6px;
  }
  .portal-nav-actions .portal-btn-ghost{
    padding:6px 10px;
    font-size:11.5px;
    border-radius:8px;
    white-space:nowrap;
  }
  .portal-hero{
    padding:20px 0 16px;
  }
  .portal-title{
    font-size:clamp(22px, 6.2vw, 38px);
    line-height:1.18;
  }
  .portal-desc{
    font-size:13.5px;
    max-width:90%;
    margin-bottom:20px;
  }
  .portal-action-box{
    padding:16px;
    border-radius:16px;
  }
  .portal-scan-btn{
    padding:13px 18px;
    font-size:15px;
    border-radius:12px;
    min-height:48px;
  }
  .portal-input-row{
    display:flex;
    gap:8px;
  }
  .portal-input{
    min-height:44px;
    padding:10px 14px;
    font-size:13px;
  }
  .portal-submit-btn{
    min-height:44px;
    padding:0 16px;
    font-size:13.5px;
    white-space:nowrap;
  }
  .portal-chips{
    gap:6px;
  }
  .portal-chip{
    padding:6px 12px;
    font-size:11.5px;
  }
  #rulerFrame{top:110px;transform:translateX(calc(-50% - 96px))}
  #rulerFrame:active{transform:translateX(calc(-50% - 96px)) scale(.96)}
}
#rulerStop svg{width:16px;height:16px}
#rulerStop:active{transform:translateX(calc(-50% + 60px)) scale(.96)}
/* yoyib ko'rsatish (exploded view) — slayder paneli */
#explodeBar{position:fixed;top:64px;left:10px;z-index:10;background:var(--card);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:12px;padding:8px 12px;display:none;align-items:center;gap:9px;box-shadow:0 4px 16px #0000001f}
#explodeBar svg{width:17px;height:17px;color:var(--ok);flex:none}
#explodeBar input[type=range]{width:130px;accent-color:var(--ok)}
/* z-index splash(60) dan YUQORI: 3D kutubxona yuklanmasa xato xabari brend ekrani
   ostida qolib ketmasin (avval 30 edi — foydalanuvchi 30 s hech nima ko'rmasdi). */
#err{position:fixed;inset:0;display:none;align-items:center;justify-content:center;color:#d23b3b;font-size:15px;z-index:70;text-align:center;padding:20px;background:var(--bg)}
/* skaner kutish ekrani (model tanlanmagan) */
/* old welcome replaced by cabix portal */
/* report (muammo) oynasi */
#repwrap{position:fixed;inset:0;background:#00000066;z-index:21;display:none;align-items:center;justify-content:center;padding:20px}
#repbox{background:var(--card);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:14px;padding:18px;width:min(94vw,400px)}
#repbox h3{font-size:16px;margin-bottom:6px}
#repbox .rsub{color:var(--mut);font-size:12.5px;margin-bottom:12px}
#repbox textarea{width:100%;height:90px;background:#eef1f5;border:1px solid var(--line);color:var(--txt);border-radius:10px;padding:11px;font-size:15px;resize:vertical;font-family:inherit}
#repbox input{width:100%;margin-top:8px;background:#eef1f5;border:1px solid var(--line);color:var(--txt);border-radius:10px;padding:11px;font-size:15px}
#repbox .rwhy{color:var(--mut);font-size:11.5px;line-height:1.45;margin:6px 2px 2px}
#repbox input.bad{border-color:#e5484d;background:#fff1f1}
#repbox .row{display:flex;gap:8px;margin-top:12px}
#repbox button{flex:1;border:none;border-radius:10px;padding:11px;font-weight:700;cursor:pointer;font-size:15px}
#repbox .ok{background:var(--acc);color:#1a1006}
#repbox .cancel{background:#eef1f5;color:var(--txt);border:1px solid var(--line)}