:root{
  --bg:#F2F6F8;--surf:#FFFFFF;--ink:#16323F;--ink2:#3E5663;--steel:#7A8C96;--line:#DCE6EB;
  --acc:#1BA8D8;--acc-s:#0C83B0;--acc-bg:#E3F3FA;--red:#E60012;--r:12px;--r-s:8px;
  --hh:64px;--side:240px;--kpw:340px;
  --sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent;touch-action:manipulation;scroll-padding-top:calc(var(--hh) + 8px)}
body{font-family:var(--font);color:var(--ink);background:var(--bg);font-size:14px;line-height:1.4;min-height:100vh;min-height:100dvh}
body.locked{position:fixed;left:0;right:0;overflow:hidden}
button,input{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer;touch-action:manipulation}
a,button,select,label{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
img{max-width:100%}
:focus-visible{outline:2px solid var(--acc-s);outline-offset:2px;border-radius:4px}
[hidden]{display:none!important}

/* header */
.top{position:sticky;top:0;z-index:40;background:var(--surf);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:18px;padding:calc(10px + var(--sat)) 24px 10px}
.top::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--acc)}
.logo{display:flex;align-items:center;gap:12px;flex:none}
.logo .it{height:32px;width:auto}
.logo .dh{height:26px;width:auto}
.date{font-size:11.5px;color:var(--steel);white-space:nowrap}
.srch{flex:1;max-width:640px;height:42px;display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:0 10px 0 12px}
.srch:focus-within{border-color:var(--acc);background:var(--surf)}
.srch svg{width:18px;height:18px;fill:none;stroke:var(--steel);stroke-width:2;flex:none}
.srch input{flex:1;min-width:0;border:0;background:none;outline:0;font-size:15px;height:100%}
.srch input::-webkit-search-cancel-button{display:none}
.qn{font-size:11px;color:var(--steel);white-space:nowrap}
.qx{width:28px;height:28px;border-radius:50%;color:var(--steel)}
.hr{margin-left:auto;display:flex;align-items:center;gap:6px}
.hbtn{height:38px;padding:0 12px;border-radius:var(--r-s);display:inline-flex;align-items:center;gap:6px;color:var(--ink2);font-size:13.5px;white-space:nowrap}
.hbtn:hover{background:var(--bg)}
.hbtn.more{font-size:20px;letter-spacing:1px}
#installBtn{border:1px solid var(--acc);color:var(--acc-s);font-weight:600}
.net{font-size:12px;color:#fff;background:var(--ink2);padding:4px 9px;border-radius:20px}
.kpb{height:40px;padding:0 14px;border-radius:var(--r-s);background:var(--acc-s);color:#fff;font-weight:600;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.kpb b{background:rgba(255,255,255,.22);border-radius:10px;padding:1px 7px;font-size:12px}
.kpb span:not(:empty)::before{content:"·";margin:0 4px;opacity:.7}

/* layout */
.main{display:grid;grid-template-columns:var(--side) minmax(0,1fr) var(--kpw);align-items:start;min-height:calc(100dvh - var(--hh))}
.side{position:sticky;top:var(--hh);height:calc(100dvh - var(--hh));overflow:auto;background:var(--surf);border-right:1px solid var(--line);padding:10px 0 24px;overscroll-behavior:contain}
.side a{display:flex;justify-content:space-between;gap:8px;padding:9px 18px 9px 17px;font-size:13.5px;border-left:3px solid transparent;color:var(--ink2)}
.side a:hover{background:var(--bg)}
.side a em{font-style:normal;color:var(--steel);font-size:12px}
.side a.on{border-color:var(--acc);background:var(--acc-bg);color:var(--ink);font-weight:700}
.side .sep{height:1px;background:var(--line);margin:8px 18px}
.view{padding:20px 24px 40px;min-width:0}

/* titles */
.ttl{display:flex;align-items:center;gap:6px 12px;margin-bottom:14px;flex-wrap:wrap}
.ttl h1{font-size:24px;letter-spacing:-.3px;line-height:1.2}
.ttl .n{color:var(--steel);font-size:13px}
.ttl .back{display:none;width:30px;height:36px;border-radius:50%;font-size:26px;line-height:1;color:var(--ink2);margin:0 -4px 0 -6px;align-items:center;justify-content:center}
.sort{appearance:none;-webkit-appearance:none;height:38px;border:1px solid var(--line);border-radius:var(--r-s);padding:0 34px 0 14px;font-size:13.5px;color:var(--ink2);cursor:pointer;background:var(--surf) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%237A8C96'/%3E%3C/svg%3E") no-repeat right 13px center}
.sort:hover{border-color:var(--acc)}
.chips{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}
.chips a{font-size:12.5px;border:1px solid var(--line);background:var(--surf);padding:6px 12px;border-radius:20px;white-space:nowrap;color:var(--ink2)}
.chips a em{font-style:normal;color:var(--steel);margin-left:4px}
.chips a.on{background:var(--ink);border-color:var(--ink);color:#fff}
.chips a.on em{color:rgba(255,255,255,.7)}

/* home */
.hero{display:flex;align-items:baseline;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.hero h1{font-size:24px;letter-spacing:-.3px}
.hero p{color:var(--steel);font-size:13px}
.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.catc{position:relative;display:block;background:var(--surf);border:1px solid var(--line);border-radius:var(--r);height:124px;padding:14px;overflow:hidden}
.catc:hover{border-color:var(--acc)}
.catc b{display:block;font-size:14.5px;line-height:1.25;max-width:58%}
.catc span{font-size:12px;color:var(--steel)}
.catc img{position:absolute;right:8px;bottom:8px;width:44%;height:74%;object-fit:contain}

/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.gh{grid-column:1/-1;font-size:12.5px;color:var(--steel);padding:8px 2px 0;font-weight:600}
.gh:first-child{padding-top:0}
.card{position:relative;min-width:0;background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:12px;display:flex;flex-direction:column}
.card .ph{height:140px;display:flex;align-items:center;justify-content:center;margin-bottom:10px;border-radius:var(--r-s)}
.card .im{max-width:90%;max-height:128px;object-fit:contain}
.noimg{display:block;width:64px;height:64px;border-radius:50%;background:var(--bg) center/32px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A8C96' stroke-width='1.6'%3E%3Crect x='3' y='6' width='18' height='13' rx='2'/%3E%3Ccircle cx='12' cy='12.5' r='3.5'/%3E%3Cpath d='M8 6l1.5-2h5L16 6'/%3E%3C/svg%3E")}
.card .shn{font-size:10.5px;color:var(--acc-s);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .sku{display:block;width:100%;text-align:left;font-weight:700;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .ds{font-size:12px;color:var(--steel);margin:4px 0 10px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:32px}
.bt{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:auto}
.bt b{font-size:15.5px;display:block;white-space:nowrap}
.bt b.req{font-size:13px;color:var(--ink2);font-weight:600}
.bt span{font-size:11px;color:var(--steel)}
.add{flex:none;min-width:38px;height:38px;padding:0 8px;border-radius:var(--r-s);border:1.5px solid var(--acc);color:var(--acc-s);font-size:20px;line-height:1}
.add:hover{background:var(--acc-bg)}
.add.on{background:var(--acc-s);border-color:var(--acc-s);color:#fff;font-size:14px;font-weight:700}
.more-btn{display:block;margin:18px auto 0;height:42px;padding:0 22px;border:1px solid var(--line);background:var(--surf);border-radius:var(--r-s);color:var(--ink2)}
.empty{text-align:center;color:var(--steel);padding:60px 20px;font-size:14px;line-height:1.6}
.empty b{display:block;color:var(--ink);font-size:16px;margin-bottom:6px}
mark{background:#FFF1A8;color:inherit;border-radius:2px}

/* KP panel */
.kp{position:sticky;top:var(--hh);height:calc(100dvh - var(--hh));background:var(--surf);border-left:1px solid var(--line);display:flex;flex-direction:column}
.kp-h{display:flex;align-items:center;gap:8px;padding:16px 18px 10px}
.kp-h h2{font-size:17px;flex:1}
.kp-h .lnk{font-size:12.5px;color:var(--steel)}
.kp-h .lnk:hover{color:var(--red)}
.kp-x{display:none;width:34px;height:34px;border-radius:50%;background:var(--bg);font-size:15px}
.kp-f{padding:0 18px 8px;display:grid;gap:8px}
.fld{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:var(--r-s);padding:0 10px;height:40px;font-size:13px;color:var(--steel)}
.fld:focus-within{border-color:var(--acc)}
.fld input{flex:1;min-width:0;border:0;outline:0;background:none;color:var(--ink);font-size:14px;height:100%}
.fld input[type=number]{text-align:right;max-width:70px;font-weight:700}
.fld small{white-space:nowrap}
.kp-list{flex:1;overflow:auto;padding:0 18px;overscroll-behavior:contain}
.kr{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.kph{width:48px;height:48px;flex:none;display:flex;align-items:center;justify-content:center}
.kph img{max-width:46px;max-height:46px;object-fit:contain}
.kph .noimg{width:40px;height:40px;background-size:22px}
.kb{flex:1;min-width:0}
.kb .sku{display:block;max-width:100%;text-align:left;font-weight:700;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kd{font-size:11.5px;color:var(--steel);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:1px 0 6px}
.kq{display:flex;align-items:center;gap:8px}
.kq b{margin-left:auto;font-size:13.5px;white-space:nowrap}
.kq .u{font-size:11px;color:var(--steel);white-space:nowrap}
.kx{width:26px;height:26px;border-radius:50%;color:var(--steel);flex:none;font-size:12px}
.kx:hover{background:var(--bg);color:var(--red)}
.stp{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-s);height:40px;background:var(--surf)}
.stp button{width:36px;height:100%;font-size:18px;color:var(--ink2)}
.stp input{width:44px;text-align:center;border:0;outline:0;font-weight:700;background:none;height:100%;-moz-appearance:textfield}
.stp input::-webkit-inner-spin-button,.stp input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.stp.sm{height:30px}
.stp.sm button{width:28px;font-size:16px}
.stp.sm input{width:34px;font-size:13px}
.kp-s{padding:12px 18px 0;font-size:13px;border-top:1px solid var(--line)}
.kp-s div{display:flex;justify-content:space-between;padding:3px 0;color:var(--ink2)}
.kp-s .t{font-size:19px;font-weight:700;color:var(--ink);padding-top:8px}
.kp-s .note{font-size:11.5px;color:var(--steel);display:block}
.kp-a{display:flex;gap:8px;padding:12px 18px calc(16px + var(--sab))}
.kp-a button{flex:1;height:44px;border-radius:var(--r-s);font-weight:600;font-size:13.5px;border:1.5px solid var(--line);color:var(--ink2)}
.kp-a button:hover{border-color:var(--acc)}
.kp-a .p{background:var(--acc-s);border-color:var(--acc-s);color:#fff}
.kp-a button:disabled{opacity:.45;cursor:default}
.kp-empty{color:var(--steel);text-align:center;padding:40px 10px;line-height:1.6;font-size:13.5px}

/* tablet bar / scrim / tabbar */
.kpbar{position:fixed;left:var(--side);right:0;bottom:0;z-index:30;background:var(--ink);color:#fff;display:none;align-items:center;gap:14px;padding:12px 24px calc(12px + var(--sab));font-size:14px}
.kpbar b{font-size:18px}
.kpbar button{margin-left:auto;background:var(--acc-s);color:#fff;height:40px;padding:0 18px;border-radius:var(--r-s);font-weight:600}
.scrim{position:fixed;inset:0;background:rgba(10,24,32,.45);z-index:45;opacity:0;pointer-events:none;transition:opacity .2s}
.tabbar{display:none}

/* sheet */
.sheet{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center}
.sh-bg{position:absolute;inset:0;background:rgba(10,24,32,.5)}
.sh-box{position:relative;background:var(--surf);border-radius:16px;width:min(880px,calc(100% - 40px));max-height:calc(100dvh - 60px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-template-rows:1fr auto;overflow:hidden;box-shadow:0 20px 60px rgba(10,24,32,.3)}
.sh-x{position:absolute;right:12px;top:12px;width:36px;height:36px;border-radius:50%;background:var(--bg);z-index:2;font-size:15px}
.sh-ph{background:var(--bg);display:flex;align-items:center;justify-content:center;padding:24px;min-height:300px;cursor:zoom-in}
.sh-ph img{max-height:360px;object-fit:contain}
.sh-ph .noimg{width:120px;height:120px;background-size:56px}
.sh-in{padding:24px 24px 16px;overflow:auto}
.sh-g{font-size:12px;color:var(--steel);margin-bottom:6px;padding-right:40px}
.sh-in h2{font-size:19px;letter-spacing:-.2px;display:flex;align-items:center;gap:6px;word-break:normal;overflow-wrap:anywhere}
.icon{width:30px;height:30px;border-radius:var(--r-s);color:var(--steel);font-size:15px;flex:none}
.icon:hover{background:var(--bg);color:var(--ink)}
.sh-d{margin:8px 0 12px;color:var(--ink2);font-size:14px}
.tags{display:flex;flex-wrap:wrap;gap:5px}
.tags span{font-size:12px;background:var(--bg);border-radius:6px;padding:4px 8px;color:var(--ink2)}
.meta{display:flex;gap:18px;margin-top:14px;flex-wrap:wrap;font-size:12.5px}
.meta dt{color:var(--steel)}
.meta dd{font-weight:600}
.sh-buy{grid-column:1/-1;display:flex;align-items:center;gap:12px;padding:14px 24px calc(14px + var(--sab));border-top:1px solid var(--line);background:var(--surf)}
.sh-buy .pp b{font-size:22px;display:block;line-height:1.1}
.sh-buy .pp span{font-size:11.5px;color:var(--steel)}
.sh-buy .fav{margin-left:auto;width:44px;height:44px;border-radius:var(--r-s);border:1px solid var(--line);font-size:19px;color:var(--steel)}
.sh-buy .fav.on{color:var(--red);border-color:#F3B7BD}
.btn{height:44px;padding:0 22px;border-radius:var(--r-s);background:var(--acc-s);color:#fff;font-weight:600;white-space:nowrap}
.btn:hover{filter:brightness(1.05)}

.zoom{position:fixed;inset:0;z-index:70;background:#fff;display:flex;align-items:center;justify-content:center;cursor:zoom-out;padding:20px}
.zoom img{max-width:100%;max-height:100%;object-fit:contain}

/* menu, toast */
.menu{position:fixed;z-index:65;top:calc(var(--hh) - 4px);right:16px;width:290px;background:var(--surf);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 12px 40px rgba(10,24,32,.18);padding:6px}
.menu button,.menu .mi{display:block;width:100%;text-align:left;padding:10px 12px;border-radius:var(--r-s);font-size:13.5px}
.menu button:hover{background:var(--bg)}
.menu small{display:block;color:var(--steel);font-size:11.5px;margin-top:2px}
.menu .mi{color:var(--steel);font-size:12px;border-top:1px solid var(--line);margin-top:4px;border-radius:0}
.prog{height:4px;background:var(--bg);border-radius:2px;margin-top:6px;overflow:hidden}
.prog i{display:block;height:100%;background:var(--acc);width:0;transition:width .2s}
.toast{position:fixed;left:50%;bottom:calc(24px + var(--sab));transform:translateX(-50%);z-index:80;background:var(--ink);color:#fff;padding:11px 16px;border-radius:var(--r);font-size:13.5px;box-shadow:0 8px 24px rgba(10,24,32,.25);width:max-content;max-width:min(480px,calc(100% - 32px));display:flex;align-items:center;gap:12px}
.toast button{color:#8FD8F2;font-weight:600}

/* ============ tablet ============ */
@media (max-width:1200px){
  .main{grid-template-columns:var(--side) minmax(0,1fr)}
  .kp{position:fixed;top:0;right:0;bottom:0;height:auto;width:min(420px,100%);z-index:50;transform:translateX(105%);transition:transform .25s ease;box-shadow:-12px 0 40px rgba(10,24,32,.15);padding-top:var(--sat)}
  body.kp-open .kp{transform:none}
  body.kp-open .scrim{opacity:1;pointer-events:auto}
  .kp-x{display:block}
  .kpbar:not([hidden]){display:flex}
  .view{padding-bottom:90px}
  .date,#kpSum{display:none}
  .toast{bottom:calc(80px + var(--sab))}
}
@media (max-width:900px) and (min-width:601px){
  :root{--side:200px}
  .top{gap:12px;padding-left:16px;padding-right:16px}
  .hbtn.fav-l{display:none}
}

/* ============ phone ============ */
@media (max-width:600px){
  :root{--r:10px}
  .top{flex-wrap:wrap;gap:8px 10px;padding:calc(8px + var(--sat)) 14px 10px}
  .logo .it{height:26px}.logo .dh{height:21px}
  .date{display:block;margin-left:auto;font-size:10.5px}
  .srch{order:3;flex-basis:100%;max-width:none;height:40px}
  .hr{display:none}
  .main{grid-template-columns:minmax(0,1fr)}
  .side,.kpbar{display:none!important}
  .view{padding:14px 12px calc(96px + var(--sab))}
  .kp{width:100%;transform:translateY(105%);box-shadow:none}
  .kp-h{padding-top:14px}
  .ttl h1,.hero h1{font-size:20px}
  .ttl .back{display:flex}
  .ttl{gap:8px}
  .fbar{flex-basis:100%;margin-left:0;gap:6px}
  .fbar>.ddw,.fbar>.sort{flex:1;min-width:0}
  .fbar .dd{width:100%;max-width:none;justify-content:space-between}
  .sort{width:100%}
  .chips{flex-wrap:nowrap;overflow-x:auto;margin:0 -12px 14px;padding:0 12px;scrollbar-width:none}
  .chips::-webkit-scrollbar{display:none}
  .cats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .catc{height:112px;padding:11px}
  .catc b{font-size:13.5px;max-width:62%}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .card{padding:9px}
  .card .ph{height:104px;margin-bottom:8px}
  .card .im{max-height:96px}
  .card .sku{font-size:12px}
  .card .ds{font-size:11.5px}
  .bt b{font-size:14px}
  .add{min-width:34px;height:34px}
  .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:35;background:var(--surf);border-top:1px solid var(--line);padding:8px 0 calc(8px + var(--sab));justify-content:space-around}
  .tabbar a,.tabbar button{position:relative;text-align:center;font-size:10.5px;color:var(--steel);min-width:64px}
  .tabbar svg{display:block;width:26px;height:26px;margin:0 auto 3px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .tabbar .on svg{stroke-width:2.1}
  .tabbar .on[data-tab="fav"] svg{fill:currentColor}
  .tabbar .on{color:var(--acc-s)}
  .tabbar em{position:absolute;top:-5px;left:calc(50% + 7px);background:var(--acc-s);color:#fff;font-style:normal;font-size:10px;font-weight:700;border-radius:9px;padding:1px 6px}
  .sheet{align-items:flex-end}
  .sh-box{width:100%;max-height:94dvh;border-radius:16px 16px 0 0;grid-template-columns:1fr;grid-template-rows:auto;overflow:auto}
  .sh-ph{min-height:0;height:230px;padding:16px}
  .sh-ph img{max-height:200px}
  .sh-in{padding:16px;overflow:visible}
  .sh-buy{position:sticky;bottom:0;padding:12px 16px calc(12px + var(--sab));gap:8px}
  .sh-buy .pp b{font-size:19px}
  .sh-buy .fav{width:40px;height:40px}
  .btn{padding:0 16px}
  .menu{left:12px;right:12px;width:auto;top:calc(var(--hh) - 4px);bottom:auto}
  .toast{bottom:calc(84px + var(--sab))}
}

/* фильтр «Серия» */
.fbar{display:flex;align-items:center;gap:8px;margin-left:auto}
.ddw{position:relative}
.dd{display:inline-flex;align-items:center;gap:10px;height:38px;padding:0 14px;border:1px solid var(--line);background:var(--surf);border-radius:var(--r-s);font-size:13.5px;color:var(--ink2);max-width:min(420px,70vw)}
.dd span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dd b{font-weight:400;color:var(--steel);font-size:11px;transition:transform .15s}
.dd:hover{border-color:var(--acc)}
.dd.act{border-color:var(--acc);background:var(--acc-bg);color:var(--acc-s);font-weight:700}
.ddw.open .dd{box-shadow:0 0 0 3px rgba(27,168,216,.18)}
.ddw.open .dd b{transform:rotate(180deg)}
.pop{position:absolute;top:44px;left:0;z-index:25;width:360px;max-height:min(520px,calc(100dvh - var(--hh) - 140px));display:flex;flex-direction:column;background:var(--surf);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 14px 40px rgba(10,24,32,.18)}
.pop-h{display:none}
.pop-l{overflow:auto;padding:6px;overscroll-behavior:contain}
.ck,.ckh{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:8px 10px;border-radius:var(--r-s);font-size:13.5px;color:var(--ink)}
.ck:hover,.ckh:hover{background:var(--bg)}
.ck i,.ckh i{width:18px;height:18px;border:1.5px solid #B9C8D0;border-radius:5px;flex:none;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:12px;color:#fff;background:var(--surf)}
.ck.on i,.ckh.on i{background:var(--acc-s);border-color:var(--acc-s)}
.ck.on i::after,.ckh.on i::after{content:"✓"}
.ckh.part i{border-color:var(--acc-s)}
.ckh.part i::after{content:"";width:8px;height:2px;background:var(--acc-s)}
.ck.on span{font-weight:700}
.ck em,.ckh em{margin-left:auto;font-style:normal;color:var(--steel);font-size:12px;padding-left:14px}
.ckh{font-weight:700;font-size:12.5px;margin-top:4px}
.ckh:first-child{margin-top:0}
.ck.sub{padding-left:22px}
.pf{display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid var(--line);padding:10px 12px}
.pf .lnk,.ftags .lnk{color:var(--steel);font-size:13px}
.pf .lnk:hover,.ftags .lnk:hover{color:var(--red)}
.pf .ok{background:var(--acc-s);color:#fff;border-radius:var(--r-s);height:36px;padding:0 16px;font-size:13px;font-weight:700}
.ftags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:-4px 0 14px}
.ftags button:not(.lnk){background:var(--ink);color:#fff;border-radius:16px;padding:5px 11px;font-size:12.5px}
.ftags button i{font-style:normal;opacity:.7;margin-left:4px;font-size:11px}
@media (max-width:600px){
  .ddw.open::before{content:"";position:fixed;inset:0;background:rgba(10,24,32,.45);z-index:54}
  .pop{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;max-height:82dvh;border-radius:16px 16px 0 0;z-index:55;border:0}
  .pop-h{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 4px}
  .pop-h b{font-size:17px}
  .pop-x{width:34px;height:34px;border-radius:50%;background:var(--bg);font-size:14px}
  .pop-l{padding:4px 8px}
  .ck,.ckh{padding:10px}
  .pf{padding:12px 16px calc(12px + var(--sab))}
  .pf .ok{height:44px;flex:1;max-width:240px}
}

/* характеристики на карточке */
.cb{display:flex;gap:6px;flex:none}
.inf{width:38px;height:38px;border-radius:var(--r-s);border:1.5px solid var(--line);color:var(--steel);font:italic 700 16px Georgia,"Times New Roman",serif}
.inf:hover{border-color:var(--acc);color:var(--acc-s)}
.inf.on{background:var(--ink);border-color:var(--ink);color:#fff}
.spv{position:absolute;inset:0;z-index:3;background:var(--surf);border:1.5px solid var(--acc);border-radius:var(--r);padding:10px 12px 12px;display:flex;flex-direction:column;animation:spv .15s ease-out}
@keyframes spv{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.spv-h{display:flex;align-items:center;gap:8px}
.spv-h b{flex:1;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.spv-h button{width:28px;height:28px;border-radius:50%;background:var(--bg);font-size:12px;flex:none}
.spv-d{font-size:11.5px;color:var(--steel);margin:2px 0 6px}
.spv ul{list-style:none;flex:1;overflow:auto;font-size:12px;line-height:1.35;overscroll-behavior:contain}
.spv li{padding:3px 0 3px 12px;position:relative;border-bottom:1px solid var(--bg)}
.spv li::before{content:"";position:absolute;left:2px;top:9px;width:4px;height:4px;border-radius:50%;background:var(--acc)}
.spv-more{margin-top:8px;height:34px;border-radius:var(--r-s);background:var(--acc-bg);color:var(--acc-s);font-weight:700;font-size:12.5px}
@media (max-width:600px){.inf{width:34px;height:34px;font-size:15px}.cb{gap:4px}.bt b{font-size:13px}.spv{padding:8px 9px 9px}.spv ul{font-size:11.5px}}

/* сенсорные экраны: поля 16px — iOS не увеличивает страницу при фокусе; без «залипающих» hover */
@media (pointer:coarse){
  input,select,textarea{font-size:16px!important}
  .stp input{width:46px}
  .stp.sm input{width:40px}
}
@media (hover:none){
  .side a:hover,.hbtn:hover,.add:hover,.icon:hover,.kx:hover,.ck:hover,.ckh:hover,.menu button:hover{background:transparent}
  .add.on:hover{background:var(--acc-s)}
  .catc:hover,.dd:hover,.sort:hover,.inf:hover,.kp-a button:hover{border-color:var(--line)}
  .dd.act:hover{border-color:var(--acc)}
  .kp-a .p:hover{border-color:var(--acc-s)}
  .inf:hover{color:var(--steel)}
  .inf.on:hover{color:#fff;border-color:var(--ink)}
  .kx:hover{color:var(--steel)}
  .btn:hover{filter:none}
}

/* узкие телефоны (320–380px) */
@media (max-width:380px){
  .sh-buy{flex-wrap:wrap;row-gap:10px}
  .sh-buy .pp{flex:1 1 calc(100% - 60px)}
  .sh-buy .stp{order:3}
  .sh-buy .btn{order:4;flex:1}
  .catc img{width:38%;height:62%}
  .catc b{max-width:66%;font-size:13px}
  .kp-h h2{font-size:16px}
}
/* плашка установки */
.ib{position:fixed;left:10px;right:10px;z-index:58;background:#fff;border-radius:16px;box-shadow:0 10px 36px rgba(10,24,32,.28);padding:14px 14px 14px;font-family:inherit;color:#16323F;animation:ibIn .25s ease-out}
.ib.ibb{bottom:calc(16px + env(safe-area-inset-bottom,0px))}
@media (max-width:600px){.ib.ibb{bottom:calc(86px + env(safe-area-inset-bottom,0px))}}
@media (min-width:601px){.ib{left:auto;right:16px;width:380px}}
.ib.ibt{top:calc(8px + env(safe-area-inset-top,0px))}
@keyframes ibIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.ib-r{display:flex;align-items:center;gap:12px}
.ib-ic{width:48px;height:48px;border-radius:11px;flex:none;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.ib-t{flex:1;min-width:0}.ib-t b{display:block;font-size:15px}.ib-t span{font-size:12.5px;color:#7A8C96;line-height:1.3;display:block;margin-top:1px}
.ib-x{position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:#F2F6F8;color:#7A8C96;font-size:12px;border:0}
.ib-go{margin-top:12px;display:flex;gap:8px}.ib-go button{flex:1;height:44px;border-radius:10px;border:0;font-weight:700;font-size:15px}
.ib-go .p{background:#0C83B0;color:#fff}.ib-go .s{background:#F2F6F8;color:#3E5663}
.ib-x{cursor:pointer}
.ib-st{margin-top:12px;display:grid;gap:8px}
.ib-st div{display:flex;align-items:center;gap:10px;font-size:14px;background:#F2F6F8;border-radius:10px;padding:9px 12px}
.ib-st i{font-style:normal;width:22px;height:22px;border-radius:50%;background:#0C83B0;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:none}
.ib-st svg{width:22px;height:22px;flex:none;fill:none;stroke:#0A84FF;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ib-st b{font-weight:700}
.ib-ar{position:absolute;left:50%;transform:translateX(-50%);width:0;height:0;border:10px solid transparent}
.ib.ibb .ib-ar{bottom:-20px;border-top-color:#fff}
.ib.ibt .ib-ar{top:-20px;border-bottom-color:#fff}
.ib-ar.r{left:auto;right:18px;transform:none}

/* меню «⋯» на телефоне */
@media (max-width:600px){
  .top{position:sticky}
  .hr{display:flex!important;position:absolute;right:6px;top:calc(4px + var(--sat));margin:0}
  .hr>*:not(#menuBtn){display:none!important}
  #menuBtn{width:40px;height:40px;justify-content:center;padding:0}
  .date{margin-right:40px}
}
/* выбор количества */
.qp{position:absolute;left:-1px;right:-1px;bottom:-1px;z-index:4;background:var(--surf);border:1.5px solid var(--acc);border-radius:var(--r);padding:12px;box-shadow:0 -10px 30px rgba(10,24,32,.12);animation:spv .15s ease-out}
.qp-h{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.qp-h b{flex:1;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qp-h button{width:26px;height:26px;border-radius:50%;background:var(--bg);font-size:11px;color:var(--steel)}
.qp .stp{width:100%;height:44px}
.qp .stp button{width:44px;font-size:20px}
.qp .stp{display:flex}.qp .stp button{flex:none}.qp .stp input{flex:1;width:auto;min-width:0;font-size:18px}
.qp-q{display:flex;gap:6px;margin:8px 0 10px}
.qp-q button{flex:1;height:32px;border-radius:8px;background:var(--bg);font-size:13px;color:var(--ink2);border:1px solid transparent}
.qp-q button.on{border-color:var(--acc);background:var(--acc-bg);color:var(--acc-s);font-weight:700}
.qp-q small{display:block;font-size:9.5px;color:var(--steel);margin-top:-2px}
.qp-go{width:100%;height:44px;border-radius:var(--r-s);background:var(--acc-s);color:#fff;font-weight:700;font-size:14px}
.qp-go span{font-weight:400;opacity:.85;margin-left:4px}
.qp-del{width:100%;margin-top:6px;height:32px;font-size:12.5px;color:var(--steel)}
.qs-bg{position:fixed;inset:0;background:rgba(10,24,32,.45);z-index:60}
.qs{position:fixed;left:0;right:0;bottom:0;z-index:61;box-shadow:0 -10px 30px rgba(10,24,32,.2);background:#fff;border-radius:18px 18px 0 0;padding:14px 16px calc(16px + env(safe-area-inset-bottom,0px));animation:ibIn .2s ease-out}
.qs .it{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.qs .it img{width:56px;height:56px;object-fit:contain;background:var(--bg);border-radius:10px;padding:4px}
.qs .it b{display:block;font-size:14px}.qs .it span{font-size:12.5px;color:var(--steel)}
.qs .x{position:absolute;right:12px;top:12px;width:32px;height:32px;border-radius:50%;background:var(--bg);font-size:13px}
.qs .stp{width:100%;height:52px}.qs .stp button{width:56px;font-size:24px}.qs .stp{display:flex}.qs .stp button{flex:none}.qs .stp input{flex:1;width:auto;min-width:0;font-size:22px}
.qs .qp-q button{height:38px;font-size:14px}
.qs .qp-go{height:50px;font-size:15.5px;margin-top:4px}
.qp-go:disabled{opacity:.45}
.qs .it img,.qs .it .noimg{flex:none}
.qs .it .noimg{width:56px;height:56px;border-radius:10px}
.qs .it>div{min-width:0}.qs .it b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:36px}
@media (pointer:coarse){.qp .stp input{font-size:18px!important}.qs .stp input{font-size:22px!important}}
/* диагностика */
.sh-box.diag{grid-template-columns:1fr;max-width:460px}
.diag h2{margin-bottom:12px}
.diag table{width:100%;border-collapse:collapse;font-size:13px}
.diag td{padding:7px 0;border-bottom:1px solid var(--line);vertical-align:top}
.diag td:first-child{color:var(--steel);padding-right:12px;width:48%}
.diag td:last-child{font-weight:600}
.dg-a{display:flex;align-items:center;gap:16px;margin-top:16px}
.dg-a .lnk,.menu .mi .lnk{color:var(--acc-s);font-size:12px;text-decoration:underline;padding:0;display:inline}
@media (max-width:600px){.sh-box.diag{max-height:80dvh}}

/* ===== режим монтажника ===== */
:root{--buy:#1E8E5A;--buy-bg:#E6F5EC;--red2:#C0392B}
.buy{color:var(--buy)!important;font-weight:700;font-style:normal}
.hbtn.buyb svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.hbtn.buyb{border:1px solid var(--line);color:var(--steel);font-weight:700}
.hbtn.buyb.on{background:var(--buy-bg);border-color:#BFE3CD;color:var(--buy)}
@media (max-width:600px){.hr>#buyBtn:not([hidden]){display:inline-flex!important;height:32px;padding:0 9px;font-size:12px}.hr{gap:4px}.date{margin-right:120px}}
.kp-srv{display:flex;align-items:center;gap:8px;padding:0 18px 8px;font-size:13px;color:var(--ink2)}
.kp-srv span{flex:1;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kp-srv select{height:32px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--surf);padding:0 8px;font-size:13px;color:var(--ink)}
.kdisc{height:30px;padding:0 8px;border-radius:var(--r-s);border:1px dashed var(--line);font-size:12px;color:var(--steel);white-space:nowrap}
.kdisc.on{border-style:solid;color:var(--acc-s)}
.kdisc.own{border:1px solid var(--acc);background:var(--acc-bg);color:var(--acc-s);font-weight:700}
.ku{font-size:11.5px;color:var(--steel);margin-top:4px}
.ku s{opacity:.7}
.ku .buy{margin-left:6px}
.kp-s .red{color:var(--red2)}
.kp-s .bz{background:var(--buy-bg);color:var(--buy);border-radius:var(--r-s);padding:6px 8px;margin-top:6px;font-weight:700}
.kp-s .bz+.bz{margin-top:3px}
.kp-a2{padding-top:0}
.kp-a .g{border-color:var(--buy);color:var(--buy)}
.kp-a .g:hover{background:var(--buy-bg)}
/* модальное окно */
.sh-box.md{grid-template-columns:1fr;max-width:460px}
.sh-box.md .sh-in{padding:22px 22px 18px}
.sh-box.md h2{font-size:19px;margin-bottom:6px;padding-right:40px}
.mp{font-size:13.5px;color:var(--ink2);line-height:1.5;margin-bottom:12px}
.mp.sm{font-size:12px;color:var(--steel);margin-top:12px}
.md-q{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.md-q button{flex:1;min-width:56px;height:38px;border-radius:var(--r-s);background:var(--bg);font-weight:700;color:var(--ink2)}
.md-q button.on{background:var(--acc-bg);color:var(--acc-s);outline:1.5px solid var(--acc)}
.md-a{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px}
.btn.g{background:var(--buy);color:#fff}
.btn.sm{height:36px;padding:0 14px;font-size:13px;display:inline-flex;align-items:center}
.btn.wide{width:100%;display:flex;align-items:center;justify-content:center;height:48px;margin-top:6px}
.btn2{height:44px;border-radius:var(--r-s);border:1.5px solid var(--line);font-weight:700;color:var(--ink2)}
.btn2.wide{width:100%;margin-top:8px}
.lnk{color:var(--steel);font-size:13px;text-decoration:underline}
.lnk.red,.red{color:var(--red2)!important}
.fl{display:block;margin-bottom:10px}
.fl span{display:block;font-size:12px;color:var(--steel);margin-bottom:4px}
.fl input,.fl textarea{width:100%;border:1px solid var(--line);border-radius:var(--r-s);padding:10px 12px;font-size:15px;background:var(--surf);outline:0;resize:vertical;font-family:inherit}
.fl input:focus,.fl textarea:focus{border-color:var(--acc)}
.sk-list{display:flex;flex-wrap:wrap;gap:6px;max-height:220px;overflow:auto;margin:4px 0 6px}
.sk-list button{padding:8px 12px;border-radius:18px;border:1px solid var(--line);font-size:13px}
.sk-list button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.od{background:var(--bg);border-radius:var(--r-s);padding:10px 12px;margin-bottom:12px}
.od div{display:flex;justify-content:space-between;gap:10px;padding:4px 0;font-size:13.5px}
.od .g,.cl-sum .g{color:var(--buy)}
/* кабинет */
.me-box{max-width:460px;background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.seg{display:flex;background:var(--bg);border-radius:var(--r-s);padding:3px;margin-bottom:14px}
.seg button{flex:1;height:38px;border-radius:6px;font-weight:700;color:var(--steel)}
.seg button.on{background:var(--surf);color:var(--ink);box-shadow:0 1px 3px rgba(10,24,32,.12)}
.me-ok{text-align:center}
.me-ok h2{font-size:20px;margin-bottom:6px}
.me-ic{width:70px;height:70px;border-radius:50%;margin:4px auto 14px;display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:700}
.me-ic.ok{background:var(--buy-bg);color:var(--buy)}.me-ic.wait{background:#FFF4D6}.me-ic.no{background:#FDECEA;color:var(--red2)}
.pill-buy{display:inline-block;background:var(--buy-bg);color:var(--buy);font-weight:700;border-radius:16px;padding:6px 14px;font-size:13.5px}
.me-a{margin-top:16px;display:flex;flex-direction:column;align-items:stretch;gap:4px}
.me-a .lnk{margin-top:10px}
.note-box{background:var(--bg);border-radius:var(--r-s);padding:10px 12px;text-align:left}
.cl-bar{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.chips2{display:flex;gap:6px;flex-wrap:wrap}
.chips2 button{font-size:12.5px;padding:6px 12px;border-radius:18px;background:var(--surf);border:1px solid var(--line);color:var(--ink2)}
.chips2 button em{font-style:normal;color:var(--steel);margin-left:3px}
.chips2 button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.chips2 button.on em{color:rgba(255,255,255,.7)}
.cl-q{margin-left:auto;height:36px;border:1px solid var(--line);border-radius:var(--r-s);padding:0 12px;font-size:14px;min-width:220px;background:var(--surf);outline:0}
.cl-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:10px;align-items:start}
.cli{background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;cursor:pointer}
.cli:hover{border-color:var(--acc)}
.cli .n{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.cli .n b{font-size:15px}.cli .n em{font-style:normal;color:var(--steel);font-size:12px;white-space:nowrap}
.cli .a{font-size:12.5px;color:var(--steel);margin:2px 0 4px}
.kpl{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:7px 0 2px;border-top:1px solid var(--bg);margin-top:5px;cursor:pointer}
.kpl .kn{color:var(--ink2);white-space:nowrap}
.kpl b{margin-left:auto;white-space:nowrap}
.kpl .pf{color:var(--buy);font-weight:700;min-width:78px;text-align:right;white-space:nowrap}
.stt{font-size:11px;font-weight:700;border-radius:10px;padding:2px 8px;white-space:nowrap}
.s-draft{background:#EEF1F3;color:#5E6E77}.s-sent{background:#FFF4D6;color:#9A6B00}.s-agreed{background:var(--acc-bg);color:var(--acc-s)}.s-ordered{background:#EDE7FB;color:#5B3FB8}.s-done{background:var(--buy-bg);color:var(--buy)}.s-cancel{background:#FDECEA;color:var(--red2)}
.cl-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:14px;align-items:start}
.cl-card{background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.cl-card h3{font-size:15px;margin-bottom:12px}.cl-card h3 em{font-style:normal;color:var(--steel);font-weight:400}
.cl-sum{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--ink2);margin-bottom:6px}
.kpc{border-top:1px solid var(--line);padding:4px 0 8px}
.kpc .kpl{border:0}
.kpc-a{display:flex;gap:6px;margin-top:4px}
.kpc-a button{font-size:12px;padding:5px 10px;border-radius:6px;background:var(--bg);color:var(--ink2)}
@media (max-width:900px){.cl-grid{grid-template-columns:1fr}}
@media (max-width:600px){.cl-q{margin-left:0;flex-basis:100%;min-width:0;height:40px}.cl-list{grid-template-columns:1fr}.me-box{padding:16px}.kpl{flex-wrap:wrap}.kpl b{margin-left:auto}}

/* ===== кабинет монтажника v13 ===== */
@media (min-width:1201px){body.cab-wide .main{grid-template-columns:var(--side) minmax(0,1fr)}body.cab-wide .kp{display:none}}
@media (max-width:1200px){body.cab-wide .kpbar{display:none!important}body.cab-wide .view{padding-bottom:40px}}
@media (max-width:600px){body.cab-wide .view{padding-bottom:calc(110px + var(--sab))}body.cab-wide.add-mode .view{padding-bottom:calc(180px + var(--sab))}
  .view .w-tot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.view .w-tot .tb{min-width:0;padding:10px 12px}.view .w-tot .tb b{font-size:17px}.view .w-tot .tb small{font-size:11px;display:block;line-height:1.3}
  .ord-pg .w-tools{flex-direction:column;align-items:stretch;gap:8px;margin:10px 0}.ord-pg .w-tools .btn2{justify-content:center}
  .ord-pg .w-act{gap:6px}.ord-pg .w-act button{height:44px;font-size:13px}
  .ord-pg .ttl{gap:6px 8px}.ord-pg .ttl h1{font-size:19px}}
.mc{display:grid;gap:8px}
.mci{display:flex;gap:10px;background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:11px 12px;cursor:pointer}
.mci .l{flex:1;min-width:0}.mci .l b{display:block;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mci small{display:block;color:var(--steel);font-size:12px;margin-top:2px}
.mci .ps{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}
.mci .rr{text-align:right;white-space:nowrap;display:flex;flex-direction:column;gap:3px}.mci .rr b{font-size:14.5px}.mci .rr .g{font-size:13px}
.side .sh{font-size:11px;color:var(--steel);text-transform:uppercase;letter-spacing:.5px;padding:14px 18px 4px}
.cab-t{display:flex;align-items:center;gap:4px;border-bottom:1px solid var(--line);margin:-4px 0 16px;flex-wrap:wrap}
.cab-t a{padding:10px 16px;font-weight:700;color:var(--steel);border-bottom:3px solid transparent;margin-bottom:-1px}
.cab-t a.on{color:var(--ink);border-color:var(--acc)}
.cab-who{margin-left:auto;font-size:12px;color:var(--buy);font-weight:700;background:var(--buy-bg);border-radius:14px;padding:5px 10px;white-space:nowrap}
.tw{overflow-x:auto;border-radius:var(--r);border:1px solid var(--line);background:var(--surf)}
.ct{width:100%;border-collapse:collapse;font-size:13.5px}
.ct th{text-align:left;font-size:12px;color:var(--steel);font-weight:400;padding:10px 12px;background:#FAFCFD;border-bottom:1px solid var(--line);white-space:nowrap}
.ct td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.ct tbody tr:last-child td{border-bottom:0}
.ct td small{display:block;color:var(--steel);font-size:12px;margin-top:1px}
.ct .r{text-align:right;white-space:nowrap}.ct .c{text-align:center}
.ct tbody tr[data-kpopen],.ct tbody tr[data-cl]{cursor:pointer}
.ct tbody tr[data-kpopen]:hover td,.ct tbody tr[data-cl]:hover td{background:#F7FBFD}
.mut{color:var(--steel)}.g{color:var(--buy);font-weight:700}
p.mut.sm{font-size:12.5px;margin-top:10px;line-height:1.5}
.o-new{background:#FDECEA;color:var(--red2)}.o-work{background:#FFF4D6;color:#9A6B00}.o-done{background:var(--buy-bg);color:var(--buy)}.o-cancel{background:#EEF1F3;color:#5E6E77}
.chips2{margin-bottom:12px}
.seg2{display:inline-flex;background:var(--surf);border:1px solid var(--line);border-radius:var(--r-s);padding:3px}
.seg2 button{padding:6px 14px;border-radius:6px;font-size:13px;color:var(--steel);font-weight:700}
.seg2 button.on{background:var(--ink);color:#fff}
.rp-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.rc{background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.rc span{font-size:12.5px;color:var(--steel);display:block}.rc b{display:block;font-size:24px;margin:4px 0 2px;white-space:nowrap}.rc small{font-size:11.5px;color:var(--steel)}
.rc.g{background:var(--buy-bg);border-color:#BFE3CD}.rc.g b{color:var(--buy)}
.rc.b{background:var(--acc-bg);border-color:#BDE3F3}.rc.b b{color:var(--acc-s)}
.rp-two{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:12px}
.rbox{background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.rbox h3{font-size:14px;margin-bottom:10px}.rbox h3.mt{margin-top:16px}
.chart{display:flex;align-items:flex-end;gap:12px;height:200px}
.bc{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;min-width:0}
.bar{width:100%;max-width:54px;background:linear-gradient(180deg,#2FBE7A,#1E8E5A);border-radius:6px 6px 0 0}
.bv{font-size:11.5px;font-weight:700;color:var(--buy);margin-bottom:4px;white-space:nowrap}.bl{font-size:12px;color:var(--steel);margin-top:6px}
.fn div{display:grid;grid-template-columns:150px 1fr 34px;align-items:center;gap:8px;font-size:12.5px;margin-bottom:7px}
.fn i{display:block;height:14px;background:var(--acc);border-radius:7px;opacity:.85}.fn b{text-align:right}
.rtop div{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:6px 0;border-top:1px solid var(--bg)}.rtop b{color:var(--buy);white-space:nowrap}
/* широкое КП */
.w-cl{min-width:260px;margin:0}
.ct.kpw td.ph{width:56px}.ct.kpw td.ph img{width:44px;height:44px;object-fit:contain;display:block}.ct.kpw td.ph .noimg{width:40px;height:40px;background-size:22px}
.ct.kpw .sku{font-weight:700;font-size:13px;text-align:left}
.ct.kpw small{max-width:360px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ct .bu{background:var(--buy-bg);color:var(--buy);font-weight:700}
.w-tools{display:flex;align-items:center;gap:12px;margin:14px 0;flex-wrap:wrap}
.w-tools .fld{width:280px}
.w-tools .btn2{height:40px;padding:0 16px;display:inline-flex;align-items:center}
.w-tot{display:flex;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.w-tot .tb{flex:1;min-width:180px;background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.w-tot .tb span{font-size:12px;color:var(--steel);display:block}.w-tot .tb b{font-size:21px;display:block;margin-top:3px;white-space:nowrap}.w-tot .tb small{font-size:12px;color:var(--steel)}
.w-tot .tb.cl{background:var(--acc-bg);border-color:#BDE3F3}.w-tot .tb.cl b{color:var(--acc-s)}
.w-tot .tb.pr{background:var(--buy-bg);border-color:#BFE3CD}.w-tot .tb.pr b,.w-tot .tb.pr small{color:var(--buy)}
.w-act{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.w-act button{height:44px;padding:0 18px;border-radius:var(--r-s);font-weight:700;font-size:13.5px;border:1.5px solid var(--line);color:var(--ink2);background:var(--surf)}
.w-act .p{background:var(--acc-s);border-color:var(--acc-s);color:#fff}.w-act .g{border-color:var(--buy);color:var(--buy)}
.w-act button:disabled{opacity:.45}.w-act .sp{flex:1}
.kp-wide{margin-right:6px}
@media (max-width:1200px){.rp-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.rp-two{grid-template-columns:1fr}}
@media (max-width:600px){
  .kp-wide{display:none}
  .cab-t{margin:-6px -12px 12px;padding:0 4px;flex-wrap:nowrap}.cab-t a{flex:1;text-align:center;padding:10px 4px}.cab-who{display:none}
  .ttl .fbar .cl-q{flex:1;min-width:0}
  .rp-cards{gap:8px}.rc{padding:12px}.rc b{font-size:19px}
  .chart{height:150px;gap:6px}.fn div{grid-template-columns:110px 1fr 28px}
}

/* ===== заказ v14 ===== */
.ost{font-size:12.5px;color:var(--buy);font-weight:700;white-space:nowrap}
.o-it{font-size:13px;color:var(--ink2);margin:-4px 0 10px;display:flex;align-items:center;gap:8px}
.ol .or{background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:10px;margin-bottom:8px}
.ord-pg .w-tools .fld{width:260px}
.add-b{border-style:dashed!important;border-color:var(--acc)!important;color:var(--acc-s)!important;font-weight:700}
.pc-q{width:100%;height:42px;border:1px solid var(--line);border-radius:var(--r-s);padding:0 12px;font-size:15px;margin-bottom:8px;background:var(--bg);outline:0}
.pc-box{max-height:46vh;overflow:auto;display:grid;gap:6px;padding:2px}
.pc{display:flex;gap:10px;align-items:center;text-align:left;padding:10px;border:1px solid var(--line);border-radius:var(--r-s);width:100%}
.pc b{display:block;font-size:14px}.pc small{display:block;font-size:12px;color:var(--steel)}
.pc .rd{width:18px;height:18px;border-radius:50%;border:2px solid #B9C8D0;flex:none}
.pc.on{border-color:var(--acc);background:var(--acc-bg)}.pc.on .rd{border:5px solid var(--acc-s)}
.pc-new{padding:11px;border:1.5px dashed var(--acc);border-radius:var(--r-s);color:var(--acc-s);font-weight:700;width:100%}
.om{display:grid;gap:6px;margin-top:6px}.om button{text-align:left;padding:12px;border:1px solid var(--line);border-radius:var(--r-s);font-weight:700}
.addbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + var(--sab));z-index:44;width:min(560px,calc(100% - 20px));background:var(--ink);color:#fff;border-radius:14px;padding:10px 10px 10px 14px;display:flex;align-items:center;gap:8px;box-shadow:0 10px 30px rgba(10,24,32,.35)}
.ab-t{flex:1;min-width:0}.ab-t b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ab-t small{font-size:11.5px;color:#9FB3BD}
.ab-x{width:34px;height:34px;border-radius:50%;color:#9FB3BD}
.ab-ok{background:var(--acc);color:#fff;border-radius:9px;padding:0 16px;height:40px;font-weight:700}
body.add-mode .kpbar{display:none!important}
body.add-mode .toast{bottom:calc(96px + var(--sab))}
body.add-mode .view{padding-bottom:110px}
@media (max-width:600px){.addbar{bottom:calc(84px + var(--sab))}body.add-mode .toast{bottom:calc(160px + var(--sab))}body.add-mode .view{padding-bottom:180px}.ord-pg .ttl .fbar select{flex:1;min-width:0}.ord-pg .w-tools .fld{width:100%}.ord-pg .w-act button{flex:1;padding:0 8px}.ord-pg .w-act .sp{display:none}.ord-pg .w-act .g{flex-basis:100%}.ost{order:5}}
/* v18: шапки списков и кнопки окон на телефоне */
.ttl .ttl-btn{order:3;flex:none;white-space:nowrap}
.ttl .fsrch{order:2;margin-left:auto}
.btn{display:inline-flex;align-items:center;justify-content:center}
@media (max-width:600px){
  .ttl .ttl-btn{order:2;margin-left:auto}
  .ttl .fsrch{order:4;flex-basis:100%;margin-left:0}
  .ttl .fsrch .cl-q{flex:1 1 auto;width:100%;min-width:0}
  .chips2{flex-wrap:nowrap;overflow-x:auto;margin-left:-12px;margin-right:-12px;padding:0 12px 2px;scrollbar-width:none}
  .chips2::-webkit-scrollbar{display:none}
  .chips2 button{flex:none;white-space:nowrap}
  .md-a{flex-wrap:wrap}
  .md-a>span:empty{display:none}
  .md-a .btn{flex:1 1 100%;height:50px;font-size:15px}
  .md-a .lnk{order:2;margin:4px auto 0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{.top,.side,.kp,.tabbar,.kpbar{display:none!important}}