
:root{--bg:#FBFAFF;--card:rgba(255,255,255,0.58);--card-solid:rgba(254,254,254,0.78);--border:rgba(255,255,255,0.72);--border-outer:rgba(165,172,191,0.18);--shadow:0 2px 20px rgba(149,164,193,0.07),0 0 0 0.5px rgba(255,255,255,0.85) inset;--shadow-lg:0 8px 32px rgba(149,164,193,0.09),0 0 0 0.5px rgba(255,255,255,0.9) inset;--glass-blur:blur(40px) saturate(1.2);--glass-border:rgba(255,255,255,0.72);--rose:#EFE4E9;--rose-deep:#A2A1A4;--lav:#EDE6EE;--lav-deep:#A5ACBF;--mint:#DEEBF4;--mint-deep:#93A4C1;--gold:#BDBBBF;--cream:#F7F8F4;--cream2:#E7E8E4;--text:#5F5F5F;--text-l:#A2A1A4;--text-m:#7A7A7C;--rose-text:#A2A1A4}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;outline:none}
button:focus,input:focus,textarea:focus{outline:none}
button:active{opacity:0.85}
body{font-family:"Noto Sans SC",sans-serif;background:var(--bg);color:var(--text);min-height:100vh;padding-bottom:72px;overflow-x:hidden}
.deco1,.deco2,.deco3{position:fixed;border-radius:50%;filter:blur(90px);opacity:0.45;pointer-events:none;z-index:-1;will-change:transform}
.deco1{width:300px;height:300px;background:linear-gradient(135deg,#DEEBF4,#D3DFF2);top:-80px;right:-60px;animation:dFloat 22s ease-in-out infinite}
.deco2{width:240px;height:240px;background:linear-gradient(135deg,#EFE4E9,#EDE6EE);bottom:80px;left:-50px;animation:dFloat 26s ease-in-out infinite reverse}
.deco3{width:180px;height:180px;background:linear-gradient(135deg,#D0D2DB,#E4E4E6);top:45%;right:-20px;opacity:0.28;animation:dFloat 18s ease-in-out infinite 4s}
@keyframes dFloat{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(12px,-15px) scale(1.03)}50%{transform:translate(-8px,12px) scale(0.97)}75%{transform:translate(15px,8px) scale(1.02)}}
.container{max-width:420px;margin:0 auto;padding:24px 16px}
.hdr{text-align:center;margin-bottom:20px}
.hdr h1{font-family:"Cormorant Garamond",serif;font-size:28px;font-weight:500;font-style:italic;color:var(--rose-deep);letter-spacing:1px}
.hdr-sub{font-size:11px;color:var(--text-l);margin-top:2px;font-family:"Cormorant Garamond",serif;font-style:italic}
.hero{background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:24px;padding:32px 20px;text-align:center;box-shadow:var(--shadow-lg)}
.days{font-family:"Cormorant Garamond",serif;font-size:58px;font-weight:300;background:linear-gradient(135deg,#BDBBBF 0%,#A5ACBF 45%,#93A4C1 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-1px}
.days-label{font-size:11px;color:var(--text-l);letter-spacing:3px;text-transform:uppercase;font-family:"Cormorant Garamond",serif}
.daily{font-size:13px;color:var(--text);margin-top:14px;padding:10px;background:rgba(239,228,233,0.35);border-radius:12px;font-style:italic}
.daily-from{font-size:10px;color:var(--text-l);margin-top:4px;font-family:"Cormorant Garamond",serif}
.health-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px;cursor:pointer}
.hs-card{padding:12px 6px;border-radius:16px;text-align:center;background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:var(--shadow);transition:transform 0.2s ease}
.hs-card:active{transform:scale(0.96)}
.hs-v{font-family:"Cormorant Garamond",serif;font-size:20px;font-weight:400}
.hs-k{font-size:9px;color:var(--text-l);margin-top:2px}
.hs-c1 .hs-v{color:var(--rose-deep)}.hs-c2 .hs-v{color:var(--mint-deep)}.hs-c3 .hs-v{color:var(--lav-deep)}.hs-c4 .hs-v{color:var(--gold)}
/* tab bar */
.tab-bar{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:flex-end;justify-content:center;background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-top:1px solid var(--glass-border);padding:6px 0 env(safe-area-inset-bottom,8px);z-index:100}
.tab-btn{flex:1;background:none;border:none;font-size:10px;color:var(--text-l);padding:4px 0;font-family:"Noto Sans SC",sans-serif;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:1px;transition:color 0.2s}
.tab-btn.active{color:var(--rose-deep);font-weight:500}
.tab-icon{font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center}
.tab-icon svg{display:block}
.tab-btn.chat-center{flex:1;position:relative;padding:0;margin-top:-20px}
.chat-fab-icon{width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,#EFE4E9,#D0D2DB);display:flex;align-items:center;justify-content:center;margin:0 auto;box-shadow:0 4px 20px rgba(165,172,191,0.22);transition:transform 0.2s ease;border:1.5px solid rgba(255,255,255,0.7)}
.chat-fab-icon:active{transform:scale(0.9)}
.chat-fab-icon svg{width:24px;height:24px;fill:none;stroke:white;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tab-btn.chat-center span.chat-label{font-size:10px;color:var(--text-l);margin-top:3px;display:block}
.chat-transition{position:fixed;inset:0;z-index:10000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:rgba(251,250,255,.94);color:var(--text-m);font-size:12px;letter-spacing:0;opacity:0;visibility:hidden;pointer-events:none}
.chat-transition.show{opacity:1!important;visibility:visible!important;pointer-events:auto}
.chat-transition img{width:72px;height:72px;object-fit:contain}
@media (prefers-reduced-motion:reduce){.chat-transition{transition:none}}
/* grids & search */
.sg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.sg-btn{padding:8px 4px;border-radius:12px;border:1px solid var(--border);background:var(--card);font-size:11px;color:var(--text-l);cursor:pointer;text-align:center;transition:all 0.2s;box-shadow:var(--shadow)}
.sg-btn.act{border-color:var(--rose);color:var(--rose-deep);background:rgba(239,228,233,0.4)}
.sb{display:flex;align-items:center;gap:8px;margin-bottom:12px;padding:8px 12px;background:var(--card);border-radius:12px;border:1px solid var(--border)}
.sb input{flex:1;border:none;background:none;font-size:13px;color:var(--text);outline:none;font-family:"Noto Sans SC",sans-serif}
/* memory cards */
.mc{background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:16px;padding:14px;margin-bottom:10px;box-shadow:var(--shadow);cursor:pointer;transition:transform 0.15s ease}
.mc:active{transform:scale(0.98)}
.mc:active{transform:scale(0.98)}
.mc-cat{font-size:10px;padding:2px 8px;border-radius:20px;background:linear-gradient(135deg,rgba(232,196,196,0.3),rgba(213,202,224,0.2));color:var(--rose-text);display:inline-block;margin-bottom:6px}
.mc-body{font-size:13px;line-height:1.6;color:var(--text);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mc-body.expanded{-webkit-line-clamp:unset;display:block}
.mc-toggle{background:none;border:none;color:var(--text-l);font-size:11px;cursor:pointer;padding:2px 0;margin-top:2px;font-family:"Noto Sans SC",sans-serif}
.mc-toggle:hover{color:var(--rose-deep)}
.mc-ft{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.mc-date{font-size:10px;color:var(--text-l);font-family:"Cormorant Garamond",serif}
.mc-tags span{font-size:9px;padding:1px 6px;border-radius:8px;background:var(--cream);color:var(--text-l);margin-left:3px}
.mc-del{background:none;border:none;color:var(--text-l);cursor:pointer;font-size:12px;opacity:0.5}
/* form */
.fp{background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:20px;padding:18px;box-shadow:var(--shadow-lg)}
.fp h3{font-size:14px;font-weight:400;color:var(--text);margin-bottom:12px;font-family:"Cormorant Garamond",serif}
.fg{margin-bottom:12px}
.fl{font-size:11px;color:var(--text-l);margin-bottom:4px;display:block}
.fi,.fta{width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:10px;background:white;font-size:13px;color:var(--text);font-family:"Noto Sans SC",sans-serif;outline:none}
.fta{height:80px;resize:vertical}
.cg{display:flex;flex-wrap:wrap;gap:6px}
.co{padding:4px 10px;border-radius:16px;border:1px solid var(--border);background:white;font-size:11px;color:var(--text-l);cursor:pointer}
.co.sel{border-color:var(--rose);color:var(--rose-deep);background:rgba(239,228,233,0.35)}
.sub-btn{width:100%;padding:10px;border:none;border-radius:12px;background:linear-gradient(135deg,#EFE4E9,#D0D2DB);color:white;font-size:13px;cursor:pointer;font-family:"Noto Sans SC",sans-serif;box-shadow:0 4px 16px rgba(165,172,191,0.15)}
/* notes & voice */
.nc{background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:16px;padding:14px;margin-bottom:10px;box-shadow:var(--shadow)}
.nc-from{font-size:10px;padding:2px 8px;border-radius:20px;background:linear-gradient(135deg,rgba(232,196,196,0.3),rgba(213,202,224,0.2));color:var(--rose-text);display:inline-block;margin-bottom:6px}
.nc-body{font-size:13px;line-height:1.6;color:var(--text)}
.nc-date{font-size:10px;color:var(--text-l);margin-top:6px;font-family:"Cormorant Garamond",serif}
.nc-del{background:none;border:none;color:var(--text-l);cursor:pointer;font-size:12px;opacity:0.5;float:right}
.vc{background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:16px;padding:14px;margin-bottom:10px;box-shadow:var(--shadow)}
.vc-from{font-size:10px;padding:2px 8px;border-radius:20px;background:linear-gradient(135deg,rgba(196,217,210,0.3),rgba(213,202,224,0.2));color:var(--mint-deep);display:inline-block;margin-bottom:6px}
.vc-text{font-size:13px;line-height:1.6;color:var(--text);margin-bottom:6px;font-style:italic}
.vc-audio{width:100%;height:32px;border-radius:8px}
.vc-date{font-size:10px;color:var(--text-l);margin-top:4px;font-family:"Cormorant Garamond",serif}
/* edit modal */
.edit-modal{display:none;position:fixed;inset:0;background:rgba(100,110,140,0.1);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:200;padding:20px;align-items:center;justify-content:center}
.edit-modal.show{display:flex}
.edit-inner{background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-radius:24px;padding:22px;max-width:380px;width:100%;box-shadow:0 12px 40px rgba(100,120,160,0.1);border:1px solid var(--glass-border)}
.edit-inner h3{font-size:15px;font-weight:400;margin-bottom:12px;font-family:"Cormorant Garamond",serif}
/* FAB */
.fab{position:fixed;bottom:76px;right:20px;width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#EFE4E9,#D0D2DB);color:white;border:1.5px solid rgba(255,255,255,0.7);font-size:22px;box-shadow:0 4px 20px rgba(165,172,191,0.18);cursor:pointer;z-index:90;display:none;transition:transform 0.2s ease}
.fab:active{transform:scale(0.9)}
.toast{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--card);color:var(--text);padding:12px 28px;border-radius:24px;font-size:13px;z-index:300;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:0 4px 20px rgba(100,120,160,0.08)}
@keyframes fi{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
/* health page */
.h-card{background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:18px;padding:16px;margin-bottom:10px;box-shadow:var(--shadow)}
.h-label{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.h-icon{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px}
.hr-i{background:rgba(239,228,233,0.55);color:var(--rose-deep)}
.st-i{background:rgba(222,235,244,0.55);color:var(--mint-deep)}
.sl-i{background:rgba(237,230,238,0.55);color:var(--lav-deep)}
.ox-i{background:rgba(189,187,191,0.35);color:var(--gold)}
.h-name{font-size:12px;color:var(--text-l);font-family:"Cormorant Garamond",serif;letter-spacing:0.5px}
.h-big{font-family:"Cormorant Garamond",serif;font-size:36px;font-weight:300}
.h-unit{font-size:12px;color:var(--text-l);margin-left:4px;font-family:"Cormorant Garamond",serif}
.h-stats{display:flex;gap:16px;margin-top:8px;font-size:11px;color:var(--text-l);font-family:"Cormorant Garamond",serif}
.h-stats b{color:var(--text);font-weight:400;margin-left:2px}
.h-steps-layout{display:flex;align-items:center;gap:16px}
.h-ring-wrap{position:relative;width:72px;height:72px;flex-shrink:0}
.h-ring-wrap svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring-bg{fill:none;stroke:var(--cream);stroke-width:6}
.ring-fg{fill:none;stroke:var(--mint);stroke-width:6;stroke-linecap:round;stroke-dasharray:188;stroke-dashoffset:188;transition:stroke-dashoffset 1s ease}
.h-pct{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-family:"Cormorant Garamond",serif;color:var(--mint-deep)}
.h-step-detail{font-size:11px;color:var(--text-l);margin-top:4px}
.sleep-bars{display:flex;height:18px;border-radius:6px;overflow:hidden;margin-top:8px}
.sleep-seg{height:100%;min-width:3px}
.sleep-legend{display:flex;gap:10px;margin-top:6px;flex-wrap:wrap}
.sleep-legend-item{display:flex;align-items:center;gap:4px;font-size:10px;color:var(--text-l)}
.sleep-legend-dot{width:8px;height:8px;border-radius:50%}
.sleep-tag{font-size:10px;padding:2px 8px;border-radius:20px;margin-left:auto}
@keyframes gPop{from{opacity:0;transform:scale(0.5) rotate(-10deg)}to{opacity:1;transform:scale(1) rotate(0)}}
.g-again{background:linear-gradient(135deg,#EFE4E9,#A5ACBF);color:white}
.g-close{background:var(--cream2);color:var(--text-l)}
/* ═══ DIARY ═══ */
.cal-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.cal-hdr button{background:none;border:none;font-size:18px;color:var(--text-l);cursor:pointer;padding:4px 10px}
.cal-month{font-family:"Cormorant Garamond",serif;font-size:18px;color:var(--text);letter-spacing:1px}
.cal-wk{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:10px;color:var(--text-l);margin-bottom:6px;font-family:"Cormorant Garamond",serif}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:16px}
.cal-cell{aspect-ratio:1;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:13px;color:var(--text-l);cursor:pointer;transition:all 0.2s;border:1.5px solid transparent;background:var(--card)}
.cal-cell:hover{border-color:var(--border)}
.cal-cell.today{border-color:var(--rose);color:var(--rose-deep);font-weight:500}
.cal-cell.has-entry{background:rgba(239,228,233,0.4)}
.cal-cell.sel{border-color:var(--lav-deep);background:rgba(213,202,224,0.15)}
.cal-cell .cal-mood{width:6px;height:6px;border-radius:50%;display:inline-block;margin-top:2px}
.cal-cell.empty{background:transparent;cursor:default}
.diary-panel{background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:20px;padding:18px;box-shadow:var(--shadow);animation:fi 0.3s}
.diary-date-title{font-family:"Cormorant Garamond",serif;font-size:16px;color:var(--text);margin-bottom:10px}
.diary-mood-row{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.diary-mood-btn{width:30px;height:30px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:all 0.2s;display:flex;align-items:center;justify-content:center;padding:0;font-size:0}
.diary-mood-btn.sel{border-color:var(--text-m);transform:scale(1.15);box-shadow:0 2px 8px rgba(0,0,0,0.12)}
.diary-ta{width:100%;min-height:100px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:white;font-size:13px;color:var(--text);font-family:"Noto Sans SC",sans-serif;outline:none;resize:vertical;line-height:1.7}
.diary-author-row{display:flex;gap:6px;margin:10px 0}
.diary-author-btn{padding:4px 12px;border-radius:14px;border:1px solid var(--border);background:white;font-size:11px;color:var(--text-l);cursor:pointer}
.diary-author-btn.sel{border-color:var(--rose);color:var(--rose-deep);background:rgba(239,228,233,0.35)}
.diary-save{padding:8px 20px;border:none;border-radius:12px;background:linear-gradient(135deg,#EFE4E9,#A5ACBF);color:white;font-size:12px;cursor:pointer;font-family:"Noto Sans SC",sans-serif}
.diary-entry{background:rgba(245,240,235,0.5);border-radius:12px;padding:12px;margin-top:10px}
.diary-entry-author{font-size:10px;padding:2px 8px;border-radius:20px;display:inline-block;margin-bottom:4px}
.diary-entry-author.kiki{background:rgba(239,228,233,0.55);color:var(--rose-text)}
.diary-entry-author.vince{background:rgba(222,235,244,0.55);color:var(--mint-deep)}
.diary-entry-body{font-size:13px;line-height:1.7;color:var(--text);white-space:pre-wrap}
.diary-entry-del{background:none;border:none;font-size:11px;color:var(--text-l);cursor:pointer;opacity:0.5;float:right}

/* comments */
.cmt-sec{margin-top:8px;padding-top:8px;border-top:1px dashed var(--border)}
.cmt-item{font-size:11px;color:var(--text-m);margin-bottom:4px;line-height:1.5}
.cmt-item .cmt-from{font-size:9px;padding:1px 6px;border-radius:10px;background:rgba(232,196,196,0.2);color:var(--rose-text);margin-right:4px;display:inline-block}
.cmt-input{display:flex;gap:4px;margin-top:6px}
.cmt-input input{flex:1;border:1px solid var(--border);border-radius:8px;padding:4px 8px;font-size:11px;background:white;color:var(--text);outline:none;font-family:"Noto Sans SC",sans-serif}
.cmt-input button{border:none;border-radius:8px;background:var(--rose);color:white;font-size:11px;padding:4px 10px;cursor:pointer}

.bg-opt{border:none;background:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;padding:0}
.bg-opt-preview{width:100%;aspect-ratio:1;border-radius:12px;border:1.5px solid rgba(200,210,230,0.3)}
.bg-opt span{font-size:9px;color:var(--text-l)}
input[type="range"]{-webkit-appearance:none;appearance:none;background:rgba(200,210,230,0.3);border-radius:4px;height:4px;outline:none}

.app-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px;padding:0 4px}
.app-btn{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 0;transition:transform 0.15s ease}
.app-btn:active{transform:scale(0.9)}
.app-icon{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:22px;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:var(--shadow)}
.app-btn span{font-size:10px;color:var(--text-m);font-family:"Noto Sans SC",sans-serif}


.mochi-zone{position:relative;width:100%;height:100px;margin-top:14px;border-radius:20px;background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:var(--shadow);overflow:hidden;cursor:pointer;-webkit-user-select:none;user-select:none}
.mochi-ground{position:absolute;bottom:0;left:0;right:0;height:28px;background:linear-gradient(180deg,rgba(200,220,200,0.15),rgba(200,220,200,0.08));border-radius:0 0 20px 20px}
.mochi-name{position:absolute;top:8px;left:12px;font-size:10px;color:var(--text-l);font-family:"Cormorant Garamond",serif;font-style:italic;letter-spacing:0.5px}
.mochi-status{position:absolute;top:8px;right:12px;font-size:9px;color:var(--text-l);opacity:0.7}
.mochi-body{position:absolute;bottom:10px;transition:left 2s ease-in-out,transform 0.3s ease}
.mochi-body.bounce{animation:mochiBounce 0.4s ease}
.mochi-body.walk{animation:mochiWalk 0.6s ease-in-out infinite}
.mochi-body.sleep{opacity:0.8}
.mochi-zzz{position:absolute;top:-8px;right:-6px;font-size:9px;animation:mochiFloat 1.5s ease-in-out infinite;color:var(--text-l)}
.mochi-bubble{position:absolute;top:-32px;left:50%;transform:translateX(-50%);background:rgba(255,255,255,0.85);border:1px solid var(--glass-border);border-radius:10px;padding:3px 8px;font-size:9px;color:var(--text-m);white-space:nowrap;opacity:0;transition:opacity 0.3s;pointer-events:none}
.mochi-bubble.show{opacity:1}
.mochi-heart{position:absolute;pointer-events:none;font-size:12px;animation:mochiHeartUp 0.8s ease-out forwards}
@keyframes mochiBounce{0%{transform:scaleX(1) scaleY(1)}30%{transform:scaleX(1.15) scaleY(0.85)}60%{transform:scaleX(0.9) scaleY(1.1)}100%{transform:scaleX(1) scaleY(1)}}
@keyframes mochiWalk{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes mochiFloat{0%,100%{transform:translateY(0);opacity:0.5}50%{transform:translateY(-6px);opacity:1}}
@keyframes mochiHeartUp{0%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-30px) scale(0.5)}}
#bgLayer{position:fixed;inset:0;z-index:-2;background-size:cover;background-position:center;background-repeat:no-repeat;pointer-events:none}
input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:white;border:2px solid #A5ACBF;box-shadow:0 2px 8px rgba(149,164,193,0.15);cursor:pointer}
/* ═══ LEDGER ═══ */
.ledger-page{padding:0}
.ledger-hdr{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:16px}
.ledger-month{font-family:"Cormorant Garamond",serif;font-size:18px;color:var(--text);letter-spacing:1px}
.ledger-nav{background:none;border:none;font-size:22px;color:var(--text-l);cursor:pointer;padding:4px 10px}
.ledger-summary{background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1.5px solid var(--glass-border);border-radius:28px;padding:24px 20px;box-shadow:var(--shadow-lg);margin-bottom:20px;text-align:center;position:relative;overflow:hidden}
.ledger-summary::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#EFE4E9,#EDE6EE,#DEEBF4)}
.ledger-total{font-family:"Cormorant Garamond",serif;font-size:36px;font-weight:300;color:var(--rose-deep)}
.ledger-total-label{font-size:10px;color:var(--text-l);letter-spacing:2px;margin-bottom:4px}
.ledger-cat-summary{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:12px}
.ledger-cat-chip{font-size:11px;padding:4px 10px;border-radius:20px;background:rgba(239,228,233,0.4);color:var(--text-m)}
.ledger-add-bar{display:flex;gap:8px;margin-bottom:12px}
.ledger-add-bar input{flex:1;padding:12px 16px;border:1.5px solid var(--border);border-radius:18px;background:rgba(255,255,255,0.6);font-size:14px;color:var(--text);font-family:"Noto Sans SC",sans-serif;transition:all 0.3s}
.ledger-add-bar input:focus{border-color:var(--rose-deep);background:white;box-shadow:0 0 0 4px rgba(165,172,191,0.12)}
.ledger-add-bar input[type="number"]{max-width:90px}
.ledger-add-btn{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#EFE4E9,#D0D2DB);color:white;border:none;font-size:20px;cursor:pointer;box-shadow:0 2px 12px rgba(165,172,191,0.18);flex-shrink:0}
.ledger-cats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.ledger-cat-btn{padding:6px 12px;border-radius:20px;border:1.5px solid var(--border);background:var(--card);font-size:12px;color:var(--text-m);cursor:pointer;transition:all 0.2s}
.ledger-cat-btn.sel{border-color:var(--rose-deep);color:var(--rose-deep);background:rgba(239,228,233,0.45)}
.ledger-list{display:flex;flex-direction:column;gap:8px}
.ledger-item{display:flex;align-items:center;padding:16px 18px;background:var(--card);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:22px;box-shadow:var(--shadow);margin-bottom:8px;transition:transform 0.2s}
.ledger-item:active{transform:scale(0.98)}
.ledger-item-icon{font-size:18px;margin-right:10px}
.ledger-item-info{flex:1}
.ledger-item-note{font-size:13px;color:var(--text)}
.ledger-item-meta{font-size:10px;color:var(--text-l);margin-top:2px}
.ledger-item-amt{font-family:"Cormorant Garamond",serif;font-size:18px;color:var(--rose-deep);margin-left:8px}
.ledger-item-del{background:none;border:none;color:var(--text-l);font-size:14px;margin-left:8px;cursor:pointer;padding:4px}
.ledger-day-hdr{font-size:11px;color:var(--text-l);margin:12px 0 6px 4px;font-family:"Cormorant Garamond",serif}




/* ═══ POMODORO ═══ */
.pomo-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:calc(100vh - 160px);gap:32px;padding:20px 0}
.pomo-visual{position:relative;width:240px;height:240px;display:flex;align-items:center;justify-content:center}
.pomo-bg-art{position:absolute;inset:0;animation:pomoFloat 20s ease-in-out infinite}
.pomo-bloom{width:100%;height:100%;opacity:0.6}
@keyframes pomoFloat{0%,100%{transform:rotate(0deg) scale(1)}50%{transform:rotate(180deg) scale(1.05)}}
.pomo-ring{position:absolute;width:200px;height:200px;filter:drop-shadow(0 0 12px rgba(180,160,200,0.2))}
.pomo-time-wrap{text-align:center;z-index:2}
.pomo-time{font-family:"Cormorant Garamond",serif;font-size:48px;font-weight:300;color:var(--text);letter-spacing:-1px;line-height:1}
.pomo-phase{font-size:11px;color:var(--text-l);letter-spacing:3px;text-transform:uppercase;margin-top:6px;font-weight:300}
.pomo-progress{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:200px}
.pomo-dots{display:flex;gap:20px}
.pomo-dot{width:32px;height:32px;border-radius:50%;background:var(--card);border:1.5px solid rgba(200,180,210,0.3);display:flex;align-items:center;justify-content:center;transition:all 0.4s ease;box-shadow:var(--shadow)}
.pomo-dot.active{border-color:rgba(180,140,200,0.6);background:linear-gradient(135deg,rgba(212,168,200,0.15),rgba(184,160,212,0.15));box-shadow:0 0 16px rgba(165,172,191,0.15)}
.pomo-dot.done{border-color:rgba(136,196,168,0.5);background:linear-gradient(135deg,rgba(136,196,168,0.15),rgba(160,200,180,0.1))}
.pomo-dot-num{font-family:"Cormorant Garamond",serif;font-size:13px;color:var(--text-l);font-weight:400}
.pomo-dot.active .pomo-dot-num{color:var(--lav-deep)}
.pomo-dot.done .pomo-dot-num{color:var(--mint-deep)}
.pomo-progress-line{width:100%;height:2px;background:rgba(200,180,210,0.12);border-radius:1px;overflow:hidden;margin-top:4px}
.pomo-progress-fill{height:100%;width:0%;background:linear-gradient(90deg,#BDBBBF,#A5ACBF,#93A4C1);border-radius:1px;transition:width 0.3s ease}
.pomo-controls{display:flex;align-items:center;gap:24px}
.pomo-ctrl{border:none;cursor:pointer;border-radius:50%;transition:all 0.2s ease;display:flex;align-items:center;justify-content:center}
.pomo-ctrl:active{transform:scale(0.92)}
.pomo-secondary{width:44px;height:44px;background:var(--card);border:1px solid var(--glass-border);color:var(--text-l);box-shadow:var(--shadow)}
.pomo-secondary:hover{color:var(--text)}
.pomo-primary{width:60px;height:60px;background:linear-gradient(135deg,#BDBBBF,#A5ACBF);color:#fff;box-shadow:0 6px 24px rgba(180,160,200,0.25)}
.pomo-primary.running{background:linear-gradient(135deg,#C8B8B0,#B0AEA4);box-shadow:0 6px 24px rgba(160,150,140,0.2)}
.pomo-quote{font-size:12px;color:var(--text-l);font-style:italic;text-align:center;max-width:220px;line-height:1.6;opacity:0.7}

/* ═══ iOS-style pageable home app grid ═══ */
.app-home-shell{position:relative;margin-top:18px;overflow:hidden}
.app-grid.app-pager{display:flex;grid-template-columns:none;gap:0;margin:0;padding:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:auto}
.app-grid.app-pager::-webkit-scrollbar{display:none}
.app-page{box-sizing:border-box;flex:0 0 100%;width:100%;min-width:100%;min-height:284px;padding:0 4px 4px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,88px);gap:8px 14px;align-content:start;scroll-snap-align:start;scroll-snap-stop:always}
.app-page .app-btn{position:relative;min-width:0;height:88px;box-sizing:border-box;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.app-pager-controls{position:relative;height:28px;display:flex;align-items:center;justify-content:center;margin-top:1px}
.app-page-dots{height:28px;display:flex;align-items:center;justify-content:center;gap:7px;padding:0 42px}
.app-page-dots i{display:block;width:6px;height:6px;border-radius:999px;background:var(--text-l);opacity:.32;transition:width .2s ease,opacity .2s ease,background .2s ease;cursor:pointer}
.app-page-dots i.active{width:17px;opacity:.72;background:var(--text-m)}
.app-edit-button{position:absolute;right:5px;top:2px;height:24px;padding:0 9px;border:1px solid var(--glass-border);border-radius:9px;background:rgba(255,255,255,.36);color:var(--text-l);font:500 10px/1 "Noto Sans SC",sans-serif;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.app-edit-button.done{color:var(--text-m);background:rgba(255,255,255,.62)}
.home-app-editing .app-grid.app-pager{overflow-x:hidden;scroll-snap-type:none;touch-action:pan-x}
.home-app-dragging .app-grid.app-pager{touch-action:none}
.home-app-editing .app-page .app-btn{animation:homeAppWiggle .28s ease-in-out infinite alternate;cursor:grab}
.home-app-editing .app-page .app-btn:nth-child(even){animation-delay:-.14s;animation-direction:alternate-reverse}
.home-app-editing .app-btn:active{transform:none}
.home-app-editing .app-btn.drag-source{opacity:.22;animation:none}
.app-drag-ghost{position:fixed!important;z-index:10050!important;width:92px!important;height:88px!important;margin:0!important;transform:translate(-50%,-52%) scale(1.08)!important;pointer-events:none!important;opacity:.96!important;animation:none!important;filter:drop-shadow(0 10px 14px rgba(75,70,80,.18));transition:none!important}
@keyframes homeAppWiggle{from{transform:rotate(-1.15deg) translateY(-.5px)}to{transform:rotate(1.15deg) translateY(.5px)}}
@media (prefers-reduced-motion:reduce){.home-app-editing .app-page .app-btn{animation:none}.app-grid.app-pager{scroll-behavior:auto}}

/* iOS: native pager/tap path; custom icon drag is intentionally disabled. */
@supports (-webkit-touch-callout:none){.app-page .app-btn{touch-action:auto}.app-edit-button[hidden]{display:none!important}}
.desktop-hdr{padding:calc(env(safe-area-inset-top) + 10px) 0 8px;margin-bottom:8px;text-align:center}.desktop-date{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;font-weight:400;font-size:.78rem;letter-spacing:.22em;color:rgba(185,190,198,.96);margin-bottom:8px;text-transform:uppercase;text-shadow:0 1px 4px rgba(255,255,255,.45)}.desktop-time{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;font-weight:500;font-size:clamp(3.2rem,16vw,5.4rem);letter-spacing:-.04em;line-height:.95;font-variant-numeric:tabular-nums lining-nums;color:#fff;text-shadow:0 2px 10px rgba(40,48,62,.28)}.desktop-hdr .hdr-sub{display:none}.desktop-hdr h1{display:none}@media(min-width:700px){.desktop-time{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;font-weight:500;font-size:clamp(3.2rem,16vw,5.4rem);letter-spacing:-.04em;line-height:.95;font-variant-numeric:tabular-nums lining-nums;color:#fff;text-shadow:0 2px 10px rgba(40,48,62,.28)}}
/* State is an APP page, not homepage clutter */
#p-state{padding-bottom:20px}.page-head{display:flex;align-items:center;justify-content:center;position:relative;margin:4px 0 22px;padding:10px 0}.page-title{font-size:18px;font-weight:500;color:var(--text-m);letter-spacing:.12em}.back-btn{position:absolute;left:0;border:0;background:none;color:var(--text-m);padding:7px}.back-btn svg{display:block}#stateAppContent #bodyStateBtn,#stateAppContent #psycheStateBtn,#stateAppContent #arousalStateBtn{display:flex!important;margin:0 0 16px!important;min-height:112px;border-radius:24px!important;padding:22px 20px!important;background:rgba(255,255,255,.58)!important;border:1px solid rgba(239,228,233,.9)!important;box-shadow:0 8px 26px rgba(150,135,150,.09)!important}#stateAppContent #arousalStateBtn{margin-bottom:0!important}
/* State page is a real page; keep its cards above the desktop layer and clickable. */
#p-state{position:relative;z-index:2;pointer-events:auto}#p-state #stateAppContent{position:relative;z-index:3;pointer-events:auto}#stateAppContent>div{pointer-events:auto}
/* pager integrity fix */
.app-home-shell{display:block!important;width:100%!important;max-width:100%!important;overflow:hidden!important}.app-grid.app-pager{display:flex!important;width:100%!important;max-width:100%!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;gap:0!important}.app-grid.app-pager>.app-page{display:grid!important;flex:0 0 100%!important;width:100%!important;min-width:100%!important;max-width:100%!important}
/* Keep the home screen clean: remove the old days-together and health summary blocks. */
#p-home>.hero,#p-home>.health-strip{display:none!important}
/* Restore the floating bottom navigation on the home shell. */
.tab-bar{position:fixed!important;left:12px!important;right:12px!important;bottom:calc(env(safe-area-inset-bottom) + 10px)!important;z-index:1000!important;display:flex!important;align-items:center!important;justify-content:space-around!important;border:1px solid rgba(255,255,255,.72)!important;border-radius:24px!important;padding:7px 6px!important;box-shadow:0 10px 30px rgba(100,105,120,.13)!important;background:rgba(255,255,255,.64)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important}
/* Move only the APP block downward; keep clock, background and dock unchanged. */
#p-home>.app-home-shell{margin-top:48px!important}
/* Position only the APP pager above the floating dock; the date/time stays where it is. */
#p-home>.app-home-shell{position:fixed!important;left:16px!important;right:16px!important;bottom:calc(env(safe-area-inset-bottom) + 92px)!important;width:auto!important;margin:0!important;z-index:20!important}
#p-home>.app-home-shell .app-page{min-height:284px!important}

/* Keep the home clock/date pinned while the document or app pager moves. */
#p-home>.desktop-hdr{position:fixed!important;top:calc(env(safe-area-inset-top) + 4px)!important;left:0!important;right:0!important;z-index:30!important;pointer-events:none!important}
#p-home>.desktop-hdr .desktop-date,#p-home>.desktop-hdr .desktop-time{pointer-events:none!important}

/* Pin date/time to the viewport on the home page. */
#p-home>.desktop-hdr{position:fixed!important;top:calc(env(safe-area-inset-top) + 4px)!important;left:0!important;right:0!important;margin:0!important;z-index:30!important;pointer-events:none!important}
#p-home>.desktop-hdr .desktop-date,#p-home>.desktop-hdr .desktop-time{pointer-events:none!important}

/* Small realistic pink stationery note under the clock. */
.daily-note-widget{position:fixed!important;top:calc(env(safe-area-inset-top) + 150px)!important;left:50%!important;transform:translateX(-50%) rotate(-.6deg)!important;width:min(78vw,310px)!important;min-height:58px!important;padding:18px 18px 12px!important;box-sizing:border-box!important;background:#fde8f1!important;border:1px solid rgba(224,170,195,.78)!important;border-radius:3px 5px 4px 2px!important;box-shadow:2px 7px 14px rgba(120,90,105,.18),inset 0 0 18px rgba(255,255,255,.5)!important;z-index:25!important;pointer-events:none!important;display:block!important}
.daily-note-tape{position:absolute!important;top:-9px!important;left:50%!important;width:68px!important;height:18px!important;transform:translateX(-50%) rotate(-2deg)!important;background:rgba(228,190,205,.78)!important;box-shadow:0 1px 3px rgba(100,70,85,.12)!important}
.daily-note-widget .daily{font-family:"Kaiti SC","STKaiti","KaiTi",cursive!important;font-size:14px!important;line-height:1.65!important;color:#715e67!important;margin:0!important;padding:0!important;background:none!important;border:0!important;font-style:normal!important;min-height:22px!important}
.daily-note-widget .daily:empty:before{content:"今天也要记得照顾好自己";color:#9c7b88}
.daily-note-widget .daily-from{font-family:"Kaiti SC","STKaiti","KaiTi",cursive!important;font-size:10px!important;color:#a68c97!important;margin-top:5px!important;text-align:right!important}

/* Softer frosted-glass stationery note. */
.daily-note-widget{background:rgba(255,241,247,.58)!important;background-image:linear-gradient(145deg,rgba(255,255,255,.68),rgba(255,232,242,.38))!important;border:1px solid rgba(255,255,255,.74)!important;box-shadow:2px 7px 16px rgba(122,102,113,.12),inset 0 0 20px rgba(255,255,255,.42)!important;-webkit-backdrop-filter:blur(14px) saturate(115%)!important;backdrop-filter:blur(14px) saturate(115%)!important}
.daily-note-tape{background:rgba(245,214,228,.48)!important;box-shadow:0 1px 4px rgba(120,90,105,.08)!important}
.daily-note-widget .daily{color:#806d76!important}.daily-note-widget .daily:empty:before{color:#ad929e!important}.daily-note-widget .daily-from{color:#b39ca6!important}

/* Movable note widget and reserved space for future widgets on page two. */
.daily-note-widget{touch-action:none!important;cursor:grab!important;user-select:none!important;-webkit-user-select:none!important}
.daily-note-widget.is-dragging{cursor:grabbing!important;transition:none!important}
.home-widget-slot{grid-column:1/-1;grid-row:1/2;min-height:76px;border:1px dashed rgba(255,255,255,.48);border-radius:14px;background:rgba(255,255,255,.08);pointer-events:none}


/* Keep the first app page at its original position. */
#p-home>.app-home-shell{margin-top:48px!important}
#p-home>.app-home-shell .app-page{min-height:284px!important}
.daily-note-widget{touch-action:none!important;-webkit-touch-callout:none!important;cursor:grab!important}
.daily-note-widget.is-dragging{cursor:grabbing!important}


/* Full-screen home paging; the header and note remain viewport-pinned. */
#p-home{min-height:100vh;overflow:hidden!important}
#p-home>.app-home-shell{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;margin:0!important;padding:0!important;overflow:hidden!important;z-index:10!important}
#p-home>.app-home-shell .app-grid.app-pager{height:100vh!important;width:100vw!important;overflow-x:auto!important;overflow-y:hidden!important;touch-action:pan-x!important}
#p-home>.app-home-shell .app-page{height:100vh!important;min-height:100vh!important;padding:calc(env(safe-area-inset-top) + 235px) 20px calc(env(safe-area-inset-bottom) + 125px)!important;box-sizing:border-box!important;align-content:start!important}
#p-home>.app-home-shell .app-pager-controls{position:absolute!important;left:0!important;right:0!important;bottom:calc(env(safe-area-inset-bottom) + 82px)!important;z-index:12!important}
.daily-note-widget{touch-action:none!important;cursor:default!important}
.daily-note-widget.is-long-press{cursor:grab!important}
.daily-note-widget.is-dragging{cursor:grabbing!important}

/* Home behaves like a phone desktop: horizontal pages fill the viewport. */
#p-home{min-height:100vh;overflow:hidden!important}
#p-home>.app-home-shell{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;margin:0!important;padding:0!important;overflow:hidden!important;z-index:10!important}
#p-home>.app-home-shell .app-grid.app-pager{width:100vw!important;height:100vh!important;overflow-x:auto!important;overflow-y:hidden!important;touch-action:pan-x!important;scroll-snap-type:x mandatory!important}
#p-home>.app-home-shell .app-page{height:100vh!important;min-height:100vh!important;padding:calc(env(safe-area-inset-top) + 238px) 20px calc(env(safe-area-inset-bottom) + 125px)!important;box-sizing:border-box!important}
#p-home>.app-home-shell .app-pager-controls{position:absolute!important;left:0!important;right:0!important;bottom:calc(env(safe-area-inset-bottom) + 82px)!important;z-index:12!important}
.daily-note-widget{touch-action:pan-y!important;pointer-events:auto!important;cursor:default!important}
.daily-note-widget.is-long-press{cursor:grab!important}
.daily-note-widget.is-dragging{cursor:grabbing!important;touch-action:none!important}

/* Final home desktop layout: keep the first page's app grid in the lower dock area. */
#p-home>.app-home-shell{top:auto!important;bottom:calc(env(safe-area-inset-bottom) + 92px)!important;height:330px!important;inset-inline:16px!important;width:auto!important;padding:0!important;overflow:hidden!important}
#p-home>.app-home-shell .app-grid.app-pager{height:330px!important;width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;touch-action:pan-x!important}
#p-home>.app-home-shell .app-page{height:330px!important;min-height:330px!important;padding:0 4px 4px!important;align-content:start!important}
#p-home>.app-home-shell .app-pager-controls{position:absolute!important;left:0!important;right:0!important;bottom:-30px!important}

/* The note owns its gesture after a long press; the pager must not consume it. */
.daily-note-widget{pointer-events:auto!important;touch-action:none!important;cursor:default!important;-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none!important}
.daily-note-widget.is-long-press{cursor:grab!important}
.daily-note-widget.is-dragging{cursor:grabbing!important;z-index:40!important}

/* Full-screen desktop paging: date and note travel with each page. */
#p-home{height:100vh!important;min-height:100vh!important;overflow:hidden!important}
#p-home>.app-home-shell{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;margin:0!important;padding:0!important;overflow:hidden!important;z-index:10!important}
#p-home>.app-home-shell .app-grid.app-pager{width:100vw!important;height:100vh!important;overflow-x:auto!important;overflow-y:hidden!important;touch-action:pan-x!important;scroll-snap-type:x mandatory!important}
#p-home>.app-home-shell .app-page{height:100vh!important;min-height:100vh!important;padding:calc(env(safe-area-inset-top) + 238px) 20px calc(env(safe-area-inset-bottom) + 125px)!important;box-sizing:border-box!important}
#p-home>.desktop-hdr{position:absolute!important;top:calc(env(safe-area-inset-top) + 4px)!important;left:0!important;right:0!important;z-index:30!important;pointer-events:none!important}
.daily-note-widget{position:absolute!important;top:calc(env(safe-area-inset-top) + 150px)!important;left:50%!important;z-index:31!important;pointer-events:auto!important;touch-action:none!important}
#p-home>.app-home-shell .app-pager-controls{position:absolute!important;left:0!important;right:0!important;bottom:calc(env(safe-area-inset-bottom) + 82px)!important;z-index:12!important}


/* Unified desktop pager: header, note and apps are children of the same page. */
#p-home{height:100vh!important;min-height:100vh!important;overflow:hidden!important}
#p-home>.app-home-shell{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;margin:0!important;padding:0!important;overflow:hidden!important;z-index:10!important}
#p-home>.app-home-shell .app-grid.app-pager{width:100vw!important;height:100vh!important;overflow-x:auto!important;overflow-y:hidden!important;touch-action:pan-x!important;scroll-snap-type:x mandatory!important}
#p-home>.app-home-shell .app-page{position:relative!important;height:100vh!important;min-height:100vh!important;padding:calc(env(safe-area-inset-top) + 285px) 20px calc(env(safe-area-inset-bottom) + 125px)!important;box-sizing:border-box!important;align-content:start!important}
#p-home>.app-home-shell .app-page>.desktop-hdr{position:absolute!important;top:calc(env(safe-area-inset-top) + 4px)!important;left:0!important;right:0!important;margin:0!important;z-index:30!important;pointer-events:none!important}
#p-home>.app-home-shell .app-page>.daily-note-widget{position:absolute!important;top:calc(env(safe-area-inset-top) + 150px)!important;left:50%!important;z-index:31!important;pointer-events:auto!important}
#p-home>.app-home-shell .app-pager-controls{position:absolute!important;left:0!important;right:0!important;bottom:calc(env(safe-area-inset-bottom) + 82px)!important;z-index:12!important}

/* Pager final authority: the first page owns its header and note. */
#p-home>.app-home-shell .app-page>.desktop-hdr{display:block!important;position:absolute!important;top:calc(env(safe-area-inset-top) + 4px)!important;left:0!important;right:0!important;margin:0!important}
#p-home>.app-home-shell .app-page>.daily-note-widget{display:block!important;position:absolute!important;top:calc(env(safe-area-inset-top) + 150px)!important;left:50%!important;margin:0!important;transform:translateX(-50%) rotate(-.6deg)!important}

/* The homepage note is data-only: no invented placeholder text. */
.daily-note-widget .daily:empty:before{content:none!important}
.daily-note-widget{display:none!important}
.daily-note-widget[style*="display: block"]{display:block!important}

/* Lower the app grid so it sits just above the bottom navigation. */
#p-home>.app-home-shell{bottom:calc(env(safe-area-inset-bottom) + 58px)!important}
#p-home>.app-home-shell .app-pager-controls{bottom:-26px!important}

/* APP ONLY: move app buttons downward; date and daily note are intentionally untouched. */
#p-home>.app-home-shell .app-page>.app-btn{position:relative!important;top:38px!important}

/* Small visual refinement only: compact note, larger date. Positions unchanged. */
.daily-note-widget{width:min(70vw,270px)!important;min-height:48px!important;padding:13px 14px 9px!important}
.daily-note-widget .daily{font-size:12px!important;line-height:1.5!important}
.daily-note-widget .daily-from{font-size:9px!important;margin-top:3px!important}
#p-home>.app-home-shell .app-page>.desktop-hdr .desktop-date{font-size:.96rem!important;letter-spacing:.18em!important}

/* 20260913: preserve homepage daily note visibility above the app pager */
#p-home > .daily-note-widget {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 40 !important;
  pointer-events: auto !important;
}

/* Final homepage layering: daily note must remain visible above the fixed app pager. */
#p-home > .daily-note-widget {
  position: fixed !important;
  top: calc(env(safe-area-inset-top) + 112px) !important;
  left: 50% !important;
  transform: translateX(-50%) rotate(-0.6deg) !important;
  width: min(86vw, 360px) !important;
  min-height: 74px !important;
  z-index: 200 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* definitive web.puppykiki.top homepage note visibility */
#p-home > .daily-note-widget{display:block!important;visibility:visible!important;opacity:1!important;position:fixed!important;top:calc(env(safe-area-inset-top) + 112px)!important;left:50%!important;transform:translateX(-50%) rotate(-.6deg)!important;z-index:9999!important;width:min(86vw,360px)!important;min-height:74px!important}

/* FINAL: web.puppykiki.top only — homepage sticky note visibility */
#p-home > .daily-note-widget{display:block!important;visibility:visible!important;opacity:1!important;position:fixed!important;top:calc(env(safe-area-inset-top) + 112px)!important;left:50%!important;transform:translateX(-50%) rotate(-.6deg)!important;width:min(86vw,360px)!important;min-height:74px!important;padding:28px 18px 14px!important;z-index:99999!important;background:rgba(255,253,253,.95)!important;border-radius:2px!important;box-shadow:0 12px 30px rgba(90,75,85,.16)!important}
#p-home > .daily-note-widget .daily{display:block!important;min-height:24px!important;color:#5e555b!important;font-size:14px!important;line-height:1.65!important}
#p-home > .daily-note-widget .daily:empty:before{content:"今天也要记得照顾好自己。"!important;color:#9b8e96!important}
#p-home > .daily-note-widget .daily-from{display:block!important;color:#9b8e96!important;font-size:11px!important;margin-top:5px!important}

/* HARD FIX: server-rendered note and plain Gateway link */
#p-home > .daily-note-widget{display:block!important;visibility:visible!important;opacity:1!important;position:fixed!important;top:calc(env(safe-area-inset-top) + 112px)!important;left:50%!important;transform:translateX(-50%) rotate(-.6deg)!important;width:min(86vw,360px)!important;min-height:74px!important;padding:28px 18px 14px!important;z-index:99999!important;background:rgba(255,253,253,.96)!important;color:#5e555b!important}
#p-home > .daily-note-widget .daily{display:block!important;visibility:visible!important;opacity:1!important;color:#5e555b!important;min-height:24px!important;font-size:14px!important;line-height:1.65!important}
#p-home > .daily-note-widget .daily-from{display:block!important;visibility:visible!important;opacity:1!important;color:#9b8e96!important}
#p-home a.app-btn[href="/memory-gateway"]{display:flex!important;text-decoration:none!important;cursor:pointer!important}

/* stable homepage note: do not let legacy JS hide the server-rendered fallback */
#p-home > .daily-note-widget{display:block!important;visibility:visible!important;opacity:1!important;z-index:99999!important}
#p-home > .daily-note-widget .daily{display:block!important;visibility:visible!important;opacity:1!important;color:#5e555b!important;min-height:24px!important}
#p-home > .daily-note-widget .daily-from{display:block!important;visibility:visible!important;opacity:1!important}
#p-home #dailyNoteWidget{display:block!important;visibility:visible!important;opacity:1!important;z-index:9999!important}
#p-home #dailyNoteWidget #dailyNote,#p-home #dailyNoteWidget #dailyFrom{display:block!important;visibility:visible!important;opacity:1!important}
