.place-bar{display:flex;justify-content:space-between;align-items:end;gap:18px;margin:0 0 22px}.place-bar>div:first-child{max-width:240px;flex:1}.place-stage{position:relative;border:1px solid var(--ink);border-radius:16px;overflow:hidden;background:#eae5db}.place-stage canvas{display:block;width:100%;height:auto;touch-action:none;cursor:crosshair;outline-offset:-5px!important;image-rendering:pixelated}.place-coordinate{position:absolute;left:15px;bottom:15px;border:1px solid #d9d1c5;background:#fffdf4de;padding:6px 12px;border-radius:99px;font-size:11px;pointer-events:none}.place-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:22px 0}.place-bottom .swatches{max-width:700px}.place-bottom .swatch{width:27px;height:27px}.place-bottom input[type=color]{width:42px;height:43px;padding:3px;border:1px solid var(--line);border-radius:6px;background:transparent}.place-stage canvas:focus-visible{outline:3px solid var(--purple)}@media(max-width:780px){.place-bar{flex-wrap:wrap}.place-bar>.actions{order:3;width:100%}.place-bar>.actions .btn{padding:10px;font-size:12px}.place-bottom{flex-direction:column;align-items:stretch}.place-bottom>.actions{justify-content:space-between}.place-stage canvas{height:440px;object-fit:cover}.place-bottom .swatches{gap:11px}.place-bottom .swatch{width:29px;height:29px}}@media(max-width:450px){.place-bar>.pill{font-size:9px}.place-bar>.actions{gap:7px}.place-bar>.actions .btn{font-size:11px}.place-stage canvas{height:390px}}
