/* Intro splash, beat-reactive stage, rave mode, cat dressing. */
.party[hidden],.party [hidden],.intro[hidden]{display:none!important}
body.party-open,body.intro-open,html:has(body.party-open),html:has(body.intro-open){overflow:hidden}
body.party-open .coin-dock{display:none}

/* Beat-reactive story stage */
.lights{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.world{translate:0 calc(var(--kick,0)*-5px);scale:calc(1 + var(--kick,0)*.014)}
.cat-acc,.cat-back{position:absolute;left:-50%;top:-50%;width:200%;height:200%;pointer-events:none;transform:scale(var(--beat-scale));transform-origin:50% 70%}
.cat-back{z-index:0}.cat-acc{z-index:2}.cat-anchor .cat{position:relative;z-index:1}
.coin-actions a.party-cta{border-color:#25e8ff;color:#25e8ff;background:#0b1830b8;box-shadow:0 0 18px #25e8ff44;animation:cta-pulse 1.9s ease-in-out infinite}
@keyframes cta-pulse{50%{box-shadow:0 0 30px #25e8ffaa;scale:1.04}}

/* Page section */
.party-section{padding:100px 7vw;position:relative;scroll-margin-top:95px;background:radial-gradient(ellipse at 15% 20%,#0f4a6a55,transparent 55%),radial-gradient(ellipse at 90% 80%,#51115760,transparent 55%),#0d0916;border-top:1px solid #fff1}
.party-launch{display:grid;grid-template-columns:1.4fr 1fr;gap:28px;margin-top:42px;align-items:stretch}
.party-drop-zone{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:200px;border:2px dashed #25e8ff88;border-radius:18px;background:#0b1830a0;text-align:center;cursor:pointer;padding:24px;transition:border-color .2s,box-shadow .2s,background .2s}
.party-drop-zone b{font-family:Vibe,Impact,sans-serif;font-weight:normal;font-size:clamp(30px,4vw,52px);color:#25e8ff;letter-spacing:.5px}
.party-drop-zone span{font:10px monospace;letter-spacing:1.5px;color:#9fb5c8}
.party-drop-zone:hover,.party-drop-zone.over{border-color:var(--lime);box-shadow:0 0 40px #bcff0055 inset,0 0 30px #bcff0044;background:#10240f90}
.party-launch-actions{display:flex;flex-direction:column;gap:12px;justify-content:center}
.party-launch-actions button{border:1px solid #25e8ff88;border-radius:30px;padding:17px 22px;background:none;color:#e9fbff;font:bold 11px Arial;letter-spacing:.5px}
.party-launch-actions button:first-child{background:var(--lime);color:#120919;border-color:var(--lime);box-shadow:0 4px #658000}
.party-launch-actions button:hover{translate:0 -2px}

/* Cat dressing */
.dress-chips{margin:0 0 27px;display:flex;flex-direction:column;gap:10px}
.dress-row{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.dress-row span{font:9px monospace;letter-spacing:1.5px;color:#8d83a0;width:52px}
.dress-chips button{border:1px solid #fff3;border-radius:20px;padding:8px 12px;background:none;font-size:9px;color:inherit}
.dress-chips button[aria-pressed=true]{background:var(--lime);color:#120919;border-color:var(--lime)}
.dress-chips .dress-random{border-color:var(--pink);color:var(--pink)}
#meme-form label small{opacity:.7;letter-spacing:1px}
.export-actions button+button{background:transparent;color:var(--lime)}

/* RAVE MODE */
.party{position:fixed;inset:0;z-index:200;background:#07030d;overflow:hidden;color:var(--cream);--kick:0}
.party.over::after{content:'DROP IT';position:absolute;inset:14px;border:3px dashed var(--lime);border-radius:20px;display:grid;place-items:center;font:64px Vibe,Impact,sans-serif;color:var(--lime);background:#07030da0;z-index:9;pointer-events:none}
.party-bg{position:absolute;inset:-5%;background:#0e0815 center/cover no-repeat;filter:brightness(.42) saturate(1.5) hue-rotate(calc(var(--kick)*20deg));transform:scale(calc(1.04 + var(--kick)*.035))}
.party-bg.swap{animation:bg-swap .7s ease-out}
@keyframes bg-swap{0%{filter:brightness(1.6) saturate(2)}100%{filter:brightness(.42) saturate(1.5)}}
.party-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.party-hud{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-start;padding:max(16px,env(safe-area-inset-top)) max(18px,3vw) max(16px,env(safe-area-inset-bottom));transition:opacity .5s;pointer-events:none}
.party-hud>*{pointer-events:auto}
.party.hud-idle .party-hud{opacity:0}
.party.hud-idle{cursor:none}
.party-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.party-title{font:22px Vibe,Impact,sans-serif;letter-spacing:1px;text-shadow:0 0 18px var(--pink)}
.party-title small{font:10px monospace;letter-spacing:1.5px;color:var(--lime);margin-left:12px;text-shadow:none;max-width:40vw;display:inline-block;vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.party-bpm{font:bold 12px monospace;letter-spacing:2px;color:#12071a;background:var(--lime);border-radius:20px;padding:6px 12px}
.party-top-btns{display:flex;gap:8px}
.party button{border:1px solid #fff5;border-radius:22px;background:#110c20b0;color:var(--cream);font:bold 10px Arial;letter-spacing:.5px;padding:11px 16px;backdrop-filter:blur(10px)}
.party button:hover{border-color:var(--lime)}
.party button.primary,.party button[aria-pressed=true]{background:var(--lime);color:#120919;border-color:var(--lime)}
.party-start{align-self:center;margin:auto;text-align:center;max-width:640px;padding:34px 30px;border:1px solid #25e8ff55;border-radius:22px;background:#0a0716cc;backdrop-filter:blur(14px);box-shadow:0 0 70px #25e8ff22}
.party-start h3{font:clamp(34px,5vw,56px) Vibe,Impact,sans-serif;font-weight:normal;margin:0 0 10px;color:#25e8ff;line-height:1}
.party-start p{color:#c5bdcc;line-height:1.5;font-size:14px;margin:0 0 20px}
.party-start-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.party-start-btns button{padding:14px 18px;font-size:11px}
.party-start .party-status{font:11px monospace;letter-spacing:.5px;color:var(--lime);min-height:1.4em;margin:18px 0 6px}
.party-start small{font:9px monospace;letter-spacing:1.5px;color:#8d83a0}
.party-controls{margin-top:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px;border:1px solid #fff2;border-radius:18px;background:#0a0716b8;backdrop-filter:blur(14px)}
.party-controls #party-play{width:44px;height:44px;border-radius:50%;padding:0;font-size:14px}
.party-controls span{font:10px monospace;color:#c5bdcc;min-width:34px}
.party-controls input[type=range]{accent-color:var(--lime);height:20px}
.party-controls #party-seek{flex:1 1 180px;min-width:120px}
.party-controls label{display:flex;align-items:center;gap:6px;font:9px monospace;letter-spacing:1px;color:#b7abc5}
.party-controls label input{width:78px}
.party-warn{margin:8px 0 0;font:9px monospace;letter-spacing:1px;color:#8d83a0;text-align:center}
.party button:focus-visible,.party input:focus-visible,.intro button:focus-visible{outline:2px solid var(--lime);outline-offset:3px}

/* Intro splash */
.intro{position:fixed;inset:0;z-index:300;background:#07030d;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;overflow:hidden;transition:opacity .9s,scale .9s}
.intro.leaving{opacity:0;scale:1.12;pointer-events:none}
.intro.flash::after{content:'';position:absolute;inset:0;background:#fff;animation:intro-flash .6s ease-out forwards;pointer-events:none}
@keyframes intro-flash{0%{opacity:.9}100%{opacity:0}}
.intro-glow{position:absolute;left:50%;top:42%;width:150vmax;height:150vmax;translate:-50% -50%;background:conic-gradient(from 0deg,#ff3fbb55,#07030d00 15%,#8418ff55 30%,#07030d00 45%,#25e8ff55 60%,#07030d00 75%,#bcff0044 90%,#ff3fbb55);animation:intro-spin 14s linear infinite;filter:blur(30px)}
@keyframes intro-spin{to{rotate:360deg}}
.intro-cat{--sprite-width:min(62vw,34svh,360px);position:absolute;left:50%;top:36%;width:var(--sprite-width);margin-left:calc(var(--sprite-width)/-2);margin-top:calc(var(--sprite-width)/-2);filter:drop-shadow(0 0 40px #ff3fbb99);animation:intro-drop 1.05s cubic-bezier(.3,1.5,.5,1) .15s both,intro-bob .47s ease-in-out 1.3s infinite alternate}
@keyframes intro-drop{0%{translate:0 -120vh;rotate:-20deg}100%{translate:0 0;rotate:0deg}}
@keyframes intro-bob{to{translate:0 -14px;rotate:3deg}}
.intro-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:12px;padding:0 20px calc(5svh + env(safe-area-inset-bottom));text-align:center;animation:intro-rise .8s ease-out 1.1s both}
@keyframes intro-rise{from{opacity:0;translate:0 24px}}
.intro-copy p{font:12px monospace;letter-spacing:3px;color:var(--lime);margin:0}
.intro-copy h2{font:normal clamp(52px,12vw,130px)/.9 Vibe,Impact,sans-serif;margin:0;text-shadow:0 0 40px var(--pink)}
#intro-go{margin-top:8px;border:0;border-radius:50px;padding:20px 38px 18px;background:linear-gradient(135deg,#ff55c1,#ff1b91);color:#fff;font:clamp(20px,3.4vw,30px) Vibe,Impact,sans-serif;letter-spacing:.5px;box-shadow:0 6px 0 #6b0a45,0 0 50px #ff3fbb77;animation:cta-pulse 1.2s ease-in-out infinite}
#intro-quiet{border:0;background:none;color:#9a90ad;font:11px monospace;letter-spacing:1px;text-decoration:underline;padding:8px}
.intro-copy small{font:9px monospace;letter-spacing:1px;color:#6f6580}

@media (max-width:860px){
 .party-launch{grid-template-columns:1fr}
 .party-section{padding:65px 6vw}
 .party-title{font-size:17px}.party-title small{display:block;margin:4px 0 0;max-width:60vw}
 .party-controls label{display:none}
 .party-start{padding:24px 18px}
}
@media (max-width:650px){.party-top-btns button{padding:9px 11px}.party-warn{display:none}}
@media (prefers-reduced-motion:reduce){
 .intro-cat,.intro-glow,.intro-copy,#intro-go,.coin-actions a.party-cta{animation:none}
 .world{translate:none;scale:none}
 .party-bg,.party-bg.swap{animation:none;transform:none}
}

/* Clip recorder */
.party-clip{position:absolute;inset:0;z-index:20;display:grid;place-items:center;background:#07030de0;backdrop-filter:blur(8px)}
.party-clip-card{width:min(92vw,420px);display:flex;flex-direction:column;gap:14px;align-items:center}
.party-clip-card video{width:100%;max-height:62svh;border-radius:14px;background:#000;box-shadow:0 0 50px #ff3fbb44}
.party-clip-btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.party-clip-card p{font:10px monospace;letter-spacing:1px;color:#b7abc5;text-align:center;margin:0;min-height:1.4em}
.party button.rec{background:#ff2d4a;border-color:#ff2d4a;color:#fff;animation:cta-pulse 1s ease-in-out infinite}

/* Prop tweaking */
.meme-preview{position:relative}
@media (min-width:861px){.meme-preview{position:sticky;top:96px}}
.meme-preview canvas:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
.tweak-box{position:absolute;pointer-events:none;border:2px dashed var(--lime);border-radius:6px;box-shadow:0 0 0 1px #0008,0 0 14px #bcff0066;z-index:2}
.tweak{margin:-10px 0 27px;padding:16px;border:1px solid #bcff0055;border-radius:12px;background:#171022}
.tweak-title{font:10px monospace;letter-spacing:2px;color:#b7abc5;margin:0 0 4px}.tweak-title b{color:var(--lime)}
.tweak-hint{font:11px Arial;color:#8d83a0;margin:0 0 12px}
.tweak label{display:grid!important;grid-template-columns:96px 1fr;align-items:center;gap:10px;margin:0 0 8px!important}
.tweak input[type=range]{width:100%;accent-color:var(--lime)}
.tweak .dress-row{margin-top:12px}
.tweak .dress-row button,.dress-chips button.picked{border-color:var(--pink)}
.dress-chips button.picked{box-shadow:0 0 0 2px var(--pink)}
.tweak .dress-row button{border:1px solid #fff3;border-radius:20px;padding:8px 12px;background:none;font-size:9px;color:inherit}

/* Prop thumbnails */
.dress-row span{width:100%;margin-top:4px}
.dress-chips button.dress-tile{width:76px;height:80px;padding:6px 4px 4px;border-radius:12px;background:#211829;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:2px;transition:translate .12s,border-color .12s}
.dress-tile img{width:100%;height:52px;object-fit:contain;pointer-events:none}
.dress-tile small{font:8px/1.1 Arial;letter-spacing:.2px;color:#b7abc5;text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dress-chips button.dress-tile:hover{translate:0 -2px;border-color:#fff8}
.dress-chips button.dress-tile[aria-pressed=true]{background:#26340c;border-color:var(--lime);box-shadow:0 0 0 1px var(--lime)}
.dress-chips button.dress-tile[aria-pressed=true] small{color:var(--lime)}
.dress-chips button.dress-tile.picked{box-shadow:0 0 0 2px var(--pink)}
@media (max-width:650px){.dress-chips button.dress-tile{width:calc((100% - 24px)/4);min-width:68px}}

/* Recording indicator that stays visible when the controls fade */
.rec-pill{position:absolute;top:max(14px,env(safe-area-inset-top));left:50%;translate:-50% 0;z-index:30;border:0;border-radius:24px;padding:10px 18px;background:#ff2d4a;color:#fff;font:bold 11px monospace;letter-spacing:1px;box-shadow:0 0 24px #ff2d4aaa;animation:cta-pulse 1s ease-in-out infinite;cursor:pointer}
.party .rec-pill[hidden]{display:none}
#party-rec-fmt{min-width:48px}

/* ===== Polish: icons + sticker buttons ===================================== */
.ico{width:1.3em;height:1.3em;flex:none;display:inline-block;vertical-align:-.25em}
button.btn,a.btn{--bg:#fff3d5;--fg:#12071a;--edge:#12071a;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 20px 10px;border:2px solid var(--edge);border-radius:14px;background:var(--bg);color:var(--fg);font:normal 16px/1 Vibe,Impact,'Arial Narrow',sans-serif;letter-spacing:.8px;text-transform:uppercase;text-decoration:none;white-space:nowrap;box-shadow:0 4px 0 var(--edge),0 10px 20px #0006;cursor:pointer;transition:transform .09s ease,box-shadow .09s ease,filter .15s;-webkit-tap-highlight-color:transparent}
button.btn:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--edge),0 14px 24px #0006;filter:brightness(1.07)}
button.btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--edge),0 3px 8px #0006;filter:none}
button.btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
button.btn[disabled]{opacity:.5;pointer-events:none}
button.btn.btn-lime{--bg:var(--lime);--fg:#12071a;--edge:#4a5f00;border-color:#12071a}
button.btn.btn-pink{--bg:var(--pink);--fg:#12071a;--edge:#7a0a55;border-color:#12071a}
button.btn.btn-ghost{--bg:#1b1230ee;--fg:var(--cream);--edge:#000;border-color:#ffffff55}
button.btn.btn-ghost:hover{border-color:#fff}
button.btn.btn-ghost[aria-pressed=true]{--bg:var(--lime);--fg:#12071a;--edge:#4a5f00;border-color:#12071a}
button.btn.btn-sm{min-height:40px;padding:9px 14px 7px;font-size:14px;border-radius:12px;gap:6px;box-shadow:0 3px 0 var(--edge),0 8px 16px #0006}
button.btn.btn-round{width:54px;height:54px;min-height:0;padding:0;border-radius:50%;font-size:18px}
button.btn.btn-round .ico{width:24px;height:24px;margin-left:1px}
button.btn .ico{filter:drop-shadow(0 1px 0 #0003)}
.party button.btn.rec{--bg:#ff2d4a;--fg:#fff;--edge:#7a0a1c;border-color:#12071a}
.party-launch-actions button.btn{justify-content:flex-start;padding-left:22px}
.party-start-btns button.btn{min-height:50px}
.party-controls{gap:8px}
.export-actions button.btn{flex:1 1 auto}
.coin-nav a{display:inline-flex;align-items:center;gap:6px}
.coin-nav .ico,.coin-actions .ico{width:1.25em;height:1.25em}
.coin-actions a{display:inline-flex;align-items:center;gap:7px}
.tweak .dress-row{gap:8px}
.dress-chips .dress-row .btn{margin-top:2px}
@media (max-width:650px){button.btn{font-size:14px;padding:11px 14px 9px}button.btn.btn-sm{font-size:12.5px}}
/* button labels must not inherit the small monospace style of the control bar */
.party button.btn span,.party-launch-actions button.btn span,.export-actions button.btn span,.tweak button.btn span,.dress-chips button.btn span{font:inherit!important;letter-spacing:inherit;min-width:0;width:auto;margin:0;color:inherit;text-transform:inherit}
.party-controls{row-gap:10px}
.party-controls #party-new{margin-left:auto}
/* make sure the variant colours always win over older button rules */
button.btn.btn-lime,button.btn.btn-pink,button.btn.btn-ghost{background:var(--bg);color:var(--fg)}

.party-clip-card video{width:auto;height:min(62svh,640px);max-width:100%;align-self:center}

/* ===== Art skin: the real 3D button art (replaces the CSS-drawn sticker look) ===== */
button.btn{--h:52px;--cap:calc(var(--h)*.5);--fg:#12071a;--up:url(assets/ui/btn/pill-lime-up.webp);--down:url(assets/ui/btn/pill-lime-down.webp);
 box-sizing:border-box;height:var(--h);min-height:var(--h);padding:0 4px calc(var(--h)*.11);border:0 solid transparent;border-width:0 var(--cap);border-radius:0;background:none;box-shadow:none;backdrop-filter:none;
 border-image-source:var(--up);border-image-slice:0 18% 0 18% fill;border-image-width:0 var(--cap) 0 var(--cap);border-image-repeat:stretch;
 color:var(--fg);font:normal 17px/1 Vibe,Impact,'Arial Narrow',sans-serif;letter-spacing:.8px;text-shadow:0 1px 0 #ffffff40;filter:drop-shadow(0 8px 9px #0007);transition:transform .08s ease,filter .15s}
button.btn:hover{transform:translateY(-2px);filter:drop-shadow(0 11px 12px #0008) brightness(1.07);box-shadow:none}
button.btn:active{transform:translateY(3px);border-image-source:var(--down);border-image-slice:0 16.4% 0 16.4% fill;filter:drop-shadow(0 3px 5px #0007);box-shadow:none}
button.btn.btn-lime,button.btn.btn-pink,button.btn.btn-ghost,button.btn.btn-violet,button.btn.btn-cyan{background:none;box-shadow:none;border-color:transparent}
button.btn.btn-lime{--fg:#12071a}
button.btn.btn-pink{--up:url(assets/ui/btn/pill-pink-up.webp);--down:url(assets/ui/btn/pill-pink-down.webp);--fg:#12071a}
button.btn.btn-violet{--up:url(assets/ui/btn/pill-violet-up.webp);--down:url(assets/ui/btn/pill-violet-down.webp);--fg:#fff3d5;text-shadow:0 2px 0 #0006}
button.btn.btn-cyan{--up:url(assets/ui/btn/pill-cyan-up.webp);--down:url(assets/ui/btn/pill-cyan-down.webp);--fg:#12071a}
button.btn.btn-ghost{--up:url(assets/ui/btn/pill-glass-up.webp);--down:url(assets/ui/btn/pill-glass-down.webp);--fg:#fff3d5;text-shadow:0 2px 0 #0008}
button.btn.btn-ghost[aria-pressed=true]{--up:url(assets/ui/btn/pill-lime-up.webp);--down:url(assets/ui/btn/pill-lime-down.webp);--fg:#12071a;text-shadow:0 1px 0 #ffffff40}
button.btn.btn-sm{--h:44px;font-size:15px;gap:6px}
.party button.btn.rec{--up:url(assets/ui/btn/pill-pink-up.webp);--down:url(assets/ui/btn/pill-pink-down.webp);filter:hue-rotate(-38deg) saturate(1.4) drop-shadow(0 8px 9px #0007)}
button.btn[disabled]{opacity:.5;pointer-events:none}
button.btn .ico{filter:none}
/* round icon buttons */
button.btn.btn-round{--h:58px;--rup:url(assets/ui/btn/round-lime-up.webp);--rdown:url(assets/ui/btn/round-lime-down.webp);width:calc(var(--h)*1.12);padding:0 0 4px;border:0;border-image:none;background:var(--rup) center/100% 100% no-repeat}
button.btn.btn-round:active{background-image:var(--rdown);border-image:none}
button.btn.btn-round.btn-pink{--rup:url(assets/ui/btn/round-pink-up.webp);--rdown:url(assets/ui/btn/round-pink-down.webp)}
button.btn.btn-round.btn-ghost{--rup:url(assets/ui/btn/round-glass-up.webp);--rdown:url(assets/ui/btn/round-glass-down.webp)}
button.btn.btn-round.btn-lime,button.btn.btn-round.btn-pink,button.btn.btn-round.btn-ghost{background-color:transparent;background-image:var(--rup);background-size:100% 100%;background-position:center;background-repeat:no-repeat}
button.btn.btn-round.btn-lime:active,button.btn.btn-round.btn-pink:active,button.btn.btn-round.btn-ghost:active{background-image:var(--rdown)}
button.btn.btn-round .ico{width:26px;height:26px;margin:0}
/* hero buttons */
button.chaos-button{--h:74px;--cap:calc(var(--h)*.5);box-sizing:border-box;height:var(--h);padding:0 4px calc(var(--h)*.06);border:0 solid transparent;border-width:0 var(--cap);border-radius:0;background:none!important;box-shadow:none!important;
 border-image-source:url(assets/ui/btn/hero-violet.webp);border-image-slice:0 11.4% 0 11.4% fill;border-image-width:0 var(--cap) 0 var(--cap);border-image-repeat:stretch;color:#fff3d5;text-shadow:0 3px 0 #2a0a55,0 0 18px #ff3fbb99;filter:drop-shadow(0 10px 18px #8418ff88)}
button.chaos-button:hover{filter:drop-shadow(0 12px 22px #ff3fbbaa) brightness(1.08)}
button.chaos-button:active{transform:translateY(3px)}
#intro-go{--h:86px;--cap:calc(var(--h)*.5);box-sizing:border-box;height:var(--h);padding:0 6px calc(var(--h)*.08);border:0 solid transparent;border-width:0 var(--cap);border-radius:0;background:none!important;box-shadow:none!important;
 border-image-source:url(assets/ui/btn/hero-pink.webp);border-image-slice:0 13% 0 13% fill;border-image-width:0 var(--cap) 0 var(--cap);border-image-repeat:stretch;color:#12071a;text-shadow:0 2px 0 #ffffff50;animation:none!important;filter:drop-shadow(0 0 28px #ff3fbbaa)}
.coin-actions a.buy-cta{--h:46px;--cap:calc(var(--h)*.5);box-sizing:border-box;display:inline-flex;align-items:center;height:var(--h);padding:0 2px calc(var(--h)*.1);border:0 solid transparent;border-width:0 var(--cap);border-radius:0;background:none;box-shadow:none;border-image-source:url(assets/ui/btn/pill-lime-up.webp);border-image-slice:0 18% 0 18% fill;border-image-width:0 var(--cap) 0 var(--cap);color:#12071a;filter:drop-shadow(0 7px 8px #0007)}
/* slider knobs */
input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;height:30px}
input[type=range]::-webkit-slider-runnable-track{height:10px;border-radius:8px;background:linear-gradient(#150d28,#2a1f45);border:2px solid #000;box-shadow:inset 0 2px 0 #0008}
input[type=range]::-moz-range-track{height:8px;border-radius:8px;background:#2a1f45;border:2px solid #000}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;margin-top:-12px;border:0;border-radius:50%;background:url(assets/ui/knob-lime.webp) center/contain no-repeat;filter:drop-shadow(0 3px 3px #0008)}
input[type=range]::-moz-range-thumb{width:30px;height:30px;border:0;border-radius:50%;background:url(assets/ui/knob-lime.webp) center/contain no-repeat}
@media (max-width:650px){button.btn{--h:48px;font-size:15px}button.btn.btn-sm{--h:42px;font-size:13.5px}button.chaos-button{--h:68px}}

/* ===== Stickers ===== */
.sticker-ui{margin:0 0 27px}
.sticker-tabs{display:flex;gap:10px;flex-wrap:wrap}
.sticker-grid{display:flex;flex-wrap:wrap;gap:7px;max-height:310px;overflow-y:auto;padding:4px 2px;scrollbar-width:thin}
.sticker-grid .dress-tile img{height:54px}
.sticker-panel{margin:6px 0 0}
.sticker-panel input[type=text]{width:100%;border:2px solid #000;background:#211829;border-radius:10px;color:#fff3d5;padding:10px 12px;font:15px Vibe,Impact,Arial;letter-spacing:.6px;text-transform:uppercase}
.sticker-panel input[type=text]:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
#sticker-label{display:block;font:9px monospace;letter-spacing:2px;margin:0 0 10px;color:#b7abc5}
#sticker-label small{opacity:.7;letter-spacing:1px}