*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#bfc9b1;color:#293e32;font:14px 'Microsoft YaHei',sans-serif;touch-action:none}canvas{display:block;width:100vw;height:100vh}button{cursor:pointer;font:700 14px 'Microsoft YaHei';border:0}header{position:fixed;top:22px;left:28px;right:28px;display:flex;align-items:center;gap:28px;pointer-events:none}.brand{display:flex;gap:10px;align-items:center;font-size:24px;font-weight:900;text-shadow:0 2px 10px #fff}.brand>span{font:900 46px Georgia;color:#b54c2a}.brand small{display:block;font-size:9px;letter-spacing:2px;margin-top:5px}.order{display:flex;gap:14px;align-items:center;padding:15px 22px;background:#fffcf0ed;border-radius:4px 4px 18px 18px;border-top:5px solid #bd5c3b;box-shadow:0 8px 25px #334b3620}.order small{display:block;font-size:11px;color:#7d8370;margin-top:6px}.order em{font:700 22px Georgia;color:#b85d36;margin-left:15px}.tomato{color:#d3442b;font-size:42px;text-shadow:2px 3px #9a3821}.stats{display:flex;align-items:center;gap:20px;margin-left:auto;background:#fff9e9ef;padding:12px 18px;border-radius:16px}.stats strong{font:700 27px Georgia}.stats button{background:#2e5141;color:#fff;border-radius:10px;padding:10px;pointer-events:auto}#task{position:fixed;left:28px;top:116px;background:#233f34e8;color:#fff;padding:14px 19px;border-radius:13px;box-shadow:0 8px 25px #243c3325}#task span{font-size:10px;letter-spacing:2px;color:#cbd9b8;display:block;margin-bottom:7px}#task b{font-size:14px}#hand{display:block;color:#d8dcca;font-size:11px;margin-top:7px}.label{position:absolute;transform:translate(-50%,-50%);background:#fffbeaee;border:1px solid #ddd9bb;padding:5px 11px;border-radius:7px;font-size:11px;font-weight:700;box-shadow:0 3px 8px #0001;pointer-events:none}.label.near{background:#e9a04a;color:#332e21;border-color:#fff}footer{position:fixed;bottom:26px;left:32px;right:32px;display:flex;align-items:end;justify-content:space-between;pointer-events:none}#joystick{width:118px;height:118px;border:2px solid #fff9;border-radius:50%;background:#23463430;display:grid;place-items:center;pointer-events:auto;touch-action:none;box-shadow:inset 0 0 25px #fff2}#joystick i{width:51px;height:51px;border-radius:50%;background:#fff9e8ce;box-shadow:0 3px 8px #0002}#joystick span{position:absolute;bottom:-19px;font-size:10px;letter-spacing:3px}.keys{background:#fff9e0c9;padding:10px 20px;border-radius:20px;font-size:11px;margin-bottom:5px}.keys span{margin-left:15px;color:#778069}.actions{display:flex;align-items:end;gap:16px;pointer-events:auto}.actions button{width:92px;height:92px;border-radius:50%;color:#fff;background:#be5936;border:4px solid #fff3d8;box-shadow:0 5px 0 #88422c,0 9px 20px #0002}.actions button:last-child{width:76px;height:76px;background:#355d48;box-shadow:0 5px 0 #243f32}.actions small{display:block;font-size:9px;opacity:.65;margin-bottom:5px}#context{position:fixed;bottom:140px;left:50%;transform:translateX(-50%);background:#fff9e9ec;border-radius:10px;padding:10px 20px;font-size:12px;display:none}#progress{position:fixed;bottom:125px;left:calc(50% - 90px);width:180px;height:6px;border-radius:8px;background:#fff8;display:none;overflow:hidden}#progress i{display:block;height:100%;background:#d98336;width:0}#toast{position:fixed;top:115px;left:50%;transform:translateX(-50%);background:#fff8e6;padding:12px 25px;border-radius:12px;opacity:0;transition:opacity .2s;pointer-events:none}#overlay{position:fixed;inset:0;background:linear-gradient(90deg,#182f35b8,#182f3515);display:flex;align-items:center;padding-left:8vw;backdrop-filter:blur(2px)}.intro{background:#fff9e9f2;padding:38px 42px;border-radius:4px 32px 32px 32px;box-shadow:0 25px 100px #182a3340;max-width:510px;border-top:5px solid #c0653e}.eyebrow{font-size:10px;letter-spacing:3px;color:#b05e36}.intro h1{font-size:46px;line-height:1.25;margin:20px 0;color:#2b4436}.intro p{line-height:1.8;color:#7e806b}.steps{display:flex;gap:15px;font-size:12px;border-top:1px solid #ddd9c4;padding-top:20px;margin:22px 0}.intro button,.panel button{display:block;width:100%;padding:17px 20px;border-radius:12px;background:#bc5936;color:white;text-align:left}.intro button span{float:right}.intro>small{display:block;font-size:10px;color:#8d927c;text-align:center;margin-top:15px}#settings{position:fixed;inset:0;background:#18392f88;display:grid;place-items:center;backdrop-filter:blur(4px)}#settings[hidden]{display:none}.panel{background:#fff9e9;padding:30px;border-radius:22px;width:340px}.panel p{color:#7a8370;font-size:12px}.panel label{display:block;margin:20px 0}.panel select{float:right;padding:5px}.panel button{margin:12px 0;text-align:center}.panel a{display:block;text-align:center;color:#63785d;font-size:12px;margin-top:18px}@media(max-height:550px){header{top:10px;left:15px;right:15px;gap:15px}.brand{font-size:17px}.brand small{font-size:7px}.brand>span{font-size:28px}.order{padding:8px 12px;gap:8px}.order small{font-size:9px}.tomato{font-size:28px}.stats{padding:7px 12px;gap:10px}.stats strong{font-size:22px}#task{top:80px;left:15px;padding:9px 13px}#task b{font-size:11px}#task span{display:none}footer{bottom:16px;left:20px;right:20px}#joystick{width:86px;height:86px}#joystick i{width:40px;height:40px}.actions button{width:72px;height:72px}.actions button:last-child{width:62px;height:62px}.keys{display:none}.intro{padding:20px 30px}.intro h1{font-size:30px;margin:10px 0}.intro p{font-size:12px}.steps{margin:13px 0;padding-top:12px}#context{bottom:99px}#progress{bottom:88px}.label{font-size:9px;padding:3px 7px}}@media(max-width:600px) and (orientation:portrait){.brand{display:none}.order{padding:8px}.order small{font-size:8px}.stats{gap:8px;padding:8px}header{left:10px;right:10px;gap:8px}.intro{margin:15px;padding:25px}#overlay{padding:0}.intro h1{font-size:34px}.keys{display:none}#task{top:105px}.label{font-size:9px}}
#network{position:fixed;inset:0;background:#163b32ab;backdrop-filter:blur(5px);display:grid;place-items:center;z-index:15}#network[hidden]{display:none}.net-panel{width:min(470px,94vw);max-height:94vh;overflow:auto;background:#fff9e9;padding:25px 30px;border-radius:22px;box-shadow:0 30px 100px #10261d66}.net-panel>small{letter-spacing:2px;color:#ad673e;font-size:9px}.net-panel h2{margin:12px 0}.net-code{font:bold 36px Georgia;letter-spacing:7px;color:#bd603a}.net-panel p{font-size:12px;line-height:1.7;overflow-wrap:anywhere;color:#707d6b}.net-player{display:flex;gap:12px;align-items:center;border-bottom:1px solid #e3dfcd;padding:12px 0}.net-player>span{padding:7px;color:#fff;border-radius:7px}.net-player small{margin-left:auto;color:#7b8874}.net-panel button{padding:12px;border-radius:9px;background:#e6e9da;color:#375140;margin-top:12px}.net-buttons{display:flex;gap:12px}.net-buttons button{flex:1;background:#bd603a;color:#fff}.net-panel button:disabled{opacity:.45;cursor:not-allowed}#net-leave{float:right}#net-badge{position:fixed;top:85px;right:28px;z-index:8;padding:8px 12px;border-radius:10px;background:#2e5546;color:#fff;font-size:11px}#net-badge[hidden]{display:none}.net-entry{margin-top:15px;border-top:1px solid #d9d8c8;padding-top:12px}.net-entry button{padding:11px;background:#345b47;font-size:12px}.net-entry>div{display:flex;gap:10px;margin-top:10px}.net-entry input{width:100%;min-width:0;border:1px solid #d9dbc9;background:#fffdf4;padding:10px;border-radius:8px;color:#39513f}.net-entry>div button{width:90px}.net-entry label{display:flex;gap:10px;align-items:center;margin-top:10px;font-size:11px}.net-entry label input{padding:6px}.player-name{position:absolute;transform:translate(-50%,-50%);background:#244a3dd9;color:#fff;padding:3px 8px;border-radius:5px;font-size:10px;pointer-events:none}.intro{max-height:94vh;overflow:auto}@media(max-height:550px){.intro{padding:14px 25px;max-width:550px}.intro h1{font-size:23px;margin:8px 0}.intro p{display:none}.intro>small{margin-top:8px}.steps{margin:10px 0}.net-entry{margin-top:8px;padding-top:6px}.net-entry label{margin-top:6px}.net-entry button{padding:8px}.intro>button{padding:10px}#net-badge{top:66px;right:15px}.net-panel{padding:16px 24px}.net-player{padding:7px 0}.net-code{font-size:27px}}
#diagnostics{position:fixed;left:26px;bottom:175px;z-index:10;background:#fff9e9e8;border:1px solid #dce0cb;border-radius:9px;padding:8px 12px;font-size:10px;max-width:320px}#diagnostics summary{cursor:pointer}#diagnostics p{font-size:10px;line-height:1.7}#diagnostics button{padding:8px;border-radius:6px;background:#335848;color:white;font-size:11px}#plate-status{position:fixed;left:28px;top:220px;max-width:245px;background:#fff9e9e8;border-radius:10px;padding:10px 15px;font-size:12px;color:#3d5745;line-height:1.65}@media(max-height:550px){#diagnostics{left:15px;bottom:122px;padding:5px 8px;font-size:9px}#plate-status{left:15px;top:137px;font-size:10px;padding:6px 9px;max-width:160px}}

