/* assets/css/play.css */
body {
    background-color: #0F2027;
    background-image: linear-gradient(to bottom, #203A43, #2C5364);
    color: #FFF;
    --nav-active: #FFD700;
    --text-main: #FFF;
    --text-sub: rgba(255,255,255,0.6);
}
.large-title { color: #FFD700; text-shadow: 0 0 10px rgba(255,215,0,0.5); }

/* 深色模式适配组件 */
.btn-capsule { background: rgba(255,255,255,0.1); color: #FFD700; border-color: rgba(255,215,0,0.3); }
.sheet-content { background: #1B2735; color: #fff; border: 1px solid rgba(255,255,255,0.1); }
.btn-primary { background: #FFD700; color: #000; }
.tag { background: rgba(255,255,255,0.1); color: #ccc; border: 1px solid transparent; }
.tag.active { background: #FFD700; color: #000; border-color: #FFD700; box-shadow: 0 0 15px rgba(255, 215, 0, 0.2); }

/* 转盘 */
.gx-container { width: 300px; height: 300px; margin: 20px auto; position: relative; z-index:1; }
.gx-ring { position: absolute; inset: -15px; border-radius: 50%; border: 2px dashed rgba(255,215,0,0.3); animation: spin 40s linear infinite; pointer-events: none; }
@keyframes spin { to { transform: rotate(360deg); } }
.gx-wheel { width: 100%; height: 100%; border-radius: 50%; overflow: hidden; border: 4px solid #FFD700; background: radial-gradient(#233342, #111); transform: rotate(0deg); transition: transform 4s cubic-bezier(0.1, 0.9, 0.2, 1); }
.gx-pointer { position: absolute; top: -25px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 35px solid #FFD700; z-index: 20; }
.gx-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 70px; height: 70px; border-radius: 50%; background: #FFD700; display: flex; align-items: center; justify-content: center; color: #333; font-weight: 900; font-size: 18px; border: 4px solid #FFF; cursor: pointer; z-index: 30; }