/* ==========================================================================
   QIDIR.UZ — dizayn tizimi (v5, ixcham)
   Kunduzi: oq + ko'k (tugmalar faqat ko'k). Tunda: qora + to'q sariq.
   Logo har doim to'q sariq.
   ========================================================================== */
:root{
  --bg:#F5F7FB;--bg2:#EEF2F9;--surface:#FFFFFF;--surface2:#F1F4F9;--line:#E3E8F0;
  --text:#14243A;--muted:#5F6F86;--faint:#97A4B6;
  --primary:#2F7BF5;--primary-2:#1D64DA;--primary-soft:rgba(47,123,245,.10);
  --accent:#2F7BF5;--accent-2:#1D64DA;--accent-soft:rgba(47,123,245,.10);
  --orange:#F06A28;--orange-soft:rgba(240,106,40,.12);
  --ok:#12925F;--ok-soft:rgba(18,146,95,.11);--warn:#E59A0B;--danger:#DC3F45;--danger-soft:rgba(220,63,69,.1);
  --shadow:0 6px 20px -10px rgba(16,36,72,.18);--shadow-lg:0 22px 50px -20px rgba(16,36,72,.3);
  --backdrop:rgba(14,26,43,.18);--glass:rgba(255,255,255,.82);--r:14px;
  --grad:linear-gradient(135deg,#2F7BF5 0%,#5B9BFF 100%);
  --btn:var(--primary);--btn-2:var(--primary-2);--btn-soft:var(--primary-soft);
  --ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.3,1.4,.5,1);
  --hdr:58px;--bnav:0px;
}
[data-theme="dark"]{
  --bg:#09090B;--bg2:#0E0E12;--surface:#141418;--surface2:#1B1B21;--line:#27272F;
  --text:#F3F3F5;--muted:#A3A3AF;--faint:#6D6D79;
  --primary:#FF7A1A;--primary-2:#FF8F3D;--primary-soft:rgba(255,122,26,.14);
  --accent:#FF7A1A;--accent-2:#FF8F3D;--accent-soft:rgba(255,122,26,.14);
  --ok:#3FCB8E;--ok-soft:rgba(63,203,142,.12);--danger:#FF6B70;--danger-soft:rgba(255,107,112,.12);
  --shadow:0 6px 20px -10px rgba(0,0,0,.7);--shadow-lg:0 24px 54px -20px rgba(0,0,0,.85);
  --backdrop:rgba(0,0,0,.4);--glass:rgba(20,20,24,.82);
  --grad:linear-gradient(135deg,#FF7A1A 0%,#FFA24D 100%);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr) + 12px)}
body{font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:14.5px;background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased;transition:background .35s,color .35s;overflow-x:hidden;padding-bottom:var(--bnav)}
body.lock{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
img{max-width:100%;display:block}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px}
::selection{background:var(--btn-soft)}
:focus-visible{outline:2px solid var(--btn);outline-offset:2px}
.hide{display:none!important}

/* ---------- logo (eski logo: to'q sariq qiyshaygan belgi + qidir.uz) ---------- */
.brand{display:inline-flex;align-items:center;font-weight:800;font-size:22px;letter-spacing:-1.1px;white-space:nowrap;color:var(--text);flex-shrink:0;line-height:1}
.brand-mark{display:grid;place-items:center;width:31px;height:35px;border-radius:10px;background:#F06A28;color:#fff;margin-right:7px;transform:rotate(-7deg);transition:transform .4s var(--ease);box-shadow:0 6px 14px -6px rgba(240,106,40,.7)}
.brand:hover .brand-mark{transform:rotate(0) scale(1.06)}
.brand-mark svg{width:19px;height:19px;transform:rotate(7deg)}
.brand-dot{color:#F06A28}
.brand small{font-size:10.5px;letter-spacing:.6px;color:var(--muted);font-weight:800;margin-left:7px}

/* ---------- tugmalar ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:8px 14px;min-height:36px;border-radius:10px;border:1px solid transparent;font-weight:700;font-size:13.5px;cursor:pointer;transition:transform .15s,box-shadow .2s,background .2s,border-color .2s,color .2s,opacity .2s;white-space:nowrap;user-select:none;-webkit-tap-highlight-color:transparent;line-height:1.2}
.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primary,.btn-accent{background:var(--btn);color:#fff;box-shadow:0 6px 14px -8px var(--btn)}
.btn-primary:hover,.btn-accent:hover{background:var(--btn-2)}
.btn-ghost{background:var(--surface);border-color:var(--line)}.btn-ghost:hover{border-color:var(--btn);color:var(--btn)}
.btn-soft{background:var(--btn-soft);color:var(--btn)}.btn-soft:hover{background:var(--btn);color:#fff}
.btn-danger{background:var(--danger-soft);color:var(--danger)}.btn-danger:hover{background:var(--danger);color:#fff}
.btn-ok{background:var(--ok-soft);color:var(--ok)}
.btn-tg{background:#229ED9;color:#fff;box-shadow:0 6px 14px -8px #229ED9}.btn-tg:hover{background:#1B8BC2}
.btn-sm{padding:6px 10px;min-height:30px;font-size:12.5px;border-radius:8px;gap:6px}
.btn-lg{padding:10px 18px;min-height:42px;font-size:14.5px;border-radius:12px}
.btn-icon{width:36px;height:36px;min-height:0;padding:0;border-radius:10px;position:relative;flex-shrink:0}
.btn-icon.btn-sm{width:30px;height:30px}
.btn-block{width:100%}
.spin{width:16px;height:16px;border-radius:50%;border:2.2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:rot .8s linear infinite;flex-shrink:0;display:inline-block}
.spin.dk{border-color:var(--line);border-top-color:var(--btn);width:22px;height:22px;border-width:3px}
@keyframes rot{to{transform:rotate(360deg)}}
.dotc{position:absolute;top:-4px;right:-4px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--danger);color:#fff;font-size:10px;font-weight:800;display:none;place-items:center;border:2px solid var(--surface)}
.dotc.on{display:grid;animation:pop .4s var(--spring)}

/* ---------- header ---------- */
.header{position:sticky;top:0;z-index:900;background:var(--glass);backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);border-bottom:1px solid var(--line)}
.header .container{display:flex;align-items:center;gap:10px;height:var(--hdr)}
.nav{display:flex;gap:2px;margin-left:12px}
.nav a{padding:7px 11px;border-radius:9px;font-weight:700;font-size:13.5px;color:var(--muted);transition:.2s;display:flex;align-items:center;gap:7px}
.nav a i{font-size:13px}
.nav a:hover,.nav a.on{color:var(--text);background:var(--surface2)}
.hdr-r{margin-left:auto;display:flex;align-items:center;gap:6px}
.theme-toggle{overflow:hidden}
.theme-toggle i{transition:transform .5s var(--spring),opacity .3s;position:absolute}
[data-theme="light"] .theme-toggle .fa-sun{transform:translateY(34px);opacity:0}
[data-theme="dark"] .theme-toggle .fa-moon{transform:translateY(-34px);opacity:0}
[data-theme="dark"] .theme-toggle .fa-sun{color:var(--accent)}
.user-chip{display:flex;align-items:center;gap:8px;padding:3px 10px 3px 3px;border-radius:40px;border:1px solid var(--line);background:var(--surface);cursor:pointer;position:relative;transition:.2s}
.user-chip:hover{border-color:var(--btn)}
.user-chip .nm{font-weight:700;font-size:13px;max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu-btn{display:none}
.dropdown{position:absolute;right:0;top:calc(100% + 8px);min-width:240px;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lg);padding:6px;opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top right;pointer-events:none;transition:.2s var(--ease);z-index:950;cursor:default;max-height:75vh;overflow:auto}
.dropdown.open{opacity:1;transform:none;pointer-events:auto}
.dropdown button,.dropdown a{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border-radius:9px;border:0;background:none;font-weight:600;font-size:13.5px;cursor:pointer;text-align:left}
.dropdown button:hover,.dropdown a:hover{background:var(--surface2)}
.dropdown i{width:16px;color:var(--muted)}
.dropdown hr{border:0;border-top:1px solid var(--line);margin:5px 0}
.nt-box{width:350px;max-width:calc(100vw - 20px);padding:0}
.nt-box .hd{padding:12px 14px;border-bottom:1px solid var(--line);font-weight:800;display:flex;justify-content:space-between;position:sticky;top:0;background:var(--surface);z-index:2}
.nt{display:flex;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);cursor:pointer;transition:.15s}
.nt:hover{background:var(--surface2)}.nt.new{background:var(--btn-soft)}
.nt .ic{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--btn-soft);color:var(--btn);flex-shrink:0;font-size:13px}
.nt p{font-size:13px;font-weight:600;line-height:1.35}.nt small{font-size:11.5px;color:var(--faint)}
.announce{background:var(--btn);color:#fff;text-align:center;font-size:13px;font-weight:600;padding:7px 16px}

/* raqam tasdiqlanmagan — ogohlantirish */
.vbar{background:linear-gradient(90deg,rgba(34,158,217,.12),var(--btn-soft));border-bottom:1px solid var(--line)}
.vbar .container{display:flex;align-items:center;gap:10px;padding-top:8px;padding-bottom:8px;font-size:13px;font-weight:600}
.vbar i.fa-telegram{color:#229ED9;font-size:18px}
.vbar span{flex:1;min-width:0}
.vbar .btn{flex-shrink:0}

/* ---------- avatar ---------- */
.av{border-radius:50%;overflow:hidden;flex-shrink:0;display:grid;place-items:center;font-weight:800;color:#fff;background:var(--grad);position:relative;width:40px;height:40px;font-size:14px}
.av img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;background:var(--surface2)}
.av .on-dot{position:absolute;right:1px;bottom:1px;width:10px;height:10px;border-radius:50%;background:var(--ok);border:2px solid var(--surface);z-index:2}

/* ---------- hero ---------- */
.hero{position:relative;padding:28px 0 14px;overflow:hidden}
.hero::before{content:"";position:absolute;right:-160px;top:-220px;width:520px;height:520px;background:radial-gradient(circle,var(--btn-soft),transparent 65%);pointer-events:none;animation:float 14s ease-in-out infinite}
@keyframes float{0%,100%{transform:translate(0,0)}50%{transform:translate(-26px,20px)}}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.55fr);gap:28px;align-items:center}
.hero-grid>*{min-width:0}
.pill{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:40px;background:var(--surface);border:1px solid var(--line);font-size:12.5px;font-weight:700;color:var(--muted)}
.pill .dot{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px var(--ok-soft);animation:pulse 2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 6px rgba(18,146,95,0)}}
.hero h1{font-size:clamp(24px,3.3vw,38px);line-height:1.12;letter-spacing:-1.2px;font-weight:800;margin:12px 0 8px}
.hero h1 .g{color:var(--btn)}
.hero p.lead{font-size:15px;color:var(--muted);max-width:560px}
.hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.stat-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;box-shadow:var(--shadow);transition:transform .3s var(--ease);display:flex;align-items:center;gap:10px;min-width:0}
.stat-card:hover{transform:translateY(-3px)}
.stat-card .ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--btn-soft);color:var(--btn);flex-shrink:0;font-size:14px}
.stat-card b{display:block;font-size:19px;font-weight:800;letter-spacing:-.4px;line-height:1.1}
.stat-card span{font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap}
.search-box{margin-top:16px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:6px;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:6px;transition:border-color .25s,box-shadow .25s}
.search-box:focus-within{border-color:var(--btn);box-shadow:0 0 0 4px var(--btn-soft),var(--shadow-lg)}
.ai-badge{display:flex;align-items:center;gap:6px;padding:7px 10px;border-radius:10px;background:var(--btn-soft);color:var(--btn);font-weight:800;font-size:12.5px;flex-shrink:0}
.search-box input{flex:1;border:0;outline:0;background:transparent;font-size:14.5px;padding:8px 4px;min-width:0}
.search-box .wc{font-size:11.5px;font-weight:700;color:var(--faint);flex-shrink:0}
.search-box .wc.over{color:var(--danger)}
.ai-meta{display:flex;align-items:center;gap:7px;margin-top:8px;font-size:12.5px;color:var(--muted);font-weight:600;flex-wrap:wrap}
.ai-meta a{color:var(--btn)}
.suggest{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.suggest button{border:1px solid var(--line);background:var(--surface);padding:5px 10px;border-radius:30px;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;transition:.2s;white-space:nowrap}
.suggest button:hover{border-color:var(--btn);color:var(--btn)}
.suggest i{margin-right:5px;color:var(--btn)}

/* ---------- bo'limlar ---------- */
.sec{padding:30px 0}
.sec-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.sec-head h2{font-size:clamp(19px,2.1vw,23px);letter-spacing:-.6px;font-weight:800;display:flex;align-items:center;gap:10px}
.sec-head h2 .hi{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--btn-soft);color:var(--btn);font-size:14px;flex-shrink:0}
.sec-head p{color:var(--muted);font-size:13.5px;margin-top:2px}
.sec-tools{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ---------- xarita ---------- */
.map-wrap{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-lg);background:var(--surface2)}
#map{height:min(64vh,580px);min-height:400px;width:100%;z-index:1}
.map-top{position:absolute;top:10px;left:10px;right:10px;z-index:500;display:flex;gap:8px;pointer-events:none}
.map-top>*{pointer-events:auto}
.chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px;flex:1}
.chips::-webkit-scrollbar{display:none}
.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:40px;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);font-weight:700;font-size:12.5px;cursor:pointer;white-space:nowrap;transition:.2s;box-shadow:var(--shadow)}
.chip:hover{border-color:var(--btn)}
.chip.active{background:var(--btn);color:#fff;border-color:var(--btn)}
.map-tools{position:absolute;right:10px;bottom:96px;z-index:500;display:flex;flex-direction:column;gap:6px}
.map-tools .btn{background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);box-shadow:var(--shadow)}
.map-tools .btn:hover{color:var(--btn);border-color:var(--btn)}
.map-hint{position:absolute;left:50%;bottom:14px;transform:translateX(-50%) translateY(16px);z-index:500;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:30px;padding:7px 14px;font-size:12.5px;font-weight:700;box-shadow:var(--shadow);display:flex;align-items:center;gap:8px;white-space:nowrap;max-width:calc(100% - 120px);opacity:0;pointer-events:none;transition:.35s var(--ease)}
.map-hint.on{opacity:1;transform:translateX(-50%)}
.map-hint i{color:var(--btn)}.map-hint span{overflow:hidden;text-overflow:ellipsis}
.map-legend{position:absolute;left:10px;bottom:14px;z-index:500;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:12px;padding:8px 11px;font-size:11.5px;font-weight:600;display:flex;flex-direction:column;gap:4px;box-shadow:var(--shadow)}
.map-legend span{display:flex;align-items:center;gap:6px;color:var(--muted)}
.map-legend i.r{width:11px;height:11px;border-radius:50%;border:3px solid;display:inline-block}
.leaflet-div-icon{background:none;border:0}
.leaflet-tile-pane{transition:filter .4s}
[data-theme="dark"] .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.82) contrast(.92) saturate(.6)}
.leaflet-container{font-family:inherit;background:var(--surface2)}
.leaflet-control-zoom{border:0!important;box-shadow:var(--shadow)!important;border-radius:10px!important;overflow:hidden}
.leaflet-control-zoom a{background:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important;width:34px!important;height:34px!important;line-height:34px!important}
.leaflet-control-attribution{background:var(--glass)!important;color:var(--muted)!important;font-size:9.5px}
.leaflet-tooltip.qd-tip{background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:6px 10px;font-family:inherit;font-weight:700;font-size:12.5px}
.leaflet-tooltip.qd-tip::before{display:none}
.leaflet-tooltip.qd-tip small{display:block;color:var(--muted);font-weight:500}
/* rasmli nuqta */
.pt{width:34px;height:34px;border-radius:50%;border:2.5px solid #fff;background:var(--grad);box-shadow:0 4px 10px -2px rgba(0,0,0,.45);display:grid;place-items:center;color:#fff;font-weight:800;font-size:12px;position:relative;transition:transform .25s var(--spring);animation:ptIn .45s var(--spring) both;cursor:pointer}
.pt img{width:100%;height:100%;border-radius:50%;object-fit:cover;position:absolute;inset:0;background:#fff}
.pt:hover{transform:scale(1.22);z-index:5}
.z-hi .pt{width:44px;height:44px;font-size:14px}
.pt.std{border-color:#2F7BF5}
.pt.pro{border-color:#F06A28;box-shadow:0 0 0 3px rgba(240,106,40,.35),0 4px 10px -2px rgba(0,0,0,.45)}
.pt .st{position:absolute;bottom:-1px;right:-1px;width:10px;height:10px;border-radius:50%;border:2px solid #fff;z-index:2}
.st.free{background:#12925F}.st.busy{background:#DC3F45}.st.looking{background:#E59A0B}
.pt .vb{position:absolute;top:-4px;right:-4px;width:15px;height:15px;border-radius:50%;background:#2F7BF5;color:#fff;font-size:7.5px;display:grid;place-items:center;border:2px solid #fff;z-index:2}
.pt .rank{position:absolute;top:-8px;left:-8px;width:19px;height:19px;border-radius:50%;background:#F06A28;color:#fff;font-size:10px;display:grid;place-items:center;border:2px solid #fff;font-weight:800;z-index:2}
.pt.me{border-color:#12925F;box-shadow:0 0 0 4px rgba(18,146,95,.3)}
.pt.dim{opacity:.25;filter:grayscale(1)}
.pt.ai{animation:ptIn .45s both,aiGlow 1.6s ease-in-out infinite}
@keyframes aiGlow{50%{box-shadow:0 0 0 8px rgba(47,123,245,.25),0 4px 10px -2px rgba(0,0,0,.45)}}
@keyframes ptIn{from{transform:scale(0);opacity:0}}
.lp{width:32px;height:32px;border-radius:10px;color:#fff;display:grid;place-items:center;font-size:13px;border:2.5px solid #fff;box-shadow:0 5px 12px -3px rgba(0,0,0,.45);transform:rotate(-6deg);transition:.25s var(--spring);cursor:pointer;position:relative;animation:ptIn .45s var(--spring) both}
.lp:hover{transform:rotate(0) scale(1.15)}
.lp.ev{background:#F06A28}.lp.ev.live{background:#DC3F45;animation:ptIn .45s both,evLive 1.6s infinite}
.lp.ord{background:#8B5CF6}.lp.ord.free{background:#12925F}
.lp small{position:absolute;bottom:-8px;left:50%;transform:translateX(-50%) rotate(6deg);background:#fff;color:#111;font-size:8.5px;font-weight:800;padding:1px 5px;border-radius:6px;white-space:nowrap}
@keyframes evLive{50%{box-shadow:0 0 0 7px rgba(220,63,69,.25),0 5px 12px -3px rgba(0,0,0,.45)}}
.me-dot{width:18px;height:18px;border-radius:50%;background:#2F7BF5;border:3px solid #fff;animation:meP 2s infinite}
@keyframes meP{0%{box-shadow:0 0 0 0 rgba(47,123,245,.6)}70%{box-shadow:0 0 0 16px rgba(47,123,245,0)}100%{box-shadow:0 0 0 0 rgba(47,123,245,0)}}
.ai-panel{position:absolute;top:54px;right:10px;bottom:14px;width:340px;max-width:calc(100% - 20px);z-index:550;background:var(--glass);backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;transform:translateX(calc(100% + 24px));transition:transform .45s var(--ease)}
.ai-panel.open{transform:none}
.ai-panel .hd{padding:12px 12px 10px;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:flex-start}
.ai-panel .hd .ic{width:32px;height:32px;border-radius:9px;background:var(--btn);color:#fff;display:grid;place-items:center;flex-shrink:0;font-size:13px}
.ai-panel .hd b{display:block;font-size:14px}
.ai-panel .hd small{color:var(--muted);font-size:12px;display:block;line-height:1.4}
.ai-panel .bd{overflow:auto;padding:8px;flex:1}
.ai-item{display:flex;gap:10px;padding:9px;border-radius:12px;cursor:pointer;transition:.2s;border:1px solid transparent;animation:fadeUp .45s both}
.ai-item:hover{background:var(--surface);border-color:var(--line)}
.ai-item .t{flex:1;min-width:0}.ai-item .t b{font-size:13.5px}.ai-item .t small{display:block;font-size:12px;color:var(--muted)}
.ai-item .why{font-size:12px;margin-top:4px;opacity:.85;line-height:1.4}
.score{font-size:11.5px;font-weight:800;color:var(--btn);background:var(--btn-soft);padding:2px 7px;border-radius:20px;height:fit-content;flex-shrink:0}
.thinking{display:flex;flex-direction:column;align-items:center;gap:12px;padding:34px 10px;color:var(--muted);text-align:center;font-weight:600;font-size:13.5px}
.dots{display:flex;gap:5px}.dots i{width:8px;height:8px;border-radius:50%;background:var(--btn);animation:bounce 1s infinite}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes bounce{50%{transform:translateY(-7px);opacity:.5}}

/* ---------- forma ---------- */
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.field{position:relative}
.field>i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--faint);font-size:13px;pointer-events:none}
.input,.select,.textarea{width:100%;padding:9px 12px;border-radius:10px;border:1px solid var(--line);background:var(--surface);outline:0;transition:border-color .2s,box-shadow .2s;font-size:14px;min-height:38px}
.field>i~.input,.field>i~.select{padding-left:34px}
.input:focus,.select:focus,.textarea:focus{border-color:var(--btn);box-shadow:0 0 0 3px var(--btn-soft)}
.input.bad{border-color:var(--danger);box-shadow:0 0 0 3px var(--danger-soft);animation:shake .4s}
@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.input:disabled{opacity:.6}
.textarea{resize:vertical;min-height:84px}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2397A4B6' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px;cursor:pointer}
.label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12.5px;font-weight:700;margin-bottom:5px;color:var(--muted)}
.label .req{color:var(--danger)}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.row{margin-bottom:11px}
.hint{font-size:12px;color:var(--faint);margin-top:5px}
.switch{display:inline-flex;align-items:center;gap:9px;cursor:pointer;font-weight:600;font-size:13.5px}
.switch input{display:none}
.switch .tr{width:38px;height:22px;border-radius:20px;background:var(--line);position:relative;transition:.25s;flex-shrink:0}
.switch .tr::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.25s var(--spring);box-shadow:0 2px 4px rgba(0,0,0,.2)}
.switch input:checked+.tr{background:var(--btn)}
.switch input:checked+.tr::after{transform:translateX(16px)}
input[type=range]{width:100%;accent-color:var(--btn)}
.range-val{font-weight:800;color:var(--btn)}
.seg{display:inline-flex;background:var(--surface2);border:1px solid var(--line);border-radius:11px;padding:3px;gap:2px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg button{border:0;background:none;padding:6px 11px;border-radius:8px;font-weight:700;font-size:13px;cursor:pointer;color:var(--muted);transition:.2s var(--ease);display:flex;align-items:center;gap:5px;white-space:nowrap}
.seg button.on{background:var(--surface);color:var(--text);box-shadow:var(--shadow)}
.seg button em{font-style:normal;font-size:10.5px;font-weight:800;background:var(--ok-soft);color:var(--ok);padding:1px 5px;border-radius:6px}
.filters{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:12px;box-shadow:var(--shadow);animation:fadeUp .3s both}
.form-err{display:none;gap:8px;padding:10px 12px;border-radius:10px;background:var(--danger-soft);color:var(--danger);font-weight:600;font-size:13px;margin-bottom:12px;align-items:flex-start;animation:fadeUp .3s both}
.form-err.on{display:flex}.form-err i{margin-top:2px}
.notice{display:flex;gap:10px;padding:10px 12px;border-radius:11px;background:var(--btn-soft);font-size:13px;font-weight:500;margin-bottom:12px;align-items:flex-start}
.notice i{color:var(--btn);margin-top:2px}
.notice.blue{background:var(--primary-soft)}.notice.blue i{color:var(--primary)}
.notice.ok{background:var(--ok-soft)}.notice.ok i{color:var(--ok)}
.notice.warn{background:rgba(229,154,11,.12)}.notice.warn i{color:var(--warn)}
.pwd{position:relative}.pwd .eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--faint);cursor:pointer;padding:6px}
.meter{height:5px;border-radius:5px;background:var(--line);overflow:hidden;margin-top:6px}.meter i{display:block;height:100%;width:0;transition:.4s;border-radius:5px;background:var(--grad)}
.stepper{display:flex;gap:6px;margin-bottom:14px}
.stepper div{flex:1;height:5px;border-radius:5px;background:var(--line);position:relative;overflow:hidden}
.stepper div::after{content:"";position:absolute;inset:0;background:var(--btn);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.stepper div.on::after{transform:scaleX(1)}
.step-t{font-size:12.5px;font-weight:800;color:var(--muted);margin-bottom:12px;text-transform:uppercase;letter-spacing:.4px}
.fstep{display:none}.fstep.on{display:block;animation:fadeUp .3s both}
.roles{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:12px}
.role{border:1.5px solid var(--line);border-radius:12px;padding:10px;cursor:pointer;transition:.2s;display:flex;gap:10px;align-items:center}
.role:hover{border-color:var(--btn)}.role.on{border-color:var(--btn);background:var(--btn-soft)}
.role>i{width:32px;height:32px;border-radius:9px;background:var(--surface2);display:grid;place-items:center;color:var(--btn);flex-shrink:0;transition:.2s;font-size:13px}
.role.on>i{background:var(--btn);color:#fff}
.role b{font-size:13px;display:block}.role small{font-size:11.5px;color:var(--muted);line-height:1.3;display:block}
/* profil rasmi: tayyor rasmlar + (Standart/Pro) o'z rasmi */
.pic-box{border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--surface2)}
.pic-top{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.pic-top b{font-size:13.5px;display:block}.pic-top small{font-size:12px;color:var(--muted);display:block;line-height:1.35}
.av-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.av-opt{aspect-ratio:1;border-radius:50%;border:2px solid transparent;padding:0;background:var(--surface);cursor:pointer;overflow:hidden;transition:transform .2s var(--spring),border-color .2s;position:relative}
.av-opt img{width:100%;height:100%;object-fit:cover}
.av-opt:hover{transform:scale(1.08)}
.av-opt.on{border-color:var(--btn);box-shadow:0 0 0 3px var(--btn-soft)}
.av-opt.on::after{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;right:-2px;bottom:-2px;width:16px;height:16px;border-radius:50%;background:var(--btn);color:#fff;font-size:8px;display:grid;place-items:center;border:2px solid var(--surface)}
.up-btn{display:flex;align-items:center;gap:10px;margin-top:10px;padding:9px 12px;border:1.5px dashed var(--line);border-radius:11px;cursor:pointer;transition:.2s;font-size:13px;font-weight:700;background:var(--surface)}
.up-btn:hover{border-color:var(--btn);color:var(--btn)}
.up-btn.locked{opacity:.75}
.up-btn .badge{margin-left:auto}
.pickmap{height:220px;border-radius:12px;border:1px solid var(--line);overflow:hidden}
.rep-row{display:grid;grid-template-columns:1fr 1fr 100px 36px;gap:6px;margin-bottom:6px}
.rep-row.two{grid-template-columns:1fr 1.4fr 36px}
.captcha{display:flex;gap:8px;align-items:center}
.captcha img{height:48px;width:160px;border-radius:10px;border:1px solid var(--line);background:#FFF4EC;flex-shrink:0}
.code-in{display:flex;gap:8px;justify-content:center;margin:16px 0}
.code-in input{width:54px;height:60px;border-radius:13px;border:2px solid var(--line);background:var(--surface);text-align:center;font-size:26px;font-weight:800;outline:0;transition:.2s;caret-color:var(--btn)}
.code-in input:focus{border-color:var(--btn);box-shadow:0 0 0 4px var(--btn-soft);transform:translateY(-2px)}
.code-in input.filled{border-color:var(--btn)}
.big-ic{width:62px;height:62px;border-radius:18px;background:var(--btn-soft);color:var(--btn);display:grid;place-items:center;font-size:26px;margin:0 auto 10px;animation:pop .6s var(--spring)}
.big-ic.tg{background:rgba(34,158,217,.13);color:#229ED9}
/* Telegram orqali tasdiqlash qadamlari */
.tg-steps{display:grid;gap:8px;margin:14px 0}
.tg-steps div{display:flex;gap:10px;align-items:center;padding:9px 11px;border-radius:11px;background:var(--surface2);font-size:13px;font-weight:600;transition:.3s}
.tg-steps div b{width:24px;height:24px;border-radius:50%;background:var(--surface);border:1.5px solid var(--line);display:grid;place-items:center;font-size:11.5px;flex-shrink:0;transition:.3s}
.tg-steps div.done{background:var(--ok-soft)}
.tg-steps div.done b{background:var(--ok);border-color:var(--ok);color:#fff}
.tg-steps div.cur b{border-color:var(--btn);color:var(--btn);animation:pulseB 1.6s infinite}
@keyframes pulseB{50%{box-shadow:0 0 0 5px var(--btn-soft)}}
.tg-wait{display:flex;align-items:center;gap:8px;justify-content:center;font-size:12.5px;color:var(--muted);font-weight:600;margin-top:8px}

/* ---------- kartalar ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s,border-color .3s;position:relative;overflow:hidden;animation:fadeUp .45s both}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:color-mix(in srgb,var(--btn) 40%,var(--line))}
.card.pro{border-color:color-mix(in srgb,#F06A28 40%,var(--line))}
.card.pro::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:#F06A28}
.card .top{display:flex;gap:11px;align-items:center}
.card .nm{font-weight:800;font-size:14.5px;line-height:1.25}
.card .kb{font-size:12.5px;color:var(--muted);font-weight:600}
.card .ds{font-size:13px;color:var(--muted);margin:10px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:39px}
.card .meta{display:flex;align-items:center;justify-content:space-between;gap:6px;padding-top:10px;border-top:1px dashed var(--line);font-size:12.5px;font-weight:700}
.card .meta span{display:flex;align-items:center;gap:5px;color:var(--muted)}
.card .meta .stc{color:var(--warn)}
.card .acts{position:absolute;top:10px;right:10px;display:flex;gap:5px}
.mini-btn{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);background:var(--surface);display:grid;place-items:center;color:var(--faint);transition:.2s;cursor:pointer;font-size:12px}
.mini-btn:hover,.mini-btn.on{color:var(--btn);border-color:var(--btn)}
.mini-btn.fav.on,.mini-btn.fav:hover{color:#E5484D;border-color:#E5484D}
.badge{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:800;padding:2px 7px;border-radius:20px;letter-spacing:.2px;vertical-align:middle;white-space:nowrap}
.badge.pro{background:var(--orange-soft);color:#F06A28}.badge.std{background:rgba(47,123,245,.12);color:#2F7BF5}.badge.free{background:var(--surface2);color:var(--muted)}
.badge.live{background:var(--danger-soft);color:var(--danger)}.badge.ok{background:var(--ok-soft);color:var(--ok)}.badge.vio{background:rgba(139,92,246,.12);color:#8B5CF6}
.badge.tg{background:rgba(34,158,217,.12);color:#229ED9}
.vf{color:#2F7BF5;font-size:13px}
.tagline{display:flex;gap:5px;flex-wrap:wrap;margin-top:5px}
.tag-s{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--muted);background:var(--surface2);padding:2px 8px;border-radius:20px}
.st-tag{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px}
.st-tag.free{background:var(--ok-soft);color:var(--ok)}.st-tag.busy{background:var(--danger-soft);color:var(--danger)}.st-tag.looking{background:rgba(229,154,11,.14);color:var(--warn)}
.st-tag i{font-size:6px}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tags span{padding:4px 10px;border-radius:20px;background:var(--btn-soft);color:var(--btn);font-size:12.5px;font-weight:700}
.empty{padding:40px 18px;text-align:center;color:var(--muted);background:var(--surface);border:1px dashed var(--line);border-radius:var(--r);grid-column:1/-1;font-size:13.5px}
.empty i{font-size:30px;color:var(--faint);margin-bottom:10px;display:block}
.more-wrap{text-align:center;margin-top:16px}
/* buyurtma */
.ord{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;cursor:pointer;transition:.3s var(--ease);display:flex;flex-direction:column;gap:8px;animation:fadeUp .45s both;position:relative}
.ord:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.ord h3{font-size:15px;line-height:1.3;padding-right:78px}
.ord .price{position:absolute;top:14px;right:14px;font-weight:800;font-size:14px;color:var(--btn);text-align:right}
.ord .price small{display:block;font-size:10.5px;color:var(--faint);font-weight:700}
.ord p{font-size:13px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ord .ft{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px;border-top:1px dashed var(--line);font-size:12px;font-weight:700;color:var(--muted)}
.ord .ft .who{display:flex;align-items:center;gap:7px;min-width:0}
.ord .ft .who span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ord.closed{opacity:.6}
/* tadbir */
.ev{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;cursor:pointer;transition:.3s var(--ease);display:flex;flex-direction:column;animation:fadeUp .45s both}
.ev:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.ev .cov{height:78px;position:relative;padding:11px;display:flex;justify-content:space-between;align-items:flex-start;color:#fff}
.ev .cov .date{background:rgba(255,255,255,.95);color:#111;border-radius:10px;padding:4px 9px;text-align:center;line-height:1.1;box-shadow:0 5px 12px -6px rgba(0,0,0,.4)}
.ev .cov .date b{display:block;font-size:17px}.ev .cov .date small{font-size:10px;font-weight:800;text-transform:uppercase;color:#F06A28}
.ev .cov .ic{font-size:32px;opacity:.3;position:absolute;right:14px;bottom:6px}
.ev .bd{padding:12px 14px;flex:1;display:flex;flex-direction:column;gap:6px}
.ev h3{font-size:14.5px;line-height:1.3}
.inf{font-size:12.5px;color:var(--muted);display:flex;flex-direction:column;gap:3px}
.inf i{width:15px;color:var(--btn)}
.ev .ft{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-top:1px dashed var(--line);font-size:12.5px;font-weight:700;gap:8px}
.ev .ft .who{display:flex;align-items:center;gap:7px;color:var(--muted);min-width:0}
.ev .ft .who span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stack{display:flex}.stack .av{border:2px solid var(--surface);margin-left:-7px}.stack .av:first-child{margin-left:0}
/* top */
.top-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.top-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 12px;text-align:center;cursor:pointer;transition:.3s var(--ease);position:relative;animation:fadeUp .45s both}
.top-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.top-card .pos{position:absolute;top:10px;left:10px;width:24px;height:24px;border-radius:8px;background:var(--surface2);display:grid;place-items:center;font-weight:800;font-size:12px}
.top-card:nth-child(1) .pos{background:#FFB020;color:#fff}.top-card:nth-child(2) .pos{background:#A7B4C6;color:#fff}.top-card:nth-child(3) .pos{background:#D98A4E;color:#fff}
.top-card .av{margin:0 auto 10px;box-shadow:0 0 0 3px var(--surface),0 0 0 5px var(--line)}
.top-card b{display:block;font-size:14px}.top-card small{color:var(--muted);font-weight:600;font-size:12px}
.stars{color:var(--warn);font-size:12px;letter-spacing:1px;margin-top:5px}
/* tariflar */
.promo-bar{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;background:var(--btn-soft);border:1px solid var(--line);border-radius:14px;padding:10px 14px;margin-bottom:16px;font-weight:700;text-align:center;font-size:13.5px}
.cd{display:flex;gap:5px}
.cd span{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:4px 8px;font-variant-numeric:tabular-nums;min-width:44px;text-align:center}
.cd small{display:block;font-size:9.5px;color:var(--muted);font-weight:700}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px 18px;display:flex;flex-direction:column;position:relative;transition:.3s var(--ease)}
.plan:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.plan.feat{border:2px solid var(--btn);box-shadow:0 24px 50px -30px var(--btn)}
.plan .tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--btn);color:#fff;font-size:11px;font-weight:800;padding:3px 12px;border-radius:20px;white-space:nowrap}
.plan .pi{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:16px;background:var(--btn-soft);color:var(--btn);margin-bottom:12px}
.plan.feat .pi{background:var(--orange-soft);color:#F06A28}
.plan h3{font-size:17px;font-weight:800;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.plan .old{font-size:13px;color:var(--faint);font-weight:700;margin-top:8px;display:flex;gap:7px;align-items:center;min-height:20px}
.plan .old s{text-decoration-thickness:2px}
.plan .old em{font-style:normal;background:var(--ok);color:#fff;font-size:11px;padding:1px 7px;border-radius:7px}
.plan .pr{font-size:27px;font-weight:800;letter-spacing:-.8px;margin:2px 0}
.plan .pr small{font-size:13px;color:var(--muted);font-weight:600;letter-spacing:0}
.plan .pm{font-size:12.5px;color:var(--ok);font-weight:700;min-height:18px}
.plan .pd{color:var(--muted);font-size:13px;margin:6px 0 14px}
.plan ul{list-style:none;display:flex;flex-direction:column;gap:7px;margin-bottom:18px;flex:1}
.plan li{display:flex;gap:9px;font-size:13px;font-weight:500}
.plan li i{color:var(--ok);margin-top:3px;font-size:12px}
.plan li.no{color:var(--faint)}.plan li.no i{color:var(--faint)}
.plan .cur{font-size:12px;font-weight:700;color:var(--ok);text-align:center;margin-top:8px}
/* faq */
.faq{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:0 14px;transition:.3s}
.faq details[open]{box-shadow:var(--shadow);border-color:color-mix(in srgb,var(--btn) 35%,var(--line))}
.faq summary{list-style:none;padding:12px 0;font-weight:700;font-size:14px;cursor:pointer;display:flex;justify-content:space-between;gap:10px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{transition:transform .3s var(--ease);color:var(--btn);font-size:12px}
.faq details[open] summary i{transform:rotate(45deg)}
.faq details p{padding:0 0 12px;color:var(--muted);font-size:13.5px;animation:fadeUp .3s both}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.step{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;position:relative}
.step .n{position:absolute;top:14px;right:14px;font-size:28px;font-weight:800;color:var(--line);line-height:1}
.step .si{width:38px;height:38px;border-radius:11px;background:var(--btn-soft);color:var(--btn);display:grid;place-items:center;font-size:15px;margin-bottom:10px}
.step b{display:block;font-size:14.5px;margin-bottom:4px}.step p{font-size:13px;color:var(--muted)}
.cta{background:var(--grad);border-radius:20px;padding:28px 30px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;position:relative;overflow:hidden;margin-top:26px}
.cta::after{content:"\f3c5";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;right:26px;bottom:-34px;font-size:150px;opacity:.12}
.cta h3{font-size:clamp(18px,2.4vw,24px);letter-spacing:-.6px;max-width:540px;line-height:1.25}
.cta p{opacity:.9;margin-top:6px;font-size:14px}
.cta .btn{background:#fff;color:#111;position:relative;z-index:2}
footer{border-top:1px solid var(--line);margin-top:24px;padding:24px 0 80px;color:var(--muted);font-size:13px}
footer .container{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
footer .brand{font-size:19px}
footer .links{display:flex;gap:14px;flex-wrap:wrap}
footer .links a:hover{color:var(--btn)}

/* ---------- modal (orqa fon shaffof va xiralashgan) ---------- */
.modal{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--backdrop);backdrop-filter:blur(8px) saturate(130%);-webkit-backdrop-filter:blur(8px) saturate(130%);opacity:0;transition:opacity .28s}
.modal.open{opacity:1}
.modal-box{background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-lg);width:100%;max-width:520px;max-height:calc(100dvh - 32px);overflow:auto;position:relative;transform:translateY(22px) scale(.97);transition:transform .4s var(--spring);overscroll-behavior:contain}
.modal.open .modal-box{transform:none}
.modal-box.lg{max-width:760px}.modal-box.md{max-width:620px}.modal-box.sm{max-width:420px}
.m-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px 10px;position:sticky;top:0;background:var(--surface);z-index:5}
.m-head h3{font-size:16.5px;font-weight:800;letter-spacing:-.3px;display:flex;align-items:center;gap:9px;min-width:0}
.m-head h3 i{color:var(--btn)}
.m-body{padding:4px 18px 18px}
.m-foot{display:flex;gap:8px;justify-content:flex-end;padding:12px 18px;flex-wrap:wrap;position:sticky;bottom:0;background:var(--surface);border-top:1px solid var(--line);z-index:4}
.x-btn{width:32px;height:32px;border-radius:9px;border:1px solid var(--line);background:var(--surface);cursor:pointer;display:grid;place-items:center;color:var(--muted);transition:.25s var(--ease);flex-shrink:0}
.x-btn:hover{color:var(--danger);border-color:var(--danger);transform:rotate(90deg)}
.cover{height:96px;background:var(--grad);position:relative;overflow:hidden}
.cover::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36'%3E%3Ccircle cx='2' cy='2' r='1.4' fill='white' fill-opacity='.25'/%3E%3C/svg%3E")}
.cover .x-btn{position:absolute;top:12px;right:12px;z-index:3;background:rgba(255,255,255,.25);border-color:rgba(255,255,255,.35);color:#fff;backdrop-filter:blur(6px)}
.pf-head{padding:0 18px;margin-top:-42px;position:relative;z-index:2;display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap}
.pf-head>.av{border:4px solid var(--surface);box-shadow:var(--shadow)}
.pf-head .who{flex:1;min-width:200px;padding-top:46px}
.pf-head h2{font-size:19px;letter-spacing:-.4px;font-weight:800;line-height:1.2}
.pf-head .kb{color:var(--muted);font-weight:600;font-size:13.5px}
.pf-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}
.pf-stats div{background:var(--surface2);border-radius:11px;padding:9px;text-align:center}
.pf-stats b{display:block;font-size:15px;font-weight:800}
.pf-stats span{font-size:11.5px;color:var(--muted);font-weight:600}
.sec2{margin-top:16px}
.sec2 h4{font-size:11.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--faint);font-weight:800;margin-bottom:8px;display:flex;align-items:center;gap:7px}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.kv div{background:var(--surface2);border-radius:10px;padding:8px 10px}
.kv small{display:block;font-size:11px;color:var(--muted);font-weight:700}
.kv b{font-size:13.5px;word-break:break-word}
.tl{display:flex;flex-direction:column;gap:8px;border-left:2px solid var(--line);padding-left:14px;margin-left:6px}
.tl div{position:relative}
.tl div::before{content:"";position:absolute;left:-21px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--surface);border:3px solid var(--btn)}
.tl b{display:block;font-size:13.5px}.tl small{color:var(--muted);font-size:12px}
.contacts{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.ct{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:11px;background:var(--surface2);border:1px solid transparent;transition:.2s;min-width:0}
a.ct:hover{border-color:var(--btn);transform:translateY(-2px)}
.ct .ci{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:#fff;flex-shrink:0;font-size:13px}
.ct div{min-width:0}.ct small{display:block;font-size:11px;color:var(--muted);font-weight:700}
.ct b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.locked{position:relative}
.locked .contacts{filter:blur(5px);pointer-events:none;user-select:none;opacity:.7}
.lock-over{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:8px;z-index:2}
.lock-over p{font-size:12.5px;color:var(--muted);font-weight:600;max-width:320px}
.rv{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.rv:last-child{border:0}
.rv b{font-size:13.5px}.rv small{color:var(--faint);font-size:11.5px;margin-left:6px}
.rv p{font-size:13.5px;color:var(--muted);margin-top:2px;word-break:break-word}
.rdist{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;margin-bottom:8px}
.rdist .big{text-align:center}.rdist .big b{font-size:32px;font-weight:800;line-height:1}
.rbar{display:grid;grid-template-columns:16px 1fr 26px;gap:7px;align-items:center;font-size:11.5px;font-weight:700;color:var(--muted)}
.rbar div{height:6px;background:var(--surface2);border-radius:6px;overflow:hidden}.rbar div i{display:block;height:100%;background:var(--warn);border-radius:6px}
.rate-in{display:flex;gap:6px;font-size:26px;color:var(--line);cursor:pointer}
.rate-in i{transition:transform .15s,color .15s}.rate-in i.on{color:var(--warn)}.rate-in i:hover{transform:scale(1.2)}
.acts-bar{display:flex;gap:6px;flex-wrap:wrap;margin-top:18px;position:sticky;bottom:-18px;background:var(--surface);padding:10px 0 4px;border-top:1px solid var(--line);z-index:4}
.mini{display:flex;gap:10px;align-items:center;padding:9px;border-radius:12px;border:1px solid var(--line);margin-bottom:6px;transition:.2s;cursor:pointer;background:var(--surface)}
.mini:hover{border-color:var(--btn)}
.mini .t{flex:1;min-width:0}
.mini b{font-size:13.5px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini small{color:var(--muted);font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini .un{background:var(--btn);color:#fff;border-radius:9px;font-size:10.5px;font-weight:800;padding:1px 6px}
.ib{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex-shrink:0;background:var(--btn-soft);color:var(--btn);font-size:14px}
/* taqqoslash */
.cmp{display:grid;gap:10px}
.cmp table{width:100%;border-collapse:collapse;font-size:13px}
.cmp th,.cmp td{padding:8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.cmp th{color:var(--muted);font-size:11px;text-transform:uppercase;width:110px}
.cmp-bar{position:fixed;left:50%;bottom:calc(16px + var(--bnav));transform:translateX(-50%) translateY(160%);z-index:1500;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lg);padding:8px 10px;display:flex;align-items:center;gap:8px;transition:transform .4s var(--spring);max-width:calc(100% - 100px)}
.cmp-bar.on{transform:translateX(-50%)}
/* to'lov */
.pay-card{background:linear-gradient(135deg,#111827,#1F2937 60%,#2F7BF5 170%);color:#fff;border-radius:16px;padding:18px;position:relative;overflow:hidden;margin-bottom:12px}
[data-theme="dark"] .pay-card{background:linear-gradient(135deg,#111,#1c1c22 60%,#FF7A1A 170%)}
.pay-card::after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.08)}
.pay-card small{opacity:.7;font-size:11.5px;font-weight:600}
.pay-card .num{font-size:18px;letter-spacing:2px;font-weight:700;margin:4px 0 12px;display:flex;align-items:center;gap:10px;position:relative;z-index:2;flex-wrap:wrap}
.pay-card .amt{font-size:25px;font-weight:800;position:relative;z-index:2;display:flex;align-items:center;gap:10px}
.copy{border:0;background:rgba(255,255,255,.16);color:#fff;width:30px;height:30px;border-radius:9px;cursor:pointer;font-size:12px;transition:.2s}
.copy:hover{background:rgba(255,255,255,.3)}
.pay-status{display:flex;align-items:center;gap:10px;padding:11px;border-radius:12px;border:1px solid var(--line);font-weight:600;font-size:13.5px}
.pay-status .timer{margin-left:auto;font-weight:800;font-variant-numeric:tabular-nums;color:var(--btn)}
.periods{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:12px}
.periods label{border:1.5px solid var(--line);border-radius:12px;padding:10px;cursor:pointer;text-align:center;transition:.2s;position:relative}
.periods input{display:none}
.periods label:has(input:checked){border-color:var(--btn);background:var(--btn-soft)}
.periods b{display:block;font-size:14px}.periods small{color:var(--muted);font-size:11.5px;font-weight:600}
.periods em{position:absolute;top:-8px;right:6px;background:var(--ok);color:#fff;font-style:normal;font-size:10px;font-weight:800;padding:1px 6px;border-radius:7px}
.success-anim{width:74px;height:74px;border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center;font-size:32px;margin:8px auto 14px;animation:pop .6s var(--spring) both}
@keyframes pop{from{transform:scale(0)}}
/* kabinet */
.kb-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.kb-grid div{background:var(--surface2);border-radius:11px;padding:11px}
.kb-grid b{display:block;font-size:18px;font-weight:800}
.kb-grid span{font-size:11.5px;color:var(--muted);font-weight:700}
.chartb{display:flex;align-items:flex-end;gap:4px;height:100px;padding:8px 0;border-bottom:1px solid var(--line)}
.chartb div{flex:1;background:var(--grad);border-radius:5px 5px 0 0;min-height:3px;position:relative;transform-origin:bottom;animation:grow .8s var(--ease) both}
@keyframes grow{from{transform:scaleY(0)}}
.chartb div:hover::after{content:attr(data-t);position:absolute;bottom:calc(100% + 4px);left:50%;transform:translateX(-50%);background:var(--text);color:var(--bg);font-size:10.5px;padding:2px 6px;border-radius:6px;white-space:nowrap;font-weight:700}
.upsell{border:1.5px dashed var(--btn);border-radius:13px;padding:14px;text-align:center;background:var(--btn-soft)}
.ring{--p:0;width:60px;height:60px;border-radius:50%;background:conic-gradient(var(--btn) calc(var(--p)*1%),var(--line) 0);display:grid;place-items:center;flex-shrink:0}
.ring b{width:47px;height:47px;border-radius:50%;background:var(--surface);display:grid;place-items:center;font-size:13px}

/* ---------- drawer ---------- */
.drawer{position:fixed;top:0;right:0;bottom:0;width:400px;max-width:100%;z-index:2100;background:var(--surface);border-left:1px solid var(--line);box-shadow:var(--shadow-lg);transform:translateX(105%);transition:transform .45s var(--ease);display:flex;flex-direction:column}
.drawer.open{transform:none}
.drawer-bg{position:fixed;inset:0;z-index:2090;background:var(--backdrop);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:.3s}
.drawer-bg.open{opacity:1;pointer-events:auto}
.drawer .hd{padding:12px 14px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px}
.drawer .hd h3{font-size:15px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drawer .bd{padding:12px 14px;overflow:auto;flex:1;overscroll-behavior:contain}
.chat{display:flex;flex-direction:column;gap:6px}
.msg{max-width:82%;padding:8px 12px;border-radius:14px;font-size:13.5px;line-height:1.45;word-break:break-word;white-space:pre-line;animation:msgIn .3s var(--spring) both}
.msg small{display:block;font-size:10px;opacity:.65;margin-top:2px;text-align:right}
.msg.in{background:var(--surface2);border-bottom-left-radius:4px;align-self:flex-start}
.msg.out{background:var(--btn);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}
@keyframes msgIn{from{opacity:0;transform:translateY(8px) scale(.96)}}
.chat-in{display:flex;gap:6px;padding:10px 12px;border-top:1px solid var(--line);padding-bottom:max(10px,env(safe-area-inset-bottom))}

/* ---------- Qidir.ai yordamchi ---------- */
.fab{position:fixed;right:18px;bottom:calc(18px + var(--bnav));z-index:1600;width:52px;height:52px;border-radius:50%;border:0;background:var(--btn);color:#fff;font-size:20px;cursor:pointer;box-shadow:0 12px 26px -10px var(--btn);display:grid;place-items:center;transition:transform .3s var(--spring),bottom .3s}
.fab:hover{transform:scale(1.07) rotate(-6deg)}
.fab::before{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--btn);opacity:.5;animation:fabRing 2.4s infinite}
@keyframes fabRing{from{transform:scale(.9);opacity:.6}to{transform:scale(1.35);opacity:0}}
.fab-tip{position:fixed;right:80px;bottom:calc(30px + var(--bnav));z-index:1600;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:7px 12px;font-size:12.5px;font-weight:700;box-shadow:var(--shadow);animation:fadeUp .5s 4s both;pointer-events:none}
.sup-box{max-width:420px;height:min(600px,calc(100dvh - 32px));display:flex;flex-direction:column;overflow:hidden}
.sup-head{display:flex;gap:10px;align-items:center;padding:12px 14px;background:var(--btn);color:#fff}
.sup-head .ic{width:38px;height:38px;border-radius:11px;background:rgba(255,255,255,.2);display:grid;place-items:center;font-size:17px}
.sup-head b{display:block;font-size:15px}.sup-head small{opacity:.9;font-size:12px;display:flex;align-items:center;gap:6px}
.sup-head small i{width:7px;height:7px;border-radius:50%;background:#7CFFB2;display:inline-block}
.sup-head .x-btn{margin-left:auto;background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.3);color:#fff}
.sup-body{flex:1;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:8px;overscroll-behavior:contain}
.sup-faq{display:flex;gap:5px;padding:0 12px 8px;overflow-x:auto;scrollbar-width:none}
.sup-faq::-webkit-scrollbar{display:none}
.sup-faq button{border:1px solid var(--line);background:var(--surface);padding:5px 10px;border-radius:20px;font-size:12px;font-weight:600;cursor:pointer;transition:.2s;color:var(--muted);white-space:nowrap}
.sup-faq button:hover{border-color:var(--btn);color:var(--btn)}
.typing{display:flex;gap:4px;padding:10px 12px;background:var(--surface2);border-radius:14px;border-bottom-left-radius:4px;align-self:flex-start}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--faint);animation:bounce 1s infinite}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}

/* ---------- pastki menyu (telefon) ---------- */
.bnav{display:none}

/* ---------- toast ---------- */
.toasts{position:fixed;bottom:calc(18px + var(--bnav));left:50%;transform:translateX(-50%);z-index:3000;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;width:calc(100% - 28px);max-width:420px}
.toast{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-lg);font-weight:600;font-size:13.5px;animation:tIn .4s var(--spring) both;pointer-events:auto;width:100%}
.toast i{font-size:16px}.toast.ok i{color:var(--ok)}.toast.err i{color:var(--danger)}.toast.info i{color:var(--btn)}
.toast.out{animation:tOut .3s forwards}
@keyframes tIn{from{transform:translateY(26px) scale(.92);opacity:0}}
@keyframes tOut{to{transform:translateY(18px);opacity:0}}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}}
.skel{background:linear-gradient(90deg,var(--surface2) 25%,var(--line) 50%,var(--surface2) 75%);background-size:200% 100%;animation:sh 1.3s infinite;border-radius:10px}
@keyframes sh{to{background-position:-200% 0}}

/* ==========================================================================
   MOSLASHUVCHANLIK: planshet, telefon, soat
   ========================================================================== */
@media (max-width:1100px){.nav a span{display:none}.nav a{padding:7px 9px}}
@media (max-width:1024px){
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:16px}.hero-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
  .filters{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}
  .plans{grid-template-columns:1fr;max-width:460px;margin:0 auto}
}
@media (max-width:900px){.faq{grid-template-columns:1fr}}

/* ---- telefon ---- */
@media (max-width:760px){
  :root{--hdr:52px;--bnav:calc(60px + env(safe-area-inset-bottom))}
  body{font-size:14px}
  .container{padding:0 14px}
  .nav,.hide-sm{display:none!important}
  .header .container{gap:6px}
  .brand{font-size:20px}.brand-mark{width:28px;height:32px}.brand-mark svg{width:17px;height:17px}
  .hdr-r{gap:5px}.hdr-r .btn-icon{width:34px;height:34px}
  .user-chip{padding:2px}.user-chip .nm,.user-chip>i{display:none}
  .vbar .container{font-size:12.5px;gap:8px}
  .vbar .btn span{display:none}
  /* pastki menyu */
  .bnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1700;background:var(--glass);backdrop-filter:blur(18px) saturate(170%);-webkit-backdrop-filter:blur(18px) saturate(170%);border-top:1px solid var(--line);padding:5px 6px calc(5px + env(safe-area-inset-bottom));justify-content:space-around}
  .bnav a,.bnav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 2px;border:0;background:none;color:var(--muted);font-size:10.5px;font-weight:700;border-radius:10px;cursor:pointer;position:relative;transition:color .2s;-webkit-tap-highlight-color:transparent}
  .bnav i{font-size:17px;transition:transform .3s var(--spring)}
  .bnav .on{color:var(--btn)}
  .bnav .on i{transform:translateY(-2px) scale(1.08)}
  .bnav .on::before{content:"";position:absolute;top:-5px;left:30%;right:30%;height:3px;border-radius:0 0 3px 3px;background:var(--btn)}
  .bnav .dotc{top:0;right:calc(50% - 20px)}
  /* hero */
  .hero{padding:16px 0 6px}.hero::before{display:none}
  .hero h1{font-size:23px;letter-spacing:-.7px;margin:10px 0 6px}
  .hero p.lead{font-size:13.5px}
  .hero-stats{display:flex;overflow-x:auto;scrollbar-width:none;gap:8px;margin:0 -14px;padding:2px 14px 4px}
  .hero-stats::-webkit-scrollbar{display:none}
  .stat-card{flex:0 0 auto;padding:9px 12px;box-shadow:none}
  .stat-card .ic{width:30px;height:30px;font-size:13px}.stat-card b{font-size:16px}
  .search-box{margin-top:12px;border-radius:13px}
  .search-box .ai-badge span,.search-box .wc{display:none}
  .search-box .ai-badge{padding:8px 9px}
  .search-box .btn{padding:8px 12px}
  .suggest{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:10px -14px 0;padding:0 14px}
  .suggest::-webkit-scrollbar{display:none}
  .sec{padding:20px 0}
  .sec-head{margin-bottom:10px}
  .sec-head .seg{order:3;width:100%}
  .sec-tools{width:100%}
  .sec-tools .btn-accent,.sec-tools .btn-primary{margin-left:auto}
  /* xarita */
  .map-wrap{border-radius:16px;margin:0 -4px}
  #map{height:58vh;min-height:340px}
  .map-legend{display:none}
  .map-tools{bottom:60px}
  .map-hint{max-width:calc(100% - 70px);left:10px;transform:translateY(16px);font-size:12px}.map-hint.on{transform:none}
  .ai-panel{top:auto;bottom:0;left:0;right:0;width:auto;max-width:none;height:62%;border-radius:18px 18px 0 0;transform:translateY(105%)}
  /* kartalar */
  .cards{grid-template-columns:1fr;gap:10px}
  .card{padding:12px}
  .top-list{grid-template-columns:repeat(2,1fr);gap:8px}
  .g2,.g3,.kv,.contacts,.roles{grid-template-columns:1fr}
  .g3.keep,.g2.keep{grid-template-columns:1fr 1fr}
  .filters,.steps{grid-template-columns:1fr}
  .pf-stats,.kb-grid{grid-template-columns:repeat(2,1fr)}
  .av-grid{grid-template-columns:repeat(6,1fr)}
  /* modal — pastdan chiqadigan varaq */
  .modal{padding:0;align-items:flex-end}
  .modal-box{border-radius:20px 20px 0 0;max-height:94dvh;transform:translateY(100%);transition:transform .38s var(--ease);border-bottom:0}
  .modal-box::before{content:"";display:block;width:38px;height:4px;border-radius:4px;background:var(--line);margin:8px auto 0;position:sticky;top:6px;z-index:6}
  .modal-box.sup-box{height:94dvh;max-width:none}
  .modal-box.sup-box::before,.modal-box:has(.cover)::before{display:none}
  .m-head{padding:10px 14px 8px}.m-body{padding:2px 14px 16px}.m-foot{padding:10px 14px calc(10px + env(safe-area-inset-bottom))}
  .pf-head{padding:0 14px}.pf-head .who{padding-top:0;min-width:100%}
  .acts-bar{padding-bottom:calc(6px + env(safe-area-inset-bottom))}
  .drawer{width:100%}
  .cta{padding:22px 18px;border-radius:16px}
  .rep-row{grid-template-columns:1fr 1fr 36px}.rep-row .yr{grid-column:1/3}
  .fab{width:46px;height:46px;right:12px;font-size:18px}.fab-tip{display:none}
  .code-in input{width:52px;height:58px;font-size:24px}
  .cmp-bar{max-width:calc(100% - 80px);left:12px;transform:translateY(160%)}.cmp-bar.on{transform:none}
  footer{padding-bottom:24px}
}
@media (max-width:420px){
  #authArea .btn-primary span{display:none}#authArea .btn-primary{width:34px;padding:0}
  .periods{grid-template-columns:1fr}.pay-card .num{font-size:16px}.pay-card .amt{font-size:22px}
  .pf-stats b{font-size:14px}
  .av-grid{grid-template-columns:repeat(5,1fr)}
}
/* ---- soat va juda kichik ekranlar ---- */
@media (max-width:340px){
  :root{--hdr:46px;--bnav:calc(48px + env(safe-area-inset-bottom))}
  body{font-size:13px}
  .container{padding:0 8px}
  .brand{font-size:0}.brand-mark{margin:0;width:26px;height:29px}
  .hdr-r .btn-icon{width:30px;height:30px;font-size:12px}.theme-toggle,#chatBtn{display:none}
  .vbar .container{font-size:11px}.vbar span{display:none}
  .bnav span{display:none}.bnav i{font-size:16px}.bnav a,.bnav button{padding:6px 0}
  .hero h1{font-size:18px}.hero p.lead,.pill,.hero-stats,.suggest,.ai-meta{display:none}
  .search-box .ai-badge{display:none}.search-box input{font-size:13px}.search-box .btn{padding:7px 9px;font-size:0;gap:0}.search-box .btn i{font-size:14px}
  #map{height:50vh;min-height:200px}.map-wrap{border-radius:12px;margin:0}
  .map-tools,.chips,.map-hint{display:none}
  .sec{padding:14px 0}.sec-head h2{font-size:16px}.sec-head h2 .hi,.sec-head p{display:none}
  .btn{padding:6px 10px;font-size:12px;min-height:32px}
  .top-list{grid-template-columns:1fr}
  .fab{width:40px;height:40px;font-size:15px;right:8px}
  .modal-box{max-height:100dvh;border-radius:14px 14px 0 0}
  .code-in{gap:5px}.code-in input{width:40px;height:48px;font-size:20px}
  .captcha{flex-direction:column;align-items:stretch}.captcha img{width:100%}
  .av-grid{grid-template-columns:repeat(4,1fr)}
  .steps,.cta{display:none}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}