/* Grid drawing tool: paper preview stage, chips, picture drag */
.gd-app{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.gd-or{margin:12px 0 0;text-align:center}
.gd-chips{margin:6px 0 15px}
.gd-chips .chip{min-height:36px}
.gd-sw{margin:2px 0 14px}
.swatches.gd-sw2{margin:6px 0 16px}
.gd-stage{background:#e9e7df;border:2px solid var(--ink);border-radius:var(--r-sm);padding:14px;position:relative;display:grid;place-items:center}
.gd-page{display:block;width:100%;max-width:440px;height:auto;aspect-ratio:210/297;background:#fff;border-radius:3px;box-shadow:0 10px 26px rgba(0,0,0,.16)}
.gd-page.land{max-width:100%}
.gd-page.drag{cursor:grab;touch-action:none}.gd-page.drag:active{cursor:grabbing}
.gd-stage.sample::after{content:"Sample: add your picture";position:absolute;top:22px;left:50%;transform:translateX(-50%);background:var(--sun);color:var(--ink);border:2px solid var(--ink);border-radius:999px;padding:4px 12px;font-weight:700;font-size:12.5px;box-shadow:2px 2px 0 var(--ink);white-space:nowrap;pointer-events:none}
.gd-sum{font-size:14px;font-weight:600;color:var(--ink-2);margin:12px 0}
.gd-tip{margin-top:12px}
@media (max-width:900px){.gd-app{grid-template-columns:1fr}}
@media (max-width:420px){.gd-stage{padding:8px}}
.gd-app .panel>.group{border-top:2px dashed var(--line);padding-top:20px;margin-top:20px}
