.mk-wrap{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}
.mk-side{flex:1 1 300px;min-width:280px;max-width:430px}
.mk-main{flex:2 1 420px}
.mk-scen{font-size:1.1rem;margin-bottom:10px}
.mk-persons{display:flex;flex-direction:column;gap:8px}
.mk-card{display:flex;gap:10px;align-items:flex-start;background:#fff;border-radius:14px;padding:9px 11px;cursor:pointer;
  border:3px solid transparent;box-shadow:0 4px 12px rgba(31,42,68,.08)}
.mk-card.sel{border-color:var(--accent)}
.mk-card.placed{background:#f5f9ff}
.mk-card.bad{border-color:var(--bad)}
.mk-card.victim{background:#fde8e8}
.mk-card.locked{background:#fef3c7}
.mk-ava{position:relative;font-size:1.9rem;width:46px;height:46px;flex:0 0 46px;display:flex;align-items:center;justify-content:center;
  background:#f1ecf8;border-radius:12px}
.mk-ava b{position:absolute;right:-4px;bottom:-4px;background:#2b2540;color:#fff;font-size:.7rem;border-radius:999px;padding:1px 6px}
.mk-name{font-weight:800}
.mk-clue{color:#3b3552;font-size:.95rem}
.mk-where{font-size:.75rem;color:var(--muted);font-weight:700;margin-left:6px}
.mk-tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.mode.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.mk-board-wrap{overflow:auto;background:#fff;border-radius:20px;padding:14px;box-shadow:0 10px 26px rgba(31,42,68,.1);display:inline-block;max-width:100%}
.mk-board{--cs:54px;--hd:22px;display:grid;position:relative;user-select:none}
.mk-board.big{--cs:46px}
.mk-hd{display:flex;align-items:center;justify-content:center;font-size:.75rem;color:var(--muted);font-weight:700}
.mk-compass{font-size:.6rem;line-height:.9;text-align:center;color:var(--muted);font-weight:800;display:flex;align-items:center;justify-content:center}
.mk-cell{cursor:pointer;position:relative;z-index:0}
.mk-cell:hover{filter:brightness(.94)}
.mk-cell.shade{background-image:repeating-linear-gradient(45deg,rgba(43,37,64,.10) 0 4px,transparent 4px 9px)}
.mk-obj{z-index:1;pointer-events:none;margin:5px;border-radius:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:1.65rem;line-height:1;
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.12)}
.mk-obj.occ{opacity:.85}
.mk-obj.block{box-shadow:inset 0 0 0 2px rgba(0,0,0,.25),0 2px 4px rgba(0,0,0,.2)}
.mk-obj.t-teppich{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 6px,transparent 6px 12px)!important;margin:3px}
.mk-obj.t-tisch{background-image:linear-gradient(135deg,rgba(255,255,255,.18),rgba(0,0,0,.1))}
.mk-window{z-index:2;pointer-events:none;position:relative}
.mk-window::after{content:"";position:absolute;background:#7cc6f2;border:2px solid #fff;box-shadow:0 0 0 2px #2b2540;border-radius:3px}
.mk-window.side-N::after{left:22%;right:22%;top:-4px;height:5px}
.mk-window.side-S::after{left:22%;right:22%;bottom:-4px;height:5px}
.mk-window.side-W::after{top:22%;bottom:22%;left:-4px;width:5px}
.mk-window.side-E::after{top:22%;bottom:22%;right:-4px;width:5px}
.mk-label{z-index:3;pointer-events:none;display:flex;align-items:flex-end;justify-content:center;padding-bottom:2px}
.mk-label span{background:#fff;border:2px solid #2b2540;border-radius:999px;font-size:.62rem;font-weight:800;padding:0 7px;
  text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;opacity:.92}
.mk-mark{z-index:2;pointer-events:none;display:flex;align-items:center;justify-content:center;font-size:1.6rem;color:#6d6585;font-weight:900}
.mk-token{z-index:4;pointer-events:none;margin:6px;border-radius:999px;background:#fff;border:3px solid #2b2540;display:flex;
  align-items:center;justify-content:center;position:relative;box-shadow:0 3px 8px rgba(0,0,0,.25)}
.mk-token .e{font-size:1.3rem}
.mk-token b{position:absolute;right:-5px;bottom:-5px;background:#2b2540;color:#fff;font-size:.65rem;border-radius:999px;padding:0 5px}
.mk-token.victim{border-color:var(--bad);background:#fde8e8}
.mk-token.bad{border-color:var(--bad);animation:shake .3s}
.mk-token.locked{border-color:var(--warn);background:#fef3c7}
.mk-token.sel{outline:3px solid var(--accent)}
.mk-accuse{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:14px;background:#fff;border-radius:16px;padding:12px 14px;
  box-shadow:0 6px 16px rgba(31,42,68,.08)}
.mk-accuse label{font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mk-accuse select{width:auto;margin:0}
.mk-accuse .primary{flex:0 0 auto}
.mk-jail{font-size:1.2rem}
.mk-help{margin-top:14px;background:#fff;border-radius:16px;padding:10px 14px;box-shadow:0 6px 16px rgba(31,42,68,.08)}
.mk-help summary{cursor:pointer;font-weight:800}
.mk-help li{margin:4px 0}

/* Editor */
.ed-head,.ed-foot{margin-bottom:14px;padding:18px}
.ed-head h2{margin-top:0}
.ed-row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.ed-row label{display:flex;flex-direction:column;font-weight:700;font-size:.85rem;color:var(--muted)}
.ed-row input,.ed-row select{width:auto;min-width:120px}
.ed-tools{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.ed-palette{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.ed-palette select{width:auto;margin:0}
.swatch{padding:7px 10px;font-size:.85rem;border:2px solid rgba(0,0,0,.15)}
.swatch.active{outline:3px solid var(--accent)}
.swatch.blockobj{border-style:dashed}
.ed-card{cursor:default}
.ed-fields{flex:1;display:flex;flex-direction:column;gap:4px}
.ed-line{display:flex;gap:6px;align-items:center}
.ed-line input{margin:0;padding:6px 8px;flex:1}
.ed-line select{margin:0;padding:6px;width:auto}
.ed-clue{width:100%;border:2px solid #dbe3f5;border-radius:10px;padding:6px 8px;font-family:inherit;font-size:.9rem;resize:vertical}
.ok-tag{color:var(--good);font-size:.78rem;font-weight:700}
.ed-foot{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ed-foot .primary{flex:0 0 auto}
@media (max-width:600px){.mk-board{--cs:38px}.mk-board.big{--cs:32px}.mk-token .e{font-size:1rem}.mk-obj{font-size:1.05rem;margin:3px}}

.mk-obj .nm{font-size:.5rem;font-weight:800;color:#2b2540;background:rgba(255,255,255,.8);border-radius:4px;padding:0 3px;margin-top:2px;
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mk-notes{z-index:3;pointer-events:none;align-self:start;justify-self:stretch;text-align:center;font-size:.72rem;font-weight:900;
  color:#4f46e5;padding:2px 3px 0;letter-spacing:.02em;line-height:1.05;word-break:break-all;text-shadow:0 0 3px #fff,0 0 3px #fff}
.mk-boardrow{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.mk-legend{background:#fff;border-radius:16px;padding:10px 12px;box-shadow:0 6px 16px rgba(31,42,68,.08);flex:1 1 170px;font-size:.9rem}
.lg-items{display:flex;flex-wrap:wrap;gap:2px 16px}
.mk-legend h4{margin:0 0 6px}
.lg-h{font-weight:800;font-size:.78rem;margin:8px 0 4px;color:var(--muted)}
.lg-h.ok{color:#15803d}.lg-h.no{color:#b91c1c}
.lg-item{display:flex;align-items:center;gap:8px;margin:3px 0;font-weight:600}
.lg-sw{width:30px;height:30px;flex:0 0 30px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:1.15rem;
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.15)}
.lg-sw.block{box-shadow:inset 0 0 0 2px rgba(0,0,0,.3)}
.lg-sw.t-teppich{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 5px,transparent 5px 10px)!important}
.lg-win{background:#7cc6f2;height:8px;border:2px solid #fff;box-shadow:0 0 0 2px #2b2540}
.lg-x{color:#6d6585;font-weight:900;background:#f3f1f7}
.lg-note{color:#4f46e5;font-size:.7rem;font-weight:900;align-items:flex-start;background:#f3f1f7}
.lg-tip{font-size:.75rem;color:var(--muted);margin:8px 0 0}