/* signed-in pages and the shared parts of the locked gold set */
.topnav a.on,nav a.on{color:var(--ink);border-bottom:2px solid var(--g3)}
.chat{margin-top:8px}.chat p{margin:4px 0}.chat .mine{text-align:right}.chat [data-log]{max-height:220px;overflow:auto;padding:6px 0}
.betamark{margin:0 0 6px;text-align:center;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);opacity:.4}
.svcgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-bottom:22px}
.svc.card{padding:12px}.svcpic{display:block;width:100%;height:auto;aspect-ratio:8/5;object-fit:cover;border-radius:12px;margin:0 0 10px}
.svcl1,.svcl2{margin:0;line-height:1.35}.svcl1{display:flex;justify-content:space-between;gap:8px;font-size:17px}.svcprice{white-space:nowrap}.svcl2{font-size:14px;color:var(--soft);margin-top:2px}
/* Primary tabs (Services / List view / Map view and every tab row): the glass segmented control of the reference botton2.webp "Tabs" (owner 2026-10-29): a frosted capsule, the active segment a lighter frosted pill. Label 24K gold, engraved. Tokens come from app.css. */
.tabs{display:flex;gap:4px;width:max-content;max-width:100%;margin:0 0 22px;padding:5px;border-radius:20px;overflow-x:auto;scrollbar-width:none;background:var(--glass-fill);border:var(--glass-edge);box-shadow:var(--glass-lip),var(--glass-glow),var(--glass-shadow);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2)}
.tabs::-webkit-scrollbar{display:none}
.tabs a{flex:none;padding:10px 22px;border-radius:15px;border:1px solid transparent;font-weight:700;text-decoration:none;white-space:nowrap;color:var(--gold24);text-shadow:var(--engrave-gold);background:var(--glass-fill-tab)}
.tabs a[aria-selected=true]{background:var(--glass-fill-tab-on);border:var(--glass-edge);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 4px 12px -4px rgba(255,205,130,1),0 6px 14px -8px rgba(70,45,10,.5)}
@media(max-width:560px){.tabs a{padding:9px 16px}}
.lobbyhead{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between}
.zipbar{display:flex;gap:10px;align-items:flex-end;padding:10px 14px;margin:14px 0}.zipbar .field{margin:0;width:9em}.zipbar label{margin:0}
.tier{display:inline-block;padding:3px 12px;border-radius:999px;font-size:13px;font-weight:800;vertical-align:middle;box-shadow:inset 0 -2px 4px rgba(0,0,0,.25),2px 2px 6px var(--dk)}
.tier.silver{background:linear-gradient(180deg,#fafbfd,#c3c7d0 60%,#9a9fab)}.tier.gold{background:linear-gradient(180deg,var(--g1),var(--g3))}.tier.diamond{background:linear-gradient(180deg,#f4fdff,#8fe3ff 60%,#4fb6dd)}
.mapbox{height:calc(100vh - 230px);height:calc(100dvh - 230px);min-height:360px;padding:8px;border-radius:24px;overflow:hidden}
.maplegend{margin-top:12px}
.dot{display:inline-block;width:12px;height:12px;border-radius:50%;border:2px solid #fff;vertical-align:middle;margin:0 4px 0 12px}
.dot.tech{background:#1f6fe0}.dot.silver{background:#c3c7d0}.dot.gold{background:#e3a812}.dot.diamond{background:#8fe3ff}
fieldset{border:0;padding:0;margin:0 0 14px}legend{font-size:13px;font-weight:700;color:var(--soft);margin-bottom:6px}
.chk{display:inline-flex;align-items:center;gap:6px;margin:0 16px 8px 0;font-weight:600;font-size:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}@media(max-width:560px){.two{grid-template-columns:1fr}}
select.field,textarea.field{width:100%}
.btn.sm{padding:9px 16px;font-size:14px}
h3{margin:22px 0 10px;font-size:18px}
.thumb{display:block;max-width:96px;max-height:96px;border-radius:12px;object-fit:cover;margin:6px 0}
.docrow{padding:10px 0;border-top:1px solid rgba(110,70,15,.2)}
.code{font-size:1.4em;letter-spacing:.18em}
.weekrow{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;padding:8px 0;border-top:1px solid rgba(110,70,15,.2)}
.weekrow>b{width:100px}.weekrow .field{width:8.5em;margin:0}
.muted{color:var(--soft)}
/* The page of one service: the service card, then one card per technician with their next open times. */
.svclink{display:block;color:inherit;text-decoration:none}
.svchead{display:flex;gap:16px;align-items:center;margin:0 0 18px}.svchead .svcpic{width:min(40%,220px);margin:0}.svchead h1{margin:0 0 6px}
.techgrid{grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.techcard{padding:14px}.techcard .svcl1 a{text-decoration:none}.techcard .meta{font-size:13px;color:var(--soft)}
.slotlabel{margin:10px 0 6px;font-size:13px;font-weight:700;color:var(--soft)}
.slots{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.slot{display:inline-block;margin:0;cursor:pointer}.slot input{position:absolute;opacity:0;pointer-events:none}
.slot span{display:inline-block;padding:7px 12px;border-radius:999px;font-size:13px;font-weight:700;color:var(--ink);background:var(--glass-fill-field);border:var(--glass-edge);box-shadow:0 4px 8px -5px rgba(255,205,130,.95)}
.slot input:checked+span{background:var(--glass-fill-tab-on);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 0 0 2px #a86f0a}
.slot input:focus-visible+span{outline:2px solid #a86f0a}
.wherelabel{display:block;margin:0 0 8px}.wherelabel .field{margin:4px 0 0}
.techact{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.techmsg{min-height:1.2em;margin:8px 0 0;font-size:13px;color:#7a1f10}
.svchead .svcl2{justify-content:flex-start;gap:16px}
.slot span{white-space:nowrap}
.svchead{flex-wrap:wrap}.svchead .svcl2{flex-wrap:wrap}
/* Preferences: drop-downs instead of long lists (owner 2026-10-28). */
.drop{margin:0 0 16px}
.dropbtn{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px;border-radius:16px;cursor:pointer;font-weight:700;color:var(--ink);
background:var(--glass-fill-field);border:var(--glass-edge);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 8px 14px -8px rgba(255,205,130,.95),0 6px 12px -8px rgba(70,45,10,.5)}
.dropbtn::-webkit-details-marker{display:none}
.dropbtn::after{content:"";flex:none;width:9px;height:9px;border-right:2.5px solid var(--soft);border-bottom:2.5px solid var(--soft);transform:rotate(45deg);margin:-4px 2px 0 8px;transition:transform .2s}
.drop[open] .dropbtn::after{transform:rotate(-135deg);margin-top:4px}
.dropbtn b{margin-left:auto;font-weight:700;font-size:14px;color:var(--soft)}
.dropbody{display:flex;flex-wrap:wrap;gap:4px 18px;margin:10px 4px 0;padding:14px 16px;border-radius:16px;max-height:260px;overflow:auto;background:var(--glass-fill);border:var(--glass-edge);box-shadow:var(--glass-lip),0 12px 22px -12px rgba(70,45,10,.45)}
#addrbox[hidden]{display:none}
/* Orders: buttons sit on the right (owner 2026-10-28). */
.ordhead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px}.ordhead h3{margin:0}
.ordercard{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;align-items:start;margin:0 0 12px}
.ordercard>*{grid-column:1/-1}.ordercard>.ordermain{grid-column:1}.ordercard>.acts{grid-column:2;display:flex;gap:8px;justify-content:flex-end;align-items:center;flex-wrap:wrap}
.ordercard>.acts:empty{display:none}
/* Membership: Gold and Diamond have their own picture behind a glass panel (owner 2026-10-28). */
.tiercard{border-radius:22px;padding:14px;margin:0 0 4px;background:center/cover no-repeat;border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 14px 26px -12px rgba(70,45,10,.55)}
.tiercard.gold{background-image:url(/brand/tier-gold.webp)}.tiercard.diamond{background-image:url(/brand/tier-diamond.webp)}
.tiercard .cap{display:inline-block;max-width:100%;padding:10px 16px 12px;border-radius:16px;background:var(--glass-fill-cap);border:1px solid rgba(255,255,255,.85);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
.tiercard .cap{display:block}
/* two choices side by side (owner 2026-10-29): gold = points, silver = payment */
.duo{display:flex;gap:8px}.duo .btn{flex:1;text-align:center;white-space:nowrap}
.btn.silver{color:#2f3237;text-shadow:0 1px 0 rgba(255,255,255,.8);background:linear-gradient(180deg,#ffffff,#eef0f3 25%,#c4c8ce 55%,#8f949b 70%,#b9bdc3 88%,#dfe2e6)}
.tiercard .cap b{font-size:20px}.tiercard .cap p{margin:2px 0 8px;color:var(--ink)}
/* Points slider (liquid glass: a clear track that fills with gold and a glass thumb). */
.buy{max-width:520px}.buyread{font-size:18px;margin:0 0 8px}.buyread b{font-size:22px}.buyends{display:flex;justify-content:space-between;font-size:12px;color:var(--soft);margin:2px 4px 12px}
.glassrange{--pct:0%;-webkit-appearance:none;appearance:none;width:100%;height:30px;margin:0;background:transparent;cursor:pointer}
.glassrange::-webkit-slider-runnable-track{height:14px;border-radius:999px;border:1px solid rgba(255,255,255,.85);background:linear-gradient(90deg,#e2b23c var(--pct),rgba(255,255,255,.35) var(--pct));box-shadow:inset 0 2px 4px rgba(110,70,15,.35),0 1px 0 rgba(255,255,255,.7)}
.glassrange::-moz-range-track{height:14px;border-radius:999px;border:1px solid rgba(255,255,255,.85);background:rgba(255,255,255,.35);box-shadow:inset 0 2px 4px rgba(110,70,15,.35)}
.glassrange::-moz-range-progress{height:14px;border-radius:999px;background:#e2b23c}
.glassrange::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;margin-top:-9px;border-radius:50%;border:1px solid rgba(255,255,255,.95);background:radial-gradient(circle at 35% 28%,#fff,rgba(255,255,255,.55) 55%,rgba(255,240,200,.7));box-shadow:0 4px 10px rgba(70,45,10,.45),inset 0 1px 1px #fff}
.glassrange::-moz-range-thumb{width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.95);background:radial-gradient(circle at 35% 28%,#fff,rgba(255,255,255,.55) 55%,rgba(255,240,200,.7));box-shadow:0 4px 10px rgba(70,45,10,.45)}
.glassrange:focus-visible{outline:2px solid #a86f0a;outline-offset:3px;border-radius:999px}
.revlist{display:grid;gap:10px;margin:0 0 8px}.revcard{padding:12px 14px;border-radius:16px;background:var(--glass-fill);border:var(--glass-edge)}.revcard p{margin:0 0 4px}.revstars{color:var(--gold24);letter-spacing:2px}.revtop{display:flex;align-items:center;gap:6px}a.meta{text-decoration:none}

.narrow-620{max-width:620px;margin:24px auto}.narrow-720{max-width:720px;margin:24px auto}.refcode{font-size:22px;letter-spacing:2px}.qrbox{width:180px;margin:12px 0}

/* City and State of the billing address: one row at every width (the generic two-column row stacks on a phone). */
.cityst{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:12px}
/* App bars on a phone (owner 2026-10-29, protocol §01): on the home page, the lobby and a service's page the top bar is fixed with the service groups under it,
   and Services / List view / Map view are a fixed bottom tab bar (views nav.js appBars). The page's own rows of those links are for a wide screen. */
.appseg,.apptabs{display:none}
.kicker,.svcnext,.svcdots{display:none}
@media(max-width:760px){
:root{--bot:calc(62px + env(safe-area-inset-bottom))}
body.app>.bar{position:fixed;top:0;left:0;right:0;z-index:30;background:var(--glass-fill-strong);border-bottom:1px solid rgba(255,255,255,.7);box-shadow:0 8px 20px -14px rgba(60,35,5,.6);-webkit-backdrop-filter:var(--glass-blur-strong);backdrop-filter:var(--glass-blur-strong)}
body.app>main.wrap{padding-top:calc(var(--top,150px) + 10px);padding-bottom:calc(var(--bot) + 16px)}
body.app .appseg{display:block;padding:0 12px 8px}.appseg .seg{display:flex;width:100%;margin:0}.appseg .seg a{flex:1;text-align:center;padding:8px 6px}
body.app main .tabs,body.app main .seg,body.app main .lobbyhead h2{display:none}
body.app .apptabs{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;gap:6px;padding:6px 10px calc(6px + env(safe-area-inset-bottom));background:var(--glass-fill-strong);border-top:1px solid rgba(255,255,255,.8);box-shadow:0 -8px 20px -14px rgba(60,35,5,.6);-webkit-backdrop-filter:var(--glass-blur-strong);backdrop-filter:var(--glass-blur-strong)}
.apptabs a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;min-height:48px;padding:6px 4px;border-radius:16px;font-size:12px;font-weight:700;color:var(--soft);text-decoration:none}
.apptabs a[aria-current=page]{color:#3a2608;background:var(--glass-fill-tab-on);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 4px 12px -6px rgba(255,205,130,1)}
.apptabs .ico{width:22px;height:20px}body.app .apptabs{flex-wrap:wrap;row-gap:2px}.apptabs .prov{flex:0 0 100%;text-align:center}body.app footer .prov{display:none}
body.app .totop{bottom:calc(var(--bot) + 12px)}
/* the footer (copyright, the legal links) lives on the About page only; the technician door and About are in the sandwich menu */
footer .legalnav,footer .copy{display:none}body.about footer .legalnav,body.about footer .copy{display:flex}body.about footer .copy{display:block}
body.app footer{display:none}

/* Deck (owner 2026-10-29): between the two fixed bars, one row per screen (a category, or a technician), one card per screen; swipe left/right in a row,
   up/down between rows, one per swipe (scroll snap). Each card fills its screen: the photo edge to edge, a kicker ("Manicure · 2 / 6"), the name and price on a
   dark fade, share top right. Glass triangles show the ways (public/deck.js). On a wider screen the same markup is the plain grid. */
body.appdeck .svctop,body.appdeck main>p.muted,body.appdeck main>p:not([class]){display:none}
body.appdeck .svcdeck{position:fixed;top:var(--top,150px);bottom:var(--bot);left:0;right:0;z-index:5;margin:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scroll-snap-type:y mandatory;scrollbar-width:none}
body.appdeck .svcdeck::-webkit-scrollbar{display:none}
body.appdeck .lenpick{position:fixed;z-index:8;top:calc(var(--top,150px) + 16px);left:24px;margin:0;padding:6px 10px;border-radius:999px}
body.appdeck .lenpick legend{float:left;margin:0 6px 0 0;padding:0;font-size:13px}body.appdeck .lenpick select{width:auto;min-height:32px;padding:2px 8px;font-size:14px}
.svcdeck .svccat{position:relative;height:100%;scroll-snap-align:start;scroll-snap-stop:always;display:flex;flex-direction:column;padding:10px 0 4px}
.svcdeck .svccathead{display:none}
.svcdeck .svcgrid{flex:1;min-height:0;display:flex;gap:10px;margin:0;padding:0 12px;scroll-padding:0 12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.svcdeck .svcgrid::-webkit-scrollbar{display:none}
.svcdeck .svc{flex:0 0 100%;min-width:0;height:100%;padding:0;border-radius:28px;overflow:hidden;position:relative;scroll-snap-align:center;scroll-snap-stop:always;content-visibility:visible;
background:linear-gradient(160deg,#f6e3a4,#c99b36);box-shadow:0 18px 34px -14px rgba(60,35,5,.7),inset 0 0 0 1px rgba(255,255,255,.55);transition:transform .15s}
.svcdeck .svc:active{transform:scale(.985)}
.svcdeck .svc:has(.share[open]){overflow:visible}
.svcdeck .svclink{position:absolute;inset:0;display:block}
.svcdeck .svcpic{position:absolute;inset:0;width:100%;height:100%;margin:0;border-radius:0;object-fit:cover;aspect-ratio:auto}
.svcdeck .svcinfo{position:absolute;left:0;right:0;bottom:0;max-height:100%;overflow-y:auto;padding:80px 20px 20px;background:linear-gradient(180deg,rgba(25,15,2,0),rgba(25,15,2,.55) 40%,rgba(25,15,2,.85))}
/* the floating label: flush with the card's top-left corner (it takes the card's 28 px curve there), over the photo; it stops left of the up arrow in the middle of the top edge, so a long name such as Enhancements fits beside it, with the count under the name */
.svcdeck .kicker{display:inline-flex;flex-direction:column;align-items:flex-start;gap:1px;position:absolute;z-index:3;top:0;left:0;margin:0;max-width:calc(50vw - 37px);padding:11px 14px 10px 22px;font-size:16px;border-radius:28px 0 18px 0;border-top-color:transparent;border-left-color:transparent}
.glassfield .sub{font-size:13px;font-weight:600;opacity:.85;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* contrast-adaptive (public/glass-tone.js): dark text over a light picture, white text over a dark one; the veil follows so the words stay readable on mid tones */
.glassfield[data-tone=dark]{color:#1d1304;text-shadow:0 1px 0 rgba(255,255,255,.35);background:rgba(255,255,255,.5)}
.lgbtn[data-tone=dark]{background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.78),rgba(255,255,255,.52) 60%,rgba(255,240,210,.5))}
.lgbtn[data-tone=light]{color:#fff;background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.3),rgba(24,15,5,.5) 55%,rgba(24,15,5,.58));border-color:rgba(255,255,255,.5)}
.lgbtn[data-tone=light] .ico{color:#fff;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))} /* the icon sets its own colour (.ico), so the white goes on it */
.lgbtn[data-tone=light]::after{background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,0))}
.glassfield[data-tone=light]{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);background:rgba(24,15,5,.5);border-color:rgba(255,255,255,.45)}
.svcdeck .kicker .count{font-size:13px}
.svcdeck .svcl1{font-size:26px;line-height:1.15;align-items:flex-end}
.svcdeck .svcl1 b:not(.svcprice),.svcdeck .svcl1 b a{color:#fff;background:none;-webkit-text-fill-color:currentColor;filter:none;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.svcdeck .svcl1 .svcprice{flex:none;padding:6px 14px;border-radius:999px;font-size:20px;color:#3b2504;-webkit-text-fill-color:#3b2504;-webkit-background-clip:border-box;background-clip:border-box;filter:none;text-shadow:0 1px 0 rgba(255,244,190,.7);background:linear-gradient(180deg,var(--g1),var(--g2) 40%,var(--g3));box-shadow:inset 0 1px 1px rgba(255,255,255,.9),inset 0 -2px 4px rgba(109,66,4,.4)}
.svcdeck .svcl2{margin-top:8px;font-size:15px;color:rgba(255,255,255,.9)}.svcdeck .svcl2 .meta{color:#fff}
.svcdeck .techcard .slotlabel,.svcdeck .techcard .wherelabel{color:#fff}
.svcdeck .techcard .techact .meta{color:#fff}
.svcdeck .share.onpic{top:14px;right:14px}
.svcnext{display:block;margin:0;padding:12px 0 2px calc(50% + 22px);text-align:left;font-size:12px;font-weight:700;color:var(--soft);line-height:1.1}
.svcdots{display:flex;flex-direction:column;gap:6px;position:absolute;z-index:4;right:3px;top:50%;transform:translateY(-50%);pointer-events:none}
.svcdots i{width:4px;height:4px;border-radius:2px;background:rgba(255,255,255,.7);box-shadow:0 0 2px rgba(0,0,0,.4)}
.svcdots i.on{height:14px;background:var(--g2)}
/* the glass triangles: up and down centred at the deck's top and bottom, left and right at its middle, fixed over the cards */
.deckarrows .deckarrow{--lg:38px;position:fixed;z-index:9}
.deckarrow.up{top:calc(var(--top,150px) + 16px);left:calc(50% - 19px)}
.deckarrow.down{--lg:30px;bottom:calc(var(--bot) + 2px);left:calc(50% - 15px)}
.deckarrow.left{left:16px;top:calc((var(--top,150px) + 100vh - var(--bot)) / 2 - 19px)}
.deckarrow.right{right:16px;top:calc((var(--top,150px) + 100vh - var(--bot)) / 2 - 19px)}
.deckarrow[hidden]{display:none}
.deckwrap.hint .deckarrow{animation:nudge 1.2s ease-in-out 2}
@keyframes nudge{50%{transform:scale(1.18)}}
}
.deckarrows{display:none}@media(max-width:760px){body.appdeck .deckarrows{display:block}}
/* Orders deck (protocol 01): same snap rules, no browse bars. One order or one post fills the screen; the card scrolls if the bids are long. */
.orddeck{display:none}
@media(max-width:760px){
body.ordeck .ordtabs{display:none}
body.ordeck .orddeck{display:block}
body.ordeck{--bot:env(safe-area-inset-bottom,0px)}
.svcdeck .ordercard{overflow:auto;height:100%;padding:16px 18px 24px;background:#fffaf0;color:#3a2608;display:block}
.svcdeck .ordercard .ordermain,.svcdeck .ordercard p,.svcdeck .ordercard small,.svcdeck .ordercard td,.svcdeck .ordercard th,.svcdeck .ordercard summary,.svcdeck .ordercard .kicker{color:#3a2608;position:relative}
.svcdeck .ordercard table,.svcdeck .ordercard .acts,.svcdeck .ordercard details{position:relative;width:100%}
}
@media(max-width:760px) and (prefers-reduced-motion:reduce){.svcdeck .svc{transition:none}.svcdeck .svc:active{transform:none}.deckwrap.hint .deckarrow{animation:none}}
/* a triangle drawn in CSS (a square turned 45 degrees, two sides showing), pointing the way: up, down, left, right */
.ico-tri::before{left:6px;top:8px;width:10px;height:10px;border-left:3px solid currentColor;border-top:3px solid currentColor;border-radius:2px;transform:rotate(45deg)}
.ico-tri.down::before{top:3px;transform:rotate(225deg)}.ico-tri.left::before{left:8px;top:6px;transform:rotate(-45deg)}.ico-tri.right::before{left:3px;top:6px;transform:rotate(135deg)}
/* the bottom tab icons, CSS only: a grid of cards, a list, a map pin */
.ico-services{background:linear-gradient(currentColor,currentColor) 2px 2px/8px 7px no-repeat,linear-gradient(currentColor,currentColor) 12px 2px/8px 7px no-repeat,linear-gradient(currentColor,currentColor) 2px 11px/8px 7px no-repeat,linear-gradient(currentColor,currentColor) 12px 11px/8px 7px no-repeat}
.ico-list{background:linear-gradient(currentColor,currentColor) 2px 3px/18px 3px no-repeat,linear-gradient(currentColor,currentColor) 2px 9px/18px 3px no-repeat,linear-gradient(currentColor,currentColor) 2px 15px/18px 3px no-repeat}
.ico-map::before{left:5px;top:1px;width:12px;height:12px;border:3px solid currentColor;border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
/* About: questions open one by one */
.about section{margin:0 0 22px}.qa{border-top:1px solid rgba(110,70,15,.18);padding:10px 0}.qa summary{cursor:pointer;font-weight:700;color:var(--ink)}.qa p{margin:8px 0 0}
/* Liquid-glass button (owner 2026-10-29): ONE abstract round button for every icon action. Clear frosted body, bright rim, warm glow, a lens highlight on top;
   it sinks a little when pressed. Use the class, never restyle it per page. Size by --lg (44 px: the phone touch target). */
.lgbtn{--lg:44px;position:relative;display:inline-grid;place-items:center;flex:none;width:var(--lg);height:var(--lg);padding:0;border-radius:50%;cursor:pointer;color:var(--ink);text-decoration:none;
background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.68),rgba(255,255,255,.22) 45%,rgba(255,240,210,.14) 70%,rgba(255,226,170,.26));border:1px solid rgba(255,255,255,.85);
box-shadow:inset 0 1px 1px rgba(255,255,255,.95),inset 0 -6px 10px -6px rgba(255,190,90,.55),0 0 0 .5px rgba(110,70,15,.18),0 6px 14px -6px rgba(70,45,10,.45),0 -2px 10px -4px rgba(255,205,130,.8);
-webkit-backdrop-filter:blur(10px) saturate(1.6);backdrop-filter:blur(10px) saturate(1.6);transition:transform .15s,box-shadow .15s;-webkit-tap-highlight-color:transparent}
.lgbtn::after{content:"";position:absolute;left:18%;right:18%;top:7%;height:34%;border-radius:50%;background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,0));pointer-events:none}
.lgbtn:active{transform:scale(.92);box-shadow:inset 0 2px 6px rgba(110,70,15,.25),0 3px 8px -5px rgba(70,45,10,.45)}
.lgbtn:focus-visible{outline:2px solid var(--g4);outline-offset:2px}
@media(prefers-reduced-motion:reduce){.lgbtn{transition:none}}

/* Share (src/http/share-menu.js): the button opens a glass row of five buttons. .onpic sits on a card's picture (top right); .up opens upward from a card's foot. */
.share{position:relative;z-index:3}.share>summary{list-style:none}.share>summary::-webkit-details-marker{display:none}
.share.onpic{position:absolute;top:18px;right:18px}
.svc{position:relative}
.svc:has(.share[open]),.post:has(.share[open]){content-visibility:visible;position:relative;z-index:5} /* an open menu is never clipped by its card and sits above the next card */
.sharemenu{position:absolute;right:0;top:calc(100% + 8px);display:flex;gap:4px;padding:5px;border-radius:999px;background:var(--glass-fill-strong);border:1px solid rgba(255,255,255,.8);
box-shadow:inset 0 1px 0 rgba(255,255,255,.9),var(--glass-glow),0 14px 30px -8px rgba(60,35,5,.5);-webkit-backdrop-filter:var(--glass-blur-strong);backdrop-filter:var(--glass-blur-strong);transform-origin:top right;animation:sharein .18s ease-out}
.share.up .sharemenu{top:auto;bottom:calc(100% + 8px);transform-origin:bottom right}
/* a deal card: the button sits at the bottom right of the 4:3 picture (the deal badge holds the top right); the picture is the card width less 16 px */
.post:has(.share){position:relative;container-type:inline-size}.share.onpic.low{top:calc(8px + (100cqw - 16px) * .75 - 56px);right:20px}
@keyframes sharein{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.sharemenu{animation:none}}
@media(min-width:761px){.sharemenu .lgbtn{--lg:38px}} /* a mouse needs less than a finger; the card can be 230 px wide */

/* Icons drawn in CSS only (no image, no font): 22 px, the colour of the text. */
.ico{position:relative;display:block;width:22px;height:22px;color:var(--ink)}
.ico::before,.ico::after{content:"";position:absolute;box-sizing:border-box}
/* share: an open box with an arrow up out of it */
.ico-share{background:linear-gradient(currentColor,currentColor) 50% 1px/2px 13px no-repeat}
.ico-share::before{left:4px;right:4px;top:8px;bottom:1px;border:2px solid currentColor;border-top-color:transparent;border-radius:3px}
.ico-share::after{left:7px;top:1px;width:8px;height:8px;border-left:2px solid currentColor;border-top:2px solid currentColor;transform:rotate(45deg)}
/* text message: a speech bubble with a tail */
.ico-sms::before{left:1px;right:1px;top:3px;height:14px;border:2px solid currentColor;border-radius:7px}
.ico-sms::after{left:5px;top:15px;width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:5px solid currentColor;transform:rotate(25deg)}
/* email: an envelope */
.ico-mail::before{left:1px;right:1px;top:4px;bottom:4px;border:2px solid currentColor;border-radius:3px}
.ico-mail::after{left:6px;top:2px;width:10px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
/* Facebook: a filled round badge with a lower-case f */
.ico-fb::before{inset:1px;border-radius:50%;background:currentColor}
.ico-fb::after{content:"f";left:0;right:0;top:3px;text-align:center;font:800 17px/20px Helvetica,Arial,sans-serif;color:#fff6e4;transform:translateX(1px)}
/* Instagram: a rounded square, a lens and the small dot */
.ico-ig{background:radial-gradient(circle,currentColor 1.4px,transparent 1.8px) 15.5px 4.5px/3px 3px no-repeat}
.ico-ig::before{inset:1px;border:2px solid currentColor;border-radius:6px}
.ico-ig::after{left:6px;top:6px;width:10px;height:10px;border:2px solid currentColor;border-radius:50%}
/* copy link: two chain links */
.ico-link::before,.ico-link::after{width:12px;height:7px;border:2px solid currentColor;border-radius:4px;transform:rotate(-45deg)}
.ico-link::before{left:1px;top:11px}.ico-link::after{left:9px;top:4px}

/* the dark provider card: chips and the Where picker keep their light-page style unless set here */
.svcdeck .techcard .slot span{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7);background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.5);box-shadow:none}
.svcdeck .techcard .slot input:checked+span{color:#3b2504;text-shadow:0 1px 0 rgba(255,244,190,.7);background:linear-gradient(180deg,var(--g1),var(--g2) 40%,var(--g3));border-color:rgba(255,255,255,.7);box-shadow:0 0 0 2px #fff}
.svcdeck .techcard .field{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7);background-color:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.5);box-shadow:none}
.svcdeck .techcard .field option{color:#3a2608;text-shadow:none}

.ordercard>.acts{grid-column:1/-1;justify-content:flex-start}
.lobbyhead .headact{margin-left:auto}
.cardlink{display:block;color:inherit;text-decoration:none}

/* PC: the view tabs and the group tabs share one row (owner 2026-10-30); a phone keeps its fixed bars */
@media(min-width:761px){#browse{display:flex;flex-wrap:wrap;align-items:center;gap:0 20px}#browse>*{flex:0 0 100%;min-width:0}#browse>.tabs,#browse>.seg{flex:0 0 auto;max-width:100%;margin-bottom:16px;box-sizing:border-box;height:40px;padding:3px;border-radius:999px;align-items:center}#browse>.tabs a,#browse>.seg a{display:inline-flex;align-items:center;box-sizing:border-box;height:32px;padding:0 18px;border-radius:999px;font-size:15px;line-height:1}}
#ratef input[type=range]{width:100%;accent-color:#a86f0a}#ratef output{font-weight:800}#rw[data-over="1"]{color:#9b1c1c;font-weight:700}#ratef input[type=file]{max-width:100%}.custrev{margin:6px 0 0;font-size:13px}.custrev p{margin:0 0 4px}
.dot.booked{background:#2f9e44}.dot.lead{background:#d6336c}

.gal{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:6px;border-radius:12px;margin-bottom:8px;-webkit-overflow-scrolling:touch}.gal img{flex:0 0 100%;width:100%;aspect-ratio:8/5;object-fit:cover;scroll-snap-align:center;scroll-snap-stop:always}
.galedit{display:flex;flex-wrap:wrap;gap:10px}.galedit figure{margin:0;text-align:center}.galedit img{border-radius:8px;object-fit:cover}

.techrows{display:grid;gap:12px;margin:12px 0}.techrow{display:flex;align-items:center;gap:14px;height:120px;padding:12px 14px;text-decoration:none;color:inherit;overflow:hidden}.trpic{flex:none;width:96px;height:96px;border-radius:18px;overflow:hidden;display:grid;place-items:center;font-size:34px;font-weight:800;background:linear-gradient(160deg,#f6e3a4,#c99b36)}.trpic img{width:100%;height:100%;object-fit:cover}.trmain{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.trmain b{font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trmain small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trprice{flex:none;font-size:20px}

.memonly{font-size:12px;font-weight:700;color:var(--soft);text-align:right}.memonly a{color:inherit}

.catrow{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}.postpic{display:block;max-width:100%;height:auto;border-radius:10px;margin-top:6px}

:root{--btn-tall:56px}.btn.tall{min-height:var(--btn-tall);padding:0 30px;font-size:18px;display:inline-flex;align-items:center;justify-content:center}.duo{display:flex;flex-wrap:wrap;gap:10px}
.btn.tall[hidden]{display:none}
.cal#bcal{min-height:322px}