/* ========== 全局拟态样式 ========== */
:root {
    --bg: #e8ecf1;
    --card-bg: #ffffff;
    --text: #333;
    --text-light: #666;
    --gold: #d4af37;
    --shadow-dark: #b8bcc4;
    --shadow-light: #ffffff;
    --topbar-bg: #e8ecf1;
    --bottombar-bg: #e8ecf1;
}

/* ========== 默认（亮色）主题变量 ========== */
:root,
[data-theme="light"] {
    --bg: #e8ecf1;
    --card-bg: #ffffff;
    --text: #333333;
    --text-light: #777777;
    --gold: #d4af37;
    --shadow-dark: #b8bcc4;
    --shadow-light: #ffffff;
}

/* 暗色主题 */
[data-theme="dark"] {
    --bg: #1a1a2e;
    --card-bg: #2d2d44;
    --text: #e0e0e0;
    --text-light: #a0a0a0;
    --gold: #d4af37;
    --shadow-dark: #141424;
    --shadow-light: #3a3a5a;
}

body {
    background: var(--bg);
    color: var(--text);
}
/* 拟态卡片 */
.neo-card {
    background: var(--card-bg);
    border-radius: 24px;
    padding: 25px 18px;
    text-align: center;
    cursor: pointer;
    box-shadow: 8px 8px 16px var(--shadow-dark), -8px -8px 16px var(--shadow-light);
    transition: all 0.3s ease;
    position: relative;
}
.neo-card:hover { transform: translateY(-4px); }
.neo-card:active { box-shadow: inset 5px 5px 10px var(--shadow-dark), inset -5px -5px 10px var(--shadow-light); }

/* 拟态输入框 */
.neo-input {
    width: 100%;
    height: 48px;
    padding: 0 16px;
    border: none;
    border-radius: 14px;
    background: var(--input-bg);
    font-size: 14px;
    color: var(--text);
    outline: none;
    box-shadow: inset 3px 3px 6px var(--shadow-dark), inset -3px -3px 6px var(--shadow-light);
    transition: all 0.3s ease;
}
.neo-input:focus {
    box-shadow: inset 1px 1px 2px var(--shadow-dark), inset -1px -1px 2px var(--shadow-light), 0 0 0 3px rgba(212,175,55,0.3);
}

/* 拟态按钮 */
.neo-btn {
    background: linear-gradient(135deg, #d4af37, #b8960f);
    color: #fff;
    border: none;
    border-radius: 14px;
    padding: 12px 24px;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    box-shadow: 6px 6px 12px var(--shadow-dark), -6px -6px 12px var(--shadow-light);
    transition: all 0.3s ease;
    letter-spacing: 1px;
}
.neo-btn:hover { box-shadow: 3px 3px 6px var(--shadow-dark), -3px -3px 6px var(--shadow-light); transform: translateY(-1px); }
.neo-btn:active { box-shadow: inset 3px 3px 5px var(--shadow-dark), inset -3px -3px 5px var(--shadow-light); transform: translateY(0); }

/* 卡片网格 */
.card-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);  /* 强制两列 */
    gap: 16px;
    padding: 16px;
}

/* 卡片图标 */
.card-icon { font-size: 38px; margin-bottom: 10px; display: inline-block; }
.card-title { font-size: 16px; font-weight: 600; margin-bottom: 4px; color: var(--text); }
.card-desc { font-size: 12px; color: var(--text-light); }

/* 角标 */
.card-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: linear-gradient(135deg, #FF6B6B, #ee5a24);
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 12px;
    box-shadow: 0 2px 6px rgba(255,107,107,0.3);
    pointer-events: none;
}

/* 颜色定义 */
.card-icon.orange { color: #FF9F1C; }
.card-icon.green { color: #20c997; }
.card-icon.purple { color: #A855F7; }
.card-icon.red { color: #FF6B6B; }
.card-icon.teal { color: #4ECDC4; }
.card-icon.pink { color: #E84393; }
.card-icon.gold { color: #D4AF37; }