/* Партнёрская программа Мотивиков — кабинет и админка. Все правила внутри #mvp. */
#mvp{--bg:#F6F4FD;--card:#fff;--ink:#2B2350;--ink2:#5A5670;--muted:#8A86A0;--line:#E6E1F7;--brand:#6C5CE0;--brand2:#5A4BD1;--brandSoft:#EEEAFE;--ok:#2E7D32;--okBg:#E4F4E1;--warn:#9A6200;--warnBg:#FFF1D6;--bad:#B3261E;--badBg:#FBE3E1;--info:#3B4BB8;--infoBg:#E6E9FC;--s1:#2a78d6;--s2:#eb6834;--s3:#1baf7a;--s4:#eda100;--r:18px;--sh:0 10px 30px -18px rgba(43,35,80,.35);
  background:var(--bg);color:var(--ink);font:500 15px/1.45 'MV Tekst',system-ui,sans-serif;min-height:100vh;-webkit-text-size-adjust:100%}
#mvp *{box-sizing:border-box}
#mvp h1,#mvp h2,#mvp h3{font-family:'MV Zagolovok',sans-serif;margin:0;line-height:1.2;color:var(--ink)}
#mvp h1{font-size:22px}#mvp h2{font-size:18px}#mvp h3{font-size:15px}
#mvp p{margin:0 0 10px}
#mvp button,#mvp input,#mvp select,#mvp textarea{font:inherit;color:inherit}
#mvp a{color:var(--brand)}
#mvp .wrap{max-width:1180px;margin:0 auto;padding:16px}
#mvp .top{display:flex;align-items:center;gap:12px;margin:4px 0 14px;flex-wrap:wrap}
#mvp .logo{width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,#FFB86B,#E77AC8 50%,#7FD1FF);display:grid;place-items:center;color:#fff;font:800 22px 'MV Zagolovok',sans-serif;flex-shrink:0;text-decoration:none}
#mvp .who{flex:1;min-width:0}
#mvp .who small{color:var(--muted);display:block}
#mvp .badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:800;white-space:nowrap}
#mvp .b-ok{background:var(--okBg);color:var(--ok)}#mvp .b-warn{background:var(--warnBg);color:var(--warn)}#mvp .b-bad{background:var(--badBg);color:var(--bad)}#mvp .b-info{background:var(--infoBg);color:var(--info)}#mvp .b-brand{background:var(--brandSoft);color:var(--brand2)}#mvp .b-gray{background:#EFEDF5;color:var(--ink2)}
#mvp .tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -16px 14px;padding:0 16px}
#mvp .tabs::-webkit-scrollbar{display:none}
#mvp .tabs button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 14px;font-weight:700;white-space:nowrap;cursor:pointer;color:var(--ink2)}
#mvp .tabs button.on{background:var(--brand);border-color:var(--brand);color:#fff}
#mvp .card{background:var(--card);border-radius:var(--r);box-shadow:var(--sh);padding:16px;margin-bottom:14px}
#mvp .card h2,#mvp .card h3{margin-bottom:10px}
#mvp .row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
#mvp .sp{flex:1}
#mvp .grid{display:grid;gap:12px}
#mvp .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:900px){#mvp .g4{grid-template-columns:repeat(4,minmax(0,1fr))}#mvp .cols{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:14px}#mvp .cols>.card{margin-bottom:0}}
#mvp .tile{background:#fff;border-radius:16px;box-shadow:var(--sh);padding:14px;min-width:0}
#mvp .tile .l{font-size:12.5px;color:var(--ink2);font-weight:700}
#mvp .tile .v{font:800 22px/1.15 'MV Zagolovok',sans-serif;margin-top:4px;overflow-wrap:anywhere}
#mvp .tile .d{font-size:12px;color:var(--muted);margin-top:2px}
#mvp .tile.hero{background:linear-gradient(135deg,#7A6AF0,#5A4BD1);color:#fff}
#mvp .tile.hero .l,#mvp .tile.hero .d{color:#E9E4FF}
#mvp .chips{display:flex;gap:6px;flex-wrap:wrap}
#mvp .chips button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:5px 10px;font-size:13px;font-weight:700;cursor:pointer;color:var(--ink2)}
#mvp .chips button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
#mvp .btn{border:0;background:var(--brand);color:#fff;border-radius:12px;padding:10px 16px;font-weight:800;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
#mvp .btn:hover{background:var(--brand2)}
#mvp .btn.ghost{background:var(--brandSoft);color:var(--brand2)}
#mvp .btn.sm{padding:6px 12px;font-size:13px;border-radius:10px}
#mvp .btn.tg{background:#229ED9}#mvp .btn.tg:hover{background:#1b8bc1}
#mvp .btn.max{background:linear-gradient(135deg,#2D7CFF,#9A4DFF)}#mvp .btn.max:hover{filter:brightness(.93)}
#mvp .btn.mail{background:#fff;color:var(--brand2)}#mvp .btn.mail:hover{background:#F3F0FF}
#mvp .btn:disabled{opacity:.45;cursor:default}
#mvp table{width:100%;border-collapse:collapse;font-size:13.5px}
#mvp th{font-size:12px;color:var(--ink2);text-align:left;font-weight:800;padding:8px;border-bottom:1px solid var(--line);white-space:nowrap}
#mvp th.s{cursor:pointer}#mvp th.s:hover{color:var(--brand)}
#mvp td{padding:9px 8px;border-bottom:1px solid #F1EEFA;white-space:nowrap}
#mvp td.n,#mvp th.n{text-align:right;font-variant-numeric:tabular-nums}
#mvp tr.click{cursor:pointer}#mvp tr.click:hover td{background:#FAF8FF}
#mvp .tbl{overflow-x:auto;margin:0 -16px;padding:0 16px}
#mvp .list .it{display:flex;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid #F1EEFA}
#mvp .list .it:last-child{border-bottom:0}
#mvp .it .main{flex:1;min-width:0}
#mvp .it .main b{display:block}
#mvp .it .main small{color:var(--muted)}
#mvp .it .amt{text-align:right;font-variant-numeric:tabular-nums;font-weight:800}
#mvp .it .amt small{display:block;font-weight:600;color:var(--muted)}
#mvp .prog{height:10px;background:#EFEDF5;border-radius:99px;overflow:hidden}
#mvp .prog i{display:block;height:100%;background:linear-gradient(90deg,#F5A623,#E8841A);border-radius:99px}
#mvp .hint{font-size:12.5px;color:var(--muted)}
#mvp .field{display:block;margin-bottom:10px}
#mvp .field span{display:block;font-size:12px;color:var(--ink2);font-weight:700;margin-bottom:4px}
#mvp .field input,#mvp .field select,#mvp .field textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff}
#mvp .copy{display:flex;gap:8px;align-items:center;background:var(--bg);border-radius:12px;padding:8px 8px 8px 12px}
#mvp .copy code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 14px 'MV Tekst',sans-serif}
#mvp .code-big{font:800 26px 'MV Zagolovok',sans-serif;letter-spacing:1px;color:var(--brand2)}
#mvp .chart{position:relative}
#mvp .chart svg{display:block;width:100%;height:auto;overflow:visible}
#mvp .chart .ax{font:600 10.5px 'MV Tekst',sans-serif;fill:#8A86A0}
#mvp .chart .grid line{stroke:#EFEDF5}
#mvp .tip{position:absolute;pointer-events:none;background:#2B2350;color:#fff;border-radius:10px;padding:6px 10px;font-size:12.5px;white-space:nowrap;transform:translate(-50%,-110%);opacity:0;transition:opacity .12s;z-index:5}
#mvp .hbar{display:grid;grid-template-columns:minmax(70px,auto) 1fr auto;gap:6px 10px;align-items:center;font-size:13.5px}
#mvp .hbar .t{height:14px;background:#F3F1FA;border-radius:0 4px 4px 0;position:relative}
#mvp .hbar .t i{position:absolute;left:0;top:0;bottom:0;border-radius:0 4px 4px 0}
#mvp .hbar .num{font-variant-numeric:tabular-nums;font-weight:700;text-align:right}
#mvp .admin{display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
#mvp .admin>*{min-width:0}
@media(min-width:1000px){#mvp .admin{grid-template-columns:210px minmax(0,1fr)}#mvp .side{position:sticky;top:16px;align-self:start}#mvp .side .tabs{flex-direction:column;margin:0;padding:0}#mvp .side .tabs button{text-align:left;border-radius:12px}}
#mvp .flag{display:flex;gap:10px;padding:12px;border-radius:14px;background:#FFF8EC;margin-bottom:8px;align-items:flex-start}
#mvp .flag.bad{background:#FDF0EF}
#mvp .empty{text-align:center;padding:30px 10px;color:var(--muted)}
#mvp .hero-l{background:linear-gradient(135deg,#3A2466,#5A4BD1);color:#fff;border-radius:24px;padding:28px 20px;margin-bottom:14px}
#mvp .hero-l h1{color:#fff;font-size:28px;margin-bottom:10px}
#mvp .hero-l p{color:#E9E4FF;font-size:16px;max-width:560px}
@media(min-width:900px){#mvp .hero-l{text-align:center;padding:36px 28px}#mvp .hero-l p{margin-left:auto;margin-right:auto}#mvp .hero-l .row{justify-content:center}}
#mvp .feat{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-bottom:14px}
#mvp .feat .tile .v{font-size:20px}
#mvp .spin{display:inline-block;width:18px;height:18px;border:3px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:mvpspin 1s linear infinite;vertical-align:middle}
@keyframes mvpspin{to{transform:rotate(360deg)}}
.mvp-modal{position:fixed;inset:0;background:rgba(43,35,80,.45);z-index:9999;display:none;align-items:flex-start;justify-content:center;padding:24px 12px;overflow:auto}
.mvp-modal.show{display:flex}
.mvp-modal .box{background:#fff;border-radius:20px;max-width:780px;width:100%;padding:20px;position:relative;font:500 15px/1.45 'MV Tekst',system-ui,sans-serif;color:#2B2350}
.mvp-modal .x{position:absolute;right:12px;top:10px;border:0;background:none;font-size:26px;cursor:pointer;color:#8A86A0}
.mvp-modal .doc{font:400 13px/1.5 "Times New Roman",serif;color:#111}
.mvp-modal .doc h2{font:700 16px "Times New Roman",serif;text-align:center;margin:6px 0 12px}
.mvp-modal .doc table{width:100%;border-collapse:collapse;font-size:12.5px}.mvp-modal .doc td,.mvp-modal .doc th{border:1px solid #999;padding:4px 6px;color:#111;text-align:left}
.mvp-modal .btn{border:0;background:#6C5CE0;color:#fff;border-radius:12px;padding:10px 16px;font-weight:800;cursor:pointer}
.mvp-modal .btn.ghost{background:#EEEAFE;color:#5A4BD1}
.mvp-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#2B2350;color:#fff;padding:10px 16px;border-radius:12px;font:700 14px 'MV Tekst',sans-serif;z-index:10000;opacity:0;transition:opacity .2s;pointer-events:none}
.mvp-toast.show{opacity:1}
@media print{body *{visibility:hidden!important}.mvp-modal,.mvp-modal *{visibility:visible!important}.mvp-modal{position:absolute;inset:0;background:none;padding:0;display:block}.mvp-modal .x,.mvp-modal .noprint{display:none!important}}
/* Переписки с покупателями */
#mvp .chat-grid{display:grid;gap:12px}
@media(min-width:900px){#mvp .chat-grid{grid-template-columns:300px minmax(0,1fr);align-items:start}}
#mvp .chat-list{display:flex;flex-direction:column;gap:6px;max-height:70vh;overflow:auto}
#mvp .chat-it{display:block;width:100%;text-align:left;border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 12px;cursor:pointer}
#mvp .chat-it.on{border-color:var(--brand);background:var(--brandSoft)}
#mvp .chat-it b{display:block}
#mvp .chat-it small{display:block;color:var(--muted);font-size:12.5px}
#mvp .chat-it .cut{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink2)}
#mvp .chat-pane{min-width:0}
#mvp .chat-order{border:1px solid var(--line);border-radius:14px;padding:10px 12px;margin-bottom:8px}
#mvp .msgs{display:flex;flex-direction:column;gap:8px;max-height:50vh;overflow:auto;background:var(--bg);border-radius:14px;padding:12px;margin:10px 0}
#mvp .msg{max-width:80%;align-self:flex-start}
#mvp .msg.out,#mvp .msg.sys{align-self:flex-end}
#mvp .msg .bub{background:#fff;border-radius:14px;padding:8px 12px;overflow-wrap:anywhere;box-shadow:var(--sh)}
#mvp .msg.out .bub{background:var(--brand);color:#fff}
#mvp .msg.sys .bub{background:var(--brandSoft);color:var(--ink2)}
#mvp .msg.note{align-self:center}
#mvp .msg.note .bub{background:var(--warnBg);color:var(--warn)}
#mvp .msg .meta{font-size:11.5px;color:var(--muted);margin-top:2px;padding:0 4px}
#mvp .msg.out .meta,#mvp .msg.sys .meta{text-align:right}
#mvp .chat-send textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff;margin-bottom:6px;resize:vertical}
