/* №239: выбор площадки и формы ключей (web/mp-keys.js) - гибридный кабинет и мастер старта. Знаки площадок - как в переключателе. */
:root{--mp-wb:#B4198F;--mp-oz:#005BFF;--mp-ym:#B7791F;--mp-av:#1F8A5B}
:root[data-theme="dark"]{--mp-wb:#F05BD0;--mp-oz:#6AA3FF;--mp-ym:#F2B544;--mp-av:#4FD08F}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--mp-wb:#F05BD0;--mp-oz:#6AA3FF;--mp-ym:#F2B544;--mp-av:#4FD08F}}
.mpk-pick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 16px}
.mpk-opt{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 14px;border-radius:14px;border:1px solid var(--line3);background:var(--card);color:var(--ink);
  font:inherit;text-align:left;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.mpk-opt span{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.mpk-opt b{font-size:15px;font-weight:650;letter-spacing:-.01em}
.mpk-opt small{font-size:12px;color:var(--mute);margin-top:2px}
.mpk-opt:hover{border-color:var(--ink2)}
.mpk-opt.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.mpk-opt:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.mpk-what{margin:0 0 12px}
.mpk-steps{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-direction:column;gap:10px}
.mpk-steps li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.5;color:var(--ink2)}
.mpk-steps i{flex:none;display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--hov-n);border:1px solid var(--line3);
  font:600 11px/1 var(--mono);font-style:normal;color:var(--ink)}
.mpk-more{margin:4px 0 2px;font-size:13px}
.mpk-more summary{cursor:pointer;color:var(--mute)}
.mpk-camps{display:flex;flex-direction:column;gap:6px}
.mpk-camp{display:flex;align-items:center;gap:8px;font-size:13.5px}
.mpk-err{margin:0;padding:10px 12px;border-radius:10px;background:var(--red-s);color:var(--red);font-size:13px;line-height:1.45}
.mpk-note{margin:0 0 14px}
@media (max-width:860px){.mpk-pick{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.mpk-opt{min-height:56px;padding:10px 12px;gap:10px}.mpk-opt b{font-size:14px}.mpk-opt small{font-size:11.5px}}
/* №460: знаки площадок одного уровня - плитка в фирменном цвете площадки (одна в светлой и темной теме: белый знак читается), белый знак (WB, ozon, Я, точки Авито), одно свечение;
   «Все площадки» - темная плитка с четырьмя цветами площадок. Копия блока из pro-mpnav.css: здесь его файла нет (гибридный кабинет, мастер старта). */
.mpn-m{--mk-wb:#BC1597;--mk-oz:#0B5CFF;--mk-ym:#DB8B0B;--mk-av:#18975F;--c:var(--mk-wb);position:relative;flex:none;display:inline-grid;place-items:center;width:30px;height:30px;border-radius:9px;font:750 12px/1 var(--sans);font-style:normal;letter-spacing:-.04em;
  color:#fff;background:linear-gradient(140deg,color-mix(in srgb,var(--c),#fff 16%),var(--c) 55%,color-mix(in srgb,var(--c),#000 12%));
  box-shadow:inset 0 0 0 1px color-mix(in srgb,#000 10%,transparent),inset 0 1px 0 rgba(255,255,255,.22),0 5px 12px -6px var(--c)}
.mpn-m:after{content:"";display:block;width:62%;height:62%;background:#fff}
.mpn-m.wb{--c:var(--mk-wb)}.mpn-m.wb:after{content:"WB";width:auto;height:auto;background:none}
.mpn-m.ozon{--c:var(--mk-oz)}.mpn-m.ozon:after{width:84%;height:36%;-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 14" fill="none" stroke="black" stroke-width="3.1" stroke-linecap="round" stroke-linejoin="round"><circle cx="5" cy="7" r="3.5"/><path d="M11.7 3.5h6l-6 7h6"/><circle cx="24.2" cy="7" r="3.5"/><path d="M30.7 10.5V7.2a3.25 3.25 0 0 1 6.5 0v3.3"/></svg>') center/contain no-repeat;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 14" fill="none" stroke="black" stroke-width="3.1" stroke-linecap="round" stroke-linejoin="round"><circle cx="5" cy="7" r="3.5"/><path d="M11.7 3.5h6l-6 7h6"/><circle cx="24.2" cy="7" r="3.5"/><path d="M30.7 10.5V7.2a3.25 3.25 0 0 1 6.5 0v3.3"/></svg>') center/contain no-repeat}
.mpn-m.ym{--c:var(--mk-ym)}.mpn-m.ym:after{width:64%;height:64%;-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M15.6 19.6V4.4h-4.1a4.3 4.3 0 0 0 0 8.6h4.1M11.4 13.2l-4 6.4"/></svg>') center/contain no-repeat;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M15.6 19.6V4.4h-4.1a4.3 4.3 0 0 0 0 8.6h4.1M11.4 13.2l-4 6.4"/></svg>') center/contain no-repeat}
.mpn-m.avito{--c:var(--mk-av)}.mpn-m.avito:after{width:60%;height:60%;-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="7.4" cy="7.6" r="4"/><circle cx="17.2" cy="6.6" r="2.6"/><circle cx="6.9" cy="17.3" r="2.8"/><circle cx="16.3" cy="16.3" r="4.7"/></svg>') center/contain no-repeat;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="7.4" cy="7.6" r="4"/><circle cx="17.2" cy="6.6" r="2.6"/><circle cx="6.9" cy="17.3" r="2.8"/><circle cx="16.3" cy="16.3" r="4.7"/></svg>') center/contain no-repeat}
.mpn-m.all{--c:var(--a2,#7C3AED);background:linear-gradient(140deg,#3A3150,#1A1626 60%,#110E19);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1),inset 0 1px 0 rgba(255,255,255,.14),0 5px 12px -6px var(--c)}
.mpn-m.all:after{width:58%;height:58%;background:conic-gradient(color-mix(in srgb,var(--mk-oz),#fff 22%) 0 25%,color-mix(in srgb,var(--mk-av),#fff 22%) 0 50%,color-mix(in srgb,var(--mk-ym),#fff 22%) 0 75%,color-mix(in srgb,var(--mk-wb),#fff 22%) 0);-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="2.5" y="2.5" width="8.6" height="8.6" rx="2.6"/><rect x="12.9" y="2.5" width="8.6" height="8.6" rx="2.6"/><rect x="2.5" y="12.9" width="8.6" height="8.6" rx="2.6"/><rect x="12.9" y="12.9" width="8.6" height="8.6" rx="2.6"/></svg>') center/contain no-repeat;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="2.5" y="2.5" width="8.6" height="8.6" rx="2.6"/><rect x="12.9" y="2.5" width="8.6" height="8.6" rx="2.6"/><rect x="2.5" y="12.9" width="8.6" height="8.6" rx="2.6"/><rect x="12.9" y="12.9" width="8.6" height="8.6" rx="2.6"/></svg>') center/contain no-repeat}

/* №447: «Войти через Авито» над формой ключа: главный способ, ключ API - запасной */
.mpk-oa{display:flex;flex-direction:column;gap:6px;margin:0 0 6px}
.mpk-oa-go{width:100%;background:#1F8A5B;color:#fff}   /* один зеленый в светлой и темной теме: белый текст читается */
.mpk-oa-go:hover{background:#18704a}
.mpk-oa-t{margin:0;line-height:1.45}
.mpk-or{display:flex;align-items:center;gap:10px;margin:8px 0 2px;color:var(--mute);font-size:12.5px}
.mpk-or:before,.mpk-or:after{content:"";flex:1;height:1px;background:var(--line3)}