body{background:var(--bg)}
.brand-logo{display:block;width:72px;height:50px;object-fit:contain;filter:brightness(0) invert(1)}
.wordmark{letter-spacing:0!important}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--ink)!important;outline-offset:4px}
input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:var(--text-body);line-height:1.5;min-height:54px;padding:14px var(--space-4);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-control)}
label{line-height:1.5}
input[type=checkbox],input[type=radio]{accent-color:var(--orange)}
.is-customer .shell{max-width:480px;padding-left:var(--space-6);padding-right:var(--space-6)}
.is-member .topbar{height:88px}
.member-card{padding-top:var(--space-2)}
.card-identity .member-greeting{font-size:var(--text-body);letter-spacing:0;margin:0 0 6px;color:var(--muted)}
.card-identity h1{font-size:var(--text-title);font-weight:500;letter-spacing:-.055em;overflow-wrap:break-word}
.reward-highlight{background:var(--orange);color:var(--bg);margin-bottom:var(--space-4)}
.reward-highlight .eyebrow{font-size:var(--text-small);letter-spacing:.02em;text-transform:none;color:inherit}
.reward-highlight .dots{gap:10px}
.reward-highlight .dots span{width:32px;height:32px;border:1.5px solid var(--bg)}
.reward-highlight .dots span.filled{background:var(--bg);border-color:var(--bg);box-shadow:inset 0 0 0 5px var(--orange)}
.reward-highlight>p{color:var(--bg);font-size:var(--text-small);letter-spacing:0;text-transform:none;margin-top:14px}
.card-panel{border:0;border-radius:var(--radius-card);padding:22px;background:var(--surface)}
.card-section-label{font-size:var(--text-small);font-weight:500;justify-content:space-between}
.card-chevron{margin-left:auto}
.card-calendar{margin:0 0 var(--space-4)}
.card-calendar .card-panel{background:var(--surface);color:var(--ink);min-height:155px}
.card-calendar .card-panel strong{font-size:var(--text-title);line-height:1.15;font-weight:500;margin:var(--space-5) 0 10px;letter-spacing:-.04em}
.card-calendar .calendar-detail,.card-calendar .card-chevron{color:var(--muted);font-size:var(--text-small);line-height:1.55}
.card-bento{grid-template-columns:repeat(2,minmax(0,1fr))}
.card-wallet>strong{font-size:var(--text-section);margin:22px 0 var(--space-2)}
.card-wallet.has-reward{color:var(--ink)}
.card-caption{font-size:var(--text-small);line-height:1.45}
.experience-number{display:block;font-size:var(--text-display);letter-spacing:-.06em;line-height:1.15;font-weight:500;margin:var(--space-4) 0 6px}
.experience-number small{font-size:inherit;font-weight:inherit;color:var(--muted)}
.taste-panel{margin-top:var(--space-4)}
.taste-panel>strong{display:block;font-size:var(--text-section);font-weight:500;margin:18px 0 var(--space-2);line-height:1.4}
.card-actions{max-width:480px;padding:var(--space-3) var(--space-6) max(14px,env(safe-area-inset-bottom));background:var(--bg);border:0}
.card-actions button{display:flex;justify-content:space-between}
.is-welcome .shell{padding:0;max-width:480px}
.welcome{position:relative;min-height:100svh;padding:44px var(--space-8) max(var(--space-6),env(safe-area-inset-bottom));justify-content:space-between;gap:var(--space-5)}
.welcome-logo{flex:0;padding:var(--space-4) 0 0}
.welcome-logo .brand-logo{width:96px;height:72px}
.welcome-art{width:100%;max-width:350px;max-height:52svh;object-fit:contain;align-self:center;flex:1;min-height:0}
.welcome-actions{padding:0;gap:6px}
.welcome .entry-primary{background:var(--ink);color:var(--bg)}
.welcome .entry-link{color:var(--ink);font-size:var(--text-small);min-height:48px}
.entry-content{padding-top:var(--space-5)}
.entry-content h1{margin-bottom:28px}
.entry-fields{background:transparent;border:0;padding:0;display:grid;gap:var(--space-5);border-radius:0}
.entry-fields>label{padding:0!important;border:0!important;font-size:var(--text-small);color:var(--ink);display:block}
.entry-fields input{display:block;width:100%;margin-top:var(--space-2)!important;padding:14px var(--space-4)!important;min-height:56px!important;height:auto!important;border:1px solid var(--line)!important;border-radius:var(--radius-control)!important;background:var(--surface)!important}
.entry-consent{margin:var(--space-5) 0;min-height:48px;align-items:center}
.entry-consent input{width:22px;height:22px}
.entry-privacy{font-size:var(--text-small);line-height:1.55}
dialog,.is-customer dialog,.is-staff dialog{max-width:456px;border:1px solid var(--line);border-radius:var(--radius-card);overscroll-behavior:contain}
dialog::backdrop{background:#0009;backdrop-filter:blur(5px)}
.modal-close,.is-staff .modal-close,.is-customer .modal-close{top:12px;right:12px;width:44px;height:44px;min-width:44px;min-height:44px;border-radius:50%;background:var(--surface);font-size:var(--text-heading);color:var(--ink);padding:0}
.modal-back{top:12px;left:12px;width:44px;height:44px;border-radius:50%}
dialog h2,.is-customer dialog h2,.is-staff dialog h2{font-size:var(--text-title);line-height:1.15;letter-spacing:-.04em;margin:0 0 var(--space-5);font-weight:600}
dialog form{display:grid;gap:var(--space-5)}
dialog form label{margin:0}
dialog form label>input,dialog form label>textarea,dialog form label>select{margin-top:7px}
.sheet-list{margin-top:var(--space-4)}
.sheet-row{padding:18px 0;min-height:64px}
.sheet-empty{padding:var(--space-4) 0!important}
.qr-sheet{text-align:center}
.qr-sheet h2{padding:0!important;font-size:var(--text-title)!important}
.qr-brand .brand-logo{width:54px;height:40px;margin:0 auto var(--space-4)}
dialog.qr-sheet canvas{width:256px!important;max-width:100%!important;height:auto!important;margin:0 auto;display:block;border-radius:var(--radius-control)}
.qr-caption{margin-top:var(--space-5)}
.calendar-week{position:relative;min-width:0;max-width:100%;display:flex;gap:var(--space-2);overflow-x:auto;overscroll-behavior-x:contain;padding:6px var(--space-1) var(--space-3);scroll-padding:var(--space-2);scroll-snap-type:x proximity}
.calendar-week button{flex:none;width:4.5rem;min-height:106px;padding:var(--space-3) var(--space-2);border:1px solid var(--line);border-radius:var(--radius-control);background:var(--bg);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;scroll-snap-align:start}
.calendar-week button>span{font-size:var(--text-meta);line-height:1.4;color:var(--muted)}
.calendar-week button>strong{font-size:var(--text-heading);line-height:1.2;font-weight:500}
.calendar-week button>small{display:block;font-size:var(--text-meta);line-height:1.4;min-height:2.8em;max-width:100%;overflow-wrap:break-word}
.calendar-week button>small>span{display:block}
.calendar-current{position:relative}
.calendar-current:before{content:"";display:inline-block;width:4px;height:4px;margin-right:3px;border-radius:50%;background:var(--orange);vertical-align:middle}
.calendar-week button[aria-pressed=true]>strong{text-decoration:underline;text-underline-offset:4px}
.calendar-week button[aria-pressed=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.calendar-week button[aria-pressed=true]>span{color:var(--bg)}
.is-staff .shell{max-width:520px}
.is-staff .service-heading{margin-bottom:var(--space-5)}
.is-staff .staff-member h2{font-size:var(--text-title)}
.is-staff .staff-member-head p{font-size:var(--text-small)}
.table-heading{display:none}
.is-staff .paid-check{min-height:48px;margin:var(--space-3) 0}
.is-staff .paid-check input{width:22px;height:22px}
.is-staff .tonight-label{flex-direction:column;align-items:flex-start;gap:5px;margin:var(--space-5) 0 var(--space-3)}
.is-staff .tonight-label>span:last-child{font-size:var(--text-small)}
.is-staff .tag{min-height:48px;border-radius:var(--radius-control);padding:var(--space-3);font-size:var(--text-small)}
.is-staff .tag.selected{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.is-staff .tag.selected::before{content:"✓";font-weight:700}
.member-taste-summary{padding:var(--space-4);background:var(--surface);border-radius:var(--radius-control);margin:var(--space-4) 0;font-size:var(--text-small);line-height:1.5}
.member-taste-summary p{margin:6px 0;color:var(--muted)}
.drinks-action{width:100%;text-align:left;min-height:48px;padding:var(--space-3) 0;color:var(--ink);border-bottom:1px solid var(--line)}
.drink-choices{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:var(--space-3) 0}
.drink-choices button{min-height:44px;padding:10px 14px;border:1px solid var(--line);border-radius:var(--radius-card);font-size:var(--text-small)}
.drink-choices button[aria-pressed=true]{background:var(--orange);color:var(--bg);border-color:var(--orange)}
.drink-input-row{display:flex;gap:var(--space-2);align-items:end}
.drink-input-row label{flex:1;min-width:0}
.drink-input-row button{min-width:54px;min-height:54px;border-radius:var(--radius-control);background:var(--ink);color:var(--bg);padding:var(--space-3)}
.is-staff .service-bottom{max-width:520px;border-top:1px solid var(--line)}
.owner-grid{gap:var(--space-3)}
.owner-tile,.owner-tile-wide{min-height:116px!important;padding:var(--space-5)!important}
.owner-tile>span{font-size:var(--text-body)!important;padding-right:var(--space-5)}
.owner-tile>small{font-size:var(--text-small)!important;margin-top:var(--space-4)!important}
.owner-back{color:var(--ink);min-height:48px}
.owner-topbar .brand-logo{width:70px;height:50px}
.owner-topbar>div{display:flex;align-items:center}
@media(min-width:600px){dialog,.is-customer dialog,.is-staff dialog{margin:auto;max-height:90svh}
.is-welcome .shell{border-radius:0}
}
@media(max-width:360px){.is-customer .shell{padding-left:18px;padding-right:18px}
.card-bento .card-panel{padding:var(--space-4)}
.card-actions{padding-left:18px;padding-right:18px}
.reward-highlight{padding:var(--space-5)}
.welcome{padding-left:var(--space-6);padding-right:var(--space-6)}
}
.menu-suggestions{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2);margin:var(--space-3) 0}
.menu-suggestions button{text-align:left;min-height:52px;padding:10px var(--space-3);border:1px solid var(--line);border-radius:var(--radius-control)}
.menu-suggestions small{display:block;color:var(--muted);font-size:var(--text-meta);margin-top:var(--space-1)}
.menu-suggestions button[aria-pressed=true]{border-color:var(--orange)}
.entry-fields small{display:block;font-size:var(--text-meta);color:var(--muted);margin-top:6px}

.booking-row{display:flex;align-items:center;gap:14px;width:100%;padding:var(--space-5) 0;text-align:left;border-bottom:1px solid var(--line);min-height:88px}
.booking-time{font-size:var(--text-body);font-variant-numeric:tabular-nums;align-self:flex-start;min-width:48px;padding-top:2px}
.booking-row-main{display:flex;flex-direction:column;gap:7px;flex:1;min-width:0}
.booking-row-main strong{font-size:var(--text-section);overflow-wrap:break-word}
.booking-row-main small{font-size:var(--text-small);color:var(--muted);line-height:1.4}
.booking-status{font-size:var(--text-meta);line-height:1.3;padding:5px 9px;border-radius:var(--radius-card);background:var(--surface);color:var(--ink);align-self:flex-start}
.status-confirmed,.status-arrived{background:var(--ink);color:var(--bg)}
.status-pending{background:var(--attention);color:var(--on-attention)}
.booking-message{padding:18px;border-radius:var(--radius-control);background:var(--surface);margin:var(--space-5) 0;line-height:1.5;overflow-wrap:break-word}
.booking-message p{margin:var(--space-2) 0 0}
.booking-warning{color:var(--attention)!important;line-height:1.5;font-size:var(--text-small)}
.booking-actions{display:grid;gap:var(--space-3);margin:var(--space-6) 0}
.booking-actions button{min-height:50px}
.booking-pagination{display:flex;justify-content:space-between;gap:var(--space-3);margin:var(--space-5) 0}
.booking-pagination button{min-height:48px;padding:10px 14px;border:1px solid var(--line);border-radius:var(--radius-card)}
.reservation-diary{padding-bottom:96px}
.reservation-diary h1{font-size:var(--text-title);letter-spacing:-.04em}
.booking-date-label{display:block;margin:var(--space-5) 0 var(--space-2);font-size:var(--text-small)}
.booking-date-label input{margin-top:var(--space-2);width:100%;min-height:52px}
.booking-counts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-2);margin:var(--space-5) 0;font-size:var(--text-meta);color:var(--muted)}
.booking-counts strong{display:block;color:var(--ink);font-size:var(--text-title);font-weight:500;margin-bottom:5px}
.booking-nav{border-top:1px solid var(--line);position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:520px;display:flex;gap:6px;justify-content:space-around;padding:10px var(--space-3) max(10px,env(safe-area-inset-bottom));background:var(--bg);z-index:5}
.booking-nav a{min-height:48px;display:flex;align-items:center;font-size:var(--text-small)}
.booking-nav [aria-current]{color:var(--orange);font-weight:700;text-decoration:underline;text-underline-offset:6px}
.staff-reservations-link{display:block;margin:0 0 var(--space-5);padding:14px 18px;min-height:50px;border:1px solid var(--line);border-radius:var(--radius-control);color:var(--ink);font-size:var(--text-small)}
.booking-match{border-left:3px solid var(--orange);line-height:1.5;font-size:var(--text-small)}
.booking-date-heading{font-size:var(--text-small);color:var(--muted);margin:var(--space-5) 0 0}
#booking-notes{padding-top:var(--space-6);border-top:1px solid var(--line);margin-top:var(--space-6)}
#staff-booking-form input:not([type=checkbox]):not([type=radio]),#booking-identity-form input:not([type=checkbox]):not([type=radio]){min-width:0;width:100%}
/* Member review: progress is compact, nights and saved choices do the talking. */.reward-highlight{padding:var(--space-5);border-radius:var(--radius-card)}
.reward-highlight h2{font-size:var(--text-section);font-weight:600;line-height:1.3;letter-spacing:-.025em;text-transform:none;max-width:none;margin:var(--space-2) 0 18px}
.progress-summary{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.progress-summary .dots{gap:7px;flex-shrink:0}
.progress-summary .dots span{width:24px;height:24px}
.progress-summary .dots span.filled{box-shadow:inset 0 0 0 4px var(--orange)}
.progress-summary p{font-size:var(--text-small);line-height:1.4;color:var(--bg);text-transform:none;letter-spacing:0;flex:1;min-width:110px}
.card-wallet.is-empty>strong{font-size:var(--text-section);margin:18px 0 var(--space-2)}
.card-wallet.is-empty .card-caption{font-size:var(--text-small)}
.card-wallet.has-reward{background:var(--surface)}
.card-wallet.has-reward .card-caption{color:var(--muted)}
.reward-history{font-size:var(--text-small);min-height:44px;padding:10px 0;text-align:left}
.card-calendar.tonight-stack{display:block;background:var(--surface-raised);color:var(--ink);padding:var(--space-3) var(--space-5) var(--space-5);border-radius:var(--radius-card)}
.tonight-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);font-size:var(--text-small)}
.tonight-heading button{display:flex;align-items:center;gap:var(--space-2);min-height:44px;font-size:var(--text-small);color:var(--muted);padding:var(--space-2) 0 var(--space-2) var(--space-2)}
.tonight-item{padding:10px 0 18px}
.tonight-item+.tonight-item{border-top:1px solid var(--line);padding-top:18px}
.tonight-item:last-child{padding-bottom:0}
.tonight-detail{display:flex;align-items:center;gap:14px;justify-content:space-between;width:100%;min-height:44px;padding:var(--space-1) 0;text-align:left}
.tonight-detail strong{font-size:var(--text-heading);font-weight:600;letter-spacing:-.035em;line-height:1.2;overflow-wrap:break-word}
.tonight-stack .calendar-detail{color:var(--muted);margin-top:6px}
.tonight-seat{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:48px;padding:var(--space-3) 18px;background:var(--surface);color:var(--ink);border-radius:var(--radius-card);margin-top:14px;font-size:var(--text-small);font-weight:500}
.tonight-closed{font-size:var(--text-heading);margin:var(--space-3) 0}
.calendar-programme{padding-bottom:var(--space-4)}
.calendar-programme .sheet-row{border-top:0;padding-bottom:var(--space-3)}
.calendar-programme+.calendar-programme{border-top:1px solid var(--line)}
.calendar-seat{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);width:100%;margin:var(--space-5) 0 0}
dialog.qr-sheet,.is-customer dialog.qr-sheet,.is-staff dialog.qr-sheet{inset:0;margin:auto;height:fit-content;max-height:calc(min(100svh,var(--visual-height,100svh)) - 32px);padding-top:58px;border-bottom:1px solid var(--line)}
.qr-sheet h2{margin-bottom:14px}
.qr-sheet .qr-caption{margin-top:18px;font-size:var(--text-small)}
.experience-detail{justify-content:space-between}
.experience-check{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:28px;height:28px;border:1.5px solid var(--muted);border-radius:50%;font-size:var(--text-body)}
.experience-check.is-tried{background:var(--completed);border-color:var(--completed);color:var(--bg);font-weight:700}
.preference-summary{margin-bottom:var(--space-6)}
.favourite-list{list-style:none;margin:0;padding:0}
.favourite-list li{line-height:1.45;overflow-wrap:break-word}
.flavour-chips{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.flavour-chip{padding:7px var(--space-3);border-radius:var(--radius-card);background:var(--surface);color:var(--ink);font-size:var(--text-small)}
#taste-form fieldset{border:0;padding:0;margin:0;min-width:0}
#taste-form legend{font-weight:600;padding:0;margin-bottom:var(--space-3);font-size:var(--text-body)}
#taste-form input[type=search]{width:100%;margin:var(--space-3) 0 var(--space-1)}
.preference-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2);margin-top:var(--space-3)}
.preference-choices label{display:flex;align-items:center;gap:9px;min-height:54px;padding:var(--space-3) 10px;border:1px solid var(--line);border-radius:var(--radius-control);cursor:pointer;font-size:var(--text-small);line-height:1.4}
.preference-choices label:has(input:checked){background:var(--surface);color:var(--ink);border-color:var(--surface)}
.preference-choices input[type=checkbox]{width:19px;height:19px;min-width:19px;margin:0;accent-color:var(--orange);flex-shrink:0}
.preference-choices label span{overflow-wrap:break-word}
.preference-note summary{min-height:44px;cursor:pointer;font-size:var(--text-small);padding:10px 0;color:var(--muted)}
.preference-note input{width:100%;margin-top:var(--space-2)}
.preference-save{position:static;background:var(--bg);margin-bottom:-4px}
.preference-save button{width:100%}
@media(max-width:360px){.progress-summary{gap:10px}
.card-calendar.tonight-stack{padding-left:var(--space-4);padding-right:var(--space-4)}
.tonight-detail strong{font-size:var(--text-heading)}
.preference-choices label{padding:10px var(--space-2);font-size:var(--text-small)}
}
/* Shared typography and clear sheet hierarchy. */
:root,.is-customer,.is-staff{font-family:var(--sans)}
body,button,input,select,textarea{font-family:var(--sans)}
.section-heading>span{font-family:var(--sans);font-variant-numeric:tabular-nums}
.next-reward-note{font-size:var(--text-small)!important;line-height:1.55!important;margin:0 0 var(--space-4)!important;letter-spacing:0!important;text-transform:none!important}
.reward-highlight:has(.next-reward-note) h2{margin-bottom:var(--space-2)}
.reward-roadmap{display:grid;gap:var(--space-3);margin-top:var(--space-6)}
.coming-card{padding:var(--space-5);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);margin-top:var(--space-5)}
.reward-roadmap .coming-card{margin:0}
.coming-card.is-next{border-color:var(--line);background:var(--surface);color:var(--ink)}
.coming-card .eyebrow{display:block;font-size:var(--text-meta);letter-spacing:.015em;text-transform:none;color:var(--muted)}
.coming-card.is-next .eyebrow{color:var(--muted)}
.coming-card h3,.is-customer dialog .coming-card h3{font-size:var(--text-section);font-weight:600;line-height:1.4;letter-spacing:-.02em;margin:10px 0}
.coming-card p,.is-customer dialog .coming-card p{font-size:var(--text-small);line-height:1.6;margin:var(--space-2) 0;color:var(--muted)}
.coming-card.is-next p{color:var(--muted)!important}
.coming-card.is-later h3{font-size:var(--text-body)!important}
.unlock-distance{display:inline-flex;margin-top:10px;padding:6px 10px;border-radius:var(--radius-control);background:var(--surface);color:var(--ink);font-size:var(--text-meta);line-height:1.45}
.is-next .unlock-distance{background:var(--ink);color:var(--bg)}
.title-coming{border-style:dashed}
.card-link-backup{margin-top:var(--space-6);padding-top:18px;border-top:1px solid var(--line)}
.card-link-backup h3{margin:0!important}
.card-link-backup p{font-size:var(--text-small)!important}
.save-card-steps{padding-left:var(--space-6);display:grid;gap:18px;margin:22px 0 28px;line-height:1.65;font-size:var(--text-small)}
.save-card-steps li{padding-left:5px}
.share-icon{width:20px;height:20px;vertical-align:-3px;stroke:currentColor;stroke-width:1.6;fill:none}
#card-link-fallback{margin-top:var(--space-4)}
#private-card-link{font-size:var(--text-small)}
.visit-home{display:inline-flex;min-height:44px;align-items:center;color:var(--muted);font-size:var(--text-small);margin-bottom:6px}
.resume-visit{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-5);margin-top:var(--space-6);border-radius:var(--radius-card);border:1px solid var(--line);background:var(--surface);font-size:var(--text-small)}
.resume-visit small{display:block;margin-top:var(--space-2);line-height:1.5;color:var(--muted)}
.booking-pagination:empty{display:none}
@media(min-width:600px){dialog,.is-customer dialog,.is-staff dialog{inset:0;margin:auto;height:fit-content;max-height:calc(min(100svh,var(--visual-height,100svh)) - 48px);border:1px solid var(--line);border-radius:var(--radius-card)}
}
@media(max-height:520px) and (min-width:600px){dialog,.is-customer dialog,.is-staff dialog{max-height:calc(100svh - 24px);padding-top:56px}
}
/* Consolidated phone review: shared spacing, selection and save states. */
.shell,.entry-content,form,fieldset,label,.card-panel{min-width:0}
input:not([type=checkbox]):not([type=radio]),select,textarea{box-sizing:border-box;min-width:0;max-width:100%;width:100%}
input[type=date],input[type=time],input[type=month]{appearance:none;-webkit-appearance:none;display:block;inline-size:100%;min-inline-size:0;max-inline-size:100%;min-height:52px;height:auto}
input::-webkit-date-and-time-value{min-width:0;text-align:left;min-height:1.5em}
input::-webkit-datetime-edit{padding:0;min-width:0}
dialog,.is-customer dialog,.is-staff dialog{inset:0;margin:auto;height:fit-content;width:calc(100% - 32px);max-height:calc(min(100dvh,var(--visual-height,100dvh)) - 32px);padding:64px var(--space-6) 28px}
.keyboard-open dialog{bottom:var(--keyboard-offset,0px)}
dialog h2,dialog p,dialog label,.card-section-label{overflow-wrap:break-word}
.save-action:disabled{background:var(--surface)!important;border-color:var(--line)!important;color:var(--muted)!important;opacity:.65}
.save-action[aria-busy=true]{opacity:.8}
@media(hover:hover){button:not(:disabled):hover,a.entry-primary:hover,a.entry-secondary:hover{filter:brightness(1.12)}
.save-action:not(:disabled):hover,.entry-primary:not(:disabled):hover{filter:brightness(.92)}
}
button:disabled{transform:none;filter:none}
.tonight-title{font-size:var(--text-heading);font-weight:600;letter-spacing:-.035em;line-height:1.2;margin:var(--space-1) 0 10px}
.booking-unavailable{font-size:var(--text-small);line-height:1.5;color:var(--muted);margin:14px 0 0}
.tonight-stack .booking-unavailable{color:var(--muted)}
.nights-panel .card-caption{display:block;margin-top:var(--space-2)}
.nights-panel .card-section-label,.card-experiences .card-section-label{line-height:1.45}
.preferences-sheet .sheet-muted{line-height:1.65}
.preference-summary{margin:28px 0 var(--space-8)}
.preference-summary h3{font-size:var(--text-body)!important;margin:28px 0 14px!important}
.favourite-list{display:flex;flex-wrap:wrap;gap:10px}
.favourite-list li{padding:10px 14px;border:1px solid var(--line);border-radius:var(--radius-control);background:var(--surface);font-size:var(--text-small)}
#taste-form{gap:28px;margin-top:28px}
.cocktail-choices{padding:var(--space-1);scroll-padding:var(--space-1);scrollbar-gutter:stable}
.preference-choices label,.time-choices label{position:relative}
.choice-input,.preference-choices input.choice-input{position:absolute;width:1px;height:1px;min-width:0;padding:0;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.choice-tick{display:none;flex-shrink:0;margin-left:auto;font-size:var(--text-small);font-weight:700}
.preference-choices label:has(input:checked) .choice-tick{display:inline}
.preference-choices label:has(input:focus-visible),.time-choices label:has(input:focus-visible){outline:2px solid var(--ink);outline-offset:2px}
.cocktail-choices label:has(input:checked){background:var(--ink);border-color:var(--ink);color:var(--surface)}
.flavour-sweet{--flavour:#e7a9c2}.flavour-sour{--flavour:#f2d45e}.flavour-bitter{--flavour:#dca35b}.flavour-smoky{--flavour:#a4a39b}
.flavour-citrus{--flavour:#d7e36c}.flavour-fruity{--flavour:#f5bda0}.flavour-herbal{--flavour:#aec987}.flavour-spicy{--flavour:#e66a50}
.flavour-fresh{--flavour:#8cbfd0}.flavour-dry{--flavour:#f1e8d5}.flavour-light{--flavour:#b3c2ed}.flavour-bold{--flavour:#c084d2}
.flavour-choices label{border-color:var(--flavour);color:var(--flavour)}
.flavour-chip,.flavour-choices label:has(input:checked){background:var(--flavour);border-color:var(--flavour);color:#22251e}
.preference-choices label:has(input:disabled),.drink-check:has(input:disabled){opacity:.6;cursor:default}
.preference-note{margin-top:0}
.preference-note textarea{margin-top:var(--space-3)}
.preference-save{padding:var(--space-3) 0 0}
#favourite-count{margin:0;line-height:1.5}
.arrival-picker{min-width:0;border:0;padding:0;margin:0}
.arrival-picker legend{font-size:var(--text-body);margin-bottom:10px}
.time-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-2);padding:var(--space-1);scroll-padding:var(--space-1)}
.time-choices label{display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px 6px;border:1px solid var(--line);border-radius:var(--radius-control);text-align:center;font-size:var(--text-small);line-height:1.4;font-variant-numeric:tabular-nums}
.time-choices label:has(input:checked){background:var(--ink);color:var(--bg);border-color:var(--ink);font-weight:700}
.time-choices label:has(input:checked)::before{content:"✓";margin-right:var(--space-1)}
.save-card-sheet .entry-primary,.save-card-sheet .entry-secondary{width:100%;margin-top:14px}
.save-card-sheet .save-card-steps{margin:var(--space-6) 0 28px}
.save-card-sheet .card-link-backup{margin-top:28px;padding-top:var(--space-6)}
.private-transfer{margin-top:var(--space-6);text-align:center}
.private-transfer canvas{display:block;width:240px;max-width:100%;height:auto;margin:var(--space-4) auto}
.private-transfer p{font-size:var(--text-small);line-height:1.6}
#open-card-form{display:grid;gap:var(--space-4);margin:28px 0}
@media(max-width:360px){dialog,.is-customer dialog,.is-staff dialog{padding-left:18px;padding-right:18px}
.time-choices{grid-template-columns:repeat(2,minmax(0,1fr))}
.tonight-title{font-size:var(--text-heading)}
}
.member-details{margin:0 0 var(--space-5);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
.member-details div{min-width:0}
.member-details dt{color:var(--muted);font-size:var(--text-small);margin-bottom:6px}
.member-details dd{margin:0;overflow-wrap:break-word}
.experience-corrections{display:block;margin:var(--space-3) 0 var(--space-6);text-align:left}
.tonight-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-6)}
.tonight-actions button{flex:1 1 150px;min-height:48px;margin:0;padding:var(--space-3) var(--space-4);border-radius:var(--radius-card);font-size:var(--text-body);font-weight:600}
.tonight-calendar{background:transparent;color:inherit;border:1px solid currentColor}
.tonight-actions .tonight-seat{background:transparent;color:inherit;border:1px solid currentColor;justify-content:center}
.tonight-actions .tonight-seat:disabled{opacity:.4;cursor:default}
.programme-label{font-size:var(--text-meta);font-weight:600;letter-spacing:.06em;text-transform:uppercase;opacity:.7;margin:0 0 10px}
.programme-offer{font-size:var(--text-section);font-weight:600;margin:10px 0 6px}
.programme-extra{padding-top:var(--space-5);margin-top:var(--space-5);border-top:1px solid var(--line)}
.run-marker{display:inline-block;border:1px solid currentColor;border-radius:var(--radius-card);padding:var(--space-1) 10px;font-size:var(--text-meta);margin-top:var(--space-2)}
.calendar-programme .tonight-title{font-size:var(--text-heading)}
.calendar-programme .calendar-detail{line-height:1.55;margin:var(--space-2) 0}
.calendar-programme{padding:var(--space-2) 0 var(--space-4)}
.card-calendar.is-closed{background:transparent;color:var(--ink);border:1px solid var(--surface)}
.tonight-heading .tonight-calendar{color:inherit;border:1px solid currentColor;border-radius:var(--radius-card);padding:var(--space-2) var(--space-3);font-weight:500}
.has-requests,.sheet-tabs button.has-requests{border:1px solid var(--orange);color:var(--orange)}
.sheet-tabs button.has-requests span{display:inline-block;background:var(--orange);color:var(--bg);border-radius:var(--radius-card);min-width:24px;padding:3px 6px}
.card-calendar.is-closed .calendar-detail{color:var(--muted)}
/* Member hierarchy: progress, saved rewards, tonight, reservation, quiet history. */
.member-card{display:flex;flex-direction:column;gap:var(--space-4)}
.card-identity{padding:var(--space-2) 0 var(--space-2)}
.member-card>.reward-highlight,.member-card>.card-wallet,.member-card>.card-calendar,.member-card>.taste-panel{margin:0}
.member-card .reward-highlight{padding:var(--space-5);border-radius:var(--radius-card)}
.progress-heading{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4)}
.progress-heading .dots{gap:7px;flex-shrink:0}
.progress-heading .dots span{width:38px;height:38px}
.progress-heading .dots span.filled{background:var(--bg);border-color:var(--bg);box-shadow:inset 0 0 0 4px var(--orange)}
.member-card .reward-highlight h2{font-size:var(--text-title);font-weight:600;line-height:1.15;margin:var(--space-4) 0 0;max-width:320px}
.reward-title-line{display:block;white-space:normal}
.member-card .reward-highlight .progress-caption{font-size:var(--text-small);line-height:1.5;margin:0;color:var(--bg);text-transform:none;letter-spacing:0}
.member-card>.card-wallet.has-reward{background:var(--surface);color:var(--ink);padding:var(--space-5);border:1px solid var(--line);border-radius:var(--radius-card);text-align:left}
.card-wallet.has-reward .card-caption,.card-wallet.has-reward .card-chevron{color:var(--muted)}
.member-card>.card-wallet.is-unlocked{background:var(--attention);border-color:var(--attention);color:var(--bg)}
.card-wallet.is-unlocked .card-caption,.card-wallet.is-unlocked .card-chevron{color:var(--on-attention)}
.card-wallet.has-reward>strong{display:block;font-size:var(--text-section);line-height:1.4;margin:var(--space-3) 0 6px}
.card-wallet .card-caption{display:block}
.saved-count{margin-left:auto;min-width:24px;text-align:center;font-variant-numeric:tabular-nums}
.card-wallet .saved-count+.card-chevron{margin-left:var(--space-2)}

.card-calendar.is-closed .tonight-calendar{border-color:var(--line)}
.card-bento{gap:var(--space-4)}
.card-bento .nights-panel{background:var(--surface);border:0;border-radius:var(--radius-card)}
.card-bento .card-panel{padding:var(--space-5);min-height:0}
.nights-panel .experience-number{font-size:var(--text-title);margin:var(--space-4) 0 var(--space-3)}
.member-card>.reward-history{padding:0;min-height:32px;color:var(--muted)}
.reward-detail{display:grid;gap:var(--space-5)}
.is-customer dialog .reward-detail p{margin:0;font-size:var(--text-small);line-height:1.65}
.reward-detail .reward-state{font-size:var(--text-small)!important;color:var(--muted)}
.reward-dates{display:grid;gap:var(--space-3);border-top:1px solid var(--line);padding-top:var(--space-5);margin:0}
.reward-dates div{display:flex;justify-content:space-between;gap:var(--space-4);font-size:var(--text-small);line-height:1.5}
.reward-dates dt{color:var(--muted)}
.reward-dates dd{margin:0;text-align:right}
.reward-detail .entry-primary{width:100%;margin:0}
.reward-detail>.fine{font-size:var(--text-small)!important;color:var(--muted)}
.sheet-list:has(.reward-list-row){display:grid;gap:var(--space-3);margin-top:0}
.reward-list-row.is-available{background:var(--surface);border:1px solid var(--line);padding:var(--space-5);border-radius:var(--radius-card)}
.reward-list-row>span:first-child{display:grid;gap:var(--space-2)}
.reward-list-row strong{font-size:var(--text-section);font-weight:600;line-height:1.45}
.reward-list-row .sheet-muted,.reward-list-row small{font-size:var(--text-small);line-height:1.5;color:var(--muted);margin:0}
/* Shared control shape and spacing across member and staff flows. */
:is(.is-customer,.is-staff) :is(.primary,.secondary,.entry-primary,.entry-secondary,.tag,.staff-reservations-link,.tonight-seat,.tonight-calendar,.time-choices label,.preference-choices label,.drink-choices button,.booking-pagination button){border-radius:var(--radius-control)}
:is(.is-customer,.is-staff) :is(input:not([type=checkbox]):not([type=radio]),textarea,select){border-radius:var(--radius-control)}
:is(.is-customer,.is-staff) dialog{border-radius:var(--radius-card);padding:64px var(--space-6) var(--space-6)}
:is(.is-customer,.is-staff) dialog form{gap:var(--space-5)}
.staff-reward{gap:var(--space-4);align-items:flex-start}
.staff-reward>div{min-width:0}
.staff-reward strong{font-weight:600;line-height:1.5}
.staff-reward small{line-height:1.55;margin-top:6px}
.is-staff .staff-reward button{min-height:48px;padding:var(--space-3) var(--space-4);border-radius:var(--radius-control);font-size:var(--text-small)}
.is-staff .staff-reward button:disabled{background:var(--surface);border:1px solid var(--line);color:var(--muted);opacity:1;cursor:default}
.visit-save-state{font-size:var(--text-small);line-height:1.5;margin:var(--space-3) 0;color:var(--muted)}
.visit-save-state.is-unsaved{color:var(--orange)}
.is-staff .staff-progress>span{font-size:var(--text-meta);line-height:1.45;text-align:right;max-width:150px}
.is-staff .tonight-label{margin-top:var(--space-6)}
.is-staff .experience-corrections{margin:var(--space-3) 0 var(--space-4)}
.is-staff .member-help{margin:var(--space-4) 0}
@media(max-width:360px){.progress-heading{gap:var(--space-2)}
.progress-heading .dots span{width:32px;height:32px}
.card-bento .card-panel{padding:var(--space-4)}
.is-staff .staff-reward{flex-wrap:wrap}
.staff-reward>div{flex-basis:100%}
}
/* The booking is a plan below Tonight, not a competing reward panel. */

.reservation-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.reservation-panel-heading h2{font-size:var(--text-small);font-weight:500;letter-spacing:0;color:var(--muted)}
.reservation-switch{display:flex;align-items:center;gap:var(--space-1);font-variant-numeric:tabular-nums;font-size:var(--text-small)}
.reservation-switch button{min-width:44px;min-height:44px;font-size:var(--text-heading);border:1px solid var(--line);border-radius:var(--radius-control)}
.reservation-switch button:disabled{cursor:default;opacity:.3}

.tonight-stack .tonight-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:var(--space-5);padding:var(--space-3) 0}
.tonight-stack .programme-offer{margin:0 0 6px;font-size:var(--text-body)}
.tonight-stack .tonight-title{font-size:var(--text-heading);margin:0;line-height:1.2}
.tonight-stack .calendar-detail{font-size:var(--text-small);margin:var(--space-1) 0;line-height:1.5}
.tonight-stack .programme-extra{margin-top:var(--space-3);padding-top:var(--space-5)}
.tonight-stack .tonight-actions{margin-top:var(--space-4)}
.taste-panel .flavour-chips{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-top:14px}
.reward-small-print{border-top:1px solid var(--line);padding-top:var(--space-2);font-size:var(--text-small);color:var(--muted)}
.reward-small-print summary,.optional-booking-fields summary{cursor:pointer;min-height:44px;display:flex;align-items:center}
.reward-small-print summary::before,.optional-booking-fields summary::before{content:'›';margin-right:10px}
.reward-small-print[open] summary::before,.optional-booking-fields[open] summary::before{content:'⌄'}
.reward-small-print p{margin-top:var(--space-3)!important;font-size:var(--text-small)!important}
.booking-receipt-status{font-size:var(--text-body);font-weight:600;color:var(--orange)}
.booking-receipt-when{font-size:var(--text-section);font-weight:600}
.booking-fields-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-3)}
.optional-booking-fields{border-top:1px solid var(--line)}
.optional-booking-fields>div{display:grid;gap:var(--space-4);padding:var(--space-2) 0}
.booking-person{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);padding:14px var(--space-4);border-radius:var(--radius-control);background:var(--surface)}
.booking-person strong,.booking-person small{display:block}
.booking-person small{margin-top:var(--space-1);color:var(--muted)}
.booking-person button{min-height:44px;padding:var(--space-2);font-size:var(--text-small)}
.is-staff dialog form .check{margin:0;padding:10px var(--space-3);align-items:center;background:var(--surface);border-radius:var(--radius-control);color:var(--ink)}
.experience-correction-choices{display:grid;gap:var(--space-2)}
.experience-correction-choices .check input{flex-shrink:0}
.correction-context{color:var(--muted);font-size:var(--text-small)}
.visit-followups{display:flex;flex-wrap:wrap;gap:10px;margin:var(--space-4) 0}
.visit-followups button{padding:10px 14px;border:1px solid var(--line);border-radius:var(--radius-control);min-height:44px}
.is-staff .staff-rewards{padding:14px var(--space-4);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface);margin:var(--space-5) 0}
.is-staff .staff-rewards summary{min-height:44px;align-items:center}
.device-picker{display:flex;gap:6px;margin:0 0 18px}
.device-picker button{flex:1;min-height:44px;padding:var(--space-2);border:1px solid var(--line);border-radius:var(--radius-control);font-size:var(--text-small)}
.device-picker [aria-pressed=true]{background:var(--ink);color:var(--bg)}
@media(max-width:340px){.tonight-stack .tonight-item{gap:var(--space-3)}
.tonight-stack .tonight-title{font-size:var(--text-heading)}

.reservation-panel-heading{flex-wrap:wrap}
}
.reservation-panel-heading h2 button{padding:0;border:0;background:none;color:inherit;font:inherit;min-height:44px;text-align:left}
.is-customer dialog .booking-detail-status{font-size:var(--text-section);font-weight:600}
.is-customer dialog .booking-detail-status.is-requested{color:var(--orange,var(--orange))}
/* One next action, then tonight and the visits already saved. */
.reward-title-line{display:block;white-space:normal}
.service-home .service-heading{margin-bottom:var(--space-5)}
.service-lookup{margin:0 0 var(--space-5);border:0;padding:0}
.service-lookup .scan{display:flex;align-items:center;justify-content:center;gap:var(--space-3);margin:0 0 var(--space-3)}
.scan svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;flex-shrink:0}
.service-lookup .search-label{margin:0}
.service-lookup #search{margin:0}
.service-lookup #search-results:empty{display:none}
.service-lookup>summary{display:flex;align-items:center;justify-content:space-between;min-height:48px;color:var(--muted);cursor:pointer;list-style:none}
.service-lookup>summary::-webkit-details-marker{display:none}
.service-lookup[open]>summary{margin-bottom:var(--space-3)}
.service-visit .staff-reservations-link{font-size:var(--text-small);border:0;padding:0;min-height:44px;margin:0 0 var(--space-2);color:var(--muted)}
#staff-overview{display:grid;gap:var(--space-4)}
.shift-card{min-width:0;background:var(--surface);border:0;border-radius:var(--radius-card);padding:var(--space-5)}
.shift-card-heading{display:flex;justify-content:space-between;margin-bottom:var(--space-3)}
.shift-card-heading h2{font-size:var(--text-section);line-height:1.4;letter-spacing:-.025em;margin:0;font-weight:600}
.shift-card-heading p{font-size:var(--text-small);color:var(--muted);margin:var(--space-1) 0 0;line-height:1.5}
.shift-card-heading>a,.shift-card-heading>button{flex-shrink:0;min-height:44px;display:flex;align-items:center;font-size:var(--text-small);color:var(--muted);padding:6px 0 6px var(--space-2)}
.shift-requests{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-card);padding:var(--space-4) var(--space-5);color:var(--ink)}
.shift-requests strong{font-size:var(--text-body);font-weight:600;line-height:1.5}
.shift-requests small{display:block;font-size:var(--text-small);color:var(--muted);margin-top:var(--space-1);line-height:1.5}
.shift-requests.has-requests{background:var(--orange);border-color:var(--orange);color:var(--bg)}
.shift-requests.has-requests small{color:var(--surface)}
.shift-programme{font-size:var(--text-heading);font-weight:500;letter-spacing:-.025em;line-height:1.4;margin:var(--space-3) 0 18px}
.shift-counts{color:var(--muted);font-size:var(--text-small);line-height:1.6}
.shift-counts strong{display:block;color:var(--ink);font-weight:500;line-height:1.4}
.shift-row{display:flex;align-items:center;gap:var(--space-3);min-width:0;width:100%;text-align:left;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent}
.shift-row>span:not(.shift-time):not(.row-chevron){min-width:0;flex:1;overflow-wrap:break-word}
.shift-row strong{font-size:var(--text-body);font-weight:600;line-height:1.5;display:block}
.shift-row small{display:block;color:var(--muted);font-size:var(--text-small);line-height:1.5;margin-top:var(--space-1)}
.shift-row .row-chevron{margin-left:auto;color:var(--muted);font-size:var(--text-heading)}
.shift-time{font-size:var(--text-small);font-variant-numeric:tabular-nums;align-self:flex-start;padding-top:2px}
.shift-row .request-label{color:var(--orange)}
.shift-empty,.shift-help{font-size:var(--text-small);color:var(--muted);line-height:1.6;margin:var(--space-3) 0}
.shift-empty:last-child{margin-bottom:0}
.recent-visit-list{margin-top:var(--space-5)}
.save-staff-phone{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:48px;width:100%;margin-top:var(--space-5);padding:var(--space-3) 0;font-size:var(--text-small);color:var(--muted);text-align:left}
.is-staff .staff-member{padding:var(--space-2) 0 var(--space-5)}
.staff-member-head{position:relative;display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-3);align-items:center!important;padding:var(--space-6) 0 var(--space-4)}
.staff-member-head>div:first-child{min-width:0}
.staff-member-head h2{overflow-wrap:break-word;font-size:var(--text-title)!important;line-height:1.2}
.staff-member-head p{font-size:var(--text-small)!important;line-height:1.5}
.staff-member-head .remove-member{position:absolute;right:-8px;top:-14px;width:44px;height:44px;min-height:44px;display:flex;align-items:center;justify-content:center}
.is-staff .staff-member-head .staff-progress{display:flex}
.staff-member-head .dots{gap:6px}
.staff-member-head .dots span{width:28px;height:28px}
.visit-work-card{background:var(--surface);border-radius:var(--radius-card);padding:18px var(--space-5)}
.visit-work-card .visit-save-state{margin:0 0 var(--space-4)}
.visit-work-card .paid-check{margin:var(--space-3) 0 var(--space-5)}
.visit-work-card .tags{margin:var(--space-3) 0}
.visit-work-card .tag:not(.selected){background:var(--bg)}
.visit-work-card .visit-followups{margin:var(--space-4) 0 0}
.visit-work-card .visit-followups button{flex:1;min-width:120px}
.visit-work-card .tonight-label{margin-top:var(--space-4)}
.saved-visit-detail{background:var(--surface);border-radius:var(--radius-card);padding:18px var(--space-5);margin:var(--space-5) 0}
.saved-visit-detail h3{font-size:var(--text-small);color:var(--muted);margin:0 0 6px}
.saved-visit-detail p{margin:0 0 var(--space-4)!important;font-size:var(--text-small)!important;line-height:1.6}
.saved-visit-detail p:last-child{margin-bottom:0!important}
.is-staff .visit-home{display:flex;align-items:center;min-height:44px;margin:0 0 var(--space-4)}
@media(max-width:360px){.shift-card{padding:var(--space-4)}
.shift-card-heading{gap:var(--space-2)}
.shift-card-heading h2{font-size:var(--text-body)}
.staff-member-head .dots span{width:24px;height:24px}
.is-staff .staff-member-head .staff-progress>span{max-width:90px}
.visit-work-card{padding:var(--space-4)}
.shift-row{gap:var(--space-2)}
}
/* Phone trial: paired actions, stable icons and visible account identity. */
.ui-icon{display:inline-block;width:20px;height:20px;flex:none;vertical-align:middle;color:inherit}
.tonight-stack .tonight-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tonight-stack .tonight-actions button{display:flex;align-items:center;justify-content:center;gap:var(--space-2);min-width:0;padding:var(--space-3) 10px;font-size:var(--text-small);line-height:1.4}
.tonight-stack .tonight-actions button:only-child{grid-column:1/-1}
.is-staff .staff-name{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:3px;min-height:48px;max-width:45%;text-align:right;padding:6px 0 6px var(--space-3)}
.staff-name small{font-size:var(--text-meta);color:var(--muted)}
.staff-access-note{padding:var(--space-4) var(--space-5);background:var(--surface);border-radius:var(--radius-card);margin:var(--space-4) 0 var(--space-6)}
.staff-access-note p{font-size:var(--text-small);line-height:1.6}
.staff-access-note summary,.existing-link-option summary{cursor:pointer;min-height:48px;align-content:center}
.entry-note h2{font-size:var(--text-section);margin-top:var(--space-6)}
.existing-link-option{border-top:1px solid var(--line);padding:var(--space-2) 0;margin:var(--space-5) 0}
.existing-link-option form{margin:var(--space-4) 0}
#recovery-qr{max-width:260px;margin:var(--space-6) auto}
#recovery-qr svg{display:block;width:100%;height:auto;border-radius:var(--radius-control)}
#recovery-link{width:100%;font-size:var(--text-body)}
@media(max-width:360px){.tonight-stack .tonight-actions button{gap:var(--space-1);padding:var(--space-3) 6px}
.tonight-actions .ui-icon{width:16px;height:16px}
}

