:root {
  --cream:#f5efe5;--paper:#fffdf9;--paper-soft:#fbf7f0;--ink:#302721;--muted:#81766d;
  --coral:#bd614b;--coral-dark:#8d4233;--leaf:#65715c;--warm:#d39a61;
  --line:rgba(70,52,40,.11);--line-strong:rgba(70,52,40,.18);
  --shadow:0 24px 70px rgba(75,51,34,.11);--shadow-card:0 12px 32px rgba(75,51,34,.075);
}
html{background:#eee4d6;-webkit-text-size-adjust:100%}
body{min-height:100vh;background:radial-gradient(circle at 10% 5%,rgba(189,97,75,.11),transparent 26rem),radial-gradient(circle at 93% 86%,rgba(101,113,92,.12),transparent 30rem),#eee4d6;color:var(--ink);font-family:"PingFang SC","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif}
button{-webkit-tap-highlight-color:transparent}button:active{transform:scale(.98)}
button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid rgba(189,97,75,.2);outline-offset:2px}
.ambient{filter:blur(2px)}.login-shell,.app-shell{background:rgba(255,253,249,.97);border-color:rgba(255,255,255,.78);box-shadow:var(--shadow)}

/* 登录页像一张家书封面，第一眼先建立私密、温暖的产品气质。 */
.login-shell{padding:58px 42px 48px;text-align:left}.login-shell:before{height:5px;background:linear-gradient(90deg,var(--coral),#d8a46c 55%,var(--leaf))}
.login-mark{width:68px;height:68px;margin:0 0 30px;border-radius:22px 22px 22px 7px;background:var(--coral);font:700 30px "Songti SC","STSong",serif;box-shadow:0 14px 30px rgba(156,70,52,.2)}
.login-shell h1{margin:5px 0 0;font:700 48px/1.08 "Songti SC","STSong",serif}.login-shell>p:not(.eyebrow){margin:18px 0 34px;color:var(--muted)}.login-shell form{gap:17px}
.login-shell label,.name-field,.note-field{color:#594a41;font-size:13px}
.login-shell input,.name-field input,.note-field textarea,.family-actions input,.owner-tools input,.manage-actions input{border:1px solid var(--line-strong);border-radius:14px;background:#fff;box-shadow:0 1px 0 rgba(255,255,255,.9),inset 0 1px 2px rgba(62,43,31,.025)}
.login-shell input{height:54px}.primary{min-height:52px;border-radius:15px;background:var(--coral);box-shadow:0 10px 24px rgba(157,68,50,.2);letter-spacing:.04em}.primary:hover{background:#ae5541}

/* 顶部只保留品牌、家庭空间和通知，降低工具栏噪音。 */
.topbar{min-height:68px;padding:14px 22px;background:rgba(255,253,249,.88);border-bottom:1px solid var(--line);box-shadow:none;backdrop-filter:saturate(150%) blur(20px)}
.brand{gap:9px;font-family:inherit;font-size:15px;letter-spacing:.02em}.brand span{width:34px;height:34px;border-radius:12px 12px 12px 4px;font:700 16px "Songti SC",serif}
.top-actions{display:flex;align-items:center;gap:7px}.family-switch,.family-badge,.notifications-button{border:1px solid var(--line);background:#faf5ed;color:#5d4e44}.family-switch{border-radius:999px;padding:0 12px}.family-badge{min-height:38px;border-radius:999px;padding:0 13px}.notifications-button{border-radius:50%}

.welcome{padding:38px 26px 40px;align-items:flex-start}.eyebrow{margin-bottom:9px;color:var(--coral-dark);font-size:11px;letter-spacing:.19em}
.welcome h1,.subpage h1{color:var(--ink);font-family:"Songti SC","STSong",serif;font-weight:700;letter-spacing:-.045em}.welcome h1{font-size:clamp(39px,11vw,51px)}
.welcome>div>p:last-child,.subcopy{color:var(--muted);line-height:1.75}.streak{flex:0 0 78px;padding:13px 9px 12px;border:1px solid rgba(108,82,61,.1);border-radius:22px;background:#f1e5d3}.streak strong{margin:2px 0;font-size:27px}
.content-block{padding:0 22px 34px}.section-head{margin-bottom:17px}.section-head h2,.composer h2,.notifications-panel h2{font:700 23px/1.25 "Songti SC","STSong",serif}.private{border:1px solid rgba(101,113,92,.13);background:#eef0e8;color:#5d6855}

/* 餐次入口保持一键直达，不让智能功能增加家人的记录步骤。 */
.quick-grid{gap:10px}.quick{min-height:88px;padding:14px;border:1px solid transparent;border-radius:20px;box-shadow:none}.quick.sunny{background:#f7e6cc;border-color:#efd9ba}.quick.leafy{background:#e8ebdf;border-color:#dce1d1}.quick.dusky{background:#eee0da;border-color:#e6d1c8}.quick.watery{background:#e2eae7;border-color:#d4dfdc}
.quick-mark{width:35px;height:35px;background:rgba(255,253,249,.55);border-color:rgba(67,49,37,.1)}.quick strong{font-size:14px}.quick small{margin-top:4px;font-size:10px}.quick em{top:12px;right:12px;background:rgba(255,255,255,.45)}

.meal-feed{gap:16px}.meal-card{grid-template-columns:43% minmax(0,1fr);min-height:198px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow-card);transition:transform .2s ease,box-shadow .2s ease}.meal-card:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(75,51,34,.1)}
.meal-photo{min-height:198px;background:#eadfce}.meal-photo:after{box-shadow:inset -1px 0 rgba(255,255,255,.25)}.meal-type{top:11px;left:10px;padding:5px 9px 5px 6px;background:rgba(255,253,249,.9);box-shadow:0 4px 13px rgba(45,32,23,.08)}
.meal-content{min-width:0;padding:17px 15px 14px}.meal-meta{gap:8px}.person-dot{width:28px;height:28px;font-size:11px}.meal-meta strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.meal-meta time{font-size:10px}.meal-content>p{margin:14px 0 12px;color:#43362e;line-height:1.65}
.meal-actions{width:100%;gap:7px}.reaction,.delete-meal{min-height:36px;border-radius:999px;padding:0 12px;font-size:11px}.reaction{border:1px solid #ead3ca;background:#fff8f4;color:var(--coral-dark)}.reaction.liked{background:#efd6cc;border-color:#deb9ab}.delete-meal{margin-left:auto;border:0;background:transparent;color:var(--muted)}
.reaction-names{margin-top:8px;color:var(--muted);font-size:10px;line-height:1.55}.comments{width:100%;margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}.comment-row{padding:4px 2px}.comment-row p{font-size:12px;line-height:1.55}.comment-compose{gap:7px;margin-top:8px}.comment-compose input{min-width:0;height:42px;border:1px solid var(--line);border-radius:13px;background:var(--paper-soft)}.comment-compose button{height:42px;min-width:58px;border-radius:13px;background:var(--leaf)}
.meal-calories{width:100%;margin-bottom:11px;border-radius:13px;background:#f7efe2;color:#6b5544;line-height:1.55}.empty{padding:46px 24px;border:1px dashed var(--line-strong);border-radius:24px;background:rgba(255,255,255,.58)}.empty-mark{width:58px;height:58px;border-color:rgba(141,66,51,.16);background:#f7ece4}

/* 回忆、家人、更新沿用同一套页面与卡片层级。 */
.subpage{padding:40px 24px 86px}.subpage h1{font-size:clamp(38px,10vw,50px)}
.history-toolbar,.invite-card,.family-card,.family-actions form,.owner-tools,.update-card{border:1px solid var(--line);background:#fff;box-shadow:var(--shadow-card)}.history-toolbar{border-radius:18px}.history-day>header{border-bottom-color:var(--line)}.history-day>header h2{font-family:"Songti SC",serif}.history-grid{gap:15px}
.family-icon{width:76px;height:76px;border-radius:24px 24px 24px 8px;background:#eee2d0}.invite-card,.family-card,.family-actions form,.owner-tools{border-radius:20px}.family-card>div{min-height:68px}.member{width:40px;height:40px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}.update-card{border-radius:20px;overflow:hidden}.update-card:before{width:4px}

/* 纯 CSS 图标便于以后把相同设计令牌迁移进微信小程序。 */
.bottom-nav{min-height:76px;padding:9px 10px max(10px,env(safe-area-inset-bottom));background:rgba(255,253,249,.94);border-top:1px solid var(--line);box-shadow:0 -10px 30px rgba(75,51,34,.045);backdrop-filter:saturate(150%) blur(20px)}
.bottom-nav button{color:#998d83;font-size:10px;letter-spacing:.02em}.bottom-nav button.active{color:var(--coral-dark);font-weight:700}.bottom-nav button.active:after{content:"";display:block;width:17px;height:2px;margin:5px auto 0;border-radius:999px;background:var(--coral)}
.bottom-nav .camera{width:58px;height:58px;margin:-19px auto 0;border:5px solid var(--paper);background:var(--coral);box-shadow:0 10px 24px rgba(141,66,51,.26)}.bottom-nav .camera:after{display:none}
.backdrop{background:rgba(48,37,29,.38);backdrop-filter:blur(7px)}.composer,.notifications-panel,.picker-panel{background:var(--paper);box-shadow:0 26px 80px rgba(43,29,20,.26)}.composer{border-radius:28px 28px 0 0}.grabber{background:#d9cec3}.composer header,.notifications-panel header,.picker-panel header{border-bottom:1px solid var(--line)}
.composer header button,.notifications-panel header button,.picker-panel header button{border-radius:999px;background:#f2ebe2;color:#66554a}.photo-picker{min-height:190px;border:1.5px dashed #cdb9a5;border-radius:20px;background:#f7f0e6}.photo-picker:hover{background:#f3e9dc}.calorie-panel{border-radius:16px;background:#f5ecdf}.chip{border-radius:999px}.chip[aria-checked="true"]{background:var(--coral);color:#fff}.toast{bottom:calc(94px + env(safe-area-inset-bottom));border-radius:14px;background:#43342b}

@media(max-width:580px){.login-shell,.app-shell{border-radius:0}.login-shell{padding:max(54px,env(safe-area-inset-top)) 24px 34px}.login-shell h1{font-size:43px}.topbar{min-height:62px;padding:max(11px,env(safe-area-inset-top)) 15px 10px}.brand{font-size:14px}.brand span{width:32px;height:32px}.family-badge{padding:0 10px}.welcome{padding:31px 21px 34px}.welcome h1{font-size:42px}.welcome>div>p:last-child{margin-top:13px;font-size:14px}.content-block{padding-left:17px;padding-right:17px}.subpage{padding-left:19px;padding-right:19px}.reaction,.delete-meal,.comment-compose input,.comment-compose button{min-height:44px}input:not([type=file]),textarea,select{font-size:16px!important}}
@media(max-width:380px){.welcome h1{font-size:37px}.streak{flex-basis:71px}.quick{min-height:82px;padding:12px}.meal-card{grid-template-columns:1fr}.meal-photo{min-height:235px}.meal-content{min-height:0}}
@media(min-width:900px){body{padding:28px}.app-shell{width:min(100%,1200px);border-radius:34px}.topbar{padding:14px 34px}#view-today.active{grid-template-columns:minmax(310px,.78fr) minmax(520px,1.42fr);gap:32px;padding:32px 38px 98px}#view-today .welcome{top:0;padding:44px 35px;border:1px solid rgba(98,70,50,.09);border-radius:28px;background:linear-gradient(155deg,#f1dfc7 0%,#ece6d6 58%,#e4e8dd 100%);box-shadow:var(--shadow-card)}#view-today .welcome h1{font-size:52px}#view-today .streak{width:106px;margin-top:30px}#view-today .content-block{padding-left:0;padding-right:0}.quick{min-height:108px}.meal-feed{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.meal-card{display:flex;min-height:0;border-radius:24px}.meal-photo{min-height:230px}.meal-content{padding:18px 17px 16px}.subpage{padding:54px 72px 110px}.bottom-nav{width:470px;min-height:70px;margin-bottom:16px;border:1px solid var(--line);border-radius:24px;box-shadow:0 12px 35px rgba(75,51,34,.11)}.composer{border-radius:28px}}
@media(prefers-reduced-motion:reduce){button,.meal-card{transition:none!important}}

/* v4.6：减少厚重色块，改成更轻的相册纸张与照片优先布局。 */
body{background:radial-gradient(circle at 8% 0,rgba(190,139,111,.12),transparent 25rem),radial-gradient(circle at 100% 100%,rgba(111,128,105,.1),transparent 28rem),#f1ebe2}
.login-shell,.app-shell{background:rgba(255,254,251,.98)}
.topbar{background:rgba(255,254,251,.91);box-shadow:0 1px 0 rgba(76,55,41,.04)}
.brand span{background:#b65c48;box-shadow:0 5px 14px rgba(141,66,51,.16)}
.family-switch,.family-badge,.notifications-button{background:rgba(248,243,236,.86);border-color:rgba(70,52,40,.09)}
.welcome{background:linear-gradient(150deg,rgba(249,239,225,.72),rgba(244,244,235,.36))}
.quick{box-shadow:inset 0 1px rgba(255,255,255,.7)}.quick:hover{box-shadow:0 9px 24px rgba(73,51,36,.08)}
.meal-card{display:flex;flex-direction:column;min-height:0;border-color:rgba(70,52,40,.09);border-radius:26px;box-shadow:0 10px 30px rgba(69,48,34,.07)}
.meal-photo{min-height:0;aspect-ratio:4/3}.meal-photo img{position:absolute;inset:0}.meal-content{padding:18px 18px 17px}.meal-content>p{min-height:0;margin:16px 0 13px;font-size:15px}
.meal-meta strong{font-size:14px}.meal-meta time{font-size:11px}.person-dot{width:30px;height:30px}
.meal-actions{margin-top:2px}.reaction,.delete-meal{font-size:12px}.reaction-names{margin:9px 2px 0;font-size:11px}
.comments{margin-top:14px;padding:13px 0 0}.comment-row{margin:0 0 8px;padding:8px 10px;border-radius:11px;background:#faf6f0}.comment-row p{font-size:13px}.comment-compose{margin-top:11px;padding:4px;border:1px solid rgba(70,52,40,.1);border-radius:16px;background:#faf7f2}.comment-compose input{height:40px;padding:0 10px;border:0;background:transparent;box-shadow:none}.comment-compose input:focus{box-shadow:none}.comment-compose button{height:40px;border-radius:12px;background:#69755f}
.bottom-nav{background:rgba(255,254,251,.95);box-shadow:0 -8px 28px rgba(67,46,32,.05)}.bottom-nav button.active:after{width:5px;height:5px;margin-top:3px;border-radius:50%}.bottom-nav .camera{background:#b65c48;box-shadow:0 9px 23px rgba(141,66,51,.25)}
.composer,.notifications-panel,.picker-panel{border:1px solid rgba(255,255,255,.7)}.photo-picker{background:linear-gradient(145deg,#f8f2e9,#f4eee6)}
.history-toolbar,.invite-card,.family-card,.family-actions form,.owner-tools,.update-card{border-color:rgba(70,52,40,.09);box-shadow:0 8px 26px rgba(69,48,34,.055)}

@media(max-width:580px){
  body{overflow:hidden}.app-shell{width:100%;box-shadow:none}
  .topbar{min-height:60px;padding-left:17px;padding-right:13px}.welcome{padding:30px 20px 32px;border-bottom:1px solid rgba(70,52,40,.055)}
  .welcome h1{font-size:40px;line-height:1.12}.streak{flex-basis:74px;border-radius:20px;background:rgba(240,229,212,.78)}
  .content-block{padding-left:16px;padding-right:16px}.quick-grid{gap:9px}.quick{min-height:84px;border-radius:19px}
  .meal-feed{gap:20px}.meal-card{width:100%;border-radius:25px}.meal-photo{width:100%;aspect-ratio:1.28}.meal-content{padding:18px 17px 16px}
  .comments{scroll-margin-bottom:20px}.comment-compose{position:relative}.comment-compose input,.comment-compose button{min-height:44px}
  .bottom-nav{min-height:74px}.subpage{padding-top:34px}
}
@media(min-width:900px){
  #view-today.active{grid-template-columns:minmax(300px,.72fr) minmax(560px,1.48fr)}
  #view-today .welcome{background:linear-gradient(155deg,#f4e4cf 0%,#eeeadf 58%,#e6ebe1 100%)}
  .meal-photo{aspect-ratio:1.35}.meal-content{padding:19px 19px 18px}
}
@media(max-width:360px){.welcome h1{font-size:34px}.welcome{gap:10px}.streak{flex-basis:68px}.streak strong{font-size:24px}}
