:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#eee5d5;background:#1c221c;--gold: #c5a66d;--mint: #93b09b;--muted: #afa38d;--ink: #302f25;--surface: #292c24;--border: #625640;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body{margin:0;min-width:0}body{min-height:100vh;background:radial-gradient(ellipse at 15% 0,#65513a55,transparent 65%),linear-gradient(125deg,#171d18,#28271f)}button,input{font:inherit}button{border:1px solid #625640;border-radius:6px;background:#38382d;color:#e8dfcc;min-height:40px;cursor:pointer;touch-action:manipulation;transition:filter .13s,transform .13s}button:active:not(:disabled){transform:translateY(1px)}@media(hover:hover){button:hover:not(:disabled){filter:brightness(1.08)}}button:disabled{opacity:.38;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #c9b47a;outline-offset:3px}button.gold{background:#c5a66d;color:#20251d;font-weight:600;box-shadow:none;border-color:#d6b87e}#app{max-width:1780px;margin:auto;padding:20px 24px}header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:17px}.brand{display:flex;align-items:center;gap:12px;min-width:0}.logo{font-size:34px;filter:none}small{font-size:10px;letter-spacing:1.7px;color:var(--gold)}h1{margin:4px 0 0;font-size:34px;letter-spacing:-.5px;text-shadow:none;font-family:Georgia,Times New Roman,serif;font-weight:500}h2,h3,p{margin:0}.hud{display:flex;gap:27px;border-inline:1px solid #d4bd8d22;padding:6px 22px;font-size:10px;color:#c8beab}.hud small{display:block;color:#c8beab;letter-spacing:.4px;font-size:10px;margin-bottom:5px}.hud strong{font-size:22px;color:var(--gold);font-variant-numeric:tabular-nums}.top-nav{display:flex;gap:6px;flex-shrink:0}.top-nav button{padding:7px 11px;font-size:11px;font-weight:600}.top-nav .help-button{min-width:40px}.nav-label-short{display:none}main{display:grid;grid-template-columns:minmax(0,1fr) 345px;gap:17px;align-items:start;min-width:0}.room{min-width:0;border:1px solid #6c5b40;border-radius:9px;background:#20271f;overflow:hidden;position:sticky;top:12px;box-shadow:0 10px 28px #0003}.room-heading,.room-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 18px;font-size:10px;background:#2b3026;letter-spacing:1px}.room-heading{border-bottom:1px solid #161b18}.room-heading span:first-child{color:#d7c6a9}.room-heading span:last-child{color:#afa38d;letter-spacing:0;text-align:right}.stage{aspect-ratio:1100 / 740;position:relative;background:#292e25;overflow:hidden}#game{position:absolute;top:0;right:0;bottom:0;left:0;min-width:0;min-height:0}canvas{display:block;touch-action:none}.room-footer{border-top:1px solid #161b18;letter-spacing:0;font-size:12px;background:#232a21;color:#d7c6a9}#action-status{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#clock{flex-shrink:0;font-variant-numeric:tabular-nums;color:#9f927c}#welcome,#paused-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:6;display:flex;align-items:center;justify-content:center;flex-direction:column;background:linear-gradient(90deg,#151b16e5,#2f281ec7);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);text-align:center;padding:22px}#welcome[hidden],#loading[hidden],#paused-overlay[hidden]{display:none!important}#welcome h2,#paused-overlay h2{font-family:Georgia,serif;font-size:clamp(27px,3.5vw,54px);color:#f1e7d1;line-height:1.12;margin:14px 0;text-shadow:none}#welcome p,#paused-overlay p{font-size:14px;color:#c8beab;line-height:1.65}#welcome button,#paused-overlay button{font-size:18px;padding:13px 30px;min-height:55px;min-width:245px;margin:23px 0 14px;border-width:1px}#welcome button span,#paused-overlay button span{padding-left:13px}.hint{color:#c8beab;font-size:11px;letter-spacing:0}#loading{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:grid;place-items:center;background:#302f26;color:var(--gold)}.reviews{padding:16px 18px;min-height:111px}.reviews>small{font-size:9px;letter-spacing:2px}.review-row{display:flex;gap:10px;font-size:11px;line-height:1.7;margin-top:11px}.avatar{width:30px;height:30px;border:1px solid #161b18;border-radius:50%;display:grid;place-items:center;background:#a7b89b;color:#233025;font-weight:600;flex-shrink:0}.stars{color:var(--gold)}.review-row p{color:#c8beab}.muted{color:var(--muted);font-size:12px;line-height:1.7}aside{min-width:0;max-height:calc(100vh - 115px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#625640 transparent;padding:0 4px 8px 0}.mobile-context,.mobile-nav{display:none}.panel{border:1px solid #5b503e;background:linear-gradient(135deg,#343127,#292d24);padding:14px;border-radius:8px;margin-bottom:11px;box-shadow:none}.heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px}.heading h2{font-size:14px}.heading>span,.heading>small{font-size:9px;color:#afa38d;letter-spacing:0}.order{display:block;width:100%;padding:9px 11px;text-align:left;margin-bottom:7px;background:#232820;border:1px solid #625640;min-height:65px}.order.active{border-color:#c4a46d;box-shadow:inset 2px 0 #c4a46d;background:#383b2c}.order-line{display:flex;justify-content:space-between;font-size:11px;gap:8px}.order-line span{color:#c7a56a;font-size:9px}.order p{font-size:10px;color:#afa38d;margin-top:4px}.track{height:4px;background:#161b18;border-radius:5px;margin-top:7px;overflow:hidden}.track span{display:block;height:100%;border-radius:5px;background:#93b09b}.label{display:block;color:#9f927c;font-size:9px;letter-spacing:1.2px;margin-bottom:7px}.recipe-title{display:flex;justify-content:space-between;gap:8px;margin-bottom:8px;align-items:start}.recipe-title h3{font:24px Georgia,serif;line-height:1.1;color:#d7bd8e}.price{font-size:10px;color:var(--gold);white-space:nowrap;padding-top:4px}.note{font-size:10px;line-height:1.7;color:#afa38d}.checklist{margin:12px 0 8px;display:grid;gap:6px}.check-row{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#c8beab}.check-row.done{color:#93b09b}.check-row.over{color:#d7a388}.link{font-size:10px;min-height:22px;padding:0;border:0;background:transparent;color:#c4a46d;text-decoration:underline;text-underline-offset:3px}#station-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:13px}.station{font-size:9px;min-height:33px;padding:5px 2px;border:1px solid #625640;background:#292c24}.station.selected{background:#6c5838;border-color:#c4a46d;color:#f1e7d1}.ingredient{display:flex;align-items:center;gap:10px;padding:9px;background:#232820;border:1px solid #625640;border-radius:8px;margin-bottom:7px}.bottle{width:12px;height:26px;border:1px solid #161b18;border-radius:4px;box-shadow:none;flex-shrink:0;position:relative}.bottle:before{content:"";position:absolute;top:-6px;left:1px;width:6px;height:5px;background:#c9b58b;border:1px solid #161b18}.ingredient-body{flex:1;min-width:0}.ingredient-name{font-size:11px;color:#d7c6a9;margin-bottom:5px}.measuring{display:flex;align-items:center;gap:5px}.step{width:24px;min-height:24px;padding:0;font-size:12px;border:1px solid #625640;border-radius:5px}.measure{min-width:50px;text-align:center;font-size:10px;color:#c8beab}input.measure{width:58px;min-width:0;background:#1b211c;border:1px solid #625640;border-radius:4px;color:#d7c6a9;padding:3px 2px;font-family:inherit;font-size:12px;text-align:center}.collect{min-height:30px;font-size:10px;font-weight:600;padding:4px 8px;background:#a7b89b;color:#233025;border-color:#b7c5aa}.carry,.ready{padding:11px;border:1px solid #6d856d;border-radius:8px;background:#2c3b2c;color:#cfdbc1;font-size:11px;line-height:1.7;margin-top:12px}#carry:not(:empty){margin-bottom:12px}.carry button,.serve{display:block;width:100%;margin-top:8px;font-size:11px;font-weight:600;background:#a7b89b;color:#233025}.serve{background:#c5a66d !important!important;color:#20251d !important!important}.tray-items{display:grid;gap:5px;list-style:none;margin:9px 0 11px;padding:0}.tray-items>*{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:6px 8px;border:1px solid #53624b;border-radius:4px;background:#1c2b20;color:#d1dbc5;line-height:1.5}.tray-items strong{font-weight:600;color:#e4ecd7}.tray-items .note{color:#a8b59b}.tray-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px;margin-top:10px}.tray-actions button{display:block;width:100%;min-height:44px;margin:0;padding:8px 7px;font-size:12px;line-height:1.35;font-weight:600;border-radius:5px}.tray-actions button:first-child{color:#cad6bd;background:transparent;border:1px solid #839476}.tray-actions button:last-child{color:#202c20;background:#afbf9e;border:1px solid #bdcaad}.tray-count,.tray-capacity{display:inline-block;font-size:11px;font-variant-numeric:tabular-nums;padding:2px 6px;margin-left:5px;color:#e0c48d;background:#383d2c;border:1px solid #706141;border-radius:4px}body[data-view=mobile] .tray-items{font-size:12px}body[data-view=mobile] .tray-actions button{min-height:48px;padding:7px 6px;font-size:12px}.batch-list{font-size:11px;line-height:1.8;color:#afa38d;min-height:25px}#methods{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:12px}.method{font-size:10px;min-height:59px;padding:6px 2px;border:1px solid #161b18;box-shadow:none}.method b{display:block;font:20px Georgia,serif;color:#c4a46d;margin-bottom:3px}.method small{display:block;font-size:8px;color:#afa38d;letter-spacing:0;margin-top:4px}.fine{text-align:center;font-size:9px;line-height:1.6;color:#9f927c}.progress{height:5px;background:#161b18;border-radius:5px;overflow:hidden;margin-top:10px}.progress span{display:block;height:100%;background:#c7a56a}footer{text-align:center;color:#9f927c;font-size:10px;padding:22px 0 0}#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,15px);opacity:0;pointer-events:none;z-index:30;border:1px solid #e1c896;border-radius:8px;background:#d2b880;color:#242a20;font-size:12px;padding:12px 20px;box-shadow:0 8px 24px #0004;transition:.2s;max-width:90vw}#toast.show{opacity:1;transform:translate(-50%)}dialog{width:min(800px,calc(100vw - 28px));max-height:86vh;overflow-y:auto;padding:24px;border:1px solid #85704d;border-radius:8px;background:#2b2e25;color:#eee5d5;box-shadow:0 20px 70px #0006}dialog::backdrop{background:#111811c9;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}dialog .heading h2{font:30px Georgia,serif;margin-top:5px}dialog .heading button{width:40px;font-size:20px}.book-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.book-card{padding:17px;border:1px solid #625640;border-radius:8px;background:#23291f;border-color:#5c533e}.book-card h3{font:22px Georgia,serif;color:#d7bd8e;margin-bottom:9px}.method-badge{font-size:10px;border-radius:5px;padding:4px 8px;background:#4b4834;color:#d9bd83;display:inline-block}.book-card ul{font-size:12px;color:#c8beab;line-height:1.8;padding-left:17px;margin:11px 0}.book-card p{font-size:11px;line-height:1.7;color:#afa38d}.book-card a{font-size:10px;color:#c4a46d;display:block;margin-top:12px}.modal-note{font-size:11px;line-height:1.7;color:#afa38d;margin-top:17px}.shop-balance{font-size:14px;color:#c7a56a;margin-bottom:14px}.upgrade{display:flex;gap:13px;align-items:center;background:#23291f;border:1px solid #625640;border-radius:8px;padding:16px;margin-bottom:10px;border-color:#5c533e}.upgrade-icon{font-size:27px;width:38px;text-align:center}.upgrade-copy{flex:1;min-width:0}.upgrade h3{font-size:15px;color:#d7bd8e}.upgrade p{font-size:11px;line-height:1.7;color:#afa38d;margin-top:5px}.upgrade .level{font-size:10px;color:#93b09b;margin-top:6px}.upgrade button{font-size:11px;background:#c5a66d;color:#20251d;font-weight:600;padding:7px 11px;min-width:91px;border-color:#d6b87e}.help-step{display:flex;gap:12px;font-size:13px;line-height:1.8;color:#c8beab;margin-bottom:16px}.help-step b{display:block;color:#d7bd8e}.help-step>span{width:29px;height:29px;border-radius:50%;border:1px solid #161b18;background:#c7a56a;color:#22271e;display:grid;place-items:center;flex-shrink:0;font-weight:600}.new-game{background:#633e31;color:#e3c7b7;font-size:11px;padding:7px 13px;margin-top:14px}@media(max-width:1180px){#app{padding:14px}header{gap:12px}.hud{gap:14px;padding:6px 13px}.hud strong{font-size:19px}.logo{font-size:27px}h1{font-size:29px}.top-nav button{font-size:10px;padding:6px 8px}main{grid-template-columns:minmax(0,1fr) 305px;gap:11px}.panel{padding:12px}}body[data-view=mobile]{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body[data-view=mobile]{min-height:0}body[data-view=mobile] #app{width:100%;height:100vh;height:100dvh;max-width:480px;padding:max(7px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) 0 max(8px,env(safe-area-inset-left));display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:7px}body[data-view=mobile] header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 8px;margin:0;min-width:0}body[data-view=mobile] .brand{gap:0}body[data-view=mobile] .logo{display:none}body[data-view=mobile] .brand small{font-size:7px;letter-spacing:1.2px;white-space:nowrap}body[data-view=mobile] h1{font-size:24px;margin-top:2px;line-height:1.05}body[data-view=mobile] .top-nav{gap:4px}body[data-view=mobile] .top-nav button{min-width:44px;min-height:44px;padding:5px 7px;font-size:11px;border-radius:8px}body[data-view=mobile] .nav-label-long{display:none}body[data-view=mobile] .nav-label-short{display:inline}body[data-view=mobile] .hud{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.15fr) auto;gap:7px;padding:5px 8px;border:1px solid #d4bd8d24;border-radius:8px;background:#3b382c55}body[data-view=mobile] .hud>div{min-width:0;white-space:nowrap}body[data-view=mobile] .hud small{font-size:8px;letter-spacing:.1px;margin-bottom:1px}body[data-view=mobile] .hud strong{font-size:18px;line-height:1.05}body[data-view=mobile] .hud-unit{font-size:9px}body[data-view=mobile] main{min-height:0;min-width:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,38vh);grid-template-rows:minmax(0,1fr) minmax(0,38dvh);gap:7px;align-items:stretch;overflow:hidden}body[data-view=mobile] .room{position:relative;top:0;min-height:0;display:flex;flex-direction:column;border-width:1px;border-radius:8px;box-shadow:none}body[data-view=mobile] .room-heading{flex:0 0 auto;min-height:25px;padding:6px 9px;font-size:8px;letter-spacing:.6px}body[data-view=mobile] .room-heading span:last-child{font-size:9px}body[data-view=mobile] .stage{flex:1 1 auto;width:100%;min-height:0;aspect-ratio:auto}body[data-view=mobile] .room-footer{flex:0 0 auto;padding:7px 9px;min-height:30px;font-size:10px}body[data-view=mobile] .reviews{display:none}body[data-view=mobile] aside{min-height:0;height:100%;max-height:38vh;max-height:38dvh;overflow-x:hidden;overflow-y:auto;padding:0 3px 3px 0;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}body[data-view=mobile] .mobile-context{display:block;position:sticky;top:0;z-index:2;background:#232820f5;border:1px solid #514734;border-radius:7px;color:#c8beab;font-size:11px;line-height:1.4;padding:7px 9px;margin:0 0 7px}body[data-view=mobile] aside>[data-mobile-panel]{display:none}body[data-view=mobile][data-mobile-panel=orders] aside>[data-mobile-panel=orders],body[data-view=mobile][data-mobile-panel=ingredients] aside>[data-mobile-panel=ingredients],body[data-view=mobile][data-mobile-panel=mix] aside>[data-mobile-panel=mix]{display:block}body[data-view=mobile] .panel{margin-bottom:7px;padding:11px;border-radius:8px;box-shadow:none}body[data-view=mobile] .heading{margin-bottom:9px}body[data-view=mobile] .heading h2{font-size:15px}body[data-view=mobile] .heading>span,body[data-view=mobile] .heading>small{font-size:10px}body[data-view=mobile] .order{min-height:75px;padding:10px}body[data-view=mobile] .order-line{font-size:13px}body[data-view=mobile] .order-line span{font-size:10px}body[data-view=mobile] .order p{font-size:12px}body[data-view=mobile] .track{height:5px}body[data-view=mobile] .label{font-size:10px}body[data-view=mobile] .recipe-title h3{font-size:23px}body[data-view=mobile] .price{font-size:11px}body[data-view=mobile] .note,body[data-view=mobile] .check-row{font-size:12px}body[data-view=mobile] .muted{font-size:13px;line-height:1.55}body[data-view=mobile] .checklist{gap:7px}body[data-view=mobile] .link{min-height:44px;padding:6px 2px;font-size:12px}body[data-view=mobile] #station-tabs{gap:5px;margin-bottom:10px}body[data-view=mobile] .station{min-height:44px;padding:5px 3px;font-size:11px;line-height:1.15}body[data-view=mobile] .ingredient{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:7px;padding:8px;align-items:center}body[data-view=mobile] .ingredient-name{font-size:13px;margin-bottom:7px}body[data-view=mobile] .measuring{display:grid;grid-template-columns:44px minmax(44px,1fr) 44px;gap:3px 4px;align-items:center}body[data-view=mobile] .measuring .step:first-child{grid-column:1;grid-row:1}body[data-view=mobile] .measuring .step:last-child{grid-column:3;grid-row:1}body[data-view=mobile] .step{width:44px;min-height:44px;font-size:20px;border-radius:7px}body[data-view=mobile] input.measure{grid-column:2;grid-row:1;width:100%;height:44px;min-height:44px;padding:4px 1px;font-size:16px;border-radius:6px}body[data-view=mobile] .measuring>.note{grid-column:1 / -1;grid-row:2;text-align:center;font-size:10px;line-height:1.2}body[data-view=mobile] .collect{min-width:48px;min-height:48px;padding:5px;font-size:11px;line-height:1.15}body[data-view=mobile] .carry,body[data-view=mobile] .ready,body[data-view=mobile] .batch-list{font-size:13px}body[data-view=mobile] .carry button,body[data-view=mobile] .serve{min-height:48px;padding:7px;font-size:13px}body[data-view=mobile] #methods{gap:5px}body[data-view=mobile] .method{min-height:70px;font-size:12px}body[data-view=mobile] .method b{font-size:21px}body[data-view=mobile] .method small{font-size:9px}body[data-view=mobile] aside>.fine{display:none}body[data-view=mobile] .mobile-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:5px 0 max(7px,env(safe-area-inset-bottom));border-top:1px solid #625640;background:#232820e8}body[data-view=mobile] .mobile-nav button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:48px;padding:7px 4px;font-size:12px;font-weight:600;background:#343127;color:#c8beab;border-color:#161b18}body[data-view=mobile] .mobile-nav-icon{display:grid;place-items:center;width:22px;height:22px;font-size:11px;background:#232820;border:1px solid #625640;border-radius:50%}body[data-view=mobile][data-mobile-panel=orders] .mobile-nav button[data-id=orders],body[data-view=mobile][data-mobile-panel=ingredients] .mobile-nav button[data-id=ingredients],body[data-view=mobile][data-mobile-panel=mix] .mobile-nav button[data-id=mix]{background:#a7b89b;color:#233025;border-color:#384a37;box-shadow:none}body[data-view=mobile][data-mobile-panel=orders] .mobile-nav button[data-id=orders] .mobile-nav-icon,body[data-view=mobile][data-mobile-panel=ingredients] .mobile-nav button[data-id=ingredients] .mobile-nav-icon,body[data-view=mobile][data-mobile-panel=mix] .mobile-nav button[data-id=mix] .mobile-nav-icon{background:#3d5743;color:#e4ecd7;border-color:#384a37}body[data-view=mobile] #app>footer{display:none}body[data-view=mobile] #welcome,body[data-view=mobile] #paused-overlay{padding:12px}body[data-view=mobile] #welcome>small:first-child,body[data-view=mobile] #paused-overlay>small:first-child{font-size:8px;letter-spacing:1.5px}body[data-view=mobile] #welcome h2,body[data-view=mobile] #paused-overlay h2{font-size:clamp(24px,5vw,36px);margin:10px 0}body[data-view=mobile] #welcome p,body[data-view=mobile] #paused-overlay p{font-size:12px;line-height:1.45}body[data-view=mobile] #welcome button,body[data-view=mobile] #paused-overlay button{min-width:220px;min-height:52px;font-size:18px;margin:17px 0 11px;padding:9px 20px}body[data-view=mobile] #welcome .hint{font-size:10px}body[data-view=mobile] #toast{bottom:calc(70px + env(safe-area-inset-bottom));max-width:calc(100vw - 24px);width:max-content;font-size:12px;padding:10px 13px}body[data-view=mobile] dialog{width:calc(100vw - 18px);max-height:calc(100vh - 18px);max-height:calc(100dvh - 18px);padding:16px;border-radius:8px}body[data-view=mobile] dialog .heading{position:sticky;top:-16px;z-index:2;background:#302f26;padding:8px 0}body[data-view=mobile] dialog .heading h2{font-size:26px}body[data-view=mobile] dialog .heading button{width:44px;min-height:44px}body[data-view=mobile] .book-grid{grid-template-columns:1fr}body[data-view=mobile] .book-card{padding:14px}body[data-view=mobile] .book-card ul{font-size:14px}body[data-view=mobile] .book-card p,body[data-view=mobile] .modal-note{font-size:12px}body[data-view=mobile] .book-card a{min-height:44px;padding-top:12px;font-size:12px}body[data-view=mobile] .upgrade{gap:9px;padding:12px}body[data-view=mobile] .upgrade-icon{display:none}body[data-view=mobile] .upgrade button{min-width:84px;min-height:48px;font-size:12px}body[data-view=mobile] .help-step{font-size:14px}body[data-view=mobile] .new-game{min-height:44px;padding:8px 14px;font-size:13px}@supports selector(main:has(#welcome)){body[data-view=mobile] main:has(#welcome:not([hidden])){grid-template-rows:minmax(0,1fr)}body[data-view=mobile] main:has(#welcome:not([hidden])) aside{display:none}body[data-view=mobile]:has(#welcome:not([hidden])) .mobile-nav{display:none}}@media(max-width:1100px)and (max-height:600px)and (orientation:landscape){body[data-view=mobile]{width:100%;height:100%;overflow:hidden}body[data-view=mobile]{min-height:0}body[data-view=mobile] #app{width:100%;height:100vh;height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:5px;padding:max(4px,env(safe-area-inset-top)) max(7px,env(safe-area-inset-right)) 0 max(7px,env(safe-area-inset-left));max-width:none}body[data-view=mobile] header{display:grid;grid-template-columns:minmax(80px,110px) minmax(0,1fr) auto;gap:8px;margin:0;align-items:center}body[data-view=mobile] .brand{gap:0}body[data-view=mobile] .brand small{font-size:6px;letter-spacing:.8px}body[data-view=mobile] .logo{display:none}body[data-view=mobile] h1{font-size:23px}body[data-view=mobile] .hud{grid-column:2;grid-row:1;border:0;padding:2px 5px;gap:7px}body[data-view=mobile] .hud small{font-size:8px;margin-bottom:1px}body[data-view=mobile] .hud strong{font-size:17px}body[data-view=mobile] .top-nav{grid-column:3;grid-row:1;gap:4px}body[data-view=mobile] .top-nav button{min-height:44px;min-width:44px;padding:5px 7px;font-size:11px}body[data-view=mobile] main{grid-template-columns:minmax(0,1fr) clamp(260px,35vw,340px);grid-template-rows:minmax(0,1fr);min-height:0;gap:7px;overflow:hidden;align-items:stretch}body[data-view=mobile] .room{position:relative;top:0;min-height:0;display:flex;flex-direction:column;border-width:1px;border-radius:8px}body[data-view=mobile] .room-heading{min-height:23px;padding:5px 8px;font-size:7px}body[data-view=mobile] .room-heading span:last-child{font-size:8px}body[data-view=mobile] .stage{width:100%;min-height:0;flex:1 1 auto;aspect-ratio:auto}body[data-view=mobile] .room-footer{min-height:27px;padding:6px 8px;font-size:10px}body[data-view=mobile] .reviews{display:none}body[data-view=mobile] aside{max-height:45vh;max-height:45dvh;height:100%;min-height:0;align-self:center;overflow-y:auto;overflow-x:hidden}body[data-view=mobile] .mobile-context{font-size:10px;padding:5px 7px}body[data-view=mobile] .panel{padding:9px}body[data-view=mobile] .ingredient{gap:5px;padding:6px}body[data-view=mobile] .ingredient-name{font-size:12px}body[data-view=mobile] .measuring{grid-template-columns:44px minmax(40px,1fr) 44px;gap:3px}body[data-view=mobile] .collect{min-width:45px;padding:4px}body[data-view=mobile] .mobile-nav{padding-top:3px;padding-bottom:max(4px,env(safe-area-inset-bottom))}body[data-view=mobile] .mobile-nav button{min-height:44px;padding:4px;font-size:11px}body[data-view=mobile] #welcome h2,body[data-view=mobile] #paused-overlay h2{font-size:26px;margin:7px 0}body[data-view=mobile] #welcome p,body[data-view=mobile] #paused-overlay p{font-size:11px}body[data-view=mobile] #welcome button,body[data-view=mobile] #paused-overlay button{min-height:48px;margin:10px 0 6px;padding:7px 18px}body[data-view=mobile] #welcome .hint{font-size:9px}body[data-view=mobile] .welcome-break{display:none}body[data-view=mobile] #app>footer{display:none}@supports selector(main:has(#welcome)){body[data-view=mobile] main:has(#welcome:not([hidden])){grid-template-columns:minmax(0,1fr)}}}@media(max-width:370px)and (orientation:portrait){body[data-view=mobile] .brand small{font-size:6px}body[data-view=mobile] h1{font-size:21px}body[data-view=mobile] .top-nav{gap:3px}body[data-view=mobile] .top-nav button{padding-inline:5px;font-size:10px}body[data-view=mobile] .hud{padding-inline:6px}body[data-view=mobile] .hud-unit{font-size:8px}body[data-view=mobile] .mobile-nav button{font-size:11px;gap:5px}}body[data-view=desktop]{min-width:960px;overflow-x:auto}.view-switch{display:flex;align-items:center;gap:2px;border:1px solid #625640;border-radius:8px;padding:2px;background:#1b211c;flex-shrink:0}.view-switch a{display:grid;place-items:center;min-height:36px;min-width:55px;padding:5px 7px;font-size:10px;font-weight:600;color:#afa38d;text-decoration:none;border-radius:5px}body[data-view=desktop] .view-switch a[data-view-link=desktop],body[data-view=mobile] .view-switch a[data-view-link=mobile]{color:#233025;background:#a7b89b;box-shadow:none}html:has(body[data-view=mobile]){overflow:hidden;overscroll-behavior:none}body[data-view=mobile]{min-width:0;width:100%;height:100vh;height:100dvh;overflow:hidden}body[data-view=mobile] #app{max-width:480px;margin-inline:auto;border-inline:1px solid #6256404a;box-shadow:none}body[data-view=mobile] .hud{gap:5px;padding-inline:6px}body[data-view=mobile] .hud small{white-space:normal;line-height:1.1}body[data-view=mobile] .view-switch{align-self:center;gap:2px;padding:1px}body[data-view=mobile] .view-switch a{min-width:46px;min-height:48px;padding:4px;font-size:9px}body[data-view=mobile] button{min-height:48px}body[data-view=mobile] .step{width:44px;min-height:48px}body[data-view=mobile] input.measure{min-height:48px;height:48px}body[data-view=mobile] .method{min-height:70px}body[data-view=mobile] .link,body[data-view=mobile] .mobile-nav button{min-height:48px}body[data-view=mobile] .top-nav .help-button{min-width:44px}@media(max-width:1100px)and (max-height:600px)and (orientation:landscape){body[data-view=mobile] #app{max-width:none;width:100%;margin:0;border:0;box-shadow:none}body[data-view=mobile] header{grid-template-columns:minmax(76px,100px) minmax(0,1fr) auto;gap:6px}body[data-view=mobile] .hud{padding-inline:4px;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.15fr) auto}body[data-view=mobile] .view-switch a{min-width:46px;min-height:48px}body[data-view=mobile] .top-nav button{min-height:48px}}