:root{--ink:#293e39;--muted:#64776f;--green:#497d70;--line:#dce5df;--paper:#fffcf6}
*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden}body{font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:#d7e3db;font-size:16px}
button,input,textarea,select{font:inherit}button{cursor:pointer;color:inherit;touch-action:manipulation}button:disabled{cursor:not-allowed;opacity:.48}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #b68031;outline-offset:3px}
#wallpaper{position:fixed;inset:0;background-size:contain;background-repeat:no-repeat;background-position:center;background-color:#e5eee6;z-index:-1}#wallpaper:before{content:"";position:absolute;inset:0;background:url('assets/watercolor-fill.png') center/cover;opacity:.78;z-index:-1}#wallpaper:after{content:"";position:absolute;inset:0;background:rgba(239,244,237,.16)}
.app{width:min(100%,960px);height:100dvh;margin:auto;display:flex;flex-direction:column;background:#f6f8f210;box-shadow:0 0 60px #344e3920}
.topbar{background:#fffcf6b8;backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:space-between;padding:calc(16px + env(safe-area-inset-top)) 24px 16px;flex-shrink:0}
.brand{font-size:11px;letter-spacing:.24em;color:var(--green);font-weight:650}h1{font-size:25px;font-weight:600;margin:5px 0 0}h2{font-size:19px;font-weight:600;margin:0;line-height:1.5}.toolbar{display:flex;gap:6px}
.icon-button{background:none;border:0;border-radius:10px;width:44px;height:44px;display:inline-grid;place-items:center;font-size:24px}.icon-button:hover{background:#dce7df}
.pages{display:flex;flex:1;min-height:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}.pages::-webkit-scrollbar{display:none}
.page{flex:0 0 100%;min-width:0;height:100%;overflow-y:auto;scroll-snap-align:start;scroll-snap-stop:always;padding:0 20px 28px;overscroll-behavior-y:contain;scrollbar-width:thin}
.paper{background:#fffcf6f2;border:1px solid #fff;border-radius:18px;padding:20px;margin-bottom:16px;box-shadow:0 3px 15px #30483006}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
.muted,.footnote{color:var(--muted);font-size:14px;line-height:1.7}.muted{margin:6px 0}.footnote{margin:14px 0;font-size:13px}.eyebrow{font-size:14px;color:var(--green)}
.small-button,.presets button{border:1px solid var(--line);border-radius:10px;padding:10px 13px;background:var(--paper);font-size:14px;white-space:nowrap;min-height:42px}
.primary,.filled{background:var(--green);color:#fff;border:1px solid var(--green);border-radius:12px;padding:12px 22px;min-height:46px}.plain{background:none;border:0;color:var(--green);font-size:14px;padding:10px}
.week-panel{background:#497d70eb;color:white;border-radius:18px;padding:12px 10px 18px;margin-bottom:16px}.week-panel .plain{color:#fff;font-size:17px}.week-panel .icon-button:hover{background:#ffffff20}
.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;margin-top:10px}.week-day{border:0;background:none;color:#fff;padding:7px 0;border-radius:28px;display:flex;align-items:center;flex-direction:column;gap:6px}
.week-day small{font-size:13px;opacity:.85}.week-day strong{font-size:20px;font-weight:500;width:37px;height:37px;display:grid;place-items:center;border-radius:50%}.week-day.selected strong{background:#f6f4e7;color:var(--green)}
.week-day.today:not(.selected) strong{box-shadow:inset 0 0 0 1px #d4e9dd}.day-dot{height:4px;width:4px;border-radius:50%;background:#d9e9dd}.day-dot.empty{visibility:hidden;padding:0}
.task-row{display:flex;align-items:center;gap:12px;padding:17px 0;border-bottom:1px solid var(--line)}.task-check{border:1.5px solid #8ba79a;border-radius:7px;min-width:25px;height:25px;display:grid;place-items:center;background:transparent;color:white}
.task-check.done{background:var(--green)}.task-title{flex:1;min-width:0;border:0;background:none;text-align:left;line-height:1.65;word-break:break-word;padding:4px}.task-row.done .task-title{text-decoration:line-through;color:#84978d}
.delete-task{font-size:20px;color:#7a8a81;width:36px;min-width:36px}.add-row{padding:18px 0 4px;border:0;background:none;color:var(--green);width:100%;text-align:left}.empty{padding:42px 12px;text-align:center;color:var(--muted);line-height:1.9}.empty span{display:block;color:var(--green);font-size:29px;margin-bottom:10px}
.calendar-paper{padding:12px 0 0;overflow:hidden}.calendar-paper .section-heading{padding:0 10px 10px}.week-labels,.calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.week-labels{text-align:center;color:var(--green);font-size:14px;padding:10px 0}
.calendar-cell{background:transparent;border:0;border-top:1px solid var(--line);border-right:1px solid var(--line);min-height:91px;padding:6px 4px;text-align:left;display:flex;flex-direction:column;gap:5px;overflow:hidden;position:relative}.calendar-cell:nth-child(7n){border-right:0}.calendar-cell.outside{background:#e8eee544;color:#a1aaa2}.calendar-cell.selected{box-shadow:inset 0 0 0 2px var(--green)}
.calendar-cell .day-number{font-size:16px;width:27px;height:27px;display:grid;place-items:center;border-radius:50%}.calendar-cell.today .day-number{background:var(--green);color:white}.calendar-cell .task-preview{font-size:11px;display:block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;background:#dce9e0;padding:1px 3px;color:#37594c;border-radius:3px}.calendar-cell .task-preview.done{opacity:.55;text-decoration:line-through}.more-count{font-size:11px;color:var(--muted)}
.subjects{display:flex;flex-wrap:wrap;gap:7px;margin:18px 0 12px}.subject-chip{background:#fff9;border:1px solid #d6e2d9;border-radius:20px;padding:9px 13px;font-size:14px}.subject-chip.active{background:var(--green);color:white;border-color:var(--green)}
.search-row{display:flex;align-items:center;gap:10px}.search-row input[type=search]{flex:1;min-width:0}.filter-check{font-size:14px;white-space:nowrap;display:flex;align-items:center;gap:5px}
.card-list{display:grid;gap:14px}.memory-card{border-radius:16px;padding:18px;background:var(--paper);border:1px solid #fff}.memory-card h3{font-size:17px;font-weight:550;margin:12px 0;line-height:1.7;overflow-wrap:anywhere}.tag{font-size:12px;color:var(--green);background:#e4eee5;border-radius:5px;padding:4px 7px}.card-meta{font-size:13px;color:var(--muted);margin:9px 0}.card-actions{display:flex;gap:10px;align-items:center}.review-dots{display:inline-flex;gap:4px;margin-right:5px}.review-dots i{width:7px;height:7px;border-radius:50%;background:#d7e2d9}.review-dots i.done{background:var(--green)}
.focus-paper{text-align:center;padding:30px 20px}.duration-field{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:24px;font-size:14px}.duration-field input{width:82px!important;text-align:center;margin:0}.presets{display:flex;gap:8px;justify-content:center;margin:14px 0}.presets button{padding:7px 12px}
.timer{font-variant-numeric:tabular-nums;font-size:clamp(50px,12vw,84px);font-weight:300;letter-spacing:.04em;margin:25px 0 14px}.focus-actions{display:flex;gap:12px;justify-content:center;margin:20px 0}.focus-stats{color:var(--green);font-size:14px}.history-row{padding:12px 0;border-bottom:1px solid var(--line);font-size:14px;display:flex;justify-content:space-between;gap:10px;line-height:1.6}
.journey{padding:24px}.journey h2{font-size:24px;margin-top:8px}.journey strong{font-size:38px;font-weight:400}progress{display:block;width:100%;height:9px;border-radius:9px;overflow:hidden;border:0;background:#dee8df;accent-color:var(--green)}progress::-webkit-progress-bar{background:#dee8df;border-radius:9px}progress::-webkit-progress-value{background:var(--green);border-radius:9px}progress::-moz-progress-bar{background:var(--green)}
.chests{display:grid;gap:14px}.chest{background:var(--paper);border:1px solid #fff;border-radius:18px;padding:18px;display:grid;grid-template-columns:56px 1fr;gap:15px;align-items:start}.chest-symbol{font-size:34px;color:#8b7852}.chest.ready{border:1px solid #b9a074;background:#fffcf1}.chest h3{font-size:17px;margin:0 0 10px}.chest button{margin-top:12px}.chest .muted{font-size:13px}
.bottom-nav{display:flex;flex-shrink:0;padding:7px 8px calc(7px + env(safe-area-inset-bottom));background:#fffdf8f7;border-top:1px solid #dce5df;z-index:10}.nav-item{flex:1;border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:4px;color:#74867c;min-height:54px;justify-content:center;border-radius:12px;font-size:12px}.nav-item svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.6}.nav-item[aria-current=page]{color:var(--green);background:#e5eee5}
.banner{background:#fbefcf;color:#665321;font-size:13px;margin:0;padding:9px 20px}
#pet{position:fixed;width:96px;height:96px;right:max(14px,calc((100vw - 960px)/2 + 14px));bottom:calc(89px + env(safe-area-inset-bottom));z-index:30;background:none;border:0;padding:0;touch-action:none;cursor:grab}#pet:active{cursor:grabbing}#petSprite{display:block;width:100%;height:100%;pointer-events:none}
dialog{width:min(94vw,520px);max-height:88dvh;overflow:auto;border:1px solid #e1e7de;border-radius:20px;background:var(--paper);padding:24px;color:var(--ink);box-shadow:0 24px 100px #20372a44}dialog::backdrop{background:#253c325e;backdrop-filter:blur(4px)}
input:not([type=checkbox]):not([type=range]),textarea,select{background:white;border:1px solid #cbd9ce;border-radius:10px;padding:12px;width:100%;color:var(--ink);font-size:16px}label.field{display:block;margin-top:18px;font-size:14px;line-height:1.6}label.field>input,label.field>select,label.field>textarea{display:block;margin-top:6px}textarea{resize:vertical;min-height:110px}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.error{color:#a63e2d;font-size:14px}
.answer{white-space:pre-wrap;overflow-wrap:anywhere;background:#eaf0e5;border-radius:12px;padding:20px;line-height:1.8;margin:20px 0}#reviewQuestion{margin-top:18px;overflow-wrap:anywhere}.settings-list{display:grid;gap:14px;margin-top:16px}.settings-list label{display:flex;align-items:center;justify-content:space-between;gap:12px}.gift-picture{display:block;width:100%;max-height:240px;object-fit:contain;border-radius:12px;margin:15px 0}.download-link{display:inline-block;text-decoration:none}
#toast{position:fixed;bottom:calc(88px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:#29483e;color:white;padding:12px 20px;border-radius:12px;max-width:90vw;width:max-content;z-index:40;font-size:14px;box-shadow:0 5px 20px #0002}a{color:var(--green)}[hidden]{display:none!important}
@media(min-width:700px){.page{padding:0 32px 32px}.topbar{padding-left:36px;padding-right:36px}.calendar-cell{min-height:106px;padding:8px}.calendar-cell .task-preview{font-size:13px}.card-list{grid-template-columns:1fr 1fr}.week-panel{padding:15px 30px 20px}.week-day strong{width:42px;height:42px}.focus-paper{max-width:650px;margin-left:auto;margin-right:auto}.chests{grid-template-columns:1fr 1fr}.bottom-nav{padding-left:60px;padding-right:60px}}
@media(max-width:380px){.page{padding-left:12px;padding-right:12px}.paper{padding:15px}.calendar-paper{padding:8px 0 0}.subject-chip{padding:8px 10px}.chest{grid-template-columns:42px 1fr}.week-day strong{width:31px;height:31px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}


/* Compact, expandable calendar. Dates stay selectable in either view. */
.page{overflow-anchor:none}
.week-day .lunar-label{font-size:10px;line-height:16px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.88}
.lunar-label.special{color:#806327;font-weight:600}.week-panel .lunar-label.special{color:#fff0be}
.calendar-cell .lunar-label{font-size:10px;line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.compact-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.compact-day{display:flex;flex-direction:column;align-items:center;gap:3px;border:0;border-radius:12px;background:none;color:white;padding:7px 1px;min-height:64px}.compact-day strong{font-weight:500;font-size:17px}.compact-day.selected{background:#fffcf6;color:var(--green)}.compact-day.selected .lunar-label.special{color:#806327}.compact-day.outside{opacity:.45}.compact-day.today:not(.selected){box-shadow:inset 0 0 0 1px #fff8}.compact-day .lunar-label{font-size:10px;line-height:16px;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.compact-day.selected .day-dot{background:var(--green)}
.week-panel .week-labels{color:#ffffffc9;font-size:12px}.calendar-footer{display:flex;align-items:center;justify-content:space-between;gap:5px;margin:9px 4px 0;border-top:1px solid #ffffff30;padding-top:5px;font-size:11px}.calendar-footer .plain{font-size:12px}#weekTitle{min-width:160px}.calendar-reveal{animation:calendar-in .22s ease-out;transform-origin:top}@keyframes calendar-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.touch-ripple{position:fixed;pointer-events:none;width:60px;height:60px;margin:-30px;border:1px solid #668e7880;background:radial-gradient(circle,#b9d8c54d,transparent 65%);border-radius:50%;z-index:100;animation:touch-ripple .5s ease-out forwards}@keyframes touch-ripple{from{transform:scale(.18);opacity:.8}to{transform:scale(1.6);opacity:0}}
.gift-options{display:grid;gap:10px;margin:20px 0}.gift-option{border:1px solid var(--line);background:white;border-radius:12px;padding:12px;text-align:left;font-size:14px}.gift-option[aria-pressed=true]{border-color:var(--green);background:#e4eee5}.gift-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.gift-note{border-left:2px solid #b3cbb8;padding-left:12px;line-height:1.8;font-size:14px}.page[data-page="2"]>.section-heading,.page[data-page="2"]>.footnote{background:#fffcf6dc;border-radius:12px;padding:12px}
.page[data-page="2"]{color:#203a33}.page[data-page="2"]>.section-heading,.page[data-page="2"]>.subjects,.page[data-page="2"]>.search-row,.page[data-page="2"]>.footnote{background:rgba(255,252,246,.94)}.page[data-page="2"] .muted,.page[data-page="2"] .footnote,.page[data-page="2"] .card-meta{color:#40584f}.page[data-page="2"] h2{color:#19362e}.page[data-page="2"] .subject-chip{background:rgba(255,252,246,.97)}


.page[data-page="2"] .subject-chip.active{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 2px 7px #29483e40}
.gift-claim{margin:14px 0;padding:12px 14px;border:1px dashed #7fa08e;border-radius:14px;background:#edf5ef;color:#29483e;font-weight:700;text-align:center;letter-spacing:.02em}
.pet-guide{margin:8px 0 16px;padding:12px 14px;border-radius:14px;background:#f0f6f1;color:#486358;font-size:13px;line-height:1.7}
