:root{--bg:#2b1c18;--bg2:#38251f;--card:#f5e9d5;--card2:#e9d6b9;--ink:#392720;--muted:#a98e78;--accent:#dba97d;--line:rgba(255,239,215,.13)}
*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;min-width:0;color:#f8ead7;background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.app-shell{width:100%;max-width:480px;min-height:100svh;min-height:100dvh;margin:auto;background:var(--bg);position:relative;padding-bottom:calc(72px + env(safe-area-inset-bottom))}.content{padding:calc(18px + env(safe-area-inset-top)) 22px 20px}.eyebrow{margin:0;color:#d2aa83;font-size:11px;font-weight:700;letter-spacing:2.2px}.hero-title{font-family:Georgia,"Songti SC",serif;font-weight:600;letter-spacing:1px;font-size:35px;line-height:1.2;margin:12px 0 6px}.hero-sub{margin:0;color:#c9b29e;font-size:13px;line-height:1.6}.hero{padding:18px 4px 20px;position:relative}.hero::after{position:absolute;right:5px;transform:rotate(-15deg)}.calendar-card{background:var(--card);color:var(--ink);border-radius:27px;padding:22px 17px 17px;box-shadow:0 11px 30px rgba(17,9,7,.13)}.month-row{display:flex;align-items:center;justify-content:space-between;padding:0 5px 16px}.month-row h2{font-size:20px;letter-spacing:.4px;margin:0}.month-row small{display:block;color:#a1846a;font-size:10px;letter-spacing:1.5px;font-weight:700;margin-top:2px}.month-actions{display:flex;gap:6px}.round-button{border:1px solid #e7d4ba;border-radius:50%;width:34px;height:34px;background:transparent;color:var(--ink);font-size:20px;line-height:1}.weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));text-align:center}.weekdays{font-size:11px;color:#a98d72;padding:9px 0 8px;border-top:1px solid #e8d8c4}.weekdays span:last-child,.weekdays span:nth-last-child(2){color:#bf9574}.day-cell{height:52px;border:0;background:transparent;color:var(--ink);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:6px 0 0;gap:1px;position:relative}.day-cell .number{font-size:13px;font-weight:600;line-height:17px}.day-cell .sticker{font-size:20px;line-height:23px;filter:drop-shadow(0 2px 1px rgba(63,35,20,.13))}.day-cell.today .number{color:#a95f3f}.day-cell.today .number::after{content:"";display:block;width:3px;height:3px;background:#b26b48;border-radius:50%;margin:-1px auto 0}.day-cell.has-entry:hover,.day-cell:active{background:#ead8bf}.day-cell:focus-visible{outline-offset:-2px}.day-cell.empty{pointer-events:none}.calendar-note{display:flex;align-items:center;gap:8px;border-top:1px solid #e8d8c4;padding:14px 5px 1px;color:#9d7b61;font-size:11px}.calendar-note span{width:7px;height:7px;border-radius:50%;background:#ba7955}.section-heading{display:flex;align-items:end;justify-content:space-between;margin:24px 4px 13px}.section-heading h2{font-family:Georgia,"Songti SC",serif;font-size:21px;margin:0;font-weight:600}.section-heading small{font-size:11px;color:#b49a85}.featured-card{background:#4a3127;border:1px solid rgba(255,237,211,.08);border-radius:23px;padding:16px;display:flex;gap:15px;align-items:center;width:100%;color:#f8e9d2;text-align:left}.featured-sticker{width:68px;height:68px;flex:none;border-radius:19px;background:#eac8a4;display:grid;place-items:center;font-size:39px}.featured-copy{flex:1;min-width:0}.featured-copy small{font-size:10px;letter-spacing:1.3px;color:#d2a983}.featured-copy strong{display:block;font-size:16px;margin:6px 0 4px}.featured-copy p{margin:0;color:#c9ae99;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.featured-arrow{font-size:23px;color:#dbb08d}.add-cta{border:0;width:100%;margin-top:18px;background:#dfb184;color:#3b261e;border-radius:18px;min-height:54px;font-size:15px;font-weight:800;box-shadow:0 5px 0 #ae7959}.add-cta span{font-size:21px;vertical-align:-1px;margin-right:4px}.add-cta:active{transform:translateY(3px);box-shadow:0 2px 0 #ae7959}.bottom-nav{position:fixed;z-index:20;left:50%;bottom:0;transform:translateX(-50%);width:min(100%,480px);height:calc(72px + env(safe-area-inset-bottom));padding:5px 25px env(safe-area-inset-bottom);background:#321f1b;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-around}.nav-item{border:0;background:none;color:#a98d79;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:74px;padding:4px;font-size:10px}.nav-item.active{color:#efc89f}.nav-icon{font-size:25px;line-height:26px}.nav-add{border:0;border-radius:16px;width:48px;height:48px;background:#e1b184;color:#36221c;display:grid;place-items:center;font-size:30px;line-height:1;transform:translateY(-3px);box-shadow:0 5px 0 #9c694e}.nav-add:active{transform:translateY(0);box-shadow:0 2px 0 #9c694e}.page-head{display:flex;gap:13px;align-items:center;margin:13px 0 22px}.back-button{border:1px solid var(--line);background:#432b23;color:#f7e6d0;border-radius:14px;width:42px;height:42px;font-size:22px;flex:none}.page-head h1{font-family:Georgia,"Songti SC",serif;font-size:28px;font-weight:600;margin:0}.page-head p{margin:3px 0 0;color:#b99e88;font-size:12px}.date-banner{border-radius:24px;background:#e4ba8e;color:#42291e;padding:20px 21px;display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.date-banner .day-big{font-family:Georgia,serif;font-size:49px;line-height:1}.date-banner p{margin:4px 0 0;font-size:12px}.date-banner .banner-art{font-size:42px;filter:drop-shadow(2px 4px 1px #b9875f)}.detail-list{display:grid;gap:12px}.entry-card{width:100%;border:0;background:var(--card);border-radius:23px;padding:14px;display:flex;text-align:left;gap:14px;align-items:center;color:var(--ink)}.entry-sticker{width:64px;height:64px;flex:none;background:#e8d3b3;border-radius:17px;display:grid;place-items:center;font-size:38px}.entry-copy{flex:1;min-width:0}.entry-copy small{color:#a2846c;font-size:11px}.entry-copy strong{display:block;margin:5px 0;font-size:16px}.entry-copy p{color:#8f715d;font-size:11px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.entry-card .arrow{font-size:22px;color:#a58166}.empty-state{background:#443027;border-radius:23px;text-align:center;padding:30px 20px;color:#d4b9a0}.empty-state .empty-icon{font-size:44px}.empty-state strong{display:block;color:#f5dfc2;margin-top:10px}.empty-state p{font-size:12px;line-height:1.6;margin:7px 0 0}.soft-button{background:#4a3127;border:1px solid var(--line);border-radius:15px;padding:13px 18px;color:#e8c4a2;font-weight:700;margin-top:19px}.form{display:grid;gap:19px}.field-label{display:block;color:#f2dcc2;font-size:13px;font-weight:700;margin:0 0 9px}.photo-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.photo-tile{height:104px;background:#432c24;border:1px dashed #866048;border-radius:20px;color:#e8c6a4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.photo-tile .tile-icon{font-size:26px}.photo-tile span:last-child{font-size:12px;font-weight:700}.field{width:100%;border:1px solid #d7bfa3;background:#f6ead8;color:var(--ink);border-radius:16px;padding:15px 16px;min-height:52px;outline:none;font-size:16px}.field::placeholder{color:#ae937b}.field:focus{border-color:#ad704f}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.two-fields .field{font-size:13px;padding:13px 9px;min-width:0}.sticker-row{display:flex;gap:8px;overflow-x:auto;padding:1px 2px 7px;scrollbar-width:none}.sticker-row::-webkit-scrollbar{display:none}.sticker-option{flex:none;width:50px;height:50px;border-radius:15px;border:1px solid #76513e;background:#432c24;font-size:26px}.sticker-option.selected{background:#eed4b2;border-color:#eed4b2;transform:translateY(-2px)}.mood-row{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.mood-option{background:#432c24;border:1px solid #664739;border-radius:15px;color:#cdb19b;padding:9px 0 8px;min-width:0}.mood-option.selected{background:#efd5b5;color:#42291e;border-color:#efd5b5}.mood-option span{display:block;font-size:24px;line-height:29px}.mood-option small{font-size:10px;white-space:nowrap}.field.textarea{resize:vertical;min-height:94px;line-height:1.5}.form .add-cta{margin-top:0}.form-hint{font-size:11px;color:#a88973;text-align:center;margin:-6px 0 4px}.detail-overlay{position:fixed;z-index:50;inset:0;background:rgba(22,12,10,.72);display:flex;align-items:flex-end;justify-content:center}.detail-sheet{width:min(100%,480px);background:var(--card);color:var(--ink);border-radius:28px 28px 0 0;padding:24px 25px calc(29px + env(safe-area-inset-bottom));position:relative;max-height:85svh;overflow:auto}.sheet-close{position:absolute;right:20px;top:18px;border:0;border-radius:50%;background:#e8d5bb;color:var(--ink);width:33px;height:33px;font-size:20px}.sheet-sticker{width:100px;height:100px;background:#e7caa5;border-radius:27px;display:grid;place-items:center;font-size:62px;margin:4px 0 18px}.sheet-eyebrow{font-size:11px;letter-spacing:1.6px;color:#a47d60;font-weight:700}.detail-sheet h2{font-size:27px;margin:6px 0 7px}.sheet-mood{font-size:13px;color:#8c6d58}.sheet-text{line-height:1.75;border-top:1px solid #e1cbb0;margin-top:21px;padding-top:20px;font-size:15px;white-space:pre-wrap}.toast{position:fixed;z-index:70;left:50%;bottom:calc(89px + env(safe-area-inset-bottom));transform:translate(-50%,12px);background:#f5e2c6;color:#3d281f;border-radius:13px;padding:10px 16px;font-size:12px;box-shadow:0 8px 24px #1c100d88;opacity:0;pointer-events:none;transition:.2s;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:370px){.content{padding-left:17px;padding-right:17px}.calendar-card{padding-left:12px;padding-right:12px}.mood-option small{font-size:9px}}@media(min-width:481px){body{background:#211511}.app-shell{box-shadow:0 0 60px #0d0706}}

/* Food calendar and monthly collection. */
.app-shell:has(.hero) .content{padding-top:calc(14px + env(safe-area-inset-top))}
.app-shell:has(.hero) .section-heading{margin-top:20px}
.hero{padding:6px 4px 10px}
.hero-title{font-size:29px;line-height:1.16;margin:10px 0 7px}
.hero::after{content:"";width:37px;height:37px;top:8px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg stroke='%2399aa74' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M20 3v12M20 25v12M3 20h12M25 20h12M8 8l8 8M24 24l8 8M32 8l-8 8M16 24l-8 8'/%3E%3C/g%3E%3Ccircle cx='20' cy='20' r='2.3' fill='%2399aa74'/%3E%3C/svg%3E") center/contain no-repeat}
.calendar-card{background:#fffaf3;margin-inline:-4px;padding:17px 9px 15px}
.month-row{padding:0 6px 13px}
.food-showcase{height:128px;position:relative;isolation:isolate;overflow:hidden;border:1px solid #f0e5dc;border-radius:21px;background:#fffcf8;margin-bottom:14px}
.food-showcase::before{content:"";position:absolute;z-index:30;left:0;right:0;bottom:0;height:5px;background:#fffcf8;pointer-events:none}
.food-showcase::after{content:"";position:absolute;z-index:31;left:7%;right:7%;bottom:5px;height:1px;background:#eddcd0;pointer-events:none}
.showcase-label{position:absolute;z-index:20;top:13px;left:15px;color:#a27764;font-size:11px;letter-spacing:.5px;font-weight:700}
.showcase-label small{display:block;margin-top:3px;font-size:9px;letter-spacing:1.4px;color:#c4a898}
.showcase-empty{position:absolute;left:0;right:0;bottom:38px;text-align:center;color:#bb9987;font-size:12px}
.placed-food{position:absolute;display:grid;place-items:center;transform-origin:center bottom;pointer-events:none}
.showcase-food{display:block;width:var(--food-size);height:var(--food-size);font-size:var(--food-size)}
.showcase-food .food-art{width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain}
.showcase-food .food-art.emoji{display:flex;align-items:center;justify-content:center}
.food-art{display:block;width:100%;height:100%}
.food-art.emoji{text-align:center;line-height:1;filter:drop-shadow(0 3px 2px rgba(72,41,32,.18))}
.food-art.cutout{object-fit:contain;filter:drop-shadow(0 0 1px white) drop-shadow(0 1px 1px white) drop-shadow(0 3px 3px rgba(73,43,34,.2))}
.food-art.photo{object-fit:cover;border:2px solid #fff;border-radius:7px;box-shadow:0 2px 5px rgba(73,43,34,.2)}
.weekdays,.calendar-grid{gap:3px}
.weekdays{border:0;padding:2px 0 8px;color:#ab9b92}
.calendar-grid{overflow:hidden}
.day-cell{height:auto;aspect-ratio:1/1.08;min-width:0;padding:0;border-radius:16px;background:#fbefec;overflow:hidden;display:block;isolation:isolate}
.day-cell.empty{background:transparent}
.day-cell .number{position:absolute;z-index:30;top:6px;left:0;right:0;color:#b97867;font-size:11px;line-height:13px;text-align:center}
.day-cell.today::after{content:"";position:absolute;inset:0;z-index:40;border:1.5px solid #cd806c;border-radius:inherit;pointer-events:none}
.day-cell.today .number{color:#9d5b4b}
.day-cell.today .number::after{display:none}
.day-cell.has-entry:hover,.day-cell:active{background:#f5e3dd}
.day-stack{position:absolute;inset:19px 3px 3px;pointer-events:none;container-type:inline-size}
.day-food{width:40cqw;height:40cqw;font-size:40cqw}
.day-stack.stack-1 .day-food{width:56cqw;height:56cqw;font-size:56cqw}
.day-food:has(> img.cutout){display:block}
.day-food .food-art.cutout{min-width:0;min-height:0;max-width:100%;max-height:100%}
.day-stack.stack-2 .day-food{width:48cqw;height:48cqw;font-size:48cqw}
.day-stack.stack-3 .day-food{width:40cqw;height:40cqw;font-size:40cqw}
.day-count{position:absolute;z-index:20;bottom:0;left:50%;transform:translateX(-50%);color:#fff;font-size:10px;line-height:12px;font-weight:800;text-shadow:0 1px 3px #503126,1px 0 2px #503126,-1px 0 2px #503126}
.calendar-note{border-color:#f0e4dc;margin-top:12px;padding-top:12px}
.edit-entry{display:block;width:100%;border:0;border-radius:14px;background:#e5bd95;color:#43291f;font-size:13px;font-weight:700;margin-top:18px;padding:12px}
.delete-entry{display:block;width:100%;border:0;background:transparent;color:#a76655;font-size:13px;text-decoration:underline;text-underline-offset:3px;margin-top:14px;padding:9px}
.form{grid-template-columns:minmax(0,1fr)}
.two-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;width:100%;min-width:0}
.two-fields>div{min-width:0}
.picker-field{position:relative;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:7px;width:100%;min-width:0;min-height:52px;padding:0 12px;border:1px solid #d7bfa3;border-radius:16px;background:#f6ead8;color:var(--ink)}
.picker-field:focus-within{border-color:#ad704f}
.picker-value{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px;pointer-events:none}
.picker-icon{box-sizing:border-box;flex:none;width:18px;height:18px;stroke:#8f715d;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.picker-native{position:absolute;inset:0;box-sizing:border-box;width:100%;height:100%;min-width:0;margin:0;padding:0;border:0;opacity:0;cursor:pointer;font-size:16px}
.photo-row{grid-template-columns:repeat(2,minmax(0,1fr));min-width:0}
.photo-tile{position:relative;min-width:0;overflow:hidden;cursor:pointer}
.photo-tile:focus-within{outline:2px solid #e1b184;outline-offset:2px}
.photo-input{position:absolute;inset:0;box-sizing:border-box;width:100%;height:100%;min-width:0;margin:0;opacity:0;cursor:pointer}
.photo-preview{margin-top:12px;padding:10px;border:1px solid #76513e;border-radius:20px;background:#432c24}
.photo-preview[hidden]{display:none}
.photo-preview img{display:block;width:100%;height:190px;object-fit:contain;border-radius:13px;background:#35231f}
.photo-remove{display:block;margin:10px auto 0;padding:7px 12px;border:0;background:transparent;color:#e8c6a4;font-size:12px;text-decoration:underline;text-underline-offset:3px}
.sticker-special{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:2px;color:#e8c6a4}
.sticker-special.selected{color:#42291e}
.sticker-special .special-art{display:grid;place-items:center;width:31px;height:30px;font-size:23px;line-height:1}
.sticker-special small{font-size:8px;line-height:11px;white-space:nowrap;font-weight:700}
.sticker-special:disabled{cursor:progress;opacity:.8}
.cutout-thumb{display:block;width:30px;height:30px;object-fit:contain;filter:drop-shadow(0 1px 2px #3b261e66)}
.cutout-spinner{width:20px;height:20px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:cutout-spin .8s linear infinite}
@keyframes cutout-spin{to{transform:rotate(360deg)}}
.cutout-hint{margin:8px 2px 0;color:#c9ae99;font-size:11px;line-height:1.5}
.cutout-hint[hidden],.cutout-cancel[hidden],.emoji-picker[hidden]{display:none}
.cutout-cancel{margin:7px 2px 0;padding:5px 0;border:0;background:transparent;color:#e8c6a4;font-size:11px;text-decoration:underline;text-underline-offset:3px}
.emoji-picker{margin-top:10px;padding:10px;border:1px solid #76513e;border-radius:16px;background:#432c24}
.emoji-categories{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none}
.emoji-categories::-webkit-scrollbar{display:none}
.emoji-category{flex:none;border:0;border-radius:10px;padding:7px 9px;background:transparent;color:#c9ae99;font-size:11px}
.emoji-category.active{background:#eed4b2;color:#42291e;font-weight:700}
.emoji-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:2px;margin-top:9px}
.emoji-choice{min-width:0;height:38px;padding:0;border:0;border-radius:9px;background:transparent;font-size:23px;line-height:1}
.emoji-choice:active{background:#76513e}
.featured-sticker,.entry-sticker,.sheet-sticker{overflow:hidden}
.featured-sticker:has(.saved-cutout),.entry-sticker:has(.saved-cutout),.sheet-sticker:has(.saved-cutout){background:transparent}
.sheet-photo{display:block;width:100%;max-height:40svh;margin-top:18px;border-radius:16px;object-fit:contain;background:#ead8c3}
.entry-detail-overlay{padding-top:calc(env(safe-area-inset-top) + 12px)}
.entry-detail-overlay .detail-sheet{max-height:100%}
@media (max-width:480px) and (pointer:coarse){body:has(.form .field:focus) .bottom-nav{display:none}}
.featured-sticker .saved-cutout,.entry-sticker .saved-cutout,.sheet-sticker .saved-cutout,.banner-art .saved-cutout{display:block;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(73,43,34,.2))}
.banner-art .saved-cutout{width:52px;height:52px}
.cutout-editor{width:min(100%,480px);max-height:90svh;overflow:auto;background:#f6ead8;color:#42291e;border-radius:25px 25px 0 0;padding:20px 22px calc(22px + env(safe-area-inset-bottom))}
.cutout-editor h2{margin:0;font-size:21px}
.cutout-editor p{margin:7px 0 14px;color:#8f715d;font-size:12px}
.editor-tools{display:flex;gap:8px;margin-bottom:12px}
.editor-tools button{flex:1;border:1px solid #d7bfa3;border-radius:11px;background:#fffaf3;color:#42291e;padding:9px;font-size:12px}
.editor-tools button[aria-pressed="true"]{background:#e1b184;border-color:#e1b184;font-weight:700}
.editor-tools button:disabled{opacity:.45}
.cutout-editor canvas{display:block;max-width:100%;max-height:48svh;width:auto;height:auto;margin:auto;border-radius:16px;background:#d8c6b2;touch-action:none}
.brush-label{display:flex;align-items:center;gap:12px;margin:16px 0;font-size:12px;white-space:nowrap}
.brush-label input{flex:1;min-width:0;accent-color:#a96d4f}
.editor-actions{display:flex;gap:7px}
.editor-actions button{flex:1;min-width:0;border:1px solid #d7bfa3;border-radius:11px;background:#fffaf3;color:#42291e;padding:9px 3px;font-size:12px}
.editor-actions [data-editor-save]{background:#e1b184;border-color:#e1b184;font-weight:700}
.editor-actions button:disabled{opacity:.45}