/* Admin, on top of site.css: same paper, type and lines, laid out as a working tool. */
.adm{background:var(--paper) url(../img/paper.webp) center/cover fixed;min-height:100vh;text-transform:none;letter-spacing:.02em}
.adm .sh,.adm-nav,.adm .uf > span:first-child,.adm .ubtn,.adm-sum span,.mc .kind,.mc .tag{text-transform:uppercase;letter-spacing:var(--ls)}
.adm-h{display:flex;align-items:center;gap:18px;padding:18px var(--pad-r) 18px var(--pad);border-bottom:1px solid var(--hair);position:sticky;top:0;z-index:5;background:rgba(246,243,236,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.adm-logo{width:34px;flex:0 0 auto}
.adm-t{font-weight:500;text-transform:uppercase;letter-spacing:var(--ls)}
.adm-demo{flex:1;color:var(--ink-3);font-size:11px}
.adm-w{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(24px,4vw,56px);padding:clamp(24px,3vw,40px) var(--pad-r) 80px var(--pad)}
.adm-nav{display:flex;flex-direction:column;border-top:1px solid var(--hair);align-self:start;position:sticky;top:90px}
.adm-nav button{display:grid;grid-template-columns:3ch 1fr auto;gap:12px;align-items:center;text-align:left;background:none;border:0;border-bottom:1px solid var(--hair);padding:13px 0;cursor:pointer;color:var(--ink);font:inherit;letter-spacing:inherit;text-transform:inherit}
.adm-nav button .n{color:var(--ink-3)}
.adm-nav button[aria-pressed="true"]{color:var(--accent-2)}
.adm-nav button:disabled{color:var(--ink-3);cursor:default}
.adm-nav em{font-style:normal;font-size:9.5px;opacity:.7}
.adm-m{min-width:0;padding-top:0!important}
.adm-m > section{margin:0;padding:0}
.adm-m > section > .sh:first-child{margin-top:0}
.adm-form{margin-top:28px;max-width:760px}
.adm-g{display:grid;grid-template-columns:1fr 1fr;gap:26px 22px}
.adm-g .w2{grid-column:1/-1}
.adm-note{color:var(--ink-2);font-size:12px;max-width:62ch;margin:18px 0 0}
.adm-sum{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);margin-top:26px}
.adm-sum:empty{display:none}
.adm-sum div{padding:14px 14px 14px 0;display:flex;flex-direction:column;gap:6px}
.adm-sum div + div{padding-left:14px;border-left:1px solid var(--hair)}
.adm-sum span{font-size:10.5px;color:var(--ink-3)}
.adm-sum b{font-weight:400;font-size:15px}
.adm-acts{display:flex;align-items:center;gap:26px;margin-top:26px}
.adm-acts .ubtn{width:auto;min-width:240px;margin:0}
.adm-c{display:grid;grid-template-columns:280px minmax(0,1fr);gap:clamp(20px,3vw,40px);margin-top:26px;align-items:start}
.adm-pages{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair);position:sticky;top:90px;max-height:calc(100vh - 120px);overflow:auto}
.adm-pages button{display:grid;grid-template-columns:3ch 1fr auto;gap:12px;align-items:center;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--hair);padding:11px 4px 11px 0;cursor:pointer;font:inherit;color:inherit;letter-spacing:inherit}
.adm-pages button[aria-pressed="true"]{color:var(--accent-2)}
.adm-pages .n{color:var(--ink-3)}
.adm-pages small{display:block;color:var(--ink-3);font-size:10.5px}
.adm-pages .ct{color:var(--ink-3);text-align:right;font-size:11px}
.adm-pages .ct i{display:block;font-style:normal;color:var(--accent-2)}
.pv-h{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:6px}
.pv-h h2{margin:0;font:400 clamp(26px,3vw,40px)/1 var(--hand)}
.grp{margin-top:30px}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:22px 18px;margin-top:18px}
.mc{margin:0;display:flex;flex-direction:column;gap:10px}
.mc .th{position:relative;aspect-ratio:4/3;border:1px solid var(--hair);background:repeating-conic-gradient(rgba(21,20,18,.05) 0 25%,transparent 0 50%) 0 0/16px 16px;display:grid;place-items:center;overflow:hidden}
.mc .th img,.mc .th video{max-width:100%;max-height:100%;object-fit:contain}
.mc.on .th{border-color:var(--accent-2)}
.mc .kind,.mc .tag{position:absolute;top:8px;font-size:9.5px;padding:2px 6px;background:rgba(246,243,236,.9)}
.mc .kind{left:8px;color:var(--ink-3)}
.mc .tag{right:8px;background:var(--accent-2);color:#fff}
.mc figcaption{display:flex;flex-direction:column;gap:3px;font-size:11.5px;word-break:break-word}
.mc figcaption b{font-weight:400}
.mc figcaption span{color:var(--ink-2)}
.mc figcaption .mut{color:var(--ink-3);font-size:10.5px}
.mc-a{display:flex;gap:16px;flex-wrap:wrap;font-size:11.5px}
.mc-a label{cursor:pointer}
.adm .toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--ink);color:var(--paper);padding:12px 18px;font-size:12px;z-index:20;max-width:calc(100vw - 40px)}
@media (max-width:999px){
  .adm-w{grid-template-columns:1fr}
  .adm-nav{position:static;flex-direction:row;overflow-x:auto;border:0;gap:18px}
  .adm-nav button{border:0;grid-template-columns:auto auto;white-space:nowrap}
  .adm-nav button em,.adm-nav button .n{display:none}
  .adm-c{grid-template-columns:1fr}
  .adm-pages{position:static;max-height:none}
  .adm-demo{display:none}
}
@media (max-width:640px){
  .adm-g{grid-template-columns:1fr}
  .adm-sum{grid-template-columns:1fr 1fr}
  .adm-sum div:nth-child(3){padding-left:0;border-left:0;border-top:1px solid var(--hair)}
  .adm-sum div:nth-child(4){border-top:1px solid var(--hair)}
  .adm-acts{flex-direction:column;align-items:stretch}
  .mgrid{grid-template-columns:1fr 1fr}
}
.mc .th.none video{display:none}
.mc .th.none::after{content:"Файла пока нет: загрузите видео";color:var(--ink-3);font-size:11px;text-align:center;padding:0 14px}
.mc-pp{font-size:11px;margin:0}
.mc-pp span{color:var(--ink-2)}

