/*
Theme Name: FoodWheelPicker
Theme URI: https://example.com/foodwheelpicker
Author: Your Name
Author URI: https://example.com
Description: A WordPress theme for food wheel picker - helping users decide what to eat with a fun spinning wheel interface.
Version: 1.0.0
Requires at least: 5.0
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: foodwheelpicker
*/

/* ===================================
   Theme Styles
   =================================== */

/* Reset & Base */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* =============================================
   FoodWheelPicker - 通用样式 (Neo-Pop 风)
   ============================================= */

/* 自定义过渡动画 */
.pop-transition {
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.pop-transition:active {
    transform: translate(4px, 4px);
    box-shadow: 2px 2px 0px 0px rgba(45,52,54,1);
}

/* 转盘容器样式 */
.wheel-container {
    position: relative;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
}

canvas {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 8px solid #2D3436;
    box-shadow: 12px 12px 0px 0px rgba(45,52,54,1);
    transition: transform cubic-bezier(0.17, 0.67, 0.12, 0.99);
}

/* 转盘指针 */
.wheel-pointer {
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 40px solid #FF6B6B;
    z-index: 10;
    filter: drop-shadow(0px 4px 0px rgba(45,52,54,1));
}

/* 背景装饰点阵 */
.bg-dots {
    background-image: radial-gradient(#2D3436 2px, transparent 2px);
    background-size: 30px 30px;
    opacity: 0.05;
}