.rectangle-board .slot{aspect-ratio:1.55}.rectangle-board .slot svg{background:#f9f4e4}.triangle-board{display:block!important;aspect-ratio:1;gap:0!important}.triangle-board .slot{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;border:0;border-radius:0;background:transparent}.triangle-board .slot[data-sector="0"]{clip-path:polygon(0 0,100% 0,50% 50%)}.triangle-board .slot[data-sector="1"]{clip-path:polygon(100% 0,100% 100%,50% 50%)}.triangle-board .slot[data-sector="2"]{clip-path:polygon(100% 100%,0 100%,50% 50%)}.triangle-board .slot[data-sector="3"]{clip-path:polygon(0 100%,0 0,50% 50%)}.triangle-board .slot.fixed{background:#e9efe5}.triangle-board .slot.fixed:after{display:none}.triangle-board .slot.target{background:#ffe1a0;outline:0}.triangle-board .slot.error{background:#eaa795;outline:0}.triangle-board .slot.partner{background:#f3d190;outline:0}.triangle-board .slot.selected{background:#ffe1a0;outline:0}.triangle-board .slot:focus-visible{background:#ffe1a0;outline:0}.triangle-tray .tile{padding:0;background:#f7f7ef}.triangle-mode .unit-area{width:100%}.triangle-mode #board{width:min(330px,calc(100cqh - 36px),80cqw)}.triangle-board .axis-line,.triangle-board .turn-centre{z-index:5}.triangle-board .slot.fixed svg{opacity:.8}.triangle-board .slot.error svg,.triangle-board .slot.partner svg,.triangle-board .slot.target svg{opacity:.7}
.rectangle-tray .tile{aspect-ratio:1.55}.rectangle-board .slot svg,.rectangle-tray .tile svg{width:100%;height:100%}

.source-cloth{max-width:100%;max-height:340px;object-fit:contain}#photoView{margin-left:8px}

#photoView{grid-column:2;grid-row:1;font-size:10px;padding:4px 6px}.hex-board{display:block!important;aspect-ratio:1}.hex-board .slot{position:absolute;width:36%;height:31.176%;transform:translate(-50%,-50%);aspect-ratio:auto;border-radius:0;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);border:0;background:#dce5dc}.hex-board .slot svg{width:100%;height:100%}.hex-board .slot.fixed:after{display:none}.hex-mode #board{width:min(350px,calc(100cqh - 26px),80cqw)}.hex-mode .unit-area{width:100%}.workspace .hex-tray{gap:5px!important;flex-wrap:wrap}.workspace .hex-tray .tile{width:43px;height:38px;border:0;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:#dce5dc}@media(max-width:700px){.workspace .hex-tray .tile{width:27px;height:24px}#photoView{font-size:8px;padding:2px}.workspace .hex-tray{gap:2px!important}.hex-mode #board{width:min(310px,calc(100cqh - 26px),85cqw)}}

.hex-board .slot.target,.hex-board .slot.partner{background:#f3d190}.hex-board .slot.error{background:#eaa795}.hex-board .slot.target svg,.hex-board .slot.partner svg,.hex-board .slot.error svg{opacity:.65}

@media(max-width:700px){.workspace #tray.hex-tray{display:grid!important;grid-template-columns:repeat(6,36px);gap:3px!important}.workspace .hex-tray .tile{width:36px;height:32px}}
#motifPicker{grid-column:3;grid-row:1;max-width:180px;font:inherit;font-size:10px;padding:4px;border:1px solid var(--line);border-radius:6px;background:white;color:var(--ink)}.shape-wallpaper .unit-area{width:46%}.shape-wallpaper #board{width:min(300px,calc(100cqh - 30px),95cqw)}.shape-wallpaper #wallpaperPanel{width:49%}.shape-wallpaper #wallpaper{width:100%;border:1px solid #bdcbbb;overflow:hidden}.infinite-preview{width:100%;height:100%;display:block}.hex-board .slot{width:28%;height:24.2487%}.shape-wallpaper .board-area{gap:12px}.shape-wallpaper .unit-area{container-type:size;height:100%;justify-content:center}.shape-wallpaper .preview-head{font-size:8px}@media(max-width:700px){#motifPicker{max-width:135px;font-size:8px}.shape-wallpaper .board-area{gap:7px;padding:7px}.shape-wallpaper #board{width:min(240px,calc(100cqh - 22px),95cqw)}.shape-wallpaper .preview-head{font-size:6px}.shape-wallpaper #wallpaperPanel p{font-size:7px}}
@media(min-width:701px){.workspace .hex-tray{gap:3px!important}.workspace .hex-tray .tile{width:40px;height:34.64px}}
.equilateral-board{aspect-ratio:1.154700538!important}.equilateral-board .slot{transform:none;border:0;background:#eef1e8}.workspace .equilateral-tray .tile{clip-path:polygon(50% 0,100% 100%,0 100%)}.equi-mirror{position:absolute;left:50%;top:0;height:100%;width:2px;background:#3475d2;transform:rotate(30deg);pointer-events:none;z-index:4}
.diamond-study .slot,.diamond-study .tile{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);border:0;background:#f0dfc8}
.workspace .whole-hex-tray .tile{width:64px;height:55px}@media(max-width:700px){.workspace #tray.whole-hex-tray{grid-template-columns:repeat(3,48px)!important}.workspace .whole-hex-tray .tile{width:48px;height:42px}}