/* Approved Figma page 13, 23 September 2026. */
:root{--safe-area-top:env(safe-area-inset-top,0px);--safe-area-right:env(safe-area-inset-right,0px);--safe-area-bottom:env(safe-area-inset-bottom,0px);--safe-area-left:env(safe-area-inset-left,0px);--page-gutter-left:max(20px,var(--safe-area-left));--page-gutter-right:max(20px,var(--safe-area-right))}
html{background:var(--bg);scroll-padding-bottom:24px}
body{background:var(--bg);color:var(--ink)}
/* The Figma spacing starts inside the device safe area, not under the iOS bar. */
body .shell,body.is-member .shell,body.is-staff .shell{width:100%;max-width:430px;border:0;padding:calc(24px + var(--safe-area-top)) var(--page-gutter-right) max(24px,var(--safe-area-bottom)) var(--page-gutter-left);min-height:100dvh}
body:not(.is-welcome)::before{content:"";position:fixed;inset:0 0 auto;height:var(--safe-area-top);background:var(--bg);z-index:50;pointer-events:none}
body .topbar,body.is-member .topbar,body.is-staff .topbar{height:52px;min-height:52px;border:0;padding:0;margin:0 0 16px;gap:12px;align-items:center}
body .brand-logo{width:72px;height:50px;object-fit:contain}
body .wordmark{width:72px;height:50px;flex:none;padding:0;margin-right:auto}
body #member-menu,body #staff-account{display:flex;align-items:center;justify-content:center;gap:8px;width:124px;height:48px;min-height:48px;padding:12px 16px;border:0;border-radius:999px;background:var(--surface);color:var(--ink);font-size:16px;font-weight:400;line-height:1.3}
body [hidden]{display:none!important}
body h1,body.is-staff .service-heading h1{font-size:34px;line-height:44px;font-weight:600;letter-spacing:0;margin:0}
body h2,body h3{letter-spacing:0;font-weight:600}
body button{letter-spacing:0;box-shadow:none}
body .primary,body .entry-primary,body.is-staff .primary,body .save-action{background:var(--primary-action);color:var(--black);border:0}
body .secondary,body .entry-secondary,body.is-staff .secondary,body.is-customer .entry-secondary{border:1px solid var(--line);background:transparent;color:var(--ink)}
body button:disabled,body .primary:disabled,body .entry-primary:disabled,body .save-action:disabled{background:var(--surface);color:var(--muted);opacity:1;border-color:var(--surface)}
body input:not([type=checkbox]):not([type=radio]),body textarea,body select{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:16px;min-height:52px;padding:12px 16px;font-size:16px;line-height:24px;box-shadow:none}
body label{font-size:14px;font-weight:600;line-height:20px}
body input[type=checkbox]{appearance:none;-webkit-appearance:none;width:18px;height:18px;min-width:18px;flex:none;border:1px solid var(--muted);border-radius:50%;background:transparent;position:relative;margin:0}
body input[type=checkbox]:checked{background:var(--ink);border-color:var(--ink)}
body input[type=checkbox]:checked:after{content:'';position:absolute;inset:4px;border-radius:50%;background:var(--black);width:auto;height:auto;transform:none;border:0}
body .check,body .entry-consent{gap:16px;align-items:center}
body .choice-input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;margin:0!important;pointer-events:none}
body .choice-input:after{display:none}
body .flavour-choices label span,body .flavour-choices label input:not(:checked)+span{color:var(--flavour);border:1px solid var(--flavour);background:transparent;border-radius:999px;box-shadow:none;padding:12px;font-size:14px;font-weight:500;line-height:1.35;min-height:44px}
body .flavour-choices label input:checked+span{color:var(--black);border-color:var(--flavour);background:var(--flavour);box-shadow:none}
body .preference-choices label input:checked+span:after,body .preference-choices label input:checked+span:before{display:none}
body .cocktail-choices label span,body .time-choices label span{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;min-height:44px;padding:12px;font-size:14px;font-weight:500;line-height:1.35;text-align:center}
body .cocktail-choices input:checked+span,body .time-choices input:checked+span{background:var(--ink);color:var(--black);border-color:var(--ink);box-shadow:none}
body .flavour-choices{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
body .cocktail-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
body .flavour-chip{border-radius:999px;background:var(--flavour);color:var(--black);border:0;padding:12px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;font-size:14px;line-height:1.35;font-weight:500}
body .member-card.foundation-home{display:flex;flex-direction:column;gap:16px;padding:0;margin:0}
.foundation-home .card-identity{padding:12px 0;margin:0;min-height:68px}
.foundation-reward-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%}
.foundation-reward-row>button{aspect-ratio:1;width:100%;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--surface);color:var(--ink);padding:16px}
.foundation-reward-row .foundation-reward{border-radius:50%;gap:4px}
.foundation-reward.has-reward{background:var(--orange);color:var(--black)}
.foundation-reward-row .foundation-qr{border-radius:24px;gap:12px}
.foundation-qr strong{font-size:15px;font-weight:600;line-height:1.3}
.foundation-progress{width:100%;text-align:left;display:flex;align-items:center;gap:16px;padding:0 20px;min-height:76px;background:var(--surface);border-radius:24px}
.foundation-progress .dots{display:flex;justify-content:center;gap:8px;width:144px;flex:none;margin:0;padding:0}
.foundation-progress .dots span{width:34px;height:34px;min-width:34px;border:1px solid var(--ink);border-radius:50%;background:transparent}
.foundation-progress .dots .filled{background:var(--ink);border:5px solid var(--surface);outline:1px solid var(--ink);outline-offset:-1px}
.foundation-progress>strong{font-size:14px;line-height:1.35;font-weight:600}
.foundation-tonight{display:flex;flex-direction:column;gap:20px;background:var(--cream);color:var(--black);border-radius:24px;padding:20px}
.foundation-tonight-main{display:flex;align-items:flex-start;gap:16px}
.foundation-tonight-main>.material-symbols-rounded{margin-top:22px}
.foundation-tonight-main>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.foundation-tonight-main small{font-size:11px;line-height:1.35;font-weight:500}
.foundation-tonight-main h2{font-size:28px;line-height:1.35;font-weight:600}
.foundation-tonight-main p,.foundation-also,.foundation-tonight-note{font-size:14px;line-height:1.35}
.foundation-also{padding-left:64px;font-weight:500}
.foundation-seat{display:flex;justify-content:center;align-items:center;min-height:48px;width:100%;border:1px solid var(--black);border-radius:999px;font-weight:600;font-size:16px;line-height:24px;padding:11px 16px;color:var(--black)}
.foundation-calendar{display:flex;align-items:center;gap:16px;background:var(--panel);color:var(--black);padding:20px;min-height:96px;border-radius:48px;text-align:left}
.foundation-calendar>span:nth-child(2){flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.foundation-calendar strong{font-size:17px;font-weight:500;line-height:1.3}
.foundation-calendar small{font-size:12px;line-height:1.3}
.foundation-experiences{display:flex;align-items:center;gap:12px;background:var(--surface);padding:20px;min-height:88px;border-radius:24px;text-align:left}
.foundation-experiences>strong{font-size:36px;line-height:1.35;font-weight:600}
.foundation-experiences>span:nth-child(2){font-size:18px;line-height:1.35;font-weight:600;flex:1}
.foundation-preference{padding:20px 16px;background:var(--surface);border-radius:24px;display:flex;flex-direction:column;gap:16px;text-align:left;width:100%}
.foundation-preference-heading{display:flex;align-items:center;gap:12px;width:100%;min-height:44px}
.foundation-preference-heading strong{flex:1;font-size:18px;line-height:1.35;font-weight:600}
.outline-plus{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--ink);border-radius:50%;flex:none}
.foundation-pills{display:flex;flex-wrap:wrap;gap:8px;width:100%}
.foundation-drink{width:calc((100% - 8px)/2);min-height:44px;border:1px solid var(--line);border-radius:999px;padding:12px;font-size:14px;line-height:1.35;font-weight:500;text-align:center}
.foundation-pills .flavour-chip{width:calc((100% - 16px)/3)}
.preference-empty{color:var(--muted);font-size:14px;line-height:1.35}
.foundation-records{display:flex;justify-content:flex-end}
.foundation-records>button{background:var(--surface);width:132px;height:132px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px;gap:2px}
.foundation-records strong{font-size:44px;line-height:52px;font-weight:500}
.foundation-records span{font-size:16px;line-height:1.35;font-weight:500}

