.shape-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;max-height:154px;overflow:auto;padding-right:3px}.shape-choices button{border:1px solid #ddd;background:#fff;padding:7px 2px;border-radius:5px;font-size:7px}.shape-choices button.active{background:#111;color:#fff;border-color:#111}.side-switch{display:grid;grid-template-columns:1fr 1fr;gap:5px}.side-switch button{border:1px solid #ddd;background:#fff;padding:9px 3px;border-radius:5px;font-size:8px;font-weight:800}.side-switch button.active{background:#ffd000;border-color:#d8b000}.color-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.controls label>input:not([type=color]):not([type=range]){width:100%;padding:10px;border:1px solid #ddd;border-radius:6px;margin-top:5px}.ribbon{background:linear-gradient(90deg,var(--ribbon2,#111) 0 30%,var(--ribbon1,#ffd000) 30% 70%,var(--ribbon2,#111) 70%)}.ribbon span{position:absolute;top:18px;left:50%;height:135px;writing-mode:vertical-rl;transform:translateX(-50%);font-size:7px;font-weight:800;letter-spacing:.08em;overflow:hidden}.inner small{position:absolute;top:12%;font-size:7px;letter-spacing:.18em;opacity:.45;font-weight:800}
.medal.oval{border-radius:50%;transform:scaleX(.82)}.medal.square{border-radius:14%}.medal.diamond{transform:rotate(45deg) scale(.78)}.medal.diamond .inner{transform:rotate(-45deg) scale(1.25)}.medal.octagon{clip-path:polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%)}.medal.crest{clip-path:polygon(50% 0,88% 11%,100% 48%,78% 86%,50% 100%,22% 86%,0 48%,12% 11%)}.medal.star5{clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 94%,50% 72%,21% 94%,32% 57%,2% 35%,39% 35%)}.medal.star8{clip-path:polygon(50% 0,61% 28%,85% 15%,72% 39%,100% 50%,72% 61%,85% 85%,61% 72%,50% 100%,39% 72%,15% 85%,28% 61%,0 50%,28% 39%,15% 15%,39% 28%)}.medal.drop{clip-path:polygon(50% 0,86% 45%,91% 67%,79% 90%,50% 100%,21% 90%,9% 67%,14% 45%)}.medal.heart{clip-path:polygon(50% 94%,8% 54%,2% 30%,13% 8%,36% 5%,50% 22%,64% 5%,87% 8%,98% 30%,92% 54%)}.medal.laurel{clip-path:ellipse(43% 50% at 50% 50%)}.medal.gear{clip-path:polygon(42% 0,58% 0,62% 10%,72% 13%,80% 5%,92% 17%,85% 26%,90% 38%,100% 42%,100% 58%,90% 62%,85% 74%,92% 83%,80% 95%,72% 87%,62% 90%,58% 100%,42% 100%,38% 90%,28% 87%,20% 95%,8% 83%,15% 74%,10% 62%,0 58%,0 42%,10% 38%,15% 26%,8% 17%,20% 5%,28% 13%,38% 10%)}.medal.wave{clip-path:polygon(8% 12%,48% 2%,92% 14%,98% 48%,88% 88%,53% 98%,10% 86%,2% 52%)}.medal.flame{clip-path:polygon(52% 0,68% 27%,83% 16%,92% 51%,78% 85%,50% 100%,20% 84%,8% 48%,28% 17%,38% 43%)}.medal.ball{border-radius:50%}.medal.ball .inner{border-radius:50%}.medal.ticket{border-radius:23% 6%}.medal.arch{clip-path:polygon(20% 100%,10% 48%,16% 20%,34% 3%,66% 3%,84% 20%,90% 48%,80% 100%)}.medal.custom{clip-path:polygon(12% 9%,69% 2%,96% 29%,88% 87%,43% 98%,4% 65%)}
.medal.pebble{border-radius:48% 52% 42% 58%/55% 39% 61% 45%}.medal.soft-square{border-radius:28%}.medal.capsule{border-radius:48% 48% 40% 40%/32% 32% 55% 55%}.medal.cloud{border-radius:44% 56% 49% 51%/39% 45% 55% 61%}.medal.organic{border-radius:62% 38% 54% 46%/42% 63% 37% 58%;transform:rotate(-5deg)}.medal.soft-shield{border-radius:48% 48% 42% 42%/25% 25% 70% 70%;clip-path:polygon(8% 8%,92% 8%,90% 66%,50% 100%,10% 66%)}.medal.rounded-triangle{border-radius:35%;clip-path:polygon(50% 2%,98% 92%,2% 92%)}.medal.squircle{border-radius:38%}
.ribbon img{position:absolute;inset:8px 20%;width:60%;height:145px;object-fit:cover;opacity:.75}.inner #placeBadge{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);z-index:4;font-size:70px;line-height:1;color:#fff;text-shadow:0 2px 0 #000,0 0 9px #0008}.inner img[data-position=top]{top:13%;left:50%;transform:translateX(-50%)}.inner img[data-position=bottom]{bottom:12%;left:50%;transform:translateX(-50%)}.inner img[data-position=left]{left:7%;top:50%;transform:translateY(-50%)}.inner img[data-position=right]{right:7%;top:50%;transform:translateY(-50%)}.inner img[data-position=center]{left:50%;top:50%;transform:translate(-50%,-50%)}#sketch{width:100%;height:150px;border:1px dashed #aaa;border-radius:7px;background:#fff;touch-action:none}.sketch-tools{display:grid;grid-template-columns:42px 1fr auto auto;gap:5px;align-items:center}.sketch-tools input,.sketch-tools button{width:100%;min-width:0}.sketch-tools button{font-size:7px;padding:7px;border:1px solid #ccc;background:#fff;border-radius:4px}.ribbon-art-upload small{display:block;color:#888;margin-top:4px}
.sport-elements{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin:7px 0 12px}.sport-elements button{height:36px;border:1px solid #ddd;border-radius:6px;background:#fff;font-size:18px}.sport-elements button.active{background:#fff3ad;border:2px solid #111}.inner #sportElement{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);font-size:72px;z-index:3;filter:drop-shadow(0 4px 3px #0004)}.inner img[data-fill=full]{inset:0!important;width:100%!important;height:100%;object-fit:cover;transform:none!important;opacity:.92}.decoration{position:absolute;inset:0;z-index:1;pointer-events:none}.inner.sunburst .decoration{background:repeating-conic-gradient(#fff3 0 8deg,#0000 8deg 18deg)}.inner.waves-bg .decoration{background:repeating-radial-gradient(ellipse at 10% 100%,#fff3 0 5px,#0000 6px 16px)}.inner.grid-bg .decoration{background:linear-gradient(#fff2 1px,transparent 1px),linear-gradient(90deg,#fff2 1px,transparent 1px);background-size:18px 18px}.inner.spark-bg .decoration{background:radial-gradient(circle at 20% 25%,#fff 0 2px,transparent 3px),radial-gradient(circle at 75% 20%,#fff8 0 3px,transparent 4px),radial-gradient(circle at 80% 70%,#fff 0 2px,transparent 3px),radial-gradient(circle at 25% 75%,#fff8 0 3px,transparent 4px)}.inner.double{box-shadow:inset 0 0 0 7px #fff5,inset 0 0 0 11px #1116}.inner.dots{border:8px dotted #fff8}.inner.laurel-border:after{content:'❧  ❧';position:absolute;bottom:4%;font-size:40px;color:#fff9;letter-spacing:18px;z-index:4}.inner.clean{border-color:transparent}.medal.gloss:after{content:'';position:absolute;inset:8%;border-radius:inherit;background:linear-gradient(135deg,#fff7,transparent 38%);z-index:5;pointer-events:none}.medal.metallic{filter:saturate(.8) contrast(1.18)}.medal.matte{filter:saturate(.8);box-shadow:0 18px 35px #0003}
