*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --cream:#F5F1DE; --card:#FFFFFF; --ink:#22301F; --ink-dim:#6E7A69;
  --sage:#8FAE7C; --sage-light:#E4ECDA; --coral:#FF6F91; --coral-light:#FFE3EA; --pill:#1E2A20; --pill-text:#fff;
  --grad:linear-gradient(100deg,#bfe0a8 0%,#ffe2bf 52%,#ff9fba 100%);
  --border:rgba(34,48,31,0.10); --shadow-sm:0 3px 12px rgba(60,70,40,0.08);
}
html,body{height:100%;overflow:hidden;overscroll-behavior:none;}
body{font-family:'Nunito',sans-serif;background:var(--cream);color:var(--ink);display:flex;flex-direction:column;height:100vh;height:100dvh;}
button,input,select{font-family:inherit;}
h1,h2,h3,.st-logo{font-family:'Baloo 2',cursive;}
.st-mini{font-size:10px;font-weight:800;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.3px;}

/* ── header ── */
.st-header{position:relative;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 16px;background:var(--card);border-bottom:1px solid var(--border);z-index:30;}
.st-header::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--grad);}
.st-logo{font-size:18px;font-weight:800;}
.st-logo .dot{color:var(--coral);}
.st-logo small{font-size:10.5px;font-weight:800;color:var(--ink-dim);letter-spacing:.5px;text-transform:uppercase;margin-left:4px;}
.st-link{font-size:12px;font-weight:800;color:var(--sage);text-decoration:none;}

/* ═══════════ PHONE (default): one screen, sheet on top, library docked at the bottom ═══════════ */
.st-stage{position:relative;z-index:1;flex:1 1 auto;min-height:0;width:100%;max-width:760px;margin:0 auto;display:flex;flex-direction:column;padding:6px 10px 0;}
.st-view{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;}
.st-libcol{position:relative;flex:0 0 auto;}

/* summary + context row: desktop only */
.st-summary,.st-ctx{display:none;}

/* paper */
.st-paper-area{position:relative;flex:1 1 auto;min-height:0;display:flex;align-items:flex-start;justify-content:center;padding-top:12px;}
.st-sheet-wrap{position:relative;line-height:0;isolation:isolate;}
.st-sheet-wrap canvas{display:block;background:#fff;box-shadow:0 6px 22px rgba(0,0,0,.18);border-radius:2px;cursor:pointer;}
.st-sheet-wrap #fxCanvas{position:absolute;left:0;top:0;pointer-events:none;z-index:2;background:transparent;box-shadow:none;border-radius:0;cursor:default;}
.st-paper-hint{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font-size:14px;font-weight:800;color:var(--ink-dim);pointer-events:none;line-height:1.5;}
.st-busy{position:absolute;top:6px;left:50%;transform:translateX(-50%);background:var(--pill);color:#fff;border-radius:20px;padding:3px 12px;font-size:11px;font-weight:800;z-index:3;}
.st-sheet-tabs{position:absolute;top:4px;left:0;display:flex;gap:5px;z-index:3;flex-wrap:wrap;}
.st-chip{padding:4px 11px;border-radius:20px;border:1px solid var(--border);background:rgba(255,255,255,.9);color:var(--ink);font-size:11.5px;font-weight:800;cursor:pointer;white-space:nowrap;}
.st-chip.active{background:var(--pill);color:var(--pill-text);border-color:var(--pill);}
.st-warnbar{position:absolute;left:0;right:0;bottom:4px;display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;z-index:3;}
.st-warn{background:var(--coral-light);color:#b0304f;border-radius:8px;padding:5px 10px;font-size:11.5px;font-weight:800;box-shadow:0 2px 8px rgba(0,0,0,.1);}

/* floating buttons (phone) */
.st-lrail{position:absolute;left:2px;bottom:6px;z-index:4;display:flex;flex-direction:column;gap:8px;}
.st-fab{width:34px;height:34px;border-radius:50%;border:none;background:var(--grad);color:var(--ink);box-shadow:0 4px 14px rgba(255,111,145,.35);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:pointer;}
.st-fab svg{width:16px;height:16px;}
.st-fab span{display:none;}
.st-fab:active{transform:scale(.93);}

/* tiny tools beside the tapped sticker (phone) */
.st-pt{position:absolute;z-index:4;display:flex;gap:6px;}
.st-pt-v{flex-direction:column;}
.st-pt button{width:28px;height:28px;border-radius:50%;border:none;background:#fff;color:var(--ink);font-size:17px;font-weight:800;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.24);cursor:pointer;padding:0;}
.st-pt button svg{width:14px;height:14px;}
.st-pt button.del{color:#e5395f;}
.st-pt button:active{transform:scale(.9);}

/* white holder bar (always under the sheet) */
.st-holder-bar{flex:0 0 auto;display:flex;align-items:center;flex-wrap:wrap;gap:2px 12px;padding:4px 4px 6px;margin-top:2px;}
.st-h-label{display:none;font-size:10px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--ink-dim);}
.st-seg{display:inline-flex;gap:0;flex-wrap:nowrap;}
.st-seg button{background:none;border:none;border-bottom:2px solid transparent;padding:4px 7px;font-size:12px;font-weight:700;color:var(--ink-dim);cursor:pointer;white-space:nowrap;}
.st-seg button:hover{color:var(--ink);}
.st-seg button.active{color:var(--ink);font-weight:900;border-bottom-color:var(--coral);}
.st-hb-width{display:flex;align-items:center;gap:8px;flex:1 1 130px;min-width:120px;}
.st-range{flex:1;min-width:70px;-webkit-appearance:none;appearance:none;height:3px;border-radius:3px;outline:none;--pct:37.5%;background:linear-gradient(90deg,#bfe0a8 0%,#ffd9a8 55%,#ff8fb1 100%) 0 0/var(--pct) 100% no-repeat,var(--sage-light);}
.st-range::-moz-range-track{background:transparent;height:3px;}
.st-range::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:50%;background:var(--ink);border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.25);cursor:pointer;}
.st-range::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--ink);border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.25);cursor:pointer;}
.st-range-val{font-size:12px;font-weight:800;color:var(--ink);min-width:34px;text-align:right;}
.st-check{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--ink-dim);cursor:pointer;white-space:nowrap;}
.st-check input{accent-color:var(--ink);width:14px;height:14px;}
.st-swatches{display:flex;align-items:center;gap:5px;flex-wrap:wrap;}
.st-sw{width:19px;height:19px;border-radius:50%;border:1.5px solid rgba(34,48,31,.16);padding:0;cursor:pointer;flex:0 0 auto;transition:transform .12s;}
.st-sw:hover{transform:scale(1.12);}
.st-sw.active{box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--ink);}
.st-holder-bar .st-check{margin-left:auto;}
.st-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#e6007e;}

