.mood-stage{--mood:var(--cyan);text-align:center;justify-items:center;gap:.9rem;max-width:34rem;margin-inline:auto;display:grid}.mood-kicker{font-family:var(--display);text-transform:uppercase;letter-spacing:.3em;color:var(--mood);margin:0;font-size:.66rem}.mood-h{font-family:var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--bone);margin:0;font-size:clamp(1.9rem,7vw,3rem);line-height:1.04}.mood-sub{color:#b9d4de;max-width:26rem;margin:0;font-size:.95rem;line-height:1.55}.mood-echo{color:var(--mood);max-width:26rem;margin:0;font-size:1.05rem;line-height:1.5}.mood-shades{flex-wrap:wrap;justify-content:center;gap:.6rem;margin:.4rem 0 0;padding:0;list-style:none;display:flex}.mood-shade{border:1px solid var(--mood,var(--cyan-dim));color:var(--bone);font:inherit;cursor:pointer;background:0 0;border-radius:999px;padding:.75rem 1.15rem;font-size:.95rem;transition:background .15s,color .15s}.mood-shade:hover,.mood-shade:focus-visible{background:var(--mood,var(--cyan));color:#04121a}.mood-back,.mood-skip summary{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;font-size:.8rem;text-decoration:underline}.mood-skip{margin-top:.2rem}.mood-skip summary{list-style:none}.mood-skip summary::-webkit-details-marker{display:none}.mood-canvas{border:1px solid var(--line);border-radius:3px;width:min(19rem,78vw);height:auto;margin-top:.3rem}.mood-actions{flex-wrap:wrap;justify-content:center;gap:.7rem;margin-top:.2rem;display:flex}.mood-actions .btn:disabled{opacity:.5;cursor:progress}.mood-note{color:var(--cyan-bright);margin:0;font-size:.82rem}.mood-prompt{color:#b9d4de;max-width:24rem;margin:0;font-size:.86rem}.mood-support{border:1px solid var(--line);border-left:3px solid var(--mood);text-align:left;background:#03080c80;gap:.35rem;width:100%;padding:.9rem 1.1rem;display:grid}.mood-support p{color:#cfe4ec;margin:0;font-size:.84rem;line-height:1.5}.mood-support a{color:var(--cyan)}.mood-film{border-top:1px solid var(--line);justify-items:center;gap:.35rem;width:100%;margin-top:.6rem;padding-top:1.2rem;display:grid}.mood-film-h{font-family:var(--display);text-transform:uppercase;letter-spacing:.14em;color:var(--bone);margin:0;font-size:.9rem}.mood-film-p{color:var(--muted);margin:0 0 .5rem;font-size:.8rem}.mood-page{padding-bottom:clamp(3rem,8vw,5rem)}.mood-lede{max-width:34rem;margin-bottom:clamp(1.6rem,4vw,2.4rem)}.mood-styles{flex-wrap:wrap;justify-content:center;gap:.45rem;margin-top:.2rem;display:flex}.mood-style{border:1px solid var(--line);color:#b9d4de;font-family:var(--display);text-transform:uppercase;letter-spacing:.14em;cursor:pointer;background:0 0;padding:.5rem .85rem;font-size:.64rem;transition:background .15s,color .15s,border-color .15s}.mood-style:hover{border-color:var(--mood);color:var(--bone)}.mood-style.on{background:var(--mood);border-color:var(--mood);color:#04121a}.mood-file{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.mood-fine{color:var(--muted);margin:0;font-size:.72rem}.mood-pickwrap{border-bottom:1px solid var(--line);justify-items:center;gap:.55rem;width:100%;margin-bottom:.4rem;padding-bottom:1.4rem;display:grid}.mood-picklab{font-family:var(--display);text-transform:uppercase;letter-spacing:.2em;color:var(--muted);margin:0;font-size:.62rem}.mood-err{color:#ffb4a2}
.ring-wrap{--size:min(78vw, 20rem);--band:2.6rem;--r:calc((var(--size) - var(--band)) / 2);width:var(--size);height:var(--size);filter:drop-shadow(0 0 42px color-mix(in srgb, var(--emit) 55%, transparent));place-items:center;margin:1.6rem auto .4rem;transition:filter .25s;display:grid;position:relative}.ring{width:var(--size);height:var(--size);touch-action:none;cursor:grab;border-radius:50%;outline:none;place-items:center;display:grid;position:relative}.ring.dragging{cursor:grabbing}.ring:focus-visible{box-shadow:0 0 0 3px var(--emit)}.ring-band{background:var(--wheel);-webkit-mask:radial-gradient(circle, transparent calc(50% - var(--band)), #000 calc(50% - var(--band) + 1px));-webkit-mask:radial-gradient(circle, transparent calc(50% - var(--band)), #000 calc(50% - var(--band) + 1px));mask:radial-gradient(circle, transparent calc(50% - var(--band)), #000 calc(50% - var(--band) + 1px));opacity:.95;border-radius:50%;position:absolute;inset:0}.ring-emit{inset:calc(var(--band) - .4rem);background:radial-gradient(circle, color-mix(in srgb, var(--emit) 70%, transparent) 0%, color-mix(in srgb, var(--emit) 26%, transparent) 55%, transparent 72%);pointer-events:none;border-radius:50%;transition:background .12s linear;position:absolute}.ring-knob{border:3px solid var(--emit);width:1.5rem;height:1.5rem;box-shadow:0 0 18px color-mix(in srgb, var(--emit) 85%, transparent);transform-origin:50%;pointer-events:none;background:#fff;border-radius:50%;margin:-.75rem 0 0 -.75rem;position:absolute;top:50%;left:50%}.ring-core{z-index:2;width:calc(var(--size) - var(--band) * 2 - .8rem);height:calc(var(--size) - var(--band) * 2 - .8rem);border:1px solid color-mix(in srgb, var(--emit) 50%, transparent);color:var(--bone);cursor:pointer;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:radial-gradient(circle at 50% 38%,#03080c59,#03080ce6);border-radius:50%;place-content:center;gap:.15rem;transition:transform .15s,border-color .2s;display:grid;position:relative}.ring-core:hover{transform:scale(1.03)}.ring-core:active{transform:scale(.98)}.ring-emoji{font-size:clamp(2.2rem,9vw,3rem);line-height:1}.ring-label{font-family:var(--display);text-transform:uppercase;letter-spacing:.14em;color:#fff;font-size:clamp(.95rem,3.6vw,1.2rem)}.ring-go{letter-spacing:.18em;text-transform:uppercase;color:color-mix(in srgb, var(--emit) 80%, #fff);font-size:.6rem}.ring-legend{pointer-events:none;margin:0;padding:0;list-style:none;position:absolute;inset:0}.ring-legend li{transform:rotate(var(--a)) translateY(calc((var(--size) / 2 + 1rem) * -1)) rotate(calc(var(--a) * -1));transform-origin:50%;text-align:center;width:5rem;font-family:var(--display);text-transform:uppercase;letter-spacing:.12em;color:var(--muted);opacity:.65;margin:-.5rem 0 0 -2.5rem;font-size:.58rem;transition:color .2s,opacity .2s;position:absolute;top:50%;left:50%}.ring-legend li.on{color:var(--c);opacity:1}@media (prefers-reduced-motion:reduce){.ring-wrap,.ring-emit,.ring-core{transition:none}}
