/* ============================================================
   今日吃什么 · 每日做饭抽菜 —— 样式（全站统一视觉）
   入口：../index.html
   设计语言：鲜活橙粉（参照橙粉促销页式样）· 圆润卡片 · 暖色渐变
   ============================================================ */
:root{
  /* 色板（默认主题：鲜活橙粉） */
  --paper:#FDF1EA;
  --card:#FFFDFB;
  --cream:#FBEFE6;
  --surface:#FFFFFF;
  --ink:#3A2A22;
  --ink-2:#8A6F60;
  --ink-3:#B79C8A;
  --line:#F3DCCE;
  --line-2:#E8C4AE;
  --green:#F25D3C;
  --green-2:#E24E55;
  --green-soft:#FFEDE4;
  --green-line:#F7CDB8;
  --tomato:#E24E55;
  --tomato-dark:#C63A45;
  --tomato-soft:#FDE9E5;
  --gold:#E0A63C;
  --gold-deep:#F7EBD0;
  --gold-soft:#FAF0DC;
  --gold-line:#EBD9AC;
  --gold-ink:#8A6413;
  --danger-line:#E8C9BD;
  --danger-soft:#FDF3EF;
  /* 圆角 / 阴影 */
  --radius-sm:12px;
  --radius:16px;
  --radius-lg:22px;
  --shadow:0 1px 2px rgba(242,93,60,.08);
  --shadow-hover:0 8px 22px rgba(242,93,60,.16);
  --shadow-pop:0 10px 28px rgba(226,78,85,.22);
  /* 主题化渐变（供导航/按钮/首页/卡片统一使用，随主题切换） */
  --paper-grad:linear-gradient(172deg,#FDF3EC 0%,#FDEBE0 42%,#FDE8EA 100%);
  --grad-main:linear-gradient(135deg,#FF9A3C 0%,#F25D3C 46%,#EC5E6B 100%);
  --grad-page:linear-gradient(168deg,#FFA44E 0%,#FF8A5C 34%,#F26A6C 68%,#EC5E8C 100%);
  --grad-soft:linear-gradient(135deg,#FFB35C 0%,#F26A6C 100%);
  /* 主题强调色（首页 hero 等主强调文字，随主题主色变化） */
  --accent:#E24E55;
  /* 页面渐变背景上的次级文字（卡外元素） */
  --page-ink2:#FFF3EA;
  /* 导航激活高亮（顶栏渐变上的下划线，各主题亮色系） */
  --nav-line:rgba(255,255,255,.92);
}
/* ===== 主题：暖阳 ===== */
[data-theme="warm"]{
  --paper:#F6EFDD;
  --card:#FFFBF0;
  --cream:#FBF3E2;
  --ink:#3A3126;
  --ink-2:#7C715C;
  --ink-3:#B0A585;
  --line:#E8DCBE;
  --line-2:#D6C69E;
  --green:#4C5B33;
  --green-2:#39472A;
  --green-soft:#EDE9D8;
  --green-line:#D3D5B8;
  --tomato:#D1492B;
  --tomato-dark:#B53A20;
  --tomato-soft:#FBE9E1;
  --gold:#D99E2D;
  --gold-deep:#F7EBD0;
  --gold-soft:#F8EDD2;
  --gold-line:#E8D49C;
  --gold-ink:#8A6413;
  --danger-line:#E8C9BD;
  --danger-soft:#FDF3EF;
  --shadow:0 1px 2px rgba(90,74,40,.08);
  --shadow-hover:0 6px 18px rgba(90,74,40,.14);
  --paper-grad:linear-gradient(172deg,#F9F4E5 0%,#F6EFDD 100%);
  --grad-main:linear-gradient(135deg,#A87F2E 0%,#8F6420 60%,#7E5222 100%);
  --grad-page:linear-gradient(168deg,#A87F2E 0%,#8F6420 55%,#7E5222 100%);
  --grad-soft:linear-gradient(135deg,#B98A30 0%,#8F6420 100%);
  --accent:#4C5B33;
  --page-ink2:#F6EDD6;
  --nav-line:#F2DFAE;
}
/* ===== 主题：玄夜（深色，无绿色系） ===== */
[data-theme="dark"]{
  --paper:#1A1B1E;
  --card:#23252A;
  --cream:#2B2E34;
  --surface:#30333A;
  --ink:#E9EBEE;
  --ink-2:#AEB3BB;
  --ink-3:#7C828C;
  --line:#3A3E46;
  --line-2:#555B65;
  --green:#8FA8CE;
  --green-2:#6E88B0;
  --green-soft:#232B3A;
  --green-line:#3B4A63;
  --tomato:#E26040;
  --tomato-dark:#C94B2E;
  --tomato-soft:#3A241A;
  --gold:#D9B36A;
  --gold-deep:#3A2E17;
  --gold-soft:#3A3220;
  --gold-line:#6A5524;
  --gold-ink:#DDBB72;
  --danger-line:#5C3A30;
  --danger-soft:#33201A;
  --shadow:0 1px 3px rgba(0,0,0,.4);
  --shadow-hover:0 6px 18px rgba(0,0,0,.5);
  --shadow-pop:0 8px 24px rgba(0,0,0,.55);
  --paper-grad:linear-gradient(172deg,#1A1B1E 0%,#202226 100%);
  --grad-main:linear-gradient(135deg,#4A5C7E 0%,#55688C 60%,#5A6A94 100%);
  --grad-page:linear-gradient(168deg,#2A2428 0%,#3A2A30 60%,#45303A 100%);
  --grad-soft:linear-gradient(135deg,#6E88B0 0%,#8FA8CE 100%);
  --accent:#8FA8CE;
  --page-ink2:#AEB3BB;
  --nav-line:#AEC4E2;
}
/* ===== 主题：蔚蓝 ===== */
[data-theme="blue"]{
  --paper:#F0F4F8;
  --card:#FFFFFF;
  --cream:#F4F7FB;
  --ink:#22303C;
  --ink-2:#5E6B7A;
  --ink-3:#93A0AE;
  --line:#DCE4EC;
  --line-2:#C3CFDC;
  --green:#2E6FC2;
  --green-2:#245C9E;
  --green-soft:#E4EEF9;
  --green-line:#C4D8EC;
  --tomato:#D1492B;
  --tomato-dark:#B53A20;
  --tomato-soft:#FBE9E1;
  --gold:#D99E2D;
  --gold-deep:#F7EBD0;
  --gold-soft:#F9EFD9;
  --gold-line:#EBD9AC;
  --gold-ink:#8A6413;
  --danger-line:#E8C9BD;
  --danger-soft:#FDF3EF;
  --shadow:0 1px 2px rgba(46,111,194,.08);
  --shadow-hover:0 6px 18px rgba(46,111,194,.14);
  --paper-grad:linear-gradient(172deg,#F2F6FA 0%,#EDF3F8 100%);
  --grad-main:linear-gradient(135deg,#3A8AC8 0%,#2E6FC2 60%,#245C9E 100%);
  --grad-page:linear-gradient(168deg,#3E7BB8 0%,#2E6FC2 55%,#245C9E 100%);
  --grad-soft:linear-gradient(135deg,#4E8FC9 0%,#2E6FC2 100%);
  --accent:#2E6FC2;
  --page-ink2:#EAF2F9;
  --nav-line:#BFDAF5;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:"Microsoft YaHei","PingFang SC","Noto Sans SC","Source Han Sans SC",sans-serif;background:var(--paper-grad);background-attachment:fixed;color:var(--ink);font-size:15px;line-height:1.65;-webkit-text-size-adjust:100%}
button{font-family:inherit}
h1,h2,h3{margin:0}
::selection{background:var(--green);color:var(--cream)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
/* ===== 顶栏（渐变底 + 白色文字，随主题） ===== */
.app-header{background:var(--grad-main);color:#fff;position:sticky;top:0;z-index:50;box-shadow:0 2px 10px rgba(0,0,0,.12)}
.app-header .inner{max-width:1080px;margin:0 auto;padding:14px 16px 0;position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 16px}
/* 右上角容器：账号区（登录功能）+ 主题快捷切换（登录功能后面），与标题同行右对齐 */
.top-right{margin-left:auto;display:flex;align-items:center;gap:14px;z-index:60}
/* 主题快捷切换（右上角登录功能后面） */
.theme-quick{position:relative}
/* 登录区与主题切换之间的轻分隔线 */
.top-right .theme-quick::before{content:"";position:absolute;left:-8px;top:50%;transform:translateY(-50%);width:1px;height:18px;background:rgba(255,255,255,.32);border-radius:1px}
.theme-quick-btn{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.5);color:#fff;font-size:12.5px;padding:3px 12px;border-radius:999px;cursor:pointer;transition:background .15s}
.theme-quick-btn:hover{background:rgba(255,255,255,.3)}
.theme-quick-btn .tq-dot{width:11px;height:11px;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.65)}
.theme-quick-btn .tq-name{font-weight:600;line-height:1}
.theme-quick-btn .tq-arrow{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid rgba(255,255,255,.85);margin-top:1px}
.theme-quick-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:150px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-pop);padding:6px;display:none;z-index:80}
.theme-quick-menu.show{display:block}
.theme-quick-menu button{display:flex;align-items:center;gap:9px;width:100%;border:none;background:transparent;color:var(--ink);font-size:13.5px;padding:8px 10px;border-radius:10px;cursor:pointer;text-align:left}
.theme-quick-menu button:hover{background:var(--green-soft)}
.theme-quick-menu button.active{font-weight:700}
.theme-quick-menu .tq-dot{width:13px;height:13px;border-radius:50%;flex:none}
.theme-quick-menu .tq-check{margin-left:auto;color:var(--green);font-weight:700;font-size:12px}
/* 右上角账号区（服务器版） */
.account{display:flex;align-items:center;gap:10px;font-size:13px;color:#fff}
.account a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.account .account-no{color:rgba(255,255,255,.88);font-weight:400}
.account .account-reg{display:inline-flex;align-items:center;gap:3px}
.account .account-user{font-weight:700;background:rgba(255,255,255,.18);padding:3px 10px;border-radius:999px;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account .btn-logout{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.5);color:#fff;font-size:12.5px;padding:3px 12px;border-radius:999px;cursor:pointer;transition:background .15s}
.account .btn-logout:hover{background:rgba(255,255,255,.3)}
/* 圆形头像（账号区/注册预览通用） */
.avatar-circle{width:36px;height:36px;flex:none;border-radius:50%;overflow:hidden;background:var(--accent);box-shadow:0 0 0 2px rgba(255,255,255,.55);display:inline-flex;align-items:center;justify-content:center}
.avatar-circle .avatar-img{width:100%;height:100%;object-fit:cover;display:block}
.avatar-circle .avatar-ph{color:#fff;font-size:16px;font-weight:700;line-height:1}
/* 注册弹层内的头像选择区 */
.auth-avatar{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;margin:2px 0 14px}
.auth-avatar-preview{width:64px;height:64px;flex:none;border-radius:50%;overflow:hidden;background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 2px rgba(255,255,255,.35);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s,box-shadow .15s}
.auth-avatar-preview:hover{transform:scale(1.06);box-shadow:inset 0 0 0 2px rgba(255,255,255,.55),0 0 0 4px rgba(255,255,255,.22)}
.auth-avatar-preview .avatar-img{width:100%;height:100%;object-fit:cover;display:block}
.auth-avatar-preview .avatar-ph{color:rgba(255,255,255,.85);font-size:24px;font-weight:700}
.auth-avatar-plus{font-size:30px;font-weight:300;color:rgba(255,255,255,.92);line-height:1;user-select:none}
.auth-avatar-hint{margin:0;font-size:12px;color:rgba(255,255,255,.72)}
.brand{font-family:KaiTi,"STKaiti","楷体",serif;font-size:24px;font-weight:700;letter-spacing:1px;line-height:1.2;display:flex;align-items:center;gap:8px;color:#fff}
.brand small{font-family:"Microsoft YaHei","PingFang SC",sans-serif;font-size:12px;font-weight:400;opacity:.78;margin-left:6px;letter-spacing:0}
.nav{flex-basis:100%;display:flex;gap:2px;margin-top:12px;overflow-x:auto;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav-item{flex:1;min-width:0;text-align:center;padding:10px 2px 12px;color:rgba(255,255,255,.78);background:none;border:none;border-bottom:3px solid transparent;font-size:14px;cursor:pointer;white-space:nowrap;transition:color .18s,border-color .18s}
.nav-item:hover{color:#fff}
.nav-item.active{color:#fff;border-bottom-color:var(--nav-line);font-weight:700}
/* ===== 非首页视图：沿用首页渐变背景（随主题） ===== */
#view-plan.active,#view-dishes.active,#view-history.active,#view-settings.active,#view-dish.active,#view-admin.active{
  margin:-20px -16px 0;padding:22px 16px 44px;background:var(--grad-page)
}
/* ===== 主区 ===== */
main{max-width:1080px;margin:0 auto;padding:20px 16px 72px}
.view{display:none}
.view.active{display:block;animation:fadeIn .22s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px;margin-bottom:14px;box-shadow:var(--shadow);position:relative;transition:box-shadow .18s,transform .18s,border-color .18s}
.card:hover{box-shadow:var(--shadow-hover);border-color:var(--line-2);transform:translateY(-2px)}
.card h2{font-size:17px;margin:0 0 2px;display:flex;align-items:center;gap:8px}
.card>h2::before{content:"";width:4px;height:16px;border-radius:2px;background:var(--green);flex:none}
.list-head{display:flex;align-items:center;gap:8px}
.list-head .icon-btn{margin-left:0}
.list-head .icon-btn:first-of-type{margin-left:auto}
.list-head .count-badge{margin-left:0}
.card .sub{color:var(--ink-2);font-size:13px;margin:0 0 12px}
.count-badge{display:inline-block;margin-left:8px;padding:1px 10px;border-radius:999px;background:var(--green-soft);color:var(--green);font-size:12px;vertical-align:middle}
.muted{color:var(--ink-2)}
.hint{font-size:12px;color:var(--ink-2);margin-top:10px;line-height:2;letter-spacing:.02em}
.version-footer{margin-top:24px;padding:16px 16px 26px;color:var(--page-ink2);text-align:center;font-size:12.5px;letter-spacing:.03em;font-weight:500}
/* ===== 设置页：主题选择 ===== */
.theme-grid{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:640px){.theme-grid{grid-template-columns:repeat(3,1fr)}}
.theme-opt{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px;cursor:pointer;font-family:inherit;transition:border-color .18s,box-shadow .18s,transform .12s}
.theme-opt:hover{border-color:var(--green-line);box-shadow:var(--shadow)}
.theme-opt:active{transform:translateY(1px)}
.theme-opt.active{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
.theme-swatches{display:flex;gap:5px}
.theme-swatches i{width:22px;height:22px;border-radius:50%;border:1px solid rgba(0,0,0,.12);display:block;flex:none}
.theme-name{font-size:14px;font-weight:600;color:var(--ink)}
.theme-desc{font-size:11px;color:var(--ink-2);line-height:1.5}
.theme-check{position:absolute;top:8px;right:8px;width:18px;height:18px;border-radius:50%;background:var(--green);color:var(--cream);display:flex;align-items:center;justify-content:center}
.theme-check svg{width:12px;height:12px}
/* ===== Hero（主题化渐变主视觉） ===== */
.hero{position:relative;overflow:hidden;background:var(--grad-main);color:#fff;border-radius:var(--radius-lg);padding:26px 22px;margin-bottom:16px;box-shadow:var(--shadow-hover)}
.hero::after{content:"";position:absolute;right:-30px;bottom:-34px;width:220px;height:220px;background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 64 64%22 fill=%22none%22%3E%3Cpath d=%22M12 36 q20 22 40 0 z%22 fill=%22%23F7F3EA%22/%3E%3Cellipse cx=%2232%22 cy=%2236%22 rx=%2220%22 ry=%227%22 fill=%22%23F7F3EA%22/%3E%3Cpath d=%22M40 24 L48 40 M45 22 L52 36%22 stroke=%22%23F7F3EA%22 stroke-width=%224.5%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M25 25 c-3 -4 3 -6 0 -10 M32 23 c-3 -4 3 -6 0 -10 M39 25 c-3 -4 3 -6 0 -10%22 stroke=%22%23F7F3EA%22 stroke-width=%224%22 fill=%22none%22 stroke-linecap=%22round%22/%3E%3C/svg%3E") center/contain no-repeat;opacity:.07;pointer-events:none}
.hero .date{font-size:13px;opacity:.78}
.hero .today-title{font-size:24px;font-weight:700;margin:4px 0 8px}
.hero-sub{font-size:13px;opacity:.85;margin-bottom:12px}
.hero-chips{margin-bottom:14px}
.hero .chip{background:rgba(255,255,255,.92);color:var(--accent);border-color:transparent;font-weight:600}
/* ===== 按钮（参照图圆润按钮式样） ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 18px;border-radius:14px;border:1px solid transparent;font-size:15px;cursor:pointer;text-decoration:none;transition:background .18s,border-color .18s,transform .12s,box-shadow .18s}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--grad-main);color:#fff}
.btn-primary:hover{filter:brightness(.96);box-shadow:0 3px 12px var(--shadow-hover)}
.btn-green{background:var(--grad-main);color:#fff}
.btn-green:hover{filter:brightness(.96);box-shadow:0 3px 12px var(--shadow-hover)}
.btn-gold{background:var(--gold);color:#3A2C08}
.btn-gold:hover{background:var(--gold);filter:brightness(.9);box-shadow:0 3px 10px rgba(0,0,0,.18)}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink-2)}
.btn-ghost:hover{border-color:var(--line-2);color:var(--ink);background:var(--cream)}
.btn-danger-ghost{color:var(--tomato);border-color:var(--danger-line);background:var(--danger-soft)}
.btn-danger-ghost:hover{background:var(--tomato-soft);box-shadow:0 3px 10px rgba(0,0,0,.12)}
.btn-sm{min-height:34px;padding:0 12px;font-size:13px}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px}
.back-row{margin:0 0 12px}
.draft-status{font-size:12px;font-weight:600;margin:0 0 10px;visibility:hidden;color:var(--green);transition:opacity .25s}
.draft-status.on{visibility:visible}
.draft-status.count{color:var(--ink-3);font-weight:400}
/* ===== 标签 / 徽标 ===== */
.chip{display:inline-flex;align-items:center;background:var(--green-soft);color:var(--green);border:1px solid var(--green-line);border-radius:999px;padding:2px 12px;font-size:13px;margin:0 6px 6px 0;line-height:1.7}
.chip.clickable{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.chip.clickable:hover{border-color:var(--green);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.chip.gold{background:var(--gold-soft);color:var(--gold-ink);border-color:var(--gold-line)}
.chip.tomato{background:var(--tomato-soft);color:var(--tomato);border-color:var(--danger-line)}
.chip-btn{min-height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--green-line);background:var(--surface);color:var(--green);font-size:13px;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.chip-btn:hover{border-color:var(--green);background:var(--green-soft)}
.chip-btn.active{background:var(--green);border-color:var(--green);color:var(--cream);font-weight:600}
.chip-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.chip-row .chip{margin:0}
/* ===== 首页入口卡片 ===== */
.entry-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:640px){.entry-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.entry-grid{grid-template-columns:repeat(4,1fr)}}
.entry-card{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px;cursor:pointer;box-shadow:var(--shadow);transition:border-color .18s,transform .18s,box-shadow .18s}
.entry-card:hover{border-color:var(--green-line);transform:translateY(-2px);box-shadow:var(--shadow-hover)}
.entry-card:active{transform:translateY(0)}
.entry-icon{flex:none;width:44px;height:44px;border-radius:12px;background:var(--green-soft);color:var(--green);display:flex;align-items:center;justify-content:center;transition:background .18s,color .18s}
.entry-card:hover .entry-icon{background:var(--green);color:var(--cream)}
.entry-icon svg{width:22px;height:22px}
.entry-body{min-width:0;flex:1}
.entry-title{font-size:15px;font-weight:600}
.entry-desc{font-size:12px;color:var(--ink-2);line-height:1.4;margin-top:1px}
.entry-num{flex:none;font-size:13px;color:var(--green);background:var(--green-soft);border-radius:999px;padding:2px 10px;white-space:nowrap}
/* ===== 本周概览 ===== */
.week-list{display:flex;flex-direction:column;gap:6px}
.week-day{display:flex;align-items:center;gap:10px;font-size:14px;padding:3px 0}
.week-day .d{width:52px;flex:none;font-size:12px;color:var(--ink-2);display:inline-flex;justify-content:center;background:var(--cream);border:1px solid var(--line);border-radius:999px;padding:2px 6px}
.week-day.today .d{background:var(--green);border-color:var(--green);color:var(--cream);font-weight:600}
.week-day.today>span:last-child{font-weight:600;color:var(--green)}
.week-dish{cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px;transition:color .15s}
.week-dish:hover{color:var(--green)}
.draw-link{cursor:pointer;transition:color .15s}
.draw-link:hover{color:var(--green);text-decoration:underline dotted;text-underline-offset:3px}
/* ===== 今日计划 ===== */
.rule-line{font-size:13px;color:var(--green);margin:10px 0 2px;padding:9px 12px;background:var(--green-soft);border:1px solid var(--green-line);border-radius:var(--radius-sm)}
.rule-line b{color:var(--green)}
.draw-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-top:12px}
@media(min-width:640px){.draw-grid{grid-template-columns:repeat(2,1fr)}}
.draw-card{background:var(--grad-main);border:none;border-radius:var(--radius);padding:16px;color:#fff;position:relative;overflow:hidden;box-shadow:0 14px 30px rgba(0,0,0,.34);transition:transform .18s,box-shadow .18s}
.draw-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(140deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 60%)}
.draw-card:hover{border:none;transform:translateY(-2px);box-shadow:0 18px 36px rgba(0,0,0,.40)}
.draw-name{font-size:17px;font-weight:700;color:#fff}
.draw-meta{font-size:13px;color:rgba(255,255,255,.88);margin-top:4px}
.done-badge{display:inline-block;margin-top:14px;padding:4px 16px;border-radius:999px;background:rgba(255,255,255,.24);color:#fff;font-size:13px;border:1px solid rgba(255,255,255,.5)}
.plan-empty{margin-top:14px}
/* ===== 表单 ===== */
.form-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:640px){.form-grid{grid-template-columns:1fr 1fr}}
.form-grid .full{grid-column:1 / -1}
.field > label{display:block;font-size:13px;color:var(--ink-2);margin-bottom:5px;font-weight:500}
.field input,.field select,.field textarea{width:100%;min-height:44px;border:1px solid var(--line);border-radius:var(--radius-sm);padding:8px 12px;font-size:16px;font-family:inherit;background:var(--surface);color:var(--ink);transition:border-color .18s,box-shadow .18s}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft);outline:none}
.field textarea{min-height:76px;resize:vertical;line-height:1.7}
/* ===== 菜谱列表 ===== */
.toolbar{margin-bottom:4px}
.toolbar input{width:100%;min-height:42px;border:1px solid var(--line);border-radius:var(--radius-sm);padding:6px 12px;font-size:16px;background:var(--surface);color:var(--ink);transition:border-color .18s,box-shadow .18s}
.toolbar input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft);outline:none}
.dish-row{display:block;padding:12px 0;border-bottom:1px dashed var(--line);border-radius:8px;transition:background .15s}
.dish-row:hover{background:var(--cream)}
.dish-row:last-child{border-bottom:none}
.dish-line{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;width:100%}
.dish-main{min-width:0;flex:1 1 220px}
.dish-thumb{width:56px;height:56px;border-radius:12px;object-fit:cover;flex:none;border:1px solid var(--line);box-shadow:var(--shadow)}
.dish-steps{margin-top:8px}
.dish-steps summary{cursor:pointer;font-size:13px;color:var(--green);font-weight:600;list-style:none;display:inline-flex;align-items:center;gap:4px}
.dish-steps summary::before{content:"▸";font-size:12px;transition:transform .15s}
.dish-steps[open] summary::before{transform:rotate(90deg)}
.dish-steps summary::-webkit-details-marker{display:none}
.steps-text{white-space:pre-line;font-size:13px;color:var(--ink);background:var(--cream);border:1px dashed var(--line);border-radius:var(--radius-sm);padding:10px 12px;margin-top:6px}
.draw-thumb{width:100%;height:150px;object-fit:contain;background:var(--cream);border-radius:12px;margin-bottom:8px;border:1px solid var(--line)}
/* ===== 图片上传 ===== */
.img-pick{position:relative}
.img-file{display:none}
.img-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:24px 14px;border:2px dashed var(--gold-line);background:var(--gold-soft);border-radius:12px;cursor:pointer;text-align:center;transition:border-color .2s,background .2s}
.img-drop:hover{border-color:var(--gold);background:var(--gold-deep)}
.img-drop.drag-over{border-color:var(--green);background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green-soft)}
.img-drop.drag-over .ico{color:var(--green)}
.img-drop .ico{width:30px;height:30px;color:var(--gold);margin-bottom:2px}
.img-drop-title{font-size:14px;font-weight:600;color:var(--ink)}
.img-drop-sub{font-size:12px;color:var(--ink-2)}
.img-wrap{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.img-wrap img{max-width:100%;max-height:200px;object-fit:contain;border-radius:var(--radius-sm);border:1px solid var(--line);box-shadow:var(--shadow)}
.img-actions{display:flex;gap:8px}
.img-actions label{cursor:pointer}
.dish-name{font-size:16px;font-weight:600}
.dish-meta{font-size:12px;color:var(--ink-2);margin-top:2px;word-break:break-all}
.dish-stat{font-size:12px;color:var(--tomato);margin-top:3px}
.dish-ops{flex:none;display:flex;gap:8px}
@media(hover:hover){
  .dish-ops .icon-btn{opacity:.45;transition:opacity .15s}
  .dish-row:hover .dish-ops .icon-btn{opacity:1}
}
/* ===== 历史 ===== */
.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:760px){.stat-grid{grid-template-columns:repeat(4,1fr)}}
.stat{background:var(--grad-main);border:none;border-radius:12px;padding:13px;color:#fff;position:relative;overflow:hidden;box-shadow:0 14px 30px rgba(0,0,0,.30)}
.stat::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(140deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,0) 60%)}
.stat .num{font-size:24px;font-weight:700;color:#fff;line-height:1.2}
.stat .label{font-size:12px;color:rgba(255,255,255,.85);margin-top:2px}
.stat.clickable{cursor:pointer;transition:transform .15s,box-shadow .15s}
.stat.clickable:hover{border:none;transform:translateY(-1px);box-shadow:0 16px 32px rgba(0,0,0,.38)}
.stat.clickable:hover .num{color:#fff;opacity:.85}
.top-title{margin:16px 0 8px;font-size:14px;font-weight:600;color:var(--page-ink2)}
.top-row{display:flex;flex-wrap:wrap;gap:8px}
.top-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);padding:6px 12px;font-size:14px;box-shadow:var(--shadow)}
.top-item.clickable{cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.top-item.clickable:hover{border-color:var(--green);box-shadow:var(--shadow-hover);transform:translateY(-1px)}
.top-item b{color:var(--tomato)}
.top-item em{font-style:normal;color:var(--ink-2);font-size:12px;margin-left:4px}
.history-item{border:none;border-radius:12px;background:var(--grad-main);margin-bottom:10px;color:#fff;box-shadow:0 14px 30px rgba(0,0,0,.30);overflow:hidden;position:relative}
.history-item::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(140deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,0) 60%)}
.history-item summary{padding:12px 14px;cursor:pointer;display:flex;align-items:center;gap:10px;list-style:none;font-size:14px;transition:background .15s}
.history-item summary:hover{background:rgba(255,255,255,.10)}
.history-item summary::-webkit-details-marker{display:none}
.history-item[open] summary{border-bottom:1px dashed rgba(255,255,255,.35)}
.h-date{font-weight:600;min-width:88px;color:#fff}
.h-wd{color:rgba(255,255,255,.85);font-size:13px}
.h-count{margin-left:auto;font-size:13px;color:#fff;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:1px 10px}
.h-detail{padding:12px 14px 14px}
.h-detail .chip{background:rgba(255,255,255,.20);border-color:rgba(255,255,255,.35);color:#fff}
/* ===== 设置 ===== */
/* ===== 测试功能：随机生成菜品（正式定稿后删除） ===== */
.test-card{border-style:dashed;border-color:var(--gold-line);background:var(--gold-soft)}
.test-badge{display:inline-block;margin-left:8px;padding:1px 10px;border-radius:999px;background:var(--gold-soft);color:var(--gold-ink);border:1px solid var(--gold-line);font-size:12px;vertical-align:middle}
/* ===== 空态 / 提示 ===== */
.empty{text-align:center;color:var(--ink-2);padding:28px 12px;font-size:14px}
.empty::before{content:"";display:block;width:54px;height:54px;margin:0 auto 10px;background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 64 64%22 fill=%22none%22%3E%3Cpath d=%22M10 30h44v5a22 22 0 0 1-44 0z%22 stroke=%22%23B3AC97%22 stroke-width=%224%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M20 18c-2-5 4-8 4-8s6 3 4 8M30 16c-2-5 4-8 4-8s6 3 4 8M40 18c-2-5 4-8 4-8s6 3 4 8%22 stroke=%22%23B3AC97%22 stroke-width=%224%22 stroke-linecap=%22round%22/%3E%3C/svg%3E") center/contain no-repeat;opacity:.55}
/* ===== Toast ===== */
#toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);background:var(--green-2);color:#fff;padding:10px 20px;border-radius:999px;font-size:14px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:99;max-width:90vw;box-shadow:var(--shadow-pop)}
#toast.show{opacity:1;transform:translateX(-50%)}
/* ===== 菜品详情页 ===== */
.detail-img{width:100%;height:320px;object-fit:contain;background:var(--cream);border-radius:12px;border:1px solid var(--line);margin:4px 0 12px}
.detail-name{font-size:22px;font-weight:700;margin:6px 0 2px}
.detail-tags{margin:8px 0 6px}
.detail-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:4px}
.detail-block{margin-top:18px}
.detail-block h3{font-size:14px;color:var(--ink-2);margin:0 0 8px;font-weight:600;display:flex;align-items:center;gap:6px}
.detail-block h3::before{content:"";width:3px;height:12px;border-radius:2px;background:var(--gold)}
.detail-dates{display:flex;flex-wrap:wrap;gap:6px}
.detail-date{font-size:13px;background:var(--green-soft);color:var(--green);border:1px solid var(--green-line);border-radius:999px;padding:2px 10px}
/* ===== 批量操作 ===== */
.batch-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0 6px;padding:10px 12px;background:var(--gold-soft);border:1px dashed var(--gold-line);border-radius:var(--radius-sm);font-size:13px}
.batch-count{font-weight:600;color:var(--gold-ink)}
.batch-gap{color:var(--ink-2)}
.batch-bar select{min-height:34px;border:1px solid var(--line);border-radius:8px;padding:4px 8px;font-size:14px;background:var(--surface);color:var(--ink)}
.dish-check{width:18px;height:18px;flex:none;accent-color:var(--green)}
/* ===== 开关 ===== */
.switch-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 0;font-size:14px}
.switch{position:relative;display:inline-block;width:46px;height:26px;flex:none}
.switch input{opacity:0;width:0;height:0}
.switch .track{position:absolute;inset:0;background:var(--line-2);border-radius:999px;transition:background .2s;cursor:pointer}
.switch .track::before{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.switch input:checked + .track{background:var(--green)}
.switch input:checked + .track::before{transform:translateX(20px)}
.switch input:focus-visible + .track{box-shadow:0 0 0 3px var(--gold-soft)}
.switch input:disabled + .track{opacity:.4;cursor:not-allowed}
.switch input:disabled + .track::before{box-shadow:none}
.ts-sub{opacity:.85;transition:opacity .2s}
.ts-sub.disabled{opacity:.45}
/* ===== 制作步骤（每步一个编辑框 / 有序列表） ===== */
.step-row{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.step-row .step-input{flex:1;min-width:0}
/* ===== 图标按钮（缩小、图标化） ===== */
.icon-btn{width:30px;height:30px;flex:none;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--card);border-radius:8px;color:var(--ink-2);cursor:pointer;padding:0;transition:border-color .15s,color .15s,background .15s,transform .12s}
.icon-btn:not(:disabled):hover{border-color:var(--green);color:var(--green);background:var(--green-soft)}
.icon-btn:not(:disabled):active{transform:scale(.92)}
.icon-btn:disabled{background:var(--cream);color:var(--ink-3);border-color:var(--line);box-shadow:none;cursor:not-allowed}
.icon-btn.danger:not(:disabled):hover{border-color:var(--tomato);color:var(--tomato);background:var(--tomato-soft)}
.icon-btn.active{border-color:var(--green);color:var(--green);background:var(--green-soft)}
.icon-btn.green{background:var(--green);border-color:var(--green);color:var(--cream)}
.icon-btn.green:not(:disabled):hover{background:var(--green-2);border-color:var(--green-2);color:var(--cream)}
.icon-btn svg{width:16px;height:16px}
.icon-add-row{display:flex;align-items:center;margin-top:6px}
.icon-add-row .icon-btn{border-style:dashed}
/* ===== 食材编辑（每行：名称 + 重量 + 单位） ===== */
.ing-row{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.ing-row .ing-name{flex:1.4;min-width:0}
.ing-row .ing-weight{flex:0.9;min-width:0}
.ing-row input,.step-row input{min-height:44px;border:1px solid var(--line);border-radius:var(--radius-sm);padding:8px 12px;font-size:16px;font-family:inherit;background:var(--surface);color:var(--ink);transition:border-color .18s,box-shadow .18s}
.ing-row input:focus,.step-row input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft);outline:none}
/* ===== 智能导入菜谱（登记新菜页） ===== */
.form-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.form-head-text{flex:1;min-width:0}
.import-toggle{margin-top:2px}
#import-panel{margin:0 0 14px;padding:12px;background:var(--cream);border:1px solid var(--line);border-radius:var(--radius-sm)}
#import-text{width:100%;min-height:120px;border:1px solid var(--line);border-radius:var(--radius-sm);padding:8px 12px;font-size:16px;font-family:inherit;background:var(--surface);color:var(--ink);resize:vertical;line-height:1.7;transition:border-color .18s,box-shadow .18s}
#import-text:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft);outline:none}
#import-panel .btn-row{margin:10px 0 0}
.import-list{margin-top:10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
.import-prev-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border-bottom:1px dashed var(--line);font-size:14px}
.import-prev-row:last-child{border-bottom:none}
.import-prev-row .ip-name{font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.import-prev-row .ip-tag{flex:none;font-size:12px;color:var(--ink-2);background:var(--cream);border:1px solid var(--line);border-radius:999px;padding:1px 8px}
.import-prev-row .ip-state{flex:none;font-size:12px;color:var(--green);margin-left:auto}
.import-prev-row.dup .ip-name{color:var(--ink-3);text-decoration:line-through}
.import-prev-row.dup .ip-state{color:var(--ink-3)}
.import-summary{margin-top:8px;font-size:13px;color:var(--ink-2)}
/* ===== 详情页食材展示 ===== */
.ing-chips{display:flex;flex-wrap:wrap;gap:6px}
.ing-chip{display:inline-flex;align-items:baseline;gap:6px;font-size:13px;background:var(--gold-soft);border:1px solid var(--gold-line);border-radius:999px;padding:3px 12px}
.ing-chip em{font-style:normal;color:var(--ink-2);font-size:12px}
/* ===== 设置页：分类管理 ===== */
.cat-manage{display:flex;flex-direction:column;gap:8px;margin:6px 0 12px}
.cat-item{display:grid;grid-template-columns:minmax(0,1fr) 64px auto auto auto;align-items:center;gap:10px;background:var(--cream);border:1px solid var(--line);border-radius:var(--radius-sm);padding:6px 8px 6px 14px;font-size:14px;transition:border-color .15s,background .15s}
.cat-item:hover{border-color:var(--line-2)}
.cat-item .cat-name{display:flex;align-items:center;gap:6px;min-width:0}
.cat-name-text{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cat-count{grid-column:2;justify-self:center;width:100%;font-size:12px;color:var(--ink-2);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:1px 4px;text-align:center}
.cat-item .cat-up{grid-column:3}
.cat-item .cat-down{grid-column:4}
.cat-item .cat-del{grid-column:5;justify-self:end}
.cat-item .icon-btn{background:var(--surface);box-shadow:0 1px 2px rgba(0,0,0,.06)}
.cat-item .icon-btn:disabled{opacity:.28;background:var(--cream);color:var(--ink-3);border-color:var(--line);border-style:dashed;box-shadow:none;cursor:not-allowed}
.cat-item .icon-btn:disabled svg{opacity:.55}
.cat-sort .cat-locked{cursor:default;opacity:.85}
.cat-sort .cat-locked:active{cursor:default}
.drag-lock{display:inline-flex;align-items:center;color:var(--ink-3);flex:none}
.drag-lock svg{width:14px;height:14px;display:block}
.cat-add{display:flex;gap:8px;align-items:center}
.cat-add input{flex:1;min-width:0;min-height:40px;border:1px solid var(--line);border-radius:var(--radius-sm);padding:6px 12px;font-size:16px;background:var(--surface);color:var(--ink);transition:border-color .18s,box-shadow .18s}
.cat-add input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft);outline:none}
.cat-toggle{margin-top:12px;position:relative;display:flex;justify-content:center;align-items:center;min-height:34px}
.cat-toggle .btn{min-width:190px}
.cat-toggle .icon-btn{position:absolute;right:0;top:0}
/* ===== 步骤展示（详情页） ===== */
.steps-ol{padding-left:22px;margin:6px 0 0;font-size:14px;color:var(--ink)}
.steps-ol li{margin:2px 0;line-height:1.6}
.steps-detail{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.step-item{background:var(--cream);border:1px solid var(--line);border-left:3px solid var(--green);border-radius:var(--radius-sm);padding:9px 12px;transition:border-color .15s}
.step-item:hover{border-color:var(--green-line)}
.step-index{font-size:12px;color:var(--green);font-weight:700;margin-bottom:2px;letter-spacing:.5px}
.step-body{font-size:14px;line-height:1.75;color:var(--ink);white-space:pre-wrap;word-break:break-word}
/* ===== 滚动条 / 小屏适配 ===== */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:999px;border:2px solid var(--paper)}
::-webkit-scrollbar-thumb:hover{background:var(--ink-3)}
::-webkit-scrollbar-track{background:transparent}
@media(max-width:1024px){
  .nav{justify-content:space-between}
  .nav-item{flex:0 0 auto}
}
@media(max-width:420px){
  .nav-item{font-size:13px;padding:9px 2px 11px}
  .brand small{display:none}
  .hero{padding:20px 16px}
  .hero .today-title{font-size:20px}
  .card{padding:15px}
}
@media (prefers-reduced-motion: reduce){*{transition:none !important;animation:none !important}}

/* ============================================================
   首页 · 鲜活风（参照橙粉促销页式样，颜色随主题变量）
   ============================================================ */
#view-home.active{margin:-20px -16px 0;padding:22px 16px 44px;background:var(--grad-page)}
/* 顶部 hero 卡片：纯文字居中排版，分「顶标 / 标题组 / 内容组 / 行动区」四段 */
#view-home .home-hero{position:relative;overflow:hidden;background:var(--grad-main);border-radius:var(--radius-lg,26px);color:#fff;margin-bottom:18px;padding:54px 26px 46px;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 34px rgba(0,0,0,.18)}
#view-home .home-hero::before{content:"";position:absolute;width:230px;height:230px;border-radius:50%;background:rgba(255,255,255,.1);top:-70px;left:-60px;pointer-events:none}
#view-home .home-hero::after{content:"";position:absolute;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.1);bottom:-48px;right:-36px;pointer-events:none}
#view-home .hero-copy{width:100%;max-width:560px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:relative;z-index:1}
/* 段1：顶标 */
#view-home .hero-kicker{display:inline-flex;align-items:center;gap:10px;font-size:14px;letter-spacing:3px;color:rgba(255,255,255,.92);margin-bottom:26px}
#view-home .hero-kicker::before{content:"";width:26px;height:2px;border-radius:2px;background:rgba(255,255,255,.75)}
#view-home .hero-kicker::after{content:"";width:26px;height:2px;border-radius:2px;background:rgba(255,255,255,.75)}
/* 段2：标题组（大标题 + 日期紧贴） */
#view-home .hero-title{font-family:KaiTi,"STKaiti","楷体",serif;font-size:62px;line-height:1.14;font-weight:700;letter-spacing:4px;margin:0 0 12px;text-shadow:0 2px 14px rgba(0,0,0,.2)}
#view-home .hero-date{font-size:14px;opacity:.92;letter-spacing:1px;margin-bottom:30px}
/* 段3：内容组（说明文字 + 菜品标签） */
#view-home .hero-sub{font-size:14px;opacity:.92;letter-spacing:.5px;margin-bottom:18px;max-width:420px}
#view-home .hero-chips{margin:0 0 32px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
#view-home .hero-chips .chip{margin:0;background:color-mix(in srgb,var(--accent) 16%,#fff);color:var(--accent);border-color:transparent;font-weight:600;box-shadow:0 2px 8px rgba(0,0,0,.12);padding:7px 16px}
#view-home .hero-chips .chip.gold{background:var(--gold-soft);color:var(--gold-ink);border-color:transparent}
/* 段4：行动区（按钮） */
#view-home .hero-btn{background:#fff;color:var(--accent);font-weight:700;min-height:52px;padding:0 36px;border-radius:999px;box-shadow:0 8px 22px rgba(0,0,0,.22);font-size:16px;letter-spacing:1px;align-self:center}
#view-home .hero-btn:hover{background:rgba(255,255,255,.9);box-shadow:0 10px 26px rgba(0,0,0,.26)}
/* 本周概览（渐变卡） */
#view-home .home-week{background:var(--grad-main);border:none;color:#fff;position:relative;overflow:hidden;box-shadow:0 16px 34px rgba(0,0,0,.36);border-radius:var(--radius-lg);padding:18px 20px}
#view-home .home-week::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(150deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,0) 60%)}
#view-home .home-week h2{color:#fff}
#view-home .home-week .sub{color:rgba(255,255,255,.9)}
#view-home .home-week .week-day .d{background:rgba(255,255,255,.20);border-color:rgba(255,255,255,.35);color:#fff}
#view-home .home-week .week-day.today .d{background:rgba(255,255,255,.92);border-color:transparent;color:var(--accent);font-weight:700}
#view-home .home-week .week-day.today>span:last-child{color:#fff;font-weight:700}
#view-home .home-week .week-day>span:last-child{color:rgba(255,255,255,.92)}
#view-home .home-week .week-dish{color:rgba(255,255,255,.95);text-decoration-color:rgba(255,255,255,.6)}
#view-home .home-week .draw-link{color:rgba(255,255,255,.9)}
/* 入口卡片（参照图渐变卡式样） */
#view-home .home-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
#view-home .home-card{background:var(--grad-main);border:none;border-radius:var(--radius-lg);padding:16px 14px 14px;cursor:pointer;box-shadow:0 16px 34px rgba(0,0,0,.36);transition:transform .18s,box-shadow .18s;display:grid;grid-template-columns:1fr auto;grid-template-areas:"t i" "d i" "n i";column-gap:14px;row-gap:4px;align-items:center;position:relative;overflow:hidden;color:#fff}
#view-home .home-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 55%)}
#view-home .home-card:nth-child(2)::after{background:linear-gradient(120deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,0) 60%)}
#view-home .home-card:nth-child(3)::after{background:linear-gradient(105deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,0) 65%)}
#view-home .home-card:nth-child(4)::after{background:linear-gradient(90deg,rgba(255,255,255,.03) 0%,rgba(255,255,255,0) 70%)}
#view-home .home-card:nth-child(5)::after{background:linear-gradient(165deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 58%)}
#view-home .home-card:hover{border:none;transform:translateY(-3px);box-shadow:0 20px 40px rgba(0,0,0,.40)}
#view-home .hc-icon{grid-area:i;width:68px;height:68px;border-radius:20px;background:rgba(255,255,255,.22);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);align-self:center}
#view-home .hc-icon svg{width:34px;height:34px}
#view-home .hc-title{grid-area:t;font-size:16px;font-weight:700;color:#fff}
#view-home .hc-desc{grid-area:d;font-size:12px;color:rgba(255,255,255,.88);line-height:1.45}
#view-home .hc-num{grid-area:n;justify-self:start;font-size:12px;font-weight:700;color:#fff;background:rgba(255,255,255,.24);border:1px solid rgba(255,255,255,.42);border-radius:999px;padding:2px 12px}
/* 响应式 */
@media(max-width:900px){
  #view-home .home-cards{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .top-right{flex-wrap:wrap;justify-content:flex-end;row-gap:6px}
  .top-right .theme-quick::before{display:none}
  .theme-quick{flex-basis:100%;display:flex;justify-content:flex-end}
  #view-home.active{margin:-20px -16px 0;padding:18px 16px 36px}
  #view-home .hero-title{font-size:46px}
  #view-home .home-hero{padding:36px 20px 30px}
  #view-home .home-cards{grid-template-columns:1fr 1fr}
}
@media(max-width:420px){
  #view-home .home-cards{grid-template-columns:1fr}
}
/* ===== 服务器版：登录界面（随主题渐变） ===== */
#auth-screen{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;background:rgba(255,255,255,.32);backdrop-filter:blur(3px);padding:20px}
#auth-screen.show{display:flex}
#auth-screen .auth-card{width:min(360px,92vw);background:var(--grad-main);border:none;border-radius:var(--radius-lg);padding:30px 26px;text-align:center;color:#fff;box-shadow:0 24px 60px rgba(0,0,0,.38);position:relative;overflow:hidden;backdrop-filter:none}
#auth-screen .auth-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 55%)}
.auth-logo{margin-bottom:6px}
.auth-site-logo{width:52px;height:52px;border-radius:50%;object-fit:cover;background:rgba(255,255,255,.25);box-shadow:0 3px 10px rgba(0,0,0,.15)}
.auth-title{font-family:KaiTi,"STKaiti","楷体",serif;font-size:26px;margin:4px 0 2px;color:#fff;letter-spacing:2px}
.auth-sub{font-size:13px;opacity:.85;margin:0 0 18px;color:#fff}
.auth-input{width:100%;min-height:44px;border:1px solid rgba(255,255,255,.3);border-radius:12px;padding:8px 14px;font-size:15px;background:rgba(255,255,255,.14);color:#fff;margin-bottom:12px;outline:none;transition:border-color .18s,background .18s}
.auth-input::placeholder{color:rgba(255,255,255,.6)}
.auth-input:focus{border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.20)}
.auth-captcha{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.auth-captcha img{width:140px;height:46px;flex:none;border-radius:10px;border:1px solid rgba(255,255,255,.35);cursor:pointer;background:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.auth-captcha .auth-captcha-input{flex:1;margin-bottom:0;min-width:0}
.auth-err{min-height:18px;font-size:12.5px;color:#FFE3B8;margin:0 0 6px;display:none}
.auth-err.show{display:block}
.auth-btn{width:100%;min-height:46px;font-size:16px;letter-spacing:6px;background:rgba(255,255,255,.92);color:var(--accent);border:none;border-radius:999px;font-weight:700;cursor:pointer;transition:transform .12s,filter .15s}
.auth-btn:hover{filter:brightness(1.05)}
.auth-btn:active{transform:scale(.97)}
.auth-btn:disabled{opacity:.55;cursor:wait}
.auth-switch{margin-top:14px;font-size:13px;opacity:.9;color:#fff}
.auth-switch a{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.auth-foot{margin-top:16px;font-size:12px;opacity:.7;color:#fff}
/* ===== 服务器版：管理员后台 ===== */
/* Turnstile 容器：居中展示 Cloudflare 验证组件 */
.auth-turnstile{display:flex;justify-content:center;margin:14px 0 6px;min-height:65px}
.auth-turnstile iframe{margin:0 auto}
.auth-turnstile .ts-loading{color:var(--page-ink2);font-size:12.5px;letter-spacing:.03em;align-self:center}
.auth-turnstile .ts-fail-tip{max-width:340px;background:var(--card-soft,var(--card-bg));border:1px solid var(--line-soft,rgba(128,128,128,.18));border-radius:10px;padding:10px 12px;color:var(--warn-ink,var(--page-ink2));font-size:12.5px;line-height:1.6;letter-spacing:.02em}
.brand .site-logo{width:26px;height:26px;border-radius:50%;object-fit:cover;vertical-align:-6px;margin-right:6px;box-shadow:0 1px 4px rgba(0,0,0,.16)}
.site-logo-pick{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.site-logo-preview{width:38px;height:38px;border-radius:50%;object-fit:cover;background:rgba(255,255,255,.45);border:1px dashed rgba(255,255,255,.55);display:inline-flex;align-items:center;justify-content:center}
.site-logo-ph{font-size:10px;color:rgba(120,120,120,.8);letter-spacing:1px}
.admin-toolbar{display:flex;justify-content:flex-end;margin-bottom:12px;gap:8px;flex-wrap:wrap}
.admin-search{min-width:230px;min-height:34px;padding:0 12px;font-size:13px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);outline:none;transition:border-color .18s,background .18s;margin-right:auto}
.admin-search::placeholder{color:var(--ink-3)}
.admin-search:focus{border-color:var(--accent)}
.admin-export-bar{display:none;justify-content:flex-end;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.admin-export-tip{font-size:12px;color:rgba(120,120,120,.9);margin-right:auto}
.admin-users{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
/* 管理页用户卡片：与首页卡片同款主题渐变卡 */
.admin-user-card{background:var(--grad-main);border:none;border-radius:var(--radius-lg);padding:14px;box-shadow:0 16px 34px rgba(0,0,0,.36);display:flex;flex-direction:column;gap:6px;position:relative;overflow:hidden;color:#fff;transition:transform .18s,box-shadow .18s}
.admin-user-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 55%)}
.admin-user-card:hover{transform:translateY(-3px);box-shadow:0 20px 40px rgba(0,0,0,.40)}
.admin-user-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;position:relative;padding-right:52px}
.admin-user-name{font-weight:700;font-size:16px;color:#fff;display:inline-flex;align-items:center;gap:2px}
.admin-nick-reset{width:16px;height:16px;border-radius:50%;border:none;background:rgba(255,255,255,.25);color:#fff;font-size:11px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex:none;transition:background .15s,transform .12s}
.admin-nick-reset:hover{background:var(--tomato-dark);transform:scale(1.12)}
.admin-user-name-pill{display:inline-flex;align-items:center;background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);color:#fff;padding:2px 12px;border-radius:999px;font-weight:700;font-size:14.5px}
/* 设置页用户信息框 */
.user-info-card{display:flex;align-items:center;gap:14px;padding:14px 16px}
.user-info-avatar .avatar-circle{width:52px;height:52px;box-shadow:0 0 0 3px var(--line-2)}
.user-info-avatar .avatar-ph{font-size:22px}
.user-info-body{min-width:0}
.user-info-name{font-size:17px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:8px}
.user-info-nick{font-size:17px;font-weight:700;color:var(--ink)}
.name-pill{display:inline-flex;align-items:center;background:var(--green-soft);border:1px solid var(--line-2);color:var(--accent);padding:3px 12px;border-radius:999px;font-size:14.5px;font-weight:700}
.user-info-edit{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;border-radius:8px;background:var(--green-soft);color:var(--accent);cursor:pointer;padding:0;transition:background .15s,transform .12s}
.user-info-edit:hover{background:var(--line-2);transform:scale(1.06)}
.user-info-edit svg{width:14px;height:14px}
.user-info-logout{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;border-radius:10px;background:rgba(229,72,77,.12);color:#e5484d;cursor:pointer;padding:0;margin-left:auto;flex:none;transition:background .15s,transform .12s}
.user-info-logout:hover{background:#e5484d;color:#fff;transform:scale(1.06)}
.user-info-logout svg{width:16px;height:16px}
.user-info-meta{font-size:12.5px;color:var(--ink-2);margin-top:2px}
/* 修改资料弹层：小卡片悬浮弹窗（首页渐变卡同款，随主题） */
#profile-screen{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;background:rgba(255,255,255,.32);backdrop-filter:blur(3px);padding:20px}
#profile-screen.show{display:flex}
#profile-screen .auth-card{width:min(340px,92vw);background:var(--grad-main);border:none;border-radius:var(--radius-lg);padding:24px 22px;text-align:center;color:#fff;box-shadow:0 24px 60px rgba(0,0,0,.38);position:relative;overflow:hidden;backdrop-filter:none}
#profile-screen .auth-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 55%)}
#profile-screen .auth-title{color:#fff;margin:4px 0 2px;position:relative}
#profile-screen .auth-sub{color:rgba(255,255,255,.9);margin:0 0 16px;position:relative}
#profile-screen .auth-input{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);color:#fff;position:relative}
#profile-screen .auth-input::placeholder{color:rgba(255,255,255,.6)}
#profile-screen .auth-input:focus{border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.2)}
#profile-screen .auth-btn{background:#fff;color:var(--accent);letter-spacing:4px;position:relative}
#profile-screen .auth-btn:hover{filter:brightness(.94)}
#profile-screen .auth-avatar{justify-content:center;text-align:center;position:relative}
#profile-screen .auth-avatar-hint{color:rgba(255,255,255,.75)}
#profile-screen .auth-avatar-preview{background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)}
#profile-screen .auth-avatar-preview:hover{box-shadow:inset 0 0 0 2px rgba(255,255,255,.6),0 0 0 4px rgba(255,255,255,.25)}
#profile-screen .auth-avatar-preview .avatar-ph{color:rgba(255,255,255,.85)}
#profile-screen .auth-switch a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px;position:relative}
#profile-screen .auth-err{color:#FFE3B8}
.admin-user-id{font-size:11.5px;font-weight:600;background:rgba(255,255,255,.18);padding:2px 8px;border-radius:999px;color:rgba(255,255,255,.95);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);letter-spacing:.5px}
/* 管理页用户卡片右上角头像 */
.admin-user-avatar{position:absolute;top:12px;right:12px}
.admin-user-avatar .avatar-circle{width:42px;height:42px;box-shadow:0 0 0 2px rgba(255,255,255,.45),0 4px 12px rgba(0,0,0,.22)}
.admin-user-avatar .avatar-ph{font-size:19px}
/* 移除头像小按钮（仅带头像时显示在头像右上角） */
.admin-avatar-remove{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;border:none;background:var(--tomato-dark);color:#fff;font-size:12px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.30);transition:transform .12s,background .15s}
.admin-avatar-remove:hover{background:#A82F38;transform:scale(1.12)}
.badge{display:inline-block;font-size:11.5px;padding:2px 8px;border-radius:999px;font-weight:600}
.badge-admin{background:var(--card);color:var(--accent);box-shadow:inset 0 0 0 1px var(--line-2)}
.badge-user{background:rgba(255,255,255,.22);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.badge-banned{background:var(--tomato-dark);color:#fff}
.admin-dish-row{display:flex;align-items:center;gap:8px;cursor:pointer}
.admin-dish-row .admin-dish-name{flex:0 0 40%;min-width:120px}
.admin-dish-row .btn-xs{font-size:12px;padding:3px 8px;border-radius:8px}
.admin-user-meta{font-size:12px;color:rgba(255,255,255,.88);display:flex;align-items:center}
/* 导出复选框：默认隐藏，进入导出模式后显示；圆形 + 主题色勾选 */
.admin-user-check{display:none;margin-left:auto;align-items:center;cursor:pointer;position:relative;width:26px;height:26px;justify-content:center;border-radius:50%;transition:background .15s,box-shadow .15s;box-shadow:0 2px 6px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.16)}
.admin-user-check:hover{background:rgba(255,255,255,.16);box-shadow:0 3px 10px rgba(0,0,0,.32),inset 0 0 0 1px rgba(255,255,255,.24)}
.admin-user-check:has(input:checked){background:rgba(255,255,255,.14);box-shadow:0 2px 12px rgba(0,0,0,.34),0 0 10px var(--accent),inset 0 0 0 1px rgba(255,255,255,.3)}
.admin-user-check input{appearance:none;-webkit-appearance:none;width:17px;height:17px;border-radius:50%;border:1.5px solid rgba(255,255,255,.95);background:#fff;cursor:pointer;margin:0;position:relative;transition:background .15s,border-color .15s,box-shadow .15s}
.admin-user-check input:hover{transform:scale(1.1)}
.admin-user-check input::after{content:'';position:absolute;left:4.5px;top:2.2px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) scale(0);opacity:0;transition:transform .15s,opacity .15s}
.admin-user-check input:checked{background:var(--accent);border-color:var(--accent);box-shadow:0 0 10px var(--accent)}
.admin-user-check input:checked::after{transform:rotate(45deg) scale(1);opacity:1}
.admin-users.export-on .admin-user-check{display:inline-flex}
.admin-users.export-on .admin-user-card{cursor:pointer;user-select:none}
.admin-user-stats{display:flex;flex-wrap:wrap;gap:6px;font-size:12.5px;color:rgba(255,255,255,.95)}
.admin-user-stats span{background:rgba(255,255,255,.22);padding:2px 8px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.admin-user-updated{font-size:12px;color:rgba(255,255,255,.88)}
.admin-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px;position:relative}
/* 渐变卡上的操作按钮：半透明白样式 */
.admin-user-card .btn-ghost{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.5);color:#fff}
.admin-user-card .btn-ghost:hover{background:rgba(255,255,255,.30);border-color:rgba(255,255,255,.8);color:#fff}
.admin-user-card .btn-danger-ghost{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.55);color:#fff}
.admin-user-card .btn-danger-ghost:hover{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.85);color:#fff}
.admin-detail-card{width:100%}
.admin-detail-block{margin-top:12px;padding-top:10px;border-top:1px dashed var(--line)}
.admin-detail-block h3{font-size:14px;margin:0 0 8px;color:var(--ink)}
.admin-dish-list,.admin-plan-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px;font-size:13.5px;color:var(--ink)}
.admin-dish-list li,.admin-plan-list li{display:flex;justify-content:space-between;gap:10px;padding-bottom:4px;border-bottom:1px dotted var(--line-2)}
.admin-settings{display:flex;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--ink)}
.dim{color:var(--ink-2);font-size:12.5px}