/* Brand palette inspired by screenshot */
:root{
	--brand-primary:#2B6EF6;       /* 主色：活力蓝 */
	--brand-secondary:#11C5D8;     /* 辅色：清新青 */
	--brand-yellow:#FFD86B;        /* 辅助：柔和黄 */
	--brand-warm:#FF8A65;          /* 渐变暖橙 */
	--brand-rose:#FF7AA2;          /* 渐变粉 */
}

/* Header gradient similar to screenshot banner */
.app-hero{ 
	background: linear-gradient(135deg, var(--brand-secondary) 0%, var(--brand-yellow) 42%, var(--brand-warm) 78%, var(--brand-rose) 100%);
	color:#fff;
}

/* Brand helpers */
.bg-brand{ background-color: var(--brand-primary); }
.text-brand{ color: var(--brand-primary); }
.border-brand{ border-color: var(--brand-primary); }

/* Soft card look */
.card{
	background:#fff;
	border:1px solid rgba(0,0,0,0.04);
	box-shadow: 0 4px 16px rgba(0,0,0,0.04);
	border-radius: 16px;
}

/* Tabbar active tint */
.tab-active{ color: var(--brand-primary); }

/* Pastel icon container */
.icon-soft{
	width: 3rem; height: 3rem; border-radius: 12px;
	display:flex; align-items:center; justify-content:center;
	background: linear-gradient(180deg, rgba(43,110,246,0.12), rgba(17,197,216,0.08));
	color: var(--brand-primary);
}

/* Chip badge */
.badge-soft{ font-size:12px; padding:2px 8px; border-radius:12px; background:rgba(43,110,246,0.1); color:var(--brand-primary); }

/* Bottom tab bar - five equal items */
.tabbar-5{ display:grid; grid-template-columns:repeat(5,1fr); align-items:end; gap:0; }
.tabbar{ z-index:30; }
.has-tabbar{ padding-bottom:96px; }
.tab-item{ display:flex; flex-direction:column; align-items:center; padding:0.25rem 0; color:#9CA3AF; }
.tab-item .label{ font-size:12px; }
.tab-item.active{ color:var(--brand-primary); }

/* Center AI button */
.ai-fab{ width:64px; height:64px; border-radius:9999px; background:linear-gradient(135deg, var(--brand-primary), var(--brand-secondary)); color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 24px rgba(43,110,246,0.35); transform:translateY(-22px); border:6px solid #fff; position:relative; z-index:50; }
.ai-fab i{ font-size:22px; }

/* AI bottom sheet */
.ai-sheet{ position:fixed; left:0; right:0; bottom:0; background:#fff; border-top-left-radius:20px; border-top-right-radius:20px; box-shadow:0 -10px 30px rgba(0,0,0,0.08); padding:16px; z-index:60; }
.ai-sheet-header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.ai-input{ display:flex; gap:8px; }
.ai-input input{ flex:1; border:1px solid #E5E7EB; border-radius:12px; padding:10px 12px; font-size:14px; }
.ai-input button{ background:var(--brand-primary); color:#fff; padding:10px 14px; border-radius:12px; font-size:14px; }