.demo-page{background:#f8f8f5}.demo-main{max-width:1500px;padding:25px 40px 65px;margin:auto}.demo-heading{display:flex;justify-content:space-between;align-items:center;gap:25px;margin:12px 0 32px}.demo-heading h1{font-size:40px;letter-spacing:-2px;line-height:1.2;margin:15px 0 12px}.demo-heading p:not(.eyebrow){font-size:12px;color:var(--muted)}.designer-grid{display:grid;grid-template-columns:250px minmax(0,1fr) 260px;gap:23px;align-items:start}.demo-options,.demo-review{background:white;border:1px solid #e4dfeb;border-radius:9px;padding:24px}.demo-options h2,.demo-review h2,.artwork-card h2{font-size:17px;letter-spacing:-.5px}.demo-options fieldset{border:0;border-bottom:1px solid #ece8ef;margin:0;padding:24px 0}.demo-options fieldset:last-child{border-bottom:0;padding-bottom:0}.demo-options legend{float:left;width:100%;font-size:12px;font-weight:700;margin-bottom:15px}.demo-options legend small{float:right;font-weight:400;color:var(--muted)}.demo-shapes{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;clear:both}.demo-shapes button{display:grid;gap:5px;place-items:center;border:1px solid #ded7e8;border-radius:5px;background:white;padding:8px 3px;font-size:25px;line-height:1.1;min-height:65px}.demo-shapes button span{font-size:9px}.demo-shapes button.selected,.finish-buttons button.selected,.proof-buttons button.selected{border-color:var(--purple);background:#f0ecfc;color:var(--purple)}.radio{display:flex;align-items:center;gap:10px;font-size:11px;padding:9px;border:1px solid #e3ddeb;border-radius:5px;margin-bottom:7px;clear:both}.radio span{line-height:1.6}.radio small,.demo-check small{display:block;font-size:9px;color:var(--muted)}input[type=radio],input[type=checkbox]{accent-color:var(--purple)}.demo-label{display:flex;flex-direction:column;gap:7px;font-size:11px;clear:both}.demo-label input,.demo-label select,.size-row input{width:100%;min-width:0;border:1px solid #ddd5e7;border-radius:4px;padding:10px;background:white;font-size:11px;color:var(--ink)}.demo-options .demo-label{margin-top:15px}.demo-check{display:flex;align-items:flex-start;gap:8px;font-size:10px;line-height:1.6;margin-top:18px}.demo-check input{margin-top:3px;flex-shrink:0}.finish-buttons{display:flex;gap:8px;margin-top:12px}.finish-buttons button{flex:1;border:1px solid #ded7e8;border-radius:4px;padding:8px;background:white;font-size:10px}.finish-buttons button:disabled{opacity:.35;cursor:not-allowed}.size-row{display:flex;gap:9px;align-items:center;clear:both}.size-row label{font-size:10px;min-width:0}.size-row input{margin-top:7px}.size-row>span{margin-top:20px}.demo-canvas{background:#eee9f6;border:1px solid #e3deeb;border-radius:9px;overflow:hidden}.canvas-label{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;font-size:8px;letter-spacing:1.3px;color:#8a7b9d}.canvas-label .plain{font-size:9px;letter-spacing:0}.sticker-stage{min-height:320px;padding:25px;display:grid;place-items:center}.demo-sticker{width:260px;height:260px;padding:9px;background:white;filter:drop-shadow(0 8px 5px #2b244423);transition:width .25s,height .25s,border-radius .25s;border-radius:38% 45% 34% 46%;transform:rotate(-8deg);position:relative}.demo-sticker:after{content:'';position:absolute;inset:-9px;border:1px solid #00bbd8;border-radius:inherit;pointer-events:none;opacity:0}.demo-sticker.perf:after,.demo-sticker.both:after{opacity:1}.demo-sticker.circle{border-radius:50%;transform:none}.demo-sticker.square{border-radius:0;transform:none}.demo-sticker.rectangle{border-radius:0;transform:none}.demo-sticker.rounded{border-radius:22px;transform:none}#stickerFace{width:100%;height:100%;display:grid;place-items:center;border-radius:inherit;overflow:hidden;position:relative;background:var(--purple)}#stickerText{position:relative;z-index:1;text-align:center;font-size:39px;line-height:1.05;letter-spacing:-1.5px;font-weight:800;color:var(--lime);max-width:100%;padding:10px;overflow-wrap:anywhere}#stickerText i{font-style:normal;font-size:30px}#uploadedArtwork{position:absolute;width:100%;height:100%;object-fit:cover;inset:0}#uploadedArtwork[hidden]{display:none}.demo-sticker.clear{background:repeating-conic-gradient(#ddd 0% 25%,#fff 0% 50%) 50%/12px 12px}.demo-sticker.holo{background:linear-gradient(120deg,#b9e3dc,#e9bbeb,#d5e8b2,#b7def2,#eac4ed)}.demo-sticker.holo #stickerFace{background:linear-gradient(120deg,#7286b5,#ba79b6,#82b3ad)}.demo-sticker.gloss #stickerFace:after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,#ffffff55,transparent 35%,transparent 65%,#ffffff33);z-index:2;pointer-events:none}.demo-dimensions{text-align:center;font-size:10px;color:#81758e;padding:0 20px}.preview-explainer{text-align:center;font-size:9px;color:#8e809f;margin:14px 25px 25px}.artwork-card{background:white;border-top:1px solid #e3deeb;padding:25px}.artwork-title{display:flex;gap:20px;align-items:center;justify-content:space-between;margin-bottom:20px}.artwork-title .pill{font-size:7px;color:var(--purple)}.upload-box{position:relative;border:1px dashed #bfb0d4;border-radius:6px;display:grid;text-align:center;padding:20px;font-size:12px;color:var(--purple);cursor:pointer;background:#faf8fe}.upload-box small{font-size:9px;color:var(--muted);margin-top:5px}.upload-box input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.upload-box:focus-within{outline:3px solid var(--purple);outline-offset:3px}.sample-link{display:block;background:none;border:0;margin:14px auto 24px;font-size:10px;color:var(--purple);text-decoration:underline}.text-field{background:#f4f0fc;border:1px solid #c5b4e4;padding:15px;border-radius:6px;color:var(--purple);font-weight:700;letter-spacing:.5px}.text-field input{font-size:17px;font-weight:500;letter-spacing:0;padding:12px}.text-options{display:grid;grid-template-columns:1fr 75px;gap:15px;margin-top:17px}.text-options input[type=color]{height:37px;padding:4px}.demo-review>p{font-size:11px;color:var(--muted);margin-top:13px}.demo-review dl{margin:23px 0}.demo-review dl>div{display:flex;gap:15px;justify-content:space-between;font-size:10px;padding:10px 0;border-bottom:1px solid #eee8f2}.demo-review dt{color:var(--muted)}.demo-review dd{margin:0;text-align:right}.sample-notice{background:#f2eef8;border-radius:6px;padding:15px;margin:23px 0;font-size:10px}.sample-notice p{color:var(--muted);margin-top:7px;font-size:10px}.demo-review h3{font-size:13px;margin-bottom:15px}.proof-buttons{display:grid;gap:9px}.proof-buttons button{padding:11px;border:1px solid #dcd2e8;border-radius:30px;background:white;font-size:10px}.demo-review .btn{width:100%;margin-top:22px;justify-content:space-between}.demo-status{font-size:11px!important;color:var(--purple)!important;line-height:1.7;margin-top:15px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:1150px){.demo-main{padding:20px 24px 50px}.designer-grid{grid-template-columns:210px minmax(0,1fr) 220px;gap:15px}.demo-options,.demo-review{padding:18px}.demo-sticker{width:210px;height:210px}#stickerText{font-size:33px}.sticker-stage{padding:23px;min-height:290px}.artwork-card{padding:18px}.artwork-card h2{font-size:15px}}
@media(max-width:850px){.designer-grid{grid-template-columns:210px minmax(0,1fr)}.demo-review{grid-column:1/-1}.demo-review dl{display:grid;grid-template-columns:1fr 1fr;gap:0 30px}.demo-review .proof-buttons{grid-template-columns:1fr 1fr}.demo-review .btn{max-width:300px}.demo-heading h1{font-size:34px}.demo-heading>.pill{display:none}}
@media(max-width:560px){.demo-main{padding:10px 17px 40px}.demo-heading h1{font-size:30px;letter-spacing:-1.5px}.demo-heading p:not(.eyebrow){font-size:11px}.designer-grid{display:flex;flex-direction:column;gap:17px}.demo-options,.demo-review,.demo-canvas{width:100%}.demo-options{order:1}.demo-canvas{order:0}.demo-review{order:2}.demo-options fieldset{padding:19px 0}.demo-shapes{grid-template-columns:repeat(5,1fr)}.demo-shapes button{font-size:23px}.demo-shapes button span{font-size:8px}.demo-options h2{font-size:17px}.sticker-stage{min-height:280px}.demo-review .proof-buttons{grid-template-columns:1fr}.demo-review .btn{max-width:none}.demo-page .site-header{padding:18px}.demo-page .site-header>.text-link{font-size:10px}}