/* bottom pop-up: floats over the sheet, never resizes it */
.st-panel{position:absolute;left:-10px;right:-10px;bottom:100%;z-index:6;max-height:0;overflow:hidden;opacity:0;background:var(--card);border:1px solid var(--border);border-bottom:none;border-radius:16px 16px 0 0;box-shadow:0 -8px 24px rgba(60,70,40,.16);display:flex;flex-direction:column;transition:max-height .26s ease,opacity .2s ease;}
.st-panel.open{max-height:min(28vh,230px);opacity:1;}
.st-panel-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px 4px;position:relative;}
.st-panel-head::before{content:'';position:absolute;top:5px;left:50%;width:34px;height:4px;margin-left:-17px;border-radius:3px;background:var(--border);}
.st-panel-title{display:flex;align-items:baseline;gap:10px;min-width:0;}
.st-panel-title b{font-family:'Baloo 2',cursive;font-size:15px;font-weight:800;}
.st-panel-title span{font-size:11px;font-weight:700;color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.st-panel-close{background:none;border:none;color:var(--ink-dim);font-size:15px;font-weight:800;cursor:pointer;padding:4px 6px;}
.st-panel-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:4px 14px 12px;}
.st-lib-grid{display:grid;grid-template-columns:repeat(auto-fill,50px);justify-content:center;gap:8px 7px;padding:8px 2px 4px;}
.st-lib-item{position:relative;width:50px;height:50px;border:1px solid var(--border);border-radius:10px;background:#f6f6f2 repeating-conic-gradient(#efefe9 0% 25%,#fafaf6 0% 50%) 50%/12px 12px;padding:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.st-lib-item:hover,.st-lib-item.picked{border-color:var(--sage);}
.st-lib-item:active{transform:scale(.95);}
.st-lib-item img{max-width:100%;max-height:100%;object-fit:contain;pointer-events:none;}
.st-badge{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--coral);color:#fff;font-size:11.5px;font-weight:900;display:flex;align-items:center;justify-content:center;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.18);pointer-events:none;}
.st-empty{text-align:center;color:var(--ink-dim);font-size:12.5px;font-weight:700;padding:18px 8px;grid-column:1/-1;}

/* library menu (dock) */
.st-dock{background:var(--card);border-top:1px solid var(--border);margin:0 -10px;padding:4px 10px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -4px 16px rgba(60,70,40,.06);position:relative;z-index:7;}
.st-groups{display:flex;align-items:flex-start;gap:2px;overflow-x:auto;scrollbar-width:none;}
.st-groups::-webkit-scrollbar{display:none;}
.st-group{flex:0 0 auto;width:54px;background:none;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;padding:3px 0;color:var(--ink-dim);font-size:10px;font-weight:700;}
.st-group .th{width:38px;height:38px;border-radius:50%;background:#f3f3ee;border:2px solid transparent;display:flex;align-items:center;justify-content:center;padding:4px;overflow:hidden;transition:border-color .15s;}
.st-group .th img{max-width:100%;max-height:100%;object-fit:contain;}
.st-group .th svg{width:20px;height:20px;}
.st-group span{max-width:52px;text-align:center;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.st-group:hover .th{border-color:var(--sage);}
.st-group.active{color:var(--ink);font-weight:900;}
.st-group.active .th{border-color:transparent;background:linear-gradient(#fff,#fff) padding-box,var(--grad) border-box;}
.st-group.tool .th{background:var(--sage-light);color:var(--ink);}
.st-group.desk{display:none;}      /* Upload / Paste live in the floating buttons on the phone */
.st-group.is-hidden{opacity:.4;}
.st-dock-sep{flex:0 0 1px;align-self:stretch;margin:6px 6px;background:var(--border);}
.st-dock-sep.desk{display:none;}

/* admin pane */
.st-label{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--ink-dim);display:block;margin-bottom:4px;}
.st-sub{font-size:12px;color:var(--ink-dim);font-weight:700;line-height:1.5;margin-bottom:8px;}
.st-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:8px;}
.st-btn{padding:8px 15px;border-radius:50px;border:none;background:var(--pill);color:var(--pill-text);font-family:'Baloo 2',cursive;font-size:13.5px;cursor:pointer;}
.st-btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--border);}
.st-admin-lib{max-height:170px;overflow-y:auto;border:1px solid var(--border);border-radius:10px;padding:6px 10px;margin-bottom:10px;}
.st-admin-all{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:800;padding:2px 0 8px;margin-bottom:6px;border-bottom:1px solid var(--border);}
.st-admin-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:4px 10px;}
.st-admin-cats label{font-size:12px;font-weight:700;display:flex;align-items:center;gap:6px;}
.st-admin-lib input{accent-color:var(--sage);}

