@font-face{font-family:Stempel;src:url('/new_assets/fonts/StempelGaramondLTStd-Roman.otf') format('opentype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Stempel;src:url('/new_assets/fonts/StempelGaramondLTStd-Italic.otf') format('opentype');font-style:italic;font-weight:400;font-display:swap}
:root{--paper:#eaebd9;--ink:#15399e}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Stempel,Garamond,Georgia,serif}
.sheet{container-type:inline-size;display:flow-root;width:100%;min-height:100svh;background:var(--paper);}
a{color:inherit;text-decoration:none;text-decoration-thickness:1px;text-underline-offset:.22em}a:hover{text-decoration-line:underline}a:focus-visible,input:focus-visible{outline:2px solid var(--ink);outline-offset:6px}
img{display:block;max-width:100%;height:auto}h1,h2,p{margin:0}h1,h2{font-weight:400}h2{text-transform:uppercase}button,input{font:inherit}[hidden]{display:none!important}
.navigation{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:clamp(12px,2.4dvh,28px) 4.6% 12px;font-size:clamp(16px,2.2vw,28px);text-transform:uppercase;line-height:1.2}
.navigation a{padding:4px 0}.navigation a:first-child{justify-self:start}.navigation a:nth-child(2){justify-self:center}.navigation a:last-child{justify-self:end}.navigation [aria-current]{text-decoration-line:underline;text-decoration-thickness:1px}
#main:focus{outline:none}.overview-logo{width:83%;margin:4.6cqw auto 0}.menu-options{text-align:center;margin:8.6cqw auto 10.9cqw}.menu-option{display:block;width:fit-content;max-width:95%;margin:auto}.menu-option h2{font-size:4.6cqw;line-height:.94}.menu-option p,.subtitle{font-size:3.2cqw;font-style:italic;line-height:1.2;margin-top:1cqw}.divider{width:32%;margin:2.7cqw auto 2.6cqw}.menu-options .divider{margin:2.6cqw auto 3.1cqw}
.home-logo{width:58%;margin:4.4cqw auto 0}.about{width:62%;margin:5.5cqw auto 9.3cqw}.about h2{text-align:center;font-size:4.6cqw;margin-bottom:1.6cqw}.about p,.information p{font-size:2.2cqw;line-height:1.25;margin-bottom:2.6cqw}.about .divider{width:35%;margin:3.7cqw auto 1.4cqw}.home-actions{display:flex;justify-content:space-around;align-items:center;text-align:center;font-size:3cqw;line-height:1}.home-actions a{text-transform:uppercase}.home-actions i{font-size:2.8cqw}
.menu-heading{text-align:center;margin:3.7cqw auto 0}.menu-wordmark{width:43%;margin:0 auto 1.5cqw}.menu-heading h1{width:38%;margin:auto}.menu-heading .subtitle{margin-top:0}.courses{display:grid;grid-template-columns:1fr 1fr;gap:7.5cqw;width:72%;margin:7.8cqw auto 0}.course{margin-bottom:3.1cqw}.course-label{font-size:2cqw;text-transform:uppercase;margin-bottom:1cqw}.course h2{font-size:2.85cqw;line-height:1.03}.ingredients{font-size:2cqw;line-height:1.2;font-style:italic}.details{font-size:1.35cqw;line-height:1.2;margin-top:1.5cqw}.menu-footer{display:flex;justify-content:space-between;align-items:baseline;gap:1cqw;margin:7.3cqw 5.5cqw 4.5cqw;font-size:2.2cqw}.menu-footer a{text-transform:uppercase}.menu-footer small{font-size:1.4cqw}.pending-menu{text-align:center;font-size:2.2cqw;margin:9cqw auto 3cqw}
.reservation-logo{width:91%;margin:3.7cqw auto 0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:2cqw;margin:5.4cqw 4cqw 0;font-size:1.65cqw}.steps a{border-top:1px solid #15399e4d;padding-top:1.2cqw}.steps a[aria-current]{border-color:var(--ink)}.information{width:67%;min-height:58cqw;margin:14cqw auto 0}.information h2{font-size:2.7cqw;line-height:1.15;margin-bottom:2.5cqw}.information .lead{font-style:italic;font-size:3cqw}.reservation-footer{border-top:2px solid #15399e4d;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;margin:1cqw 4cqw 4.5cqw;padding-top:6cqw;font-size:2.2cqw;text-transform:uppercase}.reservation-footer span{text-transform:none;justify-self:center}.reservation-footer>a:first-child{justify-self:start}.reservation-footer>a:last-child{justify-self:end;max-width:100%;text-align:center}.continue,.continue:hover{text-decoration:none;border:0}
.continue{background:var(--ink);color:var(--paper);padding:.55cqw 1.2cqw;border-radius:3px;font-size:2.6cqw}.consent-information{width:70%;margin-top:6cqw;min-height:64cqw}.consent-title{display:flex;justify-content:space-between;align-items:baseline}.consent-title span{font-size:2cqw;text-transform:uppercase;white-space:nowrap}.consent-row{border:0;border-top:2px solid #15399e4d;margin:0;padding:1.8cqw 0;display:grid;grid-template-columns:1fr auto;align-items:center;gap:2cqw}.consent-row p{font-size:1.9cqw;margin:0}.choices{display:flex;align-items:center;gap:1cqw}.choices label{display:grid;place-items:center;cursor:pointer;min-width:44px;min-height:44px}.choices input,:is(.allergen-checklist,.intake-menu-options) input{appearance:none;width:4cqw;height:4cqw;min-width:32px;min-height:32px;background:url('/new_assets/images/buttons/button-unselected.png') center/contain no-repeat;margin:0;cursor:pointer}.choices input:checked,:is(.allergen-checklist,.intake-menu-options) input:checked{background-image:var(--selected-button,url('/new_assets/images/buttons/button-12.png'))}.preview-note{font-size:1.3cqw!important;margin-top:1cqw!important}.skip-link{position:fixed;top:0;left:15px;transform:translateY(-150%);background:var(--paper);padding:10px;z-index:2}.skip-link:focus{transform:none}
@media(max-width:600px){.navigation{font-size:clamp(13px,3.5cqw,19px);padding:14px 5% 10px}.overview-logo{width:91%;margin-top:9cqw}.menu-options{margin-top:12cqw;margin-bottom:14cqw}.menu-option h2{font-size:7cqw;line-height:1}.menu-option p,.subtitle{font-size:5.2cqw;margin-top:1.5cqw}.menu-options .divider{width:43%;margin:4cqw auto}.home-logo{width:76%;margin-top:8cqw}.about{width:84%;margin-top:8cqw}.about h2{font-size:8cqw}.about p,.information p{font-size:5cqw;margin-bottom:5cqw;line-height:1.3}.home-actions{font-size:5cqw}.home-actions i{font-size:5cqw}.about .divider{width:48%}.menu-heading{margin-top:8cqw}.menu-wordmark{width:58%}.menu-heading h1{width:60%;margin-top:3cqw}.courses{width:82%;grid-template-columns:1fr;gap:0;margin-top:10cqw}.course{margin-bottom:7cqw}.course-label{font-size:4.6cqw}.course h2{font-size:6cqw}.ingredients{font-size:4.8cqw}.details{font-size:3.7cqw;margin-top:3cqw}.menu-footer{font-size:4.4cqw;flex-wrap:wrap;gap:5cqw;margin:7cqw 6cqw}.menu-footer small{font-size:3.5cqw;order:3;width:100%}.pending-menu{font-size:5cqw;width:80%}.reservation-logo{margin-top:9cqw;width:95%}.steps{font-size:3.5cqw;gap:3cqw;margin-top:8cqw}.information{width:84%;margin-top:12cqw;min-height:100cqw}.information h2{font-size:5.5cqw;margin-bottom:5cqw}.information .lead{font-size:6cqw}.reservation-footer{font-size:4cqw;padding-top:6cqw;margin-bottom:6cqw}.continue{font-size:4.7cqw;padding:2cqw}.consent-title span{font-size:4cqw}.consent-row{gap:1cqw;padding:4cqw 0}.consent-row p{font-size:4.4cqw}.choices{gap:0}.choices label{min-width:35px}.choices input{width:9cqw;height:9cqw}.preview-note{font-size:3.5cqw!important;margin-top:5cqw!important}}
@media(prefers-reduced-motion:no-preference){a{transition:opacity .15s}a:hover{opacity:.8}}

/* Full menu copy from the existing guest pages. */
.menu-intro{width:72%;margin:5cqw auto 0;font-size:1.8cqw;line-height:1.3}.menu-intro+.courses{margin-top:4cqw}.variation{margin-top:2cqw}.variation h3{font-size:1.9cqw;font-weight:400;text-transform:uppercase;margin:0 0 .5cqw}.variation .ingredients{font-size:1.65cqw}
@media(max-width:600px){.menu-intro{width:82%;font-size:4.5cqw;margin-top:8cqw}.menu-intro+.courses{margin-top:8cqw}.variation{margin-top:4cqw}.variation h3{font-size:4.6cqw}.variation .ingredients{font-size:4.3cqw}}

/* Tablet screens use the available height, including Safari's browser controls. */
@media (min-width:601px) {
  body:is([data-screen="menu"],[data-screen="reservation"]) .sheet{height:100dvh;min-height:0;display:flex;flex-direction:column}
  .navigation{flex:none}
  body:is([data-screen="menu"],[data-screen="reservation"]) #main{flex:1;min-height:0}
  [data-view="menu"],[data-view="reservation"]{height:100%;display:flex;flex-direction:column}
  .overview-logo{flex:none;height:30%;width:83%;margin:1dvh auto 0}
  .overview-logo img{width:100%;height:100%;object-fit:contain}
  .menu-options{flex:1;min-height:0;display:grid;grid-template-rows:1fr auto 1fr auto 1fr;align-items:center;margin:2dvh 0 3dvh}
  .menu-option h2{font-size:clamp(24px,min(4.6vw,5dvh),60px)}
  .menu-option p{font-size:clamp(18px,min(3.2vw,3.5dvh),40px);margin-top:.8dvh}
  .menu-options .divider{height:7dvh;width:32%;object-fit:contain;margin:0 auto}
  .reservation-logo{flex:none;height:20dvh;width:86%;margin:0 auto}
  .reservation-logo img{width:100%;height:100%;object-fit:contain}
  .steps{flex:none;margin:1.5dvh 4% 0;gap:2%;font-size:clamp(14px,min(1.8vw,2.2dvh),23px)}
  .steps a{padding-top:.8dvh}
  .information{flex:1;min-height:0;width:78%;margin:0 auto;display:flex;flex-direction:column;justify-content:center;padding:2dvh 0}
  .information h2{font-size:clamp(20px,min(2.7vw,3dvh),34px);margin-bottom:1.8dvh}
  .information p{font-size:clamp(16px,min(2.2vw,2.5dvh),28px);line-height:1.23;margin-bottom:1.8dvh}
  .information p:last-child{margin-bottom:0}
  .information .lead{font-size:clamp(20px,min(3vw,3dvh),36px)}
  .consent-information{width:80%;padding:1.5dvh 0}
  .consent-title h2{margin-bottom:1dvh}
  .consent-title span{font-size:clamp(16px,2vw,24px)}
  .consent-row{padding:.65dvh 0;gap:2vw}
  .consent-row p{font-size:clamp(16px,min(1.9vw,2.3dvh),24px);margin:0}
  .choices input{width:clamp(32px,4vw,50px);height:clamp(32px,4vw,50px)}
  .preview-note{font-size:clamp(12px,1.4vw,16px)!important;margin-top:1dvh!important}
  .reservation-footer{flex:none;margin:0 4% 2dvh;padding-top:1.5dvh;font-size:clamp(16px,2.2vw,26px)}
  .continue{font-size:clamp(18px,2.6vw,30px);padding:8px 14px}
}
@media (min-width:601px) and (orientation:landscape) {
  .reservation-logo{height:18dvh}
  .information{width:84%;padding:1.2dvh 0}
  .information .lead br{display:none}
  .consent-information{width:84%}
}

/* Only the consent statements scroll; title and footer stay outside the panel. */
.consent-information{justify-content:flex-start}
.consent-title,.consent-information .preview-note{flex:none}
#consent-preview{flex:1;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:var(--ink) #15399e33;padding:0 12px 0 6px;margin-left:-6px;scroll-padding:8px}
#consent-preview:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
#consent-preview::-webkit-scrollbar{width:6px}
#consent-preview::-webkit-scrollbar-track{background:#15399e33}
#consent-preview::-webkit-scrollbar-thumb{background:var(--ink);border-radius:6px}
#consent-preview .consent-row{padding:1.5dvh 0}
@media(max-width:600px){
 body[data-screen="reservation"] .sheet{height:100dvh;min-height:0;display:flex;flex-direction:column}
 body[data-screen="reservation"] .navigation{flex:none}
 body[data-screen="reservation"] #main{flex:1;min-height:0}
 body[data-screen="reservation"] [data-view="reservation"]{height:100%;display:flex;flex-direction:column}
 body[data-screen="reservation"] .reservation-logo{flex:none;height:14dvh;margin:0 auto;width:90%}
 body[data-screen="reservation"] .reservation-logo img{height:100%;width:100%;object-fit:contain}
 body[data-screen="reservation"] .steps{flex:none;margin:1dvh 4% 0;font-size:12px}
 body[data-screen="reservation"] .consent-information{display:flex;flex-direction:column;flex:1;min-height:0;margin:0 auto;width:88%;padding:2dvh 0 1dvh}
 body[data-screen="reservation"] .consent-title h2{font-size:22px;margin-bottom:12px}
 body[data-screen="reservation"] .consent-row p{font-size:16px;line-height:1.25;margin:0}
 body[data-screen="reservation"] .preview-note{font-size:12px!important;margin-top:8px!important}
 body[data-screen="reservation"] .reservation-footer{flex:none;padding-top:10px;margin:0 4% 12px;font-size:14px}
 body[data-screen="reservation"] .continue{font-size:16px;padding:8px}
}

/* A blue scroll indicator also stays visible on iPadOS. */
.consent-scroll{position:relative;display:flex;flex:1;min-height:0}
#consent-preview{scrollbar-width:none;scrollbar-gutter:auto;padding-right:20px}
#consent-preview::-webkit-scrollbar{display:none}
.consent-scrollbar{position:absolute;right:0;top:0;bottom:0;width:10px;touch-action:none;cursor:pointer}
.consent-scrollbar::before{content:"";position:absolute;top:0;bottom:0;left:4px;width:2px;background:#15399e33}
.consent-scrollbar-thumb{position:absolute;top:0;left:2px;width:6px;min-height:28px;border-radius:6px;background:var(--ink)}

/* Keep the complete Home view within the available screen height. */
body[data-screen="home"] .sheet{height:100dvh;min-height:0;display:flex;flex-direction:column}
body[data-screen="home"] .navigation{flex:none}
body[data-screen="home"] #main{flex:1;min-height:0}
[data-view="home"]{height:100%;display:flex;flex-direction:column;padding:.5dvh 0 6dvh}
.home-logo{flex:1;min-height:0;width:58%;margin:0 auto 2dvh}
.home-logo img{height:100%;width:100%;object-fit:contain}
.about{flex:none;width:72%;margin:0 auto}
.about h2{font-size:clamp(24px,min(4.6vw,4dvh),50px);margin-bottom:1.2dvh}
.about p{font-size:clamp(16px,min(2.2vw,2.3dvh),26px);line-height:1.23;margin-bottom:1.6dvh}
.about .divider{height:5dvh;width:35%;object-fit:contain;margin:1dvh auto}
.home-actions{font-size:clamp(20px,min(3vw,3dvh),36px)}
.home-actions i{font-size:inherit}
/* Lift the About section slightly on portrait tablets, including 11-inch iPads. */
@media(min-width:601px) and (max-width:1024px) and (orientation:portrait){
 [data-view="home"]{padding-bottom:9dvh}
}
@media(max-width:600px){
 [data-view="home"]{padding:0 0 4dvh}
 .home-logo{width:72%;margin-bottom:1dvh}
 .about{width:86%}
 .about h2{font-size:clamp(20px,3.6dvh,28px);margin-bottom:1dvh}
 .about p{font-size:clamp(13px,min(4vw,1.9dvh),17px);line-height:1.2;margin-bottom:1.2dvh}
 .about .divider{height:3.5dvh;margin:.5dvh auto;width:35%}
 .home-actions{font-size:clamp(16px,2.6dvh,22px)}
}

/* Use Home's top inset for the first artwork on every view. */
:root{--header-image-gap:clamp(28px,5dvh,64px)}
[data-view="home"]{padding-top:var(--header-image-gap)}
[data-view="menu"]{padding-top:var(--header-image-gap)}
[data-view="reservation"]{padding-top:calc(var(--header-image-gap) * .3)}
.overview-logo,.reservation-logo,body[data-route="consent"] .reservation-logo{margin-top:0}
.menu-heading{margin-top:0;padding-top:var(--header-image-gap)}
.home-logo img,.overview-logo img,.reservation-logo img{object-position:center top}
@media(orientation:landscape){:root{--header-image-gap:clamp(20px,4dvh,40px)}}
@media(max-width:600px){:root{--header-image-gap:clamp(16px,3dvh,28px)}}

/* Give the consent title breathing room and make each choice easier to see. */
body[data-route="consent"] .consent-information{padding-top:clamp(24px,4dvh,48px)}
#consent-preview .choices input,:is(.allergen-checklist,.intake-menu-options) input{width:clamp(44px,5vw,64px);height:clamp(44px,5vw,64px);min-width:44px;min-height:44px}
#consent-preview .choices input:not(:checked),:is(.allergen-checklist,.intake-menu-options) input:not(:checked){background-size:180%}
#consent-preview .choices input:checked,:is(.allergen-checklist,.intake-menu-options) input:checked{background-size:contain}

/* Participant information uses twelve screens, each with its own reading area. */
.information-page{justify-content:flex-start}
.information-page h2{flex:none}
.information-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:var(--ink) #15399e33;padding:0 12px 4px 0;overflow-wrap:anywhere}
.information-scroll:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.information-scroll ul{margin:0 0 1.8dvh;padding-left:1.2em}
.information-scroll li{font-size:clamp(16px,min(2.2vw,2.5dvh),28px);line-height:1.23;margin-bottom:.8dvh}
.information-scroll::-webkit-scrollbar{width:6px}
.information-scroll::-webkit-scrollbar-thumb{background:var(--ink);border-radius:6px}
.consent-intro{font-size:clamp(16px,1.9vw,24px)!important;margin:0 0 2dvh!important}
.participant-details{display:grid;gap:10px;padding:24px 0 12px;border-top:2px solid #15399e4d;font-size:clamp(16px,2vw,24px)}
.participant-details input{font:inherit;color:var(--ink);background:transparent;border:1px solid var(--ink);border-radius:0;padding:10px;width:100%;min-width:0;min-height:44px}
.participant-details input:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.participant-details p{margin-top:12px}
.reservation-summary{display:grid;grid-template-columns:auto 1fr;gap:12px;font-size:clamp(16px,2vw,24px)}
.reservation-summary dd{margin:0;overflow-wrap:anywhere}
@media(max-width:600px){
 body[data-screen="reservation"] .information-page{display:flex;flex-direction:column;flex:1;min-height:0;width:88%;margin:0 auto;padding:3dvh 0 2dvh}
 .information-page h2{font-size:22px;margin-bottom:2dvh}
 .information-scroll p,.information-scroll li{font-size:16px;line-height:1.25}
 .information-scroll .lead{font-size:20px}
}

.signature-pad{border:1px solid var(--ink)}
#signature-canvas{display:block;width:100%;height:160px;touch-action:none;cursor:crosshair}
#signature-canvas:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.signature-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #15399e4d;padding:4px 10px;font-size:16px}
.signature-tools small{line-height:1.2}
#signature-clear{color:var(--ink);background:transparent;border:0;min-height:44px;padding:8px 12px;cursor:pointer;text-decoration-line:underline;text-underline-offset:.2em}
#signature-clear:focus-visible{outline:2px solid var(--ink)}
.signature-preview{display:block;max-width:100%;width:360px;height:auto;border:1px solid #15399e4d}

/* Separate reservation text from the lined step tabs. */
body[data-screen="reservation"] .information-page,
body[data-route="consent"] .consent-information{padding-top:calc(var(--header-image-gap) * .8)}

/* Page-level pinch zoom (see the end of app.js). */
.sheet{transform-origin:0 0}
.sheet.zooming{will-change:transform}
html.zoomed,html.zoomed body{overflow:hidden}
.zoom-reset{position:fixed;right:16px;bottom:16px;z-index:3;min-width:64px;min-height:44px;padding:8px 14px;border:0;border-radius:22px;background:var(--ink);color:var(--paper);font-size:18px;cursor:pointer;box-shadow:0 2px 10px #15399e40}

/* Menu selection stays centered between the browsing links. */
.menu-footer{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
.menu-footer>a:first-child{justify-self:start}
.menu-footer>a:last-child{justify-self:end;text-align:right}
.menu-footer .choose-menu{justify-self:center;text-align:center}
.menu-choice-prompt{text-align:center;font-size:clamp(16px,2.2vw,24px);margin:1dvh 4% 0}
@media(max-width:600px){
 .menu-footer{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .menu-footer .choose-menu{grid-column:1 / -1;grid-row:2}
 .menu-footer>a:last-child{grid-column:2;grid-row:1}
}

/* Keep the legend outside the grid to avoid transient narrow layout in iPad Safari. */
.allergen-checklist{border:0;padding:0;margin:0;min-inline-size:0;inline-size:100%;font-size:clamp(16px,min(2.2vw,2.5dvh),28px)}
.allergen-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5dvh 3vw}
.allergen-checklist legend{inline-size:100%;max-inline-size:100%;overflow-wrap:normal;font-style:italic;line-height:1.23;margin-bottom:1.5dvh}
.allergen-checklist label{display:flex;align-items:center;gap:12px;min-height:44px;font-style:italic;cursor:pointer}
:is(.allergen-checklist,.intake-menu-options) input{flex:none}
#allergen-help{margin-top:1.5dvh;font-style:italic}

.intake-menu-options{border:0;padding:0;margin:0}
.intake-menu-option{border-top:1px solid #15399e4d;padding:1.4dvh 0;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:clamp(16px,min(2.2vw,2.5dvh),28px)}
.intake-menu-option label{display:flex;align-items:center;gap:12px;cursor:pointer;min-height:44px}
.intake-menu-option a{flex:none;text-decoration-line:underline;text-underline-offset:.2em}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:600px){.intake-menu-option{flex-wrap:wrap}.intake-menu-option a{margin-left:56px}}

/* Optional kiosk keyboard, enabled by ?rpi=1. */
body.keyboard-open .sheet{height:calc(100dvh - var(--keyboard-height,340px));min-height:0}
.screen-keyboard{position:fixed;inset:auto 0 0;z-index:10;background:#d4d7df;color:var(--ink);padding:8px max(8px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom));box-shadow:0 -2px 14px #0002;font:20px system-ui,sans-serif;touch-action:manipulation}
.keyboard-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 auto 6px;max-width:1100px;font-size:16px}
.screen-keyboard button{font:inherit;color:var(--ink);border:0;border-radius:6px;background:#fff;min-width:36px;min-height:42px;box-shadow:0 1px 2px #0004;cursor:pointer}
.screen-keyboard button:active,.screen-keyboard button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.keyboard-toolbar button{background:transparent;box-shadow:none;padding:4px 12px}
#keyboard-preview{display:block;width:100%;max-width:1100px;margin:0 auto 8px;min-height:44px;border:1px solid #15399e55;border-radius:6px;background:var(--paper);color:var(--ink);padding:6px 12px;font:20px system-ui,sans-serif}
.keyboard-keys{max-width:1100px;margin:auto;display:grid;gap:7px}
.keyboard-row{display:flex;justify-content:center;gap:7px}
.keyboard-row button{flex:1;max-width:100px;height:clamp(36px,5dvh,56px);padding:2px}
.keyboard-row button[data-action]{max-width:140px;background:#b7bdca}
.keyboard-row .keyboard-space{flex:5;max-width:560px}
@media(max-width:600px){.screen-keyboard{font-size:17px;padding-inline:4px}.keyboard-row{gap:4px}.keyboard-row button{min-width:0;min-height:38px}.keyboard-keys{gap:5px}.keyboard-toolbar button{padding:4px 8px}}

.timeslot-information{text-align:center}
.timeslot-qr{width:min(180px,36vw,17.5dvh);height:auto;aspect-ratio:1;margin:1.5dvh auto;background:transparent}
body[data-route="reservation-ready"] .continue{font-size:clamp(15px,min(2.2vw,2.8dvh),26px)}
body[data-route="reservation-ready"] .reservation-footer{grid-template-columns:auto minmax(0,1fr);gap:3vw}
body[data-route="reservation-ready"] #step-count{display:none}

.timeslot-information .qr-countdown{flex:none;font-size:clamp(24px,3dvh,36px);margin-bottom:1dvh;font-variant-numeric:tabular-nums}