:root{--y:#ffe600;--m:#ff2d95;--c:#00d4ff;--k:#111;--w:#fff;--bd:3px solid var(--k);--sh:5px 5px 0 var(--k)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:-apple-system,"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;font-size:17px;line-height:1.5;color:var(--k);
 background:var(--y);background-image:radial-gradient(rgba(0,0,0,.13) 1.4px,transparent 1.6px);background-size:14px 14px;padding:0 12px calc(30px + env(safe-area-inset-bottom))}
button,input,textarea{font:inherit;color:inherit}
.top{margin:14px -12px 12px;padding:16px 16px 14px;background:var(--m);color:var(--w);border-bottom:var(--bd);transform:skewY(-2deg)}
.top>*{transform:skewY(2deg)}
.brand{display:flex;align-items:center;gap:10px}
.ball{font-size:38px;filter:drop-shadow(3px 3px 0 #111)}
h1{margin:0;font-size:32px;font-weight:900;letter-spacing:1px;text-shadow:3px 3px 0 var(--k)}
h1 b{color:var(--y)}
.sub{margin:4px 0 0;font-weight:700}
.card{background:var(--w);border:var(--bd);box-shadow:var(--sh);border-radius:14px;padding:14px;margin:0 0 16px}
h2{margin:0 0 6px;font-size:22px;font-weight:900}
.hint{margin:0 0 10px;font-size:15px;color:#333}
.datebar{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.nb{width:52px;height:52px;flex:none;border:var(--bd);background:var(--c);font-size:30px;font-weight:900;border-radius:12px;box-shadow:3px 3px 0 var(--k)}
.nb:disabled{opacity:.35}
.dwrap{flex:1;position:relative;background:var(--w);border:var(--bd);border-radius:12px;box-shadow:3px 3px 0 var(--k);height:52px;display:flex;align-items:center;justify-content:center}
.dlabel{font-weight:900;font-size:19px}
.dwrap input{position:absolute;inset:0;opacity:0;width:100%}
.todayrow{text-align:center;margin:8px 0 6px}
.datebar{margin-bottom:14px!important}
.pill{display:inline-block;border:var(--bd);background:var(--y);font-weight:800;padding:9px 16px;border-radius:999px;box-shadow:3px 3px 0 var(--k);cursor:pointer;font-size:16px}
.pill:active,.nb:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--k)}
.pill.alt{background:var(--c)}.pill.warn{background:#fff;color:#c00}
.pill.on{background:var(--m);color:var(--w)}
.stats{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}
.ring{width:104px;height:104px;border-radius:50%;border:var(--bd);background:var(--c);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:var(--sh)}
.pct{font-size:30px;font-weight:900;line-height:1}.lbl{font-size:13px;font-weight:700}
.snums{display:grid;gap:4px}
.snums div{display:flex;align-items:baseline;gap:8px}
.snums b{font-size:24px;font-weight:900;min-width:58px}
.snums span{font-size:14px;font-weight:700}
.bar{grid-column:1/-1;height:20px;border:var(--bd);border-radius:999px;overflow:hidden;background:#eee}
.bar i{display:block;height:100%;width:0;background:repeating-linear-gradient(45deg,var(--m) 0 10px,#ff6bb5 10px 20px);transition:width .3s}
.cheer{grid-column:1/-1;margin:0;font-weight:800;text-align:center}
.tpls{display:grid;gap:8px;margin-bottom:10px}
.tplb{text-align:left;border:var(--bd);background:#fff;border-radius:12px;padding:10px 12px;box-shadow:3px 3px 0 var(--k)}
.tplb b{font-size:18px}.tplb small{display:block;font-size:14px;color:#333}
.tplb.on{background:var(--y)}
.weekrow{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.wd{border:2px solid var(--k);border-radius:10px;text-align:center;padding:4px 0;font-size:13px;font-weight:800;background:#fff}
.wd i{display:block;font-style:normal;font-size:18px}
.wd.full{background:var(--m);color:#fff}.wd.part{background:var(--c)}.wd.cur{outline:3px dashed var(--k);outline-offset:2px}
.sec{margin:0 0 18px}
.sech{display:flex;align-items:center;gap:10px;border:var(--bd);border-radius:14px 14px 0 0;padding:10px 12px;box-shadow:var(--sh);color:var(--k)}
.sech.y{background:var(--y)}.sech.m{background:var(--m);color:#fff}.sech.c{background:var(--c)}.sech.k{background:var(--k);color:var(--y)}
.sech .em{font-size:30px}
.sech h3{margin:0;font-size:22px;font-weight:900;flex:1}
.sech .sc{font-weight:900;background:#fff;color:var(--k);border:2px solid var(--k);border-radius:999px;padding:2px 10px;font-size:15px}
.secd{background:#fff;border:var(--bd);border-top:0;padding:8px 12px;margin:0;font-size:15px;box-shadow:var(--sh)}
.secd small{font-weight:800}
.items{border:var(--bd);border-top:0;border-radius:0 0 14px 14px;background:#fff;box-shadow:var(--sh);overflow:hidden}
.it{border-top:2px dashed #999}
.it:first-child{border-top:0}
.it.off{display:none}
.edit .it.off{display:block;opacity:.45}
.row{display:flex;align-items:center;gap:12px;padding:12px}
.ck{flex:none;width:40px;height:40px;border:var(--bd);border-radius:10px;background:#fff;font-size:26px;font-weight:900;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer}
.it.done .ck{background:var(--m);color:#fff}
.it.done .nm{text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:var(--m)}
.mid{flex:1;min-width:0;cursor:pointer}
.nm{font-weight:900;font-size:18px}
.dose{font-size:14px;color:#333}
.mn{flex:none;font-weight:900;font-size:14px;background:var(--y);border:2px solid var(--k);border-radius:8px;padding:2px 6px}
.sw{display:none;flex:none;border:var(--bd);border-radius:999px;padding:4px 10px;font-weight:800;font-size:14px;background:#fff}
.edit .sw{display:block}.edit .ck{display:none}
.it:not(.off) .sw{background:var(--c)}
.how{display:none;padding:0 14px 14px 64px;font-size:16px}
.it.open .how{display:block}
.how ol{margin:0 0 6px;padding-left:20px}
.how li{margin:2px 0}
.tip{background:#e9fbff;border:2px solid var(--k);border-radius:8px;padding:6px 8px;margin:6px 0;font-size:15px}
.safe{background:#ffe3ef;border:2px solid var(--m);border-radius:8px;padding:6px 8px;font-size:15px;font-weight:700}
.more{font-size:13px;color:var(--m);font-weight:800}
.feelbtns{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:10px}
.fb{border:var(--bd);background:#fff;border-radius:12px;padding:8px 0;font-size:24px;box-shadow:3px 3px 0 var(--k)}
.fb small{display:block;font-size:13px;font-weight:800}
.fb.on{background:var(--y)}
textarea{width:100%;border:var(--bd);border-radius:10px;padding:10px;font-size:16px;resize:vertical}
.trow{display:flex;flex-wrap:wrap;gap:10px}
.foot{background:var(--k);color:#fff;border-radius:14px;padding:14px;font-size:15px;border:var(--bd)}
.foot p{margin:0 0 6px}.foot b{color:var(--y)}.foot a{color:var(--c)}
.mini{font-size:13px;opacity:.8}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(120px);background:var(--k);color:var(--y);font-weight:900;padding:10px 18px;border-radius:999px;border:3px solid var(--y);transition:transform .25s;z-index:9}
.toast.show{transform:translateX(-50%) translateY(0)}
.editbar{position:sticky;top:8px;z-index:5;background:var(--k);color:var(--y);border-radius:12px;padding:10px 12px;margin:0 0 14px;font-weight:800;display:none;align-items:center;justify-content:space-between;gap:8px}
.edit .editbar{display:flex}
@media (min-width:700px){body{max-width:640px;margin:0 auto}.top{margin-left:0;margin-right:0;border-radius:0 0 14px 14px}}