.order-board{min-width:240px;max-width:360px;flex:1}#orders{display:flex;gap:8px}.ticket{position:relative;flex:1;background:#fffbed;padding:10px 10px 14px;border-radius:8px;overflow:hidden;box-shadow:0 4px 14px #2343}.ticket b,.ticket span{display:block;font-size:12px}.ticket span{margin-top:4px;color:#647760}.ticket i{position:absolute;bottom:0;left:0;height:4px;background:#53836a}.ticket.urgent{background:#ffdfca}.ticket.urgent i{background:#cb5136}#combo{display:block;margin-top:5px;font-size:10px;background:#fffbe5df;border-radius:4px;padding:3px 8px}.stats small{display:block;font-size:10px;margin-top:4px}.panel p{line-height:1.9}@media(max-width:950px){header .brand{display:none}.order-board{min-width:0;max-width:320px}.ticket b{font-size:10px}.ticket{padding:7px 8px 10px}}@media(max-width:600px){header{gap:8px}.ticket span{font-size:10px}.stats{gap:6px;padding:8px}.stats strong{font-size:19px}.stats button{padding:7px}#task{top:130px}#plate-status{top:235px}}
#station-labels{position:fixed;inset:0;overflow:hidden;pointer-events:none}

.actions button{touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.actions button:active:not(:disabled){transform:translateY(3px);filter:brightness(1.15)}.actions button:disabled{opacity:.5;cursor:default}#joystick{user-select:none;-webkit-user-select:none}#context{max-width:70vw;text-align:center;pointer-events:none}@media(orientation:landscape){footer{left:max(20px,env(safe-area-inset-left));right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom))}}

#toast[data-kind="serve"],#toast[data-kind="done"]{border-left:5px solid #56866b}#toast[data-kind="expired"]{border-left:5px solid #c55638}.sound-setting{display:flex!important;align-items:center;gap:12px}.sound-setting input{width:20px;height:20px;accent-color:#365e49}.sound-setting small{font-size:10px;color:#7a8370}.label.feedback-flash{animation:station-feedback .8s ease-out}@keyframes station-feedback{0%{box-shadow:0 0 0 8px #efbd6bbb;background:#ffdf98}100%{box-shadow:0 0 0 16px #efbd6b00}}@media(prefers-reduced-motion:reduce){.label.feedback-flash{animation:none}}

.recipe-guide{margin:12px 0;background:#ecebd9;border:1px solid #c9cfb8;border-radius:10px;text-align:left}.recipe-guide summary{cursor:pointer;padding:12px;font-size:12px;font-weight:700;color:#355746}.guide-content{padding:0 14px 14px;font-size:12px;line-height:1.65;touch-action:pan-y}.guide-lead{color:#97502f;font-weight:700}.guide-content ol{padding-left:22px;margin:12px 0}.guide-content li{margin:10px 0;padding-left:4px}.guide-content b,.guide-content span{display:block}.guide-content p{display:block!important;font-size:11px!important;margin:8px 0;color:#425640!important}.guide-content small{font-size:10px;color:#65745d}.panel{max-height:92vh;overflow:auto;touch-action:pan-y}.intro{touch-action:pan-y}.label.recommended::before{content:"◆ ";color:#ae592e}.stats button:disabled{opacity:.45}@media(max-height:550px){.recipe-guide summary{padding:9px}.recipe-guide{margin:8px 0}.stats{gap:7px}}

#settings{z-index:12}@media(max-height:550px){.panel{width:min(580px,94vw);padding:18px 24px}.panel h2{margin:0 0 8px}.panel #resume{padding:10px}.guide-content ol{display:grid;grid-template-columns:1fr 1fr;column-gap:24px}}
#fullscreen{position:fixed;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:110;padding:8px 14px;border:1px solid #ddcda9;border-radius:20px;background:#fff8e9;color:#443124;font-size:12px}#browser-note{position:fixed;top:env(safe-area-inset-top,0px);left:10%;width:80%;z-index:120;background:#fff8e9;color:#443124;border:1px solid #b78045;border-radius:12px;padding:14px 38px 14px 16px;font-size:14px;box-shadow:0 8px 30px #0005}#browser-note button{position:absolute;right:8px;top:8px}.spectating footer,.spectating #task,.spectating #context,.spectating #progress{display:none!important}
/* Front-facing kitchen: keep the playfield legible and the HUD peripheral. */
:root{color-scheme:light}#diagnostics{display:none}body:has(#diagnostics[open]) #diagnostics{display:block}
@media(orientation:landscape){
 header{top:max(10px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));align-items:flex-start}
 header .brand{display:none}.order-board{flex:0 1 250px;max-width:250px}.ticket{box-shadow:0 3px 10px #233b3020;border:1px solid #e2d9bc}.stats{box-shadow:0 3px 10px #233b3020}
 #task{top:100px;left:14px;padding:10px 12px;max-width:170px;background:#294b3ee8}#task b{font-size:12px}#task span{display:none}#hand{margin-top:5px}
 #plate-status{top:174px;left:14px;font-size:10px;padding:6px 9px;max-width:170px}
 .label{font-size:11px;padding:4px 9px;border-radius:12px;box-shadow:0 2px 5px #0002}
 #context{bottom:52px;padding:6px 12px;max-width:42vw;font-size:11px}#progress{bottom:44px}
 .actions small,.keys{display:none}#fullscreen{font-size:11px;padding:6px 12px;bottom:10px}
}
@media(orientation:landscape) and (max-height:450px){
 .order-board{max-width:200px}.ticket b,.ticket span{font-size:10px}.ticket{padding:6px 8px 9px}#combo{font-size:9px}
 #task{top:88px;max-width:145px;padding:8px 10px}#task b{font-size:11px}#plate-status{top:151px;max-width:145px;font-size:9px}
 .stats{gap:7px;padding:7px 9px}.stats strong{font-size:21px}#net-badge{top:62px;font-size:10px}
}
#target-arrow{position:fixed;transform:translate(-50%,-50%);pointer-events:none;z-index:7;background:#fff5d8;color:#55391f;border:2px solid #bf7541;border-radius:20px;padding:6px 10px;font-size:11px;font-weight:bold;box-shadow:0 2px 9px #0002}#target-arrow::before{content:'➤';display:inline-block;transform:rotate(var(--angle));margin-right:7px;color:#b65a30}#target-arrow[hidden]{display:none}
#spectator-view{position:fixed;left:50%;bottom:max(58px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:10;display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:12px;background:#fff8e9ed;color:#335848;box-shadow:0 3px 15px #0002;font-size:12px;max-width:90vw}#spectator-view[hidden]{display:none}#spectator-view select{max-width:60vw;padding:8px;border:1px solid #bac8b2;border-radius:8px;background:#fffbed;color:#335848;font:inherit}.spectating #plate-status{display:none}
#level-select,#net-level{font:inherit;font-size:14px;max-width:100%;padding:10px;border-radius:8px;border:1px solid #bbc6ab;background:#fffbed;color:#335848}.intro>label{display:block;margin:12px 0;font-size:13px}.net-panel>label{display:block;margin:12px 0;font-size:13px}