/* ORBIX Rewards Wheel: minimal, Apple-style light card. Used inside community.html's wheel modal. */
.orw { --orw-ink: #1d1d1f; --orw-muted: #6e6e73; --orw-line: rgba(0,0,0,.08); --orw-surface: rgba(255,255,255,.82); color: var(--orw-ink); text-align: left; }
.orw-frame { position: relative; width: min(100%, var(--orw-size, 360px)); aspect-ratio: 1; margin: 0 auto; }
.orw-canvas { width: 100%; height: 100%; display: block; }
.orw-pointer {
  position: absolute; z-index: 2; left: 50%; top: -1px; transform: translateX(-50%); transform-origin: 50% 0;
  width: 0; height: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 25px solid #1d1d1f;
  filter: drop-shadow(0 2px 2px #0002);
}
.orw-pointer.tick { animation: orwTick .14s ease-out; }
@keyframes orwTick { 40% { transform: translateX(-50%) rotate(-9deg); } }
.orw-sound {
  position: absolute; z-index: 3; right: 0; top: 0; width: 38px; height: 38px; padding: 0; display: grid; place-items: center;
  border-radius: 50%; border: 1px solid var(--orw-line); background: var(--orw-surface); color: var(--orw-ink); cursor: pointer;
  box-shadow: 0 1px 3px #0001; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.orw-sound svg { width: 18px; height: 18px; }
.orw-sound .wave, .orw-sound .mute { transition: opacity .2s; }
.orw-sound[aria-pressed="false"] .wave { opacity: 0; }
.orw-sound[aria-pressed="true"] .mute { opacity: 0; }
.orw-spin {
  display: block; width: min(100%, var(--orw-size, 360px)); min-height: 52px; margin: 18px auto 0; border: 0; border-radius: 15px;
  background: var(--orw-ink); color: #fff; font: inherit; font-size: 15px; font-weight: 650; cursor: pointer;
  transition: transform .18s, opacity .18s; touch-action: manipulation;
}
.orw-spin:active { transform: scale(.985); }
.orw-spin:disabled { opacity: .55; cursor: default; }
.orw-spin:focus-visible, .orw-sound:focus-visible { outline: 3px solid #0071e3; outline-offset: 3px; }
.orw-result {
  display: flex; align-items: center; gap: 13px; min-height: 80px; margin: 18px 0 0; padding: 14px 16px;
  background: #f5f5f7; border: 1px solid var(--orw-line); border-radius: 18px;
}
.orw-result.reveal { animation: orwReveal .42s cubic-bezier(.2,.9,.3,1.2); }
@keyframes orwReveal { from { opacity: 0; transform: translateY(6px) scale(.985); } }
.orw-result-icon { width: 46px; height: 46px; flex: 0 0 46px; display: grid; place-items: center; border-radius: 14px; background: #fff; font-size: 21px; }
.orw-result strong { display: block; font-size: 17px; letter-spacing: -.025em; }
.orw-small { margin-top: 4px; color: var(--orw-muted); font-size: 13px; line-height: 1.45; }
.orw-legend { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 14px; }
.orw-legend span { padding: 8px 4px; text-align: center; border: 1px solid var(--orw-line); border-radius: 10px; font-size: 11px; font-weight: 600; color: var(--orw-ink); }
.orw-legend i { display: block; width: 8px; height: 8px; border-radius: 50%; margin: 0 auto 5px; }
.orw-legend small { display: block; margin-top: 2px; color: var(--orw-muted); font-weight: 500; }
/* Dark variant for the black Top Scholar panel */
.orw-dark { --orw-ink: #f5f5f7; --orw-muted: #a1a1a6; --orw-line: rgba(255,255,255,.1); --orw-surface: rgba(29,29,31,.8); }
.orw-dark .orw-pointer { border-top-color: #f5f5f7; filter: drop-shadow(0 2px 4px rgba(0,0,0,.6)); }
.orw-dark .orw-spin { background: #e8c888; color: #000; }
.orw-dark .orw-spin:not(:disabled):hover { background: #f2dca6; }
.orw-dark .orw-spin:disabled { background: #1d1d1f; color: #a1a1a6; opacity: 1; box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); }
.orw-dark .orw-spin:focus-visible, .orw-dark .orw-sound:focus-visible { outline-color: #e8c888; }
.orw-dark .orw-result { background: #161617; border-color: rgba(255,255,255,.08); }
.orw-dark .orw-result-icon { background: #232325; color: #e8c888; }
@media (max-width: 380px) { .orw-legend { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: reduce) { .orw-spin { transition: none; } .orw-pointer.tick, .orw-result.reveal { animation: none; } }
