.mk{background:var(--bg);color:var(--text);font-family:var(--f);min-height:100vh}
.mk-wrap{max-width:1180px;margin:0 auto;padding:22px 20px 60px}
.mk-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}
.mk-title{display:flex;align-items:center;gap:14px}
.mk-logo{width:48px;height:48px;flex:none}
.mk-logo svg{width:100%;height:100%;display:block}
.mk-title h1{margin:0;font:700 26px var(--fh);letter-spacing:-.01em}
.mk-title p{margin:3px 0 0;color:var(--muted);font-size:13.5px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dot{width:8px;height:8px;border-radius:50%;background:var(--g);box-shadow:0 0 0 4px var(--gsoft);display:inline-block}
.dot.busy{background:var(--a);box-shadow:0 0 0 4px rgba(245,181,68,.18);animation:pulse 1.2s ease-in-out infinite}
.dot.live{background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.2)}
.dot.err{background:var(--r);box-shadow:0 0 0 4px rgba(239,68,68,.2)}
@keyframes pulse{50%{opacity:.45}}

.mk-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:18px;align-items:start}
.mk-stagebox{margin:0;padding:14px}
.mk-stage{position:relative;aspect-ratio:4/3;border-radius:16px;overflow:hidden;background:#000;border:1px solid var(--line)}
.mk-stage canvas{width:100%;height:100%;display:block;object-fit:contain;background:#05080f}
.mk-overlay{position:absolute;inset:0;display:grid;place-items:center;padding:20px;background:radial-gradient(120% 120% at 50% 0,rgba(122,162,255,.16),transparent 60%),rgba(7,10,18,.88);backdrop-filter:blur(3px)}
.mk-overlay[hidden]{display:none}
.mk-ov-in{max-width:440px;text-align:center}
.mk-ov-ico{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:20px;background:var(--gsoft);color:var(--g);margin-bottom:14px}
.mk-ov-ico svg{width:30px;height:30px}
.mk-ov-in h2{margin:0 0 8px;font:700 21px var(--fh)}
.mk-ov-in p{margin:0 0 18px;color:var(--muted);font-size:14.5px;line-height:1.6}
.mk-ov-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.mk-ov-btns .btn{width:auto;margin:0}
.mk-note{display:block;margin-top:14px;color:var(--faint);font-size:12.5px}
.mk-load{position:absolute;left:0;right:0;bottom:0;padding:16px 18px;background:linear-gradient(0deg,rgba(5,8,15,.92),rgba(5,8,15,.55) 70%,transparent)}
.mk-load[hidden]{display:none}
.mk-bar{height:8px;border-radius:99px;background:rgba(255,255,255,.12);overflow:hidden}
.mk-bar i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--g),var(--g2));transition:width .25s var(--ease)}
.mk-load p{margin:8px 0 0;font-size:13px;color:var(--muted)}
.mk-under{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}
.mk-sp{flex:1}
.btn.sm{padding:8px 14px;font-size:13px;width:auto;margin:0}

.mk-side .panel{padding:18px 20px}
.mk-side h3{margin:0 0 12px;font:700 15px var(--fh)}
.seg2{display:flex;gap:6px;background:var(--soft);padding:5px;border-radius:12px;border:1px solid var(--line)}
.seg2 button{flex:1;padding:9px 8px;border-radius:9px;border:0;background:transparent;color:var(--muted);font:600 12.5px var(--fh);cursor:pointer;transition:.2s var(--ease)}
.seg2 button.on{background:var(--card);color:var(--g);box-shadow:0 1px 0 var(--line)}
.muted.small{font-size:12.8px;line-height:1.55;margin:10px 0 0}
.mk-row{display:flex;justify-content:space-between;margin:16px 0 8px;font-size:13.5px;color:var(--muted)}
.mk-row b{color:var(--text);font-family:var(--fm)}
input[type=range]{width:100%;accent-color:var(--g)}
.mk-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.mk-kpi{background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:12px 10px;text-align:center}
.mk-kpi small{display:block;color:var(--muted);font-size:11.5px;margin-bottom:4px}
.mk-kpi b{font:700 26px var(--fh)}
.mk-kpi.good b{color:#22c55e}.mk-kpi.bad b{color:#f87171}
.mk-times{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:6px;font-size:13px}
.mk-times li{display:flex;justify-content:space-between;color:var(--muted)}
.mk-times b{color:var(--text);font-family:var(--fm);font-weight:500}
.mk-steps{margin:0;padding-left:20px;color:var(--muted);font-size:13.5px;line-height:1.7}
.mk-steps b{color:var(--text)}
.mk-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.mk-cta .btn{width:auto;margin:0}
.mk-credit{margin-top:18px;color:var(--faint);font-size:12.5px;line-height:1.6}
.mk-credit a{color:var(--muted)}
.btn svg,.ib svg{width:18px;height:18px}
.chip svg{width:14px;height:14px}

@media (max-width:900px){.mk-grid{grid-template-columns:1fr}.mk-title h1{font-size:22px}.mk-wrap{padding:16px 14px 50px}}
@media (max-width:520px){.mk-stage{aspect-ratio:3/4}.mk-ov-in h2{font-size:18px}.mk-kpis{gap:6px}}
[data-theme="light"] .mk-overlay{background:radial-gradient(120% 120% at 50% 0,rgba(122,162,255,.18),transparent 60%),rgba(244,246,251,.92)}
[data-theme="light"] .mk-load{background:linear-gradient(0deg,rgba(244,246,251,.95),rgba(244,246,251,.6) 70%,transparent)}
@media (prefers-reduced-motion:reduce){.dot.busy{animation:none}}