
:root {
  --bg:#f4f4f2; --panel:#fff; --text:#111; --muted:#6d6d68;
  --border:#d9d9d3; --press:#e8e8e3; --success-bg:#e7f6eb;
  --success-text:#176b2c; --error-bg:#fdeaea; --error-text:#9d1c1c;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
body{min-height:100vh;-webkit-tap-highlight-color:transparent}
button{font:inherit}
.app-shell{width:min(100%,980px);margin:0 auto;padding:max(28px,env(safe-area-inset-top)) 24px max(32px,env(safe-area-inset-bottom))}
.hidden{display:none!important}
.app-header{margin-bottom:28px}
.keg-header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.eyebrow{font-size:14px;font-weight:800;letter-spacing:.12em;color:var(--muted)}
h1{margin:6px 0 0;font-size:clamp(34px,5vw,52px);line-height:1.05}
h2{margin:0 0 14px;font-size:19px;color:var(--muted)}
.active-staff{margin-top:10px;font-size:17px;font-weight:700;color:var(--muted)}
.button-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.staff-grid{margin-top:34px}
.staff-btn,.beer-btn{
  min-height:96px;border:1px solid var(--border);border-radius:18px;background:var(--panel);
  color:var(--text);font-size:25px;font-weight:750;padding:18px 16px;cursor:pointer;
  touch-action:manipulation;box-shadow:0 1px 2px rgba(0,0,0,.04)
}
.staff-btn{min-height:110px;font-size:28px}
.staff-btn:active,.beer-btn:active,.small-btn:active{transform:scale(.985);background:var(--press)}
.beer-btn[disabled]{opacity:.55;cursor:wait}
.fridge-section{margin-top:32px}
.small-btn{border:1px solid var(--border);background:var(--panel);border-radius:12px;padding:12px 16px;font-weight:700;cursor:pointer}
.status{margin:0 0 20px;min-height:48px;border-radius:12px;padding:12px 14px;font-weight:700;display:none}
.status.show{display:flex;align-items:center;justify-content:center;text-align:center}
.status.success{background:var(--success-bg);color:var(--success-text)}
.status.error{background:var(--error-bg);color:var(--error-text)}
@media(max-width:650px){
  .app-shell{padding-left:16px;padding-right:16px}
  .button-grid{grid-template-columns:1fr}
  .keg-header{align-items:flex-start;flex-direction:column}
  .staff-btn,.beer-btn{min-height:80px;font-size:22px}
}

.module-grid { margin-top: 34px; }
.module-btn {
  min-height: 120px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: var(--panel);
  color: var(--text);
  font-size: 30px;
  font-weight: 800;
  padding: 20px;
  cursor: pointer;
  touch-action: manipulation;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.module-btn:active { transform: scale(.985); background: var(--press); }
