/* Phase passed: repeat or next */
/* phase passed: choose */
.win-banner { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-sm); align-items: center; padding: var(--space-xs) var(--space-sm); border-radius: var(--radius-panel); background: color-mix(in srgb, var(--on-dark-good) 16%, transparent); border: 1px solid color-mix(in srgb, var(--on-dark-good) 55%, transparent); }
.choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-sm); }
.choice { display: grid; align-content: start; gap: var(--space-xs); text-align: left; padding: var(--space-md) var(--space-md); border-radius: var(--radius-panel); border: 1px solid var(--line); background: var(--bg); color: var(--fg); font: inherit; cursor: pointer; transition: border-color .2s ease, transform .12s ease; }
.choice b { font-family: var(--font-body); font-size: var(--text-md); }
div.choice { cursor: default; } div.choice:hover { transform: none; }
div.choice .f { margin-top: var(--space-2xs); } div.choice .btn { justify-self: start; }
#ph-start, #ph-next-start { color: var(--fg); }
.choice span { color: var(--muted); font-size: var(--text-sm); line-height: 1.45; }
.choice:hover { border-color: var(--accent); transform: translateY(-2px); }
button#ph-next, #ph-next-box { border-color:color-mix(in srgb, var(--accent) 60%, var(--line)); }
