.dmc4{margin:32px auto;padding:clamp(16px,3vw,32px);max-width:1140px;border-radius:24px;background:linear-gradient(145deg,#152b43,#273f58 58%,#15364e);color:#f8fbff;box-shadow:0 22px 46px #10263d33;font-family:inherit}
.dmc4 *{box-sizing:border-box}
.dmc4-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:24px}
.dmc4-head span:first-child{font-size:.73rem;font-weight:800;letter-spacing:.14em;color:#88decb}
.dmc4-head h2{margin:6px 0 10px;color:#fff;font-size:clamp(1.5rem,3vw,2.1rem)}
.dmc4-head p{margin:0;color:#d8e6f4;line-height:1.55}
.dmc4-badge{flex-shrink:0;padding:9px 14px;border:1px solid #94e5d6;border-radius:99px;color:#b9f5e5;font-size:.75rem;font-weight:800;letter-spacing:.05em}
.dmc4-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(220px,1fr);gap:22px;align-items:start}
.dmc4-cabinet{padding:clamp(12px,2.5vw,26px);border:1px solid #ffffff2a;border-radius:20px;background:#12243d;box-shadow:inset 0 2px 14px #0d1d3440}
.dmc4-players{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;color:#f4fcff;font-size:.95rem}
.dmc4-status{min-height:2.3em;padding:10px 4px;text-align:center;color:#c7f2ff;font-weight:700}
.dmc4-board{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(3px,.8vw,8px);padding:clamp(7px,1.2vw,12px);background:linear-gradient(#226ac7,#144aab);border-radius:16px;border:4px solid #0c3c85;box-shadow:inset 0 4px 15px #071d5b66,0 10px 0 #0b3168;max-width:650px;margin:auto}
.dmc4-column{display:flex;flex-direction:column;gap:clamp(3px,.8vw,8px);padding:0;border:none;background:transparent;cursor:pointer;min-width:0;outline-offset:4px}
.dmc4-column:hover:not(:disabled) .dmc4-cell:not(.human):not(.cpu){background:#dae9f9}
.dmc4-column:disabled{cursor:default}
.dmc4-column:focus-visible{outline:3px solid #ffde70;border-radius:10px}
.dmc4-cell{display:block;width:100%;aspect-ratio:1;border-radius:50%;border:2px solid #164489;background:#f0f5fc;box-shadow:inset 0 4px 7px #07234d30}
.dmc4-cell.human{background:radial-gradient(circle at 35% 28%,#ff9e93,#ed3d3a 65%,#b71c28);border-color:#a0222b;box-shadow:inset 0 4px 8px #fff5,0 1px 3px #071d5b77}
.dmc4-cell.cpu{background:radial-gradient(circle at 35% 28%,#fff4b1,#ffd13f 65%,#de8f04);border-color:#c78305;box-shadow:inset 0 4px 8px #fff7,0 1px 3px #071d5b77}
.dmc4-aside{padding:24px;border-radius:20px;background:#fff;color:#23354b}
.dmc4-aside h3{margin:0 0 10px;color:#203850}
.dmc4-aside p{line-height:1.55}
.dmc4-aside label{display:block;margin:20px 0 14px;font-size:.9rem;font-weight:700}
.dmc4-aside select{display:block;margin-top:9px;width:100%;padding:12px;border-radius:10px;border:1px solid #afc5da;font:inherit;color:#22364d;background:#fff}
.dmc4-aside button{width:100%;padding:12px 18px;border:none;border-radius:12px;background:#17654c;color:white;font:inherit;font-weight:800;cursor:pointer}
.dmc4-aside button:hover{background:#0f4d39}
.dmc4-aside small{display:block;margin-top:19px;color:#5b6c7c;line-height:1.5}
@media(max-width:740px){.dmc4-grid{grid-template-columns:1fr}.dmc4-head{flex-direction:column;gap:12px}.dmc4-badge{align-self:start}.dmc4-aside{padding:18px}.dmc4-cabinet{padding:9px}.dmc4-board{border-width:2px}.dmc4-cell{border-width:1px}}