:root{--bg: #fbf6ef;--card: #ffffff;--ink: #2a1d17;--muted: #7a6a60;--red: #c8372d;--amber: #f2a516;--green: #3f7d4e;--line: #eadfd2;--soft: #f6ece0;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}h1,h2,h3{font-family:Fraunces,Georgia,serif;margin:0}a{color:inherit}button{font:inherit;color:inherit}.wrap{max-width:760px;margin:0 auto;padding:20px 16px 60px}.muted{color:var(--muted);font-size:14px}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;box-shadow:0 1px #00000005}.group-title{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600;margin:14px 0 6px}.group-title:first-child{margin-top:0}.note{background:#fff7e2;border:1px solid #f3dc9e;border-radius:12px;padding:12px 14px;font-size:14px;margin-top:12px}.note b{color:#8a5a00}.progress{height:8px;border-radius:99px;background:var(--soft);overflow:hidden;margin:4px 0 12px}.progress i{display:block;height:100%;background:var(--green);transition:width .35s}.item{display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-top:1px dashed var(--line);cursor:pointer}.item-wrap{display:flex;align-items:flex-start;gap:8px}.item-wrap .item{flex:1;min-width:0}.item-wrap:first-of-type .item{border-top:0}.item input{appearance:none;-webkit-appearance:none;flex:0 0 22px;width:22px;height:22px;margin:2px 0 0;border:2px solid var(--muted);border-radius:6px;display:grid;place-content:center;cursor:pointer;background:#fff}.item input:checked{background:var(--green);border-color:var(--green)}.item input:checked:after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translate(-1px,-1px)}.item input:focus-visible{outline:3px solid var(--amber);outline-offset:2px}.item .txt{flex:1;min-width:0}.item b{font-weight:600}.item .use{display:block;color:var(--muted);font-size:14px}.item .price{font-weight:600;white-space:nowrap}.item.done .txt b{text-decoration:line-through;color:var(--muted)}.steps{list-style:none;margin:0;padding:0}.step{display:flex;gap:14px;padding:14px 0;border-top:1px solid var(--line);cursor:pointer}.step:first-child{border-top:0}.step .num{flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-content:center;font-weight:600;font-size:15px;border:0;cursor:pointer;padding:0}.step .num:focus-visible{outline:3px solid var(--amber);outline-offset:2px}.step.done .num{background:var(--green)}.step.done .body{opacity:.55}.step .body{min-width:0;flex:1}.step h3{font-size:18px;margin-bottom:2px}.step p{margin:4px 0 0}.tag{display:inline-block;font-size:12px;font-weight:600;padding:2px 8px;border-radius:99px;margin-left:6px;vertical-align:middle;font-family:Inter,sans-serif}.tag.time,.tag.rest{background:var(--soft);color:var(--ink)}.tag.hot{background:#fde3df;color:var(--red)}.tag.ahead{background:#fff1d6;color:#8a5a00}.amt{font-weight:700}@keyframes flick{0%,to{transform:scaleY(1) translateY(0)}50%{transform:scaleY(1.18) translateY(-2px)}}@keyframes steam{0%{opacity:0;transform:translateY(6px)}40%{opacity:.8}to{opacity:0;transform:translateY(-16px)}}@keyframes toss{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(-12deg)}}@keyframes chop{0%,to{transform:rotate(-24deg)}50%{transform:rotate(4deg)}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes drop{0%{transform:translateY(-26px);opacity:0}30%{opacity:1}60%,to{transform:translateY(0);opacity:1}}@keyframes spin{to{transform:rotate(360deg)}}.flame{transform-origin:50% 100%;animation:flick .5s ease-in-out infinite}.flame.b{animation-delay:.15s}.flame.c{animation-delay:.3s}.steam{animation:steam 2.2s ease-out infinite}.steam.b{animation-delay:.7s}.steam.c{animation-delay:1.4s}.toss{transform-origin:50% 50%;animation:toss 1.4s ease-in-out infinite}.knife{transform-origin:12px 44px;animation:chop .6s ease-in-out infinite}.bob{animation:bob 2.4s ease-in-out infinite}.drop1{animation:drop 2.4s ease-out infinite}.drop2{animation:drop 2.4s ease-out .4s infinite}.drop3{animation:drop 2.4s ease-out .8s infinite}.clock-hand{transform-origin:28px 30px;animation:spin 4s linear infinite}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
