/* Match the public site's globals.css, home.css and site-header.css.
   Keep the standalone game's mechanics and generated markup independent. */
:root{--green:#345b48;--cream:#f8f0dd;--ink:#243c2c;--paper:#f8f0dd;--line:#d7dccf;--muted:#526252;--gold:#f8f0dd;--font:Arial,Helvetica,sans-serif;--serif:Georgia,'Times New Roman',serif}
body{background:var(--cream);line-height:1.5}
a{color:var(--green);text-underline-offset:5px}
button,a,input,select,summary{-webkit-tap-highlight-color:transparent}
:is(button,a,input,select,summary):focus-visible{outline:3px solid #b37520;outline-offset:5px}
.skip-link{position:absolute;left:16px;top:-100px;z-index:20;padding:12px 18px;background:var(--cream);color:var(--ink)}
.skip-link:focus{top:12px}
.lab-header{max-width:none;height:88px;padding:0 5vw;margin:0;border:0;background:var(--green);color:var(--cream)}
.lab-header .brand{gap:24px;color:var(--cream);letter-spacing:-.03em;font:italic 26px/1.1 var(--serif)}
.brand img{display:block;width:64px;height:64px;object-fit:contain}
.lab-back{display:inline-flex;align-items:center;gap:18px;min-height:44px;color:var(--cream);font-size:14px;text-decoration:none;border-bottom:1px solid #f8f0dd80}
.lab-header a:focus-visible{outline-color:var(--cream)}
main{max-width:1320px;padding:48px 32px 0}
.intro{align-items:end;gap:30px;margin-bottom:42px}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:.15em}
.intro h1{font:italic clamp(44px,5.5vw,72px)/1.03 var(--serif);letter-spacing:-.045em;margin:18px 0 20px;color:var(--ink)}
.intro h1 br{display:block}
.intro h1 em{font:inherit;color:inherit}
.intro p:not(.eyebrow){font-size:16px;line-height:1.6;max-width:540px}
.lab-progress{display:flex;flex-direction:column;align-items:flex-end;gap:12px;padding-bottom:5px;flex-shrink:0}
.lab-progress .eyebrow{color:var(--muted);font-size:10px}
.level{color:var(--green);border-color:#345b4870;border-radius:0;padding:10px 14px;font-size:13px}
.lab-grid{gap:28px}
.panel{border-color:#345b4838;border-radius:4px;background:#fffdf7}
.controls,.recipe-library{padding:30px}
h2{font:italic 32px/1.1 var(--serif);letter-spacing:-.035em;color:var(--ink)}
h3{font-family:var(--font)}
.section-heading{gap:16px}
.tag,.live-label{font-size:10px;letter-spacing:.12em}
.muted{color:var(--muted)}
.presets{gap:8px}
.presets button{border-radius:24px;min-height:44px;padding:10px 14px;color:var(--green);border-color:#345b4860}
.presets button.selected{color:var(--cream);background:var(--green);border-color:var(--green)}
.presets button:hover:not(.selected){background:#e8ecdf}
.number-wrap input{background:#fffdf7;border:1px solid #74866f;border-radius:4px;min-height:44px}
.flour-type select{background:#fffdf7;border-color:#74866f;border-radius:4px;min-height:44px}
.field{margin:24px 0}
.field input[type=range]{height:32px;margin-block:8px}
.field input[type=range]::-webkit-slider-thumb{width:21px;height:21px;margin-top:-8px;border-color:#fffdf7}
.field input[type=range]::-moz-range-thumb{width:17px;height:17px;border-color:#fffdf7}
.text-button,.jump-link{min-height:44px;display:inline-flex;align-items:center}
.method-heading{border-top-style:solid;border-color:var(--line)}
.schedule,.confidence,.reference-note{background:#e8ecdf;color:var(--ink);border-radius:2px}
.forecast>.section-heading{padding:26px}
.forecast>.stage-copy{background:var(--green);color:var(--cream);padding:24px 26px}
.forecast>.stage-copy h2{font:italic 34px/1.1 var(--serif);color:var(--cream)}
.stage-copy p,.stage-copy .eyebrow{color:var(--cream)}
.hydration-badge{background:#243c2ce6;border-color:#f8f0dd90;color:var(--cream);backdrop-filter:none}
.hydration-badge strong{font-family:var(--font)}
.crumb-scale{background:var(--cream)}
.crumb-steps>.filled{background:#6c876c}
.crumb-steps>.current{background:var(--green)}
.handling-note,.coach{background:#e8ecdf;color:var(--ink)}
.coach p,.science-body{color:var(--muted)}
.handling-note.difficult,.recipe-warnings{background:#f8e4cb;color:#71370b}
.recipe-warnings{border-left:3px solid #b37520}
.photo-caption{padding:4px 6px;border-radius:2px;background:#243c2ce6;color:var(--cream)}
.challenge{margin:30px 0;background:var(--green);color:var(--cream);border:0;border-radius:4px;padding:34px}
.challenge h2{color:var(--cream);font:italic 38px/1.1 var(--serif)}
.challenge p,.quest-top>span:last-child,.bake-side #session-stats,.score-preview>div,#bake-result small{color:var(--cream)}
.quest-tabs button{width:44px;height:44px;border-color:#f8f0dd80;color:var(--cream)}
.quest-tabs button.active{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.quest-checks .met{color:#e0efd5}
.quest-checks .unmet{color:#f9dba6}
.hint{min-height:44px;padding-top:0}
.score-preview>span{font:italic 64px/1 var(--serif)}
.bake-side{border-color:#f8f0dd60}
.bake{min-height:48px;border-radius:28px;padding:14px 22px;background:var(--cream);color:var(--ink)}
.bake:disabled{color:var(--cream);background:#456953;border:1px solid #f8f0dd70}
#bake-result{border-color:#f8f0dd60}
.reference-grid article{border-radius:0;border-color:var(--line);padding:22px}
.reference-grid h3{font:italic 27px/1.15 var(--serif);letter-spacing:-.025em}
.reference-grid .eyebrow{color:var(--green)}
.load-reference{background:var(--green);color:var(--cream);border-radius:26px;min-height:44px;padding:12px 18px}
.science{border-inline:0;border-radius:0}
.science summary{min-height:64px}
.science h3{color:var(--ink)}
footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid #345b4860;margin-top:40px;padding:28px 0;color:var(--green);font-size:13px}
footer nav{display:flex;flex-wrap:wrap;gap:24px}
footer a{display:inline-flex;align-items:center;min-height:44px}
.no-script{padding:20px;border:1px solid var(--line)}
#forecast,#challenge{scroll-margin-top:20px}
.mobile-live{background:var(--green);color:var(--cream);box-shadow:none;border-top:1px solid #f8f0dd60}
.mobile-live strong,.mobile-live a,.mobile-live a:last-child{color:var(--cream)}
.mobile-live a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:1000px){
  .intro h1{font-size:52px}.lab-progress{align-items:flex-start}
  .lab-grid{grid-template-columns:1fr 1fr;gap:20px}.controls{padding:24px}
}
@media(max-width:760px){
  .lab-header{height:80px;padding:0 20px;gap:12px}.lab-header .brand{gap:12px;font-size:22px}
  .brand img{width:56px;height:56px}.lab-back{gap:8px;font-size:12px}
  main{padding:32px 20px 0}.intro{display:block;margin-bottom:28px}
  .intro h1{font-size:clamp(43px,8vw,56px);margin:16px 0}.intro p:not(.eyebrow){font-size:15px}
  .lab-progress{margin-top:22px;flex-direction:row;align-items:center;flex-wrap:wrap;gap:8px 14px}
  .level{display:inline-block;max-width:none;margin:0;font-size:12px;padding:8px 12px}
  .lab-grid{gap:22px}.controls,.recipe-library,.challenge{padding:24px 20px}h2{font-size:30px}
  .forecast>.section-heading,.forecast>.stage-copy{padding:22px 20px}.forecast>.stage-copy h2{font-size:30px}
  .challenge h2{font-size:34px}.bake-side{min-width:0;border-top-color:#f8f0dd60}
  .reference-grid article{padding:18px}.mobile-live{padding:10px 16px max(10px,env(safe-area-inset-bottom))}
  footer{margin-top:30px;gap:6px}
}
@media(max-width:380px){
  .lab-header{padding-inline:14px}.lab-header .brand{font-size:20px;gap:9px}.brand img{width:48px;height:48px}
  main{padding-inline:14px}.lab-back{gap:5px}.field-top{gap:6px}.number-wrap input{width:62px}
}
