/* Restaurant signup: free until the first $1,000 in qualifying sales,
   then $79/month plus tax with explicit approval. The pitch reads top to
   bottom, and the signup card closes the page as step 01's tab panel.
   All billing and account creation behavior remains in the existing flow. */
:root { color-scheme: light; --paper: #f6f3eb; --ink: #18392f; --muted: #64736a; --green: #0e3a31; --line: #dce3d9; --accent: #bd4c30; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; line-height: 1.5; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-underline-offset: 4px; }
button, input { font: inherit; }
button, a, input { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
[hidden] { display: none !important; }
.site-header { background: var(--green); color: #f9f6ed; padding: 12px max(24px, calc((100vw - 1200px) / 2)); display: flex; gap: 16px; align-items: center; justify-content: space-between; }
.brand { font-weight: 800; letter-spacing: -.6px; font-size: 20px; text-decoration: none; white-space: nowrap; }
.brand span { color: #f38c6b; }
.site-header nav { display: flex; align-items: center; gap: 24px; }
.site-header nav a { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; gap: 8px; }
.layout { max-width: 1200px; margin: 0 auto; padding: 48px 24px 56px; display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: 'intro quote' 'perks perks' 'steps steps' 'details details'; gap: 32px clamp(32px, 5vw, 72px); align-items: start; }
.intro { grid-area: intro; padding-top: 8px; min-width: 0; }
.eyebrow { color: var(--accent); text-transform: uppercase; font-size: 11px; letter-spacing: 1.5px; font-weight: 750; margin: 0 0 16px; }
.intro-invitation { margin-bottom: 22px; padding-left: 16px; border-left: 3px solid #b2934e; }
.intro-invitation .eyebrow { margin-bottom: 5px; }
.intro-business { margin: 0; color: var(--green); font-size: clamp(24px, 2.7vw, 30px); font-weight: 750; line-height: 1.25; letter-spacing: -.5px; overflow-wrap: anywhere; }
h1 { font-family: Georgia, serif; font-weight: 500; font-size: clamp(36px, 3.7vw, 48px); letter-spacing: -1.5px; line-height: 1.1; margin: 0; text-wrap: balance; }
.lede { font-size: 17px; line-height: 1.55; color: #3e5c4c; margin: 16px 0 0; max-width: 46ch; text-wrap: pretty; }
.lede + .assurances { margin-top: 18px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* The price plate: an order ticket. The amount on top; a perforated tear line
   with side notches; the terms on the stub. */
.price-plate { position: relative; max-width: 440px; margin: 26px 0 22px; background: #fffdf8; border: 1px solid #e3dfd2; border-radius: 18px; box-shadow: 0 1px 0 rgba(24, 57, 47, .04), 0 18px 36px -24px rgba(14, 58, 49, .45); overflow: hidden; }
.price { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 20px; margin: 0; padding: 20px 26px 18px; }
.price-amount { display: inline-flex; align-items: flex-start; color: var(--green); font-size: clamp(84px, 7.4vw, 104px); font-weight: 750; letter-spacing: -.055em; line-height: .92; white-space: nowrap; font-variant-numeric: lining-nums; }
.price-cur { font-size: .42em; font-weight: 700; letter-spacing: 0; line-height: 1; margin: .14em 0 0 .1em; }
.price-amount-en .price-cur { margin: .14em .06em 0 0; }
.price-unit > span { display: block; font-size: 20px; font-weight: 650; line-height: 1.3; }
.price-unit small { display: block; margin-top: 3px; font-size: 13px; color: var(--muted); }
.price-terms { position: relative; margin: 0; padding: 13px 26px 15px; background: #eef2e8; border-top: 1.5px dashed #c9d3c3; color: #4d6255; font-size: 14px; line-height: 1.5; }
.price-terms strong { color: var(--ink); font-weight: 650; }
.price-terms::before, .price-terms::after { content: ''; position: absolute; top: -9px; width: 16px; height: 16px; border-radius: 50%; background: var(--paper); border: 1px solid #e3dfd2; }
.price-terms::before { left: -9px; }
.price-terms::after { right: -9px; }
.assurances { display: flex; flex-wrap: wrap; gap: 8px 18px; list-style: none; margin: 0; padding: 0; font-size: 14px; font-weight: 500; color: #3e5c4c; }
.assurances li { display: flex; align-items: center; gap: 6px; }
.assurances svg { width: 18px; height: 18px; flex: none; }
.signup-proof { grid-area: quote; align-self: center; display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.signup-promo { padding: 22px; border: 1px solid #d6e1d2; border-radius: 16px; background: #eaf0e5; }
.signup-promo-heading { display: flex; align-items: flex-start; gap: 10px; }
.signup-promo-heading svg { width: 22px; height: 22px; flex: none; color: var(--accent); margin-top: 2px; }
.signup-promo h2 { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.35; text-wrap: balance; }
.signup-promo p { margin: 0; font-size: 14px; line-height: 1.55; color: #4d6255; }
.signup-promo-earn { margin-top: 20px; }
.signup-promo .signup-promo-amount { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin: 2px 0 4px; color: var(--green); }
.signup-promo-amount strong { font-size: 34px; font-weight: 750; line-height: 1.2; letter-spacing: -1px; white-space: nowrap; }
.signup-promo-amount span { font-weight: 650; }
.signup-promo-accept { margin-top: 18px; padding-top: 16px; border-top: 1px solid #cedac9; }
.signup-promo-accept p + p { margin-top: 8px; }
.signup-promo h3 { margin: 0 0 5px; font-size: 14px; font-weight: 700; }
.signup-promo .signup-promo-note { margin-top: 16px; font-size: 12px; line-height: 1.5; color: #60705f; }
.intro-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.intro-cta { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 13px 24px; border-radius: 12px; background: var(--green); color: #f9f6ed; font-size: 15px; font-weight: 700; text-decoration: none; }
.intro-cta:hover { background: #185241; }
/* « Le Comptoir » demo: the opener buttons and the dialog around the real ordering page. */
.demo-open { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 13px 22px; border: 1.5px solid var(--green); border-radius: 12px; background: transparent; color: var(--green); font-size: 15px; font-weight: 700; }
.demo-open:hover { background: #0e3a310d; }
.demo-open.demo-personal { background: var(--green); color: #fff; text-align: left; box-shadow: 0 6px 18px #0e3a3124; }
.demo-open.demo-personal:hover { background: #175546; transform: translateY(-1px); }
.demo-personal small { display: block; margin-top: 5px; font-size: 12px; font-weight: 400; line-height: 1.45; }
.demo-open svg { width: 20px; height: 20px; flex: none; }
.perk-demo { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; margin-top: 6px; padding: 0; border: 0; background: none; color: var(--accent); font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.demo-locked, .demo-locked body { overflow: hidden; }
.demo-modal { width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; overflow: hidden; }
.demo-modal::backdrop { background: #0b1f19c7; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.demo-shell { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 16px; }
.demo-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: min(410px, 100%); color: #f9f6ed; }
.demo-tag { padding: 6px 12px; border-radius: 999px; background: #f9f6ed1f; font-size: 13px; font-weight: 700; letter-spacing: .2px; }
.demo-close { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #f9f6ed1f; color: #f9f6ed; }
.demo-close:hover { background: #f9f6ed33; }
.demo-close svg { width: 20px; height: 20px; }
.demo-phone { width: min(410px, 100%); height: min(880px, calc(100dvh - 88px)); padding: 10px; border-radius: 46px; background: #101413; box-shadow: 0 0 0 1px #ffffff1a, 0 30px 80px #00000073; }
.demo-phone iframe { display: block; width: 100%; height: 100%; border: 0; border-radius: 36px; background: #fff; }
@media (max-width: 800px), (max-height: 560px) {
  .demo-shell { gap: 0; padding: 0; justify-content: flex-start; }
  .demo-bar { width: 100%; padding: max(4px, env(safe-area-inset-top)) 6px 4px 16px; background: var(--green); }
  .demo-close { width: 44px; height: 44px; background: transparent; }
  .demo-phone { flex: 1; width: 100%; height: auto; padding: 0; border-radius: 0; background: #fff; box-shadow: none; }
  .demo-phone iframe { border-radius: 0; }
}
.mobile-perks { display: none; }
#perks, #promo-dollars { scroll-margin-top: 24px; }
/* The testimonial: the page's one dark card, beside the intro. */
.testimonial { position: relative; isolation: isolate; overflow: hidden; margin: 0; padding: 28px 30px 24px; border-radius: 22px; background: var(--green); color: #f9f6ed; box-shadow: 0 24px 60px #0e3a3124; }
.testimonial::after { content: ''; position: absolute; z-index: -1; top: -120px; right: -120px; width: 300px; height: 300px; border-radius: 50%; background: radial-gradient(circle, #f38c6b1c, transparent 68%); }
.testimonial-kicker { margin: 0; font-size: 11px; font-weight: 750; letter-spacing: 1.5px; text-transform: uppercase; color: #9fc2b1; }
.testimonial blockquote { margin: 0; }
.testimonial blockquote::before { content: '\201C'; display: block; height: 40px; margin: 18px 0 4px -3px; font: 400 88px/1 Georgia, serif; color: #f38c6b; }
:lang(fr) .testimonial blockquote::before { content: '\00AB'; font-size: 64px; }
.testimonial blockquote p { margin: 0; font: 400 clamp(19px, 1.65vw, 22px)/1.5 Georgia, serif; letter-spacing: -.2px; text-wrap: pretty; }
.testimonial mark { color: inherit; background: linear-gradient(transparent 60%, #f38c6b5c 60%); padding: 0 2px; }
.testimonial figcaption { display: flex; align-items: center; gap: 12px; margin-top: 22px; padding-top: 18px; border-top: 1px solid #f9f6ed24; }
.testimonial-mark { display: block; flex: none; width: 42px; height: 42px; border-radius: 50%; background: #f9f6ed; object-fit: contain; }
.testimonial figcaption strong { display: block; font-size: 15px; font-weight: 700; }
.testimonial figcaption strong + span { display: block; font-size: 13px; color: #b9d2c5; }
/* Everything included: three themed cards. */
.perks { grid-area: perks; margin-top: 16px; padding-top: 40px; border-top: 1px solid var(--line); }
.perks-head, .steps-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px 56px; align-items: end; margin-bottom: 30px; }
.perks-head .eyebrow, .steps-head .eyebrow { grid-column: 1 / -1; margin: 0; }
.perks-head h2, .steps-head h2 { font: 500 clamp(30px, 3.2vw, 40px)/1.12 Georgia, serif; letter-spacing: -1px; margin: 0; text-wrap: balance; }
.perks-head h2 + p, .steps-head h2 + p { margin: 0; font-size: 15px; color: #4d6255; max-width: 46ch; }
.steps-head strong { color: var(--ink); font-weight: 700; }
.perk-groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: start; }
.perk-group { min-width: 0; padding: 24px 24px 10px; border: 1px solid var(--line); border-radius: 20px; background: #fffefa; }
.perk-group h3 { display: flex; align-items: baseline; gap: 10px; margin: 0 0 16px; font: 500 21px/1.25 Georgia, serif; letter-spacing: -.3px; }
.perk-group h3 span { font: 700 11px/1 -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; letter-spacing: .5px; color: var(--accent); }
.perk-group > ul { list-style: none; margin: 0; padding: 0; }
.perk-group > ul > li { display: flex; gap: 14px; padding: 14px 0; border-top: 1px solid #e8ece4; }
.perk-group > ul > li:first-child { border-top: 0; padding-top: 0; }
.perk-group svg { flex: none; width: 38px; height: 38px; padding: 8px; border-radius: 11px; background: #f7e8e1; color: var(--accent); }
.perk-group li > div { min-width: 0; }
.perk-group strong { display: block; font-size: 15px; font-weight: 650; line-height: 1.35; }
.perk-group p { margin: 4px 0 0; font-size: 13px; line-height: 1.55; color: #586b5d; }
.perk-group .perk-note { color: #737b75; white-space: nowrap; }
.perk-methods { margin: 8px 0 0; padding-left: 16px; list-style: disc; font-size: 13px; line-height: 1.55; color: #586b5d; }
.perk-methods li + li { margin-top: 8px; }
.perk-group .perk-methods strong { display: inline; font-size: inherit; line-height: inherit; }
.signup { min-width: 0; background: #fffefa; border: 1px solid var(--line); border-radius: 22px; padding: 30px; box-shadow: 0 12px 40px #173e2e08; }
.signup-title { font-size: 24px; letter-spacing: -.6px; margin: 0 0 6px; line-height: 1.25; }
.form-intro { color: var(--muted); font-size: 14px; margin: 0 0 24px; max-width: 35ch; }
.form-section h5, .email-label { display: flex; align-items: baseline; gap: 10px; font-size: 16px; font-weight: 700; margin: 0 0 12px; }
.number { font-size: 11px; color: var(--accent); font-weight: 700; }
.offer-note { color: var(--muted); font-size: 12px; line-height: 1.5; text-align: center; margin: 8px auto 0; max-width: 44ch; }
.login { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; font-size: 13px; font-weight: 600; margin-top: 12px; }
/* Getting started closes the page: the signup card is step 01's tab panel,
   steps 02-04 wait beside it. */
.getting-started { grid-area: steps; min-width: 0; margin-top: 16px; padding-top: 40px; border-top: 1px solid var(--line); }
.steps { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-rows: auto auto auto 1fr; gap: 0 clamp(32px, 5vw, 72px); list-style: none; margin: 0; padding: 0; }
.step-current { grid-column: 1; grid-row: 1 / -1; min-width: 0; }
.step-tab { position: relative; z-index: 1; display: flex; gap: 12px; width: fit-content; max-width: min(100%, 460px); margin-bottom: -1px; padding: 16px 22px 14px 16px; background: #fffefa; border: 1px solid var(--line); border-bottom: 0; border-radius: 16px 16px 0 0; box-shadow: inset 0 3px 0 var(--accent); }
.step-current .signup { border-top-left-radius: 0; }
.step-number { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 50%; font-size: 11px; font-weight: 750; font-variant-numeric: tabular-nums; }
.step-tab .step-number { background: var(--green); color: #f9f6ed; }
.step-tab h3 { margin: 5px 0 3px; font-size: 16px; font-weight: 700; line-height: 1.3; }
.step-tab p { margin: 0; font-size: 13px; color: var(--muted); }
.step-next { --pad: 0px; grid-column: 2; position: relative; display: flex; gap: 14px; min-width: 0; padding: var(--pad) 0 30px; }
.step-next:nth-child(2) { --pad: 16px; }
.step-next:not(:last-child)::before { content: ''; position: absolute; left: 16px; top: calc(var(--pad) + 40px); bottom: 8px; border-left: 1px dashed #c3cfc0; }
.step-next .step-number { border: 1px solid #c3cfc0; background: #fffefa; color: var(--accent); }
.step-next h3 { margin: 5px 0 4px; font-size: 15px; font-weight: 650; line-height: 1.3; }
.step-next p { margin: 0; font-size: 13px; color: var(--muted); max-width: 40ch; }
.billing-details { grid-area: details; border-top: 1px solid var(--line); padding-top: 8px; font-size: 12px; color: #586b5d; }
.billing-details summary { display: list-item; width: fit-content; min-height: 44px; padding: 12px 0; cursor: pointer; font-weight: 650; }
.billing-details p { max-width: 90ch; margin: 0 0 12px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.form-section { margin-top: 24px; }
label:not(.email-label) { display: block; font-size: 13px; font-weight: 650; margin-bottom: 8px; }
input[type=search], input[type=email], input[type=password] { width: 100%; min-height: 52px; background: #fff; border: 1px solid #bfcbbc; border-radius: 10px; padding: 12px; color: var(--ink); font-size: 16px; }
input::placeholder { color: #788478; }
.hint { color: var(--muted); font-size: 12px; margin: 8px 0 0; }
.hint:empty { display: none; }
.results { margin: 12px 0 0; padding: 0; list-style: none; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; max-height: 320px; overflow-y: auto; }
.results li + li { border-top: 1px solid var(--line); }
.results button { border: 0; padding: 14px; display: block; text-align: left; width: 100%; min-height: 60px; background: #fff; color: var(--ink); }
.results button:hover, .results button:focus { background: #edf4eb; }
.results button:focus-visible { outline-offset: -4px; }
.results strong, .results span { display: block; overflow-wrap: anywhere; }
.results span { font-size: 13px; color: var(--muted); margin-top: 3px; }
.selected { padding: 16px; border: 1px solid #b3c9b3; border-radius: 12px; background: #f4f7ef; overflow-wrap: anywhere; }
.selected p { color: var(--muted); font-size: 13px; margin: 3px 0 8px; }
.text-button { border: 0; padding: 0; background: none; color: var(--green); text-decoration: underline; text-underline-offset: 3px; min-height: 44px; font-size: 13px; font-weight: 650; }
.notice { background: #f4f3e8; border-radius: 10px; padding: 14px; margin: 12px 0 0; font-size: 13px; color: #596148; }
.error { color: #9c301f; background: #fff0e9; padding: 12px; border-radius: 10px; font-size: 14px; }
.primary { min-height: 54px; display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; border: 0; background: var(--green); color: white; font-weight: 700; font-size: 15px; border-radius: 12px; padding: 14px 16px; margin-top: 24px; text-align: center; text-decoration: none; }
.primary:hover { background: #185241; }
.primary:disabled { opacity: .6; cursor: wait; }
.email-signup-choice { margin-top: 20px; border-top: 1px solid var(--line); }
.email-signup-choice > summary { min-height: 48px; padding: 14px 0; cursor: pointer; font-weight: 650; }
.fineprint { font-size: 12px; font-weight: 600; color: var(--ink); text-align: center; margin: 12px 0 0; }
.form-footer { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 16px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.form-footer a { font-size: 12px; display: inline-flex; align-items: center; min-height: 44px; }
.layout > .form-footer { grid-column: 1 / -1; align-items: center; font-size: 12px; color: var(--muted); }
.success-mark { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #edf4eb; font-size: 28px; }
#signup-success h5 { font-size: 28px; line-height: 1.2; }
#signup-success p { color: var(--muted); }
.service-summary { padding: 14px; background: #f6f5ef; border-radius: 12px; }
@media (max-width: 1050px) and (min-width: 801px) {
  .perk-groups { grid-template-columns: minmax(0, 1fr); }
  .perk-group > ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; }
  .perk-group > ul > li:nth-child(2) { border-top: 0; padding-top: 0; }
}
@media (max-width: 800px) {
  .site-header { padding: 10px 20px; flex-wrap: wrap; gap: 0 16px; }
  .site-header nav { width: 100%; justify-content: space-between; gap: 12px; }
  .brand { min-height: 40px; display: flex; align-items: center; }
  .layout { max-width: 600px; grid-template-columns: minmax(0, 1fr); grid-template-areas: 'intro' 'quote' 'steps' 'details'; gap: 28px; padding: 28px 20px 40px; }
  .lede { font-size: 16px; margin-top: 12px; }
  .testimonial { padding: 22px 22px 20px; border-radius: 18px; }
  .testimonial blockquote::before { height: 34px; margin-top: 14px; font-size: 76px; }
  :lang(fr) .testimonial blockquote::before { font-size: 56px; }
  .testimonial blockquote p { font-size: 18px; }
  .perks, .intro-cta { display: none; }
  .demo-open { width: 100%; }
  .perks-head, .steps-head { grid-template-columns: minmax(0, 1fr); margin-bottom: 20px; }
  .perks-head h2, .steps-head h2 { font-size: 30px; }
  .mobile-perks { display: block; margin-top: 24px; }
  .mobile-perks h2 { margin: 0 0 12px; font-size: 14px; font-weight: 700; }
  .perk-groups { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .perk-group { padding: 0; border-radius: 16px; }
  .mobile-perks summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 18px; cursor: pointer; list-style: none; border-radius: 16px; }
  .mobile-perks summary::-webkit-details-marker { display: none; }
  .mobile-perks summary::after { content: ''; flex: none; width: 9px; height: 9px; border-right: 2px solid var(--accent); border-bottom: 2px solid var(--accent); transform: rotate(45deg); margin: -4px 2px 0 0; }
  .mobile-perks details[open] > summary::after { transform: rotate(225deg); margin-top: 4px; }
  .mobile-perks h3 { align-items: center; margin: 0; }
  .mobile-perks summary svg { width: 24px; height: 24px; padding: 5px; border-radius: 50%; background: var(--green); color: #f9f6ed; }
  .mobile-perks .perk-group > ul { padding: 0 18px 6px; }
  .intro { padding: 0; }
  .eyebrow { margin-bottom: 12px; }
  h1 { font-size: 36px; letter-spacing: -1.2px; }
  .price-plate { max-width: none; margin: 22px 0 20px; }
  .price { padding: 18px 20px 16px; gap: 4px 16px; }
  .price-amount { font-size: 84px; }
  .price-unit > span { font-size: 18px; }
  .price-terms { padding: 12px 20px 14px; }
  .signup { padding: 24px 20px; border-radius: 18px; }
  .signup-title { font-size: 22px; }
  .steps { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  .step-current, .step-next { grid-column: auto; grid-row: auto; }
  .step-current { margin-bottom: 30px; }
  .step-next:nth-child(2) { --pad: 0px; }
  .step-tab { width: 100%; max-width: none; padding: 14px 18px 12px 14px; }
  .step-next p { max-width: none; }
  .getting-started { margin-top: 0; padding-top: 28px; }
}
@media (max-width: 359px) {
  .layout { padding-left: 14px; padding-right: 14px; }
  .signup { padding: 22px 16px; }
  .price { padding: 16px 16px 14px; gap: 4px 12px; }
  .price-amount { font-size: 72px; }
  .price-unit > span { font-size: 16px; }
  .price-terms { padding: 12px 16px 13px; }
  h1 { font-size: 32px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

/* Native edge-to-edge and landscape safe viewport. */
.site-header{padding-top:calc(12px + var(--cr-safe-top));padding-left:max(calc(24px + var(--cr-safe-left)),calc((100vw - 1200px)/2));padding-right:max(calc(24px + var(--cr-safe-right)),calc((100vw - 1200px)/2))}
.layout{padding-left:calc(24px + var(--cr-safe-left));padding-right:calc(24px + var(--cr-safe-right));padding-bottom:calc(56px + var(--cr-safe-bottom))}
.claim-password-shell{padding-left:calc(20px + var(--cr-safe-left));padding-right:calc(20px + var(--cr-safe-right));padding-bottom:var(--cr-safe-bottom)}

@media(max-width:800px){.site-header{padding-top:calc(10px + var(--cr-safe-top));padding-left:calc(20px + var(--cr-safe-left));padding-right:calc(20px + var(--cr-safe-right))}.layout{padding-left:calc(20px + var(--cr-safe-left));padding-right:calc(20px + var(--cr-safe-right));padding-bottom:calc(40px + var(--cr-safe-bottom))}}
@media(max-width:359px){.layout{padding-left:calc(14px + var(--cr-safe-left));padding-right:calc(14px + var(--cr-safe-right))}.claim-password-shell{padding-left:calc(14px + var(--cr-safe-left));padding-right:calc(14px + var(--cr-safe-right))}}

/* One signup card for Google identity, restaurant selection and email fallback. */
.signup .gs-connect { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.signup .gs-consent { margin: 14px 0 0; padding-top: 0; border: 0; font-size: 12px; }
.signup .gs-account-hint { overflow-wrap: anywhere; }
.signup .gs-search-row { flex-wrap: wrap; }
.signup .gs-search-row input { flex-basis: 170px; }
.signup .gs-location { display: flex; margin: 0; }
#signup { scroll-margin-top: 24px; }

.signup-invitation { border-left: 3px solid #54863c; padding: 2px 0 2px 15px; margin: 20px 0; }
.signup-invitation strong, .signup-invitation address { display: block; }
.signup-invitation address { color: var(--muted); font-size: 14px; font-style: normal; margin-top: 5px; }
.signup-invitation .eyebrow { font-size: 11px; margin-bottom: 7px; }
#signup-email-restaurant .gs-search-row { display: flex; gap: 10px; }
#signup-email-restaurant .gs-search-row input { min-width: 0; flex: 1; }
.email-code-panel { margin-top: 12px; padding: clamp(16px, 4vw, 24px); border: 1px solid #d8e3d8; border-radius: 16px; background: #f4f7f0; }
.email-code-delivery { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.email-code-icon { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border: 1px solid #cee0d6; border-radius: 13px; background: #e7f1e9; color: #087f75; }
.email-code-icon svg { width: 24px; height: 24px; }
.email-code-delivery p { min-width: 0; margin: 0; font-size: 13px; line-height: 1.5; color: var(--muted); }
.email-code-delivery strong { display: block; color: var(--ink); font-size: 14px; overflow-wrap: anywhere; }
#signup-email-code-form label { margin-bottom: 10px; color: var(--green); font-size: 14px; }
#signup-email-code { display: block; width: 100%; min-width: 0; min-height: 72px; padding: 14px 12px 14px calc(12px + .32em); border: 1.5px solid #b7cbbd; border-radius: 12px; background: #fffefa; color: var(--green); font-family: ui-monospace, 'SFMono-Regular', Consolas, 'Liberation Mono', monospace; font-size: clamp(24px, 6vw, 32px); font-weight: 600; line-height: 1.25; letter-spacing: .32em; text-align: center; caret-color: #087f75; }
#signup-email-code::placeholder { color: #a1b1a7; opacity: 1; }
#signup-email-code:focus { border-color: #087f75; outline: 3px solid #d3e9df; outline-offset: 2px; }
#signup-email-code[aria-invalid="true"] { border-color: #a03d2a; }
#signup-email-code[aria-invalid="true"]:focus { outline-color: #f4ddd3; }
.email-code-hint { margin: 10px 0 0; font-size: 12px; color: var(--muted); line-height: 1.6; }
.email-code-error { margin: 12px 0 0; font-size: 13px; font-weight: 600; color: #923722; }
.email-code-submit { margin-top: 20px; min-height: 56px; }
.email-code-submit:disabled { background: #dce5dc; color: #536b5d; opacity: 1; cursor: default; }
#signup-email-code-form[aria-busy="true"] .email-code-submit { cursor: progress; }
.email-code-help { margin-top: 20px; padding-top: 10px; border-top: 1px solid #d8e3d8; }
.email-code-help .text-button { display: block; width: 100%; padding: 8px 0; text-align: left; font-size: 13px; line-height: 1.5; }
.email-code-link { color: var(--muted); font-size: 12px; }
.email-code-link summary { min-height: 44px; padding: 10px 0; cursor: pointer; }
.email-code-link p { margin: 0; line-height: 1.6; }