/* ============ 共享头部样式 ============ */
@font-face{
	font-family:'Nucleo'; font-style:normal; font-weight:700; font-display:swap;
	src:url(../fonts/Nucleo.ttf) format('truetype');
}
@font-face{
	font-family:'Disorient'; font-style:normal; font-weight:normal; font-display:swap;
	src:url(../fonts/Disorient.ttf) format('truetype');
}
.site-header{
	position:fixed; top:0; left:0; right:0; z-index:100;
	background-color:rgba(255,255,255,0.85);
	background-image:url(../images/bg-global.webp);
	background-repeat:no-repeat;
	background-position:center top;
	background-size:cover;
	background-attachment:fixed;
	backdrop-filter:blur(10px);
	-webkit-backdrop-filter:blur(10px);
	border-bottom:1px solid var(--border);
}
.site-header-spacer{ width:100%; }
.header-top{
	display:flex; align-items:center; gap:10px; flex-wrap:wrap;
	padding:10px 14px;
	padding-top:calc(10px + env(safe-area-inset-top));
}
.brand{ display:flex; align-items:center; gap:8px; flex-shrink:0; }
.brand img{ height:30px; width:auto; }
.brand-name{ font-family:'Nucleo','Disorient',Arial,Helvetica,sans-serif; font-size:14px; font-weight:700; color:var(--text-dark); letter-spacing:.5px; white-space:nowrap; display:inline-block; }
.brand-name > span{ display:inline-block; animation:aiWave 5.8s ease-in-out infinite; }
.brand-name > span:nth-child(1){ animation-delay:0s; }
.brand-name > span:nth-child(2){ animation-delay:.15s; }
@keyframes aiWave{
	0%,100%{ transform:translateY(0); }
	6%{ transform:translateY(-3px); }
	14%{ transform:translateY(0); }
}
.header-actions{ display:flex; align-items:center; gap:6px; flex-shrink:0; order:0; margin-left:auto; }
.icon-btn{
	width:38px; height:38px; border-radius:50%;
	display:flex; align-items:center; justify-content:center;
	background:var(--body-bg); border:1px solid var(--border); cursor:pointer;
	font-size:1.0rem; color:var(--text-dark);
}
.icon-btn.active{ background:var(--primary); color:#fff; border-color:var(--primary); }

/* 顶部信息条（移动端同一行：天气在前 / 日期在后；PC 端天气在左、日期居中） */
.header-info-row{
	display:flex; align-items:center; gap:14px;
	flex:1 1 100%; min-width:0; order:1;
}
.header-date, .header-weather{
	display:flex; align-items:center; gap:6px;
	flex:0 0 auto;
	font-size:11px; color:var(--text-gray);
	min-width:0;
}
.header-date .info-item, .header-weather .info-item{ display:flex; align-items:center; gap:6px; white-space:nowrap; }
.header-date .info-item svg, .header-weather .info-item svg{ width:15px; height:15px; flex-shrink:0; }
#hdr-lunar{ opacity:.68; font-size:.92em; margin-left:4px; white-space:nowrap; }
.header-date .info-primary, .header-weather .info-primary{ color:var(--text-gray); font-weight:400; }

/* ============ 会员登录链接 ============ */
.header-actions{ display:flex; align-items:center; gap:6px; flex-shrink:0; order:0; margin-left:auto; }
.member-login-btn{
	height:auto; line-height:1; padding:0; border:none; border-radius:0;
	background:transparent; color:var(--primary); font-size:13px; cursor:pointer;
	display:inline-flex; align-items:center; gap:5px;
	text-decoration:none; white-space:nowrap; transition:all .15s;
}
.member-login-btn:hover{ opacity:.85; color:var(--primary); text-decoration:underline; }
.member-login-btn.member-logged{ background:transparent; color:var(--text-dark); border:none; }
.member-login-btn.member-logged:hover{ color:var(--primary); border:none; }
.member-login-sep{ color:#d1d5db; font-size:12px; line-height:1; }
.member-logout-btn{
	height:auto; line-height:1; padding:0; border:none; border-radius:0;
	background:transparent; color:#9ca3af; font-size:13px; cursor:pointer;
	display:inline-flex; align-items:center;
	text-decoration:none; white-space:nowrap; transition:all .15s;
}
.member-logout-btn:hover{ color:#e74c3c; text-decoration:underline; }

/* ============ 会员弹窗 ============ */
.member-modal-overlay{
	position:fixed; inset:0; background:rgba(0,0,0,0.5);
	z-index:300; display:flex; align-items:center; justify-content:center;
}
.member-modal-box{
	width:380px; max-width:92vw; max-height:88vh; overflow-y:auto;
	background:#fff; border-radius:12px; box-shadow:0 16px 48px rgba(0,0,0,0.18);
}
.member-modal-head{
	display:flex; align-items:center; justify-content:space-between;
	padding:14px 18px; border-bottom:1px solid var(--border);
}
.member-modal-head h5{ margin:0; font-size:15px; color:var(--text-dark); }
.member-modal-close{
	border:none; background:none; font-size:20px; line-height:1; cursor:pointer;
	color:var(--text-gray); padding:2px 6px;
}
.member-modal-close:hover{ color:var(--text-dark); }
.member-modal-body{ padding:16px 18px 20px; }
.member-tabs{
	display:flex; gap:8px; margin-bottom:16px;
	border-bottom:1px solid var(--border); padding-bottom:10px;
}
.member-tab{
	font-size:13px; color:var(--text-gray); cursor:pointer; padding:4px 2px;
	border-bottom:2px solid transparent; transition:all .15s;
}
.member-tab.active{ color:var(--primary); border-bottom-color:var(--primary); font-weight:600; }
.member-login-mode{
	display:flex; gap:8px; margin-bottom:12px;
	border-bottom:1px solid var(--border); padding-bottom:10px;
}
.member-mode-tab{
	font-size:12px; color:var(--text-gray); cursor:pointer; padding:4px 2px;
	border-bottom:2px solid transparent; transition:all .15s;
}
.member-mode-tab.active{ color:var(--primary); border-bottom-color:var(--primary); font-weight:600; }
.member-form-group{ margin-bottom:12px; }
.member-form-group label{
	display:block; font-size:12px; color:var(--text-gray); margin-bottom:5px;
}
.member-form-group input{
	width:100%; height:34px; padding:0 10px; box-sizing:border-box;
	border:1px solid var(--border); border-radius:6px; font-size:13px; color:var(--text-dark);
	outline:none; transition:border-color .15s;
}
.member-form-group input:focus{ border-color:var(--primary); }
.member-code-row{ display:flex; gap:8px; }
.member-code-row input{ flex:1; min-width:0; }
.member-code-btn{
	height:34px; padding:0 12px; flex-shrink:0; white-space:nowrap;
	border:1px solid var(--primary); border-radius:6px; background:var(--primary-light);
	color:var(--primary); font-size:12px; cursor:pointer; transition:all .15s;
}
.member-code-btn:hover{ background:var(--primary); color:#fff; }
.member-code-btn:disabled{ opacity:.55; cursor:not-allowed; }
.member-pwd-row{ display:flex; gap:8px; }
.member-pwd-row input{ flex:1; min-width:0; }
.member-gen-btn{
	height:34px; padding:0 12px; flex-shrink:0; white-space:nowrap;
	border:1px solid var(--border); border-radius:6px; background:var(--body-bg);
	color:var(--text-gray); font-size:12px; cursor:pointer; transition:all .15s;
}
.member-gen-btn:hover{ color:var(--primary); border-color:var(--primary); }
.member-submit-btn{
	width:100%; height:38px; margin-top:6px;
	border:none; border-radius:6px; background:var(--primary); color:#fff;
	font-size:14px; cursor:pointer; transition:all .15s;
}
.member-submit-btn:hover{ opacity:.88; }
.member-form-divider{
	display:flex; align-items:center; gap:10px; margin:14px 0 12px;
	font-size:11px; color:var(--text-light);
}
.member-form-divider::before, .member-form-divider::after{
	content:""; flex:1; height:1px; background:var(--border);
}
.member-form-tip{ margin-top:10px; font-size:11px; color:var(--text-light); text-align:center; }
.member-warn-tip{
	margin:4px 0 10px; padding:8px 10px; border-radius:6px;
	background:#fff7e6; border:1px solid #ffe7ba;
	font-size:11px; color:#b8860b; line-height:1.6;
}

/* ============ 移动端抽屉菜单 ============ */
.drawer-mask{
	position:fixed; inset:0; background:rgba(0,0,0,0.45);
	z-index:200; opacity:0; visibility:hidden; transition:all .25s ease;
}
.drawer-mask.show{ opacity:1; visibility:visible; }
.drawer{
	position:fixed; top:0; left:0; bottom:0; width:280px; max-width:82vw;
	background:#fff; z-index:201;
	transform:translateX(-100%); transition:transform .28s cubic-bezier(0.22,1,0.36,1);
	display:flex; flex-direction:column;
	box-shadow:4px 0 24px rgba(0,0,0,0.12);
}
.drawer.show{ transform:translateX(0); }
.drawer-head{
	display:flex; align-items:center; justify-content:space-between;
	padding:16px 16px 12px; border-bottom:1px solid var(--border);
}
.drawer-head .brand{ gap:7px; }
.drawer-head .brand-name{ font-size:13px; }
.drawer-scroll{ flex:1; overflow-y:auto; padding:8px 0 24px; }
.menu-group{ padding:10px 0 4px; }
.menu-group-title{
	padding:4px 20px 8px; font-size:11px; color:var(--text-light);
	text-transform:uppercase; letter-spacing:.5px; font-weight:600;
}
.menu-item{ display:block; }
.menu-item > a{
	display:flex; align-items:center; gap:10px;
	padding:11px 20px; font-size:14px; color:var(--text-dark);
	transition:background .15s;
}
.menu-item > a:active{ background:var(--primary-light); }
.menu-item > a .mi{ width:20px; text-align:center; font-size:15px; flex-shrink:0; }
.menu-item > a .arrow{ margin-left:auto; font-size:12px; color:var(--text-light); transition:transform .2s; }
.menu-item.open > a .arrow{ transform:rotate(90deg); }
.menu-sub{ display:none; background:var(--body-bg); }
.menu-item.open .menu-sub{ display:block; }
.menu-sub a{
	display:block; padding:9px 20px 9px 50px; font-size:13px; color:var(--text-gray);
}
.menu-sub a:active{ color:var(--primary); }

/* 桌面端横向菜单 */
.desktop-nav{
	display:none;
	background:rgba(255,255,255,0.6);
	border-bottom:1px solid var(--border);
	overflow-x:auto; scrollbar-width:none;
}
.desktop-nav::-webkit-scrollbar{ display:none; }
.desktop-nav ul{ display:flex; align-items:center; justify-content:center; gap:4px; padding:6px 14px; white-space:nowrap; list-style:none; }
.desktop-nav li{ position:relative; }
.desktop-nav ul ul{ list-style:none; }
.desktop-nav a{
	display:block; padding:8px 12px; font-size:13px; color:var(--text-gray);
	border-radius:8px; transition:all .15s;
}
.desktop-nav a:hover, .desktop-nav a.current{ color:var(--primary); background:var(--primary-light); }
.nav-ico{ width:16px; height:16px; vertical-align:-3px; flex-shrink:0; color:#ff7b00; }
.desktop-nav .nav-ico{ margin-right:5px; }
.nav-chart{
	display:inline-flex; align-items:flex-end; gap:2px;
	height:12px; margin-right:5px; vertical-align:middle;
}
.nav-chart i{
	display:block; width:3px; border-radius:1px;
	background:var(--primary);
	animation:chartBounce 1s ease-in-out infinite;
}
.nav-chart i:nth-child(1){ height:60%; animation-delay:0s; }
.nav-chart i:nth-child(2){ height:100%; animation-delay:.15s; }
.nav-chart i:nth-child(3){ height:80%; animation-delay:.3s; }
@keyframes chartBounce{
	0%,100%{ transform:scaleY(1); }
	50%{ transform:scaleY(.55); }
}
.nav-hot{
	display:inline-flex; align-items:center; margin-right:5px;
	vertical-align:middle; color:var(--primary);
	font-size:8px; font-weight:400; letter-spacing:0; text-transform:uppercase;
}
.nav-hot b{
	display:inline-block; animation:hotRipple 1s ease-in-out infinite;
}
.nav-hot b:nth-child(1){ animation-delay:0s; }
.nav-hot b:nth-child(2){ animation-delay:.18s; }
.nav-hot b:nth-child(3){ animation-delay:.36s; }
@keyframes hotRipple{
	0%,100%{ transform:translateY(0); }
	50%{ transform:translateY(-1px); }
}
.desktop-nav .has-sub:hover .desktop-sub{ display:block; }
.desktop-sub{
	display:none; position:absolute; top:100%; left:0; min-width:160px;
	background:#fff; border:1px solid var(--border); border-radius:10px;
	box-shadow:0 12px 30px rgba(0,0,0,0.1); padding:6px; z-index:50;
}
.desktop-sub a{ padding:8px 14px; font-size:13px; }
.desktop-sub a:hover{ background:var(--primary-light); color:var(--primary); }

/* ============ 桌面端适配 ============ */
@media (min-width: 768px){
	.header-top{ position:relative; padding:12px 24px; }
	.header-top .brand{ position:absolute; left:50%; transform:translateX(-50%); }
	.header-info-row{ flex:1; min-width:0; order:0; }
	.header-date{ flex:0 0 auto; padding:0; border-top:none; font-size:12px; }
	.header-weather{ flex:0 0 auto; padding:0; border-top:none; font-size:12px; }
	.header-actions{ order:0; margin-left:auto; }
	.icon-btn.menu-toggle{ display:none; }
	.desktop-nav{ display:block; }
}