.front-sticker-workspace{display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0;width:100%}
.front-sticker-open{min-height:44px;padding:10px 20px;border:1px solid var(--at-line,#9e677e);border-radius:24px;background:var(--at-surface,#361827);color:var(--at-ink,#fce7f3);font:14px Jost,sans-serif;cursor:pointer}
.front-sticker-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:12}
.front-sticker{position:absolute;aspect-ratio:1;display:block;padding:0;border:0;background:none}
.front-sticker-art{display:block;width:100%;height:100%;aspect-ratio:1;background-size:300% 200%;background-repeat:no-repeat;pointer-events:none}
.front-sticker-edit .front-sticker-quick-remove,.draw-sticker-quick-remove{position:absolute;z-index:20;pointer-events:auto;display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:#713c51;transform:translate(-50%,-50%);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;}
.front-sticker-quick-remove[hidden]{display:none!important;}
.front-sticker-remove-face{display:grid;place-items:center;width:30px;height:30px;border:1px solid #e1bdc8;border-radius:11px;background:#fffaf5;box-shadow:0 2px 4px #713c5112,0 5px 14px #713c5126;transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;}
.front-sticker-remove-face svg{pointer-events:none;}
.front-sticker-quick-remove:not([hidden]) .front-sticker-remove-face{animation:sticker-remove-appear .25s cubic-bezier(.2,1.4,.4,1) both;}
.front-sticker-quick-remove:hover .front-sticker-remove-face,.front-sticker-quick-remove:focus-visible .front-sticker-remove-face{background:#713c51;color:#fffaf5;box-shadow:0 4px 14px #713c5138;}
.front-sticker-quick-remove:active .front-sticker-remove-face{transform:scale(.86);background:#a84e71;color:#fffaf5;}
@keyframes sticker-remove-appear{from{opacity:0;scale:.65;rotate:-12deg}to{opacity:1;scale:1;rotate:0deg}}
@media(prefers-reduced-motion:reduce){.front-sticker-quick-remove .front-sticker-remove-face{animation:none!important;transition:none;}}
.front-sticker-preview{width:min(100%,calc((94dvh - 240px)*.7375));justify-self:center;align-self:start}
.front-sticker-dialog{width:min(1060px,96vw);max-width:96vw;max-height:94dvh;padding:24px;border:1px solid #bd8b9c;border-radius:22px;background:#fff5e9;color:#563844;font:14px Jost,sans-serif;overflow:auto}
.front-sticker-dialog::backdrop{background:#24111ec9}.front-sticker-dialog header{display:flex;align-items:center;justify-content:space-between;gap:16px}.front-sticker-dialog h2{font:500 30px 'Cormorant Garamond',serif;margin:0}.front-sticker-dialog header>div{display:flex;gap:8px}.front-sticker-dialog button,.front-sticker-dialog select{font:inherit;min-height:44px;cursor:pointer}.front-sticker-dialog header button,.front-sticker-controls button{border:1px solid #bd8b9c;padding:8px 15px;border-radius:22px;background:transparent;color:inherit}.front-sticker-dialog .front-sticker-save{background:#713c51;color:#fff8ed;border-color:#713c51}.front-sticker-status{line-height:1.5;color:#795a66}.front-sticker-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.85fr);gap:28px}.front-sticker-board{position:relative;width:100%;aspect-ratio:472/640;isolation:isolate;border-radius:18px;overflow:hidden}.front-sticker-edit .front-sticker{pointer-events:auto;touch-action:none;cursor:grab;min-height:0}.front-sticker-edit .front-sticker[aria-pressed=true]{outline:2px dashed #a84e71;outline-offset:1px;border-radius:12px}.front-sticker-controls{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px;align-items:center}.front-sticker-controls label{flex:1;min-width:110px;display:grid;gap:5px}.front-sticker-controls input{width:100%;min-height:28px;accent-color:#a84e71}.front-sticker-library select{width:100%;padding:10px;border:1px solid #bd8b9c;border-radius:10px;background:#fffaf3;color:inherit;margin-bottom:12px}.front-sticker-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:570px;overflow:auto;padding:4px}.front-sticker-picker button{border:1px solid #dcc4c7;background:#fffaf3;border-radius:12px;padding:8px;color:#563844;display:flex;flex-direction:column;align-items:center;gap:4px}.front-sticker-picker button:hover{background:#f8e1df}.front-sticker-picker .front-sticker-art{height:auto}.front-sticker-picker button>span:last-child{font-size:11px}.front-sticker-dialog button:focus-visible,.front-sticker-dialog select:focus-visible{outline:2px solid #a84e71;outline-offset:3px}.front-sticker-dialog button:disabled{opacity:.45;cursor:default}
@media(max-width:700px){.front-sticker-dialog{padding:14px}.front-sticker-dialog header{align-items:start}.front-sticker-dialog h2{font-size:24px}.front-sticker-dialog header>div{flex-shrink:0}.front-sticker-dialog header button{padding:8px 11px}.front-sticker-layout{grid-template-columns:1fr;gap:18px}.front-sticker-preview{width:min(100%,240px);margin:auto}.front-sticker-picker{max-height:220px;grid-template-columns:repeat(4,minmax(0,1fr))}.front-sticker-status{font-size:12px}}
@media(max-width:760px){
  .front-sticker-dialog{box-sizing:border-box;width:100%;max-width:100%;height:100dvh;max-height:100dvh;margin:0;padding:12px;padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom));border:0;border-radius:0;overflow:hidden;}
  .front-sticker-dialog[open]{display:flex;flex-direction:column;}
  .front-sticker-dialog header{flex:none;align-items:center;gap:8px;}
  .front-sticker-dialog h2{font-size:24px;line-height:1.05;}
  .front-sticker-dialog header>div{gap:5px;flex-shrink:0;}
  .front-sticker-dialog header button{padding:8px 10px;font-size:12px;}
  .front-sticker-status{flex:none;font-size:12px;line-height:1.4;margin:10px 0;}
  .front-sticker-layout{flex:1;min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(130px,42%) minmax(0,1fr);gap:12px;}
  .front-sticker-preview{display:grid;grid-template-columns:minmax(0,1fr) 116px;align-items:center;gap:12px;width:100%;height:100%;min-height:0;margin:0;}
  .front-sticker-board{width:auto;height:100%;max-width:100%;justify-self:center;border-radius:12px;}
  .front-sticker-controls{margin:0;display:flex;flex-direction:column;gap:10px;align-items:stretch;}
  .front-sticker-controls label{min-width:0;flex:none;font-size:12px;}
  .front-sticker-controls input{min-height:44px;margin:0;}
  .front-sticker-controls button{font-size:12px;padding:8px;}
  .front-sticker-library{display:flex;flex-direction:column;min-height:0;overflow:hidden;border-top:1px solid #dcc4c7;padding-top:12px;}
  .front-sticker-library select{flex:none;font-size:16px;margin-bottom:8px;}
  .front-sticker-picker{min-height:0;flex:1;max-height:none;overflow-y:auto;overscroll-behavior:contain;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;}
  .front-sticker-picker{grid-auto-rows:max-content;}
  .front-sticker-picker button{min-height:120px;overflow:hidden;}
  .front-sticker-picker .front-sticker-art{flex-shrink:0;width:100%;height:auto;aspect-ratio:1;}
}
/* The phone decoration desk shares the drawing desk's right-hand palette. */
@media(max-width:760px){
  .front-sticker-dialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;margin:0;padding:0;border:0;border-radius:0;background:var(--at-surface);color:var(--at-ink);}
  .front-sticker-dialog[open]{display:flex;flex-direction:column;background:rgb(from var(--at-surface) r g b / 1);animation:drawing-desk-enter .38s cubic-bezier(.2,.8,.2,1) both;}
  .front-sticker-dialog header{flex:none;padding:10px 14px;padding-top:max(10px,env(safe-area-inset-top));border-bottom:1px solid var(--at-line);gap:10px;}
  .front-sticker-dialog h2{font-size:25px;line-height:1.1;}
  .front-sticker-dialog header>div{display:flex;gap:6px;flex-shrink:0;}
  .front-sticker-dialog header button{padding:8px 12px;min-height:44px;font-size:12px;border-color:var(--at-line);color:var(--at-ink);}
  .front-sticker-dialog header .front-sticker-save{background:var(--at-accent);border-color:transparent;color:var(--at-accent-text);}
  .front-sticker-status{flex:none;margin:0;padding:10px 14px;color:var(--at-muted);font:12px/1.4 Jost,sans-serif;}
  .front-sticker-layout{flex:1;min-height:0;display:flex;position:relative;gap:0;}
  .front-sticker-preview{flex:1;display:flex;align-self:stretch;align-items:center;justify-content:center;min-height:0;width:100%;height:auto;padding:12px 26px 12px 12px;box-sizing:border-box;container-type:size;background:color-mix(in srgb,var(--at-surface2) 65%,transparent);}
  .front-sticker-board{flex:none;height:auto;width:min(100%,calc(100cqh * .7375));max-width:100%;max-height:100%;aspect-ratio:472/640;border-radius:12px;box-shadow:0 12px 40px #0003;transition:transform .48s cubic-bezier(.22,1,.36,1);}
  .front-sticker-dialog.drawing-tools-open .front-sticker-board{transform:translateX(-10px) scale(.985);}
  .front-sticker-library{position:absolute;z-index:4;right:0;top:0;bottom:0;width:min(350px,calc(100% - 44px));box-sizing:border-box;display:flex;flex-direction:column;gap:12px;min-height:0;padding:14px 16px max(14px,env(safe-area-inset-bottom));border:0;border-left:1px solid var(--at-line);border-radius:24px 0 0 24px;background:var(--at-surface);background:rgb(from var(--at-surface) r g b / 1);transform:translateX(105%);visibility:hidden;overflow:hidden;box-shadow:-18px 0 48px #22121d30;transition:transform .48s cubic-bezier(.22,1,.36,1),visibility .48s;}
  .front-sticker-dialog.drawing-tools-open .front-sticker-library{transform:translateX(0);visibility:visible;}
  .front-sticker-library select{flex:none;width:100%;min-height:44px;margin:0;padding:10px 12px;font-size:16px;background:var(--at-surface2);color:var(--at-ink);border-color:var(--at-line);}
  .front-sticker-picker{flex:1;min-height:0;max-height:none;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:max-content;align-content:start;overflow-y:auto;overscroll-behavior:contain;padding:3px;gap:8px;}
  .front-sticker-picker button{min-height:0;padding:7px;background:var(--at-surface2);color:var(--at-ink);border-color:var(--at-line);border-radius:16px;}
  .front-sticker-picker .front-sticker-art{width:100%;height:auto;aspect-ratio:1;flex:none;}
  .front-sticker-picker button>span:last-child{font-size:10px;line-height:1.4;}
  .front-sticker-controls{flex:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;padding-top:10px;border-top:1px solid var(--at-line);color:var(--at-muted);}
  .front-sticker-controls label{min-width:0;font-size:12px;}
  .front-sticker-controls input{min-height:44px;margin:0;accent-color:var(--at-accent);}
  .front-sticker-controls button{grid-column:1/-1;font-size:12px;padding:8px;border-color:var(--at-line);color:var(--at-ink);}
}
@media(prefers-reduced-motion:reduce){.front-sticker-dialog[open]{animation:none}.front-sticker-library,.front-sticker-board{transition:none;}}
