@import url("../paper-pop/style.css?v=20260926-2");

h1 em{color:var(--red)}
.dots-sheet{position:relative;background:transparent;border:0;box-shadow:none;padding:22px;min-width:calc(var(--size) * 34px + (var(--size) + 1) * 8px + 44px)}
.dots-board{display:grid;aspect-ratio:1;width:100%;isolation:isolate}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ink);align-self:center;justify-self:center;z-index:4;box-shadow:0 0 0 2px #fcfaf5}
.box{display:flex;align-items:center;justify-content:center;z-index:0;font-family:"Patrick Hand",cursive;font-size:clamp(18px,3vw,36px);opacity:.9;transition:background .2s,transform .2s}
.box.owner-0{color:var(--red);background:rgba(185,71,45,.12)}
.box.owner-1{color:var(--blue);background:rgba(40,95,131,.12)}
.box.new{animation:box-in .3s ease-out}
.edge{position:relative;z-index:2;align-self:stretch;justify-self:stretch;opacity:1!important;padding:0}
.edge:before{content:"";position:absolute;border-radius:4px;background:transparent;transition:background .15s,transform .15s}
.edge.horizontal{height:44px;align-self:center;margin-block:-18px}
.edge.horizontal:before{height:4px;left:0;right:0;top:20px}
.edge.vertical{width:44px;justify-self:center;margin-inline:-18px}
.edge.vertical:before{width:4px;top:0;bottom:0;left:20px}
.edge.open:not(:disabled):hover:before,.edge.open:not(:disabled):focus-visible:before{background:rgba(37,45,48,.35);transform:scale(1.05)}
.edge.owner-0:before{background:var(--red)}
.edge.owner-1:before{background:var(--blue)}
.edge.last:before{animation:line-in .24s ease-out}
.edge:focus-visible{outline-offset:-7px}
.dots-help{border-left:2px solid var(--rule);padding-left:14px}
.workspace,.edge.last:before,.box.new,.board-caption .timer.urgent{animation:none!important}
.board-caption .timer.urgent{outline:2px solid var(--red);outline-offset:3px}
@keyframes line-in{from{transform:scale(.1);opacity:.2}}
@keyframes box-in{from{transform:scale(.7);opacity:0}}
@media(max-width:760px){.board-area{overflow-x:auto;padding:0 4px 12px}.dots-sheet{padding:18px}.dots-board{min-height:360px}.playing .controls{display:block}.playing .room-info{display:flex}.playing .turn-help{margin:8px 0!important}.dots-help{font-size:11px!important}.edge.horizontal{height:44px}.edge.vertical{width:44px}}
@media(prefers-reduced-motion:reduce){.box,.edge:before{animation:none!important;transition:none!important}}
