/* 奇趣社区：奇趣蓝 × 荧光青 × 暖橙，借鉴社区信息架构但保持独立品牌 */
:root {
	--x-bg: #f3f7ff;
	--x-surface: #ffffff;
	--x-ink: #1d3150;
	--x-muted: #8492a8;
	--x-line: #e6edf8;
	--x-mint: #2fd4d0;
	--x-mint-dark: #247ad8;
	--x-orange: #7ccff0;
	--x-shadow: 0 2px 12px rgba(32, 55, 51, .055);
	--x-radius: 12px;
}
page, uni-page-body { background: linear-gradient(180deg, #A8D8F0 0, #E3F2FD 240px, #ffffff 520px) !important; color: var(--x-ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; }
.simple-blue, .simple-pink, .simple-orange, .simple-green, .full-blue, .full-pink, .full-orange, .full-green { background: var(--x-bg) !important; color: var(--x-ink); }
.header { position: relative; z-index: 20; }
/* 顶栏钉死在屏幕最上面：旧包会给 .header 算 CustomBar（状态栏模拟）高度/内边距，
   真机上顶栏会悬在半空、上面还漏一条空白。统一压成 46px 实心条，贴 top:0。 */
.header { top: 0 !important; height: 46px !important; overflow: visible; }
.header .cu-bar, .header .cu-bar.bg-white { background: var(--x-surface) !important; box-shadow: 0 1px 0 var(--x-line) !important; height: 46px !important; padding-top: 0 !important; }
.square-box.cur::after { bottom: -8px; }
.home-header-sort { padding-left: 16px; display: flex; align-items: center; gap: 20px; }
.square-box { margin: 0 !important; color: #747c7b; font-size: 16px; font-weight: 600; line-height: 1; }
.square-box.cur { color: var(--x-ink); font-size: 20px; font-weight: 800; position: relative; }
.square-box.cur::after { content: ""; position: absolute; left: 50%; bottom: -12px; width: 18px; height: 3px; border-radius: 2px; background: var(--x-mint); transform: translateX(-50%); }
.header .action.header-btn { display: flex; align-items: center; gap: 10px; padding-right: 14px; color: var(--x-mint-dark) !important; }
/* 旧版曾用 ::before/::after 伪造搜索框和登录按钮，与真实头部元素重复（双搜索框/双登录），已删除 */
.header .header-btn .cuIcon-search { display: none; }
.header.startHome .square-box, .header.startHome .square-box.cur, .header.startHome .action { color: var(--x-ink); }
.qiqu-hero { position: relative; height: 172px; margin: 10px 12px 0; margin-top: 58px; overflow: hidden; border-radius: 18px; background: linear-gradient(125deg, #85cbe9, #c9eafa 54%, #f8fcff); box-shadow: 0 8px 22px rgba(73, 150, 192, .18); }
/* 旧包 .header 是 fixed 定位，注入的 hero 会被压在头部下面，必须留出头部高度 */
.qiqu-hero::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 18% 24%, rgba(255,255,255,.55) 0 3px, transparent 4px), radial-gradient(circle at 42% 76%, rgba(255,255,255,.45) 0 2px, transparent 3px); background-size: 46px 46px, 64px 64px; pointer-events: none; }
.qiqu-hero-copy { position: absolute; z-index: 2; left: 16px; top: 42px; width: 56%; }
.qiqu-hero-card { display: flex; flex-direction: column; gap: 7px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.68); border-radius: 14px; background: rgba(255,255,255,.42); box-shadow: 0 4px 14px rgba(61,126,163,.12); backdrop-filter: blur(8px); }
.qiqu-hero-eyebrow { color: rgba(25,76,110,.82); font-size: 11px; font-weight: 700; }
.qiqu-hero-title { color: #ffffff; font-size: 20px; line-height: 1.25; font-weight: 800; text-shadow: 0 1px 4px rgba(28,98,136,.28); }
.qiqu-hero-girl { position: absolute; z-index: 1; right: -14px; bottom: -10px; width: 52%; height: 112%; object-fit: contain; object-position: center bottom; filter: drop-shadow(0 8px 10px rgba(45,108,145,.2)); }
.screen-swiper { height: 172px !important; margin: 10px 12px 0; border-radius: var(--x-radius); overflow: hidden; background: var(--x-surface); box-shadow: var(--x-shadow); }
.screen-swiper .swiper-item-bg, .screen-swiper .swiper-box { border-radius: var(--x-radius); }
.index-sort { padding: 12px 12px 2px !important; gap: 8px !important; background: transparent !important; }
.index-sort-box { background: var(--x-surface) !important; border: 1px solid var(--x-line) !important; border-radius: 14px !important; box-shadow: var(--x-shadow); }
.index-sort-main { padding: 12px 2px !important; }
.index-sort-i { width: 38px !important; height: 38px !important; line-height: 38px !important; border-radius: 12px !important; }
.index-sort-text { color: #434a49; font-size: 12px; font-weight: 500; }
.data-box { margin: 12px !important; }
.data-box > .cu-bar { min-height: 46px; padding: 0 12px !important; background: var(--x-surface) !important; border-radius: var(--x-radius) var(--x-radius) 0 0; }
.data-box-title { color: var(--x-ink) !important; font-size: 15px; font-weight: 800; }
.data-box-title .cuIcon-titles { color: var(--x-orange) !important; }
.more { color: #a0a7a6 !important; font-size: 12px; }
.topic, .all-box { background: transparent !important; }
.topic-box, .article-item, .articleItem, .comment-item, .comment, .shop-item, .shop-item-main { border-radius: var(--x-radius) !important; background: var(--x-surface) !important; border: 0 !important; box-shadow: var(--x-shadow); overflow: hidden; }
.topic-box { margin-bottom: 8px; }
.square-list { margin: 0 12px; }
.cu-card.dynamic .content-list-box { margin: 10px 0 !important; padding: 14px 12px 8px !important; border-radius: var(--x-radius) !important; background: var(--x-surface) !important; border: 0 !important; box-shadow: var(--x-shadow); }
.cu-card.dynamic .menu-avatar { background: transparent !important; border: 0 !important; box-shadow: none !important; }
.square-data-type { display: flex; gap: 18px; padding: 12px 18px 4px; color: var(--x-muted); font-size: 12px; }
.square-data-type .cur { color: var(--x-mint-dark); font-weight: 700; }
.cu-tag { border-radius: 6px !important; background: #e8f1ff !important; color: var(--x-mint-dark) !important; }
.discover-hero { position: relative; height: 132px; margin: 10px 12px 2px; margin-top: 58px; overflow: hidden; border-radius: 18px; box-shadow: 0 8px 20px rgba(77, 150, 190, .14); }
.discover-hero image { width: 100%; height: 100%; }
.discover-hero-card { position: absolute; left: 14px; top: 36px; display: flex; flex-direction: column; gap: 4px; padding: 9px 12px; border-radius: 12px; background: rgba(255,255,255,.48); color: #255a82; font-size: 11px; font-weight: 700; backdrop-filter: blur(6px); }
.discover-hero-card text:first-child { color: #1c6eaa; font-size: 16px; font-weight: 800; }
.user-tab-page { position: relative; min-height: 100vh; background: linear-gradient(180deg, #A8D8F0 0, #E3F2FD 300px, #fff 560px) !important; }
.qiqu-profile-root { min-height: 100vh; background: linear-gradient(180deg, rgba(168,216,240,.7), rgba(227,242,253,.8) 300px, #fff 560px) !important; }
.qiqu-profile-root::before { content: ""; position: absolute; z-index: 0; inset: 0 0 auto; height: 220px; background: url('/h5/static/theme/profile-bg.png') center top / cover no-repeat; opacity: .36; pointer-events: none; }
.qiqu-profile-root > * { position: relative; z-index: 1; }
.profile-sky-art { position: absolute; z-index: 0; top: 0; right: 0; left: 0; height: 210px; overflow: hidden; opacity: .42; pointer-events: none; }
.profile-sky-art image { width: 100%; height: 100%; }
.user-tab-page > :not(.profile-sky-art) { position: relative; z-index: 1; }
.tool-sort .index-sort-i, .user-tab-page .index-sort-i { background: linear-gradient(145deg, #9fdcf2, #4b9fe0) !important; color: #fff !important; box-shadow: 0 4px 10px rgba(65,145,205,.16); }
.tool-sort .index-sort-i text, .user-tab-page .index-sort-i text { color: #fff !important; }
.empty-state-art { display: block; width: 130px; height: 130px; margin: 0 auto 4px; }
.no-data.article-empty { display: flex; flex-direction: column; align-items: center; padding: 18px 16px 28px; }
.loading-main image, .dataLoad image { width: 76px !important; height: 76px !important; object-fit: contain; }
.no-data:not(:has(.empty-state-art))::before { content: ""; display: block; width: 110px; height: 110px; margin: 0 auto 4px; background: url('/h5/static/theme/empty-state.png') center / contain no-repeat; }
.cu-list, .cu-list.menu, .cu-list.menu-avatar, .cu-form-group, .cu-bar.search, .searchBox, .search-box { background: var(--x-surface) !important; border: 0 !important; border-radius: var(--x-radius) !important; box-shadow: var(--x-shadow); }
.search-form { background: #f4f5f5 !important; border: 0 !important; border-radius: 18px !important; }
.text-blue, .text-rule { color: var(--x-mint-dark) !important; }
.bg-blue, .cu-btn.bg-blue, .cu-btn.bg-gradual-blue { background: var(--x-mint) !important; border: 0 !important; border-radius: 20px !important; box-shadow: none !important; }
.tabbar { height: 64px !important; background: rgba(255,255,255,.98) !important; border-top: 1px solid var(--x-line) !important; box-shadow: 0 -3px 14px rgba(35,55,52,.06); z-index: 30 !important; }
.tabbar-item { height: 64px !important; background: transparent !important; }
.tabbar-item-ico { padding-top: 8px; font-size: 23px !important; line-height: 26px !important; color: #737b79; }
.tabbar-item-ico .iconfont { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; color: #79bfe3; font-size: 22px; }
.tabbar-item-ico.tabbarActive .iconfont { color: #fff; border-radius: 12px; background: linear-gradient(145deg, #a8d8f0, #4b9fe0); box-shadow: 0 4px 10px rgba(75,159,224,.24); }
.tabbar-item .item-name { color: #737b79; font-size: 11px; }
.tabbarActive { color: var(--x-mint-dark) !important; font-weight: 700; }
/* === 底部“+”悬浮按钮：固定正圆，禁止拉伸 === */
.tabbar-item.addPost { width: 60px !important; height: 64px !important; }
.tabbar-item.addPost .addPost-main { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -58%); width: 56px; height: 56px; padding: 0; border: 0; border-radius: 50%; background: transparent !important; box-shadow: none !important; }
.addPost-i { width: 56px !important; height: 56px !important; border-radius: 50% !important; display: flex !important; align-items: center; justify-content: center; font-size: 30px; line-height: 1; font-weight: 700; background: linear-gradient(145deg, var(--x-mint), var(--x-mint-dark)) !important; box-shadow: 0 6px 16px rgba(47,153,214,.28); transition: transform .3s ease; }
/* 展开态：加号旋转 45° 变 ×（class 由 theme-loader.js 监听菜单 .show 同步） */
.tabbar-item.addPost.qiqu-fab-open .addPost-i { transform: rotate(45deg); }
/* === 展开菜单：文章/动态/商品 三张卡片（图标+文字上下布局） ===
   注意：卡片尺寸规则必须限定在 .tabbar-operate 内，否则会泄漏到
   首页快捷入口/发现页工具库/我的页网格，把 4 列卡片挤成 3+1 换行 */
.tabbar-operate { padding: 0 8px !important; }
.tabbar-operate-bg.show { background: rgba(28,41,39,.25) !important; backdrop-filter: blur(4px); }
.tabbar-operate-main { display: flex !important; flex-direction: row; justify-content: center; align-items: flex-start; gap: 10px; width: auto !important; height: auto !important; margin: 0 auto; padding: 14px 12px; background: var(--x-surface); border: 0; border-radius: 18px; box-shadow: 0 -8px 22px rgba(35,55,52,.1), 0 10px 28px rgba(35,55,52,.12); }
.tabbar-operate-main.grid, .tabbar-operate-main.col-3 { display: flex !important; }
.tabbar-operate-main > view { width: auto !important; float: none !important; }
.tabbar-operate .index-sort-box { width: 110px !important; height: 90px !important; background: #fff !important; border: 1px solid var(--x-line); border-radius: 16px; box-shadow: var(--x-shadow); display: flex; align-items: center; justify-content: center; transition: transform .25s ease, box-shadow .25s ease; }
.tabbar-operate .index-sort-box:active { transform: translateY(1px) scale(.98); }
.index-sort-main { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 0 !important; width: auto !important; }
.index-sort-i { width: 40px !important; height: 40px !important; line-height: 40px !important; border-radius: 50% !important; display: flex !important; align-items: center; justify-content: center; background: linear-gradient(145deg, #9fdcf2, #4b9fe0) !important; box-shadow: 0 4px 10px rgba(65,145,205,.16); }
.index-sort-i text { color: #fff !important; font-size: 20px; }
.index-sort-text { width: auto !important; max-width: 100%; font-size: 14px !important; letter-spacing: normal !important; line-height: 1.2; color: var(--x-ink); text-align: center; font-weight: 600; }
/* 页面网格卡片：留出 gap 后每列 (25% - 6px)，保证 4 张卡一行放得下 */
.index-sort.grid .index-sort-box { width: calc(25% - 6px) !important; height: auto !important; }
/* 文章排行榜三张卡：统一奇趣蓝（旧包是蓝/绿/粉三色杂烩） */
.topList .topList-main { background: #e8f4fd !important; color: #1c6eaa !important; border-radius: 14px !important; }
/* 广场「我要发布」按钮：橙红改品牌蓝渐变 */
.cu-btn.bg-gradual-orange { background: linear-gradient(145deg, var(--x-mint), var(--x-mint-dark)) !important; color: #fff !important; border-radius: 20px !important; }
/* 发布器四个入口图标统一品牌色（旧包绿/紫/蓝/红杂色） */
.square-post-btn .text-green, .square-post-btn .text-purple, .square-post-btn .text-blue, .square-post-btn .text-red { color: var(--x-mint-dark) !important; }
/* 底部留白：避免悬浮"+"按钮盖住最后一行内容（空态文字/账户和设置等） */
uni-page-body::after { content: ""; display: block; height: 84px; }
.no-data { padding-bottom: 8px; }
.no-data, .dataLoad, .load-more { color: var(--x-muted); }
@media (max-width: 480px) { .home-header-sort { gap: 16px; padding-left: 12px; } .screen-swiper { height: 156px !important; margin-top: 8px; } }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }