.destination-roulette{display:grid;grid-template-columns:80px minmax(0,1fr);gap:16px;align-items:center;max-width:420px;margin:22px 0 0;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.roulette-dial{position:relative;width:80px;height:80px;align-self:start;margin-top:4px}
.roulette-wheel{width:100%;height:100%;border:2px solid var(--ink);border-radius:50%;background:conic-gradient(var(--acid) 0deg 45deg,var(--paper) 45deg 90deg,var(--red) 90deg 135deg,var(--paper) 135deg 180deg,var(--acid) 180deg 225deg,var(--paper) 225deg 270deg,var(--red) 270deg 315deg,var(--paper) 315deg 360deg);transition:transform 1.8s cubic-bezier(.15,.7,.2,1)}
.roulette-dial:before{content:'';position:absolute;z-index:1;left:35px;top:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:11px solid var(--ink)}
.roulette-dial:after{content:'♫';position:absolute;inset:26px;background:var(--ink);color:var(--paper);border-radius:50%;text-align:center;font-size:16px;line-height:28px}
.destination-roulette h2{margin:0;font-family:var(--display);font-size:20px;line-height:1.25;font-weight:600;text-transform:uppercase}
.destination-roulette h2 em{color:var(--red);font-family:var(--serif);font-weight:600;text-transform:none}
.destination-roulette p{margin:5px 0 8px;font-size:14px;line-height:1.45}
.roulette-spin{min-height:44px;padding:8px 12px;border:1px solid var(--ink);background:transparent;color:var(--ink);font-size:14px;font-weight:600;cursor:pointer}
.roulette-spin:hover{background:var(--acid)}
.roulette-spin:disabled{cursor:wait;opacity:.65}
.destination-roulette a:focus-visible,.roulette-spin:focus-visible{outline:2px solid var(--red);outline-offset:4px}
.roulette-result{margin-top:10px;overflow-wrap:anywhere}
.roulette-result[hidden]{display:none}
.roulette-result a{display:block;width:fit-content;padding:6px 0;font-size:14px;line-height:1.4;text-underline-offset:3px}
.roulette-result a:first-child{font-weight:700}
.roulette-result small{display:block;font-size:13px;line-height:1.4}
.roulette-status:empty{display:none}
@media(prefers-reduced-motion:reduce){.roulette-wheel{transition:none}}
@media(max-width:360px){.destination-roulette{gap:12px;grid-template-columns:72px minmax(0,1fr)}.roulette-dial{width:72px;height:72px}.roulette-dial:before{left:31px}.roulette-dial:after{inset:22px}}