/* ============================================
   base.css - 全局基础样式 + CSS 变量
   粉色主题 · 移动端优先
   ============================================ */

:root {
    /* 主色调 - 粉色系 */
    --primary:        #FF6B9D;
    --primary-light:  #FFC0D9;
    --primary-dark:   #E91E63;
    --primary-bg:     #FFF0F5;

    /* 辅助色 */
    --success:        #4ECDC4;
    --success-light:  #B8F2EE;
    --danger:         #FF6B6B;
    --danger-light:   #FFD0D0;
    --warning:        #FFD93D;

    /* 中性色 */
    --bg:             #FFF5F8;
    --card-bg:        #FFFFFF;
    --text-primary:   #2D1B3D;
    --text-secondary: #8B7D8B;
    --text-light:     #C4B4C4;
    --border:         #FFE0EC;

    /* 渐变 */
    --gradient-primary: linear-gradient(135deg, #FF6B9D 0%, #FFC0D9 100%);
    --gradient-bg:      linear-gradient(180deg, #FFF5F8 0%, #FFFFFF 100%);
    --gradient-success: linear-gradient(135deg, #4ECDC4 0%, #B8F2EE 100%);

    /* 阴影 */
    --shadow-sm:  0 2px 8px rgba(255, 107, 157, 0.08);
    --shadow-md:  0 4px 16px rgba(255, 107, 157, 0.12);
    --shadow-lg:  0 8px 32px rgba(255, 107, 157, 0.16);

    /* 圆角 */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 20px;

    /* 响应式宽度 */
    --content-max: 420px;
}

/* Reset */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC',
                 'Helvetica Neue', 'Microsoft YaHei', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: var(--text-primary);
    background: var(--gradient-bg);
    min-height: 100vh;
    -webkit-touch-callout: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
}

/* 允许输入框选中文本 */
input, textarea {
    user-select: text;
    -webkit-user-select: text;
}

a {
    color: var(--primary);
    text-decoration: none;
}

img { max-width: 100%; }

/* 滚动条 */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-thumb { background: var(--primary-light); border-radius: 2px; }

/* App 容器 */
.app-container {
    max-width: var(--content-max);
    margin: 0 auto;
    min-height: 100vh;
    position: relative;
}

/* 文字工具类 */
.text-center { text-align: center; }
.text-muted { color: var(--text-secondary); }
.text-danger { color: var(--danger); }
.text-success { color: var(--success); }

/* 提示框 */
.alert {
    padding: 10px 14px;
    border-radius: var(--radius-sm);
    font-size: 14px;
    margin-bottom: 12px;
}
.alert-error {
    background: var(--danger-light);
    color: var(--danger);
}
.alert-success {
    background: var(--success-light);
    color: #2A9D8F;
}
.alert-info {
    background: var(--primary-bg);
    color: var(--primary-dark);
}

/* 加载提示 */
.loading-tip {
    text-align: center;
    padding: 40px 0;
    color: var(--text-light);
    font-size: 14px;
}

/* 空状态 */
.empty-state {
    text-align: center;
    padding: 60px 20px;
    color: var(--text-light);
}
.empty-state-icon {
    font-size: 48px;
    margin-bottom: 12px;
}
