[hidden]{display:none!important}
:root{--pink:#fd72ca;--bg:#000;--card:#141014;--ink:#fff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 Nunito,system-ui,sans-serif}
.hero{text-align:center;padding:28px 16px 8px;background:radial-gradient(circle at 50% -20%,#fd72ca55,transparent 70%)}
.home{position:absolute;left:12px;top:10px;color:var(--pink);text-decoration:none;font-weight:700;font-size:14px}
h1{font-family:'Baloo 2',cursive;font-weight:800;font-size:clamp(40px,11vw,84px);line-height:.95;margin:18px 0 10px;color:var(--pink);text-shadow:0 4px 0 #9b2a78,0 0 24px #fd72ca88;letter-spacing:-1px}
h1 span{display:inline-block;animation:bob 2.6s ease-in-out infinite}h1 span:nth-child(2){animation-delay:.2s}h1 span:nth-child(3){animation-delay:.4s}
@keyframes bob{50%{transform:translateY(-6px) rotate(-2deg)}}
.intro{max-width:560px;margin:0 auto;font-size:18px}
main{max-width:720px;margin:0 auto;padding:12px 14px 40px}
.card{background:var(--card);border:2px solid var(--pink);border-radius:22px;padding:18px;margin:16px 0;box-shadow:0 0 0 4px #fd72ca22}
label{font-family:'Baloo 2';font-size:20px;color:var(--pink);display:block;margin-bottom:6px}
input,textarea{width:100%;background:#000;color:#fff;border:2px solid #fd72ca88;border-radius:14px;padding:12px;font:inherit;font-size:17px}
input:focus,textarea:focus{outline:none;border-color:var(--pink)}
.row{display:flex;gap:10px;align-items:center;margin-top:10px;flex-wrap:wrap}.between{justify-content:space-between}
button,.btn{background:var(--pink);color:#000;border:0;border-radius:999px;padding:11px 20px;font:800 17px 'Baloo 2';cursor:pointer;text-decoration:none;display:inline-block}
button:disabled{opacity:.5;cursor:wait}.danger{background:#ff3b3b;color:#fff}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.chips button{background:#2a1626;color:var(--pink);font:700 14px Nunito;padding:7px 12px;border:1px solid #fd72ca66}
.msg{margin-top:14px;padding:12px;border-radius:14px;background:#2a1626}.err{color:#ff8fd8}
#result img{width:100%;border-radius:14px;margin-top:14px;display:block}
h2{font-family:'Baloo 2';color:var(--pink);font-size:30px;margin:28px 0 8px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}@media(min-width:620px){.grid{grid-template-columns:repeat(3,1fr)}}
.grid img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;border:2px solid #fd72ca44;cursor:pointer;display:block}
dialog{background:#111;color:#fff;border:2px solid var(--pink);border-radius:18px;max-width:94vw;padding:12px}dialog::backdrop{background:#000c}
dialog img{max-width:100%;max-height:70vh;display:block;margin:auto}
footer{text-align:center;margin-top:30px}.link{background:none;color:#555;font:12px Nunito;padding:4px}
.spin{display:inline-block;width:18px;height:18px;border:3px solid #000;border-top-color:transparent;border-radius:50%;animation:s 1s linear infinite;vertical-align:-3px;margin-right:6px}@keyframes s{to{transform:rotate(1turn)}}
.big{font-size:20px;padding:13px 26px;box-shadow:0 0 0 3px #fff3,0 0 18px #fd72ca99}

.tips{margin-top:14px;border:1px solid #fd72ca55;border-radius:14px;padding:10px 14px;background:#140a12}.tips summary{cursor:pointer;list-style:none;font:800 17px "Baloo 2";color:var(--pink);display:flex;justify-content:space-between;align-items:center}.tips summary::-webkit-details-marker{display:none}.tips .caret{transition:transform .2s;display:inline-block}.tips[open] .caret{transform:rotate(180deg)}.tips ul{margin:10px 0 0;padding-left:18px;font-size:15px;line-height:1.45}.tips li{margin:6px 0}.tips .tl{margin:10px 0 0;font-size:15px}
/* mobile fit guards */
*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden;overscroll-behavior:none}
@supports (overflow:clip){html,body{overflow-x:clip}}
body{touch-action:pan-y pinch-zoom;-webkit-text-size-adjust:100%}
img,video,canvas,dialog{max-width:100%}
.chips button,#vcap,.tips li,label,p{overflow-wrap:anywhere;min-width:0}
.row{flex-wrap:wrap;min-width:0}
dialog{max-width:calc(100vw - 24px);overscroll-behavior:contain}
input,textarea,select{font-size:max(16px,1em)}
html.lock,html.lock body,html:has(dialog[open]),html:has(dialog[open]) body{overflow:hidden}

.sharegrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.sharegrid .btn{text-align:center;min-width:0}.sh-t{font:800 20px 'Baloo 2';color:var(--pink);margin:0 0 12px;text-align:center}#sharedlg{width:min(420px,calc(100vw - 24px))}#toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--pink);color:#000;font-weight:800;padding:10px 18px;border-radius:999px;z-index:99;pointer-events:none}

/* hearts + sort */
.ghead{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:28px 0 8px}.ghead h2{margin:0}
.sort{display:inline-flex;background:#2a1626;border:1px solid #fd72ca66;border-radius:999px;padding:3px}.sort button{background:none;color:var(--pink);font:800 15px 'Baloo 2';padding:6px 14px;touch-action:manipulation}.sort button.on{background:var(--pink);color:#000}
.mc{position:relative;min-width:0}
.heart{position:absolute;right:6px;bottom:6px;display:inline-flex;align-items:center;gap:5px;background:#000b;color:#fff;border:1px solid #fd72ca88;padding:5px 10px 5px 8px;font:800 15px/1 'Baloo 2';border-radius:999px;touch-action:manipulation;-webkit-tap-highlight-color:transparent;min-height:34px}
.heart svg{width:18px;height:18px;fill:none;stroke:var(--pink);stroke-width:2.2;transition:transform .15s}.heart.on svg{fill:var(--pink)}.heart.on{border-color:var(--pink)}
.heart.pop svg{animation:hp .35s ease}@keyframes hp{50%{transform:scale(1.35)}}