body .reservation-panel-heading h2{font-size:18px}
body dialog,body.is-customer dialog,body.is-staff dialog{background:var(--surface);color:var(--ink);border:0;border-radius:24px;width:calc(100% - 40px);max-width:350px;max-height:calc(100dvh - 40px);margin:auto;padding:24px;box-shadow:none;overflow-y:auto}
body dialog::backdrop{background:rgb(18 19 19 / 78%);backdrop-filter:none}
body dialog h2,body.is-customer dialog h2{font-size:28px;line-height:1.35;font-weight:600;margin:0 0 20px;padding:0 36px 0 0;letter-spacing:0}
body .sheet-toolbar{position:relative;height:0;z-index:1;padding:0}
body .modal-close{position:absolute;right:-4px;top:-4px;width:44px;height:44px;min-height:44px;border:0;border-radius:50%;background:var(--bg);color:var(--ink)}
body .modal-back{position:absolute;left:0;top:-4px;background:var(--bg);border-radius:50%}
body .has-back .sheet-content>h2{padding-left:52px}
body .sheet-content{padding:0;overflow:visible}
body .qr-sheet{background:var(--panel);color:var(--black)}
body .qr-sheet .sheet-muted{color:var(--black)}
body .qr-sheet canvas{display:block;margin:20px auto;width:240px!important;height:240px!important;max-width:100%;border-radius:0}
body .qr-sheet .qr-brand{display:none}
body .qr-sheet h2{text-align:left}
body .page-sheet{max-width:430px;width:100%;min-height:100dvh;max-height:100dvh;border-radius:0;background:var(--bg);padding:24px var(--page-gutter-right) 24px var(--page-gutter-left);border:0;border-top:var(--safe-area-top) solid var(--bg);border-bottom:var(--safe-area-bottom) solid var(--bg);scrollbar-width:none}
body .page-sheet .sheet-toolbar{height:68px;display:flex;align-items:flex-start;gap:12px}
body .page-sheet .sheet-toolbar:before{content:'';display:block;background:url('/brand/lum.svg') center/contain no-repeat;width:72px;height:50px;margin-right:auto}
body .page-sheet .modal-close{position:static;background:var(--surface);width:48px;height:48px;order:3}
body .page-sheet .modal-back{position:static;width:48px;height:48px;order:2}
body .page-sheet .sheet-content>h2{font-size:34px;line-height:44px;padding:12px 0 16px;margin:0 0 16px}
body .page-sheet form{gap:24px}
body .page-sheet .profile-field,body .page-sheet .member-details>div{padding:20px 0;border-bottom:1px solid var(--line)}
body .page-sheet .member-details{margin:0}
body .page-sheet .member-details dt,body .profile-field small{font-size:12px;font-weight:400;color:var(--muted);line-height:1.35;margin-bottom:4px}
body .page-sheet .member-details dd,body .profile-field p{font-size:18px;font-weight:500;line-height:1.35;margin:0}
body .owner-hub{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
body .owner-tile,body .owner-tile-wide{grid-column:auto;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:16px;min-height:128px;border:0;border-radius:24px;background:var(--surface);text-align:left;color:var(--ink)}
body .owner-tile>span:not(.material-symbols-rounded){font-size:18px;font-weight:600;line-height:1.35;margin:0;padding:0}
body .owner-tile small{font-size:12px;line-height:1.35;color:inherit;margin:0}
body .owner-tile.is-yellow{background:var(--attention);color:var(--black)}
body .owner-tile.is-grey{background:var(--panel);color:var(--black)}
body .owner-tile:disabled{opacity:.55}
body .owner h1{padding:12px 0}
.view-switch{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border:1px solid var(--line);border-radius:999px;min-height:44px;width:100%;color:var(--muted);font-size:14px;margin:16px 0}
body.is-welcome .shell{padding:0;max-width:430px}
body.is-welcome .topbar{display:none}
body .welcome{position:relative;min-height:100dvh;height:844px;max-height:none;border-radius:0;padding:0;background:linear-gradient(rgb(18 19 19 / 10%),rgb(18 19 19 / 10%)),url('/brand/welcome-background.jpg') center/cover no-repeat}
body .welcome-logo{position:absolute;top:94px;left:0;width:100%;display:flex;justify-content:center;margin:0;padding:0}
body .welcome-art{position:absolute;top:175px;left:50%;transform:translateX(-50%);width:450px;max-width:none;height:450px;object-fit:contain;margin:0}
body .welcome-actions{position:absolute;left:20%;right:20%;bottom:86px;display:block;padding:0;margin:0}
body .welcome-actions .entry-primary{background:transparent;border:1px solid var(--ink);color:var(--ink);min-height:48px;border-radius:999px}
@media(max-width:359px){.foundation-progress{padding:0 12px;gap:8px}.foundation-progress .dots{width:120px}.foundation-progress .dots span{width:30px;height:30px;min-width:30px}.foundation-experiences{gap:8px;padding:16px}.foundation-experiences>span:nth-child(2){font-size:18px}.foundation-pills .flavour-chip{width:auto;flex:1}.foundation-tonight-main{gap:12px}.foundation-tonight-main h2{font-size:28px}.foundation-also{padding-left:60px}}
body.is-staff .service{padding:0}
body.is-staff .service-home{display:flex;flex-direction:column;gap:16px}
body.is-staff .service-heading{padding:12px 0;margin:0;min-height:68px}
body.is-staff .service-home .scan-hero{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;order:2;margin:0}
body.is-staff .service-home .scan{aspect-ratio:1;min-height:0;background:var(--panel);color:var(--black);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:16px}
body.is-staff .service-home .scan small{display:none}
body .scan>span{font-size:18px;font-weight:600;line-height:1.35}
body .find-member{border-radius:24px;background:var(--surface);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;padding:16px;aspect-ratio:1}
body .find-member strong{font-size:18px;font-weight:600;line-height:1.35}
body.is-staff .service-home .service-heading{order:0}
body.is-staff .service-home .new-member{order:3;display:flex;align-items:center;gap:16px;padding:16px 20px;min-height:64px;border-radius:999px;background:var(--surface)}
body .new-member strong{flex:1;text-align:left;font-size:18px;font-weight:600}
body.is-staff .service-home .service-lookup{display:none;order:1;margin:0}
body.is-staff .service-home.is-searching .service-lookup{display:block}
body.is-staff .service-home.is-searching .scan-hero,body.is-staff .service-home.is-searching .service-home-content,body.is-staff .service-home.is-searching .new-member{display:none}
body.is-staff .service-home-content{order:4;display:contents}
body.is-staff .service-home #staff-overview{order:4;display:flex;flex-direction:column;gap:16px}
body.is-staff .service-home .resume-visit{order:1;margin:0;background:var(--attention);color:var(--black);border-radius:24px;padding:16px 20px;min-height:76px}
body.is-staff .service-home .resume-visit small{color:var(--black);font-size:12px}
body .staff-tonight-link{display:flex;gap:16px;align-items:center;padding:16px 20px;min-height:76px;background:var(--attention);color:var(--black);border-radius:24px}
body .staff-tonight-link>span:nth-child(2),body .staff-attendance-link>span:nth-child(2){flex:1;display:flex;flex-direction:column;gap:4px}
body .staff-tonight-link strong,body .staff-attendance-link strong{font-size:18px;font-weight:600;line-height:1.35}
body .staff-tonight-link small,body .staff-attendance-link small{font-size:12px;line-height:1.35}
body .recent-overview{background:var(--surface);border-radius:24px;padding:16px;display:flex;flex-direction:column;gap:16px;border:0;margin:0}
body .recent-overview h2{font-size:18px;font-weight:500;line-height:1.35}
body .staff-recent-person{display:flex;align-items:center;gap:16px;text-align:left;padding:0}
body .staff-recent-person>.material-symbols-rounded{box-sizing:content-box;padding:8px;border-radius:50%;background:var(--bg)}
body .staff-recent-person>span:last-child{display:flex;flex-direction:column;gap:4px}
body .staff-recent-person strong{font-size:22px;line-height:1.35;font-weight:600}
body .staff-recent-person small{font-size:14px;color:var(--muted);line-height:1.35}
body .staff-attendance-link{display:flex;gap:16px;align-items:center;padding:20px;background:var(--surface);border-radius:48px;min-height:88px}
body .staff-attendance-link small{color:var(--muted)}
body.is-staff .service-bottom{position:static;background:transparent;padding:0;border:0;transform:none;width:100%;max-width:none;box-shadow:none}
body.is-staff .service-bottom nav,body .booking-nav,body #save-staff-phone{display:none}
body.is-staff .service-visit .table-heading,body.is-staff .service-visit .service-heading{display:none}
body.is-staff .service-visit .staff-member{padding:0;background:transparent;border:0;margin:16px 0 24px}
body .member-detail-screen{display:flex;flex-direction:column;gap:24px}
body.is-staff .service-visit:not(.is-recording) .visit-record-screen{display:none}
body.is-staff .service-visit.is-recording .member-detail-screen{display:none}
body .visit-record-screen{display:flex;flex-direction:column;gap:24px}
body .staff-member-head{border:0;margin:0;padding:0;display:flex;align-items:flex-start}
body .staff-member-head h1{flex:1}
body .staff-member .remove-member{width:32px;min-width:32px;min-height:44px}
body .visit-work-card{background:transparent;border:0;padding:0;display:flex;flex-direction:column;gap:24px;margin:0}
body .visit-type-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}
body .visit-type-options button,body.is-staff .tags .tag{background:var(--surface);border:1px solid var(--line);color:var(--ink);border-radius:999px;min-height:44px;padding:12px;font-size:14px;line-height:1.35;text-align:center}
body .visit-type-options button[aria-pressed=true],body.is-staff .tags .tag.selected{background:var(--ink);color:var(--black);border-color:var(--ink);box-shadow:none}
body.is-staff .tags .tag small{display:none}
body.is-staff .tags{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0}
body.is-staff .visit-drinks,body.is-staff .staff-rewards{background:var(--surface);border:0;border-radius:24px;padding:16px;display:flex;flex-direction:column;gap:16px;margin:0}
body.is-staff .visit-drinks h2{font-size:22px;flex:1}
body.is-staff .visit-drinks [data-expand-drinks]{width:44px;height:44px;border-radius:50%;background:var(--bg);display:flex;align-items:center;justify-content:center;margin-left:auto}
body.is-staff .staff-rewards h3{font-size:18px;line-height:1.35;margin:0}
body.is-staff .staff-rewards .fine{font-size:12px;line-height:1.35}
body.is-staff .staff-rewards label{padding:0;min-height:44px}
body.is-staff .staff-rewards label small{display:block;color:var(--muted);font-size:12px}
body .available-rewards{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--orange);color:var(--black);border-radius:24px;padding:20px;min-height:76px}
body .visit-record-screen .visit-followups,body .visit-record-screen .experience-corrections{display:none}
body .visit-home{margin:0 0 16px;min-height:44px;display:flex;align-items:center;font-size:14px}
body .member-taste-summary{padding:20px;background:var(--surface);border-radius:24px;display:flex;flex-direction:column;gap:16px}
body .booking-proposal{padding:20px;background:var(--cream);color:var(--black);border-radius:24px;display:flex;flex-direction:column;gap:12px}
.reward-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:start}
.reward-grid>div,.reward-grid>button{aspect-ratio:1;min-width:0;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:16px;gap:4px;background:var(--surface);border-radius:24px}
.reward-grid>.reward-grid-ready{background:var(--orange);color:var(--black)}
.reward-grid .milestone-0,.reward-grid .milestone-1{border-radius:50%}
.reward-grid strong{font-size:44px;line-height:54px;font-weight:500}
.reward-grid>div>span:not(.material-symbols-rounded),.reward-grid>button>span:not(.material-symbols-rounded){border-top:1px solid currentColor;min-width:58px;padding-top:4px;font-size:12px;line-height:19px;text-align:center}
.reward-grid .material-symbols-rounded{margin-top:10px}
body .used-rewards-heading{border-top:1px solid var(--line);padding-top:20px;margin:20px 0;font-size:18px}
.used-rewards{display:flex;flex-direction:column;gap:16px}
.used-rewards>button{display:flex;flex-direction:column;align-items:flex-start;padding:20px;border-radius:24px;background:var(--surface);gap:8px;text-align:left}
.used-rewards strong{font-size:18px}.used-rewards small{font-size:14px;color:var(--muted)}
.reward-choice{display:flex;flex-direction:column;gap:8px;width:100%;background:var(--orange);color:var(--black);border-radius:24px;padding:20px;text-align:left;margin-top:20px}
.reward-choice strong{font-size:22px;line-height:1.35}.reward-choice>span{font-size:14px;line-height:1.35}
body dialog.reward-ticket-sheet{background:var(--ink);color:var(--black);padding:20px}
body .reward-ticket-sheet .modal-close{background:transparent;color:var(--black);border:1px solid var(--black)}
.reward-ticket{display:flex;flex-direction:column;gap:20px}.reward-ticket-description{font-size:20px;font-weight:500}
.reward-ticket dl{display:flex;gap:20px;border-top:1px solid var(--panel);padding-top:20px;margin:0}.reward-ticket dl>div{flex:1}.reward-ticket dt{font-size:12px}.reward-ticket dd{font-size:16px;margin:4px 0 0}
.reward-ticket>p,.reward-ticket>strong{font-size:16px;line-height:1.35}
.calendar-week-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 20px}.calendar-week-heading>button{width:44px;height:44px;border-radius:50%;background:var(--surface);display:flex;align-items:center;justify-content:center}.calendar-week-heading>strong{font-size:14px;line-height:1.35;text-align:center}
.calendar-night-list{display:flex;flex-direction:column;gap:20px}.calendar-night{display:flex;flex-direction:column;gap:8px;padding:20px;border-radius:24px;background:var(--surface);text-align:left;position:relative;width:100%}.calendar-night small{font-size:12px;color:var(--muted);line-height:1.35}.calendar-night>strong{font-size:22px;line-height:1.35;font-weight:600;padding-right:36px}.calendar-night p{font-size:14px;line-height:1.35;color:var(--muted);padding-right:20px}.calendar-night>.material-symbols-rounded{position:absolute;right:20px;top:42px}body .calendar-night.is-closed{opacity:.5}

