@font-face{font-family:LastCallArcade;src:url(assets/arcade.woff) format('woff');font-display:swap}
:root{--ink:#0c161d;--gold:#e8bf6e;--cream:#fff0ca;--mint:#9fe4cf;--hh-safe-left:env(safe-area-inset-left,0px);--hh-safe-right:env(safe-area-inset-right,0px);--hh-safe-top:env(safe-area-inset-top,0px);--hh-safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--ink);color:var(--cream);font:16px/1.5 Arial,sans-serif}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{color:var(--cream);background:#233b46;border:1px solid var(--gold);border-radius:5px;min-height:44px;padding:9px 17px;cursor:pointer;font-weight:700;touch-action:manipulation}button:hover{background:#33505b}button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:3px}button.primary{background:var(--gold);color:#17282b}button:disabled{opacity:.48;cursor:default}a{color:var(--gold)}[hidden]{display:none!important}
#game{position:fixed;inset:0;touch-action:none;user-select:none;-webkit-user-select:none}#board{display:block;width:100%;height:100%;outline:none}
#hud{position:absolute;z-index:5;left:0;top:0;width:100%;height:70px;background:linear-gradient(#080d16ed,#101820c9,transparent);display:grid;grid-template-columns:1fr 1fr 1.35fr 1fr;gap:8px;text-align:center;pointer-events:none;padding:8px 65px 4px;font-family:LastCallArcade,monospace;text-shadow:2px 2px #14202a}
#hud span{display:block;font-size:10px;margin-bottom:4px}#hud strong{font-size:18px;font-weight:400;white-space:nowrap}#hud .champion strong{font-size:13px}#beers{display:flex;justify-content:center;gap:7px;padding:2px}#beers i{display:block;width:22px;height:25px;background:url(assets/beer.webp) center/contain no-repeat}#beers i.empty{filter:grayscale(1);opacity:.25}#hud.low #clock{color:#ffaaa2}
#jobStrip{position:absolute;left:0;right:0;bottom:64px;min-height:40px;background:#0d1723f0;border-bottom:2px solid #ae8c4b;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 12px;font:9px LastCallArcade,monospace}#jobStrip #personal{color:var(--mint);font-size:8px}#jobStrip div{display:flex;gap:6px}#jobStrip button{min-height:30px;padding:6px 12px;font:10px Arial}
#controls{position:absolute;z-index:10;bottom:0;left:0;right:0;height:64px;display:flex;align-items:center;justify-content:space-between;padding:6px 14px;background:#101923f7;border-top:1px solid var(--gold);pointer-events:none}#controls .pad{display:flex;gap:8px;pointer-events:auto}#controls button{height:50px;min-width:52px;padding:7px;font-size:22px;touch-action:none}#controls [data-act=rotate],#controls [data-act=drop]{width:88px;font-size:12px}#controls [data-act=drop]{background:#aa7837}#controls .held{background:#d4ac61;color:#14212a}#goal{font-size:12px;text-align:center;margin:0 8px;line-height:1.35}#goal small{font-size:10px;color:#a9dacc}
#toast{position:absolute;z-index:15;bottom:116px;left:50%;transform:translateX(-50%);margin:0;max-width:70%;background:#11252dec;border:1px solid var(--gold);padding:8px 16px;text-align:center;font-weight:bold;pointer-events:none;opacity:0;transition:opacity .16s}#toast.visible{opacity:1}
#home{position:fixed;inset:0;overflow:auto;padding:20px max(22px,var(--hh-safe-right)) 30px max(22px,var(--hh-safe-left));background:radial-gradient(ellipse at 25% 20%,#254a42,#112028 65%);-webkit-overflow-scrolling:touch}#home .wrap{max-width:1220px;margin:auto}nav{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap}nav a,nav button{min-height:40px;padding:8px 12px;font-size:12px}nav a{text-decoration:none}nav .brand{margin-right:auto;font-size:11px;letter-spacing:1px;color:#e3c992}.hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,.65fr);gap:30px;align-items:center;margin:22px 0 24px}.hero h1{font-family:Georgia,serif;font-size:clamp(46px,6.5vw,86px);line-height:.95;margin:10px 0 18px;letter-spacing:-2px;color:#ffe0a2;text-shadow:3px 4px #60421f}.eyebrow{font-size:11px;font-weight:bold;letter-spacing:2px;color:#a4d8c5}.hero p{max-width:530px;color:#d8dfd5}.cover{width:100%;max-height:350px;object-fit:contain;filter:drop-shadow(0 12px 18px #0008)}.hero .primary{min-width:220px;font-size:17px}.accountLine{font-size:12px;margin-top:15px!important;color:#a5dac8!important}.jobCards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.jobCard{position:relative;background:#0f2028;border:1px solid #718a77;border-radius:8px;overflow:hidden}.jobCard img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.jobCard .cardBody{padding:12px}.jobCard h2{font-size:17px;margin:2px 0 6px}.jobCard p{font-size:12px;color:#afc0b7;margin:0 0 10px}.jobCard button{width:100%;padding:8px;font-size:12px}.jobCard .index{font:bold 12px LastCallArcade,monospace;color:#ffd895}.jobCard.locked img{filter:brightness(.6) saturate(.5)}.menuFooter{font-size:11px;color:#9bada8;display:flex;justify-content:space-between;gap:10px;margin-top:18px}
#dialog{position:fixed;inset:0;z-index:1500;display:grid;place-items:center;background:#071017e8;padding:16px max(16px,var(--hh-safe-right)) 16px max(16px,var(--hh-safe-left));overflow:auto;touch-action:pan-y}.dialogCard{width:min(610px,100%);max-height:100%;overflow:auto;padding:25px;border:2px solid var(--gold);background:#132932;border-radius:10px;text-align:center;box-shadow:0 18px 60px #0008}.dialogCard h2{font:clamp(22px,4vw,34px)/1.2 Georgia,serif;color:#ffe0a2;margin:8px 0 15px}.dialogCard p{font-size:15px;margin:12px 0}.dialogActions{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:18px 0 0}.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:17px 0}.guide div{padding:12px 9px;background:#233f43;font-size:12px;border-radius:5px}.guide b{display:block;color:#ffe0a2;margin-bottom:6px}.accountForm{text-align:left;display:grid;gap:10px}.accountForm label{display:block;font-size:13px}.accountForm input:not([type=checkbox]){display:block;width:100%;min-height:46px;font-size:16px;border:1px solid #80998b;border-radius:4px;background:#edf0df;color:#132329;padding:9px}.accountForm .consent{display:flex;gap:10px;align-items:start;font-size:12px}.accountForm [name=website]{position:absolute;left:-10000px}.feedback{color:#a7e5ce;font-size:13px;min-height:20px}.feedback.error{color:#ffb09e}.scoreResult{font:26px LastCallArcade,monospace!important;color:#a1eccf}.howKeys{font-size:12px!important;color:#b9d2c7}.installHelp{font-size:13px;color:#d4dbc4;padding:12px;background:#233c43;text-align:left}.resultImage{max-height:150px;width:auto;max-width:100%;border-radius:8px}
#hhClose,#hhPlayOptions{position:fixed;z-index:1300;top:var(--hh-safe-top);height:44px;min-width:44px;padding:0 8px;background:#122a37ed;border:0;border-radius:0 0 8px 8px;font-size:20px}#hhClose{left:var(--hh-safe-left)}#hhPlayOptions{right:var(--hh-safe-right);font-size:10px}#rotate{position:fixed;inset:0;z-index:1200;background:#101f2bf5;display:grid;place-items:center;text-align:center;padding:35px}#rotate strong{font:15px/1.6 LastCallArcade,monospace}#rotate p{font-size:14px}.hh-options-open #hhClose,.hh-options-open #hhPlayOptions{visibility:hidden}
@media(pointer:coarse){#hud{height:44px;padding:4px calc(52px + var(--hh-safe-right)) 2px calc(52px + var(--hh-safe-left));gap:4px;grid-template-columns:1fr 1fr 1.3fr 1fr}#hud span{font-size:6px;margin-bottom:2px}#hud strong{font-size:11px}#hud .champion strong{font-size:7px}#beers{gap:4px;padding:0}#beers i{width:14px;height:18px}#jobStrip{display:none}#controls{height:auto;min-height:72px;background:none;border:0;align-items:flex-end;padding:5px calc(8px + var(--hh-safe-right)) calc(5px + var(--hh-safe-bottom)) calc(8px + var(--hh-safe-left))}#controls button{height:64px;width:clamp(64px,8vw,80px);font-size:30px;background:#274653e8;border:2px solid #d9b16b;border-radius:9px}#controls [data-act=rotate],#controls [data-act=drop]{width:96px;font-size:15px}#controls [data-act=drop]{background:#a67d3eed}#goal{display:none}#toast{bottom:calc(82px + var(--hh-safe-bottom));font-size:11px;padding:6px 10px;max-width:65%}#home{padding-top:12px}.hero{gap:18px;margin:14px 0}.hero .cover{max-height:270px}.hero h1{font-size:54px}.hero p{font-size:13px}.jobCards{gap:10px}.jobCard .cardBody{padding:9px}.jobCard h2{font-size:14px}.dialogCard{padding:16px;max-height:100%}.dialogCard p{font-size:13px}.guide div{padding:8px;font-size:11px}.guide{margin:10px 0}#dialog{padding-top:12px;padding-bottom:12px}}
@media(pointer:coarse) and (min-height:600px){#controls button{height:72px}#toast{bottom:calc(90px + var(--hh-safe-bottom))}}
@media(max-width:650px){#controls button{min-width:56px;width:56px}#controls [data-act=rotate],#controls [data-act=drop]{width:56px;font-size:10px}.hero{grid-template-columns:1fr 150px;gap:8px}.hero h1{font-size:38px}.hero .cover{max-height:200px}.hero p{font-size:12px}.hero .primary{min-width:0;width:100%;font-size:13px}.jobCards{grid-template-columns:repeat(2,1fr)}nav{gap:4px}nav .brand{display:none}nav a,nav button{font-size:11px;padding:7px}.hero .eyebrow{font-size:9px;letter-spacing:1px}.menuFooter{flex-direction:column}#hud .champion{display:none}#hud{grid-template-columns:1fr 1fr 1fr}#dialog .guide{grid-template-columns:1fr 1fr 1fr}.dialogCard{padding:12px}.dialogCard h2{font-size:24px;margin:6px 0}.dialogCard p{font-size:12px;margin:8px 0}.dialogActions{margin-top:12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media(pointer:coarse) and (orientation:landscape) and (max-height:650px){
 #controls{height:0;min-height:0;bottom:0;padding:0;border:0;background:none;overflow:visible}
 #controls .pad{position:absolute;bottom:calc(9px + var(--hh-safe-bottom));gap:6px}
 #controls .pad:first-child{left:calc(8px + var(--hh-safe-left))}
 #controls .pad:last-child{right:calc(8px + var(--hh-safe-right))}
 #controls button{width:clamp(52px,7vw,68px);min-width:52px;height:clamp(50px,15vh,62px);font-size:27px}
 #controls [data-act=rotate],#controls [data-act=drop]{width:clamp(54px,8vw,72px);font-size:12px}
 #toast{bottom:calc(76px + var(--hh-safe-bottom))}
}
.tutorialStep{display:grid;grid-template-columns:minmax(135px,170px) 1fr;gap:14px;align-items:center;text-align:left;margin:8px auto;max-width:540px}
.tutorialArt{width:100%;max-height:135px;background:#0b252b;border:1px solid #b69f69;border-radius:8px}
.tutorialStep h3{font-size:16px;color:#ffe1a2;margin:0 0 6px}.tutorialStep p{font-size:14px;margin:0;line-height:1.4}
.tutorialChoice{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;margin:8px auto;cursor:pointer}.tutorialChoice input{width:19px;height:19px;accent-color:#e8bf6e}
@media(max-width:650px){.tutorialStep{grid-template-columns:110px 1fr;gap:9px}.tutorialArt{max-height:105px}.tutorialStep h3{font-size:13px}.tutorialStep p{font-size:11px}}

/* Keg Run 3.0 — portrait-first Garage edition */
#rotate{display:none!important}
@media(pointer:coarse) and (orientation:portrait){
 html,body{min-height:100%;height:100%;overflow:hidden}
 #game{inset:0;background:#0b151c}
 #hud{height:54px;padding:6px 48px 3px;grid-template-columns:1fr 1fr 1fr;background:linear-gradient(#071018f7,#0d1922e8,transparent)}
 #hud .champion{display:none}
 #hud span{font-size:7px}#hud strong{font-size:12px}#beers i{width:15px;height:19px}
 #controls{height:108px;min-height:108px;padding:8px max(10px,var(--hh-safe-right)) calc(8px + var(--hh-safe-bottom)) max(10px,var(--hh-safe-left));display:grid;grid-template-columns:1fr 1fr;gap:10px;background:linear-gradient(transparent,#101923 24%);align-items:end}
 #controls .pad{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
 #controls button{width:100%;height:76px;min-width:0;font-size:31px;border-radius:12px;background:#274653f2}
 #controls [data-act=rotate],#controls [data-act=drop]{width:100%;font-size:14px}
 #controls [data-act=drop]{background:#a67d3ef4}
 #toast{bottom:calc(118px + var(--hh-safe-bottom));max-width:88%}
 #hhClose,#hhPlayOptions{top:var(--hh-safe-top);border-radius:0 0 10px 10px}
 #home{padding:14px 14px 24px;overflow:auto}
 #home nav{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px;scrollbar-width:none}
 #home nav::-webkit-scrollbar{display:none}
 #home nav a,#home nav button{flex:0 0 auto}
 #home .hero{grid-template-columns:1fr;gap:10px;margin:14px 0 16px}
 #home .hero h1{font-size:48px;margin:8px 0 10px}
 #home .hero .cover{order:-1;max-height:205px;width:100%;object-fit:cover;border-radius:10px}
 #home .hero p{font-size:13px}
 #home .hero .primary{min-height:52px;font-size:15px}
 .menuFooter{font-size:10px}
 .dialogCard{width:min(94vw,560px);border-radius:14px;padding:16px}
 .guide{grid-template-columns:1fr;gap:7px}
 .tutorialStep{grid-template-columns:96px 1fr}
}
@media(min-width:700px){
 body{background:#081016}
 #home .wrap{max-width:980px}
}

/* 3.0.1 portrait embed polish */
@media(max-width:650px){
  #home{padding:10px 10px 16px;background:linear-gradient(180deg,#11352f 0,#10252b 58%,#0b171c 100%)}
  #home .wrap{min-height:100%;display:flex;flex-direction:column}
  #home nav{order:2;margin-top:8px;padding:0 0 6px;border-top:1px solid #d8bb7a55;border-bottom:1px solid #d8bb7a55}
  #home nav .brand,#home nav a[href*="games"],#home nav a[href*="garage-profile"]{display:none!important}
  #home nav button{flex:1 0 auto;min-height:38px;padding:6px 9px;font-size:10px}
  #home .hero{order:1;margin:0;display:flex;flex-direction:column;gap:8px}
  #home .hero .cover{order:0;height:180px;max-height:180px;object-fit:cover;border:1px solid #d8bb7a66}
  #home .hero>div{width:100%}
  #home .hero h1{font-size:42px;margin:4px 0 8px}
  #home .hero p{margin:6px 0 10px}
  #home .hero .primary{min-height:50px;margin-top:4px}
  #home .menuFooter{order:3;margin-top:12px;font-size:10px}
  #home #menuNotice{order:4}
  #dialog{padding:10px}
  .dialogCard{width:100%;max-width:520px;border-radius:12px;padding:14px}
  .dialogCard h2{font-size:22px}
  .dialogActions{position:sticky;bottom:0;background:#132932;padding-top:8px;padding-bottom:2px}
}

/* 3.0.2 — iPhone/Safari bottom-toolbar safe play controls
   Mobile Safari can visually overlay a large browser toolbar above the layout viewport.
   Keep the interactive controls well above that chrome rather than pinning them to 0. */
:root{--hh-browser-toolbar-reserve:0px}
@media (pointer:coarse) and (orientation:portrait){
  :root{--hh-browser-toolbar-reserve:118px}
  #controls{
    bottom:var(--hh-browser-toolbar-reserve)!important;
    padding-bottom:calc(8px + var(--hh-safe-bottom))!important;
    background:linear-gradient(transparent,#101923 22%,#101923 100%)!important;
  }
  #toast{bottom:calc(var(--hh-browser-toolbar-reserve) + 118px + var(--hh-safe-bottom))!important}
  /* Visual buffer below the controls so browser chrome covers empty space, not buttons. */
  #game::after{
    content:"";
    position:absolute;
    z-index:8;
    left:0;right:0;bottom:0;
    height:var(--hh-browser-toolbar-reserve);
    pointer-events:none;
    background:#0b151c;
    border-top:1px solid #d9b16b33;
  }
}
/* Smaller phones / shorter portrait viewports get a slightly smaller reserve. */
@media (pointer:coarse) and (orientation:portrait) and (max-height:720px){
  :root{--hh-browser-toolbar-reserve:96px}
  #controls{height:96px;min-height:96px}
  #controls button{height:66px}
  #toast{bottom:calc(var(--hh-browser-toolbar-reserve) + 104px + var(--hh-safe-bottom))!important}
}