*{box-sizing:border-box}html,body{margin:0;background:#071b23;color:#f5e8ca}body{font-family:'Trebuchet MS',Arial,sans-serif;background:linear-gradient(90deg,#071b23c9,#071b239e),url('./art/diner.png') center/cover fixed}button,label,input{touch-action:manipulation}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #60d6dc;outline-offset:3px}button{transition:filter .12s,transform .12s}button:hover{filter:brightness(1.13)}button:disabled{opacity:.5;cursor:default}button:active{transform:translateY(2px)}
html body [data-fp]{--bg:#0b242c;--panel:#143941;--panel2:#214950;--line:#59716b;--ink:#f5e8ca;--dim:#bbc6b8;--accent:#ffba64;--accentDeep:#9d6031;--accent2:#60d6dc;--danger:#ff9482;--good:#acda80;--onAccent:#17272b;--display:Impact,'Arial Narrow','Trebuchet MS',sans-serif;--body:'Trebuchet MS',Arial,sans-serif;--mono:Consolas,monospace;--r:7px;--glow:0 3px 0 #784b29;--tex:repeating-linear-gradient(135deg,#ffba64 0 9px,#143941 9px 18px);width:100%;height:100dvh!important;max-width:500px;min-height:420px;margin:auto;box-shadow:0 0 0 1px #967c50,0 0 0 8px #091c24,0 20px 80px #0009;padding-bottom:env(safe-area-inset-bottom);padding-top:env(safe-area-inset-top)}
[data-fp]>div{min-height:0}[data-fp] button{flex-shrink:0}[data-screen="title"]{background:linear-gradient(#0b242c,#153c43)!important}[data-screen="title"]>div>div[style*="padding:22px"]{padding-right:70px!important}[data-screen="title"] [style*="font-size:11px"]{letter-spacing:.07em!important}.diner-hero{display:block;width:calc(100% - 36px);height:auto;max-height:34dvh;aspect-ratio:1.5;object-fit:cover;margin:18px 18px 0;border:2px solid #967c50;border-radius:55px 55px 6px 6px;box-shadow:0 5px 0 #071b23;flex:none}
.world{background-image:url('./art/world.png');background-size:200% 200%;background-repeat:no-repeat}.station-art{height:116px;width:100%;border-radius:5px;flex:none}.unit-art{height:200px;border-radius:8px;background-position:100% 100%;flex:none}.room-art{height:340px;position:relative;flex:none;background-position:100% 0%;border:2px solid var(--line);border-radius:8px;overflow:hidden}.restaurant-art{height:320px;position:relative;flex:none;background-position:100% 100%;border:2px solid var(--line);border-radius:8px;overflow:hidden}.room-art button,.restaurant-art button{background:#071b23bc!important;text-shadow:0 1px 2px #000}.room-label{position:absolute;top:5px;left:10px;font-size:10px;background:#071b23ce;padding:3px 8px;border-radius:4px}.handover-art{height:220px;background:url('./art/diner.png') center/cover;position:relative;border:2px solid var(--accent);border-radius:8px;flex:none}
.character{background-image:url('./art/characters.png');background-size:400% 300%;background-repeat:no-repeat;display:block}.customer-scene{position:relative;height:180px;flex:none;border-radius:8px;overflow:hidden;background:linear-gradient(#071b2333,#071b2399),url('./art/diner.png') center/cover;border:1px solid var(--line)}.customer{width:180px;height:180px;margin:auto;filter:drop-shadow(0 4px 0 #06141a)}.customer-small{width:60px;height:60px;flex:none;background-color:var(--panel2);border-radius:8px}.reaction{height:180px}.reaction-line{position:absolute;bottom:8px;left:8px;right:8px;text-align:center;padding:6px;background:#0b242cdd;border-radius:5px;font-size:13px}.pet-icon{width:24px;height:24px;flex:none}.pet-icon.large{width:56px;height:56px}.employee{background-position:100% 100%}.uniform-scene{position:relative;height:220px;flex:none;background:radial-gradient(ellipse at bottom,#32606b,#102f38);border-radius:12px;border:1px solid var(--line)}.uniform-scene>.employee{width:220px;height:220px;margin:auto}.shoulder-pet{position:absolute;width:75px;height:75px;top:65px;left:56%}.promotion-badge{height:160px;display:flex;gap:20px;align-items:center;justify-content:center;border:3px double var(--accent);border-radius:18px;background:#224851}.promotion-badge>.employee{width:130px;height:130px}.promotion-badge strong{color:var(--accent)}
.shop-art{height:104px;width:104px;align-self:center}.decor-icon{display:flex;align-items:center;justify-content:center;min-width:46px;height:48px;font-size:36px;font-family:Georgia,serif;color:var(--accent2);text-shadow:2px 2px #071b23}.shop-art.decor-icon{font-size:52px;height:104px}.decor-icon.placed{height:32px;font-size:25px;min-width:0}.room-indicator{color:var(--accent2);font-size:16px}.ingredient{width:74px;height:64px;display:block;flex:none}.pantry{background-image:url('./art/pantry.png');background-size:400% 500%;background-repeat:no-repeat}.drink-icon{display:flex;align-items:center;justify-content:center;font-size:48px;color:var(--food);-webkit-text-stroke:1px #ecdfc5;filter:drop-shadow(0 3px #071b23)}
.utility-button{display:flex;align-items:center;justify-content:center;min-height:46px;border:1px solid var(--line);border-radius:7px;background:var(--panel2);color:var(--ink);font-size:15px;cursor:pointer}.import-label{position:relative;overflow:hidden}.import-label input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}.home-link{border:0;background:transparent;color:var(--accent2);font:inherit;text-decoration:underline;min-height:40px}
[data-screen="build"]>div:last-child{overflow:auto}[data-screen="build"] button[style*="height:110px"]{height:102px!important}[data-screen="reveal"]>div:last-child{overflow:auto}[data-screen="reveal"] .customer-scene{height:clamp(120px,21dvh,180px)}[data-screen="reveal"] .customer{width:clamp(120px,21dvh,180px);height:clamp(120px,21dvh,180px)}
@media(min-width:750px){body{padding:20px}html body [data-fp]{height:calc(100dvh - 40px)!important;max-height:920px;border-radius:16px;overflow:hidden}.diner-hero{max-height:300px}}
@media(max-height:720px){.diner-hero{max-height:26dvh}[data-screen="title"] p{font-size:13px!important}[data-screen="title"] [style*="padding:18px 22px"]{padding:12px 18px!important}[data-screen="build"] button[style*="height:110px"]{height:84px!important}.ingredient{width:56px;height:48px}.customer-scene{height:135px}.customer{height:135px;width:135px}[data-screen="build"] [style*="padding:14px"]{gap:8px!important}.station-art{height:90px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.employee{background-size:400% 338.32%;background-position:100% 100%}
html body [data-fp]{font-family:'Trebuchet MS',Arial,sans-serif!important}
html body [data-fp] button{font-family:inherit}
[data-fp]>div[style*="z-index:20"] button{position:relative;z-index:22}
