:root{--plum:#240a3a;--pink:#e8203f;--orange:#ff5c6c;--violet:#7a2fd0;--teal:#b5179e;--sun:#ff8fa3;--paper:#fff;color:var(--plum);font-family:Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}body{background-color:#0000;background-image:radial-gradient(circle at 12% 8%,#ff5c6c8c,#0000 40%),radial-gradient(circle at 90% 25%,#b5179e80,#0000 42%),radial-gradient(circle at 75% 95%,#e8203f66,#0000 40%),linear-gradient(160deg,#d91a3f 0%,#9b1fa8 50%,#4a1fb8 100%);background-position:0 0,0 0,0 0,0 0;background-repeat:repeat,repeat,repeat,repeat;background-size:auto,auto,auto,auto;background-attachment:fixed;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;min-height:100vh;margin:0}:focus-visible{outline:3px solid var(--sun);outline-offset:3px}.app{max-width:600px;margin:0 auto;padding:48px 20px 80px}h1{color:#fff;letter-spacing:-1px;text-shadow:0 4px #240a3a40;margin:0;font-size:clamp(3rem,12vw,4.5rem)}.brand{align-items:center;gap:2px;display:flex}.brand img{filter:drop-shadow(0 4px #240a3a40);width:1.7em;height:1.7em;margin-right:-4px}.tagline{color:#fff;margin:4px 0 28px;font-size:1.2rem;font-weight:500}form{background:var(--paper);border-top:8px solid var(--sun);border-radius:28px;gap:12px;padding:28px;display:grid;box-shadow:0 20px 50px #240a3a59}label,legend{font-weight:700}input,select{font:inherit;width:100%;color:var(--plum);background:#fbf8ff;border:2px solid #e3d6f5;border-radius:14px;padding:12px 14px}input:focus,select:focus{border-color:var(--violet);outline:none;box-shadow:0 0 0 4px #7a2fd033}input[type=range]{accent-color:var(--pink);background:0 0;border:0;padding:0}fieldset{border:0;margin:8px 0 0;padding:0}.hint{background:#efe7ff;border-radius:12px;margin:0;padding:10px 14px;font-size:.95rem}.free-toggle{border:2px dashed var(--pink);background:#fff0f3;border-radius:16px;align-items:center;gap:14px;padding:14px 16px;display:flex}.free-toggle input{width:22px;height:22px;accent-color:var(--pink);flex:none;padding:0}.free-toggle label{cursor:pointer;gap:2px;display:grid}.free-toggle small{font-weight:400}.vibes{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}button{font:inherit;cursor:pointer}.vibe{color:var(--plum);background:#fbf8ff;border:2px solid #e3d6f5;border-radius:999px;padding:9px 18px;font-weight:600;transition:transform .15s}.vibe:hover{transform:translateY(-2px)}.vibe.active{color:#fff;background:var(--violet);border-color:#0000}.vibes .vibe.active:first-child{background:var(--pink)}.vibes .vibe.active:nth-child(2){background:var(--orange);color:var(--plum)}.vibes .vibe.active:nth-child(3){background:var(--teal)}.vibes .vibe.active:nth-child(4){background:var(--violet)}.vibes .vibe.active:nth-child(5){background:var(--sun);color:var(--plum)}.prefs{background:#fbf8ff;border:2px solid #e3d6f5;border-radius:16px;padding:14px 16px}.prefs summary{cursor:pointer;font-weight:700}.pref-title{margin:14px 0 6px;font-size:.95rem;font-weight:700}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{color:var(--plum);background:#fff;border:2px solid #e3d6f5;border-radius:999px;padding:7px 14px;font-size:.95rem;font-weight:600}.chip.on{background:var(--violet);border-color:var(--violet);color:#fff}.chip.skip{color:#fff;background:#8a1c1c;border-color:#8a1c1c;text-decoration:line-through}.actions{gap:12px;margin-top:16px;display:flex}.primary,.secondary{border:0;border-radius:16px;flex:1;padding:15px;font-size:1.05rem;font-weight:700;transition:transform .15s,box-shadow .15s}.primary{background:linear-gradient(135deg, var(--pink), var(--orange));color:#fff;box-shadow:0 8px 20px #e8203f66}.primary:hover:not(:disabled){transform:translateY(-2px)}.primary:disabled{opacity:.7;cursor:wait}.secondary{background:linear-gradient(135deg, var(--violet), var(--teal));color:#fff;box-shadow:0 8px 20px #7a2fd059}.secondary:hover:not(:disabled){transform:translateY(-2px)}.secondary:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.error{color:#8a1c1c;background:#fff0f0;border:2px solid #ffb3b3;border-radius:14px;margin-top:20px;padding:12px 16px}.result{background:var(--paper);border-top:8px solid var(--teal);border-radius:28px;margin-top:36px;padding:28px;box-shadow:0 20px 50px #240a3a59}.result h2{color:var(--violet);text-shadow:none;margin:0;font-size:1.9rem}.summary{margin:4px 0 0;font-weight:500}.when{color:#fff;background:linear-gradient(135deg, var(--pink), var(--violet));border-radius:12px;margin:10px 0 0;padding:10px 14px;font-weight:700;display:inline-block}.blend{border:2px solid var(--pink);background:#fff0f3;border-radius:14px;margin:14px 0 0;padding:12px 14px;font-weight:500}.blend.soft{border-color:var(--violet);background:#efe7ff;margin-top:8px;font-size:.95rem}.join-fields{gap:12px;margin-top:16px;display:grid}.join-btn{flex:none;width:100%;margin-top:8px}.waiting{align-items:center;gap:10px;margin:16px 0 0;font-weight:600;display:flex}.dot{background:var(--pink);border-radius:50%;flex:none;width:12px;height:12px;animation:1.2s ease-in-out infinite pulse}.reveal-title{animation:.6s ease-out pop}.timeline{margin-top:20px}.stop{border:2px solid var(--sun);background:#ffe9ee;border-radius:18px;align-items:flex-start;gap:16px;padding:16px;animation:.5s ease-out pop;display:flex}.timeline>div:nth-child(5n+1) .stop{border-color:var(--pink);background:#ffe7ea}.timeline>div:nth-child(5n+2) .stop{border-color:var(--orange);background:#ffeaec}.timeline>div:nth-child(5n+3) .stop{border-color:var(--teal);background:#fbe6f6}.timeline>div:nth-child(5n+4) .stop{border-color:var(--violet);background:#efe7ff}.timeline>div:nth-child(5n+5) .stop{border-color:var(--sun);background:#ffe9ee}.stop-emoji{background:#fff;border-radius:50%;padding:10px;font-size:2rem;line-height:1}.stop strong{font-size:1.15rem;display:block}.stop p{margin:4px 0}.stop small:first-child{color:var(--violet);font-weight:700}.place-link{color:var(--violet);margin:2px 0 6px;font-weight:600;display:inline-block}.place-link:hover{color:var(--pink)}.arrow{text-align:center;color:var(--pink);padding:6px 0;font-size:1.5rem}.teaser{border:2px dashed var(--violet);background:#efe7ff;border-radius:14px;margin:16px 0 0;padding:14px 16px}.next-btn{color:#fff;background:linear-gradient(135deg, var(--violet), var(--pink));border:0;border-radius:16px;width:100%;margin-top:20px;padding:15px;font-size:1.05rem;font-weight:700;transition:transform .15s;box-shadow:0 8px 20px #7a2fd059}.next-btn:hover{transform:translateY(-2px)}.total{text-align:center;color:#fff;background:linear-gradient(135deg, var(--pink), var(--violet));border-radius:18px;margin:24px 0 0;padding:14px;font-size:1.6rem;font-weight:800;animation:.6s ease-out pop}.share-btn{border:2px solid var(--violet);width:100%;color:var(--violet);background:#fff;border-radius:16px;margin-top:20px;padding:14px;font-size:1.05rem;font-weight:700}.share-btn:hover:not(:disabled){background:var(--violet);color:#fff}.share-btn:disabled{opacity:.6;cursor:wait}.share-link{margin-top:12px;font-size:.9rem}.again-btn{border:2px solid var(--pink);width:100%;color:var(--pink);background:#fff;border-radius:16px;margin-top:12px;padding:14px;font-size:1.05rem;font-weight:700}.again-btn:hover{background:var(--pink);color:#fff}@keyframes pop{0%{opacity:0;transform:translateY(12px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes pulse{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}@media (prefers-reduced-motion:reduce){.reveal-title,.stop,.total,.dot{animation:none}.vibe,.primary,.secondary,.next-btn{transition:none}}
