.dm{--dm-blue:#1d4ed8;--dm-red:#c62828;--dm-green:#15803d;--dm-cell:26px;margin:1rem 0 1.5rem;padding:12px;border:2px solid var(--a);border-radius:12px;background:var(--soft);font-size:15px;line-height:1.4}
.dm *{box-sizing:border-box}
.dm-note{margin:0 0 .75rem;padding:.4rem .6rem;border-radius:6px;background:var(--a);color:#fff;font-weight:700;font-size:.9rem;text-align:center}
.dm-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:.75rem}
.dm-stat{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:.35rem .5rem;min-width:0}
.dm-stat-l{display:block;color:var(--mut);font-size:.72rem}
.dm-stat-v{display:block;font-size:1.05rem;overflow-wrap:anywhere}
.dm-table{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:.5rem}
.dm-side{background:var(--bg);border:2px solid var(--line);border-radius:10px;padding:.4rem .5rem;min-height:7rem}
.dm-side-p{border-color:var(--dm-blue)}
.dm-side-b{border-color:var(--dm-red)}
.dm-side-h{display:flex;justify-content:space-between;align-items:center;font-weight:700}
.dm-side-p .dm-side-h{color:var(--dm-blue)}
.dm-side-b .dm-side-h{color:var(--dm-red)}
.dm-total{font-size:1.5rem}
.dm-cards{display:flex;flex-wrap:wrap;gap:4px;margin-top:.35rem}
.dm-card{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:40px;height:56px;border:1px solid #888;border-radius:5px;background:#fff;color:#111;font-weight:700;line-height:1.1}
.dm-card b{font-size:1.05rem}
.dm-card i{font-style:normal;font-size:1rem}
.dm-red{color:var(--dm-red)}
.dm-result{min-height:2.8em;margin:.25rem 0 .6rem;padding:.4rem .6rem;border-radius:6px;background:var(--bg);border:1px solid var(--line);font-weight:700}
.dm-spots{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-bottom:.6rem}
.dm-spots-3{grid-template-columns:repeat(3,1fr)}
.dm-spot{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:64px;padding:.3rem .2rem;border:2px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font:inherit;cursor:pointer}
.dm-spot:disabled{cursor:default;opacity:.75}
.dm-spot-n{font-weight:700;font-size:.95rem}
.dm-spot-o{font-size:.72rem;color:var(--mut)}
.dm-spot-a{font-weight:800;min-height:1.2em;color:var(--a)}
.dm-spot-pp,.dm-spot-t,.dm-spot-bp{grid-column:span 2}
.dm-spot-p,.dm-spot-b{grid-column:span 3}
.dm-spots-3 .dm-spot-t,.dm-spots-3 .dm-spot-d,.dm-spots-3 .dm-spot-g{grid-column:auto}
.dm-spot-p,.dm-spot-d{border-color:var(--dm-blue)}
.dm-spot-b,.dm-spot-g{border-color:var(--dm-red)}
.dm-spot-t{border-color:var(--dm-green)}
.dm-spot.dm-on{background:#fff;box-shadow:0 0 0 3px var(--a)}
.dm-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:.6rem}
.dm-chip{width:52px;height:52px;border-radius:50%;border:4px dashed #fff;outline:3px solid var(--a);background:var(--a);color:#fff;font:700 .85rem var(--f);cursor:pointer}
.dm-chip.dm-sel{outline-color:var(--ink);transform:scale(1.1)}
.dm-chip:disabled{opacity:.6;cursor:default}
.dm-actions,.dm-foot{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:.6rem}
.dm-btn{min-height:44px;padding:.4rem .8rem;border:2px solid var(--a);border-radius:8px;background:var(--bg);color:var(--a);font:700 .95rem var(--f);cursor:pointer}
.dm-btn:disabled{opacity:.45;cursor:default}
.dm-primary{flex:1 1 100%;background:var(--a);color:#fff;font-size:1.1rem}
.dm-ghost{border-color:var(--line);color:var(--mut);font-weight:400}
.dm button:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.dm-tally{margin:.25rem 0;color:var(--mut);font-size:.85rem}
.dm-roads{display:grid;gap:8px}
.dm-road-box{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:.35rem .5rem}
.dm-road-title{margin:0 0 .25rem;font-size:.85rem}
.dm-road-scroll{overflow-x:auto;padding-bottom:2px}
.dm-road{display:grid;grid-template-rows:repeat(6,var(--dm-cell));grid-auto-flow:column;width:max-content;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:var(--dm-cell) var(--dm-cell)}
.dm-bead-cell,.dm-big-cell{position:relative;display:flex;align-items:center;justify-content:center;width:var(--dm-cell);height:var(--dm-cell)}
.dm-bead-cell{margin:2px;width:calc(var(--dm-cell) - 4px);height:calc(var(--dm-cell) - 4px);border-radius:50%;color:#fff;font-weight:700;font-size:.8rem}
.dm-bead-cell.dm-w-A{background:var(--dm-blue)}
.dm-bead-cell.dm-w-B{background:var(--dm-red)}
.dm-bead-cell.dm-w-T{background:var(--dm-green)}
.dm-ring{display:block;width:18px;height:18px;border-radius:50%;border:3px solid currentColor}
.dm-big-cell.dm-w-A{color:var(--dm-blue)}
.dm-big-cell.dm-w-B{color:var(--dm-red)}
.dm-tie{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:.6rem;font-weight:800;color:var(--dm-green);background:linear-gradient(135deg,transparent 45%,var(--dm-green) 45%,var(--dm-green) 55%,transparent 55%)}
.dm-pa,.dm-pb{position:absolute;width:7px;height:7px;border-radius:50%;border:1px solid #fff;text-decoration:none}
.dm-pa{top:0;left:0;background:var(--dm-blue)}
.dm-pb{bottom:0;right:0;background:var(--dm-red)}
.dm-legend{margin:.5rem 0 0;color:var(--mut);font-size:.8rem}
.dm-noscript{padding:.75rem 1rem;border:1px dashed var(--line);border-radius:8px;background:var(--soft)}
@media(min-width:40rem){.dm{padding:16px}.dm-primary{flex:0 0 auto;min-width:10rem}.dm-card{width:46px;height:64px}}
@media(prefers-reduced-motion:reduce){.dm *{transition:none!important;animation:none!important}}
