body.dk-dash .sp-nav{z-index:62}
/* The module wheel shares the dashboard's light/dark and club-color tokens. */
.sp-more.sp-wheel{position:fixed;left:50%;right:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 47px);
  width:min(430px,100vw);max-width:none;max-height:none;height:250px;box-sizing:border-box;
  margin:0;padding:0;display:block;overflow:visible;z-index:61;pointer-events:none;
  opacity:0;transform:translateX(-50%) translateY(20px) scale(.92);transform-origin:50% 100%;
  transition:opacity .25s ease,transform .48s cubic-bezier(.2,1.15,.3,1);touch-action:none;user-select:none;-webkit-user-select:none}
.sp-more.sp-wheel.on{opacity:1;transform:translateX(-50%) translateY(0) scale(1);pointer-events:auto}
body.dk-dash .sp-backdrop.sp-wheel-backdrop{background:color-mix(in srgb,var(--dk-ink,#eef0f7) 35%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.sp-wheel::before{content:'';position:absolute;inset:2% -4% -15%;border-radius:50% 50% 0 0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 65%,color-mix(in srgb,var(--dk-glass,#fff) 84%,transparent),transparent 72%)}
.wheel-orbit{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;color:var(--brand,#ff8c00)}
.wheel-orbit path{fill:none}
.wheel-track{stroke:var(--dk-glass-2,rgba(255,255,255,.8));stroke-width:13;filter:drop-shadow(0 2px 8px rgba(0,0,0,.08))}
.wheel-shine{stroke:url(#wheelOrbitGlow);stroke-width:1.5;stroke-dasharray:16 5;animation:wheel-flow 20s linear infinite}
@keyframes wheel-flow{to{stroke-dashoffset:-126}}
.wheel-item{position:absolute;left:0;top:0;display:flex;align-items:center;justify-content:center;flex-direction:column;
  gap:6px;box-sizing:border-box;border-radius:50%;border:1px solid var(--dk-edge,rgba(0,0,0,.1));
  background:var(--dk-glass-2,rgba(255,255,255,.92));color:var(--dk-t1,#0b1020);padding:9px 4px;
  box-shadow:0 6px 20px -12px rgba(0,0,0,.22);cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:background .2s,border-color .2s,box-shadow .2s;will-change:transform,opacity;touch-action:none}
.wheel-item img{display:block;width:26px;height:26px;object-fit:contain;border-radius:7px;pointer-events:none;-webkit-user-drag:none}
.wheel-item>span{font:650 8.5px/1.2 Inter,system-ui,sans-serif;max-width:100%;text-align:center;overflow-wrap:anywhere;pointer-events:none}
.wheel-item.selected{border-color:var(--brand,#ff8c00);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand,#ff8c00) 9%,transparent),0 5px 30px -8px color-mix(in srgb,var(--brand,#ff8c00) 58%,transparent)}
.wheel-item.selected>span{font-weight:750}
/* Der Name steht groß darunter — in der Kugel nicht noch einmal (Roy 23.10.2026). */
.wheel-item>span{transition:opacity .18s ease}
.wheel-item.selected>span{opacity:0;height:0;margin:-3px 0 0}
.wheel-item.selected img{width:32px;height:32px}
.wheel-item:focus-visible,.wheel-open:focus-visible,.wheel-arrow:focus-visible{outline:2px solid var(--dk-acc-t,#b35b00);outline-offset:4px}
.wheel-center{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);width:270px;max-width:80%;text-align:center;color:var(--dk-t1,#0b1020)}
.wheel-hint{width:110px;margin-left:auto;margin-right:auto;transform:translateY(5px);font:450 9px/1.3 Inter,system-ui,sans-serif;color:var(--dk-t2,#3d4663);display:block;margin-bottom:7px}
.wheel-controls{display:flex;align-items:center;justify-content:center;gap:7px}
.wheel-choice{width:174px;min-width:0}
.wheel-choice strong{display:flex;align-items:center;justify-content:center;min-height:32px;font:750 14px/1.2 Inter,system-ui,sans-serif;overflow-wrap:anywhere}
.wheel-open{min-height:38px;min-width:104px;margin-top:5px;padding:7px 16px;border:1px solid transparent;border-radius:22px;
  /* Voller Knopf in Vereinsfarbe, abgedunkelt: weiße Schrift bleibt auch bei
     hellen Vereinsfarben lesbar. Vorher Akzentschrift auf Akzenthauch — im
     Dunkeln blau auf Dunkelblau (Roy 23.10.2026). */
  background:color-mix(in srgb,var(--brand,#ff8c00) 72%,#000);color:#fff;
  box-shadow:0 6px 18px -8px color-mix(in srgb,var(--brand,#ff8c00) 70%,transparent);
  font:700 12px Inter,system-ui,sans-serif;cursor:pointer;transition:background .2s,transform .2s}
.wheel-open span{display:inline-block;margin-left:5px;font-size:18px;line-height:12px}
.wheel-open:hover{background:color-mix(in srgb,var(--brand,#ff8c00) 82%,#000)}
.wheel-open:active{transform:scale(.96)}
.wheel-open:disabled{opacity:.55;cursor:not-allowed}
.wheel-arrow{flex:none;display:grid;place-items:center;width:36px;height:44px;border:0;border-radius:18px;
  background:transparent;color:var(--dk-t2,#3d4663);font:400 28px/1 system-ui;cursor:pointer}
.wheel-arrow:hover{background:var(--dk-heb-2,rgba(0,0,0,.05))}
.wheel-arrow:disabled{opacity:.2;cursor:default}
.wheel-counter{display:block;margin-top:5px;color:var(--dk-t3,#6b7392);font:500 9px Inter,system-ui,sans-serif;letter-spacing:.12em}
.sp-wheel.dragging{cursor:grabbing}
.sp-wheel.dragging .wheel-item{cursor:grabbing}
@media(min-width:900px){.sp-more.sp-wheel{bottom:55px}}
@media(prefers-reduced-motion:reduce){.sp-more.sp-wheel,.sp-backdrop.sp-wheel-backdrop,.wheel-item,.wheel-open{transition:none}.wheel-shine{animation:none}}

.wheel-footer{position:relative;display:flex;align-items:center;justify-content:center;min-height:22px;margin-top:2px}
.wheel-footer .wheel-counter{margin-top:0}
.wheel-sound{position:absolute;left:calc(50% + 28px);top:50%;transform:translateY(-50%);display:grid;place-items:center;
  width:30px;height:30px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--dk-t3,#6b7392);cursor:pointer}
.wheel-sound svg{width:13px;height:13px}
.wheel-sound:hover{background:var(--dk-heb-2,rgba(0,0,0,.05));color:var(--dk-t1,#0b1020)}
.wheel-sound:focus-visible{outline:2px solid var(--dk-acc-t,#b35b00);outline-offset:2px}