/* shared widgets (summary / selection bar — desktop) */
.st-step{display:inline-flex;align-items:center;gap:4px;}
.st-step button{width:24px;height:24px;border-radius:50%;border:none;background:#fff;color:var(--ink);font-size:15px;font-weight:800;line-height:1;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.14);}
.st-step b{min-width:46px;text-align:center;font-size:12.5px;font-weight:800;}
.st-link-btn{background:none;border:none;color:var(--ink);font-weight:800;font-size:12px;cursor:pointer;text-decoration:underline;text-underline-offset:2px;}

/* ═══════════ DESKTOP (≥901px): two panels — library left, sheet right ═══════════ */
@media(min-width:901px){
  .st-stage{flex-direction:row;max-width:1180px;gap:14px;padding:14px;}
  .st-view,.st-libcol{background:var(--card);}
  .st-view,.st-libcol{flex:1 1 0;min-width:0;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);padding:12px 14px;}
  .st-libcol{order:-1;display:flex;flex-direction:column;position:static;}
  .st-lrail,.st-pt{display:none !important;}

  /* summary + context row */
  .st-summary{flex:0 0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2px 12px;padding:6px 12px;border-radius:12px;background:var(--grad);box-shadow:0 6px 16px rgba(255,111,145,.22);min-height:40px;}
  .st-sum-line{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 7px;font-size:12.5px;font-weight:800;color:var(--ink);min-width:0;}
  .st-sum-line .n{font-family:'Baloo 2',cursive;font-size:24px;line-height:1.05;color:#fff;text-shadow:0 1px 0 rgba(34,48,31,.25);}
  .st-sum-line .sep{font-style:normal;font-weight:400;color:rgba(34,48,31,.35);}
  .st-sum-line .dim{color:var(--ink);}
  .st-sum-tools{display:flex;align-items:center;gap:8px;}
  .st-sum-empty{font-size:13px;font-weight:800;color:var(--ink);}
  .st-ctx{flex:0 0 auto;height:42px;display:flex;align-items:center;justify-content:center;}
  .st-selbar{display:flex;align-items:center;gap:6px 18px;background:var(--pill);color:var(--pill-text);border-radius:10px;padding:0 12px;height:36px;max-width:100%;}
  .st-sel-thumb{width:26px;height:26px;border-radius:7px;background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:2px;}
  .st-sel-thumb img{max-width:100%;max-height:100%;object-fit:contain;}
  .st-sel-grp{display:flex;align-items:center;gap:8px;}
  .st-selbar .st-mini{color:rgba(255,255,255,.6);}
  .st-hint{font-size:11.5px;font-weight:700;color:var(--ink-dim);text-align:center;}

  /* white holder row, roomier */
  .st-holder-bar{border-top:1px solid var(--border);margin-top:6px;padding:10px 2px 0;gap:6px 18px;}
  .st-h-label{display:block;}
  .st-seg button{padding:4px 9px;font-size:12.5px;}

  /* library column: groups on top, all assets below — no pop-up */
  .st-dock{order:1;margin:0;padding:0 0 8px;border:none;box-shadow:none;background:none;z-index:auto;}
  .st-groups{flex-wrap:wrap;overflow-x:hidden;overflow-y:auto;max-height:178px;gap:2px;scrollbar-width:thin;}
  .st-groups::-webkit-scrollbar{display:block;width:6px;}
  .st-groups::-webkit-scrollbar-thumb{background:var(--sage-light);border-radius:3px;}
  .st-group{width:62px;}
  .st-group .th{width:42px;height:42px;}
  .st-group span{font-size:10.5px;max-width:60px;}
  .st-group.desk{display:flex;}
  .st-dock-sep,.st-dock-sep.desk{display:none;}
  .st-panel{order:2;position:static;flex:1 1 auto;min-height:0;max-height:none;opacity:1;overflow:visible;border:none;border-top:1px solid var(--border);border-radius:0;box-shadow:none;transition:none;}
  .st-panel.open{max-height:none;}
  .st-panel-head{padding:10px 0 2px;}
  .st-panel-head::before,.st-panel-close{display:none;}
  .st-panel-body{padding:2px 0 0;}
  .st-lib-grid{grid-template-columns:repeat(auto-fill,58px);justify-content:flex-start;gap:9px 8px;padding:8px 4px;}
  .st-lib-item{width:58px;height:58px;}
}

/* ═══════════ "TRY ME" ninja-star button ═══════════ */
.st-try{position:absolute;bottom:0;right:2px;z-index:5;width:78px;height:78px;border:none;background:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;animation:stBob 2.6s ease-in-out infinite;filter:drop-shadow(0 4px 8px rgba(255,111,145,.45));}
.st-try-star{position:absolute;inset:0;width:100%;height:100%;animation:stSpin 14s linear infinite;}
.st-try-label{position:relative;display:flex;flex-direction:column;align-items:center;font-family:'Baloo 2',cursive;font-weight:800;font-size:9.5px;line-height:.95;text-align:center;color:var(--ink);text-shadow:0 1px 0 rgba(255,255,255,.7);}
.st-try-label b{font-size:17px;line-height:.9;color:#d6154f;letter-spacing:.5px;text-shadow:0 1px 0 rgba(255,255,255,.85);}
.st-try:hover{animation-duration:1.2s;}
.st-try:hover .st-try-star{animation-duration:3s;}
.st-try:active{transform:scale(.92);}
@keyframes stSpin{to{transform:rotate(360deg);}}
@keyframes stBob{0%,100%{transform:translateY(0) scale(1);}50%{transform:translateY(-3px) scale(1.07);}}
@media(prefers-reduced-motion:reduce){.st-try,.st-try-star{animation:none;}}
@media(min-width:901px){.st-try{width:92px;height:92px;bottom:2px;right:6px;}.st-try-label{font-size:11px;}.st-try-label b{font-size:20px;}}

/* ═══════════ BUILD YOUR OWN STICKER window ═══════════ */
.st-selbar-edit{border:none;border-radius:14px;padding:0 11px;height:26px;background:#fff;color:var(--ink);font-size:12px;font-weight:800;cursor:pointer;}
.bd{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:rgba(34,48,31,.5);backdrop-filter:blur(3px);}
.bd[hidden]{display:none;}
.bd-win{position:relative;background:var(--card);width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;}
@media(min-width:901px){.bd{padding:24px;}.bd-win{max-width:1000px;height:min(740px,100%);border-radius:22px;box-shadow:0 24px 70px rgba(0,0,0,.35);}}
.bd-head{position:relative;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--border);}
.bd-head::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--grad);}
.bd-head h2{font-family:'Baloo 2',cursive;font-size:17px;font-weight:800;}
.bd-x{background:none;border:none;font-size:17px;font-weight:800;color:var(--ink-dim);cursor:pointer;padding:4px 8px;}
.bd-intro{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:22px 24px;}
.bd-intro-art{width:84px;height:84px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:40px;color:#fff;box-shadow:0 10px 26px rgba(255,111,145,.4);animation:stBob 2.6s ease-in-out infinite;}
.bd-intro h3{font-family:'Baloo 2',cursive;font-size:24px;font-weight:800;line-height:1.1;}
.bd-intro p{max-width:420px;font-size:14px;font-weight:700;color:var(--ink-dim);line-height:1.55;}
.bd-steps{list-style:none;display:flex;gap:8px 18px;flex-wrap:wrap;justify-content:center;font-size:13px;font-weight:800;}
.bd-steps b{display:inline-flex;width:20px;height:20px;border-radius:50%;background:var(--pill);color:#fff;font-size:11px;align-items:center;justify-content:center;margin-right:5px;}
.bd-start{margin-top:6px;padding:12px 28px;font-size:16px;}

.bd-main{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto 176px auto;grid-template-areas:"stage" "tools" "tray" "foot";}
.bd-main[hidden],.bd-intro[hidden]{display:none;}
@media(min-width:901px){.bd-main{grid-template-columns:310px minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto auto;grid-template-areas:"tray stage" "tray tools" "tray foot";}}
.bd-stage{grid-area:stage;position:relative;display:flex;align-items:center;justify-content:center;min-height:0;padding:6px;background:#f3f1e6;}
#bdCanvas{touch-action:none;border-radius:10px;box-shadow:0 4px 18px rgba(0,0,0,.14);cursor:grab;background:#fff repeating-conic-gradient(#efefe9 0% 25%,#fff 0% 50%) 50%/20px 20px;}
.bd-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;color:var(--ink-dim);pointer-events:none;text-align:center;padding:20px;}
.bd-tools{grid-area:tools;display:flex;flex-wrap:wrap;gap:6px 10px;justify-content:center;align-items:center;padding:7px 10px;min-height:48px;border-top:1px solid var(--border);}
.bd-tool-hint{font-size:12px;font-weight:700;color:var(--ink-dim);text-align:center;}
.bd-tools:not(.on) .bd-tgrp{display:none;}
.bd-tools.on .bd-tool-hint{display:none;}
.bd-tgrp{display:flex;align-items:center;gap:4px;}
.bd-tgrp span{font-size:9px;font-weight:900;letter-spacing:.5px;text-transform:uppercase;color:var(--ink-dim);padding:0 2px;}
.bd-tgrp button{height:30px;min-width:30px;padding:0 10px;border-radius:15px;border:1px solid var(--border);background:#fff;color:var(--ink);font-size:13px;font-weight:800;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.08);}
.bd-tgrp button:active{transform:scale(.94);}
.bd-tgrp button.del{color:#e5395f;}
.bd-tray{grid-area:tray;display:flex;flex-direction:column;min-height:0;border-top:1px solid var(--border);}
@media(min-width:901px){.bd-tray{border-top:none;border-right:1px solid var(--border);padding:8px 10px;}}
.bd-groups{flex:0 0 auto;display:flex;gap:2px;overflow-x:auto;padding:4px 10px;scrollbar-width:none;}
.bd-groups::-webkit-scrollbar{display:none;}
@media(min-width:901px){.bd-groups{flex-wrap:wrap;overflow-x:hidden;overflow-y:auto;max-height:168px;padding:2px 0 8px;scrollbar-width:thin;}}
.bd-group{flex:0 0 auto;width:56px;background:none;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;padding:2px 0;color:var(--ink-dim);font-size:10px;font-weight:700;}
.bd-group .th{width:36px;height:36px;border-radius:50%;background:#f3f3ee;border:2px solid transparent;display:flex;align-items:center;justify-content:center;padding:4px;overflow:hidden;}
.bd-group .th img{max-width:100%;max-height:100%;object-fit:contain;}
.bd-group .th svg{width:18px;height:18px;}
.bd-group span{max-width:54px;text-align:center;line-height:1.1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.bd-group.tool .th{background:var(--sage-light);color:var(--ink);}
.bd-group.active{color:var(--ink);font-weight:900;}
.bd-group.active .th{border-color:transparent;background:linear-gradient(#fff,#fff) padding-box,var(--grad) border-box;}
.bd-grid{flex:1 1 auto;min-height:0;display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;padding:6px 10px 8px;align-items:flex-start;}
@media(min-width:901px){.bd-grid{display:grid;grid-template-columns:repeat(auto-fill,56px);justify-content:center;gap:8px;overflow-x:hidden;overflow-y:auto;padding:6px 2px;align-content:start;}}
.bd-asset{flex:0 0 auto;width:56px;height:56px;border:1px solid var(--border);border-radius:10px;background:#f6f6f2 repeating-conic-gradient(#efefe9 0% 25%,#fafaf6 0% 50%) 50%/12px 12px;padding:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.bd-asset:hover{border-color:var(--sage);}
.bd-asset:active{transform:scale(.93);}
.bd-asset img{max-width:100%;max-height:100%;object-fit:contain;pointer-events:none;}
.bd-foot{grid-area:foot;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--border);}
@media(min-width:901px){.bd-foot{border-top:1px solid var(--border);}}
.bd-open .st-try{animation-play-state:paused;}

/* ── premium (designer) library ── */
.st-head-links{display:flex;gap:14px;align-items:center;}
.st-ptag{position:absolute;left:50%;transform:translateX(-50%);bottom:2px;font-size:9px;font-weight:900;line-height:1.5;background:rgba(255,255,255,.95);border-radius:8px;padding:0 6px;color:#d6154f;box-shadow:0 1px 3px rgba(0,0,0,.15);pointer-events:none;}
.st-ptag.free{color:#2f7a3e;}
.st-prem-note{align-self:center;font-size:11px;font-weight:800;color:var(--ink-dim);padding:0 10px;white-space:nowrap;}
.st-empty a{color:var(--coral);font-weight:800;}

/* ── sheet tag + pile of paper ── */
.st-pile{position:absolute;inset:0;z-index:-1;pointer-events:none;}
.st-pile i{position:absolute;inset:0;background:#fbfaf5;border-radius:2px;box-shadow:0 2px 8px rgba(0,0,0,.16);}
.st-pile i:nth-child(1){transform:translate(6px,6px) rotate(.7deg);}
.st-pile i:nth-child(2){transform:translate(12px,11px) rotate(-.9deg);background:#f6f4ec;}
.st-pile i:nth-child(3){transform:translate(18px,15px) rotate(1.1deg);background:#f1efe5;}
.st-pile.pop i{animation:stPile .5s cubic-bezier(.2,1.4,.4,1) both;}
@keyframes stPile{from{opacity:0;transform:translate(0,0);}}
.st-sheetbadge{position:absolute;left:-7px;top:-13px;z-index:4;display:flex;align-items:center;gap:4px;padding:3px 9px 3px 10px;border-radius:14px;background:var(--grad);box-shadow:0 5px 14px rgba(255,111,145,.45);line-height:1;transform:rotate(-3deg);border:2px solid #fff;}
.st-sheetbadge .sb-txt{display:flex;align-items:baseline;gap:4px;color:var(--ink);}
.st-sheetbadge small{font-family:'Baloo 2',cursive;font-size:10px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;}
.st-sheetbadge b{font-family:'Baloo 2',cursive;font-size:25px;font-weight:800;color:#fff;text-shadow:0 1px 0 rgba(34,48,31,.35),0 2px 6px rgba(34,48,31,.25);}
.st-sheetbadge em{font-style:normal;font-size:11px;font-weight:800;}
.st-sheetbadge button{width:22px;height:22px;border-radius:50%;border:none;background:#fff;color:var(--ink);font-size:15px;font-weight:900;line-height:1;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.2);padding:0;display:flex;align-items:center;justify-content:center;}
.st-sheetbadge button:disabled{opacity:.35;cursor:default;}
.st-sheetbadge.pop{animation:stBadgePop .55s cubic-bezier(.2,1.5,.4,1);}
@keyframes stBadgePop{0%{transform:rotate(-3deg) scale(.5);}100%{transform:rotate(-3deg) scale(1);}}
.st-sheet-wrap.flip canvas#sheetCanvas{animation:stFlipNext .4s ease;}
.st-sheet-wrap.flip[data-flip="prev"] canvas#sheetCanvas{animation-name:stFlipPrev;}
@keyframes stFlipNext{0%{transform:translateX(26px) rotate(2.2deg);opacity:.2;}100%{transform:none;opacity:1;}}
@keyframes stFlipPrev{0%{transform:translateX(-26px) rotate(-2.2deg);opacity:.2;}100%{transform:none;opacity:1;}}

/* ── Border / None: gradient rounded box; star slider handle ── */
.st-seg{padding:3px;gap:2px;border-radius:999px;background:var(--grad);box-shadow:0 3px 10px rgba(255,111,145,.22);}
.st-seg button{border:none;border-radius:999px;padding:4px 13px;font-size:12.5px;font-weight:800;color:var(--ink);background:none;}
.st-seg button:hover{color:var(--ink);}
.st-seg button.active{background:#fff;font-weight:900;box-shadow:0 1px 5px rgba(0,0,0,.16);}
.st-range::-webkit-slider-thumb{width:24px;height:24px;border:none;border-radius:0;box-shadow:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.2l2.9 6.1 6.7.9-4.9 4.7 1.2 6.6L12 17.2 6.1 20.5l1.2-6.6L2.4 9.2l6.7-.9z' fill='%23ff6f91' stroke='%23ffffff' stroke-width='1.7' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));}
.st-range::-moz-range-thumb{width:22px;height:22px;border:none;border-radius:0;box-shadow:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.2l2.9 6.1 6.7.9-4.9 4.7 1.2 6.6L12 17.2 6.1 20.5l1.2-6.6L2.4 9.2l6.7-.9z' fill='%23ff6f91' stroke='%23ffffff' stroke-width='1.7' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;}

/* ── floating border-colour tool (phone) ── */
.st-fab-color{border:2.5px solid #fff;box-shadow:0 4px 14px rgba(0,0,0,.22);background:#fff;}
.st-fab-color svg{width:17px;height:17px;}
.st-swpop{display:none;position:absolute;left:46px;bottom:4px;z-index:6;grid-template-columns:repeat(4,28px);gap:8px;padding:10px;border-radius:16px;background:rgba(255,255,255,.97);box-shadow:0 8px 24px rgba(0,0,0,.22);}
.st-swpop.open{display:grid;}
.st-swpop .st-sw{width:28px;height:28px;}
.st-holder-bar .st-swatches{display:none;}

/* ── dock: tools stay put, only the groups scroll sideways ── */
.st-dock{display:flex;align-items:flex-start;}
.st-dock-tools{flex:0 0 auto;display:flex;gap:2px;padding-right:6px;margin-right:6px;border-right:1px solid var(--border);}
.st-dock .st-groups{flex:1 1 auto;min-width:0;}
.st-dock-sep{display:none !important;}

/* ── hold a library asset to zoom ── */
.st-lib-item{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;}
.st-zoom{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;background:rgba(34,48,31,.55);backdrop-filter:blur(5px);pointer-events:none;}
.st-zoom[hidden]{display:none;}
.st-zoom>div{width:min(76vw,340px);aspect-ratio:1;border-radius:24px;padding:16px;background:#fff repeating-conic-gradient(#efefe9 0% 25%,#fff 0% 50%) 50%/22px 22px;box-shadow:0 20px 60px rgba(0,0,0,.4);animation:stZoomIn .16s ease-out;}
.st-zoom img{width:100%;height:100%;object-fit:contain;}
@keyframes stZoomIn{from{transform:scale(.8);opacity:0;}}

@media(min-width:901px){
  .st-holder-bar .st-swatches{display:flex;}
  .st-swpop{display:none !important;}
  .st-dock{flex-direction:column;align-items:stretch;}
  .st-dock-tools{border-right:none;margin:0;padding:0 0 4px;flex-wrap:wrap;}
}

/* ── Review & order button ── */
.st-order{position:absolute;top:-2px;right:0;z-index:5;display:flex;align-items:center;gap:8px;padding:7px 13px;border:none;border-radius:999px;background:var(--pill);color:#fff;font-family:'Baloo 2',cursive;font-size:13.5px;font-weight:800;cursor:pointer;box-shadow:0 6px 16px rgba(30,42,32,.35);}
.st-order[hidden]{display:none;}
.st-order b{background:var(--grad);color:var(--ink);border-radius:999px;padding:1px 9px;font-size:13px;}
.st-order:active{transform:scale(.95);}
.st-orderbanner{background:var(--pill);color:#fff;border-radius:10px;padding:7px 12px;font-size:12px;font-weight:700;margin-bottom:8px;}
.st-orderbanner[hidden]{display:none;}

/* ── Admin order viewer (read-only preview + print; built by stickers.js for admins only) ── */
.ov{position:fixed;inset:0;z-index:400;display:flex;flex-direction:column;background:#e9e7dc;color:var(--ink);}
.ov-head{flex:0 0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:10px 14px;background:var(--card);border-bottom:1px solid var(--border);}
.ov-info{display:flex;flex-direction:column;gap:1px;font-size:12.5px;font-weight:700;color:var(--ink-dim);min-width:0;}
.ov-info b{font-family:'Baloo 2',cursive;font-size:18px;color:var(--ink);line-height:1.2;}
.ov-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;align-items:center;gap:18px;}
.ov-sheet{position:relative;width:min(100%,520px);}
.ov-sheet canvas{display:block;width:100%;height:auto;background:#fff;box-shadow:0 8px 28px rgba(0,0,0,.25);}
.ov-tag{position:absolute;top:-9px;left:10px;background:var(--pill);color:#fff;border-radius:20px;padding:1px 10px;font-size:11px;font-weight:800;z-index:1;}
.ov-head .st-link{flex:0 0 auto;white-space:nowrap;}
.ov-foot{flex:0 0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:var(--card);border-top:1px solid var(--border);}
.ov-cut{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:800;}
body.ov-open{overflow:hidden;}
}

/* ── Review & order: full-screen window ── */
.rv{position:fixed;inset:0;z-index:150;display:flex;flex-direction:column;background:#1b231a;color:#fff;}
.rv[hidden]{display:none;}
.rv-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;}
.rv-back{background:rgba(255,255,255,.12);border:none;color:#fff;border-radius:999px;padding:7px 14px;font-size:12.5px;font-weight:800;cursor:pointer;}
.rv-title{font-family:'Baloo 2',cursive;font-size:17px;font-weight:800;}
.rv-spacer{width:92px;}
.rv-stage{position:relative;flex:1 1 auto;min-height:90px;overflow:hidden;touch-action:pan-y;user-select:none;-webkit-user-select:none;}
.rv-track{display:flex;height:100%;will-change:transform;}
.rv-slide{flex:0 0 100%;height:100%;display:flex;align-items:center;justify-content:center;padding:6px 14px;}
.rv-slide canvas{max-width:100%;max-height:100%;width:auto;height:auto;background:#fff;border-radius:3px;box-shadow:0 10px 40px rgba(0,0,0,.55);pointer-events:none;}
.rv-nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;border:none;background:rgba(255,255,255,.92);color:var(--ink);font-size:26px;font-weight:800;line-height:1;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.35);}
.rv-nav.prev{left:10px;}.rv-nav.next{right:10px;}
.rv-nav[hidden]{display:none;}
.rv-dots{flex:0 0 auto;display:flex;justify-content:center;gap:8px;padding:6px 0 2px;min-height:20px;}
.rv-dots button{width:9px;height:9px;border-radius:50%;border:none;background:rgba(255,255,255,.35);padding:0;cursor:pointer;}
.rv-dots button.on{background:var(--grad);width:22px;border-radius:6px;}
.rv-swipehint{flex:0 0 auto;text-align:center;font-size:11px;font-weight:800;color:rgba(255,255,255,.55);padding-bottom:6px;letter-spacing:.3px;}
.rv-swipehint[hidden]{display:none;}
.rv-card{flex:0 0 auto;max-height:62vh;overflow-y:auto;background:#fff;color:var(--ink);border-radius:20px 20px 0 0;padding:16px 18px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px rgba(0,0,0,.35);}
@media(min-width:901px){.rv-card{width:min(520px,100%);align-self:center;border-radius:20px;margin-bottom:18px;}}
.rv-lines{margin-bottom:8px;}
.rv-line{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:5px 0;font-size:14px;font-weight:800;}
.rv-line.sub{font-size:12.5px;font-weight:700;color:var(--ink-dim);}
.rv-line.sub em{font-style:normal;opacity:.8;}
.rv-line.total{border-top:1px solid var(--border);margin-top:4px;padding-top:9px;font-family:'Baloo 2',cursive;font-size:20px;}
.rv-line.total b{font-size:26px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.rv-meta{font-size:12px;font-weight:700;color:var(--ink-dim);line-height:1.5;margin:2px 0 8px;}
.rv-tip{background:var(--coral-light);color:#9a2c4a;border-radius:10px;padding:7px 11px;font-size:12px;font-weight:800;margin-bottom:10px;}
.rv-go{width:100%;padding:13px 18px;border:none;border-radius:999px;background:var(--pill);color:#fff;font-family:'Baloo 2',cursive;font-size:17px;font-weight:800;cursor:pointer;box-shadow:0 8px 20px rgba(30,42,32,.3);}
.rv-go:disabled{opacity:.5;cursor:wait;}
.rv-ghost{background:none;border:1.5px solid var(--border);border-radius:999px;padding:12px 18px;font-size:14px;font-weight:800;color:var(--ink);cursor:pointer;}
.rv-q{font-family:'Baloo 2',cursive;font-size:16px;font-weight:800;margin-bottom:8px;}
.rv-method{display:flex;width:100%;margin-bottom:10px;}
.rv-method button{flex:1;}
.rv-in{display:block;width:100%;margin-bottom:9px;padding:11px 13px;border-radius:12px;border:1.5px solid var(--border);background:#fff;color:var(--ink);font-size:15px;font-weight:700;outline:none;resize:none;font-family:inherit;}
.rv-in:focus{border-color:var(--sage);}
.rv-in[hidden]{display:none;}
.rv-check{display:flex;gap:9px;align-items:flex-start;font-size:13px;font-weight:700;line-height:1.45;margin:4px 0 6px;cursor:pointer;}
.rv-check input{margin-top:3px;width:16px;height:16px;accent-color:var(--ink);}
.rv-err{min-height:18px;font-size:12.5px;font-weight:800;color:#c0304f;margin-bottom:6px;}
.rv-actions{display:flex;gap:10px;}
.rv-actions .rv-go{flex:1;}
#rvDone{text-align:center;}
.rv-done-icon{font-size:38px;}
#rvDone h3{font-family:'Baloo 2',cursive;font-size:22px;font-weight:800;}
.rv-code{font-family:'Baloo 2',cursive;font-size:34px;font-weight:800;letter-spacing:3px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin:2px 0 6px;}
.rv-steps{text-align:left;font-size:13px;font-weight:700;line-height:1.55;padding-left:22px;margin:6px 0 14px;}
.rv-steps li{margin-bottom:4px;}
.rv .st-seg button{flex:1;}
.rv-open .st-try{animation-play-state:paused;}
.rv-line.total b,.rv-code{background-image:linear-gradient(100deg,#4f9a2e,#ec7f1f 55%,#e0245e);}
.st-order i{font-style:normal;font-size:18px;line-height:1;color:var(--coral);}
.rv-copies{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--sage-light);border-radius:12px;padding:8px 12px;margin-bottom:10px;font-size:13px;font-weight:800;}
.rv-step button{width:28px;height:28px;font-size:17px;}
.rv-step button:disabled{opacity:.3;cursor:default;}
.rv-step b{min-width:34px;font-size:15px;}
.rv-prod{font-family:'Baloo 2',cursive;font-size:15px;font-weight:800;}
.rv-line span em{font-style:normal;font-size:12.5px;color:var(--ink-dim);font-weight:700;}
.mp{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(27,35,26,.7);backdrop-filter:blur(5px);}
.mp[hidden]{display:none;}
.mp-card{width:min(420px,100%);background:#fff;border-radius:26px;padding:28px 24px 24px;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.45);animation:stZoomIn .2s ease-out;}
.mp-icon{font-size:46px;line-height:1;margin-bottom:6px;}
.mp-card h2{font-family:'Baloo 2',cursive;font-size:28px;line-height:1.1;font-weight:800;margin-bottom:12px;}
.mp-dots{display:flex;justify-content:center;gap:10px;margin-bottom:6px;}
.mp-dots i{width:34px;height:46px;border-radius:4px;background:#ecebe3;border:2px dashed #c9c7b8;}
.mp-dots i.on{background:var(--grad);border:2px solid #fff;box-shadow:0 4px 12px rgba(255,111,145,.4);}
.mp-count{font-size:13px;font-weight:900;letter-spacing:.5px;text-transform:uppercase;color:var(--ink-dim);margin-bottom:12px;}
.mp-card p{font-size:14.5px;font-weight:700;color:var(--ink-dim);line-height:1.5;margin-bottom:18px;}
.mp-btn{width:100%;padding:14px;border:none;border-radius:999px;background:var(--pill);color:#fff;font-family:'Baloo 2',cursive;font-size:18px;font-weight:800;cursor:pointer;}