:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#261c38;--muted:#625670;--purple:#6434ce;--lilac:#eee5ff;--line:#e1d7ee;--paper:#f8f4fd}*{box-sizing:border-box}body{background:var(--paper);color:var(--ink);margin:0;font:16px/1.45 DM Sans,system-ui,sans-serif}button,input,a{-webkit-tap-highlight-color:transparent}button,.primary{border:1px solid var(--line);min-height:44px;color:var(--ink);font:inherit;cursor:pointer;touch-action:manipulation;background:#fff;border-radius:12px;padding:0 13px;font-size:.88rem;font-weight:700}button[aria-pressed=true]{background:var(--lilac);border-color:var(--purple);color:#5021ad}button:disabled{opacity:.5;cursor:default}:focus-visible{outline-offset:2px;outline:3px solid #8759e9}.primary{background:var(--purple);color:#fff;border-color:var(--purple);justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.brand{color:var(--ink);letter-spacing:-.06em;white-space:nowrap;align-items:center;font-size:1.3rem;font-weight:850;text-decoration:none;display:inline-flex}.brand b{background:var(--purple);color:#fff;letter-spacing:0;border-radius:11px;place-items:center;width:35px;height:35px;margin-right:8px;font-size:1.4rem;display:grid}.brand span{color:var(--purple)}.home,.studio{max-width:1180px;margin:auto;padding:20px clamp(12px,4vw,44px)}.hero{align-items:center;gap:25px;margin-top:clamp(36px,10vw,100px);display:grid}.hero h1{letter-spacing:-.075em;margin:0;font-size:clamp(2.6rem,8.2vw,6.1rem);line-height:.99}.hero h1 em{color:var(--purple);font-style:normal}.hero p{max-width:30ch;color:var(--muted);margin:22px 0;font-size:clamp(1rem,2vw,1.24rem)}.create{min-height:54px;padding:0 22px;font-size:1rem}.hero small{color:var(--muted);margin-top:12px;display:block}.art{aspect-ratio:1.27;border:1px solid var(--line);background:#fff radial-gradient(#d9c8ec 1px,#0000 1px) 0 0/17px 17px;border-radius:28px;min-height:220px;position:relative;overflow:hidden;box-shadow:0 14px 40px #573b7617;container-type:inline-size}.art span{font-family:system-ui,sans-serif;font-weight:900;line-height:1;position:absolute}.flower{color:#8b5aee;font-size:49cqw;top:3%;left:11%;transform:rotate(-15deg)}.smile{color:#247d67;font-size:37cqw;top:38%;left:49%;transform:rotate(15deg)}.star{color:#d87709;font-size:24cqw;top:6%;right:12%}.heart{color:#ec6296;font-size:19cqw;bottom:12%;left:19%;transform:rotate(-18deg)}.studio-head,.title-row,.board-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.actions,.zoom{gap:5px;display:flex}.title-row{margin:16px 0 12px}.title-row h1{letter-spacing:-.045em;margin:0;font-size:clamp(1.3rem,4vw,2.2rem);line-height:1.1}.status,.board-note{color:var(--muted);font-size:.8rem}.status{background:var(--lilac);border-radius:20px;padding:4px 9px}.workspace{gap:10px;min-width:0;display:grid}.controls,.board-panel{border:1px solid var(--line);background:#fff;border-radius:18px;min-width:0;padding:9px}.tools{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;display:grid}.tools button{min-height:44px;padding:3px 0;font-size:.72rem;line-height:1.1}.tools span{margin-bottom:2px;font-size:1.05rem;display:block}.colors,.stickers{flex-wrap:wrap;align-items:center;gap:2px;margin:6px 0;display:flex}.colors button{background:0 0;border:none;width:44px;height:44px;padding:0;position:relative}.swatch:after{content:"";background:var(--swatch);border:1px solid #0003;border-radius:50%;position:absolute;inset:9px}.swatch[aria-pressed=true]:after{outline:2px solid var(--purple);outline-offset:2px}.colors input{background:0 0;border:0;width:44px;height:44px}.size{align-items:center;gap:8px;min-height:35px;font-size:.8rem;font-weight:700;display:flex}.size input{min-width:0;accent-color:var(--purple);flex:1}.size output{text-align:right;min-width:48px}.stickers button{width:44px;padding:0;font-size:1.15rem}.upload{background:var(--lilac);border-radius:10px;align-items:center;min-height:44px;padding:0 10px;font-size:.85rem;font-weight:700;display:inline-flex;position:relative}.upload:focus-within{outline:3px solid #8759e9}.upload input{opacity:0;cursor:pointer;width:100%;position:absolute;inset:0}.stamp-preview{object-fit:contain;vertical-align:middle;width:44px;height:44px;margin-left:8px}.board-panel{background:#f0e9fa}.board-head{margin-bottom:8px}.viewport{border:1px solid var(--line);scrollbar-width:auto;background:#fff;border-radius:10px;max-height:67svh;overflow:auto}canvas{touch-action:none;cursor:crosshair;background:#fff radial-gradient(#ded7e7 .85px,#0000 .85px) 0 0/16px 16px;height:auto;display:block}.board-note{margin:7px 0 0}.link-field{align-items:center;gap:8px;margin:0 0 12px;font-size:.85rem;display:flex}.link-field input{flex:1;min-width:0;padding:8px}@media (min-width:720px){.hero{grid-template-columns:1.12fr 1fr}.tools{grid-template-columns:repeat(3,minmax(0,1fr))}.board-panel,.controls{padding:12px}.viewport{max-height:min(74svh,850px)}}.share-panel{flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 12px;display:flex}.share-panel .link-field{flex:1 0 min(100%,320px);margin:0}.brand small{color:var(--muted);letter-spacing:0;align-self:center;margin-left:8px;font-size:.55em;font-weight:650}.advanced-color{margin:6px 0;font-size:.82rem}.advanced-color summary{border:1px solid var(--line);cursor:pointer;border-radius:11px;min-height:44px;padding:10px 9px;font-weight:700}.current-color{vertical-align:-2px;border:1px solid #0003;border-radius:50%;width:15px;height:15px;display:inline-block}.wheel-panel{gap:7px;padding:10px 6px 3px;display:grid}.color-wheel{aspect-ratio:1;cursor:crosshair;touch-action:none;background:radial-gradient(circle,gray,#0000 71%),conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:50%;justify-self:center;width:min(100%,148px);position:relative}.wheel-indicator{pointer-events:none;border:2px solid #fff;border-radius:50%;width:15px;height:15px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #241b32}.color-value{align-items:center;gap:6px;font-weight:700;display:flex}.color-value input{background:0 0;border:0;width:44px;height:44px}.color-value output{font-family:monospace;font-weight:400}.studio{max-width:1600px;padding:14px clamp(8px,2vw,26px)}.studio .title-row{margin:12px 0 8px}.studio .viewport{max-height:82svh}.board-head{justify-content:flex-start}.board-head .actions{margin-left:auto}.tools-menu{z-index:1;position:relative}.tools-menu summary{border:1px solid var(--line);cursor:pointer;touch-action:manipulation;background:#fff;border-radius:12px;align-items:center;gap:5px;min-height:44px;padding:0 10px;font-size:.88rem;font-weight:700;list-style:none;display:flex}.tools-menu summary::-webkit-details-marker{display:none}.tools-menu summary:after{content:"▾";color:var(--purple)}.tools-menu[open] summary:after{content:"▴"}.tools-menu summary span{color:var(--purple)}.tools-menu .controls{width:min(330px,100vw - 40px);max-height:66svh;position:absolute;top:calc(100% + 5px);left:0;overflow:auto;box-shadow:0 12px 32px #37225130}.tools-menu .tools{grid-template-columns:repeat(4,minmax(0,1fr))}@media (max-width:430px){.board-head{gap:5px}.board-head button{padding-inline:8px}.board-head .actions{margin-left:0}}
