:root{--bg-0: #171b26;--bg-1: #1f2433;--panel: #2b3142;--panel-2: #353c50;--line: rgba(211, 188, 142, .28);--cream: #ece5d8;--cream-dim: #b9b3a6;--ink: #3b4255;--gold: #d3bc8e;--gold-hi: #f0d48b;--orange: #f2a93b;--green: #8fd19e;--red: #e8867a}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;min-height:100%;height:100%;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background:var(--bg-0);color:var(--cream)}body{overflow-x:hidden}button,input{font:inherit}button{border:none;cursor:pointer;color:inherit}button:disabled{cursor:not-allowed}.app-shell{max-width:760px;margin:auto;min-height:100vh;background:radial-gradient(circle at 85% -10%,rgba(120,150,170,.18),transparent 45%),linear-gradient(180deg,#202638 0,#191d2a 45%,#141822)}.topbar{height:64px;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:20;background:#171b26eb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:9px}.logo{font-size:26px}.brand strong{display:block;font-size:16px;letter-spacing:.5px}.brand small{display:block;color:var(--cream-dim);font-size:11px}.wallet{background:var(--panel);border:1px solid var(--line);padding:8px 14px;border-radius:999px;color:var(--gold-hi);font-weight:700;font-size:14px}.app-main{padding-bottom:84px}.page{padding:16px 14px 20px}.bottom-nav{position:fixed;left:50%;transform:translate(-50%);bottom:0;width:100%;max-width:760px;height:64px;display:grid;grid-template-columns:repeat(3,1fr);background:#171b26f5;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line);z-index:30}.bottom-nav button{background:transparent;color:var(--cream-dim);font-size:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}.bottom-nav button span{font-size:11px}.bottom-nav button.active{color:var(--gold-hi);background:linear-gradient(180deg,rgba(211,188,142,.14),transparent);box-shadow:inset 0 2px 0 var(--gold)}.home-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}.home-head h1{margin:0 0 4px;font-size:22px;letter-spacing:.5px}.home-head p{margin:0;color:var(--cream-dim);font-size:12.5px;line-height:1.5}.pulse-badge{white-space:nowrap;font-size:11px;color:var(--gold-hi);background:#f0d48b1a;border:1px solid var(--line);padding:6px 10px;border-radius:999px}.mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.mini-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:8px 10px;display:flex;align-items:baseline;justify-content:space-between}.mini-card span{color:var(--cream-dim);font-size:12px}.mini-card strong{font-size:18px;color:var(--cream)}.frame{position:relative;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:16px;padding:12px;margin-bottom:12px;box-shadow:0 8px 22px #00000047,inset 0 1px #ffffff0d}.frame-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid var(--line)}.frame-head.slim{padding-bottom:8px;margin-bottom:8px}.frame-title{display:flex;align-items:center;gap:8px;min-width:0}.frame-title strong{display:block;font-size:15px;color:var(--cream)}.frame-title small{display:block;font-size:11px;color:var(--cream-dim)}.frame-icon{font-size:22px}.frame-actions{display:flex;gap:6px;flex-shrink:0}.pill{background:var(--cream);color:var(--ink);font-size:12px;font-weight:700;padding:7px 11px;border-radius:999px;white-space:nowrap;box-shadow:0 2px #00000040}.pill:active{transform:translateY(1px);box-shadow:none}.frame-empty{margin:10px 2px 0;color:var(--cream-dim);font-size:12px;line-height:1.6}.pantry-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:8px;max-height:44vh;overflow-y:auto;padding:2px}.item-card{position:relative;background:#444c62;border-radius:10px;padding:8px 4px 10px;display:flex;flex-direction:column;align-items:center;gap:2px;border:2px solid transparent;overflow:hidden;transition:transform .12s,background .15s}.item-card:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:#8b93a5}.item-card[data-tier="2"]:after{background:#7fbf95}.item-card[data-tier="3"]:after{background:#6fa5d8}.item-card[data-tier="4"]:after{background:#a68bd9}.item-card[data-tier="5"]:after{background:#e6a640}.item-card:active{transform:scale(.96)}.item-emoji{font-size:28px;line-height:1.15}.item-name{font-size:12px;color:var(--cream);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.item-count{position:absolute;top:3px;right:5px;font-size:10px;color:var(--cream-dim)}.item-card.selected{background:var(--cream);border-color:var(--gold-hi);box-shadow:0 0 0 2px #f0d48b59}.item-card.selected .item-name,.item-card.selected .item-count{color:var(--ink)}.item-check{position:absolute;left:3px;top:2px;width:16px;height:16px;border-radius:50%;background:#4f9a6a;color:#fff;font-size:10px;display:flex;align-items:center;justify-content:center}.method-row,.filters{display:flex;flex-wrap:wrap;gap:6px}.filters{margin:10px 0}.chip{background:#444c62;color:var(--cream);padding:7px 13px;border-radius:999px;font-size:13px;border:1px solid transparent}.chip.small{padding:3px 10px;font-size:12px}.chip.active{background:var(--cream);color:var(--ink);font-weight:700;border-color:var(--gold-hi)}.preview{min-height:62px;border:1px dashed var(--line);border-radius:14px;padding:10px 14px;margin-bottom:12px;display:flex;flex-direction:column;justify-content:center;gap:3px;color:var(--cream-dim);font-size:12px}.preview.on{border-style:solid;background:#ece5d814}.preview-empty{text-align:center}.preview-name{display:flex;align-items:center;gap:8px;font-size:18px;color:var(--gold-hi)}.primary,.secondary{padding:12px 16px;border-radius:999px;font-weight:700;font-size:15px}.primary{background:linear-gradient(180deg,#f3dc9d,#d8b768);color:#4a3a1a;box-shadow:0 3px #9c823f,0 8px 18px #0000004d}.secondary{background:var(--cream);color:var(--ink);box-shadow:0 3px #00000047}.primary:active,.secondary:active{transform:translateY(2px);box-shadow:none}.primary:disabled,.secondary:disabled{background:#4a5063;color:#8b93a5;box-shadow:none}.full{width:100%}.cook-go{padding:14px;font-size:17px;letter-spacing:3px}.row{display:flex;align-items:center;justify-content:space-between;gap:10px}.search{width:100%;background:#262b3a;border:1px solid var(--line);border-radius:999px;padding:9px 14px;color:var(--cream);font-size:14px;margin-bottom:8px;outline:none}.search:focus{border-color:var(--gold)}.buy-item,.storage-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border-radius:12px;background:#3a4155;margin-bottom:6px;font-size:14px}.buy-name{display:flex;align-items:center;gap:10px}.buy-name small{display:block;color:var(--cream-dim);font-size:11px}.buy-emoji{font-size:24px}.qty{display:flex;align-items:center;gap:10px;white-space:nowrap}.qty b{color:var(--gold-hi);font-size:13px}.qty button{background:var(--cream);color:var(--ink);font-weight:700;font-size:12px;padding:6px 13px;border-radius:999px}.qty button:disabled{background:#4a5063;color:#8b93a5}.storage-list{margin-bottom:10px}.empty-box{text-align:center;color:var(--cream-dim);padding:24px 8px;font-size:13px}.sheet-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#080a10a8;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:flex-end;justify-content:center;animation:fade-in .18s ease-out}.sheet{width:100%;max-width:760px;max-height:84vh;display:flex;flex-direction:column;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-bottom:none;border-radius:20px 20px 0 0;animation:sheet-up .22s ease-out}.sheet-head{display:flex;align-items:center;gap:10px;padding:14px 14px 10px;border-bottom:1px solid var(--line)}.sheet-head strong{font-size:17px;flex:1}.sheet-wallet{font-size:12px;color:var(--gold-hi);background:#f0d48b1a;padding:5px 10px;border-radius:999px}.sheet-close{width:30px;height:30px;border-radius:50%;background:var(--cream);color:var(--ink);font-weight:700}.sheet-body{padding:10px 12px 16px;overflow-y:auto;-webkit-overflow-scrolling:touch}.recipe-card{background:#3a4155;border-radius:14px;padding:10px 12px;margin-bottom:8px}.recipe-top{display:flex;align-items:center;gap:10px;margin-bottom:8px}.recipe-emoji{font-size:30px}.recipe-name strong{display:block;font-size:15px}.recipe-name small{color:var(--cream-dim);font-size:11px}.recipe-ings{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px}.ing{font-size:12px;padding:3px 8px;border-radius:999px;border:1px solid transparent}.ing em{font-style:normal;font-size:10px;margin-left:4px;opacity:.85}.ing.have{background:#8fd19e24;border-color:#8fd19e80;color:var(--green)}.ing.lack{background:#e8867a1f;border-color:#e8867a80;color:var(--red)}.recipe-methods{display:flex;align-items:center;gap:6px;margin-bottom:8px}.recipe-methods small{color:var(--cream-dim);font-size:11px}.recipe-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}.recipe-actions .primary,.recipe-actions .secondary{padding:8px 14px;font-size:13px}.ready-tag{flex:1;font-size:12px;color:var(--green)}.stage{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,rgba(130,170,150,.35),transparent 60%),linear-gradient(180deg,#2a3a3d 0,#223033 55%,#1a2528);animation:fade-in .2s ease-out}.stage-mist i{position:absolute;border-radius:50%;filter:blur(46px);opacity:.5;background:#8fb6a4}.stage-mist i:nth-child(1){width:260px;height:260px;left:-70px;top:12%}.stage-mist i:nth-child(2){width:220px;height:220px;right:-60px;top:40%;background:#9db0c9}.stage-mist i:nth-child(3){width:300px;height:200px;left:30%;bottom:-60px;background:#6f9a88}.stage-top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:#141a208c;border-bottom:1px solid rgba(236,229,216,.12)}.stage-title{display:flex;align-items:center;gap:10px}.chef-hat{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--cream)}.stage-title strong{display:block;font-size:16px;letter-spacing:3px}.stage-title small{color:var(--cream-dim);font-size:12px}.stage-close{width:38px;height:38px;border-radius:50%;background:var(--cream);color:var(--ink);font-size:16px;font-weight:800;box-shadow:0 0 0 3px #ece5d840}.stage-body{position:relative;z-index:1;flex:1;width:100%;max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 10px;min-height:0}.pot-wrap{position:relative;width:270px;height:250px;flex-shrink:0;margin-bottom:4px}.pot{position:absolute;left:0;right:0;top:8px;height:190px}.pot.stirring{animation:pot-shake .3s ease-in-out infinite}.pot-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.pot-items{position:absolute;left:0;right:0;top:-10px;z-index:2;height:84px;display:flex;justify-content:center;align-items:flex-end;padding-bottom:8px}.pot-item{font-size:46px;line-height:1;margin:0 -6px;transition:filter .4s,transform .4s;transform:translateY(-8px) rotate(-7deg);filter:saturate(.55) brightness(1.15)}.pot-item:nth-child(2n){transform:translateY(0) rotate(7deg)}.zone-cold .pot-item{filter:saturate(.55) brightness(1.15)}.zone-raw .pot-item{filter:saturate(.8) brightness(1.1)}.zone-good .pot-item{filter:saturate(1.25) sepia(.2) drop-shadow(0 0 6px rgba(240,190,90,.5))}.zone-perfect .pot-item{filter:saturate(1.4) sepia(.28) drop-shadow(0 0 12px rgba(255,190,70,.9))}.zone-burnt .pot-item{filter:brightness(.32) sepia(1) contrast(1.2)}.fire{position:absolute;left:50%;bottom:6px;width:210px;height:64px;transform:translate(-50%) scale(var(--heat, .6));transform-origin:50% 100%;display:flex;justify-content:center;align-items:flex-end;transition:transform .5s;filter:drop-shadow(0 0 16px rgba(255,150,40,.75))}.fire i{display:block;width:34px;height:46px;margin:0 -4px;border-radius:50%/62% 62% 38% 38%;background:radial-gradient(ellipse at 50% 85%,#fff2b8 0,#ffc04d,#ff7a2f 72%,#ff5a1e00);transform-origin:50% 100%;animation:flicker .7s ease-in-out infinite alternate}.fire i:nth-child(1){height:32px;animation-delay:.05s}.fire i:nth-child(2){height:50px;animation-delay:.2s}.fire i:nth-child(3){height:62px;animation-delay:0s}.fire i:nth-child(4){height:48px;animation-delay:.3s}.fire i:nth-child(5){height:32px;animation-delay:.12s}.zone-burnt .fire i{background:radial-gradient(ellipse at 50% 85%,#ffd0a0 0,#ff6a3a 40%,#b02a1a 78%,#78140a00)}.steam,.smoke{position:absolute;left:50%;top:-14px;width:120px;height:60px;transform:translate(-50%);pointer-events:none;z-index:3}.steam i,.smoke i{position:absolute;bottom:0;width:26px;height:26px;border-radius:50%;filter:blur(9px);opacity:0}.steam i{background:#fffc}.smoke i{background:#141418e6;width:34px;height:34px}.steam i:nth-child(1),.smoke i:nth-child(1){left:12px}.steam i:nth-child(2),.smoke i:nth-child(2){left:46px;animation-delay:.7s}.steam i:nth-child(3),.smoke i:nth-child(3){left:80px;animation-delay:1.3s}.zone-good .steam i,.zone-perfect .steam i,.zone-raw .steam i{animation:rise 2s ease-out infinite}.zone-cold .steam i{animation:none}.zone-burnt .smoke i{animation:rise-smoke 1.6s ease-out infinite}.zone-burnt .steam i{animation:none}.guide{min-height:40px;max-width:92%;padding:9px 16px;margin-bottom:4px;border-radius:999px;text-align:center;font-size:14px;font-weight:700;color:var(--cream);background:#141a2099;border:1px solid rgba(236,229,216,.18);transition:background .2s,color .2s,border-color .2s}.guide.near{color:#fff6cf;border-color:#f0d48b99}.guide.ready{color:#4a3a1a;background:linear-gradient(180deg,#f6df9f,#e8b850);border-color:#fff0b8;box-shadow:0 0 22px #ffc850b3;animation:guide-pop .9s ease-in-out infinite alternate}.guide.warn{color:#fff;background:#dc7832d9;border-color:#ffb37a;animation:guide-pop .5s ease-in-out infinite alternate}.guide.burnt{color:#fff;background:#962828e6;border-color:#e8867a}.gauge{width:100%;max-width:620px;height:auto;display:block;overflow:visible}.gauge-line{fill:none;stroke:#ece5d8bf;stroke-width:2}.gauge-slot{opacity:.85;transition:opacity .25s}.gauge-slot.passed{opacity:1}.gauge-dot{fill:#ece5d8a6;transition:fill .2s}.gauge-dot.current{fill:var(--gold-hi)}.gauge-pointer{transition:none}.stage-count{color:var(--cream-dim);font-size:13px;margin-top:-6px}.stage-count b{color:var(--gold-hi);font-size:18px;margin:0 2px}.stage-actions{position:relative;z-index:2;display:flex;justify-content:center;align-items:flex-end;gap:26px;padding:6px 0 calc(22px + env(safe-area-inset-bottom))}.round{border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:13px;font-weight:700;color:var(--cream);background:radial-gradient(circle at 35% 30%,#4a5268,#262c3c);border:3px solid rgba(236,229,216,.45);box-shadow:0 6px 16px #0006;transition:transform .1s}.round:active:not(:disabled){transform:scale(.93)}.round:disabled{opacity:.45}.round-icon{font-size:22px;line-height:1}.round.stir{width:92px;height:92px;color:#4a3a1a;background:radial-gradient(circle at 35% 30%,#fbe9b0,#dcb666);border-color:#fff0c4}.round.stir{touch-action:none}.round.stir.holding{transform:scale(.93);filter:brightness(1.08);box-shadow:0 0 0 6px #ffd26e59,0 2px 8px #0006}.round.stir .round-icon{font-size:30px}.round.end{width:68px;height:68px}.round.end.pulse{border-color:var(--gold-hi);animation:end-pulse .9s ease-in-out infinite}.result-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;display:flex;align-items:center;justify-content:center;padding:18px;background:#080a10c7;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fade-in .2s ease-out}.result-card{position:relative;width:100%;max-width:380px;text-align:center;padding:22px 18px 18px;border-radius:20px;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--gold);box-shadow:0 16px 40px #00000080;overflow:hidden;animation:card-in .3s cubic-bezier(.2,1.3,.4,1)}.result-glow{position:absolute;left:50%;top:34px;width:220px;height:220px;transform:translate(-50%);border-radius:50%;background:radial-gradient(circle,rgba(240,212,139,.45),transparent 68%)}.result-mask.zone-burnt .result-glow{background:radial-gradient(circle,rgba(232,134,122,.4),transparent 68%)}.result-mask.zone-raw .result-glow{background:radial-gradient(circle,rgba(150,170,200,.4),transparent 68%)}.result-card>*{position:relative}.result-kicker{color:var(--gold);letter-spacing:4px;font-size:12px}.result-icon{font-size:76px;line-height:1.2;margin:6px 0 2px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.4))}.result-card h2{margin:0 0 6px;font-size:22px;color:var(--gold-hi)}.grade{display:inline-block;padding:3px 14px;border-radius:999px;background:var(--cream);color:var(--ink);font-weight:800;font-size:13px}.quality-tag{margin-top:8px;font-size:12px;color:var(--cream-dim)}.result-comment{margin:8px 0 14px;font-size:13px;line-height:1.6;color:var(--cream)}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}.stat{background:#3a4155;border-radius:12px;padding:9px 4px}.stat b{display:block;font-size:20px}.stat small{color:var(--cream-dim);font-size:11px}.stat b.plus{color:var(--green)}.stat b.minus{color:var(--red)}.stat.total{background:#f0d48b24;border:1px solid var(--gold)}.stat.total b{color:var(--gold-hi)}.result-card .row .primary,.result-card .row .secondary{flex:1}.toast{position:fixed;left:50%;top:74px;transform:translate(-50%);z-index:100;max-width:88%;padding:10px 18px;border-radius:999px;background:#ece5d8f5;color:var(--ink);font-size:13px;font-weight:600;text-align:center;box-shadow:0 8px 20px #0006;animation:toast-in .22s ease-out}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes sheet-up{0%{transform:translateY(40px);opacity:.6}to{transform:none;opacity:1}}@keyframes card-in{0%{transform:scale(.85);opacity:0}to{transform:none;opacity:1}}@keyframes toast-in{0%{transform:translate(-50%,-10px);opacity:0}to{transform:translate(-50%);opacity:1}}@keyframes flicker{0%{transform:scaleY(.82) scaleX(1.05)}to{transform:scaleY(1.1) scaleX(.92)}}@keyframes pot-shake{0%,to{transform:translateY(0) rotate(-1.6deg)}50%{transform:translateY(-7px) rotate(1.6deg)}}@keyframes rise{0%{transform:translateY(6px) scale(.6);opacity:0}30%{opacity:.55}to{transform:translateY(-46px) scale(1.5);opacity:0}}@keyframes rise-smoke{0%{transform:translateY(6px) scale(.6);opacity:0}30%{opacity:.85}to{transform:translateY(-60px) scale(1.9);opacity:0}}@keyframes guide-pop{0%{transform:scale(1)}to{transform:scale(1.04)}}@keyframes end-pulse{0%,to{box-shadow:0 0 #f0d48bb3,0 6px 16px #0006}50%{box-shadow:0 0 0 12px #f0d48b00,0 6px 16px #0006}}@media (max-width: 380px){.frame-actions .pill{padding:6px 9px;font-size:11.5px}.pot-wrap{transform:scale(.88);margin:-12px 0}}@media (max-height: 640px){.pot-wrap{transform:scale(.75);margin:-30px 0 -24px}}