.party-picker{padding:20px;background:var(--surface);border-radius:24px;text-align:center}.party-picker>div{display:flex;justify-content:space-around;align-items:center}.party-picker button{background:var(--ink);color:var(--black);border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center}body .party-picker input[name=people]{appearance:textfield;background:transparent;border:0;width:72px;height:54px;min-height:54px;padding:0;text-align:center;font-size:44px;line-height:54px;font-weight:500;color:var(--ink)}.party-picker input::-webkit-inner-spin-button{appearance:none}
body #seat-form .arrival-picker legend{font-size:18px;font-weight:600;text-align:center;margin:0 0 12px}.booking-confirmation-note{text-align:center;font-size:12px!important;margin:0!important}body #seat-form .time-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}

/* Reward programme, O19–O22. Step positions are independent of definitions. */
.reward-config-row,.reward-step-row{display:flex;align-items:center;gap:8px;background:var(--surface);border:0;border-radius:24px;padding:16px;width:100%;margin:0 0 12px;text-align:left;color:var(--ink)}
.reward-config-row>span:nth-child(2),.reward-config-row>strong{flex:1;min-width:0}.reward-config-row small,.reward-step-row small{display:block;color:var(--muted);font-size:12px;line-height:1.35;margin-top:4px}
.order-number{font-size:20px;color:var(--muted);min-width:24px}.reward-step-row .step-edit{border:0;padding:0;background:none;flex:1;min-width:0;text-align:left;line-height:1.35}
.step-move{flex:0 0 44px;width:44px;height:44px;border:1px solid var(--ink);border-radius:50%;padding:0;background:none;display:grid;place-items:center}.step-move:disabled{opacity:.4}.add-record{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;margin-bottom:16px}
#journey-form #manage-steps{width:100%;min-height:44px;text-align:center;text-decoration:underline}#owner-content>h3{margin:20px 0 16px}#owner-content>h2{font-size:34px;line-height:44px}

