/* Maha Sauna POS. Brand: hiri red, cream, white. Coal for text only. */
:root{
  --hiri:#83200F; --hiri-dark:#6A190B; --cream:#FFF0E4; --white:#fff; --coal:#221E1F;
  --muted:#6F625C; --line:#EBD9CA; --tint:#F7E2D2; --ok:#2F6B3F;
  --display:"GFS Artemisia","Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Noto Serif Sinhala","Sinhala MN","Noto Sans Sinhala",serif;
  --body:"Helvetica Neue",Helvetica,Arial,"Noto Sans Sinhala","Sinhala Sangam MN","Iskoola Pota",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--coal);font:16px/1.45 var(--body);-webkit-tap-highlight-color:transparent}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer;touch-action:manipulation}
h1,h2,h3{font-family:var(--display);font-weight:400;margin:0;line-height:1.1;text-wrap:balance}
h1{font-size:34px} h2{font-size:28px} h3{font-size:19px}
.eyebrow{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--hiri);font-weight:600}
.lkr{font-size:max(10.5px,.5em);letter-spacing:.08em;text-transform:uppercase;font-family:var(--body);font-weight:600;opacity:.75;margin-right:.3em}
.num{font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
:focus-visible{outline:2px solid var(--hiri);outline-offset:2px}

.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:20px;padding:10px 24px;background:var(--white);border-bottom:1px solid var(--line)}
.brand{display:flex;flex-direction:column;text-decoration:none;line-height:1.1}
.brand-name{font-family:var(--display);font-size:22px;color:var(--hiri)}
.tabs{display:flex;gap:4px;flex:1;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{border:0;background:none;padding:10px 16px;border-radius:999px;white-space:nowrap;color:var(--muted);font-weight:500}
.tabs button.on{background:var(--cream);color:var(--hiri)}
.lang{border:1px solid var(--line);background:var(--white);color:var(--hiri);height:40px;padding:0 14px;border-radius:999px;font-size:14px;font-weight:600;white-space:nowrap}
.login-card .lang{position:absolute;top:22px;right:22px}
.login-card{position:relative}
.live{display:flex;align-items:center;gap:8px;padding:4px;border-radius:999px;background:var(--cream);white-space:nowrap}
.live button{width:44px;height:44px;border-radius:50%;border:0;background:var(--hiri);color:var(--cream);font-size:24px;line-height:1}
.live button:active{transform:scale(.92)}
.live button:disabled{opacity:.3}
.live b{font-family:var(--display);font-size:22px;font-weight:400;color:var(--hiri);font-variant-numeric:tabular-nums}
.live span{font-size:13px;color:var(--muted)}
@keyframes pulse{50%{opacity:.35}}

main{max-width:1440px;margin:0 auto;padding:24px}
.sell{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:24px;align-items:start}
.group{margin-bottom:26px}
.group>.eyebrow{display:block;margin-bottom:10px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.tile{position:relative;display:flex;flex-direction:column;gap:4px;min-height:118px;padding:16px;text-align:left;background:var(--white);border:1px solid var(--line);border-radius:18px;transition:transform .12s,border-color .12s}
.tile:hover{border-color:var(--hiri)}
.tile:active{transform:scale(.98)}
.tile h3{padding-right:28px}
.tile small{color:var(--muted);font-size:13px}
.tile .price{margin-top:auto;font-family:var(--display);font-size:22px;color:var(--hiri)}
.tile .price.tbc{font-family:var(--body);font-size:13px;color:var(--muted)}
.tile .badge{position:absolute;top:12px;right:12px;min-width:26px;height:26px;padding:0 7px;border-radius:13px;background:var(--hiri);color:var(--cream);font-size:13px;font-weight:600;display:grid;place-items:center}
.tile.feature{background:var(--hiri);border-color:var(--hiri);color:var(--cream);grid-column:span 2;min-height:132px}
.tile.feature h3{font-size:26px}
.tile.feature small{color:#F3CDBB}
.tile.feature .price{color:var(--cream);font-size:28px}
.tile.feature .badge{background:var(--cream);color:var(--hiri)}

.card{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:20px}
.ticket{position:sticky;top:84px;display:flex;flex-direction:column;gap:16px}
.ticket-head{display:flex;justify-content:space-between;align-items:baseline}
.link{border:0;background:none;padding:6px 0;color:var(--hiri);text-decoration:underline;text-underline-offset:3px;font-size:14px}
.lines{list-style:none;margin:0;padding:0}
.lines li{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:12px 0;border-top:1px solid var(--line)}
.lines li:first-child{border-top:0;padding-top:0}
.lines .nm{font-weight:500}
.lines .off{grid-column:1/-1;font-size:13px;color:var(--ok)}
.step{justify-self:start;display:inline-flex;align-items:center;gap:2px;background:var(--cream);border-radius:999px}
.step button{width:40px;height:40px;border:0;background:none;font-size:20px;color:var(--hiri);border-radius:50%}
.step span{min-width:22px;text-align:center;font-variant-numeric:tabular-nums}
.empty{padding:26px 8px;text-align:center;color:var(--muted)}
.field{display:flex;flex-direction:column;gap:5px}
.field label,.login-card label{font-size:13px;color:var(--muted)}
input[type=text],input[type=tel],input[type=number],input[type=password],input[type=search],input[type=email]{width:100%;height:46px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:var(--white);font-size:16px}
input:focus{outline:2px solid var(--hiri);outline-offset:0;border-color:var(--hiri)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.suggest{display:flex;flex-direction:column;gap:6px}
.suggest button{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--cream);text-align:left}
.guest-chip{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:var(--cream)}
.tag{display:inline-block;padding:3px 9px;border-radius:999px;background:var(--tint);color:var(--hiri);font-size:12px;font-weight:600}
.seg{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.seg button{height:46px;border:1px solid var(--line);border-radius:12px;background:var(--white);font-size:14px}
.seg button.on{background:var(--hiri);border-color:var(--hiri);color:var(--cream)}
.check{display:flex;align-items:center;gap:10px;font-size:15px}
.check input{width:22px;height:22px;accent-color:var(--hiri)}
.sum{display:flex;justify-content:space-between;align-items:baseline}
.sum.total{font-family:var(--display);font-size:30px;color:var(--hiri);padding-top:10px;border-top:1px solid var(--line)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:999px;border:1px solid var(--hiri);background:none;color:var(--hiri);font-weight:600;white-space:nowrap}
.btn.primary{background:var(--hiri);color:var(--cream)}
.btn.primary:hover{background:var(--hiri-dark)}
.btn.big{height:58px;font-size:18px;width:100%}
.btn.small{height:40px;padding:0 16px;font-size:14px}
.btn:disabled{opacity:.4;cursor:not-allowed}
.done{text-align:center;display:flex;flex-direction:column;gap:14px;align-items:center}
.done .tick{width:56px;height:56px;border-radius:50%;background:var(--hiri);color:var(--cream);display:grid;place-items:center;font-size:28px}

.seats{display:grid;grid-template-columns:repeat(var(--n),1fr);gap:8px;align-items:end;margin:6px 0 4px}
.seat{border:0;background:none;padding:0;border-radius:16px;transition:transform .15s}
.seat:active{transform:scale(.92)}
.seat svg{display:block;width:100%;height:auto;max-height:150px}
.seat .b{fill:var(--tint);transition:fill .3s}
.seat .k{fill:var(--white)}
.seat.in .b{fill:var(--hiri)}
.seat.in{animation:hop .5s cubic-bezier(.2,1.5,.4,1)}
@keyframes hop{0%{transform:translateY(-12%)}100%{transform:none}}
.tapbar{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.tapbar .btn{height:72px;font-size:20px}
.count-line{font-family:var(--display);font-size:30px;text-align:center;margin:14px 0 0}
.count-line b{font-weight:400;color:var(--hiri);font-size:44px}
.seat span{display:block;font-size:12px;line-height:1.2;height:15px;margin-top:4px;color:var(--coal);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sheet{border:1px solid var(--line);border-radius:26px;padding:26px;width:min(440px,calc(100vw - 24px));background:var(--white);color:var(--coal)}
.sheet::backdrop{background:rgba(131,32,15,.28)}
.sheet form{display:flex;flex-direction:column;gap:14px}
.sheet .step{align-self:flex-start}
.sheet .seg button{font-size:13px;padding:0 4px}
.tag.free{background:var(--hiri);color:var(--cream);margin-left:6px}
.seat.kind .b{opacity:.55}
.sheet-foot{display:flex;justify-content:space-between}
.rows .namebtn{border:0;background:none;padding:0;font-weight:700;text-align:left;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.page-head .actions{display:flex;gap:10px;flex-wrap:wrap}
.rows{list-style:none;margin:0;padding:0}
.rows li{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--line)}
.rows li:first-child{border-top:0}
.rows .grow{flex:1;min-width:0}
.rows .sub{font-size:13px;color:var(--muted)}
.rows .void{opacity:.45;text-decoration:line-through}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:18px}
.stat{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:16px}
.stat b{display:block;font-family:var(--display);font-weight:400;font-size:28px;color:var(--hiri);font-variant-numeric:tabular-nums}
.stat.hero{background:var(--hiri);border-color:var(--hiri);color:var(--cream)}
.stat.hero b,.stat.hero .eyebrow{color:var(--cream)}
.bar{height:6px;border-radius:3px;background:var(--tint);overflow:hidden;margin-top:6px;width:120px}
.bar i{display:block;height:100%;background:var(--hiri)}
.bar.late i{background:#C2571A}
.narrow{max-width:760px}
.bk-round{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:22px 4px 8px}
.bk-round:first-of-type{margin-top:0}
.bk-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.paidby{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px}
.tag.ok{background:#DDEBDD;color:var(--ok)}
.tag.wait{background:#FBE7C6;color:#7A4A00}
.bk .sub .tag{margin-left:6px}
.form{display:flex;flex-direction:column;gap:18px;max-width:420px}
.hint{font-size:13px;color:var(--muted);margin:0}

.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);padding:12px 20px;border-radius:999px;background:var(--hiri);color:var(--cream);opacity:0;pointer-events:none;transition:.2s;z-index:50;max-width:90vw;text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
.login{position:fixed;inset:0;z-index:60;background:var(--cream);display:grid;place-items:center;padding:20px}
.login[hidden]{display:none}
.login-card{width:min(380px,100%);background:var(--white);border:1px solid var(--line);border-radius:26px;padding:30px;display:flex;flex-direction:column;gap:12px}
.login-card h1{color:var(--hiri);margin-bottom:8px}
.login-card input{height:52px;font-size:18px}
.login-card #pin{letter-spacing:.3em;text-align:center;font-size:22px}
.setup-hint{margin:0;padding:12px 14px;border-radius:14px;background:var(--cream);font-size:14px;line-height:1.45}
.err{color:var(--hiri);font-size:14px;min-height:20px;margin:0}
.paybar{display:none}

@media (max-width:980px){
  .sell{grid-template-columns:1fr}
  .ticket{position:static}
}
@media (max-width:640px){
  .top{flex-wrap:wrap;gap:8px 12px;padding:10px 16px}
  .brand{flex:1}
  .tabs{order:3;flex-basis:100%;margin:0 -16px;padding:0 12px}
  main{padding:16px 16px 96px}
  h2{font-size:24px}
  .tiles{grid-template-columns:1fr 1fr;gap:10px}
  .tile{padding:14px;min-height:112px}
  .tile h3{font-size:17px}
  .seg{grid-template-columns:1fr 1fr}
  .paybar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--hiri);color:var(--cream)}
  .paybar[hidden]{display:none}
  .paybar b{font-family:var(--display);font-weight:400;font-size:22px}
  .paybar button{height:44px;padding:0 20px;border-radius:999px;border:1px solid var(--cream);background:var(--cream);color:var(--hiri);font-weight:600}
  .rows li{flex-wrap:wrap}
  .bk-actions{justify-content:flex-start;width:100%}
  .lang{height:36px;padding:0 10px;font-size:13px}
  .live button{width:40px;height:40px}
  .seats{gap:3px}
  .tapbar{gap:8px}.tapbar .btn{font-size:15px;padding:0 6px;height:64px;min-width:0}
  .count-line{font-size:22px}.count-line b{font-size:34px}
  .rows .bar{display:none}
  .toast{bottom:84px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Sinhala: no tracking, a little more line height */
html[lang=si] .eyebrow{letter-spacing:0;font-size:13px}
html[lang=si] body{line-height:1.6}
html[lang=si] h1,html[lang=si] h2,html[lang=si] h3{line-height:1.35}
html[lang=si] .tile.feature h3{font-size:24px}

/* discount and freebies on the ticket */
.chip{display:inline-flex;align-items:center;justify-content:center;gap:2px;height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--coal);font-size:14px;font-weight:600;white-space:nowrap;transition:background .15s,border-color .15s,color .15s,transform .12s}
.chip:hover{border-color:var(--hiri);color:var(--hiri)}
.chip:active{transform:scale(.96)}
.chip.on{background:var(--hiri);border-color:var(--hiri);color:var(--cream)}
.chip.gift{justify-self:end;height:36px;font-size:13px;color:var(--muted)}
.chip.gift.on{background:var(--ok);border-color:var(--ok);color:#fff}
.disc{margin:14px 0;padding:14px;border-radius:16px;background:var(--cream);display:grid;gap:10px}
.disc-head{display:flex;justify-content:space-between;align-items:center;min-height:24px}
.disc-head .link{padding:0}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip.pct{padding:0 12px 0 4px;color:var(--muted)}
.chip.pct input{width:58px;height:32px;padding:0 8px;border:0;border-radius:999px;background:transparent;font-size:14px;font-weight:600;text-align:right;color:inherit;-moz-appearance:textfield}
.chip.pct input::-webkit-outer-spin-button,.chip.pct input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.chip.pct input:focus{outline:0}
.chip.pct:focus-within{border-color:var(--hiri);color:var(--hiri)}
.chip.pct.on input::placeholder{color:var(--cream)}
.disc .field{margin:0}
.rows .deal{color:var(--ok);font-weight:600}

/* members dashboard, pass QR */
.btn.small svg{flex:none}
.btn.wa{border-color:#1F8F4E;color:#1F8F4E}
.btn.wa:hover{background:#1F8F4E;color:#fff}
a.btn{text-decoration:none}
.tag.plan{margin-left:6px}
.tag.deal{background:#DDEBDD;color:var(--ok);margin-left:6px}
.tag.off{background:#EFE7E1;color:var(--muted)}
.tag.in{background:var(--hiri);color:var(--cream)}
.rows b + .tag,.rows .tag + .tag{margin-left:6px}
.rows .plans{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 4px}
.rows .plans .tag{margin-left:0}
.mem-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.mem-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;align-items:start;margin-bottom:8px}
.mem-h{font-size:22px;margin:18px 0 12px;display:flex;align-items:baseline;gap:10px}
.mem-h .muted{font-family:var(--body);font-size:14px}
.mem-tools{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;margin-bottom:12px}
.mem-tools input{max-width:300px}
.rows.mem li:hover{background:linear-gradient(90deg,transparent,rgba(131,32,15,.03),transparent)}
.done-pass{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:2px 0 6px}
@media (max-width:900px){.mem-grid{grid-template-columns:1fr}.mem-tools input{max-width:none}.mem-actions{justify-content:flex-start;width:100%}}

textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--white);font:inherit;font-size:16px;resize:vertical}
textarea:focus{outline:2px solid var(--hiri);outline-offset:0;border-color:var(--hiri)}

/* guest details, waiver, pass orders */
.more-guest{margin-top:10px}
.more-guest[hidden]{display:none}
.chip-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px}
.guest-chip .chip.gift{height:30px;font-size:12.5px;justify-self:auto;color:#7A4A00;background:#FBE7C6;border-color:#FBE7C6}
input[type=date]{width:100%;height:46px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:var(--white);font:inherit;font-size:16px}
.mem-actions .link{align-self:center}

/* who is signed in */
.whoami{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px 0 12px;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--coal);font-size:14px;font-weight:600;white-space:nowrap;max-width:180px}
.whoami #whoName{overflow:hidden;text-overflow:ellipsis}
.whoami .dot{width:8px;height:8px;border-radius:50%;background:var(--ok);flex:none}
.whoami.admin .dot{background:var(--hiri)}
.whoami[hidden]{display:none}
.pwbox{border-top:1px solid var(--line);padding-top:12px}
.pwbox summary{cursor:pointer;color:var(--hiri);font-weight:600;margin-bottom:10px}
.pwbox[open]{display:flex;flex-direction:column;gap:12px}
.by{color:var(--muted);font-size:12px;font-weight:600}
.by::before{content:" · "}
.tag.desk{background:#EFE7E1;color:var(--coal)}

/* reserve at the desk */
.res{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:24px;align-items:start}
.res-step{margin-bottom:22px}
.res-step > .eyebrow{display:block;margin-bottom:10px}
.step-n{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--hiri);color:var(--cream);font-size:12px;margin-right:8px;letter-spacing:0}
.mode{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px}
.mode button{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:20px;background:var(--white);text-align:left;transition:border-color .15s,transform .12s}
.mode button:active{transform:scale(.98)}
.mode button.on{border-color:var(--hiri);background:var(--hiri);color:var(--cream)}
.mode svg{width:38px;height:38px;flex:none}
.mode b{display:block;font-family:var(--display);font-weight:400;font-size:22px;line-height:1.1}
.mode small{opacity:.75;font-size:13px}
.days{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.days input[type=date]{height:40px;width:auto;border-radius:999px;padding:0 14px;font-size:14px}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.slot{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:var(--white);text-align:left;transition:border-color .15s,transform .12s}
.slot b{font-family:var(--display);font-weight:400;font-size:22px;line-height:1;font-variant-numeric:tabular-nums}
.slot small{font-size:12px;color:var(--muted)}
.slot:hover:not(:disabled){border-color:var(--hiri)}
.slot:active:not(:disabled){transform:scale(.97)}
.slot.on{background:var(--hiri);border-color:var(--hiri);color:var(--cream)}
.slot.on small{color:#F3CDBB}
.slot:disabled{opacity:.42;cursor:not-allowed;background:transparent}
.slot .bar{width:100%;margin-top:6px;height:4px}
.treats{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.treat{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:var(--white);text-align:left}
.treat b{font-weight:600;font-size:15px;line-height:1.25}
.treat small{color:var(--muted);font-size:13px}
.treat.on{background:var(--hiri);border-color:var(--hiri);color:var(--cream)}
.treat.on small{color:#F3CDBB}
.res-summary{position:sticky;top:84px;display:flex;flex-direction:column;gap:14px}
.res-line{display:flex;justify-content:space-between;gap:12px;font-size:15px}
.res-line span:first-child{color:var(--muted)}
.res-done{text-align:center;display:flex;flex-direction:column;gap:12px;align-items:center}
.res-done .tick{width:56px;height:56px;border-radius:50%;background:var(--hiri);color:var(--cream);display:grid;place-items:center;font-size:28px;animation:pop .45s cubic-bezier(.2,1.5,.4,1)}
.res-done .code{font-family:var(--display);font-size:30px;letter-spacing:.12em;color:var(--hiri)}
@keyframes pop{0%{transform:scale(.4);opacity:0}100%{transform:none;opacity:1}}
.page-actions{display:flex;gap:10px;flex-wrap:wrap}
.backlink{border:0;background:none;padding:0;color:var(--hiri);font-weight:600;font-size:14px;margin-bottom:6px}

/* today: by person and activity */
.staff-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin-bottom:18px}
.staff-card{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:12px 14px}
.staff-card b{display:block;font-weight:600}
.staff-card .num{font-family:var(--display);font-size:22px;color:var(--hiri)}
.today-tools{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:20px 0 10px}
.today-tools input[type=date]{height:40px;width:auto;border-radius:999px;padding:0 14px;font-size:14px}
.act{list-style:none;margin:0;padding:0}
.act li{display:grid;grid-template-columns:70px 130px 1fr;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:14px;align-items:baseline}
.act li:first-child{border-top:0}
.act .t{color:var(--muted);font-variant-numeric:tabular-nums}
.act .w{font-weight:600}
.act .d{min-width:0;overflow-wrap:anywhere}
.act .d b{font-weight:600;color:var(--hiri)}
.staff-list li{flex-wrap:wrap}
.staff-add{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.staff-add select{height:46px;border:1px solid var(--line);border-radius:12px;background:var(--white);padding:0 12px;font-size:16px}
@media (max-width:980px){.res{grid-template-columns:1fr}.res-summary{position:static}}
@media (max-width:640px){
  .mode b{font-size:19px}.mode svg{width:30px;height:30px}.mode button{padding:12px 14px;gap:10px}
  .slots{grid-template-columns:repeat(3,1fr)}
  .act li{grid-template-columns:58px 1fr;gap:4px 10px}.act .d{grid-column:1/-1}
  .staff-add{grid-template-columns:1fr}
  .whoami{height:36px;width:36px;padding:0;justify-content:center;font-size:14px}
  .whoami #whoName,.whoami .dot{display:none}
  .whoami::after{content:attr(data-initial);color:var(--hiri)}
  #liveLabel{display:none}
}
button.staff-card{text-align:left;cursor:pointer;font:inherit;color:inherit;transition:border-color .15s}
button.staff-card:hover,button.staff-card.on{border-color:var(--hiri);box-shadow:inset 0 0 0 1px var(--hiri)}

/* log out, always in reach */
.logout{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--hiri);font-size:14px;font-weight:600;white-space:nowrap}
.logout:hover{border-color:var(--hiri)}
.logout[hidden]{display:none}

/* tablets: the tabs get their own full row so all seven fit, and the ticket sits beside the items */
@media (min-width:641px) and (max-width:1180px){
  .top{flex-wrap:wrap;row-gap:8px;padding-bottom:0}
  .brand{margin-right:auto}
  .tabs{order:3;flex-basis:100%;margin:0 -24px;padding:0 16px 6px;justify-content:space-between}
  .tabs button{flex:1 1 auto;padding:12px 10px;font-size:16px}
}
@media (min-width:700px) and (max-width:980px){
  .sell{grid-template-columns:minmax(0,1fr) 330px;gap:18px}
  .ticket{position:sticky;top:132px;max-height:calc(100vh - 150px);overflow:auto}
  .tiles{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
  .tile.feature{grid-column:1/-1}
  .paybar{display:none!important}
  .res-summary{position:static}
}
@media (hover:none) and (pointer:coarse){
  .tabs button,.chip,.btn.small,.link{min-height:44px}
  .link{display:inline-flex;align-items:center}
}
@media (max-width:640px){
  .logout{width:36px;height:36px;padding:0;justify-content:center}
  .logout span{display:none}
}
@media (min-width:641px) and (max-width:1180px){
  .ticket,.res-summary{top:136px}
  .ticket{max-height:calc(100vh - 150px);overflow:auto;overscroll-behavior:contain}
}

/* sign in on the reception tablet: tap your name, type your PIN */
.tiles-card{width:min(560px,100%)}
.who-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:6px}
.who-tile{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 10px;border:1px solid var(--line);border-radius:20px;background:var(--white);font-weight:600;font-size:16px;color:var(--coal);transition:border-color .15s,transform .12s}
.who-tile:hover{border-color:var(--hiri)}
.who-tile:active{transform:scale(.97)}
.who-tile .av{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--hiri);color:var(--cream);font-family:var(--display);font-size:26px}
.who-tile small{font-weight:500;font-size:12.5px;color:var(--muted)}
.pinpad{display:flex;flex-direction:column;align-items:center;gap:10px}
.pin-name{font-family:var(--display);font-size:26px;color:var(--hiri);margin:4px 0 0}
.pin-dots{display:flex;gap:16px;margin:6px 0}
.pin-dots i{width:16px;height:16px;border-radius:50%;border:2px solid var(--hiri);transition:background .12s}
.pin-dots i.on{background:var(--hiri)}
.pin-dots.shake{animation:shake .35s}
@keyframes shake{25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
.keys{display:grid;grid-template-columns:repeat(3,76px);gap:12px}
.keys button{height:76px;border-radius:50%;border:1px solid var(--line);background:var(--white);font-family:var(--display);font-size:30px;color:var(--coal)}
.keys button:active{background:var(--cream);transform:scale(.96)}
.keys button.soft{border-color:transparent;background:transparent;color:var(--muted);font-family:var(--body);font-size:22px}
.back-tiles{font-size:14px;order:99}
.login-card .link{align-self:center}
@media (prefers-reduced-motion:reduce){.pin-dots.shake{animation:none}}
.login-card[hidden]{display:none}
.more-login summary{cursor:pointer;color:var(--hiri);font-weight:600;font-size:14px}
[hidden]{display:none!important}

/* Packages (admins): the facts of each pass in a row of small labelled values */
.pk-facts{display:flex;flex-wrap:wrap;gap:6px 22px;margin:8px 0 4px}
.pk-facts span{display:flex;flex-direction:column;min-width:0}
.pk-facts small{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.pk-facts b{font-weight:600;font-size:14.5px;font-variant-numeric:tabular-nums}
.pk .grow > b{margin-right:6px}
.pk .tag{margin-right:4px}
.pk-contact span{overflow-wrap:anywhere}
@media (max-width:640px){.pk-facts{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}}
@media (min-width:641px) and (max-width:1440px){.top{gap:12px}.tabs button{padding:10px 9px}}

/* ---------- help: header button, tour, help page ---------- */
.helpbtn{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--hiri);font-size:14px;font-weight:600;white-space:nowrap}
.helpbtn:hover{border-color:var(--hiri)}
.helpbtn[hidden]{display:none}
@media (max-width:640px){.helpbtn{width:36px;height:36px;padding:0;justify-content:center}.helpbtn span{display:none}}
.tour-shade{position:fixed;inset:0;z-index:90;display:none}
.tour-ring{position:fixed;z-index:91;border-radius:18px;box-shadow:0 0 0 3px var(--hiri),0 0 0 9999px rgba(34,30,31,.72);pointer-events:none;display:none;transition:left .3s ease,top .3s ease,width .3s ease,height .3s ease}
.tour-ring.none{box-shadow:0 0 0 9999px rgba(34,30,31,.72)}
.tour-card{position:fixed;z-index:92;width:min(400px,calc(100vw - 24px));background:var(--white);border-radius:22px;padding:22px 22px 18px;box-shadow:0 18px 50px rgba(34,30,31,.35);display:none;transition:left .3s ease,top .3s ease}
body.touring .tour-shade,body.touring .tour-ring,body.touring .tour-card{display:block}
.tour-card.center{left:50%!important;top:50%!important;transform:translate(-50%,-50%);width:min(460px,calc(100vw - 24px))}
.tour-card.dock-bottom,.tour-card.dock-top{left:12px!important;right:12px;width:auto}
.tour-card.dock-bottom{top:auto!important;bottom:calc(12px + env(safe-area-inset-bottom))}
.tour-card.dock-top{top:12px!important}
.tour-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.tour-top .link{font-size:15px}
.tour-card h2{font-size:26px;color:var(--hiri)}
.tour-card p{font-size:18px;line-height:1.5;margin:10px 0 14px}
.tour-dots{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:16px}
.tour-dots i{width:8px;height:8px;border-radius:50%;background:var(--line)}
.tour-dots i.past{background:var(--tint)}
.tour-dots i.on{background:var(--hiri);width:22px;border-radius:5px}
.tour-nav{display:flex;gap:10px;justify-content:flex-end}
.tour-nav .btn{min-height:52px;padding:0 24px;font-size:17px}
.tour-nav .btn[hidden]{display:none}
.tour-nav .btn.primary{flex:1;max-width:220px}
.help{max-width:1100px;margin:0 auto}
.help-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:6px 0 20px;background:var(--hiri);color:var(--cream);border:0}
.help-hero h3{font-size:24px}
.help-hero p{color:var(--cream);opacity:.85;margin:6px 0 0;font-size:17px}
.help-hero .btn.primary{background:var(--cream);color:var(--hiri);border-color:var(--cream);white-space:nowrap}
.help-search{margin-bottom:18px}
.help-search input{font-size:18px;height:56px}
.help-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.help-card{display:flex;flex-direction:column;gap:12px}
.help-head{display:flex;align-items:center;gap:12px}
.help-head h3{font-size:22px;flex:1}
.help-ico{flex:none;width:46px;height:46px;border-radius:14px;background:var(--cream);color:var(--hiri);display:grid;place-items:center}
.help-card.admin .help-ico{background:var(--tint)}
.help-steps{margin:0;padding:0;list-style:none;counter-reset:s;display:grid;gap:9px;flex:1;align-content:start}
.help-steps li{counter-increment:s;display:grid;grid-template-columns:30px 1fr;gap:10px;font-size:17px;line-height:1.45}
.help-steps li::before{content:counter(s);width:28px;height:28px;border-radius:50%;background:var(--cream);color:var(--hiri);font-weight:700;font-size:15px;display:grid;place-items:center}
.help-card .btn{align-self:flex-start;min-height:48px;padding:0 22px}
.help-foot{text-align:center;margin:24px auto 0;max-width:620px;font-size:16px}
@media (max-width:640px){.help-hero{flex-direction:column;align-items:stretch}.help-grid{grid-template-columns:1fr}}
.help-hero .btn.big{width:auto;padding:0 30px}


/* settings: sub-tabs and the People page */
.settings-page{max-width:1320px}
.sub-tabs{display:flex;gap:8px;margin:0 0 22px;flex-wrap:wrap}
.sub-tabs button{height:48px;padding:0 22px;border-radius:999px;border:1px solid var(--line);background:var(--white);font-size:17px;font-weight:600;color:var(--muted)}
.sub-tabs button.on{background:var(--hiri);color:var(--cream);border-color:var(--hiri)}
[data-sp][hidden]{display:none!important}
.settings-page .form{max-width:760px}
.lead{font-size:18px;margin:0 0 18px;max-width:820px}
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.person{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:18px;display:flex;flex-direction:column;gap:12px}
.person.off{opacity:.6}
.ph{display:flex;align-items:center;gap:14px}.ph>div{min-width:0}
.av{flex:none;width:54px;height:54px;border-radius:50%;background:var(--hiri);color:var(--cream);display:grid;place-items:center;font-family:var(--display);font-size:24px}
.ph b{font-size:20px;display:block;line-height:1.2}.ph span{color:var(--muted);font-size:15px}
.ph .you{display:inline-block;margin-left:4px;font-size:12px;font-weight:700;color:var(--ok);background:#DDEBDD;border-radius:999px;padding:2px 8px;vertical-align:3px}
.st{display:flex;gap:8px;flex-wrap:wrap}.pill{padding:5px 12px;border-radius:999px;font-size:14px;font-weight:600}
.pill.adm{background:var(--hiri);color:var(--cream)}.pill.rec{background:var(--cream);color:var(--hiri)}.pill.okp{background:#DDEBDD;color:var(--ok)}.pill.waitp{background:#FBE7C9;color:#7a4f0e}.pill.offp{background:#EFE7E1;color:var(--muted)}
.person .btn{width:100%;height:50px;font-size:16px}
.addp{border:2px dashed var(--line);background:transparent;border-radius:22px;min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--hiri);font-size:19px;font-weight:600}
.addp:hover{border-color:var(--hiri)}
.addp i{font-style:normal;width:54px;height:54px;border-radius:50%;background:var(--hiri);color:var(--cream);display:grid;place-items:center;font-size:30px;line-height:1}
.person-dlg{max-width:540px}
.person-dlg form{display:flex;flex-direction:column;gap:16px}
.person-dlg h2{color:var(--hiri);font-size:30px}
.person-dlg .field input{height:56px;font-size:19px}
.choice{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.choice button{text-align:left;border:1.5px solid var(--line);border-radius:18px;padding:14px;background:var(--white)}
.choice button.on{border-color:var(--hiri);background:var(--cream)}
.choice button:disabled{opacity:.55;cursor:not-allowed}
.choice b{display:block;font-size:17px;color:var(--coal)}.choice span{font-size:14.5px;color:var(--muted)}
.pd-admin{display:flex;flex-direction:column;gap:10px;background:var(--cream);border-radius:18px;padding:14px}
.set-tablet{display:grid;gap:16px;max-width:760px}
.big-p{font-size:17px;margin:10px 0 14px}
@media (max-width:640px){.choice{grid-template-columns:1fr}.sub-tabs button{height:44px;padding:0 16px;font-size:15px}}
.sheet.person-dlg{width:min(540px,calc(100vw - 24px))}
.ph .av{color:var(--cream)}
.person-dlg .field label{font-size:16px;color:var(--muted)}

.dob{display:grid;grid-template-columns:.8fr 1.4fr 1fr;gap:8px}
.dob select{height:52px;border:1px solid var(--line);border-radius:12px;background:var(--white);padding:0 10px;font-size:17px;width:100%}
#guestForm .check{font-size:16px}

.big-select{height:56px;border:1px solid var(--line);border-radius:12px;background:var(--white);padding:0 12px;font-size:18px;width:100%}
.person-dlg input[type=date]{height:56px;font-size:18px}

.ratings-card{background:var(--cream);border:0;gap:12px}
.rt-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rt{background:var(--white);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:2px}
.rt small{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600}
.rt b{font-family:var(--display);font-weight:400;font-size:34px;color:var(--hiri)}.rt span{color:var(--muted)}
.rt .two{margin-top:8px}.rt input{height:44px}
.stripe-err{background:#FBE7C9;border-radius:14px;padding:12px 14px;color:#5c3a08;font-size:15.5px;margin:0 0 12px}.stripe-err b{display:block;margin-bottom:4px}
.link.danger{color:#b3261e}
/* partner codes */
.code-row{display:flex;gap:8px;margin-top:10px}
.code-row input{flex:1;min-width:0;height:40px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font:inherit;text-transform:uppercase;letter-spacing:.05em}
.code-on{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border:1.5px dashed var(--hiri);border-radius:12px;margin-top:6px}
.code-on b{letter-spacing:.06em}
.code-gift{background:#fff4d6;border-radius:10px;padding:10px 12px;font-weight:600;margin:0 0 8px}
.tag.code{background:#efe6ff;color:#4a2a8a}
.code-card .code-top{display:flex;align-items:center;gap:8px}
.code-card .code-name{font-size:18px;letter-spacing:.06em}
.code-card .code-what{margin:2px 0}
.code-card.off{opacity:.6}
/* booking rows: details keep a readable width, the buttons drop below when there are many */
.rows li.bk{flex-wrap:wrap}
.rows li.bk>.grow{flex:1 1 300px;min-width:260px}
.rows li.bk>.bk-actions{flex:0 1 auto;max-width:100%}
.tag.code{display:inline-block;border-radius:8px;white-space:normal}
.person-dlg select{height:56px;font-size:19px;border:1px solid var(--line);border-radius:12px;padding:0 12px;background:#fff;font-family:inherit;color:inherit}
/* closing for a while */
.btn.warn{border-color:#B3261E;color:#B3261E}
.closed-card{border:2px solid #B3261E;background:#FFF6F4;margin-bottom:14px}
.closed-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap}
.closed-head h3{margin:4px 0 2px;font-size:20px}
.closed-head .eyebrow{color:#B3261E}
.closed-sub{margin:12px 0 0;font-weight:600}
/* Today: tap a way of paying to list only those sales */
.stat.pay-tile{font:inherit;text-align:left;color:inherit;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.stat.pay-tile:hover{border-color:var(--hiri)}
.stat.pay-tile.on{border-color:var(--hiri);box-shadow:inset 0 0 0 2px var(--hiri)}
.mem-h .link{font-size:14px;margin-left:6px}
.quick-row{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:8px 0 4px}
.quick-row .btn{min-height:56px;font-size:17px}
.send-list{list-style:none;margin:10px 0;padding:0;display:grid;gap:8px}
.send-list li{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--white)}
.send-list li.done{opacity:.55}
.send-list li.done b::after{content:" ✓";color:#2f7a3d}
.send-list .grow{flex:1;min-width:0}
.send-list li{text-align:left}

/* Sell: guest details always on show, waiver tick that stands out (20 Oct 2026) */
.guest-box{display:flex;flex-direction:column;gap:10px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--cream)}
.guest-box .more-guest{margin-top:0}
.guest-box input[type=email]{width:100%;height:46px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:var(--white);font-size:16px}
.guest-box .dob select{height:46px;font-size:15px}
.waiver-tick{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;border:2px solid #E7B866;background:#FBE7C6;color:#5C3800;cursor:pointer}
.waiver-tick input{width:26px;height:26px;flex:none;accent-color:var(--ok)}
.waiver-tick span{display:flex;flex-direction:column;line-height:1.25}
.waiver-tick small{font-size:13px;opacity:.85}
.waiver-tick.on{border-color:#9CC4A3;background:#DDEBDD;color:var(--ok)}
.guest-box .two{align-items:end}
.guest-box .need{color:var(--hiri);font-weight:600}

/* the waiver on the tablet, for the guest to read */
.btn.show-waiver{width:100%;height:44px;font-size:15px}
.waiver-sheet{width:min(640px,calc(100vw - 24px))}
.waiver-sheet[open]{display:flex;flex-direction:column;gap:14px;max-height:calc(100dvh - 40px)}
.waiver-sheet h2{font-size:30px;color:var(--hiri)}
.waiver-text{overflow:auto;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--cream);font-size:18px;line-height:1.55}
.waiver-text p{margin:0 0 12px}.waiver-text p:last-child{margin:0}

/* ---------- smooth: tab switches, presses, sheets (20 Oct 2026) ---------- */
button,a,input,select,label,summary{touch-action:manipulation}
#main{transition:opacity .16s ease}
#main.stale{opacity:.55;pointer-events:none}
#main.enter{animation:viewIn .22s cubic-bezier(.2,.8,.3,1)}
@keyframes viewIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.view-wait{display:flex;justify-content:center;gap:8px;padding:90px 0;opacity:0;animation:waitIn .2s .15s forwards}
.view-wait i{width:9px;height:9px;border-radius:50%;background:var(--hiri);animation:waitDot 1s infinite ease-in-out}
.view-wait i:nth-child(2){animation-delay:.15s}.view-wait i:nth-child(3){animation-delay:.3s}
@keyframes waitIn{to{opacity:1}}
@keyframes waitDot{0%,80%,100%{transform:scale(.6);opacity:.35}40%{transform:none;opacity:1}}
.tabs button,.btn,.seg button,.lang,.whoami,.logout,.link,.who-tile,.keys button{transition:background-color .16s,color .16s,border-color .16s,box-shadow .16s,transform .1s,opacity .16s}
.tabs button:active,.btn:active,.seg button:active,.lang:active,.whoami:active,.logout:active{transform:scale(.96)}
@media (hover:hover){.tabs button:hover:not(.on){color:var(--hiri);background:rgba(131,32,15,.05)}.btn:not(.primary):hover{background:rgba(131,32,15,.06)}}
.working{opacity:.6;pointer-events:none;cursor:progress}
.btn.working{position:relative}
.btn.working::after{content:"";width:14px;height:14px;margin-left:4px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
dialog.sheet[open]{animation:sheetIn .22s cubic-bezier(.2,.8,.3,1)}
dialog.sheet[open]::backdrop{animation:fadeBg .22s ease}
@keyframes sheetIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@keyframes fadeBg{from{opacity:0}to{opacity:1}}
.toast{transition:opacity .2s,transform .25s cubic-bezier(.2,.8,.3,1)}
@media (prefers-reduced-motion:reduce){#main.enter,dialog.sheet[open],dialog.sheet[open]::backdrop,.view-wait,.view-wait i{animation:none!important;opacity:1}#main{transition:none}}

/* row actions: a few clear buttons, the rest in a ⋯ menu (20 Oct 2026) */
.mem-actions{gap:10px;align-items:center}
.mem-actions .btn.small{min-width:84px}
details.more{position:relative}
details.more summary{list-style:none;display:grid;place-items:center;width:44px;height:40px;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--hiri);font-size:20px;line-height:1;cursor:pointer;transition:background-color .16s,border-color .16s,transform .1s}
details.more summary::-webkit-details-marker{display:none}
details.more summary:active{transform:scale(.95)}
details.more[open] summary,details.more summary:hover{border-color:var(--hiri)}
.more-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:15;min-width:230px;padding:6px;background:var(--white);border:1px solid var(--line);border-radius:16px;box-shadow:0 14px 34px rgba(34,30,31,.16);display:flex;flex-direction:column;animation:sheetIn .16s cubic-bezier(.2,.8,.3,1)}
.more-menu a,.more-menu button{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 12px;border:0;border-radius:10px;background:none;color:var(--coal);font:inherit;font-size:15px;font-weight:500;text-align:left;text-decoration:none;cursor:pointer}
.more-menu a:hover,.more-menu button:hover{background:var(--cream);color:var(--hiri)}
.more-menu{min-width:250px}
.more-menu a,.more-menu button{white-space:nowrap}
/* tablet and phone: the buttons go under the person instead of squeezing them */
@media (max-width:900px){.rows.mem li{flex-wrap:wrap}.rows.mem li .grow{flex-basis:100%}.mem-actions{justify-content:flex-start;width:100%}}
/* "Other %" discount when chosen: white on red, like the other chips */
.chip.pct.on,.chip.pct.on input{color:var(--cream)!important;-webkit-text-fill-color:var(--cream)}
.chip.pct.on input::placeholder{color:rgba(255,240,228,.75)}

/* switched off (broken, repairs, sold out) */
.tile.off,.tile.off.feature{background:repeating-linear-gradient(135deg,var(--white) 0 12px,#F6EEE8 12px 24px);border:1px dashed var(--muted);color:var(--muted)}
.tile.off h3{color:var(--coal);opacity:.6;text-decoration:line-through;text-decoration-thickness:1px}
.tile.off.feature small{color:var(--muted)}
.tile .off-tag{margin-top:auto;font-size:13px;font-weight:600;color:var(--hiri)}
.off-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:22px;padding:12px 14px;border:1px dashed var(--line);border-radius:16px;font-size:14px}
.off-bar.has{background:#FFF4EC;border:1px solid var(--hiri)}
.sw-scroll{max-height:min(60vh,560px);overflow-y:auto;margin:6px -6px 10px;padding:0 6px}
.sw-scroll .eyebrow{display:block;margin-top:14px}
.sw-list{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.sw-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--white)}
.sw-row small{display:block;color:var(--muted);font-size:13px}
.sw-row.off{background:#FFF4EC;border-color:var(--hiri)}
.sw-row.off small{color:var(--hiri);font-weight:600}
.sw-row.open{border-color:var(--hiri)}
.sw-why{grid-column:1/-1;display:flex;flex-direction:column;gap:8px}
.sw-why .chips{display:flex;flex-wrap:wrap;gap:8px}
.sw-why input{height:44px;padding:0 12px;border:1px solid var(--line);border-radius:12px;font:inherit}
.sw-why .hint{margin:0}

/* close some hours: four choices, one can be a single treatment */
.seg.seg4 button{height:auto;min-height:46px;line-height:1.2;padding:6px 4px}
#clTreat{width:100%;height:48px;border:1px solid var(--line);border-radius:12px;background:var(--white);padding:0 12px;font-size:16px}
#clOne .hint{margin:6px 0 0}

/* typing a price (sauna, steam, magnesium on their own) */
.sheet.price-dlg{width:min(420px,calc(100vw - 24px))}
.price-dlg h2{margin:2px 0 6px}
.pd-field{display:flex;align-items:baseline;gap:10px;padding:14px 18px;border:2px solid var(--line);border-radius:20px;background:var(--cream,#FFF0E4);transition:border-color .15s,box-shadow .15s;cursor:text}
.pd-field:focus-within{border-color:var(--hiri);box-shadow:0 0 0 4px rgba(131,32,15,.12)}
.pd-cur{font-size:15px;font-weight:700;letter-spacing:.12em;color:var(--hiri)}
.pd-field input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-family:var(--display);font-size:44px;line-height:1.1;color:var(--coal);padding:0}
.pd-field input::placeholder{color:#D9C3B4}
.pd-hint{margin:-4px 0 0}
.pd-recent{display:flex;flex-direction:column;gap:8px}
.pd-recent .chips{display:flex;flex-wrap:wrap;gap:8px}
.pd-recent .chip{height:44px;padding:0 18px;font-size:16px}
.pd-actions{display:grid;grid-template-columns:1fr 2fr;gap:10px;margin-top:4px}
.pd-actions .btn{min-height:56px;font-size:17px}
.pd-actions .btn:disabled{opacity:.45}
.reprice{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;margin:-4px -10px;border:1px dashed var(--line);border-radius:999px;background:transparent;font:inherit;color:inherit}
.reprice:hover{border-color:var(--hiri);color:var(--hiri)}
.reprice svg{width:13px;height:13px;color:var(--hiri)}