/* ---------- CRM: nav badges, tools, tables, drawer, chat, dashboard ---------- */
.adm-nav em.bd{font-style:normal;background:var(--accent-2);color:#fff;font-size:10px;min-width:18px;height:18px;padding:0 5px;display:inline-grid;place-items:center;opacity:1}
.adm-demo-bar{display:flex;gap:24px;align-items:center;justify-content:space-between;border:1px dashed rgba(21,20,18,.3);padding:12px 16px;margin-top:22px;font-size:12px;color:var(--ink-2)}
.adm-demo-bar p{margin:0;max-width:80ch}
.adm-demo-bar button{white-space:nowrap}
.adm-tools{display:flex;flex-wrap:wrap;gap:16px 26px;align-items:flex-end;margin-top:24px}
.adm-search{flex:0 1 320px;min-width:220px}
.adm-chips{display:flex;flex-wrap:wrap;gap:6px}
.adm-chips button{border:1px solid var(--hair);background:none;padding:6px 10px;font:inherit;font-size:11px;color:var(--ink-2);cursor:pointer;letter-spacing:.04em}
.adm-chips button i{font-style:normal;color:var(--ink-3);margin-left:4px}
.adm-chips button[aria-pressed="true"]{border-color:var(--ink);color:var(--ink)}
.adm-tools > .lnk{margin-left:auto}
.tbl-w{overflow-x:auto;margin-top:22px;-webkit-overflow-scrolling:touch}
.atbl{width:100%;border-collapse:collapse;font-size:12px;min-width:640px}
.atbl th{text-align:left;font-weight:400;color:var(--ink-3);font-size:10.5px;text-transform:uppercase;letter-spacing:var(--ls);padding:0 12px 10px 0;border-bottom:1px solid var(--line)}
.atbl td{padding:12px 12px 12px 0;border-bottom:1px solid var(--hair);vertical-align:top}
.atbl .r{text-align:right}
.atbl td small{display:block;color:var(--ink-3);font-size:10.5px;margin-top:3px}
.atbl td b{font-weight:500}
.atbl td.it{max-width:260px;color:var(--ink-2)}
.atbl tr[tabindex]{cursor:pointer;transition:background .2s}
.atbl tr[tabindex]:hover,.atbl tr[tabindex]:focus-visible{background:rgba(21,20,18,.035);outline:none}
.dot{display:inline-grid;place-items:center;min-width:17px;height:17px;padding:0 4px;background:var(--accent-2);color:#fff;font-size:10px;vertical-align:1px}
.st{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
.st::before{content:"";width:7px;height:7px;background:currentColor}
.st-new{color:var(--accent-2)}.st-paid{color:#2f5d8a}.st-making{color:#8a6a1f}.st-shipped{color:#5b4a8a}.st-delivered{color:#2f6b45}.st-cancelled{color:var(--ink-3)}
.st-draft{color:var(--ink-3)}.st-scheduled{color:#2f5d8a}.st-queued{color:#8a6a1f}.st-sent{color:#2f6b45}.st-sending{color:#8a6a1f}.st-failed{color:#b4261c}
.empty{margin-top:26px;padding:34px 20px;border:1px dashed var(--hair);text-align:center;color:var(--ink-3);font-size:12px}
.sw{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.sw input{position:absolute;opacity:0;width:1px;height:1px}
.sw span{width:30px;height:16px;border:1px solid var(--ink);position:relative;transition:background .2s}
.sw span::after{content:"";position:absolute;top:2px;left:2px;width:10px;height:10px;background:var(--ink);transition:transform .2s}
.sw input:checked + span{background:var(--ink)}
.sw input:checked + span::after{background:var(--paper);transform:translateX(14px)}
.sw input:focus-visible + span{outline:2px solid var(--focus);outline-offset:2px}
.sw small{color:var(--accent);font-size:10.5px}
.adm-g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.adm-g .chk{align-self:end;padding-bottom:12px}
.uf-ta textarea{width:100%;resize:vertical;border:0;background:transparent;font:inherit;color:inherit;padding:8px 0;letter-spacing:.01em;text-transform:none;outline:none;min-height:60px}
.sel-i{display:inline-flex;position:relative;align-items:center;gap:4px}
.sel-i select{position:absolute;inset:0;opacity:0;cursor:pointer}
/* drawer */
.adm-veil{position:fixed;inset:0;background:rgba(21,20,18,.28);z-index:30}
.adm-drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,100%);z-index:31;background:var(--paper) url(../img/paper.webp) center/cover;border-left:1px solid var(--line);overflow:auto;transform:translateX(102%);transition:transform .45s cubic-bezier(.2,.7,.2,1);padding:0 28px 60px;outline:none;text-transform:none;letter-spacing:.02em}
.adm-drawer.open{transform:none}
.dw-h{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;position:sticky;top:0;background:rgba(246,245,240,.94);padding:22px 0 16px;border-bottom:1px solid var(--hair);z-index:2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.dw-h h2{margin:6px 0 4px;font:400 clamp(26px,3vw,36px)/1 Anton,Impact,sans-serif;text-transform:uppercase;letter-spacing:.005em}
.dw-h p{margin:0;font-size:11px}
.dw-h .mut3:first-child{font-size:10.5px;text-transform:uppercase;letter-spacing:var(--ls)}
.dw-x{background:none;border:1px solid var(--hair);width:34px;height:34px;cursor:pointer;font-size:13px;color:var(--ink)}
.dw-x:hover{border-color:var(--ink)}
.dw-s{margin-top:28px}
.dw-s > .sh{margin-bottom:14px}
.dw-s .adm-g{gap:20px 18px}
.dw-s .adm-acts{margin-top:18px;flex-wrap:wrap;gap:18px}
.dw-s .adm-acts .ubtn{min-width:170px}
.dw-lines{list-style:none;margin:0 0 12px;padding:0;font-size:12px}
.dw-lines li{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--hair)}
.dw-lines small{display:block;color:var(--ink-3);font-size:10.5px;margin-top:3px}
.dw-lines b{font-weight:400;white-space:nowrap}
.dw-lines .sum{border:0;padding:4px 0;color:var(--ink-2)}
.dw-lines .sum:first-of-type{padding-top:12px}
.dw-lines .tot{color:var(--ink);font-weight:500;border-top:1px solid var(--line);margin-top:6px;padding-top:10px}
.dw-lines .tot b{font-weight:500}
.dw-kv{margin:0;display:grid;gap:10px;font-size:12px}
.dw-kv div{display:grid;grid-template-columns:120px 1fr;gap:12px}
.dw-kv dt{color:var(--ink-3)}
.dw-kv dd{margin:0}
.dw-kv2{grid-template-columns:1fr 1fr;gap:12px 20px}
.dw-kv2 div{grid-template-columns:1fr;gap:3px}
.dw-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.dw-tags .tag{border:1px solid var(--hair);padding:3px 8px;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2)}
.dw-hist{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:11px}
.dw-hist li{display:flex;justify-content:space-between;gap:12px}
.dw-orders{list-style:none;margin:0;padding:0}
.dw-orders button{display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;align-items:center;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--hair);padding:11px 0;font:inherit;font-size:12px;color:inherit;cursor:pointer}
.dw-orders button span:nth-child(2){color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dw-orders button:hover b{color:var(--accent-2)}
/* chat */
.chat{display:flex;flex-direction:column;gap:10px;max-height:380px;overflow:auto;padding:4px 2px 10px}
.msg-b{max-width:84%;padding:10px 12px;font-size:12.5px;line-height:1.55;border:1px solid var(--hair);background:rgba(255,255,255,.5)}
.msg-b p{margin:0 0 6px}
.msg-b span{font-size:10px}
.msg-b.me{align-self:flex-end;background:var(--ink);color:var(--paper);border-color:var(--ink)}
.msg-b.me .mut3{color:rgba(246,243,236,.55)}
.msg-b.them{align-self:flex-start}
.chat-f{margin-top:14px}
/* mail */
.adm-mail{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,3vw,44px);align-items:start}
.adm-mail .adm-form{margin-top:28px;max-width:none}
.adm-mail-p{margin-top:28px;position:sticky;top:90px}
.adm-mail-p > p{font-size:10.5px;text-transform:uppercase;letter-spacing:var(--ls);margin:0 0 10px}
.mail-prev{background:#fff;border:1px solid var(--hair);box-shadow:0 20px 40px -30px rgba(21,20,18,.45);font-size:12.5px;line-height:1.6;text-transform:none}
.mp-h{padding:16px 18px;border-bottom:1px solid var(--hair);display:flex;flex-direction:column;gap:4px}
.mp-h .mut3{font-size:10.5px}
.mp-h b{font-weight:500;font-size:14px}
.mp-b{padding:18px;min-height:160px;white-space:normal}
.mp-f{padding:12px 18px;border-top:1px solid var(--hair);font-size:10px}
/* dashboard */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);margin-top:26px}
.kpi{padding:16px 16px 4px 0;display:flex;flex-direction:column;gap:8px}
.kpi + .kpi{padding-left:16px;border-left:1px solid var(--hair)}
.kpi > span{font-size:10.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:var(--ls)}
.kpi b{font:400 clamp(32px,3.6vw,52px)/1 Anton,Impact,sans-serif;font-variant-numeric:tabular-nums}
.kpi small{font-size:10.5px}
.kpi small.up{color:#2f6b45}.kpi small.down{color:var(--accent)}
.dsh{margin-top:44px;margin-bottom:14px}
.todo{list-style:none;margin:0;padding:0}
.todo button{display:grid;grid-template-columns:minmax(0,260px) 1fr auto;gap:16px;width:100%;align-items:baseline;background:none;border:0;border-bottom:1px solid var(--hair);padding:13px 0;font:inherit;font-size:12.5px;text-align:left;color:inherit;cursor:pointer;transition:padding .3s,color .3s}
.todo button b{font-weight:500}
.todo button:hover{padding-left:8px;color:var(--accent-2)}
.chart-w{position:relative}
.chart{width:100%;height:auto;display:block;overflow:visible}
.chart .grid line{stroke:rgba(21,20,18,.1);stroke-width:1}
.chart .grid text,.chart .xl{fill:var(--ink-3);font-size:10px;font-family:var(--mono)}
.chart .base{stroke:var(--line);stroke-width:1}
.chart .bar{fill:var(--ink);transition:fill .15s}
.chart .hit{fill:transparent}
.chart .b.on .bar{fill:var(--accent-2)}
.chart .b.on .hit{fill:rgba(21,20,18,.04)}
.chart-w .tip{position:absolute;pointer-events:none;background:var(--ink);color:var(--paper);font-size:11px;padding:7px 10px;white-space:nowrap;z-index:2}
.dash-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px)}
.rank{list-style:none;margin:0;padding:0}
.rank li{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:baseline;padding:10px 0 12px;font-size:12px;position:relative;border-bottom:1px solid var(--hair)}
.rank li b{font-weight:400;min-width:70px;text-align:right}
.rank li i{position:absolute;left:0;bottom:-1px;height:2px;width:var(--w);background:var(--ink)}
.stl{display:flex;flex-wrap:wrap;gap:10px}
.stl button{display:flex;flex-direction:column;gap:10px;align-items:flex-start;border:1px solid var(--hair);background:none;padding:12px 14px;min-width:120px;cursor:pointer;font:inherit;color:inherit}
.stl button b{font:400 28px/1 Anton,Impact,sans-serif}
.stl button:hover{border-color:var(--ink)}
@media (max-width:999px){
  .adm-mail{grid-template-columns:1fr}
  .adm-mail-p{position:static}
  .kpis{grid-template-columns:1fr 1fr}
  .kpi:nth-child(3){padding-left:0;border-left:0}
  .kpi:nth-child(n+3){border-top:1px solid var(--hair);margin-top:12px}
  .adm-g4{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .dash-2{grid-template-columns:1fr}
  .todo button{grid-template-columns:1fr auto}
  .todo button .mut3{grid-column:1;grid-row:2}
  .adm-drawer{padding:0 18px 50px}
  .dw-kv div{grid-template-columns:96px 1fr}
  .adm-demo-bar{flex-direction:column;align-items:flex-start;gap:10px}
  .adm-tools > .lnk{margin-left:0}
  .adm-g4{grid-template-columns:1fr}
}
/* live shop: the password screen in front of the admin */
.adm-gate{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:16px;background:var(--paper) url(../img/paper.webp) center/cover}
.adm-gate form{width:min(420px,100%)}
.adm-gate .adm-logo{display:inline-block;margin-bottom:22px}
.adm-locked .adm-w{visibility:hidden}