body .page-background{position:fixed;inset:0;margin:0 auto;z-index:10;overflow:hidden;pointer-events:none}
body .page-profile{width:48px;height:48px;min-height:48px;display:grid;place-items:center;border:0;background:var(--surface);border-radius:50%;order:1;padding:0}
body dialog.qr-sheet{background:var(--ink);color:var(--black);padding:20px;text-align:center}
body dialog.qr-sheet .sheet-content{display:flex;flex-direction:column;padding-top:48px;align-items:center;gap:12px}
body dialog.qr-sheet canvas{margin:0;width:240px!important;height:240px!important}
body dialog.qr-sheet h2{padding:0;margin:0;font-size:28px;text-align:center}
body dialog.qr-sheet .qr-caption{margin:0;font-size:12px;line-height:1.35}
body dialog.qr-sheet .modal-close{background:transparent;color:var(--black);border:1px solid var(--black)}
body dialog.page-sheet,body.is-customer dialog.page-sheet,body.is-staff dialog.page-sheet{max-width:430px;width:100%;height:100dvh;min-height:100dvh;max-height:100dvh;border-radius:0;background:var(--bg);padding:24px 20px;scrollbar-width:none}
body .foundation-reward>.sr-only{border:0;padding:0;min-width:0}
body .member-help .visit-followups,body .member-help .experience-corrections{display:flex}
/* Approved monthly attendance grid; colours are personal attendance states. */
.rota-dates.attendance-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;overflow:visible;margin:24px 0;scroll-snap-type:none}
.attendance-grid .weekday{text-align:center;color:var(--mid-grey,#a9aaa3);font-size:14px;padding:8px 0}
.rota-dates.attendance-grid button{display:grid;place-items:center;width:100%;min-width:0;min-height:0;aspect-ratio:1;padding:0;border-radius:50%;border:1px solid transparent;background:transparent;color:#f5f3eb;font-size:16px}
.rota-dates.attendance-grid button.is-worked{background:#f2d45e;color:#121313}
.rota-dates.attendance-grid button.is-leave{background:#e7a9c2;color:#121313}
.rota-dates.attendance-grid button[aria-current=date]{border-color:#f5f3eb}
.rota-dates.attendance-grid button[aria-pressed=true]{box-shadow:0 0 0 2px #f5f3eb;outline-offset:3px}
body dialog.booking-sent-sheet{background:#f1e8d5;color:#121313;padding:20px;border-radius:24px;text-align:center}
body dialog.booking-sent-sheet h2{font-size:34px;line-height:1.2;margin:24px 0}
body dialog.booking-sent-sheet p{font-size:16px;color:#121313;margin:0 8px 28px}
body dialog.visit-saved-sheet{background:#f2d45e;color:#121313;border-radius:24px;text-align:center}
body dialog.visit-saved-sheet h2{font-size:24px;line-height:1.25;margin:4px 0 8px}
body dialog.visit-saved-sheet p{color:#121313;margin:0;font-size:14px}
body dialog.booking-sent-sheet .modal-close,body dialog.visit-saved-sheet .modal-close{color:#121313;border-color:#121313}
.foundation-home .card-identity h1{font-size:34px!important;line-height:44px;font-weight:600;letter-spacing:-1.3px}
body dialog.qr-sheet h2{font-size:28px!important}

.saved-visit-background{position:fixed;inset:calc(100px + var(--safe-area-top)) 0 0;z-index:20;background:#121313;width:100%;max-width:430px;margin:0 auto;padding:0 var(--page-gutter-right) 0 var(--page-gutter-left);overflow:hidden;pointer-events:none}
body dialog.visit-saved-sheet .sheet-toolbar{position:absolute;right:20px;top:20px}
body dialog.visit-saved-sheet .sheet-content{padding:8px 0}
body dialog.visit-saved-sheet h2{text-align:left;padding-right:48px;margin-bottom:24px}
/* Replace the former fixed mobile sheet shell as well as its page styles. */
body #modal{inset:var(--safe-area-top) var(--safe-area-right) var(--safe-area-bottom) var(--safe-area-left);margin:auto;width:calc(100% - 40px - var(--safe-area-left) - var(--safe-area-right));max-width:350px;height:fit-content;min-height:0;max-height:calc(min(100dvh,var(--visual-height,100dvh)) - var(--safe-area-top) - var(--safe-area-bottom) - 40px);padding:24px;border:0;border-radius:24px;background:var(--surface);overflow-y:auto}
body #modal .sheet-toolbar{position:absolute;right:20px;top:20px;padding:0;background:transparent;gap:12px;height:44px;z-index:1}
body #modal .modal-close,body #modal .modal-back{width:44px;height:44px;min-height:44px;min-width:44px;border:1px solid var(--line);background:transparent;color:inherit}
body #modal .sheet-content{padding:40px 0 0;overflow:visible;flex:1}
body #modal .sheet-content>h2{font-size:28px;line-height:1.25;font-weight:600;margin:0 0 24px;padding:0}
/* Non-scrolling borders protect the status bar even while the page scrolls. */
body #modal.page-sheet{inset:0;margin:0 auto;width:100%;max-width:430px;height:min(100dvh,var(--visual-height,100dvh));min-height:0;max-height:min(100dvh,var(--visual-height,100dvh));padding:24px var(--page-gutter-right) 24px var(--page-gutter-left);border:0;border-top:var(--safe-area-top) solid var(--bg);border-bottom:var(--safe-area-bottom) solid var(--bg);border-radius:0;background:var(--bg);overflow:auto}
body #modal.page-sheet .sheet-toolbar{position:relative;inset:auto;height:68px;min-height:68px;padding:0;align-items:flex-start}
body #modal.page-sheet .sheet-content{padding:0;overflow:visible;flex:none}
body #modal.page-sheet .sheet-content>h2{font-size:34px;line-height:44px;padding:12px 0 16px;margin:0 0 16px}
body #modal.page-sheet .modal-back,body #modal.page-sheet .modal-close{width:48px;height:48px;background:var(--surface);border:0}
body #modal.qr-sheet,body #modal.reward-ticket-sheet{background:var(--ink);color:var(--black)}
body #modal.qr-sheet .sheet-content{padding:50px 0 0}
body #modal.qr-sheet .modal-close,body #modal.reward-ticket-sheet .modal-close,body #modal.booking-sent-sheet .modal-close,body #modal.visit-saved-sheet .modal-close{background:transparent;color:var(--black);border:1px solid var(--black)}
body #modal.qr-sheet #qr{margin:0 auto 16px;max-width:240px;width:100%}
body #modal.qr-sheet h2{margin:0 0 12px!important;font-size:28px!important}
body #modal.qr-sheet .qr-caption{margin:0 auto;font-size:12px;color:var(--black)}
body #modal.booking-sent-sheet{background:var(--cream);color:var(--black);text-align:center}
body #modal.booking-sent-sheet h2{font-size:34px;margin:28px 0 20px}
body #modal.visit-saved-sheet{background:var(--attention);color:var(--black)}
body #modal.visit-saved-sheet .sheet-content{padding:8px 0 0}
body #modal.visit-saved-sheet h2{font-size:24px;text-align:left;padding-right:44px;margin:0 0 24px}
body #modal.visit-saved-sheet p{text-align:center;font-size:16px;color:var(--black)}
body.is-customer .shell{padding-left:var(--page-gutter-left);padding-right:var(--page-gutter-right)}
body.is-welcome .shell{padding:0}
body #modal .sheet-toolbar:has(.page-logo):before{display:none}
.page-logo{display:block;width:72px;height:50px;margin-right:auto;flex:none}.page-logo img{display:block;width:72px;height:50px}
body .profile-field .text-link{display:block;text-align:left;font-size:14px;text-decoration:underline;padding:12px 0;min-height:44px}
body #member-preferences{margin:32px 0 24px}body #member-preferences button:disabled{display:none}
body .profile-help{text-align:center;color:var(--muted);font-size:12px;line-height:1.35;margin:24px 0 20px}
body .profile-save-card{display:block;width:100%}body .profile-remove{color:var(--orange);text-decoration:underline;margin:24px auto 0;display:block;font-size:14px}
body.is-staff .topbar .brand-logo{width:72px;height:50px}
body #staff-account{flex-direction:row;align-items:center;max-width:none}
body.is-staff .service-heading{border:0;margin:0;padding:12px 0}
body.is-staff .service-heading h1{font-size:34px;line-height:44px;letter-spacing:0;font-weight:600}
body.is-staff .service-home .scan-hero .scan{border-radius:50%;padding:16px;justify-content:center;gap:12px;min-height:0;text-align:center}
body.is-staff .service-home .scan>span:last-child{max-width:100%;font-size:18px}
body.is-staff .tags .tag.selected:before{display:none}
body.is-staff .tags .tag{min-height:44px;display:flex;align-items:center;justify-content:center}
body.is-staff .visit-drinks h2{font-size:22px;line-height:30px}
body #taste-form .preference-choices label,body .visit-drinks .preference-choices label{border:0;padding:0;min-height:44px;background:transparent;border-radius:999px}
body #taste-form .preference-choices label>span,body .visit-drinks .preference-choices label>span{display:block;width:100%;min-height:44px}
.page-logo img{filter:brightness(0) invert(1)}
body .shell{position:relative}
body .shell:has(#app .visit-home) #staff-account,body .shell:has(#app .owner-back) #staff-account{width:48px;padding:0;margin-right:60px}
body .shell:has(#app .visit-home) #staff-account>span:last-child,body .shell:has(#app .owner-back) #staff-account>span:last-child{display:none}
body #app .visit-home,body #app .owner-back{position:absolute;top:calc(26px + var(--safe-area-top));right:var(--page-gutter-right);width:48px;height:48px;min-height:48px;padding:0;margin:0;border:0;border-radius:50%;background:var(--surface);font-size:0;display:grid;place-items:center;z-index:2}
body .entry-back{top:calc(28px + var(--safe-area-top));left:var(--page-gutter-left)}
body #app .visit-home:before,body #app .owner-back:before{content:'arrow_back';font-family:'Material Symbols Rounded';font-size:28px;font-weight:400;color:var(--ink)}
body .rota-page .service-heading{display:flex;align-items:center;gap:8px;margin-bottom:20px}
body .rota-page .service-heading h1{font-size:34px;line-height:44px}
body .rota-page #refresh-shifts{font-size:12px;min-height:44px;padding:0 6px;flex:none}
body .rota-page .attendance-calendar{background:transparent;padding:0;border:0}
body .rota-month-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;margin:0}
body .rota-month-heading h2{font-size:16px;text-align:center;margin:0}
body .rota-month-heading .rota-month{position:absolute;left:58px;right:58px;top:0;bottom:0;margin:0;opacity:0}
body .rota-month-heading .rota-month input{height:100%;width:100%;min-height:44px}
body .rota-month-heading .month-arrow{width:44px;height:44px;min-width:44px;border:1px solid var(--line);border-radius:50%;font-size:24px}
body .rota-dates.attendance-grid{margin:8px 0 32px}
body .rota-dates.attendance-grid button.is-worked{background:var(--muted);color:var(--black)}
body .rota-dates.attendance-grid button[aria-pressed=true]{background:var(--cream);color:var(--black);box-shadow:none}
body .rota-selected-day{background:var(--surface);border-radius:24px;padding:20px;margin:0}
body .rota-selected-day h3{font-size:20px;margin:0 0 12px}
body .attendance-personal-totals{margin:20px 0;color:var(--muted)}
body .attendance-personal-totals summary{min-height:44px;padding:10px 0}
body .welcome{overflow:hidden}
body .owner-tile,body .owner-tile-wide{padding:16px!important;min-height:128px!important;justify-content:flex-start;gap:12px}
body .owner-tile>span:not(.material-symbols-rounded){font-size:18px!important;line-height:24px!important;padding:0!important;margin:0!important}
body .owner-tile>.material-symbols-rounded{font-size:24px!important;width:24px!important;height:24px!important;line-height:1!important;padding:0!important;margin:0!important}
body .owner-tile>small{font-size:12px!important;line-height:16px!important;margin:0!important;padding:0!important}
body #modal .member-details{display:block}
body #modal .profile-help{font-size:12px;line-height:16px}
body #modal:not(.page-sheet) .sheet-content{flex:none}
/* Keep Close outside the QR scroller, including short WebKit viewports. The
   44px toolbar + 10px gap preserve the approved 54px portrait spacing. */
body #modal.qr-sheet{padding:20px;overflow:hidden}
body #modal.qr-sheet .sheet-toolbar{position:relative;inset:auto;align-self:flex-end;height:44px;min-height:44px}
body #modal.qr-sheet .sheet-content{display:block;padding:0;margin-top:10px;overflow-y:auto;flex:0 1 auto}
body #modal.qr-sheet canvas{display:block;margin:0 auto 16px!important}
body #modal.qr-sheet h2{margin:0 0 12px!important}
body #modal.qr-sheet .qr-caption{padding:0;margin:0 auto}
body .saved-visit-background .visit-home{display:none}
body.is-staff .staff-member-head{margin:0;padding:0;align-items:flex-start}
body.is-staff .visit-record-screen>p,body.is-staff .visit-work-card>p{margin:0}
body.is-staff .visit-work-card>h3{margin:0;font-size:18px;line-height:24px}
body.is-staff .visit-work-card{gap:24px;padding:0}
body .rota-month-heading .rota-month{min-width:0;max-width:calc(100% - 116px);overflow:hidden}
body #rota-month{box-sizing:border-box;min-width:0;max-width:100%;width:100%;appearance:none;-webkit-appearance:none;padding:0}
body #modal .visit-history-count{font-size:18px;color:var(--ink);margin:12px 0 20px}
.visit-history-list{display:flex;flex-direction:column;gap:20px}
.visit-history-card{border:0;border-radius:24px;padding:20px;background:var(--surface);display:flex;flex-direction:column;gap:8px}
body #modal .visit-history-card small{font-size:12px;line-height:16px;color:var(--muted)}
body #modal .visit-history-card h3{font-size:22px;line-height:30px;color:var(--ink);margin:0;font-weight:600}
body #modal .visit-history-card p{font-size:14px;line-height:20px;color:var(--muted);margin:0}
#more-member-visits{width:100%;margin-top:20px}.history-joined{margin-top:20px}
.numbers-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:24px 0}
.numbers-grid>div{min-height:128px;border-radius:24px;background:var(--surface);padding:20px;display:flex;flex-direction:column;gap:12px}
.numbers-grid strong{font-size:34px;line-height:44px;font-weight:600}.numbers-grid span{font-size:14px;color:var(--muted)}
.numbers-rewards{background:var(--surface);border-radius:24px;padding:20px}.numbers-rewards h3{margin:0 0 12px}.numbers-rewards p{margin:0}.numbers-details{margin:24px 0}.numbers-details summary{min-height:44px}
body .team-attendance .rota-selected-day .rota-person{border:0;padding:12px 0;min-height:48px}
body .team-attendance .rota-selected-day .rota-person>span:first-child{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%}
body .team-attendance .rota-selected-day .rota-person strong{font-size:18px;font-weight:500}
body .team-attendance .rota-selected-day .rota-person small{font-size:14px;margin:0;text-align:right}
body .team-attendance .rota-selected-day .rota-person>.ui-icon{display:none}
body .team-attendance .rota-month-person{display:flex;align-items:center;gap:12px;padding:12px 0}
body .team-attendance .rota-month-person h3{font-size:18px;font-weight:500;flex:1;margin:0}
body .team-attendance .rota-month-person .rota-totals{display:flex;gap:8px;margin:0;font-size:12px;flex-wrap:wrap;flex:2}
body .team-attendance .rota-month-person .rota-totals>span{display:inline;font-size:12px}
body .team-attendance .rota-month-person .rota-totals strong{display:inline;font-size:14px;margin-right:4px}
/* Approved owner calendar and activity pages. */
body .owner-tonight{background:var(--cream);color:var(--black);padding:20px;border-radius:24px;display:flex;flex-direction:column;gap:8px;margin:0 0 20px}
body .owner-tonight small{font-size:11px;font-weight:500;color:inherit}
body .owner-tonight h3{font-size:26px;line-height:1.35;margin:0;color:inherit}
body .owner-tonight p{font-size:16px;margin:0;color:inherit}
body .owner-calendar-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:20px}
body .owner-calendar-actions>button,body .owner-calendar-actions>a{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:12px;min-height:112px;padding:16px;background:var(--surface);color:var(--ink);border:0;border-radius:24px;text-align:left;text-decoration:none}
body .owner-calendar-actions strong{font-size:17px;line-height:1.35;font-weight:600}
body #calendar-reservations{display:flex;flex-direction:column;gap:8px;margin:0 0 20px}
body #calendar-reservations p{margin:0}
body .owner-closures{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}
body .owner-closures h3{margin:0;font-size:18px}
body .closure-card{display:flex;align-items:center;gap:12px;background:var(--surface);border:0;border-radius:24px;padding:16px;text-align:left;color:var(--ink)}
body .closure-card>span:first-child{flex:1;min-width:0}
body .closure-card strong,body .closure-card small{display:block;overflow-wrap:anywhere}
body .closure-card strong{font-size:18px;font-weight:600}
body .closure-card small{font-size:14px;color:var(--muted);margin-top:4px}
body .closure-edit{flex:0 0 44px;width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--ink);border-radius:50%}
body .owner-calendar-more{margin-top:20px}
body .activity-list{display:flex;flex-direction:column;gap:16px}
body .activity-list .activity-link{min-height:52px;margin:0;border-radius:16px;font-size:16px;line-height:24px;text-transform:none}
body.is-staff .shell>.topbar,body.is-staff .shell:has(.owner)>.topbar{height:52px;min-height:52px;padding:0;margin:0 0 16px}
body .reward-config-row>.outline-plus{flex:0 0 44px;width:44px;height:44px;min-width:44px;margin-left:auto}
body .reward-config-row>strong{flex:1;min-width:0}
body #modal.page-sheet .modal-close,body #modal.page-sheet .modal-back{margin-left:0}
body .time-choices label,body .time-choices label:has(input:checked){border:0;padding:0;min-height:44px;border-radius:999px;background:transparent}
body .time-choices label:has(input:checked):before{display:none}
body .time-choices label>span{display:block;width:100%}

/* Measured M01 / S01 proof, 24 September. These rules are deliberately scoped:
   other approved screens and the shared iOS inset treatment are unchanged. */
body .foundation-home .card-identity h1{letter-spacing:0}
body .foundation-home .foundation-experiences{height:auto;min-height:88px}
body .foundation-home .foundation-experiences>strong{line-height:48px}
body.is-staff .service-home .scan-hero{grid-template-columns:minmax(0,180fr) minmax(0,160fr)}
body.is-staff .service-home .scan-hero .scan{aspect-ratio:1;gap:12px}
body.is-staff .service-home .scan>span:last-child{font-size:16px;line-height:22px;font-weight:600}
body.is-staff .service-home .find-member{aspect-ratio:auto;gap:12px}
body.is-staff .service-home .find-member>.material-symbols-rounded{width:62px!important;height:62px!important}
body.is-staff .service-home .find-member strong{font-size:16px;line-height:22px;font-weight:600}
body.is-staff .service-home .new-member{padding:16px;line-height:24px}
body.is-staff .service-home .resume-visit{gap:12px;padding:16px;min-height:75px;border:0;justify-content:flex-start}
body.is-staff .service-home .resume-details{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
body.is-staff .service-home .resume-details strong{font-size:17px;line-height:23px;font-weight:600;overflow-wrap:anywhere}
body.is-staff .service-home .resume-details small{margin:0;font-size:12px;line-height:16px;font-weight:400}
body.is-staff .service-home .staff-tonight-link{padding:16px;min-height:76px}
body.is-staff .service-home .staff-tonight-link strong{line-height:24px}
body.is-staff .service-home .staff-tonight-link small{line-height:16px}
body.is-staff .service-home .recent-overview{gap:12px}
body.is-staff .service-home .recent-overview h2{font-size:18px;line-height:23px;margin:0}
body.is-staff .service-home .staff-recent-person{gap:12px;min-height:49px;border:0}
body.is-staff .service-home .staff-recent-person>.material-symbols-rounded{padding:10px}
body.is-staff .service-home .staff-recent-person strong{font-size:20px;line-height:27px}
body.is-staff .service-home .staff-recent-person small{font-size:13px;line-height:18px}
body.is-staff .service-home #all-recent-visits{min-height:44px;padding:10px 16px;line-height:24px}
body.is-staff .service-home .staff-attendance-link{gap:14px;min-height:88px;border-radius:44px}
body.is-staff .service-home .staff-attendance-link>span:nth-child(2){gap:2px}
body.is-staff .service-home .staff-attendance-link strong{font-size:17px;font-weight:500;line-height:22px}
body.is-staff .service-home .staff-attendance-link small{font-size:11px;line-height:14px}
body .foundation-home .foundation-tonight-main small{line-height:15px}
body .foundation-home .foundation-tonight-main p,body .foundation-home .foundation-also{line-height:19px}
body .foundation-home .foundation-drink{line-height:19px}
body .foundation-home .foundation-calendar{padding-right:26px}
body .foundation-home .foundation-experiences{padding-right:30px}
body.is-staff .service-home .resume-visit{padding-right:24px;text-align:center}
body.is-staff .service-home .new-member{padding-right:20px}
/* The hidden legacy navigation's empty wrapper must not consume a flex gap. */
body.is-staff .service-home .service-bottom{display:none}
body.is-staff .service-home .scan>.material-symbols-rounded{font-weight:400;line-height:1}

/* Attendance: correct the grid and independent card spacing without granting
   staff permission to change historical attendance (S13 remains an exception). */
body.is-staff .shell:has(.rota-page)>.topbar{margin-bottom:20px}
body .rota-page{gap:20px}
body .rota-page .service-heading{margin:0;padding:12px 0;min-height:68px}
body .rota-page .service-heading h1{line-height:44px}
body .rota-page .attendance-calendar{margin:0;display:flex;flex-direction:column;gap:12px}
body .rota-page .rota-month-heading{height:44px;min-height:44px;gap:12px}
body .rota-page .rota-month-heading h2{font-size:16px;line-height:22px;font-weight:600;margin:0;flex:1}
body .rota-page .month-arrow{display:grid;place-items:center;padding:0;color:var(--muted)}
body .rota-page .rota-dates.attendance-grid{display:flex;flex-direction:column;gap:12px;margin:0}
body .rota-page .attendance-weekdays,body .rota-page .attendance-dates{display:grid;grid-template-columns:repeat(7,minmax(0,44px));justify-content:center;gap:4px}
body .rota-page .attendance-weekdays{height:22px}
body .rota-page .attendance-weekdays .weekday{font-size:12px;font-weight:500;line-height:16px;color:var(--muted);text-align:center}
body .rota-page .attendance-dates button{font-size:14px;font-weight:500;line-height:19px;border:0;box-shadow:none;aspect-ratio:1}
body .rota-page .attendance-dates button[aria-current=date]{outline:2px solid var(--line);outline-offset:-2px}
body .rota-page .attendance-dates button[aria-pressed=true]{background:var(--cream);color:var(--black)}
body .rota-page .rota-selected-day{padding:20px;display:flex;flex-direction:column;gap:12px}
body .rota-page .rota-selected-day h3{font-size:20px;line-height:27px;margin:0;font-weight:600}
body .rota-page .rota-people{display:flex;flex-direction:column;gap:12px}
body .rota-page .rota-selected-day .rota-person{padding:0;border:0;min-height:44px}
body .rota-page .rota-selected-day .rota-person strong{font-size:18px;line-height:24px;font-weight:500}
body .rota-page .rota-selected-day .rota-person small{font-size:14px;line-height:19px}
body .rota-page .rota-selected-day>.fine{margin:0;font-size:12px;line-height:16px}
body .rota-page .attendance-tools{color:var(--muted)}
body .rota-page .attendance-tools>summary{padding:12px 0;min-height:44px;font-size:14px;line-height:20px}
body .rota-page .attendance-tools-content{display:flex;flex-direction:column;gap:16px;padding-top:12px}
body .rota-page .attendance-personal-totals{margin:0}
body .rota-page .attendance-holiday{padding:20px;display:flex;flex-direction:column;gap:12px}
body .rota-page .attendance-holiday .shift-card-heading{margin:0;align-items:center}
body .rota-page .attendance-holiday h2{padding:0;font-size:18px;line-height:24px}
body .rota-page .attendance-holiday .fine{margin:0}
body .rota-page .attendance-monthly{background:transparent;border-top:1px solid var(--line);border-radius:0;padding:20px 0 0}
body .rota-page .attendance-monthly h2{font-size:18px;line-height:24px;margin:0 0 20px}
body .rota-page .attendance-monthly .rota-month-person{min-height:48px;padding:12px 0;gap:12px}
body .rota-page .my-shift .shift-card-heading{margin:0 0 12px}
body .rota-page .my-shift h2{padding:0;font-size:18px;line-height:24px}
body .rota-page .my-shift .shift-state{font-size:16px;line-height:22px}
body .rota-page .attendance-monthly{display:flex;flex-direction:column;gap:20px}
body .rota-page .attendance-monthly h2{margin:0;font-weight:600}
body .rota-page .attendance-total-row{display:flex;align-items:center;gap:12px;min-height:48px;margin:0}
body .rota-page .attendance-total-row strong{font-size:18px;line-height:24px;font-weight:500;flex:1}
body .rota-page .attendance-total-row>span{font-size:14px;line-height:19px;color:var(--muted);text-align:right}
body .rota-page .attendance-pending{display:flex;flex-direction:column;gap:4px;padding:16px;background:var(--attention);color:var(--black);border:0;border-radius:24px;text-align:left}
body .rota-page .attendance-pending strong{font-size:18px;line-height:24px;font-weight:600}
body .rota-page .attendance-pending small{font-size:14px;line-height:19px;font-weight:400}
body .rota-page .attendance-tools-content summary{font-size:14px;line-height:20px;padding:12px 0;min-height:44px}

/* Approved simplification: actual worked days and holiday, without shift plans. */
.calendar-week-heading>button{flex:none}
.calendar-week-heading>strong{flex:1;min-width:0;white-space:nowrap;font-size:16px;line-height:22px}
body .rota-page .attendance-tabs{display:flex;gap:8px;min-height:45px}
body .rota-page .attendance-tabs>button{flex:1;border:1px solid var(--line);border-radius:999px;padding:12px;background:var(--surface);color:var(--ink);font-size:14px;font-weight:500;line-height:19px}
body .rota-page .attendance-tabs>button[aria-pressed=true]{background:var(--ink);color:var(--black);border-color:var(--ink)}
body .rota-page .attendance-legend{font-size:12px;line-height:16px;color:var(--muted);margin:0}
body .rota-page .attendance-save{display:flex;flex-direction:column;gap:16px;padding:20px;border-radius:24px;background:var(--surface);margin:0}
body .rota-page .attendance-save p{font-size:16px;line-height:22px;font-weight:500;margin:0;overflow-wrap:anywhere}
body .rota-page .attendance-save .entry-primary{height:48px;min-height:48px;line-height:24px;font-size:16px;margin:0}
body .rota-page .attendance-correction-link{background:none;border:0;color:var(--ink);padding:12px;font-size:14px;line-height:20px;min-height:44px;text-decoration:underline}
body .rota-page.my-attendance .attendance-dates button:disabled{opacity:1}
body .rota-page.my-attendance .attendance-dates button.is-future{opacity:.35}
body .rota-page.my-attendance [hidden]{display:none!important}
/* Approved attendance states, Figma 583:2855. Brand orange is unchanged. */
body .rota-page.my-attendance,body #leave-calendar{--calendar-today-fill:#e66c32;--calendar-holiday-fill:#aec987}
body .rota-page.my-attendance .attendance-dates button{display:grid;place-items:center;padding:0;outline:0;filter:none}
body .rota-page.my-attendance .attendance-dates button[aria-pressed=true]{background:var(--bg);color:var(--ink);outline:2px solid var(--attention);outline-offset:0}
body .rota-page.my-attendance .attendance-dates button.is-worked{background:var(--attention);color:var(--black)}
body .rota-page.my-attendance .attendance-dates button[aria-current=date]{background:var(--calendar-today-fill);color:var(--black)}
body .rota-page.my-attendance .attendance-dates button[aria-current=date] .material-symbols-rounded{color:#fff}
body .rota-page.my-attendance .attendance-dates button.is-leave{background:var(--calendar-holiday-fill);color:var(--black);opacity:1}
body .rota-page.my-attendance .legend-dot.saved{background:var(--attention)}
body .rota-page.my-attendance .legend-dot.selected{background:transparent;border:2px solid var(--attention)}
body .rota-page.my-attendance .legend-dot.today{background:var(--calendar-today-fill);border:0}


/* Whole-site review, 25 September: shared geometry and interaction states. */
body #modal.page-sheet .sheet-toolbar{height:72px;min-height:72px}
body #modal.page-sheet .sheet-content>h2{min-height:68px;padding:12px 0;margin:0 0 20px;letter-spacing:0}
body #modal:not(.page-sheet):not(.qr-sheet){padding:20px}
body #modal:not(.page-sheet):not(.qr-sheet):not(.join-qr-sheet) .sheet-content{padding-top:0}
body #modal:not(.page-sheet):not(.qr-sheet) .sheet-content>h2{min-height:44px;padding:6px 56px 6px 0;margin:0 0 20px;font-size:24px;line-height:32px;letter-spacing:0;text-align:left}
body #modal.has-back:not(.page-sheet):not(.qr-sheet) .sheet-content>h2{padding-right:56px}
body #modal:not(.page-sheet) .sheet-feedback:not([hidden]){margin-top:56px}
body #modal.booking-sent-sheet .sheet-content>h2{font-size:22px;line-height:30px;text-align:center;padding:0;min-height:0;margin:0 0 20px}
body #modal .reward-ticket dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:0;padding-top:20px;border-top:1px solid rgb(18 19 19 / 25%)}
body #modal .reward-ticket dl>div{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:0;border:0}
body #modal .reward-ticket dt{font-size:12px;line-height:16px}
body #modal .reward-ticket dd{font-size:14px;line-height:19px;font-weight:500;margin:0;text-align:left}
body #modal .reward-ticket-description{font-size:18px;line-height:24px;font-weight:500;margin:0}
body #modal.experiences-sheet{background:var(--cream);color:var(--black)}
body #modal.experiences-sheet .modal-close{border-color:var(--black)}
body #modal.experiences-sheet .experience-total{font-size:16px;line-height:22px;color:inherit;margin:0 0 20px}
body #modal.experiences-sheet .sheet-list{display:flex;flex-direction:column;gap:0}
body #modal.experiences-sheet .experience-detail{display:flex;align-items:center;gap:12px;border:0;border-bottom:1px solid rgb(18 19 19 / 40%);padding:0;min-height:76px}
body #modal.experiences-sheet .experience-detail>strong{font-size:18px;font-weight:500;line-height:24px;flex:1;min-width:0}
body #modal.experiences-sheet .experience-count{font-size:14px;line-height:19px;text-align:right;flex:none;color:inherit}
body #modal.experiences-sheet .experience-check{width:30px;height:30px;min-width:30px;border:1px solid var(--black);border-radius:50%;background:transparent}
body #modal.experiences-sheet .experience-check.is-tried{background:var(--black);box-shadow:inset 0 0 0 4px var(--cream)}
body .foundation-taste .taste-group{display:flex;flex-direction:column;gap:8px;width:100%}
body .foundation-taste .taste-group-label{font-size:12px;line-height:16px;color:var(--muted)}
body .foundation-taste .foundation-preference-heading>strong{overflow-wrap:normal}
body .foundation-taste .outline-plus{flex:none}

body .reward-grid>div,body .reward-grid>button{justify-content:flex-start;gap:4px}
body .reward-grid>div>span:not(.material-symbols-rounded),body .reward-grid>button>span:not(.material-symbols-rounded){border:0;min-width:0;padding:0}
body .reward-grid .reward-counter-rule{width:58px;height:1px;background:currentColor;flex:none}
body .reward-grid .reward-counter-label{font-size:12px;line-height:19px}
body .reward-grid .reward-eye,body .reward-grid .reward-empty-space,body .reward-grid .reward-milestone-icon{width:44px;height:44px;min-height:44px;display:grid;place-items:center}
body .reward-grid .reward-eye{border:1px solid currentColor!important;border-radius:50%}
body .reward-grid .material-symbols-rounded{margin:0}
body .reward-grid>.reward-grid-ready.is-empty{background:var(--surface);color:var(--muted);opacity:1;cursor:default}
body .reward-grid>.reward-grid-ready.has-rewards{background:var(--orange);color:var(--black)}
body .numbers-grid{gap:10px;margin:0 0 20px}
body .numbers-grid>div{aspect-ratio:1;min-width:0;min-height:0;padding:20px 16px;gap:8px;align-items:center;justify-content:center;text-align:center}
body .numbers-grid strong{font-size:44px;line-height:54px;font-weight:500}
body .numbers-grid>div:first-child{border-radius:50%;background:var(--ink);color:var(--black)}
body .numbers-grid>div:nth-child(4){border-radius:50%;background:var(--peach,#f5bda0);color:var(--black)}
body .numbers-grid>div:first-child span,body .numbers-grid>div:nth-child(4) span{color:inherit}
body .menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
body .menu-drink{border:1px solid var(--line);border-radius:24px;min-height:48px;padding:12px 16px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
body .menu-drink strong{font-size:14px;line-height:20px;font-weight:500;overflow-wrap:anywhere}
body .menu-drink small{font-size:12px;line-height:16px;color:var(--muted)}
body #owner-menu #new-drink{width:100%;margin:24px 0 0}
body .menu-help{margin:20px 0 0}
/* Keep labels and icons in place while saving. aria-busy exposes the state;
   form-state.js supplies a visible, announced Saving… message for forms. */
button[aria-busy=true]{cursor:progress!important;opacity:.7}
body .reservation-send-action{display:flex;align-items:center;justify-content:center;gap:10px}
body .reservation-confirmed-icon{display:grid;place-items:center;width:48px;height:48px;border:1px solid currentColor;border-radius:50%;margin:0 auto 20px}
@media(prefers-reduced-motion:no-preference){
 button,a,input,select,textarea,.selection-pill>span,.flavour-choices label>span,.time-choices label>span{transition:background-color 140ms ease,color 140ms ease,border-color 140ms ease,opacity 140ms ease}
 button:active:not(:disabled):not([aria-busy=true]),a:active{filter:brightness(.93)}
 #modal[open]:not(.page-sheet):not(:has(input,textarea,select)){animation:lum-sheet-arrive 160ms ease-out}
 #toast:not([hidden]){animation:lum-feedback-arrive 200ms cubic-bezier(.2,.8,.2,1)}
 body.is-member #modal[open]:not(.page-sheet):not(:has(input,textarea,select)),body.is-member #toast:not([hidden]){animation-duration:140ms}
 body.is-member :is(button,a){transition:background-color 140ms ease,color 140ms ease,border-color 140ms ease,opacity 140ms ease,scale 120ms cubic-bezier(.2,.8,.2,1)}
 body.is-member :is(button,a):is(:active,.member-press):not(:disabled):not([aria-busy=true]){scale:.97}
 body.is-member #modal[open].page-sheet:not(:has(input,textarea,select)) .sheet-content:not(.no-page-motion){animation:lum-member-reveal 140ms cubic-bezier(.2,.8,.2,1)}
 .member-progress-confirmed .dots,.member-reward-confirmed{animation:lum-member-confirmed 180ms cubic-bezier(.2,.8,.2,1)}
 .reservation-confirmed-icon{animation:lum-member-confirmed 160ms cubic-bezier(.2,.8,.2,1)}
 @keyframes lum-member-reveal{from{opacity:.75;translate:0 6px}to{opacity:1;translate:0 0}}
 @keyframes lum-member-confirmed{from{opacity:.4;scale:.94;translate:0 6px}to{opacity:1;scale:1;translate:0 0}}
 @keyframes lum-sheet-arrive{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
 @keyframes lum-feedback-arrive{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
body .available-rewards.is-empty{background:var(--surface);color:var(--muted);opacity:1;cursor:default}

body .numbers-grid>div:nth-child(4) strong{font-size:30px;line-height:40px}
body #owner-menu>h2{font-size:34px;line-height:44px;padding:12px 0;margin:0 0 20px;font-weight:600}
body .member-detail-screen{gap:16px}
body .member-detail-screen>h1{margin:0;padding:12px 0;font-size:34px;line-height:44px}
body .member-detail-screen>p{margin:0}
body .member-detail-screen>.foundation-progress{margin:0}
body .member-detail-screen>.available-rewards{justify-content:center;min-height:52px;padding:14px 16px;border-radius:16px;background:var(--attention)}
body .member-detail-screen>.available-rewards.is-empty{background:var(--surface);color:var(--muted)}
body .member-detail-screen>.member-taste-summary{display:block;gap:0;margin:0;background:transparent;padding:0;border:1px solid var(--line);border-radius:16px}
body .member-taste-summary>summary{min-height:52px;text-align:center;padding:14px 16px;font-size:16px;line-height:24px;font-weight:600;list-style:none}
body .member-taste-summary>summary::-webkit-details-marker{display:none}
body .member-taste-summary[open]>:not(summary){margin:16px}
body .member-taste-summary[open]>summary{border-bottom:1px solid var(--line)}
body .member-detail-screen>.member-help{padding:0;background:transparent;margin:0}
body .member-detail-screen .member-help>.secondary{margin:0;width:100%;min-height:52px;padding:14px 16px;border:1px solid var(--line);border-radius:16px;font-size:16px;line-height:24px}
body #modal .owner-member-meta{margin:0 0 20px;font-size:16px;color:var(--muted)}
.owner-member-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0}
.owner-member-actions>button{display:flex;flex-direction:column;gap:12px;align-items:flex-start;text-align:left;min-height:112px;padding:16px;background:var(--surface);border-radius:24px}
.owner-member-actions strong{font-size:17px;line-height:23px;font-weight:600}
.owner-member-more>summary{min-height:44px;padding:12px 0;font-size:14px;color:var(--muted)}
@media(max-width:360px){body .member-detail-screen .foundation-progress,body #modal .foundation-progress{padding:0 12px;gap:10px}body .member-detail-screen .foundation-progress .dots,body #modal .foundation-progress .dots{width:122px}}

body #modal.join-qr-sheet #qr{display:block;width:100%;max-width:280px;margin:20px auto;border-radius:16px}
body #modal.join-qr-sheet .qr-intro{margin:0;font-size:16px;line-height:22px;text-align:center}
body #modal.join-qr-sheet .qr-caption{text-align:center;color:var(--muted);font-size:12px;line-height:16px;margin:0}
body #modal .staff-account-role{font-size:16px;line-height:22px;margin:0 0 20px;color:var(--muted)}
.staff-account-links{display:flex;flex-direction:column;gap:16px;margin:0 0 20px}
.staff-account-links>a,.staff-account-links>button{display:flex;align-items:center;gap:12px;min-height:88px;padding:20px;background:var(--surface);color:var(--ink);border-radius:24px;text-align:left;text-decoration:none}
.staff-account-links strong,.staff-account-links small{display:block}.staff-account-links strong{font-size:17px;font-weight:600;line-height:23px}.staff-account-links small{font-size:12px;color:var(--muted);line-height:16px;margin-top:4px}
body #modal .staff-account-details{margin-top:24px}body #modal .staff-account-details>summary{font-size:14px;line-height:20px;min-height:44px;color:var(--muted)}
body #modal .booking-guest-name{font-size:20px;line-height:28px;margin:0 0 20px;font-weight:600}
/* Preserve contrast in the reservation banner and the layout of inert page backdrops. */

body .foundation-home .reservation-panel-heading h2{color:var(--black)}
body .page-background.page-sheet .sheet-toolbar{height:72px;min-height:72px}
body .page-background .sheet-toolbar:has(.page-logo):before{display:none}
body .page-background.page-sheet .sheet-content>h2{min-height:68px;padding:12px 0;margin:0 0 20px;letter-spacing:0}
body .page-background.page-sheet .member-details{display:block}
body .page-background form:has(.entry-consent){margin:32px 0 24px}
body .page-background form:has(.entry-consent)>button:disabled{display:none}

/* 27 September feedback: controls shared across member, staff and owner. */
body input:not([type=checkbox]):not([type=radio]):focus-visible,body textarea:focus-visible,body select:focus-visible{outline:1px solid var(--ink);outline-offset:1px;border-color:var(--ink)}
body button>.material-symbols-rounded{flex:none}
body #modal:not(.page-sheet) .modal-back{display:none}
body #modal:not(.page-sheet):not(.qr-sheet) .sheet-content>h2{line-height:1.35;font-size:24px;padding-top:5px;padding-bottom:5px}
body #modal:not(.page-sheet) .sheet-content>p:not(.fine):not(.sheet-feedback):not(.pending):not(.experience-total):not(.qr-caption):not(.qr-intro):not(.booking-guest-name):not(.correction-context){font-size:16px;line-height:1.35;margin:0 0 20px}
body #modal .reward-ticket>p:not(.reward-ticket-description){font-size:14px;line-height:19px;margin:0}
body #modal .reward-ticket>strong{font-size:14px;line-height:19px;font-weight:600}
body #modal.experiences-sheet .experience-detail:first-child{min-height:52px;padding-bottom:12px}
body #modal.experiences-sheet .experience-detail:last-child{border-bottom:0;min-height:64px;padding-top:12px}
body #modal:is(.booking-sent-sheet,.visit-saved-sheet):not(.page-sheet):not(.qr-sheet) .sheet-content{padding-top:56px}
body #modal:is(.booking-sent-sheet,.visit-saved-sheet):not(.page-sheet):not(.qr-sheet) .sheet-content>h2{padding:0;min-height:0;text-align:center;font-size:22px;line-height:30px;margin:0 0 20px}
body #modal.booking-sent-sheet .sheet-content>p,body #modal.visit-saved-sheet .sheet-content>p{margin:0;text-align:center}
body #modal.page-sheet form{gap:20px}
body #modal.page-sheet form>label{display:flex;flex-direction:column;gap:8px;margin:0}
body #modal.page-sheet form>label.check{flex-direction:row;gap:12px;min-height:44px;font-weight:400}
body #modal.page-sheet form>.sheet-back{margin:0;align-self:center;font-size:14px;text-decoration:underline;font-weight:500}
body #modal.page-sheet :is(form>p,.calendar-impact){font-size:14px;line-height:20px;margin:0}
body #modal.page-sheet .form-save-status:empty{display:none}
body #modal.page-sheet .fine{font-size:12px;line-height:16px}
/* M01/M25: reward and QR labels share a baseline inside their 170px cards. */
body .foundation-reward-row .foundation-reward.no-reward{background:var(--surface);color:var(--ink)}
/* M02: retain the short weekday/date and the Figma card text hierarchy. */
body .calendar-night{padding:16px;gap:8px}
body .calendar-night p{margin:0;padding-right:36px;font-size:14px;line-height:19px;font-weight:400}
body .calendar-night>.material-symbols-rounded{right:16px;top:50%;transform:translateY(-50%)}
/* M03/M05/M06/M07: one night, two columns, one reservation action. */

body .party-picker>div{justify-content:center;gap:24px;height:64px}
body .party-picker input[name=people]{width:120px;height:64px;min-height:64px;font-size:48px;line-height:1;padding:0;border:0;border-radius:0;text-align:center;-moz-appearance:textfield}
body .party-picker button{flex:none}

body .reservation-all{font-size:12px;display:flex;align-items:center;gap:8px;margin-top:12px}
body .booking-actions{display:flex;flex-direction:column;gap:20px}
body #cancel-seat{color:var(--orange);font-size:14px;font-weight:500;text-decoration:underline;margin:0}
/* M09/M27: available rewards are the first, directly actionable list. */
.available-reward-list{display:flex;flex-direction:column;gap:12px}
body .reward-choice{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:20px;border-radius:24px;background:var(--surface);color:var(--ink);border:0;text-align:left;width:100%;margin:0}
body .reward-choice:nth-child(n){background:var(--surface);color:var(--ink)}
body .reward-choice strong{font-size:20px;line-height:27px;font-weight:600}
body .reward-choice span{font-size:12px;line-height:16px;font-weight:400;color:var(--muted)}
.reward-empty{padding:20px;border-radius:24px;background:var(--surface)}
body .reward-empty h3{font-size:20px;line-height:27px;margin:0 0 8px}
body .reward-empty p{font-size:14px;line-height:20px;color:var(--muted);margin:0}
body .reward-section-heading,body .used-rewards-heading{font-size:18px;line-height:24px;margin:24px 0 16px}
body .reward-upcoming{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
body .reward-upcoming>div{padding:16px;min-width:0;min-height:0}
body .reward-upcoming>div>strong{font-size:44px;line-height:54px}
body .reward-upcoming .reward-counter-rule{width:58px}
/* M14-M21: restrained type, aligned lists and stable email button labels. */
body .save-card-steps{list-style:none;counter-reset:install;padding:0;margin:20px 0;display:flex;flex-direction:column;gap:16px}
body .save-card-steps>li{counter-increment:install;display:block;position:relative;padding-left:24px;margin:0;font-size:16px;line-height:24px}
body .save-card-steps>li:before{content:counter(install) '.';position:absolute;left:0;top:0;font-weight:400}
body .email-entry .fine,body .entry-content>.fine,body #email-code-form~.fine{font-size:12px;line-height:17px}
body #email-resend{font-size:14px;font-weight:500;min-height:44px;padding:10px 0;border:0;text-decoration:underline;background:transparent}
body #email-change{font-size:14px;font-weight:500;text-decoration:underline}
body .email-entry form{gap:20px}
body .draft-restored{font-size:14px;line-height:20px;color:var(--muted)}
/* Owner page rows, editing forms and shared human-readable selection controls. */
body .owner-hub .owner-tile{background:var(--surface);color:var(--ink)}
body .owner-member-actions>button{min-height:112px;justify-content:flex-start}
body .owner-member-actions strong{font-size:17px;line-height:23px;min-height:46px;max-width:115px}
body .weekday-options{display:flex;flex-wrap:wrap;gap:8px}
body .weekday-options>label{display:block;position:relative;border:0;padding:0;min-height:44px}
body .weekday-options>label>span{display:flex;align-items:center;justify-content:center;min-width:60px;min-height:44px;padding:12px;border:1px solid var(--line);border-radius:999px;font-size:14px;font-weight:500;background:var(--surface)}
body .weekday-options input:checked+span{background:var(--ink);color:var(--black);border-color:var(--ink)}
body .weekday-options input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}
body .weekday-options>label:has(input:checked):before{display:none}
body .staff-config-list{display:flex;flex-direction:column;gap:16px;margin:16px 0}
body #owner-content .staff-access-note{font-size:12px;line-height:18px;color:var(--muted);margin:20px 0 0}
body .staff-rota-link{margin:0}
body #modal .staff-profile-details{margin:0 0 20px}
body #modal .staff-profile-details dd{overflow-wrap:anywhere}
body .member-detail-screen>.available-rewards,body .member-detail-screen>.member-taste-summary,body .member-detail-screen .member-help>.secondary{border-radius:999px}
body .member-detail-screen>.member-taste-summary[open]{border-radius:24px}
body .member-detail-screen>.member-help .visit-followups,body .member-detail-screen>.member-help>.text-link,body .member-detail-screen>.text-link{margin-top:12px}
body .attendance-legend{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:32px}
.attendance-legend>span{display:inline-flex;align-items:center;gap:6px;font-size:12px;line-height:16px}
.legend-dot{display:inline-block;width:14px;height:14px;border-radius:50%;flex:none}
.legend-dot.saved{background:var(--muted)}.legend-dot.selected{background:var(--cream)}.legend-dot.today{border:1px solid var(--ink)}
body .service.is-searching .service-heading{display:none}
body .service.is-searching .lookup-heading{margin:12px 0 20px;padding:0;border:0}
body .service.is-searching .lookup-heading h2{font-size:34px;line-height:44px;font-weight:600}
body .service.is-searching .lookup-heading #end-search{display:none}
body .search-result{display:flex;align-items:center;gap:16px;width:100%;padding:20px;border:0;border-radius:24px;background:var(--surface);text-align:left;margin:0 0 12px}
body .search-result strong,body .search-result b{font-size:18px;line-height:24px;font-weight:600}
body .search-result>span{font-size:12px;line-height:16px;color:var(--muted)}
body .search-mode{display:flex;gap:8px;margin:0 0 20px}
body .search-mode button{flex:1;border:1px solid var(--line);border-radius:999px;font-size:14px;line-height:20px;padding:12px;background:var(--surface)}
body .search-mode button[aria-pressed=true]{background:var(--ink);color:var(--black);border-color:var(--ink)}
@media(max-width:359px){body .party-picker>div{gap:12px}body .party-picker input[name=people]{width:90px}
}

body .search-result-person{display:flex;flex-direction:column;flex:1;gap:4px}
body .search-result-person>strong{color:var(--ink);font-size:18px;line-height:24px}
body .search-result-person>small{font-size:12px;line-height:16px;color:var(--muted)}
body .search-label{display:flex;flex-direction:column;gap:8px;font-size:14px;font-weight:600;margin:0 0 20px}
body #modal.experiences-sheet .sheet-content>h2{margin-bottom:12px}
body #modal.experiences-sheet .experience-total{font-size:18px;line-height:24px;font-weight:500;margin-bottom:12px}
body #modal.experiences-sheet .experience-detail{height:77px;min-height:77px}
body #modal.experiences-sheet .experience-detail:first-child{height:65px;min-height:65px}
body #modal.experiences-sheet .experience-detail:last-child{height:64px;min-height:64px}

/* Reservation diary and saved visit screens, measured against O11/S09/S10/S15. */
body .reservation-diary .service-heading{margin:0 0 20px;padding:12px 0}
body .diary-requests{margin:0 0 20px}
body .booking-request-card{display:flex;align-items:center;gap:24px;width:100%;padding:20px;background:var(--attention);color:var(--black);border-radius:24px;text-align:left}
body .booking-request-card>strong{font-size:44px;line-height:54px;font-weight:500}
body .booking-request-card>span{font-size:18px;line-height:24px;font-weight:600}
body .booking-request-card small{display:block;font-size:12px;line-height:16px;font-weight:400;margin-top:4px}
body .diary-date-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
body .diary-date-nav>button{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;padding:0}
body .diary-date-nav>strong{font-size:16px;line-height:22px;font-weight:600}
body .reservation-diary .booking-night-status{font-size:12px;line-height:16px;color:var(--muted);text-align:center;padding:0;margin:0 0 20px;font-weight:400}
body .reservation-diary .booking-night-status:not(.is-closed){background:transparent;border:0;border-radius:0}
body .reservation-diary .booking-summary{background:var(--surface);border-radius:24px;padding:20px;margin:0 0 20px}
body .reservation-diary .booking-counts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0}
body .reservation-diary .booking-counts>span{display:flex;flex-direction:column;font-size:12px;line-height:16px;color:var(--muted);gap:4px}
body .reservation-diary .booking-counts strong{font-size:44px;line-height:54px;font-weight:500;color:var(--ink)}
body .diary-list-title{font-size:18px;line-height:24px;margin:0 0 16px}
body .booking-list{display:flex;flex-direction:column;gap:16px;margin:0 0 20px}
body .booking-row{align-items:flex-start;gap:16px;padding:20px;min-height:0;border:0;border-radius:24px;background:var(--surface);margin:0}
body .booking-time{font-size:16px;line-height:24px;font-weight:400;min-width:48px}
body .booking-row-main{gap:4px}
body .booking-row-main strong{font-size:20px;line-height:27px;font-weight:600}
body .booking-row-main small{font-size:12px;line-height:16px;font-weight:400}
body .diary-tools{margin-top:20px;color:var(--muted)}
body .diary-tools summary{min-height:44px;font-size:12px;line-height:18px;padding:12px 0}
body .recent-visit-list{display:flex;flex-direction:column;gap:20px;margin:0}
body .recent-visit-list .recent-visit{background:var(--surface);padding:20px;border:0;border-radius:24px;min-height:100px;margin:0;align-items:center}
body .recent-visit-list .recent-visit strong{font-size:22px;line-height:30px;font-weight:600}
body .recent-visit-list .recent-visit small{font-size:12px;line-height:16px;color:var(--muted);margin-top:4px}
body #modal .saved-visit-detail{display:flex;flex-direction:column;gap:8px;padding:20px;border:0;border-radius:24px;background:var(--surface);margin:0 0 20px}
body #modal .saved-visit-detail h3{font-size:18px;line-height:24px;margin:0;font-weight:600}
body #modal .saved-visit-detail p{font-size:14px;line-height:20px;margin:0}
body #modal .saved-visit-detail small{font-size:12px;line-height:16px;color:var(--muted)}
body .reward-config-row,body .reward-step-row{gap:12px;padding:16px;min-height:76px;margin-bottom:16px}
body .reward-config-row strong,body .reward-step-row strong{font-size:16px;line-height:22px;font-weight:500}
body .order-number{font-size:20px;line-height:27px;font-weight:400}
body .step-move:disabled{border:1px solid var(--muted);color:var(--muted);background:transparent;opacity:.5}
body #modal.page-sheet .sheet-content>#reward-step-list{margin-top:20px}
body #owner-content:not(:has(.activity-list))>h2{padding:12px 0;min-height:68px;margin:0 0 20px}
body #modal.reward-ticket-sheet #redeem-form{margin:20px 0 0;gap:20px}
body #modal.reward-ticket-sheet #redeem-form>p,body #modal.reward-ticket-sheet #redeem-form>.primary{margin:0}
body #modal.reward-ticket-sheet .sheet-content>h3{font-size:28px;line-height:1.35;margin:0 0 20px}
body #modal.reward-ticket-sheet #redeem-form .primary{background:var(--black);color:var(--ink)}
body #modal.reward-ticket-sheet .fine{color:var(--black)}

/* Remove inherited extra field margins: the Figma gap is 8px, not 8px + 7px. */
body #modal.page-sheet:has(.sheet-content>form) .sheet-toolbar{height:68px;min-height:68px}
body #modal.page-sheet:has(.sheet-content>form) .sheet-toolbar{padding-bottom:16px}
body #modal.page-sheet:has(.sheet-content>form) .sheet-content>h2{margin-bottom:16px}
body #modal.page-sheet .sheet-content>form{margin-top:0}
body #modal form label>input,body #modal form label>select,body #modal form label>textarea{margin-top:0}
body #modal form label:not(.check):not(.entry-consent){display:flex;flex-direction:column;gap:8px}
body #modal form :is(input:not([type=checkbox]):not([type=radio]),textarea,select){min-height:54px}
body #modal form label.check{background:transparent;padding:0;gap:12px}
body #modal form .weekday-options>label{display:block}
body #modal #seat-form .party-picker input{min-height:64px}
body #modal .member-details>div:first-child{padding-top:0}
body input:not([type=checkbox]):not([type=radio]):focus-visible,body select:focus-visible,body textarea:focus-visible{outline:none!important;border-color:var(--ink);box-shadow:none}
body [data-calendar-group=times]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
body [data-calendar-group=times]>label{min-width:0}
body.is-staff .search-result{flex-wrap:nowrap;gap:16px;padding:20px;border:0;border-radius:24px;min-height:100px}
body.is-staff .search-result>span.search-result-person{flex:1;font-size:12px}
body.is-staff .search-result>span.search-result-person strong{font-size:18px;font-weight:600}
body .service.is-searching .service-lookup{background:transparent;border:0;padding:0}
body .reservation-diary .diary-requests:has(#bookings-requests.text-link){margin-bottom:12px}
body .reservation-diary #bookings-requests.text-link{gap:8px;font-size:12px;font-weight:400}
body .reservation-diary #bookings-requests.text-link small{display:none}

/* Clear boundaries between a draft selection and a saved visit. */
body #group-visit-review{padding:20px;background:var(--surface);border-radius:24px;margin:20px 0}
body #group-visit-review[hidden]{display:none}
body #group-visit-review h3{font-size:18px;line-height:24px;margin:0 0 16px}
body .group-review-member{border-top:1px solid var(--line);padding:16px 0}
body .group-review-member strong{font-size:16px;line-height:24px}
body .group-review-member small{font-size:12px;color:var(--muted);font-weight:400}
body .group-review-member p{font-size:14px;line-height:20px;margin:4px 0 0}
body #modal.reward-ticket-sheet .sheet-back{color:var(--black)}
body #recovery-form .check{font-size:14px;line-height:20px}

/* 2 October agreed corrections. Shared cards retain the approved geometry. */
body .foundation-qr>.material-symbols-rounded{align-self:center}
body .foundation-qr>strong{align-self:center}
body .party-picker input::-webkit-inner-spin-button,body .party-picker input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

body #modal:is(.booking-sent-sheet,.visit-saved-sheet) .sheet-content>p,body #modal .reward-ticket p,body .save-card-steps>li{text-wrap:balance}
body #modal.qr-sheet .sheet-content>.qr-caption{text-align:center;margin:0}
body #taste-form .preference-choices label>span{display:flex;align-items:center;justify-content:center;text-align:center}
body .email-entry .entry-description,body .entry-content>.entry-description{font-size:16px;line-height:1.35;text-wrap:pretty}
body .email-entry form>label:not(.entry-consent){font-size:14px;line-height:20px}
body #modal .email-recipient{margin:0 0 20px;overflow-wrap:anywhere;font-size:12px;line-height:17px}
body #modal #email-start-form~.fine{font-size:12px;line-height:17px;text-wrap:balance}
body #scan-search{margin-top:16px}
body .visit-record-screen .visit-drinks{margin-top:24px}
body #modal #make-recovery,body #save-worked-days{border:1px solid var(--line)}
body #modal #make-recovery:disabled,body #save-worked-days:disabled{background:transparent;color:var(--muted);border-color:var(--muted)}
body #manage-steps{width:100%;text-align:center;align-self:center}
.experience-order-actions,.view-choice-actions{display:flex;flex-direction:column;gap:20px;margin:20px 0}
body .experience-order-actions>button,body .view-choice-actions>*{margin:0}
body #owner-content .numbers-activity{margin:20px 0;font-size:12px;line-height:18px}
body #modal .correction-context{margin:0 0 20px;font-size:16px;line-height:24px}
@media(max-width:359px){
 body .reward-grid>div,body .reward-grid>button{padding:10px;gap:2px}
 body .reward-grid strong{font-size:36px;line-height:44px}
 body .reward-grid .reward-eye,body .reward-grid .reward-empty-space,body .reward-grid .reward-milestone-icon{width:36px;height:36px;min-height:36px}
}

/* The signup Back control must be visible beside, rather than beneath, the logo. */
body .email-entry>.entry-back{left:auto;right:var(--page-gutter-right);background:var(--surface);z-index:2}
body #modal.join-qr-sheet .sheet-content{padding-top:56px}

.save-card-sheet .keep-together{white-space:nowrap}
.welcome-reward-note{display:grid;gap:4px;text-align:center;margin:12px 0 20px;font-size:14px;line-height:1.4;text-wrap:balance}

/* Availability reasons sit on the light Tonight card. */
.foundation-tonight .booking-unavailable{color:inherit}

/* Approved compact wallet, Figma528:2523 and546:2575. Home's progress is reused. */
body .rewards-wallet{display:flex;flex-direction:column;gap:24px}
body .rewards-wallet :is(h3,p){margin:0}
body .rewards-wallet :is(.reward-section-heading,.reward-empty-heading){font-size:18px;line-height:1.35;font-weight:600}
body .rewards-wallet .reward-empty-copy{font-size:14px;line-height:1.35;color:var(--muted)}
body .rewards-wallet .available-reward-list{display:flex;flex-direction:column;gap:24px;margin:0}
body .rewards-wallet .reward-choice{display:flex;flex-direction:row;align-items:center;gap:12px;min-height:104px;padding:20px;border-radius:24px;background:var(--flavour);color:var(--black);margin:0;text-align:left}
body .rewards-wallet .reward-content{display:flex;flex-direction:column;gap:8px;min-width:0;flex:1;color:inherit}
body .rewards-wallet .reward-choice strong{font-size:18px;line-height:1.35;font-weight:600}
body .rewards-wallet .reward-choice span{color:inherit}
body .rewards-wallet .reward-content>span{font-size:14px;line-height:1.35}
body .rewards-wallet .reward-choice>.material-symbols-rounded{flex:none}
body .rewards-wallet .reward-history{margin:0;border:0;padding:0}
body .rewards-wallet .reward-history>summary{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:48px;padding:12px;color:var(--muted);font-size:14px;line-height:1.35;font-weight:400;cursor:pointer;list-style:none}
body .rewards-wallet .reward-history>summary::-webkit-details-marker{display:none}
body .rewards-wallet .reward-history>summary:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:12px}
body .rewards-wallet .reward-history[open]>summary>.material-symbols-rounded{transform:rotate(180deg)}
body .rewards-wallet .used-rewards{gap:12px;margin-top:24px}
body .rewards-wallet .reward-history-row{gap:8px;padding:20px;background:var(--surface);color:var(--ink);border-radius:24px}
body .rewards-wallet .reward-history-row strong{font-size:18px;line-height:1.35;font-weight:600}
body .rewards-wallet .reward-history-row small{font-size:14px;line-height:1.35;color:var(--muted)}
body #modal.page-sheet:has(.rewards-wallet) .sheet-toolbar{height:52px;min-height:52px;margin-bottom:24px}
body #modal.page-sheet:has(.rewards-wallet) .sheet-content>h2{min-height:0;padding:0;margin:0 0 24px}

/* Sanj’s 4 October feedback: one reservation selector and explicit identities. */
body #staff-booking-form input[type=radio],body #staff-booking-form input[type=checkbox]{appearance:none;-webkit-appearance:none;width:22px;height:22px;min-width:22px;border:1px solid var(--muted);border-radius:50%;background:transparent;position:relative;margin:0}
body #staff-booking-form input:is([type=radio],[type=checkbox]):checked{background:var(--ink);border-color:var(--ink)}
body #staff-booking-form input:is([type=radio],[type=checkbox]):checked:after{content:'';position:absolute;inset:5px;border-radius:50%;background:var(--black)}
body #staff-booking-form input:is([type=radio],[type=checkbox]):focus-visible{outline:2px solid var(--ink);outline-offset:4px}
body .booking-row--pending{background:var(--attention);color:var(--black)}
body .booking-row--pending .booking-row-main small{color:var(--black)}
body .booking-row--confirmed{border-left:4px solid var(--herbal,#b7c7a3)}
body .booking-other-dates{display:flex;flex-direction:column;gap:12px}
body .booking-other-dates h2{font-size:18px;line-height:24px;margin:0}
body .booking-other-dates .entry-secondary{white-space:normal}
body .booking-member-search,body #booking-guest-fields{display:flex;flex-direction:column;gap:16px}
body .booking-member-search .search-result{width:100%;text-align:left;min-height:52px}
body .booking-member-search .search-result small{display:block;font-size:14px;color:var(--muted)}
body .booking-date-label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
body .booking-date-picker>details{margin:0}
body .booking-date-picker summary{min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:12px 16px;cursor:pointer;font-size:16px;line-height:24px}
body .booking-date-picker summary:after{content:'⌄';font-size:20px}
body .booking-month{padding-top:16px}
body .booking-month-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
body .booking-month-heading button{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center}
body .booking-month-heading strong{font-size:16px;text-align:center}
body .booking-month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;text-align:center}
body .booking-month-grid>span{font-size:12px;color:var(--muted)}
body .booking-month-grid>button{min-width:0;min-height:44px;border-radius:50%;font-size:14px;display:flex;flex-direction:column;align-items:center;justify-content:center}
body .booking-month-grid>button[aria-pressed=true]{background:var(--cream);color:var(--black)}
body .booking-month-grid>button small{font-size:10px;line-height:12px}
body .booking-month-grid>button.is-closed{color:var(--muted)}
body .booking-month-grid>button:disabled{opacity:.5}
body .rota-page #rota-my-shift{width:100%}
body .rota-page #refresh-shifts{width:100%;min-height:52px;display:flex;align-items:center;justify-content:center;text-align:center;border-radius:999px;padding:12px 20px;font-size:16px;line-height:24px;color:var(--ink)}

body #diary-date{margin-bottom:12px}
body .reservation-diary>.fine{margin:0 0 20px}
body .booking-other-dates{margin:20px 0}

/* Approved 4 October member action hierarchy, Figma 554:2616 / 554:2663. */
body .member-service-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
body .member-service-actions .member-action-tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:8px;min-height:92px;padding:16px;border:0;border-radius:24px;text-align:left;color:var(--black)}
body .member-service-actions .member-action-tile>strong{font-size:14px;font-weight:600;line-height:1.35}
body .member-service-actions .member-action-tile>.material-symbols-rounded:first-child{line-height:28px;height:28px!important;width:28px!important}
body .member-service-actions .member-action-tile>.material-symbols-rounded:last-child{position:absolute;right:16px;top:16px}
body .member-service-actions .member-rewards-tile{background:var(--attention)}
body .member-service-actions .member-rewards-tile.is-empty{background:var(--surface);color:var(--muted)}
body .member-service-actions .member-booking-tile{background:var(--blue)}
body .member-detail-screen>.member-taste-summary{background:var(--surface);border:0;border-radius:24px}
body .member-taste-summary>summary{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:64px;padding:16px;text-align:left}
body .member-detail-screen>.member-maintenance{display:flex;flex-direction:column;gap:0;padding:16px;background:var(--surface);border-radius:24px}
body .member-maintenance>.member-maintenance-label{margin:0;font-size:12px;line-height:18px}
body .member-detail-screen .member-maintenance>.member-maintenance-row{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:48px;padding:8px 0;margin:0;background:transparent;border:0;border-radius:0;color:var(--ink);font-size:14px;font-weight:600;line-height:24px;text-align:left}
/* Same native-checkbox, name-only selection pills as Record a visit. */
body #drinks-form .drink-pill-group{padding:16px;margin:16px 0;border:0;border-radius:24px;background:var(--surface);min-width:0}
body #drinks-form .drink-pill-group>legend{float:left;width:100%;padding:0;margin:0 0 12px;font-size:18px;font-weight:600;line-height:24px}
body #drinks-form .cocktail-choices{clear:both;padding:0;margin:0;gap:12px 8px}
body :is(#drinks-form,#draft-section-form) .cocktail-choices.preference-choices label{border:0;padding:0;min-height:44px;background:transparent;border-radius:999px}
body :is(#drinks-form,#draft-section-form) .cocktail-choices.preference-choices label>span{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;font-weight:500}

body #modal.page-sheet:has(#drinks-form) .sheet-content>h2{font-size:28px;line-height:36px;margin-bottom:16px}
body #modal.page-sheet:has(#drinks-form) .sheet-content>p,body #drinks-form .drink-instructions,body #drinks-form .sheet-muted{font-size:14px;line-height:1.5}

/* Figma 554:2616 / 554:2663: 48px heading slot, preserving its ink position. */
body .member-detail-screen>h1{box-sizing:border-box;height:auto;min-height:0;flex-shrink:0;padding:12px 0 0;margin-bottom:-8px}
/* Figma 554:2716: compact editor rhythm, independent of generic page/form rules. */
body #modal.page-sheet:has(#drinks-form) .sheet-content>h2{min-height:0;padding:0;line-height:35px;margin:0 0 16px}
body #modal.page-sheet:has(#drinks-form) .sheet-content>p:not([hidden]){line-height:18px;margin:0 0 16px}
body #modal.page-sheet #drinks-form{gap:16px;margin:0}
body #drinks-form .drink-instructions{line-height:18px;margin:0}
body #drinks-form .drink-pill-group{margin:0}

/* Phone feedback: compact badges and centred supporting labels. */
body .booking-row-main .booking-labels{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:4px}
body .booking-labels>.guest-flag,body .booking-labels>.booking-status{flex:0 1 auto;width:fit-content;max-width:100%;margin:0;padding:4px 9px;border-radius:999px;font-size:12px;line-height:16px}
body .booking-awaiting{display:grid;gap:4px}
body .reservation-diary>#refresh-bookings{margin-top:20px}
body #modal:is(.qr-sheet,.join-qr-sheet) .sheet-content>.qr-caption{width:100%;max-width:none;margin:0;text-align:center}
body #modal #taste-form .form-save-status:not(.sr-only){text-align:center;margin:0 0 16px}
body #app .visit-home,body #app .owner-back{display:flex;align-items:center;justify-content:center}
body #app .visit-home:before,body #app .owner-back:before{line-height:1}

/* Approved board568:2698: personal attendance, explicit experience lifecycle. */
body .attendance-overview{display:flex;flex-direction:column;gap:16px}
body .attendance-overview>h1,body .attendance-overview>h2,body .attendance-overview p{margin:0}
body .attendance-overview>h2,body .attendance-owner-tools h2{font-size:18px;line-height:25px;font-weight:600}
body .attendance-overview #rota-my-shift,body .attendance-overview .shift-card{margin:0}
body .attendance-overview .shift-card{display:flex;flex-direction:column;gap:12px;padding:20px}
body .attendance-overview .shift-card-heading p{display:none}
body .attendance-overview .shift-card h2{font-size:18px;line-height:25px;margin:0}
body .attendance-overview .shift-state{font-size:14px;line-height:21px;color:var(--muted)}
body .attendance-role,body .availability-badge{display:block;width:fit-content;border-radius:999px;padding:6px 12px;background:var(--cream);color:var(--black);font-size:14px;line-height:20px;font-weight:600}
body .attendance-month-summary{background:var(--surface);border-radius:24px;padding:20px;display:grid;gap:12px}
body .attendance-month-summary>strong{font-size:22px;line-height:28px}
body .attendance-month-summary>p{font-size:14px;line-height:21px;color:var(--muted)}
body .attendance-owner-tools{display:flex;flex-direction:column;gap:16px}
body .attendance-owner-tools>h2{margin:0}
body .attendance-overview>#refresh-shifts{align-self:flex-start;font-size:14px;line-height:21px;min-height:44px}
body .experience-management{display:grid;gap:16px;margin:16px 0}
body .experience-management-card,body .experience-availability{display:flex;flex-direction:column;gap:12px;border-radius:24px;padding:20px;background:var(--surface)}
body .experience-management-card h3,body .experience-availability h3,body .experience-lifecycle h3{margin:0;font-size:18px;line-height:25px;font-weight:600}
body .experience-management-card p,body .experience-availability p{margin:0;color:var(--muted);font-size:14px;line-height:21px}
body .experience-lifecycle{display:grid;gap:12px}
body .experience-lifecycle p{margin:0}
body .experience-fields[open]{display:grid;gap:20px}
body #experience-order{display:grid;gap:16px;margin:20px 0}
/* Status is expressed by the labelled pill, never the whole card or left rail. */
body .booking-row--pending,body .booking-row--confirmed{background:var(--surface);color:var(--ink);border-left:0}
body .booking-row--pending .booking-row-main small{color:var(--muted)}
body .booking-labels>.booking-status,body .booking-labels>.guest-flag{padding:6px 12px;font-size:14px;line-height:20px;font-weight:600}
body .booking-labels>.status-confirmed{background:var(--cream);color:var(--black)}
body .booking-row:is(.booking-row--pending,.booking-row--confirmed,.booking-row--other){display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px}
body .booking-row:is(.booking-row--pending,.booking-row--confirmed,.booking-row--other) .booking-row-main{display:contents}
body .booking-row:is(.booking-row--pending,.booking-row--confirmed,.booking-row--other) .booking-time{padding:0;font-size:18px;line-height:25.2px;font-weight:600}
body .booking-row:is(.booking-row--pending,.booking-row--confirmed,.booking-row--other) .booking-row-main>strong{font-size:18px;line-height:25.2px;font-weight:600}
body .booking-row:is(.booking-row--pending,.booking-row--confirmed,.booking-row--other) .booking-row-main>small{grid-column:1/-1;font-size:14px;line-height:21px}
body .booking-row .booking-labels{grid-column:1/-1;margin-top:0}
body .booking-labels>.status-pending{background:var(--attention);color:var(--black)}
body .rota-page.attendance-overview .my-shift .shift-card-heading{margin:0}
body .rota-page.attendance-overview .my-shift .shift-state{font-size:14px;line-height:21px}
body .rota-page.attendance-overview .my-shift .entry-primary{margin:0}
body .rota-page.attendance-overview>#refresh-shifts{width:auto;border:0;background:transparent;padding:0;justify-content:flex-start;font-size:14px;line-height:21px;min-height:44px}
body #owner-content>#reorder-experiences{margin-top:16px}
body #modal .experience-lifecycle>.fine,body #modal #edit-config>.fine:has(+.experience-availability){font-size:14px;line-height:21px}
body .attendance-overview>h2,body .attendance-owner-tools>h2{padding:0}
body .rota-page.attendance-overview>#refresh-shifts{font-weight:400;color:var(--muted)}
body .rota-page.attendance-overview>h1{font-size:34px;line-height:44px;font-weight:600;letter-spacing:0}

/* Approved overview rhythm: scoped to these views; headings grow with their text. */
body .rota-page.attendance-overview>h1{height:auto;min-height:0;padding:0;margin:0 0 -8px;flex-shrink:0}
body .rota-page.attendance-overview>.attendance-date{margin:0;font-size:14px;line-height:21px}
body #owner-content:has(>.experience-management)>h2{height:auto;min-height:0;padding:0;margin:0 0 12px;overflow-wrap:anywhere}
body #modal.page-sheet:has(#edit-config .experience-availability) .sheet-content>h2{height:auto;min-height:0;padding:0;margin:0 0 8px;overflow-wrap:anywhere}
.night-content{display:flex;flex-direction:column;gap:8px;min-width:0;text-align:left;overflow-wrap:anywhere}
.night-content>.night-title,.night-content>[data-night-slot]{margin:0}
.night-content>[data-night-slot]{display:block;font-size:14px;font-weight:400;line-height:1.35}
.night-content>.night-status,.night-content>.night-also{font-weight:500}
.calendar-night>.night-content{min-width:0;padding-right:36px}
.calendar-night .night-title{font-size:22px;line-height:1.35;font-weight:600}
.calendar-night [data-night-slot]{color:var(--muted);line-height:19px}
.reservation-support{margin:0}
/* Live review: keep historical headings with their rows and nested pills inside the card. */
body #modal.experiences-sheet .sheet-list+.experience-total{margin-top:24px;margin-bottom:4px}
body #modal #scan-message{text-align:center;margin:16px 0 20px}
body .member-taste-summary[open]>.foundation-pills{width:auto}
body .member-taste-summary[open]>:not(summary){max-width:calc(100% - 32px)}
body .member-taste-summary>.visit-followups:empty{display:none}
/* Reviewed What's on: shared controls, explicit draft state, one inline member card. */
.whats-on{display:flex;flex-direction:column;gap:16px}.whats-on h2{font-size:28px;line-height:1.2}.wo-tabs{display:flex;gap:8px}.wo-tabs button{flex:1;min-height:44px;padding:10px 8px;border-radius:999px;font-size:14px}.wo-tabs button[aria-pressed=true],.wo-choices button[aria-pressed=true],#wo-scheduled[aria-pressed=true],#wo-closed[aria-pressed=true]{background:var(--ink,#f5f3eb);color:#121313;border-color:transparent;box-shadow:none}.wo-filters{background:#222421;padding:12px;border-radius:24px;display:grid;gap:12px}.wo-filters input{margin:0;background:#121313}.wo-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0}.wo-heading p{font-size:14px;color:var(--muted)}.wo-heading button{width:auto;min-height:44px;padding:10px 24px}.wo-item{display:flex;text-align:left;width:100%;gap:12px;padding:20px;background:#222421;color:var(--ink);border:0;border-radius:24px;margin:0 0 16px}.wo-item>.night-symbol{flex:none}.wo-item-copy{min-width:0;display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:21px}.wo-item-copy>strong{font-size:22px;line-height:30px}.wo-meta{display:flex;justify-content:space-between;gap:12px;font-size:12px;line-height:18px;color:var(--muted)}.wo-item-copy small{font-size:12px;line-height:18px;color:var(--muted)}.wo-inline-preview{margin:20px 0}.wo-choices{display:grid;grid-template-columns:1fr 1fr;gap:8px}.wo-choices button{min-height:48px;border-radius:999px;font-size:14px;padding:12px}.wo-appearance{display:grid;gap:12px}.wo-appearance #wo-icon{display:flex;align-items:center;justify-content:center;gap:8px}.wo-colours{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:12px}.wo-colours button{width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:50%;background:var(--swatch);position:relative;flex-shrink:0}.wo-colours button[aria-pressed=true]:after{content:'';position:absolute;width:10px;height:10px;border-radius:50%;background:#121313;top:17px;left:17px}.wo-actions{display:flex;gap:16px;align-items:center;padding-top:16px}.wo-actions .primary{flex:1}.wo-actions .sheet-back{width:auto;color:var(--orange,#ff813d)}.wo-lifecycle{display:grid;gap:16px;margin-top:24px;border-top:1px solid var(--line);padding-top:24px}.wo-weekdays{display:flex;gap:4px;border:0;padding:0}.wo-weekdays legend{font-size:14px;margin-bottom:8px}.wo-weekdays label{flex:1;min-width:0}.wo-weekdays input{position:absolute;opacity:0;width:1px}.wo-weekdays span{display:grid;place-items:center;height:44px;border-radius:99px;background:#222421}.wo-weekdays input:checked+span{background:var(--ink);color:#121313}.wo-weekdays input:focus-visible+span{outline:2px solid var(--ink)}#wo-item-form,#wo-date-form{display:grid;gap:24px}#wo-item-form label,#wo-date-form label{font-size:14px;line-height:20px}dialog::backdrop{background:rgb(0 0 0 / .4);backdrop-filter:blur(8px)}.foundation-tonight .night-secondary{border-top:1px solid currentColor;margin-top:12px;padding-top:12px}.night-secondary h3{font-size:22px;line-height:30px}.night-secondary .night-support{display:flex;flex-direction:column;gap:8px}
body .wo-heading>.primary{width:120px;flex:0 0 120px;min-height:44px;font-size:14px;padding:10px 16px}body .wo-heading>p{flex:1}body .wo-item-copy{flex:1}body .wo-tabs>button:not([aria-pressed=true]),body .wo-choices>button:not([aria-pressed=true]){background:#222421;border:1px solid #454741;color:#f5f3eb}body .wo-choices>button[aria-pressed=true]{background:#f5f3eb;color:#121313;border:0;box-shadow:none}body .wo-filters #wo-search{background:#121313}body .wo-colours>button{background:var(--swatch);border:0;width:44px;min-width:44px;padding:0}body .wo-actions{position:sticky;bottom:0;background:#121313;padding:16px 0;z-index:2}body .wo-actions>.primary{width:auto}body .wo-actions>.sheet-back{width:auto;margin:0}body #wo-closed,body #wo-scheduled{background:#222421;border:0;border-radius:99px;min-height:48px}body #wo-scheduled[aria-pressed=true]{background:#f5f3eb;color:#121313}body .owner-tile.has-requests{background:var(--attention);color:#121313}
.night-secondary{position:relative}.night-secondary-icon{position:absolute;left:-64px;top:12px;width:48px;display:flex;justify-content:center}@media(max-width:359px){.night-secondary-icon{left:-60px}}
body .whats-on .booking-month-grid button[aria-pressed=true]{background:#f5f3eb;color:#121313;border-color:transparent;box-shadow:none;outline:0}body #modal.page-sheet:has(#wo-date-form) .sheet-content>h2,body #modal.page-sheet:has(#wo-item-form) .sheet-content>h2{font-size:28px;line-height:33.6px;margin:0 0 24px;padding:0}
/* Owner review: compact aligned actions, true weekday circles and draft cards. */
body .whats-on .wo-heading>#wo-add{height:44px;min-height:44px;padding:10px 16px;font-size:14px;line-height:24px;border:0;border-radius:999px}
body #wo-item-form .wo-select{position:relative;display:block;width:100%}
body #wo-item-form .wo-select>select{appearance:none;-webkit-appearance:none;width:100%;padding-right:52px}
body #wo-item-form .wo-select>.material-symbols-rounded{position:absolute;right:16px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--ink)}
body #wo-item-form .wo-weekdays{display:flex;justify-content:space-between;gap:4px;min-width:0}
body #wo-item-form .wo-weekdays>label{display:block;flex:0 1 44px;width:44px;max-width:44px;min-width:0;margin:0;position:relative}
body #wo-item-form .wo-weekdays>label>span{width:100%;height:auto;aspect-ratio:1;border-radius:50%;padding:0;display:grid;place-items:center;line-height:1}
body #wo-item-form .wo-weekdays>label>input{position:absolute;width:1px;height:1px;margin:0;padding:0;min-height:0}
body .wo-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 16px}
body .wo-actions>.form-save-status:not(.sr-only){grid-column:1/-1;margin:0;font-size:14px}
body .wo-actions>.primary{grid-column:1;min-width:0;width:100%}
body .wo-actions>.sheet-back{grid-column:2;padding:12px 8px;white-space:nowrap}
body .wo-preview-section{display:grid;gap:12px;min-width:0}
body .wo-preview-section>h3{margin:0;font-size:14px;line-height:20px;font-weight:600}
body .wo-preview-section .foundation-tonight{margin:0;width:100%;min-width:0}
body .wo-preview-section .night-content{min-width:0;overflow-wrap:anywhere}
body #calendar-reservations.wo-reservations{display:grid;gap:12px;margin:24px 0 0;padding:24px 0 0;border-top:1px solid var(--line)}
body #calendar-reservations.wo-reservations label,body #calendar-reservations.wo-reservations p{margin:0}
body :is(#wo-item-form,#wo-date-form) .wo-colours>button{flex:0 0 44px;width:44px;min-width:44px;max-width:44px;height:44px;min-height:44px;aspect-ratio:1}
body :is(#wo-item-form,#wo-date-form) .wo-colours>button[aria-pressed=true]:after{top:50%;left:50%;transform:translate(-50%,-50%)}
body .wo-preview-section{scroll-margin-block:24px 112px}
/* Final owner review: distinguish creation from filters; balance footer actions. */
body .whats-on .wo-heading{background:var(--surface,#222421);border-radius:24px;padding:12px;margin:16px 0;gap:12px}
body .whats-on .wo-heading>p{margin:0;line-height:20px;color:var(--ink)}
body .whats-on .wo-heading>#wo-add{flex-basis:108px;width:108px}
body #modal :is(#wo-item-form,#wo-date-form) .wo-actions{grid-template-columns:minmax(0,1fr) 96px;align-items:center;gap:12px}
body #modal :is(#wo-item-form,#wo-date-form) .wo-actions>button{height:52px;min-height:52px;margin:0;align-self:center;display:flex;align-items:center;justify-content:center;line-height:24px;padding:14px 12px;font-size:16px;transform:none}
body #modal :is(#wo-item-form,#wo-date-form) .wo-actions>.sheet-back{border:0;border-radius:999px;background:transparent;text-decoration:none}
body #wo-date>.booking-month{margin-top:0}

/* Keep field spacing consistent inside grouped date/time rows. */
body #wo-item-form .calendar-form-row{display:grid;grid-template-columns:1fr;gap:24px}
body #wo-item-form label:not(.check):not(.wo-weekdays label){display:grid;gap:8px;margin:0;min-width:0}
body #wo-item-form label:not(.check):not(.wo-weekdays label)>:is(input,textarea,select,.wo-select){margin:0}
body #wo-item-form .wo-select>select{margin:0}

body #wo-description-help{font-size:12px;line-height:18px;margin:0;color:var(--muted)}
body #wo-description-help.wo-description-overflow{color:var(--orange)}

/* Keyboard-safe layout shared by member, staff and owner forms. Keep the outer
   dialog as the scroll owner used by modal restoration and editor navigation. */
body.keyboard-open #modal,body.keyboard-open #modal.focused-sheet{
 top:calc(var(--visual-top,0px) + 12px);bottom:auto;margin:0 auto;
 max-height:calc(var(--visual-height,100dvh) - 24px);
 overflow-y:auto;scroll-padding-block:16px;overscroll-behavior:contain;
}
body.keyboard-open #modal.page-sheet{
 top:var(--visual-top,0px);bottom:auto;
 height:var(--visual-height,100dvh);max-height:var(--visual-height,100dvh);
 border-top:0;border-bottom:0;
}
body.keyboard-open #modal .sheet-toolbar{flex-shrink:0}
body.keyboard-open #modal .sheet-content{flex-shrink:0}
body.keyboard-open .wo-actions{position:static}
body.keyboard-open :is(input,textarea,select){scroll-margin-block:16px}
body.keyboard-open textarea{max-height:calc(var(--visual-height,100dvh) - 48px);overflow-y:auto}
body.keyboard-open:not(.sheet-open){padding-bottom:var(--keyboard-offset,0px)}

/* Owner form actions follow the fields, including when native pickers are closed. */
body #modal :is(#wo-item-form,#wo-date-form) .wo-actions{position:static}
body .wo-picked-date{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end}
body #wo-date-rows{display:grid;gap:16px}
body #wo-picked-dates{display:grid;gap:16px}
body #wo-picked-dates[hidden]{display:none}

/* Full-page editors follow the visual viewport even when a browser resizes
   innerHeight with the keyboard, making keyboard-open detection unnecessary. */
body #modal.page-sheet{top:var(--visual-top,0px);bottom:auto}

/* Mobile item editing has one document scroller. Native keyboard focus and
   caret panning own its position; neither viewport offsets nor sheet locks do. */
body.document-editor-open{overflow:auto;padding-bottom:0}
body.document-editor-open>.shell{display:none}
body #modal.page-sheet.document-editor{
 position:static;inset:auto;height:auto;min-height:100svh;max-height:none;
 overflow:visible;margin:0 auto;transform:none;
}
body #modal.document-editor .sheet-content{overflow:visible;max-height:none}
body #modal.document-editor textarea{max-height:none}
body #wo-wording-fields{display:grid;gap:20px}
body #wo-wording-fields[hidden]{display:none}
body #wo-wording-fields label{display:grid;gap:8px;margin:0}
body #wo-wording-fields :is(input,textarea){margin:0}
body #wo-editor-date .booking-month-grid button[aria-pressed=true]{background:#f5f3eb;color:#121313;border-color:transparent;box-shadow:none;outline:0}

/* Drawing and acknowledgement stay in the existing receipt icon slot. */
body .reservation-progress{display:grid;place-items:center;position:relative;width:48px;height:48px;margin:0 auto 20px}
body .reservation-ring{position:absolute;inset:0;transform:rotate(-90deg)}
body .reservation-tick{display:grid;place-items:center;opacity:0}
body .reservation-acknowledged .reservation-tick{opacity:1}
body #modal.booking-sending .modal-close{visibility:hidden;pointer-events:none}
@media(prefers-reduced-motion:no-preference){
 .reservation-ring circle{stroke-dasharray:1;animation:lum-reservation-circle 1200ms 140ms ease-in-out both}
 .reservation-sending .reservation-ring{animation:lum-reservation-wait 1000ms 1340ms ease-in-out infinite alternate}
 .reservation-acknowledged .reservation-tick{animation:lum-reservation-tick 360ms cubic-bezier(.2,.8,.2,1) both}
 @keyframes lum-reservation-circle{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
 @keyframes lum-reservation-wait{to{opacity:.45}}
 @keyframes lum-reservation-tick{0%{opacity:0;transform:scale(.5)}70%{opacity:1;transform:scale(1.12)}100%{opacity:1;transform:scale(1)}}
}

/* Reserve the receipt copy space before acknowledgement, without moving the popup. */
body #modal.booking-sent-sheet .sheet-content>p:not(.sheet-feedback):not(.pending){min-height:2.7em}
body #modal.booking-sent-sheet .sheet-content.reservation-change>p:not(.sheet-feedback):not(.pending){min-height:5.4em}

/* Owner staff filters reuse the existing search-mode buttons and calendar. */
body .team-attendance .attendance-staff-filters{border:0;padding:0;margin:0 0 12px;min-width:0}
body .team-attendance .attendance-staff-filters legend{font-size:16px;font-weight:600;padding:0}
body .team-attendance .attendance-staff-filters p{margin:6px 0 12px}
body .team-attendance .attendance-staff-filters .search-mode{flex-wrap:wrap;margin:0}
body .team-attendance .attendance-staff-filters .search-mode button{flex:0 1 auto;max-width:100%;overflow-wrap:anywhere}
body .team-attendance .attendance-total-row{gap:12px;flex-wrap:wrap}
body .team-attendance .attendance-total-row strong{overflow-wrap:anywhere}

/* Small count overlays do not participate in calendar cell sizing. */
body .team-attendance [data-rota-date]{position:relative}
body .team-attendance .attendance-worked-count{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;box-sizing:border-box;padding:0 2px;border:1px solid var(--bg);border-radius:999px;background:var(--ink);color:var(--black);font-size:12px;line-height:14px;font-weight:600;pointer-events:none}