/* «Фото для маркетплейсов» /tools/marketplace-photo/: панель режима marketplace (шаг 2), результаты по площадкам (шаг 3),
   hero-карточка, таблица требований и вкладки, блок «Белые поля, обрезка или белый фон». Общий инструмент — photo-tool.css */

/* ---------- шаг 2: площадки ---------- */
.mk-markets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media(max-width:760px){.mk-markets{grid-template-columns:repeat(2,minmax(0,1fr))}.mk-note,.mk-orient{display:none}}
.mk-card{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:18px;border:1px solid var(--c-ctl);background:#fff;min-width:0}
.mk-card.is-on{background:var(--c-ink);border-color:var(--c-ink);color:#fff}
.mk-card-btn{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:0;border:0;background:transparent;text-align:left;cursor:pointer;color:inherit!important}
.mk-card-t{display:flex;flex-direction:column;gap:4px;min-width:0}
.mk-card-t b{font-size:17px;font-weight:800}
.mk-card-t small{font-family:var(--c-mono);font-size:12.5px;font-weight:700;color:var(--c-ink2)}
.mk-card.is-on .mk-card-t small{color:var(--c-lime)}
.mk-tick{width:26px;height:26px;flex:none;border-radius:999px;border:1.5px solid #b9c1af;background:#fff;display:flex;align-items:center;justify-content:center}
.mk-tick svg{width:14px;height:14px;stroke-width:3;opacity:0}
.mk-card.is-on .mk-tick{background:var(--c-lime);border-color:var(--c-lime);color:var(--c-ink)}.mk-card.is-on .mk-tick svg{opacity:1}
.mk-sizes{display:flex;flex-wrap:wrap;gap:6px}
.mk-sizes button{min-height:36px;padding:0 10px;border-radius:999px;border:1px solid var(--c-ctl);background:#fff;font-family:var(--c-mono);font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap}
.mk-sizes button[aria-pressed=true]{background:var(--c-track);border-color:var(--c-track)}
.mk-card.is-on .mk-sizes button{background:transparent;border-color:#4a4e44;color:#fff}
.mk-card.is-on .mk-sizes button[aria-pressed=true]{background:var(--c-lime);border-color:var(--c-lime);color:var(--c-ink)}
.mk-note{margin:0;font-size:12.5px;line-height:1.4;color:var(--c-mute)}
.mk-card.is-on .mk-note{color:#c9cec2}
/* как вписать + превью */
.mk-frame-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(440px,100%),1fr));gap:24px;align-items:start}
.mk-h{margin:0 0 12px;font-size:17px;font-weight:800}
.mk-fits{display:flex;flex-direction:column;gap:8px}
.mk-fits button{display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:16px;border:1px solid var(--c-ctl);background:#fff;text-align:left;cursor:pointer}
.mk-fits button:hover{border-color:var(--c-ink)}
.mk-fits button[aria-pressed=true]{background:var(--c-ink);border-color:var(--c-ink);color:#fff}
.mk-fits b{display:flex;align-items:center;gap:8px;font-size:15px}.mk-fits small{display:block;margin-top:2px;font-size:12.5px;color:var(--c-mute)}
.mk-fits button[aria-pressed=true] small{color:#c9cec2}
.mk-fits em,.mk-ai{padding:2px 6px;border-radius:4px;background:var(--c-lime);color:var(--c-ink);font-style:normal;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.mk-fit-ic{width:36px;height:44px;flex:none;border-radius:4px;position:relative;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--c-ctl)}
.mk-fit-ic:after{content:"";position:absolute;left:0;right:0;top:12px;bottom:12px;background:linear-gradient(#8f9aaf 60%,#5e6475 60%)}
.mk-fit-ic.is-cover:after{top:0;bottom:0;left:-10px;right:-10px}
.mk-fit-ic.is-nobg:after{left:11px;right:11px;top:13px;bottom:13px;background:#c49a6c;border-radius:2px}
.mk-colors{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px;font-size:14px;font-weight:600}
.fv-sw-like{display:flex;gap:8px;align-items:center}
.fv-sw-like>button,.mk-own{position:relative;width:34px;height:34px;border-radius:999px;border:0;padding:0;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(11,12,10,.2)}
.fv-sw-like>button[aria-pressed=true],.mk-own.is-on{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--c-ink)}
.mk-own{display:flex;align-items:center;justify-content:center;background:#fff;border:1px dashed #a9b1a0;box-shadow:none}
.mk-own svg{width:16px;height:16px}.mk-own.is-on svg{display:none}.mk-own.is-on{border:0}
.mk-own input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.mk-own:focus-within{outline:3px solid #2f6bff;outline-offset:2px}
.mk-pv{padding:18px 20px;border-radius:20px;background:var(--c-pale);min-width:0}
.mk-pv-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.mk-pv-head .mk-h{margin:0}
.mk-pv-thumbs{display:flex;gap:6px}
.mk-pv-thumbs button{width:40px;height:40px;padding:0;border-radius:8px;border:0;overflow:hidden;cursor:pointer;background:#e7ebe1;font-family:var(--c-mono);font-size:10px;font-weight:700}
.mk-pv-thumbs button[aria-pressed=true]{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--c-ink)}
.mk-pv-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.mk-pv-frames{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end;min-height:120px}
.mk-pv-frames figure{margin:0;display:flex;flex-direction:column;gap:6px}
.mk-pv-frames canvas{display:block;width:auto;max-width:100%;border-radius:3px;box-shadow:0 1px 2px rgba(11,12,10,.08),0 0 0 1px rgba(11,12,10,.1);background:repeating-conic-gradient(#e3e7dd 0 25%,#fff 0 50%) 0 0/10px 10px}
.mk-pv-frames figcaption b{display:block;font-size:13px}.mk-pv-frames figcaption span{font-family:var(--c-mono);font-size:11.5px;color:var(--c-mute)}
.mk-pv-empty{margin:0;font-size:14px;color:var(--c-mute)}
.mk-pv .cvp-hint{margin-top:12px}
/* дополнительно */
.mk-adv{border-top:1px solid var(--c-sep);padding-top:6px}
.mk-adv-btn{display:flex;align-items:center;gap:10px;min-height:44px;padding:0;border:0;background:transparent;cursor:pointer;font-size:16px}
.mk-adv-btn svg{width:16px;height:16px;transition:transform .2s}.mk-adv-btn[aria-expanded=true] svg{transform:rotate(90deg)}
.mk-adv-btn small{font-family:var(--c-mono);font-size:12px;font-weight:700;color:var(--c-mute)}
.mk-adv-body{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:20px 32px;padding:12px 0 6px}
.mk-check{display:flex;align-items:flex-start;gap:10px;cursor:pointer}
.mk-check input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--c-ink)}
.mk-check b{display:block;font-size:14px}.mk-check small{display:block;font-size:12.5px;color:var(--c-mute)}

/* ---------- шаг 3: по площадкам ---------- */
.cvp-res-custom{display:flex;flex-direction:column;gap:16px}
.mk-block{border:1px solid var(--c-line);border-radius:20px;overflow:hidden}
.mk-block-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:12px 16px;background:#f7f9f4;border-bottom:1px solid var(--c-sep)}
.mk-block-head b{font-size:16px}.mk-mono,.mk-folder{font-family:var(--c-mono);font-size:12.5px;color:var(--c-ink2)}.mk-folder{color:var(--c-mute)}
.mk-block-head .cvp-pill{margin-left:auto;min-height:40px}
.mk-files{list-style:none;margin:0;padding:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(250px,100%),1fr));gap:14px}
@media(max-width:640px){.mk-files{grid-template-columns:repeat(2,minmax(0,1fr))}.mk-file{flex-direction:column}}
.mk-file{display:flex;gap:12px;min-width:0}
.mk-file.is-wait{opacity:.55}.mk-file.is-err{opacity:1}
.mk-th{position:relative;width:96px;height:96px;flex:none;border-radius:12px;background:var(--c-pale);display:flex;align-items:center;justify-content:center}
.mk-th img{max-width:88px;max-height:88px;display:block;box-shadow:0 0 0 1px rgba(11,12,10,.1)}.mk-th img.is-pale{opacity:.5;max-width:80px;max-height:80px;object-fit:cover}
.mk-dl{position:absolute;right:-6px;bottom:-6px;width:32px;height:32px;border-radius:999px;background:var(--c-ink);color:#fff;border:2px solid #fff;display:flex;align-items:center;justify-content:center}
.mk-dl svg{width:15px;height:15px}
.mk-fi{display:flex;flex-direction:column;gap:4px;min-width:0}
.mk-fi b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-fi small{font-family:var(--c-mono);font-size:11.5px;color:var(--c-mute)}
.mk-err{color:var(--c-err)!important;font-family:Manrope,Arial,sans-serif!important;font-size:12.5px!important}
.mk-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}
.mk-chip{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:999px;background:#eef7d0;color:#2f4a00;font-family:var(--c-mono);font-size:11px;font-weight:700;white-space:nowrap}
.mk-chip svg{width:10px;height:10px;stroke-width:3.5}
.mk-chip.is-warn{background:var(--c-warn-bg);color:var(--c-warn)}.mk-chip.is-mute{background:var(--c-track);color:var(--c-ink2)}
.mk-chips .cvp-retry{min-height:32px;padding:0 10px;font-size:12px}

/* ---------- hero ---------- */
.mk-hero-card{width:460px;gap:14px}
.mk-hero-row{display:flex;align-items:flex-end;gap:10px}
.mk-hf{margin:0;display:flex;flex-direction:column;gap:6px;font-family:var(--c-mono);font-size:10.5px;line-height:1.3;color:#9aa092}
.mk-hf i{display:block;position:relative;overflow:hidden;border-radius:4px;background:#fff}
.mk-hf i:after{content:"";position:absolute;left:30%;right:30%;top:32%;bottom:30%;background:#c49a6c;border-radius:2px;box-shadow:inset 6px 0 0 #a67c50}
.mk-hf.is-src i{width:104px;height:78px;background:linear-gradient(#6f7891 62%,#4e5468 62%)}
.mk-hf.is-pad i{width:54px;height:72px;background:linear-gradient(#fff 22%,#6f7891 22% 62%,#4e5468 62% 78%,#fff 78%)}
.mk-hf.is-pad i:after{top:36%;bottom:34%}
.mk-hf.is-nobg i{width:54px;height:72px}
.mk-hf.is-wide i{width:84px;height:63px;background:linear-gradient(#6f7891 62%,#4e5468 62%)}
.mk-hf .cvp-map-arrow{align-self:center}

/* ---------- таблица требований ---------- */
.mk-req-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 40px;margin-bottom:28px}
.mk-req-head>div{display:flex;flex-direction:column;align-items:flex-start;gap:16px;max-width:760px}
.mk-req-head p{margin:0;font-size:15px;line-height:1.55;color:var(--c-ink2)}
.mk-checked{padding:6px 12px;border-radius:999px;background:var(--c-pale);font-size:13px;font-weight:700}
.mk-table-wrap{border:1px solid var(--c-line);border-radius:24px;overflow:hidden}
.mk-table{width:100%;border-collapse:collapse;table-layout:fixed}
.mk-table thead th{background:#f7f9f4;padding:16px;text-align:left;vertical-align:bottom;border-bottom:1px solid var(--c-sep)}
.mk-table thead th:first-child{width:19%}
.mk-table thead small{font-size:11px;font-weight:800;letter-spacing:.1em;color:var(--c-mute)}
.mk-table thead b{display:block;font-size:16px;margin-bottom:8px}
.mk-prep{display:inline-flex;min-height:36px;align-items:center;padding:0 12px;border-radius:999px;border:1px solid var(--c-ctl);background:#fff;color:var(--c-ink);font-size:12.5px;font-weight:800;text-decoration:none;white-space:nowrap}
.mk-prep:hover{border-color:var(--c-ink)}
.mk-table tbody th{padding:14px 16px;text-align:left;font-size:13px;font-weight:700;color:var(--c-ink2);vertical-align:top}
.mk-table td{padding:14px 16px;vertical-align:top;font-size:14px;line-height:1.45}
.mk-table tbody tr+tr th,.mk-table tbody tr+tr td{border-top:1px solid var(--c-sep)}
.mk-table small,.mk-tabpanel small{display:block;margin-top:3px;font-size:13px;line-height:1.4;color:var(--c-mute)}
.is-big .mk-v{font-family:var(--c-mono);font-size:22px;font-weight:700}
.is-mono .mk-v,.is-tool .mk-v{font-family:var(--c-mono);font-size:14.5px;font-weight:700}
.mk-table tr.is-tool th,.mk-table tr.is-tool td{background:var(--c-pale)}
.mk-tabs{display:none}
@media(max-width:1079px){
  .mk-table-wrap{display:none}.mk-tabs{display:block}
  .mk-tablist{display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--c-track);overflow-x:auto}
  .mk-tablist button{flex:1;min-height:40px;padding:0 12px;border:0;border-radius:999px;background:transparent;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap}
  .mk-tablist button[aria-selected=true]{background:var(--c-ink);color:#fff}
  .mk-tabpanel{margin-top:12px;border:1px solid var(--c-line);border-radius:20px;overflow:hidden}
  .mk-tp-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;background:#f7f9f4}
  .mk-tp-head b{font-size:16px}
  .mk-tabpanel dl{margin:0}
  .mk-tabpanel dl>div{display:grid;grid-template-columns:minmax(110px,38%) 1fr;gap:10px;padding:12px 16px;border-top:1px solid var(--c-sep)}
  .mk-tabpanel dl>div.is-tool{background:var(--c-pale)}
  .mk-tabpanel dt{font-size:13px;font-weight:700;color:var(--c-ink2)}.mk-tabpanel dd{margin:0;font-size:14px}
}
.mk-sources{margin:16px 0 0;font-size:13px;line-height:1.55;color:var(--c-mute)}.mk-sources a{color:var(--c-ink2)}

/* ---------- белые поля, обрезка или белый фон ---------- */
.mk-fit-sec{padding:56px 0}
.mk-fit-sec h2{margin:16px 0 12px;font-size:clamp(30px,3.2vw,44px);line-height:1.1;font-weight:800;letter-spacing:-.025em}
.mk-lead{margin:0 0 28px;max-width:640px;font-size:15px;line-height:1.55;color:var(--c-ink2)}
.mk-fitcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:20px}
.mk-fitcards article{display:flex;flex-direction:column;gap:10px;padding:18px;border:1px solid var(--c-line);border-radius:22px;background:#fff}
.mk-fitcards h3{margin:6px 0 0;display:flex;align-items:center;gap:8px;font-size:18px;font-weight:800}
.mk-fitcards p{margin:0;font-size:14.5px;line-height:1.55;color:var(--c-ink2)}
.mk-when{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700}.mk-when svg{width:16px;height:16px;color:#2f4a00;stroke-width:3}
.mk-ill{height:200px;border-radius:14px;background:var(--c-pale);display:flex;align-items:center;justify-content:center;overflow:hidden}
.mk-ill i{display:block;position:relative;width:120px;height:160px;background:#fff;box-shadow:0 0 0 1px rgba(11,12,10,.1)}
.mk-ill i:before{content:"";position:absolute;left:0;right:0;top:46px;bottom:46px;background:linear-gradient(#6f7891 62%,#4e5468 62%)}
.mk-ill i:after{content:"";position:absolute;left:44px;right:44px;top:66px;bottom:62px;background:#c49a6c;box-shadow:inset 8px 0 0 #a67c50}
.mk-ill.is-cover i{overflow:visible;outline:2px solid var(--c-ink)}
.mk-ill.is-cover i:before{top:0;bottom:0;left:-60px;right:-60px;opacity:1;z-index:0;background:linear-gradient(#6f7891 62%,#4e5468 62%);box-shadow:inset 60px 0 0 rgba(255,255,255,.55),inset -60px 0 0 rgba(255,255,255,.55)}
.mk-ill.is-cover i:after{left:36px;right:36px;top:52px;bottom:44px}
.mk-ill.is-nobg i:before{display:none}
.mk-ill.is-nobg i:after{left:34px;right:34px;top:48px;bottom:48px}

/* блок каталога: «стало» — вертикальные кадры 3:4 */
.cvp-ba-row.is-tall figure>span{width:72px;height:96px}
.mk-all{font-size:14px;font-weight:700;color:var(--c-ink)}