@import url('https://fonts.googleapis.com/css2?family=Gowun+Dodum&family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{--green:#245847;--cream:#f7f5ed;--ink:#233c32;--muted:#788176;--line:#e3e5d9}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Noto Sans KR',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #e89937;outline-offset:4px}button:disabled{cursor:not-allowed}header{height:84px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(5vw,24px);background:#fcfbf6}.brand{color:var(--green);text-decoration:none;font-weight:900;font-size:24px;letter-spacing:-1px}.brand small{font-size:10px;letter-spacing:2px;margin-left:14px;vertical-align:middle}.plain{background:none;border:1px solid #d4dbd0;border-radius:30px;padding:9px 18px;color:var(--green);font-size:12px}main{max-width:1230px;margin:auto;padding:42px 30px 20px}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:700;color:#7a8d71}h1{font-size:38px;line-height:1.4;letter-spacing:-1.8px;margin:10px 0 0;font-weight:900}.wallet{padding:22px 30px;border-radius:18px;background:#e9edde;min-width:218px;display:grid;gap:4px}.wallet small{font-size:12px}.wallet strong{font-size:31px;letter-spacing:-1px}.wallet span{font-size:11px;color:#71816b}.layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:25px}.kitchen{border-radius:22px;overflow:hidden;background:#fffdf8;border:1px solid #e0e1d2;box-shadow:0 6px 18px #293a2405}.awning{height:44px;display:flex;background:#e7e6d4}.awning i{width:10%;height:44px;border-radius:0 0 20px 20px;background:#ebdfc3}.awning i:nth-child(odd){background:#36604c}.shop{background:radial-gradient(#e6e8d7 1px,transparent 1px) 0 0/12px 12px,#f0f0e2;padding:18px 36px 23px}.shop-label{text-align:center;font-family:'Gowun Dodum',sans-serif;font-size:12px;color:#7e8a6f;letter-spacing:3px;margin-bottom:22px}.customer-row{display:flex;align-items:center;justify-content:center;gap:22px;min-height:124px}.customer{font-size:83px;filter:drop-shadow(0 8px 0 #dedfc8)}.bubble{position:relative;padding:18px 24px;background:#fffef9;border:1px solid #dde0ce;border-radius:18px;min-width:250px}.bubble:before{content:'';position:absolute;left:-8px;top:46px;width:13px;height:13px;background:#fffef9;border-left:1px solid #dde0ce;border-bottom:1px solid #dde0ce;transform:rotate(45deg)}.bubble small{font-size:10px;color:#8e947e}h2{font-size:19px;letter-spacing:-.6px;margin:6px 0 12px}.order{display:flex;align-items:center;gap:6px}.order span{display:inline-flex;padding:5px 9px;background:#f1f2e8;border-radius:7px;font-size:12px;align-items:center;gap:6px}.order span.done{background:#d9edcd;color:#3d753b}.order span.active{box-shadow:0 0 0 2px #8aa26a}.order b{font-size:11px}.board{position:relative;max-width:420px;margin:24px auto 0;background:#d4b27d;border:6px solid #dec395;border-radius:26px;padding:14px 25px 22px;box-shadow:0 10px 0 #d7dbc2}.mat{height:106px;display:grid;place-items:center;background:repeating-linear-gradient(90deg,#d9bd86 0px,#d9bd86 7px,#b9975f 8px,#f0d6a3 10px);border-radius:5px;box-shadow:0 3px 6px #926c4030}.food{width:175px;height:84px;background:#26483d;border-radius:8px;transform:rotate(-6deg);position:relative;box-shadow:3px 6px 0 #1a322b22}.rice{position:absolute;inset:8px 12px;background:radial-gradient(ellipse,#fdfcf3 2px,#e7e8d8 3px,#fffdf0 4px);background-size:8px 5px;border-radius:4px;opacity:.15;transition:opacity .2s}#fillings{position:absolute;inset:20px 24px;display:flex;flex-direction:column;justify-content:center;gap:3px}.filling{height:7px;border-radius:5px;box-shadow:1px 2px 0 #0002}.board-label{font-size:7px;letter-spacing:3px;position:absolute;bottom:5px;right:30px;color:#96784e}.controls{padding:25px 30px 28px}.timing-title{display:flex;align-items:center;justify-content:space-between;font-size:13px;margin-bottom:17px}.timing-title span{font-size:11px;color:#d7843e;font-weight:800}.track{height:35px;border-radius:10px;background:repeating-linear-gradient(90deg,#eeede4 0,#eeede4 9%,#e2e2d6 9.3%,#eeede4 9.6%);position:relative;border:1px solid #dddccc}.zone{position:absolute;left:38%;width:24%;height:100%;background:#a3c77b;border-left:2px solid #6d9a48;border-right:2px solid #6d9a48;display:grid;place-items:center;color:#3b6429;font-size:10px;font-weight:700}.needle{position:absolute;top:-7px;bottom:-7px;width:4px;background:#254b3b;border-radius:4px;left:0;transform:translateX(-50%);will-change:left}.needle:before{content:'';position:absolute;top:-2px;left:-4px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid #254b3b}.scale{display:flex;justify-content:space-between;margin-top:10px;font-size:10px;color:#969b89}.feedback{height:46px;display:grid;place-items:center;font-size:13px;color:#5d7454;font-weight:600;text-align:center}.ingredients{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.ingredient{position:relative;border:1px solid #e1e3d8;background:#fafaf3;color:#46543e;min-height:78px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:10px;transition:background .15s,transform .15s}.ingredient:active{transform:translateY(2px)}.ingredient .emoji{font-size:26px}.ingredient strong{font-size:13px}.ingredient kbd{position:absolute;top:7px;left:8px;font-size:10px;background:white;border:1px solid #e4e4d7;border-radius:4px;padding:0 4px;color:#89917c}.ingredient:disabled{opacity:.4}.ingredient.needed{border-color:#a1b888;background:#f0f4e4}.start{width:100%;border:0;border-radius:11px;background:var(--green);color:#fff;padding:14px;margin-top:12px;font-size:14px;font-weight:700}.start[hidden]{display:none}.card{padding:25px;background:#fffef9;border:1px solid var(--line);border-radius:18px;margin-bottom:18px}.card-top{display:flex;justify-content:space-between;align-items:center}.pill{font-size:10px;border-radius:20px;padding:4px 8px;background:#edf0e2;color:#728b62}.card h2{margin-top:15px}.card p{font-size:12px;line-height:1.8;color:#8b9382}.next{display:flex;align-items:center;gap:11px;padding:16px 0}.next>span{font-size:34px;width:49px;height:49px;display:grid;place-items:center;background:#f0f3e6;border-radius:12px}.next div{display:grid;gap:4px}.next small{font-size:10px;color:#959d8a}.next strong{font-size:15px}.next>b{margin-left:auto;font:12px monospace;background:#f0f1e7;border-radius:5px;padding:5px 8px}.progress{height:7px;background:#eceee2;border-radius:8px;overflow:hidden}.progress div{background:#8fa970;height:100%;width:0;transition:width .3s}.cost{display:flex;justify-content:space-between;font-size:10px;margin:10px 0 18px;color:#8a947f}.cost strong{color:#5e7251}#rebirth{background:#294e3d;color:white;border:0;border-radius:10px;padding:12px 8px;width:100%;font-size:12px;font-weight:700}#rebirth:disabled{background:#e8ebdd;color:#99a28d}.note{display:block;color:#a0a593;font-size:9px;line-height:1.9;text-align:center;margin-top:12px}.guide h2{font-size:17px}.guide ol{list-style:none;counter-reset:steps;padding:0;margin:22px 0}.guide li{counter-increment:steps;position:relative;padding-left:30px;margin-bottom:20px;font-size:12px;display:grid;gap:5px}.guide li:before{content:counter(steps);position:absolute;left:0;top:0;background:#eef1e5;color:#6a8058;border-radius:50%;height:21px;width:21px;text-align:center;font-size:10px;line-height:21px}.guide li span{font-size:10px;color:#999f90}.stats{border-top:1px solid var(--line);padding-top:16px;display:grid;gap:9px;font-size:11px;color:#929b87}.stats span{display:flex;justify-content:space-between}.stats b{color:#57704a}footer{display:flex;justify-content:space-between;font-size:10px;color:#98a08b;margin-top:26px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,25px);background:#244b3e;color:white;border-radius:14px;padding:16px 25px;font-size:14px;opacity:0;pointer-events:none;transition:.25s;z-index:4}.toast.show{opacity:1;transform:translate(-50%,0)}.kitchen.success .food{animation:roll .5s ease}.kitchen.miss .track{animation:shake .25s}@keyframes roll{50%{transform:rotate(8deg) scale(1.1)}}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}@media(max-width:900px){main{padding:25px 18px}.layout{grid-template-columns:minmax(0,1fr) 260px;gap:16px}.card{padding:20px}.shop{padding:18px 20px}.controls{padding:22px 20px}.customer{font-size:64px}.bubble{min-width:0;padding:16px}.customer-row{gap:15px}h1{font-size:32px}}@media(max-width:700px){header{height:64px;padding:0 18px}.brand{font-size:20px}.brand small{display:none}.heading{gap:12px;margin-bottom:22px}h1{font-size:26px;letter-spacing:-1px}.heading .eyebrow{font-size:9px}.wallet{min-width:130px;padding:16px}.wallet strong{font-size:24px}.wallet span{font-size:9px}.layout{grid-template-columns:1fr}.shop{padding:16px 20px 22px}.bubble h2{font-size:17px}.order span{padding:5px 6px;font-size:11px}.customer{font-size:65px}.board{margin-top:20px}.controls{padding:24px 20px}.timing-title{font-size:12px}.scale{font-size:8px}.ingredient{min-height:76px}aside{display:grid;grid-template-columns:1fr;gap:0}.card{margin-bottom:14px}.guide ol{margin:18px 0}.guide li{margin-bottom:15px}footer{gap:15px;font-size:9px;line-height:1.8}.toast{width:85%;text-align:center}}

/* Flat illustrations: quiet colors, simple shapes, no texture. */
:root{--cream:#f8f9f5;--line:#e4e9df}
header{height:70px;background:#fff}.brand{display:flex;align-items:center;gap:10px;font-size:22px}.brand small{margin-left:4px}
.brand-mark{width:24px;height:24px;border-radius:50%;background:#fbfbef;border:5px solid #345c48;position:relative}.brand-mark:after{content:'';position:absolute;inset:4px;background:#e9af58;border-radius:50%}
main{padding-top:28px}.heading{margin-bottom:24px}h1{font-size:30px;line-height:1.35}.wallet{padding:17px 24px;background:#edf2e8;border-radius:12px}.wallet strong{font-size:28px}
.kitchen{border-radius:16px;box-shadow:none;background:#fff}.awning{height:8px;background:#48715a}.awning i{display:none}
.shop{padding:20px 30px;background:#f0f4eb}.shop-label{font-family:inherit;font-size:10px;letter-spacing:1px;margin-bottom:14px;color:#71836b}
.customer-row{min-height:102px;gap:25px}.customer{position:relative;width:65px;height:75px;flex-shrink:0;filter:none;font-size:0;background:#e5bfa0;border-radius:30px 30px 27px 27px;border-top:17px solid #4a4b3d;box-shadow:0 15px 0 -3px #7e9b7d}
.customer:before{content:'';position:absolute;left:17px;top:19px;width:4px;height:5px;border-radius:50%;background:#3b493c;box-shadow:24px 0 #3b493c}.customer:after{content:'';position:absolute;left:28px;top:33px;width:10px;height:5px;border:2px solid #8b6755;border-top:0;border-radius:0 0 9px 9px}.customer[data-variant="1"]{border-color:#7a6051;box-shadow:0 15px 0 -3px #c4a078}.customer[data-variant="2"]{background:#bd9879;border-color:#373f37;box-shadow:0 15px 0 -3px #849ba4}.customer[data-variant="3"]{border-color:#9b9e8e;box-shadow:0 15px 0 -3px #b39caa}
.bubble{border:0;border-radius:12px;min-width:250px;padding:16px 20px;background:white}.bubble:before{background:white;border:0}.bubble h2{font-size:18px}.order{flex-wrap:wrap}.order span{background:#f0f3eb;font-size:11px;padding:5px 8px}.order span.active{box-shadow:none;background:#dce9d3;color:#355b35}.order span.done{background:#edf2e7;color:#6d8061}
.board{max-width:350px;margin-top:20px;background:#e4d4b5;border:0;border-radius:15px;box-shadow:none;padding:12px 22px}.mat{height:90px;background:#ecdfc6;border-radius:8px;box-shadow:none}.food{width:160px;height:70px;background:#345645;transform:none;box-shadow:none;border-radius:6px}.rice{background:#fffdf0;background-size:auto;inset:8px;border-radius:3px}.filling{height:6px;box-shadow:none}.board-label{display:none}
.controls{padding:22px 28px}.track{height:28px;background:#ecefe7;border:0;border-radius:6px}.zone{background:#b2d493;border:0;color:#416733}.needle{width:3px}.scale{color:#7c8874}.feedback{height:42px}.ingredient{background:#fff;min-height:70px;border-radius:10px;gap:12px}.ingredient:disabled{opacity:.55}.ingredient.needed{background:#f1f6ec;border-color:#9fb58d}.ingredient kbd{border:0;background:#edf1e7;color:#6a795f}.ingredient strong{font-size:12px}
.ingredient-art{position:relative;display:inline-block;flex-shrink:0;width:30px;height:30px;vertical-align:middle;box-sizing:border-box}.art-0{height:25px;border-radius:3px;background:#345645}.art-1{width:31px;height:25px;background:#fffdf1;border:2px solid #d9ddce;border-radius:50% 50% 8px 8px}.art-2{width:13px;height:30px;background:#eaa05d;border-radius:4px 4px 8px 8px;transform:rotate(18deg)}.art-2:before{content:'';position:absolute;width:10px;height:6px;background:#7d9d6c;top:-4px;left:1px;border-radius:3px}.art-3{width:15px;height:31px;background:#86a779;border:3px solid #5c8457;border-radius:8px;transform:rotate(25deg)}.art-4{width:28px;height:17px;background:#edcd6b;border-radius:4px;transform:rotate(-12deg)}.art-5{width:30px;height:24px;background:#fff9e8;border:1px solid #e6ddc8;border-radius:45%}.art-5:after{content:'';position:absolute;width:12px;height:12px;border-radius:50%;background:#e9bd60;top:5px;left:8px}.art-6{width:29px;height:20px;background:#d9a19b;border-radius:4px;border-bottom:4px solid #bc827e}.art-7{width:27px;height:20px;background:#c6ad98;border-radius:45% 35% 40% 35%}.art-8{width:29px;height:25px;background:#edcb71;clip-path:polygon(0 100%,0 30%,100% 0,100% 100%)}.art-8:after{content:'';position:absolute;background:#d5ae4f;border-radius:50%;width:6px;height:6px;left:8px;top:11px;box-shadow:12px 5px #d5ae4f}
.next>span{background:#f0f4eb;border-radius:10px}.complete-mark{font-size:25px;color:#698259}.card{background:#fff;border-radius:14px}.card p{color:#7b8773}.note{color:#7d8873}.guide li span{color:#7d8873}.start,#rebirth{border-radius:9px}.next small,.cost{color:#7d8873}
@media(max-width:700px){header{height:60px}.brand{font-size:19px}main{padding-top:20px}h1{font-size:25px}.wallet{padding:14px}.shop{padding:18px 20px}.customer-row{gap:18px}.customer{width:56px;height:65px;border-top-width:14px}.customer:before{left:13px;top:16px;box-shadow:23px 0 #3b493c}.customer:after{left:23px;top:29px}.bubble{min-width:0;padding:15px}.bubble h2{font-size:16px}.board{margin-top:18px}.controls{padding:22px 20px}.ingredient{min-height:68px}.order{max-width:230px}}

/* Dark kitchen */
:root{color-scheme:dark;--cream:#0b0d0c;--ink:#edf2ed;--line:#303730;--green:#8fbd98;--muted:#a6b2a5}
body{background:#0b0d0c;color:#edf2ed}header{background:#101411;border-color:#2b332c}.brand{color:#c3dfc7}.plain{color:#d2e3d0;border-color:#3c483d;background:#192019}.plain:disabled{color:#798779}.brand-mark{background:#dfe7cf;border-color:#70997b}
.wallet{background:#19221b}.wallet span,.wallet small{color:#b3c5ae}.eyebrow{color:#a0b69a}.kitchen,.card{background:#131815;border-color:#2e382f}.awning{background:#557d5e}.shop{background:#19211b}.shop-label{color:#a6b69d}.bubble,.bubble:before{background:#252f27}.bubble small{color:#b3bea9}.order span{background:#364135;color:#dbe6d5}.order span.active{background:#466242;color:#f4ffe9}.order span.done{background:#2e4630;color:#b4dcac}
.board{background:#3b3b2d}.mat{background:#494935}.food{background:#233f30;border:1px solid #64805f}.rice{background:#f6f3de}.board-label{color:#bdc5a7}.track{background:#333b34}.zone{background:#8dbf70;color:#172d13}.needle{background:#e1f5d7}.needle:before{border-top-color:#e1f5d7}.timing-title span{color:#e4b780}.scale{color:#a8b7a0}.feedback{color:#c3dcaf}
.ingredient{background:#1e271f;border-color:#3c493a;color:#edf4e8}.ingredient.needed{background:#2a3c27;border-color:#86ac70}.ingredient:disabled{opacity:.65}.ingredient kbd{background:#394633;color:#e0ead7}.art-0{background:#81a07d}.art-1{border-color:#a5ad95}.next>span{background:#2a3427}.next>b{background:#303d2c;color:#dce7d3}.next small,.cost,.note,.card p,.guide li span{color:#b0bda4}.cost strong{color:#cfdfbe}.pill{background:#2e3d29;color:#c2d9b4}.progress{background:#35402e}.progress div{background:#98bd7a}.start,#rebirth{background:#90b97d;color:#14200f}.start:hover,#rebirth:enabled:hover{background:#a4cc90}#rebirth:disabled{background:#2d3829;color:#a0af92}.guide li:before{background:#30402b;color:#d4e6c5}.stats{border-color:#36402f;color:#acbca0}.stats b{color:#d0e4bf}footer{color:#a2b196}.toast{background:#d3e6c4;color:#203019}button:focus-visible,a:focus-visible{outline-color:#c9e5b5}
