:root{color-scheme:light;--ink:#493c35;--soft:#78685f;--paper:#fffaf6;--pink:#efd0db;--lilac:#ded1ee;--blue:#cce0ee;--green:#dce8bd;--yellow:#efc958;--line:#eadfd8;--shadow:rgba(78,57,46,.16);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;background:#f3ece7;color:var(--ink)}
*{box-sizing:border-box}
body{margin:0;min-height:100dvh;background:radial-gradient(circle at 20% 8%,#fff 0 2px,transparent 3px) 0 0/24px 24px,#f5efea}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
.app{width:min(100%,520px);min-height:100dvh;margin:0 auto;background:var(--paper);display:grid;grid-template-rows:auto 1fr auto;box-shadow:0 0 38px var(--shadow);overflow:hidden}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:calc(12px + env(safe-area-inset-top)) 20px 4px;position:relative;z-index:3}
.top-actions{display:flex;align-items:center;gap:14px}
.text-button,.icon-button{border:0;background:transparent;padding:9px 0;font-weight:500}
.quote-shortcut{font-size:13px;color:var(--soft)}
.icon-button{letter-spacing:2px;width:34px}
#clock{font-variant-numeric:tabular-nums;font-weight:500}
.scene{position:relative;display:grid;grid-template-rows:auto minmax(270px,1fr) auto;min-height:0;padding:6px 18px 12px;overflow:auto}
.scene-copy{padding:6px 3px 0;position:relative;z-index:2}
.scene-copy h1{font-size:20px;font-weight:500;margin:0 0 5px}
.scene-copy p{font-size:13px;color:var(--soft);margin:0}
.illustration{position:relative;margin:0;min-height:270px;display:grid;place-items:center;isolation:isolate}
.illustration::after{content:"";position:absolute;z-index:1;inset:55% 0 0;background:linear-gradient(transparent,var(--paper) 86%);pointer-events:none}
.illustration img{width:min(100%,430px);height:auto;display:block;user-select:none;-webkit-user-drag:none}
.scene[data-scene="night"] .illustration::after{background:linear-gradient(transparent,var(--paper) 96%)}
.scene-controls{position:relative;z-index:2;display:grid;gap:9px;margin-top:-54px}
.coin-balance{position:absolute;right:20px;top:68px;z-index:3;display:none;align-items:center;gap:6px;font-weight:500}
.scene[data-scene="work"] .coin-balance{display:flex}
.coin-disc{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--yellow);color:#87621d;box-shadow:inset 0 0 0 2px rgba(135,98,29,.18)}
.coin-pile{position:absolute;right:14%;bottom:22%;z-index:2;width:92px;height:82px;pointer-events:none}
.pile-dot{position:absolute;width:19px;height:19px;border-radius:50%;background:#efc54c;border:2px solid #b7892d;box-shadow:inset 0 0 0 2px #f8df87}
.action-row{display:flex;gap:9px;align-items:center}
.primary,.secondary,.chip,.choice-grid button{min-height:46px;border:0;border-radius:24px;padding:10px 16px;font-weight:500;box-shadow:0 3px 0 rgba(83,63,53,.12)}
.primary{background:var(--blue);font-size:17px;flex:2}
.secondary{background:var(--lilac);flex:1}
.chip{background:#fff;border:1px solid var(--line);box-shadow:none;flex:1;min-width:0;padding:9px 6px;font-size:13px}
.chip[aria-pressed="true"]{background:var(--green);border-color:#c5d39d}
.task-current{display:flex;justify-content:space-between;align-items:center;border:0;background:transparent;padding:5px 2px;text-align:left;font-size:13px}
.task-current span:last-child{color:var(--soft)}
.timer{font-size:40px;line-height:1;text-align:center;font-variant-numeric:tabular-nums;font-family:ui-rounded,"SF Pro Rounded",system-ui,sans-serif;font-weight:500}
.finished{text-align:center;color:var(--soft);font-size:13px;min-height:20px}
.night-list{display:grid;gap:5px;color:var(--soft);font-size:14px;text-shadow:0 1px 4px #fff}
.day-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:3px;padding:9px 8px calc(9px + env(safe-area-inset-bottom));background:rgba(255,250,246,.96);border-top:1px solid var(--line);position:sticky;bottom:0;z-index:4}
.day-nav button{border:0;background:transparent;min-height:50px;border-radius:16px;display:grid;place-items:center;align-content:center;gap:2px;font-size:11px;color:var(--soft)}
.day-nav button span{font-size:17px;line-height:1}
.day-nav button[aria-current="true"]{background:var(--ink);color:#fff}
dialog{border:0;padding:0;background:transparent;color:var(--ink)}
dialog::backdrop{background:rgba(57,43,36,.32);backdrop-filter:blur(2px)}
.sheet{width:min(calc(100% - 24px),480px);margin:auto auto 12px;border-radius:28px;background:#fffaf7;box-shadow:0 18px 50px rgba(55,39,31,.28)}
.sheet form{padding:18px}
.sheet header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.sheet header button{border:0;background:transparent;font-size:27px;width:40px;height:40px}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.choice-grid button{background:#f4ece7;box-shadow:none;font-size:14px}
.choice-grid button[aria-current="true"]{background:var(--green)}
.custom-task{display:grid;gap:7px;margin-top:14px;font-size:13px;color:var(--soft)}
.custom-task span{display:flex;gap:8px}
.custom-task input{width:100%;min-width:0;border:1px solid #d3c3ba;border-radius:20px;background:#fff;padding:10px 12px;font-size:16px}
.custom-task button{border:0;border-radius:20px;background:var(--blue);padding:9px 14px;white-space:nowrap}
.care-dialog form{display:grid;gap:10px;text-align:center;padding:24px}
.care-dialog h2,.care-dialog p{margin:0}
.care-dialog p{font-size:14px;color:var(--soft)}
.care-dialog label{text-align:left;padding:3px 15px}
.dog-face{font-size:32px}
.quote-dialog{width:min(100%,520px);height:100dvh;max-width:none;max-height:none;margin:0 auto;background:#fff}
.quote-screen{height:100%;display:flex;flex-direction:column;padding:calc(14px + env(safe-area-inset-top)) 24px calc(20px + env(safe-area-inset-bottom));background:#fff}
.quote-dialog[data-library="su"] .quote-screen{background:var(--green);color:#35422e}
.quote-screen header{display:flex;justify-content:space-between;align-items:center}
.quote-screen select{border:0;background:rgba(255,255,255,.5);border-radius:18px;padding:7px 11px}
.quote-body{display:grid;align-content:center;gap:18px;flex:1}
.quote-body blockquote{font-family:STKaiti,KaiTi,"Songti SC",serif;font-size:27px;line-height:1.55;margin:0}
.quote-dialog[data-library="daily"] blockquote{font-family:inherit;font-size:24px}
.quote-body p{font-size:14px;opacity:.72;margin:0}
.quote-screen footer{display:grid;gap:11px;text-align:center}
.quote-screen footer small{opacity:.65}
.settings-dialog .setting-row{display:flex;width:100%;justify-content:space-between;align-items:center;text-align:left;border:0;background:transparent;padding:13px 2px;border-bottom:1px solid var(--line)}
.setting-row small{color:var(--soft);max-width:52%;text-align:right}
.install-tip{padding:16px 2px 8px}
.install-tip p{font-size:13px;line-height:1.55;color:var(--soft);margin:6px 0}
.danger-link{border:0;background:transparent;color:#a25050;padding:12px 0}
@media(min-width:700px){body{padding:28px}.app{min-height:calc(100dvh - 56px);border-radius:36px}.quote-dialog{height:calc(100dvh - 56px);margin:28px auto;border-radius:36px;overflow:hidden}.sheet{margin:auto}}
@media(max-height:700px){.illustration{min-height:225px}.illustration img{max-height:280px;object-fit:contain}.scene{grid-template-rows:auto minmax(225px,1fr) auto}.quote-body blockquote{font-size:23px}}
@media(prefers-reduced-motion:no-preference){.pile-dot:last-child{animation:coin-pop .25s ease-out}@keyframes coin-pop{from{transform:translateY(-12px);opacity:0}to{transform:translateY(0);opacity:1}}}
