/* Qeychi demo — 1:1 Fresha replica. Tokens below are Fresha's own values, measured from the captures in
   capture/out (computed styles) and Fresha's light/dark token map (capture/out/www-theme-map.json).
   Only unavoidable substitutions: Persian text + RTL, Vazirmatn for Fresha's proprietary RoobertPRO,
   Noto Naskh Arabic for its serif (Tartuffo), stand-in photos, the name «قیچی» for the logo. */
:root{
  /* == restyle v3 palette: Accord LIGHT colours (research/accord-ui/tokens.json). Dark mode below is the owner's, unchanged. == */
  --ink:#14231d;          /* text = Accord ink / night */
  --ink-2:#45554e;        /* secondary text (Accord ink-2) */
  --ink-3:#5c6a63;        /* labels, captions, placeholders (Accord ink-3, 5.2:1 on page) */
  --ink-4:#b3c4bb;        /* decorative only (Accord on-night-2) */
  --page:#f6f6f1;         /* cream page */
  --bg:#fffffd;           /* surface: cards, inputs, sheets */
  --bg-2:#f1f2ec;         /* surface-2: hover, wells, segmented track, chips */
  --bg-3:#e7e9e2;         /* surface-3: tracks, avatar bg, count chips, skeletons */
  --bg-4:#fbfbf8;         /* sidebar-bg */
  --band:#e2efe8;         /* sage band: top bar + page header / hero */
  --band-2:#cde2d6;       /* dividers / rails inside the band */
  --line:#e5e7df;         /* hairline */
  --line-2:#d6d9cf;       /* card / input border */
  --night:#14231d; --night-2:#213a2f; --on-night:#f2f5f0; --on-night-2:#b3c4bb;   /* primary button, selected chip/tab, tooltip, toast */
  --sel:var(--night); --on-sel:var(--on-night);   /* FILLED selected state (day, slot, chip, count badge, my chat bubble); dark = owner's brand fill */
  --accent:#12a079;       /* graphics only: map/data marks, focus ring, active indicator bars (3.3:1 — never text) */
  --accent-deep:#0b7658;  /* links, active icon/text, accent text (5.6:1 on surface) */
  --accent-soft:#d3eee2;  /* highlight / mark / soft selected */
  --accent-ring:#12a0793d;
  --brand:#0b7658;        /* our brand role = Accord accent-deep (links, active text, selected outline) */
  --brand-2:#08654b;      /* brand hover/pressed (accent-deep 15% toward ink) */
  --brand-3:#0b5440;      /* deep brand text on brand-soft */
  --brand-soft:#d3eee2;   /* accent-soft */
  --brand-soft-2:#cde2d6; /* band-2 */
  --brand-soft-3:#b9dccb;
  --ok:#17734f; --ok-soft:#dcf1e7; --ok-2:#d6f0e2;
  --bad:#b42318; --bad-2:#9b1e15; --bad-soft:#fbe2df;
  --warn:#9a5a06; --warn-soft:#fbeed6; --star:#e0a21a;
  --blue:#0b6f7c; --blue-soft:#d2eef2;   /* Accord c1 teal family: deep text on c1-soft */
  --rose:#a8394a; --rose-soft:#fbdfe2;   /* Accord c4 rose family */
  --on-ink:#f2f5f0;
  --ink-web:#14231d;
  --scrim:rgb(8 16 12 / .45);
  --glass:rgba(255,255,253,.72);
  --sh-card:0 1px 0 #14231d08,0 10px 28px -20px #14231d47,0 0 0 1px #e5e7df;
  --sh-pop:0 2px 0 #14231d08,0 26px 50px -24px #14231d6b,0 0 0 1px #e5e7df;
  --sh-small:0 1px 2px #14231d24;
  --inset:inset 0 0 0 1px #e5e7df;
  --f:'IRANSansX',sans-serif;
  --f-serif:'IRANSansX',sans-serif;
  --hub-h:55px;
  /* == restyle v3 shape tokens (form only, never colour; shared by customer + panel restyles) == */
  --r-xs:6px; --r-sm:8px; --r-ctl:10px; --r-btn:12px; --r-md:12px; --r-card:14px; --r-lg:18px; --r-xl:22px; --r-pill:999px;
  --bw:1px; --bd:var(--bw) solid var(--line); --bd-2:var(--bw) solid var(--line-2);
  --sh-1:0 1px 0 #14231d08,0 10px 28px -20px #14231d47;
  --sh-2:0 2px 0 #14231d08,0 26px 50px -24px #14231d6b;
  --sh-3:0 30px 80px -20px #08100c80,0 0 0 1px #14231d0a;
  --sh-pop-2:0 14px 30px -14px #14231d8c,0 0 0 1px #14231d0d;
  --sh-seg:0 1px 2px #14231d24,inset 0 0 0 1px var(--line);
  --ring:0 0 0 3px var(--accent-ring);
  --ring-c:var(--accent);
  --band-hover:#14231d0f;
  --hover-tint:color-mix(in srgb,var(--ink) 5%,transparent);
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-7:28px; --s-8:32px; --s-10:40px; --s-12:48px;
  --edge:clamp(16px,2.2vw,40px); --gap:clamp(14px,1.2vw,20px); --pad:clamp(16px,1.3vw,22px);
  --t-cap:12px; --t-sm:13.5px; --t-md:15px; --t-lg:18px; --t-xl:22px;
  --t-h2:clamp(20px,1rem + .6vw,26px); --t-title:clamp(26px,1.1rem + 1.4vw,36px); --t-fig:clamp(26px,1.2rem + 1.1vw,38px);
  --lh-tight:1.3; --lh-head:1.35; --tr-head:-.012em; --tr-fig:-.03em; --tr-label:.01em;
  --w-head:700; --w-title:650; --w-label:600;
  --h-ctl:40px; --h-ctl-sm:34px; --h-chip:34px; --h-btn:44px;
  --ease:cubic-bezier(.22,1,.36,1); --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --d-1:.15s; --d-2:.2s; --d-3:.3s;
  --lift:-2px;
  --sh-card-1:inset 0 0 0 1px var(--line),var(--sh-1);            /* hairline card at rest */
  --sh-card-h:inset 0 0 0 1px var(--line-2),var(--sh-2);          /* hovered navigable card */
  --sh-card-on:inset 0 0 0 2px var(--brand),var(--sh-1);          /* selected card */
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ink:#f5f5f5; --ink-2:#bfbfbf; --ink-3:#767676; --ink-4:#626262;
  --bg:#0d0d0d; --bg-2:#181818; --bg-3:#262626; --bg-4:#131313;
  --line:#333333; --line-2:#404040;
  --page:#0d0d0d; --band:#0d0d0d; --band-2:#262626; --band-hover:color-mix(in srgb,#f5f5f5 7%,transparent);
  --night:#f5f5f5; --night-2:#d9d9d9; --on-night:#0d0d0d; --on-night-2:#404040; --sel:var(--brand); --on-sel:#ffffff;
  --accent:#8880ff; --accent-deep:#8880ff; --accent-soft:#201e45; --accent-ring:color-mix(in srgb,#8880ff 32%,transparent); --rose:#f0828e; --rose-soft:#47222a;
  --brand:#8880ff; --brand-2:#b0b1fd; --brand-3:#d1d4ff; --brand-soft:#201e45; --brand-soft-2:#2b2660; --brand-soft-3:#403591;
  --ok:#45b020; --ok-soft:#182914; --ok-2:#18390e; --bad:#ff4360; --bad-2:#fe9a9a; --bad-soft:#421015;
  --warn:#f19101; --warn-soft:#371c0c; --star:#ffc00a; --blue:#5791f0; --blue-soft:#133263;
  --on-ink:#0d0d0d; --scrim:rgba(0,0,0,.6); --glass:rgba(29,29,29,.7); --ink-web:#e8eaee;
  --sh-card:0 0 0 1px #262626; --sh-pop:0 2px 8px 0 rgba(0,0,0,.4),0 4px 20px 0 rgba(0,0,0,.5),0 0 0 1px #262626; --sh-small:0 2px 4px 0 rgba(0,0,0,.5);
  --inset:inset 0 0 0 1px #333333;
  --sh-1:0 0 0 1px #262626,0 12px 30px -20px rgba(0,0,0,.7); --sh-2:0 0 0 1px #333333,0 28px 54px -24px rgba(0,0,0,.85);
  --sh-3:0 30px 80px -20px rgba(0,0,0,.8),0 0 0 1px #333333; --sh-pop-2:0 18px 44px -18px rgba(0,0,0,.75),0 0 0 1px #333333;
  --sh-seg:0 1px 2px rgba(0,0,0,.5),inset 0 0 0 1px var(--line);
  --ring:0 0 0 3px color-mix(in srgb,var(--brand) 32%,transparent); --hover-tint:color-mix(in srgb,var(--ink) 7%,transparent);
  color-scheme:dark;
}}
:root[data-theme="dark"]{
  --ink:#f5f5f5; --ink-2:#bfbfbf; --ink-3:#767676; --ink-4:#626262;
  --bg:#0d0d0d; --bg-2:#181818; --bg-3:#262626; --bg-4:#131313;
  --line:#333333; --line-2:#404040;
  --page:#0d0d0d; --band:#0d0d0d; --band-2:#262626; --band-hover:color-mix(in srgb,#f5f5f5 7%,transparent);
  --night:#f5f5f5; --night-2:#d9d9d9; --on-night:#0d0d0d; --on-night-2:#404040; --sel:var(--brand); --on-sel:#ffffff;
  --accent:#8880ff; --accent-deep:#8880ff; --accent-soft:#201e45; --accent-ring:color-mix(in srgb,#8880ff 32%,transparent); --rose:#f0828e; --rose-soft:#47222a;
  --brand:#8880ff; --brand-2:#b0b1fd; --brand-3:#d1d4ff; --brand-soft:#201e45; --brand-soft-2:#2b2660; --brand-soft-3:#403591;
  --ok:#45b020; --ok-soft:#182914; --ok-2:#18390e; --bad:#ff4360; --bad-2:#fe9a9a; --bad-soft:#421015;
  --warn:#f19101; --warn-soft:#371c0c; --star:#ffc00a; --blue:#5791f0; --blue-soft:#133263;
  --on-ink:#0d0d0d; --scrim:rgba(0,0,0,.6); --glass:rgba(29,29,29,.7); --ink-web:#e8eaee;
  --sh-card:0 0 0 1px #262626; --sh-pop:0 2px 8px 0 rgba(0,0,0,.4),0 4px 20px 0 rgba(0,0,0,.5),0 0 0 1px #262626; --sh-small:0 2px 4px 0 rgba(0,0,0,.5);
  --inset:inset 0 0 0 1px #333333;
  --sh-1:0 0 0 1px #262626,0 12px 30px -20px rgba(0,0,0,.7); --sh-2:0 0 0 1px #333333,0 28px 54px -24px rgba(0,0,0,.85);
  --sh-3:0 30px 80px -20px rgba(0,0,0,.8),0 0 0 1px #333333; --sh-pop-2:0 18px 44px -18px rgba(0,0,0,.75),0 0 0 1px #333333;
  --sh-seg:0 1px 2px rgba(0,0,0,.5),inset 0 0 0 1px var(--line);
  --ring:0 0 0 3px color-mix(in srgb,var(--brand) 32%,transparent); --hover-tint:color-mix(in srgb,var(--ink) 7%,transparent);
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{direction:rtl;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--page);color:var(--ink);font:400 16px/1.5 var(--f);-webkit-font-smoothing:antialiased;overflow-x:hidden;text-rendering:optimizeLegibility}
body.lock{overflow:hidden}
h1,h2,h3,h4,p{margin:0}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
img{display:block;max-width:100%}
.i{width:20px;height:20px;flex:none}
:focus-visible{outline:2px solid var(--ring-c);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
a.sr:focus{width:auto;height:auto;clip:auto;overflow:visible;z-index:100;padding:8px 12px;background:var(--bg);color:var(--ink);outline:2px solid var(--brand)}
.num{font-variant-numeric:tabular-nums}
/* restyle v3 shared helpers (any app may use them; built only from tokens) */
.rv-label{font-size:var(--t-cap);font-weight:var(--w-label);letter-spacing:var(--tr-label);color:var(--ink-2);line-height:1.4}
.rv-fig{font-size:var(--t-fig);font-weight:650;letter-spacing:var(--tr-fig);line-height:1.05}
.rv-card{background:var(--bg);border:var(--bd);border-radius:var(--r-card);box-shadow:var(--sh-1)}
.rv-lift{transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease),border-color var(--d-2)}
@media (hover:hover){.rv-lift:hover{transform:translateY(var(--lift));box-shadow:var(--sh-2)}}
.rv-chip{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 9px;border-radius:var(--r-pill);font-size:var(--t-cap);font-weight:600;line-height:1;white-space:nowrap;background:var(--bg-3);color:color-mix(in srgb,var(--ink-2) 80%,var(--ink))}
.rv-chip--ok{background:var(--ok-soft);color:color-mix(in srgb,var(--ok) 80%,var(--ink))} .rv-chip--bad{background:var(--bad-soft);color:var(--bad)}
.rv-chip--warn{background:var(--warn-soft);color:var(--warn)} .rv-chip--brand{background:var(--brand-soft);color:var(--brand)}
.rv-chip--blue{background:var(--blue-soft);color:var(--blue)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* logo: the name «قیچی» set where Fresha's wordmark sits (same box: ~75×48, bold, tight) */
.logo{display:inline-flex;align-items:center;height:48px;font:800 26px/1 var(--f);letter-spacing:-.5px;color:var(--ink)}

/* ---------- demo switcher (not part of Fresha; hidden with #….bare for comparisons) ---------- */
.hub{position:sticky;top:0;z-index:900;height:var(--hub-h);background:var(--bg);border-bottom:1px solid var(--line)}
.hub-in{display:flex;align-items:center;gap:12px;height:100%;padding:0 20px}
.hub .logo{font-size:22px;height:auto}
.hub-tabs{display:flex;gap:4px;flex:1;overflow-x:auto;scrollbar-width:none}
.hub-tabs::-webkit-scrollbar{display:none}
.hub-tabs button{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:999px;font-size:14px;font-weight:600;white-space:nowrap;color:var(--ink-2)}
.hub-tabs button .i{width:18px;height:18px}
.hub-tabs button[aria-selected="true"]{background:var(--ink);color:var(--on-ink)}
.hub-note{font-size:12px;color:var(--ink-2);white-space:nowrap}
.hub .icb{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1px var(--line-2)}
/* restyle v3: hub finish */
.hub{box-shadow:0 8px 24px -22px rgba(13,13,13,.5)}
.hub-tabs button{transition:background-color var(--d-2) var(--ease),color var(--d-2)}
.hub-tabs button:hover:not([aria-selected="true"]){background:var(--hover-tint);color:var(--ink)}
.hub .icb{border-radius:var(--r-ctl);transition:background-color var(--d-2)}
.hub .icb:hover{background:var(--bg-2)}
.toast{border-radius:var(--r-md);box-shadow:var(--sh-pop-2);font-size:var(--t-sm);transition:opacity var(--d-3) var(--ease),transform var(--d-3) var(--ease)}
.ov{animation:fq-fade var(--d-2) var(--ease)}
html.bare{--hub-h:0px}
html.bare .hub{display:none}
@media (max-width:900px){.hub-note{display:none}.hub-in{padding:0 10px}}

/* ---------- phone frame for the two app versions ---------- */
.stage{display:flex;justify-content:center;padding:28px 16px 48px}
.phone{width:390px;height:844px;border-radius:54px;padding:12px;background:#111;box-shadow:0 30px 60px -20px rgba(0,0,0,.45),inset 0 0 0 2px #2a2a2a;position:relative;flex:none}
.phone::before{content:"";position:absolute;top:22px;left:50%;transform:translateX(-50%);width:118px;height:32px;border-radius:20px;background:#000;z-index:30}
.screen{position:relative;width:100%;height:100%;border-radius:42px;overflow:hidden;background:var(--bg);display:flex;flex-direction:column;isolation:isolate;container-type:inline-size}
.sbar{height:50px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:6px 30px 0;font:600 15px/1 var(--f);direction:ltr;color:var(--ink)}
.sbar .sig i{display:block;width:17px;height:10px;border-radius:2px;background:currentColor}
.screen .app-view{flex:1;min-height:0;display:flex;flex-direction:column}
.screen .scroll-host{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;position:relative}
.screen .scroll-host::-webkit-scrollbar{display:none}
.screen .ov{position:absolute!important;border-radius:42px;overflow:hidden}
@media (max-width:440px){
  .stage{padding:0}
  .phone{width:100%;height:calc(100dvh - var(--hub-h));border-radius:0;padding:0;background:none;box-shadow:none}
  .phone::before,.sbar{display:none}
  .screen,.screen .ov{border-radius:0}
}
/* short screens: a laptop keeps the frame but shrinks it to the window height; a phone/tablet held landscape drops the
   frame and shows the 390px-wide app at full window height (the frame would be cut off) */
@media (min-width:441px) and (max-height:960px){.phone{height:max(560px,calc(100dvh - var(--hub-h) - 56px))}}
@media (min-width:441px) and (max-height:600px) and (pointer:coarse){
  .stage{padding:0}
  .phone{height:calc(100dvh - var(--hub-h));border-radius:0;padding:0;background:none;box-shadow:none}
  .phone::before,.sbar{display:none}
  .screen,.screen .ov{border-radius:0}
}
html.bare .stage{padding:0}
html.bare .phone{width:100%;height:100dvh;border-radius:0;padding:0;background:none;box-shadow:none}
html.bare .phone::before,html.bare .sbar{display:none}
html.bare .screen,html.bare .screen .ov{border-radius:0}

/* ---------- overlay container used by App.modal (each app styles its own .mdl variants) ---------- */
.ov{position:fixed;inset:0;z-index:800;background:var(--scrim);display:grid;place-items:center;animation:fq-fade .2s ease}
.mdl{background:var(--bg);color:var(--ink);max-height:100%;overflow:auto}
@keyframes fq-fade{from{opacity:0}}
.toast{position:fixed;bottom:24px;left:50%;z-index:950;transform:translate(-50%,16px);opacity:0;pointer-events:none;display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:12px;background:var(--ink);color:var(--on-ink);font-size:14px;font-weight:500;box-shadow:var(--sh-pop);transition:opacity .2s,transform .2s;max-width:calc(100vw - 32px)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.screen .toast{position:absolute;bottom:90px}
[data-app]{container-type:inline-size}

/* windows sit above the demo switcher bar (it is not part of the product) — 1405-07-26 */
.ov{z-index:910}


/* Qeychi — shared components (ui.js), prefix q-. Built only from base.css tokens; the few values base.css has no
   token for (accent fill that stays #6950f3 in dark like Fresha's own primary fill, shadows) are tokens below, with
   light and dark values in the three-block pattern of base.css. */
:root{
  --q-accent:var(--night); --q-on-accent:var(--on-night); --q-on-photo:#ffffff; --q-pin-on:var(--accent);   /* restyle v3 palette: FAB/bubble = Accord night, active pin = Accord accent */
  --q-tb-bg:var(--bg); --q-tb-h:64px; --q-tb-r:22px; --q-fab:56px; --q-fab-rise:22px;
  --q-tb-space:calc(var(--q-tb-h) + 24px + env(safe-area-inset-bottom,0px));   /* bottom padding for content under the bar */
  --q-tb-sh:drop-shadow(0 -1px 0 var(--line)) drop-shadow(0 -6px 14px rgba(19,19,19,.07));
  --q-fab-sh:0 10px 22px -8px #14231d8c,0 1px 2px #14231d1a;
  --q-pin-sh:drop-shadow(0 2px 3px rgba(19,19,19,.32));
  --q-dot:rgba(255,255,255,.55);
  --q-photo-fade:linear-gradient(270deg,rgba(13,13,13,.72) 0%,rgba(13,13,13,.45) 48%,rgba(13,13,13,.05) 100%);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --q-tb-bg:var(--bg-2); --q-accent:#6950f3; --q-on-accent:#ffffff; --q-pin-on:#6950f3;
  --q-tb-sh:drop-shadow(0 -1px 0 var(--line)) drop-shadow(0 -6px 14px rgba(0,0,0,.55));
  --q-fab-sh:0 8px 18px -4px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06);
  --q-pin-sh:drop-shadow(0 2px 4px rgba(0,0,0,.7));
  --q-dot:rgba(255,255,255,.45);
}}
:root[data-theme="dark"]{
  --q-tb-bg:var(--bg-2); --q-accent:#6950f3; --q-on-accent:#ffffff; --q-pin-on:#6950f3;
  --q-tb-sh:drop-shadow(0 -1px 0 var(--line)) drop-shadow(0 -6px 14px rgba(0,0,0,.55));
  --q-fab-sh:0 8px 18px -4px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06);
  --q-pin-sh:drop-shadow(0 2px 4px rgba(0,0,0,.7));
  --q-dot:rgba(255,255,255,.45);
}

/* ---------------- buttons used inside shared components ---------------- */
.q-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;font:600 14px/20px var(--f);color:var(--ink);background:var(--bg);box-shadow:inset 0 0 0 1px var(--line-2);white-space:nowrap}
.q-btn .i{width:18px;height:18px}
.q-btn--pri{background:var(--ink);color:var(--on-ink);box-shadow:none}
.q-btn--full{display:flex;width:100%;margin-top:14px}
.q-btn:hover{background:var(--bg-2)}
.q-btn--pri:hover{background:var(--ink);opacity:.9}

/* ---------------- tab bar with raised centre button ---------------- */
.q-tb{position:relative;z-index:30;flex:none;height:calc(var(--q-tb-h) + env(safe-area-inset-bottom,0px));color:var(--ink)}
.q-tb-bg{position:absolute;inset:0;display:flex;direction:ltr;filter:var(--q-tb-sh);pointer-events:none}
.q-tb-bg>i{flex:1;background:var(--q-tb-bg)}
.q-tb-bg>i:first-child{border-top-left-radius:var(--q-tb-r)}
.q-tb-bg>i:last-child{border-top-right-radius:var(--q-tb-r)}
.q-tb-mid{width:112px;flex:none;display:flex;flex-direction:column;margin:0 -1px;color:var(--q-tb-bg)}
.q-tb-mid>i{flex:1;background:var(--q-tb-bg)}
.q-tb-notch{display:block;width:100%;height:var(--q-tb-h);flex:none}
.q-tb-row{position:relative;display:grid;grid-template-columns:1fr 1fr 112px 1fr 1fr;height:var(--q-tb-h);padding:0 6px}
.q-tb-it{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:48px;min-height:48px;padding:0 2px;color:var(--ink);font:500 11px/14px var(--f);border-radius:16px;-webkit-tap-highlight-color:transparent}
.q-tb-it .i{width:24px!important;height:24px!important}
.q-tb-it.on{color:var(--brand);font-weight:600}
.q-tb-l{white-space:nowrap}
.q-tb-it:focus-visible{outline:2px solid var(--ring-c);outline-offset:-4px}
.q-tb-fab{justify-content:flex-start;gap:4px}
.q-tb-fab-c{width:var(--q-fab);height:var(--q-fab);margin-top:calc(-1 * var(--q-fab-rise));border-radius:50%;background:var(--q-accent);color:var(--q-on-accent);display:grid;place-items:center;box-shadow:var(--q-fab-sh);transition:transform .15s ease}
.q-tb-fab-c .i{width:28px!important;height:28px!important}
.q-tb-fab:active .q-tb-fab-c{transform:scale(.94)}
.q-tb-fab:focus-visible{outline:0}
.q-tb-fab:focus-visible .q-tb-fab-c{outline:2px solid var(--ring-c);outline-offset:3px}
.q-tb-fab.on .q-tb-fab-c{box-shadow:var(--q-fab-sh),0 0 0 3px var(--q-tb-bg),0 0 0 5px var(--q-accent)}

/* ---------------- dropdown ---------------- */
.q-sel{position:relative;display:inline-flex;align-items:center;gap:6px;height:40px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg);color:var(--ink);padding-inline-start:14px;flex:none}
.q-sel>.i:first-child{width:18px;height:18px;color:var(--ink-2)}
.q-sel select{appearance:none;-webkit-appearance:none;border:0;background:transparent;height:100%;padding-inline-end:34px;font:500 14px/20px var(--f);color:inherit;cursor:pointer;outline:0;max-width:230px;text-overflow:ellipsis}
.q-sel select option{background:var(--bg);color:var(--ink)}
.q-sel-ch{position:absolute;inset-inline-end:12px;width:16px!important;height:16px!important;pointer-events:none}
.q-sel:hover{background:var(--bg-2)}
.q-sel.on{box-shadow:inset 0 0 0 2px var(--ink)}
.q-sel:focus-within{outline:2px solid var(--ring-c);outline-offset:2px}

/* ---------------- photo strip (gallery) + dots ---------------- */
.q-snap{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.q-snap::-webkit-scrollbar{display:none}
.q-snap>*{flex:none;width:100%;scroll-snap-align:start}
.q-gal{position:relative;aspect-ratio:10/7;border-radius:16px;overflow:hidden;background:var(--bg-3)}
.q-gal-t{height:100%}
.q-gal-s{display:block;height:100%}
.q-gal-s img,.q-gal-s .noph{width:100%;height:100%;object-fit:cover}
.q-gal-b{position:absolute;z-index:3;bottom:10px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--glass);color:var(--ink);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--sh-small);opacity:0;transition:opacity .15s}
.q-gal-b .i{width:18px;height:18px}
.q-gal:hover .q-gal-b,.q-gal:focus-within .q-gal-b{opacity:1}
.q-gal-b:disabled{visibility:hidden}
.q-gal .q-prev{inset-inline-start:10px}
.q-gal .q-next{inset-inline-end:10px}
@media (hover:none){.q-gal-b{display:none}}
.q-dots{position:absolute;z-index:2;bottom:14px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:4px;pointer-events:none}
.q-dots>i{width:6px;height:6px;border-radius:999px;background:var(--q-dot);transition:width .2s}
.q-dots>i.on{width:16px;background:var(--q-on-photo)}
.q-gal-chip{position:absolute;z-index:2;top:10px;inset-inline-start:10px;display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--ink);font:500 12px/1 var(--f);white-space:nowrap;pointer-events:none}
.q-heart{position:absolute;z-index:3;top:8px;inset-inline-end:8px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--ink)}
.q-heart .i{width:20px!important;height:20px!important}
.q-heart.on{color:var(--bad)}

/* ---------------- hero slider ---------------- */
.q-sl{position:relative;border-radius:16px;overflow:hidden;background:var(--bg-3);isolation:isolate}
.q-sl-t{height:100%}
.q-sl-s{position:relative;height:100%}
.q-sl-ctl{position:absolute;z-index:3;bottom:12px;inset-inline-end:12px;display:flex;align-items:center;gap:0;height:36px;padding:0 2px;border-radius:999px;background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--ink)}
.q-sl-b{width:30px;height:32px;border-radius:50%;display:grid;place-items:center;color:inherit}
.q-sl-b .i{width:16px!important;height:16px!important}
.q-sl-ctl .q-dots{position:static;transform:none;pointer-events:auto;gap:0}
.q-sl-ctl .q-dots button{width:12px;height:32px;display:grid;place-items:center}
.q-sl-ctl .q-dots button::before{content:"";width:6px;height:6px;border-radius:999px;background:var(--ink-3);transition:width .2s}
.q-sl-ctl .q-dots button.on::before{width:14px;background:var(--ink)}
.q-sl-ctl .q-dots button.on{width:18px}
.q-sl-ctl-dots{inset-inline-end:auto;left:50%;transform:translateX(-50%);bottom:4px;height:24px;background:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.q-sl-ctl-dots .q-dots button{width:10px;height:24px}
.q-sl-ctl-dots .q-dots button.on{width:16px}
.q-sl-ctl-dots .q-dots button::before{background:var(--q-dot)}
.q-sl-ctl-dots .q-dots button.on::before{width:12px;background:var(--q-on-photo)}
.q-sl button:focus-visible{outline:2px solid var(--ring-c);outline-offset:-2px}

/* ---------------- venue card (tile / pop / sheet) ---------------- */
.q-vc{position:relative;color:var(--ink);font:400 13px/18px var(--f)}
.q-vc h3{font:600 16px/22px var(--f);margin:2px 0 4px}
.q-vc-n{color:inherit}
.q-vc-n:hover{text-decoration:underline}
.q-vc-body{padding-top:10px;display:flex;flex-direction:column}
.q-rt{display:inline-flex;align-items:center;gap:4px;font-size:13px;line-height:18px}
.q-rt .i{width:15px!important;height:15px!important;color:var(--star)}
.q-rt b{font-weight:600}
.q-rt span{color:var(--ink-2)}
.q-vc-m{color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.q-vc-pr{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;min-height:24px}
.q-vc-from{font-size:14px;line-height:20px}
.q-vc-from b{font-weight:600}
.q-bdg{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 10px;border-radius:999px;background:var(--bg-3);color:var(--ink-2);font:500 12px/1 var(--f);white-space:nowrap}
.q-bdg .i{width:14px!important;height:14px!important}
.q-bdg--vip{background:var(--warn-soft);color:var(--warn)}
.q-vc-map{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;margin-top:10px;min-height:32px;color:var(--ink-2);font:500 13px/18px var(--f)}
.q-vc-map .i{width:16px!important;height:16px!important}
.q-vc-map:hover,.q-vc-map[aria-pressed="true"]{color:var(--brand)}
.q-vc-x{position:absolute;z-index:4;top:8px;inset-inline-end:8px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--bg);color:var(--ink);box-shadow:var(--sh-small)}
.q-vc-x .i{width:18px!important;height:18px!important}
.q-vc--pop{width:280px;background:var(--bg);border-radius:20px;padding:8px 8px 14px;box-shadow:var(--sh-pop)}
.q-vc--pop .q-gal{border-radius:14px}
.q-vc--pop .q-vc-body{padding:10px 6px 0}
.q-vc--pop .q-heart{top:auto;bottom:10px;inset-inline-end:10px}
.q-vc--pop .q-vc-x{top:14px;inset-inline-end:14px;width:32px;height:32px}
.q-vc--sheet{background:var(--bg);border-radius:20px;padding:16px;box-shadow:var(--sh-pop)}
.q-vc-top{display:flex;gap:12px;align-items:flex-start}
.q-vc-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.q-vc--sheet h3{font-size:17px;line-height:24px;margin:0}
.q-vc-ph{width:108px;height:96px;flex:none;border-radius:12px;overflow:hidden;background:var(--bg-3)}
.q-vc-ph img{width:100%;height:100%;object-fit:cover}
.q-loc{display:flex;align-items:center;gap:4px;color:var(--ink-2);min-width:0}
.q-loc .i{width:16px!important;height:16px!important;flex:none}
.q-vc-sv{list-style:none;margin:14px 0 0;padding:0}
.q-vc-sv li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:13px;line-height:18px}
.q-vc-sv li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.q-vc-sv b{font-weight:600;white-space:nowrap}
.q-vc-act{display:flex;gap:10px;margin-top:10px}
.q-vc-act .q-btn{flex:1}
.q-vc-act .q-btn--pri{flex:1.6}
.q-vc--sheet .q-vc-x{top:8px;inset-inline-end:8px;width:32px;height:32px}

/* ---------------- map: art, pins, clusters, controls, card ---------------- */
.q-map{position:relative;width:100%;height:100%;overflow:hidden;isolation:isolate;background:var(--bg-3)}
.q-map-art{position:absolute;inset:0;transform-origin:50% 50%;transform:scale(var(--z)) translate(var(--tx),var(--ty));transition:transform .3s ease}
.q-map-art>svg{position:absolute;inset:0;width:100%;height:100%}
.q-map-pins{position:absolute;inset:0;z-index:1;pointer-events:none}
.q-map-pins>*{pointer-events:auto}
.q-pin,.q-clu,.q-me{position:absolute;left:var(--x);top:var(--y)}
.q-pin{--s:40px;width:var(--s);height:calc(var(--s) * 1.21);transform:translate(-50%,-100%);display:block;z-index:1;filter:var(--q-pin-sh);-webkit-tap-highlight-color:transparent}
.q-pin-b{position:absolute;top:0;left:0;width:var(--s);height:var(--s);border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--ink);transition:background .15s}
.q-pin-ph{position:absolute;inset:3px;border-radius:50%;overflow:hidden;transform:rotate(45deg);background:var(--bg-3)}
.q-pin-ph img,.q-pin-ph .noph{width:100%;height:100%;object-fit:cover}
.q-pin:hover,.q-pin.hot{z-index:3}
.q-pin:hover .q-pin-b,.q-pin.hot .q-pin-b{background:var(--q-accent)}
.q-pin.on{--s:54px;z-index:4}
.q-pin.on .q-pin-b{background:var(--q-accent)}
.q-pin:focus-visible{outline:0}
.q-pin:focus-visible .q-pin-b{box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--brand)}
.q-pin-lb{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;padding:6px 12px;border-radius:12px;background:var(--bg);box-shadow:inset 0 0 0 1.5px var(--q-accent);white-space:nowrap;font:400 11px/15px var(--f);color:var(--ink-2);pointer-events:none}
.q-pin-lb b{font:600 13px/18px var(--f);color:var(--ink)}
.q-pin-lb::after{content:"";position:absolute;top:calc(100% - 1px);left:50%;margin-left:-6px;border:6px solid transparent;border-top-color:var(--q-accent)}
.q-pin--price{--s:auto;width:auto;height:auto;transform:translate(-50%,-100%);filter:none}
.q-pin-pr{display:block;height:32px;padding:0 12px;border-radius:999px;background:var(--bg);color:var(--ink);font:600 13px/32px var(--f);white-space:nowrap;box-shadow:var(--sh-card),var(--sh-small);transition:background .15s,color .15s}
.q-pin--price:hover .q-pin-pr,.q-pin--price.hot .q-pin-pr{background:var(--ink);color:var(--on-ink)}
.q-pin--price:focus-visible .q-pin-pr{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--brand)}
.q-clu{width:40px;height:40px;transform:translate(-50%,-50%);border-radius:50%;background:var(--ink);color:var(--on-ink);font:600 14px/1 var(--f);display:grid;place-items:center;box-shadow:0 0 0 6px color-mix(in srgb,var(--ink) 20%,transparent);z-index:1}
.q-clu:hover{transform:translate(-50%,-50%) scale(1.06)}
.q-clu:focus-visible{outline:2px solid var(--ring-c);outline-offset:6px}
.q-me{width:18px;height:18px;border-radius:50%;background:var(--blue);border:3px solid var(--bg);transform:translate(-50%,-50%);box-shadow:0 0 0 8px color-mix(in srgb,var(--blue) 25%,transparent);z-index:0}
.q-map-ctl{position:absolute;z-index:5;inset-inline-end:16px;top:var(--q-ctl-top,16px);display:flex;flex-direction:column;gap:10px}
.q-map-zm{display:flex;flex-direction:column;border-radius:999px;background:var(--bg);box-shadow:var(--sh-card);overflow:hidden}
.q-map-zm button,.q-map-b{width:44px;height:44px;display:grid;place-items:center;color:var(--ink);background:var(--bg)}
.q-map-zm button+button{border-top:1px solid var(--line)}
.q-map-zm button:disabled{color:var(--ink-3);cursor:default}
.q-map-zm .i,.q-map-b .i{width:22px!important;height:22px!important}
.q-map-b{border-radius:50%;box-shadow:var(--sh-card)}
.q-map-zm button:hover:not(:disabled),.q-map-b:hover{background:var(--bg-2)}
.q-map-ctl button:focus-visible,.q-map-b:focus-visible{outline:2px solid var(--ring-c);outline-offset:2px}
.q-map-pill{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:999px;background:var(--bg);box-shadow:var(--sh-card);font:500 14px/20px var(--f);color:var(--ink);white-space:nowrap}
.q-map-pill .i{width:18px!important;height:18px!important}
.q-map-card{position:absolute;z-index:6;inset-inline:12px;bottom:var(--q-card-b,12px);animation:q-up .2s ease-out}
.q-map-pop{position:absolute;z-index:6;left:var(--x);top:var(--y);transform:translate(-50%,calc(-100% - 74px));animation:fq-fade .15s ease}
.q-map--static .q-pin,.q-map--static .q-clu{pointer-events:none}
@keyframes q-up{from{transform:translateY(24px);opacity:0}}
@media (prefers-reduced-motion:reduce){.q-map-art{transition:none}}

/* back 1405-07-24 (qBackHook): a top-bar back hidden while the page shows its own back control */
.q-bk-off{display:none!important}
/* ======================= restyle v3 (customer) — form only, colours unchanged (CONVENTIONS «restyle v3») ======================= */
.q-btn{border-radius:var(--r-btn);font-weight:600;transition:background-color var(--d-2) var(--ease),box-shadow var(--d-2),transform var(--d-1)}
.q-btn:hover{background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--ink-3)}
.q-btn--pri:hover{background:color-mix(in srgb,var(--ink) 86%,var(--bg));opacity:1;box-shadow:none}
.q-btn:active{transform:translateY(1px)}
/* tab bar: finish only (hairline + softer shadow, calmer FAB glow) */
:root{--ok-deep:color-mix(in srgb,var(--ok) 80%,var(--ink));--ink-2-deep:color-mix(in srgb,var(--ink-2) 80%,var(--ink));--q-tb-sh:drop-shadow(0 -1px 0 var(--line)) drop-shadow(0 -10px 18px rgba(13,13,13,.05));--q-fab-sh:0 10px 22px -8px #14231d8c,0 1px 2px #14231d1a}
.q-tb-it{transition:color var(--d-2) var(--ease)}
.q-tb-it .i{transition:transform var(--d-3) var(--ease)}
.q-tb-it.on{font-weight:650}
.q-tb-it.on .i{transform:translateY(-1px)}
.q-tb-fab-c{transition:transform var(--d-2) var(--ease-spring),box-shadow var(--d-3)}
.q-tb-fab:hover .q-tb-fab-c{transform:translateY(-1px)}
/* select pill */
.q-sel{border-radius:var(--r-pill);transition:background-color var(--d-2),box-shadow var(--d-2)}
.q-sel:hover{box-shadow:inset 0 0 0 1px var(--ink-3)}
.q-sel select{font-weight:500}
/* galleries, slider, venue card */
.q-gal,.q-sl{border-radius:var(--r-card)}
.q-gal-chip,.q-bdg{font-weight:600;letter-spacing:var(--tr-label)}
.q-vc h3{font-weight:650;letter-spacing:var(--tr-head)}
.q-vc-from b,.q-vc-sv b{letter-spacing:var(--tr-head)}
.q-vc:not(.q-vc--pop):not(.q-vc--sheet){transition:transform var(--d-3) var(--ease)}
.q-vc:not(.q-vc--pop):not(.q-vc--sheet) .q-gal{transition:box-shadow var(--d-3) var(--ease)}
@media (hover:hover){
  .q-vc:not(.q-vc--pop):not(.q-vc--sheet):hover{transform:translateY(var(--lift))}
  .q-vc:not(.q-vc--pop):not(.q-vc--sheet):hover .q-gal{box-shadow:var(--sh-2)}
}
.q-vc--pop,.q-vc--sheet{border-radius:var(--r-lg);box-shadow:var(--sh-pop-2)}
.q-vc--pop .q-gal{border-radius:var(--r-md)}
.q-vc-ph{border-radius:var(--r-md)}
.q-vc-x{box-shadow:var(--sh-1),inset 0 0 0 1px var(--line)}
/* map chrome */
.q-map-zm{border-radius:var(--r-md);box-shadow:var(--sh-card-1)}
.q-map-b{border-radius:var(--r-md);box-shadow:var(--sh-card-1)}
.q-map-pill{box-shadow:var(--sh-card-1);font-weight:600}
.q-pin-pr{box-shadow:var(--sh-card-1);transition:background-color var(--d-2),color var(--d-2),transform var(--d-2) var(--ease)}
.q-pin--price:hover .q-pin-pr{transform:translateY(-1px)}
.q-pin-lb{border-radius:var(--r-ctl)}
.q-pin-b{transition:background-color var(--d-2) var(--ease)}

/* ======================= restyle v3 palette (customer) — Accord LIGHT colours (CONVENTIONS «restyle v3 palette») ======================= */
.q-pin:hover .q-pin-b,.q-pin.hot .q-pin-b,.q-pin.on .q-pin-b{background:var(--q-pin-on)}
.q-pin-lb{box-shadow:inset 0 0 0 1.5px var(--q-pin-on)}
.q-pin-lb::after{border-top-color:var(--q-pin-on)}
.q-pin:focus-visible .q-pin-b{box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--ring-c)}
.q-pin--price:focus-visible .q-pin-pr{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--ring-c)}
.q-pin--price:hover .q-pin-pr,.q-pin--price.hot .q-pin-pr{background:var(--night);color:var(--on-night)}
.q-clu{background:var(--night);color:var(--on-night)}
.q-tb-fab.on .q-tb-fab-c{box-shadow:var(--q-fab-sh),0 0 0 3px var(--q-tb-bg),0 0 0 5px var(--q-pin-on)}
.q-btn--pri{background:var(--night);color:var(--on-night)}
.q-btn--pri:hover{background:var(--night-2)}


/* Qeychi — customer website shell + home, search, login (Fresha replica, RTL). Prefix s-.
   Numbers are Fresha's measured values (capture/out/home-*, search-*, auth-*). Mobile = @container ≤600px. */
:root{
  --s-glow-1:transparent; --s-glow-2:transparent; --s-hero-bg:var(--band);   /* restyle v3 palette: sage band, no lavender glows (dark keeps them) */
  --s-map-land:#e2efe8; --s-map-park:#c4e3d2; --s-map-blk:#eceee7; --s-map-water:#a9dbe2; --s-map-st:#d6d9cf; --s-map-hw:#b3c4bb; --s-map-lab:#45554e;
  --s-promo:var(--night);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --s-glow-1:#d5d3ff; --s-glow-2:#ffd7ff; --s-hero-bg:transparent; --s-promo:#0d0d0d;
  --s-map-land:#1d2026; --s-map-park:#1b3426; --s-map-blk:#262626; --s-map-water:#16324a; --s-map-st:#363b44; --s-map-hw:#56627a; --s-map-lab:#c9ccd1;
}}
:root[data-theme="dark"]{
  --s-glow-1:#d5d3ff; --s-glow-2:#ffd7ff; --s-hero-bg:transparent; --s-promo:#0d0d0d;
  --s-map-land:#1d2026; --s-map-park:#1b3426; --s-map-blk:#262626; --s-map-water:#16324a; --s-map-st:#363b44; --s-map-hw:#56627a; --s-map-lab:#c9ccd1;
}

/* ---------- primitives ---------- */
.s-page{position:relative;background:var(--bg);color:var(--ink);min-height:100%}
.s-page .av{display:inline-flex;border-radius:50%;overflow:hidden;background:var(--brand-soft);color:var(--brand);align-items:center;justify-content:center;flex:none}
.s-page .av img{width:100%;height:100%;object-fit:cover}
.s-page .av .ini{font-weight:600}
.s-page .vf{display:inline-flex;vertical-align:-2px;color:var(--brand)}
.s-page .vf .i{width:16px;height:16px}
.s-page .vf svg path:last-child{stroke:var(--bg);stroke-width:2;fill:none}
.s-page .noph{display:grid;place-items:center;background:var(--bg-3);color:var(--ink-3);width:100%;height:100%}
.s-page img{width:100%;height:100%;object-fit:cover}
.s-cover{position:absolute;inset:0;z-index:1;border-radius:inherit}
.s-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 19px;border-radius:999px;border:1px solid transparent;font:600 16px/22px var(--f);white-space:nowrap;color:var(--ink);background:transparent;text-decoration:none;flex:none}
.s-btn .i{width:24px;height:24px}
.s-btn--sec{background:var(--bg);border-color:var(--line-2)}
.s-btn--sec:hover{background:var(--bg-2)}
.s-btn--ghost:hover{background:var(--bg-3)}
.s-btn--pri{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.s-btn--pri:hover{opacity:.9}
.s-btn--sm{height:36px;padding:0 15px;font:500 14px/20px var(--f)}
.s-btn--sm .i{width:20px;height:20px}
.s-btn--full{width:100%}
.s-icb{width:48px;height:48px;border-radius:50%;display:inline-grid;place-items:center;color:var(--ink);flex:none}
.s-icb:hover:not(:disabled){background:var(--bg-3)}
.s-icb:disabled{color:var(--ink-3);cursor:default}
.s-icb .i{width:24px;height:24px}
/* back 1405-07-24: sBackBtn (44px target, 24px arrow, base.css focus ring); .s-hd-bk = the copy at the start of a header */
.s-bk{width:44px;height:44px}
.s-hd-bk{margin-inline-end:8px}
.s3-bh-l .s-hd-bk{margin-inline-end:-44px}
.s-link{color:var(--brand);font:500 14px/20px var(--f)}
.s-only-m{display:none}
.s-rt{display:inline-flex;align-items:center;gap:2px;font:600 13px/16px var(--f);color:var(--ink);flex:none}
.s-rt .i{width:14px;height:14px;color:var(--star)}
.s-rt--l{gap:4px;font:600 14px/20px var(--f)}
.s-rt--l .i{width:16px;height:16px}

/* ---------- header ---------- */
.s-hd{position:sticky;top:var(--hub-h);z-index:100;background:var(--bg);transition:box-shadow .2s,background .2s}
.s-hd--home{margin-bottom:-72px;background:transparent}
.s-hd--home.solid{background:var(--bg);box-shadow:0 1px 0 var(--line)}
.s-hd-in{display:grid;grid-template-columns:auto 1fr auto;align-items:center;height:72px;padding:12px 32px;max-width:1440px;margin:0 auto;position:relative}
.s-hd-l{display:flex;align-items:center;height:48px;position:relative;z-index:2}
.s-hd .logo{height:48px}
.s-hd-c{min-width:0}
.s-hd-r{display:flex;align-items:center;justify-content:flex-end;position:relative;z-index:2}
.s-hd-rd{display:flex;gap:12px;align-items:center}
.s-hd-me{padding:0 19px 0 8px;gap:8px}
.s-hd-av{position:relative;display:inline-flex}
.s-hd-av .av{width:40px;height:40px;border:1px solid var(--bg)}
.s-dot{position:absolute;top:-2px;right:-4px;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--brand);color:#fff;font:600 13px/20px var(--f);font-style:normal;text-align:center;box-shadow:0 0 0 2px var(--bg)}
.s-hd-burger,.s-hd-mav{display:none}
.s-hd-burger .i{width:32px;height:32px}
.s-hd-mav .av{width:32px;height:32px}
.s-menu-host{position:absolute;top:64px;left:32px;z-index:120}
.s-menu{width:320px;background:var(--bg);border-radius:16px;box-shadow:var(--sh-pop);padding:8px 0;display:flex;flex-direction:column}
.s-mn-h{font:600 14px/20px var(--f);color:var(--ink-2);padding:12px 20px 4px}
.s-mn-sep{border:0;border-top:1px solid var(--line);margin:8px 0}
.s-mn-i{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 20px;font:500 16px/22px var(--f);color:var(--ink);text-align:start;width:100%}
.s-mn-i:hover{background:var(--bg-2)}
.s-mn-i .i{width:20px;height:20px}
.s-mn-i span{flex:1}
.s-mn-biz{justify-content:space-between}
.s-mn-biz b{font-weight:600}
.s-msheet{display:flex;flex-direction:column;height:100%;background:var(--bg)}
.s-msheet-h{display:flex;align-items:center;justify-content:space-between;height:72px;padding:12px 20px;flex:none}
.s-menu--m{width:auto;box-shadow:none;border-radius:0;overflow:auto;flex:1}
.ov.s-ov-sheet{place-items:stretch;background:var(--bg)}
.ov.s-ov-sheet .mdl{width:100%;height:100%;max-height:100%;border-radius:0}

/* compact search bar (search + venue headers): 723×50, centred in the header */
.s-cb{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:723px;max-width:calc(100% - 480px);z-index:1}
.s-cb-f{display:flex;align-items:center;height:50px;background:var(--bg);border:1px solid var(--line);border-radius:100px;box-shadow:0 2px 4px 0 rgba(20,20,20,.12);overflow:hidden}
.s-cb-l{flex:1;min-width:0;height:48px;padding:0 16px;border-radius:100px;font:500 14px/20px var(--f);text-align:start;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.s-cb-l:hover{background:var(--bg-2)}
.s-cb-sep{width:1px;height:24px;background:var(--line);flex:none}
.s-cb-go{width:36px;height:36px;border-radius:18px;margin:6px;background:var(--ink);color:var(--on-ink);display:grid;place-items:center;flex:none}
.s-cb .s-pop-host{position:absolute;top:58px;right:0;left:0}
.s-cb[data-open="loc"] .s-pop{margin-right:224px}
.s-cb[data-open="time"] .s-pop{position:absolute;left:0}

/* ---------- big search (home) ---------- */
.s-big{position:relative;width:1148px;max-width:100%;padding:6px;border-radius:100px;box-shadow:inset 0 0 0 6px rgba(156,156,156,.08)}
.s-big.open{background:linear-gradient(90deg,#c7c2ff 0%,#efc1fb 55%,#f8b5f3 100%);box-shadow:none}
.s-big-f{display:flex;align-items:center;height:64px;background:var(--bg);border-radius:100px}
.s-big.open .s-big-f{background:var(--bg-3)}
.s-big-l{position:relative;flex:1;min-width:0;display:flex;align-items:center;gap:14px;height:64px;padding:0 16px;border-radius:100px;font:500 14px/20px var(--f);color:var(--ink);text-align:start}
.s-big-l .i{width:20px;height:20px;flex:none}
.s-big-l span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-big-l+.s-big-l::before{content:"";position:absolute;right:0;top:20px;height:24px;width:1px;background:var(--line)}
.s-big.open .s-big-l::before{display:none}
.s-big[data-open="treat"] [data-k="treat"],.s-big[data-open="loc"] [data-k="loc"],.s-big[data-open="time"] [data-k="time"]{background:var(--bg);box-shadow:var(--sh-pop)}
.s-big-go{margin:8px;height:48px}
.s-big .s-pop-host{position:absolute;top:calc(100% + 2px);right:6px;left:6px;z-index:99}
.s-big[data-open="loc"] .s-pop{margin-right:342px}
.s-big[data-open="time"] .s-pop{position:absolute;left:0}

/* ---------- popovers ---------- */
.s-pop{background:var(--bg);border-radius:16px;box-shadow:var(--sh-pop);text-align:start;color:var(--ink)}
.s-pop--treat{width:600px;max-height:464px;overflow:auto;padding:0 32px 32px;scrollbar-width:thin}
.s-pop--loc{width:427px;padding:12px 20px}
.s-pop--time{width:710px;padding:0 32px 32px}
.s-tp-head{position:sticky;top:0;z-index:2;background:var(--bg);padding:32px 0 12px;margin-bottom:-4px}
.s-tabs{display:flex;gap:8px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.s-tab{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(19,19,19,.1);font:500 14px/20px var(--f);color:var(--ink)}
:root[data-theme="dark"] .s-tab{box-shadow:inset 0 0 0 1px var(--line-2)}
.s-tab.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.s-cnt{font:600 13px/16px var(--f);font-style:normal;color:var(--ink-2);background:var(--bg-3);border-radius:999px;padding:2px 6px;min-width:20px;text-align:center}
.s-tp-sh{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0 4px;font:600 19px/24px var(--f)}
.s-tp-l{list-style:none;margin:0 -12px;padding:0}
.s-li{position:relative;display:flex;align-items:center;gap:8px;min-height:56px;padding:8px 12px;border-radius:8px}
.s-li:hover{background:var(--bg-2)}
.s-li-b{position:absolute;inset:0;z-index:1;border-radius:8px}
.s-li-ic{width:40px;height:40px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none;overflow:hidden;margin-inline-end:4px}
.s-li-ic .i{width:20px;height:20px}
.s-li-ic.sq{border-radius:8px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line)}
.s-li-ic .av{width:40px;height:40px}
.s-li-tx{flex:1;min-width:0;display:flex;flex-direction:column}
.s-li-tx b{font:500 16px/22px var(--f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-li-tx small{font:400 14px/20px var(--f);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-li-e{font:400 14px/20px var(--f);color:var(--ink-2);flex:none;min-width:64px;text-align:end}
.s-more{display:block;padding:8px 0;margin:-4px 0 4px}
.s-tm-top{display:flex;gap:32px;padding-top:32px}
.s-tm-days{display:flex;flex-direction:column;gap:24px;width:166px;flex:none;padding-top:8px}
.s-dcard,.s-scard{display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);background:var(--bg);color:var(--ink)}
.s-dcard{height:90px;padding:24px 20px}
.s-dcard b{font:500 16px/22px var(--f)}
.s-dcard small,.s-scard small{font:400 14px/20px var(--f);color:var(--ink-2)}
.s-dcard.on,.s-scard.on{background:var(--brand-soft-2);color:var(--brand);box-shadow:inset 0 0 0 2px var(--brand)}
.s-dcard.on small,.s-scard.on small{color:var(--brand)}
.s-cal{flex:1;position:relative}
.s-cal-h{display:flex;align-items:center;justify-content:space-between;height:48px;padding:0 5px}
.s-cal-h b{font:600 16px/22px var(--f)}
.s-cal-g{display:grid;grid-template-columns:repeat(7,1fr);column-gap:4px;margin-top:4px}
.s-cal-g abbr{height:44px;display:grid;place-items:center;font:400 14px/20px var(--f);color:var(--ink-2);text-decoration:none}
.s-cal-d{position:relative;height:44px;display:grid;place-items:center;font:500 14px/20px var(--f);color:var(--ink)}
.s-cal-d i{position:absolute;width:40px;height:40px;border-radius:50%;left:50%;top:2px;transform:translateX(-50%)}
.s-cal-d span{position:relative}
.s-cal-d:hover:not(:disabled) i{background:var(--bg-3)}
.s-cal-d.today i{box-shadow:inset 0 0 0 1px var(--ink-4)}
.s-cal-d.past{color:var(--ink-3);cursor:default}
.s-cal-d.sel{color:var(--on-ink)}
.s-cal-d.sel i{background:var(--ink)!important;box-shadow:none}
.s-tm-bot{display:flex;gap:12px;align-items:flex-start;border-top:1px solid var(--line);margin-top:20px;padding-top:24px}
.s-tm-lab{font:600 14px/20px var(--f);margin-top:20px;white-space:nowrap}
.s-tm-r{flex:1;min-width:0}
.s-tm-slots{display:flex;gap:8px;padding:0 24px}
.s-scard{height:60px;padding:12px 20px;flex:none}
.s-scard b{font:500 14px/20px var(--f);white-space:nowrap}
.s-scard small{font:400 13px/16px var(--f);white-space:nowrap}
.s-tm-cust{display:flex;align-items:center;gap:12px;margin-top:12px;padding:0 24px}
.s-tm-cust>span{font:400 14px/20px var(--f);color:var(--ink-2)}
.s-sel{position:relative;flex:1;display:flex;align-items:center;height:48px;border:1px solid var(--line-2);border-radius:12px;background:var(--bg)}
.s-sel select{appearance:none;-webkit-appearance:none;border:0;background:transparent;width:100%;height:100%;padding:0 16px;font:400 16px/22px var(--f);color:var(--ink);cursor:pointer}
.s-sel .i{position:absolute;left:16px;color:var(--ink-2);pointer-events:none}

/* mobile search sheet */
.s-sheet{display:flex;flex-direction:column;height:100%;background:var(--bg)}
.s-sheet-h{display:flex;align-items:center;justify-content:space-between;padding:8px;flex:none}
.s-sheet-h b{font:600 17px/24px var(--f)}
.s-sheet-h span{width:48px}
.s-sheet-f{display:flex;flex-direction:column;gap:12px;padding:4px 20px 12px;flex:none}
.s-sheet-l{display:flex;align-items:center;gap:14px;height:48px;padding:0 16px;border:1px solid var(--line-2);border-radius:12px;font:500 14px/20px var(--f);color:var(--ink);text-align:start}
.s-sheet-l.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.s-sheet-l .i{width:20px;height:20px}
.s-sheet-b{flex:1;overflow:auto;padding:0 20px}
.s-sheet-b .s-pop{width:auto;max-height:none;box-shadow:none;padding:0;border-radius:0}
.s-sheet-b .s-tp-head{padding-top:8px}
.s-sheet-b .s-tm-top{flex-direction:column;padding-top:12px;gap:16px}
.s-sheet-b .s-tm-days{flex-direction:row;width:auto;gap:12px;padding:0}
.s-sheet-b .s-dcard{flex:1;height:76px;padding:12px}
.s-sheet-b .s-tm-bot{flex-direction:column;gap:12px}
.s-sheet-b .s-tm-lab{margin:0}
.s-sheet-b .s-tm-slots{padding:0;flex-wrap:wrap}
.s-sheet-b .s-tm-cust{padding:0}
.s-sheet-ft{padding:12px 20px 20px;flex:none;border-top:1px solid var(--line)}

/* ---------- footer ---------- */
.s-ft{background:var(--bg-3)}
.s-ft-in{display:grid;grid-template-columns:repeat(5,227px);column-gap:64px;padding:64px 32px;max-width:1440px;margin:0 auto}
.s-ft-col{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.s-ft-brand{gap:48px}
.s-ft-brand .logo{height:22px}
.s-ft-h{font:600 16px/22px var(--f)}
.s-ft-col a{display:inline-flex;align-items:center;gap:12px;font:400 14px/20px var(--f);color:var(--ink)}
.s-ft-col a:hover span{text-decoration:underline}
.s-ft-col a .i{width:20px;height:20px}
.s-ft-brand .s-btn{align-self:flex-start;gap:8px}
.s-ft-brand .s-btn:hover span{text-decoration:none}
.s-ft-st{display:inline-flex}
.s-ft-st .i{width:24px;height:24px}
.s-ft-b{background:var(--bg)}
.s-ft-bi{display:flex;justify-content:space-between;align-items:center;padding:24px 32px;max-width:1440px;margin:0 auto}
.s-ft-lang{display:inline-flex;align-items:center;gap:4px;color:var(--brand);font:500 14px/20px var(--f)}
.s-ft-bi p{font:400 14px/20px var(--f);color:var(--ink-2)}

/* ---------- home ---------- */
.s-home{position:relative;overflow:hidden}
.s-glow{position:absolute;inset:0 0 auto 0;height:1950px;pointer-events:none;z-index:0;overflow:hidden}
.s-glow i{position:absolute;border-radius:50%;filter:blur(90px)}
.s-glow .g1{width:1100px;height:760px;top:-360px;left:22%;background:var(--s-glow-1)}
.s-glow .g2{width:1160px;height:560px;top:430px;left:8%;background:var(--s-glow-2);transform:rotate(-8deg)}
.s-glow .g3{width:520px;height:420px;top:120px;right:-180px;background:var(--s-glow-1);opacity:.55}
.s-home>*{position:relative;z-index:1}
.s-home>.s-glow{position:absolute;z-index:0}
.s-hero{z-index:5!important;display:flex;flex-direction:column;align-items:center;text-align:center;padding:184px 32px 0;max-width:1200px;margin:0 auto 112px;min-height:588px}
.s-hero-t{margin-bottom:64px}
.s-hero h1{font:700 64px/72px var(--f);letter-spacing:-.5px;max-width:960px}
.s-hero-t p{font:400 22px/32px var(--f);max-width:1100px}
.s-live{margin-top:44px;font:400 22px/28px var(--f)}
.s-cnt-n{font-weight:600}
.s-appbtn{margin-top:46px}
.s-gpw{display:none}
.s-secs{display:flex;flex-direction:column;gap:64px;margin-bottom:86px}
.s-sec{max-width:1440px;margin:0 auto;width:100%}
.s-h2{font:600 28px/36px var(--f);padding:0 32px;margin-bottom:24px}
.s-car{position:relative;padding:0 32px;margin:-24px 0}
.s-car-t{display:flex;gap:24px;overflow-x:auto;overflow-y:hidden;padding:24px 16px;margin:0 -16px;scrollbar-width:none;scroll-snap-type:x mandatory;scroll-padding:0 16px}
.s-car-t::-webkit-scrollbar{display:none}
.s-car-i{flex:none;width:322px;padding:2px;scroll-snap-align:start}
.s-car-b{position:absolute;z-index:3;top:107px;width:48px;height:48px;border-radius:50%;background:var(--bg);border:1px solid var(--line-2);display:grid;place-items:center;color:var(--ink)}
.s-car-b .i{width:24px;height:24px}
.s-car-next{left:8px}
.s-car-prev{right:8px}
.s-car-b[hidden]{display:none}
/* venue card */
.s-vc{position:relative}
.s-vc-im{height:212px;border-radius:16px;overflow:hidden;margin-bottom:8px;background:var(--bg-3)}
.s-vc-t{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.s-vc-n{font:600 16px/22px var(--f);min-width:0}
.s-vc-m{font:400 14px/20px var(--f);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-bdg{position:absolute;z-index:2;top:12px;right:12px;display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 12px;border-radius:999px;background:var(--glass);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 1px 6px 0 rgba(19,19,19,.12),0 0 0 1px rgba(19,19,19,.04);font:600 13px/16px var(--f);color:var(--ink);max-width:calc(100% - 60px);white-space:nowrap}
.s-bdg--ic{padding:0 8px 0 12px}
.s-bdg-i{display:inline-flex;font-style:normal}
.s-bdg-i .i{width:16px;height:16px}
.s-bdg-best{color:#a93ae8}
.s-bdg-recommended{color:var(--star)}
.s-heart{position:absolute;z-index:2;top:8px;left:8px;width:32px;height:32px;border-radius:50%;background:rgba(19,19,19,.33);color:#fff;display:grid;place-items:center}
.s-heart .i{width:20px;height:20px}
/* book again card */
.s-ba{position:relative;height:238px;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;display:flex;flex-direction:column;background:var(--bg)}
.s-ba-im{position:relative;height:120px;flex:none}
.s-ba-pin{position:absolute;top:40px;left:50%;transform:translateX(-50%);width:40px;height:40px;border-radius:50%;background:#403591;color:#fff;display:grid;place-items:center}
.s-ba-pin .i{width:16px;height:16px}
.s-ba-b{padding:12px 16px 16px;display:flex;flex-direction:column}
.s-ba-n{font:600 16px/22px var(--f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-ba-m{font:400 14px/20px var(--f);color:var(--ink-2);margin-bottom:12px}
.s-ba-btn{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:8px;height:36px;border-radius:999px;background:var(--bg-3);font:500 14px/20px var(--f);color:var(--ink)}
.s-ba-btn .i{width:20px;height:20px}
.s-car--ba .s-car-b{top:91px}
/* app band */
.s-app{padding:80px 40px;max-width:1440px;margin:0 auto}
.s-app-in{display:flex;gap:48px;padding:0 80px}
.s-app-t{flex:1;min-width:0}
.s-app-av{display:flex;align-items:center;gap:4px;font:600 14px/20px var(--f);margin-bottom:32px}
.s-app-av .i{width:24px;height:24px}
.s-app h2{font:700 68px/88px var(--f);margin-bottom:24px;letter-spacing:-.5px}
.s-app-p{font:400 24px/36px var(--f);margin-bottom:60px;max-width:569px}
.s-qr{display:inline-block;padding:20px;border:1px solid var(--line);border-radius:16px;background:#fff;color:#0d0d0d}
.s-qr-svg{display:block;width:106px;height:106px}
.s-gplay{display:none}
.s-app-ph{flex:1;display:flex;justify-content:flex-end;align-items:center;gap:30px}
.s-mock{position:relative;width:296px;height:641px;border-radius:28px;border:2px solid #d6d6d6;overflow:hidden;background:var(--bg);flex:none;display:flex;flex-direction:column;opacity:.55}
.s-mock--empty{width:242px;height:526px;border-color:var(--ink);opacity:1;background:transparent}
.s-mock-im{position:relative;height:210px;flex:none}
.s-mock-b{position:absolute;top:12px;width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.9);color:#0d0d0d;display:grid;place-items:center}
.s-mock-b .i{width:12px;height:12px}
.s-mock-b.l{right:10px}.s-mock-b.r{left:34px}.s-mock-b.r2{left:10px}
.s-mock-c{position:absolute;bottom:10px;left:10px;font:500 9px/14px var(--f);font-style:normal;background:rgba(19,19,19,.5);color:#fff;border-radius:999px;padding:0 6px}
.s-mock-bd{padding:16px 12px;font:400 10px/14px var(--f);color:var(--ink-2);display:flex;flex-direction:column;gap:9px;flex:1}
.s-mock-bd>b{font:600 19px/24px var(--f);color:var(--ink)}
.s-mock-i{display:flex;align-items:center;gap:6px}
.s-mock-i .i{width:13px;height:13px}
.s-mock-tabs{display:flex;gap:14px;margin-top:22px}
.s-mock-tabs i{font-style:normal;padding:2px 8px;border-radius:999px}
.s-mock-tabs i.on{background:var(--ink-2);color:var(--bg)}
.s-mock-st{font:600 16px/22px var(--f);color:var(--ink);margin-top:22px}
.s-mock-ft{display:flex;align-items:center;justify-content:space-between;padding:12px;border-top:1px solid var(--line);font:400 10px/14px var(--f);color:var(--ink-2)}
.s-mock-ft i{font-style:normal;background:var(--ink-2);color:var(--bg);border-radius:8px;padding:8px 16px;font-weight:600;font-size:12px}
/* reviews */
.s-sec--rv{margin-bottom:100px}
.s-car--rv .s-car-t{padding-top:0;padding-bottom:0;margin-top:24px;margin-bottom:24px;align-items:stretch}
.s-car--rv .s-car-b{top:201px}
.s-rv{height:402px;background:var(--bg-3);border-radius:16px;padding:32px;display:flex;flex-direction:column}
.s-rv-st{display:flex;gap:2px;margin-bottom:12px;color:var(--star)}
.s-rv-st .i{width:24px;height:24px}
.s-rv h3{font:600 19px/24px var(--f);margin-bottom:12px}
.s-rv p{font:400 16px/24px var(--f);flex:1;margin-bottom:24px}
.s-rv-who{display:grid;grid-template-columns:64px 1fr;gap:0 12px;align-items:center}
.s-rv-who .av{width:64px;height:64px}
.s-rv-who b{display:block;font:500 16px/22px var(--f)}
.s-rv-who small{display:block;font:400 14px/20px var(--f);color:var(--ink-2)}
/* stats */
.s-stats{padding:80px 32px 120px;text-align:center;max-width:1440px;margin:0 auto}
.s-stats h2{font:700 40px/52px var(--f);margin-bottom:12px}
.s-stats-p{font:500 24px/32px var(--f)}
.s-stats-big{padding:64px 0;display:flex;flex-direction:column;align-items:center}
.s-stats-big p{font:700 96px/112px var(--f)}
.s-stats-big div,.s-stats-g div div{font:500 24px/32px var(--f);margin-top:4px}
.s-stats-g{display:grid;grid-template-columns:repeat(3,316px);column-gap:16px;justify-content:center}
.s-stats-g>div{display:flex;flex-direction:column;align-items:center;gap:8px;padding-bottom:8px}
.s-stats-g p{font:700 40px/48px var(--f)}
/* business band */
.s-biz{position:relative;border-bottom:1px solid var(--line);overflow:hidden}
.s-biz-glow{position:absolute;width:900px;height:420px;left:-120px;bottom:-260px;border-radius:50%;background:radial-gradient(closest-side,rgba(214,255,90,.55),rgba(214,255,90,0));pointer-events:none}
.s-biz-in{position:relative;display:flex;gap:48px;padding:48px 32px 24px;max-width:1440px;margin:0 auto;min-height:727px}
.s-biz-t{width:600px;flex:none}
.s-biz h2{font:700 68px/88px var(--f);padding-bottom:16px;letter-spacing:-.5px}
.s-biz-t>p{font:400 24px/36px var(--f);margin-bottom:32px}
.s-biz-t>.s-btn{margin-bottom:180px}
.s-exc-h{font:600 28px/36px var(--f);margin-bottom:8px}
.s-exc-st{display:flex;gap:2px;color:var(--star);margin-bottom:12px}
.s-exc-st .i{width:24px;height:24px}
.s-exc-p{font:400 14px/20px var(--f)}
.s-exc-p b{font-weight:800;letter-spacing:-.3px}
.s-biz-im{flex:1;position:relative;min-width:0}
.s-bm{position:absolute;top:24px;left:-40px;width:820px;height:560px;border-radius:14px;background:#fff;box-shadow:0 10px 40px rgba(19,19,19,.15);display:flex;overflow:hidden;font:400 10px/14px var(--f);color:#0d0d0d}
.s-bm-side{width:44px;background:#0d0d0d;display:flex;flex-direction:column;align-items:center;gap:18px;padding-top:14px}
.s-bm-side b{color:#fff;font:800 14px/18px var(--f)}
.s-bm-side i{width:14px;height:14px;border:1.5px solid #8a8a8a;border-radius:4px}
.s-bm-main{flex:1;display:flex;flex-direction:column}
.s-bm-top{display:flex;gap:10px;align-items:center;padding:12px 14px;border-bottom:1px solid #e5e5e5}
.s-bm-top span{border:1px solid #d3d3d3;border-radius:999px;padding:3px 10px;font-weight:600}
.s-bm-top .s-bm-today{background:#f2f2f2;border-color:#f2f2f2}
.s-bm-heads{display:grid;grid-template-columns:repeat(4,1fr);padding:10px 0;border-bottom:1px solid #e5e5e5;margin-right:40px}
.s-bm-heads span{display:flex;justify-content:center}
.s-bm-heads .av{width:34px;height:34px;box-shadow:0 0 0 2px #fff,0 0 0 3px #e5e5e5}
.s-bm-grid{flex:1;display:grid;grid-template-columns:repeat(4,1fr);margin-right:40px;background:repeating-linear-gradient(#fff 0 45px,#eee 45px 46px)}
.s-bm-col{position:relative;border-left:1px solid #e5e5e5}
.s-bm-ev{position:absolute;left:4px;right:4px;border-radius:6px;padding:4px 6px;display:flex;flex-direction:column;overflow:hidden}
.s-bm-ev b{font-weight:700}
.s-e1{background:#a5dcf6}.s-e2{background:#f7a6c7}.s-e3{background:#ffcc80}.s-e4{background:#7fd8cf}
.s-bm-ph{position:absolute;bottom:-2px;right:-30px;width:150px;height:250px;border-radius:16px;border:3px solid #0d0d0d;background:#fff;overflow:hidden;display:flex;flex-direction:column;gap:2px;padding-bottom:8px}
.s-bm-phim{height:120px}
.s-bm-ph b{font:700 11px/14px var(--f);padding:6px 8px 0}
.s-bm-ph small{font:400 8px/12px var(--f);padding:0 8px;color:#555}
/* cities + category pills */
.s-sec--city{padding:80px 32px}
.s-sec--city .s-h2{padding:0}
.s-cityp{display:flex;gap:8px;margin-bottom:24px;overflow-x:auto;scrollbar-width:none}
.s-cityp::-webkit-scrollbar{display:none}
.s-cpill{flex:none;padding:8px 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font:500 16px/22px var(--f);color:var(--ink)}
.s-cpill.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.s-car--city{padding:0;margin:0}
.s-car--city .s-car-t{padding:0;margin:0;gap:0}
.s-car--city .s-car-i{width:291px;padding:0 0 0 64px}
.s-car--city .s-car-b{top:115px}
.s-cityc{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.s-cityc h3{font:600 16px/22px var(--f);margin-bottom:1px}
.s-cityc a{font:400 14px/20px var(--f);color:var(--ink);white-space:nowrap}
.s-cityc a:hover{text-decoration:underline}
.s-catp{padding:0 32px 80px;max-width:1440px;margin:0 auto}
.s-car--pills{padding:0;margin:0}
.s-car--pills .s-car-t{gap:8px;padding:0;margin:0}
.s-car--pills .s-car-i{width:auto;padding:0}
.s-car--pills .s-car-b{top:-6px}

/* ---------- search results (owner's ref4): filter bar · results grid (right) · map (left, shared qMap) ---------- */
.s-sr{--sr-top:calc(var(--hub-h) + 72px);--sr-bar:72px}
.s-sr-bar{position:sticky;top:var(--sr-top);z-index:50;background:var(--bg);box-shadow:0 1px 0 var(--line)}
.s-sr-bar-in{display:flex;align-items:center;gap:8px;height:var(--sr-bar);padding:0 24px;max-width:1440px;margin:0 auto;overflow-x:auto;scrollbar-width:none}
.s-sr-bar-in::-webkit-scrollbar{display:none}
.s-sr-q{display:flex;align-items:center;gap:8px;height:44px;width:290px;flex:none;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg);color:var(--ink-2)}
.s-sr-q .i{width:20px;height:20px;flex:none}
.s-sr-q input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;font:400 14px/20px var(--f);color:var(--ink)}
.s-sr-q input::placeholder{color:var(--ink-3)}
.s-sr-q:focus-within{box-shadow:inset 0 0 0 2px var(--ink)}
.s-sr-tg{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 14px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg);font:500 14px/20px var(--f);color:var(--ink);white-space:nowrap;flex:none}
.s-sr-tg .i{width:18px;height:18px}
.s-sr-tg:hover{background:var(--bg-2)}
.s-sr-tg[aria-pressed="true"]{background:var(--ink);color:var(--on-ink);box-shadow:none}
.s-sr-clear{height:40px;padding:0 10px;font:500 14px/20px var(--f);color:var(--ink);text-decoration:underline;text-underline-offset:3px;white-space:nowrap;flex:none}
.s-sr-clear:disabled{color:var(--ink-3);text-decoration:none;cursor:default}
.s-sr-body{display:grid;grid-template-columns:minmax(0,44%) minmax(0,1fr);gap:24px;align-items:start;max-width:1440px;margin:0 auto;padding:0 24px}
.s-sr-list{min-width:0;padding:20px 0 40px}
.s-sr-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px}
.s-sr-head h1{font:600 24px/32px var(--f)}
.s-sr-head p{font:400 14px/20px var(--f);color:var(--ink-2)}
.s-sr-ha{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.s-sr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:32px 20px}
.s-sr-grid .q-gal{transition:box-shadow .15s}
.s-sr-grid .q-vc.hot .q-gal{box-shadow:0 0 0 2px var(--line-2)}
.s-sr-grid .q-vc.sel .q-gal{box-shadow:0 0 0 2px var(--ink)}
.s-sr-map{position:sticky;top:calc(var(--sr-top) + var(--sr-bar) + 16px);height:calc(100vh - var(--hub-h) - 72px - var(--sr-bar) - 32px);height:calc(100dvh - var(--hub-h) - 72px - var(--sr-bar) - 32px);min-height:420px;margin:16px 0;border-radius:16px;overflow:hidden;box-shadow:var(--sh-card)}
.s-sr-map .q-map{background:var(--s-map-land);--q-ctl-top:auto}
.s-sr-map .q-map-ctl{top:auto;bottom:16px}
.s-sr-full{position:absolute;z-index:5;top:16px;inset-inline-end:16px}
.s-sr-listbtn{position:absolute;z-index:5;top:16px;inset-inline-start:16px}
.s-sr-mapnote{position:absolute;z-index:2;bottom:8px;left:50%;transform:translateX(-50%);padding:2px 10px;border-radius:999px;background:var(--glass);font:400 11px/16px var(--f);color:var(--ink-2);white-space:nowrap;pointer-events:none}
.s-sr[data-view="list"] .s-sr-body,.s-sr[data-view="map"] .s-sr-body{grid-template-columns:minmax(0,1fr)}
.s-sr[data-view="list"] .s-sr-map{display:none}
.s-sr[data-view="list"] .s-sr-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.s-sr[data-view="map"] .s-sr-list{display:none}
.s-sr-mapbtn{display:none}
@container (max-width:900px){
  .s-sr-bar-in{padding:0 16px}
  .s-sr-q{width:220px}
  .s-sr-body{grid-template-columns:minmax(0,1fr);padding:0 16px}
  .s-sr-map,.s-sr-full{display:none}
  .s-sr-map .q-map-ctl{top:16px;bottom:auto}
  .s-sr[data-view="map"] .s-sr-map{display:block;position:relative;top:0;height:calc(100dvh - var(--hub-h) - 72px - var(--sr-bar));min-height:520px;margin:0 -16px;border-radius:0;box-shadow:none}
  .s-sr-mapbtn{position:sticky;bottom:24px;z-index:40;display:flex;align-items:center;gap:8px;width:max-content;height:48px;margin:-24px auto 24px;padding:0 20px;border-radius:999px;background:var(--ink);color:var(--on-ink);font:600 15px/20px var(--f);box-shadow:var(--sh-pop)}
  .s-sr-mapbtn .i{width:20px;height:20px}
  .s-sr[data-view="map"] .s-sr-mapbtn{display:none}
  .s-sr .q-map-pop{left:12px!important;right:12px;top:auto!important;bottom:12px;transform:none!important}
  .s-sr .q-map-pop .q-vc--pop{width:auto}
  .s-sr .q-map-pop .q-gal{aspect-ratio:16/7}
  .s-sr-head h1{font-size:20px;line-height:28px}
}
.s-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:120px 0 40px}
.s-empty .i{width:48px;height:48px;color:var(--brand);margin-bottom:24px}
.s-empty h3{font:600 19px/24px var(--f)}
.s-empty p{font:400 16px/22px var(--f);color:var(--ink-2);margin:4px 0 24px}
.s-map-svg{position:absolute;inset:0;width:100%;height:100%}
.s-map-lab{font:500 15px var(--f);fill:var(--s-map-lab)}

/* ---------- login ---------- */
.s-au{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - var(--hub-h))}
.s-au-l{position:relative;padding:24px 32px}
.s-au-back{position:absolute;top:12px;right:20px}
.s-au-c{max-width:448px;margin:72px auto 0}
.s-au-hd{text-align:center;margin-bottom:28px}
.s-au-hd h1{font:600 24px/32px var(--f);margin-bottom:2px}
.s-au-hd p{font:400 16px/22px var(--f);color:var(--ink-2)}
.s-fld{margin-bottom:24px}
.s-lab{display:block;font:600 14px/20px var(--f);margin-bottom:6px}
.s-inp{display:flex;align-items:center;height:48px;width:100%;border:1px solid var(--line-2);border-radius:12px;padding:0 16px;font:400 16px/22px var(--f);background:var(--bg);color:var(--ink)}
.s-inp:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.s-ph-row{display:flex;gap:8px}
.s-cc{width:64px;flex:none}
.s-hint{font:400 13px/16px var(--f);color:var(--ink-2);margin-top:6px}
.s-au-email,.s-au-c.m-email .s-au-phone{display:none}
.s-au-c.m-email .s-au-email{display:block}
.s-or{display:flex;align-items:center;gap:12px;margin:20px 0;color:var(--ink-3);font:400 13px/16px var(--f)}
.s-or::before,.s-or::after{content:"";flex:1;height:1px;background:var(--line)}
.s-au-alts{display:flex;flex-direction:column;gap:12px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.s-au-alt>.i,.s-au-alt .s-gico{position:absolute;right:20px;top:50%;transform:translateY(-50%);display:flex}
.s-au-alt .i{width:24px;height:24px}
.s-au-biz{display:flex;flex-direction:column;align-items:center;gap:6px;padding-top:24px;font:600 14px/20px var(--f)}
.s-au-biz .s-link{font-weight:400}
.s-au-ph{position:relative;background:var(--bg-3);overflow:hidden}
.s-au-ph img{position:absolute;inset:0}
.s-otp{display:flex;gap:8px;justify-content:center;margin-bottom:24px}
.s-otp-i{width:52px;height:56px;border:1px solid var(--line-2);border-radius:12px;text-align:center;font:600 22px/28px var(--f);background:var(--bg);color:var(--ink)}
.s-otp-i:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.s-au-help{text-align:center;margin-top:16px;font:400 14px/20px var(--f);color:var(--ink-2)}

/* ---------- narrow (≤600: mobile web and inside the phone app) ---------- */
@container (max-width:600px){
  .s-only-d{display:none}
  .s-only-m{display:inline}
  .s-hd-in{padding:12px 20px}
  .s-hd-rd,.s-hd-c{display:none}
  .s-hd-burger,.s-hd-mav{display:grid;place-items:center}
  .s-hd--page,.s-hd--search{display:none}
  .s-car-b{display:none!important}
  .s-glow .g1{width:560px;height:520px;top:-160px;left:-120px}
  .s-glow .g2{width:560px;height:520px;top:420px;left:-140px}
  .s-glow .g3{display:none}
  .s-hero{padding:136px 20px 0;margin-bottom:56px;min-height:0;text-align:start;align-items:stretch}
  .s-hero-t{padding-inline-start:8px;margin-bottom:40px}
  .s-hero h1{font:700 40px/50px var(--f);margin-bottom:12px}
  .s-hero-t p{font:400 16px/24px var(--f)}
  .s-big{padding:6px;border-radius:20px}
  .s-big.open{background:none}
  .s-big-f{flex-direction:column;align-items:stretch;height:auto;border-radius:16px;padding:16px}
  .s-big-l{height:48px;flex:none;border:1px solid var(--line-2);border-radius:12px;margin-bottom:12px}
  .s-big-l+.s-big-l::before{display:none}
  .s-big-go{margin:4px 0 0;width:100%}
  .s-live{margin-top:16px;font:400 16px/22px var(--f);text-align:center}
  .s-appbtn{margin-top:52px;align-self:center}
  .s-gpw{display:block;padding:0 20px 40px}
  .s-gp{position:relative;display:flex;height:136px;border-radius:12px;padding:20px;background:var(--s-promo);overflow:hidden;color:#fff}
  .s-gp-t{display:flex;flex-direction:column;justify-content:space-between;gap:16px;max-width:150px;position:relative;z-index:1}
  .s-gp-t p{font:600 22px/28px var(--f)}
  .s-gp-t span{display:flex;align-items:center;gap:8px;font:600 16px/22px var(--f)}
  .s-gp-t .i{width:24px;height:24px}
  .s-gp-art{position:absolute;left:0;top:0;width:173px;height:136px}
  .s-gp-card{position:absolute;left:34px;top:30px;width:104px;height:70px;border-radius:10px;background:#ffcd1c;transform:rotate(-12deg);display:grid;place-items:center;color:#8e3fd1;box-shadow:0 6px 14px rgba(0,0,0,.3)}
  .s-gp-card .i{width:36px;height:36px}
  .s-gp-hand{position:absolute;left:-6px;top:78px;width:70px;height:60px;border-radius:30px 30px 0 0;background:#e9b48f;transform:rotate(-20deg)}
  .s-gp-art b{position:absolute;color:#ffcd1c;font-size:14px}
  .s-gp-s1{left:140px;top:16px}.s-gp-s2{left:24px;top:22px;color:#b07de6!important}.s-gp-s3{left:150px;top:96px}
  .s-secs{gap:40px;margin-bottom:0}
  .s-h2{font:600 22px/28px var(--f);padding:0 20px;margin-bottom:12px}
  .s-car{padding:0;margin:-12px 0 -8px}
  .s-car-t{gap:16px;padding:24px 20px;margin:0;scroll-padding:0 20px}
  .s-car-i{width:240px}
  .s-vc-im{height:157px}
  .s-app{padding:56px 20px 40px}
  .s-app-in{flex-direction:column;padding:0;gap:40px}
  .s-app-av{margin-bottom:24px}
  .s-app h2{font:700 40px/52px var(--f);margin-bottom:16px}
  .s-app-p{font:400 16px/24px var(--f);margin-bottom:24px}
  .s-qr{display:none}
  .s-gplay{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 12px;border-radius:8px;background:#000;color:#fff;border:1px solid #a6a6a6}
  .s-gplay .i{width:26px;height:26px}
  .s-gplay span{display:flex;flex-direction:column;line-height:1}
  .s-gplay small{font:500 9px/12px var(--f)}
  .s-gplay b{font:600 18px/20px var(--f);direction:ltr}
  .s-app-ph{justify-content:flex-start;gap:30px}
  .s-mock{width:176px;height:380px;opacity:1}
  .s-mock--empty{width:144px;height:312px}
  .s-sec--rv{margin-bottom:40px}
  .s-car--rv .s-car-i{width:300px}
  .s-car--rv .s-car-t{margin:12px 0}
  .s-rv{height:auto;min-height:402px}
  .s-stats{padding:24px 20px 40px}
  .s-stats h2{font:600 26px/36px var(--f);margin-bottom:12px}
  .s-stats-p{font:400 16px/22px var(--f)}
  .s-stats-big{padding:36px 0 20px}
  .s-stats-big p,.s-stats-g p{font:600 22px/32px var(--f)}
  .s-stats-big div,.s-stats-g div div{font:400 16px/22px var(--f);margin-top:0}
  .s-stats-g{grid-template-columns:1fr;row-gap:36px}
  .s-biz-in{flex-direction:column;padding:0 20px;min-height:0;gap:56px}
  .s-biz-t{width:auto}
  .s-biz h2{font:700 40px/52px var(--f);padding-bottom:16px}
  .s-biz-t>p{font:400 16px/24px var(--f);margin-bottom:24px}
  .s-biz-t>.s-btn{margin-bottom:20px}
  .s-exc-h{font:600 22px/28px var(--f);margin-bottom:4px}
  .s-biz-im{height:270px}
  .s-biz-im{margin:0 -20px}
  .s-bm{top:0;left:auto;right:75px;width:520px;height:270px}
  .s-bm-ph{right:25px;left:auto;bottom:-4px;width:120px;height:170px}
  .s-bm-phim{height:80px}
  .s-sec--city{padding:56px 20px 40px}
  .s-car--city .s-car-t{padding:0;margin:0}
  .s-car--city .s-car-i{width:282px;padding:0 0 0 24px}
  .s-catp{padding:0 20px 40px}
  .s-car--pills .s-car-t{padding:0;margin:0}
  .s-ft-in{grid-template-columns:1fr;row-gap:32px;padding:32px 20px}
  .s-ft-brand{gap:24px}
  .s-ft-bi{padding:24px 20px}
  .s-au{grid-template-columns:1fr;min-height:0}
  .s-au-ph{display:none}
  .s-au-l{padding:12px 20px 40px}
  .s-au-back{position:static;margin:0 -12px 0 0}
  .s-au-c{margin-top:8px}
  .s-au-hd{margin-bottom:24px}
  .s-au-c.m-auto .s-au-phone{display:none}
  .s-au-c.m-auto .s-au-email{display:block}
  .s-au-c.m-auto .s-au-em{display:none}
}
.s-sheet-b .s-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
@container (max-width:600px){.s-gpw--in{padding:0 20px}}
@container (max-width:600px){.s-car--ba .s-car-i{width:282px}}

/* =====================================================================================================================
   DROPDOWN / PICKER / SHEET LAYER (site dropdown pass 1405-07-24, capture/web-dd). Shared by site, site2, site3.
   ===================================================================================================================== */
/* sDd(): Fresha's menu list — popover (desktop) / bottom sheet (≤600) */
.s-ddl{position:fixed;inset:0;z-index:870;pointer-events:none}
.s-dd{position:fixed;pointer-events:auto;min-width:200px;max-width:min(360px,calc(100vw - 16px));max-height:min(520px,calc(100vh - 32px));overflow:auto;background:var(--bg);color:var(--ink);border-radius:16px;box-shadow:var(--sh-pop);padding:8px 0;scrollbar-width:thin;animation:fq-fade .12s ease}
.s-dd-l{display:flex;flex-direction:column}
.s-dd-i{display:flex;align-items:center;gap:12px;min-height:40px;padding:8px 20px;font:400 14px/20px var(--f);color:var(--ink);text-align:start;width:100%}
.s-dd-i:hover,.s-dd-i:focus-visible{background:var(--bg-2);outline:0}
.s-dd-i:focus-visible{box-shadow:inset 0 0 0 2px var(--brand)}
.s-dd-i>span{flex:1;min-width:0;display:flex;flex-direction:column}
.s-dd-i small{font:400 13px/16px var(--f);color:var(--ink-2)}
.s-dd-i>.i{width:20px;height:20px}
.s-dd-i>.i:last-child{color:var(--ink)}
.s-dd-i:disabled{color:var(--ink-3);cursor:default}
.s-dd-h{padding:12px 20px 4px;font:600 13px/16px var(--f);color:var(--ink-2)}
.s-dd-hr{border:0;border-top:1px solid var(--line);margin:8px 0}
.s-ddl--sheet{pointer-events:auto}
.s-ddl-scrim{position:absolute;inset:0;background:var(--scrim);animation:fq-fade .2s ease}
.s-ddl--sheet .s-dd{position:absolute;left:0;right:0;bottom:0;top:auto;max-width:none;max-height:85%;border-radius:32px 32px 0 0;padding:0 0 24px;box-shadow:var(--sh-pop);animation:s-up .22s ease}
.s-dd-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 8px 4px 8px;position:sticky;top:0;background:var(--bg);z-index:1}
.s-dd-top b{font:600 20px/28px var(--f);padding-inline-start:12px}
.s-ddl--sheet .s-dd-i{min-height:48px;padding:12px 20px;font:400 16px/22px var(--f)}
.s-ddl--sheet .s-dd-i>.i:last-child{width:24px;height:24px}
@keyframes s-up{from{transform:translateY(40px);opacity:0}}

/* sModal(): Fresha's dialog — 720px card, radius 32, padding 48 (desktop) / bottom sheet radius 32 (≤600) */
.ov.s-md{padding:32px;place-items:center}
.s-md .mdl{width:720px;max-width:100%;max-height:100%;display:flex;flex-direction:column;overflow:hidden;border-radius:32px;box-shadow:var(--sh-pop);background:var(--bg)}
.s-md-h{display:flex;align-items:center;gap:12px;padding:28px 48px 12px;flex:none}
.s-md-t{flex:1;min-width:0}
.s-md-h h2{font:600 22px/28px var(--f)}
.s-md-h p{font:400 14px/20px var(--f);color:var(--ink-2);margin-top:4px}
.s-md-x{margin-inline-end:-12px}
.s-md-back{margin-inline-start:-12px}
.s-md-b{flex:1;min-height:0;overflow:auto;padding:4px 48px 32px;scrollbar-width:thin}
.s-md-f{display:flex;gap:12px;padding:16px 48px 32px;border-top:1px solid var(--line);flex:none;background:var(--bg)}
.s-md-f>.s-btn{flex:1}
.s-md-h3{font:600 20px/28px var(--f);margin:24px 0 16px}
.s-md-h3:first-child{margin-top:8px}
/* stacked header (✕ on its own row, big title under it): language, option pickers, professional lists */
.s-md--stack .s-md-h{flex-wrap:wrap;padding-top:24px}
.s-md--stack .s-md-t{order:2;flex-basis:100%;padding-top:8px}
.s-md--stack .s-md-h h2{font:600 28px/36px var(--f)}
.s-md--stack .s-md-x{order:1;margin-inline-start:auto}
.s-md--stack .s-md-back{order:0}
@container (max-width:600px){
  .ov.s-md{padding:0;place-items:end stretch}
  .s-md .mdl{width:100%;max-height:calc(100% - 22px);border-radius:32px 32px 0 0;animation:s-up .22s ease}
  .s-md-h{padding:20px 20px 8px}
  .s-md-h h2{font:600 20px/28px var(--f)}
  .s-md--stack .s-md-h h2{font:600 24px/32px var(--f)}
  .s-md-b{padding:4px 20px 24px}
  .s-md-f{padding:16px 20px 20px}
  .s-md--full .mdl{max-height:100%;height:100%;border-radius:0}
}

/* ---------- big search bar with typable fields (home; and the expanded header bar) ---------- */
.s-big-l input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;font:500 14px/20px var(--f);color:var(--ink);padding:0;text-overflow:ellipsis}
.s-big-l input::placeholder{color:var(--ink);opacity:1}
label.s-big-l{cursor:text}
.s-big-x{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--bg-3);color:var(--ink);margin-inline-start:-6px}
.s-big-x[hidden]{display:none}
.s-big-x .i{width:16px;height:16px}
.s-big[data-open="treat"] [data-k="treat"] .s-big-x,.s-big[data-open="loc"] [data-k="loc"] .s-big-x{background:var(--bg-2)}
.s-hl{background:var(--brand-soft);color:inherit;border-radius:2px}
.s-tp-q .s-li-tx b{font-weight:400}
.s-tp-none{padding:24px 0;font:400 14px/20px var(--f);color:var(--ink-2)}
.s-li-pin{color:var(--brand)}
.s-li-pin .i{width:20px;height:20px}
.s-tp-loc .s-li-tx b{font:500 14px/20px var(--f)}
.s-tp-loc .s-li-tx small{font:400 13px/16px var(--f)}
.s-pop--loc{max-height:464px;overflow:auto}
/* header: the compact bar expands into the full bar (Fresha's search / venue header) */
.s-big--hd{display:none}
.s-hd.xp .s-hd-in{height:90px}
.s-hd.xp .s-cb{display:none}
.s-hd.xp .s-big--hd{display:block;position:absolute;top:13px;left:50%;transform:translateX(-50%);width:1024px;max-width:calc(100% - 420px);z-index:3;padding:0;box-shadow:none;border-radius:100px}
.s-big--hd .s-big-f{box-shadow:0 2px 4px 0 rgba(20,20,20,.12),inset 0 0 0 1px var(--line)}
.s-big--hd.open{background:none}
.s-big--hd .s-pop-host{top:calc(100% + 12px);right:0;left:0}
.s-big--hd[data-open="loc"] .s-pop{margin-right:300px}
.s-hd.xp{box-shadow:0 1px 0 var(--line)}

/* ---------- phone: one full-screen sheet per search field + the results page's search summary ---------- */
.ov.s-ov-fs .mdl{display:flex;flex-direction:column}
.s-fs{display:flex;flex-direction:column;height:100%;background:var(--bg)}
.s-fs-h{display:flex;align-items:center;padding:12px 8px 0;flex:none}
.s-fs-h--x{justify-content:space-between}
.s-fs-t{font:600 28px/36px var(--f);padding:6px 20px 0;flex:none}
.s-fs-top{display:flex;flex-direction:column;gap:12px;padding:28px 20px 8px;flex:none}
.s-fs-in{display:flex;align-items:center;gap:16px;height:48px;padding:0 16px;border:1px solid var(--line-2);border-radius:12px;color:var(--ink-2)}
.s-fs-in:focus-within{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.s-fs-in input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;font:400 14px/20px var(--f);color:var(--ink)}
.s-fs-in input::placeholder{color:var(--ink);opacity:1}
.s-fs-in .s-big-x{background:none}
.s-fs-b{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:0 20px 16px}
.s-fs-b .s-tp-head{padding:4px 0 12px;margin:0}
.s-fs-b .s-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -20px;padding:0 20px}
.s-fs-b .s-tabs::-webkit-scrollbar{display:none}
.s-fs-b .s-tab{flex:none}
.s-fs-b .s-tm-top{flex-direction:column;padding-top:12px;gap:40px}
.s-fs-b .s-tm-days{flex-direction:row;width:auto;gap:9px;padding:0 8px}
.s-fs-b .s-dcard{flex:1;height:90px;padding:12px}
.s-fs-b .s-tm-bot{flex-direction:column;gap:12px;border-top:0;margin-top:16px;padding-top:12px}
.s-fs-b .s-tm-lab{margin:0}
.s-fs-b .s-tm-slots{margin:0 -20px;padding:0 20px;overflow-x:auto;scrollbar-width:none}
.s-fs-b .s-tm-slots::-webkit-scrollbar{display:none}
.s-fs-b .s-tm-cust{padding:0}
.s-fs-f{display:flex;gap:12px;padding:16px;border-top:1px solid var(--line);flex:none}
.s-fs-f .s-btn{flex:1}
.s-sum-l{display:flex;align-items:center;gap:16px;height:48px;padding:0 16px;border:1px solid var(--line-2);border-radius:12px;font:400 14px/20px var(--f);color:var(--ink);text-align:start}
.s-sum-l .i{width:20px;height:20px;color:var(--ink-2)}
.s-sum-l span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-fs--sum .s-fs-top{padding-bottom:24px}

/* ---------- header menu (Fresha: «For customers» popover 240px / phone: full grey page with white cards) ---------- */
.s-menu{width:240px;padding:20px 0 8px}
.s-menu .s-mn-h{font:600 18px/24px var(--f);color:var(--ink);padding:0 20px 8px}
.s-menu .s-mn-i{min-height:40px;padding:0 20px;font:400 14px/20px var(--f)}
.s-menu .s-mn-sep{margin:8px 20px}
.s-menu .s-mn-biz b{font-weight:600}
.s-mn-brand{color:var(--brand)!important}
.ov.s-ov-menu .mdl{background:var(--bg-2)}
.s-ov-menu .s-msheet{background:var(--bg-2)}
.s-msheet-h{height:auto;padding:12px 12px 0 12px}
.s-msheet-x{background:var(--bg-3)}
.s-menu--m{background:transparent;padding:0 20px 24px;display:flex;flex-direction:column;gap:16px}
.s-mn-t{font:600 28px/36px var(--f);padding:12px 0 16px}
.s-mn-card{background:var(--bg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);padding:8px 0;display:flex;flex-direction:column}
.s-menu--m .s-mn-i{min-height:48px;padding:0 20px;font:400 16px/22px var(--f)}
.s-menu--m .s-mn-i>.i:last-child{width:20px;height:20px}
.s-menu--m .s-mn-biz{min-height:72px}
.s-menu--m .s-mn-biz .i{width:24px;height:24px}

/* ---------- «تغییر زبان» cards ---------- */
.s-lang-g{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.s-lang-c{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-height:68px;padding:12px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line);background:var(--bg);text-align:start;color:var(--ink)}
.s-lang-c:hover{background:var(--bg-2)}
.s-lang-c b{font:600 16px/22px var(--f)}
.s-lang-c span{font:400 16px/22px var(--f);color:var(--ink-2)}
.s-lang-c.on{box-shadow:inset 0 0 0 2px var(--brand)}
@container (max-width:600px){
  .s-lang-g{grid-template-columns:repeat(2,1fr);gap:16px}
  .s-lang-c b,.s-lang-c span{font-size:14px;line-height:20px}
}

/* ---------- results page: Fresha's toolbar, day strip, professional cards, phone pill ---------- */
.s-seg{display:inline-flex;align-items:center;height:36px;border-radius:999px;background:var(--bg-3);box-shadow:inset 0 0 0 1px var(--line);flex:none}
.s-seg button{height:36px;padding:0 12px;border-radius:999px;font:500 14px/20px var(--f);color:var(--ink);white-space:nowrap}
.s-seg button[aria-selected="true"]{background:var(--bg);box-shadow:inset 0 0 0 1px var(--line-2)}
.s-seg--full{display:flex;width:100%;height:34px}
.s-seg--full button{flex:1;height:34px}
.s-sr-tb{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.s-sr-tba{display:flex;align-items:center;gap:12px}
.s-sr-tb .s-btn--sm{gap:8px}
.s-sr-tmb{display:none!important}
.s-sr-fn{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--ink);color:var(--on-ink);font:600 12px/20px var(--f);font-style:normal}
.s-days{position:relative;margin:0 0 24px;box-shadow:inset 0 -1px 0 var(--line)}
.s-days-t{display:flex;align-items:center;gap:24px;overflow-x:auto;scrollbar-width:none}
.s-days-t::-webkit-scrollbar{display:none}
.s-day{position:relative;flex:none;display:inline-flex;align-items:center;gap:6px;height:44px;font:400 14px/20px var(--f);color:var(--ink-2);white-space:nowrap}
.s-day .i{width:18px;height:18px}
.s-day:hover{color:var(--ink)}
.s-day.on{color:var(--ink);font-weight:600}
.s-day.on::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--ink);border-radius:2px}
.s-days-sep{width:1px;height:24px;background:var(--line);flex:none}
.s-day--pick{color:var(--ink)}
.s-sr-grid--pro{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:40px 32px}
.s-prc{display:flex;flex-direction:column;gap:12px;min-width:0}
.s-prc-h{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}
.s-prc-av{position:relative;flex:none;width:120px;height:120px;margin-inline-end:4px}
.s-prc-av .av{width:120px;height:120px}
.s-prc-rt{position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 10px;border-radius:999px;background:var(--bg);box-shadow:var(--sh-small);font:600 14px/20px var(--f)}
.s-prc-rt .i{width:16px;height:16px;color:var(--star)}
.s-prc-t{flex:1;min-width:0;padding-top:24px}
.s-prc-t h3{font:600 20px/28px var(--f);margin-bottom:4px}
.s-prc-t p{font:400 14px/20px var(--f);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-prc-t p+p{margin-top:4px}
.s-prc-sv{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.s-prc-sv a{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px;border-radius:12px;background:var(--bg-2);color:var(--ink)}
.s-prc-sv a:hover{background:var(--bg-3)}
.s-prc-sv span{display:flex;flex-direction:column;min-width:0}
.s-prc-sv b{font:400 14px/20px var(--f)}
.s-prc-sv small{font:400 14px/20px var(--f);color:var(--ink-2)}
.s-prc-sv em{font:400 14px/20px var(--f);font-style:normal;white-space:nowrap}
.s-prc-more{align-self:flex-start;margin-top:4px}
.s-sr-pill{display:none}
@container (max-width:600px){
  .s-page--search .s-hd{display:none}
  .s-sr{--sr-top:var(--hub-h)}
  .s-sr-pill{display:flex;align-items:center;gap:4px;height:64px;margin:20px 20px 12px;padding:0 8px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line),var(--sh-small);background:var(--bg)}
  .s-sr-pill-t{flex:1;min-width:0;display:flex;flex-direction:column;text-align:start;color:var(--ink)}
  .s-sr-pill-t b{font:600 16px/22px var(--f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .s-sr-pill-t small{font:400 14px/20px var(--f);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .s-sr-pill-m{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink);flex:none}
  .s-sr-pill-m .i{width:22px;height:22px}
  .s-sr-tmb{display:inline-flex!important;width:36px;padding:0}
  .s-sr-flt{width:52px;padding:0}
  .s-sr-flt span,.s-sr-hide{display:none!important}
  .s-sr-flt .s-sr-fn{position:absolute;top:-4px;left:-4px}
  .s-days{margin:0 -16px 16px;padding:0 16px}
  .s-sr-grid--pro{grid-template-columns:1fr}
  .s-prc-av,.s-prc-av .av{width:96px;height:96px}
  .s-prc-t{padding-top:14px}
}

/* ---------- «فیلترها» modal parts + the phone time sheet ---------- */
.s-md--flt .s-md-b{padding-top:16px}
.s-fs-sec{padding:24px 0;border-top:1px solid var(--line)}
.s-seg--full+.s-fs-sec{border-top:0;padding-top:20px}
.s-fs-sec h3{font:600 16px/22px var(--f);margin-bottom:16px}
.s-fs-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
.s-fs-row h3{margin:0}
.s-fs-pv{font:400 16px/22px var(--f);color:var(--ink-2)}
.s-sortc{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.s-sortc-i{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;height:96px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);font:400 14px/20px var(--f);color:var(--ink);background:var(--bg)}
.s-sortc-i .i{width:20px;height:20px}
.s-sortc-i:hover{background:var(--bg-2)}
.s-sortc-i.on{background:var(--brand-soft);box-shadow:inset 0 0 0 2px var(--brand);color:var(--brand)}
.s-range{-webkit-appearance:none;appearance:none;width:100%;height:24px;margin:0 0 20px;background:transparent;cursor:pointer;--p:100%}
.s-range::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(to left,var(--brand) var(--p),var(--line) var(--p))}
.s-range::-moz-range-track{height:4px;border-radius:2px;background:linear-gradient(to left,var(--brand) var(--p),var(--line) var(--p))}
.s-range::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;margin-top:-10px;border-radius:50%;background:var(--bg);box-shadow:0 0 0 1px var(--line-2),var(--sh-small)}
.s-range::-moz-range-thumb{width:24px;height:24px;border:0;border-radius:50%;background:var(--bg);box-shadow:0 0 0 1px var(--line-2),var(--sh-small)}
.s-range:focus-visible{outline:0}
.s-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--brand)}
.s-fs-sw{display:flex;align-items:center;gap:12px}
.s-fs-swi .i{width:24px;height:24px;color:var(--ink)}
.s-fs-swt{flex:1;min-width:0;display:flex;flex-direction:column}
.s-fs-swt b{font:400 16px/22px var(--f)}
.s-fs-swt small{font:400 13px/16px var(--f);color:var(--ink-2)}
.s-tg{position:relative;width:44px;height:24px;border-radius:999px;background:var(--line-2);flex:none;transition:background .15s}
.s-tg i{position:absolute;top:2px;inset-inline-start:2px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:inset-inline-start .15s}
.s-tg[aria-checked="true"]{background:var(--brand)}
.s-tg[aria-checked="true"] i{inset-inline-start:22px}
.s-fchips{display:flex;flex-wrap:wrap;gap:8px}
.s-fchip{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 15px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg);font:500 14px/20px var(--f);color:var(--ink);white-space:nowrap}
.s-fchip .i{width:20px;height:20px}
.s-fchip:hover{background:var(--bg-2)}
.s-fchip.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.s-fchip .s-cnt{background:none;color:var(--ink-2);font-weight:500;box-shadow:inset 0 0 0 1px var(--line)}
.s-fchip.on .s-cnt{color:var(--on-ink);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.s-slot-g{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.s-slot-g .s-scard{height:64px}
.s-slot-g .s-scard--custom{grid-column:1/-1}
.s-md--slot .s-tm-cust{padding:0;margin-top:16px}
.s-md--slot .s-md-b{padding-top:12px}
@container (max-width:600px){
  .s-fs-sec{padding:20px 0}
  .s-fchip{padding:0 12px}
}
@container (min-width:1400px){.s-big[data-open="time"]:not(.s-big--hd) .s-pop{left:-134px}}

/* full-screen layer on every width (the photo viewer above the gallery dialog) — review 1405-07-24 */
.s-ddl--full{pointer-events:auto}
.s-ddl--full .s-ddl-scrim{background:rgba(0,0,0,.96)}
.s-ddl--full .s-dd{inset:0;max-width:none;max-height:none;border-radius:0;background:transparent;box-shadow:none;padding:0;color:#fff;overflow:hidden}

/* responsive footer (review 1405-07-24): Fresha's five 227px columns shrink, then wrap to three with the logo row */
@container (min-width:601px) and (max-width:1439px){
  .s-ft-in{grid-template-columns:repeat(5,minmax(0,227px));column-gap:clamp(24px,4cqw,64px)}
}
@container (min-width:601px) and (max-width:1023px){
  .s-ft-in{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:40px;padding:48px 32px}
  .s-ft-brand{grid-column:1/-1}
}

/* ======================= restyle v3 (customer website) — form only, colours unchanged ======================= */
/* buttons: 12px radius (48px), 10px (36px), eased states */
.s-btn{border-radius:var(--r-btn);transition:background-color var(--d-2) var(--ease),border-color var(--d-2),box-shadow var(--d-2),opacity var(--d-2),transform var(--d-1)}
.s-btn--sm{border-radius:var(--r-ctl)}
.s-btn--sec:hover{background:var(--bg-2);border-color:var(--ink-3)}
.s-btn--pri:hover{opacity:1;background:color-mix(in srgb,var(--ink) 86%,var(--bg));border-color:transparent}
.s-btn:active:not(:disabled){transform:translateY(1px)}
.s-icb{border-radius:var(--r-ctl);transition:background-color var(--d-2)}
.s-icb:hover:not(:disabled){background:var(--hover-tint)}
.s-link{font-weight:600}
.s-link:hover{text-decoration:underline;text-underline-offset:3px}
/* header + compact search */
.s-hd{transition:box-shadow var(--d-3) var(--ease),background-color var(--d-2)}
.s-hd--home.solid,.s-hd.xp{box-shadow:0 1px 0 var(--line),0 8px 24px -20px rgba(13,13,13,.45)}
.s-cb-f{border-color:var(--line);box-shadow:var(--sh-1);transition:box-shadow var(--d-3) var(--ease),border-color var(--d-2)}
.s-cb-f:hover{border-color:var(--line-2);box-shadow:var(--sh-2)}
.s-cb-l{font-weight:500;transition:background-color var(--d-2)}
.s-cb-go,.s-big-go{transition:transform var(--d-2) var(--ease),background-color var(--d-2)}
.s-cb-go:hover{transform:scale(1.05)}
.s-big-f{box-shadow:var(--sh-1),inset 0 0 0 1px var(--line)}
.s-big-l{transition:background-color var(--d-2),box-shadow var(--d-2)}
.s-big-l:hover{background:var(--bg-2)}
.s-big--hd .s-big-f{box-shadow:var(--sh-1),inset 0 0 0 1px var(--line)}
.s-hd-me{border-radius:var(--r-pill)}
/* popovers, menus, dropdown list layer */
.s-pop,.s-menu,.s-dd{border-radius:var(--r-card);box-shadow:var(--sh-pop-2)}
.s-dd{padding:6px}
.s-dd-i{border-radius:var(--r-sm);padding-inline:14px;transition:background-color var(--d-1)}
.s-dd-h{padding-inline:14px}
.s-dd-hr{margin:6px 2px}
.s-ddl--sheet .s-dd{border-radius:var(--r-xl) var(--r-xl) 0 0;padding:0 6px 24px}
.s-menu{padding-inline:6px}
.s-mn-i{border-radius:var(--r-sm);transition:background-color var(--d-1)}
.s-menu .s-mn-i{padding:0 14px}
.s-menu .s-mn-h{padding-inline:14px}
.s-menu .s-mn-sep{margin-inline:14px}
.s-li,.s-li-b{border-radius:var(--r-ctl)}
.s-li{transition:background-color var(--d-1)}
.s-li-ic{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 14%,transparent)}
.s-li-ic.sq{border-radius:var(--r-ctl)}
.s-tp-sh{font-weight:650;letter-spacing:var(--tr-head)}
/* chips / tabs */
.s-tab,.s-cpill,.s-fchip,.s-sr-tg{transition:background-color var(--d-2) var(--ease),box-shadow var(--d-2),color var(--d-2)}
.s-tab:hover:not(.on),.s-cpill:hover:not(.on){background:var(--bg-2)}
.s-tab,.s-fchip{font-weight:500}
.s-cnt{font-weight:600}
.s-seg{height:38px;padding:3px;border-radius:var(--r-ctl);background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
.s-seg button{height:30px;border-radius:7px;font-weight:600;font-size:var(--t-sm);color:var(--ink-2);transition:background-color var(--d-2),color var(--d-2),box-shadow var(--d-2)}
.s-seg button:hover{color:var(--ink)}
.s-seg button[aria-selected="true"]{background:var(--bg);color:var(--ink);box-shadow:var(--sh-seg)}
.s-seg--full{height:38px}.s-seg--full button{height:30px}
.s-day{transition:color var(--d-2)}
.s-day.on::after{height:2px;border-radius:2px}
/* date / slot cards, calendar */
.s-dcard,.s-scard{border-radius:var(--r-md);box-shadow:var(--sh-card-1);transition:box-shadow var(--d-2),background-color var(--d-2)}
.s-dcard:hover:not(.on),.s-scard:hover:not(.on){box-shadow:inset 0 0 0 1px var(--line-2),var(--sh-1)}
.s-dcard.on,.s-scard.on{box-shadow:var(--sh-card-on)}
.s-cal-h b{font-weight:650;letter-spacing:var(--tr-head)}
.s-sortc-i{border-radius:var(--r-md);transition:background-color var(--d-2),box-shadow var(--d-2)}
.s-tg{transition:background-color var(--d-2)}
.s-tg i{transition:inset-inline-start var(--d-3) var(--ease-spring)}
/* inputs: 10px radius, hover border, focus = brand border + soft ring */
.s-inp,.s-sel,.s-sheet-l,.s-fs-in,.s-sum-l{border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.s-inp:hover,.s-sel:hover,.s-fs-in:hover{border-color:var(--ink-3)}
.s-inp:focus,.s-otp-i:focus{border-color:var(--brand);box-shadow:var(--ring)}
.s-fs-in:focus-within{border-color:var(--brand);box-shadow:var(--ring)}
.s-sel:focus-within{border-color:var(--brand);box-shadow:var(--ring)}
.s-otp-i{border-radius:var(--r-ctl)}
.s-lab{font-weight:600;font-size:var(--t-sm)}
.s-sr-q{transition:box-shadow var(--d-2)}
.s-sr-q:focus-within{box-shadow:inset 0 0 0 1px var(--brand),var(--ring)}
/* modals */
.s-md .mdl{border-radius:var(--r-xl);box-shadow:var(--sh-3);animation:s-rv-in .32s var(--ease)}
@keyframes s-rv-in{from{opacity:0;transform:translateY(14px) scale(.98)}}
.s-md-h h2,.s-md--stack .s-md-h h2,.s-fs-t,.s-mn-t{font-weight:700;letter-spacing:var(--tr-head)}
/* typography rhythm: large tight headings, small quiet labels */
.s-hero h1{letter-spacing:-.02em;line-height:1.15}
.s-h2,.s-sr-head h1,.s-au-hd h1,.s-stats h2,.s-exc-h,.s-empty h3{font-weight:700;letter-spacing:var(--tr-head)}
.s-app h2,.s-biz h2{letter-spacing:-.02em}
.s-stats-big p,.s-stats-g p{letter-spacing:var(--tr-fig)}
.s-sr-head p,.s-vc-m{letter-spacing:var(--tr-label)}
/* cards on the home page */
.s-vc{transition:transform var(--d-3) var(--ease)}
.s-vc-im{border-radius:var(--r-card);transition:box-shadow var(--d-3) var(--ease)}
.s-vc-n,.s-ba-n{font-weight:650;letter-spacing:var(--tr-head)}
.s-ba{border-radius:var(--r-card);box-shadow:var(--sh-card-1);transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease)}
.s-ba-btn{border-radius:var(--r-ctl)}
.s-rv{border-radius:var(--r-card);box-shadow:inset 0 0 0 1px var(--line)}
.s-car-b{box-shadow:var(--sh-1);border-color:var(--line);transition:background-color var(--d-2),transform var(--d-2) var(--ease)}
.s-car-b:hover{background:var(--bg-2)}
@media (hover:hover){
  .s-vc:hover{transform:translateY(var(--lift))}
  .s-vc:hover .s-vc-im{box-shadow:var(--sh-2)}
  .s-ba:hover{transform:translateY(var(--lift));box-shadow:var(--sh-card-h)}
}
.s-bdg{font-weight:600;letter-spacing:var(--tr-label);box-shadow:var(--sh-1)}
.s-prc-sv a{border-radius:var(--r-md);transition:background-color var(--d-2)}
.s-prc-t h3{font-weight:650;letter-spacing:var(--tr-head)}
.s-prc-rt{box-shadow:var(--sh-card-1)}
.s-lang-c{border-radius:var(--r-ctl);transition:background-color var(--d-2),box-shadow var(--d-2)}
.s-mn-card{border-radius:var(--r-card);box-shadow:var(--sh-card-1)}
/* results */
.s-sr-map{border-radius:var(--r-card);box-shadow:var(--sh-card-1)}
.s-sr-bar{box-shadow:0 1px 0 var(--line),0 8px 20px -20px rgba(13,13,13,.4)}
.s-sr-mapbtn{box-shadow:var(--sh-pop-2)}
.s-sr-pill{box-shadow:var(--sh-card-1)}
.s-ft-h{font-weight:650;letter-spacing:var(--tr-head)}
@container (max-width:600px){
  .s-sr-pill{box-shadow:var(--sh-card-1)}
  .s-big-l{border-radius:var(--r-ctl)}
  .s-big-f{border-radius:var(--r-lg)}
  .s-md .mdl{border-radius:var(--r-xl) var(--r-xl) 0 0;animation:s-up .28s var(--ease)}
  .s-md--full .mdl{border-radius:0}
  .s-gp{border-radius:var(--r-card)}
}

/* ======================= restyle v3 palette (customer) — Accord LIGHT colours (CONVENTIONS «restyle v3 palette») =======================
   Light = Accord; every literal that had to change got a local token whose dark value is the old one, so dark mode is unchanged. */
:root{--s-canvas:var(--page);--s-top:var(--band);--s-top-home:var(--band);--s-big-open:var(--band-2);--s-best:var(--accent-deep);--s-pin-ph:var(--night);--s-biz-g:rgba(18,160,121,.30);--s-gp-ic:#0b7658;--s-gp-s2:#12a079}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--s-canvas:var(--bg);--s-top:var(--bg);--s-top-home:transparent;--s-big-open:linear-gradient(90deg,#c7c2ff 0%,#efc1fb 55%,#f8b5f3 100%);--s-best:#a93ae8;--s-pin-ph:#403591;--s-biz-g:rgba(214,255,90,.55);--s-gp-ic:#8e3fd1;--s-gp-s2:#b07de6}}
:root[data-theme="dark"]{--s-canvas:var(--bg);--s-top:var(--bg);--s-top-home:transparent;--s-big-open:linear-gradient(90deg,#c7c2ff 0%,#efc1fb 55%,#f8b5f3 100%);--s-best:#a93ae8;--s-pin-ph:#403591;--s-biz-g:rgba(214,255,90,.55);--s-gp-ic:#8e3fd1;--s-gp-s2:#b07de6}
.s-page{background:var(--s-canvas)}
/* sage band: top bar (sticky), search filter bar and the home hero are one surface */
.s-hd,.s-hd--home.solid,.s-sr-bar{background:var(--s-top)}
.s-hd--home{background:var(--s-top-home)}
.s-hero::before{content:"";position:absolute;z-index:-1;top:0;bottom:-56px;left:50%;width:100vw;transform:translateX(-50%);background:var(--s-hero-bg);pointer-events:none}
.s-big.open{background:var(--s-big-open)}
.s-dot{background:var(--sel);color:var(--on-sel)}
.s-bdg-best{color:var(--s-best)}
.s-ba-pin{background:var(--s-pin-ph);color:var(--on-night)}
.s-biz-glow{background:radial-gradient(closest-side,var(--s-biz-g),transparent)}
.s-sr-tg[aria-pressed="true"],.s-fchip.on{background:var(--night);color:var(--on-night)}
.s-sr-q:focus-within{box-shadow:inset 0 0 0 1px var(--accent),var(--ring)}
.s-hl{background:var(--accent-soft)}
@container (max-width:600px){
  .s-gp-card{color:var(--s-gp-ic)} .s-gp-s2{color:var(--s-gp-s2)!important}
  .s-hero::before{bottom:-32px}
}
@container (max-width:600px){.s-sr{background:linear-gradient(var(--s-top),var(--s-top)) 0 0/100% 96px no-repeat}}


/* site2 — venue page, professional page, booking flow, gift card (Fresha 1:1, mirrored for RTL).
   Measurements from capture/out venue-*, pro-*, book*-*, giftcard-*. Desktop = Fresha 1440 layout,
   @container (max-width:600px) = Fresha mobile web / app layout. */
:root{
  --s2-dot:#78d240; --s2-cnt:rgba(19,19,19,.05);
  --s2-side-sh:0 4px 12px 0 rgba(19,19,19,.08),0 2px 6px 2px rgba(19,19,19,.02);
  --s2-map-l:#f2efe9; --s2-map-w:#8ed8ec; --s2-map-p:#cdebc4; --s2-map-mi:#ffffff; --s2-map-ro:#ffffff; --s2-map-tx:#8a8a8a;
  --s2-gift:#191f21; --s2-surf:#ffffff; --s2-ring:rgba(19,19,19,.1);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --s2-cnt:rgba(255,255,255,.08); --s2-side-sh:0 0 0 0 transparent; --s2-surf:#181818; --s2-ring:rgba(255,255,255,.1);
  --s2-map-l:#1e2224; --s2-map-w:#0e2b38; --s2-map-p:#1b3022; --s2-map-mi:#2a2f33; --s2-map-ro:#3a4147; --s2-map-tx:#8a8f93;
}}
:root[data-theme="dark"]{
  --s2-cnt:rgba(255,255,255,.08); --s2-side-sh:0 0 0 0 transparent; --s2-surf:#181818; --s2-ring:rgba(255,255,255,.1);
  --s2-map-l:#1e2224; --s2-map-w:#0e2b38; --s2-map-p:#1b3022; --s2-map-mi:#2a2f33; --s2-map-ro:#3a4147; --s2-map-tx:#8a8f93;
}

/* ---------- base ---------- */
.s2{--s2-top:var(--hub-h,0px);--s2-fade:var(--bg);font-family:var(--f);color:var(--ink);background:var(--bg);font-size:16px;line-height:22px}
[data-shell="phone"] .s2{--s2-top:0px}
.s2 ul,.s2 ol{list-style:none;margin:0;padding:0}
.s2 h1,.s2 h2,.s2 h3,.s2 h4,.s2 p,.s2 dl,.s2 dd{margin:0}
.s2 button{font:inherit;color:inherit;text-align:inherit}
@container (min-width:601px){.s2 .s2-m,.s2.s2-m,.mdl .s2-m{display:none!important}}
@container (max-width:600px){.s2 .s2-d,.mdl .s2-d{display:none!important}}
.s2-mut{color:var(--ink-2)}
.s2-ok{color:var(--ok)}
.s2-bad{color:var(--bad)}
.s2-lnk,.s2 .s2-lnk{color:var(--brand);font-weight:500}
.s2-dot{font-style:normal;color:var(--ink-2);padding:0 8px;font-size:12px}
.s2-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 19px;border-radius:999px;border:1px solid var(--line-2);background:var(--s2-surf);color:var(--ink);font:600 16px/22px var(--f);white-space:nowrap;cursor:pointer;flex:none}
.s2 .s2-btn{text-align:center}
.s2-btn .i{width:16px;height:16px}
.s2-btn.s2-pri{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}
.s2-btn:disabled{opacity:.4;cursor:default}
.s2-btn.s2-sm{height:36px;padding:0 15px;font-size:14px;font-weight:500;line-height:20px}
.s2-btn.s2-full{width:100%}
.s2-cb{width:48px;height:48px;border-radius:50%;border:1px solid var(--line-2);background:var(--s2-surf);color:var(--ink);display:inline-grid;place-items:center;flex:none;cursor:pointer}
.s2-cb .i{width:24px;height:24px}
.s2-cb.s2-cb36{width:36px;height:36px}
.s2-cb.s2-cb36 .i{width:20px;height:20px}
.s2-cb.on .i path{fill:currentColor}
.s2-sh{box-shadow:var(--sh-pop)}
.s2-vf{display:inline-flex;width:20px;height:20px;color:var(--brand);flex:none;vertical-align:middle}
.s2-vf svg{width:100%;height:100%}
.s2-vf.s2-vf32{width:32px;height:32px}
.s2-vf.s2-vf24{width:24px;height:24px}
.s2-st{display:inline-flex;gap:2px;color:var(--star)}
.s2-st .i{width:16px;height:16px}
.s2-st.s2-st14 .i{width:14px;height:14px}
.s2-rt{display:inline-flex;align-items:center;gap:4px;font:400 16px/22px var(--f);white-space:nowrap}
.s2-rt b{font-weight:600}
.s2-rt>.i.st{width:16px;height:16px;color:var(--star)}
.s2-m5{font-weight:500}
.s2-hr{border:0;border-top:1px solid var(--line);margin:20px 0}
.s2-hr0{border:0;border-top:1px solid var(--line);margin:0}
.s2-av{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;background:var(--brand-soft);border:1px solid var(--brand-soft);color:var(--brand);flex:none;vertical-align:middle}
.s2-av img{width:100%;height:100%;object-fit:cover}
.s2-ini{font-weight:600;color:var(--brand);white-space:nowrap}
.s2-av120{width:120px;height:120px}.s2-av120 .s2-ini{font-size:36px;line-height:48px}
.s2-av192{width:192px;height:192px}.s2-av192 .s2-ini{font-size:56px;line-height:64px}
.s2-av80{width:80px;height:80px}.s2-av80 .s2-ini{font-size:28px;line-height:36px}.s2-av80 .i{width:32px;height:32px}
.s2-av64{width:64px;height:64px}.s2-av64 .s2-ini{font-size:22px;line-height:28px}
.s2-av40{width:40px;height:40px}.s2-av40 .s2-ini{font-size:14px}.s2-av40 .i{width:20px;height:20px}
.s2-av28{width:28px;height:28px;box-shadow:0 0 0 2px var(--bg)}.s2-av28 .s2-ini{font-size:9px;line-height:12px}.s2-av28 .i{width:14px;height:14px}
.s2-av24{width:24px;height:24px;box-shadow:0 0 0 2px var(--bg)}.s2-av24 .s2-ini{font-size:8px;line-height:12px}
.s2-any{background:var(--brand-soft);color:var(--brand)}
.s2-rp{position:absolute;top:98px;left:50%;transform:translateX(-50%);height:30px;padding:4px 8px;display:inline-flex;align-items:center;gap:4px;background:var(--s2-surf);border:1px solid var(--brand-soft-2);border-radius:999px;font:600 14px/20px var(--f);white-space:nowrap;color:var(--ink)}
.s2-rp .i{width:16px;height:16px;color:var(--star)}
.s2-cbadge{display:inline-flex;align-items:center;height:20px;padding:0 6px;border-radius:999px;background:var(--bg);color:var(--ink-2);font:500 13px/16px var(--f);box-shadow:0 0 0 1px var(--line),0 0 0 2px var(--bg)}

/* chips row (venue services, booking categories) */
.s2-chips{position:relative;display:flex;align-items:center;margin-bottom:24px}
.s2-chips ul{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;flex:1;padding-inline-end:46px}
.s2-chips ul::-webkit-scrollbar{display:none}
.s2-chips li{flex:none}
.s2-chips li button{display:flex;align-items:center;height:36px;padding:0 16px;border-radius:999px;font:500 14px/20px var(--f);white-space:nowrap;box-shadow:inset 0 0 0 1px var(--s2-ring);max-width:232px;overflow:hidden;text-overflow:ellipsis}
.s2-chips li button.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.s2-chip-more{position:absolute;top:0;inset-inline-end:0;width:64px;height:36px;display:flex;justify-content:flex-end;background:linear-gradient(to left,var(--s2-fade) 45%,transparent)}

/* ---------- VENUE ---------- */
.s2-ven{position:relative}
.s2-top{max-width:1440px;margin:0 auto;padding:16px 32px 0}
.s2-brc ol{display:flex;align-items:center;gap:8px;padding-bottom:16px;margin-bottom:12px;overflow-x:auto;scrollbar-width:none;white-space:nowrap;font:400 14px/20px var(--f);color:var(--ink-2)}
.s2-brc ol::-webkit-scrollbar{display:none}
.s2-brc li{display:flex;align-items:center;gap:8px;flex:none}
.s2-brc li+li::before{content:"•";font-size:10px;line-height:20px;color:var(--ink-2)}
.s2-brc li span{color:var(--ink)}
.s2-vh{position:relative}
.s2-vh h1{display:flex;align-items:center;gap:4px;font:700 48px/52px var(--f);max-width:calc(100% - 128px)}
.s2-vh-r{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;margin-top:-16px;min-height:48px}
.s2-vh-l{display:flex;align-items:center;flex-wrap:wrap;font:400 16px/22px var(--f)}
.s2-vh-l>.s2-lnk{margin-inline-start:12px}
.s2-acts{display:flex;gap:16px}
.s2-gal-d{position:relative;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:243px 243px;gap:24px;max-width:1440px;margin:0 auto;padding:24px 32px 0}
.s2-gal-d>button{position:relative;border-radius:16px;overflow:hidden;background:var(--bg-3)}
.s2-gal-d>button img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s2-gal-d .g0{grid-column:span 2;grid-row:span 2}
.s2-gal-d .s2-allimg{position:absolute;bottom:24px;inset-inline-end:56px;border-color:var(--line)}
.s2-stab-w{position:sticky;top:var(--s2-top);height:0;z-index:60}
.s2-stab{position:absolute;top:0;left:0;right:0;height:52px;background:var(--bg);border-bottom:1px solid var(--line);padding:0 64px;opacity:0;pointer-events:none;transition:opacity .2s}
.s2-stab.show{opacity:1;pointer-events:auto}
.s2-stab ul{display:flex;gap:24px;height:52px;align-items:center;max-width:1376px;margin:0 auto}
.s2-stab button{position:relative;height:52px;font:500 14px/20px var(--f);color:var(--ink-2)}
.s2-stab button.on{color:var(--ink)}
.s2-stab button.on::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--ink)}
.s2-cols{display:flex;justify-content:space-between;gap:40px;max-width:1440px;margin:0 auto;padding:0 32px}
.s2-main{flex:1;min-width:0;max-width:884px;padding-bottom:64px}
.s2-side{width:440px;flex:none}
.s2-card{position:sticky;top:calc(var(--s2-top) + 76px);margin:64px 0 24px;background:var(--s2-surf);border-radius:16px;box-shadow:var(--s2-side-sh),inset 0 0 0 1px var(--line);overflow:hidden}
.s2-card-a{padding:32px}
.s2-card-b{display:flex;flex-direction:column;gap:16px;padding:32px}
.s2-open{display:inline-flex;align-items:center;gap:8px;font:400 16px/22px var(--f);align-self:flex-start}
.s2-open .i{width:24px;height:24px}
.s2-open .i:last-child{width:20px;height:20px}
.s2-open .s2-mut{color:var(--ink)}
.s2-open[aria-expanded="true"] .i:last-child{transform:rotate(180deg)}
.s2-hours-c{padding-inline-start:32px}
.s2-addr{display:flex;gap:8px;font:400 16px/22px var(--f)}
.s2-addr .i{width:24px;height:24px}
.s2-sec{padding-top:64px}
.s2-sec h2{font:600 24px/32px var(--f);margin-bottom:24px}
.s2-sh2{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:24px}
.s2-sh2 h2{margin:0}
.s2-hc{display:flex;align-items:center;gap:8px}
.s2-sclist{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}
.s2-sc{display:flex;align-items:center;gap:16px;padding:20px 24px;border-radius:16px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer}
.s2-sc-t{flex:1;min-width:0}
.s2-sc h3{font:500 16px/22px var(--f)}
.s2-sc h4{font:400 14px/20px var(--f);color:var(--ink-2)}
.s2-sc p{font:600 14px/20px var(--f);margin-top:12px}
.s2-team{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 24px;margin-bottom:24px}
.s2-tm{display:flex;flex-direction:column;align-items:center;gap:2px;width:120px;text-align:center}
.s2 .s2-tm{text-align:center}
.s2-tm-a{position:relative;margin-bottom:14px}
.s2-tm b{font:500 16px/22px var(--f);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s2-tm>span:last-child{font:400 14px/20px var(--f);color:var(--ink-2);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s2-best{display:flex;flex-direction:column;align-items:center;text-align:center;padding-bottom:24px;margin-bottom:24px;border-bottom:1px solid var(--line)}
.s2-best-n{display:flex;align-items:center;gap:12px;height:88px;margin-bottom:8px}
.s2-best-n>span:not(.s2-tro){font:700 68px/68px var(--f)}
.s2-best-t{font:600 19px/24px var(--f)}
.s2-best p:last-child{margin-top:4px}
.s2-tro{position:relative;width:35px;height:88px;color:#a259f5}
.s2-tro svg{position:absolute}
.s2-tro .t{top:26px;left:0;width:35px;height:36px;color:#b57af7}
.s2-tro .a,.s2-tro .b{left:24px;width:16px;height:16px;color:#9b45f0}
.s2-tro .a{top:4px}.s2-tro .b{top:67px}
.s2-tro.r .a,.s2-tro.r .b{left:-5px}
.s2-sum2{display:flex;flex-direction:column;gap:12px;padding-bottom:24px;margin-bottom:24px;border-bottom:1px solid var(--line)}
.s2-ai{display:flex;align-items:center;gap:6px;font:400 14px/20px var(--f);color:var(--ink-2)}
.s2-avs{display:flex;padding:0 4px}
.s2-avs .s2-av+.s2-av{margin-inline-start:-8px}
.s2-rvs{display:grid;grid-template-columns:1fr 1fr;gap:40px 48px;margin-bottom:24px}
.s2-rv{display:flex;flex-direction:column;gap:12px;min-width:0}
.s2-rv-h{display:flex;align-items:center;gap:12px}
.s2-rv-h p{font:500 16px/22px var(--f);margin-bottom:4px}
.s2-rv-t{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.s2-meta{font:400 13px/16px var(--f);color:var(--ink-2)}
.s2-meta i,.s2-vc-s i,.s2-bbar-l i{font-style:normal;padding:0 6px}
.s2-reply{display:grid;grid-template-columns:24px 1fr;gap:12px;padding:16px 20px;border-radius:16px;background:var(--bg-2);margin-top:4px}
.s2-reply>.i{width:20px;height:20px;color:var(--ink-2);margin-top:2px}
.s2-reply-ph{position:relative;display:block;width:40px;height:40px;border-radius:8px;overflow:hidden;margin-bottom:12px;background:var(--bg)}
.s2-reply-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s2-reply-n{font-weight:500}
.s2-reply-a{font:400 13px/16px var(--f);margin-bottom:12px}
.s2-reply-t{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.s2-abt{padding-bottom:40px}
.s2-about h2{margin-bottom:12px}
.s2-ab{display:flex;flex-direction:column;gap:48px}
.s2-ab-map>a{display:block;height:470px;border-radius:16px;overflow:hidden;margin-bottom:16px}
.s2-ab-row{display:flex;gap:48px}
.s2-ab-row>div{flex:1;min-width:0}
.s2-ab-row h3{font:600 24px/32px var(--f);margin-bottom:16px}
.s2-hours{display:flex;flex-direction:column;gap:8px}
.s2-hours li{display:flex;justify-content:space-between;gap:12px;font:400 16px/22px var(--f)}
.s2-hours li>span:first-child{display:flex;align-items:center;gap:12px}
.s2-hours i{width:13px;height:13px;border-radius:50%;background:var(--ink-3)}
.s2-hours i.on{background:var(--s2-dot)}
.s2-hours li.today{font-weight:600}
.s2-info{display:flex;flex-direction:column;gap:12px}
.s2-info li{display:flex;align-items:center;gap:8px}
.s2-info .i{width:20px;height:20px}
/* map stand-in */
.s2-map{position:relative;width:100%;height:100%;background:var(--s2-map-l)}
.s2-map svg{display:block;width:100%;height:100%}
.s2-map .l{fill:var(--s2-map-l)}.s2-map .w{fill:var(--s2-map-w)}.s2-map .p rect{fill:var(--s2-map-p)}
.s2-map .mi path{stroke:var(--s2-map-mi);stroke-width:3;fill:none}
.s2-map .ro path{stroke:var(--s2-map-ro);stroke-width:9;fill:none}
.s2-map .tx text{fill:var(--s2-map-tx);font:500 13px var(--f)}
/* nearby + treat yourself */
.s2-near{max-width:1440px;margin:0 auto;padding-bottom:64px}
.s2-near h2{font:600 24px/32px var(--f);padding:0 32px 12px;margin-bottom:16px}
.s2-hs{position:relative}
.s2-near .s2-hs{margin-top:-24px}
.s2-hs-s{display:flex;gap:24px;overflow-x:auto;scrollbar-width:none;padding:24px 32px}
.s2-hs-s::-webkit-scrollbar,.s2-links::-webkit-scrollbar{display:none}
.s2-hs-n{position:absolute;inset-inline-end:8px;top:102px;z-index:3;border-color:var(--line)}
.s2-vc{position:relative;flex:none;width:322px;padding:2px}
.s2-vc-a{position:absolute;inset:0;z-index:1}
.s2-vc-i{position:relative;height:212px;border-radius:16px;overflow:hidden;margin-bottom:8px;background:var(--bg-3)}
.s2-vc-i img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s2-badge{position:absolute;top:12px;inset-inline-start:12px;display:flex;align-items:center;gap:4px;height:24px;padding-inline:8px 12px;border-radius:999px;background:var(--glass);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:var(--sh-card);font:600 13px/16px var(--f);color:var(--ink)}
.s2-badge .i{width:16px;height:16px;color:var(--star)}
.s2-vc-h{position:absolute;top:8px;inset-inline-end:8px;z-index:2;width:32px;height:32px;border-radius:50%;background:rgba(19,19,19,.33);color:#fff;display:grid;place-items:center}
.s2-vc-h .i{width:20px;height:20px}
.s2-vc-h.on .i path{fill:currentColor}
.s2-vc-n{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.s2-vc-n p{font:600 16px/22px var(--f);min-width:0}
.s2-vc-n .s2-vf{width:16px;height:16px;margin-inline-start:4px;margin-bottom:2px}
.s2-vc-n>span{display:inline-flex;align-items:center;gap:2px;font:600 13px/16px var(--f);white-space:nowrap}
.s2-vc-n>span .i{width:14px;height:14px;color:var(--star)}
.s2-vc-s{font:400 14px/20px var(--f);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s2-treat{max-width:1440px;margin:0 auto;padding:0 32px 64px}
.s2-treat h2{font:600 28px/36px var(--f);margin-bottom:24px}
.s2-tchips{display:flex;gap:8px;margin-bottom:24px;overflow-x:auto;scrollbar-width:none}
.s2-tchips button{flex:none;height:38px;padding:8px 16px;border-radius:999px;font:500 16px/22px var(--f);box-shadow:inset 0 0 0 1px var(--line);white-space:nowrap}
.s2-tchips button.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.s2-links{display:flex;overflow-x:auto;scrollbar-width:none}
.s2-links ul{flex:none;width:291px;display:flex;flex-direction:column;gap:12px}
.s2-links a{font:400 14px/20px var(--f)}
.s2-treat .s2-hs-n{top:66px}
.s2-mbar{position:sticky;bottom:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:20px;height:80px;padding:16px 20px;background:var(--bg);border-top:1px solid var(--line)}
.s2-mbar p{color:var(--ink-2)}
/* mobile venue */
.s2-car{position:relative;height:279px}
.s2-car-s{display:flex;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.s2-car-s::-webkit-scrollbar{display:none}
.s2-car-s button{position:relative;flex:none;width:100%;height:100%;scroll-snap-align:start;background:var(--bg-3)}
.s2-car-s img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s2-cnt{position:absolute;bottom:36px;inset-inline-end:20px;height:24px;padding:0 12px;border-radius:999px;background:rgba(13,13,13,.5);color:#fff;display:flex;align-items:center;font:600 13px/16px var(--f)}
.s2-ovb{position:absolute;top:16px;inset-inline-start:20px}
.s2-ovr{position:absolute;top:16px;inset-inline-end:20px;display:flex;gap:8px}
.s2-cb.s2-ov{border:0;background:var(--bg);box-shadow:var(--sh-card)}
.s2-sheet{position:relative;z-index:2;margin-top:-24px;border-radius:24px 24px 0 0;background:var(--bg);padding:20px 16px 8px}
.s2-sheet h1{display:flex;align-items:center;gap:4px;font:600 28px/36px var(--f)}
.s2-sheet>p{margin-top:2px}
.s2-mrow{display:flex;align-items:center;margin:12px 0 16px;white-space:nowrap;overflow:hidden}
.s2-mrow .s2-dot{padding:0 6px}
.s2-op{display:inline-flex;align-items:center;gap:4px}
.s2-op .i{width:16px;height:16px;color:var(--ok)}
.s2-abox{display:flex;align-items:center;gap:6px;width:100%;padding:12px;border-radius:12px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--bg-3);font:400 14px/20px var(--f)}
.s2-abox .i{width:16px;height:16px}
.s2-mabout{padding:24px 20px 32px}
.s2-mabout h2{font:600 19px/24px var(--f);margin-bottom:12px}
.s2-clamp4{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
@container (max-width:600px){
  .s2-ven .s2-top{padding:0}
  .s2-brc ol{padding:16px 20px;margin:0}
  .s2-cols{display:block;padding:0}
  .s2-main{max-width:none;padding-bottom:32px}
  .s2-svcs{background:var(--bg-2);padding:28px 0;--s2-fade:var(--bg-2)}
  .s2-sec h2{font:600 19px/24px var(--f)}
  .s2-svcs h2{padding:0 20px;margin-bottom:16px}
  .s2-svcs .s2-chips{padding-inline-start:20px;padding-inline-end:10px}
  .s2-svcs .s2-chip-more{inset-inline-end:10px}
  .s2-sclist{padding:0 20px;margin-bottom:24px}
  .s2-sc{padding:16px}
  .s2-seeall{width:calc(100% - 40px);margin:0 20px}
  .s2-sec:not(.s2-svcs){padding:32px 20px 0}
  .s2-sec:not(.s2-svcs)+.s2-sec{margin:32px 20px 0;padding:32px 0 0;border-top:1px solid var(--line)}
  .s2-sec .s2-seeall{width:100%;margin:0}
  .s2-sh2{margin-bottom:16px}
  .s2-team{display:flex;gap:24px;overflow-x:auto;scrollbar-width:none;margin:0 -20px;padding:0 20px}
  .s2-team::-webkit-scrollbar{display:none}
  .s2-tm{width:96px;flex:none}
  .s2-tm .s2-av120{width:96px;height:96px}
  .s2-tm .s2-rp{top:74px}
  .s2-tm b,.s2-tm>span:last-child{max-width:96px}
  .s2-rvs{grid-template-columns:1fr;gap:24px}
  .s2-ab{flex-direction:column-reverse;gap:0}
  .s2-ab-row{flex-direction:column;gap:0}
  .s2-ab-row h3{font:600 19px/24px var(--f)}
  .s2-hr.s2-m{margin:32px 0}
  .s2-ab-map>a{height:197px}
  .s2-ab-map{padding-bottom:32px;border-bottom:1px solid var(--line)}
  .s2-near h2{font:600 19px/24px var(--f);padding:0 20px;margin-bottom:16px}
  .s2-hs-s{gap:12px;padding:24px 20px}
  .s2-vc{width:240px}
  .s2-vc-i{height:157px}
  .s2-hs-n{display:none}
  .s2-treat{padding:0 0 64px}
  .s2-treat h2{font:600 22px/28px var(--f);padding:0 20px}
  .s2-tchips,.s2-links{padding:0 20px}
}

/* ---------- PROFESSIONAL ---------- */
.s2-pwrap{display:flex;gap:4%;max-width:1440px;margin:0 auto 64px;padding:24px 32px 0}
.s2-pleft{width:408px;flex:none}
.s2-pcard{position:sticky;top:calc(var(--s2-top) + 24px);display:flex;flex-direction:column;align-items:center;padding:32px;border-radius:32px;background:var(--bg-4)}
.s2-pc-top{display:flex;justify-content:space-between;width:100%;height:36px}
.s2-pav{margin-top:24px}
.s2-pinfo{margin-top:24px;display:flex;flex-direction:column;align-items:center;text-align:center}
.s2-pinfo h1{font:600 28px/36px var(--f);margin-bottom:8px}
.s2-prt .i.st{width:16px;height:16px;color:var(--star)}
.s2-pbook{margin-top:24px}
.s2-pstats{width:100%;display:flex;flex-direction:column;gap:32px;margin-top:40px}
.s2-pstats dl,.s2-mstats dl{display:flex;flex-direction:column;gap:8px}
.s2-pstats dl div,.s2-mstats dl div{display:flex;justify-content:space-between;gap:12px}
.s2-pstats dt,.s2-mstats dt{font:500 16px/22px var(--f)}
.s2-pstats dd,.s2-mstats dd{color:var(--ink-2)}
.s2-pstats h2,.s2-mstats h2{font:600 19px/24px var(--f);margin-bottom:16px}
.s2-pstats b{font:600 14px/20px var(--f)}
.s2-pstats p.s2-mut{font:400 14px/20px var(--f);margin-top:4px}
.s2-langs{display:flex;flex-wrap:wrap;gap:8px}
.s2-langs span{display:inline-flex;align-items:center;height:32px;padding:0 16px;border-radius:999px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);font:500 14px/20px var(--f)}
.s2-since{font:400 14px/20px var(--f);text-align:center}
.s2-pright{flex:1;min-width:0}
.s2-ptabs{position:sticky;top:var(--s2-top);z-index:5;background:var(--bg);padding:16px 0 32px;margin-top:-16px}
.s2-ptabs ul{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.s2-ptabs li{flex:none}
.s2-ptabs button{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--s2-ring);font:500 14px/20px var(--f);white-space:nowrap}
.s2-ptabs button.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.s2-cnt2{display:inline-flex;align-items:center;height:20px;padding:0 6px;border-radius:999px;background:var(--s2-cnt);color:var(--ink-2);font:600 13px/16px var(--f)}
.s2-ptabs button.on .s2-cnt2{color:var(--on-ink);background:rgba(255,255,255,.2)}
.s2-ps+.s2-ps{margin-top:64px}
.s2-ps h2{font:600 24px/32px var(--f);margin-bottom:24px}
.s2-ps .s2-sh2 h2{margin:0}
.s2-psvc .s2-sclist{margin-bottom:28px}
.s2-pf{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.s2-pf button{position:relative;aspect-ratio:1;border-radius:16px;overflow:hidden;background:var(--bg-3)}
.s2-pf img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s2-pbig{display:flex;align-items:center;gap:4px;font:700 40px/44px var(--f);margin-bottom:12px}
.s2-pbig .i{width:36px;height:36px;color:var(--star)}
.s2-pro .s2-rvs{gap:24px 20px}
.s2-pmap{display:block;height:476px;border-radius:16px;overflow:hidden;margin-bottom:13px}
.s2-pvn{font:600 16px/22px var(--f);margin-bottom:8px}
.s2-vc.s2-vc207{width:211px}
.s2-vc207 .s2-vc-i{height:138px}
.s2-vc207 .s2-badge{display:none}
.s2-mstats{padding:8px 20px 32px}
.s2-mstats dl{margin-bottom:24px}
.s2-mbar-full .s2-btn{width:100%}
@container (max-width:600px){
  .s2-pwrap{display:block;padding:0;margin:0}
  .s2-pleft{width:auto}
  .s2-pcard{position:static;border-radius:0;padding:20px 20px 32px}
  .s2-pav{margin-top:42px}
  .s2-mstats{padding-top:24px}
  .s2-ps .s2-sclist{padding:0}
  .s2-ps .s2-seeall{margin:0}
  .s2-pright{padding-bottom:32px}
  .s2-ptabs{padding:24px 20px 16px;margin:0}
  .s2-ps{padding:0 20px}
  .s2-ps+.s2-ps{margin-top:40px}
  .s2-ps h2{font:600 19px/24px var(--f);margin-bottom:16px}
  .s2-psvc{background:var(--bg-2);padding:28px 20px}
  .s2-psvc .s2-sc{padding:16px}
  .s2-psvc .s2-seeall{width:100%}
  .s2-ps .s2-seeall{width:100%}
  .s2-pf{gap:8px}
  .s2-pmap{height:197px}
  .s2-pbig{font-size:36px}
  .s2-mbar-full{padding:16px 20px}
}

/* ---------- BOOKING FLOW ---------- */
.s2-bk{min-height:calc(100vh - var(--s2-top));display:flex;flex-direction:column;background:var(--bg-2);--s2-fade:var(--bg-2)}
[data-shell="phone"] .s2-bk{min-height:100%}
.s2-bk-top{position:sticky;top:var(--s2-top);z-index:10;height:72px;background:var(--bg-2);transition:box-shadow .2s}
.s2-bk-top.sc{box-shadow:0 4px 2px -2px rgba(19,19,19,.06)}
.s2-bk-tin{display:flex;align-items:center;gap:48px;height:72px;max-width:1440px;margin:0 auto;padding:0 32px}
.s2-bk-tt{flex:1;min-width:0;font:600 19px/24px var(--f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transition:opacity .2s}
.s2-bk-top.sc .s2-bk-tt{opacity:1}
.s2-bk-in{flex:1;display:grid;grid-template-columns:minmax(0,644px) 444px;gap:32px 96px;justify-content:center;padding:0 32px 96px}
.s2-bk-in.s2-solo{grid-template-columns:minmax(0,644px)}
.s2-bk-main{min-width:0}
.s2-bk-h{display:flex;flex-direction:column;gap:12px;margin-bottom:32px}
.s2-bk-h h1{font:700 40px/44px var(--f)}
.s2-bk-sub{color:var(--ink-2);margin-top:-4px}
.s2-crumb{display:flex;align-items:center;gap:8px;padding:2px 0;font:500 14px/20px var(--f)}
.s2-crumb li{display:flex;align-items:center;gap:8px}
.s2-crumb .i{width:20px;height:20px}
.s2-crumb .done{color:var(--ink-2)}
.s2-crumb .cur{color:var(--ink)}
.s2-crumb .next{color:var(--ink-3)}
.s2-bk-side{padding-top:36px}
.s2-sum{position:sticky;top:calc(var(--s2-top) + 108px);height:calc(100vh - var(--s2-top) - 144px);min-height:440px;border-radius:24px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.s2-sum-in{display:flex;flex-direction:column;height:100%;padding:32px 32px 0;overflow-y:auto;scrollbar-width:none}
.s2-sum-v{display:flex;align-items:center;gap:12px}
.s2-sum-v>div{min-width:0;display:flex;flex-direction:column;gap:2px}
.s2-sum-v>div>p:first-child{font:600 16px/22px var(--f)}
.s2-sum-ph{position:relative;width:64px;height:64px;border-radius:8px;overflow:hidden;flex:none;border:1px solid var(--line)}
.s2-sum-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s2-sum .s2-rt{font-size:14px;line-height:20px}
.s2-ell{font:400 14px/20px var(--f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s2-sum-empty{color:var(--ink-2);padding-bottom:20px}
.s2-sum-l{display:flex;flex-direction:column;gap:16px;padding-bottom:20px}
.s2-sum-l li{display:flex;justify-content:space-between;gap:12px}
.s2-sum-l p{font:500 16px/22px var(--f)}
.s2-sum-l span{font:400 14px/20px var(--f)}
.s2-sum-l b{font:500 14px/20px var(--f);white-space:nowrap}
.s2-sum-t .s2-hr{margin:0 0 20px}
.s2-sum-t>div{display:flex;justify-content:space-between;font-weight:600}
.s2-sum-sp{flex:1}
.s2-sum-f{position:sticky;bottom:0;background:var(--s2-surf);padding:12px 0 32px}
.s2-when{display:flex;flex-direction:column;gap:12px}
.s2-when li{display:flex;align-items:center;gap:8px}
.s2-when .i{width:20px;height:20px;color:var(--ink-2)}
.s2-bbar{display:none}
.s2-bchips{position:sticky;top:calc(var(--s2-top) + 72px);z-index:3;background:var(--bg-2);padding:16px 0;margin:-16px 0 0}
.s2-bchips .s2-chips{margin:0}
.s2-bgroups{display:flex;flex-direction:column;gap:32px;padding-top:16px}
.s2-gh{font:600 19px/24px var(--f);padding-bottom:16px}
.s2-blist{display:flex;flex-direction:column;gap:12px}
.s2-bc{display:flex;flex-direction:column;width:100%;padding:20px 24px;border-radius:16px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;text-align:start}
.s2-bc.on{box-shadow:inset 0 0 0 2px var(--brand)}
.s2-bc h3{font:500 16px/22px var(--f);margin-bottom:2px}
.s2-bc-d{font:400 14px/20px var(--f);color:var(--ink-2);margin-bottom:8px}
.s2-bc-x{font:400 14px/20px var(--f);color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.s2-bc-r{display:flex;justify-content:space-between;align-items:center;margin-top:16px}
.s2-bc-r b{font:600 16px/22px var(--f)}
.s2-add{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--s2-surf);border:1px solid var(--line-2);box-shadow:var(--sh-small)}
.s2-add .i{width:16px;height:16px}
.s2-bc.on .s2-add{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:none}
.s2-bc.s2-grp{flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
.s2-grp>span{display:flex;flex-direction:column}
.s2-grp b{font:500 16px/22px var(--f)}
.s2-grp .s2-mut{font:400 14px/20px var(--f)}
.s2-plist{display:flex;flex-direction:column;gap:12px}
.s2-pc{display:flex;align-items:center;gap:12px;width:100%;padding:20px 24px;border-radius:16px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;text-align:start}
.s2-pc.on{box-shadow:inset 0 0 0 2px var(--brand)}
.s2-pc-a{position:relative;width:80px;height:80px;flex:none;margin-inline-end:12px}
.s2-pc .s2-rp{top:58px}
.s2-pc-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.s2-pc-t h3{font:500 16px/22px var(--f)}
.s2-pc-t h4{font:400 14px/20px var(--f);color:var(--ink-2)}
.s2-vp{align-self:flex-start;margin-top:4px;font:500 14px/20px var(--f)}
.s2-btn.s2-sel{box-shadow:0 1px 6px 0 rgba(13,22,25,.04),0 6px 8px 0 rgba(13,22,25,.06)}
.s2-pc.s2-addg{background:transparent;box-shadow:none;border:1.5px dashed var(--line-2)}
.s2-trow{display:flex;justify-content:space-between;padding-bottom:16px}
.s2-psw{position:relative}
.s2-ppill{padding-inline-start:4px}
.s2-ppill .s2-av28{margin-inline-end:4px}
.s2-ppill>.i{width:20px;height:20px}
.s2-calb.s2-btn{width:52px;padding:0}
.s2-calb .i{width:20px;height:20px}
.s2-pop{position:absolute;top:44px;inset-inline-start:0;z-index:20;width:320px;max-height:360px;overflow:auto;padding:8px;border-radius:16px;background:var(--bg);box-shadow:var(--sh-pop);display:flex;flex-direction:column}
.s2-popi{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border-radius:12px}
.s2-popi:hover{background:var(--bg-2)}
.s2-popi>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
.s2-popi b{font:500 16px/22px var(--f)}
.s2-popi .s2-mut{font:400 14px/20px var(--f)}
.s2-popi>.i{width:20px;height:20px;color:var(--brand)}
.s2-dsel{padding-top:8px;margin-bottom:24px}
.s2-dsel-h{display:flex;justify-content:space-between;align-items:center;padding-inline-end:8px;margin-bottom:8px}
.s2-dsel-h p{font:600 19px/24px var(--f)}
.s2-dsel-h>div{display:flex;gap:-8px}
.s2-nav{width:36px;height:36px;margin:-8px 0;border-radius:50%;display:inline-grid;place-items:center}
.s2-nav .i{width:20px;height:20px}
.s2-nav:disabled{opacity:.4}
.s2-days{display:flex;gap:16px;overflow-x:auto;scrollbar-width:none;padding-top:4px}
.s2-days::-webkit-scrollbar{display:none}
.s2-day{flex:none;width:64px;height:94px;border-radius:16px;border:1px solid var(--line);background:var(--s2-surf);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px 0}
.s2 .s2-day{text-align:center}
.s2-day span{font:500 14px/20px var(--f);color:var(--ink-2);white-space:nowrap}
.s2-day b{font:600 24px/32px var(--f)}
.s2-day span:last-child{font:400 13px/16px var(--f)}
.s2-day.off span,.s2-day.off b{color:var(--ink-3)}
.s2-day.on{background:var(--brand);border-color:var(--brand)}
.s2-day.on span,.s2-day.on b{color:#fff}
.s2-none{display:flex;flex-direction:column;align-items:center;text-align:center;padding:64px 24px}
.s2-none-i svg{display:block;width:56px;height:56px}
.s2-none-t{font:600 19px/24px var(--f);margin:16px 0 4px}
.s2-none-b{display:flex;gap:12px;justify-content:center;margin-top:20px;flex-wrap:wrap}
.s2-conf{display:flex;flex-direction:column;gap:16px}
.s2-cbox{padding:24px;border-radius:16px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line);text-align:start;width:100%}
.s2-cbox h2{font:600 19px/24px var(--f);margin-bottom:16px}
.s2-cbox>p{color:var(--ink-2)}
.s2-me{display:flex;align-items:center;gap:12px}
.s2-me>div{display:flex;flex-direction:column}
.s2-me b{font-weight:500}
.s2-radio{display:flex;align-items:center;gap:12px;width:100%;padding:16px;border-radius:12px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line);text-align:start;cursor:pointer}
.s2-radio.on{box-shadow:inset 0 0 0 2px var(--brand)}
.s2-rdot{width:20px;height:20px;border-radius:50%;border:2px solid var(--line-2);flex:none;box-sizing:border-box}
.s2-radio.on .s2-rdot{border:6px solid var(--brand)}
.s2-radio>span:nth-child(2){flex:1;display:flex;flex-direction:column}
.s2-radio b{font-weight:500}
.s2-radio .s2-mut{font:400 14px/20px var(--f)}
.s2-radio>.i{width:24px;height:24px;color:var(--ink-2)}
.s2-cbox textarea{width:100%;padding:12px 16px;border-radius:12px;border:1px solid var(--line-2);background:var(--s2-surf);color:var(--ink);font:400 16px/22px var(--f);resize:vertical}
.s2-done{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.s2-done-i{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:var(--ok-soft);color:var(--ok)}
.s2-done-i .i{width:36px;height:36px}
.s2-done h2{font:600 24px/32px var(--f)}
.s2-done .s2-cbox{margin-top:12px}
.s2-dl{display:flex;justify-content:space-between;gap:12px;padding:6px 0}
.s2-done-b{display:flex;gap:12px;margin-top:12px;flex-wrap:wrap;justify-content:center}
.s2-next .i{width:16px;height:16px}
@container (max-width:600px){
  .s2-bk-tin{gap:16px;padding:0 20px}
  .s2-bk-top .s2-cb{border:0;background:transparent;margin:0 -12px}
  .s2-bk-in,.s2-bk-in.s2-solo{grid-template-columns:minmax(0,1fr);padding:0 20px 24px}
  .s2-bk-side{display:none}
  .s2-crumb{display:none}
  .s2-bk-h{gap:8px}
  .s2-bk-h h1{font:600 28px/36px var(--f)}
  .s2-bchips{margin:-16px -20px 0;padding:16px 0 16px 0}
  .s2-bchips .s2-chips{padding-inline-start:20px}
  .s2-bc,.s2-pc,.s2-cbox{padding:16px}
  .s2-slot{padding:20px 16px}
  .s2-wrow{flex-direction:column;align-items:stretch}
  .s2-galm-top>div{padding:0 20px}
  .s2-galm-in{padding:0 20px 40px}
  .s2-galm-h h2{font:600 28px/36px var(--f)}
  .s2-galm-g{gap:8px}
  .s2-rvfull .s2-rvs{grid-template-columns:1fr}
  .s2-bc.s2-grp{padding:16px}
  .s2-pop{width:min(320px,calc(100vw - 40px))}
  .s2-bbar{position:sticky;bottom:0;z-index:12;display:flex;align-items:center;justify-content:space-between;gap:12px;height:80px;padding:16px 20px;background:var(--bg);box-shadow:0 -1px 0 0 var(--line)}
  .s2-bbar-l{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
  .s2-bbar-l b{font:600 19px/24px var(--f)}
  .s2-bbar-l>span{display:flex;align-items:center;gap:4px;font:400 14px/20px var(--f);color:var(--ink-2);white-space:nowrap}
  .s2-bbar-l .i{width:16px;height:16px}
  .s2-bbar .s2-btn{min-width:131px}
}

/* ---------- modals ---------- */
.ov.s2-ovc{padding:16px}
.s2-ovc .mdl{width:min(560px,100%);max-height:calc(100% - 32px);border-radius:24px;padding:24px;box-shadow:var(--sh-pop)}
.s2-mh{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.s2-mh h2{font:600 24px/32px var(--f)}
.s2-mh .s2-cb{width:40px;height:40px;border:0;background:var(--bg-2)}
.s2-mh .s2-cb .i{width:20px;height:20px}
.s2-shv{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;background:var(--bg-2);margin-bottom:8px}
.s2-shv img{width:56px;height:56px;border-radius:8px;object-fit:cover}
.s2-shv>div{display:flex;flex-direction:column}
.s2-shm ul button{display:flex;align-items:center;gap:12px;width:100%;padding:14px 4px;font:500 16px/22px var(--f);border-bottom:1px solid var(--line)}
.s2-shm li:last-child button{border-bottom:0}
.ov.s2-full{display:block;background:var(--bg);overflow:auto;padding:0}
.s2-full .mdl{max-height:none;overflow:visible;width:100%;max-width:none;border-radius:0;padding:0;box-shadow:none}
.s2-rvm .s2-rvm-s{display:flex;align-items:center;gap:32px;padding-bottom:24px;margin-bottom:24px;border-bottom:1px solid var(--line)}
.s2-rvm-n{display:flex;flex-direction:column;align-items:center;gap:4px;flex:none}
.s2-rvm-n b{font:700 48px/52px var(--f)}
.s2-rvm ul{flex:1;display:flex;flex-direction:column;gap:6px}
.s2-rvm li{display:flex;align-items:center;gap:6px;font:400 14px/20px var(--f)}
.s2-rvm li .i{width:14px;height:14px;color:var(--star)}
.s2-rvm li i{flex:1;height:8px;border-radius:4px;background:var(--bg-3);overflow:hidden}
.s2-rvm li em{display:block;height:100%;background:var(--ink)}
.s2-rvm li span:last-child{min-width:44px}
.s2-rvm-l{display:flex;flex-direction:column;gap:24px}
.s2-ovc .mdl:has(.s2-rvm){width:min(720px,100%)}
.s2-catm ul{display:flex;flex-direction:column}
.s2-catm button{width:100%;padding:14px 4px;font:500 16px/22px var(--f);border-bottom:1px solid var(--line)}
.s2-cartm .s2-sum{position:static;height:auto;min-height:0;box-shadow:none;border-radius:0}
.s2-cartm .s2-sum-in{padding:0;height:auto}
.s2-calm .mg-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.s2-calm .mg-h b{font:600 17px/24px var(--f)}
.s2-calm .icb{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-2)}
.s2-calm .icb:disabled{opacity:.4}
.s2-calm .icb:not(.flip) svg{transform:scaleX(-1)}
.s2-calm .mg-g{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.s2-calm .mg-wd{font:500 13px/16px var(--f);color:var(--ink-2);padding:8px 0}
.s2-calm .mg-d{position:relative;aspect-ratio:1;max-height:56px;border-radius:50%;font:500 16px/22px var(--f);display:grid;place-items:center}
.s2-calm .mg-d:hover:not(:disabled){background:var(--bg-2)}
.s2-calm .mg-d.red,.s2-calm .mg-d.past{color:var(--ink-3)}
.s2-calm .mg-d.today span{color:var(--brand);font-weight:700}
.s2-calm .mg-d[aria-pressed="true"]{background:var(--brand);color:#fff}
.s2-calm .mg-d[aria-pressed="true"] span{color:#fff}
.s2-calm .mg-d i{position:absolute;bottom:5px;left:50%;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--brand)}
.s2-calm .mg-d[aria-pressed="true"] i{background:#fff}
.s2-calm .mg-hol{font:400 13px/16px var(--f);color:var(--ink-2);margin-top:12px}
@container (max-width:600px){
  .ov.s2-ovc{padding:0;place-items:end stretch}
  .s2-ovc .mdl{width:100%;max-height:92%;border-radius:24px 24px 0 0;padding:20px}
  .s2-rvm .s2-rvm-s{gap:16px}
}

/* full-screen modals (image gallery, all reviews) — venue-gallery-d */
.s2-galm{min-height:100%}
.s2-galm-top{position:sticky;top:0;z-index:5;background:var(--bg)}
.s2-galm-top>div{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1248px;height:72px;margin:0 auto;padding:0 32px}
.s2-galm-tt{font:600 22px/28px var(--f);opacity:0;transition:opacity .2s}
.s2-galm-top.sc .s2-galm-tt{opacity:1}
.s2-galm-top.sc{box-shadow:0 1px 0 var(--line)}
.s2-galm-in{max-width:1248px;margin:0 auto;padding:0 32px 52px}
.s2-galm-h{display:flex;flex-direction:column;gap:12px;padding-top:36px;margin-bottom:32px}
.s2-galm-h h2{font:700 40px/44px var(--f)}
.s2-galm-h p{color:var(--ink-2)}
.s2-galm-g{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.s2-galm-i{position:relative;aspect-ratio:580/330;border-radius:16px;overflow:hidden;background:var(--bg-3)}
.s2-galm-i.w{grid-column:span 2;aspect-ratio:1184/670}
.s2-galm-i img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s2-rvfull .s2-rvm{max-width:880px}
.s2-rvfull .s2-rvs{grid-template-columns:1fr 1fr}
/* time list — book3-slot-d */
.s2-pick{display:flex;flex-direction:column;gap:12px;padding-bottom:24px}
.s2-pick h2{font:600 19px/24px var(--f)}
.s2-slots{display:flex;flex-direction:column;gap:12px}
.s2-slot{min-height:65px;padding:20px 24px;border-radius:16px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line);font:500 16px/22px var(--f);text-align:start}
.s2-slot.on{box-shadow:inset 0 0 0 2px var(--brand)}
/* waitlist — book-waitlist-d */
.s2-wcard{display:flex;flex-direction:column;gap:16px;padding:20px;border-radius:16px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line)}
.s2-wrow{display:flex;align-items:flex-end;gap:12px}
.s2-fld{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.s2-fld label{font:600 14px/20px var(--f)}
.s2-selb{position:relative;display:flex;align-items:center;height:48px;padding:0 16px;border-radius:12px;border:1px solid var(--line-2);background:var(--s2-surf)}
.s2-selb span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s2-selb .i{width:20px;height:20px;color:var(--ink-2)}
.s2-selb select{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;font:inherit}
.s2-wdel{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:var(--ink-2);flex:none}
.s2-wdel .i{width:20px;height:20px}
.s2-btn.s2-wadd{margin-top:16px;padding-inline-start:11px}
.s2-btn.s2-wadd .i{width:20px;height:20px}
.s2-wchg{padding-top:24px;font:400 14px/20px var(--f)}
.s2-wchg .s2-lnk{font-weight:400}
.s2-when .s2-dot{padding:0 6px}

/* ---------- GIFT CARD (Fresha keeps this page dark in both themes) ---------- */
.s2.s2-gc{position:relative;min-height:calc(100vh - var(--s2-top));display:flex;flex-direction:column;background:var(--s2-gift);color:#fff;overflow:hidden;color-scheme:dark}
[data-shell="phone"] .s2.s2-gc{min-height:100%}
.s2-gc-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(42% 70% at 6% 22%,rgba(150,112,214,.95) 0%,rgba(104,74,190,.75) 32%,rgba(25,31,33,0) 72%),radial-gradient(30% 34% at 2% 72%,rgba(176,82,170,.55) 0%,rgba(25,31,33,0) 75%)}
.s2-gc-top{position:absolute;top:0;left:0;right:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:24px}
.s2-gcx{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff}
.s2-gcx .i{width:20px;height:20px}
.s2-gc-tt{display:none}
.s2-gc-st{font:500 14px/20px var(--f);color:rgba(255,255,255,.7)}
.s2-gc-in{position:relative;z-index:2;flex:1;display:grid;grid-template-columns:minmax(0,639px) 561px;justify-content:center;align-items:center;min-height:calc(100vh - var(--s2-top));padding:96px 120px}
.s2-gc-l{padding:0 32px}
.s2-gc-l h1{font:700 40px/44px var(--f);margin-bottom:24px;text-wrap:balance}
.s2-gc-r{display:flex;flex-direction:column;align-items:center;gap:16px}
.s2-gc-ul{display:flex;flex-direction:column;gap:12px;font:400 14px/20px var(--f)}
.s2-gc-ul li{display:flex;align-items:flex-start;gap:8px}
.s2-gc-ul .i{width:20px;height:20px}
.s2-vfw.s2-vf{color:#fff;width:18px;height:18px;margin:0 2px}
.s2-vfw path:last-child{stroke:var(--s2-gift)}
.s2-gc-cta{margin-top:32px}
.s2-btn.s2-gcw{background:#fff;border-color:#fff;color:#0d0d0d}
.s2-gc-bar{display:none}
.s2-gcc{position:relative;width:417px;max-width:100%;aspect-ratio:417/260;border-radius:24px;overflow:hidden;color:#fff;box-shadow:0 20px 50px -20px rgba(0,0,0,.6)}
.s2-gcc-l{position:absolute;top:24px;inset-inline-start:24px;font:800 24px/1 var(--f)}
.s2-gcc-b{position:absolute;top:22px;inset-inline-end:22px}
.s2-gcc-b .i{width:28px;height:28px}
.s2-gcc-t{position:absolute;bottom:24px;inset-inline-start:24px;font:600 28px/36px var(--f)}
.s2-gcc-to{position:absolute;bottom:64px;inset-inline-start:24px;font:500 14px/20px var(--f);opacity:.9}
.s2-gc-h{font:600 16px/22px var(--f);margin:8px 0 12px}
.s2-gcd+.s2-gc-h{margin-top:28px}
.s2-gcd{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;max-width:440px}
.s2-gcd-i{aspect-ratio:1.6;border-radius:10px;outline:2px solid transparent;outline-offset:3px}
.s2-gcd-i.on{outline-color:#fff}
.s2-gca{display:flex;flex-wrap:wrap;gap:8px;max-width:520px}
.s2-gca button{height:40px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);font:500 14px/20px var(--f);color:#fff}
.s2-gca button.on{background:#fff;color:#0d0d0d;box-shadow:none}
.s2-gcform{display:flex;flex-direction:column;gap:16px;max-width:480px}
.s2-gcf>span{display:block;font:500 14px/20px var(--f);color:rgba(255,255,255,.8);margin-bottom:6px}
.s2-gcf input,.s2-gcf textarea{width:100%;height:48px;padding:0 16px;border-radius:12px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#fff;font:400 16px/22px var(--f)}
.s2-gcf textarea{height:auto;padding:12px 16px;resize:vertical}
.s2-gcf input::placeholder,.s2-gcf textarea::placeholder{color:rgba(255,255,255,.45)}
.s2-gcsum{max-width:480px;padding:16px 24px;border-radius:16px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.15);font:400 14px/20px var(--f)}
.s2-gcsum hr{border:0;border-top:1px solid rgba(255,255,255,.15);margin:8px 0}
.s2-gcsum .s2-dlt{font-size:16px}
.s2-gcpay{display:flex;flex-direction:column;gap:8px;max-width:480px}
.s2-gcpay>div{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
.s2-gcpay>div.on{box-shadow:inset 0 0 0 2px #fff}
.s2-gcpay>div>span:nth-child(2){flex:1;display:flex;flex-direction:column}
.s2-gcpay b{font-weight:500}
.s2-gcpay>div>span:nth-child(2)>span{font:400 13px/18px var(--f);opacity:.7}
.s2-gcpay .i{width:24px;height:24px;opacity:.8}
.s2-gc .s2-rdot{border-color:rgba(255,255,255,.4)}
.s2-gcpay .on .s2-rdot{border:6px solid #fff}
.s2-gc-p{font:400 16px/26px var(--f);max-width:520px;opacity:.9}
.s2-gc-msg{max-width:417px;font:400 15px/24px var(--f-serif);opacity:.9;text-align:center}
@container (max-width:600px){
  .s2-gc-glow{display:none}
  .s2-gc-top{position:sticky;top:var(--s2-top);background:var(--s2-gift);padding:12px 8px 12px 20px;min-height:72px}
  .s2-gc-in{display:block;min-height:0;padding:8px 20px 24px}
  .s2-gc-l{padding:0}
  .s2-gc-l h1{font:600 28px/36px var(--f);margin-bottom:24px}
  .s2-gc-ul li{align-items:flex-start}
  .s2-gc-r{margin-top:40px}
  .s2-gcc{width:100%}
  .s2-gcd{grid-template-columns:repeat(3,1fr)}
  .s2-gc-bar{display:block;position:sticky;bottom:0;z-index:3;padding:16px 20px 40px;background:var(--s2-gift)}
}

/* =====================================================================================================================
   site dropdown pass 1405-07-24 (capture/web-dd): share modal, reviews page + its filters, «انتخاب یک گزینه»,
   option picker, professional profile / list modals, time-step calendar popover, group first step, gift steps
   ===================================================================================================================== */
/* share */
.s2-mds .s2-shv{background:none;padding:0 0 16px;border-bottom:1px solid var(--line);margin-bottom:8px;border-radius:0}
.s2-mds .s2-shv b{font:600 16px/22px var(--f)}
.s2-mds .s2-shv .s2-mut{font:400 14px/20px var(--f)}
.s2-shl{list-style:none;margin:0;padding:0}
.s2-shl button{display:flex;align-items:center;gap:16px;width:100%;min-height:56px;padding:0 4px;font:500 16px/22px var(--f);color:var(--ink);border-bottom:1px solid var(--line);text-align:start}
.s2-shl li:last-child button{border-bottom:0}
.s2-shl .i{width:24px;height:24px}
/* reviews page */
.s2-rvp{background:var(--bg)}
.s2-rvp .s2-bk-top{background:var(--bg)}
.s2-rvp-top .s2-bk-tin{max-width:none}
.s2-rvp-in{display:grid;grid-template-columns:360px minmax(0,728px);gap:96px;justify-content:center;padding:36px 32px 96px}
.s2-rvp-card{position:sticky;top:calc(var(--s2-top) + 96px);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;background:var(--bg)}
.s2-rvp-best{display:flex;flex-direction:column;align-items:center;text-align:center;padding:40px 24px 40px;background:var(--bg-3);font:400 16px/22px var(--f)}
.s2-rvp-best .s2-best-t{margin-bottom:4px}
.s2-rvp-rat{padding:32px 32px 24px;border-bottom:1px solid var(--line)}
.s2-rvp-rat h3{font:600 19px/24px var(--f);margin-bottom:16px}
.s2-rvr{display:flex;flex-direction:column;gap:12px}
.s2-rvr li{display:flex;align-items:center;gap:12px}
.s2-rvr-n{width:12px;font:400 16px/22px var(--f);color:var(--ink-2);text-align:center}
.s2-rvr-b{flex:1;height:4px;border-radius:2px;background:var(--bg-3);overflow:hidden}
.s2-rvr-b em{display:block;height:100%;background:var(--star);border-radius:2px}
.s2-rvr-c{min-width:44px;font:400 16px/22px var(--f);text-align:end}
.s2-ck{position:relative;display:inline-grid;place-items:center;width:24px;height:24px;flex:none;cursor:pointer}
.s2-ck input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.s2-ck i{width:24px;height:24px;border-radius:6px;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg)}
.s2-ck input:checked+i{background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/16px no-repeat;box-shadow:none}
.s2-ck input:focus-visible+i{outline:2px solid var(--ring-c);outline-offset:2px}
.s2-rvp-trust{display:flex;align-items:center;gap:16px;padding:24px}
.s2-rvp-trust b{font:600 15px/20px var(--f)}
.s2-rvp-trust p{font:400 13px/18px var(--f);color:var(--ink-2);margin-top:4px}
.s2-rvp-sh{display:grid;place-items:center;width:48px;height:56px;border-radius:12px;background:var(--brand);color:#fff;flex:none}
.s2-rvp-sh .i{width:32px;height:32px}
.s2-rvp-in>*{min-width:0}
.s2-rvp-main h1{font:600 28px/36px var(--f);margin-bottom:24px}
.s2-rvp-main .s2-sum2{border-bottom:0;padding-bottom:0}
.s2-rvp-ph{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:16px 0 40px}
.s2-rvp-ph button{flex:none;width:120px;height:120px;border-radius:4px;overflow:hidden;background:var(--bg-3)}
.s2-rvp-ph img{width:100%;height:100%;object-fit:cover}
.s2-rvp-tb{display:flex;align-items:center;gap:8px;margin:40px 0 40px}
.s2-rvp-q{display:flex;align-items:center;gap:8px;width:300px;height:36px;padding:0 12px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink-2)}
.s2-rvp-q .i{width:20px;height:20px}
.s2-rvp-q input{flex:1;min-width:0;border:0;outline:0;background:none;font:400 14px/20px var(--f);color:var(--ink)}
.s2-rvp-q:focus-within{box-shadow:inset 0 0 0 2px var(--ink)}
.s2-rvp-fb{position:relative;width:52px;height:36px;border-radius:999px}
.s2-rvp-fb .i{width:20px;height:20px}
.s2-rvp-fn{position:absolute;top:-6px;left:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--ink);color:var(--on-ink);font:600 12px/20px var(--f);font-style:normal}
.s2-rvp-sp{flex:1}
.s2-rvp-sort{gap:8px;padding:0 16px}
.s2-rvp-sort .i{width:16px;height:16px}
.s2-rvp .s2-rvs{grid-template-columns:1fr;gap:40px}
.s2-rvp-none{display:flex;flex-direction:column;align-items:flex-start;gap:16px;color:var(--ink-2)}
@container (max-width:600px){
  .s2-rvp-in{grid-template-columns:1fr;gap:0;padding:0 0 40px}
  .s2-rvp-card{position:static;border-radius:0;box-shadow:none}
  .s2-rvp-best{padding:24px 20px 40px}
  .s2-rvp-main{padding:24px 20px 0}
  .s2-rvp-ph{margin:16px -20px 32px;padding:0 20px}
  .s2-rvp-ph button{width:80px;height:80px;border-radius:8px}
  .s2-rvp-tb{margin:24px 0 32px}
  .s2-rvp-q{width:52px;padding:0 15px;overflow:hidden}
  .s2-rvp-q input{width:0;flex:0}
  .s2-rvp-q:focus-within{width:auto;flex:1}
  .s2-rvp-q:focus-within input{flex:1;width:auto}
}
/* reviews «فیلترها» */
.s2-mdrf .s-md-b{padding-top:8px}
.s2-mdrf .s-md-b>.s-fs-sec:first-child{border-top:0;padding-top:12px}
.s2-mdrf .s2-rvr li{gap:16px}
.s2-rvf-av{width:24px;height:24px}
.s2-rvf-av .ini{font-size:10px}
.s2-rvf-r{display:inline-flex;align-items:center;gap:2px;font:600 14px/20px var(--f)}
.s2-rvf-r .i{width:14px;height:14px;color:var(--star)}
.s2-rvf-more{display:inline-block;margin-top:16px}
.s2-mdrf .s-md-f{justify-content:space-between;align-items:center}
.s2-mdrf .s-md-f>.s-btn{flex:none}
.s2-rvf-clr{font:600 16px/22px var(--f);color:var(--ink);height:48px;padding:0 4px}
.s2-mdrf .s-fchip{padding-inline-start:8px}
.s2-mdrf .s-fchip:not(:has(.av)){padding-inline-start:15px}
/* «انتخاب یک گزینه» */
.s2-opt{min-height:calc(100vh - var(--s2-top))}
.s2-opt-in{width:696px;max-width:100%;margin:0 auto;padding:36px 0 96px}
.s2-opt-in h1{font:700 40px/48px var(--f);margin-bottom:32px}
.s2-opt-l{display:flex;flex-direction:column;gap:12px}
.s2-opt-i{display:flex;align-items:center;gap:16px;width:100%;min-height:80px;padding:16px 24px;border-radius:16px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line);text-align:start}
.s2-opt-i:hover{box-shadow:inset 0 0 0 1px var(--line-2)}
.s2-opt-i>span{flex:1;display:flex;flex-direction:column}
.s2-opt-i b{font:500 16px/22px var(--f)}
.s2-opt-i small{font:400 14px/20px var(--f);color:var(--ink-2)}
.s2-opt-i .i{width:24px;height:24px}
@container (max-width:600px){
  .s2-opt-in{padding:8px 20px 40px}
  .s2-opt-in h1{font:600 28px/36px var(--f);margin-bottom:24px}
  .s2-opt-i{min-height:72px;padding:16px}
}
/* option picker («یک گزینه انتخاب کنید · اجباری») */
.s2-mdv .mdl{background:var(--bg-2)}
.s2-mdv .s-md-f{background:var(--bg-2);justify-content:space-between;align-items:center}
.s2-mdv .s-md-f>.s-btn{flex:none;min-width:70px}
.s2-var-rt{display:flex;align-items:center;gap:4px;font:600 14px/20px var(--f);margin:-4px 0 32px}
.s2-var-rt .i{width:16px;height:16px;color:var(--star)}
.s2-var-rt span{color:var(--brand);font-weight:400}
.s2-var-h{margin-bottom:12px}
.s2-var-h h3{font:600 19px/24px var(--f)}
.s2-var-h small{font:400 13px/16px var(--f);color:var(--ink-2)}
.s2-var-l{display:flex;flex-direction:column;gap:12px}
.s2-var-i{display:flex;align-items:center;gap:16px;width:100%;padding:24px;border-radius:12px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line);text-align:start}
.s2-var-i:hover{background:var(--bg-2)}
.s2-var-i>span{flex:1;display:flex;flex-direction:column}
.s2-var-i b{font:400 16px/22px var(--f)}
.s2-var-i small{font:400 13px/16px var(--f);color:var(--ink-2);margin-bottom:12px}
.s2-var-i em{font:600 16px/22px var(--f);font-style:normal}
.s2-rdo{width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg);flex:none}
.s2-var-i.on{box-shadow:inset 0 0 0 2px var(--brand)}
.s2-var-i.on .s2-rdo{box-shadow:inset 0 0 0 7px var(--brand)}
.s2-var-f{display:flex;flex-direction:column}
.s2-var-f b{font:600 19px/24px var(--f)}
.s2-var-f small{font:400 13px/16px var(--f);color:var(--ink-2)}
@container (max-width:600px){
  .s2-mdv .mdl{background:var(--bg)}
  .s2-mdv .s-md-f{background:var(--bg)}
  .s2-var-l{gap:0;margin:0 -20px;border-top:1px solid var(--line)}
  .s2-var-i{border-radius:0;box-shadow:none;border-bottom:1px solid var(--line);padding:16px 20px}
  .s2-var-i.on{box-shadow:none;background:var(--bg-2)}
}
/* professional profile modal */
.s2-mdp .s-md-b{padding:0}
.s2-prm-top{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;padding:24px 36px 0;margin-bottom:-72px;pointer-events:none}
.s2-prm-top .s-icb{pointer-events:auto}
.s2-prm-hd{display:flex;flex-direction:column;align-items:center;text-align:center;padding:72px 48px 32px;background:var(--bg-4)}
.s2-prm-av{margin-bottom:16px}
.s2-prm-hd h2{font:600 22px/28px var(--f);margin-bottom:8px}
.s2-prm-hd p{font:400 16px/22px var(--f)}
.s2-prm-rt{display:flex;align-items:center;gap:4px;margin:4px 0}
.s2-prm-rt .i{width:16px;height:16px;color:var(--star)}
.s2-prm-rt span{color:var(--ink-2)}
.s2-prm-b{padding:32px 48px 40px}
.s2-prm-tabs{display:flex;gap:8px;margin-bottom:40px}
.s2-prm-tabs button{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 15px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font:500 14px/20px var(--f)}
.s2-prm-tabs button.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.s2-prm-tabs .s-cnt{background:var(--bg-3)}
.s2-prm-b section{margin-bottom:48px}
.s2-prm-b h3{font:600 19px/24px var(--f);margin-bottom:16px}
.s2-prm-st{display:flex;flex-direction:column;gap:8px;margin-bottom:48px}
.s2-prm-st div{display:flex;justify-content:space-between;font:400 16px/22px var(--f)}
.s2-prm-st dd{color:var(--ink-2);margin:0}
.s2-prm-b .s2-langs span{background:var(--bg-3);box-shadow:none}
.s2-prm-b .s2-rvs{grid-template-columns:1fr;gap:24px}
@container (max-width:600px){
  .s2-mdp .mdl{max-height:100%;height:100%;border-radius:0}
  .s2-prm-top{padding:12px 8px 0}
  .s2-prm-hd{padding:64px 20px 24px}
  .s2-prm-b{padding:24px 20px 32px}
}
/* time step: professional list modal, ✓ on the chosen one, calendar popover, waitlist line */
.s2-mdpro .mdl{background:var(--bg-2)}
.s2-mdpro .s2-pc.on{box-shadow:inset 0 0 0 2px var(--brand)}
.s2-pc-ok{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--brand);color:#fff;flex:none}
.s2-pc-ok .i{width:20px;height:20px}
.s2-cpl{padding:24px;border-radius:16px;min-width:348px}
.s2-cp-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.s2-cp-h b{font:600 16px/22px var(--f)}
.s2-cp-h .s-icb{width:40px;height:40px}
.s2-cp-g{display:grid;grid-template-columns:repeat(7,44px);row-gap:0;justify-content:center}
.s2-cp-g abbr{height:40px;display:grid;place-items:center;font:500 14px/20px var(--f);color:var(--ink-2);text-decoration:none}
.s2-cp-d{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font:500 14px/20px var(--f);color:var(--ink-3)}
.s2-cp-d.free{color:var(--ink)}
.s2-cp-d:hover:not(:disabled){background:var(--bg-2)}
.s2-cp-d.today{box-shadow:inset 0 0 0 1px var(--line-2)}
.s2-cp-d.sel{background:var(--brand);color:#fff;box-shadow:none}
.s2-cp-d:disabled{cursor:default}
.s-ddl--sheet .s2-cpl{padding:0 20px 24px}
.s-ddl--sheet .s2-cp-g{grid-template-columns:repeat(7,1fr)}
.s-ddl--sheet .s2-cp-d{width:100%;max-width:48px;justify-self:center}
.s2-wl{font:400 14px/20px var(--f);color:var(--ink-2);text-align:center;padding:16px 0}
/* group appointment: the «من» card */
.s2-gme{display:flex;align-items:center;gap:12px;padding:20px 24px;margin-bottom:32px;border-radius:16px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line)}
.s2-gme-a{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--brand-soft);color:var(--brand);flex:none}
.s2-gme-a .i{width:28px;height:28px}
.s2-gme b{font:500 16px/22px var(--f);flex:1}
@container (max-width:600px){.s2-gme{padding:16px;margin-bottom:24px}}
/* gift card steps (طرح › مبلغ › پرداخت › ارسال) */
.s2-gcs{--s2-fade:var(--bg-2)}
.s2-gcp{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px 32px 0;background:var(--bg-2);position:sticky;top:var(--s2-top);z-index:11}
.s2-gcp i{height:4px;border-radius:2px;background:var(--bg-3)}
.s2-gcp i.on{background:var(--brand)}
.s2-gcs .s2-bk-top{top:calc(var(--s2-top) + 16px)}
.s2-gcs-side{position:sticky;top:calc(var(--s2-top) + 108px);padding:48px 24px 24px;border-radius:16px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line);display:flex;flex-direction:column;gap:20px}
.s2-gcs-side .s2-gcc{width:330px;margin:0 auto;box-shadow:0 10px 30px -14px rgba(0,0,0,.45)}
.s2-gcs-none{font:400 14px/20px var(--f);margin-top:20px}
.s2-gcs-t{display:flex;justify-content:space-between;font:600 16px/22px var(--f)}
.s2-gcs-l{display:flex;justify-content:space-between;gap:12px;margin-top:20px;font:400 14px/20px var(--f)}
.s2-gcs-l>div{display:flex;flex-direction:column}
.s2-gcs-l b{font-weight:500}
.s2-gct{margin-bottom:40px}
.s2-gct h2{font:600 22px/28px var(--f);margin-bottom:24px}
.s2-gct-g{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.s2-gct-i{display:block;padding:3px;border-radius:10px;box-shadow:inset 0 0 0 1px var(--line);background:var(--bg)}
.s2-gct-i>span{display:grid;place-items:center;aspect-ratio:197/125;border-radius:7px;overflow:hidden}
.s2-gct-i em{font-style:normal;font-size:56px;line-height:1}
.s2-gct-i.on{box-shadow:inset 0 0 0 2px var(--brand)}
.s2-gcc--l{color:var(--ink)}
.s2-gcc--l .s2-gcc-l{color:#0d0d0d}
.s2-gcc--l .s2-gcc-t,.s2-gcc--l .s2-gcc-to{color:#0d0d0d}
.s2-gcc-em{position:absolute;top:50%;left:50%;transform:translate(-50%,-58%);font-size:84px;line-height:1}
.s2 .s2-gcc-ch,.s2-gcc-ch{position:absolute;bottom:20px;inset-inline-end:16px;height:36px;padding:0 15px;border-radius:999px;background:#fff;color:#0d0d0d;font:500 14px/20px var(--f);box-shadow:var(--sh-small)}
.s2-gca2-l{font:600 13px/16px var(--f);margin-bottom:8px}
.s2-gca2-v{font:700 40px/48px var(--f);margin-bottom:24px}
.s2-gca2-v small{font:700 22px/28px var(--f)}
.s2-gca2-g{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.s2 .s2-gca2-i{display:grid;place-items:center;height:76px;border-radius:8px;background:var(--s2-surf);box-shadow:inset 0 0 0 1px var(--line);font:600 19px/24px var(--f)}
.s2-gca2-i .i{width:24px;height:24px}
.s2-gca2-i.on{box-shadow:inset 0 0 0 2px var(--brand)}
.s2-gca2-c{display:flex;flex-direction:column;gap:8px;margin-top:20px;font:600 14px/20px var(--f)}
.s2-gca2-c input{height:48px;padding:0 16px;border-radius:12px;border:1px solid var(--line-2);background:var(--bg);font:500 16px/22px var(--f);color:var(--ink)}
.s2-gcs-card .s2-gcc{width:100%;margin-bottom:24px}
.s2-gcs-bar{display:none}
@container (max-width:600px){
  .s2-gcp{display:none}
  .s2-gcs .s2-bk-top{top:var(--s2-top)}
  .s2-gct{margin-bottom:24px}
  .s2-gct h2{font:600 19px/24px var(--f);margin-bottom:12px}
  .s2-gct-g{display:flex;overflow-x:auto;gap:16px;margin:0 -20px;padding:0 20px;scrollbar-width:none}
  .s2-gct-g::-webkit-scrollbar{display:none}
  .s2-gct-i{flex:none;width:155px}
  .s2-gct-i em{font-size:44px}
  .s2-gca2-g{grid-template-columns:repeat(2,1fr)}
  .s2-gca2-v{font:700 32px/40px var(--f)}
  .s2-gcs-bar{display:flex}
  .s2-gcs-bar .s2-btn.s2-full{width:100%}
}

/* ===== review 1405-07-24 ===== */
/* photo viewer (gallery photo → full screen, ← → keys) */
.s2-pv{position:relative;width:100%;height:100%;display:flex;flex-direction:column}
.s2-pv-h{display:flex;align-items:center;justify-content:space-between;height:72px;padding:0 24px;font:500 16px/22px var(--f);color:#fff}
.s2-pv-h .s-icb{color:#fff;background:rgba(255,255,255,.14)}
.s2-pv-im{flex:1;min-height:0;display:grid;place-items:center;padding:0 104px 48px}
.s2-pv-im img{width:100%;height:100%;max-width:960px;object-fit:contain;border-radius:8px}
.s2-pv-n{position:absolute;top:50%;width:48px;height:48px;margin-top:-24px;border-radius:50%;display:grid;place-items:center;background:var(--bg);color:var(--ink);box-shadow:var(--sh-small)}
.s2-pv-n .i{width:24px;height:24px}
.s2-pv-n:disabled{opacity:.3;cursor:default}
.s2-pv-prev{inset-inline-start:24px}.s2-pv-next{inset-inline-end:24px}
@container (max-width:600px){
  .s2-pv-h{height:56px;padding:0 16px}
  .s2-pv-im{padding:0 0 24px}
  .s2-pv-n{width:40px;height:40px;margin-top:-20px}
  .s2-pv-prev{inset-inline-start:8px}.s2-pv-next{inset-inline-end:8px}
}
/* gift card Pay step: the booking confirm step's boxes and radio rows */
.s2-paym{display:flex;flex-direction:column;gap:8px}
.s2-radio:disabled{opacity:.5;cursor:default}
/* gift card Send step («اشتراک کارت هدیه») */
.s2-gcform2{display:flex;flex-direction:column;gap:24px;max-width:560px}
.s2-gcfl{display:flex;flex-direction:column;gap:8px}
.s2-gcfl label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font:600 16px/22px var(--f)}
.s2-gcfl label small{font:400 16px/22px var(--f);color:var(--ink-2)}
.s2-gcfl input,.s2-gcfl textarea{width:100%;height:48px;padding:0 16px;border-radius:12px;border:0;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg);color:var(--ink);font:400 16px/22px var(--f);outline:0}
.s2-gcfl input[dir=ltr]{text-align:right}
.s2-gcfl textarea{height:auto;min-height:120px;padding:12px 16px;resize:vertical}
.s2-gcfl input:focus,.s2-gcfl textarea:focus{box-shadow:inset 0 0 0 2px var(--brand)}
.s2-gcfl>.s2-mut{font:400 14px/20px var(--f)}
.s2-gcdate{width:100%;cursor:pointer;text-align:start;font:400 16px/22px var(--f);color:var(--ink);background:var(--bg)}
.s2-gcd{display:flex;flex-direction:column;gap:12px;padding:8px 16px 16px;min-width:320px}
.s2-gcd .s2-radio{padding:12px 16px}
.s2-btn.s2-gco{background:transparent;border-color:rgba(255,255,255,.6);color:#fff}
.s2-gc-cta{display:flex;gap:12px;flex-wrap:wrap}
.s2-gc-mb{display:flex;flex-direction:column;gap:8px;width:100%}
.s2-gc-mb .s2-btn{width:100%}
.s2-err{font:400 14px/20px var(--f);color:var(--bad)}
.s2-gcfl input[aria-invalid=true]{box-shadow:inset 0 0 0 2px var(--bad)}

/* ===== responsive (review 1405-07-24) ===== */
/* booking + gift-card steps: the side summary narrows, and below 1000px it gives way to the phone's bottom bar */
@container (min-width:601px) and (max-width:1279px){
  .s2-bk-in{grid-template-columns:minmax(0,644px) minmax(300px,400px);gap:32px 48px}
  .s2-gcs-side .s2-gcc{width:100%;max-width:330px}
  .s2-gc-in{grid-template-columns:minmax(0,1fr) minmax(0,417px);gap:48px;padding:96px 48px}
}
@container (min-width:601px) and (max-width:999px){
  .s2-bk-in,.s2-bk-in.s2-solo{grid-template-columns:minmax(0,644px);padding:0 32px 32px}
  .s2-bk-side{display:none}
  .s2-bbar{position:sticky;bottom:0;z-index:12;display:flex;align-items:center;justify-content:space-between;gap:12px;height:80px;padding:16px 32px;background:var(--bg);box-shadow:0 -1px 0 0 var(--line)}
  .s2-bbar-l{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
  .s2-bbar-l b{font:600 19px/24px var(--f)}
  .s2-bbar-l>span{display:flex;align-items:center;gap:4px;font:400 14px/20px var(--f);color:var(--ink-2);white-space:nowrap}
  .s2-bbar-l .i{width:16px;height:16px}
  .s2-bbar .s2-btn{min-width:131px}
  .s2-gcs-bar{display:flex}
  .s2-gc-in{display:block;padding:120px 48px 48px}
  .s2-gc-r{margin-top:48px}
}
/* the amount step shows its card in the content column whenever the side summary is hidden */
.s2-gcs-card{display:none}
@container (max-width:999px){.s2-gcs-card{display:block}}
/* reviews page: the summary card column narrows, and below 1000px it stacks above the reviews */
@container (min-width:601px) and (max-width:1279px){
  .s2-rvp-in{grid-template-columns:minmax(0,320px) minmax(0,728px);gap:48px}
  .s2-rvp-q{width:auto;flex:1;max-width:300px}
}
@container (min-width:601px) and (max-width:999px){
  .s2-rvp-in{grid-template-columns:minmax(0,728px);gap:32px}
  .s2-rvp-card{position:static}
}
/* tablet: the amount step's card keeps the card size; favourites in two columns */
@container (min-width:601px){.s2-gcs-card .s2-gcc{max-width:417px;margin-inline:auto}}

/* ======================= restyle v3 (venue, professional, booking, gift) — form only, colours unchanged ======================= */
.s2-btn{border-radius:var(--r-btn);transition:background-color var(--d-2) var(--ease),border-color var(--d-2),box-shadow var(--d-2),transform var(--d-1),opacity var(--d-2)}
.s2-btn.s2-sm{border-radius:var(--r-ctl)}
.s2-btn:not(.s2-pri):not(.s2-gcw):not(.s2-gco):not(:disabled):hover{background:var(--bg-2);border-color:var(--ink-3)}
.s2-btn.s2-pri:not(:disabled):hover{background:color-mix(in srgb,var(--ink) 86%,var(--bg));border-color:transparent}
.s2-btn:active:not(:disabled){transform:translateY(1px)}
.s2-btn.s2-gcw:hover{background:#ececec}
.s2-cb{border-radius:var(--r-md);border-color:var(--line-2);transition:background-color var(--d-2),border-color var(--d-2)}
.s2-cb:hover{background:var(--bg-2);border-color:var(--ink-3)}
.s2-cb.s2-cb36{border-radius:var(--r-ctl)}
.s2-cb.s2-ov{border-radius:50%;box-shadow:var(--sh-card-1)}
.s2-mh .s2-cb{border-radius:var(--r-ctl)}
.s2-lnk{font-weight:600}
/* chips + tabs */
.s2-chips li button,.s2-ptabs button,.s2-tchips button,.s2-prm-tabs button{transition:background-color var(--d-2) var(--ease),box-shadow var(--d-2),color var(--d-2)}
.s2-chips li button:hover:not(.on),.s2-ptabs button:hover:not(.on),.s2-tchips button:hover:not(.on),.s2-prm-tabs button:hover:not(.on){background:var(--bg-2)}
.s2-stab{box-shadow:0 8px 20px -20px rgba(13,13,13,.45)}
.s2-stab button{transition:color var(--d-2)}
.s2-stab button:hover{color:var(--ink)}
/* venue page */
.s2-vh h1{letter-spacing:-.02em;line-height:1.2}
.s2-sec h2,.s2-near h2,.s2-treat h2,.s2-ab-row h3,.s2-ps h2,.s2-pstats h2,.s2-gh,.s2-cbox h2,.s2-pick h2,.s2-dsel-h p,.s2-mh h2,.s2-done h2,.s2-gct h2,.s2-var-h h3,.s2-prm-hd h2{font-weight:700;letter-spacing:var(--tr-head)}
.s2-gal-d>button,.s2-vc-i,.s2-pf button,.s2-galm-i,.s2-ab-map>a,.s2-pmap{border-radius:var(--r-card)}
.s2-gal-d>button img,.s2-vc-i img{transition:transform .6s var(--ease)}
@media (hover:hover){.s2-gal-d>button:hover img{transform:scale(1.025)}}
.s2-card{border-radius:var(--r-lg);box-shadow:var(--sh-card-1)}
.s2-sc,.s2-bc,.s2-pc,.s2-cbox,.s2-radio,.s2-opt-i,.s2-var-i,.s2-slot,.s2-wcard,.s2-gme,.s2-rvp-card{border-radius:var(--r-card);box-shadow:var(--sh-card-1);transition:box-shadow var(--d-2) var(--ease),transform var(--d-3) var(--ease),background-color var(--d-2)}
.s2-radio,.s2-var-i{border-radius:var(--r-md)}
.s2-sc:hover,.s2-bc:hover:not(.on),.s2-pc:hover:not(.on):not(.s2-addg),.s2-radio:hover:not(.on):not(:disabled),.s2-var-i:hover:not(.on),.s2-slot:hover:not(.on),.s2-opt-i:hover{box-shadow:inset 0 0 0 1px var(--line-2),var(--sh-1)}
.s2-bc.on,.s2-pc.on,.s2-radio.on,.s2-var-i.on,.s2-slot.on,.s2-mdpro .s2-pc.on{box-shadow:var(--sh-card-on)}
.s2-pc.s2-addg{box-shadow:none}
@media (hover:hover){
  .s2-sc:hover,.s2-opt-i:hover{transform:translateY(var(--lift));box-shadow:var(--sh-card-h)}
}
.s2-sc h3,.s2-bc h3,.s2-pc-t h3,.s2-opt-i b{font-weight:550}
.s2-bc-r b,.s2-var-i em{font-weight:650;letter-spacing:var(--tr-head)}
.s2-add{border-color:var(--line-2);box-shadow:var(--sh-1);transition:background-color var(--d-2),transform var(--d-2) var(--ease-spring),color var(--d-2)}
.s2-bc:hover .s2-add{transform:scale(1.06)}
.s2-rp,.s2-badge{box-shadow:var(--sh-card-1);font-weight:600}
.s2-reply{border-radius:var(--r-md)}
.s2-abox{border-radius:var(--r-ctl)}
.s2-best-n>span:not(.s2-tro),.s2-rvm-n b,.s2-pbig{letter-spacing:var(--tr-fig)}
.s2-vc{transition:transform var(--d-3) var(--ease)}
.s2-vc-i{transition:box-shadow var(--d-3) var(--ease)}
.s2-vc-n p{font-weight:650;letter-spacing:var(--tr-head)}
@media (hover:hover){.s2-vc:hover{transform:translateY(var(--lift))}.s2-vc:hover .s2-vc-i{box-shadow:var(--sh-2)}}
.s2-hours li.today{font-weight:650}
.s2-pcard{border-radius:var(--r-xl);box-shadow:inset 0 0 0 1px var(--line)}
.s2-pinfo h1,.s2-rvp-main h1{font-weight:700;letter-spacing:var(--tr-head)}
/* booking flow */
.s2-bk-h h1,.s2-opt-in h1,.s2-galm-h h2,.s2-gc-l h1{letter-spacing:-.02em;line-height:1.2}
.s2-bk-top.sc{box-shadow:0 1px 0 var(--line),0 8px 20px -18px rgba(13,13,13,.4)}
.s2-crumb .cur{font-weight:650}
.s2-sum{border-radius:var(--r-lg);box-shadow:var(--sh-card-1)}
.s2-sum-ph{border-radius:var(--r-ctl)}
.s2-sum-t>div{font-weight:700;font-size:18px;letter-spacing:var(--tr-head)}
.s2-sum-v>div>p:first-child{font-weight:650}
.s2-day{border-radius:var(--r-md);border-color:var(--line);box-shadow:var(--sh-1);transition:background-color var(--d-2),border-color var(--d-2)}
.s2-day:hover:not(.on):not(.off){border-color:var(--ink-3)}
.s2-day b{letter-spacing:var(--tr-fig)}
.s2-day span:first-child{font-size:var(--t-cap);font-weight:600;letter-spacing:var(--tr-label)}
.s2-nav{border-radius:var(--r-ctl)}
.s2-nav:hover:not(:disabled){background:var(--hover-tint)}
.s2-pop{border-radius:var(--r-card);box-shadow:var(--sh-pop-2);padding:6px}
.s2-popi{border-radius:var(--r-sm);transition:background-color var(--d-1)}
.s2-rdot{transition:border-width var(--d-2) var(--ease)}
.s2-cbox textarea,.s2-selb,.s2-gca2-c input{border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.s2-cbox textarea:hover,.s2-selb:hover,.s2-gca2-c input:hover{border-color:var(--ink-3)}
.s2-cbox textarea:focus,.s2-gca2-c input:focus{outline:0;border-color:var(--brand);box-shadow:var(--ring)}
.s2-selb:focus-within{border-color:var(--brand);box-shadow:var(--ring)}
.s2-gcfl input,.s2-gcfl textarea{border-radius:var(--r-ctl);transition:box-shadow var(--d-2)}
.s2-gcfl input:hover,.s2-gcfl textarea:hover{box-shadow:inset 0 0 0 1px var(--ink-3)}
.s2-gcfl input:focus,.s2-gcfl textarea:focus{box-shadow:inset 0 0 0 1px var(--brand),var(--ring)}
.s2-gcfl input[aria-invalid=true]{box-shadow:inset 0 0 0 2px var(--bad)}
.s2-done-i{box-shadow:0 0 0 8px color-mix(in srgb,var(--ok) 10%,transparent)}
.s2-bbar{box-shadow:0 -1px 0 var(--line),0 -10px 24px -22px rgba(13,13,13,.5)}
.s2-bbar-l b{font-weight:700;letter-spacing:var(--tr-head)}
.s2-mbar{box-shadow:0 -10px 24px -22px rgba(13,13,13,.5)}
/* modals */
.s2-ovc .mdl{border-radius:var(--r-xl);box-shadow:var(--sh-3);animation:s-rv-in .32s var(--ease)}
.s2-shv{border-radius:var(--r-md)}
.s2-calm .mg-d{transition:background-color var(--d-1)}
.s2-cpl{border-radius:var(--r-card)}
.s2-cp-d{transition:background-color var(--d-1)}
.s2-ck i{border-radius:7px;transition:background-color var(--d-2)}
/* gift steps */
.s2-gct-i{border-radius:var(--r-md);transition:box-shadow var(--d-2)}
.s2-gct-i>span{border-radius:9px}
.s2-gct-i:hover:not(.on){box-shadow:inset 0 0 0 1px var(--line-2)}
.s2 .s2-gca2-i{border-radius:var(--r-md);box-shadow:var(--sh-card-1);transition:box-shadow var(--d-2)}
.s2 .s2-gca2-i:hover:not(.on){box-shadow:inset 0 0 0 1px var(--line-2),var(--sh-1)}
.s2 .s2-gca2-i.on{box-shadow:var(--sh-card-on)}
.s2-gca2-l{font-size:var(--t-cap);font-weight:600;letter-spacing:var(--tr-label);color:var(--ink-2)}
.s2-gca2-v{letter-spacing:var(--tr-fig)}
.s2-gcs-side{border-radius:var(--r-lg)}
.s2-gcp i{border-radius:var(--r-pill);transition:background-color var(--d-3) var(--ease)}
.s2-gcc{border-radius:var(--r-xl)}
.s2-gca button{transition:background-color var(--d-2),box-shadow var(--d-2)}
.s2-gcpay>div,.s2-gcf input,.s2-gcf textarea{border-radius:var(--r-ctl)}
.s2-gcsum{border-radius:var(--r-card)}
.s2-pv-n{box-shadow:var(--sh-pop-2)}
@container (max-width:600px){
  .s2-ovc .mdl{border-radius:var(--r-xl) var(--r-xl) 0 0;animation:s-up .28s var(--ease)}
  .s2-sheet{border-radius:var(--r-xl) var(--r-xl) 0 0}
  .s2-var-i,.s2-var-i:hover:not(.on),.s2-var-i.on{border-radius:0;box-shadow:none}
  .s2-rvp-card{border-radius:0;box-shadow:none}
  .s2-pcard{border-radius:0;box-shadow:none}
}

/* pro page, tablet widths (1405-07-26): the reviews column is ~250px wide between 600 and 1100px, too narrow for two
   review cards side by side — one card per row there, and the reviewer line may shrink instead of overflowing */
.s2-rv-h>*{min-width:0}
@media (min-width:600px) and (max-width:1100px){.s2-pro .s2-rvs{grid-template-columns:1fr}}

/* ======================= restyle v3 palette (customer) — Accord LIGHT colours (CONVENTIONS «restyle v3 palette») =======================
   Light = Accord; literals that changed got local tokens whose dark value is the old one (dark mode unchanged). */
:root{--s2-dot:#22a06b;--s2-map-l:#eef1ea;--s2-map-w:#a9dbe2;--s2-map-p:#c4e3d2;--s2-map-tx:#5c6a63;--s2-gift:#14231d;--s2-surf:var(--bg);--s2-ring:#14231d1a;
  --s2-canvas:var(--page);--s2-tro-1:#0b7658;--s2-tro-2:#12a079;--s2-tro-3:#0b5440;
  --s2-gc-g:radial-gradient(42% 70% at 6% 22%,rgba(18,160,121,.75) 0%,rgba(11,118,88,.55) 32%,rgba(20,35,29,0) 72%),radial-gradient(30% 34% at 2% 72%,rgba(211,238,226,.35) 0%,rgba(20,35,29,0) 75%)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--s2-dot:#78d240;--s2-map-tx:#8a8f93;--s2-gift:#191f21;--s2-canvas:var(--bg-2);--s2-tro-1:#a259f5;--s2-tro-2:#b57af7;--s2-tro-3:#9b45f0;
  --s2-gc-g:radial-gradient(42% 70% at 6% 22%,rgba(150,112,214,.95) 0%,rgba(104,74,190,.75) 32%,rgba(25,31,33,0) 72%),radial-gradient(30% 34% at 2% 72%,rgba(176,82,170,.55) 0%,rgba(25,31,33,0) 75%)}}
:root[data-theme="dark"]{--s2-dot:#78d240;--s2-map-tx:#8a8f93;--s2-gift:#191f21;--s2-canvas:var(--bg-2);--s2-tro-1:#a259f5;--s2-tro-2:#b57af7;--s2-tro-3:#9b45f0;
  --s2-gc-g:radial-gradient(42% 70% at 6% 22%,rgba(150,112,214,.95) 0%,rgba(104,74,190,.75) 32%,rgba(25,31,33,0) 72%),radial-gradient(30% 34% at 2% 72%,rgba(176,82,170,.55) 0%,rgba(25,31,33,0) 75%)}
.s2-bk{background:var(--s2-canvas);--s2-fade:var(--s2-canvas)}
.s2-bk-top{background:var(--s2-canvas)}
.s2-tro{color:var(--s2-tro-1)} .s2-tro .t{color:var(--s2-tro-2)} .s2-tro .a,.s2-tro .b{color:var(--s2-tro-3)}
.s2-gc-glow{background:var(--s2-gc-g)}
/* filled selected = night (Accord): day, picked service, calendar day, colour/date pick */
.s2-day.on{background:var(--sel);border-color:var(--sel);color:var(--on-sel)}
.s2-day.on span,.s2-day.on b{color:var(--on-sel)}
.s2-bc.on .s2-add{background:var(--sel);border-color:var(--sel);color:var(--on-sel)}
.s2-calm .mg-d[aria-pressed="true"],.s2-cp-d.sel{background:var(--sel);color:var(--on-sel)}
.s2-calm .mg-d i{background:var(--accent)}
/* the «قیچی» brand gift-card design (inline style from site2.js / capp.js) follows the palette */
:root{--s2-gc-brand:linear-gradient(225deg,#12a079 0%,#0b7658 55%,#14231d 100%);--s2-gc-solid:#0b7658}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--s2-gc-brand:linear-gradient(225deg,#ff7dfa 0%,#6950f3 55%,#6950f3 100%);--s2-gc-solid:#6950f3}}
:root[data-theme="dark"]{--s2-gc-brand:linear-gradient(225deg,#ff7dfa 0%,#6950f3 55%,#6950f3 100%);--s2-gc-solid:#6950f3}
[style*="#ff7dfa 0%,#6950f3 55%"]{background:var(--s2-gc-brand)!important}
[style="background:#6950f3"]{background:var(--s2-gc-solid)!important}
[style*="#6860fe 0%,#6860fe 35%"]{background:var(--s2-gc-brand)!important}


/* site3 — account pages + business marketing pages. Measurements from capture/out/acct-*, forbiz-*, pricing-d,
   features-d, download-d. Mobile = container ≤600px (same markup inside the phone frame). */
:root{--s3-ink:#14231d;--s3-mk2:#5c6a63;--s3-lav:#d3eee2;--s3-g1:#fbfbf8;--s3-faq:#f1f2ec;--s3-foot:#14231d;--s3-glass:rgba(255,255,253,.72)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--s3-ink:#f5f5f5;--s3-mk2:#bfbfbf;--s3-lav:#201e45;--s3-g1:#131313;--s3-faq:#262626;--s3-foot:#000;--s3-glass:rgba(29,29,29,.7)}}
:root[data-theme="dark"]{--s3-ink:#f5f5f5;--s3-mk2:#bfbfbf;--s3-lav:#201e45;--s3-g1:#131313;--s3-faq:#262626;--s3-foot:#000;--s3-glass:rgba(29,29,29,.7)}

/* ---------- shared bits ---------- */
.s3-cover{position:absolute;inset:0;z-index:1;border-radius:inherit;background:none;border:0;padding:0;cursor:pointer}
.s3-btn{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;border-radius:999px;background:var(--bg);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2);font:500 14px/20px var(--f);height:36px;padding:0 15px;cursor:pointer}
.s3-btn .i{width:20px;height:20px}
.s3-btn.lg{height:48px;padding:0 19px;font:600 16px/22px var(--f)}
.s3-btn.pri{background:var(--ink);color:var(--on-ink);box-shadow:none}
.s3-btn.red{color:var(--bad)}
.s3-btn.danger{background:var(--bad);color:#fff;box-shadow:none}
.s3-btn.dis{opacity:.35;pointer-events:none}
.s3-btn.ghostw{background:transparent;color:#fff;box-shadow:inset 0 0 0 1px #fff}
.s3-btn:hover{background:var(--bg-2)}.s3-btn.pri:hover{background:var(--ink);opacity:.88}.s3-btn.ghostw:hover{background:rgba(255,255,255,.12)}
.s3-link{position:relative;z-index:2;color:var(--brand);font:500 14px/20px var(--f);border-radius:4px;cursor:pointer;background:none;border:0;padding:0}
.s3-icb{position:relative;z-index:2;display:grid;place-items:center;width:48px;height:48px;border-radius:999px;color:var(--ink);background:transparent}
.s3-icb .i{width:24px;height:24px}
.s3-icb.sm{width:36px;height:36px}
.s3-icb.sm .i{width:20px;height:20px}
.s3-icb:hover{background:var(--bg-2)}
.s3-flip{transform:scaleX(-1)}
.s3-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--brand);color:#fff;font:600 13px/16px var(--f);box-shadow:0 0 0 2px var(--bg)}
.s3-badge-i{background:rgba(255,255,255,.17);box-shadow:none;color:var(--on-ink)}
.s3-thumb{display:block;flex:none;width:48px;height:48px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;padding:1px;background:var(--bg)}
.s3-thumb img,.s3-thumb .noph{width:100%;height:100%;object-fit:cover;border-radius:7px}
.s3-thumb.sm{width:40px;height:40px}
.s3-illo{width:56px;height:56px;display:block}
.s3-d{}.s3-m{display:none}

/* ---------- fallback header (only when site.js has no siteHeader) ---------- */
.s3-fh{position:sticky;top:0;z-index:100;height:72px;display:grid;grid-template-columns:1fr minmax(0,723px) 1fr;align-items:center;gap:32px;padding:12px 32px;background:var(--bg);box-shadow:0 4px 2px -2px rgba(19,19,19,.06)}
.s3-fh-s{display:flex;align-items:center;height:50px;border:1px solid var(--line);border-radius:100px;box-shadow:0 2px 4px rgba(20,20,20,.12);background:var(--bg);padding-inline-end:6px}
.s3-fh-s label{flex:1;display:flex;align-items:center;height:48px;padding:0 16px;font:500 14px/20px var(--f);position:relative}
.s3-fh-s label+label::before{content:"";position:absolute;inset-inline-start:0;top:12px;bottom:12px;width:1px;background:var(--line)}
.s3-fh-go{width:36px;height:36px;border-radius:50%;background:var(--ink);color:var(--on-ink);display:grid;place-items:center}
.s3-fh-r{display:flex;justify-content:flex-end}
.s3-fh-me{display:flex;align-items:center;gap:8px;height:48px;padding-inline:4px 8px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2)}
.s3-fh-av{position:relative}.s3-fh-av .av{display:block;width:40px;height:40px;border-radius:50%;overflow:hidden;background:var(--brand-soft)}
.s3-fh-av .av img{width:100%;height:100%;object-fit:cover}
.s3-fh-av i{position:absolute;top:-2px;inset-inline-start:-2px;min-width:20px;height:20px;border-radius:999px;background:var(--brand);color:#fff;font:600 13px/20px var(--f);font-style:normal;text-align:center;box-shadow:0 0 0 2px var(--bg)}
.s3-fh .logo{height:48px}

/* ---------- account shell ---------- */
.s3-acct{min-height:calc(100vh - var(--hub-h))}
.s3-bg-b4{--s3-pg:var(--bg-4)}.s3-bg-b2{--s3-pg:var(--bg-2)}.s3-bg-w{--s3-pg:var(--bg)}
.s3-body{display:grid;grid-template-columns:248px minmax(0,1fr);background:var(--s3-pg);min-height:calc(100vh - 72px - var(--hub-h))}
.s3-side{position:sticky;top:calc(72px + var(--hub-h));align-self:start;height:calc(100vh - 72px - var(--hub-h));background:var(--bg);border-inline-end:1px solid var(--line);padding:24px 32px 64px}
.s3-side-n{font:600 19px/24px var(--f);padding:8px 0 8px;margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s3-side ul{list-style:none;margin:0;padding:0}
.s3-side li{margin:0 -16px}
.s3-side a{display:flex;align-items:center;gap:12px;height:44px;padding:12px 16px;border-radius:8px;font:500 14px/20px var(--f)}
.s3-side a span{flex:1}
.s3-side a:hover{background:var(--bg-2)}
.s3-side li.on a{background:var(--brand-soft)}
.s3-main{min-width:0;background:var(--s3-pg)}
.s3-mback{display:none}
.s3-wrap{max-width:1000px;margin:0 auto 40px;padding:0 20px;display:flex;flex-direction:column;gap:40px}
.s3-titlerow{display:flex;align-items:center;justify-content:space-between;margin-top:40px}
.s3-h1{font:600 28px/36px var(--f);margin:0}
.s3-sub{font:400 16px/22px var(--f);color:var(--ink-2);margin-top:-24px}
.s3-ct{font:600 19px/24px var(--f);margin:0}
.s3-cs{font:400 14px/20px var(--f);color:var(--ink-2);margin:0}
.s3-card{background:var(--bg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);padding:32px}
.s3-hr{border:0;height:1px;background:var(--ink);opacity:.1;margin:20px 0}
.s3-center{display:grid;place-items:center;min-height:calc(100vh - 72px - var(--hub-h))}
.s3-center .s3-empty{border:0;padding:64px 24px}

/* empty state */
.s3-empty{display:flex;justify-content:center;border:1px solid var(--line);border-radius:8px;padding:32px 24px}
.s3-empty-in{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;max-width:512px}
.s3-empty-t{display:flex;flex-direction:column;align-items:center;gap:16px;font:600 22px/28px var(--f)}
.s3-empty-s{font:400 16px/22px var(--f);color:var(--ink-2);max-width:310px}
.s3-empty-in>.s3-btn{margin-top:24px}

/* ---------- appointments ---------- */
.s3-split{display:grid;grid-template-columns:392px 536px;gap:32px;align-items:start}
.s3-split-l{padding-inline-end:32px}
.s3-aplist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:24px}
.s3-apsec{display:flex;flex-direction:column;gap:16px}
.s3-sh{display:flex;align-items:center;gap:8px}
.s3-sh p{font:600 22px/28px var(--f);margin:0}
.s3-cnt{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--bg);color:var(--ink-2);font:500 13px/16px var(--f);box-shadow:0 0 0 1px var(--line),0 0 0 2px var(--bg)}
.s3-cards{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.s3-ac{position:relative;background:var(--bg);border-radius:16px;overflow:hidden;display:flex;min-height:120px}
.s3-ac.sel{box-shadow:inset 0 0 0 2px var(--brand)}
.s3-ac.sel::after{content:"";position:absolute;inset:0;border-radius:16px;box-shadow:inset 0 0 0 2px var(--brand);z-index:3;pointer-events:none}
.s3-ac-im{flex:none;width:120px;height:120px;overflow:hidden}
.s3-ac-im img,.s3-ac-im .noph{width:100%;height:100%;object-fit:cover}
.s3-ac-gift{display:grid;place-items:center;width:100%;height:100%;background:var(--brand-soft)}
.s3-ac-tx{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:0 16px;margin:12px 0}
.s3-ac-n{font:600 16px/22px var(--f);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s3-ac-s{font:400 13px/16px var(--f);color:var(--ink-2);margin:0}
.s3-ac-tx .s3-link{align-self:flex-start}
.s3-ac-m{display:none}
.s3-split-r{position:sticky;top:calc(72px + 40px + var(--hub-h))}
.s3-detw{width:521px}
.s3-det{background:var(--bg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;display:flex;flex-direction:column}
.s3-det-hero{position:relative;height:326px;margin:1px 1px 0;border-radius:15px 15px 0 0;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
.s3-det-hero>img,.s3-det-hero>.noph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s3-det-hero>i{position:absolute;inset:0;background:rgba(0,0,0,.3)}
.s3-det-hero>p{position:relative;margin:0 24px 24px;font:700 40px/44px var(--f);color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s3-det-b{padding:32px;display:flex;flex-direction:column;gap:40px}
.s3-det-top{display:flex;flex-direction:column;gap:32px}
.s3-det-h{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.s3-det-w{display:flex;flex-direction:column;gap:4px}
.s3-det-t{font:600 28px/36px var(--f);margin:0}
.s3-det-d{font:400 14px/20px var(--f);color:var(--ink-2);margin:0}
.s3-pill{display:inline-flex;align-items:center;gap:8px;height:32px;padding-inline:11px 16px;border-radius:999px;font:500 14px/20px var(--f)}
.s3-pill-ok{background:var(--ok-soft);color:var(--ok);box-shadow:inset 0 0 0 1px var(--ok-2)}
.s3-pill-bad{background:var(--bad-soft);color:var(--bad);box-shadow:inset 0 0 0 1px #fee3e2}
.s3-pill-muted{background:var(--bg-3);color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line)}
.s3-det-acts ul{list-style:none;margin:0 -8px;padding:0;display:flex;flex-direction:column}
.s3-row{position:relative;display:flex;align-items:center;gap:8px;height:54px;padding:0 8px;border-radius:8px}
.s3-row:hover{background:var(--bg-2)}
.s3-rowic{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--brand-soft);color:var(--brand);flex:none}
.s3-rowic .i{width:20px;height:20px}
.s3-row.bad .s3-rowic{background:var(--bad-soft);color:var(--bad)}
.s3-rowt{flex:1;font:500 16px/22px var(--f);padding:16px 0}
.s3-rowch{display:flex;padding-inline-start:8px;color:var(--ink-3)}
.s3-rowch .i{width:24px;height:24px}
.s3-det-sec{display:flex;flex-direction:column;gap:16px}
.s3-det-st{font:600 19px/24px var(--f);margin:0}
.s3-ov ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.s3-ov li{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
.s3-ov-n,.s3-ov-p{font:500 16px/22px var(--f);margin:0}
.s3-ov-d{font:400 14px/20px var(--f);color:var(--ink-2);margin:0}
.s3-ov hr{border:0;height:1px;background:var(--ink);opacity:.1;margin:20px 0}
.s3-ov-t{display:flex;justify-content:space-between}
.s3-ov-t p{font:600 16px/22px var(--f);margin:0}
.s3-pol{background:var(--bg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);padding:20px 20px 28px;display:flex;flex-direction:column;gap:4px}
.s3-pol b{font:600 16px/22px var(--f)}.s3-pol p{font:400 16px/22px var(--f);margin:0}
.s3-ref{font:400 14px/20px var(--f);color:var(--ink-2);text-align:center;margin:0}
.s3-apptm{display:none}
.s3-glass{position:absolute;top:20px;inset-inline-start:20px;z-index:3;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--s3-glass);color:var(--ink);box-shadow:var(--sh-card)}
.s3-glass .i{width:20px;height:20px}

/* ---------- profile ---------- */
.s3-pgrid{display:grid;grid-template-columns:352px 575px;gap:32px;align-items:start}
.s3-prof{position:relative;display:flex;flex-direction:column;gap:12px}
.s3-prof-e{align-self:flex-end;font:500 16px/22px var(--f)}
.s3-prof-av{position:relative;align-self:center;width:120px;height:120px}
.s3-prof-av .av{display:block;width:120px;height:120px;border-radius:50%;overflow:hidden;background:var(--brand-soft);box-shadow:inset 0 0 0 1px var(--brand-soft)}
.s3-prof-av .av img{width:100%;height:100%;object-fit:cover}
.s3-prof-pen{position:absolute;inset-inline-end:-8px;bottom:0;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--bg-3);box-shadow:0 0 0 2px var(--bg);color:var(--ink)}
.s3-prof-pen .i{width:14px;height:14px}
.s3-prof-n{font:600 28px/36px var(--f);text-align:center;margin:0}
.s3-prof .s3-hr{margin:20px 0}
.s3-conf{border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);padding:16px;display:flex;flex-direction:column;gap:8px;align-items:flex-start;margin-bottom:20px}
.s3-conf b{font:600 16px/22px var(--f)}.s3-conf p{font:400 14px/20px var(--f);margin:2px 0 0}
.s3-info{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.s3-info p{font:500 16px/22px var(--f);margin:0}.s3-info span{display:block;font:400 14px/20px var(--f);color:var(--ink-2)}
.s3-pcol{display:flex;flex-direction:column;gap:24px}
.s3-addr{display:flex;flex-direction:column;gap:16px}
.s3-addr ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.s3-lc{position:relative;display:flex;align-items:center;gap:12px;border-radius:16px}
.s3-addr .s3-lc{background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);padding:20px 24px}
.s3-lc h3{font:500 16px/22px var(--f);margin:0}.s3-lc h4{font:400 14px/20px var(--f);color:var(--ink-2);margin:0}
.s3-lct{flex:1;min-width:0}
.s3-cic{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--brand-soft);color:var(--brand);flex:none}
.s3-cic .i{width:20px;height:20px}
.s3-terms{display:none}

/* profile edit (full-screen form) */
.s3-pe{min-height:calc(100vh - var(--hub-h));background:var(--bg)}
.s3-pe-top{position:sticky;top:var(--hub-h);z-index:5;height:72px;display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:0 32px;background:var(--bg)}
.s3-pe-b{max-width:490px;margin:0 auto;padding:32px 0 96px}
.s3-pe-b h1{font:700 40px/44px var(--f);margin:0 0 40px}
.s3-pe-f{display:flex;flex-direction:column;gap:24px}
.s3-pe-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.s3-pe-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.s3-f{display:flex;flex-direction:column;gap:4px}
.s3-f>label{font:600 14px/20px var(--f)}
.s3-in{position:relative;display:flex;align-items:center;height:48px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg)}
.s3-in input,.s3-in select{flex:1;min-width:0;height:46px;border:0;background:transparent;padding:0 16px;font:400 16px/22px var(--f);color:var(--ink);border-radius:12px;appearance:none;-webkit-appearance:none}
.s3-in input::placeholder{color:var(--ink-4)}
.s3-in select:invalid,.s3-in select option[value=""]{color:var(--ink-4)}
.s3-in>.i{position:absolute;inset-inline-end:16px;width:16px;height:16px;pointer-events:none}
.s3-in .s3-link{margin-inline-end:16px}
.s3-in:focus-within{box-shadow:inset 0 0 0 2px var(--brand)}

/* ---------- favorites ---------- */
.s3-fsec{display:flex;flex-direction:column;gap:16px}
.s3-vgrid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px 28px}
.s3-vc{position:relative;display:flex;flex-direction:column;gap:8px}
.s3-vc-im{position:relative;aspect-ratio:3/2;border-radius:16px;overflow:hidden}
.s3-vc-im img,.s3-vc-im .noph{width:100%;height:100%;object-fit:cover}
.s3-vc-fav{position:absolute;z-index:2;top:12px;inset-inline-end:12px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--bg);color:var(--bad);box-shadow:var(--sh-small)}
.s3-vc-fav .i{width:18px;height:18px}
.s3-vc-t{display:flex;flex-direction:column}
.s3-vc-t p{display:flex;justify-content:space-between;gap:8px;margin:0}
.s3-vc-t b{font:600 16px/22px var(--f)}
.s3-vc-t p span{display:inline-flex;align-items:center;gap:2px;font:600 13px/16px var(--f)}
.s3-vc-t p .st{width:13px;height:13px;color:var(--ink)}
.s3-vc-t>span{font:400 14px/20px var(--f);color:var(--ink-2)}
.s3-pc{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:24px 16px;border-radius:16px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);text-align:center}
.s3-pc .av{width:72px;height:72px;border-radius:50%;overflow:hidden;margin-bottom:8px}.s3-pc .av img{width:100%;height:100%;object-fit:cover}
.s3-pc b{font:600 16px/22px var(--f)}.s3-pc>span{font:400 14px/20px var(--f);color:var(--ink-2)}
.s3-pc-r{display:inline-flex;align-items:center;gap:2px}.s3-pc-r .st{width:13px;height:13px;color:var(--ink)}

/* ---------- wallet ---------- */
.s3-wcol{width:528px;display:flex;flex-direction:column;gap:24px;padding-bottom:40px}
.s3-wbal{border-radius:16px;overflow:hidden;box-shadow:inset 0 0 0 1px var(--line);background:linear-gradient(253deg,#fa6cfd 0%,#c467fd 18%,#9563fe 30%,#6960ff 44%,#6960ff 100%)}
.s3-wbal-in{padding:32px 40px;display:flex;flex-direction:column;gap:24px;align-items:flex-start;color:#fff}
.s3-wbal-t{display:flex;flex-direction:column;gap:4px}
.s3-wamt{font:600 22px/28px var(--f);margin:0;color:#fff}.s3-wamt b{font:700 40px/44px var(--f)}
.s3-wlab{font:400 14px/20px var(--f);margin:0;color:#fff}
.s3-wsend{display:grid;grid-template-columns:1fr 56px;gap:16px 24px;background:var(--bg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);padding:32px}
.s3-wsend-t{display:flex;flex-direction:column;gap:4px}
.s3-wsend-p{font:400 14px/20px var(--f);margin:0}
.s3-wsend-b{grid-column:1/-1}
.s3-wsec{background:var(--bg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);padding:40px;display:flex;flex-direction:column;gap:12px}
.s3-wsec h2{font:600 19px/24px var(--f);margin:0}
.s3-wsec ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.s3-wr{min-height:56px}
.s3-wic{display:grid;place-items:center;width:56px;height:56px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line);color:var(--brand);background:var(--bg);flex:none;overflow:hidden}
.s3-wic .i{width:28px;height:28px}
.s3-wic.im img{width:100%;height:100%;object-fit:cover}

/* ---------- messages ---------- */
.s3-messages .s3-body{height:calc(100vh - 72px - var(--hub-h))}
.s3-msg{display:grid;grid-template-columns:320px minmax(0,1fr);height:calc(100vh - 72px - var(--hub-h));background:var(--bg)}
.s3-ml{border-inline-end:1px solid var(--line);padding:0 16px;overflow:auto}
.s3-ml-top{display:none}
.s3-ml-h{display:flex;align-items:center;justify-content:space-between;height:48px;margin-top:12px;padding:0 16px}
.s3-ml-h h2{font:600 19px/24px var(--f);margin:0}
.s3-ml ul{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column}
.s3-mi{position:relative;display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:8px}
.s3-mi.on{background:var(--brand-soft)}
.s3-mi:not(.on):hover{background:var(--bg-2)}
.s3-mi-t{flex:1;min-width:0;display:flex;flex-direction:column}
.s3-mi-r{display:flex;align-items:center;gap:8px}
.s3-mi-r h3{font:500 16px/22px var(--f);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s3-mi h4{font:400 14px/20px var(--f);color:var(--ink-2);margin:0;white-space:nowrap}
.s3-mi-l{overflow:hidden;text-overflow:ellipsis}
.s3-mi.un h3,.s3-mi.un .s3-mi-l{font-weight:600;color:var(--ink)}
.s3-mc{display:flex;flex-direction:column;min-height:0;height:100%}
.s3-mc-h{display:flex;align-items:center;justify-content:space-between;gap:12px;height:73px;padding:12px 24px;border-bottom:1px solid var(--line);flex:none}
.s3-mc-who{display:flex;align-items:center;gap:12px}
.s3-mc-who p{font:600 16px/22px var(--f);margin:0}
.s3-mc-back{display:none}
.s3-mc-b{flex:1;min-height:0;overflow:auto;padding:0 20px}
.s3-mc-in{min-height:100%;display:flex;flex-direction:column;justify-content:flex-end;gap:12px;padding:20px 0}
.s3-daysep{display:flex;align-items:center;gap:12px;margin:12px 0}
.s3-daysep span{flex:1;height:1px;background:var(--ink);opacity:.1}
.s3-daysep b{font:600 14px/20px var(--f)}
.s3-sys{align-self:center;font:400 13px/16px var(--f);color:var(--ink-2);margin:0;text-align:center}
.s3-bw{display:flex;align-items:flex-end;gap:4px;padding-inline-end:64px}
.s3-bw.me{justify-content:flex-end;padding-inline:64px 0}
.s3-bav{width:32px;height:32px;border-radius:50%;overflow:hidden;flex:none;background:var(--brand-soft)}
.s3-bav img{width:100%;height:100%;object-fit:cover}
.s3-bcol{display:flex;flex-direction:column;max-width:100%}
.s3-bwho{font:400 13px/16px var(--f);color:var(--ink-2);margin:0;padding-bottom:4px}
.s3-bub{display:flex;flex-direction:column;background:var(--bg-3);border-radius:16px;max-width:560px}
.s3-bw.me .s3-bub{background:var(--brand);color:#fff}
.s3-bub>p{font:400 16px/22px var(--f);margin:0;padding:12px 12px 0}
.s3-bt{align-self:flex-end;font:400 13px/16px var(--f);padding:0 12px 8px;margin-top:2px}
.s3-bw.me .s3-bt{color:rgba(255,255,255,.8)}
.s3-bph{padding:4px 4px 0}.s3-bph img{width:240px;height:240px;object-fit:cover;border-radius:12px}
.s3-brc{display:flex;align-items:center;gap:10px;padding:12px 12px 0}.s3-brc .i{width:28px;height:28px}
.s3-brc span{display:flex;flex-direction:column}.s3-brc b{font:600 15px/20px var(--f)}.s3-brc i{font:400 14px/20px var(--f);font-style:normal}
.s3-mc-f{padding:12px 20px 8px;flex:none}
.s3-comp{display:flex;flex-direction:column;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg)}
.s3-comp textarea{border:0;background:transparent;resize:none;padding:16px 16px 0;font:400 16px/22px var(--f);color:var(--ink);height:38px;outline:0}
.s3-comp textarea::placeholder{color:var(--ink-4)}
.s3-comp-b{display:flex;align-items:center;justify-content:space-between;padding:8px}
.s3-comp-b>div{display:flex;gap:4px}
.s3-send{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--on-ink);opacity:.3}
.s3-send.on{opacity:1}

/* ---------- settings ---------- */
.s3-set{gap:24px}
.s3-set>.s3-h1{margin-top:40px}
.s3-crumb+.s3-h1{margin-top:0}
.s3-setg{display:grid;grid-template-columns:304px 304px;gap:24px}
.s3-setc{position:relative;display:flex;flex-direction:column;gap:16px;align-items:flex-start;padding:28px;border-radius:16px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);min-height:172px}
.s3-setc:hover{background:var(--bg-2)}
.s3-setc-i{color:var(--brand)}.s3-setc-i .i{width:32px;height:32px}
.s3-setc h2{font:600 19px/24px var(--f);margin:0 0 4px}.s3-setc p{font:400 14px/20px var(--f);color:var(--ink-2);margin:0}
.s3-crumb{display:flex;align-items:center;gap:16px;margin-top:40px}
.s3-crumb ol{list-style:none;margin:0;padding:0;display:flex;gap:20px;font:400 14px/20px var(--f)}
.s3-crumb li{position:relative}
.s3-crumb li+li::before{content:"";position:absolute;inset-inline-start:-11px;top:9px;width:3px;height:3px;border-radius:50%;background:var(--ink-2)}
.s3-crumb a{color:var(--ink-2)}
.s3-setcol{width:600px;display:flex;flex-direction:column;gap:16px}
.s3-sc{display:flex;flex-direction:column;gap:16px}
.s3-sch{display:flex;flex-direction:column}
.s3-bizl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.s3-biz{padding:12px 16px;margin:0 -16px}
.s3-biz .s3-thumb{align-self:center}
.s3-tgl{display:flex;flex-direction:column;gap:12px}
.s3-tgr{display:flex;align-items:center;gap:12px}
.s3-tgr>.i{width:20px;height:20px}
.s3-tgr label{flex:1;display:flex;align-items:center;justify-content:space-between;gap:12px;font:400 14px/20px var(--f)}
.s3-acct .tg,.s3-mov .tg{position:relative;width:44px;height:24px;border-radius:999px;background:var(--line-2);padding:1px;display:flex;align-items:center;flex:none}
.s3-acct .tg i,.s3-mov .tg i{width:20px;height:20px;border-radius:50%;background:#fff;margin:1px;transition:transform .15s}
.s3-acct .tg[aria-checked="true"],.s3-mov .tg[aria-checked="true"]{background:var(--brand)}
.s3-acct .tg[aria-checked="true"] i,.s3-mov .tg[aria-checked="true"] i{transform:translateX(-20px)}
.s3-login{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:24px}
.s3-pw{display:flex;align-items:center;justify-content:space-between;gap:24px}
.s3-pw b{display:block;font:600 14px/20px var(--f)}.s3-pw>div>span{font:400 14px/20px var(--f);color:var(--ink-2)}
.s3-hr0{border:0;height:1px;background:var(--line);margin:0}
.s3-soc{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.s3-soc li{display:grid;grid-template-columns:32px 1fr auto;gap:12px;align-items:center}
.s3-soc p{font:600 16px/22px var(--f);margin:0}
.s3-mk{width:32px;height:32px;display:block}

/* ---------- activity ---------- */
.s3-activity .s3-titlerow{margin-top:40px}
.s3-sbtn{width:52px;padding:0}
.s3-tabs{list-style:none;margin:-8px 0 0;padding:0;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.s3-tabs li{position:relative;display:flex;align-items:center;gap:8px;height:36px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font:500 14px/20px var(--f);white-space:nowrap;flex:none}
.s3-tabs li.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.s3-actc{margin-top:-8px}
.s3-cards-w{max-width:360px}

/* ---------- modals (Fresha's filter-modal style) ---------- */
.s3-mov .mdl{width:560px;max-width:calc(100% - 32px);max-height:calc(100% - 64px);border-radius:24px;display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--sh-pop)}
.s3-mov.s3-wide .mdl{width:720px}
.s3-mh{display:flex;align-items:center;justify-content:space-between;padding:32px 40px 16px}
.s3-mh h2{font:600 22px/28px var(--f);margin:0}
.s3-mbd{padding:8px 40px 24px;overflow:auto;display:flex;flex-direction:column;gap:16px}
.s3-mf{display:flex;gap:12px;padding:16px 40px 32px;border-top:1px solid var(--line)}
.s3-mf .s3-btn{flex:1}
.s3-mtx{font:400 16px/22px var(--f);color:var(--ink-2);margin:0}
.s3-mlab{font:600 16px/22px var(--f);margin:0}
.s3-opts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.s3-opts button{width:100%;display:flex;align-items:center;gap:12px;height:56px;padding:0 8px;border-radius:8px;font:500 16px/22px var(--f);text-align:start}
.s3-opts button:hover{background:var(--bg-2)}
.s3-opts button span{flex:1}
.s3-opts button .i:first-child{color:var(--brand)}
.s3-opts button .i:last-child{color:var(--ink-3)}
.s3-days{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px}
.s3-day{flex:none;display:flex;flex-direction:column;align-items:center;gap:4px;width:64px;padding:10px 0;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line-2);font:400 14px/20px var(--f)}
.s3-day b{font:600 22px/28px var(--f)}
.s3-day.red{color:var(--bad)}
.s3-day[aria-pressed="true"]{background:var(--brand);color:#fff;box-shadow:none}
.s3-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.s3-slot{height:48px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line-2);font:600 16px/22px var(--f)}
.s3-slot[aria-pressed="true"]{background:var(--brand-soft);box-shadow:inset 0 0 0 2px var(--brand)}
.s3-noslot{display:flex;flex-direction:column;align-items:center;gap:4px;padding:24px;border-radius:16px;background:var(--bg-2);text-align:center}
.s3-noslot b{font:600 16px/22px var(--f)}.s3-noslot span{font:400 14px/20px var(--f);color:var(--ink-2)}
.s3-rstars{display:flex;gap:8px;justify-content:center}
.s3-rst{color:var(--line-2)}.s3-rst .i{width:40px;height:40px}.s3-rst.on{color:var(--star)}
.s3-fld{display:flex;flex-direction:column;gap:4px}
.s3-fld>span{font:600 14px/20px var(--f)}
.s3-fld input,.s3-fld textarea{border:0;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg);padding:12px 16px;font:400 16px/22px var(--f);color:var(--ink);resize:vertical;outline:0}
.s3-fld input{height:48px}
.s3-fld input:focus,.s3-fld textarea:focus{box-shadow:inset 0 0 0 2px var(--brand)}
.s3-vid{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:16/9}
.s3-vid img{width:100%;height:100%;object-fit:cover}
.s3-vid span{position:absolute;inset:0;display:grid;place-items:center;color:#fff;background:rgba(0,0,0,.25)}.s3-vid .i{width:56px;height:56px}

/* ======================= account: mobile (Fresha mobile web = the apps) =======================
   Used up to 900px: on a tablet the account area keeps the app layout (one column, back bar, sheets) because the
   sidebar + list + detail cannot fit; 901–1279px make the desktop grids fluid (block «responsive» below). */
@container (max-width:900px){
  .s3-hdw,.s3-side{display:none}
  .s3-body{display:block;min-height:calc(100vh - var(--hub-h))}
  .s3-main{min-height:inherit}
  .s3-acct{background:var(--s3-pg)}
  .s3-appts .s3-body,.s3-appts .s3-main{--s3-pg:var(--bg)}
  .s3-mback{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:20;height:56px;padding:4px 8px 4px 0;background:var(--s3-pg)}
  .s3-d{display:none}.s3-m{display:inline}
  .s3-wrap{padding:0 20px;gap:32px;margin-bottom:40px}
  .s3-titlerow{margin-top:0}
  .s3-split{display:block}
  .s3-split-l{padding:0}
  .s3-split-r{display:none}
  .s3-cards{gap:16px;padding:0 8px;margin:0 -8px}
  .s3-ac{box-shadow:none!important;background:transparent;min-height:0;overflow:visible;border-radius:8px}
  .s3-ac.sel::after{display:none}
  .s3-ac-im,.s3-ac-tx{display:none}
  .s3-ac-m{display:grid;grid-template-columns:56px 1fr auto;gap:8px;align-items:center;width:100%;min-height:64px;margin:0 -4px 8px;position:relative}
  .s3-ac-m .s3-thumb{width:56px;height:56px}
  .s3-ac-mt{display:flex;flex-direction:column;gap:2px;min-width:0;padding-inline-start:8px}
  .s3-ac-mt b{font:600 16px/20px var(--f)}
  .s3-ac-mt i{font:400 14px/20px var(--f);font-style:normal;color:var(--ink-2)}
  .s3-apptw>.s3-acct{display:none}
  .s3-apptm{display:block;background:var(--bg-4);min-height:calc(100vh - var(--hub-h))}
  .s3-det-m{border-radius:0;box-shadow:none;background:transparent}
  .s3-det-m .s3-det-hero{height:280px;margin:0;border-radius:0}
  .s3-det-m .s3-det-hero>p{margin:0 20px 20px}
  .s3-det-m .s3-det-b{padding:32px 20px 40px}
  .s3-det-m .s3-det-acts{background:var(--bg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);padding:8px 20px}
  .s3-det-m .s3-det-acts ul{margin:0 -8px}
  .s3-det-m .s3-ov{background:var(--bg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);padding:20px}
  .s3-det-m .s3-ov hr{margin:0}
  .s3-det-m .s3-ov{display:flex;flex-direction:column;gap:20px}
  .s3-pgrid{grid-template-columns:1fr;gap:36px}
  .s3-prof{padding:32px}
  .s3-conf{display:none}
  .s3-pcol{gap:40px}
  .s3-addr{background:transparent;box-shadow:none;padding:0}
  .s3-addr .s3-lc{padding:16px}
  .s3-terms{display:flex;flex-direction:column;gap:8px}
  .s3-terms ul{list-style:none;margin:0;padding:0}
  .s3-terms a{display:flex;align-items:center;justify-content:space-between;height:56px;padding:16px;margin:0 -16px;border-radius:16px;font:500 16px/22px var(--f)}
  .s3-terms a .i{width:24px;height:24px}
  .s3-favs .s3-center,.s3-forms .s3-center{min-height:calc(100vh - 56px - var(--hub-h));align-items:center}
  .s3-favs .s3-body,.s3-forms .s3-body,.s3-favs .s3-main,.s3-forms .s3-main{--s3-pg:var(--bg)}
  .s3-vgrid{grid-template-columns:1fr}
  .s3-wallet .s3-body,.s3-wallet .s3-main{--s3-pg:var(--bg)}
  .s3-wallet .s3-mback{position:absolute;top:12px;background:none;color:#fff;width:100%}
  .s3-wallet .s3-mback .s3-icb{color:#fff}
  .s3-wallet .s3-main{position:relative}
  .s3-wallet .s3-wrap{padding:0}
  .s3-wallet .s3-titlerow{display:none}
  .s3-wcol{width:auto;gap:24px}
  .s3-wbal{border-radius:0;box-shadow:none}
  .s3-wbal-in{padding:72px 20px 24px;gap:16px}
  .s3-wsend{margin:0 20px;background:var(--bg-4);border-radius:8px;padding:20px;gap:12px 16px}
  .s3-wsec{background:transparent;box-shadow:none;padding:0 20px;gap:24px}
  .s3-msg{display:block;height:auto;min-height:calc(100vh - var(--hub-h))}
  .s3-messages .s3-body{height:auto}
  .s3-ml{border:0;padding:0 20px}
  .s3-ml-top{display:flex;justify-content:space-between;height:72px;align-items:center;margin:0 -12px}
  .s3-ml-h{margin:0;padding:0 0 16px;height:auto}
  .s3-ml-h h2{font:600 24px/32px var(--f)}
  .s3-ml-h .s3-icb{display:none}
  .s3-ml ul{margin:0}
  .s3-mi{margin:0 -16px}
  .s3-mi.on{background:transparent}
  .s3-mc{display:none}
  .s3-msg.open .s3-ml{display:none}
  .s3-msg.open .s3-mc{display:flex;height:calc(100vh - var(--hub-h))}
  .s3-mc-h{padding:12px 8px}
  .s3-mc-back{display:grid}
  .s3-bw{padding-inline-end:32px}.s3-bw.me{padding-inline-start:32px}
  .s3-bph img{width:200px;height:200px}
  .s3-setg{grid-template-columns:1fr}
  .s3-set>.s3-h1{margin-top:0}
  .s3-sub{margin-top:-32px}
  .s3-crumb{display:none}
  .s3-setcol{width:auto}
  .s3-sc{padding:24px 20px}
  .s3-tabs{margin:0}
  .s3-pe-top{padding:0 16px}
  .s3-pe-b{padding:16px 20px 64px}
  .s3-pe-b h1{font:700 28px/36px var(--f);margin-bottom:24px}
  .s3-mov .mdl{width:100%!important;max-width:100%;align-self:end;border-radius:24px 24px 0 0;max-height:90%}
  .s3-mov{place-items:end center!important}
  .s3-mh{padding:24px 20px 12px}.s3-mbd{padding:8px 20px 20px}.s3-mf{padding:12px 20px 24px}
  .s3-slots{grid-template-columns:repeat(3,1fr)}
}

/* =============================== business marketing pages =============================== */
.s3-mkp{background:var(--bg);color:var(--s3-ink);font-family:var(--f);overflow-x:clip}
.s3-mkp img{display:block}
.s3-bh{position:sticky;top:var(--hub-h);z-index:50;height:72px;display:flex;align-items:center;justify-content:space-between;padding:12px 32px;background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.s3-bh-l{display:flex;align-items:center;gap:52px}
.s3-bh-l nav{display:flex;gap:4px}
.s3-bh-l nav a{display:flex;align-items:center;height:48px;padding:0 16px;font:600 17px/24px var(--f);border-radius:999px}
.s3-bh-l nav a:hover{background:var(--bg-2)}
.s3-bh-r{display:flex;align-items:center;gap:12px}
.s3-mb{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 24px;border-radius:999px;font:600 17px/24px var(--f);white-space:nowrap;cursor:pointer}
.s3-mb .i{width:20px;height:20px}
.s3-mb-k{background:var(--s3-ink);color:var(--bg)}
.s3-mb-o{background:var(--bg);color:var(--s3-ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.s3-mb-w{background:#fff;color:#141414;box-shadow:inset 0 0 0 1px #d3d3d3}
.s3-mb-w .s3-mk{width:20px;height:20px}
.s3-mb:hover{opacity:.88}
.s3-menu .i{width:24px;height:24px}
.s3-h48{font:700 48px/52px var(--f);margin:0}
.s3-h48b{font:700 48px/54px var(--f);margin:0}
.s3-c{text-align:center}
.s3-lead{font:400 20px/28px var(--f);margin:0}
.s3-lead.g{color:#404040}
.s3-grad{background:linear-gradient(90deg,#ef6997,#e85cba,#b84cdc);-webkit-background-clip:text;background-clip:text;color:transparent}

/* hero */
.s3-hero{position:relative;text-align:center;padding:48px 0 92px;background:radial-gradient(70% 38% at 18% 70%,rgba(214,68,255,.75),transparent 70%),radial-gradient(60% 40% at 80% 80%,rgba(105,40,243,.95),transparent 70%),radial-gradient(90% 30% at 50% 92%,#7a24f1,transparent 80%),linear-gradient(180deg,var(--bg) 0,var(--bg) 42%,#a98bff 62%,#8a3cf4 80%,#6a1fe6 100%)}
.s3-hero h1{font:700 56px/60px var(--f);margin:0 auto;max-width:1028px;padding:42px 0 0}
.s3-hero>p{font:400 20px/28px var(--f);margin:16px 0 0}
.s3-hero-b{display:flex;justify-content:center;gap:16px;margin-top:32px}
.s3-hero-v{position:relative;width:1185px;margin:64px auto 0;height:722px}
.s3-frame{position:absolute;padding:8px;border-radius:26px;background:rgba(241,241,241,.4);box-shadow:0 12px 125px rgba(13,22,25,.06),0 4px 60px rgba(0,0,0,.16);border:1px solid rgba(255,255,255,.9)}
.s3-frame-in{border-radius:20px;overflow:hidden;background:var(--bg);height:100%}
.s3-frame-d{inset-inline-start:0;top:0;width:1086px;height:681px}
.s3-frame-m{inset-inline-end:0;top:108px;width:315px;height:614px}
.s3-rates{display:flex;justify-content:center;gap:28px;margin-top:28px;color:#fff}
.s3-rates>div{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:118px}
.s3-rates b{font:700 18px/24px var(--f)}
.s3-rates span{display:flex;gap:6px;align-items:center;font:600 14px/19px var(--f)}
.s3-rates em{font-style:normal;color:#ffc00a;letter-spacing:1px}
.s3-rates i{font-style:normal}
.s3-stats{display:grid;grid-template-columns:repeat(4,1fr);max-width:1185px;margin:92px auto 0;color:#fff}
.s3-stats div{display:flex;flex-direction:column;align-items:center;gap:8px}
.s3-stats b{font:700 48px/52px var(--f)}.s3-stats span{font:500 20px/28px var(--f)}

/* one platform + types */
.s3-one{padding:120px 120px 80px;text-align:center}
.s3-one-p{max-width:846px;margin:16px auto 32px;font:400 16px/28px var(--f);color:var(--ink-2)}
.s3-types{display:grid;grid-template-columns:repeat(3,374px);gap:32px;justify-content:center;margin-top:88px;text-align:start}
.s3-type{position:relative;aspect-ratio:1;border-radius:18px;overflow:hidden;display:flex;align-items:flex-end;padding:32px;color:#fff}
.s3-type img,.s3-type .noph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s3-type::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.6))}
.s3-type b{position:relative;z-index:1;font:700 28px/36px var(--f)}
.s3-certs{display:flex;justify-content:center;align-items:center;gap:56px;margin-top:120px}
.s3-cert{display:flex;align-items:center;gap:8px;color:var(--s3-ink)}
.s3-cert b{font:800 22px/24px var(--f)}
.s3-cert .i{width:36px;height:36px}
.s3-cert i{display:flex;flex-direction:column;align-items:center;justify-content:center;width:64px;height:72px;clip-path:polygon(50% 100%,0 75%,0 0,100% 0,100% 75%);background:#1d3c66;color:#fff;font:700 11px/14px var(--f);font-style:normal;text-align:center}
.s3-cert.c1 i{background:#24508c}.s3-cert.c2 i{background:#f1f1f1;color:#141414;border:1px solid #ddd}
.s3-cert i em{font-style:normal;font-size:9px;opacity:.8}

/* need */
.s3-need{background:var(--s3-lav);padding:120px}
.s3-need>p{max-width:750px;margin:12px 0 0;font:400 16px/24px var(--f)}
.s3-need-g{display:grid;grid-template-columns:repeat(3,352px);gap:64px;margin-top:64px}
.s3-need h3{font:600 24px/32px var(--f);margin:0 0 16px}
.s3-need-g p{font:400 17px/24px var(--f);margin:0}

/* feature rows */
.s3-feat{display:grid;grid-template-columns:553px 1fr;gap:80px;align-items:center;padding:78px 120px 158px}
.s3-feat-t{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.s3-feat-g{background:var(--s3-g1);padding:78px 120px 158px}
.s3-feat-p{padding:128px 120px}
.s3-rev{grid-template-columns:1fr 553px}
.s3-chk{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.s3-chk li{display:flex;gap:12px;font:400 17px/24px var(--f)}
.s3-chk .i{width:20px;height:20px;margin-top:2px}
.s3-feat-t .s3-mb{margin-top:16px}
.s3-feat-v{position:relative}
.s3-pair{height:620px}
.s3-ph{position:absolute;padding:8px;border-radius:28px;background:linear-gradient(to left bottom,var(--s3-lav),rgba(167,131,251,.4),rgba(167,131,251,0));box-shadow:0 4px 8px rgba(13,22,25,.06),0 12px 20px rgba(13,22,25,.06);border:1px solid rgba(255,255,255,.9)}
.s3-ph-in{width:100%;height:100%;border-radius:20px;overflow:hidden;background:var(--bg)}
.s3-ph-a{width:217px;height:449px;inset-inline-end:335px;top:176px}
.s3-ph-b{width:292px;height:599px;inset-inline-end:0;top:0}
.s3-rev .s3-ph-b{inset-inline-end:auto;inset-inline-start:0}
.s3-rev .s3-ph-a{inset-inline-end:auto;inset-inline-start:336px;top:181px}
.s3-ph-up{top:-80px!important}
.s3-ph-s{position:relative;width:232px;height:391px;border-radius:18px;background:rgba(249,235,255,.35)}
.s3-ph-c{position:relative;width:220px;height:440px}
.s3-payw{height:660px;border-radius:16px;background:var(--s3-g1);overflow:hidden}
.s3-pay{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden}
.s3-pos{position:relative;width:280px;height:420px;transform:rotate(-28deg)}
.s3-pos-a{position:absolute;bottom:0;inset-inline-start:0;width:200px;height:300px;border-radius:26px;background:linear-gradient(160deg,#2a1530,#0b0b10);box-shadow:0 30px 60px rgba(0,0,0,.35);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:#fff;font:600 22px/1 var(--f)}
.s3-pos-a b{font:800 26px/1 var(--f);margin-bottom:10px}
.s3-pos-b{position:absolute;top:0;inset-inline-end:0;width:150px;height:240px;border-radius:24px;background:#111;box-shadow:0 20px 40px rgba(0,0,0,.3),inset 0 0 0 3px #333;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#fff;font:500 12px/1 var(--f)}
.s3-pos-b i{width:90px;height:56px;border-radius:8px;background:linear-gradient(135deg,#3b6cff,#8a5cff)}

/* reviews carousel */
.s3-revs{padding:120px 0 0;position:relative}
.s3-revs-h{padding:0 120px;max-width:1040px}
.s3-revs-h .s3-lead{margin-top:0}
.s3-car{display:flex;gap:32px;overflow-x:auto;scrollbar-width:none;padding:56px 120px 0;scroll-snap-type:x mandatory}
.s3-car::-webkit-scrollbar{display:none}
.s3-car>*{scroll-snap-align:start;flex:none}
.s3-revv{position:relative;width:853px;height:480px;border-radius:12px;overflow:hidden}
.s3-revv>img{width:100%;height:100%;object-fit:cover}
.s3-revv-w{position:absolute;bottom:24px;inset-inline-start:24px;display:flex;align-items:center;gap:12px;color:#fff}
.s3-revv-w i{width:40px;height:40px;border-radius:50%;overflow:hidden;border:2px solid #fff}.s3-revv-w i img{width:100%;height:100%;object-fit:cover}
.s3-revv-w span{display:flex;flex-direction:column}.s3-revv-w b{font:500 17px/25px var(--f)}.s3-revv-w em{font:400 15px/22px var(--f);font-style:normal}
.s3-revv-p{position:absolute;bottom:24px;inset-inline-end:24px;width:40px;height:40px;border-radius:50%;border:2px solid #fff;color:#fff;display:grid;place-items:center}
.s3-revv-p .i{width:18px;height:18px}
.s3-revc{width:300px;height:480px;border-radius:12px;background:var(--s3-g1);padding:32px;display:flex;flex-direction:column;gap:12px}
.s3-revc-s{font-size:22px;letter-spacing:4px;line-height:24px}
.s3-revc h3{font:600 24px/32px var(--f);margin:0}
.s3-revc p{font:400 17px/24px var(--f);margin:0;flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 80%,transparent)}
.s3-revc .s3-link{font:400 16px/24px var(--f)}
.s3-revc b{font:500 17px/24px var(--f)}.s3-revc>span:last-child{font:400 15px/20px var(--f);color:var(--ink-2);margin-top:-12px}
.s3-carnav{display:flex;gap:16px;padding:32px 120px 0}
.s3-cb{width:32px;height:32px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line-2);display:grid;place-items:center;background:var(--bg)}
.s3-cb .i{width:16px;height:16px}
.s3-boss{padding:120px 0 100px}
.s3-boss>h2,.s3-boss>p{padding:0 120px;max-width:1040px}
.s3-boss>p{margin-top:0}
.s3-boss .s3-car{padding-top:56px}
.s3-stat{width:360px;height:416px;border-radius:12px;background:var(--s3-g1);box-shadow:inset 0 0 0 1px var(--line);padding:48px;display:flex;flex-direction:column;gap:12px}
.s3-stat b{font:700 64px/64px var(--f);color:var(--brand)}
.s3-stat h3{font:600 24px/32px var(--f);margin:4px 0 0;flex:1}
.s3-stat p{font:400 16px/24px var(--f);margin:0}
.s3-succ{background:var(--bg-2);padding:128px 120px}
.s3-succ .s3-lead{margin-top:0}
.s3-succ-g{display:grid;grid-template-columns:repeat(3,331px);gap:40px 96px;margin-top:40px}
.s3-succ h3{font:600 20px/28px var(--f);margin:0 0 12px}.s3-succ-g p{font:400 15px/20px var(--f);margin:0}
.s3-help{padding:120px 120px 120px}
.s3-help-g{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:48px}
.s3-helpc{display:flex;flex-direction:column;justify-content:space-between;gap:32px;min-height:210px;padding:32px;border-radius:24px;box-shadow:inset 0 0 0 1px var(--line)}
.s3-helpc h3{font:600 24px/32px var(--f);margin:0 0 12px}.s3-helpc p{font:400 17px/24px var(--f);color:var(--s3-mk2);margin:0}
.s3-helpc-l{display:flex;align-items:center;gap:8px;font:500 15px/20px var(--f)}
.s3-faq{padding:120px 0 0}
.s3-faq-l{width:800px;margin:96px auto 0;display:flex;flex-direction:column;gap:16px}
.s3-fq{background:var(--s3-faq);border-radius:8px}
.s3-fq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 24px;font:600 20px/28px var(--f);cursor:pointer}
.s3-fq summary::-webkit-details-marker{display:none}
.s3-fq summary .i{width:24px;height:24px;flex:none;transition:transform .2s}
.s3-fq[open] summary .i{transform:rotate(45deg)}
.s3-fq p{padding:0 24px 24px;margin:0;font:400 16px/22px var(--f);color:var(--ink-2)}
.s3-plat{padding:128px 0 140px}
.s3-plat-g{background:var(--bg-2);padding:120px 0}
.s3-plat-p{text-align:center;font:400 20px/28px var(--f);margin:12px 0 0}
.s3-mq{margin-top:48px;display:flex;flex-direction:column;gap:24px}
.s3-mq-r{overflow:hidden}
.s3-mq-t{display:flex;gap:32px;width:max-content;animation:s3mq 60s linear infinite}
.s3-mq-r.rev .s3-mq-t{animation-direction:reverse;margin-inline-start:-160px}
@keyframes s3mq{to{transform:translateX(33.333%)}}
.s3-mq-i{position:relative;width:309px;height:194px;border-radius:8px;overflow:hidden;display:flex;align-items:flex-end;padding:16px;color:#fff;flex:none}
.s3-mq-i img,.s3-mq-i .noph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s3-mq-i::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.55))}
.s3-mq-i b{position:relative;z-index:1;font:600 20px/28px var(--f)}
.s3-cta{position:relative;text-align:center;color:#fff;padding:110px 24px 0;height:410px;background:radial-gradient(40% 70% at 0% 60%,#f15ad1 0,transparent 70%),radial-gradient(35% 60% at 42% 20%,#9e8cff 0,transparent 70%),radial-gradient(60% 90% at 100% 100%,#4a00e8 0,transparent 70%),linear-gradient(100deg,#c637e5 0%,#8f2ef5 40%,#7a12f2 70%,#5a06ea 100%)}
.s3-cta h2{font:700 48px/54px var(--f);margin:0}
.s3-cta p{font:400 20px/28px var(--f);margin:8px 0 32px}
.s3-apps{padding:120px 120px 120px}
.s3-apps-p{max-width:700px;margin:12px auto 0;text-align:center;font:400 20px/28px var(--f)}
.s3-apps-g{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:56px}
.s3-appc{display:grid;grid-template-columns:1fr 1fr;align-items:end;height:391px;border-radius:16px;background:var(--bg-2);overflow:hidden}
.s3-appc-t{align-self:center;padding:0 40px;display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.s3-appic{display:grid;place-items:center;width:48px;height:48px;border-radius:10px;color:#fff;font:700 12px/1 var(--f);margin-bottom:16px}
.s3-appic.b{background:var(--brand)}.s3-appic.k{background:#141414}
.s3-appc h3{font:600 28px/36px var(--f);margin:0}
.s3-appc-t>p{font:400 15px/20px var(--f);margin:0 0 20px}
.s3-appc-ph{align-self:stretch;display:flex;justify-content:center;padding-top:28px}
.s3-stores{display:flex;gap:8px;flex-wrap:wrap}
.s3-store{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 12px;border-radius:999px;background:#141414;color:#fff;direction:ltr}
.s3-store .s3-mk{width:18px;height:18px}
.s3-store span{display:flex;flex-direction:column;font:600 13px/14px var(--f)}.s3-store i{font:400 8px/9px var(--f);font-style:normal}
.s3-bf{background:var(--s3-foot);color:#fff;padding:64px 32px 40px}
.s3-bf-in{display:grid;grid-template-columns:1fr 196px 202px 191px 208px;gap:64px}
.s3-bf-l{display:flex;flex-direction:column;align-items:flex-start;gap:36px}
.s3-bf .logo{color:#fff}
.s3-bf h3{font:600 17px/24px var(--f);margin:0 0 14px}
.s3-bf ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.s3-bf li a{font:400 15px/16px var(--f)}
.s3-bf-s{gap:8px!important}.s3-bf-s a{display:flex;align-items:center;gap:12px;line-height:20px!important}.s3-bf-s .i{width:16px;height:16px}
.s3-bf-b{display:flex;justify-content:space-between;align-items:center;margin-top:120px;font:400 15px/22px var(--f)}
.s3-bf-b span{display:flex;align-items:center;gap:12px}.s3-bf-b b{font:600 17px/24px var(--f)}.s3-bf-b .i{width:20px;height:20px}

/* calendar + phone mocks (drawn) */
.s3-cal{display:flex;flex-direction:column;height:100%;background:var(--bg);font-family:var(--f);color:#141414}
.s3-cal-top{display:flex;justify-content:space-between;align-items:center;height:44px;padding:0 16px;border-bottom:1px solid #eee;background:#fff}
.s3-cal-top b{font:800 17px/1 var(--f)}
.s3-cal-ics{display:flex;gap:12px;align-items:center}.s3-cal-ics .i{width:18px;height:18px}
.s3-cal-av{display:block;width:26px;height:26px;border-radius:50%;overflow:hidden;flex:none}.s3-cal-av img{width:100%;height:100%;object-fit:cover}
.s3-cal-tb{display:flex;gap:6px;align-items:center;height:40px;padding:0 12px 0 12px;border-bottom:1px solid #eee;background:#fff}
.s3-cal-tb span{display:flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;box-shadow:inset 0 0 0 1px #ddd;font:500 10px/1 var(--f);white-space:nowrap}
.s3-cal-tb span .i{width:12px;height:12px}
.s3-cal-tb span.k{background:#141414;color:#fff;box-shadow:none}
.s3-cal-tb em{flex:1}
.s3-cal-main{flex:1;display:flex;min-height:0;background:#fff}
.s3-cal-rail{width:36px;background:#141414;display:flex;flex-direction:column;align-items:center;gap:8px;padding-top:8px;flex:none}
.s3-cal-rail i{display:grid;place-items:center;width:24px;height:24px;border-radius:6px;color:#bbb}.s3-cal-rail i .i{width:16px;height:16px}
.s3-cal-rail i.on{background:#6950f3;color:#fff}
.s3-cal-grid{flex:1;display:flex;flex-direction:column;min-width:0}
.s3-cal-heads{display:grid;grid-template-columns:34px repeat(var(--cols),1fr);height:56px;border-bottom:1px solid #eee;flex:none}
.s3-cal-heads span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.s3-cal-heads i{width:30px;height:30px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 2px #fff,0 0 0 3px #8fd0ff}.s3-cal-heads i img{width:100%;height:100%;object-fit:cover}
.s3-cal-heads b{font:600 8px/1 var(--f)}
.s3-cal-body{flex:1;display:flex;position:relative;min-height:0}
.s3-cal-hrs{width:34px;display:flex;flex-direction:column;flex:none;border-inline-end:1px solid #eee}
.s3-cal-hrs span{flex:1;font:600 7px/1 var(--f);text-align:center;padding-top:3px;color:#555}
.s3-cal-cols{flex:1;position:relative;display:grid;grid-template-columns:repeat(var(--cols),1fr);background-image:linear-gradient(#eee 1px,transparent 1px);background-size:100% calc(100% / var(--hrs))}
.s3-cal-col{border-inline-end:1px solid #eee}
.s3-ev{position:absolute;inset-inline-start:calc(100% / var(--cols) * var(--c) + 2px);width:calc(100% / var(--cols) - 4px);top:calc(100% / var(--hrs) * var(--t) + 1px);height:calc(100% / var(--hrs) * var(--h) - 2px);border-radius:3px;padding:3px 5px;display:flex;flex-direction:column;gap:1px;overflow:hidden;font:400 7px/9px var(--f);color:#141414}
.s3-ev b{font-weight:600}.s3-ev b:first-child{font-weight:400}
.s3-ev-b{background:#a5dff8}.s3-ev-o{background:#ffc067}.s3-ev-p{background:#ff9cbf}.s3-ev-g{background:#6ad9cd}
.s3-mcal{display:flex;flex-direction:column;height:100%;background:#fff;color:#141414}
.s3-mcal-h{display:flex;justify-content:space-between;align-items:center;height:40px;padding:0 10px;flex:none}
.s3-mcal-h span{display:flex;align-items:center;gap:8px}.s3-mcal-h .i{width:14px;height:14px}.s3-mcal-h b{font:600 9px/1 var(--f)}
.s3-mcal-p{display:flex;flex-direction:column;align-items:center;gap:3px;padding:4px 0 6px;flex:none;border-bottom:1px solid #eee}
.s3-mcal-p i{width:30px;height:30px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 2px #fff,0 0 0 3px #8fd0ff}.s3-mcal-p i img{width:100%;height:100%;object-fit:cover}
.s3-mcal-p b{font:600 8px/1 var(--f)}
.s3-mcal .s3-cal{flex:1;min-height:0}
.s3-cal-1 .s3-cal-heads{display:none}
.s3-cal-1 .s3-ev{font-size:8px;line-height:10px}
.s3-mcal-nav{display:flex;justify-content:space-around;align-items:center;height:40px;border-top:1px solid #eee;flex:none}
.s3-mcal-nav i{display:grid;place-items:center;width:26px;height:26px;color:#333}.s3-mcal-nav .i{width:14px;height:14px}
.s3-mcal-nav i.k{width:32px;height:22px;border-radius:999px;background:#6950f3;color:#fff}
.s3-mven{display:flex;flex-direction:column;height:100%;background:#fff;color:#141414;font-family:var(--f)}
.s3-mven-im{height:42%;overflow:hidden}.s3-mven-im img{width:100%;height:100%;object-fit:cover}
.s3-mven-b{flex:1;padding:10px 12px;display:flex;flex-direction:column;gap:6px;font:400 8px/11px var(--f);overflow:hidden}
.s3-mven-b>b{font:700 13px/16px var(--f)}
.s3-mven-b p{display:flex;align-items:center;gap:4px;margin:0}.s3-mven-b .i{width:10px;height:10px}
.s3-stars{color:#141414;letter-spacing:1px}
.s3-mven-t{display:flex;gap:10px;align-items:center;font:600 8px/1 var(--f);margin-top:4px}
.s3-mven-t span.k{background:#141414;color:#fff;padding:5px 9px;border-radius:999px}
.s3-mven-s{display:flex;flex-direction:column;align-items:flex-start!important;font-size:8px}
.s3-mven-f{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-top:1px solid #eee;font:500 8px/1 var(--f)}
.s3-mven-f .k{background:#141414;color:#fff;padding:8px 14px;border-radius:6px;font-weight:600}
.s3-mmap{display:flex;flex-direction:column;height:100%;background:#fff;color:#141414}
.s3-mmap-m{position:relative;height:44%;background:linear-gradient(135deg,#e9efe6 25%,#dfe7f1 25% 50%,#e9efe6 50% 75%,#dfe7f1 75%) 0 0/40px 40px;flex:none}
.s3-mmap-m::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(30deg,transparent 0 22px,#fff 22px 24px),repeating-linear-gradient(-60deg,transparent 0 30px,#fff 30px 32px);opacity:.8}
.s3-mmap-s{position:absolute;z-index:2;top:8px;inset-inline:8px;display:flex;align-items:center;gap:6px;height:28px;padding:0 8px;border-radius:999px;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.s3-mmap-s .i{width:10px;height:10px}.s3-mmap-s b{display:flex;flex-direction:column;font:600 7px/9px var(--f)}.s3-mmap-s i{font-style:normal;font-weight:400;color:#777}
.s3-mmap-q{position:absolute;inset:0;z-index:1;background:none}
.s3-mmap-q .q-pin{--s:17px}
.s3-mmap-q .q-pin-ph{inset:1.5px}
.s3-mmap-f{display:flex;gap:4px;padding:8px;flex:none}.s3-mmap-f span{display:flex;align-items:center;height:18px;padding:0 6px;border-radius:999px;box-shadow:inset 0 0 0 1px #ddd;font:500 6px/1 var(--f);white-space:nowrap}.s3-mmap-f .i{width:8px;height:8px}
.s3-mmap-n{text-align:center;font:400 6px/1 var(--f);color:#777;margin:2px 0 6px}
.s3-mmap-c{flex:1;margin:0 10px;border-radius:6px;overflow:hidden;min-height:0}.s3-mmap-c img{width:100%;height:100%;object-fit:cover}
.s3-mmap-v{display:flex;justify-content:space-between;padding:6px 10px;margin:0;font:600 7px/1 var(--f)}.s3-mmap-v span{font-weight:400}
.s3-mprof{display:flex;flex-direction:column;height:100%;padding:8px;background:#fff;color:#141414;gap:6px}
.s3-mprof-c{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px;border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.s3-mprof-c i{width:64px;height:64px;border-radius:50%;overflow:hidden}.s3-mprof-c img{width:100%;height:100%;object-fit:cover}
.s3-mprof-c b{font:700 10px/1 var(--f)}
.s3-mprof-p{display:grid;grid-template-columns:1fr 1fr;gap:4px;height:52px}.s3-mprof-p img{width:100%;height:100%;object-fit:cover;border-radius:4px}
.s3-mprof-h{font:600 8px/1 var(--f);margin:10px 0 4px}
.s3-mprof-t{display:flex;flex-wrap:wrap;gap:4px}.s3-mprof-t span{font:500 6px/1 var(--f);padding:4px 6px;border-radius:999px;background:#f2f2f2}

/* ---------- pricing ---------- */
.s3-pr-h{text-align:center;padding:84px 24px 0}
.s3-pr-k{font:500 20px/28px var(--f);margin:0 0 12px}
.s3-pr-k.b{color:var(--brand);font-size:17px}
.s3-pr-h h1,.s3-fh2 h1{font:700 56px/64px var(--f);margin:0}
.s3-pr-h>p:last-child{font:400 20px/28px var(--f);margin:24px 0 0}
.s3-plans{display:grid;grid-template-columns:repeat(3,357px);gap:49px;justify-content:center;margin-top:110px}
.s3-plan{display:flex;flex-direction:column;align-items:flex-start;min-height:497px;padding:40px;border-radius:16px;background:var(--bg-2)}
.s3-plan-h{display:flex;justify-content:space-between;align-items:center;width:100%}
.s3-plan h3{font:600 24px/32px var(--f);margin:0}
.s3-trial{font:400 15px/20px var(--f);color:var(--brand);background:var(--brand-soft);box-shadow:inset 0 0 0 1px var(--brand-soft-2);border-radius:999px;padding:4px 16px}
.s3-plan-p{font:700 40px/52px var(--f);margin:16px 0 0}
.s3-plan-p.e{font-size:36px}
.s3-plan-u{font:400 17px/24px var(--f);margin:20px 0 32px}
.s3-plan-i{font:600 15px/20px var(--f);margin-bottom:12px}
.s3-plan ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font:400 15px/20px var(--f);color:var(--ink-2)}
.s3-plan-e{font:400 17px/24px var(--f);margin:20px 0 0}
.s3-plan-b{margin-top:auto;padding-top:40px}
.s3-plan .s3-mb{height:48px}
.s3-seefull{display:flex;flex-direction:column;align-items:center;gap:16px;margin:160px auto 0;width:max-content;font:500 20px/28px var(--f)}
.s3-seefull .i{width:28px;height:28px}
.s3-cmp{padding:200px 120px 80px}
.s3-cmp>h2{margin-bottom:64px}
.s3-pt{border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;margin-top:64px;background:var(--bg)}
.s3-pt-head{margin-top:0}
.s3-pt table{width:100%;border-collapse:collapse;table-layout:fixed}
.s3-pt th,.s3-pt td{border-top:1px solid var(--line);padding:0 28px;height:57px;vertical-align:middle}
.s3-pt td{border-inline-start:1px solid var(--line);text-align:center;font:400 16px/22px var(--f)}
.s3-pt thead th{background:var(--s3-g1);height:77px;text-align:start;font:600 19px/24px var(--f);border-top:0}
.s3-pt-head thead th{height:90px;text-align:center;font:600 24px/32px var(--f)}
.s3-pt-head thead th+th{border-inline-start:1px solid var(--line)}
.s3-pt-gap td{height:20px;background:var(--s3-g1);padding:0}
.s3-pt tbody th{text-align:start;font-weight:400}
.s3-pt-l{display:flex;align-items:center;gap:16px}
.s3-pt-l>span:last-child{display:flex;flex-direction:column;padding:10px 0}
.s3-pt-l b{font:400 16px/22px var(--f)}
.s3-pt-l i,.s3-pt td i{display:block;font:400 14px/18px var(--f);font-style:normal;color:var(--ink-2)}
.s3-pt-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:8px;flex:none;color:#fff;background:linear-gradient(135deg,#f06bff,#6950f3)}
.s3-pt-ic .i{width:20px;height:20px}
.s3-pt-gr{background:linear-gradient(135deg,#ffd75e,#ffb200)}.s3-pt-tc{background:linear-gradient(135deg,#1aa36f,#0d6b55)}.s3-pt-ins{background:linear-gradient(135deg,#7a8cff,#3d5bff)}.s3-pt-dc{background:linear-gradient(135deg,#7bd23d,#2d9a1a)}.s3-pt-web{background:linear-gradient(135deg,#1fc6c6,#5b5bff)}
.s3-pt-meta,.s3-pt-ga,.s3-pt-cert{background:var(--bg);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.s3-tick{width:28px;height:28px;margin:auto;display:block;stroke-width:2}
.s3-dash{color:var(--ink-2)}
.s3-free{color:var(--brand);font-weight:600}
.s3-tax{text-align:center;font:400 14px/20px var(--f);color:var(--ink-2);margin:64px 0 0}

/* ---------- features ---------- */
.s3-feats{background:var(--bg)}
.s3-fh2{background:var(--s3-g1);text-align:center;padding:72px 0 0;overflow:hidden;height:1230px;position:relative}
.s3-fh2 h1{margin-top:12px}
.s3-fh2>p:last-of-type{font:400 20px/28px var(--f);margin:24px 0 0}
.s3-collage{position:relative;width:1440px;height:880px;margin:44px auto 0}
.s3-tile{position:absolute;background:var(--bg);border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.06);padding:14px;text-align:start;display:flex;flex-direction:column;gap:6px;font-family:var(--f)}
.s3-tl{font:500 12px/16px var(--f);margin:0;display:flex;justify-content:space-between;color:var(--ink-2)}
.s3-tl.b{font-weight:600;color:var(--s3-ink)}.s3-tl.c{justify-content:center}
.s3-tb{font:700 20px/26px var(--f)}.s3-tb i{font:600 10px/1 var(--f);font-style:normal;background:#1f8900;color:#fff;padding:3px 6px;border-radius:999px;vertical-align:middle}
.s3-tb.c{text-align:center}
.s3-donut{width:110px;height:110px;margin:6px auto;border-radius:50%;background:conic-gradient(#ff7a1a 0 18%,#6950f3 18% 70%,#a18cff 70% 100%);-webkit-mask:radial-gradient(circle,transparent 34px,#000 35px);mask:radial-gradient(circle,transparent 34px,#000 35px)}
.s3-tleg{list-style:none;margin:0;padding:0;font:400 10px/16px var(--f)}.s3-tleg li{display:flex;justify-content:space-between}
.s3-spark{width:100%;height:110px;color:#6950f3}
.s3-tmap{height:90px;border-radius:8px;background:radial-gradient(circle at 50% 50%,rgba(105,80,243,.45) 0 26px,transparent 27px),linear-gradient(135deg,#e7efe2,#dce6f2)}
.s3-tbar{margin:0;height:46px;border-inline-start:3px solid #ff7aa8;padding-inline-start:10px;font:500 12px/16px var(--f);display:flex;align-items:center;background:var(--bg-2);border-radius:4px}
.s3-tord{display:flex;gap:10px;align-items:center;margin:4px 0 0;font:400 11px/14px var(--f);color:var(--ink-2)}
.s3-tord i{width:28px;height:28px;border-radius:6px;background:var(--bg-3)}.s3-tord b{display:block;font:500 12px/16px var(--f);color:var(--s3-ink)}
.s3-tprod{flex:1;border-radius:8px;background:var(--bg-2);display:grid;place-items:center}.s3-tprod i{width:40px;height:90px;border-radius:10px 10px 6px 6px;background:linear-gradient(#e7c8d4,#c79bb0)}
.s3-tqty{display:flex;justify-content:center;align-items:center;gap:14px;margin:6px 0 0;font:600 16px/1 var(--f)}.s3-tqty i{width:20px;height:20px;border-radius:50%;background:#6950f3;color:#fff;font-style:normal;display:grid;place-items:center;font-size:14px}
.s3-tcup{width:40px;height:40px;border-radius:50%;background:#fff2b8;display:grid;place-items:center;margin:0 auto;font-size:18px}
.s3-tbtn{display:block;text-align:center;font:600 12px/32px var(--f);background:var(--bg-2);border-radius:999px;margin-top:6px}
.s3-tper{display:flex;gap:10px;align-items:center;margin:4px 0;font:400 11px/14px var(--f);color:var(--ink-2)}
.s3-tper i{width:34px;height:34px;border-radius:50%;overflow:hidden}.s3-tper img{width:100%;height:100%;object-fit:cover}.s3-tper b{display:block;font:600 12px/16px var(--f);color:var(--s3-ink)}
.s3-tcrown{font-size:40px;line-height:1;text-align:center;color:#f2b600}
.s3-tspec{text-align:center;font:600 16px/20px var(--f);margin:4px 0 8px}
.s3-toff{display:block;text-align:center;background:#1c2b22;color:#fff;font:700 20px/56px var(--f-serif);border-radius:6px}
.s3-tile.t1{width:170px;height:305px;inset-inline-start:76px;top:0}
.s3-tile.t2{width:170px;height:195px;inset-inline-start:76px;top:320px}
.s3-tile.t3{width:170px;height:140px;inset-inline-start:76px;top:530px}
.s3-col-ph{position:absolute;inset-inline-start:280px;top:-24px}
.s3-ph-c{border-radius:28px;background:#141414;padding:6px}
.s3-ph-c .s3-ph-in{border-radius:22px}
.s3-tile.t4{width:200px;height:240px;inset-inline-start:286px;top:480px}
.s3-col-d{position:absolute;inset-inline-start:520px;top:130px;width:630px;height:400px;border-radius:12px;overflow:hidden;box-shadow:0 0 0 5px #141414,0 10px 30px rgba(0,0,0,.15)}
.s3-tile.t5{width:190px;height:255px;inset-inline-end:110px;top:-20px}
.s3-tile.t6{width:190px;height:290px;inset-inline-end:110px;top:250px}
.s3-tile.t7{width:190px;height:150px;inset-inline-start:725px;top:555px}
.s3-tile.t8{width:190px;height:110px;inset-inline-start:957px;top:555px}
.s3-tile.t9{width:190px;height:230px;inset-inline-end:110px;top:555px;background:#e9fbd8}
.s3-fs{padding:100px 120px 100px}
.s3-fs-in{max-width:1200px;margin:0 auto}
.s3-fs-h{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-bottom:32px;border-bottom:1px solid var(--line-2)}
.s3-fs-h h2{font:700 48px/52px var(--f);margin:0}
.s3-fs-h p{font:400 15px/20px var(--f);margin:6px 0 0}
.s3-fs-b{display:grid;grid-template-columns:1fr 568px;gap:64px;margin-top:64px;align-items:start}
.s3-fs-b.flip{grid-template-columns:568px 1fr}
.s3-fs-b.flip .s3-fs-v{order:-1}
.s3-fs-nov .s3-fs-b{grid-template-columns:1fr}
.s3-fs-g{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 40px;align-content:start}
.s3-fs-nov .s3-fs-g{grid-template-columns:repeat(3,1fr);gap:32px 40px}
.s3-fs-g h3{font:600 19px/24px var(--f);margin:0 0 6px}.s3-fs-g p{font:400 16px/24px var(--f);margin:0}
.s3-fs-v{position:relative;height:655px;border-radius:24px;background:var(--bg-2);overflow:hidden}
.s3-dark{background:#141414;color:#fff}
.s3-dark .s3-fs-h{border-color:#555}
.s3-dark .s3-fs-v{background:#222}
.s3-pb{position:absolute;inset-inline-start:50%;transform:translateX(50%);top:72px;width:366px;height:650px;border-radius:52px;background:#fff;padding:12px;box-shadow:0 0 0 2px #ddd,0 20px 40px rgba(0,0,0,.12)}
.s3-pb-in{width:100%;height:100%;border-radius:42px;background:#fff;border:8px solid #000;overflow:hidden;padding:32px 22px;color:#141414;font-family:var(--f)}
.s3-pbt-h{font:600 22px/28px var(--f);margin:12px 0 16px;display:flex;gap:8px;align-items:center}.s3-pbt-h i{font:500 11px/1 var(--f);font-style:normal;padding:4px 7px;border-radius:999px;box-shadow:inset 0 0 0 1px #ddd}
.s3-pbt-h.sm{font-size:16px}
.s3-pbt-s{display:block;height:34px;border-radius:999px;box-shadow:inset 0 0 0 1px #ddd;font:400 11px/34px var(--f);padding:0 14px;color:#999;margin-bottom:10px}
.s3-pbt-r{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #eee;margin:0;font:400 11px/14px var(--f);color:#777}
.s3-pbt-r i{width:44px;height:44px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 2px #fff,0 0 0 3px #ff8fb5}.s3-pbt-r img{width:100%;height:100%;object-fit:cover}
.s3-pbt-r span{flex:1}.s3-pbt-r b{display:block;font:600 12px/16px var(--f);color:#141414}.s3-pbt-r em{font:600 12px/1 var(--f);font-style:normal;color:#141414}
.s3-pbc{display:flex;flex-direction:column;align-items:center;gap:6px;padding-top:24px}
.s3-pbc>i{width:140px;height:140px;border-radius:50%;overflow:hidden;background:#ffb7c8}.s3-pbc>i img{width:100%;height:100%;object-fit:cover}
.s3-pbc>b{font:600 20px/26px var(--f);margin-top:10px}.s3-pbc>span{font:400 13px/1 var(--f);color:#888}
.s3-pbc p{display:flex;gap:8px;margin:16px 0}.s3-pbc p em{font:500 12px/36px var(--f);font-style:normal;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px #ddd}.s3-pbc p em.k{background:#141414;color:#fff}
.s3-pbc div{display:flex;flex-direction:column;gap:10px;width:100%}.s3-pbc div span{display:flex;justify-content:space-between;padding:16px 14px;border-radius:10px;box-shadow:0 1px 4px rgba(0,0,0,.1);font:500 12px/1 var(--f)}
.s3-pbp div{display:grid;grid-template-columns:1fr 1fr;gap:10px}.s3-pbp span{display:flex;flex-direction:column;gap:4px;border-radius:10px;box-shadow:inset 0 0 0 1px #eee;overflow:hidden;font:600 11px/14px var(--f);padding-bottom:10px}
.s3-pbp span i{height:110px;background:#f3f3f3;margin-bottom:6px;position:relative}.s3-pbp span i::after{content:"";position:absolute;inset:25px 35%;border-radius:10px;background:linear-gradient(#333,#111)}
.s3-pbp span i.p1::after{inset:20px 40%;background:linear-gradient(#e2a64b,#a8701f)}.s3-pbp span i.p2::after{border-radius:50%;inset:25px 30%}
.s3-pbp span b{padding:0 10px;font-weight:500}.s3-pbp span{padding-inline:0}
.s3-pbl{height:100%;margin:-32px -22px;padding:40px 14px;background:linear-gradient(160deg,#c43ea6,#e04a9b 40%,#9a6cf0);color:#fff;text-align:center;display:flex;flex-direction:column;gap:10px}
.s3-pbl>p{font:600 14px/1 var(--f);margin:10px 0 0}.s3-pbl>b{font:300 72px/1 var(--f);margin-bottom:60px}
.s3-pbl span{display:flex;gap:10px;align-items:center;text-align:start;padding:12px;border-radius:16px;background:rgba(255,255,255,.25);font:400 11px/14px var(--f)}
.s3-pbl span i{width:36px;height:36px;border-radius:8px;background:#fff;flex:none}.s3-pbl em{font-style:normal}.s3-pbl em b{display:block;font-weight:600}
.s3-pbf>b{display:block;font:600 14px/1 var(--f);margin:18px 0 10px}.s3-pbf p{margin:0 0 8px;font:500 10px/14px var(--f)}
.s3-pbf p.r{display:grid;grid-template-columns:1fr 1fr;gap:8px}.s3-pbf p.r span{display:flex;flex-direction:column;gap:4px}.s3-pbf p.r em{font-style:normal;height:34px;border-radius:8px;box-shadow:inset 0 0 0 1px #ddd;display:flex;align-items:center;justify-content:center;font-weight:400}
.s3-pbf p.c{display:flex;gap:8px;align-items:center;font-weight:400}.s3-pbf p.c i{width:14px;height:14px;border-radius:3px;box-shadow:inset 0 0 0 1px #ccc}
.s3-pbr>b{display:block;font:700 26px/32px var(--f)}.s3-pbr>b i{font:600 10px/1 var(--f);font-style:normal;background:#1f8900;color:#fff;padding:3px 6px;border-radius:999px;vertical-align:middle}
.s3-bars{display:flex;align-items:flex-end;gap:14px;height:180px;margin:24px 0}
.s3-bars span{flex:1;height:calc(var(--v) * 1%);border-radius:3px;background:linear-gradient(#a18cff 0 30%,#5b48d6 30% 88%,#272063 88%)}
.s3-pbr p{display:flex;align-items:center;gap:6px;font:500 12px/1 var(--f);margin:0 0 10px}.s3-pbr p em{margin-inline-start:auto;font-style:normal;font-weight:600}
.s3-pbr p i{width:8px;height:8px;border-radius:50%}.s3-pbr i.a{background:#a18cff}.s3-pbr i.b{background:#5b48d6}.s3-pbr i.c{background:#272063}
.s3-pbk div{display:grid;grid-template-columns:1fr 1fr;gap:10px}.s3-pbk span{display:flex;flex-direction:column;gap:12px;padding:14px 10px;border-radius:8px;box-shadow:inset 0 0 0 1px #e5e5e5;font:500 12px/1 var(--f)}.s3-pbk .i{width:18px;height:18px;color:#555}
.s3-pbm{height:100%;margin:-32px -22px;padding:30px 18px;background:#fde68c;color:#d9604f;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;font-family:var(--f)}
.s3-pbm>span{font:500 11px/1 var(--f)}.s3-pbm>b{font:800 30px/34px var(--f)}.s3-pbm>em{font:700 12px/1 var(--f);font-style:normal}
.s3-pbm>i{font-size:60px;font-style:normal;line-height:1.3}.s3-pbm>p{font:400 11px/16px var(--f);margin:0}
.s3-pbm div{display:flex;flex-direction:column;align-items:center;gap:4px;border:1px solid #e5b65c;border-radius:10px;padding:14px;width:100%}.s3-pbm div b{font:800 26px/1 var(--f)}.s3-pbm div span{font:600 10px/1 var(--f)}.s3-pbm div em{font:600 11px/1 var(--f);font-style:normal;background:#d9604f;color:#fff;padding:8px 16px;border-radius:999px;margin-top:6px}
.s3-pb .s3-mmap{margin:-32px -22px;height:calc(100% + 64px)}
.s3-intg{position:absolute;inset:0;margin:auto;width:280px;height:280px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.s3-intg span{display:grid;place-items:center;border-radius:12px;background:var(--bg);box-shadow:0 8px 20px rgba(0,0,0,.08);font:700 22px/1 var(--f);color:#333}
.s3-intg span.k{background:var(--brand);color:#fff;font-size:20px}
.s3-dark .s3-mb-k{background:#fff;color:#141414}

/* ---------- download ---------- */
.s3-dl{background:var(--bg)}
.s3-dl-in{padding:48px 52px 64px;text-align:center}
.s3-dl-in h1{font:700 48px/56px var(--f);margin:0}
.s3-dl-p{font:400 20px/28px var(--f);max-width:940px;margin:20px auto 0}
.s3-dl-g{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:48px;text-align:start}
.s3-dlc{position:relative;height:758px;border-radius:24px;overflow:hidden;padding:56px 56px 0;display:flex;flex-direction:column;box-shadow:inset 0 0 0 1px var(--line)}
.s3-dlc.a{background:linear-gradient(115deg,#ebe9ff 0%,#e3ddff 30%,#7e6bff 60%,#6f5cff 100%)}
.s3-dlc.b{background:linear-gradient(115deg,#ffffff 0%,#fafff0 35%,#e6ff85 62%,#c8ff00 100%)}
.s3-dlc-t{display:flex;flex-direction:column;gap:12px;align-items:flex-start;color:#141414}
.s3-dl-av{display:flex;align-items:center;gap:6px;font:600 13px/1 var(--f);margin:0 0 6px}.s3-dl-av .s3-mk{width:16px;height:16px}
.s3-dlc h2{font:700 48px/52px var(--f);margin:0;max-width:430px}
.s3-dlc-t>p{font:400 16px/22px var(--f);margin:0 0 10px;max-width:560px}
.s3-dlc .s3-store{border-radius:6px;height:40px}
.s3-dlc-v{position:relative;flex:1;margin-top:48px}
.s3-dl-ph{position:absolute;bottom:0;inset-inline-start:0;width:300px;height:390px;border-radius:24px 24px 0 0;padding:8px 8px 0;background:rgba(255,255,255,.5);box-shadow:0 10px 30px rgba(0,0,0,.08);overflow:hidden}
.s3-dl-ph>div{border-radius:18px 18px 0 0;overflow:hidden;height:100%}
.s3-qr{position:absolute;bottom:40px;inset-inline-end:56px;width:150px;height:150px;border-radius:12px;background:#fff;padding:18px}
.s3-qr svg{width:100%;height:100%;fill:#141414;display:block}

/* ---------- marketing: mobile ---------- */
/* business pages: the phone layout serves every width up to 900px; 901–1279px see the fluid block below */
@container (max-width:900px){
  .s3-bh{padding:12px 20px;height:72px}
  .s3-bh-l nav,.s3-hide-m{display:none}
  .s3-bh .s3-mb-k{height:36px;padding:0 16px;font-size:15px}
  .s3-menu{box-shadow:none;padding:0 8px;background:transparent}
  .s3-menu .i{width:28px;height:28px}
  .s3-h48,.s3-h48b{font-size:32px;line-height:40px}
  .s3-lead{font-size:17px;line-height:24px}
  .s3-hero{padding:24px 20px 64px}
  .s3-hero h1{font-size:40px;line-height:48px;padding:0}
  .s3-hero>p{font-size:19px;line-height:28px}
  .s3-hero-b{flex-direction:column;align-items:center;gap:12px}
  .s3-hero-b .s3-mb{min-width:170px}
  .s3-hero-v{width:100%;height:210px;margin-top:40px}
  .s3-frame-d{width:92%;height:180px;padding:3px;border-radius:10px}
  .s3-frame-d .s3-frame-in{border-radius:8px}
  .s3-frame-d .s3-cal{zoom:.3}
  .s3-frame-m{width:90px;height:180px;top:28px;padding:3px;border-radius:12px}
  .s3-frame-m .s3-frame-in{border-radius:9px}
  .s3-frame-m .s3-mcal{zoom:.3}
  .s3-rates{gap:6px;margin-top:20px}.s3-rates>div{min-width:0}.s3-rates b{font-size:12px}.s3-rates span{font-size:10px}
  .s3-stats{grid-template-columns:1fr 1fr;gap:28px 8px;margin-top:48px}.s3-stats b{font-size:28px;line-height:36px}.s3-stats span{font-size:16px;line-height:22px}
  .s3-one{padding:72px 20px 40px}.s3-one-p{font-size:16px;line-height:24px}
  .s3-types{grid-template-columns:1fr 1fr;gap:20px;margin-top:64px}
  .s3-type{padding:16px;border-radius:16px}.s3-type b{font-size:20px;line-height:24px}
  .s3-certs{flex-wrap:wrap;gap:24px;margin-top:64px}
  .s3-need{padding:72px 20px}.s3-need-g{grid-template-columns:1fr;gap:32px;margin-top:40px}
  .s3-feat,.s3-feat-g,.s3-rev{grid-template-columns:1fr;padding:72px 20px;gap:40px}
  .s3-rev .s3-feat-t{order:-1}
  .s3-pair{height:440px;transform:scale(.7);transform-origin:top center;margin:0 -60px -130px}
  .s3-payw{height:360px}
  .s3-pos{transform:rotate(-28deg) scale(.7)}
  .s3-revs,.s3-boss{padding:72px 0 0}
  .s3-revs-h,.s3-boss>h2,.s3-boss>p,.s3-carnav{padding-inline:20px}
  .s3-car{padding:40px 20px 0;gap:16px}
  .s3-revv{width:330px;height:420px}.s3-revc{width:300px;height:420px}.s3-stat{width:300px;height:380px;padding:32px}
  .s3-succ{padding:72px 20px}.s3-succ-g{grid-template-columns:1fr;gap:28px}
  .s3-help{padding:72px 20px}.s3-help-g{grid-template-columns:1fr;gap:16px}
  .s3-faq{padding:72px 20px}.s3-faq-l{width:auto;margin-top:40px}
  .s3-fq summary{font-size:17px;line-height:24px;padding:16px}
  .s3-plat{padding:20px 0 72px}.s3-mq-i{width:220px;height:140px}
  .s3-cta{padding:96px 20px;min-height:0}.s3-cta h2{font-size:32px;line-height:40px}.s3-cta p{font-size:17px}
  .s3-apps{padding:72px 20px}.s3-apps-p{font-size:17px;line-height:24px}
  .s3-apps-g{grid-template-columns:1fr}
  .s3-appc{grid-template-columns:1fr;height:auto;padding-top:32px}
  .s3-appc-t{padding:0 24px}
  .s3-bf{padding:48px 20px 32px}
  .s3-bf-in{grid-template-columns:1fr 1fr;gap:40px 20px}
  .s3-bf-l{grid-column:1/-1}
  .s3-bf-b{margin-top:56px;flex-direction:column;gap:16px;align-items:flex-start}
  .s3-pr-h h1,.s3-fh2 h1{font-size:36px;line-height:44px}
  .s3-plans{grid-template-columns:1fr;padding:0 20px;gap:20px;margin-top:48px}
  .s3-cmp{padding:96px 20px 40px}
  .s3-pt th,.s3-pt td{padding:0 10px;font-size:13px}
  .s3-fh2{height:auto;padding:48px 20px}
  .s3-collage{width:100%;height:auto;display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .s3-collage>*{position:static!important;width:auto!important;height:auto!important}
  .s3-col-d,.s3-col-ph{display:none}
  .s3-fs{padding:64px 20px}
  .s3-fs-h{flex-direction:column;align-items:flex-start}.s3-fs-h h2{font-size:32px;line-height:40px}
  .s3-fs-b,.s3-fs-b.flip{grid-template-columns:1fr}
  .s3-fs-g,.s3-fs-nov .s3-fs-g{grid-template-columns:1fr}
  .s3-fs-v{height:520px}
  .s3-pb{transform:translateX(50%) scale(.8);transform-origin:top center;top:40px}
  .s3-dl-in{padding:32px 20px}
  .s3-dl-in h1{font-size:32px;line-height:40px}
  .s3-dl-g{grid-template-columns:1fr}
  .s3-dlc{padding:32px 24px 0;height:640px}
  .s3-dlc h2{font-size:32px;line-height:38px}
  .s3-qr{display:none}
}

/* ===== help centre and information pages (review 1405-07-24) ===== */
.s3-docp{--s3-pg:var(--bg);background:var(--bg);min-height:100%}
.s3-doc{max-width:800px;margin:0 auto;padding:48px 20px 96px;display:flex;flex-direction:column;gap:32px}
.s3-doc .s3-sub{margin-top:-24px}
.s3-doc-q{position:relative;display:flex;align-items:center;height:48px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg)}
.s3-doc-q>.i{position:absolute;inset-inline-start:16px;width:20px;height:20px;color:var(--ink-2);pointer-events:none}
.s3-doc-q input{flex:1;min-width:0;height:46px;border:0;background:transparent;padding:0 48px 0 16px;font:400 16px/22px var(--f);color:var(--ink);border-radius:999px;outline:0}
.s3-doc-q:focus-within{box-shadow:inset 0 0 0 2px var(--brand)}
.s3-doc .s-fchips{margin-top:-8px}
.s3-doc-faq{display:flex;flex-direction:column;gap:12px}
.s3-doc .s3-fq summary{font:600 16px/22px var(--f);padding:16px 20px}
.s3-doc .s3-fq summary small{display:block;font:400 14px/20px var(--f);color:var(--ink-2);margin-top:2px}
.s3-doc .s3-fq p{padding:0 20px 16px;font:400 16px/24px var(--f);color:var(--ink-2)}
.s3-doc-none{display:flex;flex-direction:column;gap:4px;padding:32px 0;text-align:center}
.s3-doc-none b{font:600 16px/22px var(--f)}.s3-doc-none span{color:var(--ink-2)}
.s3-doc-ct{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:24px}
.s3-doc-ct h2{font:600 20px/28px var(--f)}.s3-doc-ct p{color:var(--ink-2)}
.s3-doc-ctb{display:flex;gap:12px;flex-wrap:wrap}
.s3-doc-tabs{margin:0}
.s3-doc-sec{display:flex;flex-direction:column;gap:24px}
.s3-doc-sec h2{font:600 20px/28px var(--f);margin-bottom:8px}
.s3-doc-sec p{font:400 16px/26px var(--f);color:var(--ink-2)}
.s3-doc-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 24px}
.s3-doc-links a{font:400 16px/24px var(--f);color:var(--ink)}
.s3-doc-links a:hover{text-decoration:underline}
.s3-doc-st{padding:24px}
.s3-doc-ok{display:flex;align-items:center;gap:8px;color:var(--ok);font:600 18px/24px var(--f);margin-bottom:16px}
.s3-doc-ok .i{width:24px;height:24px}
.s3-doc-st ul{list-style:none;margin:0;padding:0}
.s3-doc-st li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-top:1px solid var(--line);font:400 16px/22px var(--f)}
.s3-doc-st li b{color:var(--ok);font-weight:500}
.s3-doc-sel{display:flex}
.s3-actq{max-width:480px;margin-top:-16px}
.s3-ml-bk{margin-inline-end:4px}
@container (max-width:600px){
  .s3-doc{padding:24px 16px 64px;gap:24px}
  .s3-doc .s3-sub{margin-top:-16px}
  .s3-doc-links{grid-template-columns:repeat(2,minmax(0,1fr))}
  .s3-doc-ct .s3-btn{flex:1}
}

/* ===== responsive (review 1405-07-24): every width between the 1440 design and the 900px app layout =====
   The desktop grids keep their measured sizes as maxima and shrink with the screen; nothing scrolls sideways. */
@container (min-width:901px) and (max-width:1279px){
  .s3-split{grid-template-columns:minmax(0,392px) minmax(0,536px)}
  .s3-split-l{padding-inline-end:0}
  .s3-detw{width:auto}
  .s3-pgrid{grid-template-columns:minmax(0,352px) minmax(0,575px)}
  .s3-setg{grid-template-columns:repeat(2,minmax(0,304px))}
  .s3-setcol{width:100%;max-width:600px}
  .s3-wcol{width:100%;max-width:528px}
  .s3-msg{grid-template-columns:280px minmax(0,1fr)}
  .s3-side{padding:24px 16px 64px}
  .s3-body{grid-template-columns:220px minmax(0,1fr)}
  /* business pages */
  .s3-hero h1{font-size:48px;line-height:56px;padding:42px 32px 0}
  .s3-hero-v{width:calc(100% - 64px);max-width:1185px;height:auto;aspect-ratio:1185/722}
  .s3-frame-d{width:91.6%;height:94.3%}
  .s3-frame-m{width:26.6%;height:85%;top:15%}
  .s3-stats{padding:0 32px}
  .s3-types{grid-template-columns:repeat(3,minmax(0,374px));gap:24px;padding:0 32px}
  .s3-need{padding-inline:48px}.s3-need-g{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
  .s3-feat,.s3-feat-g{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;padding:78px 48px 120px}
  .s3-rev{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .s3-pair{transform:scale(.8);transform-origin:top center}
  .s3-revs-h,.s3-boss>h2,.s3-boss>p{padding:0 48px}
  .s3-revv{width:min(853px,calc(100cqw - 96px))}
  .s3-succ{padding-inline:48px}.s3-succ-g{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
  .s3-help{padding-inline:48px}
  .s3-faq-l{width:auto;max-width:800px;margin-inline:48px}
  .s3-apps{padding-inline:48px}
  .s3-bf-in{grid-template-columns:repeat(4,minmax(0,1fr));gap:40px}
  .s3-bf-l{grid-column:1/-1}
  .s3-plans{grid-template-columns:repeat(3,minmax(0,357px));gap:24px;padding:0 32px}
  .s3-cmp{padding:160px 48px 80px}
  .s3-collage{width:calc(100% - 64px);height:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
  .s3-collage>*{position:static!important;width:auto!important;height:auto!important}
  .s3-col-d{display:none}
  .s3-fs{padding-inline:48px}
  .s3-fs-b{grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:40px}
  .s3-dl-in{padding-inline:32px}
  .s3-dlc{padding:40px 32px 0}
}
/* information pages: the back bar only where the site header is hidden (phone) */
@container (min-width:601px){.s3-docp .s3-mback{display:none}}
.s3-dl .s3-mback{background:var(--bg)}   /* download: back bar while the header is hidden (≤900, like the account pages) */
@container (min-width:601px) and (max-width:900px){.s3-vgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ======================= restyle v3 (account + information pages) — form only, colours unchanged ======================= */
.s3-btn{border-radius:var(--r-ctl);transition:background-color var(--d-2) var(--ease),box-shadow var(--d-2),opacity var(--d-2),transform var(--d-1)}
.s3-btn.lg{border-radius:var(--r-btn)}
.s3-btn:hover{box-shadow:inset 0 0 0 1px var(--ink-3)}
.s3-btn.pri:hover,.s3-btn.danger:hover{opacity:1;box-shadow:none;background:color-mix(in srgb,var(--ink) 86%,var(--bg))}
.s3-btn.danger:hover{background:var(--bad-2)}
.s3-btn:active{transform:translateY(1px)}
.s3-icb{border-radius:var(--r-ctl);transition:background-color var(--d-2)}
.s3-link{font-weight:600}
.s3-link:hover{text-decoration:underline;text-underline-offset:3px}
.s3-thumb{border-radius:var(--r-ctl)}
.s3-thumb img,.s3-thumb .noph{border-radius:9px}
/* side navigation: 10px rows, active = soft brand tile with a hairline */
.s3-side a{border-radius:var(--r-ctl);transition:background-color var(--d-2),color var(--d-2)}
.s3-side li.on a{font-weight:650;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 18%,transparent)}
.s3-side a .i{transition:transform var(--d-3) var(--ease)}
.s3-side a:hover .i{transform:translateX(-1px) rotate(-6deg)}
/* headings */
.s3-h1,.s3-pe-b h1,.s3-det-t,.s3-prof-n{font-weight:700;letter-spacing:var(--tr-head)}
.s3-ct,.s3-sh p,.s3-det-st,.s3-setc h2,.s3-wsec h2,.s3-ml-h h2,.s3-mh h2,.s3-empty-t{font-weight:700;letter-spacing:var(--tr-head)}
.s3-det-hero>p{letter-spacing:-.02em}
/* cards */
.s3-card,.s3-det,.s3-pol,.s3-wsend,.s3-wsec,.s3-conf,.s3-addr .s3-lc,.s3-pc,.s3-setc{border-radius:var(--r-card);box-shadow:var(--sh-card-1)}
.s3-ac{border-radius:var(--r-card);box-shadow:var(--sh-card-1);transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease)}
.s3-ac.sel{box-shadow:var(--sh-card-on)}
.s3-ac.sel::after{border-radius:var(--r-card)}
.s3-det-hero{border-radius:13px 13px 0 0}
.s3-setc,.s3-pc{transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease),background-color var(--d-2)}
.s3-setc:hover{background:var(--bg)}
.s3-vc{transition:transform var(--d-3) var(--ease)}
.s3-vc-im{border-radius:var(--r-card);transition:box-shadow var(--d-3) var(--ease)}
.s3-vc-t b,.s3-ac-n,.s3-pc b{font-weight:650;letter-spacing:var(--tr-head)}
@media (hover:hover){
  .s3-ac:not(.sel):hover,.s3-setc:hover,.s3-pc:hover{transform:translateY(var(--lift));box-shadow:var(--sh-card-h)}
  .s3-vc:hover{transform:translateY(var(--lift))}
  .s3-vc:hover .s3-vc-im{box-shadow:var(--sh-2)}
}
.s3-wbal{border-radius:var(--r-lg)}
.s3-wamt b{letter-spacing:var(--tr-fig)}
.s3-wlab{font-size:var(--t-cap);font-weight:600;letter-spacing:var(--tr-label);opacity:.9}
.s3-wic{border-radius:var(--r-ctl)}
.s3-row{border-radius:var(--r-ctl);transition:background-color var(--d-1)}
.s3-rowch .i{transition:transform var(--d-3) var(--ease)}
.s3-row:hover .s3-rowch .i{transform:translateX(-3px)}
.s3-ov-t p{font-weight:700;font-size:18px;letter-spacing:var(--tr-head)}
/* status pills: pastel background + deep text, no outline */
.s3-pill{height:28px;padding-inline:9px 12px;gap:6px;font-size:13px;font-weight:600;letter-spacing:var(--tr-label)}
.s3-pill .i{width:16px;height:16px}
.s3-pill-ok,.s3-pill-bad,.s3-pill-muted{box-shadow:none}
/* chips, segmented day pickers, slots */
.s3-tabs li{transition:background-color var(--d-2),box-shadow var(--d-2),color var(--d-2)}
.s3-tabs li:hover:not(.on){background:var(--bg-2)}
.s3-day{border-radius:var(--r-md);transition:background-color var(--d-2),box-shadow var(--d-2)}
.s3-day b{letter-spacing:var(--tr-fig)}
.s3-slot{border-radius:var(--r-ctl);transition:background-color var(--d-2),box-shadow var(--d-2)}
.s3-slot:hover:not([aria-pressed="true"]){box-shadow:inset 0 0 0 1px var(--ink-3)}
.s3-noslot{border-radius:var(--r-card)}
.s3-acct .tg,.s3-mov .tg{transition:background-color var(--d-2)}
.s3-acct .tg i,.s3-mov .tg i{transition:transform var(--d-3) var(--ease-spring)}
/* fields */
.s3-in{border-radius:var(--r-ctl);transition:box-shadow var(--d-2)}
.s3-in input,.s3-in select{border-radius:var(--r-ctl)}
.s3-in:hover{box-shadow:inset 0 0 0 1px var(--ink-3)}
.s3-in:focus-within{box-shadow:inset 0 0 0 1px var(--brand),var(--ring)}
.s3-fld input,.s3-fld textarea{border-radius:var(--r-ctl);transition:box-shadow var(--d-2)}
.s3-fld input:hover,.s3-fld textarea:hover{box-shadow:inset 0 0 0 1px var(--ink-3)}
.s3-fld input:focus,.s3-fld textarea:focus{box-shadow:inset 0 0 0 1px var(--brand),var(--ring)}
.s3-f>label,.s3-fld>span{font-size:var(--t-sm)}
.s3-comp{border-radius:var(--r-card);transition:box-shadow var(--d-2)}
.s3-comp:focus-within{box-shadow:inset 0 0 0 1px var(--brand),var(--ring)}
/* messages */
.s3-mi{border-radius:var(--r-ctl);transition:background-color var(--d-1)}
.s3-bub{border-radius:var(--r-lg)}
/* modals */
.s3-mov .mdl{border-radius:var(--r-xl);box-shadow:var(--sh-3);animation:s-rv-in .32s var(--ease)}
.s3-opts button{border-radius:var(--r-ctl);transition:background-color var(--d-1)}
.s3-empty{border-radius:var(--r-card)}
/* information pages */
.s3-doc-q{transition:box-shadow var(--d-2)}
.s3-doc-q:focus-within{box-shadow:inset 0 0 0 1px var(--brand),var(--ring)}
.s3-helpc{border-radius:var(--r-lg)}
@container (max-width:900px){
  .s3-ac,.s3-ac.sel,.s3-ac:not(.sel):hover{box-shadow:none!important;transform:none}
  .s3-det-m .s3-det-acts,.s3-det-m .s3-ov{border-radius:var(--r-card);box-shadow:var(--sh-card-1)}
  .s3-det-m,.s3-addr,.s3-wsec{box-shadow:none}
  .s3-addr .s3-lc{box-shadow:var(--sh-card-1)}
  .s3-wbal{border-radius:0}
  .s3-wsend{border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line)}
  .s3-mov .mdl{border-radius:var(--r-xl) var(--r-xl) 0 0;animation:s-up .28s var(--ease)}
  .s3-prof{border-radius:var(--r-card)}
}
.s3-pill-ok{color:var(--ok-deep)}
.s3-pill-muted{color:var(--ink-2-deep)}

/* ======================= restyle v3 palette (customer) — Accord LIGHT colours (CONVENTIONS «restyle v3 palette») =======================
   Light = Accord; literals that changed are --s3p-* tokens whose dark value is the old one (dark mode unchanged). */
:root{--s3p-pbl:linear-gradient(160deg,#0b7658,#14231d);--s3p-cta:radial-gradient(60% 90% at 100% 100%,#12a079 0,transparent 70%),linear-gradient(100deg,#0b7658 0%,#14231d 100%);--s3p-ph:linear-gradient(to left bottom,var(--s3-lav),rgba(18,160,121,.25),rgba(18,160,121,0));--s3p-c-w:var(--page);--s3p-wal:#14231d;--s3p-p3:#0b7658;--s3p-p2:#9fd8c2;--s3p-p4:#14231d;--s3p-top:var(--band);--s3p-side:var(--bg-4);--s3p-p1:#12a079;--s3p-dlca:linear-gradient(115deg,#f1f2ec 0%,#e2efe8 30%,#cde2d6 60%,#b9dccb 100%);--s3p-son:var(--bg-2);--s3p-hero:linear-gradient(180deg,var(--band) 0,var(--band) 42%,#cde2d6 58%,#0b7658 76%,#14231d 100%);--s3p-c-b2:var(--page);--s3p-c-b4:var(--page);--s3p-ptic:linear-gradient(135deg,#12a079,#0b7658);--s3p-grad:linear-gradient(90deg,#0b7658,#12a079);--s3p-son-sh:inset 0 0 0 1px var(--line-2);--s3p-tmapc:rgba(18,160,121,.40);--s3p-posb:linear-gradient(135deg,#12a079,#0b7658)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--s3p-pbl:linear-gradient(160deg,#c43ea6,#e04a9b 40%,#9a6cf0);--s3p-cta:radial-gradient(40% 70% at 0% 60%,#f15ad1 0,transparent 70%),radial-gradient(35% 60% at 42% 20%,#9e8cff 0,transparent 70%),radial-gradient(60% 90% at 100% 100%,#4a00e8 0,transparent 70%),linear-gradient(100deg,#c637e5 0%,#8f2ef5 40%,#7a12f2 70%,#5a06ea 100%);--s3p-ph:linear-gradient(to left bottom,var(--s3-lav),rgba(167,131,251,.4),rgba(167,131,251,0));--s3p-c-w:var(--bg);--s3p-wal:linear-gradient(253deg,#fa6cfd 0%,#c467fd 18%,#9563fe 30%,#6960ff 44%,#6960ff 100%);--s3p-p3:#5b48d6;--s3p-p2:#a18cff;--s3p-p4:#272063;--s3p-top:var(--bg);--s3p-side:var(--bg);--s3p-p1:#6950f3;--s3p-dlca:linear-gradient(115deg,#ebe9ff 0%,#e3ddff 30%,#7e6bff 60%,#6f5cff 100%);--s3p-son:var(--brand-soft);--s3p-hero:radial-gradient(70% 38% at 18% 70%,rgba(214,68,255,.75),transparent 70%),radial-gradient(60% 40% at 80% 80%,rgba(105,40,243,.95),transparent 70%),radial-gradient(90% 30% at 50% 92%,#7a24f1,transparent 80%),linear-gradient(180deg,var(--bg) 0,var(--bg) 42%,#a98bff 62%,#8a3cf4 80%,#6a1fe6 100%);--s3p-c-b2:var(--bg-2);--s3p-c-b4:var(--bg-4);--s3p-ptic:linear-gradient(135deg,#f06bff,#6950f3);--s3p-grad:linear-gradient(90deg,#ef6997,#e85cba,#b84cdc);--s3p-son-sh:none;--s3p-tmapc:rgba(105,80,243,.45);--s3p-posb:linear-gradient(135deg,#3b6cff,#8a5cff)}}
:root[data-theme="dark"]{--s3p-pbl:linear-gradient(160deg,#c43ea6,#e04a9b 40%,#9a6cf0);--s3p-cta:radial-gradient(40% 70% at 0% 60%,#f15ad1 0,transparent 70%),radial-gradient(35% 60% at 42% 20%,#9e8cff 0,transparent 70%),radial-gradient(60% 90% at 100% 100%,#4a00e8 0,transparent 70%),linear-gradient(100deg,#c637e5 0%,#8f2ef5 40%,#7a12f2 70%,#5a06ea 100%);--s3p-ph:linear-gradient(to left bottom,var(--s3-lav),rgba(167,131,251,.4),rgba(167,131,251,0));--s3p-c-w:var(--bg);--s3p-wal:linear-gradient(253deg,#fa6cfd 0%,#c467fd 18%,#9563fe 30%,#6960ff 44%,#6960ff 100%);--s3p-p3:#5b48d6;--s3p-p2:#a18cff;--s3p-p4:#272063;--s3p-top:var(--bg);--s3p-side:var(--bg);--s3p-p1:#6950f3;--s3p-dlca:linear-gradient(115deg,#ebe9ff 0%,#e3ddff 30%,#7e6bff 60%,#6f5cff 100%);--s3p-son:var(--brand-soft);--s3p-hero:radial-gradient(70% 38% at 18% 70%,rgba(214,68,255,.75),transparent 70%),radial-gradient(60% 40% at 80% 80%,rgba(105,40,243,.95),transparent 70%),radial-gradient(90% 30% at 50% 92%,#7a24f1,transparent 80%),linear-gradient(180deg,var(--bg) 0,var(--bg) 42%,#a98bff 62%,#8a3cf4 80%,#6a1fe6 100%);--s3p-c-b2:var(--bg-2);--s3p-c-b4:var(--bg-4);--s3p-ptic:linear-gradient(135deg,#f06bff,#6950f3);--s3p-grad:linear-gradient(90deg,#ef6997,#e85cba,#b84cdc);--s3p-son-sh:none;--s3p-tmapc:rgba(105,80,243,.45);--s3p-posb:linear-gradient(135deg,#3b6cff,#8a5cff)}
.s3-bg-b4{--s3-pg:var(--s3p-c-b4)}.s3-bg-b2{--s3-pg:var(--s3p-c-b2)}.s3-bg-w{--s3-pg:var(--s3p-c-w)}
.s3-side{background:var(--s3p-side)}
.s3-side li.on a{background:var(--s3p-son);box-shadow:var(--s3p-son-sh)}
.s3-fh{background:var(--s3p-top)}
.s3-badge,.s3-fh-av i,.s3-bw.me .s3-bub,.s3-day[aria-pressed="true"]{background:var(--sel);color:var(--on-sel)}
.s3-bw.me .s3-bt{color:color-mix(in srgb,var(--on-sel) 80%,transparent)}
.s3-wbal{background:var(--s3p-wal)}
.s3-hero{background:var(--s3p-hero)}
.s3-cta{background:var(--s3p-cta)}
.s3-grad{background:var(--s3p-grad);-webkit-background-clip:text;background-clip:text}
.s3-dlc.a{background:var(--s3p-dlca)}
.s3-pbl{background:var(--s3p-pbl)}
.s3-pt-ic{background:var(--s3p-ptic)}
.s3-ph{background:var(--s3p-ph)}
.s3-pos-b i{background:var(--s3p-posb)}
.s3-donut{background:conic-gradient(#e0832a 0 18%,var(--s3p-p1) 18% 70%,var(--s3p-p2) 70% 100%)}
.s3-spark{color:var(--s3p-p1)}
.s3-tmap{background:radial-gradient(circle at 50% 50%,var(--s3p-tmapc) 0 26px,transparent 27px),linear-gradient(135deg,#e7efe2,#dce6f2)}
.s3-tqty i,.s3-cal-rail i.on,.s3-mcal-nav i.k{background:var(--s3p-p3)}
.s3-bars span{background:linear-gradient(var(--s3p-p2) 0 30%,var(--s3p-p3) 30% 88%,var(--s3p-p4) 88%)}
.s3-pbr i.a{background:var(--s3p-p2)}.s3-pbr i.b{background:var(--s3p-p3)}.s3-pbr i.c{background:var(--s3p-p4)}


/* Qeychi — customer phone app: 1:1 replica of Fresha's native Android customer app (capture/phone/c-*.png).
   Layout sizes are the captured dp (px / 2.625). The capture phone had system font_scale 1.5, which in Compose scales
   only text (sp), so every font size and line-height here is the measured value / 1.5 (body 14/20, small 13, titles
   15-22px, matching Fresha's mobile web) and text-driven heights were shrunk to match. RTL: Fresha's left is our right.
   Prefix c-. */
[data-app="capp"]{
  /* restyle v3 palette: Accord light (green-tinted map, mint highlight, night/emerald cards) */
  --c-map-land:#eef1ea; --c-map-water:#a9dbe2; --c-map-urb:#e2efe8; --c-map-park:#c4e3d2; --c-map-road:#d6d9cf; --c-map-hw:#b3c4bb; --c-map-lab:#14231d;
  --c-badge:rgba(255,255,253,.92); --c-hl:#d3eee2; --c-blue-g:#0b7658; --c-navy:#14231d;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) [data-app="capp"]{
  --c-map-land:#1d2026; --c-map-water:#16324a; --c-map-urb:#262626; --c-map-park:#1b3426; --c-map-road:#363b44; --c-map-hw:#56627a; --c-map-lab:#c9ccd1;
  --c-badge:rgba(13,13,13,.86); --c-hl:#2b2660; --c-blue-g:linear-gradient(135deg,#1d4fa6 0%,#3b7fd6 100%); --c-navy:#d1d4ff;
}}
:root[data-theme="dark"] [data-app="capp"]{
  --c-map-land:#1d2026; --c-map-water:#16324a; --c-map-urb:#262626; --c-map-park:#1b3426; --c-map-road:#363b44; --c-map-hw:#56627a; --c-map-lab:#c9ccd1;
  --c-badge:rgba(13,13,13,.86); --c-hl:#2b2660; --c-blue-g:linear-gradient(135deg,#1d4fa6 0%,#3b7fd6 100%); --c-navy:#d1d4ff;
}
[data-app="capp"]{font-size:14px;line-height:20px;color:var(--ink)}
[data-app="capp"] .i{width:24px;height:24px}
[data-app="capp"] img{width:100%;height:100%;object-fit:cover}
[data-app="capp"] mark{background:var(--c-hl);color:inherit;border-radius:2px}
.c-pg{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;background:var(--cp-canvas)}
.c-sc{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;position:relative}
.c-sc::-webkit-scrollbar{display:none}
.c-sc-tab{padding-bottom:var(--q-tb-space)}
.c-pad{padding:0 20px}
.c-g{color:var(--ink-2)}
.c-1l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;min-width:0}
.c-dot{font-style:normal;margin:0 8px;font-size:10px}
.c-hr{height:1px;background:var(--line);margin:24px 0}
.c-sp{flex:1}
.c-link{color:var(--brand);font-weight:400}
.c-clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.c-clamp4{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.c-cover{position:absolute;inset:0;z-index:0;border-radius:inherit}
.c-h2{font-size:22px;line-height:28px;font-weight:600;margin:0 20px 16px}
.c-h3{font-size:16px;line-height:22px;font-weight:600;margin:0 0 12px}
.c-pt{font-size:28px;line-height:36px;font-weight:600}
.c-h2r{display:flex;align-items:center;justify-content:space-between}
.c-h2r .c-h2{margin-inline-end:0}
.c-seeall{font-size:16px;line-height:22px;margin-inline-end:20px;margin-bottom:16px}
.c-seeall2{font-size:16px;line-height:22px}
.c-cntc{display:inline-grid;place-items:center;min-width:24px;height:20px;padding:0 7px;border:1px solid var(--line);border-radius:999px;font-size:11px;font-weight:400;color:var(--ink-2);vertical-align:3px;margin-inline-start:4px;line-height:1}
.c-cnt-b{display:inline-grid;place-items:center;height:18px;padding:0 6px;border-radius:999px;background:var(--bg-3);color:var(--ink-2);font-size:11px;font-weight:500;margin-inline-start:6px;line-height:1}

/* icon buttons, pills */
.c-ib{width:48px;height:48px;display:grid;place-items:center;flex:none;border-radius:50%;color:var(--ink)}
.c-ib .i{width:24px;height:24px}
.c-ib.on{color:var(--bad)}
.c-ib-w{width:36px;height:36px;background:var(--bg);box-shadow:var(--sh-small);margin:6px}
.c-ib-w .i{width:20px;height:20px}
.c-ib0{width:48px;flex:none}
.c-cb{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);flex:none}
.c-cb .i{width:20px;height:20px}
.c-cb.on{box-shadow:inset 0 0 0 2px var(--brand);color:var(--brand)}
.c-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;font-weight:600;white-space:nowrap;flex:none}
.c-btn .i{width:20px;height:20px}
.c-btn-l{height:48px;padding:0 20px;font-size:16px}
.c-btn-m{height:48px;padding:0 20px;font-size:16px}
.c-btn-s{height:48px;padding:0 16px;font-size:16px;font-weight:500}
.c-btn-xs{height:36px;padding:0 16px;font-size:14px;font-weight:400}
.c-btn-dark{background:var(--ink);color:var(--on-ink)}
.c-btn-dark:disabled{background:var(--ink-3);color:var(--on-ink)}
.c-btn-o{background:var(--bg);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.c-btn-o.c-btn-xs{box-shadow:inset 0 0 0 1px var(--line)}
.c-btn-w{background:var(--bg);color:var(--ink)}
.c-btn-blue{background:linear-gradient(90deg,#1a73e8 0%,#4f6cf0 70%,#6a5cf3 100%);color:#fff;font-weight:500}
.c-btn-navy{background:var(--c-navy);color:var(--bg);height:44px;padding:0 20px;border-radius:8px;font-size:14px;font-weight:600}
.c-wide{width:100%}
.c-grow{flex:1}
.c-btn-ic{position:relative}
.c-btn-ic .i{position:absolute;inset-inline-start:20px;width:22px;height:22px}
.c-tbtn{font-size:16px;font-weight:600;color:var(--ink);padding:0 4px}
.c-tbtn:disabled{color:var(--ink-3)}

/* tab bar = shared qTabBar (ui.css); here it only floats over the bottom of the page */
.c-pg>.c-tabs{position:absolute;inset-inline:0;bottom:0}

/* top bars */
.c-top{flex:none;display:flex;align-items:center;height:64px;padding:0 6px;background:var(--cp-canvas);position:relative;z-index:10}
.c-top-t{flex:1;min-width:0;font-size:18px;line-height:24px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-inline-start:4px}
.c-top-a{display:flex;align-items:center}
.c-top-big .c-top-t{opacity:0;transition:opacity .15s}
.c-top-big.c-on{box-shadow:0 1px 0 var(--line)}
.c-top-big.c-on .c-top-t{opacity:1}
.c-top-tl .c-top-t{padding-inline-start:0}
.c-top-tl .c-ib0{width:15px}
.c-bigt{padding:0 20px;margin-bottom:16px}
.c-bigt h2{font-size:28px;line-height:36px;font-weight:600}
.c-bigt p{font-size:16px;line-height:22px;color:var(--ink-2);margin-top:8px}

/* bottom action bars (80px) */
.c-bb{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:80px;padding:16px 20px;background:var(--bg);border-top:1px solid var(--line);position:relative;z-index:10}
.c-bb-l{display:flex;flex-direction:column;min-width:0}
.c-bb-p{font-size:16px;line-height:22px;font-weight:600}
.c-bb-s{display:flex;align-items:center;gap:3px;font-size:14px;line-height:20px}
.c-bb-s .i{width:18px;height:18px}
.c-bb-1{justify-content:stretch}
.c-bb-2{gap:12px}
.c-bb-2 .c-btn{flex:1}
.c-bb-dk{background:transparent;border:0}

/* sheets (App.modal) */
[data-app="capp"] .ov.c-ov{place-items:end stretch;background:var(--scrim)}
[data-app="capp"] .c-ov .mdl{width:100%;max-height:calc(100% - 32px);border-radius:28px 28px 0 0;display:flex;flex-direction:column;overflow:hidden;animation:c-up .22s ease-out}
[data-app="capp"] .c-ov-full .mdl{height:calc(100% - 0px);max-height:none;border-radius:28px 28px 0 0}
[data-app="capp"] .c-ov-login .mdl{border-radius:0;animation:none}
@keyframes c-up{from{transform:translateY(40%);opacity:.4}}
.c-handle{display:block;width:32px;height:4px;border-radius:2px;background:var(--line-2);margin:10px auto 0;flex:none}
.c-shd{display:flex;align-items:center;gap:8px;padding:18px 20px 10px;flex:none}
.c-shd h2{flex:1;font-size:18px;line-height:24px;font-weight:600}
.c-shd .c-ib-x{margin-inline-end:-12px}
.c-shtop{display:flex;justify-content:flex-end;align-items:center;padding:6px 8px 0;height:58px;flex:none}
.c-shtop-fx{justify-content:space-between;padding-inline-start:20px;box-shadow:0 1px 0 transparent}
.c-shtop-t{font-size:18px;line-height:24px;font-weight:600;opacity:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-sh-t{font-size:18px;line-height:24px;font-weight:600;padding:0 20px 12px}
.c-shb{padding:0 20px 20px;overflow-y:auto;flex:1;min-height:0;scrollbar-width:none}
.c-shf{display:flex;gap:12px;padding:12px 20px 20px;flex:none;background:var(--bg)}
.c-shf .c-btn{flex:1}
.c-shf-end{margin-top:auto}
.c-shf-r{align-items:center;justify-content:space-between;border-top:1px solid var(--line)}
.c-shf-r .c-btn{flex:none}
.c-spin{display:grid;place-items:center;height:100%;min-height:400px;color:var(--ink-2)}
.c-spin .i{width:40px;height:40px;animation:c-rot .9s linear infinite}
@keyframes c-rot{to{transform:rotate(360deg)}}

/* small shared bits */
.c-star{color:var(--star);width:20px!important;height:20px!important}
.c-stars{display:inline-flex;gap:2px}
.c-stars .c-star{width:22px!important;height:22px!important}
.c-vf{display:inline-grid;place-items:center;width:23px;height:23px;color:var(--brand);vertical-align:-3px;margin-inline-start:6px}
.c-vf svg{width:100%;height:100%}
.c-rate{display:inline-flex;align-items:center;gap:4px;flex:none;font-size:16px;line-height:22px}
.c-rate b{font-weight:600}
.c-badge{position:absolute;top:12px;inset-inline-start:12px;display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 8px;border-radius:999px;background:var(--c-badge);font-size:13px;line-height:1;font-weight:500;color:var(--ink);z-index:2}
.c-trophy{color:var(--brand);display:grid}
.c-trophy .i,.c-bstar{width:16px!important;height:16px!important}
.c-av{display:inline-grid;place-items:center;border-radius:50%;overflow:hidden;background:var(--brand-soft);color:var(--brand);flex:none;font-weight:500}
.c-ini{font-size:inherit}
.c-av18{width:18px;height:18px;font-size:6px;box-shadow:0 0 0 1.5px var(--bg)}
.c-av24{width:24px;height:24px;font-size:7.3px}
.c-av28{width:28px;height:28px;font-size:8.7px}
.c-av32{width:32px;height:32px;font-size:10px}
.c-av40{width:40px;height:40px;font-size:11px}
.c-av48{width:48px;height:48px;font-size:14px}
.c-av64{width:64px;height:64px;font-size:17px}
.c-av72{width:72px;height:72px;font-size:18.7px}
.c-av80{width:80px;height:80px;font-size:20px}
.c-av152{width:152px;height:152px;font-size:34.7px}
[data-app="capp"] .tg{position:relative;width:46px;height:28px;border-radius:999px;background:var(--line);flex:none;transition:background .15s}
[data-app="capp"] .tg i{position:absolute;top:3px;inset-inline-start:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:inset-inline-start .15s}
[data-app="capp"] .tg[aria-checked="true"]{background:var(--brand)}
[data-app="capp"] .tg[aria-checked="true"] i{inset-inline-start:21px}
.c-radio{width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--line-2);flex:none;position:relative}
[aria-checked="true"]>.c-radio{box-shadow:inset 0 0 0 2px var(--brand)}
[aria-checked="true"]>.c-radio::after{content:"";position:absolute;inset:6px;border-radius:50%;background:var(--brand)}
.c-chk{width:24px;height:24px;border-radius:4px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line-2);flex:none;position:relative}
[aria-checked="true"]>.c-chk{background:var(--brand);box-shadow:none}
[aria-checked="true"]>.c-chk::after{content:"";position:absolute;left:8px;top:4px;width:5px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.c-chips{display:flex;flex-wrap:wrap;gap:8px}
.c-chips-1{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -20px;padding:0 20px}
.c-chip{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font-size:14px;line-height:1;white-space:nowrap;color:var(--ink)}
.c-chip .i{width:18px;height:18px}
.c-chip.on{background:var(--brand-soft);box-shadow:inset 0 0 0 2px var(--brand)}
.c-chip-rad.on{background:var(--brand);color:#fff;box-shadow:none}
.c-chip-c{max-width:100%}
.c-chip-c .c-1l{max-width:180px}
.c-chip-c .c-g{font-size:11px}
.c-chip-r{display:inline-flex;align-items:center;gap:2px;font-weight:600}
.c-chip-r .c-star{width:15px!important;height:15px!important}
.c-seg{display:inline-flex;height:40px;padding:3px;border-radius:999px;background:var(--bg-3);flex:none}
.c-seg button{padding:0 14px;border-radius:999px;font-size:14px;color:var(--ink);white-space:nowrap}
.c-seg button[aria-selected="true"]{background:var(--bg);box-shadow:0 0 0 1px var(--line),0 1px 3px rgba(19,19,19,.12)}
.c-seg-w{display:flex;margin-bottom:20px}
.c-seg-w button{flex:1}
.c-inp{display:flex;align-items:center;gap:10px;height:48px;padding:0 14px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink-2);background:var(--bg)}
.c-inp-on{box-shadow:inset 0 0 0 1.5px var(--brand)}
.c-inp input{flex:1;min-width:0;border:0;outline:0;background:none;font-size:14px;color:var(--ink);height:100%}
.c-inp input::placeholder{color:var(--ink-3)}
.c-inp-x{color:var(--ink);display:grid;place-items:center;width:32px;height:32px}
.c-inp-x .i{width:20px;height:20px}
.c-inp-s{flex:1;height:36px;border-radius:999px}
.c-link-b{color:var(--brand)}

/* ================= HOME (owner's ref3 structure, Fresha-demo tokens) ================= */
.c-home{padding-bottom:12px}
.c-hh{display:flex;align-items:center;height:48px;padding:0 20px 0 8px;margin-bottom:8px}
.c-hh-logo{font-size:26px;line-height:1;height:auto;margin:0}
.c-hh-bell{position:relative}
.c-hh-dot{position:absolute;top:12px;inset-inline-end:13px;width:8px;height:8px;border-radius:50%;background:var(--bad);box-shadow:0 0 0 2px var(--bg)}
.c-hs2{display:flex;align-items:center;height:46px;margin:0 20px 16px;padding:0 4px;border-radius:999px;background:var(--bg);box-shadow:var(--sh-card),var(--sh-small)}
.c-hs2-city{display:flex;align-items:center;gap:4px;height:38px;padding:0 10px;border-radius:999px;font-size:14px;font-weight:600;color:var(--ink);flex:none;position:relative}
.c-hs2-city::after{content:"";position:absolute;inset-inline-end:-1px;top:10px;bottom:10px;width:1px;background:var(--line)}
.c-hs2-city .i{width:18px!important;height:18px!important}
.c-hs2-city .i:first-child{color:var(--brand)}
.c-hs2-q{flex:1;min-width:0;height:38px;text-align:start;padding:0 12px;color:var(--ink-2);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-hs2-go{width:38px;height:38px;border-radius:50%;background:var(--ink);color:var(--on-ink);display:grid;place-items:center;flex:none}
.c-hs2-go .i{width:18px!important;height:18px!important}
.c-heros{margin:0 20px 24px;height:150px}
.c-ad{position:relative;height:100%;color:var(--q-on-photo)}
.c-ad img{position:absolute;inset:0}
.c-ad::after{content:"";position:absolute;inset:0;background:var(--q-photo-fade)}
.c-ad-t{position:absolute;z-index:1;inset-block:0;inset-inline-start:0;width:62%;padding:12px 16px 22px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:3px}
.c-ad-eb{display:flex;align-items:center;gap:6px;font-size:11px;line-height:16px;opacity:.92}
.c-ad-eb i{font-style:normal;font-size:10px;line-height:16px;padding:0 6px;border-radius:4px;background:var(--glass);color:var(--ink);font-weight:600}
.c-ad h2{font-size:17px;line-height:23px;font-weight:700}
.c-ad p{font-size:12px;line-height:17px;opacity:.9;margin-bottom:2px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.c-ad-go{height:28px;padding:0 10px;font-size:12px;font-weight:600;gap:4px;margin-top:4px}
.c-ad-go .i{width:14px!important;height:14px!important}
.c-hsec{margin-bottom:28px}
.c-h2-ic{display:flex;align-items:center;gap:6px}
.c-h2-ic .i{width:20px!important;height:20px!important;color:var(--brand)}
.c-seeall-ar{display:inline-flex;align-items:center;gap:4px;color:var(--brand);min-height:32px}
.c-seeall-ar .i{width:16px!important;height:16px!important}
.c-hcats{display:grid;grid-template-columns:repeat(5,1fr);gap:16px 6px;padding:0 14px}
.c-hcat{display:flex;flex-direction:column;align-items:center;gap:8px;min-height:44px}
.c-hcat-ic{width:56px;height:56px;border-radius:16px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;color:var(--ink);transition:background .15s}
.c-hcat-ic .i{width:26px!important;height:26px!important}
.c-hcat:hover .c-hcat-ic{background:var(--brand-soft)}
.c-hcat-l{font-size:12px;line-height:16px;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.c-promos{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 20px 28px}
.c-promo{position:relative;height:84px;border-radius:16px;overflow:hidden;color:var(--q-on-photo);text-align:start;background:var(--bg-3)}
.c-promo img{position:absolute;inset:0}
.c-promo::after{content:"";position:absolute;inset:0;background:var(--q-photo-fade)}
.c-promo-t{position:absolute;z-index:1;inset:0;padding:10px 12px;display:flex;flex-direction:column;justify-content:center;gap:2px}
.c-promo-t small{font-size:10px;line-height:14px;opacity:.9}
.c-promo-t b{font-size:14px;line-height:20px;font-weight:700}
.c-promo-t span{font-size:11px;line-height:15px;opacity:.9;max-width:82%}
.c-promo-go{position:absolute;z-index:1;bottom:8px;inset-inline-end:8px;width:24px;height:24px;border-radius:50%;background:var(--glass);color:var(--ink);display:grid;place-items:center}
.c-promo-go .i{width:16px!important;height:16px!important}
.c-car{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;padding:0 20px;margin-bottom:40px;scroll-snap-type:x mandatory}
.c-car::-webkit-scrollbar{display:none}
.c-vipcar{margin-bottom:0;padding-bottom:4px}
.c-vip{position:relative;width:156px;flex:none;display:flex;flex-direction:column;gap:4px;scroll-snap-align:start}
.c-vip-im{display:block;height:112px;border-radius:12px;overflow:hidden;background:var(--bg-3);margin-bottom:4px}
.c-vip-rt{position:absolute;top:84px;inset-inline-end:8px;display:inline-flex;align-items:center;gap:2px;height:22px;padding:0 7px;border-radius:999px;background:var(--glass);font-size:11px;line-height:1;pointer-events:none}
.c-vip-rt .c-star{width:13px!important;height:13px!important}
.c-vip-rt b{font-weight:600}
.c-vip .q-heart{width:32px;height:32px;top:6px;inset-inline-end:6px}
.c-vip .q-heart .i{width:18px!important;height:18px!important}
.c-vip-n{font-size:14px;line-height:20px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-vip-l{display:flex;align-items:center;gap:3px;font-size:12px;line-height:16px;min-width:0}
.c-vip-l .i{width:14px!important;height:14px!important;flex:none}
.c-vip-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:2px}
.c-vip-tags i{font-style:normal;font-size:10.5px;line-height:20px;padding:0 7px;border-radius:999px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink-2);white-space:nowrap}
.c-foot{margin:24px 20px 8px;text-align:center;font-size:11px;line-height:16px;color:var(--ink-3)}
.c-rc-r1{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.c-ncar .c-g{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* home menu sheet + notifications */
.c-menu-r{display:flex;align-items:center;gap:14px;width:100%;min-height:56px;border-bottom:1px solid var(--line);font-size:16px;text-align:start;color:var(--ink)}
.c-menu-r span{flex:1}
.c-menu-r .i:last-child{width:18px!important;height:18px!important;color:var(--ink-3)}
.c-nl{list-style:none;margin:0;padding:0}
.c-ni{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.c-ni-ic{width:40px;height:40px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.c-ni-ic .i{width:20px!important;height:20px!important}
.c-ni-b{display:flex;flex-direction:column;gap:2px;min-width:0}
.c-ni-b b{font-weight:600}
.c-ni-b small{font-size:12px}
/* messages + conversation (same threads as the website's messages page) */
.c-msgs .c-pt{margin-bottom:12px}
.c-ml{list-style:none;margin:0 -20px;padding:0}
.c-mi{position:relative;display:flex;align-items:center;gap:14px;width:100%;min-height:76px;padding:10px 20px;text-align:start}
.c-mi:hover{background:var(--bg-2)}
.c-mi-ph{width:52px;height:52px;border-radius:50%;overflow:hidden;flex:none;background:var(--bg-3)}
.c-mi-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.c-ml li+li .c-mi{box-shadow:inset 0 1px 0 var(--line)}
.c-mi-r{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.c-mi-r b{font-weight:600}
.c-mi-r small{font-size:12px;flex:none}
.c-mi.un .c-mi-b>.c-g{color:var(--ink);font-weight:500}
.c-mi-dot{width:10px;height:10px;border-radius:50%;background:var(--brand);flex:none}
.c-msgs .c-empty>.i{width:40px;height:40px;color:var(--brand);margin-bottom:16px}
.c-top-chat{gap:4px;box-shadow:0 1px 0 var(--line)}
.c-chat-who{display:flex;align-items:center;gap:10px;flex:1;min-width:0;font-size:15px;font-weight:600}
.c-chat-av{width:36px;height:36px;border-radius:50%;overflow:hidden;flex:none;background:var(--bg-3)}
.c-pg-chat .c-sc{background:var(--bg-2)}
.c-chat{display:flex;flex-direction:column;gap:8px;padding:12px 16px 16px}
.c-bday{display:flex;align-items:center;gap:12px;margin:8px 0;font-size:14px;line-height:20px;color:var(--ink-2)}
.c-bday::before,.c-bday::after{content:"";flex:1;height:1px;background:var(--line)}
.c-bsys{font-size:12px;line-height:16px;color:var(--ink-2);background:var(--bg);padding:4px 10px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line)}
.c-bsys{align-self:center;text-align:center;max-width:85%}
.c-bw{display:flex}
.c-bw.me{justify-content:flex-end}            /* same sides and colours as the website's messages (site3) */
.c-bw:not(.me){justify-content:flex-start}
.c-bub{max-width:78%;display:flex;flex-direction:column;gap:6px;padding:8px 12px;border-radius:18px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);font-size:14px;line-height:20px}
.c-bw.me .c-bub{background:var(--q-accent);color:var(--q-on-accent);box-shadow:none;border-end-end-radius:6px}
.c-bw:not(.me) .c-bub{border-end-start-radius:6px}
.c-bt{font-size:10.5px;line-height:12px;opacity:.65;align-self:flex-end}
.c-bph{display:block;width:200px;max-width:100%;height:150px;border-radius:12px;overflow:hidden;margin:-2px -6px 0}
.c-brc{display:flex;align-items:center;gap:10px}
.c-brc>.i{width:28px!important;height:28px!important}
.c-brc span{display:flex;flex-direction:column}
.c-brc small{font-size:12px;opacity:.8}
.c-comp{flex:none;padding:8px 20px 16px;background:var(--bg)}
.c-comp-in{display:flex;flex-direction:column;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg);padding:12px 16px 8px}
.c-comp-in:focus-within{box-shadow:inset 0 0 0 2px var(--ink)}
.c-comp-in textarea{border:0;outline:0;resize:none;background:none;min-height:24px;max-height:120px;padding:0;font-size:16px;line-height:22px;color:var(--ink)}
.c-comp-in textarea::placeholder{color:var(--ink-2)}
.c-comp-row{display:flex;align-items:center;justify-content:space-between;margin-top:6px}
.c-comp-att{width:40px;height:40px;margin-inline-start:-10px}
.c-err{font-size:14px;line-height:20px;color:var(--bad);margin-top:6px}
.c-field[aria-invalid="true"]{box-shadow:inset 0 0 0 2px var(--bad)}
.c-comp-send{width:36px;height:36px;border-radius:50%;background:var(--ink);color:var(--on-ink);display:grid;place-items:center;flex:none}
.c-comp-send:disabled{background:var(--bg-3);color:var(--ink-3)}
.c-comp-send .i{width:18px!important;height:18px!important}

/* location */
.c-pg-loc .c-pad{padding-top:6px}
.c-curloc{display:flex;align-items:center;gap:14px;height:52px;font-size:14px;width:100%}
.c-curloc-ic{width:32px;height:32px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center}
.c-curloc-ic .i{width:18px;height:18px}

/* activity */
.c-act{padding:65px 20px 0;min-height:100%;display:flex;flex-direction:column}
.c-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 24px 40px;gap:0}
.c-calart{width:40px;height:40px;margin-bottom:22px}
.c-empty b{font-size:18px;line-height:24px;font-weight:600;margin-bottom:4px}
.c-empty p{color:var(--ink-2);font-size:16px;line-height:22px;margin-bottom:20px}
.c-empty .c-btn-s{height:44px;font-size:14px;font-weight:400}
.c-empty .c-btn-m{height:40px;margin-top:4px;font-weight:400;padding:0 16px}

/* login */
.c-login{display:flex;flex-direction:column;padding:0 20px 24px;overflow-y:auto;height:100%}
.c-login .c-shtop{margin:0 -12px 12px}
.c-sub{font-size:16px;line-height:22px;color:var(--ink-2);margin:10px 0 22px}
.c-sub2{font-size:16px;line-height:22px;color:var(--ink);margin-top:10px}
.c-lbl{font-size:14px;line-height:20px;font-weight:600;margin-bottom:4px}
.c-field{height:48px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line-2);border:0;padding:0 16px;font-size:16px;background:var(--bg);color:var(--ink);outline:0;width:100%}
.c-field:focus{box-shadow:inset 0 0 0 1.5px var(--brand)}
.c-field::placeholder{color:var(--ink-3)}
.c-phone{display:flex;gap:8px}
.c-cc{width:102px;flex:none;display:flex;align-items:center;justify-content:space-between}
.c-cc .i{width:18px;height:18px}
.c-help{font-size:12px;line-height:16px;color:var(--ink-2);margin:8px 0 14px}
.c-or{display:flex;align-items:center;gap:16px;margin:24px 0;color:var(--ink-2);font-size:12px;line-height:16px}
.c-or::before,.c-or::after{content:"";flex:1;height:1px;background:var(--line)}
.c-login .c-btn-o{margin-bottom:12px;height:48px}
.c-glogo{width:22px!important;height:22px!important}
.c-pg-ctry .c-bigt{padding:0;margin-bottom:22px}
.c-ctrys{margin-top:20px}
.c-ctry{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:12px 0;border-bottom:1px solid var(--line);text-align:start;font-size:16px}
.c-ctry-n{flex:1}
.c-ctry-f{font-size:14.7px;line-height:1;align-self:flex-start;margin-top:6px}

/* ================= SEARCH ================= */
.c-pg-srch{overflow:hidden}
.c-pg-srch>.q-map{position:absolute;inset:0;background:var(--c-map-land);--q-ctl-top:84px;--q-card-b:calc(var(--q-tb-h) + var(--q-fab-rise) + 10px)}
.c-pg-srch[data-sheet="pin"] .c-rs{top:100%;visibility:hidden}
.c-map-svg{position:absolute;inset:0;width:100%;height:100%}
.c-map-lab{font:600 13px var(--f);fill:var(--c-map-lab)}
.c-sq{position:absolute;top:11px;inset-inline:20px;z-index:20;display:flex;align-items:center;gap:12px;height:48px;padding:0 6px;padding-inline-start:18px;border-radius:999px;background:var(--bg);box-shadow:0 2px 10px rgba(19,19,19,.16)}
.c-pg-srch:not([data-sheet="full"]) .c-sq{top:11px;height:58px}
.c-sq-b{position:absolute;inset:0;border-radius:inherit}
.c-sq>.i{width:22px;height:22px;flex:none}
.c-sq-2{flex:1;min-width:0;display:flex;flex-direction:column;line-height:20px}
.c-sq-2 b{font-size:16px;line-height:22px;font-weight:600}
.c-sq-1{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-sq-1 b{font-size:14px;font-weight:600}
.c-sq-1 .c-dot{margin:0 6px}
.c-sq-ic{position:relative;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;flex:none;color:var(--ink)}
.c-sq-ic2{background:var(--bg-2)}
.c-sq-ic .i{width:22px;height:22px}
.c-rs{position:absolute;inset-inline:0;bottom:0;top:256px;z-index:10;background:var(--bg);border-radius:28px 28px 0 0;box-shadow:0 -2px 12px rgba(19,19,19,.1);display:flex;flex-direction:column;transition:top .25s ease}
.c-pg-srch[data-sheet="full"] .c-rs{top:65px}
.c-pg-srch[data-sheet="min"] .c-rs{top:557px}
.c-rs-h{height:24px;flex:none;display:grid;place-items:start center}
.c-rs-h .c-handle{margin-top:10px}
.c-rs-bar{display:flex;align-items:center;justify-content:space-between;padding:8px 20px 0;flex:none}
.c-rs-ic{display:flex;gap:8px}
.c-days{display:flex;gap:24px;overflow-x:auto;scrollbar-width:none;padding:0 20px;height:52px;flex:none;box-shadow:inset 0 -1px 0 var(--line)}
.c-days::-webkit-scrollbar{display:none}
.c-day{flex:none;font-size:14px;color:var(--ink-2);position:relative;white-space:nowrap}
.c-day.on{color:var(--ink);font-weight:600}
.c-day.on::after{content:"";position:absolute;inset-inline:0;bottom:0;height:3px;background:var(--ink);border-radius:2px}
.c-rs-l{padding:0 20px 90px}
.c-cnt{text-align:center;color:var(--ink-2);margin:10px 0 14px}
.c-pg-srch[data-sheet="full"] .c-cnt{display:none}
.c-pg-srch[data-sheet="min"] .c-days,.c-pg-srch[data-sheet="min"] .c-rs-l{visibility:hidden}
.c-vr{margin-bottom:32px}
.c-vr-a{display:flex;flex-direction:column}
.c-vr-im{position:relative;height:209px;border-radius:12px;overflow:hidden;background:var(--bg-3);margin-bottom:8px}
.c-pager{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;height:100%}
.c-pager::-webkit-scrollbar{display:none}
.c-pager>*{flex:none;width:100%;height:100%;scroll-snap-align:start}
.c-dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);display:flex;gap:5px;z-index:2}
.c-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.55)}
.c-dots i.on{background:#fff}
.c-vr-r1{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.c-vr-n{font-size:16px;line-height:22px;font-weight:600}
.c-srows{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.c-srow{position:relative;display:flex;flex-direction:column;align-items:stretch;text-align:start;padding:10px 12px;border-radius:12px;background:var(--bg-2);width:100%}
.c-srow>span{pointer-events:none}
.c-srow>.c-slots{pointer-events:auto;position:relative;z-index:1}
.c-srow-t{display:flex;justify-content:space-between;gap:12px}
.c-srow-n{min-width:0}
.c-srow-p{flex:none}
.c-slots{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin-top:8px}
.c-slot{flex:none;height:28px;padding:0 8px;border-radius:6px;background:var(--brand);color:#fff;font-size:14px;font-weight:500;line-height:28px}
.c-vr-more{display:block;margin-top:12px;font-size:14px}
.c-pr{margin-bottom:32px}
.c-pr-a{display:flex;gap:20px;align-items:flex-start}
.c-pr-av{position:relative;flex:none;width:80px;height:96px}
.c-pr-rt{position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:2px;height:22px;padding:0 8px;border-radius:999px;background:var(--bg);box-shadow:var(--sh-small);font-size:13px;font-weight:600}
.c-pr-rt .c-star,.c-tm-r .c-star{width:14px!important;height:14px!important}
.c-pr-b{flex:1;min-width:0;display:flex;flex-direction:column}
.c-pr-n{font-size:16px;line-height:22px;font-weight:600}
.c-pr-ad{margin-top:8px}

/* time sheet */
.c-tgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.c-topt{min-height:64px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px;text-align:center}
.c-topt b{font-weight:400;font-size:16px;line-height:22px}
.c-topt span{color:var(--ink-2);font-size:14px;line-height:20px}
.c-topt.on{box-shadow:inset 0 0 0 2px var(--brand);background:var(--brand-soft);color:var(--brand)}
.c-topt.on span{color:var(--brand)}
.c-topt-w{grid-column:1/-1;min-height:44px}
.c-fromto{display:flex;align-items:center;gap:12px;margin-top:12px}
.c-ddw{flex:1;position:relative}
.c-sel{width:100%;height:48px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line-2);display:flex;align-items:center;justify-content:space-between;padding:0 14px;font-size:14px}
.c-sel.ph span{color:var(--ink-3)}
.c-sel .i{width:18px;height:18px}
.c-dd{position:absolute;width:168px;max-height:560px;overflow-y:auto;background:var(--bg);border-radius:4px;box-shadow:var(--sh-pop);z-index:5;padding:8px 0;scrollbar-width:thin}
.c-dd-o{display:block;width:100%;height:48px;text-align:start;padding:0 16px;font-size:16px;line-height:22px}
.c-dd-o:hover{background:var(--bg-2)}
[data-app="capp"] .c-ov-time .mdl{overflow:visible}

/* filters sheet */
[data-app="capp"] .c-ov-filt .mdl{height:calc(100% - 12px)}
.c-filt{padding-top:6px}
.c-ov-filt:not(.c-ov-filtp) .c-shf:not(.c-shf-r){border-top:1px solid var(--line)}
.c-sorts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.c-sort{height:88px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:16px;line-height:22px;text-align:center;padding:6px}
.c-sort .i{width:20px;height:20px}
.c-sort.on{box-shadow:inset 0 0 0 2px var(--brand);background:var(--brand-soft);color:var(--brand)}
.c-maxp{display:flex;justify-content:space-between;align-items:center}
.c-maxp .c-h3{margin:0}
.c-range{-webkit-appearance:none;appearance:none;width:100%;margin:20px 0 4px;height:28px;background:transparent}
.c-range::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:var(--brand)}
.c-range::-moz-range-track{height:4px;border-radius:2px;background:var(--brand)}
.c-range::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23767676' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 8-4 4 4 4M15 8l4 4-4 4'/%3E%3C/svg%3E") center/16px no-repeat;box-shadow:0 0 0 1px var(--line-2),0 1px 3px rgba(0,0,0,.2);margin-top:-11px}
.c-range::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:var(--bg);border:1px solid var(--line-2)}
.c-only{display:flex;align-items:flex-start;gap:12px}
.c-only>.i{width:20px;height:20px;margin-top:6px}
.c-only>span{flex:1;display:flex;flex-direction:column}
.c-only b{font-weight:400;font-size:16px;line-height:22px}

/* search editor */
.c-sedit{padding-top:8px}
.c-fld{display:flex;align-items:center;gap:14px;width:100%;height:48px;padding:0 14px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line-2);margin-bottom:12px;font-size:14px;text-align:start}
.c-fld>span:first-of-type{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-fld .i{width:20px;height:20px;color:var(--ink-2)}
.c-ph{color:var(--ink)}
.c-fld-x{width:26px;height:26px;border-radius:50%;box-shadow:inset 0 0 0 1.6px var(--ink-2);display:grid;place-items:center}
.c-fld-x .i{width:14px;height:14px}
.c-topc{margin-top:30px;margin-bottom:16px}
.c-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px 13px;padding-bottom:20px}
.c-tile{height:76px;border-radius:12px;background:var(--bg-2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-size:13px;line-height:17px}
.c-tile .i{width:24px;height:24px}

/* treatment or venue */
.c-sty-top{padding-top:6px;padding-bottom:16px}
.c-stabs,.c-pfchips,.c-pchips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:0 20px 8px;flex:none}
.c-stabs::-webkit-scrollbar,.c-pchips::-webkit-scrollbar{display:none}
.c-stab{flex:none;display:inline-flex;align-items:center;height:36px;padding:0 14px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font-size:14px;white-space:nowrap}
.c-stab.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.c-stab.on .c-cnt-b{background:rgba(255,255,255,.18);color:var(--on-ink)}
.c-sty{padding:20px 20px 30px}
.c-sug{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:8px 0;text-align:start}
.c-sug-ic{width:40px;height:40px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.c-sug-ic .i{width:20px;height:20px}
.c-sug-th{width:40px;height:40px;border-radius:8px;overflow:hidden;flex:none;background:var(--bg-3)}
.c-sug-b{flex:1;min-width:0;display:flex;flex-direction:column}
.c-sug-t{font-size:16px;line-height:22px}
.c-sug-b .c-g{font-size:14px;line-height:20px}
.c-sug-d{flex:none;font-size:14px;line-height:20px}
.c-sug-h{font-size:18px;line-height:24px;margin:24px 0 4px}
.c-more{display:flex;align-items:center;min-height:48px;font-size:16px;line-height:22px}

/* date and time */
.c-sdate .c-h3{margin-top:4px}
.c-mc{margin:28px 0}
.c-mc-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.c-mc-h b{font-size:14px;font-weight:600}
.c-mc-h .i{width:20px;height:20px}
.c-mc-g{display:grid;grid-template-columns:repeat(7,1fr);row-gap:2px;text-align:center}
.c-mc-w{color:var(--ink-2);font-size:13px;height:36px;line-height:36px}
.c-mc-d{height:36px;width:36px;margin:0 auto;border-radius:50%;font-size:13px;font-weight:500}
.c-mc-d.past{color:var(--ink-3);font-weight:400}
.c-mc-d.today{box-shadow:inset 0 0 0 1.5px var(--ink)}
.c-mc-d.on{background:var(--brand);color:#fff;box-shadow:inset 0 0 0 2px var(--brand-soft-3)}

/* ================= VENUE ================= */
.c-pg-v .c-sc{padding-bottom:20px}
.c-vh{position:absolute;top:8px;inset-inline:8px;display:flex;align-items:center;z-index:20;pointer-events:none}
.c-vh .c-ib{pointer-events:auto}
.c-vsh{position:absolute;top:0;inset-inline:0;z-index:25;background:var(--bg);box-shadow:0 1px 0 var(--line);opacity:0;pointer-events:none;transition:opacity .12s}
.c-pg-v.c-solid .c-vsh{opacity:1;pointer-events:auto}
.c-pg-v.c-solid .c-vh{opacity:0}
.c-vtabs{display:flex;gap:24px;overflow-x:auto;scrollbar-width:none;padding:0 20px;height:44px}
.c-vtabs::-webkit-scrollbar{display:none}
.c-vtab{flex:none;font-size:14px;position:relative;color:var(--ink);white-space:nowrap}
.c-vtab.on::after{content:"";position:absolute;inset-inline:0;bottom:0;height:3px;background:var(--ink);border-radius:2px}
.c-hero{position:relative;height:320px;background:var(--bg-3)}
.c-hero-i{display:block;height:100%}
.c-hero-c{position:absolute;bottom:52px;inset-inline-end:20px;height:20px;padding:0 8px;border-radius:999px;background:rgba(0,0,0,.45);color:#fff;font-size:11px;line-height:17px;z-index:2}
.c-vb{position:relative;margin-top:-36px;background:var(--bg);border-radius:20px 20px 0 0;z-index:3}
.c-vi{padding:22px 20px 0}
.c-vi-n{font-size:28px;line-height:36px;font-weight:600}
.c-vi-n .c-vf{width:28px;height:28px;vertical-align:-4px}
.c-vi-t{font-size:16px;line-height:22px;margin-bottom:12px}
.c-vi-r{display:flex;align-items:center;gap:3px;font-size:16px;line-height:22px}
.c-vi-r b{font-weight:600}
.c-open{display:flex;align-items:center;gap:3px;font-size:16px;line-height:22px;margin-top:4px}
.c-open .i{width:16px;height:16px;color:var(--warn)}
.c-open b{font-weight:400;color:var(--warn)}
.c-open.ok .i,.c-open.ok b{color:var(--ok)}
.c-vi-ad{display:flex;align-items:center;gap:10px;width:100%;height:44px;margin-top:16px;padding:0 14px;border-radius:8px;background:var(--bg-2);font-size:14px}
.c-vi-ad .i{width:16px;height:16px}
.c-vs{padding:32px 20px}
.c-vs+.c-vs:not(.c-vs-g){border-top:1px solid var(--line);margin:0 20px;padding:32px 0}
.c-vs-g{background:var(--bg-2);border:0!important;margin:0!important;padding:32px 20px!important}
.c-vs-g+.c-vs{border-top:0!important}
.c-h2v{font-size:18px;line-height:24px;font-weight:600;margin-bottom:14px}
.c-h2r .c-h2v{margin-bottom:14px}
.c-h2r .c-seeall2{margin-bottom:14px}
.c-vs p{font-size:16px;line-height:22px}
.c-rmb{font-size:16px;line-height:22px}
.c-vchips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -20px 20px;padding:0 20px}
.c-vchips::-webkit-scrollbar{display:none}
.c-vchip{flex:none;height:36px;padding:0 15px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);background:var(--bg);font-size:14px;white-space:nowrap}
.c-vchip.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.c-vsvc{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}
.c-sc1{position:relative;display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;background:var(--bg)}
.c-sc1-b{flex:1;min-width:0;display:flex;flex-direction:column;pointer-events:none}
.c-sc1-n{font-weight:400;font-size:16px;line-height:22px}
.c-sc1-p{margin-top:12px;display:flex;flex-wrap:wrap;gap:0 10px;align-items:baseline}
.c-sc1-p b,.c-bs-p b,.c-save{white-space:nowrap}
.c-sc1-p b{font-weight:600}
.c-sc1 .c-btn{position:relative;z-index:1}
.c-save{color:var(--ok);font-weight:400}
.c-btn-w.c-btn-l{box-shadow:inset 0 0 0 1px var(--line-2)}
.c-mrow{display:flex;align-items:center;gap:12px;padding:6px 0 18px}
.c-mrow>span{flex:1;display:flex;flex-direction:column}
.c-mrow b{font-weight:400;font-size:16px;line-height:22px}
.c-tms{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;margin:0 -20px;padding:0 20px}
.c-tms::-webkit-scrollbar{display:none}
.c-tm{width:84px;flex:none;display:flex;flex-direction:column;align-items:center;text-align:center}
.c-tm-av{position:relative;height:84px;margin-bottom:6px}
.c-tm-r{position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:2px;height:22px;padding:0 6px;border-radius:999px;background:var(--bg);box-shadow:var(--sh-small);font-size:14px;font-weight:600;white-space:nowrap}
.c-tm-n{font-weight:400;font-size:16px;line-height:22px}
.c-tm .c-g{font-size:12px;line-height:16px;max-width:84px}
.c-rh{display:flex;align-items:center;justify-content:center;gap:16px;margin:8px 0}
.c-rh-n{font-size:72px;line-height:80px;font-weight:600}
.c-laur{display:inline-flex;color:var(--brand)}
.c-laur-s{position:relative;width:40px;height:56px;display:grid;place-items:center}
.c-laur-s>.i{width:30px;height:30px}
.c-laur-s i{position:absolute;color:#b46cff}
.c-laur-s i:nth-of-type(1){top:-2px;inset-inline-end:2px}
.c-laur-s i:nth-of-type(2){bottom:-2px;inset-inline-end:4px}
.c-laur-s i .c-star{width:14px!important;height:14px!important;color:#a24dff}
.c-rh-t{display:block;text-align:center;font-size:18px;line-height:24px;font-weight:600}
.c-rh-p{text-align:center;padding:0 24px}
.c-aitxt{margin-bottom:12px;font-size:16px;line-height:22px}
.c-ai{display:flex;align-items:center;gap:8px;color:var(--ink-2);font-size:14px!important;line-height:20px!important;margin-bottom:28px}
.c-ai-avs{display:inline-flex}
.c-ai-avs .c-av+.c-av{margin-inline-start:-5px}
.c-rv{display:flex;gap:12px;margin-bottom:24px;align-items:flex-start}
.c-rv-b{flex:1;min-width:0}
.c-rv-n{display:block;font-weight:400;font-size:16px;line-height:22px}
.c-rv-t{margin-top:10px;font-size:16px;line-height:22px}
.c-rv-m{font-size:14px!important;line-height:20px!important;margin-top:8px}
.c-rv-m .c-dot{margin:0 6px}
.c-reply{display:flex;gap:10px;background:var(--bg-2);border-radius:12px;padding:14px;margin-top:16px;color:var(--ink-2)}
.c-reply>.i{width:18px;height:18px;margin-top:4px}
.c-reply>div{flex:1;display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center}
.c-reply b{color:var(--ink);font-weight:400}
.c-reply .c-g{grid-column:2}
.c-reply p{grid-column:1/-1;color:var(--ink);margin-top:10px}
.c-reply .c-av{grid-row:1/3}
.c-pfg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.c-pft{position:relative;aspect-ratio:1;border-radius:8px;overflow:hidden;background:var(--bg-3)}
.c-pft-m{position:absolute;inset:0;background:rgba(0,0,0,.45);color:#fff;display:grid;place-items:center;font-size:17px;font-weight:600}
.c-hours{list-style:none;padding:0;margin:0}
.c-hours li{display:flex;align-items:center;gap:12px;height:32px;font-size:16px;line-height:22px}
.c-hours li i{width:10px;height:10px;border-radius:50%;background:var(--ok)}
.c-hours li span:first-of-type{flex:1}
.c-hours li.today{font-weight:600}
.c-hours li.off{color:var(--ink-2)}
.c-hours li.off i{background:var(--ink-3)}
.c-addl{list-style:none;padding:0;margin:0}
.c-addl li{display:flex;align-items:center;gap:10px;min-height:32px;font-size:16px;line-height:22px}
.c-addl li .i,.c-addl li .c-vf{width:18px;height:18px;margin:0}
.c-mapc{position:relative;height:165px;border-radius:12px;overflow:hidden;margin-bottom:16px}
.c-mapc .q-map{background:var(--c-map-land)}
.c-addr{font-size:14px}
.c-car-n{margin:0 -20px;padding:0 20px}
.c-ncar{width:190px;flex:none;display:flex;flex-direction:column}
.c-ncar-im{position:relative;height:128px;border-radius:8px;overflow:hidden;background:var(--bg-3);margin-bottom:8px}
.c-ncar-n{font-size:16px;line-height:22px;font-weight:600}
.c-ncar .c-badge{font-size:11px;height:26px}
.c-pg-v .c-bb{border-top:1px solid var(--line)}

/* gallery + photo viewer */
.c-gal{display:flex;flex-direction:column;gap:12px;padding:0 20px 24px}
.c-gal-i{display:block;height:208px;border-radius:8px;overflow:hidden;background:var(--bg-3)}
.c-pg-ph{background:#0d0d0d;color:#fff}
.c-ph-h{display:flex;align-items:center;gap:10px;height:64px;padding:0 8px 0 4px;padding-inline-start:20px;flex:none}
.c-ph-h h1{flex:1;font-size:16px;font-weight:600}
.c-ph-h .c-ib{color:#fff}
.c-ph-c{font-size:14px}
.c-ph-p{flex:1;align-items:center}
.c-ph-i{display:flex;align-items:center}
.c-ph-i img{height:auto;max-height:100%;object-fit:contain}
.c-pg-ph .c-ph-p{height:auto}
.c-ph-act{position:absolute;inset-inline-end:14px;top:62%;display:flex;flex-direction:column;gap:18px}
.c-ph-act button{display:flex;flex-direction:column;align-items:center;color:#fff;font-size:11px}
.c-pfchips{padding:0 0 28px;margin:0}
.c-pfm{display:flex;gap:16px;padding:0 20px 30px}
.c-pfm-i{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:16px}
.c-pfm-i .c-av64{width:80px;height:80px}
.c-pfm-av{position:relative}
.c-pfm-c{position:absolute;bottom:-2px;inset-inline-end:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:rgba(13,13,13,.6);color:#fff;font-size:10px;display:grid;place-items:center;box-shadow:0 0 0 2px var(--bg)}
.c-pfs{padding:0 20px 28px}
.c-pfs-g{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.c-pfs-i{aspect-ratio:1/1.2;border-radius:8px;overflow:hidden;background:var(--bg-3)}
.c-pfs-i.big{grid-column:1/-1;aspect-ratio:1/1.0}
.c-mtabs{display:flex;gap:24px;padding:0 20px;height:44px;box-shadow:inset 0 -1px 0 var(--line);flex:none}
.c-mtab{position:relative;font-size:16px;font-weight:600}
.c-mtab .c-g{font-weight:400;font-size:11px}
.c-mtabs+.c-sc .c-pfs:first-child{padding-top:40px}
.c-mtab.on::after{content:"";position:absolute;inset-inline:0;bottom:0;height:3px;background:var(--ink)}

/* reviews */
.c-rvh{background:var(--bg-2);padding:36px 20px 30px;margin-top:-64px;padding-top:80px}
.c-pg-rv .c-top-rv{background:var(--bg-2);transition:background .15s}
.c-pg-rv .c-top-rv .c-top-t{opacity:0}
.c-pg-rv .c-top-rv.c-on{background:var(--bg);box-shadow:0 1px 0 var(--line)}
.c-pg-rv .c-top-rv.c-on .c-top-t{opacity:1}
.c-pg-rv .c-rvh{margin-top:0;padding-top:4px}
.c-pg-rv.c-rv-s .c-rvh,.c-pg-rv.c-rv-s .c-aitxt,.c-pg-rv.c-rv-s .c-ai,.c-pg-rv.c-rv-s .c-hr{display:none}
.c-pg-rv.c-rv-s .c-top-rv.c-on{background:var(--bg-2);box-shadow:none}
.c-pg-rv.c-rv-s .c-pad{padding-top:14px}
.c-pg-rv .c-pad{padding-top:24px}
.c-rh-p{font-size:14px}
.c-rtool{display:flex;align-items:center;gap:8px;margin:4px 0 28px}
.c-rtool-s{gap:12px}
.c-sortb{gap:6px;padding:0 14px}
.c-sortb .i{width:16px;height:16px}
.c-radios{display:flex;flex-direction:column}
.c-rad{display:flex;align-items:center;gap:14px;height:40px;font-size:16px;text-align:start}
.c-rrow{display:flex;align-items:center;gap:12px;width:100%;height:36px;font-size:16px}
.c-bar{flex:1;height:4px;border-radius:2px;background:var(--line);position:relative;overflow:hidden}
.c-bar b{position:absolute;inset-block:0;inset-inline-start:0;background:var(--star);border-radius:2px}
.c-rrow-n{min-width:40px;text-align:end}
.c-histo{flex:1;display:flex;flex-direction:column;gap:2px}
.c-hrow{display:flex;align-items:center;gap:14px;font-size:13px;line-height:19px}
.c-hrow i{flex:1;height:5px;border-radius:3px;background:var(--line);position:relative;overflow:hidden}
.c-hrow i b{position:absolute;inset-block:0;inset-inline-start:0;background:var(--star);border-radius:3px}
.c-rsum{display:flex;gap:24px;align-items:center;margin-bottom:4px}
.c-rsum-l{display:flex;flex-direction:column;align-items:center;gap:2px}
.c-rsum-l>b{font-size:44px;line-height:52px;font-weight:600}
.c-rsum-l .c-star{width:20px!important;height:20px!important}
.c-rsum-l>span{font-size:13px}
.c-rfilt .c-h3{margin-top:4px}

/* professional profile (full-height sheet) */
.c-pg-pro{background:var(--bg);border-radius:28px 28px 0 0;overflow:hidden}
.c-pt0{position:absolute;top:0;inset-inline:0;z-index:20;display:flex;align-items:center;height:68px;padding:0 6px;background:transparent}
.c-pt0-m{display:none;align-items:center;gap:12px;font-size:16px;font-weight:600}
.c-pg-pro.c-solid .c-pt0{background:var(--bg)}
.c-pg-pro.c-solid .c-pt0>.c-ib:first-child{display:none}
.c-pg-pro.c-solid .c-pt0-m{display:flex;padding-inline-start:14px}
.c-pchips-fx{position:absolute;top:68px;inset-inline:0;z-index:20;background:var(--bg);padding-bottom:12px;opacity:0;pointer-events:none;box-shadow:0 1px 0 var(--line)}
.c-pg-pro.c-solid .c-pchips-fx{opacity:1;pointer-events:auto}
.c-ph0{background:var(--bg-2);display:flex;flex-direction:column;align-items:center;text-align:center;padding:109px 20px 32px}
.c-ph0 .c-av152{width:190px;height:190px;font-size:44px;margin-bottom:13px}
.c-ph0-n{font-size:24px;line-height:32px;font-weight:600}
.c-ph0-t{margin-top:12px;font-size:16px;line-height:22px;color:var(--ink-2)}
.c-ph0-r{display:flex;align-items:center;gap:4px;margin-top:4px;font-size:16px;line-height:22px}
.c-ph0>.c-g{font-size:16px;line-height:22px;margin-top:4px}
.c-ph0-r b{font-weight:600}
.c-pb .c-pchips{padding:24px 20px 24px}
.c-psec{padding-bottom:30px}
.c-stat{margin:0 0 20px}
.c-stat div{display:flex;justify-content:space-between;font-size:16px;line-height:22px}
.c-stat div+div{margin-top:4px}
.c-stat dd{margin:0;color:var(--ink-2)}
.c-langs{display:flex;gap:8px}
.c-langs span{height:30px;padding:0 14px;border-radius:999px;background:var(--bg-2);display:grid;place-items:center}
.c-psec-rev{padding-top:30px}
.c-bigr{display:flex;align-items:center;gap:6px;margin-bottom:14px}
.c-bigr b{font-size:22px;line-height:27px;font-weight:600}
.c-bigr .c-star{width:26px!important;height:26px!important}

/* ================= BOOKING ================= */
.c-pg-b{background:var(--bg-2)}
.c-ttool .c-cb{width:52px;border-radius:999px}
.c-pg-b .c-top{background:var(--bg-2)}
.c-pg-b .c-top-big.c-on{background:var(--bg)}
.c-pg-bt,.c-pg-bt .c-top{background:var(--cp-canvas)}
.c-bchips{display:flex;align-items:center;gap:8px;padding:16px 20px 0;margin-bottom:36px;background:var(--bg-2)}
.c-bchips .c-vchips{flex:1;margin:0;padding:0}
.c-pg-b.c-stick .c-bchips{position:sticky;top:0;z-index:5;background:var(--bg);padding-block:10px;box-shadow:0 1px 0 var(--line)}
.c-bchips-ic{background:var(--bg)}
.c-bg{padding:0 20px 20px}
.c-bg>.c-h3{font-size:18px;line-height:24px;margin-bottom:16px}
.c-bg-d{font-size:14px;line-height:20px;margin:-6px 0 14px}
.c-bs{position:relative;display:flex;flex-direction:column;padding:14px 16px 16px;border-radius:12px;background:var(--bg);margin-bottom:12px;box-shadow:inset 0 0 0 1px var(--line)}
.c-bs.on{box-shadow:inset 0 0 0 2px var(--brand)}
.c-bs>*{pointer-events:none}
.c-bs>.c-cover,.c-bs>.c-add{pointer-events:auto}
.c-bs-n{font-weight:400;font-size:16px;line-height:22px;padding-inline-end:4px}
.c-bs .c-g{line-height:20px}
.c-bs p.c-g{margin-top:6px;font-size:14px}
.c-bs-p{display:flex;flex-wrap:wrap;gap:0 8px;align-items:baseline;margin-top:10px;padding-inline-end:48px}
.c-bs-p b{font-weight:600;font-size:16px;line-height:22px}
.c-bs-p s{font-size:13px}
.c-save-b{display:block}
.c-add{position:absolute;bottom:14px;inset-inline-end:14px;width:32px;height:32px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;background:var(--bg);color:var(--ink)}
.c-add .i{width:18px;height:18px}
.c-add.on{background:var(--brand);color:#fff;box-shadow:none}
.c-me{display:flex;align-items:center;gap:14px;height:56px;padding:0 14px;border-radius:12px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);margin-bottom:24px}
.c-me-ic{width:40px;height:40px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center}
.c-me-ic .i{width:20px;height:20px}
.c-me b{font-weight:400}
.c-bpro{display:flex;align-items:center;gap:14px;margin-bottom:24px}
.c-bpro b{font-weight:400}
.c-catl{display:flex;flex-direction:column;padding:4px 20px 24px}
.c-catl button{height:48px;text-align:start;font-size:16px}
[data-app="capp"] .c-ov-cats .mdl{max-height:85%}
.c-ov-cats .c-shtop{height:44px}
/* service sheets */
[data-app="capp"] .c-ov-svc .mdl{height:calc(100% - 12px)}
.c-svsh{flex:1;min-height:0;overflow-y:auto;scrollbar-width:none}
.c-svs .c-pt{margin-bottom:6px}
.c-svr{display:flex;align-items:center;gap:3px;font-size:14px;margin-bottom:18px}
.c-svr b{font-weight:600}
.c-svs-d{margin-bottom:24px}
.c-svs .c-pt+.c-svs-d{margin-top:20px}
.c-inc{margin:16px 0 0}
.c-inc b{display:block;font-weight:400}
.c-opt-h{padding:20px 20px 14px;box-shadow:inset 0 1px 0 var(--line)}
.c-opt-h .c-h3{font-size:18px;line-height:24px}
.c-opt-h .c-h3{margin:0}
.c-opts{padding:0 20px}
.c-opt{display:flex;align-items:center;gap:12px;width:100%;padding:18px 0;border-bottom:1px solid var(--line);text-align:start}
.c-opt>span{flex:1;display:flex;flex-direction:column}
.c-opt b{font-weight:400;font-size:16px;line-height:22px}
.c-opt .c-opt-p{font-weight:600;margin-top:10px}
.c-opt .c-add{position:static}
/* select professional */
.c-bps{display:flex;flex-direction:column;gap:12px;padding-top:16px;padding-bottom:24px}
.c-ov-pros .c-bps{padding-top:0}
.c-bp{min-height:112px}
.c-bp{position:relative;display:flex;align-items:center;gap:14px;padding:14px;border-radius:12px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line)}
.c-bp.on{box-shadow:inset 0 0 0 2px var(--brand)}
.c-bp-any{width:76px;height:76px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.c-bp-av{position:relative;width:76px;height:88px;flex:none}
.c-bp-av .c-av64{width:76px;height:76px}
.c-bp-av .c-tm-r{bottom:0}
.c-bp-b{flex:1;min-width:0;display:flex;flex-direction:column;pointer-events:none}
.c-bp-b b{font-weight:400;font-size:16px;line-height:22px}
.c-vp{pointer-events:auto;text-align:start;margin-top:4px;font-size:14px;position:relative;z-index:1}
.c-bp .c-btn{position:relative;z-index:1}
.c-chkc{width:32px;height:32px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;flex:none}
.c-chkc .i{width:18px;height:18px}
.c-ov-pros .c-shb{padding-top:0}
.c-ov-pros .c-bigt{padding:0;margin-bottom:12px}
/* select date and time */
.c-ttool{display:flex;align-items:center;gap:8px;margin:16px 0 24px}
.c-pg-bt .c-pad>.c-h3{font-size:18px;line-height:24px;margin-bottom:12px}
.c-prochip{display:inline-flex;align-items:center;gap:8px;height:36px;font-size:13px!important;padding:0 12px 0 10px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);background:var(--bg);font-size:14px}
.c-prochip .i{width:16px;height:16px}
.c-prochip-ic{width:24px;height:24px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center}
.c-dts{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -20px 24px;padding:0 20px}
.c-dts::-webkit-scrollbar{display:none}
.c-dt{flex:none;width:64px;height:92px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:13px;line-height:17px}
.c-dt>span{font-size:14px;line-height:20px;white-space:nowrap}
.c-dt>span:last-child{font-size:12px;line-height:16px}
.c-dt b{font-size:24px;line-height:32px;font-weight:600}
.c-dt.none{color:var(--ink-3)}
.c-dt.on{background:var(--brand);color:#fff;box-shadow:none}
.c-times{display:flex;flex-direction:column;gap:12px}
.c-time{display:flex;align-items:center;justify-content:space-between;gap:12px}
.c-time .c-g{font-size:14px}
.c-time{height:40px;border-radius:8px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);text-align:start;padding:0 16px;font-size:16px;height:54px}
.c-time.on{box-shadow:inset 0 0 0 2px var(--brand)}
.c-wl{margin:20px 0 24px}
.c-nots{margin:8px 0}
.c-skel{display:flex;flex-direction:column;gap:22px;padding:20px}
.c-skel i,.c-skel b{display:block;background:var(--bg-3);border-radius:8px}
.c-skel-r{display:flex;justify-content:space-between}
.c-skel-d{display:flex;gap:8px;overflow:hidden}
.c-skel-d i{width:56px;height:72px;flex:none}
.c-skel b{height:48px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line)}
[data-app="capp"] .c-ov-cal .mdl{max-height:60%}
.c-ov-cal .c-mc{margin:10px 0 0}
[data-app="capp"] .c-ov-conf .mdl{height:calc(100% - 12px)}
[data-app="capp"] .c-ov-conf .c-shb{flex:none}

/* packages, memberships, gift (Fresha web views) */
.c-pkg{display:flex;flex-direction:column;background:var(--bg);border-radius:12px;padding:20px;box-shadow:inset 0 0 0 1px var(--line);margin-bottom:32px}
.c-pkg-n{font-size:18px;line-height:24px;font-weight:600;color:var(--blue);margin-bottom:12px}
.c-cap{font-size:12px;line-height:16px;letter-spacing:.5px;color:var(--ink-2);font-weight:500}
.c-pkg-i{display:flex;gap:8px;align-items:flex-start;font-size:14px;line-height:20px;margin-top:4px}
.c-pkg-i .i{width:16px;height:16px;margin-top:4px}
.c-pkg-f{display:flex;align-items:center;justify-content:space-between;margin-top:14px}
.c-pkg-f b{font-size:18px;line-height:24px;font-weight:600}
.c-try-h{margin-bottom:12px}
.c-try{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border-radius:12px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);margin-bottom:12px;text-align:start}
.c-try>span{flex:1;display:flex;flex-direction:column}
.c-try b{font-weight:400}
.c-try .i{width:20px;height:20px}
.c-pkgc{display:flex;flex-direction:column;color:#fff;background:var(--c-blue-g);border-radius:12px;padding:20px;margin:4px 0 40px;min-height:230px}
.c-pkgc>b{font-size:18px;line-height:24px;font-weight:600}
.c-pkgc>span{font-size:14px;line-height:20px}
.c-pkgc~.c-h3{font-size:22px;line-height:28px;margin-bottom:16px}
.c-pkgc-p{margin-top:auto;display:flex;flex-direction:column;align-items:flex-end;font-size:14px}
.c-pkgc-p b{font-size:28px;line-height:36px;font-weight:700}
.c-incc{display:flex;align-items:center;gap:14px;background:var(--bg);border-radius:12px;padding:16px;box-shadow:inset 0 0 0 1px var(--line);margin-bottom:28px}
.c-incc>span:nth-child(2){flex:1;display:flex;flex-direction:column}
.c-incc b{font-weight:400;font-size:16px;line-height:22px}
.c-incc-ic{background:var(--brand-soft)!important}
.c-incc-ic{width:40px;height:40px;border-radius:8px;background:var(--bg-2);color:var(--brand);display:grid;place-items:center;flex:none}
.c-incc .i{width:18px;height:18px}
.c-incc-d{align-items:flex-start}
.c-pg-web .c-sc{background:var(--bg)}
.c-web{padding-bottom:30px}
.c-step{font-size:13px;color:var(--ink-2)}
.c-wt{font-size:32px;line-height:40px;font-weight:700;margin:2px 0 24px}
.c-wt2{font-size:22px;line-height:28px;font-weight:700;margin:40px 0 20px}
.c-wp{font-size:16px;line-height:22px}
.c-wl2{display:block;margin-top:16px;font-size:16px}
.c-step{font-size:14px!important;line-height:21px}
.c-wopt{display:flex;align-items:center;width:100%;min-height:64px;padding:0 20px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line);margin-bottom:14px;font-size:18px;line-height:25px;text-align:start}
.c-wopt2{flex-direction:column;align-items:flex-start;justify-content:center;min-height:84px;gap:4px;padding:0 24px}
.c-wopt2 b{font-weight:600;font-size:16px;line-height:22px}
.c-wopt2 span{font-size:16px;line-height:22px}
.c-pg-web>.c-top{height:56px}
.c-wrow{display:block;width:100%;height:44px;padding:0 14px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line);margin-bottom:12px;text-align:start;font-weight:600;font-size:16px;height:56px;padding:0 16px}
.c-mcard{display:flex;flex-direction:column;align-items:flex-start;width:100%;min-height:243px;text-align:start;color:#fff;background:var(--c-blue-g);border-radius:4px;padding:28px 24px;gap:12px;margin-bottom:24px;font-size:16px;line-height:22px}
.c-mcard-k{display:flex;align-items:center;gap:6px;font-size:14px}
.c-mcard-k .i{width:18px;height:18px}
.c-mcard-n{font-size:22px;line-height:28px;font-weight:600}
.c-mcard-r{display:flex;justify-content:space-between;gap:16px;width:100%;margin-top:14px}
.c-mcard-r b{font-weight:600;flex:none}
.c-mrev{display:flex;flex-direction:column;align-items:center;text-align:center;color:#fff;background:var(--c-blue-g);border-radius:4px;padding:32px 24px;gap:4px;margin-bottom:40px;font-size:16px;line-height:22px}
.c-mrev{margin-inline:18px}
.c-mrev-n{font-size:22px;line-height:28px;font-weight:600}
.c-mrev-p,.c-mrev-u{font-size:28px;line-height:36px;font-weight:700}
.c-mrev>i{width:100%;height:1px;background:rgba(255,255,255,.35);margin:14px 0}
.c-mrev-s{display:flex;align-items:center;gap:6px;font-size:16px}
.c-mrev-s .i{width:18px;height:18px}
.c-bb-web{border-top:1px solid var(--line)}
.c-bb-web .c-bb-l{flex-direction:column}
/* home gift card */
.c-pg-gi{background:linear-gradient(180deg,#0d0d0d 0%,#0d0d0d 55%,#2a1f4e 100%);color:#fff}
.c-pg-gi .c-top{background:transparent}
.c-top-dk .c-ib{color:#fff}
.c-gi{padding:0 20px 20px}
.c-gi h1{font-size:28px;line-height:36px;font-weight:600;margin-bottom:16px}
.c-gi ul{list-style:none;margin:0 0 40px;padding:0}
.c-gi li{display:flex;gap:10px;font-size:16px;line-height:22px;margin-bottom:12px}
.c-gi li .i{width:20px;height:20px;margin-top:4px}
.c-gi li .c-vf{color:#fff;width:20px;height:20px;margin:0 2px}
.c-gcard{position:relative;height:230px;border-radius:16px;overflow:hidden;color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:20px}
.c-gcard-big{height:230px}
.c-gcard-art{position:absolute;inset:0}
.c-gcard-art svg{width:100%;height:100%}
.c-gcard-l{position:relative;font-size:16px;font-weight:800}
.c-gcard-v{position:absolute;top:18px;inset-inline-end:18px}
.c-gcard-v .i{width:22px;height:22px}
.c-gcard-t{position:relative;font-size:17px;font-weight:600}
.c-gcard-c{position:absolute;bottom:22px;inset-inline-end:20px;color:var(--ink)}
.c-ths{padding:0 20px 18px}
.c-thr{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;margin:0 -20px;padding:0 20px}
.c-thr::-webkit-scrollbar{display:none}
.c-th{flex:none;width:156px;height:98px;border-radius:8px;overflow:hidden;box-shadow:inset 0 0 0 1px var(--line);display:block}
.c-th svg,.c-thg{display:block;width:100%;height:100%}
.c-th.on{box-shadow:inset 0 0 0 2px var(--brand)}
.c-gal-l{font-size:14px;font-weight:600;margin-top:24px}
.c-gamt{font-size:40px;line-height:48px;font-weight:700;margin:8px 0 16px}
.c-gamts{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-bottom:20px}
.c-gamt-o{height:80px;border-radius:6px;box-shadow:inset 0 0 0 1px var(--line);font-size:18px;font-weight:600;display:grid;place-items:center}
.c-gamt-o.on{box-shadow:inset 0 0 0 2px var(--brand)}
.c-gamt-o .i{width:20px;height:20px}

/* ================= LOGGED-IN ACCOUNT (capture/phone c-profile-*, c-wallet*, c-settings-*, c-activity-*, font 1.0 = sizes 1:1 in dp) ================= */
[data-app="capp"]{--c-wal-g:#14231d;--c-foot-bg:#14231d}   /* restyle v3 palette: wallet card = Accord night card */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) [data-app="capp"]{--c-wal-g:radial-gradient(140% 170% at 100% 0%,#b84bb6 0%,#8a4bc0 22%,#5246c4 45%,#4b45c2 60%);--c-foot-bg:#000}}
:root[data-theme="dark"] [data-app="capp"]{--c-wal-g:radial-gradient(140% 170% at 100% 0%,#b84bb6 0%,#8a4bc0 22%,#5246c4 45%,#4b45c2 60%);--c-foot-bg:#000}
.c-av120{width:120px;height:120px;font-size:30px}
.c-btn-ow{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.95);padding:0 16px}
.c-btn-red{color:var(--bad)}
.c-h2a{font-size:22px;line-height:28px;font-weight:600;margin:40px 0 16px}
.c-h3a{font-size:18px;line-height:24px;font-weight:600;margin:40px 0 16px}
.c-acc-p{font-size:14px;line-height:20px;margin-bottom:24px}
.c-empty2{padding:40px 24px}
.c-empty2 .c-eart{width:48px;height:48px;margin-bottom:16px}
.c-empty2 p{max-width:330px}
/* profile tab */
.c-pg-prof .c-sc{background:var(--cp-prof)}
.c-prof{padding:12px 20px 32px}
.c-prof-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:24px}
.c-prof-t{min-width:0}
.c-prof-t h1{font-size:28px;line-height:36px;font-weight:600}
.c-prof-t p{margin-top:4px}
.c-prof-av{border-radius:50%;flex:none}
.c-wcard{display:flex;flex-direction:column;align-items:flex-start;min-height:158px;padding:24px;border-radius:16px;background:var(--c-wal-g);color:#fff;box-shadow:var(--sh-card);margin-bottom:24px}
.c-wcard>b{font-size:28px;line-height:36px;font-weight:700;margin:2px 0 14px}
.c-pcard{background:var(--bg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);margin-bottom:16px}
.c-pconf{display:flex;flex-direction:column;align-items:flex-start;padding:16px}
.c-pconf b{font-size:18px;line-height:24px;font-weight:600}
.c-pconf .c-btn{margin-top:8px}
.c-plist{padding:12px 20px}
.c-prow{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;text-align:start;font-size:16px;line-height:22px;color:var(--ink)}
.c-prow>span{flex:1;min-width:0}
.c-prow .i{width:24px;height:24px;flex:none}
/* wallet */
.c-pg-wal .c-top-tr{position:absolute;top:0;inset-inline:0;background:transparent;z-index:20}
.c-pg-wal .c-top-tr .c-ib{color:#fff}
.c-wh{display:flex;flex-direction:column;align-items:flex-start;padding:64px 20px 11px;min-height:208px;background:var(--c-wal-g);color:#fff}
.c-wh-b{font-size:40px;line-height:44px;font-weight:700}
.c-wh>span{font-size:14px;line-height:20px;margin-top:4px}
.c-wh-add{margin-top:17px;gap:8px}
.c-wh-add .i{width:20px!important;height:20px!important}
.c-wgift{display:flex;gap:12px;margin-top:24px;padding:20px;border-radius:12px;background:var(--bg-4);box-shadow:inset 0 0 0 1px var(--line)}
.c-wgift-t{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.c-wgift-t b{font-size:22px;line-height:28px;font-weight:600}
.c-wgift-t p{font-size:14px;line-height:20px;margin:4px 0 13px}
.c-wgift-art{width:56px;height:56px;flex:none;margin-top:4px}
.c-wcards{margin-bottom:24px}
.c-addcard{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;font-size:16px;line-height:22px;text-align:start}
.c-addcard-ic{width:56px;height:56px;border-radius:12px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.c-addcard-ic .i{width:28px!important;height:28px!important}
.c-acc-in{margin-bottom:32px}
/* my profile */
.c-mpc{position:relative;display:flex;flex-direction:column;align-items:center;padding:60px 24px 24px;border-radius:12px;background:var(--bg);box-shadow:var(--sh-card)}
.c-mpc-ed{position:absolute;top:10px;inset-inline-end:12px;display:grid;place-items:center;min-width:48px;height:48px;font-size:14px}
.c-mpc-av{position:relative;display:block}
.c-mpc-pen{position:absolute;bottom:-8px;inset-inline-end:-8px;width:48px;height:48px;display:grid;place-items:center}
.c-mpc-pen::before{content:"";position:absolute;inset:9px;border-radius:50%;background:var(--bg-3);box-shadow:0 0 0 1px var(--bg)}
.c-mpc-pen .i{position:relative;width:16px!important;height:16px!important}
.c-mpc-n{font-size:28px;line-height:36px;font-weight:600;text-align:center;margin-top:16px}
.c-mpc-hr{display:block;align-self:stretch;height:1px;background:var(--line);margin:40px 0 32px}
.c-mpc-f{align-self:stretch;margin:0;display:flex;flex-direction:column;gap:16px}
.c-mpc-f dt{font-size:14px;line-height:20px}
.c-mpc-f dd{margin:0;font-size:14px;line-height:20px;color:var(--ink-2);overflow-wrap:anywhere}
.c-adr{display:flex;align-items:center;gap:8px;width:100%;min-height:73px;padding:12px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);margin-bottom:16px;text-align:start}
.c-adr-ic{width:48px;height:48px;border-radius:50%;background:var(--bg-3);color:var(--ink-2);display:grid;place-items:center;flex:none}
.c-adr-ic .i{width:20px!important;height:20px!important}
.c-adr-b{display:flex;flex-direction:column}
.c-adr-b b{font-size:16px;line-height:22px;font-weight:400}
.c-adr-add{gap:8px;padding:0 16px;margin-bottom:24px}
.c-adr-add .i{width:20px!important;height:20px!important}
/* edit profile + popup menus */
.c-pg-ep{position:relative}
.c-epf{padding-bottom:24px}
.c-pg-myp .c-sc>.c-pad{padding-top:16px}
.c-lbl2{display:block;font-size:14px;line-height:20px;font-weight:600;margin:16px 0 4px}
.c-epf>.c-lbl2:first-child,.c-acc>.c-lbl2:first-of-type{margin-top:0}
.c-fro{display:flex;align-items:center;justify-content:space-between;gap:8px}
.c-fro .c-link{font-size:16px;flex:none;min-height:44px}
.c-dob{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.c-fsel{display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:start;color:var(--ink)}
.c-fsel.ph{color:var(--ink-2)}
.c-fsel .i{width:18px!important;height:18px!important;color:var(--ink);flex:none}
.c-fsel[aria-expanded="true"]{box-shadow:inset 0 0 0 1.5px var(--brand)}
.c-pop-ov{position:absolute;inset:0;z-index:40}
.c-pop{position:absolute;z-index:41;overflow-y:auto;padding:8px 0;border-radius:4px;background:var(--bg);box-shadow:var(--sh-pop);scrollbar-width:thin}
.c-pop-o{display:block;width:100%;min-height:48px;padding:0 12px;text-align:start;font-size:14px;line-height:20px;color:var(--ink)}
.c-pop-o:hover,.c-pop-o:focus-visible{background:var(--bg-2);outline:0}
.c-pop-o[aria-selected="true"]{background:var(--bg-3)}
/* favourites, forms, settings */
.c-pg-favs .c-empty2,.c-pg-forms .c-empty2{justify-content:flex-start;padding-top:295px}
.c-pg-forms .c-empty2{padding-top:306px}
.c-pg-forms .c-empty2 .c-eart{width:57px;height:57px}
.c-pg-forms .c-empty2 b{font-size:22px;line-height:26px;margin-bottom:6px}
.c-sets .c-prow{min-height:56px}
.c-delacc{display:flex;justify-content:center;margin-top:66px}
.c-ver{text-align:center;color:var(--ink-2);font-size:14px;line-height:20px;margin:22px 0 24px}
.c-ncard{padding:20px;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);margin-top:32px}
.c-acc-p+.c-ncard{margin-top:0}
.c-ncard-t{display:block;font-size:18px;line-height:24px;font-weight:600}
.c-ncard>p{font-size:14px;line-height:20px}
.c-nbiz{display:flex;align-items:center;gap:12px;width:100%;min-height:94px;text-align:start}
.c-ncard>p+.c-nbiz{margin-top:4px}
.c-nbiz>.i{width:20px!important;height:20px!important;color:var(--ink-2);flex:none}
.c-nbiz-ph{width:48px;height:48px;border-radius:8px;overflow:hidden;flex:none;background:var(--bg-3)}
.c-nbiz-b{flex:1;min-width:0;display:flex;flex-direction:column}
.c-nbiz-b b{font-size:16px;line-height:22px;font-weight:400}
.c-nbizc{display:flex;align-items:center;gap:12px}
.c-ntg{display:flex;align-items:center;gap:12px;min-height:36px;font-size:16px;line-height:22px}
.c-ncard>p+.c-ntg{margin-top:20px}
.c-ntg>span{flex:1}
.c-ntg>.i{width:24px!important;height:24px!important}
[data-app="capp"] .tg.c-tg{width:44px;height:24px}
[data-app="capp"] .tg.c-tg i{top:2px;inset-inline-start:2px;width:20px;height:20px}
[data-app="capp"] .tg.c-tg[aria-checked="true"] i{inset-inline-start:22px}
.c-ntab{margin-top:32px}
.c-ntab-h,.c-ntab-r{display:grid;grid-template-columns:1fr 64px 64px 64px;align-items:center}
.c-ntab-h{font-size:12px;line-height:16px;font-weight:600;text-align:center;padding-bottom:12px;border-bottom:1px solid var(--line)}
.c-ntab-r{padding:16px 0;border-bottom:1px solid var(--line)}
.c-ntab-r:last-child{border-bottom:0}
.c-ntab-r>span[role="cell"]{display:grid;place-items:center}
.c-ntab-l{display:flex;flex-direction:column;padding-inline-end:12px}
.c-ntab-l b{font-size:16px;line-height:22px;font-weight:400}
.c-cbx{width:48px;height:48px;display:grid;place-items:center}
.c-cbx i{width:24px;height:24px;border-radius:4px;box-shadow:inset 0 0 0 1px var(--line-2);display:grid;place-items:center;color:transparent}
.c-cbx i .i{width:16px!important;height:16px!important}
.c-cbx[aria-checked="true"] i{background:var(--brand);box-shadow:none;color:#fff}
.c-soc{display:flex;align-items:center;gap:12px}
.c-soc-ic{width:48px;height:48px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;flex:none}
.c-soc-ic .c-glogo{width:24px!important;height:24px!important}
.c-soc-b{flex:1;display:flex;flex-direction:column}
.c-soc-b b{font-size:16px;line-height:22px;font-weight:400}
.c-bb-0{border-top:0}
.c-pw{display:flex;align-items:center;padding-inline-end:0}
.c-pw input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;font-size:16px;color:var(--ink)}
.c-pw:focus-within{box-shadow:inset 0 0 0 1.5px var(--brand)}
.c-pw-eye{width:48px;height:48px;display:grid;place-items:center;flex:none;color:var(--ink)}
.c-pw-eye .i{width:24px!important;height:24px!important}
.c-pw-sub{margin:24px 0}
/* support (help-centre web view) */
.c-pg-hc .c-sc{background:var(--bg)}
.c-hc-h{display:flex;align-items:center;gap:6px;height:64px;padding:0 20px;padding-inline-end:6px}
.c-hc-logo{font-size:22px;line-height:1;height:auto}
.c-hc-blob{width:22px;height:14px;border-radius:50%;background:linear-gradient(90deg,#6950f3,#b46cff);transform:rotate(-20deg)}
.c-hc-t{font-size:18px;line-height:24px}
.c-hc-b{padding-top:36px;padding-bottom:520px}
.c-hc-bc{display:flex;align-items:center;flex-wrap:wrap;font-size:14px;line-height:20px}
.c-hc-ti{font-size:28px;line-height:36px;font-weight:600;margin:12px 0 36px}
.c-hc-l{display:block;font-size:14px;line-height:20px;font-weight:600;margin-bottom:8px}
.c-hc-sel{position:relative}
.c-hc-sel select{width:100%;height:48px;appearance:none;-webkit-appearance:none;border:0;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:14px;padding:0 16px;padding-inline-end:44px}
.c-hc-sel select:invalid{color:var(--ink-3)}
.c-hc-sel select:focus{outline:0;box-shadow:inset 0 0 0 1.5px var(--brand)}
.c-hc-sel>.i{position:absolute;top:15px;inset-inline-end:16px;width:18px!important;height:18px!important;pointer-events:none}
.c-hcf{display:flex;flex-direction:column;align-items:flex-start;padding:48px 28px 40px;background:var(--c-foot-bg);color:#fff}
.c-hcf-logo{color:#fff;font-size:36px;height:auto}
.c-hcf-app{background:#fff;color:#0d0d0d;margin:20px 0 52px;height:44px;padding:0 20px;font-size:16px;font-weight:600;gap:8px}
.c-hcf-c{display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:56px}
.c-hcf-c b{font-size:16px;line-height:22px;font-weight:600}
.c-hcf-c a{font-size:14px;line-height:20px;color:#fff}
.c-hcf-s a{display:flex;align-items:center;gap:12px}
.c-hcf-s .i{width:16px!important;height:16px!important}
/* activity, logged in */
.c-pg-act .c-sc{display:flex;flex-direction:column}
.c-act2{flex:1;display:flex;flex-direction:column;padding-top:64px}
.c-act2-h{display:flex;align-items:center;justify-content:space-between;padding:0 20px;height:36px;margin-bottom:16px}
.c-pt2{font-size:28px;line-height:36px;font-weight:600}
.c-act2-s{width:52px;height:36px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2);display:grid;place-items:center;color:var(--ink);position:relative}
.c-act2-s::after{content:"";position:absolute;inset:-6px 0}
.c-act2-s .i{width:22px!important;height:22px!important}
.c-achips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:0 20px;flex:none}
.c-achips::-webkit-scrollbar{display:none}
.c-achip{padding:0 16px}
.c-achip .c-cnt-b{min-width:20px;height:20px;border-radius:50%;padding:0;font-size:12px;margin-inline-start:8px}
.c-act2 .c-h2a{margin:48px 0 20px}
.c-arow{position:relative;display:flex;align-items:center;gap:12px;min-height:64px;margin-bottom:24px}
.c-arow-ph{width:64px;height:64px;border-radius:8px;overflow:hidden;flex:none;background:var(--bg-3);pointer-events:none}
.c-arow-b{flex:1;min-width:0;display:flex;flex-direction:column;pointer-events:none}
.c-arow-b b{font-size:16px;line-height:20px;font-weight:600;margin-bottom:2px}
.c-arow .c-btn{position:relative;z-index:1}
.c-act2>.c-empty2{flex:1;justify-content:flex-start;padding-top:278px}
.c-top-as{gap:4px}
.c-as-in{flex:1;min-width:0;height:48px;border:0;outline:0;background:none;font-size:14px;color:var(--ink)}
.c-as-in::placeholder{color:var(--ink-3)}
.c-asm{display:flex;flex-direction:column;align-items:center;text-align:center;padding:138px 24px 40px}
.c-asm .c-eart{width:48px;height:48px;margin-bottom:16px}
.c-asm b{font-size:18px;line-height:24px;font-weight:600}
.c-as-l{padding-top:16px}
/* appointment details */
.c-pg-appt .c-sc{background:var(--bg-2)}
.c-adtop{position:absolute;top:14px;inset-inline-start:20px;z-index:20;transition:opacity .12s}
.c-ib-g{width:36px;height:36px;background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.c-ib-g .i{width:22px!important;height:22px!important}
.c-adbar{position:absolute;top:0;inset-inline:0;z-index:25;box-shadow:0 1px 0 var(--line);opacity:0;pointer-events:none;transition:opacity .12s}
.c-pg-appt.c-solid .c-adbar{opacity:1;pointer-events:auto}
.c-pg-appt.c-solid .c-adtop{opacity:0;pointer-events:none}
.c-adh{position:relative;height:275px;background:var(--bg-3);overflow:hidden}
.c-adh img{position:absolute;inset:0}
.c-adh::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.05) 50%,rgba(0,0,0,.38) 100%)}
.c-adh h1{position:absolute;z-index:1;inset-inline:20px;bottom:20px;color:#fff;font-size:40px;line-height:44px;font-weight:700;overflow-wrap:anywhere}
.c-adb{padding:32px 20px 40px}
.c-ast{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px;border-radius:999px;font-size:14px;line-height:20px;font-weight:500;color:#fff;background:var(--ink-2)}
.c-ast .i{width:20px!important;height:20px!important}
.c-ast-bad{background:var(--bad);color:var(--on-ink)}
.c-ast-ok{background:var(--ok);color:var(--on-ink)}
.c-ad-when{font-size:28px;line-height:36px;font-weight:700;margin-top:16px}
.c-ad-dur{font-size:16px;line-height:22px;margin-top:4px}
.c-acard{background:var(--bg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);padding:20px}
.c-aacts{padding:8px;margin-top:32px}
.c-aact{display:flex;align-items:center;gap:8px;width:100%;height:56px;padding-inline-start:8px;padding-inline-end:12px;text-align:start;font-size:16px;line-height:22px;color:var(--ink)}
.c-aact>span:nth-child(2){flex:1}
.c-aact-ic{width:48px;height:48px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.c-aact-ic .i{width:22px!important;height:22px!important}
.c-aact>.i{width:20px!important;height:20px!important;color:var(--ink-3)}
.c-aov-r{display:flex;justify-content:space-between;gap:12px;font-size:16px;line-height:22px}
.c-aov-r>span:first-child{display:flex;flex-direction:column;min-width:0}
.c-aov-r .c-g{font-size:14px;line-height:20px;margin-top:2px}
.c-aov-r+.c-aov-r{margin-top:16px}
.c-aov-hr{display:block;height:1px;background:var(--line);margin:20px 0}
.c-aov-t b{font-weight:600}
.c-acard-t{display:block;font-size:16px;line-height:22px;font-weight:600;margin-bottom:4px}
.c-acard p{font-size:16px;line-height:22px}
.c-amap{padding:0 0 24px;overflow:hidden}
.c-amap-m{position:relative;height:209px}
.c-amap-m .q-map{background:var(--c-map-land)}
.c-amap p{padding:16px 20px 0}
.c-aref{text-align:center;color:var(--ink-2);font-size:14px;line-height:20px;margin-top:40px}
/* conversation actions / messages menu sheets */
.c-msgs-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.c-msgs-h .c-pt{margin:0}
.c-msgs-h .c-ib{margin-inline-end:-12px}
.c-top-chat>.c-ib:last-child{margin-inline-start:auto}
.c-shd-a{padding:20px 8px 8px;padding-inline-start:20px}
.c-shd-x{justify-content:flex-end}
.c-arows{padding:0 0 22px}
.c-arw{display:flex;align-items:center;gap:12px;width:100%;height:48px;padding:0 20px;font-size:16px;line-height:22px;text-align:start;color:var(--ink)}
.c-arw:hover{background:var(--bg-2)}
.c-arw .i{width:24px!important;height:24px!important}
/* first visit (booking, logged in) */
.c-fv{display:flex;flex-direction:column;gap:12px;padding-top:16px}
.c-fvo{display:flex;flex-direction:column;align-items:flex-start;min-height:74px;padding:16px;border-radius:12px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);text-align:start}
.c-fvo b{font-size:16px;line-height:22px;font-weight:400}
.c-fvo.on{box-shadow:inset 0 0 0 2px var(--brand)}
/* heart on search / favourite cards (logged in, c-tab-search-map@1x) */
.c-vr{position:relative}
.c-vr-fav{position:absolute;z-index:3;top:0;inset-inline-end:0;width:48px;height:48px;display:grid;place-items:center;color:#fff}
.c-vr-fav .i{width:24px!important;height:24px!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.45))}
.c-vr-fav.on{color:var(--bad)}

/* 1x corrections 1405-07-23: search «Anytime» pill, venue rating line, recents, location addresses, pros filter sheet */
.c-tpill{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px 0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2);font-size:14px;color:var(--ink);white-space:nowrap}
.c-tpill .i{width:18px!important;height:18px!important}
.c-tpill.on{box-shadow:inset 0 0 0 2px var(--brand);color:var(--brand)}
.c-rs-ic{align-items:center}
.c-vi-ro{display:flex;align-items:center;flex-wrap:wrap}
.c-vi-ro .c-open{margin-top:0}
.c-vi-ro>.c-dot{margin:0 6px;color:var(--ink-2)}
.c-vi-r .c-link{font-weight:400}
[data-app="capp"] .c-ov-filtp .mdl{height:auto}
.c-fld{font-size:16px}
.c-fld>span:first-of-type{line-height:22px}
.c-topc.c-h2r{margin-top:32px;margin-bottom:4px}
.c-topc .c-h3a{margin:0}
.c-rclr{font-size:14px;min-height:36px}
.c-rec{display:flex;align-items:center;gap:8px;width:calc(100% + 40px);min-height:64px;margin:0 -20px;padding:0 16px;text-align:start}
.c-rec:hover{background:var(--bg-2)}
.c-rec-ic{width:48px;height:48px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.c-rec-ic .i{width:22px!important;height:22px!important}
.c-rec-th{width:40px;height:40px;border-radius:8px;overflow:hidden;flex:none;margin:0 4px 0 4px;background:var(--bg-3)}
.c-rec-b{display:flex;flex-direction:column;min-width:0;font-size:16px;line-height:22px}
.c-rec-b .c-g{font-size:14px;line-height:20px}
.c-locah{margin:12px 0 0;min-height:40px}
.c-locah .c-h3a{margin:0}
.c-locah .c-link{font-size:16px}
.c-curloc-g{background:var(--bg-3);color:var(--ink-2)}
.c-pg-loc .c-curloc{height:60px;font-size:16px}

/* «Select an option» (c-booking-select-option@1x) + venue gift steps 3-4 (c-venue-buy-gift-style@1x, -step4@1x, c-gift-dd-send-date) */
.c-opts2{display:flex;flex-direction:column;gap:12px;padding-top:16px;padding-bottom:24px}
.c-opts2 .c-h3a{margin:28px 0 4px}
.c-opt2{display:flex;align-items:center;gap:12px;min-height:74px;padding:16px;border-radius:12px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);text-align:start}
.c-opt2>span{flex:1;display:flex;flex-direction:column}
.c-opt2 b{font-size:16px;line-height:22px;font-weight:400}
.c-opt2>.i{width:24px!important;height:24px!important;flex:none}
.c-pg-vg .c-step{font-size:14px;line-height:21px}
.c-pg-vg .c-wt{margin-bottom:20px}
.c-vgs{margin-bottom:12px}
.c-vgs-h{font-size:20px;line-height:29px;font-weight:600;margin:0 0 14px}
.c-vgs .c-thr{gap:12px}
.c-vgs .c-th{width:149px;height:97px}
.c-th-none{display:grid!important;place-items:center;background:var(--bg-3);font-size:16px;color:var(--ink)}
.c-vgform{padding-bottom:24px}
.c-vgform .c-lbl2:first-child{margin-top:0}
.c-vgform .c-lbl2{margin-top:24px;margin-bottom:3px}
.c-vgf,.c-vgform .c-fsel{border-radius:8px}
.c-vgform .c-help{margin:4px 0 0}
.c-vgmh{display:flex;align-items:flex-end;justify-content:space-between;margin-top:24px}
.c-vgmh .c-lbl2{margin:0 0 3px}
.c-vgmh .c-g{font-size:12px;line-height:17px}
.c-vgta{height:83px;padding:12px 16px;resize:none;line-height:22px;border-radius:8px}
.c-vgcal{left:0;right:0;width:auto;top:auto!important;bottom:0;max-height:none!important;padding:12px 20px 16px;border-radius:0;box-shadow:0 -1px 0 var(--line),var(--sh-pop)}
.c-vgcal .c-mc{margin:0}
/* 48dp touch targets for the 36px pills and chips (as Fresha: 36 visible inside a 48 clickable, Android guidance) */
:where(.c-btn-xs,.c-stab,.c-vchip,.c-tpill,.c-cb){position:relative}
.c-btn-xs::after,.c-stab::after,.c-vchip::after,.c-tpill::after,.c-cb::after{content:"";position:absolute;inset:-6px 0}

/* gap pass 1405-07-24 (each against capture/phone, see shots/capp-1x-1405-07-23/cmp) */
.c-pg-bt .c-bigt+.c-pad{padding-top:16px}
.c-pg-bt .c-ttool{margin:0 0 24px}
.c-time{border-radius:12px}
.c-time .c-g{color:var(--ink)}
.c-dt>span{color:var(--ink-2)}
.c-dt.on>span{color:#fff}
.c-dt.none>span{color:var(--ink-3)}
.c-ov-pros .c-shtop{height:70px;padding-top:12px}
.c-ov-pros .c-bigt{margin-bottom:28px}
.c-bs{padding:16px 16px 20px}
.c-bs p.c-g{margin-top:4px}
.c-bs-p{margin-top:22px}
.c-add{width:36px;height:36px;bottom:16px;inset-inline-end:16px;box-shadow:var(--sh-small)}
.c-add.on{box-shadow:none}
.c-bchips-ic{box-shadow:var(--sh-small)}
.c-rs{top:280px}
.c-arows{padding:4px 0 8px}
.c-vgcal .c-mc-d{font-size:14px;font-weight:400}
.c-vgcal .c-mc-d.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.c-vgcal .c-mc-w{color:var(--ink);font-size:14px}
.c-vgcal .c-mc-h b{font-size:18px;font-weight:400}
[data-app="capp"] .c-ov-conf .mdl{height:100%}
.c-ov-conf .c-shf{padding-bottom:10px}
.c-bigt p{font-size:14px;line-height:20px;margin-top:16px}
.c-ths{padding-bottom:28px}
.c-ths .c-h3{font-size:18px;line-height:24px;margin-bottom:16px}
.c-th{position:relative}
.c-th::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--line);pointer-events:none}
.c-th.on::after{box-shadow:inset 0 0 0 2px var(--brand),inset 0 0 0 4px var(--bg)}
.c-gamtp{padding-top:20px}
.c-gamt-o .i{width:24px!important;height:24px!important}
.c-gcard-l{font-size:22px;line-height:28px;font-weight:800}
.c-gcard-t{font-size:28px;line-height:36px;font-weight:600}
.c-gi ul{margin-bottom:80px}
.c-pg-loc .c-curloc:first-of-type{margin-top:14px}
.c-curloc-ic{width:36px;height:36px}
.c-curloc-ic .i{width:20px!important;height:20px!important}
.c-rsum-l>b{font-size:56px;line-height:64px}
.c-rsum-l>span{font-size:14px;color:var(--ink)}
.c-rtool .c-cb{width:52px;border-radius:999px}
.c-ph0-t{color:var(--ink)}
.c-langs span{height:36px;padding:0 16px}
.c-prof-h{margin-bottom:17px}
.c-pop-o[aria-selected="true"]{background:none}
.c-hc-h{margin-top:12px}
.c-hc-b{padding-top:48px}
.c-hc-h .c-ib .i{width:26px!important;height:26px!important}
.c-rec{width:100%;margin:0;padding:0;gap:12px}
.c-rec-ic{width:40px;height:40px}
.c-rec-ic .i{width:20px!important;height:20px!important}
.c-rec-th{margin:0}
.c-slot{height:30px;line-height:30px;border-radius:8px;padding:0 10px;font-weight:600}
.c-slots{gap:8px;margin-inline-end:-12px;padding-inline-end:12px}
.c-pg-p16 .c-acc-p{font-size:16px;line-height:22px}
.c-pg-p16 .c-pw+.c-lbl2{margin-top:26px}
.c-ntab-h{font-weight:400}
.c-soc:first-child{margin-top:24px}
.c-pg-vg .c-wt{margin-bottom:28px}
.c-vgmh .c-g{font-size:14px;line-height:20px}
.c-btn-navy{height:48px;padding:0 18px;font-size:16px}
.c-bb-web .c-bb-l .c-g{font-size:16px;line-height:22px}
.c-vgs{margin-bottom:28px}
.c-pg-b .c-bigt+.c-pad:not(.c-bps):not(.c-fv):not(.c-opts2){padding-top:16px}
.c-try-h{margin-top:40px;margin-bottom:16px;font-size:18px;line-height:24px}
.c-try{min-height:74px;padding:16px}
.c-try b{font-size:16px;line-height:22px}
.c-pfchips{padding-bottom:33px;margin-top:12px}
.c-pfm{padding-bottom:56px}
.c-pfm-c{background:var(--bg);color:var(--ink-2);box-shadow:0 0 0 1px var(--line);font-size:11px}
.c-pfs .c-h2v{font-size:22px;line-height:28px}
.c-pfs-i{aspect-ratio:1}
.c-mtabs{height:52px}
.c-mtab .c-cnt-b{margin-inline-start:6px}
.c-mtabs+.c-sc .c-pfs:first-child{padding-top:60px}
.c-pg-v .c-bb .c-g{font-size:16px;line-height:22px}
.c-ver{margin-top:34px}
.c-delacc .c-btn{padding:0 20px}

/* exact-replica pass: inline «Read more», neighbouring days in the web calendar, the professional sheet's top gap, web-view text colour */
.c-rmore{font-size:16px;line-height:22px}
.c-rmore .c-rmb{display:inline;font-size:16px;line-height:22px;padding:0}
.c-mc-x{display:grid;place-items:center;height:36px;color:var(--ink-3);font-size:14px}
.c-pg-pro{margin-top:12px;box-shadow:0 -12px 0 0 var(--scrim)}
.c-web,.c-web .c-wopt,.c-web .c-wrow,.c-web .c-wt,.c-web .c-wt2,.c-web .c-lbl2,.c-pg-hc .c-hc-b,.c-pg-hc .c-hc-h{color:var(--ink-web)}
.c-web .c-step,.c-web .c-help,.c-web .c-vgmh .c-g,.c-pg-hc .c-hc-bc .c-g{color:var(--ink-2)}

/* == booking review / confirmed, purchases checkout, payment method, add card, SMS code (capp review 1405-07-24) ==
   built from the flow's own parts: .c-acard cards, .c-aov summary rows, .c-aact-ic icon circles, .c-h3a section titles */
.c-rvw .c-acard+.c-acard{margin-top:12px}
.c-rvw-v{display:flex;align-items:center;gap:12px;padding:12px}
.c-rvw-ph{width:64px;height:64px;border-radius:8px;overflow:hidden;flex:none;background:var(--bg-3)}
.c-rvw-ph img{width:100%;height:100%;object-fit:cover}
.c-rvw-gc .c-gcard{height:100%;padding:6px;border-radius:8px}
.c-rvw-gc .c-gcard-l{font-size:11px;line-height:14px}
.c-rvw-gc .c-gcard-t,.c-rvw-gc .c-gcard-v,.c-rvw-gc .c-gcard-art{display:none}
.c-rvw-vb{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:16px;line-height:22px}
.c-rvw-vb b{font-weight:600}
.c-rvw-vb .c-g{font-size:14px;line-height:20px}
.c-rvw-d{display:flex;flex-direction:column;gap:14px}
.c-rvw-w{display:flex;align-items:center;gap:12px;font-size:16px;line-height:22px}
.c-rvw-w .i{width:22px;height:22px;flex:none;color:var(--ink-2)}
.c-rvw .c-h3a{margin:32px 0 12px}
.c-rvw .c-vgta{height:96px}
.c-rvw>.c-btn{margin-top:24px}
.c-payr,.c-paysel{display:flex;align-items:center;gap:12px;width:100%;text-align:start;color:var(--ink)}
.c-payr{padding:12px 16px 12px 12px}
.c-payr .c-link{font-size:14px;flex:none}
.c-payr>.i,.c-paysel>.i{width:20px;height:20px;color:var(--ink-3);flex:none}
.c-payr-b{flex:1;min-width:0;display:flex;flex-direction:column;font-size:16px;line-height:22px}
.c-payr-b .c-g{font-size:14px;line-height:20px}
.c-paysel{min-height:72px;padding:8px 0;border-bottom:1px solid var(--line)}
.c-paysel:last-child{border-bottom:0}
.c-paysel:disabled{opacity:.45}
.c-aov-pay{margin-top:16px}
.c-aact-bad,.c-aact-bad .c-aact-ic{color:var(--bad)}
.c-aact-bad .c-aact-ic{background:var(--bad-soft)}
.c-btn-red2{background:var(--bad);color:var(--on-ink)}
.c-done{display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 24px 28px}
.c-done-ic{width:72px;height:72px;border-radius:50%;background:var(--ok);color:var(--on-ink);display:grid;place-items:center;margin-bottom:20px}
.c-done-ic .i{width:36px!important;height:36px!important}
.c-done .c-sub2{color:var(--ink-2);margin-top:8px}
.c-cd2{display:flex;gap:12px}
.c-cd2>div{flex:1;min-width:0}
.c-cdf .c-help{margin-top:16px}
.c-otp{display:flex;gap:8px;justify-content:center;margin-bottom:24px}
.c-otp-i{width:48px;height:56px;padding:0;text-align:center;font-size:22px;line-height:28px;font-weight:600}
.c-otp-i:focus,.c-cdf .c-field:focus{box-shadow:inset 0 0 0 2px var(--brand)}
.c-wcard2{margin-bottom:12px}
.c-wcard2 .c-ib{flex:none;color:var(--ink-2)}
.c-wopt-c{flex-direction:column;align-items:stretch;gap:12px;padding:16px 20px 20px}
.c-wopt-c .c-lbl2{margin:0}
.c-wopt-c .c-btn{align-self:flex-start}
.c-buys{padding-top:24px}
.c-off>.i{width:40px;height:40px;color:var(--brand);margin-bottom:16px}
.c-wopt-c .c-help{margin:-4px 0 0}
.c-pg-chat .c-sc{display:flex;flex-direction:column}
.c-pg-chat .c-chat{margin-top:auto}

/* ======================= restyle v3 (customer app) — form only, colours unchanged ======================= */
/* buttons: 12px radius for 48px, 10px for 36px; eased states */
.c-btn{border-radius:var(--r-btn);transition:background-color var(--d-2) var(--ease),box-shadow var(--d-2),transform var(--d-1),opacity var(--d-2)}
.c-btn-xs,.c-ad-go{border-radius:var(--r-ctl)}
.c-btn:active:not(:disabled){transform:scale(.98)}
.c-btn-dark:not(:disabled):hover{background:color-mix(in srgb,var(--ink) 86%,var(--bg))}
.c-btn-o:hover{background:var(--bg-2)}
.c-btn-navy{border-radius:var(--r-btn)}
.c-ib{transition:background-color var(--d-2)}
.c-ib:active{background:var(--hover-tint)}
.c-cb,.c-act2-s,.c-ttool .c-cb,.c-rtool .c-cb{border-radius:var(--r-ctl);transition:box-shadow var(--d-2),background-color var(--d-2)}
.c-link,.c-seeall,.c-seeall2,.c-link-b{font-weight:600}
/* titles: large, tight; labels small and quiet */
.c-pt,.c-pt2,.c-bigt h2,.c-prof-t h1,.c-mpc-n,.c-vi-n,.c-gi h1,.c-hc-ti{font-weight:700;letter-spacing:var(--tr-head);line-height:1.3}
.c-h2,.c-h2v,.c-h2a,.c-h3a,.c-sug-h,.c-bg>.c-h3,.c-pg-bt .c-pad>.c-h3,.c-opt-h .c-h3,.c-ths .c-h3,.c-vgs-h,.c-try-h,.c-pfs .c-h2v{font-weight:700;letter-spacing:var(--tr-head)}
.c-top-t,.c-shd h2,.c-sh-t,.c-shtop-t{font-weight:650;letter-spacing:var(--tr-head)}
.c-wt,.c-wt2,.c-adh h1,.c-ad-when{letter-spacing:-.02em}
.c-rh-n,.c-rsum-l>b,.c-wh-b,.c-wcard>b,.c-gamt,.c-pkgc-p b,.c-bigr b{letter-spacing:var(--tr-fig)}
.c-bs-p b,.c-sc1-p b,.c-bb-p{font-weight:650;letter-spacing:var(--tr-head)}
.c-bb-p{font-size:18px;line-height:24px}
.c-cap{font-size:var(--t-cap);font-weight:600;letter-spacing:var(--tr-label)}
/* top bars and bottom bars: hairline + very soft shadow */
.c-top-big.c-on,.c-vsh,.c-adbar,.c-pg-b.c-stick .c-bchips{box-shadow:0 1px 0 var(--line),0 8px 20px -18px rgba(13,13,13,.4)}
.c-bb{border-top-color:var(--line);box-shadow:0 -10px 24px -22px rgba(13,13,13,.45)}
.c-bb-dk,.c-bb-0{box-shadow:none}
/* sheets */
[data-app="capp"] .c-ov .mdl{border-radius:var(--r-xl) var(--r-xl) 0 0;animation:c-up .3s var(--ease)}
[data-app="capp"] .c-ov-login .mdl{border-radius:0;animation:none}
.c-pg-pro{border-radius:var(--r-xl) var(--r-xl) 0 0}
.c-handle{width:36px;background:color-mix(in srgb,var(--ink) 16%,transparent)}
.c-pop,.c-dd{border-radius:var(--r-md);box-shadow:var(--sh-pop-2);padding:6px}
.c-pop-o,.c-dd-o{border-radius:var(--r-sm);transition:background-color var(--d-1)}
/* chips, tabs, segmented */
.c-chip,.c-stab,.c-vchip,.c-tpill,.c-prochip{transition:background-color var(--d-2) var(--ease),box-shadow var(--d-2),color var(--d-2)}
.c-chip,.c-stab,.c-vchip,.c-prochip{box-shadow:inset 0 0 0 1px var(--line-2)}
.c-chip.on{box-shadow:inset 0 0 0 2px var(--brand)}
.c-chip-rad.on,.c-stab.on,.c-vchip.on{box-shadow:none}
.c-stab,.c-vchip,.c-chip{font-weight:500}
.c-cnt-b,.c-cntc{font-weight:600}
.c-seg{height:40px;padding:3px;border-radius:var(--r-ctl);background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
.c-seg button{border-radius:7px;font-weight:600;color:var(--ink-2);transition:background-color var(--d-2),color var(--d-2),box-shadow var(--d-2)}
.c-seg button[aria-selected="true"]{background:var(--bg);color:var(--ink);box-shadow:var(--sh-seg)}
.c-day.on::after,.c-vtab.on::after,.c-mtab.on::after{height:2px;border-radius:2px}
.c-day,.c-vtab{transition:color var(--d-2)}
/* fields: 10px radius, focus = brand border + soft ring */
.c-inp,.c-field,.c-sel,.c-fld,.c-hc-sel select,.c-vgf,.c-vgform .c-fsel,.c-vgta{border-radius:var(--r-ctl);transition:box-shadow var(--d-2)}
.c-inp-s{border-radius:var(--r-pill)}
.c-field:focus,.c-otp-i:focus,.c-cdf .c-field:focus,.c-hc-sel select:focus{box-shadow:inset 0 0 0 1px var(--brand),var(--ring)}
.c-inp-on,.c-pw:focus-within,.c-fsel[aria-expanded="true"]{box-shadow:inset 0 0 0 1px var(--brand),var(--ring)}
.c-field[aria-invalid="true"]{box-shadow:inset 0 0 0 2px var(--bad)}
.c-comp-in{border-radius:var(--r-card);transition:box-shadow var(--d-2)}
.c-comp-in:focus-within{box-shadow:inset 0 0 0 1px var(--brand),var(--ring)}
.c-lbl,.c-lbl2,.c-hc-l{font-size:var(--t-sm)}
[data-app="capp"] .tg{transition:background-color var(--d-2)}
[data-app="capp"] .tg i{transition:inset-inline-start var(--d-3) var(--ease-spring)}
.c-chk,.c-cbx i{border-radius:6px}
/* home (owner's layout kept: header wordmark, compact search, dots slider, 10 categories, 2 promos, VIP + rows) */
.c-hs2{box-shadow:var(--sh-card-1)}
.c-hs2-go{transition:transform var(--d-2) var(--ease)}
.c-hs2-go:active{transform:scale(.94)}
.c-hcat-ic{border-radius:var(--r-card);background:var(--bg);box-shadow:var(--sh-card-1);transition:background-color var(--d-2),transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease)}
.c-hcat:hover .c-hcat-ic{transform:translateY(var(--lift));box-shadow:var(--sh-card-h)}
.c-hcat:active .c-hcat-ic{transform:scale(.96)}

.c-heros .q-sl,.c-promo{border-radius:var(--r-card)}
.c-promo{transition:transform var(--d-3) var(--ease)}
.c-promo:active{transform:scale(.985)}
.c-ad h2,.c-promo-t b{letter-spacing:var(--tr-head)}
.c-vip-im,.c-vr-im,.c-ncar-im{border-radius:var(--r-md)}
.c-vip,.c-ncar{transition:transform var(--d-3) var(--ease)}
.c-vip-im,.c-ncar-im{transition:box-shadow var(--d-3) var(--ease)}
@media (hover:hover){
  .c-vip:hover,.c-ncar:hover{transform:translateY(var(--lift))}
  .c-vip:hover .c-vip-im,.c-ncar:hover .c-ncar-im{box-shadow:var(--sh-2)}
}
.c-vip-n,.c-vr-n,.c-ncar-n,.c-pr-n{font-weight:650;letter-spacing:var(--tr-head)}
.c-vip-rt,.c-badge,.c-tm-r,.c-pr-rt{font-weight:600}
.c-tm-r,.c-pr-rt{box-shadow:var(--sh-card-1)}
.c-vip-tags i{font-weight:500;box-shadow:none;background:var(--bg-3)}
/* search */
.c-sq{box-shadow:var(--sh-pop-2)}
.c-sq-ic{border-radius:var(--r-ctl)}
.c-rs{border-radius:var(--r-xl) var(--r-xl) 0 0;box-shadow:0 -1px 0 var(--line),0 -14px 30px -18px rgba(13,13,13,.28);transition:top .32s var(--ease)}
.c-srow{border-radius:var(--r-md);transition:background-color var(--d-2)}
.c-slot{border-radius:var(--r-sm)}
.c-topt,.c-sort,.c-tile{border-radius:var(--r-md);transition:box-shadow var(--d-2),background-color var(--d-2)}
.c-topt.on,.c-sort.on{box-shadow:var(--sh-card-on)}
.c-sug-th,.c-rec-th{border-radius:var(--r-sm)}
.c-sug,.c-rec{border-radius:var(--r-ctl);transition:background-color var(--d-1)}
.c-mc-d{transition:background-color var(--d-1)}
/* venue */
.c-vb{border-radius:var(--r-xl) var(--r-xl) 0 0}
.c-vi-ad{border-radius:var(--r-ctl)}
.c-sc1{border-radius:var(--r-card);box-shadow:var(--sh-card-1)}
.c-reply,.c-mapc,.c-pft,.c-gal-i,.c-pfs-i{border-radius:var(--r-md)}
.c-langs span{border-radius:var(--r-pill)}
/* booking: hairline cards, selected = brand ring; navigable rows lift a little */
.c-bs,.c-bp,.c-me,.c-time,.c-dt,.c-fvo,.c-opt2,.c-try,.c-incc,.c-pkg,.c-acard,.c-pcard,.c-ncard,.c-adr,.c-wopt,.c-wrow{border-radius:var(--r-card);box-shadow:var(--sh-card-1);transition:box-shadow var(--d-2) var(--ease),transform var(--d-2) var(--ease),background-color var(--d-2)}
.c-time,.c-dt,.c-wrow,.c-wopt{border-radius:var(--r-md)}
.c-bs.on,.c-bp.on,.c-time.on,.c-fvo.on{box-shadow:var(--sh-card-on)}
.c-dt.on{box-shadow:var(--sh-1)}
.c-dt b{letter-spacing:var(--tr-fig)}
.c-dt>span:first-child{font-size:var(--t-cap);font-weight:600;letter-spacing:var(--tr-label)}
.c-bs:active,.c-bp:active,.c-time:active,.c-opt2:active,.c-try:active,.c-fvo:active{transform:scale(.99)}
.c-add{transition:background-color var(--d-2),transform var(--d-2) var(--ease-spring)}
.c-add.on{transform:scale(1.04)}
.c-chkc{box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 16%,transparent)}
.c-bchips-ic{border-radius:var(--r-ctl)}
.c-done-ic{box-shadow:0 0 0 8px color-mix(in srgb,var(--ok) 12%,transparent)}
.c-rvw-ph,.c-arow-ph,.c-nbiz-ph{border-radius:var(--r-ctl)}
/* activity, appointment status: pastel background + deep text (our status colours) */
.c-ast{height:28px;padding:0 12px;gap:6px;font-size:13px;font-weight:600;letter-spacing:var(--tr-label);background:var(--bg-3);color:var(--ink-2)}
.c-ast .i{width:16px!important;height:16px!important}
.c-ast-ok{background:var(--ok-soft);color:var(--ok)}
.c-ast-bad{background:var(--bad-soft);color:var(--bad)}
.c-aact{border-radius:var(--r-ctl);transition:background-color var(--d-1)}
.c-aact:active{background:var(--bg-2)}
.c-aact>.i{transition:transform var(--d-3) var(--ease)}
.c-aact:hover>.i{transform:translateX(-3px)}
.c-arow{border-radius:var(--r-md)}
/* profile, wallet, gift */
.c-wcard,.c-wh-add{border-radius:var(--r-lg)}
.c-wcard{box-shadow:var(--sh-2)}
.c-wh-add{border-radius:var(--r-ctl)}
.c-wgift{border-radius:var(--r-card)}
.c-addcard-ic{border-radius:var(--r-md)}
.c-mpc{border-radius:var(--r-card);box-shadow:var(--sh-card-1)}
.c-prow{border-radius:var(--r-ctl);transition:background-color var(--d-1)}
.c-prow:active{background:var(--bg-2)}
.c-gcard,.c-pkgc{border-radius:var(--r-lg)}
.c-th{border-radius:var(--r-ctl)}
.c-gamt-o{border-radius:var(--r-md);box-shadow:var(--sh-card-1);transition:box-shadow var(--d-2)}
.c-gamt-o.on{box-shadow:var(--sh-card-on)}
.c-mcard,.c-mrev{border-radius:var(--r-lg)}
.c-soc-ic{border-radius:var(--r-ctl)}
/* messages */
.c-mi{transition:background-color var(--d-1)}
.c-bub{border-radius:var(--r-lg)}
.c-bw.me .c-bub{border-end-end-radius:6px}
.c-bw:not(.me) .c-bub{border-end-start-radius:6px}
.c-ast{color:var(--ink-2-deep)}
.c-ast-ok{color:var(--ok-deep)}

/* ======================= restyle v3 palette (customer) — Accord LIGHT colours (CONVENTIONS «restyle v3 palette») =======================
   Light = Accord; literals that changed are --cp-* tokens whose dark value is the old one (dark mode unchanged). */
[data-app="capp"]{--cp-canvas:var(--page);--cp-prof:var(--page);--cp-band:var(--band);--cp-dis-bg:var(--bg-3);--cp-dis-ink:var(--ink-3);--cp-btn-g:var(--night);--cp-btn-gi:var(--on-night);--cp-laur:#12a079;--cp-laur2:#0b7658;--cp-blob:linear-gradient(90deg,#0b7658,#12a079);--cp-gi:linear-gradient(180deg,#14231d 0%,#14231d 55%,#0b5440 100%)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) [data-app="capp"]{--cp-canvas:var(--bg);--cp-prof:var(--bg-4);--cp-band:transparent;--cp-dis-bg:var(--ink-3);--cp-dis-ink:var(--on-ink);--cp-btn-g:linear-gradient(90deg,#1a73e8 0%,#4f6cf0 70%,#6a5cf3 100%);--cp-btn-gi:#fff;--cp-laur:#b46cff;--cp-laur2:#a24dff;--cp-blob:linear-gradient(90deg,#6950f3,#b46cff);--cp-gi:linear-gradient(180deg,#0d0d0d 0%,#0d0d0d 55%,#2a1f4e 100%)}}
:root[data-theme="dark"] [data-app="capp"]{--cp-canvas:var(--bg);--cp-prof:var(--bg-4);--cp-band:transparent;--cp-dis-bg:var(--ink-3);--cp-dis-ink:var(--on-ink);--cp-btn-g:linear-gradient(90deg,#1a73e8 0%,#4f6cf0 70%,#6a5cf3 100%);--cp-btn-gi:#fff;--cp-laur:#b46cff;--cp-laur2:#a24dff;--cp-blob:linear-gradient(90deg,#6950f3,#b46cff);--cp-gi:linear-gradient(180deg,#0d0d0d 0%,#0d0d0d 55%,#2a1f4e 100%)}
/* home: the sage band behind the header + search runs into the hero slider (Accord band); status bar joins it */
.c-home{background:linear-gradient(var(--cp-band),var(--cp-band)) 0 0/100% 194px no-repeat}
.screen:has(.c-home) .sbar{background:var(--cp-band)}
.c-hh-dot{box-shadow:0 0 0 2px var(--cp-band)}
/* filled selected = night (Accord): radio chips, free slots, month days, added service, date tiles */
.c-chip-rad.on,.c-slot,.c-mc-d.on,.c-add.on,.c-dt.on{background:var(--sel);color:var(--on-sel)}
.c-dt.on>span{color:var(--on-sel)}
.c-mc-d.on{box-shadow:none}
.c-btn-dark:disabled{background:var(--cp-dis-bg);color:var(--cp-dis-ink)}
.c-btn-blue{background:var(--cp-btn-g);color:var(--cp-btn-gi)}
.c-laur-s i{color:var(--cp-laur)} .c-laur-s i .c-star{color:var(--cp-laur2)}
.c-hc-blob{background:var(--cp-blob)}
.c-pg-gi{background:var(--cp-gi)}
/* illustrations drawn in capp.js (empty states, wallet gift, calendar): recoloured through CSS (stop-color/fill beat the
   SVG attributes); --ca-* light = Accord greens, dark = the old purple values */
:root{--ca-cwg1:#e2efe8;--ca-cwg2:#cde2d6;--ca-cwr1:#12a079;--ca-cwr2:#0b7658;--ca-cea1:#d3eee2;--ca-cea2:#12a079;--ca-ceb1:#0b7658;--ca-ceb2:#9fd8c2;--ca-ccg1:#9fd8c2;--ca-ccg2:#0b7658;--ca-pink:#12a079;--ca-deep:#14231d;--ca-pur:#0b7658}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--ca-cwg1:#eeeaff;--ca-cwg2:#d9d2ff;--ca-cwr1:#8b6cff;--ca-cwr2:#5b3df0;--ca-cea1:#d4ccff;--ca-cea2:#8a76f7;--ca-ceb1:#6950f3;--ca-ceb2:#f45dfc;--ca-ccg1:#a99bff;--ca-ccg2:#6950f3;--ca-pink:#f45dfc;--ca-deep:#4b3bbf;--ca-pur:#6950f3}}
:root[data-theme="dark"]{--ca-cwg1:#eeeaff;--ca-cwg2:#d9d2ff;--ca-cwr1:#8b6cff;--ca-cwr2:#5b3df0;--ca-cea1:#d4ccff;--ca-cea2:#8a76f7;--ca-ceb1:#6950f3;--ca-ceb2:#f45dfc;--ca-ccg1:#a99bff;--ca-ccg2:#6950f3;--ca-pink:#f45dfc;--ca-deep:#4b3bbf;--ca-pur:#6950f3}
#cwg stop:first-child{stop-color:var(--ca-cwg1)} #cwg stop:last-child{stop-color:var(--ca-cwg2)}
#cwr stop:first-child{stop-color:var(--ca-cwr1)} #cwr stop:last-child{stop-color:var(--ca-cwr2)}
.c-eart [id^="cea-"] stop:first-child{stop-color:var(--ca-cea1)} .c-eart [id^="cea-"] stop:last-child{stop-color:var(--ca-cea2)}
.c-eart [id^="ceb-"] stop:first-child{stop-color:var(--ca-ceb1)} .c-eart [id^="ceb-"] stop:last-child{stop-color:var(--ca-ceb2)}
#ccg stop:first-child{stop-color:var(--ca-ccg1)} #ccg stop:last-child{stop-color:var(--ca-ccg2)}
#s2cg stop:first-child{stop-color:var(--ca-ccg1)} #s2cg stop:last-child{stop-color:var(--ca-pink)}
.c-calart [fill="#f45dfc"]{fill:var(--ca-pink)} .c-calart [fill="#4b3bbf"]{fill:var(--ca-deep)}
.c-eart [fill="#6950f3"],svg [fill="#6950f3"]{fill:var(--ca-pur)}


/* home merge 1405-07-26 — (1) website home: the customer-app home sections at the top (s-hm-*, site.js sHmTop);
   (2) customer app home: the Fresha-home sections appended under ours (c-f*, capp.js fHome; sizes = the 1:1 variant).
   Colours only through shared tokens (base.css / ui.css / capp.css), so the restyle palette and dark mode apply. */

/* ================= (1) WEBSITE: app sections on top ================= */
.s-hm{position:relative;z-index:1;display:flex;flex-direction:column;gap:56px;max-width:1440px;margin:0 auto;padding-top:96px;width:100%}
/* the page canvas under the app block: the home glow stays behind the site hero only (it washed out the labels in dark) */
.s-hm{background:var(--s-canvas,var(--bg));box-shadow:0 0 0 100vmax var(--s-canvas,var(--bg));clip-path:inset(0 -100vmax)}
.s-hm img{width:100%;height:100%;object-fit:cover}
.s-hm{padding-bottom:64px}
.s-hm+.s-hero{padding-top:72px;min-height:0}
.s-hm+.s-hero::before{top:0}   /* the hero band starts at the hero (it no longer runs up under the header) */
.s-hm-hero{padding:0 32px}
.s-hm-sl{height:clamp(220px,24cqw,360px)}
.s-hm-ad{position:relative;height:100%;color:var(--q-on-photo)}
.s-hm-ad img{position:absolute;inset:0}
.s-hm-ad::after{content:"";position:absolute;inset:0;background:var(--q-photo-fade)}
.s-hm-ad-t{position:absolute;z-index:1;inset-block:0;inset-inline-start:0;width:52%;padding:40px 48px 52px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:8px}
.s-hm-ad-eb{display:flex;align-items:center;gap:8px;font:500 14px/20px var(--f);opacity:.92}
.s-hm-ad-eb i{font-style:normal;font:600 12px/20px var(--f);padding:0 8px;border-radius:var(--r-xs);background:var(--glass);color:var(--ink)}
.s-hm-ad h2{font:700 var(--t-title)/var(--lh-head) var(--f);letter-spacing:var(--tr-head)}
.s-hm-ad p{font:400 17px/26px var(--f);opacity:.92;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.s-hm-ad-go{display:inline-flex;align-items:center;gap:8px;height:var(--h-btn);padding:0 20px;margin-top:8px;border-radius:var(--r-btn);background:var(--bg);color:var(--ink);font:600 15px/20px var(--f);transition:transform var(--d-2) var(--ease)}
.s-hm-ad-go .i{width:18px;height:18px}
.s-hm-ad-go:active{transform:scale(.98)}
.s-hm-sl .q-sl-ctl-dots{bottom:10px}

.s-hm-sec{display:flex;flex-direction:column}
.s-hm-h{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 32px;margin-bottom:24px}
.s-hm-h .s-h2{padding:0;margin:0}
.s-hm-h2ic{display:flex;align-items:center;gap:8px}
.s-hm-h2ic .i{width:26px;height:26px;color:var(--brand)}
.s-hm-all{flex:none;display:inline-flex;align-items:center;gap:4px;min-height:40px;padding:0 4px;border-radius:var(--r-ctl);color:var(--brand);font:600 16px/22px var(--f)}
.s-hm-all .i{width:18px;height:18px}
.s-hm-all:hover{background:var(--hover-tint)}
.s-hm :is(a,button):focus-visible{outline:2px solid var(--ring-c);outline-offset:2px}

.s-hm-cats{display:grid;grid-template-columns:repeat(10,1fr);gap:16px;padding:0 32px}
.s-hm-cat{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0;color:var(--ink)}
.s-hm-cat-ic{width:76px;height:76px;border-radius:var(--r-card);background:var(--bg);box-shadow:var(--sh-card-1);display:grid;place-items:center;color:var(--ink);transition:background-color var(--d-2),transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease)}
.s-hm-cat-ic .i{width:32px;height:32px}
.s-hm-cat-l{font:500 14px/20px var(--f);text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.s-hm-cat:active .s-hm-cat-ic{transform:scale(.96)}

.s-hm-promos{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:0 32px}
.s-hm-promo{position:relative;height:168px;border-radius:var(--r-card);overflow:hidden;color:var(--q-on-photo);text-align:start;background:var(--bg-3);transition:transform var(--d-3) var(--ease)}
.s-hm-promo img{position:absolute;inset:0}
.s-hm-promo::after{content:"";position:absolute;inset:0;background:var(--q-photo-fade)}
.s-hm-promo-t{position:absolute;z-index:1;inset:0;padding:24px 32px;display:flex;flex-direction:column;justify-content:center;gap:4px}
.s-hm-promo-t small{font:400 14px/20px var(--f);opacity:.9}
.s-hm-promo-t b{font:700 26px/36px var(--f);letter-spacing:var(--tr-head)}
.s-hm-promo-t span{font:400 16px/24px var(--f);opacity:.9;max-width:62%}
.s-hm-promo-go{position:absolute;z-index:1;bottom:16px;inset-inline-end:16px;width:40px;height:40px;border-radius:50%;background:var(--glass);color:var(--ink);display:grid;place-items:center}
.s-hm-promo-go .i{width:20px;height:20px}
.s-hm-promo:active{transform:scale(.99)}

.s-car--hm .s-car-i{width:264px}
.s-car--hm .s-car-t{padding-bottom:12px}
.s-car--hm .s-car-b{top:90px}
.s-hm-vip{position:relative;display:flex;flex-direction:column;gap:4px;color:var(--ink);transition:transform var(--d-3) var(--ease)}
.s-hm-vip-im{display:block;height:180px;border-radius:var(--r-md);overflow:hidden;background:var(--bg-3);margin-bottom:6px;transition:box-shadow var(--d-3) var(--ease)}
.s-hm-vip-rt{position:absolute;top:148px;inset-inline-end:10px;display:inline-flex;align-items:center;gap:3px;height:24px;padding:0 8px;border-radius:var(--r-pill);background:var(--glass);color:var(--ink);font:600 13px/1 var(--f);pointer-events:none}
.s-hm-vip-rt .st{width:14px;height:14px;color:var(--star)}
.s-hm-vip-n{font:650 16px/22px var(--f);letter-spacing:var(--tr-head);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-hm-vip-l{display:flex;align-items:center;gap:4px;min-width:0;font:400 14px/20px var(--f);color:var(--ink-2)}
.s-hm-vip-l .i{width:15px;height:15px;flex:none}
.s-hm-vip-l span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.s-hm-vip-tags{display:flex;gap:6px;flex-wrap:nowrap;overflow:hidden;margin-top:2px}
.s-hm-vip-tags i{font-style:normal;font:500 12px/24px var(--f);padding:0 9px;border-radius:var(--r-pill);background:var(--bg-3);color:var(--ink-2);white-space:nowrap}
.s-hm-note{margin:-32px 32px 0;text-align:center;font:400 12px/18px var(--f);color:var(--ink-3)}
@media (hover:hover){
  .s-hm-cat:hover .s-hm-cat-ic{transform:translateY(var(--lift));box-shadow:var(--sh-card-h)}
  .s-hm-vip:hover{transform:translateY(var(--lift))}
  .s-hm-vip:hover .s-hm-vip-im{box-shadow:var(--sh-2)}
}
@container (max-width:1100px){
  .s-hm-cats{grid-template-columns:repeat(5,1fr);gap:24px 12px}
  .s-hm-ad-t{width:62%;padding:28px 32px 40px}
}
@container (max-width:900px){
  .s-hm{gap:44px}
  .s-hm-promo{height:132px}
  .s-hm-promo-t{padding:18px 22px}
  .s-hm-promo-t b{font-size:21px;line-height:30px}
  .s-hm-promo-t span{font-size:14px;line-height:20px;max-width:75%}
  .s-car--hm .s-car-i{width:224px}
  .s-hm-vip-im{height:150px}
  .s-hm-vip-rt{top:118px}
  .s-car--hm .s-car-b{top:75px}
}
@container (max-width:600px){
  .s-hm{gap:32px;padding-top:84px;padding-bottom:32px}
  .s-hm+.s-hero{padding-top:40px}
  .s-hm-hero{padding:0 20px}
  .s-hm-sl{height:170px}
  .s-hm-ad-t{width:68%;padding:14px 16px 24px;gap:3px}
  .s-hm-ad-eb{font-size:11px;line-height:16px;gap:6px}
  .s-hm-ad-eb i{font-size:10px;line-height:16px;padding:0 6px}
  .s-hm-ad h2{font-size:17px;line-height:24px}
  .s-hm-ad p{font-size:12px;line-height:17px;-webkit-line-clamp:1}
  .s-hm-ad-go{height:30px;padding:0 10px;margin-top:4px;font-size:12px;gap:4px;border-radius:var(--r-ctl)}
  .s-hm-ad-go .i{width:14px;height:14px}
  .s-hm-sl .q-sl-ctl-dots{bottom:4px}
  .s-hm-h{padding:0 20px;margin-bottom:14px}
  .s-hm-h2ic .i{width:20px;height:20px}
  .s-hm-all{font-size:15px;min-height:36px}
  .s-hm-all .i{width:16px;height:16px}
  .s-hm-cats{gap:16px 6px;padding:0 14px}
  .s-hm-cat{gap:8px}
  .s-hm-cat-ic{width:56px;height:56px}
  .s-hm-cat-ic .i{width:26px;height:26px}
  .s-hm-cat-l{font-size:12px;line-height:16px}
  .s-hm-promos{gap:12px;padding:0 20px}
  .s-hm-promo{height:88px}
  .s-hm-promo-t{padding:10px 12px;gap:2px}
  .s-hm-promo-t small{font-size:10px;line-height:14px}
  .s-hm-promo-t b{font-size:14px;line-height:20px}
  .s-hm-promo-t span{font-size:11px;line-height:15px;max-width:82%}
  .s-hm-promo-go{width:24px;height:24px;bottom:8px;inset-inline-end:8px}
  .s-hm-promo-go .i{width:16px;height:16px}
  .s-car--hm .s-car-t{gap:12px;padding-bottom:8px}
  .s-car--hm .s-car-i{width:160px}
  .s-hm-vip-im{height:114px}
  .s-hm-vip-rt{top:86px;inset-inline-end:8px;height:22px;padding:0 7px;font-size:11px}
  .s-hm-vip-rt .st{width:13px;height:13px}
  .s-hm-vip .s-heart{top:6px;left:6px}
  .s-hm-vip-n{font-size:14px;line-height:20px}
  .s-hm-vip-l{font-size:12px;line-height:16px}
  .s-hm-vip-l .i{width:14px;height:14px}
  .s-hm-vip-tags{gap:4px}
  .s-hm-vip-tags i{font-size:10.5px;line-height:20px;padding:0 7px}
  .s-hm-note{margin:-16px 20px 0;font-size:11px;line-height:16px}
}

/* ================= (2) CUSTOMER APP: Fresha-home sections under ours (1:1 variant sizes; c-home-loggedin-* ÷ 2.625) ================= */
.c-fh{padding-bottom:8px}
.c-fh button,.c-fh a{-webkit-tap-highlight-color:transparent}
.c-fh :is(button,a):focus-visible{outline:2px solid var(--ring-c);outline-offset:2px}
.c-fh>.c-fs:first-child,.c-fh>.c-fba:first-child{margin-top:28px}
.c-fs{margin-top:40px}
.c-fs-h{display:flex;align-items:center;justify-content:space-between;padding:0 20px;min-height:28px;margin-bottom:16px}
.c-fs-sa .c-fs-h{margin-bottom:22px}
.c-fs-t{margin:0;font:600 22px/28px var(--f);color:var(--ink);letter-spacing:var(--tr-head)}
.c-fs-all{height:48px;margin:-10px 0;padding-inline:12px 0;font:400 16px/22px var(--f);color:var(--ink);flex:none;border-radius:12px}
.c-fcar{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;padding:0 20px 22px;scroll-snap-type:x proximity;scroll-padding-inline:20px}
.c-fcar::-webkit-scrollbar{display:none}
.c-fc{position:relative;flex:none;width:280px;scroll-snap-align:start}
.c-fc-im{display:block;height:187px;border-radius:16px;overflow:hidden;background:var(--bg-3)}
.c-fc-im img,.c-fn-im img,.c-fba-im img{width:100%;height:100%;object-fit:cover}
.c-fc-b{display:block;margin-top:8px;color:var(--ink)}
.c-fc-r1{display:flex;align-items:center;height:22px;gap:0}
.c-fc-n{flex:0 1 auto;font:600 16px/22px var(--f)}
.c-fc .c-vf,.c-fn .c-vf,.c-fba .c-vf{flex:none;width:16px;height:16px;margin:0;margin-inline-start:4px;vertical-align:0}
.c-frate{display:inline-flex;align-items:center;gap:4px;flex:none;font:600 16px/22px var(--f);color:var(--ink)}
.c-frate .c-star{width:16px!important;height:16px!important}
.c-frate-l{margin-inline-start:auto;padding-inline-start:8px}
.c-fc-g{display:block;font:400 14px/20px var(--f);color:var(--ink-2)}
.c-fbadge{position:absolute;top:12px;inset-inline-start:12px;z-index:2;display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 10px;border-radius:999px;background:var(--c-badge);font:500 13px/16px var(--f);color:var(--ink);pointer-events:none}
.c-fbadge-i{display:grid;color:var(--brand)}
.c-fbadge-i .i{width:16px!important;height:16px!important}
.c-fheart{position:absolute;z-index:3;top:0;inset-inline-end:0;width:48px;height:48px;display:grid;place-items:center;color:var(--q-on-photo);border-radius:50%;filter:drop-shadow(0 0 2px rgba(0,0,0,.4))}
.c-fheart .i{width:24px!important;height:24px!important}
.c-fheart.on{color:var(--bad)}
.c-fn .c-fheart{top:-4px;inset-inline-end:-4px;color:var(--ink-3);filter:none}
.c-fn .c-fheart.on{color:var(--bad)}
.c-fs-gp{margin:40px 20px 0}
.c-gp{position:relative;display:block;width:100%;height:128px;padding:16px 20px 4px;border-radius:16px;overflow:hidden;background:var(--night);color:var(--on-night);text-align:start;box-shadow:0 0 0 1px var(--line)}
.c-gp-t{display:block;max-width:calc(100% - 150px);min-width:150px;height:56px;font:600 22px/28px var(--f);overflow:hidden}
.c-gp-b{display:flex;align-items:center;gap:8px;height:48px;margin-top:4px;font:600 16px/22px var(--f)}
.c-gp-b .i{width:24px!important;height:24px!important}
.c-gp-art{position:absolute;top:0;bottom:0;inset-inline-end:0;height:100%;width:auto;max-width:46%;transform:scaleX(-1);pointer-events:none}
.c-gp-a1{fill:var(--brand)}
.c-gp-a2{fill:var(--star)}
.c-gp-a3{fill:none;stroke:var(--warn)}
.c-gp-a4{fill:var(--accent)}
.c-gp-a5{fill:var(--brand-3)}
.c-gp-a6{fill:none;stroke:var(--accent)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .c-gp{background:var(--bg-3);color:var(--ink)}}
:root[data-theme="dark"] .c-gp{background:var(--bg-3);color:var(--ink)}
.c-fba{margin-top:40px;padding:24px 0;background:var(--bg-3)}
.c-fba .c-fs{margin-top:0}
.c-fba-c{margin:0 20px;border-radius:20px;overflow:hidden;background:var(--bg);box-shadow:0 0 0 1px var(--line);position:relative}
.c-fba-im{position:relative;display:block;height:130px;background:var(--bg-3)}
.c-fba-pin{position:absolute;top:50%;left:50%;width:40px;height:40px;margin:-20px;border-radius:50%;background:var(--brand);color:var(--q-on-photo);display:grid;place-items:center}
.c-fba-pin .i{width:20px!important;height:20px!important}
.c-fba-b{display:block;padding:13px 16px 0;color:var(--ink)}
.c-fba-b b{display:block;font:600 16px/22px var(--f)}
.c-fba-btn{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;width:calc(100% - 32px);height:48px;margin:6px 16px 10px;font:500 16px/22px var(--f);color:var(--ink)}
.c-fba-btn::before{content:"";position:absolute;inset:6px 0;border-radius:999px;background:var(--bg-3);z-index:-1}
.c-fba-btn span{display:inline-flex;align-items:center;gap:8px}
.c-fba-btn .i{width:20px!important;height:20px!important}
.c-flist{display:flex;flex-direction:column;gap:12px;padding:0 20px}
.c-fn{position:relative}
.c-fn-a{display:flex;align-items:center;gap:16px;min-height:120px;border-radius:16px;overflow:hidden;background:var(--bg);box-shadow:0 0 0 1px var(--line);padding-inline-end:28px;color:var(--ink)}
.c-fn-im{flex:none;align-self:stretch;width:120px;position:relative;background:var(--bg-3)}
.c-fn-im img{position:absolute;inset:0}
.c-fn-b{flex:1;min-width:0;display:block}
.c-fn-r1{display:flex;align-items:center;height:22px}
.c-fn-r1 b{flex:0 1 auto;font:600 16px/22px var(--f)}
.c-fn-g{display:block;font:400 14px/20px var(--f);color:var(--ink-2)}
.c-fn-r3{display:flex;align-items:center;gap:8px;height:20px}
.c-fn-r3 .c-fn-g{display:inline}
.c-fn .c-frate{font:600 14px/20px var(--f)}
.c-fn-p .c-fn-a{padding:16px;gap:12px;min-height:0}
.c-fn-p .c-fn-b>b{display:block;font:600 16px/22px var(--f)}
.c-fn-av{flex:none;display:block;width:80px;height:80px}
@container (max-width:379px){.c-gp-art{max-width:40%}.c-fc{width:264px}}


/* taxo-full.css — taxonomy complete 1405-07-26: a category's full treatment list (customer app page «cattypes»,
   website popover drill-in and category dialog). Tokens only; light + dark come from the app tokens. */

/* ---- customer app ---- */
[data-app="capp"] .tx-pg{padding:0 20px 32px}
[data-app="capp"] .tx-top{padding:8px 0 4px;position:sticky;top:0;z-index:1;background:var(--cp-canvas,var(--bg))}
[data-app="capp"] .tx-top .c-inp input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:inherit;outline:0}
[data-app="capp"] .tx-cnt{margin:8px 0 0;font-size:13px}
[data-app="capp"] .tx-list .c-sug{border-bottom:1px solid var(--line)}
[data-app="capp"] .tx-list .c-sug:last-of-type{border-bottom:0}
[data-app="capp"] .tx-list .c-sug-t{flex:1;min-width:0;overflow-wrap:anywhere}
[data-app="capp"] .tx-all .c-sug-t b{font-weight:600}
[data-app="capp"] .tx-none{padding:24px 0;text-align:center}
[data-app="capp"] .tx-cat .c-sug-t{flex:1;min-width:0}
[data-app="capp"] .tx-cat .tx-n{font-size:13px;flex:none}
[data-app="capp"] .tx-cat>.i:last-child{flex:none;color:var(--ink-3);width:20px;height:20px}
[data-app="capp"] [hidden]{display:none!important}

/* ---- website ---- */
[data-app="site"] .tx-wrap [hidden]{display:none!important}
[data-app="site"] .tx-sh{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:8px;padding:12px 0 8px;background:var(--bg);color:var(--ink)}
[data-app="site"] .tx-sh b{font:600 16px/22px var(--f)}
[data-app="site"] .tx-sh small{margin-inline-start:auto;font:400 13px/18px var(--f);color:var(--ink-3)}
[data-app="site"] .tx-q{display:flex;align-items:center;gap:8px;height:44px;margin:4px 0 8px;padding:0 12px;border-radius:var(--r-ctl);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg);color:var(--ink-3)}
[data-app="site"] .tx-q input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:400 15px/20px var(--f);outline:0}
[data-app="site"] .tx-q:focus-within{box-shadow:inset 0 0 0 2px var(--ink)}
[data-app="site"] .tx-list .s-li-tx b{overflow-wrap:anywhere}
[data-app="site"] .tx-all .s-li-tx b{font-weight:600}
[data-app="site"] .tx-none{margin:16px 0;text-align:center;color:var(--ink-3);font:400 14px/20px var(--f)}
[data-app="site"] .tx-md .tx-q{position:sticky;top:0;z-index:2;margin-top:0}
[data-app="site"] .tx-md .s-md-b{overflow:auto}

/* ======================= full width 1405-07-26 — customer website uses the whole window =======================
   Owner: «صفحهٔ سایت مشتری را تمام صفحه کن». Every site page drops its 1440/1200/1000px cap and runs edge to edge inside
   one side gutter --sg: phone/tablet (≤900) unchanged (already full width), 901–1023 32px, 1024–1919 48px, ≥1920 64px.
   Grids gain columns instead of stretching cards; carousels just show more cards. Kept as centred columns on purpose
   (flows / long text, like Fresha): booking + gift-card steps, sign-in, profile edit, settings sub-pages, legal docs,
   modals, the business-page hero mock-ups. Paragraphs keep their own max-width. Placed in the last site stylesheet with a
   [data-app="site"] prefix so it wins over the site.css/site2/site3 base and responsive rules. */
@container (min-width:901px){
  [data-app="site"]>*{--sg:32px}
}
@container (min-width:1024px){
  [data-app="site"]>*{--sg:48px}
}
@container (min-width:1920px){
  [data-app="site"]>*{--sg:64px}
}
@container (min-width:901px){
  /* header, footer, flow top bar */
  [data-app="site"] :is(.s-hd-in,.s-ft-in,.s-ft-bi,.s2-bk-tin){max-width:none;padding-inline:var(--sg)}
  [data-app="site"] .s-ft-in{grid-template-columns:repeat(5,minmax(0,1fr))}
  /* home: app block on top + site sections */
  [data-app="site"] :is(.s-hm,.s-sec){max-width:none}
  [data-app="site"] :is(.s-hm-hero,.s-hm-h,.s-hm-cats,.s-hm-promos,.s-hm .s-car){padding-inline:var(--sg)}
  [data-app="site"] .s-hm-note{margin-inline:var(--sg)}
  [data-app="site"] :is(.s-hero,.s-app,.s-stats,.s-biz-in,.s-catp){max-width:none;padding-inline:var(--sg)}
  [data-app="site"] .s-sec>:is(.s-h2,.s-car){padding-inline:var(--sg)}
  [data-app="site"] .s-sec--city{padding-inline:var(--sg)}
  [data-app="site"] .s-sec--city>:is(.s-h2,.s-car){padding-inline:0}
  /* search results: filter bar + list/map */
  [data-app="site"] :is(.s-sr-bar-in,.s-sr-body){max-width:none;padding-inline:var(--sg)}
  /* venue */
  [data-app="site"] :is(.s2-top,.s2-gal-d,.s2-cols,.s2-treat){max-width:none;padding-inline:var(--sg)}
  [data-app="site"] .s2-main{max-width:none}
  [data-app="site"] .s2-stab{padding-inline:var(--sg)}
  [data-app="site"] .s2-stab ul{max-width:none}
  [data-app="site"] .s2-near{max-width:none}
  [data-app="site"] .s2-near h2{padding-inline:var(--sg)}
  [data-app="site"] .s2-near .s2-hs-s{padding-inline:var(--sg)}
  /* professional */
  [data-app="site"] .s2-pwrap{max-width:none;padding-inline:var(--sg)}
  /* account pages (sidebar + content) */
  [data-app="site"] .s3-wrap{max-width:none;padding-inline:var(--sg)}
  /* help centre: full width, two FAQ columns; search stays a comfortable field */
  [data-app="site"] .s3-doc:has(.s3-doc-faq){max-width:none;padding-inline:var(--sg)}
  [data-app="site"] .s3-doc:has(.s3-doc-faq) .s3-doc-q{max-width:640px}
  /* business pages: download + feature list + fixed-width grids fill the row */
  [data-app="site"] .s3-dl-in{padding-inline:var(--sg)}
  [data-app="site"] .s3-fs-in{max-width:none}
  /* long text keeps a readable measure inside the wider sections */
  [data-app="site"] :is(.s2-sum2,.s2-about) p{max-width:960px}
}
@container (min-width:1280px){
  /* account grids become fluid: list fills, detail keeps its measured column */
  [data-app="site"] .s3-split{grid-template-columns:minmax(0,1fr) 536px}
  [data-app="site"] .s3-split-l .s3-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));align-items:start}
  [data-app="site"] .s3-cards-w{max-width:none}
  [data-app="site"] .s3-pgrid{grid-template-columns:minmax(0,400px) minmax(0,1fr)}
  [data-app="site"] .s3-addr ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}
  [data-app="site"] .s3-vgrid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
  [data-app="site"] .s3-setg{grid-template-columns:repeat(auto-fill,minmax(304px,1fr))}
  [data-app="site"] .s3-wcol{width:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(460px,1fr));align-items:start}
  [data-app="site"] .s3-doc-faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
}
@container (min-width:1441px){
  [data-app="site"] .s-hm-sl{height:clamp(345px,20cqw,560px)}
  [data-app="site"] .s2-gal-d{grid-template-rows:repeat(2,clamp(243px,12.5cqw,420px))}
  [data-app="site"] :is(.s3-types,.s3-plans){grid-template-columns:repeat(3,minmax(0,1fr));padding-inline:var(--sg)}
  [data-app="site"] .s3-need-g{grid-template-columns:repeat(3,minmax(0,1fr))}
  [data-app="site"] .s3-succ-g{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@container (min-width:1600px){
  /* services, reviews, team, portfolio: more columns instead of one stretched row */
  [data-app="site"] :is(.s2-main,.s2-pright) .s2-sclist{display:grid;grid-template-columns:repeat(auto-fill,minmax(440px,1fr))}
  [data-app="site"] .s2-rvs{grid-template-columns:repeat(auto-fill,minmax(440px,1fr))}
  [data-app="site"] .s2-team{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  [data-app="site"] .s2-pf{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
}
@container (min-width:1920px){
  [data-app="site"] .s-hm-promo{height:200px}
}
/* == end full width 1405-07-26 == */


/* panel — Fresha partner workspace (partners.fresha.com) replica, RTL. Prefix p-.
   Measured from capture/out/p-*.json (1440×900 desktop, 390×844 mobile). Mobile = @container ≤600px. */
:root{
  --p-rail:#0d0d0d; --p-rail-ink:#ffffff; --p-rail-line:#0d0d0d; --p-act:#6950f3;
  --p-card:#ffffff; --p-btn:#ffffff; --p-grid:#f3f3f4; --p-axis:#879ac0;
  --p-av-bg:#ebf8fe; --p-av-ink:#0075a8;
  --p-green:#2c7016; --p-line-green:#00a36d; --p-appt:#a5dff8; --p-appt-ink:#0d0d0d;
  --p-hatch:#e9e9e9; --p-hatch-bg:#f2f2f2; --p-tip:#0d0d0d; --p-tip-ink:#fff;
  --p-row-hover:#f9f9f9; --p-past:#bfbfbf; --p-mbg:#f5f5f5; --p-dr-sh:0 8px 32px 0 rgba(19,19,19,.16),0 -1px 0 0 #e5e5e5;
  /* restyle v3 rail (owner's reference): dark rail, soft tiles, white active tile, orange-red count badge */
  --p-rail:#1d1a21; --p-rail-ink:#e9e7ee; --p-rail-tile:rgba(255,255,255,.07); --p-rail-tile-h:rgba(255,255,255,.14); --p-rail-edge:rgba(255,255,255,.04);
  --p-rail-act:#ffffff; --p-rail-act-ink:#0d0d0d; --p-rail-act-l:#ffffff; --p-rail-mk:#8880ff; --p-rail-ring:#b0b1fd;
  --p-rail-sh:0 1px 0 rgba(13,13,13,.04),0 18px 40px -22px rgba(13,13,13,.55); --p-badge:#c8391a; --p-badge-ink:#ffffff;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --p-rail:#0d0d0d; --p-rail-ink:#f5f5f5; --p-rail-line:#333333; --p-card:#181818; --p-btn:#181818; --p-grid:#818282; --p-axis:#877d5f;
  --p-av-bg:#022231; --p-av-ink:#00a0e5; --p-green:#2c7016; --p-line-green:#00a36d; --p-appt:#61b4d2; --p-appt-ink:#0d0d0d;
  --p-hatch:#2f2f2f; --p-hatch-bg:#262626; --p-tip:#f5f5f5; --p-tip-ink:#0d0d0d; --p-row-hover:#181818; --p-past:#626262; --p-mbg:#0d0d0d;
  --p-dr-sh:0 8px 32px 0 rgba(0,0,0,.5),0 -1px 0 0 #333333;
  --p-rail:#1f1d25; --p-rail-ink:#e9e7ee; --p-rail-tile:rgba(255,255,255,.07); --p-rail-tile-h:rgba(255,255,255,.14); --p-rail-edge:rgba(255,255,255,.05);
  --p-rail-act:#f5f5f5; --p-rail-act-ink:#0d0d0d; --p-rail-act-l:#f5f5f5; --p-rail-mk:#8880ff; --p-rail-ring:#b0b1fd;
  --p-rail-sh:0 0 0 1px rgba(255,255,255,.06),0 18px 40px -22px rgba(0,0,0,.8); --p-badge:#d4401f; --p-badge-ink:#ffffff;
}}
:root[data-theme="dark"]{
  --p-rail:#0d0d0d; --p-rail-ink:#f5f5f5; --p-rail-line:#333333; --p-card:#181818; --p-btn:#181818; --p-grid:#818282; --p-axis:#877d5f;
  --p-av-bg:#022231; --p-av-ink:#00a0e5; --p-green:#2c7016; --p-line-green:#00a36d; --p-appt:#61b4d2; --p-appt-ink:#0d0d0d;
  --p-hatch:#2f2f2f; --p-hatch-bg:#262626; --p-tip:#f5f5f5; --p-tip-ink:#0d0d0d; --p-row-hover:#181818; --p-past:#626262; --p-mbg:#0d0d0d;
  --p-dr-sh:0 8px 32px 0 rgba(0,0,0,.5),0 -1px 0 0 #333333;
  --p-rail:#1f1d25; --p-rail-ink:#e9e7ee; --p-rail-tile:rgba(255,255,255,.07); --p-rail-tile-h:rgba(255,255,255,.14); --p-rail-edge:rgba(255,255,255,.05);
  --p-rail-act:#f5f5f5; --p-rail-act-ink:#0d0d0d; --p-rail-act-l:#f5f5f5; --p-rail-mk:#8880ff; --p-rail-ring:#b0b1fd;
  --p-rail-sh:0 0 0 1px rgba(255,255,255,.06),0 18px 40px -22px rgba(0,0,0,.8); --p-badge:#d4401f; --p-badge-ink:#ffffff;
}

/* ---------- shell ---------- */
[data-app="panel"],[data-app="papp"]{font-size:15px;line-height:20px}
.p-app{display:flex;flex-direction:column;height:calc(100vh - var(--hub-h));height:calc(100dvh - var(--hub-h));background:var(--bg);color:var(--ink);font-size:15px;line-height:20px;overflow:hidden;position:relative}
.screen .p-app{height:100%}
/* web panel: drawers / sheets / checkout start under the demo switcher bar (it sits above them), like the app itself */
[data-app="panel"] .ov{top:var(--hub-h)}
.p-app svg.i{width:24px;height:24px}
.p-setup-m{display:none}
.p-top{flex:none;height:65px;display:flex;align-items:center;justify-content:space-between;padding:8px 16px 8px 32px;border-bottom:1px solid var(--line);background:var(--bg)}
.p-top .logo{height:22px;font-size:27px;font-weight:800}
.p-top-acts{display:flex;align-items:center}
.p-setup{display:inline-flex;align-items:center;gap:8px;height:40px;padding:8px 12px;border-radius:999px;background:var(--p-act);color:#fff;font-size:15px;font-weight:600;line-height:20px}
.p-setup svg.i{width:24px;height:24px}
.p-tb{position:relative;width:44px;height:44px;border-radius:8px;display:grid;place-items:center;color:var(--ink)}
.p-tb:hover{background:var(--bg-3)}
.p-tb svg.i{width:28px;height:28px}
.p-tb .p-dot{position:absolute;top:9px;left:7px;width:8px;height:8px;border-radius:999px;background:var(--brand);box-shadow:0 0 0 2px var(--bg)}
.p-av{width:48px;height:48px;border-radius:999px;background:var(--p-av-bg);color:var(--p-av-ink);border:1px solid var(--bg);display:grid;place-items:center;font-size:16px;font-weight:600;line-height:24px;margin-right:8px;overflow:hidden;flex:none}
.p-av img{width:100%;height:100%;object-fit:cover}
.p-body{flex:1;min-height:0;display:flex}
/* ---- side rail — restyle v3 (owner's reference sidebar-ref-1405-07-26): a narrow dark rail with rounded corners floating
   12px from the page edge (RTL: right), brand mark on top, every item an icon in a soft rounded tile, active = white tile
   with a dark icon, orange-red count badge, settings / help / expand control at the bottom, tooltip on hover + focus. ---- */
.p-app{--p-rail-w:64px;--p-rail-in:12px;--p-rail-sp:calc(var(--p-rail-w) + var(--p-rail-in) * 2)}
.p-app.p-rail-x{--p-rail-w:212px}
.p-top,.p-body{margin-right:var(--p-rail-sp);transition:margin-right var(--d-3) var(--ease)}
.p-rail{position:absolute;top:var(--p-rail-in);bottom:var(--p-rail-in);right:var(--p-rail-in);z-index:40;width:var(--p-rail-w);
  display:flex;flex-direction:column;gap:6px;padding:14px 10px 10px;border-radius:22px;background:var(--p-rail);color:var(--p-rail-ink);
  box-shadow:var(--p-rail-sh);transition:width var(--d-3) var(--ease)}
.p-rail-g{display:flex;flex-direction:column;gap:8px}
.p-rail-end{margin-top:auto;padding-top:8px}
.p-rail-mk{display:flex;align-items:center;gap:12px;height:44px;margin-bottom:10px;border-radius:12px;color:var(--p-rail-mk)}
.p-rail-mk .p-rt{background:none!important;box-shadow:none!important}
.p-rail-mk svg.i{width:28px!important;height:28px!important}
.p-rail-mk .p-rl{font-size:20px;font-weight:800;color:var(--p-rail-ink)}
.p-rw{position:relative}
.p-ri{position:relative;display:flex;align-items:center;gap:12px;width:100%;height:44px;border-radius:12px;color:var(--p-rail-ink);text-align:right}
.p-rt{position:relative;flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--p-rail-tile);
  box-shadow:inset 0 0 0 1px var(--p-rail-edge);transition:background-color var(--d-2) var(--ease),color var(--d-2) var(--ease),transform var(--d-2) var(--ease)}
.p-ri svg.i,.p-rail-mk svg.i{width:22px;height:22px}
.p-rl{font-size:14px;font-weight:600;line-height:20px;white-space:nowrap;overflow:hidden;opacity:0;width:0;transition:opacity var(--d-2) var(--ease)}
.p-ri:hover .p-rt{background:var(--p-rail-tile-h)}
.p-ri:active .p-rt{transform:scale(.96)}
.p-ri[aria-current="page"] .p-rt{background:var(--p-rail-act);color:var(--p-rail-act-ink);box-shadow:0 6px 16px -6px rgba(0,0,0,.55)}
.p-ri[aria-current="page"] .p-rl{color:var(--p-rail-act-l)}
.p-ri:focus-visible{outline:0}
.p-ri:focus-visible .p-rt{box-shadow:0 0 0 2px var(--p-rail),0 0 0 4px var(--p-rail-ring)}
.p-rc{position:absolute;top:-5px;left:-5px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--p-badge);color:var(--p-badge-ink);
  font:700 11px/20px var(--f);font-style:normal;text-align:center;box-shadow:0 0 0 2px var(--p-rail)}
.p-rx svg.i{transition:transform var(--d-3) var(--ease)}
.p-app.p-rail-x .p-rx svg.i{transform:scaleX(-1)}
/* tooltip with the item's name (hover + keyboard focus), on the page side of the rail */
.p-ri::after{content:attr(data-tip);position:absolute;right:calc(100% + 14px);top:50%;transform:translate(4px,-50%);white-space:nowrap;background:var(--p-tip);
  color:var(--p-tip-ink);font-size:13px;font-weight:600;line-height:16px;padding:7px 11px;border-radius:9px;box-shadow:var(--sh-pop-2);opacity:0;visibility:hidden;
  pointer-events:none;transition:opacity var(--d-1) var(--ease),transform var(--d-1) var(--ease),visibility 0s var(--d-1);z-index:80}
.p-ri:hover::after,.p-ri:focus-visible::after{opacity:1;visibility:visible;transform:translate(0,-50%);transition-delay:0s}
/* a section item with a sub-nav shows Fresha's flyout instead of the tooltip when the sub-nav is closed / absent */
.p-app.p-sub-closed .p-rw.has-fly:is(:hover,:focus-within) .p-ri::after,.p-app:not(.p-has-sub) .p-rw.has-fly:is(:hover,:focus-within) .p-ri::after{opacity:0;visibility:hidden}
.p-fly{position:absolute;right:calc(100% + 14px);top:-8px;min-width:232px;background:var(--bg);color:var(--ink);border-radius:var(--r-card);box-shadow:var(--sh-pop-2);
  padding:8px;display:none;z-index:70;text-align:right;animation:p-fly-in var(--d-2) var(--ease)}
.p-fly::before{content:"";position:absolute;top:0;bottom:0;right:-16px;width:16px}
.p-app.p-sub-closed .p-rw.has-fly:is(:hover,:focus-within) .p-fly,.p-app:not(.p-has-sub) .p-rw.has-fly:is(:hover,:focus-within) .p-fly{display:block}
@keyframes p-fly-in{from{opacity:0;transform:translateX(6px)}}
.p-fly b{display:block;font-size:13px;font-weight:600;color:var(--ink-2);padding:8px 12px 4px}
.p-fly a{display:block;padding:9px 12px;border-radius:var(--r-ctl);font-size:15px;font-weight:500;line-height:20px;transition:background-color var(--d-1)}
.p-fly a:hover,.p-fly a:focus-visible{background:var(--bg-2)}
.p-fly hr{border:0;border-top:1px solid var(--line);margin:6px 4px}
/* expanded rail: the same tiles with their labels */
.p-app.p-rail-x .p-rl{opacity:1;width:auto}
.p-app.p-rail-x .p-ri::after{display:none}
.p-app.p-rail-x .p-ri:hover{background:var(--p-rail-tile)}
.p-app.p-rail-x .p-ri[aria-current="page"]{background:var(--p-rail-tile)}
/* short windows (landscape, small laptops): smaller tiles; the rail scrolls when it still does not fit */
@media (max-height:700px){
  .p-rail{padding:10px 8px 8px;gap:4px}.p-app{--p-rail-w:56px}.p-app.p-rail-x{--p-rail-w:204px}
  .p-rail-g{gap:4px}.p-rail-mk{margin-bottom:4px}
  .p-ri,.p-rt,.p-rail-mk{height:38px}.p-rt{width:38px;border-radius:11px}
}
@media (max-height:560px){.p-rail{overflow-y:auto;scrollbar-width:none}.p-rail::-webkit-scrollbar{display:none}.p-fly,.p-ri::after{display:none!important}}
.p-sub{flex:none;position:relative;width:230px;padding-left:22px}
.p-sub-in{height:100%;width:208px;background:var(--bg);border-left:1px solid var(--line);padding:24px 8px 0;overflow-y:auto}
.p-sub-g+.p-sub-g{border-top:1px solid var(--line);margin:16px 12px 0;padding-top:16px}
.p-sub-g+.p-sub-g .p-sub-t,.p-sub-g+.p-sub-g .p-sub-a{margin-right:-12px;margin-left:-12px}
.p-sub-t{font-size:17px;font-weight:600;line-height:24px;padding:0 16px;margin-bottom:8px}
.p-sub-a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-radius:8px;font-size:15px;font-weight:500;line-height:20px}
.p-sub-a:hover{background:var(--bg-2)}
.p-sub-a[aria-current="page"]{background:var(--brand-soft)}
.p-collapse{position:absolute;left:4px;top:18px;width:36px;height:36px;border-radius:999px;background:var(--p-btn);border:1px solid var(--line-2);display:grid;place-items:center;z-index:5}
.p-collapse svg.i{width:20px;height:20px}
.p-app.p-sub-closed .p-sub{width:0;padding:0}
.p-app.p-sub-closed .p-sub-in{display:none}
.p-app.p-sub-closed .p-collapse{left:-18px}
.p-app.p-sub-closed .p-collapse svg{transform:scaleX(-1)}
.p-main{flex:1;min-width:0;overflow-y:auto;overflow-x:hidden;position:relative;background:var(--bg)}
.p-main.grey{background:var(--bg-2)}
.p-page{padding:32px}
.p-mtop,.p-tabbar{display:none}

/* ---------- buttons, pills ---------- */
.p-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 19px;border-radius:999px;border:1px solid var(--line-2);background:var(--p-btn);color:var(--ink);font-size:17px;font-weight:600;line-height:24px;white-space:nowrap;flex:none}
.p-btn svg.i{width:24px;height:24px}
.p-btn.pri{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.p-btn.ghost{border-color:transparent;background:transparent}
.p-btn.s{height:36px;padding:0 15px;font-size:15px;font-weight:500;line-height:20px}
.p-btn.s svg.i{width:20px;height:20px}
.p-btn.ic{padding:0;width:48px}
.p-btn.s.ic{width:36px}
.p-btn.sq{width:52px;padding:0}
.p-btn:hover{background:var(--bg-2)}
.p-btn.pri:hover{background:var(--ink);opacity:.9}
.p-btn.ghost:hover{background:var(--bg-3)}
.p-grp{display:inline-flex}
.p-grp>.p-btn{border-radius:0;margin-right:-1px}
.p-grp>.p-btn:first-child{border-radius:0 999px 999px 0;margin-right:0}
.p-grp>.p-btn:last-child{border-radius:999px 0 0 999px}
.p-grp>.p-btn.nav{width:40px;padding:0 11px 0 7px}
.p-grp>.p-btn.nav:last-child{padding:0 7px 0 11px}
.p-grp>.p-btn.nav svg.i{width:20px;height:20px}
.p-link{color:var(--brand)}
.p-badge{display:inline-flex;align-items:center;height:24px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:500;line-height:16px;background:var(--blue-soft);color:var(--blue);white-space:nowrap}
.p-badge.ok{background:var(--ok-soft);color:var(--ok)}
.p-badge.bad{background:var(--bad-soft);color:var(--bad)}
.p-badge.gold{background:var(--warn-soft);color:var(--warn)}
.p-badge.muted{background:var(--bg-3);color:var(--ink-2)}

/* ---------- page header (pHead) ---------- */
.p-head{display:flex;gap:12px;align-items:flex-start;margin-bottom:32px;position:relative}
.p-head-tx{flex:1;min-width:0}
.p-head h1{font-size:28px;font-weight:600;line-height:36px;display:flex;align-items:center;gap:8px}
.p-head h1 .p-cnt{display:inline-grid;place-items:center;min-width:28px;height:28px;padding:0 8px;border-radius:999px;background:var(--bg-3);font-size:15px;font-weight:600;line-height:20px}
.p-head p{font-size:17px;line-height:24px;color:var(--ink-2)}
.p-head-acts{display:flex;gap:12px 8px;align-items:center;flex:none}
.p-head-m{display:none}
.p-tabs{display:flex;gap:4px;margin:0 0 24px;list-style:none;padding:0}
.p-tabs button{height:36px;padding:0 16px;border-radius:999px;font-size:15px;font-weight:600;line-height:20px;white-space:nowrap}
.p-tabs button:hover{background:var(--bg-2)}
.p-tabs button[aria-selected="true"]{background:var(--ink);color:var(--on-ink)}

/* ---------- toolbar: search + filters (pBar) ---------- */
.p-bar{background:var(--bg-4);border-radius:12px;padding:16px;display:flex;align-items:center;gap:12px;margin-bottom:16px}
.p-bar-end{margin-right:auto;display:flex;gap:12px}
.p-search{display:flex;align-items:center;width:256px;height:36px;border:1px solid var(--line-2);border-radius:999px;background:var(--p-btn);flex:none}
.p-search svg.i{width:20px;height:20px;color:var(--ink-2);margin:0 12px 0 0;flex:none}
.p-search input{flex:1;min-width:0;border:0;background:none;outline:0;font-size:15px;padding:0 8px 0 16px;height:34px}
.p-search input::placeholder{color:var(--ink-3)}
.p-search-m{display:none!important}

/* ---------- table (pTable) ---------- */
.p-tbl-w{overflow-x:auto;border-bottom:1px solid var(--line)}
.p-tbl{width:100%;border-collapse:collapse;font-size:15px;line-height:20px}
.p-tbl th{text-align:right;font-weight:600;padding:16px;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--bg);min-width:180px;height:53px}
.p-tbl th.sort{padding:4px}
.p-tbl th.sort>span{display:inline-flex;align-items:center;gap:8px;padding:12px;border-radius:4px}
.p-tbl th.sort svg.i{width:16px;height:16px}
.p-tbl td{padding:1px 16px;height:59px;border-bottom:1px solid var(--line);background:var(--bg);white-space:nowrap}
.p-tbl tbody tr:last-child td{border-bottom:0}
.p-tbl th:first-child,.p-tbl td:first-child{border-left:1px solid var(--line);position:sticky;right:0;z-index:1}
.p-tbl tbody tr:hover td{background:var(--p-row-hover)}
.p-tbl a,.p-tbl .lk{color:var(--brand)}
.p-tbl .num{text-align:left}
.p-foot{text-align:center;color:var(--ink-2);padding:24px 0 8px;font-size:15px}
.p-foot b{color:var(--ink);font-weight:600}

/* ---------- empty state (pEmpty) + cards ---------- */
.p-empty{border:1px solid var(--line);border-radius:8px;padding:64px 24px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;background:var(--bg)}
.p-empty.bare{border:0;padding:64px 24px;background:none}
.p-empty-ic{width:56px;height:56px;margin-bottom:12px;display:grid;place-items:center;color:var(--brand)}
.p-empty-ic svg.i{width:48px;height:48px}
.p-empty b{font-size:20px;font-weight:600;line-height:28px}
.p-empty p{color:var(--ink-2);font-size:15px;line-height:20px;max-width:440px}
.p-empty .p-btn{margin-top:20px}
.p-card{background:var(--p-card);border-radius:12px;box-shadow:inset 0 0 0 1px var(--line)}

/* ---------- menus / popovers / drawers ---------- */
.p-pop{position:absolute;z-index:200;background:var(--bg);border-radius:12px;box-shadow:var(--sh-pop);padding:8px;min-width:220px;color:var(--ink)}
.p-pop .it{display:flex;align-items:center;gap:12px;width:100%;padding:12px;border-radius:8px;font-size:15px;font-weight:500;line-height:20px;text-align:right}
.p-pop .it:hover{background:var(--bg-2)}
.p-pop .it.bad{color:var(--bad)}
.p-pop hr{border:0;border-top:1px solid var(--line);margin:8px 0}
.p-pop .it .ck{margin-right:auto;color:var(--ink)}
.p-pop-scrim{position:fixed;inset:0;z-index:150}
.screen .p-pop-scrim{position:absolute}
.ov.p-dr{display:block;background:transparent;animation:none}
.ov.p-dr .mdl{position:absolute;top:0;bottom:0;left:0;width:min(480px,100%);border-radius:0;display:flex;flex-direction:column;box-shadow:var(--p-dr-sh);border-right:1px solid var(--line);animation:p-slide .22s ease;overflow:visible}
.p-dr-x{position:absolute;top:12px;left:calc(100% + 12px);width:48px;height:48px;border-radius:999px;border:1px solid var(--line-2);background:var(--p-btn);box-shadow:0 8px 32px 0 rgba(19,19,19,.16);display:grid;place-items:center}
.p-dr-x svg.i{width:24px;height:24px}
.ov.p-dr.wide .mdl{width:min(1100px,100%)}
.ov.p-dr.full .mdl{width:100%;animation:fq-fade .2s ease}
@keyframes p-slide{from{transform:translateX(-40px);opacity:0}}
.p-dr-h{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:32px 32px 0;flex:none}
.p-dr-h h2{font-size:28px;font-weight:600;line-height:36px}
.p-dr-h p{font-size:15px;color:var(--ink-2)}
.p-dr-b{flex:1;overflow-y:auto;padding:32px}
.p-dr-f{display:flex;gap:16px;padding:16px 32px;box-shadow:0 -1px 0 0 var(--line);flex:none}
.p-dr-f .p-btn{flex:1}
.ov.p-dlg .mdl{width:min(560px,calc(100% - 32px));border-radius:16px;box-shadow:var(--sh-pop)}
.p-field{display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
.p-field>label{font-size:15px;font-weight:600;line-height:20px}
.p-in{height:48px;border:1px solid var(--line-2);border-radius:8px;padding:0 16px;background:var(--bg);font-size:15px;width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;outline:0}
.p-in:focus{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
textarea.p-in{height:96px;padding:12px 16px;resize:vertical}
.p-row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.p-sec-t{font-size:20px;font-weight:600;line-height:28px;margin:8px 0 16px}
.p-li{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.p-li:last-child{border-bottom:0}
.p-li .tx{flex:1;min-width:0}
.p-li b{display:block;font-size:15px;font-weight:600}
.p-li small{display:block;font-size:13px;color:var(--ink-2);line-height:18px}
.p-sw{width:44px;height:24px;border-radius:999px;background:var(--line-2);position:relative;flex:none}
.p-sw::after{content:"";position:absolute;top:2px;right:2px;width:20px;height:20px;border-radius:50%;background:#fff;transition:right .15s}
.p-sw[aria-checked="true"]{background:var(--brand)}
.p-sw[aria-checked="true"]::after{right:22px}
.p-chk{width:20px;height:20px;border-radius:4px;border:1px solid var(--line-2);display:grid;place-items:center;flex:none;color:#fff}
.p-chk[aria-checked="true"]{background:var(--brand);border-color:var(--brand)}
.p-chk svg.i{width:14px!important;height:14px!important}

/* ---------- mobile (Fresha's mobile web = business phone app) ---------- */
@container (max-width:600px){
  .p-app{background:var(--p-mbg)}
  .p-setup-m{display:flex;flex:none;align-items:center;justify-content:space-between;gap:8px;height:48px;padding:12px 20px;background:var(--p-act);color:#fff;font-size:15px;font-weight:600;line-height:20px;width:100%}
  .p-setup-m>span{display:flex;align-items:center;gap:8px}
  .p-setup-m svg.i{width:24px;height:24px}
  .p-top,.p-rail,.p-sub{display:none}
  .p-top,.p-body{margin-right:0}
  .p-mtop{display:flex;flex:none;align-items:center;gap:16px;height:72px;padding:0 20px;background:var(--p-mbg);position:sticky;top:0;z-index:20}
  .p-mback{width:48px;height:48px;margin:-12px;border-radius:999px;display:grid;place-items:center;flex:none}
  .p-mtop .p-mt{flex:1;font-size:20px;font-weight:600;line-height:28px;opacity:0}
  .p-main,.p-main.grey{background:var(--p-mbg)}
  .p-app.white .p-main,.p-app.white .p-mtop{background:var(--bg)}
  .p-page{padding:0 20px 24px}
  .p-tabbar{display:block}                 /* shared qTabBar (ui.css); the raised «+» overlaps the page bottom */
  .p-main{padding-bottom:var(--q-fab-rise)}
  .p-head{margin-bottom:24px;flex-direction:column}
  .p-head p{font-size:15px;line-height:20px}
  .p-head-acts{display:none}
  .p-head-m{display:flex;gap:8px;position:absolute;top:-60px;left:0;z-index:21}
  .p-head-m .p-btn{height:36px;padding:0 15px;font-size:15px;font-weight:500;line-height:20px}
  .p-head-m .p-btn svg.i{width:20px;height:20px}
  .p-head-m .p-btn.ic{width:36px;padding:0}
  .p-bar{background:none;padding:0;border-radius:0;margin-bottom:16px;gap:12px}
  .p-bar .p-search{display:none}
  .p-bar .p-search-m{display:inline-flex!important}
  .p-bar.srch-on .p-search{display:flex;flex:1 1 100%;width:auto}
  .p-bar.srch-on .p-search-m{display:none!important}
  .p-bar .p-bar-end{display:none}
  .p-bar .p-lbl-d{display:none}
  .p-tbl th{min-width:110px}
  .p-empty{border-radius:12px}
  .ov.p-dr .mdl{width:100%}
  .p-dr-h,.p-dr-b,.p-dr-f{padding-right:20px;padding-left:20px}
}
/* screenshots (#….bare): headless Chrome's viewport is ~95px shorter than the captured window; keep Fresha's frame height */
html.bare .p-app{height:max(100dvh,900px)}
@media (max-width:600px){html.bare .p-app{height:max(100dvh,844px)}}
@container (max-width:600px){
  .p-dr-x{right:auto;left:8px;top:8px;box-shadow:none;border:0;background:transparent}
  .p-dr-h{padding-top:56px}
}

/* ---------- calendar ---------- */
.p-calwrap{position:relative}
.p-cal{display:flex;flex-direction:column;height:100%;position:relative;background:var(--bg)}
.p-main:has(.p-cal){overflow:hidden;display:flex;flex-direction:column}
.p-main>.p-cal{flex:1;min-height:0;height:auto}
.p-cal-tb{flex:none;display:flex;justify-content:space-between;gap:8px;padding:16px;background:var(--bg-4);border-bottom:1px solid var(--line)}
.p-cal-tg{display:flex;gap:8px;align-items:center}
.p-cal-date{min-width:175px;border-radius:0!important}
.p-cal.v-week .p-cal-date,.p-cal.v-3day .p-cal-date,.p-cal.v-month .p-cal-date{min-width:175px}
.p-cal-sc{flex:1;min-height:0;overflow:auto;position:relative;overscroll-behavior:contain}
.p-cg{position:relative;min-width:100%;width:max-content}
.p-cg-h{position:sticky;top:0;z-index:6;display:flex;background:var(--p-card);box-shadow:0 6px 4px 0 rgba(13,22,25,.06);border-bottom:1px solid var(--line)}
.p-cg.day .p-cg-h{height:110px}
.p-cg.multi .p-cg-h{height:70px}
.p-cg-c{width:48px;flex:none;position:sticky;right:0;z-index:2;background:var(--p-card)}
.p-cg-m{flex:1 0 0;min-width:180px;display:flex;flex-direction:column;align-items:center;gap:8px;padding-top:15px;color:var(--ink)}
.p-cav{width:56px;height:56px;border-radius:999px;background:var(--p-av-bg);color:var(--p-av-ink);display:grid;place-items:center;overflow:hidden;box-shadow:0 0 0 1px var(--bg),0 0 0 3px var(--p-appt);font-size:17px;font-weight:600;line-height:24px;flex:none}
.p-cav img{width:100%;height:100%;object-fit:cover}
.p-cav.s{width:40px;height:40px;font-size:13px}
.p-cg-m .nm{display:flex;align-items:center;font-size:13px;font-weight:600;line-height:16px;padding:0 4px;margin-right:24px}
.p-cg-m .nm svg.i{width:24px;height:24px;opacity:0}
.p-cg-m:hover .nm svg.i{opacity:1}
.p-cg-b{display:flex;position:relative;height:calc(24 * var(--pch,96px))}
.p-cg-t{width:48px;flex:none;position:sticky;right:0;z-index:5;background:var(--p-card);border-left:1px solid var(--line)}
.p-hr{height:var(--pch,96px);position:relative}
.p-hr span{position:absolute;top:7px;left:6px;font-size:13px;font-weight:600;line-height:11px;font-variant-numeric:tabular-nums}
.p-hr:first-child span{top:15px}
.p-nowb{position:absolute;right:0;width:48px;height:20px;margin-top:-10px;border:2px solid var(--bad);border-radius:10px;background:var(--p-card);color:var(--bad);font-size:13px;font-weight:600;line-height:11px;display:grid;place-items:center;z-index:2}
.p-col{flex:1 0 0;min-width:180px;position:relative;border-left:1px solid var(--line);cursor:pointer;
  background:repeating-linear-gradient(-45deg,transparent 0,transparent 2.49px,color-mix(in srgb,var(--line) 70%,transparent) 2.99px,color-mix(in srgb,var(--line) 70%,transparent) 5.49px,transparent 5.99px,transparent 8.49px),var(--p-hatch-bg)}
.p-col::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(to bottom,var(--line) 0,var(--line) 1px,transparent 1px,transparent var(--pch,96px));pointer-events:none;z-index:1}
.p-open{position:absolute;right:0;left:0;background:var(--p-card)}
.p-open::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(to bottom,transparent 0,transparent 23px,color-mix(in srgb,var(--line) 55%,transparent) 23px,color-mix(in srgb,var(--line) 55%,transparent) 24px);background-position:0 1px}
.p-col:hover{background-color:var(--p-hatch-bg)}
.p-ap{position:absolute;right:1px;left:1px;margin-top:1px;z-index:2;background:var(--p-appt);color:var(--p-appt-ink);border-radius:4px;padding:3px 8px 3px 4px;text-align:right;overflow:hidden;display:flex;flex-direction:column;align-items:stretch;font-size:13px;line-height:16px}
.p-ap .l1{display:flex;gap:4px;align-items:center;white-space:nowrap;overflow:hidden}
.p-ap strong{font-weight:600}
.p-ap .l2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p-ap:hover{filter:brightness(.97)}
.p-ap.st-done{opacity:.75}
.p-ap.p-blk{background:var(--bg-3);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}   /* blocked time */
.p-nowall{position:absolute;right:48px;left:0;height:2px;margin-top:-1px;background:var(--bad);z-index:4;pointer-events:none}
.p-now{position:absolute;right:0;left:0;height:2px;margin-top:-1px;background:var(--bad);z-index:4;pointer-events:none}
/* week / 3-day */
.p-cg-mc{width:81px;flex:none;position:sticky;right:0;z-index:5;background:var(--p-card)}
.p-cg-b .p-cg-mc{background:var(--bg-4);border-left:1px solid var(--line);padding:4px}
.p-cg.multi .p-cg-h .p-cg-c,.p-cg.multi .p-cg-h .p-cg-mc{right:0}
.p-cg.multi .p-cg-h .p-cg-c{right:81px}
.p-cg.multi .p-cg-t{right:81px}
.p-cg-mm{width:72px;display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px 4px 0;font-size:13px;font-weight:600;line-height:16px;text-align:center;position:sticky;top:78px;color:var(--ink)}
.p-cg-mm .p-cav{box-shadow:0 0 0 1px var(--bg)}
.p-cg-d{flex:1 0 0;min-width:120px;display:flex;align-items:center;gap:4px;padding:4px 8px 4px 4px;margin:4px 0;border-radius:12px;font-size:15px;font-weight:500;line-height:20px;color:var(--ink)}
.p-cg-d:hover{background:var(--bg-3)}
.p-cg-d b{padding:4px 8px;font-size:17px;font-weight:500;line-height:24px}
.p-cg-d .ws{display:none}
.p-cg-d.past{color:var(--p-past)}
.p-cg-d.today{color:var(--brand)}
.p-cg-d.today b{width:40px;height:40px;padding:0;border-radius:999px;background:var(--p-act);color:#fff;display:grid;place-items:center;font-weight:600}
.p-cg.multi .p-col,.p-cg.multi .p-cg-d{min-width:120px}
/* month */
.p-mo{min-height:100%;display:flex;flex-direction:column;background:repeating-linear-gradient(-45deg,transparent 0,transparent 2.49px,color-mix(in srgb,var(--line) 70%,transparent) 2.99px,color-mix(in srgb,var(--line) 70%,transparent) 5.49px,transparent 5.99px,transparent 8.49px),var(--p-hatch-bg)}
.p-mo-h{position:sticky;top:0;z-index:3;display:grid;grid-template-columns:repeat(7,1fr);background:var(--p-card);box-shadow:0 6px 4px 0 rgba(13,22,25,.06)}
.p-mo-h div{border-bottom:1px solid var(--line);padding:12px;font-size:15px;font-weight:500;line-height:20px}
.p-mo-g{flex:1;display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:minmax(144px,1fr)}
.p-mo-d{padding:6px;display:flex;flex-direction:column;gap:4px;border-left:1px solid var(--line);border-bottom:1px solid var(--line);cursor:pointer;min-width:0}
.p-mo-d.on{background:var(--p-card)}
.p-mo-d.out{background:transparent}
.p-mo-d:hover{box-shadow:inset 0 0 0 1px var(--brand);background:var(--brand-soft)}
.p-mo-d>p{font-size:13px;font-weight:600;line-height:20px;color:var(--ink)}
.p-mo-d.out>p,.p-mo-d:not(.on)>p{color:var(--ink-2)}
.p-mo-d.today>p span{display:inline-grid;place-items:center;min-width:26px;height:20px;padding:0 6px;border-radius:999px;background:var(--p-act);color:#fff}
.p-mo-a{display:flex;gap:4px;align-items:center;padding:4px;border-radius:4px;background:var(--p-appt);color:var(--p-appt-ink);font-size:13px;line-height:16px;white-space:nowrap;overflow:hidden;text-align:right}
.p-mo-a strong{font-weight:600;overflow:hidden;text-overflow:ellipsis}
.p-mo-more{font-size:13px;color:var(--ink-2);padding:0 4px}
/* add-mode banner (Select a time to book / block) */
.p-cal-mode{position:absolute;top:0;right:0;left:0;height:70px;z-index:120;background:var(--p-act);color:#fff;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 16px;gap:16px}
.p-cal-mode b{font-size:20px;font-weight:600;line-height:28px;text-align:center}
.p-cal-mode .e{display:flex;gap:12px;justify-content:flex-end}
.p-cal-mode .p-btn.inv{background:transparent;border-color:#fff;color:#fff}
.p-cal-mode .p-btn.wht{background:#fff;border-color:#fff;color:#0d0d0d}
.p-cal-modex{width:36px;height:36px;display:grid;place-items:center;color:#fff}
.p-moded .p-top{height:70px;visibility:hidden;border:0}
.p-moded .p-rail{display:none}
.p-moded .p-top,.p-moded .p-body{margin-right:0}
.p-pop .it.cur{background:var(--brand-soft)}
.p-pop .it svg.i{width:20px;height:20px;flex:none}
.p-pop .it{padding:10px 12px}
.p-cal-fab,.p-onb{display:none}
.p-av.s{width:32px;height:32px;font-size:11px;line-height:16px;margin:0;background:var(--brand-soft);color:var(--brand)}
@container (max-width:600px){
  .p-app:has(.p-cal) .p-main{background:var(--bg)}
  .p-cal-tb{display:none}
  .p-cal-mt{background:var(--bg);gap:8px;padding:0 20px}
  .p-cal-mt .p-mback{margin:0 -12px 0 0}
  .p-cal-mdate{flex:1;min-width:0;white-space:nowrap;display:flex;align-items:center;gap:8px;font-size:20px;font-weight:600;line-height:28px;padding:0 12px;color:var(--ink)}
  .p-cal-mdate svg.i{width:20px;height:20px}
  .p-cal-mt .p-tb{width:44px;height:44px}
  .p-cal-mt .p-tb svg.i{width:24px;height:24px}
  .p-cal-mt .p-tb .p-dot{top:8px;left:8px}
  .p-cal-mt .p-av.s{margin-right:8px}
  .p-cg.day .p-cg-h{height:80px}
  .p-cg-m{min-width:calc((100cqw - 48px) / 2);padding-top:12px;gap:6px}
  .p-cg.day .p-cav{width:32px;height:32px;font-size:11px}
  .p-cg-m .nm{font-size:11px;margin-right:0}
  .p-cg-m .nm svg{display:none}
  .p-col{min-width:calc((100cqw - 48px) / 2)}
  .p-cg.multi .p-cg-mc{display:none}
  .p-cg.multi .p-cg-h .p-cg-c,.p-cg.multi .p-cg-t{right:0}
  .p-cg.multi .p-cg-h{height:68px}
  .p-cg.multi .p-col,.p-cg.multi .p-cg-d{min-width:0;flex:1 0 0}
  .p-cg-d{flex-direction:column;justify-content:center;gap:2px;padding:0;margin:0;border-radius:0}
  .p-cg-d b{padding:0;width:28px;height:28px;display:grid;place-items:center;font-size:15px;line-height:20px}
  .p-cg-d.today b{width:28px;height:28px}
  .p-cg-d .wl{display:none}
  .p-cg-d .ws{display:block;font-size:13px;line-height:16px}
  .p-ap{padding:3px 6px 3px 2px}
  .p-ap .l1{flex-direction:column;align-items:flex-start;gap:0}
  .p-mo-h div{padding:8px 2px;font-size:11px;text-align:center}
  .p-mo-g{grid-auto-rows:97px}   /* b-calendar-month@1x: fixed week rows, the month scrolls; a busy day clips */
  .p-mo-a span{display:none}
  .p-mo-d{padding:4px 2px;overflow:hidden}
  .p-mo-d>p{font-size:15px;line-height:20px}
  .p-mo-h div{font-size:13px}
  .p-mo-a{flex:none}
  .p-cal-fab{display:flex;flex-direction:column;gap:8px;position:absolute;left:20px;bottom:20px;z-index:8}
  .p-cal-fab button{width:48px;height:48px;border-radius:999px;background:var(--p-btn);box-shadow:var(--sh-card);display:grid;place-items:center}
  .p-onb{display:block;position:absolute;inset:0;z-index:50;background:rgba(13,13,13,.25)}
  .p-onb-c{position:absolute;bottom:0;right:0;left:0;height:499px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:flex-end;padding:0 20px 32px;pointer-events:none}
  .p-onb-c>*{pointer-events:auto}
  .p-onb-c::before{content:"";position:absolute;inset:auto 0 0 0;height:498px;background:var(--bg);border-radius:32px 32px 0 0;z-index:-1}
  .p-onb-ill{position:relative;width:calc(100% + 40px);height:300px;margin:0 -20px auto;overflow:hidden;border-radius:32px 32px 50% 50%/32px 32px 40px 40px}
  .p-onb-g{position:absolute;inset:0;background:repeating-linear-gradient(to bottom,var(--line) 0 1px,transparent 1px 95px) 0 34px,repeating-linear-gradient(to left,transparent 0 54px,var(--line) 54px 55px,transparent 55px 231px,var(--line) 231px 232px,transparent 232px 400px);opacity:.9}
  .p-onb-t{position:absolute;right:8px;top:34px;display:flex;flex-direction:column;gap:79px;font-size:15px;font-weight:600;z-index:1}
  .p-onb-ap{position:absolute;padding:8px 10px;border-radius:4px;display:flex;flex-direction:column;font-size:15px;line-height:22px;text-align:right}
  .p-onb-ap b{font-size:17px}
  .p-onb-ap.a1{top:44px;left:0;width:150px;height:86px;background:#ffb860}
  .p-onb-ap.a2{top:233px;right:60px;width:166px;height:80px;background:#d9d9d9}
  .p-onb-ap.a3{top:40px;right:60px;width:160px;height:80px;background:#ffb860}
  .p-onb-hand{position:absolute;top:150px;left:50%;transform:translateX(-50%)}
  .p-onb-hand svg.i{width:40px;height:40px}
  .p-onb-new{position:absolute;top:130px;left:6px;width:156px;height:80px;background:var(--p-appt);border-radius:4px;box-shadow:var(--sh-pop);padding:8px;text-align:right;color:#0d0d0d}
  .p-onb-c h3{font-size:24px;font-weight:600;line-height:32px;margin-bottom:8px}
  .p-onb-c p{font-size:17px;line-height:24px;margin-bottom:24px}
  .p-onb-c p b{font-weight:600}
  .p-onb-c .p-btn{height:36px}
  .p-cal-mode{height:56px;grid-template-columns:1fr auto}
  .p-cal-mode .s{display:none}
  .p-cal-mode b{font-size:15px;text-align:right}
  .p-cal-mode .p-btn.inv{display:none}
  .p-moded .p-setup-m{visibility:hidden}
}

/* ---------- overlays ---------- */
.p-dr-ha{display:flex;gap:8px}
.p-dr-b.grey{background:var(--bg-2)}
.p-dr-f .p-btn.fx{flex:none;width:48px;padding:0}
.ov.p-dr.mid .mdl{width:min(640px,100%)}
.ov.p-dr.wide .mdl{width:min(1020px,calc(100% - 72px))}
.ov.p-dr.from-start .mdl{left:auto;right:0;border-right:0;border-left:1px solid var(--line);animation:p-slide2 .22s ease}
.ov.p-dr.from-start .p-dr-x{left:auto;right:calc(100% + 12px)}
@keyframes p-slide2{from{transform:translateX(40px);opacity:0}}
.p-set{display:flex;flex-direction:column;gap:32px}
.p-set-z{display:flex;justify-content:space-between;align-items:center;gap:16px}
.p-set-z span{font-size:17px;font-weight:600;line-height:24px}
.p-set-z output{font-size:15px}
.p-rng{position:relative;height:20px;margin-top:-28px}
.p-rng .t{position:absolute;top:8px;right:0;left:0;height:4px;border-radius:999px;background:rgba(19,19,19,.05)}
.p-rng .f{position:absolute;top:8px;right:0;height:4px;border-radius:999px;background:var(--p-act)}
.p-rng span{position:absolute;top:9px;width:2px;height:2px;border-radius:999px;background:var(--ink-4);margin-right:-1px}
.p-rng b{position:absolute;top:4px;width:12px;height:12px;margin-right:-6px;border-radius:999px;background:var(--p-act)}
.p-set hr{border:0;height:1px;background:var(--line);margin:0}
.p-set-t{display:flex;justify-content:space-between;gap:12px}
.p-set-t span{padding:2px 0}
.p-set-t b{display:block;font-size:15px;font-weight:400;line-height:20px}
.p-set-t small{display:block;font-size:13px;line-height:16px;color:var(--ink-2)}
.p-sw2{width:48px;height:24px;flex:none;border-radius:999px;border:1px solid var(--line-2);background:var(--line-2);padding:2px;display:flex;justify-content:flex-start}
.p-sw2 i{width:18px;height:18px;border-radius:999px;background:#fff;transition:transform .15s}
.p-sw2[aria-checked="true"]{background:var(--p-act);border-color:var(--p-act)}
.p-sw2[aria-checked="true"] i{width:26px;transform:translateX(-18px)}
.p-wl-f{display:flex;justify-content:space-between;gap:8px;padding:24px 32px 0}
.p-utabs{display:flex;gap:24px;padding:24px 32px 0;border-bottom:1px solid var(--line)}
.p-utabs button{display:flex;align-items:center;gap:8px;padding:0 0 12px;font-size:15px;font-weight:600;line-height:20px;border-bottom:3px solid transparent;color:var(--ink)}
.p-utabs button[aria-selected="true"]{border-color:var(--ink)}
.p-utabs i{font-style:normal;font-size:13px;font-weight:500;color:var(--ink-2);background:var(--bg-3);border-radius:999px;min-width:20px;height:20px;display:grid;place-items:center;padding:0 6px}
.p-wl-h{font-size:15px;font-weight:600;margin:4px 0 16px;color:var(--ink-2)}
.p-wl-c{background:var(--p-card);border:1px solid var(--line);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:12px;margin-bottom:16px}
.p-wl-top{display:flex;justify-content:space-between;gap:12px}
.p-wl-top b,.p-wl-s b{display:block;font-size:17px;font-weight:600;line-height:24px}
.p-wl-top small,.p-wl-s small{display:block;color:var(--ink-2);font-size:15px}
.p-wl-av{width:48px;height:48px;border-radius:999px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-weight:600}
.p-wl-when{font-size:15px}
.p-wl-c hr{border:0;border-top:1px solid var(--line);margin:4px 0}
.p-wl-s{display:flex;justify-content:space-between;gap:12px}
.p-wl-c .p-btn{align-self:flex-start}
.p-fl{display:flex;flex-direction:column}
.p-fl-r{display:flex;align-items:center;gap:12px;height:57px;border-bottom:1px solid var(--line);font-size:17px;font-weight:500;line-height:24px;color:var(--ink);text-align:right}
.p-fl-r:last-child{border-bottom:0}
.p-fl-r>svg.i:first-child{width:24px;height:24px}
.p-fl-r p{flex:1}
.p-fl-r .p-link{font-size:15px}
.p-fl-r svg.i:last-child{width:20px;height:20px}
.p-dp{padding:16px}
.p-dp-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.p-dp-h b{font-size:17px;font-weight:600}
.p-dp-g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.p-dp-g span{font-size:13px;color:var(--ink-2);padding:6px 0}
.p-dp-g button{height:40px;border-radius:999px;font-size:15px}
.p-dp-g button:hover{background:var(--bg-2)}
.p-dp-g button.td{color:var(--brand);font-weight:600}
.p-dp-g button.sel{background:var(--p-act);color:#fff}
.p-dp-q{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;border-top:1px solid var(--line);padding-top:12px}
.p-vts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 16px;margin-bottom:24px}
.p-vt{height:108px;border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;font-size:17px;color:var(--ink)}
.p-vt svg.i{width:28px;height:28px}
.p-vt.on{border:2px solid var(--brand)}
.p-burg button{display:flex;align-items:center;gap:8px;width:100%;height:97px;border-top:1px solid var(--line);font-size:17px;color:var(--ink);text-align:right}
.p-burg button span{flex:1}
.p-burg button svg.i{width:24px;height:24px}

/* new appointment / appointment */
.p-na{display:flex;height:100%;min-height:0}
.p-na-cl{width:340px;flex:none;border-left:1px solid var(--line);padding:32px 24px;overflow-y:auto;display:flex;flex-direction:column;gap:4px}
.p-na-cl h3{font-size:20px;font-weight:600;line-height:28px;margin-bottom:12px}
.p-search.wide{width:100%;height:48px;margin-bottom:12px}
.p-search.wide.sq{border-radius:8px;background:var(--bg-2)}
.p-na-row{display:flex;align-items:center;gap:12px;padding:10px 8px;border-radius:8px;text-align:right;color:var(--ink)}
.p-na-row:hover{background:var(--bg-2)}
.p-na-row b{display:block;font-size:15px;font-weight:600}
.p-na-row small{display:block;font-size:13px;color:var(--ink-2)}
.p-na-ic{width:48px;height:48px;border-radius:999px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.p-na-ic.big{width:56px;height:56px}
.p-na-av,.p-ao-av{width:48px;height:48px;border-radius:999px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-weight:600;flex:none;overflow:hidden}
.p-na-m{flex:1;min-width:0;overflow-y:auto;padding:32px}
.p-na-top{display:flex;align-items:center;gap:16px;margin-bottom:24px}
.p-na-date,.p-ao-date{display:inline-flex;align-items:center;gap:8px;font-size:28px;font-weight:600;line-height:36px;color:var(--ink)}
.p-na-rep,.p-ao-rep{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2);font-size:15px}
.p-ao-rep{margin:4px 0 24px}
.p-na-m h2{font-size:20px;font-weight:600;line-height:28px;margin-bottom:16px}
.p-na-svc{display:flex;justify-content:space-between;gap:12px;padding:16px 16px 16px 16px;border-radius:8px;border-right:4px solid var(--p-appt);background:var(--bg-2);margin-bottom:16px}
.p-na-sl b{display:block;font-size:17px;font-weight:600;line-height:24px}
.p-na-sl small{display:block;font-size:15px;color:var(--ink-2)}
.p-na-svc>span{font-weight:600}
.p-na-h3{font-size:17px;font-weight:600;margin:32px 0 8px}
.p-na-sv{display:flex;align-items:center;gap:12px;width:100%;padding:14px 0;border-bottom:1px solid var(--line);text-align:right;color:var(--ink)}
.p-na-sv i{width:4px;align-self:stretch;border-radius:4px;background:var(--p-appt)}
.p-na-sv span{flex:1}
.p-na-sv b{display:block;font-weight:500}
.p-na-sv small{display:block;color:var(--ink-2);font-size:13px}
.p-na-sv em{font-style:normal}
.p-na-tot{flex:1;display:flex;flex-direction:column;justify-content:center}
.p-na-tot small{font-size:13px;color:var(--ink-2)}
.p-na-tot b{font-size:17px;font-weight:600}
.p-dr-f:has(.p-na-tot) .p-btn{flex:none;min-width:140px}
.p-dr-f:has(.p-na-tot) .p-btn.fx{min-width:0}
.p-ao-h{background:var(--p-av-bg);padding:32px 32px 24px;flex:none}
.p-ao-st{margin-bottom:16px}
.p-ao-cl{display:flex;align-items:center;gap:16px}
.p-ao-av{width:64px;height:64px;font-size:20px;background:var(--bg);}
.p-ao-cl h2{font-size:24px;font-weight:600;line-height:32px}
.p-ao-cl small{color:var(--ink-2)}
.p-ao-acts{display:flex;gap:8px;margin-top:16px}
/* full-screen sale */
.ov.p-full{display:block;background:transparent;animation:fq-fade .15s;right:192px}
.ov.p-full .mdl{position:absolute;inset:0;max-height:none;overflow:hidden;background:var(--bg)}
.p-sale-x{position:absolute;top:12px;right:-60px;width:48px;height:48px;border-radius:999px;border:1px solid var(--line-2);background:var(--p-btn);display:grid;place-items:center;z-index:2;box-shadow:0 8px 32px rgba(19,19,19,.16)}
.screen .p-sale-x{right:16px}
.p-sale{display:flex;height:100%;border-right:1px solid var(--line)}
.p-sale-m{flex:1;min-width:0;max-width:768px;padding:32px;overflow-y:auto;border-left:1px solid var(--line)}
.p-sale-k{width:124px;height:20px;border-radius:999px;background:var(--bg-3);color:transparent;font-size:13px;margin-bottom:12px}
.p-sale-m h2{font-size:28px;font-weight:600;line-height:36px;margin-bottom:16px}
.p-sale-t{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:32px 0 44px}
.p-sale-tile{height:96px;border:1px solid var(--line);border-radius:8px;padding:16px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;font-size:17px;color:var(--ink)}
.p-sale-tile svg.i{width:24px;height:24px}
.p-sale-tile:hover{background:var(--bg-2)}
.p-sale-qh{display:flex;justify-content:space-between;margin-bottom:16px}
.p-sale-qh b{font-size:17px;font-weight:600}
.p-sale-q{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.p-sale-qi{height:120px;border-radius:8px;background:var(--bg-2);padding:16px;display:flex;flex-direction:column;align-items:flex-start;text-align:right;color:var(--ink)}
.p-sale-qi b{font-weight:600}
.p-sale-qi small{color:var(--ink-2)}
.p-sale-qi span{margin-top:auto;font-weight:600}
.p-sale-c{width:480px;flex:none;padding:32px;display:flex;flex-direction:column;gap:32px}
.p-sale-cl{display:flex;align-items:center;gap:16px;padding:24px;border-radius:8px;background:var(--bg-2);text-align:right;color:var(--ink)}
.p-sale-cl b{display:block;font-size:17px;font-weight:600}
.p-sale-cl small{display:block;color:var(--ink-2)}
.p-sale-items{flex:1;overflow-y:auto}
.p-sale-it{display:flex;justify-content:space-between;padding:16px;border-right:4px solid var(--p-appt);background:var(--bg-2);border-radius:8px;margin-bottom:8px}
.p-sale-it b{display:block;font-weight:600}
.p-sale-it small{display:block;color:var(--ink-2)}
.p-sale-emp{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:48px 0;color:var(--ink-2)}
.p-sale-emp svg.i{width:48px;height:48px}
.p-sale-emp b{color:var(--ink);font-size:17px}
.p-sale-sum p{display:flex;justify-content:space-between;font-size:15px;padding:4px 0}
.p-sale-sum .tot{font-weight:600;border-top:1px solid var(--line);padding-top:12px;margin-top:8px}
.p-sale-sum .pay{font-size:20px;font-weight:600;padding:8px 0 16px}
.p-sale-f{display:flex;gap:8px}
.p-sale-f .p-btn.pri{flex:1}
.p-sale-f .p-btn.fx{width:48px;padding:0}
/* search panel */
.ov.p-srch-ov{background:transparent;display:block}
.ov.p-srch-ov .mdl{position:absolute;top:16px;left:50%;transform:translateX(-50%);width:min(800px,calc(100% - 32px));border-radius:16px;box-shadow:var(--sh-pop);overflow:hidden}
.p-srch{display:flex;align-items:center;gap:8px;height:64px;padding:0 24px 0 12px;border-bottom:1px solid var(--line)}
.p-srch label{flex:1;display:flex;align-items:center;gap:16px}
.p-srch label svg.i{width:24px;height:24px}
.p-srch input{flex:1;border:0;outline:0;background:none;font-size:17px}
.p-srch input::placeholder{color:var(--ink-3)}
.p-srch-b{height:144px;display:grid;place-items:center;font-size:15px}
.p-srch-b b{font-weight:600}
/* notifications */
.ov.p-dr.p-nt .mdl{width:min(632px,100%)}
.p-nt-w{display:flex;height:100%}
.p-nt-tabs{width:132px;flex:none;border-left:1px solid var(--line);display:flex;flex-direction:column;padding-top:24px;background:var(--bg)}
.p-nt-tabs button{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:8px 16px;margin-bottom:8px;font-size:15px;color:var(--ink-2);border-right:3px solid transparent}
.p-nt-tabs button svg.i{width:22px;height:22px}
.p-nt-tabs button.on{color:var(--brand);border-color:var(--brand)}
.p-nt-m{flex:1;min-width:0;background:var(--bg-2);display:flex;flex-direction:column;overflow:hidden}
.p-nt-b{flex:1;overflow-y:auto;padding:24px 32px}
.p-nt-b h3{font-size:20px;font-weight:600;margin-bottom:16px}
.p-nt-c{display:block;width:100%;background:var(--p-card);border:1px solid var(--line);border-radius:12px;padding:20px 24px;margin-bottom:16px;text-align:right;color:var(--ink)}
.p-nt-ct{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px}
.p-nt-ct b{display:block;font-size:17px;font-weight:600}
.p-nt-ct small{display:block;font-size:13px;color:var(--ink-2)}
.p-nt-av{position:relative;width:48px;height:48px;border-radius:999px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-weight:600;flex:none}
.p-nt-av i{position:absolute;bottom:-4px;left:-4px;width:20px;height:20px;border-radius:999px;background:var(--p-act);color:#fff;display:grid;place-items:center;border:2px solid var(--p-card)}
.p-nt-av i svg.i{width:12px;height:12px}
.p-nt-c p{font-size:15px}
/* avatar menu */
.p-avm{padding:20px}
.p-avm-h{display:flex;align-items:center;gap:16px;margin-bottom:16px}
.p-avm-h .p-av{margin:0;width:56px;height:56px}
.p-avm-h b{display:block;font-size:17px;font-weight:600}
.p-avm-h small{color:var(--ink-2)}
.p-avm-inv{display:flex;align-items:center;gap:12px;width:100%;padding:16px;border-radius:8px;background:linear-gradient(90deg,#0d6e8c,#0a3c66);color:#fff;text-align:right;font-weight:600;font-size:15px;margin-bottom:8px}
.p-avm .it small{color:var(--ink-2);font-size:13px}
@container (max-width:600px){
  .p-na{flex-direction:column;overflow-y:auto}
  .p-na-cl{width:auto;border-left:0;border-bottom:1px solid var(--line);padding:72px 20px 20px;overflow:visible}
  .p-na-m{overflow:visible;padding:20px}
  .ov.p-dr.wide .mdl,.ov.p-dr.p-nt .mdl{width:100%}
  .ov.p-full{right:0}
  .p-sale{flex-direction:column;padding:0;overflow-y:auto;border:0}
  .p-sale-m{border:0;padding:72px 20px 20px;overflow:visible}
  .p-sale-c{width:auto;padding:20px}
  .p-sale-x{right:auto;left:16px}
  .p-sale-t{grid-template-columns:1fr 1fr}
  .p-nt-tabs{width:96px}
  .p-nt-tabs button{padding:8px;font-size:13px}
  .p-nt-b{padding:16px}
  .p-ao-h{padding-top:72px}
}
@container (max-width:600px){.ov.p-dr.from-start .p-dr-x{left:16px;right:auto}}

/* ---------- sales ---------- */
.p-empty{border-radius:12px}
.p-empty .p-btn{margin-top:20px}
.p-gap{height:72px}
.p-ds-bar{margin-bottom:24px}
.p-dgrp .p-btn{border-radius:0}
.p-dgrp .p-btn:first-child{border-radius:0 999px 999px 0}
.p-dgrp .p-btn:last-child{border-radius:999px 0 0 999px}
.p-dgrp .p-btn.nav{width:40px;padding:0}
.p-dgrp .p-btn[disabled]{color:var(--ink-3);cursor:default}
.p-ds{display:flex;gap:24px;align-items:flex-start}
.p-ct{flex:1;min-width:0;background:var(--p-card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.p-ct-t{padding:16px 16px 12px;font-size:20px;font-weight:600;line-height:28px}
.p-ct-w{overflow-x:auto}
.p-ct-tb{width:100%;border-collapse:collapse;font-size:15px;line-height:20px}
.p-ct-tb th{font-weight:600;text-align:left;padding:16px;border-bottom:1px solid var(--line);white-space:nowrap;height:53px}
.p-ct-tb td{text-align:left;padding:0 16px;height:56px;border-bottom:1px solid var(--line);white-space:nowrap}
.p-ct-tb th:first-child,.p-ct-tb td:first-child{text-align:right;padding-right:24px}
.p-ct-tb td b{font-weight:600}
.p-ct-tb tr:last-child td{border-bottom:0}
.p-promo{min-height:100%;display:flex;align-items:center;gap:64px;padding:48px 130px 48px 64px;background:radial-gradient(circle at 0 0,#6ee6d4 0,rgba(110,230,212,.55) 18%,transparent 45%),var(--bg-4)}
.p-promo-tx{flex:1;max-width:509px}
.p-promo-k{font-size:15px;font-weight:600;line-height:20px;color:var(--ok);margin-bottom:16px}
.p-promo h1{font-size:40px;font-weight:700;line-height:52px;margin-bottom:16px}
.p-promo-d{font-size:17px;line-height:24px;margin-bottom:24px}
.p-promo ul{list-style:none;padding:0;margin:0 0 56px;display:flex;flex-direction:column;gap:8px}
.p-promo li{display:flex;gap:12px;align-items:center;font-size:15px}
.p-promo li svg.i{width:20px;height:20px}
.p-promo-b{display:flex;gap:8px;align-items:center}
.p-promo-ph{flex:none;margin-right:auto}
.p-phone{width:264px;height:550px;border-radius:44px;border:8px solid #1d1d1f;box-shadow:0 0 0 2px #8a8a8a,0 30px 60px -20px rgba(0,0,0,.35);background:#f5f5f5;overflow:hidden;color:#0d0d0d}
.p-phone-s{padding:30px 12px 0}
.p-phone h4{font-size:17px;font-weight:700;margin:6px 0 14px}
.p-rg-c{background:#fff;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:4px;font-size:9px;margin-bottom:18px}
.p-rg-ct{display:flex;justify-content:space-between;align-items:center}
.p-rg-open{background:#1f8900;color:#fff;border-radius:999px;padding:2px 9px;font-size:9px}
.p-rg-c b{font-size:19px;font-weight:700}
.p-rg-c small{color:#767676;font-size:8px}
.p-rg-bt{display:flex;gap:6px;margin-top:8px}
.p-rg-bt span{border:1px solid #d3d3d3;border-radius:999px;padding:3px 9px;font-size:9px}
.p-phone h5{font-size:11px;font-weight:700;margin-bottom:8px}
.p-rg-r{display:flex;align-items:center;gap:8px;background:#fff;border-radius:8px;padding:10px;margin-bottom:6px;font-size:10px;font-weight:600}
.p-rg-r span{flex:1}
.p-rg-r i{width:28px;height:28px;border-radius:6px;background:#f2f2f2;display:grid;place-items:center;position:relative}
.p-rg-r i svg.i{width:14px;height:14px}
.p-rg-r i::after{content:"";position:absolute;bottom:-3px;left:-3px;width:10px;height:10px;border-radius:999px;background:#1f8900;border:1.5px solid #fff}
.p-rg-r i.b::after{background:#6950f3}
@container (max-width:600px){
  .p-ds{flex-direction:column}
  .p-ct{width:100%}
  .p-dgrp .p-btn:nth-child(3){font-size:15px}
  .p-promo{flex-direction:column;padding:8px 20px 96px;background:var(--bg);gap:24px}
  .p-promo h1{font-size:28px;line-height:36px}
  .p-promo-k{font-size:13px}
  .p-promo-d{font-size:15px;line-height:20px}
  .p-promo ul{margin-bottom:0}
  .p-promo-b{position:absolute;bottom:0;right:0;left:0;padding:12px 20px;background:var(--bg);z-index:5;flex-direction:row-reverse;justify-content:stretch}
  .p-promo-b .p-btn{flex:1}
  .p-promo-b .p-btn.ghost{border-color:var(--line-2)}
  .p-promo-ph{margin:0 auto}
  .p-app:has(.p-promo) .p-setup-m,.p-app:has(.p-promo) .p-tabbar{display:none}
  .p-app:has(.p-promo) .p-mtop{background:var(--bg)}
}

/* ---------- home dashboard ---------- */
.p-dash{max-width:1088px;margin:0 auto;padding:32px}
.p-dash-t{display:none;font-size:28px;font-weight:600;line-height:36px;margin-bottom:32px}
.p-dash-g{display:grid;grid-template-columns:repeat(2,minmax(0,496px));justify-content:center;gap:16px 32px;align-items:start}
.p-dc{background:var(--p-card);border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);padding:24px;display:flex;flex-direction:column;min-height:540px}
.p-dc.list{min-height:368px;border-radius:8px;padding:24px 0 8px}
.p-dc.list .p-dc-h{padding:0 24px 16px}
.p-dc-h{display:flex;justify-content:space-between;gap:8px}
.p-dc-t{font-size:20px;font-weight:600;line-height:28px}
.p-dc-s{font-size:15px;color:var(--ink-2)}
.p-dc-big{font-size:28px;font-weight:600;line-height:36px;padding:8px 0 24px}
.p-dc-kv{font-size:15px;line-height:20px}
.p-dc-kv span{color:var(--ink-2)}
.p-dc-kv b{font-weight:600}
.p-dc-ch{margin-top:36px}
.p-lc{display:block;direction:ltr;overflow:visible}
.p-lc .gl{stroke:var(--p-grid);stroke-width:1}
.p-lc .yl,.p-lc .xl{font-size:11px;fill:var(--ink-2);font-family:var(--f);direction:rtl}
.p-dc-ch.m{display:none}
.p-lg{display:flex;gap:24px;padding-top:16px;font-size:15px}
.p-lg span{display:flex;align-items:center;gap:8px}
.p-lg i{width:10px;height:10px;border-radius:50%}
.p-dc-emp{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px;padding:64px 24px}
.p-dc-emp svg.i{width:48px;height:48px;color:var(--p-act);margin-bottom:12px}
.p-dc.list .p-dc-emp svg.i{color:var(--ink)}
.p-dc-emp b{font-size:20px;font-weight:600;line-height:28px}
.p-dc-emp p{color:var(--ink-2);font-size:15px}
.p-acts{padding:0 16px}
.p-acts hr{border:0;border-top:1px solid var(--line);margin:0 16px 1px}
.p-act{display:grid;grid-template-columns:37px 1fr;align-items:center;padding:16px;border-radius:12px;color:var(--ink)}
.p-act:hover{background:var(--bg-2)}
.p-act-d{display:flex;flex-direction:column}
.p-act-d b{font-size:17px;font-weight:600;line-height:24px}
.p-act-d span{font-size:13px}
.p-act-t{font-size:15px;line-height:24px;color:var(--ink-2);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.p-act-t .p-badge{box-shadow:inset 0 0 0 1px var(--blue-soft)}
.p-act-s{font-size:17px;font-weight:600;line-height:24px}
.p-act-c{font-size:15px;color:var(--ink-2)}
.p-tops{padding:0 24px}
.p-top-r{display:flex;flex-direction:column;padding:12px 0;border-bottom:1px solid var(--line)}
.p-top-r:last-child{border-bottom:0}
.p-top-r b{font-size:15px;font-weight:600}
.p-top-r span{font-size:15px;color:var(--ink-2)}
.p-tm{width:calc(100% - 48px);margin:0 24px;border-collapse:collapse;font-size:15px}
.p-tm th{text-align:right;font-weight:600;padding:12px 0;border-bottom:1px solid var(--line)}
.p-tm td{padding:12px 0;border-bottom:1px solid var(--line)}
@container (max-width:600px){
  .p-dash{padding:0 20px 24px}
  .p-dash-t{display:block}
  .p-dc-ch.d{display:none}
  .p-dc-ch.m{display:block}
  .p-dash-g{grid-template-columns:minmax(0,1fr);gap:16px}
  .p-dc{min-height:0}
  .p-dc.list{min-height:0}
  .p-dc-emp{padding:48px 16px}
}

/* ---------- guide drawer frame (content: panel9.css) ---------- */
.ov.p-dr.p-gd .mdl{width:min(436px,100%)}
.p-gd .p-nt-tabs{width:84px;padding-top:12px}
.p-gd .p-nt-tabs button{align-items:center;padding:8px 4px;font-size:13px}
.p-gd .p-nt-m{background:var(--bg)}

.p-cg-cm{display:none}
@container (max-width:600px){
  .p-cg.multi .p-cg-c{display:grid;place-items:center}
  .p-cg-cm{display:block}
  .p-cg-cm .p-cav{width:38px;height:38px;font-size:11px;box-shadow:0 0 0 1px var(--bg),0 0 0 2px var(--p-appt)}
}

.p-slot{position:absolute;right:0;left:0;height:24px;z-index:1;background:var(--brand-soft);box-shadow:inset 0 0 0 1px var(--brand-soft-2);color:var(--brand);font-size:13px;line-height:22px;padding:0 8px;pointer-events:none;display:none}
.p-col:hover .p-slot{display:block}

/* new-appointment drawer: selected client / removable service */
.p-na-row.on{background:var(--brand-soft);box-shadow:inset 0 0 0 1px var(--brand)}
.p-na-who{display:flex;align-items:center;gap:8px;margin:0 0 16px;color:var(--ink)}
.p-na-svc{position:relative}
.p-na-x{position:absolute;top:8px;left:8px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:var(--ink-2)}
.p-na-x:hover{background:var(--bg-3)}

/* back 1405-07-24: top-bar back (pBackBtn) at the start of the desktop top bar, before the logo; 44px target, 24px arrow */
.p-top-s{display:flex;align-items:center;gap:8px}
.p-tback{width:44px;height:44px;border-radius:999px;display:grid;place-items:center;flex:none;color:var(--ink);margin-inline-start:-6px}
.p-tback:hover{background:var(--bg-2)}
.p-tback svg.i{width:24px;height:24px}/* narrow web panel (≤600, outside the phone frame): full-screen pages start below the demo bar, so their ✕ / ← stay visible */
@container (max-width:600px){html [data-app="panel"] .app-view :is(.p2-up,.p2-sh-mob,.p2-fm,.p8-full){top:var(--hub-h)}}

/* ======================= restyle v3 (business) — primitives =======================
   Accord's FORM only (hairline cards ~14px, near-flat shadows, lift on navigable cards, KPI figures, dense rows, segmented
   tabs, 10–12px controls, focus rings, short eased motion). Colours = our existing tokens; shape tokens = base.css (r-*, sh-*,
   ring, d-*, ease). Panel-only extras below (light + dark). Structure / markup unchanged. */
:root{--p-seg-ink:color-mix(in srgb,var(--ink) 78%,var(--bg-2)); --p-seg-on:var(--bg); --p-row-h:color-mix(in srgb,var(--ink) 3.5%,transparent)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p-seg-on:var(--bg-3); --p-row-h:color-mix(in srgb,var(--ink) 5%,transparent)}}
:root[data-theme="dark"]{--p-seg-on:var(--bg-3); --p-row-h:color-mix(in srgb,var(--ink) 5%,transparent)}

/* Vazirmatn's tabular figures put wide gaps inside Persian numbers («۱ ۲»), so the business workspace keeps proportional digits
   (base.css sets tabular-nums on body) */
[data-app="panel"],[data-app="papp"]{font-variant-numeric:normal}
[data-app="panel"] .num,[data-app="papp"] .num,.p-hr span{font-variant-numeric:normal}
/* top bar: quiet strip, 40px icon buttons with a soft rounded hover, count badge on the inbox */
.p-top{height:64px;padding:8px 20px 8px 24px}
.p-tb{width:42px;height:42px;border-radius:var(--r-btn);transition:background-color var(--d-2) var(--ease)}
.p-tb:hover{background:var(--hover-tint)}
.p-tb svg.i{width:24px;height:24px}
.p-tb .p-rc{top:1px;left:-1px;min-width:18px;height:18px;padding:0 4px;font-size:10.5px;line-height:18px;box-shadow:0 0 0 2px var(--bg)}
.p-av{width:42px;height:42px;font-size:15px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--p-av-ink) 18%,transparent);transition:box-shadow var(--d-2)}
.p-av:hover{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--p-av-ink) 30%,transparent),0 0 0 3px color-mix(in srgb,var(--p-av-ink) 12%,transparent)}
.p-setup{height:40px;padding:8px 14px;box-shadow:0 6px 16px -8px color-mix(in srgb,var(--p-act) 70%,transparent);transition:filter var(--d-2)}
.p-setup:hover{filter:brightness(1.06)}

/* section sub-nav: 40px rows, 10px radius, soft active */
.p-sub-in{padding:24px 10px 0}
.p-sub-t{font-size:13px;font-weight:600;line-height:20px;color:var(--ink-2);letter-spacing:var(--tr-label);margin-bottom:6px}
.p-sub-a{padding:10px 14px;border-radius:var(--r-ctl);font-size:15px;transition:background-color var(--d-2) var(--ease),color var(--d-2)}
.p-sub-a:hover{background:var(--hover-tint)}
.p-sub-a[aria-current="page"]{background:var(--brand-soft);font-weight:600;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 14%,transparent)}
.p-collapse{border-radius:var(--r-ctl);border-color:var(--line);box-shadow:var(--sh-1);transition:background-color var(--d-2)}
.p-collapse:hover{background:var(--bg-2)}

/* buttons: 44px / 12px radius, small 36px / 10px; press feedback */
.p-btn{height:44px;padding:0 18px;border-radius:var(--r-btn);font-size:15px;font-weight:600;line-height:20px;
  transition:background-color var(--d-2) var(--ease),border-color var(--d-2),opacity var(--d-2),transform var(--d-1) var(--ease),box-shadow var(--d-2)}
.p-btn:hover{border-color:var(--ink-3)}
.p-btn:active:not([disabled]){transform:scale(.98)}
.p-btn.pri:hover{opacity:.88;border-color:var(--ink)}
.p-btn.ghost:hover{border-color:transparent;background:var(--hover-tint)}
.p-btn.s{height:36px;padding:0 13px;border-radius:var(--r-ctl);font-size:14px}
.p-btn.ic{width:44px}
.p-btn.s.ic{width:36px}
.p-btn[disabled]{opacity:.45;cursor:not-allowed}
.p-btn svg.i{width:20px;height:20px}
.p-btn.s svg.i{width:18px;height:18px}
.p-grp>.p-btn:first-child,.p-dgrp .p-btn:first-child{border-radius:0 var(--r-ctl) var(--r-ctl) 0}
.p-grp>.p-btn:last-child,.p-dgrp .p-btn:last-child{border-radius:var(--r-ctl) 0 0 var(--r-ctl)}
.p-badge{height:24px;padding:0 10px;font-size:12.5px;font-weight:600}

/* page header */
.p-head h1{font-weight:650;line-height:1.3}
.p-head h1 .p-cnt{min-width:26px;height:24px;padding:0 8px;border-radius:var(--r-sm);font-size:12.5px;font-weight:700;color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line)}
.p-head p{font-size:15px;line-height:24px}

/* tabs = segmented control (track + raised selected segment) */
.p-tabs{width:fit-content;max-width:100%;gap:2px;padding:3px;background:var(--bg-2);border-radius:var(--r-btn);box-shadow:inset 0 0 0 1px var(--line);overflow-x:auto;scrollbar-width:none}
.p-tabs::-webkit-scrollbar{display:none}
.p-tabs button{height:34px;padding:0 14px;border-radius:9px;font-size:14px;color:var(--p-seg-ink);transition:background-color var(--d-2) var(--ease),color var(--d-2),box-shadow var(--d-2)}
.p-tabs button:hover{background:transparent;color:var(--ink)}
.p-tabs button[aria-selected="true"]{background:var(--p-seg-on);color:var(--ink);box-shadow:var(--sh-seg)}

/* toolbar + search field */
.p-bar{border-radius:var(--r-card);padding:12px 14px;box-shadow:inset 0 0 0 1px var(--line)}
.p-search{height:40px;border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.p-search:hover{border-color:var(--ink-3)}
.p-search:focus-within{border-color:var(--brand);box-shadow:var(--ring)}
.p-search input{height:38px}

/* tables: one hairline card, quieter header, 56px rows with a soft hover */
.p-tbl-w{border:1px solid var(--line);border-radius:var(--r-card);background:var(--bg);box-shadow:var(--sh-1)}
.p-tbl th{height:46px;padding:12px 16px;font-size:13.5px;font-weight:600;color:var(--ink-2);background:var(--bg)}
.p-tbl th.sort{padding:3px 4px}
.p-tbl th.sort>span{padding:9px 12px;border-radius:var(--r-sm);transition:background-color var(--d-2)}
.p-tbl th.sort>span:hover{background:var(--hover-tint)}
.p-tbl td{height:56px;transition:background-color var(--d-1)}
.p-tbl tbody tr:hover td{background:color-mix(in srgb,var(--ink) 3%,var(--bg))}
.p-ct{border-radius:var(--r-card);box-shadow:var(--sh-1)}
.p-ct-t{font-size:18px;font-weight:650;padding:18px 18px 12px}
.p-ct-tb th{height:46px;font-size:13.5px;color:var(--ink-2)}
.p-ct-tb td{height:52px}
.p-ct-tb tbody tr{transition:background-color var(--d-1)}
.p-ct-tb tbody tr:hover{background:var(--p-row-h)}

/* empty states + cards */
.p-empty{border-radius:var(--r-card);box-shadow:var(--sh-1)}
.p-empty.bare{box-shadow:none}
.p-empty b{font-size:18px;font-weight:650}
.p-card{border-radius:var(--r-card);box-shadow:inset 0 0 0 1px var(--line),var(--sh-1)}

/* menus / popovers */
.p-pop{border-radius:var(--r-card);padding:6px;box-shadow:var(--sh-pop-2)}
.p-pop:not(.sheet){animation:p-pop-in var(--d-2) var(--ease);transform-origin:top right}
@keyframes p-pop-in{from{opacity:0;transform:translateY(-4px) scale(.98)}}
.p-pop .it{padding:9px 12px;border-radius:var(--r-ctl);font-size:15px;transition:background-color var(--d-1)}
.p-pop .it:hover,.p-pop .it:focus-visible{background:var(--bg-2)}
.p-pop .it svg.i{color:var(--ink-2)}
.p-pop .it.bad svg.i{color:var(--bad)}
.p-pop hr{margin:4px 2px}

/* drawers / dialogs: rounded inner edge, deep soft shadow, square close button */
.ov.p-dr .mdl{border-radius:0 var(--r-lg) var(--r-lg) 0;box-shadow:var(--sh-3);border-right:0}
.ov.p-dr.from-start .mdl{border-radius:var(--r-lg) 0 0 var(--r-lg);border-left:0}
.ov.p-dr.full .mdl{border-radius:0}
.p-dr-x{border-radius:var(--r-btn);border-color:var(--line);box-shadow:var(--sh-2);transition:background-color var(--d-2)}
.p-dr-x:hover{background:var(--bg-2)}
.p-dr-h h2{font-weight:650;line-height:1.3}
.p-dr-f{box-shadow:0 -1px 0 0 var(--line)}
.ov.p-dlg .mdl{border-radius:var(--r-lg);box-shadow:var(--sh-3)}
@keyframes p-slide{from{transform:translateX(-24px);opacity:0}}
@keyframes p-slide2{from{transform:translateX(24px);opacity:0}}
.ov.p-dr .mdl{animation-duration:.32s;animation-timing-function:var(--ease)}

/* form fields */
.p-field>label{font-size:14px}
.p-in{height:44px;border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.p-in:hover{border-color:var(--ink-3)}
.p-in:focus,.p-in:focus-within{border-color:var(--brand);box-shadow:var(--ring)}
textarea.p-in{height:96px}
.p-sw,.p-sw2{transition:background-color var(--d-2) var(--ease),border-color var(--d-2)}
.p-sw::after{box-shadow:0 1px 2px rgba(13,13,13,.25);transition:right var(--d-3) var(--ease-spring)}
.p-sw2 i{box-shadow:0 1px 2px rgba(13,13,13,.25);transition:transform var(--d-3) var(--ease-spring),width var(--d-3) var(--ease)}
.p-chk{border-radius:6px;transition:background-color var(--d-1),border-color var(--d-1)}
.p-li{padding:14px 0}

/* lists + small tiles */
.p-fl-r,.p-na-row,.p-act{transition:background-color var(--d-2) var(--ease)}
.p-na-row{border-radius:var(--r-ctl)}
.p-sale-tile,.p-vt{border-radius:var(--r-md);transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease),background-color var(--d-2)}
@media (hover:hover){.p-sale-tile:hover,.p-vt:hover{transform:translateY(var(--lift));box-shadow:var(--sh-2)}}
.p-sale-qi,.p-sale-cl,.p-sale-it,.p-na-svc{border-radius:var(--r-md)}
.p-wl-c,.p-nt-c{border-radius:var(--r-card);box-shadow:var(--sh-1)}
.p-srch-ov .mdl,.ov.p-srch-ov .mdl{border-radius:var(--r-lg);box-shadow:var(--sh-3)}
.p-srch{height:60px}

/* calendar chrome (grid, colours and sizes of the appointment blocks stay) */
.p-cal-tb{padding:12px 16px}
.p-ap{border-radius:6px}
.p-mo-a{border-radius:6px}
.p-dp-g button{transition:background-color var(--d-1)}
.p-cal-fab button{box-shadow:var(--sh-2)}

/* home dashboard: hairline cards, KPI figure (small label · big tight tabular number) */
.p-dc{border-radius:var(--r-card);box-shadow:inset 0 0 0 1px var(--line),var(--sh-1)}
.p-dc.list{border-radius:var(--r-card)}
.p-dc-t{font-size:18px;font-weight:650;line-height:26px}
.p-dc-s{font-size:13px;color:var(--ink-2)}
.p-dc-big{font-size:var(--t-fig);font-weight:650;line-height:1.15;padding:10px 0 20px}
.p-dc-kv{font-size:14px;line-height:22px}

.p-act{border-radius:var(--r-ctl)}
.p-act:hover{background:var(--p-row-h)}
.p-lg span{font-size:14px;color:var(--ink-2)}

/* toast */
[data-app="panel"] .toast,[data-app="papp"] .toast{border-radius:var(--r-btn);padding:12px 16px 12px 18px;box-shadow:var(--sh-3);font-weight:500}

/* phone (papp + narrow web): same finish, Fresha's phone sizes kept */
@container (max-width:600px){
  .p-bar{box-shadow:none;padding:0;border-radius:0}
  .p-tabs{margin-bottom:20px}
  .p-tbl-w{box-shadow:none}
  .p-head-m .p-btn{border-radius:var(--r-ctl)}
  .ov.p-dr .mdl,.ov.p-dr.from-start .mdl{border-radius:0}
  .p-dr-x{border-radius:var(--r-ctl);box-shadow:none}
}
/* ======================= end restyle v3 (business) — primitives ======================= */

/* ======================= restyle v3 palette (business) — Accord LIGHT colours =======================
   Source: research/accord-ui/tokens.json via base.css palette tokens (--page, --band, --night, --accent…, see CONVENTIONS
   «restyle v3 palette»). Light only: every panel variable changed here gets its previous (owner's) dark value back in the two
   dark blocks below, so dark mode looks exactly as before. Action colour = night; emerald = data, links, focus, indicators. */
:root{
  --p-act:var(--night); --p-act-ink:var(--on-night);
  --p-card:var(--bg); --p-btn:var(--bg); --p-grid:var(--line); --p-axis:var(--ink-3);
  --p-av-bg:var(--accent-soft); --p-av-ink:var(--brand-3);
  --p-green:var(--ok); --p-line-green:#e0832a;
  /* chart categorical = Accord c1..c4 (+ emerald accent as series 1) */
  --p-ch1:#12a079; --p-ch2:#e0832a; --p-ch3:#0f9db0; --p-ch4:#e05a6a; --p-ch-muted:#b3c4bb;
  /* calendar blocks: Accord pastel stage hues, ink text, 3px stage-hue stripe on the inline start */
  --p-appt:#d2eef2; --p-appt-ink:var(--ink); --p-appt-bar:#0f9db0;
  --p-ap-booked:#d2eef2; --p-ap-booked-b:#0f9db0;
  --p-ap-confirmed:#d6f0e2; --p-ap-confirmed-b:#22a06b;
  --p-ap-started:#fbe6d1; --p-ap-started-b:#e0832a;
  --p-ap-done:#e7e9e2; --p-ap-done-b:#b3c4bb;
  --p-ap-noshow:#fbdfe2; --p-ap-noshow-b:#e05a6a;
  --p-hatch:#e7e9e2; --p-hatch-bg:#f1f2ec; --p-tip:var(--night); --p-tip-ink:var(--on-night);
  --p-row-hover:var(--bg-2); --p-past:#b3c4bb; --p-mbg:var(--page);
  --p-dr-sh:0 30px 80px -20px #08100c80,0 0 0 1px #14231d0a;
  --p-now:var(--accent); --p-now-ink:var(--accent-deep);
  --p-top-bg:var(--band); --p-main-bg:var(--page); --p-band:var(--band); --p-band-gap:22px; --p-top-line:transparent;
  --p-rail-mk:#4fd1a5; --p-rail-ring:#4fd1a5;
  --p-row-h:var(--bg-2);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --p-act:#6950f3; --p-act-ink:#ffffff; --p-ch1:#6950f3; --p-ch2:#00a36d; --p-ch3:#00a36d; --p-ch4:#ff4360; --p-ch-muted:#626262;
  --p-appt-bar:transparent;
  --p-ap-booked:#61b4d2; --p-ap-confirmed:#61b4d2; --p-ap-started:#61b4d2; --p-ap-done:#61b4d2; --p-ap-noshow:#61b4d2;
  --p-ap-booked-b:transparent; --p-ap-confirmed-b:transparent; --p-ap-started-b:transparent; --p-ap-done-b:transparent; --p-ap-noshow-b:transparent;
  --p-now:var(--bad); --p-now-ink:var(--bad); --p-top-bg:var(--bg); --p-main-bg:var(--bg); --p-band:transparent; --p-band-gap:0px; --p-top-line:var(--line);
}}
:root[data-theme="dark"]{
  --p-act:#6950f3; --p-act-ink:#ffffff; --p-ch1:#6950f3; --p-ch2:#00a36d; --p-ch3:#00a36d; --p-ch4:#ff4360; --p-ch-muted:#626262;
  --p-appt-bar:transparent;
  --p-ap-booked:#61b4d2; --p-ap-confirmed:#61b4d2; --p-ap-started:#61b4d2; --p-ap-done:#61b4d2; --p-ap-noshow:#61b4d2;
  --p-ap-booked-b:transparent; --p-ap-confirmed-b:transparent; --p-ap-started-b:transparent; --p-ap-done-b:transparent; --p-ap-noshow-b:transparent;
  --p-now:var(--bad); --p-now-ink:var(--bad); --p-top-bg:var(--bg); --p-main-bg:var(--bg); --p-band:transparent; --p-band-gap:0px; --p-top-line:var(--line);
}
/* surfaces: cream page, sage top bar fused with the page header (band painted behind the header up to the bar) */
.p-app{background:var(--p-main-bg)}
.p-top{background:var(--p-top-bg);border-bottom-color:var(--p-top-line)}
.p-main{background:var(--p-main-bg);isolation:isolate}
:is(.p-page>.p-head,.p2-pg>.p2-hd,.p-dash>.p-dash-t){position:relative;z-index:0;padding-bottom:var(--p-band-gap)}
:is(.p-page>.p-head,.p2-pg>.p2-hd,.p-dash>.p-dash-t)::before{content:"";position:absolute;z-index:-1;top:-200px;bottom:0;right:-100vw;left:-100vw;background:var(--p-band);pointer-events:none}
/* action colour = night (setup bar, today chip, add-mode bar, selected day) */
.p-setup,.p-setup-m,.p-cal-mode,.p-dp-g button.sel,.p-nt-av i{color:var(--p-act-ink)}
.p-cg-d.today b,.p-mo-d.today>p span{color:var(--p-act-ink)}
.p-cg-d.today{color:var(--ink)}
/* emerald = indicators / data */
.p-rng .f,.p-rng b{background:var(--brand)}
.p-sw2[aria-checked="true"]{background:var(--brand);border-color:var(--brand)}
.p-dc-ch,.p-lg{--p-act:var(--p-ch1)}
.p-lg{--p-green:var(--p-lg-2)}
:root{--p-lg-2:var(--p-line-green)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p-lg-2:var(--p-green)}}
:root[data-theme="dark"]{--p-lg-2:var(--p-green)}
.p-nowall,.p-now{background:var(--p-now)}
.p-nowb{border-color:var(--p-now);color:var(--p-now-ink)}
.p-dc-emp svg.i{color:var(--brand)}
.p-in:focus,.p-in:focus-within,.p-search:focus-within{border-color:var(--ring-c)}
/* sub-nav selected = Accord nav item (soft well + hairline, ink text) */
.p-sub-a[aria-current="page"]{background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink)}
.p-pop .it.cur{background:var(--bg-2)}
/* calendar blocks by status, Accord stage hues (dark = owner's single blue, stripe transparent) */
.p-ap{background:var(--p-ap-booked);box-shadow:inset -3px 0 0 var(--p-ap-booked-b)}
.p-ap.st-confirmed{background:var(--p-ap-confirmed);box-shadow:inset -3px 0 0 var(--p-ap-confirmed-b)}
.p-ap.st-started{background:var(--p-ap-started);box-shadow:inset -3px 0 0 var(--p-ap-started-b)}
.p-ap.st-done{background:var(--p-ap-done);box-shadow:inset -3px 0 0 var(--p-ap-done-b)}
.p-ap.st-noshow,.p-ap.st-cancelled{background:var(--p-ap-noshow);box-shadow:inset -3px 0 0 var(--p-ap-noshow-b)}
.p-ap.p-blk{background:var(--bg-3);box-shadow:inset 0 0 0 1px var(--line)}
/* onboarding illustration + small mock artwork */
.p-onb-ap.a1,.p-onb-ap.a3{background:#fbe6d1}
.p-onb-ap.a2{background:#e7e9e2}
.p-onb-new{color:var(--ink)}
.p-rg-r i.b::after{background:var(--accent)}
.p-promo{background:radial-gradient(circle at 0 0,#d3eee2 0,rgba(211,238,226,.6) 18%,transparent 45%),var(--page)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .p-promo{background:radial-gradient(circle at 0 0,#6ee6d4 0,rgba(110,230,212,.55) 18%,transparent 45%),var(--bg-4)}
  :root:not([data-theme="light"]) .p-rg-r i.b::after{background:#6950f3}
  :root:not([data-theme="light"]) :is(.p-onb-ap.a1,.p-onb-ap.a3){background:#ffb860} :root:not([data-theme="light"]) .p-onb-ap.a2{background:#d9d9d9}
  :root:not([data-theme="light"]) .p-onb-new{color:#0d0d0d}
  :root:not([data-theme="light"]) .p-sub-a[aria-current="page"]{background:var(--brand-soft);color:inherit;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 14%,transparent)}}
:root[data-theme="dark"] .p-promo{background:radial-gradient(circle at 0 0,#6ee6d4 0,rgba(110,230,212,.55) 18%,transparent 45%),var(--bg-4)}
:root[data-theme="dark"] .p-rg-r i.b::after{background:#6950f3}
:root[data-theme="dark"] :is(.p-onb-ap.a1,.p-onb-ap.a3){background:#ffb860} :root[data-theme="dark"] .p-onb-ap.a2{background:#d9d9d9}
:root[data-theme="dark"] .p-onb-new{color:#0d0d0d}
:root[data-theme="dark"] .p-sub-a[aria-current="page"]{background:var(--brand-soft);color:inherit;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 14%,transparent)}
.p-avm-inv{background:var(--p-inv)}
:root{--p-inv:linear-gradient(90deg,#0b5440,#14231d)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p-inv:linear-gradient(90deg,#0d6e8c,#0a3c66)}}
:root[data-theme="dark"]{--p-inv:linear-gradient(90deg,#0d6e8c,#0a3c66)}
/* phone layout: the sticky phone top bar is the sage band too (fused with the page header band) */
:root{--p-mtop-bg:var(--band)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p-mtop-bg:var(--bg)}}
:root[data-theme="dark"]{--p-mtop-bg:var(--bg)}
@container (max-width:600px){
  .p-mtop,.p-app.white .p-mtop{background:var(--p-mtop-bg)}
  .p-app.white .p-main{background:var(--p-main-bg)}
}
/* ======================= end restyle v3 palette (business) ======================= */


/* panel2 — Fresha partner workspace pages (clients, catalogue, online presence, marketing, team, reports, add-ons,
   settings, connect). 1:1 replica of capture/out/p-*.png, RTL mirror. Phone layout via container queries only.
   Prefix p2-. Colours without a base.css token get a p2 token with Fresha's light/dark values. */
[data-app]{--p2-tag-blue:#a5dff8;--p2-yellow:#fff8db;--p2-yellow-line:#ffe9a3;--p2-orange:#b7570b;--p2-soft:#f9f9f9;--p2-badge:rgba(19,19,19,.05);--p2-teal:#2bd6c6;--p2-sky:#2d76ec;--p2-ok-chip:#edfbe9;--p2-card:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) [data-app]{--p2-tag-blue:#a5dff8;--p2-yellow:#371c0c;--p2-yellow-line:#5c3412;--p2-orange:#f19101;--p2-soft:#131313;--p2-badge:rgba(255,255,255,.08);--p2-sky:#5791f0;--p2-ok-chip:#182914;--p2-card:#181818}}
:root[data-theme="dark"] [data-app]{--p2-tag-blue:#a5dff8;--p2-yellow:#371c0c;--p2-yellow-line:#5c3412;--p2-orange:#f19101;--p2-soft:#131313;--p2-badge:rgba(255,255,255,.08);--p2-sky:#5791f0;--p2-ok-chip:#182914;--p2-card:#181818}

/* ---------- fallback shell (only until panel.js provides panelShell) ---------- */
.p2-fs{display:flex;flex-direction:column;height:calc(100vh - var(--hub-h));min-height:600px;background:var(--bg)}
.p2-fs-top{height:65px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid var(--line)}
.p2-fs-body{flex:1;min-height:0;display:flex}
.p2-fs-rail{width:72px;flex:none;background:#0d0d0d}
.p2-fs-sub{width:208px;flex:none;border-left:1px solid var(--line);padding:24px 8px}
.p2-fs-sub b{display:block;font:600 17px/24px var(--f);padding:0 16px 8px}
.p2-fs-sub a{display:flex;height:44px;align-items:center;padding:0 16px;border-radius:8px;font:500 15px/20px var(--f)}
.p2-fs-sub a[aria-current]{background:var(--brand-soft)}
.p2-fs-main{flex:1;min-width:0;overflow:auto;display:flex;flex-direction:column}
.p2-fs-main>*{flex:1 0 auto}
.p2-fs-ban{display:none}
@container (max-width:600px){
  .p2-fs{height:auto;min-height:100%}
  .p2-fs-top,.p2-fs-rail,.p2-fs-sub{display:none}
  .p2-fs-body{display:block}
  .p2-fs-ban{display:flex;height:48px;background:var(--brand);color:#fff;font:600 15px/20px var(--f);align-items:center;padding:0 20px}
}

/* ---------- page frame ---------- */
.p2-wrap{min-height:100%;background:var(--bg-2);color:var(--ink);font-size:15px;line-height:20px}
.p2-wrap.white{background:var(--bg)}
.p2-pg{max-width:1088px;margin:0 auto;padding:32px;display:grid;gap:24px;align-content:start;grid-template-columns:minmax(0,1fr)}
.p2-a{color:var(--brand)}
.p2-mute{color:var(--ink-2)}
.p2-wrap.full{height:100%}

/* page head */
.p2-hd{display:flex;gap:12px;align-items:flex-start}
.p2-hd-t{flex:1;min-width:0;display:flex;flex-direction:column}
.p2-hd h1{display:flex;align-items:center;gap:8px;font:600 28px/36px var(--f);margin:0}
.p2-hd-d{font-size:15px;line-height:20px;color:var(--ink-2)}
.p2-hd-acts{display:flex;gap:8px;flex:none}
.p2-hd-m{display:none}
.p2-cnt{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--bg-3);color:var(--ink-2);font:600 13px/16px var(--f);flex:none}
.p2-cnt.soft{background:var(--p2-badge)}
.p2-cnt.inv{background:var(--on-ink);color:var(--ink);opacity:.2}

/* buttons */
.p2-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 19px;border-radius:999px;border:1px solid var(--line-2);background:var(--bg);color:var(--ink);font:600 17px/24px var(--f);white-space:nowrap;flex:none}
.p2-btn svg.i{width:24px;height:24px}
.p2-btn.pri{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}
.p2-btn.ghost{border-color:transparent;background:transparent}
.p2-btn.sm{height:36px;padding:0 15px;font:500 15px/20px var(--f)}
.p2-btn.sm svg.i{width:20px;height:20px}
.p2-btn.ic{width:36px;padding:0}
.p2-btn.ic48{width:48px;padding:0}
.p2-btn.blk{width:100%}
.p2-dots{width:36px;height:36px;border-radius:50%;display:inline-grid;place-items:center;flex:none}
.p2-dots svg.i{width:20px;height:20px}

/* toolbar: search + filters */
.p2-tb{background:var(--bg-2);padding-top:8px;margin-top:-8px}
.p2-tb-in{display:flex;align-items:center;gap:16px;padding:16px;border-radius:12px;background:var(--bg);box-shadow:var(--inset)}
.p2-tb-in.soft{background:var(--p2-soft);box-shadow:none}
.p2-tb-sp{flex:1}
.p2-srch{display:flex;align-items:center;height:36px;border:1px solid var(--line-2);border-radius:999px;background:var(--bg);padding:0 12px 0 0;width:256px;flex:none}
.p2-srch svg.i{width:20px;height:20px;color:var(--ink-2)}
.p2-srch input{flex:1;min-width:0;border:0;outline:0;background:none;font:400 15px/20px var(--f);padding:0 8px;height:34px}
.p2-srch input::placeholder{color:var(--ink-3)}
.p2-tb-m{display:none}

/* cards */
.p2-card{background:var(--p2-card);border-radius:12px;box-shadow:var(--inset)}

/* empty state card */
.p2-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:64px 24px;border-radius:12px;background:var(--p2-card);box-shadow:var(--inset)}
.p2-ill{width:56px;height:56px;margin-bottom:16px;display:block}
.p2-empty b{font:600 20px/28px var(--f)}
.p2-empty p{color:var(--ink-2);font-size:15px;line-height:20px;margin-top:4px}
.p2-empty .p2-btn{margin-top:24px}

/* pill tabs */
.p2-tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.p2-tabs::-webkit-scrollbar{display:none}
.p2-tab{height:36px;padding:0 16px;border-radius:999px;font:600 15px/20px var(--f);white-space:nowrap;flex:none;display:inline-flex;align-items:center;gap:8px}
.p2-tab[aria-selected="true"]{background:var(--ink);color:var(--on-ink)}
/* underline tabs */
.p2-utabs{display:flex;gap:24px;border-bottom:1px solid var(--line)}
.p2-utab{height:44px;font:600 15px/20px var(--f);border-bottom:3px solid transparent;margin-bottom:-1px}
.p2-utab[aria-selected="true"]{border-color:var(--ink)}

/* table */
.p2-tbl{width:100%;border-collapse:collapse;background:var(--bg);table-layout:fixed}
.p2-tbl th{text-align:right;font:600 15px/20px var(--f);height:57px;padding:0 16px;border-bottom:1px solid var(--line);white-space:nowrap}
.p2-tbl td{height:80px;padding:1px 16px;border-bottom:1px solid var(--line);font-size:15px;line-height:20px}
.p2-tbl tr:last-child td{border-bottom:0}
.p2-cb{display:inline-block;width:24px;height:24px;border:1px solid var(--line-2);border-radius:4px;background:var(--bg);vertical-align:middle;flex:none}
.p2-th-s{display:inline-flex;align-items:center;gap:8px}
.p2-th-s svg.i{width:20px;height:20px}
.p2-who{display:flex;align-items:center;gap:16px}
.p2-who p:last-child{color:var(--ink-2)}
.p2-tfoot{border-top:1px solid var(--line);padding:16px;text-align:center;color:var(--ink-2)}
.p2-tfoot b{color:var(--ink);font-weight:600}

/* avatars */
.p2-av{display:inline-grid;place-items:center;border-radius:50%;background:var(--brand-soft);color:var(--brand);font:600 17px/24px var(--f);flex:none;overflow:hidden}
.p2-av img{width:100%;height:100%;object-fit:cover}
.p2-av.s56{width:56px;height:56px}
.p2-av.s64{width:64px;height:64px}
.p2-av.s48{width:48px;height:48px}
.p2-av.s40{width:40px;height:40px}

/* phone: the shell's top bar (72px) holds the back arrow; page actions sit in that row */
.p2-back{width:44px;height:44px;margin:0 -10px;display:grid;place-items:center}
.p2-back svg.i{width:24px;height:24px}
.p2-hd{position:relative}
.p2-mt-acts{display:flex;gap:8px;margin-right:auto}
.p2-mt-acts .p2-btn{height:36px;padding:0 15px;font:500 15px/20px var(--f)}
.p2-mt-acts .p2-btn svg.i{width:20px;height:20px}
.p2-mt-acts .p2-btn.ic{width:36px;padding:0}
@container (max-width:600px){
  .p2-pg{padding:0 20px 32px;gap:24px}
  .p2-wrap.mw{background:var(--bg)}
  .p2-wrap.mg{background:var(--bg-2)}
  .p2-hd-acts{display:none}
  .p2-hd{flex-direction:column}
  .p2-tb,.p2-tb-in{display:none}
  .p2-tb-m{display:flex;gap:8px;align-items:center;margin:8px 0}
  .p2-tb-m .p2-srch{flex:1;width:auto;height:48px;padding:0 16px 0 0;border-radius:8px}
  .p2-tb-m .p2-srch svg.i{width:24px;height:24px}
  .p2-tb-m .p2-srch input{padding:0 12px;height:46px}
}

/* ---------- feature intro pages (packages, products, stocktakes, pay runs, deals …) ---------- */
.p2-up{position:relative;min-height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--bg-2)}
.p2-up-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.p2-up-bg i{position:absolute;border-radius:50%;filter:blur(70px)}
.p2-up-bg i:nth-child(1){left:-420px;top:-340px;width:980px;height:900px;background:radial-gradient(closest-side,var(--p2-g1) 0%,var(--p2-g1) 35%,transparent 100%)}
.p2-up-bg i:nth-child(2){left:-160px;top:-200px;width:520px;height:560px;background:radial-gradient(closest-side,var(--p2-g3) 0%,transparent 100%)}
.p2-up-bg i:nth-child(3){left:-180px;bottom:-360px;width:760px;height:640px;background:radial-gradient(closest-side,var(--p2-g2),transparent)}
.p2-up.purple{--p2-g1:#c7b0fb;--p2-g3:#d7a6ee;--p2-g2:#f3c3f2}
.p2-up.blue{--p2-g1:#a4abf9;--p2-g3:#8fc4fb;--p2-g2:#9aeae2}
.p2-up.teal{--p2-g1:#7ee7dc;--p2-g3:#6fe3e2;--p2-g2:#b8f0d6}
.p2-up.pink{--p2-g1:#d5b0f3;--p2-g3:#df9fd2;--p2-g2:#f2c0ef}
.p2-up.violet{--p2-g1:#a8a3fb;--p2-g3:#8fb6fb;--p2-g2:#9feee6}
:root[data-theme="dark"] .p2-up-bg{opacity:.4}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .p2-up-bg{opacity:.4}}
.p2-up-row{position:relative;display:flex;align-items:center;width:925px;max-width:100%}
.p2-up-l{max-width:55%;flex:0 0 55%;padding-right:12px;display:flex;flex-direction:column;position:relative;z-index:2}
.p2-up-eb{font:500 13px/16px var(--f);letter-spacing:.52px;color:var(--ok);margin-bottom:8px}
.p2-up-eb.new{color:var(--brand);font-size:15px;line-height:20px;letter-spacing:0;margin-bottom:16px}
.p2-up h1{font:700 40px/44px var(--f);margin:0 0 16px}
.p2-up-lead{font-size:17px;line-height:24px;margin-bottom:24px}
.p2-up-li{display:grid;gap:8px;margin:0 0 48px;padding:0;list-style:none}
.p2-up-li li{display:flex;gap:12px;font-size:15px;line-height:20px}
.p2-up-li svg.i{width:20px;height:20px;margin-top:2px}
.p2-up-price{font:600 24px/32px var(--f);margin-top:-16px}
.p2-up-price+p{font-size:17px;line-height:24px;margin-bottom:40px}
.p2-up-btns{display:flex;gap:4px;align-items:center}
.p2-up-btns .p2-btn.ghost{padding:0 23px}
.p2-up-addon{display:flex;align-items:center;gap:12px;margin-bottom:24px;font:600 15px/20px var(--f)}
.p2-up-addon>i{width:40px;height:40px;border-radius:8px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#e36ce6,#8b5cf6)}
.p2-up-addon>i svg.i{width:20px;height:20px}
.p2-up-addon small{display:block;font:400 15px/20px var(--f);color:var(--ink-2)}
.p2-up-addon .sq{background:var(--bg-3)}
.p2-up-r{position:relative;flex:1;align-self:stretch;min-height:520px;z-index:1}
.p2-up-bar,.p2-up-back{display:none}
@container (max-width:600px){
  .p2-up{position:fixed;inset:0;z-index:60;display:block;min-height:0;overflow-y:auto;background:var(--bg);padding:0}
  .p2-up-bg i:nth-child(1){left:-200px;top:auto;bottom:-260px;width:820px;height:640px}
  .p2-up-bg i:nth-child(2){left:auto;right:-200px;top:auto;bottom:-120px;width:420px;height:380px}
  .p2-up-bg i:nth-child(3){display:none}
  .p2-up-back{display:flex;height:72px;align-items:center;padding:0 20px;position:relative;z-index:2}
  .p2-up-row{display:block;width:auto;padding:0 20px}
  .p2-up-l{max-width:none;padding:0}
  .p2-up-eb{margin-bottom:20px}
  .p2-up h1{font:600 28px/36px var(--f);margin:0 0 32px}
  .p2-up-lead{font-size:15px;line-height:20px;margin-bottom:24px}
  .p2-up-li{gap:16px;margin-bottom:24px}
  .p2-up-li li{gap:12px}
  .p2-up-btns{display:none}
  .p2-up-r{min-height:0;height:330px;margin:24px -20px 0;overflow:hidden}
  .p2-up-bar{display:flex;position:sticky;bottom:0;z-index:5;gap:8px;padding:16px 20px;background:var(--bg);border-top:1px solid var(--line)}
  .p2-up-bar .p2-btn{flex:1}
}

/* illustration pieces (all drawn, photos via pic()) */
.p2-mk{position:absolute;background:var(--bg);border-radius:16px;box-shadow:0 4.8px 9.6px rgba(13,22,25,.02),0 14.4px 24px rgba(13,22,25,.06);overflow:hidden}
.p2-mk.fr{padding:8px;background:color-mix(in srgb,var(--bg) 60%,transparent);border-radius:20px;overflow:visible}
.p2-mk.fr>div{background:var(--bg);border-radius:14px;height:100%;overflow:hidden;position:relative}
.p2-mk img{width:100%;height:100%;object-fit:cover}
.p2-mk-t{font:600 13px/16px var(--f)}
.p2-mk-s{font:400 11px/14px var(--f);color:var(--ink-2)}
.p2-mk-tag{display:inline-block;padding:2px 6px;border-radius:4px;font:500 10px/14px var(--f)}

/* ---------- catalogue: service menu ---------- */
.p2-sv{display:grid;grid-template-columns:296px minmax(0,1fr);gap:32px;align-items:start;margin-top:8px}
.p2-sv-cats{padding:24px 16px}
.p2-sv-cats h2{font:600 20px/28px var(--f);padding:0 16px 8px;margin:0}
.p2-sv-cats ul{list-style:none;margin:0;padding:0}
.p2-sv-cats button{width:100%;height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;border-radius:8px;font:500 15px/20px var(--f);text-align:right}
.p2-sv-cats button[aria-pressed="true"]{background:var(--brand-soft)}
.p2-sv-cats .p2-a{color:var(--brand)}
.p2-sv-main{display:grid;gap:40px}
.p2-sv-grp{display:grid;gap:12px}
.p2-sv-gh{display:flex;align-items:center;justify-content:space-between;height:36px;margin:-6px 0 2px}
.p2-sv-gh h3{font:600 20px/28px var(--f);margin:0}
.p2-sv-row{position:relative}
.p2-sv-drag{display:none}
.p2-sv-card{width:100%;height:96px;display:flex;align-items:center;gap:16px;padding:0 24px 0 64px;border-radius:12px;background:var(--p2-card);box-shadow:var(--inset);overflow:hidden;position:relative;text-align:right}
.p2-sv-bar{position:absolute;right:0;top:0;bottom:0;width:8px;background:var(--p2-tag-blue)}
.p2-sv-tx{flex:1;display:flex;flex-direction:column}
.p2-sv-tx b{font:500 17px/24px var(--f)}
.p2-sv-tx span{color:var(--ink-2);font-size:15px;line-height:20px;margin-top:2px}
.p2-sv-pr{font:500 15px/16px var(--f)}
.p2-sv-more{position:absolute;left:16px;top:30px}
.p2-mb{display:none}
.p2-sv-chips{display:none}
@container (max-width:600px){
  .p2-sv{display:block;margin:0}
  .p2-sv-cats{display:none}
  .p2-sv-chips{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin:16px -20px 8px;padding:0 20px}
  .p2-sv-chips button{height:36px;padding:0 16px;border-radius:999px;font:600 15px/20px var(--f);display:inline-flex;align-items:center;gap:8px;white-space:nowrap;flex:none}
  .p2-sv-chips button[aria-pressed="true"]{background:var(--ink);color:var(--on-ink)}
  .p2-sv-chips button[aria-pressed="true"] .p2-cnt{background:rgba(255,255,255,.17);color:var(--on-ink)}
  .p2-sv-main{gap:32px}
  .p2-sv-grp{gap:13px}
  .p2-sv-gh{margin:0 0 15px}
  .p2-dk{display:none}.p2-mb{display:inline-flex}
  .p2-sv-card{height:106px;padding:12px 20px 12px 0;box-shadow:none;border-radius:0;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:0;background:none;overflow:visible}
  .p2-sv-pr{margin-top:14px}
  .p2-sv-bar{width:4px;border-radius:999px;top:4px}
  .p2-sv-more{display:none}
}

/* ---------- empty states ---------- */
@container (max-width:600px){.p2-empty{padding:80px 24px 64px;margin:0 -20px}}

/* ---------- clients list ---------- */
.p2-imp{position:relative;height:160px;border-radius:12px;overflow:hidden;color:#fff;display:flex;background:linear-gradient(-135deg,#141414 0%,#141414 44%,#7303c0 71%,#ec3812 100%)}
.p2-imp-t{padding:24px;flex:1;z-index:1}
.p2-imp h2{font:600 20px/28px var(--f);margin:0 0 4px}
.p2-imp p{font-size:15px;line-height:20px}
.p2-imp-b{display:flex;gap:8px;margin-top:24px}
.p2-imp-b .p2-btn:first-child{color:#0d0d0d;background:#fff}
.p2-on-dark{color:#fff}
.p2-imp-f{position:absolute;left:0;top:10px;width:324px;height:150px}
.p2-imp-f span{position:absolute;border-radius:50%;overflow:hidden;background:#333}
.p2-imp-f img{width:100%;height:100%;object-fit:cover}
.p2-imp-f .f0{width:52px;height:52px;right:98px;top:22px}
.p2-imp-f .f1{width:86px;height:86px;right:180px;top:0}
.p2-imp-f .f2{width:86px;height:86px;right:11px;top:67px}
.p2-imp-f .f3{width:120px;height:120px;right:109px;top:60px}
.p2-imp-f .f4{width:80px;height:80px;right:247px;top:75px}
.p2-imp-x{position:absolute;left:12px;top:8px;width:36px;height:36px;display:grid;place-items:center;color:#fff;z-index:2}
.p2-cl-tb{margin-top:8px}
.p2-cl-t{margin-top:-8px}
.p2-cl-t .p2-tbl td:first-child,.p2-cl-t .p2-tbl th:first-child{padding:0 16px 0 4px}
.p2-c-n{font-weight:500}
.p2-b{font-weight:600}
.p2-dn{width:20px;height:20px}
.p2-cl-m{display:none}
@container (max-width:600px){
  .p2-imp{height:272px;margin:0 -4px;flex-direction:column}
  .p2-imp-t{padding:24px 24px 0}
  .p2-imp-f{top:auto;bottom:0;left:-10px;transform:scale(.9);transform-origin:bottom left}
  .p2-cl-t,.p2-cl-tb{display:none}
  .p2-cl-m{display:grid;gap:32px;margin-top:8px}
  .p2-cl-m .p2-who{gap:16px}
}

/* ---------- client segments ---------- */
.p2-seg-bar{display:flex;align-items:center;gap:16px}
.p2-segs{display:grid;gap:16px;margin-top:-8px}
.p2-seg{display:flex;align-items:center;gap:12px;min-height:88px;padding:20px 24px;border-radius:12px;background:var(--p2-card);box-shadow:var(--inset)}
.p2-seg-ic{width:48px;height:48px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;flex:none}
.p2-seg-ic svg.i{width:24px;height:24px}
.p2-seg-t{flex:1;min-width:0}
.p2-seg-t h3{display:flex;align-items:center;gap:8px;font:600 15px/20px var(--f);margin:0}
.p2-seg-t p{color:var(--ink-2)}
.p2-cnt.brand{background:var(--brand-soft);color:var(--brand)}
.p2-h20{font:600 20px/28px var(--f);margin:16px 0 0}
.p2-seg-add{display:flex;align-items:center;gap:8px;height:44px;padding:0 44px;color:var(--brand);font:500 15px/20px var(--f);margin-top:-8px}
@container (max-width:600px){
  .p2-segp{background:var(--bg)}
  .p2-segp .p2-seg-bar{flex-direction:column;align-items:stretch}
  .p2-segp .p2-seg-bar .p2-tb-sp{display:none}
  .p2-segp .p2-seg-bar .p2-srch{width:auto;height:48px;padding:0 16px 0 0}
  .p2-seg{padding:16px 0;box-shadow:none;border-radius:0;background:none;border-bottom:1px solid var(--line);min-height:92px}
  .p2-segs{gap:0}
}

/* ---------- online reputation ---------- */
.p2-rp .p2-hd-d{font-size:17px;line-height:24px}
.p2-vid{display:flex;gap:8px;padding:8px;border-radius:12px;background:var(--brand-soft);border:1px solid var(--brand-soft-2)}
.p2-vid-t{flex:1;padding:20px 16px}
.p2-vid-t p{font-size:17px;line-height:24px;margin-bottom:16px}
.p2-vid-t div{display:flex;gap:8px}
.p2-vid-im{position:relative;width:249px;height:140px;border-radius:8px;overflow:hidden;flex:none}
.p2-vid-im img{width:100%;height:100%;object-fit:cover}
.p2-vid-pl{position:absolute;inset:0;margin:auto;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(13,13,13,.35)}
.p2-vid-im em{position:absolute;left:8px;bottom:8px;font:400 13px/16px var(--f);font-style:normal;color:#fff;background:rgba(19,19,19,.4);border:1px solid #fff;border-radius:999px;padding:2px 8px}
.p2-rp-tabs{margin-top:8px}
.p2-rp-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px}
.p2-rp-k{padding:24px;height:112px}
.p2-rp-k h3{font:600 17px/24px var(--f);margin:0 0 4px}
.p2-rp-k p{font:600 28px/36px var(--f);display:flex;align-items:center;gap:6px}
.p2-st{color:var(--star);display:inline-flex}
.p2-st svg.i{width:24px;height:24px}
.p2-rp-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:-8px}
.p2-rp-q{display:flex;gap:40px;align-items:flex-end;padding:24px;height:188px}
.p2-rp-ql{display:flex;flex-direction:column;width:84px;flex:none}
.p2-rp-ql .logo{height:28px;font-size:22px;margin-bottom:12px}
.p2-rp-ql b{font:700 48px/52px var(--f)}
.p2-rp-ql p{display:flex;align-items:center;gap:4px;margin-top:8px}
.p2-rp-ql p svg.i{width:16px;height:16px}
.p2-rp-ql small{font-size:13px;line-height:16px}
.p2-rp-h{flex:1;display:grid;grid-template-columns:12px 1fr auto;gap:4px 12px;align-items:center;font-size:13px;line-height:16px}
.p2-rp-h i{height:6px;border-radius:999px;background:var(--p2-badge);overflow:hidden;display:block}
.p2-rp-h i b{display:block;height:100%;background:var(--star);border-radius:999px}
.p2-rp-g{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px;height:188px}
.p2-rp-gbg{position:absolute;inset:0;opacity:.6;background:radial-gradient(circle at 0 0,#fbbc05 0,transparent 40%),radial-gradient(circle at 25% 0,#ea4335 0,transparent 35%),radial-gradient(circle at 100% 100%,#4285f4 0,transparent 45%),radial-gradient(circle at 70% 100%,#34a853 0,transparent 40%)}
.p2-rp-g>*{position:relative}
.p2-g{width:32px;height:32px;margin-bottom:8px}
.p2-rp-g b{font:600 17px/24px var(--f)}
.p2-rp-g .p2-btn{margin-top:16px}
.p2-rp-list{display:grid;gap:16px;margin-top:8px}
.p2-rp-r{padding:24px;display:grid;gap:12px;justify-items:start}
.p2-rp-r .p2-who{width:100%;gap:12px}
.p2-rp-stars{color:var(--star)}
.p2-rp-stars svg.i{width:16px;height:16px}
@container (max-width:600px){
  .p2-vid-im{display:none}
  .p2-vid{padding:0}
  .p2-vid-t{padding:16px 24px}
  .p2-rp-3,.p2-rp-2{grid-template-columns:1fr}
  .p2-rp-q{flex-direction:column;align-items:stretch;height:auto;gap:24px}
  .p2-rp-tabs{margin:8px -20px 0;padding:0 20px;border-bottom:1px solid var(--line)}
  .p2-rp-tabs .p2-utabs{border:0}
}

/* ---------- intro artworks ---------- */
.p2-art-pk{position:absolute;right:141px;top:calc(50% - 150px);width:280px}
.p2-art-pk-c{position:relative;z-index:2;height:175px;border-radius:16px;padding:24px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(120% 90% at 85% 10%,#c44bd8 0%,transparent 55%),radial-gradient(90% 80% at 0% 100%,#5a2fe0 0%,transparent 60%),linear-gradient(135deg,#7b3ff0,#b03be0 60%,#d64fb0)}
.p2-art-pk-c b{display:block;font:600 20px/28px var(--f)}
.p2-art-pk-c small{display:block;font:400 13px/16px var(--f)}
.p2-art-pk-p{text-align:left}
.p2-art-pk-i{position:relative;display:flex;align-items:center;gap:12px;height:84px;border-radius:16px;background:var(--p2-soft);box-shadow:0 4.8px 9.6px rgba(13,22,25,.02),0 14.4px 24px rgba(13,22,25,.06);padding:28px 20px 16px}
.p2-art-pk-i svg.i{width:24px;height:24px;color:#a43bd8}
.p2-art-pk-i.a{margin:-16px 28px 0;z-index:1}
.p2-art-pk-i.b{margin:-16px 48px 0;width:184px}
.p2-art-pr,.p2-art-st{position:absolute;inset:0}
.p2-art-pr-ph{right:176px;top:calc(50% - 222px);width:234px;height:460px}
.p2-art-pr-h{display:flex;justify-content:space-between;align-items:center;padding:16px 16px 12px}
.p2-art-pr-h b{font:600 15px/20px var(--f)}
.p2-art-pr-h svg.i{width:16px;height:16px}
.p2-art-pr-g{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 16px}
.p2-art-pr-g span{display:block;height:99px;border-radius:4px;overflow:hidden;background:var(--bg-3)}
.p2-art-pr-g span svg,.p2-art-pr-c span svg,.p2-art-st-r span svg,.p2-art-st-c span svg{width:100%;height:100%;display:block}
.p2-art-pr-g b{display:block;font:600 11px/14px var(--f);margin-top:6px}
.p2-art-pr-g small{display:block;font-size:11px;line-height:12px;color:var(--ink-2);margin-bottom:6px}
.p2-art-pr-c{right:98px;z-index:2;top:calc(50% + 50px);width:182px;height:232px;padding:16px;border-radius:12px}
.p2-art-pr-c span{display:block;height:147px;border-radius:8px;overflow:hidden}
.p2-art-pr-c>b{display:block;font:600 13px/16px var(--f);margin-top:12px}
.p2-art-pr-c div{display:flex;justify-content:space-between;align-items:center;margin-top:4px}
.p2-art-pr-c small{font-size:13px;color:var(--ink-2)}
.p2-art-pr-c em{font:500 9px/14px var(--f);font-style:normal;color:var(--brand);background:var(--brand-soft);border:1px solid var(--brand-soft-2);border-radius:3px;padding:0 4px}
.p2-art-st-l{right:181px;top:calc(50% - 213px);width:234px;height:452px}
.p2-art-st-r{display:flex;gap:8px;padding:0 16px 8px}
.p2-art-st-r span{width:80px;height:99px;border-radius:4px;overflow:hidden;flex:none}
.p2-art-st-r b{display:block;font:600 11px/14px var(--f);margin:28px 0 8px}
.p2-art-st-r em{font:500 10px/18px var(--f);font-style:normal;border-radius:2px;padding:2px 6px}
.p2-art-st-r em.b{background:var(--brand-soft);color:var(--brand);border:1px solid var(--brand-soft-2)}
.p2-art-st-r em.y{background:var(--warn-soft);color:var(--warn);border:1px solid var(--p2-yellow-line)}
.p2-art-st-r em.r{background:var(--bad-soft);color:var(--bad);border:1px solid var(--bad-soft)}
.p2-art-st-c{right:95px;z-index:2;top:calc(50% + 41px);width:182px;height:260px;padding:16px;border-radius:12px}
.p2-art-st-c>b{display:block;font:600 13px/16px var(--f);margin-bottom:12px}
.p2-art-st-c span{display:block;height:147px;border-radius:8px;overflow:hidden}
.p2-art-st-q{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:16px}
.p2-art-st-q i{width:24px;height:24px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center}
.p2-art-st-q i svg.i{width:14px;height:14px}
.p2-art-st-q b{font:400 20px/24px var(--f)}
.p2-art-loy{position:absolute;right:161px;top:calc(50% - 202px);width:310px;height:330px}
.p2-art-loy svg{width:100%;height:100%}
@container (max-width:600px){
  .p2-art-pk{right:55px;top:24px}
  .p2-art-pr-ph{right:auto;left:150px;top:30px;transform:scale(.62);transform-origin:top left}
  .p2-art-pr-c{right:auto;left:20px;top:200px;transform:scale(.62);transform-origin:top left}
  .p2-art-st-l{right:auto;left:150px;top:20px;transform:scale(.62);transform-origin:top left}
  .p2-art-st-c{right:auto;left:20px;top:150px;transform:scale(.62);transform-origin:top left}
  .p2-art-loy{right:auto;left:35px;top:60px}
}

/* ---------- add-ons ---------- */
.p2-ad-tabs{margin:-8px 0 8px}
.p2-ad-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.p2-ad{display:flex;flex-direction:column;align-items:flex-start;min-height:276px;padding:24px;border-radius:12px;background:var(--p2-card);box-shadow:var(--inset)}
.p2-ad-top{display:flex;justify-content:space-between;align-items:flex-start;width:100%;margin-bottom:24px}
.p2-ad-ic{width:56px;height:56px;border-radius:8px;display:grid;place-items:center;color:#fff;flex:none}
.p2-ad-ic svg.i{width:28px;height:28px}
.p2-ad-ic.lg{background:none}
.p2-ad-ic.lg b{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:#fff;font:700 22px/1 var(--f);direction:ltr}
.p2-ad-ic.lg svg{width:48px;height:48px}
.p2-ad-b{font:500 13px/16px var(--f);font-style:normal;padding:3px 11px;border-radius:999px;border:1px solid}
.p2-ad-b.blue{color:var(--p2-sky);background:var(--blue-soft);border-color:color-mix(in srgb,var(--p2-sky) 25%,transparent)}
.p2-ad-b.ok{color:var(--ok);background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 25%,transparent)}
.p2-ad h3{font:600 17px/24px var(--f);margin:0 0 4px}
.p2-ad p{color:var(--ink-2);flex:1;margin-bottom:24px}
.p2-h24{font:600 24px/32px var(--f);margin:24px 0 0}
.p2-fbig{position:relative;width:40px;height:40px;display:block}
.p2-fbig i{position:absolute;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;color:#fff}
.p2-fbig i svg.i{width:14px;height:14px}
.p2-fbig .fb{left:2px;top:2px;background:#1877f2}
.p2-fbig .ig{right:2px;bottom:2px;border-radius:6px;background:linear-gradient(45deg,#f9a825,#e1306c 50%,#833ab4)}
.p2-ad-ic.lg .p2-fbig{width:54px;height:54px}
.p2-ad-ic.lg .p2-fbig i{width:26px;height:26px}
@container (max-width:600px){
  .p2-ad-g{grid-template-columns:1fr;gap:16px}
  .p2-ad-tabs{margin:-8px 0 0}
}

/* ---------- link builder ---------- */
.p2-lkp .p2-hd-d{font-size:17px;line-height:24px}
.p2-lk{display:flex;gap:16px;margin-top:8px}
.p2-lk-c{width:244px;border-radius:12px;box-shadow:var(--inset);background:var(--p2-card);display:flex;flex-direction:column}
.p2-lk-t{padding:20px 20px 16px;flex:1}
.p2-lk-t svg.i{width:40px;height:40px;color:var(--brand);stroke-width:1.4;margin-bottom:28px}
.p2-lk-t h3{font:600 17px/24px var(--f);margin:0 0 4px}
.p2-lk-t p{color:var(--ink-2)}
.p2-lk-b{border-top:1px solid var(--line);padding:16px}
@container (max-width:600px){
  .p2-lk{flex-direction:column}
  .p2-lk-c{width:auto}
}

/* ---------- intro extras ---------- */
.p2-up-addon>i.meta{background:var(--bg);box-shadow:var(--inset);border-radius:8px;width:48px;height:48px}
.p2-up-addon>i.ws{background:linear-gradient(135deg,#0ea5b7,#4f46e5);width:48px;height:48px;border-radius:8px}
.p2-up-incl{font:600 20px/28px var(--f);margin:-8px 0 24px}
.p2-up-wide .p2-up-row{width:1040px}
.p2-up-wide .p2-up-l{flex-basis:565px;max-width:565px}
.p2-up-ws .p2-up-row{width:1040px}
.p2-up-ws .p2-up-l{flex-basis:565px;max-width:565px}
.p2-up.none{background:var(--bg-2)}
/* marketplace profile art */
.p2-art-mp{position:absolute;inset:0}
.p2-art-mp1{right:44px;top:calc(50% - 235px);width:217px;height:433px;z-index:2}
.p2-art-mp2{right:224px;top:calc(50% - 189px);width:212px;height:415px}
.p2-art-mp-im{display:block;height:157px;position:relative}
.p2-art-mp-im em{position:absolute;left:8px;bottom:8px;font:600 8px/12px var(--f);font-style:normal;background:rgba(0,0,0,.4);color:#fff;border-radius:999px;padding:1px 5px}
.p2-art-mp-tx{padding:12px 10px 0;font-size:8px;line-height:12px}
.p2-art-mp-tx>b{font:600 13px/18px var(--f);display:block}
.p2-art-mp-tx p{margin:2px 0}
.p2-art-mp-tx .p2-st svg.i{width:7px;height:7px}
.p2-mk-tag.brand{background:var(--brand-soft);color:var(--brand);margin:6px 0 10px}
.p2-art-mp-tx ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.p2-art-mp-tx li{display:flex;align-items:center;gap:4px}
.p2-art-mp-tx li svg.i{width:9px;height:9px}
.p2-art-mp-f{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:10px;border-top:1px solid var(--line);font-size:8px}
.p2-art-mp-f b{background:var(--ink);color:var(--on-ink);border-radius:4px;padding:6px 10px;font:600 8px/10px var(--f)}
.p2-art-map{height:158px;position:relative;background:linear-gradient(135deg,#e9eef0 0%,#dfe7ea 100%);background-image:repeating-linear-gradient(35deg,transparent 0 22px,#fff 22px 25px),repeating-linear-gradient(-55deg,transparent 0 30px,#f6d36b 30px 32px);background-color:#e6ecee}
.p2-art-map i{position:absolute;width:10px;height:14px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#1a1a1a}
.p2-art-mp2-f{display:flex;gap:4px;padding:10px 8px 4px;font-size:7px}
.p2-art-mp2-f span{border:1px solid var(--line-2);border-radius:999px;padding:1px 6px}
.p2-art-mp2>div>small{display:block;text-align:center;font-size:7px;color:var(--ink-2);margin:2px 0 6px}
.p2-art-mp2-im{display:block;height:96px;margin:0 8px;border-radius:6px;overflow:hidden}
.p2-art-mp2>div>b{display:block;font:600 8px/12px var(--f);padding:8px}
/* facebook/instagram art */
.p2-art-ig{position:absolute;inset:0}
.p2-art-ig1{right:173px;top:calc(50% - 197px);width:235px;height:460px;z-index:2}
.p2-art-ig2{right:333px;top:calc(50% - 272px);width:240px;height:460px}
.p2-art-ig-h{display:flex;align-items:center;justify-content:center;gap:8px;height:40px;font-size:9px}
.p2-art-ig-h svg.i{width:12px;height:12px}
.p2-art-ig-p{display:flex;align-items:center;gap:10px;padding:0 8px;font-size:7px;text-align:center}
.p2-art-ig-p b{display:block;font:600 8px/10px var(--f)}
.p2-art-ig-av{width:52px;height:52px;border-radius:50%;background:#3b82f6;color:#fff;display:grid;place-items:center;box-shadow:0 0 0 3px #f9a825}
.p2-art-ig-av svg.i{width:28px;height:28px}
.p2-art-ig-bio{font-size:6.5px;line-height:9px;padding:8px}
.p2-art-ig-bio span{color:#1d4ed8}
.p2-art-ig-btns{display:flex;gap:3px;padding:0 6px 10px;font-size:6.5px}
.p2-art-ig-btns span{flex:1;border:1px solid var(--line-2);border-radius:2px;text-align:center;padding:3px 0}
.p2-art-ig-btns .bk{background:#3b6fd8;color:#fff;border-color:#3b6fd8}
.p2-art-ig-g{display:grid;grid-template-columns:repeat(3,1fr);gap:1px}
.p2-art-ig-g img{height:72px}
.p2-art-ig2-im{display:block;height:130px}
.p2-art-ig2-n{display:block;font:600 14px/20px var(--f);padding:10px 10px 0}
.p2-art-ig2>div>small{display:block;font-size:7px;padding:0 10px 8px;color:var(--ink-2)}
.p2-art-ig-bk{display:block;margin:0 10px 8px;background:#3b6fd8;color:#fff;text-align:center;font-size:8px;padding:5px;border-radius:3px}
.p2-art-ig2-g{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:0 6px}
.p2-art-ig2-g img{height:100px;border-radius:2px}
/* smart website art */
.p2-art-ws{position:absolute;inset:0}
.p2-art-ws .p2-mk{border-radius:8px}
.p2-art-ws-bar{display:flex;gap:4px;padding:6px 8px;position:absolute;top:0;right:0;z-index:2}
.p2-art-ws-bar i{width:5px;height:5px;border-radius:50%;background:var(--line-2)}
.p2-art-ws-a{left:-60px;right:58px;top:calc(50% - 210px);height:420px;z-index:2}
.p2-art-ws-hero{position:relative;height:100%;background:linear-gradient(135deg,#ff3fb4,#ff79c6);overflow:hidden}
.p2-art-ws-hero span{position:absolute;left:0;top:0;bottom:0;width:55%}
.p2-art-ws-hero b{position:absolute;right:28px;top:80px;font:800 72px/1 var(--f);color:#fff7cf}
.p2-art-ws-hero nav{position:absolute;left:16px;top:14px;display:flex;gap:8px;font-size:9px;color:#fff;align-items:center}
.p2-art-ws-hero nav em{font-style:normal;background:#d6f5c9;color:#111;border-radius:999px;padding:2px 8px}
.p2-art-ws-b{left:-60px;right:169px;top:calc(50% - 417px);height:130px}
.p2-art-ws-c{left:-60px;right:161px;top:calc(50% + 286px);height:200px}
@container (max-width:600px){
  .p2-art-mp1{right:auto;left:150px;top:20px;transform:scale(.8);transform-origin:top left}
  .p2-art-mp2{right:auto;left:20px;top:60px;transform:scale(.8);transform-origin:top left}
  .p2-art-ig1{right:auto;left:180px;top:60px;transform:scale(.65);transform-origin:top left}
  .p2-art-ig2{right:auto;left:30px;top:0;transform:scale(.65);transform-origin:top left}
  .p2-art-ws-a{left:50px;right:50px;top:40px;height:330px}
  .p2-art-ws-b,.p2-art-ws-c{display:none}
}

/* ---------- team members ---------- */
.p2-plan{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:9px 20px 9px 9px;border-radius:12px;background:var(--p2-yellow);border:1px solid var(--p2-yellow-line);font-size:15px}
.p2-plan b{font-weight:600}
.p2-tmp .p2-tb-in{margin-top:0}
.p2-tm-t{margin-top:-8px}
.p2-tm-t .p2-tbl td{height:97px}
.p2-tm-t .p2-tbl td:first-child,.p2-tm-t .p2-tbl th:first-child{padding:0 24px 0 0}
.p2-av.s72{width:72px;height:72px}
.p2-av.ring{box-shadow:0 0 0 2px var(--bg),0 0 0 3px #a5dff8}
.p2-tm-t .p2-who{gap:12px}
.p2-tm-t .p2-who b{font-weight:600}
.p2-tm-r{display:flex;align-items:center;justify-content:space-between;gap:12px}
.p2-tm-m{display:none}
@container (max-width:600px){
  .p2-plan{padding:20px;align-items:center}
  .p2-plan p{max-width:180px}
  .p2-tm-t{display:none}
  .p2-tm-m{display:grid;gap:24px;margin-top:8px}
  .p2-tm-m .p2-who{gap:12px}
  .p2-tm-m b{font-weight:600}
}

/* ---------- scheduled shifts ---------- */
.p2-shp .p2-pg{max-width:none}
.p2-sh-d{display:grid;gap:24px}
.p2-sh-tb{padding:16px}
.p2-grp{display:inline-flex}
.p2-grp .p2-btn{border-radius:0;margin-right:-1px}
.p2-grp .p2-g-l{border-radius:0 999px 999px 0;margin-right:0;width:40px}
.p2-grp .p2-g-r{border-radius:999px 0 0 999px;width:40px}
.p2-grp .p2-btn svg.i{width:20px;height:20px}
.p2-sh-w{overflow-x:auto;margin-top:-8px}
.p2-sh{border-collapse:separate;border-spacing:0;min-width:1350px}
.p2-sh th{height:56px;padding:0;font-weight:600;text-align:center;vertical-align:middle}
.p2-sh th button{width:118px;padding:8px;display:flex;flex-direction:column;align-items:center}
.p2-sh th b{font:600 15px/20px var(--f);white-space:nowrap}
.p2-sh th small{font-size:13px;line-height:16px;color:var(--ink-2)}
.p2-sh-mh{width:300px;text-align:right!important;padding:0 16px!important}
.p2-sh-mh span{font:600 15px/20px var(--f)}
.p2-sh td{width:150px;height:84px;padding:4px;border-top:1px solid var(--line);border-left:1px solid var(--line);vertical-align:top;position:relative}
.p2-sh tr:last-child td{border-bottom:1px solid var(--line)}
.p2-sh td.p2-sh-m{width:300px;padding:1px 16px;border-right:1px solid var(--line);vertical-align:middle}
.p2-sh tbody tr:first-child td.p2-sh-m{border-radius:0 12px 0 0}
.p2-sh tbody tr:last-child td.p2-sh-m{border-radius:0 0 12px 0}
.p2-sh-m>div{display:flex;align-items:center;gap:12px}
.p2-sh-n{flex:1;display:flex;flex-direction:column}
.p2-sh-n b{font:600 15px/20px var(--f)}
.p2-sh-n small{color:var(--ink-2);font-size:15px;line-height:20px}
.p2-sh-c{display:block;width:100%;height:40px;border-radius:8px;background:var(--brand-soft);font:400 13px/16px var(--f)}
.p2-sh-c.off{background:var(--bg-3);color:var(--ink-2);font-size:12px}
.p2-sh-tip{display:flex;gap:8px;padding:15px;border-radius:12px;background:var(--p2-soft);border:1px solid var(--line)}
.p2-sh-tip svg.i{width:24px;height:24px}
.p2-sh-mob{display:none}
@container (max-width:600px){
  .p2-sh-d{display:none}
  .p2-sh-mob{display:block;position:fixed;inset:0;z-index:60;overflow-y:auto;background:var(--bg);padding:0 20px 24px}
  .p2-sh-mt{display:flex;align-items:center;gap:8px;height:72px}
  .p2-sh-mob h1{font:600 28px/36px var(--f);margin:0}
  .p2-sh-mob .p2-hd-d{margin:16px 0 24px}
  .p2-sh-mob .p2-grp .p2-btn{height:36px}
  .p2-seg2{display:flex;background:var(--bg-3);border-radius:8px;padding:0;margin:24px 0;height:36px}
  .p2-seg2 button{flex:1;border-radius:8px;font:500 15px/20px var(--f)}
  .p2-seg2 button[aria-pressed="true"]{background:var(--bg);box-shadow:inset 0 0 0 1px var(--line-2)}
  .p2-sh-mr{margin:0 -4px 24px;gap:12px}
  .p2-sh-mr b{font-weight:600}
  .p2-sh-mr>svg.i{width:20px;height:20px}
  .p2-sh-as{margin-bottom:24px}
  .p2-sh-tip{padding:16px 15px}
}

/* ---------- timesheets / pay runs art ---------- */
.p2-art-ts,.p2-art-pay{position:absolute;inset:0}
.p2-art-ts-a{right:250px;top:calc(50% - 180px);width:180px;height:300px}
.p2-art-ts-a>div{padding:14px;font-size:9px}
.p2-art-ts-b{display:inline-flex;align-items:center;gap:4px;background:#a99bf8;color:#fff;font:500 8px/12px var(--f);font-style:normal;border-radius:999px;padding:3px 8px}
.p2-art-ts-b svg.i{width:10px;height:10px}
.p2-art-ts-a b.t{display:block;font:600 12px/16px var(--f);margin-top:10px}
.p2-art-ts-a small{display:block;color:var(--ink-2);font-size:8px}
.p2-art-ts-a .p2-who{gap:8px;margin:10px 0;font-size:11px}
.p2-art-ts-a ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.p2-art-ts-a li{display:grid;grid-template-columns:14px 1fr;gap:0 6px;font-size:8px}
.p2-art-ts-a li svg.i{width:12px;height:12px;grid-row:span 2}
.p2-art-ts-c{right:40px;top:calc(50% - 150px);width:180px;height:260px;z-index:2}
.p2-art-ts-c>div{padding:12px;font-size:9px}
.p2-art-ts-c .p2-who{margin-bottom:10px}
.p2-art-ts-c .p2-who b{display:block;font-size:11px}
.p2-art-ts-c small{display:block;font-size:7px;color:var(--ink-2)}
.p2-art-ts-r{display:flex;align-items:center;gap:6px;padding:6px 0;border-top:1px solid var(--line)}
.p2-art-ts-r>i{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--ok-2);color:var(--ok)}
.p2-art-ts-r>i.w{background:var(--bg-3);color:var(--ink)}
.p2-art-ts-r>i svg.i{width:12px;height:12px}
.p2-art-ts-r>div{flex:1}
.p2-art-ts-r b{font-size:8px;display:block}
.p2-art-ts-r>span{font-size:8px;font-weight:600}
.p2-art-ts-n{position:absolute;right:130px;top:calc(50% + 120px);z-index:3;display:flex;align-items:center;gap:12px;background:#d8d0ff;border-radius:8px;padding:12px 16px;width:240px}
.p2-art-ts-n svg.i{width:22px;height:22px;color:var(--brand-3)}
.p2-art-ts-n b{display:block;font:400 12px/16px var(--f)}
.p2-art-ts-n strong{font-weight:700}
.p2-art-ts-n small{font-size:8px}
.p2-art-pay-a{right:88px;top:calc(50% - 222px);width:238px;height:462px}
.p2-art-pay-a>div{padding:16px}
.p2-art-pay-a b.t{display:block;font:600 13px/16px var(--f);margin:8px 0 18px}
.p2-art-pay-r{display:flex;align-items:center;gap:10px;margin-bottom:24px;font-size:9px}
.p2-art-pay-r>div{flex:1}
.p2-art-pay-r b{display:block;font-size:11px}
.p2-art-pay-r small{font-size:8px;color:var(--ink-2)}
.p2-art-pay-r>span{font:600 11px/14px var(--f)}
.p2-art-pay-c{right:193px;top:calc(50% + 40px);width:244px;padding:16px;z-index:2;overflow:visible}
.p2-art-pay-c .p2-who{gap:10px;font-size:9px}
.p2-art-pay-c .p2-who b{display:block;font-size:13px}
.p2-art-pay-c .p2-who small{color:var(--ink-2)}
.p2-art-pay-ok{position:absolute;left:-20px;top:12px;display:flex;align-items:center;gap:6px;background:#3bc48d;color:#fff;font:500 13px/18px var(--f);font-style:normal;padding:8px 14px;border-radius:999px}
.p2-art-pay-ok svg.i{width:16px;height:16px}
.p2-art-pay-l{background:var(--bg-2);border-radius:6px;padding:8px 12px;margin:14px 0;display:grid;gap:12px}
.p2-art-pay-l p{display:flex;align-items:center;gap:8px;font-size:9px}
.p2-art-pay-l p svg.i{width:12px;height:12px}
.p2-art-pay-l p b,.p2-art-pay-t b{margin-right:auto;font-weight:600}
.p2-art-pay-t{display:flex;font:600 13px/16px var(--f)}
@container (max-width:600px){
  .p2-art-ts-a{right:auto;left:180px;top:30px;transform:scale(.9);transform-origin:top left}
  .p2-art-ts-c{right:auto;left:20px;top:60px;transform:scale(.9);transform-origin:top left}
  .p2-art-ts-n{right:auto;left:60px;top:250px}
  .p2-art-pay-a{right:auto;left:150px;top:40px;transform:scale(.62);transform-origin:top left}
  .p2-art-pay-c{right:auto;left:40px;top:160px;transform:scale(.62);transform-origin:top left}
}

/* ---------- marketing: automations ---------- */
.p2-aup .p2-hd-d{font-size:17px;line-height:24px}
.p2-bal{display:flex;align-items:center;gap:8px;width:244px;height:76px;padding:12px 12px 12px 20px}
.p2-bal>div{flex:1}
.p2-bal b{font:600 20px/28px var(--f)}
.p2-bal-m{display:none}
.p2-topup{display:flex;align-items:center;gap:16px;padding:24px 24px 24px 20px;border-radius:12px;color:#fff;background:linear-gradient(90deg,#6c5cf6,#5f6ff2 60%,#5b86f0)}
.p2-topup>div{flex:1}
.p2-topup b{display:block;font:600 17px/24px var(--f);margin-bottom:4px}
.p2-au-tabs{position:sticky;top:0;z-index:3;background:var(--bg-2);display:flex;align-items:center;padding:16px 0}
.p2-au-tabs .p2-tabs{flex:1}
.p2-au-nav{display:flex;gap:8px;padding:0 8px}
.p2-au-nav svg.i{width:20px;height:20px}
.p2-au-nav svg.i:first-child{opacity:.4}
.p2-au-s{display:grid;gap:24px;scroll-margin-top:90px}
.p2-au-s .p2-h24{margin:0}
.p2-au-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.p2-au{display:flex;flex-direction:column;align-items:flex-start;text-align:right;min-height:284px;padding:24px;border-radius:12px;background:var(--p2-card);box-shadow:var(--inset)}
.p2-au-ic{display:block;margin-bottom:24px;height:32px}
.p2-au-ic svg.i{width:32px;height:32px;stroke-width:1.4}
.p2-au-ic.orange{color:var(--p2-orange)}.p2-au-ic.brand{color:var(--brand)}.p2-au-ic.blue{color:var(--p2-sky)}.p2-au-ic.teal{color:var(--p2-teal)}
.p2-au h3{font:600 17px/24px var(--f);margin:0 0 8px}
.p2-au p{color:var(--ink-2);flex:1;margin-bottom:24px}
.p2-au-f{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:24px}
.p2-on{font:500 13px/16px var(--f);font-style:normal;color:var(--ok);background:var(--ok-soft);box-shadow:inset 0 0 0 1px var(--ok-2);border-radius:999px;padding:4px 12px}
.p2-au-ch{display:flex;gap:12px}
.p2-au-ch svg.i{width:16px;height:16px}
.p2-au-new{align-items:center;justify-content:center;gap:8px;color:var(--ink);border:1px dashed var(--line-2);box-shadow:none;background:none}
.p2-au-new svg.i{width:32px;height:32px}
.p2-au-new b{font:600 17px/24px var(--f)}
@container (max-width:600px){
  .p2-bal{display:none}
  .p2-bal-m{display:flex;width:auto}
  .p2-topup{flex-direction:column;align-items:stretch;gap:24px}
  .p2-topup .p2-btn{width:100%}
  .p2-au-nav{display:none}
  .p2-au-tabs{margin:0 -20px;padding:16px 20px}
  .p2-au-g{grid-template-columns:1fr;gap:16px}
}

/* ---------- marketing intro artworks ---------- */
.p2-art-bl,.p2-art-dl,.p2-art-sp{position:absolute;inset:0}
.p2-art-bl-a{right:132px;top:calc(50% - 230px);width:284px;height:428px}
.p2-art-bl-a>div{background:#fbf5ee;display:flex;flex-direction:column;align-items:center;text-align:center;padding:16px}
.p2-art-bl-ill{width:190px;height:180px}
.p2-art-bl-t{font:700 21px/28px var(--f);color:#ee6f6f;margin-top:8px}
.p2-art-bl-a small{font-size:8px;color:#ee6f6f;margin:8px 0 16px}
.p2-art-bl-b{background:#ee7b7b;color:#fff;border-radius:999px;padding:6px 36px;font-size:11px}
.p2-art-bl-n{right:187px;top:calc(50% + 158px);width:298px;display:flex;align-items:center;gap:8px;padding:10px;border-radius:8px;z-index:2}
.p2-art-bl-ic{width:42px;height:42px;border-radius:10px;background:linear-gradient(#5ef777,#1fc53f);color:#fff;display:grid;place-items:center}
.p2-art-bl-ic svg.i{width:28px;height:28px}
.p2-art-bl-n b{display:block;font:600 13px/18px var(--f)}
.p2-art-bl-n small{font-size:10px}
.p2-art-dl-a{right:129px;top:calc(50% - 240px);width:234px;height:462px}
.p2-art-dl-im{display:block;height:200px;position:relative}
.p2-art-dl-im em{position:absolute;right:8px;top:8px}
.p2-art-dl-n{display:block;font:600 13px/18px var(--f);padding:12px 16px 0}
.p2-art-dl-r{font-size:8px;padding:0 16px 12px}
.p2-art-dl-r .p2-st svg.i{width:7px;height:7px}
.p2-art-dl-row{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:12px 16px;border-top:1px solid var(--line);font-size:9px}
.p2-art-dl-row em{font-style:normal;color:var(--ok)}
.p2-art-dl-row s{color:var(--ink-3)}
.p2-art-dl-p,.p2-art-dl-f,.p2-art-dl-l{display:flex;align-items:center;gap:10px;padding:8px;border-radius:12px;z-index:2}
.p2-art-dl-p{right:45px;top:calc(50% - 111px);width:190px}
.p2-art-dl-f{right:340px;top:calc(50% + 25px);width:190px}
.p2-art-dl-l{right:147px;top:calc(50% + 185px);width:196px}
.p2-art-dl-p i,.p2-art-dl-f i,.p2-art-dl-l i,.p2-art-sp-o i,.p2-art-sp-s i{width:46px;height:46px;border-radius:8px;display:grid;place-items:center;flex:none}
.p2-art-dl-p i.y{background:#fff3cf;color:#c58b00}
.p2-art-dl-f i.o{background:#ffe4cc;color:#f2811d}
.p2-art-dl-l i.b{background:#ecebff;color:var(--brand)}
.p2-art-dl-p b,.p2-art-dl-f b,.p2-art-dl-l b{display:block;font:600 10px/14px var(--f)}
.p2-art-dl-p small,.p2-art-dl-f small,.p2-art-dl-l small{font-size:9px;color:var(--ink-2)}
.p2-art-sp-a{right:131px;top:calc(50% - 220px);width:234px;height:440px}
.p2-art-sp-im{display:block;height:188px}
.p2-art-sp-o,.p2-art-sp-s{display:flex;align-items:center;gap:10px;padding:8px;border-radius:12px;z-index:2;width:200px}
.p2-art-sp-o{right:69px;top:calc(50% + 48px)}
.p2-art-sp-s{right:293px;top:calc(50% + 130px)}
.p2-art-sp-o i.g{background:#3fcf9a;color:#fff}
.p2-art-sp-s i.p{background:var(--brand);color:#fff}
.p2-art-sp-o b,.p2-art-sp-s b{font:600 15px/20px var(--f)}
@container (max-width:600px){
  .p2-art-bl-a{right:auto;left:110px;top:30px;transform:scale(.62);transform-origin:top left}
  .p2-art-bl-n{right:auto;left:80px;top:250px;transform:scale(.62);transform-origin:top left}
  .p2-art-dl-a,.p2-art-sp-a{right:auto;left:100px;top:20px;transform:scale(.7);transform-origin:top left}
  .p2-art-dl-p,.p2-art-dl-f,.p2-art-dl-l,.p2-art-sp-o,.p2-art-sp-s{display:none}
}

/* ---------- reports ---------- */
.p2-rsp{background:var(--bg-2)}
.p2-rs{display:flex;gap:32px;align-items:flex-start;padding:32px}
.p2-rs-side{width:296px;flex:none;padding:24px 16px 16px;border-radius:12px}
.p2-rs-side h2{font:600 20px/28px var(--f);margin:0 16px 8px}
.p2-rs-side h3{font:600 17px/24px var(--f);margin:16px 16px 4px}
.p2-rs-side hr{border:0;border-top:1px solid var(--line);margin:12px 16px}
.p2-rs-i{width:100%;height:44px;display:flex;align-items:center;gap:12px;padding:0 16px;border-radius:8px;font:500 15px/20px var(--f);text-align:right}
.p2-rs-i>span:not(.p2-cnt){flex:1}
.p2-rs-i[aria-current]{background:var(--brand-soft)}
.p2-rs-i>svg.i{width:20px;height:20px}
.p2-rs-chev{display:none}
.p2-rs-add{color:var(--brand)}
.p2-rs-dci{width:20px;height:20px;border-radius:4px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#6ccf3c,#1f8900)}
.p2-rs-dci svg.i{width:12px;height:12px}
.p2-rs-main{flex:1;min-width:0;display:grid;gap:24px}
.p2-rs-tb{display:flex;align-items:center;gap:8px;margin-top:8px}
.p2-rs-tb .p2-srch{width:316px}
.p2-rs-list{display:grid;gap:16px}
.p2-rs-r{display:flex;align-items:center;gap:14px;height:88px;padding:0 24px;border-radius:12px;background:var(--p2-card);box-shadow:var(--inset);text-align:right}
.p2-rs-ic{width:48px;height:48px;border-radius:8px;background:var(--bg-2);display:grid;place-items:center;flex:none}
.p2-rs-ic svg.i{width:24px;height:24px}
.p2-rs-ic.ok{color:var(--ok)}.p2-rs-ic.brand{color:var(--brand)}
.p2-rs-t{flex:1;display:flex;flex-direction:column;min-width:0}
.p2-rs-t b{font:600 15px/20px var(--f)}
.p2-rs-t span{color:var(--ink-2)}
.p2-prem{font:500 13px/16px var(--f);font-style:normal;color:var(--brand);background:var(--brand-soft);border:1px solid var(--brand-soft-2);border-radius:999px;padding:3px 11px;margin-left:16px}
.p2-rs-st svg.i{width:24px;height:24px;color:var(--ink)}
.p2-rs-mob{display:none}
@container (max-width:600px){
  .p2-rs{display:none}
  .p2-rs-mob{display:block;padding:0 20px 32px}
  .p2-rs-mob h1{font:600 28px/36px var(--f);margin:0 0 32px}
  .p2-rs-mob .p2-rs-side{width:auto;padding:0;background:none;box-shadow:none}
  .p2-rs-mob .p2-rs-i{height:48px;font:400 17px/24px var(--f);padding:0 20px}
  .p2-rs-mob .p2-rs-i>svg.i{width:24px;height:24px}
  .p2-rs-mob .p2-rs-i[aria-current]{background:none}
  .p2-rs-mob .p2-rs-chev{display:block;width:20px;height:20px}
  .p2-rs-mob .p2-rs-side{display:flex;flex-direction:column}
  .p2-rs-mob .p2-rs-grp{background:var(--bg);box-shadow:var(--inset);border-radius:12px;padding:12px 0}
  .p2-rs-mob hr{display:none}
  .p2-rs-mob h3{font:600 20px/28px var(--f);margin:32px 0 12px}
  .p2-rs-mob .p2-rs-add,.p2-rs-mob .p2-rs-dc{background:var(--bg);box-shadow:var(--inset);border-radius:12px;height:72px;margin-bottom:40px}
  .p2-rs-mob .p2-rs-add{color:var(--brand)}
  .p2-rs-mob .p2-cnt{min-width:28px}
}

/* ---------- workspace settings hub ---------- */
.p2-st-tabs{margin:-8px 0 8px}
.p2-st-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.p2-st-c{display:flex;flex-direction:column;align-items:flex-start;text-align:right;min-height:176px;padding:24px;border-radius:12px;background:var(--p2-card);box-shadow:var(--inset)}
.p2-st-ic{color:var(--brand);margin:0 0 16px;height:24px}
.p2-st-ic svg.i{width:24px;height:24px}
.p2-st-c b{font:600 17px/24px var(--f);margin:24px 0 4px}
.p2-st-c .p2-st-ic+b{margin-top:0}
.p2-st-c>span:not(.p2-st-ic){color:var(--ink-2)}
.p2-st-c2{min-height:152px}
.p2-st-c2 b{margin-top:0}
.p2-st-c2 em{font:600 15px/20px var(--f);font-style:normal;display:flex;align-items:center;gap:4px;margin-top:auto;padding-top:16px}
.p2-st-c2 em svg.i{width:16px;height:16px}
.p2-st-dk{display:grid;gap:24px}
.p2-st-dk .p2-h24{margin:40px 0 0}
.p2-st-mob{display:none}
@container (max-width:600px){
  .p2-st-tabs,.p2-st-dk{display:none}
  .p2-st-mob{display:block}
  .p2-st-ml{background:var(--bg);border-radius:12px;box-shadow:var(--inset);padding:12px 0}
  .p2-st-ml button{width:100%;height:48px;display:flex;align-items:center;gap:12px;padding:0 20px;font:400 17px/24px var(--f);text-align:right}
  .p2-st-ml button span{flex:1}
  .p2-st-ml button svg.i{width:24px;height:24px}
  .p2-st-ml button svg.i:last-child{width:20px;height:20px}
  .p2-st-mob .p2-h20{margin:40px 0 16px}
  .p2-st-ml2 button{font-weight:500}
}

/* ---------- connect ---------- */
.p2-cn-wrap{position:relative;min-height:calc(100vh - var(--hub-h));background:var(--bg)}
html.bare .p2-cn-wrap{min-height:100vh}
.p2-cn-x{position:absolute;left:32px;top:32px;z-index:5;width:24px;height:24px}
.p2-cn-x svg.i{width:24px;height:24px}
.p2-up.p2-cn{min-height:calc(100vh - var(--hub-h));background:var(--bg)}
html.bare .p2-up.p2-cn{min-height:100vh}
.p2-cn .p2-up-row{width:900px}
.p2-cn .p2-up-l{flex-basis:510px;max-width:510px;margin-right:0}
.p2-cn h1{font-size:40px}
.p2-cn .p2-up-lead{font-size:17px}
.p2-cn .p2-up-li li{font-size:17px;line-height:24px}
.p2-cn .p2-up-li{gap:8px;margin-bottom:32px}
.p2-cn .p2-up-bg i:nth-child(1){left:-200px;top:-300px}
.p2-cn-ph{position:absolute;left:-70px;top:50%;transform:translateY(-50%);width:326px;height:684px;border-radius:56px;padding:12px;background:linear-gradient(135deg,#e2e2e2,#9a9a9a);box-shadow:0 20px 40px rgba(0,0,0,.2)}
.p2-cn-scr{height:100%;border-radius:46px;overflow:hidden;position:relative;color:#fff;background:radial-gradient(60% 40% at 80% 30%,#1b49d8 0,transparent 70%),radial-gradient(70% 50% at 20% 70%,#43c6b0 0,transparent 70%),linear-gradient(160deg,#1c7ed6,#0b2e8a 60%,#13b6a6)}
.p2-cn-sb{display:flex;justify-content:space-between;padding:22px 26px 0}
.p2-cn-sb svg.i{width:16px;height:16px}
.p2-cn-d{text-align:center;font:600 17px/22px var(--f);margin-top:40px}
.p2-cn-t{text-align:center;font:700 86px/1 var(--f);opacity:.85}
.p2-cn-n{position:relative;display:flex;align-items:center;gap:8px;margin:12px 10px 0;padding:8px 10px;border-radius:16px;background:rgba(255,255,255,.28);backdrop-filter:blur(6px);font-size:11px}
.p2-cn-n:first-of-type{margin-top:250px}
.p2-cn-n>div{flex:1;min-width:0}
.p2-cn-n b{display:block;font-size:11px}
.p2-cn-n small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p2-cn-n em{position:absolute;left:10px;top:8px;font-style:normal;opacity:.8}
.p2-cn-dock{position:absolute;bottom:40px;left:36px;right:36px;display:flex;justify-content:space-between}
.p2-cn-dock i{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.2)}
@container (max-width:600px){
  .p2-cn-x{left:20px;top:24px}
  .p2-cn-wrap{min-height:0}
  .p2-up.p2-cn{min-height:0}
  .p2-cn h1{font-size:28px}
  .p2-cn .p2-up-lead,.p2-cn .p2-up-li li{font-size:15px;line-height:20px}
  .p2-cn-ph{left:50%;top:20px;transform:translateX(-50%);width:262px;height:550px}
  .p2-cn-t{font-size:66px}
}

/* ---------- settings subpages ---------- */
.p2-smp{background:var(--bg-2)}
.p2-sm{max-width:1088px;margin:0 auto;padding:32px}
.p2-crumb{display:flex;align-items:center;gap:8px;height:36px;margin-bottom:32px;font-size:15px}
.p2-crumb .p2-btn{margin-left:8px}
.p2-crumb .p2-btn svg.i{width:20px;height:20px}
.p2-crumb i{font-style:normal;color:var(--ink-2);font-size:10px}
.p2-sm-row{display:flex;gap:32px;align-items:flex-start}
.p2-sm-nav{width:296px;flex:none;padding:24px 16px 16px;border-radius:12px}
.p2-sm-nav h2{font:600 20px/28px var(--f);margin:0 16px 16px}
.p2-sm-nav h3{font:600 17px/24px var(--f);margin:24px 16px 8px}
.p2-sm-nav hr{border:0;border-top:1px solid var(--line);margin:8px 16px}
.p2-sm-nav a{display:flex;align-items:center;gap:12px;height:44px;padding:0 16px;border-radius:8px;font:500 15px/20px var(--f)}
.p2-sm-nav a>span{flex:1}
.p2-sm-nav a>svg.i{display:none}
.p2-sm-nav a[aria-current]{background:var(--brand-soft)}
.p2-sm-nav a.p2-sm-ln{color:var(--ink-2)}
.p2-sm-nav a.p2-sm-ln>svg.i{display:block;width:20px;height:20px}
.p2-sm-main{flex:1;min-width:0;display:grid;gap:24px}
.p2-sm-hd{display:flex;gap:16px;align-items:flex-start;margin-bottom:0}
.p2-sm-hd>div:first-child{flex:1}
.p2-sm-hd h1{font:600 24px/32px var(--f);margin:0}
.p2-sm-acts{display:flex;gap:8px}
.p2-sc{background:var(--p2-card);border-radius:16px;box-shadow:var(--inset);padding:40px}
.p2-sc-h{display:flex;gap:16px;align-items:flex-start;margin-bottom:24px}
.p2-sc-h>div{flex:1}
.p2-sc-h h3{font:600 20px/28px var(--f);margin:0 0 4px;display:flex;align-items:center;gap:8px}
.p2-sc-tag{font:500 13px/16px var(--f);font-style:normal;padding:2px 8px;border-radius:999px;background:var(--bg-3);color:var(--ink-2)}
.p2-kv{display:grid;grid-template-columns:1fr 1fr;gap:16px 16px;margin:0}
.p2-kv dt{font-size:15px;font-weight:500}
.p2-kv dd{margin:0;color:var(--ink-2)}
.p2-kv dd.p2-a{color:var(--brand)}
.p2-sc-note{margin-top:24px;padding:16px 20px;border-radius:12px;border:1px solid var(--line);background:var(--p2-soft)}
.p2-sc-nr{display:flex;align-items:center;gap:16px;justify-content:space-between}
.p2-chk{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.p2-chk li{display:flex;gap:8px;align-items:flex-start}
.p2-chk li>svg.i{width:20px;height:20px;color:var(--ok);margin-top:0}
.p2-chk li b{font-weight:600}
.p2-sr{display:flex;align-items:center;gap:16px;min-height:80px;padding:16px 24px;border-radius:12px;background:var(--p2-card);box-shadow:var(--inset);margin-bottom:-8px;position:relative;overflow:hidden}
.p2-sr.bar{min-height:88px}
.p2-sr.bar::before{content:"";position:absolute;right:0;top:0;bottom:0;width:4px;background:var(--bar)}
.p2-sr-ic{width:48px;height:48px;border-radius:8px;background:var(--bg-2);display:grid;place-items:center;flex:none}
.p2-sr-ic svg.i{width:20px;height:20px}
.p2-sr-em{font-size:20px;width:36px;text-align:center}
.p2-sr-t{flex:1;display:flex;flex-direction:column}
.p2-sr-t b{font:600 15px/20px var(--f);display:flex;align-items:center;gap:8px}
.p2-sr-t .ok{color:var(--ok)}
.p2-sr-t .mute{color:var(--ink-2)}
.p2-ok-i{width:18px!important;height:18px!important;color:var(--ink-3)}
.p2-sr-lock{color:var(--ink-3)}
.p2-sr-lock svg.i{width:24px;height:24px}
.p2-av.s32{width:32px;height:32px;font-size:11px;margin-left:-14px;box-shadow:0 0 0 2px var(--bg)}
.p2-sh2{margin:16px 0 0}
.p2-sc-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:96px 40px}
.p2-sc-empty b{font:600 20px/28px var(--f)}
.p2-sc-empty p{color:var(--ink-2);max-width:520px;margin-top:4px}
.p2-sc-empty .p2-btn{margin-top:24px}
.p2-loc{display:flex;padding:0;overflow:hidden}
.p2-loc-im{width:265px;flex:none;background:var(--brand-soft)}
.p2-loc-im img{width:100%;height:100%;object-fit:cover}
.p2-loc-t{padding:32px 20px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;font-size:17px;line-height:24px;color:var(--ink-2)}
.p2-loc-t h3{font:600 20px/28px var(--f);color:var(--ink);margin:0}
.p2-loc-t .st{width:16px;height:16px;color:var(--star)}
.p2-loc-t .p2-btn{margin-top:16px;color:var(--ink)}
.p2-sp-dark{border-radius:12px;background:#000;color:#fff;overflow:hidden}
.p2-sp-t{padding:32px}
.p2-sp-t .p2-up-addon{margin-bottom:16px}
.p2-sp-t .p2-up-addon>i{width:40px;height:40px}
.p2-sp-t h3{font:600 28px/36px var(--f);margin:0 0 16px}
.p2-sp-t ul,.p2-res ul,.p2-rg ul{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:8px}
.p2-sp-t li,.p2-res li,.p2-rg li{display:flex;gap:8px}
.p2-sp-t li svg.i,.p2-res li svg.i,.p2-rg li svg.i{width:20px;height:20px}
.p2-sp-b{display:flex;gap:8px}
.p2-sp-t .p2-btn.ghost{color:#fff}
.p2-sp-art{position:relative;height:300px;background:radial-gradient(60% 80% at 30% 100%,#5b1d7a 0,transparent 70%),radial-gradient(50% 70% at 80% 90%,#7a1d4a 0,transparent 70%)}
.p2-sp-pos{position:absolute;right:60px;bottom:-30px;width:210px;height:260px;transform:rotate(-30deg);border-radius:24px;background:#1d1d25;border:6px solid #333;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;font:500 18px/1 var(--f);color:#ccc}
.p2-sp-pos b{font:800 22px/1 var(--f);color:#fff;margin-bottom:8px}
.p2-sp-phone{position:absolute;left:80px;bottom:-60px;width:180px;height:300px;transform:rotate(40deg);border-radius:28px;background:#111;border:5px solid #2c2c2c}
.p2-sp-phone i{position:absolute;inset:60px 20px 120px;border-radius:12px;background:linear-gradient(135deg,#2d76ec,#6950f3)}
.p2-pn{padding:40px 32px;position:relative;overflow:hidden;color:#fff;background:linear-gradient(90deg,#1d6cf0,#3a8cff)}
.p2-pn .p2-btn{background:transparent;color:#fff;border-color:transparent;padding:0}
.p2-pn-ph{position:absolute;left:24px;top:24px;width:150px;height:110px;border-radius:14px;background:#1b1b1f;transform:rotate(-12deg)}
.p2-pn-ph i{position:absolute;inset:14px 20px;border-radius:8px;background:linear-gradient(135deg,#2d76ec,#6950f3)}
.p2-pn h3{font:600 24px/32px var(--f);margin:16px 0 24px}
.p2-res{padding:48px 48px 0;overflow:hidden}
.p2-res h3{font:600 24px/32px var(--f);margin:24px 0}
.p2-res-im{position:relative;margin:56px -48px 0;height:330px;border-radius:50% 50% 0 0/40px 40px 0 0;overflow:hidden}
.p2-res-im img{width:100%;height:100%;object-fit:cover;filter:sepia(.5) saturate(1.4)}
.p2-res-im div{position:absolute;left:36px;top:58px;display:grid;gap:12px}
.p2-res-im span{display:flex;align-items:center;gap:8px;width:136px;height:40px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.6);background:rgba(255,255,255,.15);color:#fff;font:600 13px/16px var(--f)}
.p2-res-im span svg.i{width:18px;height:18px}
.p2-rg{padding:48px 48px 0;overflow:hidden;position:relative}
.p2-rg::after{content:"";position:absolute;left:-100px;bottom:-200px;width:700px;height:520px;border-radius:50%;background:radial-gradient(closest-side,#7ee8dc,transparent);opacity:.8;pointer-events:none}
.p2-rg h3{font:600 34px/40px var(--f);margin:8px 0 16px}
.p2-rg-l{font-size:17px;line-height:24px;margin-bottom:24px}
.p2-rg-ph{position:relative;z-index:1;margin:80px auto 0;width:294px;height:240px;border-radius:44px 44px 0 0;border:8px solid #222;border-bottom:0;background:var(--bg-2);padding:40px 16px 0}
.p2-rg-ph>div>b{font:600 20px/28px var(--f)}
.p2-rg-c{background:var(--bg);border-radius:12px;padding:16px;margin-top:16px;position:relative;font-size:10px}
.p2-rg-c small{display:block;color:var(--ink-2)}
.p2-rg-c em{position:absolute;left:12px;top:12px;font-style:normal;background:var(--ok);color:#fff;border-radius:999px;padding:2px 10px}
.p2-rg-c strong{display:block;font:600 22px/30px var(--f);margin:4px 0}
.p2-tg-r{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:12px 0}
.p2-tg-r small{display:block;font-size:13px;line-height:16px;color:var(--ink-2)}
.p2-tg-r b{font-weight:600}
.p2-tgl{display:grid;gap:4px}
.p2-tgl .p2-tg-r{padding:6px 0}
.p2-adv{display:block;margin-top:24px}
.p2-sm{font-size:13px}
.p2-cm-n{display:flex;gap:12px;align-items:flex-start}
.p2-cm-n a{display:inline-flex;align-items:center;gap:8px;margin-top:12px;font-weight:500}
.p2-cm-n svg.i{width:20px;height:20px}
.p2-sc .tg{flex:none}
.p2-ccb{position:relative;display:flex;border-radius:12px;overflow:hidden;color:#fff;min-height:208px;background:linear-gradient(90deg,#4f6ff3,#6950f3 50%,#8a2be2)}
.p2-ccb>div:first-child{flex:1;padding:24px}
.p2-ccb .p2-up-eb{color:#d8d6ff}
.p2-ccb>div>b{display:block;font:600 17px/24px var(--f);margin-bottom:4px}
.p2-ccb a{display:inline-flex;align-items:center;gap:8px;margin-top:20px;font:600 17px/24px var(--f)}
.p2-ccb-ph{width:220px;margin:28px 0 0 60px;border-radius:28px 28px 0 0;border:6px solid #222;border-bottom:0;background:linear-gradient(160deg,#4fb6e8,#2a6ad8);text-align:center;padding-top:30px;position:relative}
.p2-ccb-ph p{font-size:9px}
.p2-ccb-ph>b{font:600 44px/1 var(--f)}
.p2-ccb-ph span{position:absolute;right:-30px;left:-30px;bottom:24px;display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:12px;background:rgba(255,255,255,.3);text-align:right;font-size:9px}
.p2-ccb-ph span img{width:24px;height:24px;border-radius:50%}
.p2-ccb-ph small b{display:block}
.p2-ccb-x{position:absolute;left:20px;top:16px;color:#fff}
.p2-ccb-x svg.i{width:24px;height:24px}
.p2-cc-b{margin-top:24px}
.p2-sm-mob{display:none}
@container (max-width:600px){
  .p2-sm{padding:0 20px 32px}
  .p2-crumb,.p2-sm-nav{display:none}
  .p2-sm-row{display:block}
  .p2-sm-hd{flex-direction:column}
  .p2-sm-hd h1{font-size:28px;line-height:36px}
  .p2-sc{padding:24px}
  .p2-kv{grid-template-columns:1fr}
  .p2-loc{flex-direction:column}
  .p2-loc-im{width:auto;height:180px}
  .p2-ccb-ph{display:none}
  .p2-smp:not(.p2-smsub) .p2-sm{display:none}
  .p2-smp:not(.p2-smsub) .p2-sm-mob{display:block;padding:0 20px 32px}
  .p2-sm-mob h1{font:600 28px/36px var(--f);margin:0 0 32px}
  .p2-sm-mob .p2-h20{margin:32px 0 16px}
  .p2-sm-mob .p2-st-ml button{font-weight:500}
  .p2-sm-mob .p2-sm-mln{margin-top:24px}
  /* settings sub-pages on the phone render flat, as captured (b-settings-sched-*, b-settings-sales-*):
     white page, no card boxes, header actions live in the top bar (setPage → mtop) */
  .p2-smsub{background:var(--bg);min-height:100%}
  .p2-smsub .p2-sm{padding:8px 19px 40px}
  .p2-smsub .p2-sm-acts{display:none}
  .p2-smsub .p2-sm-main{gap:0}
  .p2-smsub .p2-sm-hd{margin-bottom:32px;gap:8px}
  .p2-smsub .p2-sm-hd h1{font:600 28px/36px var(--f)}
  .p2-smsub .p2-sm-hd .p2-mute{font-size:13px;line-height:18px}
  .p2-smsub .p2-sc:not(.p2-pn):not(.p2-res):not(.p2-rg):not(.p2-loc):not(.p2-box){background:none;box-shadow:none;border-radius:0;padding:0;margin-bottom:40px}
  .p2-smsub .p2-sc-h{margin-bottom:16px;align-items:center}
  .p2-smsub .p2-sc-h h3{font:600 17px/24px var(--f);margin:0}
  .p2-smsub .p2-sc-h .p2-mute{font-size:13px;line-height:18px;margin-top:4px}
  .p2-smsub .p2-sc-h:has(.p2-mute){align-items:flex-start}
  .p2-smsub .p2-sc-edit{height:36px;padding:0 15px;font:500 14px/20px var(--f)}
  .p2-smsub .p2-kv{gap:13px}
  .p2-smsub .p2-kv dt{font:500 14px/21px var(--f)}
  .p2-smsub .p2-kv dd{font-size:14px;line-height:21px}
  .p2-smsub .p2-chk{font-size:14px;line-height:20px}
  .p2-smsub .p2-sc-note{margin-top:24px;padding:12px 16px;font-size:13px;line-height:18px}
  .p2-smsub .p2-sr{background:none;box-shadow:none;border-radius:0;margin:0 -16px;padding:12px 16px;min-height:72px;gap:12px}
  .p2-smsub .p2-sr+.p2-sr{border-top:1px solid var(--line)}
  .p2-smsub .p2-sr.bar{margin:0;padding-right:16px}
  .p2-smsub .p2-sr-t b{font:600 14px/20px var(--f)}
  .p2-smsub .p2-sr-t>span{font-size:13px;line-height:18px}
  .p2-smsub .p2-sr-ic{width:40px;height:40px}
  .p2-smsub .p2-sc-empty{padding:72px 8px;margin:0}
  .p2-smsub .p2-sc-empty b{font:600 17px/24px var(--f)}
  .p2-smsub .p2-sc-empty p{font-size:13px;line-height:18px}
}
.p2-sr-badge{font:500 12px/16px var(--f);font-style:normal;color:var(--ok);background:var(--bg-2);border-radius:999px;padding:3px 9px;white-space:nowrap}
.p2-chk li.mn>svg.i{color:var(--ink-2)}
/* card processing */
.p2-soon{display:inline-block;font:500 13px/16px var(--f);font-style:normal;color:var(--brand);background:var(--brand-soft);border:1px solid var(--brand-soft-2);border-radius:999px;padding:3px 11px;margin-bottom:24px;align-self:flex-start}
.p2-cp .p2-up-addon>i{background:linear-gradient(135deg,#3b82f6,#1d4ed8)}
.p2-cp h1{margin-bottom:16px}
.p2-cards{display:flex;gap:16px;margin-top:80px;flex-wrap:wrap}
.p2-cards span{font:700 13px/24px var(--f);color:var(--ink-2);padding:0 6px;border:1px solid var(--line);border-radius:4px}
.p2-cp-ph{position:absolute;left:40px;top:-120px;width:260px;height:300px;border-radius:30px;background:#222;transform:rotate(25deg)}
.p2-cp-ph i{position:absolute;inset:150px 30px 40px;border-radius:12px;background:linear-gradient(135deg,#2d76ec,#6950f3)}
.p2-sc .tg{width:48px;height:28px;border-radius:999px;background:var(--line-2);position:relative;flex:none;transition:background .15s}
.p2-sc .tg i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:left .15s}
.p2-sc .tg[aria-checked="true"]{background:var(--brand)}
.p2-sc .tg[aria-checked="true"] i{left:23px}

/* ---------- full-screen forms ---------- */
.p2-fm{min-height:calc(100vh - var(--hub-h));background:var(--bg);color:var(--ink);font-size:15px;line-height:20px;position:relative}
html.bare .p2-fm{min-height:100vh}
.p2-fm.grey{background:var(--bg-2)}
.p2-fm-top{position:absolute;left:32px;top:12px;display:flex;gap:8px;flex-direction:row-reverse}
.p2-fm-x{display:none}
.p2-fm-in{padding:96px 120px 64px}
.p2-fm h1{font:700 40px/44px var(--f);margin:0 0 32px}
.p2-fm-tabs{display:none}
.p2-fm-row{display:flex;gap:96px;align-items:flex-start}
.p2-fm-nav{width:296px;flex:none;padding:24px 16px 16px;border-radius:16px}
.p2-fm-nav h3{font:600 17px/24px var(--f);margin:8px 16px 8px}
.p2-fm-nav hr{border:0;border-top:1px solid var(--line);margin:8px 16px 16px}
.p2-fm-nav a{display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 16px;border-radius:8px;font:400 15px/20px var(--f)}
.p2-fm-nav a[aria-current]{background:var(--brand-soft)}
.p2-fm-main{flex:1;min-width:0;max-width:792px;display:grid;gap:32px}
.p2-fm-s h2{font:600 24px/32px var(--f);margin:0}
.p2-fm-s>p{margin-bottom:24px}
.p2-fm-s.card{background:var(--bg);border-radius:16px;box-shadow:var(--inset);padding:40px 40px 32px}
.p2-fm-s.card h2{margin-bottom:24px}
.p2-fm-hr{border:0;border-top:1px solid var(--line);margin:32px 0 0}
.p2-fg{display:grid;grid-template-columns:1fr 1fr;gap:24px 16px}
.p2-fg.g3{grid-template-columns:1fr 1fr 1fr}
.p2-fg2{display:grid;grid-template-columns:1fr 117px;gap:16px}
.p2-f{display:flex;flex-direction:column;gap:8px;min-width:0}
.p2-f.w2{grid-column:1/-1}
.p2-f-l{display:flex;justify-content:space-between;font:600 15px/20px var(--f)}
.p2-f-l i{font-style:normal;font-weight:400;color:var(--ink-2);margin-left:auto;margin-right:4px}
.p2-f-l em{font-style:normal;font-weight:400;color:var(--ink-2)}
.p2-f input,.p2-f textarea,.p2-f-s,.p2-f-pre{height:48px;border:1px solid var(--line-2);border-radius:8px;background:var(--bg);padding:0 16px;font:400 15px/20px var(--f);color:var(--ink);outline:0;width:100%}
.p2-f textarea{height:120px;padding:14px 16px;resize:none}
.p2-f input::placeholder,.p2-f textarea::placeholder{color:var(--ink-3)}
.p2-f-s{display:flex;align-items:center;justify-content:space-between;color:var(--ink-3)}
.p2-f-s.v{color:var(--ink)}
.p2-f-s svg.i{width:20px;height:20px;color:var(--ink)}
.p2-f-pre{display:flex;align-items:center;gap:8px}
.p2-f-pre i{font-style:normal;color:var(--ink-2)}
.p2-f-pre input{border:0;height:46px;padding:0}
.p2-f small{font-size:13px;line-height:16px;color:var(--ink-2)}
.p2-f-ph{display:grid;grid-template-columns:105px 1fr;gap:8px}
.p2-f-b{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.p2-f-av{position:relative;width:120px;height:120px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;margin-bottom:32px}
.p2-f-av>span svg.i{width:60px;height:60px}
.p2-f-av>i{position:absolute;left:-2px;bottom:0;width:36px;height:36px;border-radius:50%;background:var(--bg-2);border:2px solid var(--bg);display:grid;place-items:center;color:var(--ink-2)}
.p2-f-av>i svg.i{width:16px;height:16px}
.p2-f-col{display:flex;flex-wrap:wrap;gap:16px 26px}
.p2-f-col i{width:24px;height:24px;border-radius:50%}
.p2-f-col i.on{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--ink)}
.p2-fm-pills{display:flex;gap:8px;margin-top:24px}
.p2-fm-bar{display:none}
@container (max-width:600px){
  .p2-fm,.p2-fm.grey{position:fixed;inset:0;z-index:60;overflow-y:auto;min-height:0;background:var(--bg)}
  .p2-fm-top{position:static;display:flex;justify-content:flex-start;height:72px;align-items:center;padding:0 20px}
  .p2-fm-top .p2-btn{display:none}
  .p2-fm-x{display:grid;place-items:center;width:24px;height:24px;margin-right:auto}
  .p2-fm-x svg.i{width:24px;height:24px}
  .p2-fm-in{padding:0 20px 120px}
  .p2-fm h1{font:600 28px/36px var(--f);margin-bottom:24px}
  .p2-fm-tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin:0 -20px 16px;padding:0 20px}
  .p2-fm-tabs button{height:36px;padding:0 16px;border-radius:999px;font:600 15px/20px var(--f);white-space:nowrap;display:inline-flex;align-items:center;gap:8px}
  .p2-fm-tabs button[aria-selected="true"]{background:var(--ink);color:var(--on-ink)}
  .p2-fm-tabs.u{gap:24px;border-bottom:1px solid var(--line);padding-bottom:0}
  .p2-fm-tabs.u button{padding:0;border-radius:0;height:44px;border-bottom:2px solid transparent}
  .p2-fm-tabs.u button[aria-selected="true"]{background:none;color:var(--ink);border-color:var(--ink)}
  .p2-fm-row{display:block}
  .p2-fm-nav{display:none}
  .p2-fm-s.card{padding:16px 0;box-shadow:none;background:none}
  .p2-fm-s h2{font-size:20px;line-height:28px}
  .p2-fg{grid-template-columns:1fr 1fr;gap:24px 16px}
  .p2-fg>*{grid-column:1/-1}
  .p2-fg.np>.p2-f:nth-child(-n+2){grid-column:auto}
  .p2-fg>span:empty{display:none}
  .p2-fg.g3{grid-template-columns:1fr}
  .p2-fm-bar{display:block;position:fixed;left:0;right:0;bottom:0;padding:16px 20px;background:var(--bg);border-top:1px solid var(--line)}
}

@container (max-width:600px){.p2-tmp .p2-tb-m .p2-srch{border-radius:999px}}

.p2-fm-one .p2-fm-in{max-width:935px;margin:0 auto;padding:96px 120px 64px}
.p2-fm-one .p2-fm-main{max-width:695px;gap:40px}
.p2-fm-d{margin:4px 0 24px}
.p2-fm-one .p2-sc-note{margin-top:24px}
/* phone: the single-column form uses the phone form layout (no desktop padding, flat sections) */
/* tablet / small laptop: the 120px side padding + 296px section nav + 96px gap left the form column ~136px at 768 */
@container (min-width:601px) and (max-width:1100px){.p2-fm-in,.p2-fm-one .p2-fm-in{padding:64px 40px 64px}.p2-fm-row{gap:40px}}
@container (min-width:601px) and (max-width:900px){.p2-fm-row{display:block}.p2-fm-nav{display:none}}
@container (max-width:600px){.p2-fm-one .p2-fm-in{max-width:none;padding:0 20px 120px}.p2-fm-one .p2-fm-main{max-width:none;gap:24px}.p2-fm-one .p2-fm-s.card{padding:0;border:0;box-shadow:none;background:none}}
.p2-rd{display:flex;gap:12px;margin-bottom:16px}
.p2-rd i{width:24px;height:24px;border-radius:50%;border:1px solid var(--line-2);flex:none;margin-top:2px}
.p2-rd i.on{border:7px solid var(--brand)}
.p2-rd b{display:block;font-weight:400}
.p2-rd small{display:block;font-size:13px;line-height:16px;color:var(--ink-2)}
.p2-lang{display:flex;align-items:flex-end;gap:16px;justify-content:space-between;margin-top:16px}
.p2-lang>div{display:flex;flex-direction:column}
.p2-lang .p2-f{flex:1;max-width:50%}

.p2-faces{display:flex;align-items:center;gap:8px;margin-bottom:24px}
.p2-faces span{width:40px;height:40px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 3px var(--c)}
.p2-faces span.c2{width:56px;height:56px}
.p2-faces img{width:100%;height:100%;object-fit:cover}
.p2-faces .c0{--c:#f4a8c8}.p2-faces .c1{--c:#7ad1ff}.p2-faces .c2{--c:#f68b6b}.p2-faces .c3{--c:#ff9fe0}.p2-faces .c4{--c:#ffb44a}

@container (max-width:600px){.p2-cn .p2-up-bg i:nth-child(1){left:-200px;top:auto;bottom:-260px}}
.p2-hist-ph{display:none;position:absolute;left:40px;top:50%;width:326px;height:684px;transform:translateY(-50%) scale(.75);transform-origin:left center}
.p2-hist-ph .p2-cn-ph{left:0;top:0;transform:none}
@container (max-width:600px){.p2-hist-ph{display:block;left:50%;top:10px;transform:translateX(-50%) scale(.8);transform-origin:top center}}

/* ======================= restyle v3 (business) — panel2 finish (form only; colours unchanged) ======================= */
.p2-btn{height:44px;padding:0 18px;border-radius:var(--r-btn);font:600 15px/20px var(--f);
  transition:background-color var(--d-2) var(--ease),border-color var(--d-2),opacity var(--d-2),transform var(--d-1) var(--ease)}
.p2-btn:hover{border-color:var(--ink-3)}
.p2-btn:active:not([disabled]){transform:scale(.98)}
.p2-btn.pri:hover{opacity:.88;border-color:var(--ink)}
.p2-btn.ghost:hover{background:var(--hover-tint);border-color:transparent}
.p2-btn svg.i{width:20px;height:20px}
.p2-btn.sm{height:36px;padding:0 13px;border-radius:var(--r-ctl);font:500 14px/20px var(--f)}
.p2-btn.sm svg.i{width:18px;height:18px}
.p2-btn.ic48{width:44px}
.p2-mt-acts .p2-btn{border-radius:var(--r-ctl)}
.p2-dots{border-radius:var(--r-ctl);transition:background-color var(--d-2)}
.p2-dots:hover{background:var(--hover-tint)}
/* segmented tabs */
.p2-tabs{width:fit-content;max-width:100%;gap:2px;padding:3px;background:var(--bg-2);border-radius:var(--r-btn);box-shadow:inset 0 0 0 1px var(--line)}
.p2-tab{height:34px;padding:0 14px;border-radius:9px;font:600 14px/20px var(--f);color:var(--p-seg-ink);transition:background-color var(--d-2) var(--ease),color var(--d-2),box-shadow var(--d-2)}
.p2-tab:hover{color:var(--ink)}
.p2-tab[aria-selected="true"]{background:var(--p-seg-on);color:var(--ink);box-shadow:var(--sh-seg)}
.p2-utab{transition:border-color var(--d-2),color var(--d-2)}
.p2-utab:not([aria-selected="true"]){color:var(--ink-2)}
.p2-utab:hover{color:var(--ink)}
/* toolbar, search */
.p2-tb-in{border-radius:var(--r-card);padding:12px 14px;box-shadow:inset 0 0 0 1px var(--line),var(--sh-1)}
.p2-tb-in.soft{box-shadow:inset 0 0 0 1px var(--line)}
.p2-srch{height:40px;border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.p2-srch:hover{border-color:var(--ink-3)}
.p2-srch:focus-within{border-color:var(--brand);box-shadow:var(--ring)}
.p2-srch input{height:38px}
/* cards: hairline + near-flat shadow; navigable cards lift */
.p2-card,.p2-empty,.p2-sc,.p2-ad,.p2-st-c,.p2-rs-r,.p2-plan,.p2-lk-c,.p2-vid{border-radius:var(--r-card);box-shadow:var(--inset),var(--sh-1)}
.p2-fm-s.card{border-radius:var(--r-card);box-shadow:var(--inset),var(--sh-1)}
.p2-empty b{font:650 18px/26px var(--f)}
.p2-st-c,.p2-rs-r,.p2-ad{transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease)}
@media (hover:hover){.p2-st-c:hover,.p2-rs-r:hover{transform:translateY(var(--lift));box-shadow:var(--inset),var(--sh-2)}}
.p2-st-c b,.p2-ad h3{font-weight:650}
.p2-st-ic{width:40px;height:40px;margin-bottom:14px;border-radius:var(--r-md);background:var(--brand-soft);display:grid;place-items:center}
.p2-st-ic svg.i{width:22px;height:22px}
.p2-rs-r{height:80px}
.p2-rs-ic{border-radius:var(--r-md)}
/* side navs of settings / reports / forms: 40–44px rows, 10px radius, soft active */
.p2-rs-side,.p2-sm-nav,.p2-fm-nav{border-radius:var(--r-card)}
.p2-rs-i,.p2-sm-nav a,.p2-fm-nav a{border-radius:var(--r-ctl);transition:background-color var(--d-2) var(--ease)}
.p2-rs-i:hover,.p2-sm-nav a:hover,.p2-fm-nav a:hover{background:var(--hover-tint)}
.p2-rs-i[aria-current],.p2-sm-nav a[aria-current],.p2-fm-nav a[aria-current]{background:var(--brand-soft);font-weight:600;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 14%,transparent)}
/* tables: quieter header, denser rows, hover */
.p2-tbl th{height:48px;font:600 13.5px/20px var(--f);color:var(--ink-2)}
.p2-tbl td{height:72px}
.p2-tbl tbody tr{transition:background-color var(--d-1)}
.p2-tbl tbody tr:hover{background:var(--p-row-h)}
.p2-cb{border-radius:6px}
/* form fields */
.p2-f input,.p2-f textarea,.p2-f-s,.p2-f-pre{height:44px;border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.p2-f textarea{height:120px}
.p2-f-pre input{height:42px}
.p2-f input:hover,.p2-f textarea:hover,.p2-f-s:hover,.p2-f-pre:hover{border-color:var(--ink-3)}
.p2-f input:focus,.p2-f textarea:focus,.p2-f-pre:focus-within{border-color:var(--brand);box-shadow:var(--ring)}
.p2-f-pre input:focus{box-shadow:none}
.p2-fm h1{font-weight:700;line-height:1.25}
.p2-fm-s h2{font-weight:650}
.p2-sm-hd h1{font-weight:650}
@container (max-width:600px){
  .p2-tb-m .p2-srch{height:44px;border-radius:var(--r-ctl)}
  .p2-tb-m .p2-srch input{height:42px}
  .p2-card,.p2-empty,.p2-sc,.p2-ad,.p2-st-c,.p2-rs-r{box-shadow:var(--inset)}
  .p2-rs-mob .p2-rs-side{box-shadow:none}
}
/* ======================= end restyle v3 (business) — panel2 ======================= */

/* ======================= restyle v3 palette (business) — Accord LIGHT colours (panel2) =======================
   Light values via variables; the two dark blocks give every one back its previous dark value (dark mode unchanged). */
[data-app]{--p2-tag-blue:#0f9db0;--p2-yellow:#fbeed6;--p2-yellow-line:#f1d7a6;--p2-orange:#9a5a06;--p2-soft:var(--bg-4);--p2-badge:#14231d0d;--p2-teal:#0f9db0;--p2-sky:#0b6f7c;--p2-ok-chip:var(--ok-soft);--p2-card:var(--bg);
  --p2-wrap:var(--page); --p2-wrap-w:var(--page); --p2-fill:var(--night); --p2-fill-ink:var(--on-night);
  --p2-imp:linear-gradient(-135deg,#14231d 0%,#14231d 44%,#0b7658 76%,#12a079 100%);
  --p2-ccb:linear-gradient(90deg,#14231d,#0b5440 55%,#0b7658); --p2-ccb-eb:#b3c4bb;
  --p2-scr:linear-gradient(135deg,#12a079,#0b7658); --p2-ws-ic:linear-gradient(135deg,#0f9db0,#0b7658); --p2-cp-ic:linear-gradient(135deg,#0f9db0,#0b6f7c);
  --p2-ill-1:#12a079; --p2-ill-1-soft:#d3eee2; --p2-ill-dl:#d3eee2; --p2-ill-2:#0b7658;
  --p2-u-p1:#cde2d6;--p2-u-p3:#d3eee2;--p2-u-p2:#e2efe8; --p2-u-b1:#bfe6ec;--p2-u-b3:#d2eef2;--p2-u-b2:#d3eee2;
  --p2-u-t1:#b9dccb;--p2-u-t3:#d3eee2;--p2-u-t2:#d2eef2; --p2-u-k1:#fbdfe2;--p2-u-k3:#fbe6d1;--p2-u-k2:#f6efe0; --p2-u-v1:#cde2d6;--p2-u-v3:#d2eef2;--p2-u-v2:#e2efe8}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) [data-app]{--p2-teal:#2bd6c6;
  --p2-wrap:var(--bg-2); --p2-wrap-w:var(--bg); --p2-fill:var(--brand); --p2-fill-ink:#fff;
  --p2-imp:linear-gradient(-135deg,#141414 0%,#141414 44%,#7303c0 71%,#ec3812 100%);
  --p2-ccb:linear-gradient(90deg,#4f6ff3,#6950f3 50%,#8a2be2); --p2-ccb-eb:#d8d6ff;
  --p2-scr:linear-gradient(135deg,#2d76ec,#6950f3); --p2-ws-ic:linear-gradient(135deg,#0ea5b7,#4f46e5); --p2-cp-ic:linear-gradient(135deg,#3b82f6,#1d4ed8);
  --p2-ill-1:#a99bf8; --p2-ill-1-soft:#d8d0ff; --p2-ill-dl:#ecebff; --p2-ill-2:#a43bd8;
  --p2-u-p1:#c7b0fb;--p2-u-p3:#d7a6ee;--p2-u-p2:#f3c3f2; --p2-u-b1:#a4abf9;--p2-u-b3:#8fc4fb;--p2-u-b2:#9aeae2;
  --p2-u-t1:#7ee7dc;--p2-u-t3:#6fe3e2;--p2-u-t2:#b8f0d6; --p2-u-k1:#d5b0f3;--p2-u-k3:#df9fd2;--p2-u-k2:#f2c0ef; --p2-u-v1:#a8a3fb;--p2-u-v3:#8fb6fb;--p2-u-v2:#9feee6}}
:root[data-theme="dark"] [data-app]{--p2-teal:#2bd6c6;
  --p2-wrap:var(--bg-2); --p2-wrap-w:var(--bg); --p2-fill:var(--brand); --p2-fill-ink:#fff;
  --p2-imp:linear-gradient(-135deg,#141414 0%,#141414 44%,#7303c0 71%,#ec3812 100%);
  --p2-ccb:linear-gradient(90deg,#4f6ff3,#6950f3 50%,#8a2be2); --p2-ccb-eb:#d8d6ff;
  --p2-scr:linear-gradient(135deg,#2d76ec,#6950f3); --p2-ws-ic:linear-gradient(135deg,#0ea5b7,#4f46e5); --p2-cp-ic:linear-gradient(135deg,#3b82f6,#1d4ed8);
  --p2-ill-1:#a99bf8; --p2-ill-1-soft:#d8d0ff; --p2-ill-dl:#ecebff; --p2-ill-2:#a43bd8;
  --p2-u-p1:#c7b0fb;--p2-u-p3:#d7a6ee;--p2-u-p2:#f3c3f2; --p2-u-b1:#a4abf9;--p2-u-b3:#8fc4fb;--p2-u-b2:#9aeae2;
  --p2-u-t1:#7ee7dc;--p2-u-t3:#6fe3e2;--p2-u-t2:#b8f0d6; --p2-u-k1:#d5b0f3;--p2-u-k3:#df9fd2;--p2-u-k2:#f2c0ef; --p2-u-v1:#a8a3fb;--p2-u-v3:#8fb6fb;--p2-u-v2:#9feee6}
/* cream page under the white cards */
.p2-wrap{background:var(--p2-wrap)}
.p2-wrap.white{background:var(--p2-wrap-w)}
@container (max-width:600px){.p2-wrap.mw{background:var(--p2-wrap-w)}.p2-wrap.mg{background:var(--p2-wrap)}}
/* night = filled action / selected bars */
.p2-fs-ban{background:var(--p2-fill);color:var(--p2-fill-ink)}
.p2-imp{background:var(--p2-imp)}
.p2-ccb{background:var(--p2-ccb)}
.p2-ccb .p2-up-eb{color:var(--p2-ccb-eb)}
/* upsell soft blobs: Accord sage / mint / teal / rose-amber */
.p2-up.purple{--p2-g1:var(--p2-u-p1);--p2-g3:var(--p2-u-p3);--p2-g2:var(--p2-u-p2)}
.p2-up.blue{--p2-g1:var(--p2-u-b1);--p2-g3:var(--p2-u-b3);--p2-g2:var(--p2-u-b2)}
.p2-up.teal{--p2-g1:var(--p2-u-t1);--p2-g3:var(--p2-u-t3);--p2-g2:var(--p2-u-t2)}
.p2-up.pink{--p2-g1:var(--p2-u-k1);--p2-g3:var(--p2-u-k3);--p2-g2:var(--p2-u-k2)}
.p2-up.violet{--p2-g1:var(--p2-u-v1);--p2-g3:var(--p2-u-v3);--p2-g2:var(--p2-u-v2)}
.p2-up{background:var(--p2-wrap)}
@container (max-width:600px){.p2-up{background:var(--p2-wrap-w)}}
/* small product illustrations: purple bits -> emerald family (3rd-party logos keep their own colours) */
.p2-sp-phone i,.p2-pn-ph i,.p2-cp-ph i{background:var(--p2-scr)}
.p2-up-addon>i.ws{background:var(--p2-ws-ic)}
.p2-cp .p2-up-addon>i{background:var(--p2-cp-ic)}
.p2-art-ts-b{background:var(--p2-ill-1)}
.p2-art-ts-n{background:var(--p2-ill-1-soft)}
.p2-art-pk-i svg.i{color:var(--p2-ill-2)}
.p2-art-dl-l i.b{background:var(--p2-ill-dl)}
.p2-av.ring{box-shadow:0 0 0 2px var(--bg),0 0 0 3px var(--p2-tag-blue)}

/* ---- light-only artwork (panel2): scoped to the light theme, so dark mode keeps the original artwork ---- */
@media not all and (prefers-color-scheme:dark){
:root:not([data-theme="dark"]) .p2-ad-ic[style*="#3b82f6,#1d4ed8"],:root:not([data-theme="dark"]) .p2-cp .p2-up-addon>i,:root:not([data-theme="dark"]) .p2-up-addon>i[style*="#3b82f6,#1d4ed8"]{background:linear-gradient(135deg,#0f9db0,#0b6f7c)!important}
:root:not([data-theme="dark"]) .p2-ad-ic[style*="#0ea5b7,#3b82f6"]{background:linear-gradient(135deg,#0f9db0,#0b7658)!important}
:root:not([data-theme="dark"]) .p2-ad-ic[style*="#4f46e5,#a855f7"]{background:linear-gradient(135deg,#0b7658,#12a079)!important}
:root:not([data-theme="dark"]) .p2-ad-ic[style*="#5b5bf0,#7c6cf6"]{background:linear-gradient(135deg,#14231d,#0b5440)!important}
:root:not([data-theme="dark"]) .p2-ad-ic[style*="#6366f1,#7c5cf5"]{background:linear-gradient(135deg,#0b5440,#0b7658)!important}
:root:not([data-theme="dark"]) .p2-ad-ic[style*="#e36ce6,#8b5cf6"]{background:linear-gradient(135deg,#e05a6a,#a8394a)!important}
/* purple CSS artwork -> emerald / night / stage hues */
:root:not([data-theme="dark"]) .p2-up-addon>i{background:linear-gradient(135deg,#e05a6a,#a8394a)}
:root:not([data-theme="dark"]) .p2-art-pk-c{background:radial-gradient(120% 90% at 85% 10%,#12a079 0%,transparent 55%),radial-gradient(90% 80% at 0% 100%,#0b5440 0%,transparent 60%),linear-gradient(135deg,#14231d,#0b7658 60%,#0f9db0)}
:root:not([data-theme="dark"]) .p2-topup{background:linear-gradient(90deg,#14231d,#0b5440 60%,#0b7658)}
:root:not([data-theme="dark"]) .p2-cn-scr{background:radial-gradient(60% 40% at 80% 30%,#0b7658 0,transparent 70%),radial-gradient(70% 50% at 20% 70%,#43c6b0 0,transparent 70%),linear-gradient(160deg,#0b6f7c,#14231d 60%,#12a079)}
:root:not([data-theme="dark"]) .p2-sp-art{background:radial-gradient(60% 80% at 30% 100%,#0b5440 0,transparent 70%),radial-gradient(50% 70% at 80% 90%,#0b6f7c 0,transparent 70%)}
:root:not([data-theme="dark"]) .p2-pn{background:linear-gradient(90deg,#0b6f7c,#0b7658)}
:root:not([data-theme="dark"]) .p2-ccb-ph{background:linear-gradient(160deg,#0f9db0,#0b7658)}
/* purple fills inside inline SVG illustrations (presentation attributes, so CSS wins) */
:root:not([data-theme="dark"]) [data-app] svg :is([fill="#8e6cff"],[fill="#6950f3"],[fill="#7a5cf5"],[fill="#7b5cff"]){fill:#12a079}
:root:not([data-theme="dark"]) [data-app] svg :is([fill="#d84ad6"],[fill="#e45bd3"]){fill:#e05a6a}
:root:not([data-theme="dark"]) [data-app] svg :is([fill="#b9acff"],[fill="#9b87f5"],[fill="#a993ff"]){fill:#9fd6bf}
:root:not([data-theme="dark"]) [data-app] svg :is([fill="#d6ccff"],[fill="#d9d0ff"],[fill="#e9e5ff"],[fill="#f0f0ff"]){fill:#d3eee2}
:root:not([data-theme="dark"]) [data-app] svg [fill="#2d76ec"]{fill:#0f9db0}
:root:not([data-theme="dark"]) [data-app] svg :is([stop-color="#7a5cf5"],[stop-color="#8e6cff"]){stop-color:#12a079}
:root:not([data-theme="dark"]) [data-app] svg :is([stop-color="#b9a8ff"],[stop-color="#c9bdff"],[stop-color="#c9c2ff"],[stop-color="#cdc5ff"],[stop-color="#cfc8ff"]){stop-color:#9fd6bf}
:root:not([data-theme="dark"]) [data-app] svg :is([stop-color="#e14bd8"],[stop-color="#e45bd3"],[stop-color="#ff6fae"]){stop-color:#e05a6a}
:root:not([data-theme="dark"]) [data-app] svg :is([stop-color="#f2efff"],[stop-color="#f4f2ff"]){stop-color:#eef6f1}
:root:not([data-theme="dark"]) [data-app] svg :is([stop-color="#f6a8e0"],[stop-color="#ffd0f0"],[stop-color="#ffd9ef"]){stop-color:#fbdfe2}
:root:not([data-theme="dark"]) [data-app] svg :is([stop-color="#ff9e7a"]){stop-color:#f0a35a}
}
:root[data-theme="light"] .p2-ad-ic[style*="#3b82f6,#1d4ed8"],:root[data-theme="light"] .p2-cp .p2-up-addon>i,:root[data-theme="light"] .p2-up-addon>i[style*="#3b82f6,#1d4ed8"]{background:linear-gradient(135deg,#0f9db0,#0b6f7c)!important}
:root[data-theme="light"] .p2-ad-ic[style*="#0ea5b7,#3b82f6"]{background:linear-gradient(135deg,#0f9db0,#0b7658)!important}
:root[data-theme="light"] .p2-ad-ic[style*="#4f46e5,#a855f7"]{background:linear-gradient(135deg,#0b7658,#12a079)!important}
:root[data-theme="light"] .p2-ad-ic[style*="#5b5bf0,#7c6cf6"]{background:linear-gradient(135deg,#14231d,#0b5440)!important}
:root[data-theme="light"] .p2-ad-ic[style*="#6366f1,#7c5cf5"]{background:linear-gradient(135deg,#0b5440,#0b7658)!important}
:root[data-theme="light"] .p2-ad-ic[style*="#e36ce6,#8b5cf6"]{background:linear-gradient(135deg,#e05a6a,#a8394a)!important}
/* purple CSS artwork -> emerald / night / stage hues */
:root[data-theme="light"] .p2-up-addon>i{background:linear-gradient(135deg,#e05a6a,#a8394a)}
:root[data-theme="light"] .p2-art-pk-c{background:radial-gradient(120% 90% at 85% 10%,#12a079 0%,transparent 55%),radial-gradient(90% 80% at 0% 100%,#0b5440 0%,transparent 60%),linear-gradient(135deg,#14231d,#0b7658 60%,#0f9db0)}
:root[data-theme="light"] .p2-topup{background:linear-gradient(90deg,#14231d,#0b5440 60%,#0b7658)}
:root[data-theme="light"] .p2-cn-scr{background:radial-gradient(60% 40% at 80% 30%,#0b7658 0,transparent 70%),radial-gradient(70% 50% at 20% 70%,#43c6b0 0,transparent 70%),linear-gradient(160deg,#0b6f7c,#14231d 60%,#12a079)}
:root[data-theme="light"] .p2-sp-art{background:radial-gradient(60% 80% at 30% 100%,#0b5440 0,transparent 70%),radial-gradient(50% 70% at 80% 90%,#0b6f7c 0,transparent 70%)}
:root[data-theme="light"] .p2-pn{background:linear-gradient(90deg,#0b6f7c,#0b7658)}
:root[data-theme="light"] .p2-ccb-ph{background:linear-gradient(160deg,#0f9db0,#0b7658)}
/* purple fills inside inline SVG illustrations (presentation attributes, so CSS wins) */
:root[data-theme="light"] [data-app] svg :is([fill="#8e6cff"],[fill="#6950f3"],[fill="#7a5cf5"],[fill="#7b5cff"]){fill:#12a079}
:root[data-theme="light"] [data-app] svg :is([fill="#d84ad6"],[fill="#e45bd3"]){fill:#e05a6a}
:root[data-theme="light"] [data-app] svg :is([fill="#b9acff"],[fill="#9b87f5"],[fill="#a993ff"]){fill:#9fd6bf}
:root[data-theme="light"] [data-app] svg :is([fill="#d6ccff"],[fill="#d9d0ff"],[fill="#e9e5ff"],[fill="#f0f0ff"]){fill:#d3eee2}
:root[data-theme="light"] [data-app] svg [fill="#2d76ec"]{fill:#0f9db0}
:root[data-theme="light"] [data-app] svg :is([stop-color="#7a5cf5"],[stop-color="#8e6cff"]){stop-color:#12a079}
:root[data-theme="light"] [data-app] svg :is([stop-color="#b9a8ff"],[stop-color="#c9bdff"],[stop-color="#c9c2ff"],[stop-color="#cdc5ff"],[stop-color="#cfc8ff"]){stop-color:#9fd6bf}
:root[data-theme="light"] [data-app] svg :is([stop-color="#e14bd8"],[stop-color="#e45bd3"],[stop-color="#ff6fae"]){stop-color:#e05a6a}
:root[data-theme="light"] [data-app] svg :is([stop-color="#f2efff"],[stop-color="#f4f2ff"]){stop-color:#eef6f1}
:root[data-theme="light"] [data-app] svg :is([stop-color="#f6a8e0"],[stop-color="#ffd0f0"],[stop-color="#ffd9ef"]){stop-color:#fbdfe2}
:root[data-theme="light"] [data-app] svg :is([stop-color="#ff9e7a"]){stop-color:#f0a35a}
/* ======================= end restyle v3 palette (business) panel2 ======================= */


/* panel3 — foundation styles (prefix p3-, plus the phone bottom-sheet mode of panel.js pMenu). Only base.css tokens.
   Phone sizes measured from capture/phone/b-*@1x.xml (411 dp wide screen; dp ≈ px here). */

/* ---------- pMenu as a bottom sheet (narrow app) ---------- */
.p-pop-scrim.dim{background:rgba(13,13,13,.4);animation:fq-fade .15s ease}
.p-pop.sheet{left:0;right:0;bottom:0;top:auto;width:auto;min-width:0;max-height:calc(100% - 48px);display:flex;flex-direction:column;
  border-radius:16px 16px 0 0;padding:0 0 12px;box-shadow:var(--sh-pop);animation:p3-up .2s ease}
.p-pop.sheet .p-pop-sh{display:flex;flex-direction:column;align-items:stretch;padding:8px 8px 0}
.p-pop.sheet .p-pop-x{align-self:flex-end;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;color:var(--ink)}
.p-pop.sheet .p-pop-x:hover{background:var(--bg-2)}
.p-pop.sheet .p-pop-sh h3{font:600 24px/32px var(--f);padding:4px 11px 20px;margin:0}
.p-pop.sheet .p-pop-in{overflow:auto;padding:0 8px}
.p-pop.sheet .it{min-height:46px;padding:11px 11px;font-size:15px;font-weight:400;line-height:22px;gap:14px;border-radius:8px}
.p-pop.sheet .it svg.i{width:22px;height:22px}
.p-pop.sheet hr{margin:8px 11px}
.p-pop-hd{padding:8px 12px 4px;font-size:13px;line-height:16px;color:var(--ink-2);font-weight:600;margin:0}
.p-pop.sheet .p-pop-hd{font:600 18px/24px var(--f);color:var(--ink);padding:12px 11px 8px}
.p-pop .it.two span{display:flex;flex-direction:column;gap:2px}
.p-pop .it small{font-size:13px;line-height:18px;color:var(--ink-2);font-weight:400}
.p-pop .it[disabled]{opacity:.45;cursor:default}
.p-pop .it>span:not(.ck){flex:1;min-width:0}
.p-pop:not(.sheet){max-height:min(480px,calc(100% - 24px));overflow:auto}
@keyframes p3-up{from{transform:translateY(24px);opacity:.4}to{transform:none;opacity:1}}

/* ---------- native select field (looks like the other .p2-f fields) ---------- */
.p3-selw{position:relative;display:block}
.p3-sel{appearance:none;-webkit-appearance:none;width:100%;height:48px;border:1px solid var(--line-2);border-radius:8px;background:var(--bg);color:var(--ink);
  padding:0 16px 0 44px;font:400 15px/20px var(--f);outline:0;cursor:pointer;text-overflow:ellipsis}
.p3-sel:focus{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.p3-sel:invalid,.p3-sel option[disabled]{color:var(--ink-3)}
.p3-sel option{color:var(--ink);background:var(--bg)}
.p3-selw>svg.i{position:absolute;left:14px;top:50%;width:20px;height:20px;transform:translateY(-50%);pointer-events:none;color:var(--ink)}
.p3-dd span{white-space:nowrap}

/* ---------- checkbox / radio lists ---------- */
.p3-cks,.p3-rds{display:flex;flex-direction:column}
.p3-ck,.p3-rd{display:flex;align-items:flex-start;gap:12px;padding:10px 0;cursor:pointer;font-size:15px;line-height:20px}
.p3-ck input,.p3-rd input{position:absolute;opacity:0;pointer-events:none}
.p3-ck>i,.p3-rd>i{flex:none;width:20px;height:20px;border:1.5px solid var(--line-2);border-radius:4px;background:var(--bg);position:relative;margin-top:0}
.p3-rd>i{border-radius:50%}
.p3-ck input:checked+i{background:var(--brand);border-color:var(--brand)}
.p3-ck input:checked+i::after{content:'';position:absolute;inset:3px 6px 6px 5px;border:solid var(--on-ink);border-width:0 0 2px 2px;transform:rotate(-45deg) translate(-1px,1px);width:9px;height:5px}
.p3-rd input:checked+i{border-color:var(--brand);border-width:6px}
.p3-ck input:focus-visible+i,.p3-rd input:focus-visible+i{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--brand)}
.p3-ck span,.p3-rd span{display:flex;flex-direction:column;gap:2px}
.p3-ck b,.p3-rd b{font-weight:400}
.p3-ck small,.p3-rd small{font-size:13px;line-height:18px;color:var(--ink-2)}
.p3-ckh{font:600 15px/20px var(--f);margin:12px 0 4px}
.p3-rds.cards{gap:12px}
.p3-rds.cards .p3-rd{border:1px solid var(--line-2);border-radius:12px;padding:16px}
.p3-rds.cards .p3-rd:has(input:checked){border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}

/* ---------- expandable filter rows ---------- */
.p3-exp{border-bottom:1px solid var(--line)}
.p3-exp-h{width:100%;min-height:56px;display:flex;align-items:center;gap:12px;font-size:15px;line-height:20px;text-align:right;color:var(--ink)}
.p3-exp-h>span{flex:1}
.p3-exp-h>svg.i:last-child{transition:transform .15s}
.p3-exp.open .p3-exp-h>svg.i:last-child{transform:rotate(180deg)}
.p3-exp-h em{font-style:normal;font-size:14px}
.p3-exp-b{display:none;padding:0 0 12px}
.p3-exp.open .p3-exp-b{display:block}

/* ---------- sheet (centred dialog on desktop, bottom/full sheet on the phone) ---------- */
.ov.p3-sh{display:flex;align-items:center;justify-content:center}
.ov.p3-sh .mdl{width:min(560px,calc(100% - 32px));max-height:calc(100% - 48px);border-radius:16px;box-shadow:var(--sh-pop);display:flex;flex-direction:column;overflow:hidden;background:var(--bg)}
.p3-sh-h{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:24px 24px 8px}
.p3-sh-h h2{font:600 24px/32px var(--f);margin:0}
.p3-sh-h p{font-size:15px;line-height:20px;color:var(--ink-2);margin:4px 0 0}
.p3-x{width:48px;height:48px;flex:none;display:grid;place-items:center;border-radius:50%;color:var(--ink);margin:-8px -8px 0 0}
.p3-x:hover{background:var(--bg-2)}
.p3-sh-b{padding:8px 24px 24px;overflow:auto;display:flex;flex-direction:column;gap:20px}
.p3-sh-f{display:flex;gap:8px;justify-content:flex-end;padding:16px 24px;border-top:1px solid var(--line)}
.p3-sh-f .p-btn{flex:0 0 auto}

/* ---------- full-screen form page ---------- */
.p3-full{min-height:100%;background:var(--bg)}
.p3-full-top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:var(--bg)}
.p3-full-top .p3-x{margin:0}
.p3-full-in{max-width:720px;margin:0 auto;padding:8px 24px 48px;display:flex;flex-direction:column;gap:20px}
.p3-full-in h1{font:700 28px/36px var(--f);margin:0}
.p3-full-d{font-size:15px;line-height:20px;color:var(--ink-2);margin:-12px 0 4px}

/* ---------- hub list pages (phone) ---------- */
.p3-hub .p2-hd{margin-bottom:24px}
.p3-hub-l{display:block}
.p3-hub .p2-h20{margin:32px 0 16px}

@container (max-width:600px){
  .ov.p3-sh{align-items:flex-end}
  .ov.p3-sh .mdl{width:100%;max-height:calc(100% - 40px);border-radius:16px 16px 0 0;animation:p3-up .2s ease}
  .ov.p3-sh.full .mdl{height:100%;max-height:none;border-radius:0}
  .p3-sh-h{padding:8px 19px 4px 8px;flex-direction:row;flex-wrap:wrap}
  .p3-sh-h>div{flex:1 0 100%;order:2;padding-top:8px}
  .p3-sh-h .p3-x{order:1;margin:0 auto 0 0}
  .p3-sh-b{padding:8px 19px 24px}
  .p3-sh-f{padding:12px 19px 16px;border-top:0}
  .p3-sh-f .p-btn{flex:1}
  .p3-full-top{padding:8px 19px 0 8px;flex-direction:row-reverse}
  .p3-full-top .p-btn{display:none}
  .p3-full-in{padding:0 19px 120px}
  .p3-full-in h1{font-size:24px;line-height:32px}
}
.p3-full-bar{display:none}
@container (max-width:600px){
  .p3-full-bar{display:flex;position:sticky;bottom:0;padding:12px 19px 16px;background:var(--bg);border-top:1px solid var(--line)}
  .p3-full-bar .p-btn{flex:1}
}
/* hub list rows measured on b-catalog@1x-1 / b-sales@1x-1 (48 dp rows → 45.5 px in the 390 px frame, 15.5 px labels) */
@container (max-width:600px){
  .p3-hub .p2-st-ml{padding:8px 0}
  .p3-hub .p2-st-ml button{height:45px;font-size:16px;line-height:22px;padding:0 19px}
  .p3-hub .p2-st-ml button svg.i:last-child{width:18px;height:18px}
}

/* ======================= restyle v3 (business) — panel3 finish: selects, checks, radio cards, sheets (form only) ======================= */
.p3-sel{height:44px;border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.p3-sel:hover{border-color:var(--ink-3)}
.p3-sel:focus{box-shadow:var(--ring)}
.p3-ck>i{border-radius:6px;transition:background-color var(--d-1),border-color var(--d-1)}
.p3-rd>i{transition:border-width var(--d-2) var(--ease-spring),border-color var(--d-1)}
.p3-rds.cards .p3-rd{border-radius:var(--r-md);border-color:var(--line);transition:border-color var(--d-2),box-shadow var(--d-2)}
.p3-rds.cards .p3-rd:hover{border-color:var(--ink-3)}
.p3-exp-h{border-radius:var(--r-sm)}
.p3-x{border-radius:var(--r-btn);transition:background-color var(--d-2)}
.ov.p3-sh .mdl{border-radius:var(--r-lg);box-shadow:var(--sh-3)}
@container (max-width:600px){.ov.p3-sh .mdl{border-radius:var(--r-lg) var(--r-lg) 0 0}}
.p3-sh-h h2{font-weight:650}
.p-pop.sheet .it{border-radius:var(--r-ctl)}
/* ======================= end restyle v3 (business) — panel3 ======================= */


/* panel4 — calendar / appointments / «+» add flows (prefix p4-). Only base.css + panel tokens.
   Phone sizes from capture/phone/b-*@1x (1 dp ≈ 1 px in the 390 px frame). */
:root{--p4-on-c:#ffffff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p4-on-c:#ffffff}}
:root[data-theme="dark"]{--p4-on-c:#ffffff}

/* calendar page wrapper (mode bar + shell): inside the phone frame it must fill the screen like every other page's
   .p-app, so the shell's header / bottom bar stay fixed and the grid scrolls inside .p-cal-sc (auto-scroll to now) */
.screen .p-calwrap{flex:1;min-height:0;display:flex;flex-direction:column}
.screen .p-calwrap>.p-app{flex:1;min-height:0;height:auto}

/* ---------------- stacked layers ---------------- */
.ov.p4-ly{display:block;background:var(--scrim);animation:fq-fade .15s ease}
.ov.p4-ly>.mdl{position:absolute;display:flex;flex-direction:column;background:var(--bg);color:var(--ink);overflow:hidden;max-width:none}
.ov.p4-ly.full>.mdl{top:0;bottom:0;left:0;width:min(480px,100%);box-shadow:var(--p-dr-sh);animation:p-slide .22s ease}
.ov.p4-ly.sheet>.mdl,.ov.p4-ly.tall>.mdl{top:50%;left:50%;transform:translate(-50%,-50%);width:min(480px,calc(100% - 32px));max-height:calc(100% - 48px);border-radius:16px;box-shadow:var(--sh-pop)}
.ov.p4-ly.tall>.mdl{height:min(720px,calc(100% - 48px))}
@container (max-width:600px){
  .ov.p4-ly.full>.mdl{inset:0;width:auto;box-shadow:none;animation:fq-fade .15s ease}
  .ov.p4-ly.sheet>.mdl,.ov.p4-ly.tall>.mdl{top:auto;left:0;right:0;bottom:0;transform:none;width:auto;border-radius:16px 16px 0 0;max-height:calc(100% - 40px);animation:p3-up .2s ease}
  .ov.p4-ly.tall>.mdl{height:calc(100% - 40px)}
}
.p4-hd{flex:none;display:flex;align-items:center;gap:4px;min-height:64px;padding:8px 19px 0 8px}
.p4-hd.bk{padding:8px 8px 0 19px;gap:8px}
.p4-hs{flex:1;min-width:0;display:flex;align-items:center}
.p4-x{width:48px;height:48px;border-radius:999px;display:grid;place-items:center;color:var(--ink);flex:none}
.p4-x:hover{background:var(--bg-2)}
.p4-x svg.i{width:24px;height:24px}
.p4-ht{font:600 20px/28px var(--f);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p4-bd{flex:1;min-height:0;overflow:auto;padding:0 19px 24px;display:flex;flex-direction:column;gap:16px;overscroll-behavior:contain}
.p4-h1{font:600 28px/36px var(--f);margin:4px 0 4px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.p4-h2{font:600 20px/28px var(--f);margin:12px 0 0;display:flex;align-items:center;gap:8px}
.p4-cnt{font-style:normal;font:500 13px/18px var(--f);background:var(--bg-3);border-radius:999px;padding:1px 7px;color:var(--ink-2)}
.p4-sub{font-size:15px;line-height:20px;color:var(--ink-2);margin:0}
.p4-hr{border:0;border-top:1px solid var(--line);margin:0}
.p4-ft{flex:none;padding:12px 19px 16px;border-top:1px solid var(--line);display:flex;gap:8px;flex-wrap:wrap;align-items:center;background:var(--bg)}
.p4-ft>.p-btn{flex:1}
.p4-ft .p-btn.p4-fx,.p4-fb .p-btn.p4-fx{flex:none;width:48px;padding:0}
.p4-ft .p4-wide{flex:1 0 100%}
.p4-fb{display:flex;gap:8px;width:100%}
.p4-fb .p-btn{flex:1}
.p4-fb .p-btn[disabled]{color:var(--ink-3);border-color:var(--line);cursor:default}
.p4-fb .p-btn.pri[disabled]{background:var(--ink-3);border-color:var(--ink-3);color:var(--on-ink)}
.p-btn.p4-bad{background:var(--bad);border-color:var(--bad);color:var(--p4-on-c)}
.p-btn.p4-ghost{border-color:transparent;background:transparent}
.p-btn.p4-ghost svg.i{width:24px;height:24px}
.p4-tot{width:100%;display:flex;flex-direction:column;gap:2px;margin-bottom:6px}
.p4-tot p{display:flex;justify-content:space-between;font-size:15px;line-height:20px;color:var(--ink-2);margin:0}
.p4-tot p.b{color:var(--ink);font-weight:600}
.p4-tot p.b span:first-child{display:flex;align-items:center;gap:4px}
.p4-tot svg.i{width:16px;height:16px}

/* small pills, search */
.p4-pill{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 15px;border:1px solid var(--line-2);border-radius:999px;background:var(--bg);color:var(--ink);font:500 15px/20px var(--f);align-self:flex-start;white-space:nowrap;flex:none}
.p4-pill:hover{background:var(--bg-2)}
.p4-pill svg.i{width:18px;height:18px}
.p4-pill.s{height:34px;padding:0 13px;font-size:14px}
.p4-pill.ic{width:46px;padding:0;justify-content:center}
.p4-srch{display:flex;align-items:center;gap:10px;height:48px;border:1px solid var(--line-2);border-radius:8px;padding:0 14px;flex:none;background:var(--bg)}
.p4-srch svg.i{width:20px;height:20px;color:var(--ink-2)}
.p4-srch input{flex:1;min-width:0;border:0;background:transparent;font:400 15px/20px var(--f);color:var(--ink);outline:0}
.p4-srch input::placeholder,.p4-hsr::placeholder{color:var(--ink-3)}
.p4-ill{width:56px;height:56px;flex:none}
.p4-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:56px 16px}
.p4-empty b{font:600 17px/24px var(--f)}
.p4-empty p{font-size:15px;line-height:20px;color:var(--ink-2);margin:0;max-width:320px}
.p4-empty .p2-ill{width:56px;height:56px}
.p4-empty .p-btn{margin-top:12px}
.p4-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -19px;padding:4px 19px;flex:none}
.p4-chips::-webkit-scrollbar{display:none}

/* ---------------- calendar page (phone) ---------------- */
.p4-mb{display:none}
@container (max-width:600px){
  .p-app .p-cal-mt{height:50px}
  .p-cg.day .p-cg-h{height:72px}
  .p-cg-m{padding-top:10px}
  .p4-dk{display:none!important}
  .p4-mb{display:inline}
  .p-cal-mode .e .p4-mb{display:contents}
  .p4-moded .p-setup-m{visibility:visible}
  .p4-moded .p-cal-mode{top:48px;height:50px;padding:0 20px 0 8px;grid-template-columns:1fr auto;gap:8px}
  .p4-moded .p-cal-mode b{font-size:17px;line-height:22px;text-align:center}
  .p4-moded.md-appt .p-cal-mode b{text-align:right}
  .p4-moded .p-cal-mode .p-btn.inv{display:inline-flex;height:34px;padding:0 13px;font-size:15px;font-weight:500;max-width:200px;overflow:hidden}
  .p4-moded .p-cal-mode .p-btn.inv span{overflow:hidden;text-overflow:ellipsis}
  .p4-moded .p-cal-mode .e{gap:4px;align-items:center}
  .p4-moded .p-cal-modex{width:40px;height:40px}
  .p4-moded .p-body{margin-top:50px}
  .p4-moded.md-group .p-cal-mdate{color:var(--ink-3)}
}

/* «+» add menu: icons in soft circles */
.p-pop.p4-addm .it{min-height:53px;gap:14px}
.p-pop.p4-addm .it svg.i{width:40px;height:40px;padding:9px;border-radius:999px;background:var(--brand-soft);color:var(--brand);box-sizing:border-box;flex:none}
.p-pop.p4-addm:not(.sheet) .it{min-height:44px}
.p-pop.p4-addm:not(.sheet) .it svg.i{width:32px;height:32px;padding:7px}
.p-pop.sheet.p4-addm .p-pop-sh h3{font-size:28px;line-height:36px;padding-bottom:12px}
.p-pop.sheet.p4-memm .p-pop-sh h3{font-size:28px;line-height:36px}
.p-pop .p4-fsv-e{padding:24px 12px 32px}
.p-pop .p4-fsv-e b{display:block;font:500 20px/28px var(--f);color:var(--ink-3)}
.p-pop .p4-fsv-e p{font-size:15px;line-height:20px;color:var(--ink-3);margin:4px 0 0}

/* calendar views sheet */
.p4-views .p-vts{margin:8px 0 8px}
.p4-views .p-vt{height:103px;border-radius:8px;font-size:15px;gap:10px}
.p4-views .p-burg button{height:92px}

/* date picker (phone): chips + months */
.p4-dp .p4-bd{padding-top:0}
.p4-mon h3{font:600 20px/28px var(--f);margin:20px 0 8px}
.p4-mg{display:grid;grid-template-columns:repeat(7,1fr);row-gap:2px;text-align:center;align-items:center}
.p4-mg .wd{font-size:15px;line-height:20px;color:var(--ink-2);padding:8px 0}
.p4-mg button{height:42px;width:42px;justify-self:center;border-radius:999px;font:400 15px/20px var(--f);color:var(--ink)}
.p4-mg button:hover{background:var(--bg-2)}
.p4-mg button.td{box-shadow:inset 0 0 0 1px var(--line-2)}
.p4-mg button.sel{background:var(--brand);color:var(--p4-on-c);box-shadow:0 0 0 2px var(--bg),0 0 0 3px var(--brand)}
.p4-dm{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.p4-dm b{font:600 17px/24px var(--f)}
.p4-date .p4-chips{margin-top:16px}

/* personal settings */
.p4-zoom{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.p4-zoom-l{display:flex;justify-content:space-between;align-items:baseline}
.p4-zoom-l b{font:600 17px/24px var(--f)}
.p4-zoom-l span{font-size:15px;line-height:20px}
.p-rng.p4-rng{margin-top:0}
.p4-zs{position:absolute;top:-4px;width:28px;height:28px;margin-right:-14px;border-radius:999px;background:transparent}
.p4-zs::after{content:"";position:absolute;top:13px;right:13px;width:2px;height:2px;border-radius:999px;background:var(--ink-4)}
.p4-zs:hover{background:var(--bg-3)}
.p4-swr{display:flex;gap:16px;justify-content:space-between;align-items:flex-start;padding-top:8px;cursor:pointer}
.p4-swr b{display:block;font:500 15px/20px var(--f)}
.p4-swr small{display:block;font-size:13px;line-height:16px;color:var(--ink-2);margin-top:2px}

/* team and resources */
.p4-tr{display:flex;flex-direction:column;gap:2px}
.p4-tr-r{display:flex;align-items:center;gap:12px;min-height:46px;padding:0 12px;border-radius:8px;width:100%;font:400 17px/24px var(--f);color:var(--ink);text-align:right}
.p4-tr-r:hover{background:var(--bg-2)}
.p4-tr-r.on{background:var(--brand-soft)}
.p4-tr-r svg.i{width:22px;height:22px}
.p4-mav{width:28px;height:28px;border-radius:999px;background:var(--p-av-bg);color:var(--p-av-ink);display:grid;place-items:center;font:600 10px/1 var(--f);font-style:normal;flex:none;border:1px solid var(--p-appt)}
.p4-tr-ck{margin-top:24px;padding:0 12px}
.p4-tr-ck .p3-ck{align-items:center;padding:10px 0}
.p4-tr-ck .p3-ck b{font-size:17px;line-height:24px}
.p4-tr-ck .p3-ck:first-child b{font-weight:600;font-size:15px}
.p4-ckm{flex-direction:row!important;align-items:center;gap:12px!important}

/* filters */
.p4-flt .p4-h1{margin-bottom:8px}
.p4-fl .p3-exp-h{min-height:64px;font-size:17px;line-height:24px;gap:14px}
.p4-fl .p3-exp-h>svg.i:first-child{width:22px;height:22px}
.p4-fl .p3-exp-b{padding:0 36px 12px 0}
.p4-fl .p3-ck,.p4-fl .p3-rd{font-size:17px;line-height:24px;padding:12px 0}
.p4-fl .p3-ck>i,.p4-fl .p3-rd>i{margin-top:2px}
.p4-fl .p3-rd small{font-size:15px;line-height:20px}
.p4-fl .p3-exp-h em{font-size:17px}
.p4-flt .p4-ft{flex-wrap:nowrap}
.p4-pk{display:flex;flex-direction:column}
.p4-pk .p3-ck{padding:16px 0;border-bottom:1px solid var(--line);align-items:center;font-size:17px;line-height:24px}
.p4-pk .p3-ck:has(small){align-items:flex-start}
.p4-pk .p3-ck b em{margin-right:6px}
.p4-pkh b{font-weight:600}
.p4-pks small{font-size:15px;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.p4-pks span{min-width:0;flex:1}
.p4-pks>em{font-style:normal;font-size:17px;flex:none}
.p4-pkg .p4-pks{padding-right:24px}
.p4-pick .p4-ft{justify-content:space-between;flex-wrap:nowrap;border-top:1px solid var(--line)}
.p4-pick .p4-ft .p-btn{flex:none;min-width:100px}
.p4-selc{font-size:17px;line-height:24px;color:var(--ink-2)}
.p4-ecard{border:1px solid var(--line);border-radius:12px;padding:48px 24px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;margin-top:8px}
.p4-ecard b{font:600 20px/28px var(--f)}
.p4-ecard p{font-size:15px;line-height:20px;color:var(--ink-2);margin:0}

/* waitlist */
.p4-h1a{display:flex;gap:8px;align-items:center}
.p4-wlf{display:flex;gap:8px}
.p4-wlf .p-btn{flex:1 1 0;min-width:0;justify-content:space-between}
.p4-wlf .p-btn span{overflow:hidden;text-overflow:ellipsis}
.p4-ut{display:flex;gap:24px;border-bottom:1px solid var(--line);margin:0 -19px;padding:0 19px;flex:none}
.p4-ut button{padding:10px 0 12px;font:600 17px/24px var(--f);color:var(--ink-2);border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;gap:6px;align-items:center}
.p4-ut button[aria-selected="true"]{color:var(--ink);border-color:var(--ink)}
.p4-ut i{font-style:normal;font:500 13px/18px var(--f);background:var(--bg-3);border-radius:999px;padding:0 6px;color:var(--ink-2)}
.p4-wlb{background:var(--bg-2);margin:-16px -19px -24px;padding:24px 19px;flex:1 0 auto;display:flex;flex-direction:column;gap:12px}
.p4-wlc{background:var(--bg);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--sh-card)}
.p4-wlc-t{display:flex;align-items:center;gap:12px}
.p4-wlc-t b{display:block;font:600 17px/24px var(--f)}
.p4-wlc-t small,.p4-wlc-s small{font-size:13px;line-height:18px;color:var(--ink-2)}
.p4-wlc-t .p4-cav{width:44px;height:44px;font-size:16px}
.p4-wlc-w{margin:0;font-size:15px;line-height:20px}
.p4-wlc-s{display:flex;justify-content:space-between;gap:8px}
.p4-wlc-s b{display:block;font-weight:500}

/* ---------------- client card / when card / services ---------------- */
.p4-cc{border:1px solid var(--line);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:16px;text-align:right;width:100%;background:var(--bg);color:var(--ink);flex:none}
.p4-cc.add{flex-direction:row;align-items:center;justify-content:space-between;padding:16px 20px}
.p4-cc.add:hover{background:var(--bg-4)}
.p4-cc b{display:block;font:500 17px/24px var(--f)}
.p4-cc small{display:block;font-size:15px;line-height:20px;color:var(--ink-2)}
.p4-cc-t{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.p4-cc-a{display:flex;gap:8px}
.p4-cav{width:60px;height:60px;border-radius:999px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font:600 20px/1 var(--f);font-style:normal;flex:none}
.p4-cav svg.i{width:24px;height:24px}
.p4-when{border:1px solid var(--line);border-radius:12px;padding:6px 20px;flex:none}
.p4-when-r{display:flex;justify-content:space-between;gap:8px}
.p4-when button{display:flex;align-items:center;gap:10px;min-height:52px;font:400 15px/20px var(--f);color:var(--ink)}
.p4-when svg.i{width:20px;height:20px}
.p4-si{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:12px 20px 12px 0;text-align:right;width:100%;color:var(--ink);flex:none}
.p4-si::before{content:"";position:absolute;right:0;top:0;bottom:0;width:4px;border-radius:2px;background:var(--p-appt)}
.p4-si-t{display:flex;justify-content:space-between;gap:12px;font:400 17px/24px var(--f)}
.p4-si-t b{font-weight:500}
.p4-si small{font-size:15px;line-height:20px;color:var(--ink-2)}
.p4-si.btn:hover{background:var(--bg-4)}
.p4-si.card{border:1px solid var(--line);border-radius:8px;padding:20px 24px 20px 16px;overflow:hidden}
.p4-si.card::before{top:-1px;bottom:-1px;right:-1px;width:6px;border-radius:0}
.p4-si-x{position:absolute;left:-8px;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:999px;display:grid;place-items:center;color:var(--ink-2)}
.p4-si:has(.p4-si-x) .p4-si-t{padding-left:36px}
.p4-warn{align-self:flex-start;display:inline-flex;gap:4px;align-items:center;background:var(--warn-soft);color:var(--warn);font-style:normal;font-size:13px;line-height:18px;border-radius:999px;padding:1px 8px;margin-top:4px}
.p4-warn svg.i{width:14px;height:14px}
.p4-svce{border:1px solid var(--line);border-radius:12px;padding:48px 24px 40px;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;flex:none}
.p4-svce p{font-size:17px;line-height:24px;color:var(--ink-2);margin:0}
.p4-svce .p4-pill{align-self:center}
.p4-note{margin:0;font-size:15px;line-height:20px;white-space:pre-wrap}
.p4-grpb{display:flex;align-items:center;gap:8px;margin:0;color:var(--brand);font-weight:600}

/* new appointment */
.p4-na .p4-hd{border-bottom:1px solid var(--line);padding-bottom:8px}
.p4-na .p4-bd{padding-top:20px}
.p4-dt{display:flex;align-items:center;gap:6px;font:600 28px/36px var(--f);color:var(--ink);white-space:nowrap}
.p4-dt svg.i{width:20px;height:20px}
.p4-cl .p4-bd{gap:0}
.p4-cl .p4-srch{margin:4px 0 16px}
.p4-cl .p4-hr{margin:8px 0}
.p4-clr{display:flex;align-items:center;gap:16px;min-height:76px;padding:8px 0;width:100%;text-align:right;color:var(--ink)}
.p4-clr:hover{background:var(--bg-4)}
.p4-clr b{display:block;font:500 17px/24px var(--f)}
.p4-clr small{display:block;font-size:15px;line-height:20px;color:var(--ink-2)}
.p4-svcp .p4-h2{margin-top:20px}
.p4-rec{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;margin:0 -19px;padding:0 19px;flex:none}
.p4-recc{flex:0 0 auto;max-width:300px;border:1px solid var(--line);border-radius:8px;padding:12px 16px;display:flex;flex-direction:column;gap:4px;text-align:right;color:var(--ink)}
.p4-recc b{font:600 15px/20px var(--f)}
.p4-recc small{font-size:15px;line-height:20px;color:var(--ink-2)}
.p4-recc span{font-size:15px;line-height:20px}
.p4-tl{display:flex;flex-direction:column;margin:0 -19px}
.p4-tl button{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:48px;padding:0 19px;font:400 17px/24px var(--f);color:var(--ink);text-align:right;flex:none}
.p4-tl button:hover{background:var(--bg-2)}
.p4-tl svg.i{width:22px;height:22px}
.p4-time .p4-h1,.p4-act .p4-h1{font-size:24px;line-height:32px}

/* appointment details: coloured header */
.p4-adh{flex:none;background:var(--blue);color:var(--p4-on-c);padding:8px 8px 24px 8px}
.p4-adh.st-started{background:var(--brand)}
.p4-adh.st-done{background:var(--ok)}
.p4-adh.st-noshow,.p4-adh.st-cancelled{background:var(--bad)}
.p4-adh-x{display:flex;justify-content:flex-end}
.p4-adh .p4-x{color:var(--p4-on-c)}
.p4-adh .p4-x:hover{background:rgba(255,255,255,.15)}
.p4-adh-r{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0 11px}
.p4-adh-d{display:flex;align-items:center;gap:6px;font:600 24px/32px var(--f);color:var(--p4-on-c);white-space:nowrap}
.p4-adh-d svg.i{width:20px;height:20px}
.p4-adh-s{display:flex;align-items:center;gap:6px;height:36px;padding:0 14px;border:1px solid rgba(255,255,255,.85);border-radius:999px;font:500 15px/20px var(--f);color:var(--p4-on-c);white-space:nowrap}
.p4-adh-s svg.i{width:16px;height:16px}
.p4-ad .p4-bd{padding-top:20px}
.p-pop.p4-optm .p-pop-hd{font-size:20px;line-height:28px}
/* activity */
.p4-tline{position:relative;padding-right:28px;margin-top:8px}
.p4-tline::before{content:"";position:absolute;right:5px;top:14px;bottom:0;width:1px;background:var(--line)}
.p4-tline::after{content:"";position:absolute;right:2px;top:4px;width:7px;height:7px;border-radius:999px;background:var(--line-2)}
.p4-tl-c{border:1px solid var(--line);border-radius:12px;padding:20px}
.p4-tl-c b{display:block;font:600 15px/20px var(--f)}
.p4-tl-c small{display:block;font-size:13px;line-height:18px;color:var(--ink-2)}
.p4-tl-c p{margin:12px 0 0;font-size:13px;line-height:18px}

/* group appointment */
.p4-grpc{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:8px;padding:14px;width:100%;text-align:right;color:var(--ink);flex:none}
.p4-grpc:hover{background:var(--bg-4)}
.p4-grpc i{width:60px;height:60px;border-radius:4px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.p4-grpc i svg.i{width:26px;height:26px}
.p4-grpc b{font:600 15px/20px var(--f)}
.p4-grp .p4-h1{font-size:24px;line-height:32px;margin-bottom:12px}

/* blocked time */
.p4-blk .p4-hd .p-btn{width:48px;height:48px}
.p4-bt-h{display:flex;justify-content:space-between;align-items:center}
.p4-bt-h b{font:600 17px/24px var(--f)}
.p4-bt-h span{display:flex;gap:8px}
.p4-arr{width:32px;height:32px;border-radius:999px;border:1px solid var(--line);display:grid;place-items:center;color:var(--ink)}
.p4-arr svg.i{width:18px;height:18px}
.p4-bt{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;margin:-4px -19px 4px;padding:4px 19px;flex:none}
.p4-bt::-webkit-scrollbar{display:none}
.p4-btc{flex:0 0 150px;height:118px;border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:8px;color:var(--ink)}
.p4-btc.on{border:2px solid var(--brand)}
.p4-btc b{font:600 17px/24px var(--f);margin-top:6px}
.p4-btc small{font-size:15px;line-height:20px;color:var(--ink-2);white-space:nowrap}
.p4-btc svg.i{width:26px;height:26px}
.p4-btc .emo{font-size:30px;line-height:34px}
.p4-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
.p4-hint{display:block;font-size:15px;line-height:20px;color:var(--ink-2);margin-top:8px}
.p4-online{font-size:17px;line-height:24px}
.p4-online b{font-weight:400}

/* sale / checkout */
.p4-empty.cart{margin:auto 0;padding:24px 16px}
.p4-hsr{width:100%;height:40px;border:0;background:transparent;font:400 15px/20px var(--f);color:var(--ink);outline:0}
.p4-tiles{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:8px}
.p4-tile{height:90px;border:1px solid var(--line);border-radius:8px;padding:16px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;text-align:right;font:500 15px/20px var(--f);color:var(--ink)}
.p4-tile:hover{background:var(--bg-4)}
.p4-tile svg.i{width:22px;height:22px}
.p4-qh{display:flex;justify-content:space-between;align-items:center;margin-top:12px}
.p4-qh b{font:600 17px/24px var(--f)}
.p4-qs{position:relative;border:1px solid var(--line);border-radius:8px;min-height:115px;padding:20px 24px;text-align:right;display:flex;flex-direction:column;justify-content:center;gap:2px;overflow:hidden;color:var(--ink);flex:none}
.p4-qs::before{content:"";position:absolute;right:0;top:0;bottom:0;width:8px;background:var(--p-appt)}
.p4-qs b{font:500 15px/20px var(--f)}
.p4-qs small{font-size:15px;line-height:20px;color:var(--ink-2)}
.p4-qs:hover{background:var(--bg-4)}
.p4-catf{display:flex;justify-content:flex-end;gap:8px}
.p4-scat .p4-bd{padding-top:8px}
.p4-disc-p{font-size:15px;line-height:20px;margin:0}
.p4-disc .p4-ft{border-top:0;flex-wrap:nowrap}

/* checkout steps: tip + payment tiles, payments, cart discount (segmented), sale details, receipt */
.p4-tile[disabled]{opacity:.45;cursor:default}
.p4-tile[disabled]:hover{background:transparent}
.p4-tile.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.p4-tips .p4-tile{align-items:center;justify-content:center;gap:2px;text-align:center}
.p4-tips .p4-tile b{font:600 17px/24px var(--f)}
.p4-tips .p4-tile small{font-size:14px;line-height:20px;color:var(--ink-2)}
.p4-amt2{display:flex;flex-direction:column;gap:2px;font:600 28px/36px var(--f);margin:0}
.p4-amt2 small{font:400 15px/20px var(--f);color:var(--ink-2)}
.p4-split{display:flex}
.p4-sdk-bk{align-self:flex-start;margin:-8px -12px -12px 0}
.p4-seg{display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--bg-3);flex:none}
.p4-seg button{flex:1;height:40px;border-radius:999px;font:500 15px/20px var(--f);color:var(--ink-2)}
.p4-seg button[aria-selected="true"]{background:var(--bg);color:var(--ink);box-shadow:var(--sh-small)}
.p4-svh{display:flex;align-items:center;gap:12px;font-size:15px;line-height:20px;color:var(--ink-2)}
.p4-cc-ro{cursor:default}
.p4-cc-ro:hover{background:transparent}
.p4-sv .p4-tline{display:flex;flex-direction:column;gap:12px}
.p4-rc{display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);border-radius:12px;padding:20px}
.p4-rc-n{font:600 18px/24px var(--f)}
.p4-rc small{font-size:14px;line-height:20px;color:var(--ink-2)}
.p4-rc p{margin:0;font-size:15px;line-height:20px}
.p4-rc .r{display:flex;justify-content:space-between;gap:12px}
.p4-rc .r.b{font-weight:600}
@media print{body *{visibility:hidden}.p4-rc,.p4-rc *{visibility:visible}.p4-rc{position:fixed;inset:24px auto auto 24px;width:360px;border:0}}

/* quick payment keypad */
.p4-qp .p4-ht{font-size:17px;line-height:24px}
.p4-amt{font:700 48px/56px var(--f);color:var(--ink-3);text-align:center;margin:116px 0 104px}
.p4-amt.on{color:var(--ink)}
.p4-amt small{font-size:24px;font-weight:600}
.p4-kp{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.p4-kp button{height:72px;border:1px solid var(--line);border-radius:8px;font:500 24px/32px var(--f);color:var(--ink);display:grid;place-items:center}
.p4-kp button:hover{background:var(--bg-2)}
.p4-kp svg.i{width:26px;height:26px}
.p4-time .p4-hd{border-bottom:1px solid var(--line);padding-bottom:8px}
.p4-time .p4-ht{font-size:24px;line-height:32px}
.p4-kp{direction:ltr}
.ov.p4-ly.full{background:transparent}
@container (max-width:600px){.ov.p4-ly.full{background:var(--scrim)}}
/* desktop sale page (two columns) */
.ov.p4-ly.wide{background:transparent}
.ov.p4-ly.wide>.mdl{top:0;bottom:0;left:0;right:192px;overflow:visible;box-shadow:var(--p-dr-sh)}
.p4-sdk{display:grid;grid-template-columns:1fr 470px;height:100%;min-height:0}
.p4-sdk-m{overflow:auto;padding:24px 32px 48px;display:flex;flex-direction:column;gap:20px;border-left:1px solid var(--line)}
.p4-sdk-m .p4-tiles{grid-template-columns:repeat(3,1fr)}
.p4-qg{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.p4-sdk-c{display:flex;flex-direction:column;min-height:0;background:var(--bg)}
.p4-sdk-c .p4-bd{padding-top:24px}
.p4-sdk-x{position:absolute;top:12px;right:-60px;border:1px solid var(--line-2);background:var(--p-btn);box-shadow:0 8px 32px 0 rgba(19,19,19,.16)}
/* sizes from b-appointment-details@1x */
.p4-adh{padding-bottom:30px}
.p4-adh-r{margin-top:6px}
.p4-h2{font-size:18px;line-height:24px}
.p4-si-t{font-size:16px;line-height:22px}
.p4-si small{font-size:14px}
/* single-pick filter section (Appointment creation date) */
.p4-pexi{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:48px;font:400 17px/24px var(--f);color:var(--ink);text-align:right}
.p4-pexi svg.i{width:22px;height:22px;visibility:hidden}
.p4-pexi.on svg.i{visibility:visible}
.p4-fseg .p4-hd{min-height:56px}
.p4-fseg .p4-bd{padding-top:0}
.p4-h2.l{font-size:24px;line-height:32px;margin-top:8px}
/* ---- phone sizes from the font-1.0 re-shoots (b-*@1x of 1405-07-24) ---- */
@container (max-width:600px){
  .p4-hd{min-height:56px}
  .p4-h1{font-size:24px;line-height:32px;margin:8px 0 4px}
  .p4-dt{font-size:24px;line-height:32px}
  .p4-ht{font-size:18px;line-height:24px}
  .p4-time .p4-ht{font-size:18px}
  .p4-fl .p3-exp-h{min-height:56px;font-size:16px;line-height:22px}
  .p4-fl .p3-ck,.p4-fl .p3-rd{font-size:14px;line-height:20px;padding:9px 0}
  .p4-fl .p3-ck small,.p4-fl .p3-rd small{font-size:13px;line-height:18px}
  .p4-fl .p3-exp-h em{font-size:15px}
  .p4-pexi{font-size:16px;line-height:22px}
  .p4-cc b{font-size:16px;line-height:22px}
  .p4-cc small{font-size:14px}
  .p4-clr{min-height:84px}
  .p4-clr b{font-size:14px;font-weight:600;line-height:20px}
  .p4-clr small{font-size:14px}
  .p4-when button{font-size:14px;min-height:48px}
  .p4-svce p{font-size:14px;line-height:20px}
  .p4-si-t{font-size:15px;line-height:22px}
  .p4-si small{font-size:14px}
  .p4-tl button{font-size:15px;min-height:48px}
  .p4-ut button{font-size:14px;line-height:20px}
  .p4-pk .p3-ck{font-size:15px;line-height:22px;padding:14px 0}
  .p4-pk small{font-size:14px}
  .p4-fseg .p4-pks b{font-size:14px;font-weight:600}
  .p4-fseg .p4-pks small{font-size:13px}
  .p4-fseg .p4-sub{font-size:14px}
  .p4-selc{font-size:15px}
  .p4-btc b{font-size:14px;line-height:20px}
  .p4-btc small{font-size:13px}
  .p4-bt-h b{font-size:14px}
  .p4-hint{font-size:12px;line-height:16px}
  .p4-online{font-size:14px}
  .p4-tr-r{font-size:15px}
  .p4-tr-ck .p3-ck b{font-size:15px}
  .p4-views .p-burg button{font-size:15px}
  .p4-wlf .p-btn{font-size:14px}
  .p4-empty b{font-size:17px}
  .p4-empty p{font-size:14px}
  .p4-zoom-l b{font-size:15px}
}

/* ======================= restyle v3 (business) — panel4 finish: calendar, appointments, checkout (form only) ======================= */
.p4-x{border-radius:var(--r-btn);transition:background-color var(--d-2)}
.p4-pill{border-radius:var(--r-ctl);transition:background-color var(--d-2),border-color var(--d-2)}
.p4-pill:hover{border-color:var(--ink-3)}
.p4-srch{height:44px;border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.p4-srch:hover{border-color:var(--ink-3)}
.p4-srch:focus-within{border-color:var(--brand);box-shadow:var(--ring)}
.p4-ecard,.p4-cc,.p4-when,.p4-svce,.p4-tl-c,.p4-rc,.p4-wlc{border-radius:var(--r-card)}
.p4-cc,.p4-when,.p4-rc,.p4-tl-c{box-shadow:var(--sh-1)}
.p4-si.card,.p4-recc,.p4-grpc,.p4-tr-r,.p4-kp button{border-radius:var(--r-ctl)}
.p4-tile,.p4-qs,.p4-btc{border-radius:var(--r-md);background:var(--bg);box-shadow:var(--sh-1);
  transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease),background-color var(--d-2),border-color var(--d-2)}
@media (hover:hover){.p4-tile:not([disabled]):hover,.p4-qs:hover,.p4-btc:hover,.p4-grpc:hover,.p4-cc.add:hover{transform:translateY(var(--lift));box-shadow:var(--sh-2);background:var(--bg)}}
.p4-grpc,.p4-cc.add,.p4-recc{transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease),background-color var(--d-2)}
.p4-tile[disabled]{box-shadow:none}
.p4-seg{border-radius:var(--r-btn);padding:3px;gap:2px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
.p4-seg button{height:36px;border-radius:9px;font-weight:600;transition:background-color var(--d-2),color var(--d-2),box-shadow var(--d-2)}
.p4-seg button[aria-selected="true"]{background:var(--p-seg-on);box-shadow:var(--sh-seg)}
.p4-kp button{transition:background-color var(--d-1),transform var(--d-1)}
.p4-kp button:active{transform:scale(.97)}
.ov.p4-ly.sheet>.mdl,.ov.p4-ly.tall>.mdl{border-radius:var(--r-lg);box-shadow:var(--sh-3)}
@container (max-width:600px){.ov.p4-ly.sheet>.mdl,.ov.p4-ly.tall>.mdl{border-radius:var(--r-lg) var(--r-lg) 0 0}}
/* ======================= end restyle v3 (business) — panel4 ======================= */

/* ======================= restyle v3 palette (business) — Accord LIGHT colours (panel4) =======================
   Selected = night; appointment header by status in Accord's deep stage hues (white text ≥4.5:1). Dark = previous values. */
:root{--p4-fill:var(--night); --p4-fill-ink:var(--on-night); --p4-adh:#0b6f7c; --p4-adh-started:#9a5a06; --p4-adh-done:#45554e; --p4-adh-bad:#b42318}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p4-fill:var(--brand); --p4-fill-ink:#ffffff; --p4-adh:var(--blue); --p4-adh-started:var(--brand); --p4-adh-done:var(--ok); --p4-adh-bad:var(--bad)}}
:root[data-theme="dark"]{--p4-fill:var(--brand); --p4-fill-ink:#ffffff; --p4-adh:var(--blue); --p4-adh-started:var(--brand); --p4-adh-done:var(--ok); --p4-adh-bad:var(--bad)}
.p4-mg button.sel{background:var(--p4-fill);color:var(--p4-fill-ink);box-shadow:0 0 0 2px var(--bg),0 0 0 3px var(--p4-fill)}
.p4-adh{background:var(--p4-adh)}
.p4-adh.st-started{background:var(--p4-adh-started)}
.p4-adh.st-done{background:var(--p4-adh-done)}
.p4-adh.st-noshow,.p4-adh.st-cancelled{background:var(--p4-adh-bad)}
/* ======================= end restyle v3 palette (business) panel4 ======================= */


/* panel5 — area W2 styles: sales, clients, client profile, segments, home filters. Prefix p5-. base.css tokens only.
   Phone sizes from capture/phone/b-*@1x.xml (dp ≈ px in our 390px frame). */

/* ---------- picker field (select look, opens a Fresha picker sheet / popover) ---------- */
.p5-fdb{width:100%;height:48px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--line-2);border-radius:8px;background:var(--bg);color:var(--ink);
  padding:0 16px 0 14px;font:400 15px/20px var(--f);text-align:right}
.p5-fdb span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.p5-fdb svg.i{width:20px;height:20px;flex:none}
.p5-fdb.ph span{color:var(--ink-3)}
.p5-fdb:focus-visible{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand);outline:0}
.p5-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.p5-pnl{display:flex;flex-direction:column;gap:20px}
.p5-pnl .p2-f,.p3-sh-b .p2-f{margin:0}

/* sheets whose title sits beside ✕ (Filters, Tags, Add a referral …) */
@container (max-width:600px){
  .ov.p5-inl .p3-sh-h{flex-direction:row;flex-wrap:nowrap;align-items:center;padding:12px 8px 4px 19px}
  .ov.p5-inl .p3-sh-h>div{flex:1;order:0;padding-top:0}
  .ov.p5-inl .p3-sh-h .p3-x{margin:0;order:1}
  .ov.p5-inl .mdl{height:calc(100% - 40px)}
  .ov.p5-inl .p3-sh-b{flex:1;gap:20px}
}

/* ---------- period sheet + calendar ---------- */
.ov.p5-per .p3-sh-b{gap:16px}
.ov.p5-per .p3-sh-h{padding-bottom:0}
.p5-cal{padding-top:4px}
.p5-cal-h{display:flex;align-items:center;justify-content:space-between;height:44px;margin-bottom:8px}
.p5-cal-h b{font:600 17px/24px var(--f)}
.p5-cal-n{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;color:var(--ink)}
.p5-cal-n:hover{background:var(--bg-2)}
.p5-cal-n svg.i{width:20px;height:20px}
.p5-cal-g{display:grid;grid-template-columns:repeat(7,1fr);row-gap:4px}
.p5-cal-w{text-align:center;font-size:15px;line-height:20px;color:var(--ink-2);padding:6px 0 8px}
.p5-cal-d,.p5-cal-x{height:32px;display:grid;place-items:center;font:500 16px/20px var(--f);color:var(--ink)}
.p5-cal-d span{width:32px;height:32px;display:grid;place-items:center;border-radius:50%}
.p5-cal-d:hover span{background:var(--bg-2)}
.p5-cal-d.in,.p5-cal-x.in{background:var(--brand-soft)}
.p5-cal-d.today span{box-shadow:inset 0 0 0 1.5px var(--brand)}
.p5-cal-d.s span,.p5-cal-d.e span{background:var(--brand);color:var(--on-ink);box-shadow:none}
.p5-cal-d.s{border-radius:0 999px 999px 0}
.p5-cal-d.e{border-radius:999px 0 0 999px}
.p5-cal-d.s.e{border-radius:999px;background:none}
.ov.p5-day .p3-sh-b{padding-top:0}

/* ---------- picker sheet stacked on another sheet ---------- */
.p5-sub{position:absolute;inset:0;z-index:10;display:flex;align-items:flex-end;justify-content:center}
.p5-sub-sc{position:absolute;inset:0;background:var(--scrim)}
.p5-sub-in{position:relative;width:100%;max-height:calc(100% - 48px);overflow:auto;background:var(--bg);border-radius:16px 16px 0 0;box-shadow:var(--sh-pop);padding:8px 8px 16px;animation:p3-up .2s ease}
.p5-sub-h{display:flex;justify-content:flex-end}
.p5-sub-b{padding:0 11px}
.p5-ms .p3-ck{padding:8px 0;font-size:16px}
.p3-ck.mix input:checked+i::after{inset:auto;left:4px;right:4px;top:8px;width:auto;height:0;border-width:2px 0 0;transform:none}
@container (min-width:601px){.p5-sub{align-items:center}.p5-sub-in{width:min(420px,calc(100% - 32px));border-radius:16px}}

/* ---------- sales pages ---------- */
.p5-mtop-main .sp{flex:1}
.p5-sortb{margin-right:auto}
.p-bar.p5-bar .p-search{display:flex}
.p5-bar .p5-srch{width:256px}
@container (max-width:600px){
  .p-bar.p5-bar{flex-wrap:wrap;background:none;padding:0;gap:12px}
  .p-bar.p5-bar .p-search{display:flex;flex:1;width:auto;min-width:0;height:36px}
  .p5-pay .p5-per-b{order:3}
  .p5-pay .p5-flt{width:36px;padding:0}
  .p5-pay .p5-flt .p-lbl-d{display:none}
  .p5-pk .p-bar.p5-bar .p-search{flex:1 1 150px}
  .p5-mb .p-bar.p5-bar .p-search{flex:0 0 87px}
  .p5-sortb{display:none!important}
}
@container (max-width:600px){
  .p5-pay .p-bar.p5-bar::after{content:'';order:2;flex-basis:100%}
  .p5-pay .p-bar.p5-bar .p-search{flex:0 1 241px}
  .p5-sd .p-ct-tb th,.p5-sd .p-ct-tb td{padding:0 8px;font-size:15px}
  .p5-sd .p-ct-tb th:first-child,.p5-sd .p-ct-tb td:first-child{white-space:normal;width:116px;min-width:116px;padding-right:16px}
  .p5-sd .p-ct-tb td{height:57px}
}
@container (max-width:600px){
  .ov.p5-inl .p3-sh-f{justify-content:flex-end}
  .ov.p5-inl .p3-sh-f .p-btn{flex:0 0 auto}
}

/* ---------- tokens (illustrations, segment icons, loyalty art) ---------- */
:root{--p5-il0:#d9d3ff;--p5-il1:#b9a8ff;--p5-il2:#7a5cf5;--p5-il3:#e45bd3;--p5-or1:#ffb03a;--p5-or2:#f2512d;--p5-hex1:#ffd0f0;--p5-hex2:#ff8fb8;--p5-hex3:#fff2fa;--p5-loy1:#f7e3ff;--p5-loy2:#ffc4dc}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p5-il0:#3b3570;--p5-il1:#8f7cf0;--p5-il2:#6950f3;--p5-il3:#c64ab8;--p5-or1:#e89a2a;--p5-or2:#d84422;--p5-hex1:#5b2d4c;--p5-hex2:#a8466f;--p5-hex3:#3a2433;--p5-loy1:#2d2140;--p5-loy2:#4a2236}}
:root[data-theme="dark"]{--p5-il0:#3b3570;--p5-il1:#8f7cf0;--p5-il2:#6950f3;--p5-il3:#c64ab8;--p5-or1:#e89a2a;--p5-or2:#d84422;--p5-hex1:#5b2d4c;--p5-hex2:#a8466f;--p5-hex3:#3a2433;--p5-loy1:#2d2140;--p5-loy2:#4a2236}

/* ---------- clients list ---------- */
.p5-cl-r{cursor:pointer}
a.p5-cl-m{color:var(--ink)}
.p5-sel .p2-cb{flex:none}
.p5-exps{display:flex;flex-direction:column}
.p5-exps .p3-exp-h{min-height:56px;font-size:15px}
.p5-exps .p3-exp-h svg.i:first-child{width:20px;height:20px}
.p5-exps .p3-rds{padding-right:32px}
.p5-exps .p3-rd>i{display:none}
.p5-exps .p3-rd{padding:12px 0;font-size:16px}
.p5-exps .p3-rd span{flex:1}
.p5-exps .p3-rd:has(input:checked)::after{content:"";width:14px;height:8px;border:solid var(--ink);border-width:0 0 2px 2px;transform:rotate(-45deg);margin:4px 0 0 4px}
.ov.p5-allf .p3-sh-b{gap:0}
.p5-sub-h{align-items:flex-start}
.p5-sub-h b{flex:1;font:600 20px/28px var(--f);padding:8px 11px 0}
.p5-sub-f{display:flex;justify-content:flex-end;padding:12px 11px 0}
.p5-sub-f .p-btn{flex:1}

/* shared sheets */
.p5-cf{font-size:15px;line-height:22px}
.p-btn.pri.p5-bad{background:var(--bad);border-color:var(--bad)}
.p5-sbox{display:flex;align-items:center;gap:8px;height:48px;border:1px solid var(--line-2);border-radius:999px;padding:0 16px;background:var(--bg)}
.p5-sbox.sq{border-radius:8px}
.p5-sbox svg.i{width:20px;height:20px;color:var(--ink-2);flex:none}
.p5-sbox input{flex:1;min-width:0;border:0;outline:0;background:none;font:400 15px/20px var(--f);color:var(--ink)}
.p5-none{font-size:17px;line-height:24px;color:var(--ink-2)}
.p-btn.p5-blk{width:100%}
.p-btn[disabled]{opacity:.45;cursor:default}
.p5-pcl{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.p5-pcl .p2-who{width:100%;padding:10px 0;text-align:right;gap:12px}
.p5-pcl .p2-who p{font-size:15px;line-height:20px}

/* ---------- client profile (full screen) ---------- */
.p5-cp{position:absolute;inset:0;overflow-y:auto;background:var(--bg-2);color:var(--ink)}
.p5-cp-top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;height:64px;padding:0 12px;background:var(--bg);border-bottom:1px solid var(--line)}
.p5-cp-top .sp,.p5-cp-n{flex:1;min-width:0}
.p5-cp-n{font:600 17px/24px var(--f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p5-cp-b{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;color:var(--ink);flex:none}
.p5-cp-b:hover{background:var(--bg-2)}
.p5-mav{width:28px;height:28px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font:600 12px/1 var(--f);flex:none}
.p5-cp-in{display:flex;gap:32px;max-width:1240px;margin:0 auto;padding:32px;align-items:flex-start}
.p5-cp-side{width:360px;flex:none;display:flex;flex-direction:column;gap:16px}
.p5-cp-main{flex:1;min-width:0;background:var(--bg);border-radius:12px;box-shadow:var(--inset);padding:24px;min-height:480px}
.p5-cph{display:flex;flex-direction:column;align-items:center;text-align:center;background:var(--bg);border-radius:12px;box-shadow:var(--inset);padding:24px 16px 16px}
.p5-cpav{width:120px;height:120px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font:600 44px/1 var(--f);margin-bottom:16px}
.p5-cph h1{font:600 20px/28px var(--f);margin:0}
.p5-cph p{font-size:15px;line-height:20px;color:var(--ink-2)}
.p5-cph-b{display:flex;gap:12px;width:100%;margin-top:24px}
.p5-cph-b .p-btn.pri{flex:1}
.p5-cpi{background:var(--bg);border-radius:12px;box-shadow:var(--inset);padding:12px 16px 12px;display:flex;flex-direction:column}
.p5-cpi button,.p5-cpi p{display:flex;align-items:center;gap:12px;min-height:40px;font-size:15px;line-height:20px;color:var(--ink-2);text-align:right}
.p5-cpi p{color:var(--ink)}
.p5-cpi svg.i{width:20px;height:20px;color:var(--ink)}
.p5-cpm{background:var(--bg);border-radius:12px;box-shadow:var(--inset);padding:8px 0}
.p5-cpm-i{width:100%;min-height:48px;display:flex;align-items:center;gap:8px;padding:0 16px;font:400 15px/20px var(--f);color:var(--ink);text-align:right}
.p5-cpm-i>span{flex:1}
.p5-cpm-i.sub{padding-right:40px}
.p5-cpm-i svg.i{width:20px;height:20px}
.p5-cpm-i[aria-current="page"]{background:var(--brand-soft);color:var(--brand)}
.p5-cpm-i:hover{background:var(--bg-2)}
.p5-cnt{font-style:normal;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--bg-3);font-size:12px;line-height:20px;text-align:center}
/* section content */
.p5-st{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.p5-st h2{font:600 24px/32px var(--f);margin:0}
.p5-st-a{display:flex;gap:8px}
.p5-tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin:0 -2px 20px;padding:0 2px}
.p5-tabs::-webkit-scrollbar{display:none}
.p5-tabs button{flex:none;height:36px;padding:0 15px;border-radius:999px;font:600 15px/20px var(--f);white-space:nowrap;display:inline-flex;align-items:center;gap:4px;color:var(--ink)}
.p5-tabs button[aria-selected="true"],.p5-tabs .p5-tab-more.on{background:var(--ink);color:var(--on-ink)}
.p5-tabs button svg.i{width:20px;height:20px}
.p5-emp{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:56px 16px}
.p5-emp svg{margin-bottom:12px}
.p5-emp b{font:600 17px/24px var(--f)}
.p5-emp p{font-size:15px;line-height:20px;color:var(--ink-2)}
.p5-emp .p-btn{margin-top:16px}
.p5-ov-h{display:flex;align-items:center;justify-content:space-between;margin:8px 0 12px}
.p5-ov-h h3{font:600 17px/24px var(--f);margin:0}
.p5-ov-h .p-link{font-size:15px}
.p5-kc{background:var(--bg);border-radius:12px;box-shadow:var(--inset);padding:24px 17px;margin-bottom:16px}
.p5-kc-h{display:flex;align-items:center;justify-content:space-between;font:600 17px/24px var(--f);gap:6px}
.p5-kc-h span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.p5-kc-h svg.i{width:18px;height:18px;color:var(--ink-3);flex:none}
.p5-kc b{display:block;font:600 28px/36px var(--f);margin-top:12px}
.p5-kg{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.p5-mo{font:400 15px/20px var(--f);color:var(--ink-2);margin:4px 0 12px}
.p5-tl{position:relative;padding-right:40px}
.p5-tl::before{content:"";position:absolute;right:13px;top:20px;bottom:0;width:2px;background:var(--line)}
.p5-tl-i{position:relative;background:var(--bg);border-radius:12px;box-shadow:var(--inset);padding:16px;margin-bottom:16px}
.p5-tl-dot{position:absolute;right:-40px;top:0;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--on-ink);display:grid;place-items:center}
.p5-tl-dot svg.i{width:16px;height:16px}
.p5-ac{display:flex;flex-direction:column;gap:2px;width:100%;text-align:right;color:var(--ink)}
.p5-ac-h{display:flex;align-items:center;justify-content:space-between;font:600 17px/24px var(--f)}
.p5-ac>small,.p5-ac-s small{font-size:13px;line-height:18px;color:var(--ink-2)}
.p5-ac-s{display:flex;justify-content:space-between;gap:8px;margin-top:20px;font-size:15px;line-height:20px}
.p5-ac-s>span{display:flex;flex-direction:column}
.p5-ac-s b{font-weight:500}
.p5-ac-f{margin-top:16px}
.p5-scl{display:flex;flex-direction:column;gap:12px}
.p5-sc{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;background:var(--bg);border-radius:12px;box-shadow:var(--inset);padding:16px;text-align:right;color:var(--ink)}
.p5-sc>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.p5-sc b{font:600 15px/20px var(--f)}
.p5-sc small{font-size:13px;line-height:18px;color:var(--ink-2)}
.p5-sc-e{align-items:flex-end}
.p5-ds{padding:0 0 20px;margin-bottom:20px;border-bottom:1px solid var(--line)}
.p5-ds.last{border:0;margin:0}
.p5-ds h3{font:600 20px/28px var(--f);margin:0 0 20px}
.p5-kvg{display:grid;grid-template-columns:1fr 1fr;gap:17px 12px}
.p5-kv{display:flex;flex-direction:column;gap:0;font-size:15px;line-height:20px;margin-bottom:17px}
.p5-kvg .p5-kv{margin:0}
.p5-kv span{font-weight:500;color:var(--ink)}
.p5-kv b{font-weight:400;color:var(--ink-2)}
.p5-ch i{font-style:normal;color:var(--ok)}
.p5-mute{font-size:15px;line-height:20px;color:var(--ink-2)}
.p-btn.p5-chip{height:32px;padding:0 12px;font-size:13px}
.p5-fbar{display:flex;gap:8px;margin-bottom:8px}
.p5-fbar .p5-sbox{flex:1;height:40px}
.p5-seg2{display:flex;border:1px solid var(--line-2);border-radius:8px;overflow:hidden;flex:none}
.p5-seg2 button{width:38px;height:38px;display:grid;place-items:center;color:var(--ink)}
.p5-seg2 button[aria-pressed="true"]{background:var(--bg-3)}
.p5-seg2 svg.i{width:18px;height:18px}
.p5-wb{padding:24px 0 8px}
.p5-wb b{font:700 44px/52px var(--f)}
.p5-wb p{font-size:15px;line-height:20px;color:var(--ink-2)}
.p5-loy{position:relative;border-radius:12px;padding:24px;overflow:hidden;background:linear-gradient(160deg,var(--p5-loy1),var(--p5-loy2));min-height:400px}
.p5-loy-k{display:flex;align-items:center;gap:8px;font:600 13px/18px var(--f);margin-bottom:12px}
.p5-loy-k i{width:22px;height:22px;border-radius:6px;background:var(--brand);color:var(--on-ink);display:grid;place-items:center}
.p5-loy-k svg.i{width:14px;height:14px}
.p5-loy h3{font:600 24px/32px var(--f);margin:0 0 12px}
.p5-loy p{font-size:15px;line-height:20px}
.p5-loy-l{display:inline-flex;align-items:center;gap:6px;margin-top:20px;font:600 15px/20px var(--f);color:var(--ink)}
.p5-loy-l svg.i{width:18px;height:18px}
.p5-loy-art{margin:32px auto 0;width:220px}
@container (max-width:600px){
  .p5-cp{background:var(--bg)}
  .p5-cp-top{height:64px;padding:0 8px;border-bottom:0}
  .p5-cp-in{display:block;padding:0 16px 32px}
  .p5-cp-side{width:auto;gap:16px}
  .p5-cp.has-s .p5-cp-side{display:none}
  .p5-cp.has-s{background:var(--bg-2)}
  .p5-cp.p5-cp-details{background:var(--bg)}
  .p5-cp.has-s .p5-cp-top{background:var(--bg);border-bottom:1px solid var(--line)}
  .p5-cp-main{background:none;box-shadow:none;border-radius:0;padding:16px 0 0;min-height:0}
  .p5-cph{box-shadow:none;padding:8px 0 0}
  .p5-cph-b{margin-top:28px}
  .p5-cph-b .p-btn{height:36px}
  .p5-cph-b .p-btn.ic{width:36px}
}
/* ---------- add / edit client form ---------- */
.p5-fm{position:absolute;inset:0;overflow-y:auto}
.p5-fm-tt{display:none}
.p5-fm-tabs button,.p2-fm-nav a{cursor:pointer}
.p5-fav span{font:600 32px/1 var(--f);color:var(--brand)}
.p5-gap{display:block}
.p5-ph{display:flex;gap:8px}
.p5-ph-c{flex:0 0 107px;height:48px;display:flex;align-items:center;justify-content:space-between;gap:4px;border:1px solid var(--line-2);border-radius:8px;padding:0 12px 0 10px;background:var(--bg);color:var(--ink);font:400 15px/20px var(--f)}
.p5-ph-c span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;direction:ltr}
.p5-ph-c svg.i{width:16px;height:16px;flex:none}
.p5-ph input{flex:1;min-width:0}
.p5-bd{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px}
.p5-bd .p3-sel{padding-left:32px}
.p5-lf{display:flex;align-items:center;gap:8px;height:48px;border:1px solid var(--line-2);border-radius:8px;padding:0 16px;background:var(--bg)}
.p5-lf>span{flex:1;min-width:0;color:var(--ink-3);font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p5-lf>span.v{color:var(--ink)}
.p5-lf i{width:24px;height:24px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.p5-lf i svg.i{width:14px;height:14px}
.p5-lf .p-link{font:500 15px/20px var(--f)}
.p5-fh3{font:600 17px/24px var(--f);margin:8px 0 12px}
.p5-fh3.big{font-size:17px;line-height:24px;margin:16px 0 4px}
.p5-addnew{display:inline-flex;align-items:center;gap:6px;margin-top:20px;font:500 17px/24px var(--f);color:var(--brand)}
.p5-addnew svg.i{width:20px;height:20px}
.p5-addrs{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.p5-addr{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:12px;padding:12px 16px}
.p5-addr>div{flex:1;min-width:0}
.p5-addr small{display:block;color:var(--ink-2);font-size:13px}
.p5-adt{display:flex;gap:8px}
.p5-adt button{width:77px;height:77px;border:1px solid var(--line);border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font:500 14px/18px var(--f);color:var(--ink)}
.p5-adt button[aria-pressed="true"]{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
.p5-adt svg.i{width:20px;height:20px}
.p5-adsr{display:flex;align-items:center;gap:8px;height:48px;border:1px solid var(--line-2);border-radius:8px;padding:0 12px}
.p5-adsr svg.i{width:18px;height:18px}
.p5-adsr input{flex:1;border:0;outline:0;background:none;height:44px;font:400 15px var(--f);color:var(--ink)}
.p5-adc{position:relative;border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:14px}
.p5-adc div{display:flex;flex-direction:column;gap:4px}
.p5-adc b{font:500 15px/20px var(--f)}
.p5-adc .p-link{font-size:17px;line-height:24px}
.p5-adc-e{position:absolute;left:16px;top:14px}
.p5-refp{display:flex;align-items:center;gap:12px;border-radius:12px;padding:20px;background:linear-gradient(120deg,var(--bg-2),var(--p5-loy2))}
.p5-refp>div{flex:1}
.p5-refp b{display:block;font:600 17px/24px var(--f)}
.p5-refp a{display:inline-flex;align-items:center;gap:6px;margin-top:16px;font:600 15px/20px var(--f);color:var(--ink)}
.p5-refp a svg.i{width:18px;height:18px}
.p5-refp-d{width:64px;height:64px;border-radius:16px;background:var(--p5-hex2);color:var(--on-ink);display:grid;place-items:center;flex:none}
.p5-refp-d svg.i{width:32px;height:32px}
.p5-langs{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.p5-lang{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:72px;border:1px solid var(--line);border-radius:8px;padding:12px;text-align:right;color:var(--ink)}
.p5-lang b{font:600 15px/20px var(--f)}
.p5-lang span{font-size:15px;line-height:20px;color:var(--ink-2)}
.p5-lang.on{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
.ov.p5-langs-s .p3-sh-b{gap:4px}
.p5-fm-o{display:none}
@container (max-width:600px){
  .p5-fm .p2-fm-bar{display:flex;gap:8px}
  .p5-fm .p2-fm-bar .p2-btn{flex:1}
  .p5-fm .p5-fm-o{display:inline-flex;width:48px;height:48px;padding:0;flex:none}
  .p5-fm-od{display:none}
}
/* ---------- client segments ---------- */
.p2-seg.p5-cus .p2-seg-ic{background:linear-gradient(135deg,var(--p5-or1),var(--p5-or2))}
.p5-mcnt{font-style:normal;margin-right:8px;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font-size:12px;line-height:20px;display:inline-block;text-align:center}
.p5-seg-bar{position:sticky;top:0;z-index:3;background:var(--bg);padding:8px 0}
.p5-sn{position:absolute;inset:0;overflow-y:auto;background:var(--bg-2);display:flex;flex-direction:column}
.p5-sn-pr{height:4px;background:var(--line);flex:none}
.p5-sn-pr i{display:block;height:100%;width:33%;background:var(--brand);border-radius:0 0 0 4px}
.p5-sn-top{display:flex;justify-content:flex-end;padding:8px 8px 0}
.p5-sn-in{flex:1;width:100%;max-width:720px;margin:0 auto;padding:8px 20px 24px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.p5-sn-in h1{font:600 24px/32px var(--f);margin:0}
.p5-sn-in>.p5-mute{font-size:13px;line-height:18px;margin-top:-8px}
.p5-sn-name{font:600 15px/20px var(--f)}
.p5-rule{width:100%;background:var(--bg);border-radius:12px;box-shadow:var(--inset);padding:16px;display:flex;flex-direction:column;gap:12px}
.p5-rule-n{font-size:12px;color:var(--ink-2)}
.p5-rule b{font:600 13px/18px var(--f)}
.p5-rule-f{margin:0}
.p5-rule-c{color:var(--brand);font:500 15px/20px var(--f)}
.p5-sn-f{position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:var(--bg);border-top:1px solid var(--line)}
.p5-sn-f small{display:block;font-size:12px;color:var(--ink-2)}
.p5-sn-f b{font:600 15px/20px var(--f)}
/* ---------- home period filter ---------- */
.p-pop.p5-hpop{padding:16px;display:flex;flex-direction:column;gap:16px}
.p5-hpop .p2-f{margin:0}
.p5-hpop-f{display:flex;gap:8px;justify-content:flex-end}
.ov.p5-hs .p3-sh-f .p-btn{flex:1}
@container (max-width:600px){
  .ov.p5-hs .p3-sh-h h2{font-size:28px;line-height:36px}
}
@container (max-width:600px){.p2-fg>.p5-half{grid-column:auto}}
.ov.p5-allf .p3-sh-b{flex:1}
@container (max-width:600px){.ov.p5-tall .mdl{height:calc(100% - 40px)}.ov.p5-tall .p3-sh-b{flex:1}}
.p3-sh-b>.p5-sbox,.p3-sh-b>.p5-refp,.p3-sh-b>.p5-pcl,.p3-sh-b>.p5-langs,.p3-sh-b>.p2-f,.p3-sh-b>.p5-cal,.p3-sh-b>.p5-adc,.p3-sh-b>.p5-2,.p3-sh-b>.p5-exps{flex-shrink:0}
@container (max-width:600px){
  .p5-fm .p2-fm-top{position:sticky;top:0;z-index:6;background:var(--bg);height:64px;gap:12px}
  .p5-fm .p5-fm-tt{display:block;flex:1;min-width:0;font:600 20px/28px var(--f);opacity:0;transition:opacity .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .p5-fm.scrolled .p5-fm-tt{opacity:1}
  .p5-fm .p5-fm-tabs{position:sticky;top:64px;z-index:5;background:var(--bg);padding-top:8px;padding-bottom:12px;margin-bottom:12px}
  .p5-fm .p2-fm-in>h1{margin-top:-8px}
}

/* ---- panel A review 1405-07-24: cash register period (open / cash in / cash out / count / close / activity) ---- */
.p5-rg{display:flex;flex-direction:column;gap:20px}
.p-rg-c.p5-rg-c{background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:20px;gap:6px;font-size:15px;line-height:20px;margin:0;max-width:520px;color:var(--ink)}
.p5-rg-c .p-rg-ct small,.p5-rg-c>small{font-size:14px;line-height:20px;color:var(--ink-2)}
.p5-rg-c .p-rg-open{font:600 12px/16px var(--f);padding:2px 10px;background:var(--ok);color:#fff}
.p5-rg-c .p-rg-open.off{background:var(--bg-3);color:var(--ink-2)}
.p5-rg-c>b{font:700 28px/36px var(--f)}
.p5-rg-b{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.p5-rg-h{display:flex;align-items:center;justify-content:space-between;gap:12px}
.p5-rg-l{display:flex;flex-direction:column;gap:8px;max-width:720px}
.p-rg-r.p5-rg-r{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin:0;font:500 15px/20px var(--f);color:var(--ink)}
.p5-rg-r i{width:36px;height:36px;border-radius:999px;display:grid;place-items:center;flex:none;background:var(--bg-3)}
.p5-rg-r i.g{color:var(--ok)}
.p5-rg-r i.b{color:var(--bad)}
.p5-rg-r i svg.i{width:18px;height:18px}
.p5-rg-r span{display:flex;flex-direction:column}
.p5-rg-r small{font:400 13px/18px var(--f);color:var(--ink-2)}
.p5-rg-x p{display:flex;justify-content:space-between;margin:0 0 12px;font-size:15px}

/* ======================= restyle v3 (business) — panel5 finish: sales, clients, client profile (form only) ======================= */
.p5-cp-main,.p5-cph,.p5-cpi,.p5-cpm,.p5-kc,.p5-tl-i,.p5-sc,.p5-rule,.p5-addr,.p5-adc,.p5-loy,.p5-refp{border-radius:var(--r-card)}
.p5-cp-main,.p5-cph,.p5-cpi,.p5-cpm,.p5-kc,.p5-tl-i,.p5-sc,.p5-rule{box-shadow:var(--inset),var(--sh-1)}
.p5-cpm{padding:6px}
.p5-cpm-i{min-height:44px;border-radius:var(--r-ctl);transition:background-color var(--d-2) var(--ease)}
.p5-cpm-i:hover{background:var(--hover-tint)}
.p5-cpm-i[aria-current="page"]{font-weight:600;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 14%,transparent)}
.p5-cnt{border-radius:var(--r-sm);font-weight:700}
.p5-st h2{font-weight:650}
.p5-cph h1{font-weight:650}
/* KPI tiles (client sales summary): small label, big tight number */
.p5-kc{padding:18px 18px 20px}
.p5-kc-h{font:600 13.5px/20px var(--f);color:var(--ink-2)}
.p5-kc b{font-size:clamp(24px,1rem + .8vw,30px);font-weight:650;line-height:1.2;margin-top:10px}
.p5-sc{transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease)}
@media (hover:hover){.p5-sc:hover{transform:translateY(var(--lift));box-shadow:var(--inset),var(--sh-2)}}
.p5-tabs{width:fit-content;max-width:100%;gap:2px;padding:3px;margin:0 0 20px;background:var(--bg-2);border-radius:var(--r-btn);box-shadow:inset 0 0 0 1px var(--line)}
.p5-tabs button{height:34px;padding:0 14px;border-radius:9px;font-size:14px;color:var(--p-seg-ink);transition:background-color var(--d-2),color var(--d-2),box-shadow var(--d-2)}
.p5-tabs button:hover{color:var(--ink)}
.p5-tabs button[aria-selected="true"],.p5-tabs .p5-tab-more.on{background:var(--p-seg-on);color:var(--ink);box-shadow:var(--sh-seg)}
.p5-seg2{border-radius:var(--r-ctl);border-color:var(--line)}
.p5-sbox{height:44px;transition:border-color var(--d-2),box-shadow var(--d-2)}
.p5-sbox.sq{border-radius:var(--r-ctl)}
.p5-sbox:focus-within{border-color:var(--brand);box-shadow:var(--ring)}
.p5-sub-in{border-radius:var(--r-lg) var(--r-lg) 0 0}
@container (max-width:600px){
  .p5-cp-main,.p5-cph,.p5-cpi,.p5-cpm,.p5-kc,.p5-tl-i,.p5-sc,.p5-rule{box-shadow:var(--inset)}
}
/* ======================= end restyle v3 (business) — panel5 ======================= */

/* ======================= restyle v3 palette (business) — Accord LIGHT colours (panel5) =======================
   Illustrations: lavender/pink -> Accord mint / stage hues (dark blocks above keep the owner's dark values). */
:root{--p5-il0:#d3eee2;--p5-il1:#9fd6bf;--p5-il2:#12a079;--p5-il3:#0f9db0;--p5-or1:#f0a35a;--p5-or2:#e0832a;--p5-hex1:#fbdfe2;--p5-hex2:#a8394a;--p5-hex3:#fdf1f2;--p5-loy1:#e2efe8;--p5-loy2:#d3eee2;
  --p5-fill:var(--night); --p5-fill-ink:var(--on-night)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p5-fill:var(--brand); --p5-fill-ink:var(--on-ink)}}
:root[data-theme="dark"]{--p5-fill:var(--brand); --p5-fill-ink:var(--on-ink)}
.p5-cal-d.s span,.p5-cal-d.e span{background:var(--p5-fill);color:var(--p5-fill-ink)}
/* ======================= end restyle v3 palette (business) panel5 ======================= */


/* panel6 — area W3 styles: Catalog, Online presence, Add-ons, Marketing (prefix p6-). base.css tokens only;
   the few extra colours (illustration pastels, promo gradient) are tokens below with light + dark values. */
[data-app]{--p6-promo:linear-gradient(135deg,#1d9fd8,#16c5c9 60%,#17d2c4);--p6-p1:#fde7f3;--p6-p2:#e8f6ff;--p6-p3:#efeaff;--p6-p4:#fff1e1;--p6-p5:#e7f8ee;--p6-tip:#6950f3}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) [data-app]{--p6-promo:linear-gradient(135deg,#106f98,#0f8b8e 60%,#0f948a);--p6-p1:#3a1c2c;--p6-p2:#13283a;--p6-p3:#241f45;--p6-p4:#3a2914;--p6-p5:#15301f;--p6-tip:#5b47d6}}
:root[data-theme="dark"] [data-app]{--p6-promo:linear-gradient(135deg,#106f98,#0f8b8e 60%,#0f948a);--p6-p1:#3a1c2c;--p6-p2:#13283a;--p6-p3:#241f45;--p6-p4:#3a2914;--p6-p5:#15301f;--p6-tip:#5b47d6}

/* ---------- small controls ---------- */
.p6-dot{display:inline-block;width:16px;height:16px;border-radius:50%;flex:none;font-style:normal}
.p6-tg{width:48px;height:28px;border-radius:999px;background:var(--line-2);position:relative;flex:none;transition:background .15s}
.p6-tg i{position:absolute;top:3px;right:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:right .15s}
.p6-tg[aria-checked="true"]{background:var(--brand)}
.p6-tg[aria-checked="true"] i{right:23px}
.p6-pk{display:flex;align-items:center;gap:10px;height:48px;width:100%;border:1px solid var(--line-2);border-radius:8px;background:var(--bg);padding:0 16px;font:400 15px/20px var(--f);color:var(--ink-3);text-align:right}
.p6-pk.v{color:var(--ink)}
.p6-pk>span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p6-pk svg.i{width:20px;height:20px;color:var(--ink)}
.p6-fx{display:flex;align-items:center;justify-content:space-between;gap:12px;height:48px;border:1px solid var(--line-2);border-radius:8px;padding:0 16px;font-size:15px}
.p6-fx .p2-a{font-weight:500}
.p2-f-l>span i{font-style:normal;font-weight:400;color:var(--ink-2)}
.p6-ck{padding:12px 0}
.p6-ck b{font-size:15px;line-height:20px}
.p6-ck b .p2-cnt{margin-right:6px;vertical-align:1px}
.p6-sub{padding:0 32px 12px 0;display:flex;flex-direction:column;gap:12px}
.p6-sub.p6-rem{gap:12px}
.p6-hint{font-size:13px;line-height:16px;color:var(--ink-2);margin-top:8px}
.p6-warn{font-style:normal;color:var(--warn)}
.p6-off{font-style:normal;display:inline-block;font:500 13px/16px var(--f);color:var(--ink-2);background:var(--bg-3);border-radius:999px;padding:2px 8px;margin-top:6px;width:max-content}
.p6-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.p6-col{display:flex;flex-direction:column;gap:24px}
.p6-srch{width:auto;height:48px;border-radius:8px;padding:0 16px 0 0}
.p6-srch input{flex:1;height:46px;border:0;outline:0;background:none;padding:0 12px;font:400 15px/20px var(--f);color:var(--ink);min-width:0}
.p6-srch svg.i{width:20px;height:20px;color:var(--ink-2)}
.p6-addp{align-self:flex-start;margin-top:4px}

/* ---------- full-screen forms (panel2 .p2-fm + compact sticky title on the phone) ---------- */
.p6-fm-tt{display:none}
.p6-fm .p2-fm-main{align-content:start}
.p6-s .p6-sd{margin:4px 0 24px}
.p6-s.p6-flat{padding-top:24px}
.p6-g3{grid-template-columns:1fr 1fr 1fr}
.p6-ta{border:1px solid var(--line-2);border-radius:8px;background:var(--bg);padding:12px 16px 12px;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.p2-f .p6-ta textarea{border:0;padding:2px 0;height:72px;border-radius:0}
.p6-ai{border-color:var(--brand-soft-3);color:var(--ink)}
.p6-ai svg.i{color:var(--brand)}
.p6-team{display:flex;flex-direction:column}
.p6-ckm{align-items:center}
.p6-ckm .p2-av{margin-left:-2px}
.p6-ckm>span:last-child b{font-size:17px;line-height:24px}
.p6-swr{display:flex;align-items:flex-start;gap:16px;margin-bottom:24px}
.p6-swr>div{flex:1}
.p6-swr h2{display:flex;align-items:center;gap:8px;margin:0 0 4px!important}
.p6-swr .p2-on{font-size:13px;padding:2px 8px}
.p6-swr+.p6-srch{margin-bottom:8px}
.p6-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:48px 16px 24px;gap:8px}
.p6-empty b{font:600 20px/28px var(--f)}
.p6-empty b.lg{font:600 20px/28px var(--f)}
.p6-empty p{color:var(--ink-2);font-size:15px;line-height:22px;max-width:360px}
.p6-empty .p2-btn{margin-top:16px}
.p6-empty.sm{padding:40px 16px 8px}
.p6-res-ill{display:flex;gap:6px;margin-bottom:16px}
.p6-res-ill i{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:var(--brand)}
.p6-res-ill i svg.i{width:18px;height:18px}
.p6-res-ill i.c0{background:var(--p6-p1)}.p6-res-ill i.c1{background:var(--p6-p2)}.p6-res-ill i.c2{background:var(--p6-p3)}.p6-res-ill i.c3{background:var(--p6-p4)}.p6-res-ill i.c4{background:var(--p6-p5)}
.p6-puz,.p6-mag,.p6-book{position:relative;width:56px;height:48px;margin-bottom:12px}
.p6-puz i,.p6-mag i,.p6-book i{position:absolute;display:block}
.p6-puz i:first-child{inset:6px 10px 6px 10px;border-radius:10px;background:linear-gradient(135deg,var(--brand-soft-3),var(--brand))}
.p6-puz i:last-child{width:16px;height:16px;border-radius:50%;top:0;left:20px;background:var(--brand-soft-3)}
.p6-mag i:first-child{inset:0 14px 6px 12px;border-radius:8px;background:linear-gradient(160deg,#c084fc,var(--brand))}
.p6-mag i:last-child{width:22px;height:22px;border-radius:50%;bottom:0;left:10px;background:var(--brand-soft-3);box-shadow:0 0 0 3px var(--bg)}
.p6-book i:first-child{inset:6px 28px 6px 6px;border-radius:4px 0 0 4px;background:linear-gradient(135deg,#a78bfa,var(--brand))}
.p6-book i:last-child{inset:6px 6px 6px 28px;border-radius:0 4px 4px 0;background:linear-gradient(135deg,#c4b5fd,#8b5cf6)}
.p6-promo{display:flex;align-items:stretch;gap:12px;border-radius:12px;background:var(--p6-promo);color:#fff;padding:24px 16px 24px 12px;overflow:hidden;margin-bottom:8px}
.p6-promo-t{flex:1;display:flex;flex-direction:column;gap:8px}
.p6-promo-t b{font:600 20px/28px var(--f)}
.p6-promo-t>span{font-size:16px;line-height:24px;opacity:.95}
.p6-promo-t em{font-style:normal;display:inline-flex;align-items:center;gap:6px;font:500 16px/24px var(--f);margin-top:8px}
.p6-promo-t em svg.i{width:18px;height:18px;transform:scaleX(-1)}
.p6-promo-im{position:relative;width:110px;flex:none}
.p6-promo-im>img{position:absolute;top:8px;right:0;width:70px;height:120px;object-fit:cover;border-radius:10px;border:3px solid #fff}
.p6-promo-im i{position:absolute;top:56px;left:0;width:60px;height:100px;border-radius:10px;overflow:hidden;border:3px solid #fff}
.p6-promo-im i img{width:100%;height:100%;object-fit:cover}
.p6-drop{border:1px dashed var(--line-2);border-radius:12px;padding:6px}
.p6-drop>div{background:var(--bg-2);border-radius:8px;min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.p6-drop svg.i{width:24px;height:24px}
.p6-drop b{font:600 20px/28px var(--f)}
.p6-drop .p2-btn{background:var(--bg)}
.p6-th{font:600 17px/24px var(--f);padding-bottom:16px;border-bottom:1px solid var(--line)}
.p6-frow{display:flex;align-items:center;gap:12px;padding:16px 0}
.p6-frow>div{flex:1;display:flex;flex-direction:column}
.p6-frow b{font:500 17px/24px var(--f)}
.p6-fic{width:40px;height:40px;border:1px solid var(--line);border-radius:8px;display:grid;place-items:center}
.p6-fic svg.i{width:20px;height:20px}
.p6-cost{display:flex;gap:8px}
.p6-cost .p2-f-pre{flex:1}
.p6-seg2{display:flex;background:var(--bg-2);border-radius:8px;padding:4px;gap:2px}
.p6-seg2 button{width:40px;border-radius:6px;display:grid;place-items:center;font:600 15px/20px var(--f);color:var(--ink)}
.p6-seg2 button svg.i{width:20px;height:20px}
.p6-seg2 button[aria-pressed="true"]{background:var(--bg);box-shadow:var(--sh-small)}
.p6-adv .p2-f{margin-bottom:24px}
.p6-adv .p2-f:last-child{margin-bottom:0}
.p6-rem .p2-f{max-width:none}
.p6-dis{background:var(--bg-2)}
.p6-dis input{background:none;color:var(--ink-3)}
.p6-phone{display:grid;grid-template-columns:130px 1fr;gap:8px}
.p6-phone input{height:48px;border:1px solid var(--line-2);border-radius:8px;background:var(--bg);padding:0 16px;font:400 15px/20px var(--f);color:var(--ink);outline:0;width:100%}
.p6-pc .p3-sel{padding-right:12px;direction:ltr;text-align:left}
.p6-fg2{margin-bottom:8px}

/* ---------- picker sheets ---------- */
.p6-pks .p3-sh-b{gap:12px}
.ov.p3-sh.p6-pks.tall .mdl{height:calc(100% - 48px)}
.p6-pl{display:flex;flex-direction:column}
.p6-pi{display:flex;align-items:center;gap:12px;min-height:52px;padding:10px 0;font:400 17px/24px var(--f);text-align:right;width:100%;color:var(--ink);border-bottom:1px solid var(--line)}
.p6-pi>span{flex:1;min-width:0;display:flex;flex-direction:column}
.p6-pi b{font-weight:400}
.p6-pi small{font-size:14px;line-height:20px;color:var(--ink-2)}
.p6-pi>svg.i{width:22px;height:22px;color:var(--ink)}
.p6-pi.p6-addc{color:var(--brand);border:0}
.p6-pi.p6-addc svg.i{width:20px;height:20px;color:var(--brand)}
.p6-pg h3{font:600 20px/28px var(--f);margin:20px 0 4px}
.p6-pg .p6-pi{border:0;min-height:48px;padding:6px 0}
.p6-svc{display:flex;align-items:center;gap:12px;width:100%;min-height:72px;padding:12px 16px 12px 16px;margin-bottom:8px;border-radius:8px;box-shadow:var(--inset);background:var(--p2-card);position:relative;overflow:hidden;text-align:right;color:var(--ink)}
.p6-svc>i{position:absolute;right:0;top:0;bottom:0;width:4px}
.p6-svc>span{flex:1;display:flex;flex-direction:column}
.p6-svc b{font:500 17px/24px var(--f)}
.p6-svc small{color:var(--ink-2);font-size:15px;line-height:20px}
.p6-svc bdi{font:500 15px/20px var(--f)}
.p6-shh{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:-4px}
.p6-shh h2{font:600 24px/32px var(--f);margin:0}
.p6-h3{font:600 17px/24px var(--f);margin:8px 0 0}
.p6-frd{align-items:center}
.p6-frd b{font-weight:500}
.p6-ups .p3-rd b{font-weight:400}
.p6-note{background:var(--bg-2);border-radius:12px;padding:16px;font-size:15px;line-height:22px}
.p6-flts .p3-sh-b{gap:16px}

/* ---------- advanced pricing ---------- */
.p6-apbar{display:flex;gap:8px;align-items:center}
.p6-apbar .p6-srch{flex:1}
.p6-flt svg.i{width:22px;height:22px}
.p6-ap{display:flex;flex-direction:column;gap:4px}
.p6-ap-r{display:flex;align-items:center;gap:12px;min-height:56px}
.p6-ap-r>div{flex:1;display:flex;flex-direction:column}
.p6-ap-r b{font:500 17px/24px var(--f)}
.p6-ap-r small{color:var(--ink-2);font-size:15px;line-height:20px}
.p6-ap-ic{width:36px;height:36px;border-radius:8px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center}
.p6-ap-ic svg.i{width:20px;height:20px}
.p6-ap-p{color:var(--ink-2);font-size:15px}
.p6-ap-r.sub{padding-right:12px}
.p6-ap-l{color:var(--ink-3);font-style:normal}
.p6-ap-l svg.i{width:18px;height:18px;transform:scaleX(-1)}

/* ---------- booking options ---------- */
.p6-bos{display:flex;flex-direction:column}
.p6-bo{padding:32px 0;border-bottom:1px solid var(--line)}
.p6-bo:first-child{padding-top:8px}
.p6-bo:last-child{border-bottom:0}
.p6-bo-h{display:flex;align-items:flex-start;gap:16px}
.p6-bo-h>div{flex:1}
.p6-bo-h h2{font:600 20px/28px var(--f);margin:0 0 4px}
.p6-bo-h p{color:var(--ink-2);font-size:15px;line-height:22px;max-width:520px}
.p6-bo ul{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.p6-bo li{display:flex;align-items:flex-start;gap:8px;font-size:15px;line-height:22px}
.p6-bo li svg.i{width:18px;height:18px;flex:none;margin-top:2px;color:var(--ink-3)}
.p6-bo li.on svg.i{color:var(--ok)}
.p6-bo-n{display:flex;align-items:center;gap:12px;margin-top:20px;padding:16px;border-radius:12px;background:var(--bg-2)}
.p6-bo-n p{flex:1;font-size:15px;line-height:22px}
.p6-bom .p3-sh-b{gap:4px}

/* ---------- smart website: phone bar ---------- */
.p6-wsbar{display:none}

/* ---------- automations ---------- */
.p6-au{position:relative}
.p6-au-m{position:absolute;left:12px;top:16px;opacity:0;transition:opacity .15s}
.p6-au:hover .p6-au-m,.p6-au-m:focus-visible{opacity:1}
.p6-au .p2-au-f .p2-btn{height:32px}
/* automation editor */
.p6-aef .p3-full-top{gap:8px}
.p6-ae-tb{display:flex;gap:8px;margin-right:auto}
.p6-ae{display:flex;flex-direction:column}
.p6-ae-st{display:flex;gap:12px;position:relative;padding-bottom:28px}
.p6-ae-st:not(:last-child)::before{content:'';position:absolute;right:11px;top:30px;bottom:4px;width:1px;background:var(--line)}
.p6-ae-st>div{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.p6-ae-st h3{font:600 17px/24px var(--f);margin:0}
.p6-ae-st p{color:var(--ink-2);font-size:15px}
.p6-ae-i{width:24px;height:24px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.p6-ae-i svg.i{width:15px;height:15px}
.p6-ae-c{display:flex;align-items:flex-start;gap:12px;width:100%;border:1px solid var(--line);border-radius:12px;padding:16px;margin-top:8px}
.p6-ae-c>div{flex:1;display:flex;flex-direction:column}
.p6-ae-c b{font:500 15px/20px var(--f)}
.p6-ae-c small{color:var(--ink-2);font-size:15px;line-height:20px}
.p6-ae-ci{margin-top:22px}
.p6-ae-ci svg.i{width:20px;height:20px}
.p6-ae-ci.m{color:var(--brand)}
.p6-ae-ci.w{color:var(--ok)}

/* =============================== phone =============================== */
@container (max-width:600px){
  .p6-fm .p2-fm-top{position:sticky;top:0;z-index:4;background:var(--bg);height:64px;gap:12px}
  .p6-fm.sc .p2-fm-top{border-bottom:1px solid var(--line)}
  .p6-fm.sc .p6-fm-tt,.p6-aef.sc .p6-fm-tt{display:block;flex:1;font:600 20px/28px var(--f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .p6-fm .p2-fm-x{order:2}
  .p6-fm .p2-fm-in{padding-top:8px}
  .p6-fm .p2-fm-tabs.u button{font-weight:500}
  .p6-fm .p2-fm-tabs.u button[aria-selected="true"]{font-weight:600}
  .p6-s.p6-flat{padding-top:24px}
  .p6-g3{grid-template-columns:1fr 1fr}
  .p6-g3>.p2-f:nth-child(-n+2){grid-column:auto}
  .p6-g3>.p2-f:nth-child(3){grid-column:1/-1}
  .p6-promo{margin-top:8px}
  .p6-sup .p2-fg>*,.p6-fg2>*{grid-column:1/-1}
  .p6-phone{grid-template-columns:76px 1fr}
  .p6-pc .p3-sel{padding:0 8px 0 28px;font-size:14px}
  .p6-pc .p3-selw>svg.i{left:6px}
  .p6-bo{padding:28px 0}
  .p6-bo-h h2{font-size:24px;line-height:32px}
  .p6-bo-h .p2-btn{margin-top:-2px}
  .p6-au-m{opacity:1;left:8px;top:12px}
  .p6-aef .p3-full-top{position:sticky;top:0;flex-direction:row;justify-content:flex-start;padding:8px 8px 8px 19px}
  .p6-aef .p3-full-top .p3-x{order:3;margin-right:0}
  .p6-aef .p6-ae-tb{order:2}
  .p6-aef .p6-ae-tb .p6-dkb{display:none}
  .p6-aef .p3-full-top .p-btn{display:inline-flex}
  .p6-aef .p3-full-top .p6-dkb{display:none}
  .p6-aef.sc .p3-full-top{border-bottom:1px solid var(--line)}
  .p6-aef:not(.sc) .p6-fm-tt{display:none}
  .p6-aef .p6-fm-tt{order:1}
  .p6-aef .p3-full-in h1{font-size:28px;line-height:36px;margin-bottom:8px}
  /* smart website: Fresha shows a purple «log in on the web» bar instead of the two buttons */
  .p6-ws .p2-up-bar{display:none}
  .p6-wsbar{display:flex;align-items:center;gap:16px;position:sticky;bottom:0;z-index:3;background:var(--brand);color:var(--on-ink);padding:12px 19px 16px}
  .p6-wsbar .p2-btn{background:var(--bg);color:var(--ink);border-color:var(--bg);flex:none}
  .p6-wsbar p{flex:1;text-align:center;font:500 15px/20px var(--f)}
  /* reviews: the «Discover ratings and reviews» tip is a purple card with the video */
  .p2-rp .p2-vid{flex-direction:column;background:var(--p6-tip);border-color:var(--p6-tip);color:var(--on-ink);padding:16px;gap:12px}
  .p2-rp .p2-vid-t{padding:0;display:contents}
  .p2-rp .p2-vid-t p{order:1;color:var(--on-ink);font-size:16px;line-height:22px;margin:0}
  .p2-rp .p2-vid-t p b{display:block;font:600 18px/26px var(--f);margin-bottom:4px}
  .p2-rp .p2-vid-im{display:block;order:2;width:100%;height:auto;aspect-ratio:16/9}
  .p2-rp .p2-vid-im em{display:none}
  .p2-rp .p2-vid-t .p6-vl{display:block;order:3;color:var(--on-ink);font-weight:500}
  .p2-rp .p2-vid-t>div{order:4;justify-content:flex-end;align-items:center}
  .p2-rp .p2-vid-t>div .p2-btn:first-child{order:2;background:var(--bg);color:var(--ink);border-color:var(--bg)}
  .p2-rp .p2-vid-t>div .p2-btn:last-child{order:1;color:var(--on-ink)}
  .p2-rp .p2-vid-t>div .p2-btn:first-child svg.i{display:none}
}
.p2-vid-t .p6-vl,.p2-vid-t p b.p6-mb{display:none}
@container (max-width:600px){.p2-rp .p2-vid-t p b.p6-mb{display:block}}
.p2-f-l>span i{margin:0 4px 0 0}
.p6-ck b .p2-cnt{display:inline-flex}
.ov.p3-sh.full:is(.p6-ups,.p6-fadd,.p6-bom,.p6-trg,.p6-flts) .p3-sh-b{flex:1}
.p6-addp+.p2-f{margin-top:24px}
@container (max-width:600px){
  .p6-fm.p2-fm-one .p2-fm-in{max-width:none;padding:8px 20px 120px}
  .p6-fm.p2-fm-one .p2-fm-main{max-width:none;gap:0}
}
@container (max-width:600px){.p2-wrap.full.p6-ws{height:auto;min-height:100%}}
@container (max-width:600px){.p6-wsbar{position:fixed;left:0;right:0;bottom:0;z-index:61}.p6-ws .p2-up-l{padding-bottom:96px}}
/* @1x phone measurements (b-catalog-service-edit@1x): h1 24/32, tabs 52 tall, label→field 4px, section title 20/28 then 24px */
@container (max-width:600px){
  .p2-fg.g3.p6-g3{grid-template-columns:1fr 1fr}
  .p6-fm h1{font:600 24px/32px var(--f);margin-bottom:8px}
  .p6-fm .p2-fm-tabs.u{gap:23px;margin-bottom:0}
  .p6-fm .p2-fm-tabs.u button{height:52px;font-size:14px}
  .p6-fm .p2-f,.p3-sh .p2-f{gap:4px}
  .p6-fm .p2-fm-s.card{padding:24px 0 16px}
  .p6-fm .p2-fm-s h2{margin-bottom:24px}
  .p6-fm .p2-fg{gap:20px 16px}
  .p6-fm .p2-fm-pills{margin-top:24px}
  .p6-fm .p2-fm-pills .p2-btn{height:36px;font-size:14px}
}
@container (max-width:600px){.p6-fm .p2-f small{font-size:12px;line-height:16px}.p6-fm .p6-ta textarea{height:96px}}
/* @1x sizes for tab contents (b-catalog-service-edit-*@1x) */
.p6-swr h2{font:600 17px/24px var(--f)!important}
.p6-empty b,.p6-empty b.lg{font:600 17px/24px var(--f)}
.p6-empty p{font-size:13px;line-height:18px;max-width:320px}
.p6-res-ill i{width:34px;height:34px}
.p6-res-ill i svg.i{width:20px;height:20px}
.p6-res-ill i.c0{color:var(--bad)}.p6-res-ill i.c1{color:var(--blue)}.p6-res-ill i.c2{color:var(--brand)}.p6-res-ill i.c3{color:var(--warn)}.p6-res-ill i.c4{color:var(--ok)}
@container (max-width:600px){
  .p6-promo-t b{font:600 15px/20px var(--f)}
  .p6-promo-t>span{font-size:13px;line-height:18px}
  .p6-promo-t em{font-size:13px}
  .p6-promo{padding:20px 16px 20px 12px}
  .p6-swr p,.p6-fm .p6-sd{font-size:13px;line-height:18px}
  .p6-ck small{font-size:12px;line-height:16px}
  .p6-ck b{font-size:14px;line-height:20px}
}
/* pickers: full-height sheets, 14px rows (b-catalog-service-edit-dd-*@1x) */
.ov.p3-sh.p6-pks .mdl{height:calc(100% - 48px)}
.p6-pi{font-size:14px;line-height:20px;min-height:44px}
.p6-pi small{font-size:11px;line-height:14px}
.p6-pg .p6-pi{min-height:40px;padding:4px 0}
.p6-pg h3{font:600 16px/24px var(--f);margin:16px 0 4px}
.p6-svc b{font-size:15px;line-height:20px}.p6-svc small{font-size:13px}.p6-svc bdi{font-size:14px}
.p-pop .it .p6-dot{width:14px;height:14px;margin-left:12px;vertical-align:-2px}
/* sheets use Fresha's compact 36px fields (b-catalog-service-menu-filters@1x, b-catalog-new-category@1x) */
@container (max-width:600px){
  :is(.p6-flts,.p6-catnew,.p6-apfl) .p3-sel,:is(.p6-catnew) .p2-f input{height:36px;font-size:14px}
  :is(.p6-flts,.p6-catnew,.p6-apfl) .p6-pk{height:36px;font-size:14px}
  .p6-catnew .p2-f textarea{height:88px}
  .p6-flts .p3-sh-b,.p6-catnew .p3-sh-b{gap:14px}
  :is(.p6-flts,.p6-catnew,.p6-apfl) .p2-f-l{font-size:13px;line-height:18px}
}
/* compact sheet footers (b-catalog-service-edit-settings-sales-tax@1x, -online-dd-membership@1x) */
@container (max-width:600px){
  .p6-tax .p3-sh-f,.p6-ups .p3-sh-f{justify-content:flex-end}
  .p6-ups .p3-sh-f{justify-content:space-between}
  .p6-tax .p3-sh-f .p-btn,.p6-ups .p3-sh-f .p-btn{flex:0 0 auto;height:36px;padding:0 15px;font-size:14px}
  .p6-ups .p3-sh-h h2,.p6-tax .p3-sh-h h2{font-size:20px;line-height:28px}
  .p6-ups .p6-srch,.p6-fadd .p6-srch,.p6-pks .p6-srch,.p6-apf .p6-srch{height:36px}
  .p6-ups .p6-srch input,.p6-fadd .p6-srch input,.p6-pks .p6-srch input,.p6-apf .p6-srch input{height:34px;font-size:13px}
  .p6-ups .p3-rd b{font-size:14px}.p6-ups .p3-rd small{font-size:12px}
  .p6-apf .p3-full-in h1{font-size:20px;line-height:28px}
  .p6-apf .p3-full-d{font-size:12px;line-height:16px;margin-top:-8px}
  .p6-ap-r{min-height:48px}
  .p6-ap-r b{font-size:13px;line-height:18px;font-weight:600}
  .p6-ap-r small,.p6-ap-p{font-size:12px;line-height:16px}
  .p6-apbar .p6-flt{width:36px;height:36px}
  .p6-shh h2{font-size:20px;line-height:28px}
}
/* booking options @1x: section 17/24, text 13/18, 32px pills */
@container (max-width:600px){
  .p6-bo-h h2{font:600 17px/24px var(--f)}
  .p6-bo-h p,.p6-bo li,.p6-bo-n p{font-size:13px;line-height:18px}
  .p6-bo li svg.i{width:16px;height:16px;margin-top:1px}
  .p6-bo ul{gap:6px;margin-top:20px}
  .p6-bo .p2-btn.sm{height:32px;padding:0 12px;font-size:14px}
  .p6-bo{padding:28px 0 32px}
  .p6-bom .p3-sh-h p{font-size:13px;line-height:18px}
  .p6-note{font-size:13px;line-height:18px}
}
@container (max-width:600px){
  .p6-bo-h h2{font:600 20px/28px var(--f)}
  .p6-bo-h p{font-size:14px;line-height:20px}
  .p6-bo ul{gap:10px;margin-top:24px}
  .p6-bo .p2-btn.sm{height:36px;padding:0 15px}
}
/* add-ons @1x (b-addons@1x, b-addons-integrations@1x): compact cards, 40px icons, square integration logos */
.p6-adp .p2-ad-ic.lg b{border-radius:8px}
@container (max-width:600px){
  .p6-adp .p2-ad{min-height:0;padding:16px 16px 20px}
  .p6-adp .p2-ad-top{margin-bottom:16px}
  .p6-adp .p2-ad-ic{width:40px;height:40px}
  .p6-adp .p2-ad-ic svg.i{width:22px;height:22px}
  .p6-adp .p2-ad-ic.lg b{width:40px;height:40px;font-size:16px}
  .p6-adp .p2-ad-ic.lg svg{width:36px;height:36px}
  .p6-adp .p2-ad-ic.lg .p2-fbig{width:40px;height:40px}
  .p6-adp .p2-ad-ic.lg .p2-fbig i{width:20px;height:20px}
  .p6-adp .p2-ad h3{font-size:15px;line-height:20px}
  .p6-adp .p2-ad p{font-size:13px;line-height:18px;margin-bottom:16px}
  .p6-adp .p2-ad .p2-btn.sm{height:32px;padding:0 12px;font-size:13px}
  .p6-adp .p2-ad-g{gap:16px}
  .p6-adp .p2-tab{height:32px;font-size:13px;padding:0 12px}
  .p6-adp .p2-ad-b{font-size:11px;padding:1px 8px}
}
/* link builder + smart website bar @1x */
@container (max-width:600px){
  .p2-lkp .p2-hd-d{font-size:13px;line-height:18px}
  .p2-lkp .p2-lk-t{padding:16px 16px 12px}
  .p2-lkp .p2-lk-t svg.i{width:30px;height:30px;margin-bottom:16px}
  .p2-lkp .p2-lk-t h3{font-size:14px;line-height:20px}
  .p2-lkp .p2-lk-t p{font-size:12px;line-height:16px}
  .p2-lkp .p2-lk-b{padding:12px}
  .p2-lkp .p2-lk-b .p2-btn{height:36px;font-size:14px}
  .p6-wsbar{padding:12px 16px 16px}
  .p6-wsbar .p2-btn{height:40px;padding:0 28px;font-size:14px}
  .p6-wsbar p{font-size:12px;line-height:16px}
}
/* automations @1x: compact cards; editor 14px step titles */
@container (max-width:600px){
  .p6-au{min-height:0;padding:16px 16px 14px}
  .p6-au .p2-au-ic{margin-bottom:16px;height:24px}
  .p6-au .p2-au-ic svg.i{width:24px;height:24px}
  .p6-au h3{font-size:15px;line-height:20px;margin-bottom:8px}
  .p6-au p{font-size:13px;line-height:18px;margin-bottom:16px}
  .p6-au .p2-on{font-size:12px;padding:1px 8px}
  .p6-au .p2-au-f .p2-btn{height:32px;font-size:14px}
  .p6-au-m{top:8px}
  .p2-aup .p2-au-tabs .p2-tab{height:32px;font-size:13px;padding:0 12px}
  .p6-aef .p6-ae-st h3{font-size:14px;line-height:20px}
  .p6-aef .p6-ae-st p{font-size:12px;line-height:16px}
  .p6-aef .p6-ae-st .p2-btn.sm{height:32px;font-size:13px;padding:0 12px}
  .p6-aef .p6-ae-c b{font-size:13px;line-height:18px}
  .p6-aef .p6-ae-c small{font-size:12px;line-height:16px}
  .p6-aef .p6-ae-i{background:var(--brand);color:var(--on-ink)}
  .p6-aef .p3-full-in h1{font-size:22px;line-height:30px}
  .p6-aef .p3-full-bar{border-top:0}
  .p6-trg .p3-sel{height:36px;font-size:14px}
}
/* reviews tip @1x: popover under the tabs, one action row (Learn more · Close · Watch now) */
@container (max-width:600px){
  .p2-rp .p2-pg{position:relative}
  .p2-rp .p2-vid{order:3;flex-flow:row wrap;align-items:center;margin-bottom:-300px;position:relative;z-index:6;box-shadow:var(--sh-pop);padding:16px 16px 12px;gap:12px 8px}
  .p2-rp .p2-rp-tabs{order:2}
  .p2-rp .p2-hd{order:1}
  .p2-rp .p2-vid-t p{flex:1 0 100%;font-size:12px;line-height:16px}
  .p2-rp .p2-vid-t p b{font-size:14px;line-height:20px}
  .p2-rp .p2-vid-im{flex:1 0 100%;border-radius:8px}
  .p2-rp .p2-vid-t .p6-vl{flex:1;font-size:12px}
  .p2-rp .p2-vid-t>div{flex:none;gap:4px}
  .p2-rp .p2-vid-t>div .p2-btn{height:32px;font-size:13px;padding:0 12px}
  .p2-rp .p2-vid-t>div .p2-btn.ghost{border-color:transparent}
}
@container (max-width:600px){:where(.p2-rp .p2-pg>*){order:4}}

/* ---- panel A review 1405-07-24: service-menu actions, bundle services, suppliers, order / bulk / print sheets ---- */
.p6-arch{font:500 12px/16px var(--f);font-style:normal;color:var(--ink-2);background:var(--bg-3);border-radius:999px;padding:2px 8px;margin-right:6px;vertical-align:middle}
.p6-cempty{margin:8px 0 0;font-size:14px;line-height:20px}
.p6-bsl,.p6-supl,.p6-ord{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.p6-bsr,.p6-supr,.p6-ordr{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:var(--bg)}
.p6-bsr>i{width:4px;align-self:stretch;border-radius:4px}
.p6-bsr span,.p6-supr div,.p6-ordr span{flex:1;min-width:0;display:flex;flex-direction:column}
.p6-bsr b,.p6-supr b,.p6-ordr b{font:500 15px/20px var(--f)}
.p6-bsr small,.p6-supr small,.p6-ordr small{font-size:13px;line-height:18px;color:var(--ink-2)}
.p6-bsr bdi{font:500 15px/20px var(--f)}
.p6-supl{margin-top:16px}
.p6-qlu{height:48px;border:1px solid var(--line-2);border-radius:8px;padding:0 12px;background:var(--bg-2);color:var(--ink);font:400 15px/20px var(--f);width:100%;text-align:left}
.p-btn.p6-bad{background:var(--bad);border-color:var(--bad);color:#fff}
.p6-mprint{display:flex;flex-direction:column;gap:6px}
.p6-mprint>b{font:600 18px/24px var(--f)}
.p6-mprint h3{font:600 15px/20px var(--f);margin:12px 0 2px}
.p6-mprint p{display:flex;justify-content:space-between;gap:12px;margin:0;font-size:14px;line-height:20px}
@media print{body *{visibility:hidden}.p6-mprint,.p6-mprint *{visibility:visible}.p6-mprint{position:fixed;inset:24px}}
/* lists built after «شروع کنید» (products, packages, stocktakes, deals, campaigns, smart pricing) */
.p6-lst .p-tbl-w{margin-top:16px}
.p6-lst .lk b{font-weight:500}
.p6-lbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px}
.p6-lbar .p2-srch{flex:1;min-width:220px}
.p6-step{margin:0 0 12px;font-size:14px;line-height:20px;color:var(--ink-2)}
.p6-kvl{display:flex;flex-direction:column;gap:10px}
.p6-kvl p{display:flex;justify-content:space-between;gap:16px;margin:0;font-size:15px;line-height:20px}
.p6-kvl span{color:var(--ink-2)}
.p6-kvl b{font-weight:500;text-align:left;max-width:60%;overflow-wrap:anywhere}
.p6-pi.on{background:var(--brand-soft)}
.p6-dtyp .p6-pi svg.i,.p6-chk>svg.i{width:20px;height:20px;flex:none;color:var(--ink-2)}
/* marketplace profile checklist + live banners */
.p6-live{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border:1px solid var(--line);border-radius:16px;padding:20px;margin:16px 0;background:var(--bg)}
.p6-live.on{border-color:var(--ok);box-shadow:inset 4px 0 0 var(--ok)}
.p6-live>div{flex:1;min-width:200px;display:flex;flex-direction:column;gap:2px}
.p6-live b{font:600 17px/24px var(--f)}
.p6-live small{font-size:14px;line-height:20px;color:var(--ink-2)}
.p6-chkl{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.p6-chk{display:flex;align-items:center;gap:12px;padding:16px 20px;color:var(--ink);border-top:1px solid var(--line)}
.p6-chk:first-child{border-top:0}
.p6-chk:hover{background:var(--bg-2)}
.p6-chk i{width:32px;height:32px;border-radius:999px;display:grid;place-items:center;background:var(--bg-3);color:var(--ink-2);flex:none}
.p6-chk i.ok{background:var(--ok);color:#fff}
.p6-chk i svg.i{width:18px;height:18px}
.p6-chk span{flex:1;display:flex;flex-direction:column}
.p6-chk b{font:500 15px/20px var(--f)}
.p6-chk small{font-size:14px;line-height:20px;color:var(--ink-2)}
/* website themes, link QR, stocktake rows, loyalty rows */
.p6-thg{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.p6-th{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:12px;color:var(--ink);font:500 14px/20px var(--f);text-align:right}
.p6-th.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.p6-th i{width:28px;height:28px;border-radius:999px;flex:none}
.p6-ltr{direction:ltr}
.p6-qr{width:168px;height:168px;margin:4px auto 16px;border:1px solid var(--line);border-radius:12px;padding:8px;background:#fff}
.p6-qr svg{width:100%;height:100%;display:block}
.p6-stk{display:flex;flex-direction:column;gap:8px}
.p6-stkr{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.p6-stkr span{flex:1;display:flex;flex-direction:column}
.p6-stkr b{font:500 15px/20px var(--f)}
.p6-stkr small{font-size:13px;line-height:18px;color:var(--ink-2)}
.p6-stkr .p2-f{width:120px;flex:none;margin:0}
.p6-ltabs{margin:16px 0}
.p6-loyl{display:flex;flex-direction:column;gap:8px}
.p6-loyr{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:12px;padding:12px 16px}
.p6-loyr span{flex:1;display:flex;flex-direction:column}
.p6-loyr b{font:500 15px/20px var(--f)}
.p6-loyr small{font-size:13px;line-height:18px;color:var(--ink-2)}
.p2-rp-rep{background:var(--bg-2);border-radius:12px;padding:12px 16px;margin:8px 0}
.p2-rp-rep b{font:600 14px/20px var(--f)}
.p2-rp-rep p{margin:4px 0 0;font-size:14px;line-height:20px}
.p6-thumbs{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;justify-content:center}
.p6-thumbs img{width:72px;height:72px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.p6-prev{border:1px solid var(--line);border-radius:12px;padding:16px;background:var(--bg-2)}
.p6-prev b{font:600 14px/20px var(--f)}
.p6-prev p{margin:8px 0 0;font-size:15px;line-height:22px}
.p6-adl{margin-top:16px;text-align:right}

/* back 1405-07-24: ← of wizard step 2+ (form6 o.stepBack, campaign / website wizards) */
.p6-fm-bk.d{position:absolute;right:32px;top:14px;z-index:3}
.p6-fm-bk.m{display:none}
@container (max-width:600px){
  .p6-fm-bk.d{display:none}
  .p6-fm-bk.m{display:grid;order:9;margin:0 -10px 0 0}   /* .p2-fm-top is row-reverse: the highest order sits at the start (right) */
}
/* ======================= restyle v3 (business) — panel6 finish: catalogue, online, marketing (form only) ======================= */
.p6-pk,.p6-srch,.p6-fx,.p6-ta,.p6-phone input{border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.p6-pk,.p6-srch{height:44px}
.p6-srch input{height:42px}
.p6-pk:hover,.p6-srch:hover{border-color:var(--ink-3)}
.p6-srch:focus-within,.p6-pk:focus-visible{border-color:var(--brand);box-shadow:var(--ring);outline:0}
.p6-svc{border-radius:var(--r-md);overflow:hidden;transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease)}
@media (hover:hover){.p6-svc:hover{transform:translateY(-1px);box-shadow:var(--inset),var(--sh-2)}}
.p6-bsr,.p6-supr,.p6-ordr{border-radius:var(--r-ctl)}
.p6-promo,.p6-drop,.p6-note,.p6-bo-n,.p6-ae-c,.p6-qr,.p6-stkr,.p6-loyr,.p6-prev,.p6-th,.p6-live,.p6-chkl{border-radius:var(--r-card)}
.p6-stkr,.p6-loyr,.p6-ae-c{box-shadow:var(--sh-1)}
.p6-th{transition:border-color var(--d-2),box-shadow var(--d-2)}
.p6-seg2{border-radius:var(--r-ctl);padding:3px;box-shadow:inset 0 0 0 1px var(--line)}
.p6-seg2 button{border-radius:7px;transition:background-color var(--d-2),box-shadow var(--d-2)}
.p6-seg2 button[aria-pressed="true"]{background:var(--p-seg-on);box-shadow:var(--sh-seg)}
/* ======================= end restyle v3 (business) — panel6 ======================= */

/* ======================= restyle v3 palette (business) — Accord LIGHT colours (panel6) ======================= */
[data-app]{--p6-promo:linear-gradient(135deg,#0b6f7c,#0b7658 60%,#17734f);--p6-p1:#fbdfe2;--p6-p2:#d2eef2;--p6-p3:#e2efe8;--p6-p4:#fbe6d1;--p6-p5:#d6f0e2;--p6-tip:var(--night);
  --p6-fill:var(--night); --p6-ill1:linear-gradient(160deg,#9fd6bf,#0b7658); --p6-ill2:linear-gradient(135deg,#9fd6bf,#0b7658); --p6-ill3:linear-gradient(135deg,#d3eee2,#12a079)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) [data-app]{--p6-fill:var(--brand);
  --p6-ill1:linear-gradient(160deg,#c084fc,var(--brand)); --p6-ill2:linear-gradient(135deg,#a78bfa,var(--brand)); --p6-ill3:linear-gradient(135deg,#c4b5fd,#8b5cf6)}}
:root[data-theme="dark"] [data-app]{--p6-fill:var(--brand);
  --p6-ill1:linear-gradient(160deg,#c084fc,var(--brand)); --p6-ill2:linear-gradient(135deg,#a78bfa,var(--brand)); --p6-ill3:linear-gradient(135deg,#c4b5fd,#8b5cf6)}
@container (max-width:600px){.p6-wsbar{background:var(--p6-fill)} .p6-aef .p6-ae-i{background:var(--p6-fill)}}
.p6-mag i:first-child{background:var(--p6-ill1)}
.p6-book i:first-child{background:var(--p6-ill2)}
.p6-book i:last-child{background:var(--p6-ill3)}
/* ======================= end restyle v3 palette (business) panel6 ======================= */


/* panel7 — area W4 styles: reports + workspace settings part 1 (prefix p7-). base.css tokens only.
   Phone sizes from capture/phone b-settings-*@1x / 1.0-font shots (dp ≈ px). */

/* ---------- shared bits ---------- */
.p7-dk{display:contents}.p7-mb{display:none}
.p7-prem{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font:500 12px/16px var(--f);font-style:normal;white-space:nowrap}
.p7-prem.lg{height:24px;font-size:13px;margin-bottom:8px;align-self:flex-start}
.p-pop .it span:has(>.p7-prem){display:flex;align-items:center;justify-content:space-between;gap:8px}
.p7-ib{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;color:var(--ink);flex:none}
.p7-ib:hover{background:var(--bg-2)}
.p7-ib svg.i{width:22px;height:22px}
.p7-ib[aria-pressed="true"] svg{color:var(--ink)}
.p7-mt-acts{gap:8px;align-items:center}
.p7-mt-acts .p-btn.s{height:36px}
.p7-selb{width:100%;height:48px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--line-2);border-radius:8px;background:var(--bg);color:var(--ink);padding:0 16px 0 14px;font:400 15px/20px var(--f);text-align:right}
.p7-selb svg.i{width:20px;height:20px;flex:none}
.p7-selb:focus-visible{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand);outline:0}
.p7-tag{display:inline-flex;height:20px;align-items:center;padding:0 8px;margin-right:6px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font:500 12px/16px var(--f);font-style:normal;vertical-align:middle}

/* ---------- sheets / forms ---------- */
.p7-sh .p3-sh-b{gap:24px}
.p7-sh .p3-sh-f .p-btn{min-width:120px}
.p7-f{display:flex;flex-direction:column;gap:8px}
.p7-sec{display:flex;flex-direction:column;gap:12px}
.p7-sec+.p7-sec{border-top:1px solid var(--line);padding-top:24px}
.p7-sec h3{font:600 17px/24px var(--f);margin:0}
.p7-sd{color:var(--ink-2);font-size:14px;line-height:20px;margin:-8px 0 0}
.p7-sub{padding:0 32px 4px 0}
.p7-sub .p3-rd,.p7-sub .p3-ck{padding:6px 0}
.p7-rds .p3-rd b,.p7-cks .p3-ck b{font-weight:500}
.p7-rds.cards .p3-rd{align-items:center}

/* =================================== REPORTS =================================== */
.p7-rr{cursor:pointer}
.p7-rr .p2-rs-t{gap:2px}
.p7-rr .p2-rs-t .p7-prem{align-self:flex-start;margin-top:6px}
.p2-rs-r .p7-star{display:grid}
.p7-star{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;flex:none}
.p7-star:hover{background:var(--bg-2)}
.p7-star svg.i{width:22px;height:22px}
.p7-rtb .p7-dk{display:flex;gap:8px}
.p7-rempty{padding:64px 24px}
.p7-rempty svg.i{width:40px;height:40px;color:var(--brand);margin-bottom:12px}
.p7-rhd .p2-hd-d{max-width:none}

/* report page */
.p7-rp{background:var(--bg)}
.p7-rp-in{max-width:1180px;margin:0 auto;padding:24px 32px 64px;display:flex;flex-direction:column}
.p7-rp-top{display:flex;align-items:center;gap:8px;margin-bottom:16px}
.p7-rp-top .sp{flex:1}
.p7-rp-t{font:600 28px/36px var(--f);margin:0}
.p7-rp-d{color:var(--ink-2);font-size:15px;line-height:20px;margin:8px 0 24px;max-width:640px}
.p7-vrow{display:flex;align-items:center;gap:4px;border-bottom:1px solid var(--line);margin-bottom:16px}
.p7-vplus{width:36px;height:36px;display:grid;place-items:center;border-radius:50%}
.p7-vplus svg.i{width:18px;height:18px}
.p7-chip{height:36px;display:inline-flex;align-items:center;gap:6px;padding:0 14px;border:1px solid var(--line-2);border-radius:999px;background:var(--bg);color:var(--ink);font:500 15px/20px var(--f);white-space:nowrap;flex:none}
.p7-chip svg.i{width:18px;height:18px}
.p7-chip:not(:has(span)){width:36px;padding:0;justify-content:center}
.p7-chip.v{border:0;border-bottom:2px solid var(--ink);border-radius:0;height:44px;padding:0 12px;font-weight:600}
.p7-chip.plain{border-color:var(--line)}
.p7-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-bottom:24px;padding-bottom:2px}
.p7-chips::-webkit-scrollbar{display:none}
.p7-tbl{overflow-x:auto;border-top:1px solid var(--line)}
.p7-th{display:flex;min-width:max-content;border-bottom:1px solid var(--line)}
.p7-tr{display:flex;min-width:max-content;border-bottom:1px solid var(--line)}.p7-tr span{width:140px;flex:none;white-space:nowrap;padding:12px 16px;font:400 14px/20px var(--f);text-align:left}.p7-tr span:first-child{width:220px;text-align:right;position:sticky;right:0;background:var(--bg)}
.p7-th span{width:140px;flex:none;white-space:nowrap;padding:12px 16px;font:600 14px/20px var(--f);text-align:left}
.p7-th span:first-child{width:220px;text-align:right;position:sticky;right:0;background:var(--bg)}
.p7-none{display:flex;flex-direction:column;align-items:center;text-align:center;padding:96px 16px;gap:4px;position:sticky;right:0;width:100%;max-width:calc(100vw - 64px)}
.p7-none svg.i{width:40px;height:40px;color:var(--brand);margin-bottom:12px}
.p7-none b{font:600 20px/28px var(--f)}
.p7-none p{color:var(--ink-2);margin:0}
/* premium summary: blurred sample table + upgrade card */
.p7-ps{position:relative;min-height:520px}
.p7-ps-blur{filter:blur(3px);opacity:.55;user-select:none;pointer-events:none;max-width:720px}
.p7-ps-s{margin-bottom:24px}
.p7-ps-h,.p7-ps-r{display:flex;justify-content:space-between;padding:6px 0;font-size:14px;line-height:20px}
.p7-ps-h b{font-weight:600}
.p7-ps-r span:first-child{color:var(--brand)}
.p7-ps-r.b{font-weight:600}.p7-ps-r.b span:first-child{color:var(--ink)}
.p7-ps-lock{position:absolute;top:40px;right:50%;transform:translateX(50%);width:min(360px,100%);display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px}
.p7-ps-lock>i{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:var(--brand);color:var(--on-ink);margin-bottom:4px}
.p7-ps-lock>i svg.i{width:26px;height:26px}
.p7-ps-lock b{font:600 22px/28px var(--f)}
.p7-ps-lock p{color:var(--ink-2);font-size:16px;line-height:22px;margin:0 0 8px}
.p7-ps-lock .p-btn{min-width:140px}
/* dashboard */
.p7-dash{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.p7-dc{border:1px solid var(--line);border-radius:12px;padding:20px 16px;display:flex;flex-direction:column;gap:8px;background:var(--bg)}
.p7-dc h3{font:600 17px/24px var(--f);margin:0}
.p7-dc>.p2-a{font-size:15px}
.p7-dc-big{font:600 28px/36px var(--f);margin:8px 0 0}
.p7-cmp{display:flex;align-items:center;gap:8px;color:var(--ink-2);font-size:13px;line-height:18px;margin:4px 0 8px}
.p7-cmp em{display:inline-flex;align-items:center;gap:2px;height:22px;padding:0 6px;border:1px solid var(--line);border-radius:6px;font-style:normal;font-weight:600;color:var(--ink)}
.p7-cmp em svg.i{width:12px;height:12px}
.p7-dkv{margin:0;display:grid;gap:6px}
.p7-dkv div{display:flex;justify-content:space-between;font-size:15px;line-height:20px}
.p7-dkv dt{color:var(--ink-2)}.p7-dkv dd{margin:0;font-weight:600}
.p7-lc svg{width:100%;height:110px;display:block}
.p7-lc .gr line{stroke:var(--line);stroke-dasharray:3 3;stroke-width:1}
.p7-lc .gr text{font:10px var(--f);fill:var(--ink-3);text-anchor:end}
.p7-lc .dt circle{fill:var(--brand)}
.p7-lc-x{display:flex;justify-content:space-between;color:var(--ink-2);font-size:13px;line-height:18px;margin-top:4px}
.p7-leg{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px;font-size:14px;line-height:20px}
.p7-leg li{display:flex;align-items:center;gap:8px}
.p7-leg li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brand);flex:none}
.p7-leg li.c1::before{background:var(--brand-soft);box-shadow:inset 0 0 0 1px var(--brand)}
.p7-leg li.c2::before{background:var(--star)}.p7-leg li.c3::before{background:var(--bad)}.p7-leg li.c4::before{background:var(--line-2)}
.p7-leg li span{flex:1;color:var(--ink-2)}.p7-leg li b{font-weight:600}
/* period sheet calendar */
.p7-per .p3-sh-b{gap:16px}
.p7-cal-h{display:flex;align-items:center;justify-content:space-between;margin:8px 0}
.p7-cal-h b{font:600 17px/24px var(--f)}
.p7-cal-g{display:grid;grid-template-columns:repeat(7,1fr);row-gap:4px;text-align:center}
.p7-cal-g i{font-style:normal;color:var(--ink-2);font-size:13px;line-height:28px}
.p7-cal-g button{height:36px;font-size:15px;color:var(--ink)}
.p7-cal-g button.in{background:var(--brand-soft)}
.p7-cal-g button.end{background:var(--brand-soft);position:relative;color:var(--on-ink);z-index:0}
.p7-cal-g button.end::before{content:"";position:absolute;inset:2px 50%;width:32px;margin-right:-16px;border-radius:50%;background:var(--brand);z-index:-1}
/* filters sheet */
.p7-rflt .p3-sh-h{align-items:center}
.p7-rflt .p3-sh-h h2{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.p7-adv{display:inline-flex;align-items:center;gap:6px;align-self:center;height:32px;padding:0 12px;border:1px solid var(--line);border-radius:999px;font:500 14px/20px var(--f)}
.p7-adv i{width:16px;height:16px;border-radius:4px;background:var(--brand);color:var(--on-ink);display:grid;place-items:center}
.p7-adv i svg.i{width:12px;height:12px}
.p7-exps{margin-top:-8px}
.p7-exp .p3-exp-h>svg.i:first-child{width:20px;height:20px;flex:none}
.p7-exp .p3-exp-h .p7-prem{margin-left:8px}
.p7-exp .p3-exp-h em.p-link{color:var(--brand)}
.p7-nof{color:var(--ink-2);margin:4px 0 8px}
.p7-exp .p3-exp-b{padding:0 32px 12px 0}
/* insights upsell */
.p7-upsh .p3-sh-b{padding-top:0}
.p7-up{display:flex;flex-direction:column;gap:16px}
.p7-up-ad{display:inline-flex;align-items:center;gap:8px;font:600 15px/20px var(--f)}
.p7-up-ad i{width:28px;height:28px;border-radius:7px;background:var(--brand);color:var(--on-ink);display:grid;place-items:center}
.p7-up-ad i svg.i{width:18px;height:18px}
.p7-up h1{font:600 32px/40px var(--f);margin:0}
.p7-up>p{font-size:16px;line-height:24px;margin:0}
.p7-up ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;font-size:16px;line-height:24px}
.p7-up li{display:flex;gap:10px}
.p7-up li svg.i{width:20px;height:20px;flex:none;margin-top:2px}
.p7-up-pr{font-size:15px}.p7-up-pr b{font:600 22px/28px var(--f);display:block}
.p7-up-try{color:var(--brand);font-weight:600}

@container (max-width:600px){
  .p7-dk,.p7-rtb .p7-dk{display:none}.p7-mb{display:contents}
  /* all reports list on the phone */
  .p7-rsall{background:var(--bg-2)}
  .p7-rsall .p2-rs{display:block;padding:0 16px 32px}
  .p7-rsall .p2-rs-side{display:none}
  .p7-rsall .p2-rs-main{gap:16px}
  .p7-rsall .p7-rhd .p2-hd-acts{display:none}
  .p7-rsall .p7-rhd h1{font:600 28px/36px var(--f);display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
  .p7-rsall .p7-rhd h1 .p2-cnt{margin-top:6px}
  .p7-rsall .p7-rtb{margin-top:0;gap:8px}
  .p7-rsall .p7-rtb .p2-srch{flex:1;width:auto;height:44px;border-radius:999px}
  .p7-rsall .p7-rtb .p2-tb-sp{display:none}
  .p7-fbtn{width:44px;height:44px;border:1px solid var(--line-2);background:var(--bg)}
  .p7-rtabs{overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}
  .p7-rtabs::-webkit-scrollbar{display:none}
  .p7-rsall .p2-rs-list{gap:12px}
  .p7-rsall .p2-rs-r{height:auto;align-items:flex-start;padding:16px 16px 16px 8px;gap:12px}
  .p7-rsall .p2-rs-ic{width:40px;height:40px;margin-top:8px}
  .p7-rsall .p2-rs-t b{font:600 15px/20px var(--f)}
  .p7-rsall .p2-rs-t>span:not(.p7-prem){display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:15px;line-height:20px}
  .p7-rsall .p7-star{margin-top:-8px}
  .p2-rs-mob .p2-rs-i{cursor:pointer}
  /* report page */
  .p7-rp-in{padding:0 16px 48px}
  .p7-rp-top{display:none}
  .p7-rp-t{font-size:28px;line-height:36px}
  .p7-rp-d{font-size:15px;margin:8px 0 20px}
  .p7-chips{margin:0 -16px 20px;padding:0 16px 2px}
  .p7-th span{width:120px}
  .p7-th span:first-child{width:150px}
  .p7-none{max-width:calc(100vw - 32px);padding:80px 16px}
  .p7-dash{grid-template-columns:1fr;gap:12px}
  .p7-ps-lock{top:24px}
  .p7-up h1{font-size:28px;line-height:36px}
}

/* =================================== WORKSPACE SETTINGS =================================== */
:root{--p7-st-blue:#2d76ec;--p7-st-amber:#f2a73b}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p7-st-blue:#5b95f0;--p7-st-amber:#f5b85e}}
:root[data-theme="dark"]{--p7-st-blue:#5b95f0;--p7-st-amber:#f5b85e}
.p7-h2{font:600 20px/28px var(--f);margin:8px 0 16px}
.p7-ll{background:var(--p2-card);border-radius:12px;box-shadow:var(--inset);padding:8px 0;margin-bottom:24px}
.p7-ll button{width:100%;height:48px;display:flex;align-items:center;gap:12px;padding:0 20px;font:500 15px/20px var(--f);text-align:right;color:var(--ink)}
.p7-ll button span{flex:1}
.p7-ll button svg.i{width:20px;height:20px;flex:none}
.p7-ll.ext button{color:var(--ink-2);font-weight:400}
.p7-ll.ext button svg.i:last-child{order:-1}
.p7-loc{cursor:pointer}
.p7-loc .p2-loc-t .p-btn{margin-top:12px}
.p7-c2 .p2-kv{grid-template-columns:1fr 1fr}
.p7-c2f .p2-kv>div:first-child{grid-column:1/-1}
.p7-ohl{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:16px}
.p7-ohl li{display:flex;align-items:center;gap:8px;font-size:15px;line-height:20px}
.p7-ohl li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--line-2);flex:none}
.p7-ohl li.on::before{background:var(--ok)}
.p7-ohl li b{flex:1;font-weight:600}
.p7-ohl li span{color:var(--ink-2)}
.p7-wsd{background:var(--bg-3);border-radius:16px 16px 0 0;padding:16px 24px;font-size:15px;line-height:20px;margin-bottom:-16px;position:relative;z-index:1}
.p7-wsc{border-radius:0 0 16px 16px}
.p7-ill{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);margin-bottom:16px}
.p7-ill svg.i{width:30px;height:30px}
.p7-pn-a{display:inline-flex;align-items:center;gap:6px;color:inherit;font:500 14px/20px var(--f);margin-top:16px}
.p7-pn-a svg.i{width:16px;height:16px}
.p7-tg{width:48px;height:28px;border-radius:999px;background:var(--line-2);position:relative;flex:none;transition:background .15s}
.p7-tg i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--bg);box-shadow:0 1px 2px rgba(0,0,0,.2);transition:left .15s}
.p7-tg[aria-checked="true"]{background:var(--brand)}
.p7-tg[aria-checked="true"] i{left:23px}
.p7-hrtop{border-top:1px solid var(--line)}
/* tipping advanced (full page) */
.p7-ft{gap:8px}
.p7-ft .sp{flex:1}
.p7-ib2{width:40px;height:40px;border:1px solid var(--line-2)}
.p3-full-top .p7-ib2{display:inline-flex}
.p7-full .p2-srch{width:100%;height:44px;border-radius:8px}
.p7-tloc{display:flex;align-items:center;gap:12px;font:600 15px/20px var(--f);margin-top:8px}
.p7-tloc span{width:40px;height:40px;border-radius:8px;border:1px solid var(--line);display:grid;place-items:center}
.p7-tloc svg.i{width:20px;height:20px}
.p7-full .dis .p3-sel{background:var(--bg-2);color:var(--ink-3)}
/* sheets */
.p7-ph{display:flex;gap:8px}
.p7-ph .p7-cc{width:120px;flex:none}
.p7-ph>input{flex:1;min-width:0;height:48px;border:1px solid var(--line-2);border-radius:8px;padding:0 14px;font:400 15px/20px var(--f);background:var(--bg);color:var(--ink)}
.p7-btg{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.p7-bt{position:relative;min-height:104px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px;border:1px solid var(--line);border-radius:12px;text-align:right;font:500 15px/20px var(--f);color:var(--ink)}
.p7-bt svg.i{width:24px;height:24px}
.p7-bt[aria-pressed="true"]{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.p7-bt em{position:absolute;top:8px;left:8px;font:500 12px/16px var(--f);font-style:normal;color:var(--on-ink);background:var(--brand);border-radius:999px;padding:2px 8px}
.p7-ohe{display:flex;flex-direction:column;gap:8px}
.p7-oh-d{display:flex;align-items:center;justify-content:space-between;min-height:40px}
.p7-oh-d .p3-ck b{font-weight:500}
.p7-closed{font:500 12px/16px var(--f);font-style:normal;color:var(--ink-2);background:var(--bg-2);border-radius:999px;padding:3px 10px}
.p7-oh-r{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.p7-oh-r[hidden]{display:none}
.p7-oh-r .p7-t{flex:1;margin:0}
.p7-oh-r>span{color:var(--ink-2)}
.p7-emo{display:flex;gap:8px}
.p7-emb{width:48px;height:48px;flex:none;border:1px solid var(--line-2);border-radius:8px;display:grid;place-items:center;font-size:22px;color:var(--ink-2)}
.p7-emb svg.i{width:20px;height:20px}
.p7-emo input,.p7-stin input{flex:1;min-width:0;height:48px;border:1px solid var(--line-2);border-radius:8px;padding:0 14px;font:400 15px/20px var(--f);background:var(--bg);color:var(--ink)}
.p7-stin{display:flex;gap:8px}
.p7-sti{width:48px;height:48px;flex:none;border:1px solid var(--line-2);border-radius:8px;display:grid;place-items:center}
.p7-sti svg.i{width:22px;height:22px}
.p7-cols{display:grid;grid-template-columns:repeat(8,32px);gap:12px 10px;justify-content:start}
.p7-cols button{width:32px;height:32px;border-radius:50%;background:var(--c)}
.p7-cols button[aria-checked="true"]{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--c)}
.p7-stn .mdl{position:relative}
.p7-icp{position:absolute;inset:auto 0 0 0;max-height:78%;background:var(--bg);border-radius:16px 16px 0 0;box-shadow:var(--sh-pop);display:flex;flex-direction:column;z-index:5}
.p7-icp[hidden]{display:none}
.p7-icp-h{display:flex;justify-content:flex-start;padding:8px 8px 0}
.p7-icp-h .p3-x{margin:0}
.p7-icg{display:grid;grid-template-columns:repeat(5,1fr);gap:4px 0;padding:8px 16px 24px;overflow:auto}
.p7-icg button{height:44px;display:grid;place-items:center;border-radius:50%}
.p7-icg button svg.i{width:22px;height:22px}
.p7-icg button[aria-pressed="true"]{box-shadow:inset 0 0 0 1.5px var(--brand);color:var(--brand)}
.p7-info{display:flex;gap:10px;align-items:flex-start;padding:16px;border-radius:12px;background:var(--bg-2);font-size:16px;line-height:22px}
.p7-info svg.i{width:20px;height:20px;flex:none;margin-top:1px}
.p7-tgr{display:flex;align-items:center;gap:16px}
.p7-tgr span{flex:1;display:flex;flex-direction:column;gap:2px}
.p7-tgr b{font-weight:600}.p7-tgr small{color:var(--ink-2);font-size:13px;line-height:18px}
.p7-in{padding-right:32px}
.p7-pct{display:flex}
.p7-tips{display:flex;flex-direction:column;gap:12px}
.p7-tipr{display:flex;align-items:center;gap:8px}
.p7-tipr .p7-pct{flex:1}
.p7-tipadd{align-self:flex-start}
.p7-hr{border:0;border-top:1px solid var(--line);margin:0}

@container (max-width:600px){
  /* settings hub + category lists, b-settings@1x / b-settings-scheduling-1 (font 1.0) */
  .p2-stp .p2-hd{margin-bottom:27px}
  .p2-stp .p2-hd h1{font:600 24px/32px var(--f)}
  .p2-stp .p2-hd-d{font-size:15px;line-height:21px}
  .p2-stp .p2-st-ml,.p2-sm-mob .p2-st-ml{padding:8px 0}
  .p2-stp .p2-st-ml button,.p2-sm-mob .p2-st-ml button{height:48px;font:500 15px/20px var(--f);padding:0 12px 0 13px;gap:8px}
  .p2-stp .p2-st-ml button svg.i:first-child{width:22px;height:22px}
  .p2-stp .p2-st-mob .p2-h20,.p2-sm-mob .p2-h20{font:600 20px/28px var(--f);margin:48px 0 20px}
  .p2-sm-mob h1{margin-bottom:35px}
  .p2-smp:not(.p2-smsub) .p2-sm-mob{padding:8px 19px 32px}
  /* my settings pages */
  .p7-notitle .p2-sm-hd{display:none}
  .p7-locp .p2-sm-hd{margin-bottom:24px}
  .p7-locp .p2-sm-hd .p2-mute{font-size:17px;line-height:24px}
  .p7-ll.ext{margin-top:-8px}
  .p2-smsub .p7-loc{background:var(--p2-card);box-shadow:var(--inset);border-radius:12px;margin:0 0 24px}
  .p2-smsub .p7-loc .p2-loc-t{padding:16px}
  .p2-smsub.p7-locp{background:var(--bg-2)}
  .p2-smsub .p7-c1,.p2-smsub .p7-c2,.p2-smsub .p7-oh{background:var(--p2-card);box-shadow:var(--inset);border-radius:16px;padding:24px;margin-bottom:16px}
  .p2-smsub:has(.p7-c1),.p2-smsub:has(.p7-c2),.p2-smsub:has(.p7-oh),.p2-smsub:has(.p7-loc){background:var(--bg-2)}
  .p2-smsub .p7-oh .p2-sc-h,.p2-smsub .p7-c1 .p2-sc-h,.p2-smsub .p7-c2 .p2-sc-h{align-items:flex-start}
  .p2-smsub .p7-oh .p2-sc-h h3,.p2-smsub .p7-c1 .p2-sc-h h3,.p2-smsub .p7-c2 .p2-sc-h h3{font:600 20px/28px var(--f)}
  .p2-smsub .p7-oh .p2-sc-h .p2-mute,.p2-smsub .p7-c1 .p2-sc-h .p2-mute{font-size:15px;line-height:20px}
  .p2-smsub .p7-c1 .p2-kv dt,.p2-smsub .p7-c2 .p2-kv dt{font-size:15px}
  .p2-smsub .p7-c1 .p2-kv dd,.p2-smsub .p7-c2 .p2-kv dd{font-size:15px}
  .p7-wsd{margin:0 0 -16px}
  .p2-smsub .p7-wsc{border-radius:0 0 16px 16px}
  .p7-ohl li b{flex:none;width:96px}
  .p7-ohl li span{flex:1;text-align:left}
  .p7-ohl{gap:20px}
  .p7-btg{grid-template-columns:repeat(2,1fr)}
  .p7-bts .p3-sh-h h2{font-size:28px;line-height:36px}
  .p7-cols{grid-template-columns:repeat(8,1fr);gap:12px 4px}
  .p7-cols button{justify-self:center}
}

.p7-sh.full .p3-sh-b{flex:1}
@container (max-width:600px){.ov.p7-sh.full .mdl{display:flex;flex-direction:column}.ov.p7-sh.full .p3-sh-b{flex:1 1 auto;min-height:0}}
/* @1x size pass (b-*@1x captures) */
.p7-dc h3{font:600 20px/26px var(--f)}
@container (max-width:600px){
  .p7-locp .p2-sm-hd{flex-direction:row;align-items:flex-start;justify-content:space-between}
  .p7-locp .p2-sm-hd>div:first-child{flex:1}
  .p7-locp .p2-sm-acts{display:flex}
  .p7-ohl{gap:27px}
  .p2-smsub .p2-box .p2-kv{gap:20px}
  .p2-smsub .p2-box .p2-kv dt,.p2-smsub .p2-box .p2-kv dd{line-height:18px}
  .p2-smsub .p2-box .p2-sc-h{margin-bottom:24px}
  .p7-rsall .p7-rhd h1{font:600 24px/32px var(--f);justify-content:flex-start;align-items:center}
  .p7-rsall .p7-rhd h1 .p2-cnt{margin-top:0}
  .p7-bt{font-size:14px;line-height:18px}
}
.p7-dis{background:var(--bg-2);color:var(--ink-3);cursor:default}

/* == panel B review 1405-07-24: editable lists, validation, confirm sheets == */
.p7-err input,.p7-err textarea,.p7-err select,.p7-err .p7-emo,.p7-err .p2-f-pre{border-color:var(--bad)!important;box-shadow:0 0 0 1px var(--bad)}
.p7-ro{display:inline-flex;gap:4px;margin-inline-start:auto}
.p7-cf{margin:0;font-size:15px;line-height:22px;color:var(--ink-2)}
.p-btn.p7-bad{background:var(--bad);border-color:var(--bad);color:#fff}
.p7-hint{margin:4px 0 0;font-size:13px;line-height:18px;color:var(--ink-2)}
.p7-info-t{margin:12px 0 0;font-size:14px;line-height:20px;white-space:pre-line}
.p7-g2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.p7-ltr input{direction:ltr;text-align:right}
.p7-ohday{display:flex;flex-direction:column}
.p7-tadv.dis{opacity:.55}
@container (max-width:600px){.p7-g2{grid-template-columns:1fr;gap:0}}
.p7-chip .p7-fn{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--ink);color:var(--on-ink);font:600 12px/1 var(--f);font-style:normal}
.p7-rr[hidden]{display:none}
/* business details edit (panel2's single-column p2-fm-one keeps its desktop padding on the phone): phone form layout */
@container (max-width:600px){.p2-fm-one .p2-fm-in{max-width:none;padding:0 20px 120px}.p2-fm-one .p2-fm-main{max-width:none;gap:24px}.p2-fm-one .p2-fm-s.card{padding:0;border:0;box-shadow:none;background:none}}
.p7-errt{display:block;margin-top:6px;color:var(--bad);font-size:13px;line-height:18px}

/* ======================= restyle v3 (business) — panel7 finish: reports + settings part 1 (form only) ======================= */
.p7-selb,.p7-emb,.p7-sti,.p7-ph>input,.p7-emo input,.p7-stin input{border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.p7-selb{height:44px}
.p7-selb:hover{border-color:var(--ink-3)}
.p7-selb:focus-visible{border-color:var(--brand);box-shadow:var(--ring)}
/* report dashboard cards: KPI figure */
.p7-dc{border-radius:var(--r-card);padding:20px 18px;box-shadow:var(--sh-1)}
.p7-dc h3{font-weight:650}
.p7-dc-big{font-size:clamp(24px,1rem + .9vw,32px);font-weight:650;line-height:1.2}
.p7-ll,.p7-info,.p7-wsd,.p7-icp{border-radius:var(--r-card)}
.p7-ll{padding:6px;box-shadow:var(--inset),var(--sh-1)}
.p7-ll button{height:44px;padding:0 14px;border-radius:var(--r-ctl);transition:background-color var(--d-2)}
.p7-ll button:hover{background:var(--hover-tint)}
.p7-bt{border-radius:var(--r-md);transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease),border-color var(--d-2)}
@media (hover:hover){.p7-bt:hover{transform:translateY(var(--lift));box-shadow:var(--sh-2)}}
@container (max-width:600px){.p7-ll{box-shadow:var(--inset)}}
/* ======================= end restyle v3 (business) — panel7 ======================= */

/* ======================= restyle v3 palette (business) — Accord LIGHT colours (panel7) ======================= */
:root{--p7-st-blue:#0f9db0;--p7-st-amber:#e0832a; --p7-fill:var(--night)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p7-fill:var(--brand)}}
:root[data-theme="dark"]{--p7-fill:var(--brand)}
.p7-cal-g button.end::before{background:var(--p7-fill)}
.p7-bt em{background:var(--p7-fill)}
.p7-leg li::before{background:var(--p-ch1)}
/* ======================= end restyle v3 palette (business) panel7 ======================= */


/* panel8 — area styles (team, settings part 2: team / clients / billing / forms). Prefix p8-. Tokens only.
   Phone sizes from capture/phone/b-settings-*@1.0 (1 dp ≈ 0.95 px in our 390 px frame). */

/* ---------- shared bits ---------- */
.p8-mute{color:var(--ink-2);font-size:14px;line-height:20px;margin:0}
.p8-tag{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;border:1px solid var(--line-2);background:var(--bg);color:var(--ink-2);font:500 12px/16px var(--f);font-style:normal;margin-right:8px;vertical-align:middle;white-space:nowrap}
.p8-tag.on{background:var(--p2-ok-chip);border-color:transparent;color:var(--ok)}
.p8-tag.brand{background:var(--brand-soft);border-color:transparent;color:var(--brand)}
.p8-hr{border:0;border-top:1px solid var(--line);margin:4px 0}
.p8-h3{font:600 15px/20px var(--f);margin:8px 0 0}
.p8-warn{color:var(--p2-orange)}
.p8-pills{display:flex;flex-wrap:wrap;gap:8px}
.p8-g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.p8-addb svg.i{display:none}
@container (max-width:600px){.p8-addb svg.i{display:block}}
.p8-ini{display:grid;place-items:center;width:100%;height:100%;font:600 11px/1 var(--f);color:var(--brand)}
.p8-full .tg,.p8-add .tg{width:44px;height:24px;border-radius:999px;background:var(--line-2);position:relative;flex:none;transition:background .15s}
.p8-full .tg i,.p8-add .tg i{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:left .15s}
.p8-full .tg[aria-checked="true"],.p8-add .tg[aria-checked="true"]{background:var(--brand)}
.p8-full .tg[aria-checked="true"] i,.p8-add .tg[aria-checked="true"] i{left:22px}

/* checkbox rows (permission lists, edit forms) */
.p8-ck{padding:8px 0;font-size:14px;line-height:20px;gap:12px}
.p8-ck>i{width:22px;height:22px;border-radius:4px}
.p8-ck.ind{padding-right:34px}
.p8-ck.dis{cursor:default}
.p8-ck.dis b{color:var(--ink-3)}
.p8-ck.dis small{color:var(--ink-3)}
.p8-ck.dis>input:checked+i{background:var(--bg-3);border-color:var(--line)}
.p8-ck.dis>input:checked+i::after{border-color:var(--ink-3)}
.p8-ck.dis>input:not(:checked)+i{background:var(--bg-3);border-color:var(--line)}
.p8-ck small{font-size:12px;line-height:16px}
.p8-ck a{color:var(--brand)}

/* select-looking field that opens a picker */
.p8-fsel{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;height:48px;border:1px solid var(--line-2);border-radius:8px;background:var(--bg);color:var(--ink);padding:0 16px;font:400 15px/20px var(--f);text-align:right}
.p8-fsel:focus-visible{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand);outline:0}
.p8-fsel svg.i{width:20px;height:20px;flex:none}

/* sections inside full pages / the team form */
.p8-sec{display:flex;flex-direction:column;gap:16px}
.p8-sec-h{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.p8-sec-h h2{font:600 20px/28px var(--f);margin:0}
.p8-sec-d{font-size:15px;line-height:22px;color:var(--ink-2);margin:-8px 0 0}
.p8-info{display:flex;gap:12px;padding:16px;border-radius:12px;background:var(--brand-soft);color:var(--ink)}
.p8-info svg.i{width:20px;height:20px;flex:none;color:var(--brand);margin-top:2px}
.p8-info b{display:block;font:600 16px/22px var(--f);margin-bottom:4px}
.p8-info p{margin:0;font-size:14px;line-height:20px;color:var(--ink-2)}
.p8-ed .p8-info{background:var(--bg);border:1px solid var(--line);color:var(--ink)}
.p8-ed .p8-info svg.i{color:var(--ink)}

/* ---------- full-screen pages (editors, edit forms) ---------- */
.p8-full{display:flex;flex-direction:column;min-height:100%}
.p8-ft{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:8px;min-height:72px;padding:12px 24px;background:var(--bg)}
.p8-ft-t{flex:1;min-width:0;font:600 17px/24px var(--f);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;visibility:hidden}
.p8-ft-a{display:flex;gap:8px}
.p8-ft .p3-x{margin:0}
.p8-ft .p8-x{display:none}
.p8-ft .p8-x.all{display:grid}
.p8-bk svg.i{width:24px;height:24px}
.p8-full .p3-full-in{width:100%;flex:1}
.p8-full .p3-full-in h1{font:600 28px/36px var(--f)}
.p8-full .p3-full-d{margin:-12px 0 8px;font-size:15px;line-height:22px}
.p8-fbar{display:none}
.p8-prog{display:flex;gap:4px;padding:0 24px}
.p8-prog i{flex:1;height:4px;border-radius:2px;background:var(--line)}
.p8-prog i.on{background:var(--brand)}
.p8-crumb{display:flex;align-items:center;gap:8px;font-size:13px;line-height:18px;color:var(--ink-3);margin-top:16px}
.p8-crumb svg.i{width:14px;height:14px;transform:scaleX(-1)}
.p8-crumb [aria-current]{color:var(--ink);font-weight:500}
@container (max-width:600px){
  .p8-full{position:fixed;inset:0;z-index:60;overflow-y:auto;min-height:0;background:var(--bg)}
  .p8-ft{min-height:56px;padding:4px 8px 4px 8px}
  .p8-ft-t{opacity:0;transition:opacity .15s}
  .p8-full.sc .p8-ft-t{opacity:1}
  .p8-full.sc .p8-ft{border-bottom:1px solid var(--line)}
  .p8-ft-a{display:none}
  .p8-ft .p8-x{display:grid;margin-right:auto}
  .p8-ft-t{font-size:20px;line-height:28px;visibility:visible}
  .p8-full .p3-full-in{padding:8px 19px 24px;gap:20px}
  .p8-full .p3-full-in h1{font:600 24px/32px var(--f)}
  .p8-full .p3-full-d{font-size:14px;line-height:20px}
  .p8-fbar{display:flex;gap:8px;position:sticky;bottom:0;z-index:5;padding:12px 19px 16px;background:var(--bg);border-top:1px solid var(--line)}
  .p8-fbar .p-btn{flex:1;height:48px}
  .p8-prog{padding:0 0 0}
  .p8-prog i{height:3px;border-radius:0}
  .p8-wiz .p8-prog{order:-1}
}

/* ---------- permission editor ---------- */
.p8-psrch{width:100%;height:44px;padding:0 16px 0 0}
.p8-psrch svg.i{width:20px;height:20px}
.p8-areas{border:1px solid var(--line);border-radius:12px;padding:8px 0;background:var(--bg)}
.p8-area{display:flex;align-items:center;gap:14px;width:100%;min-height:60px;padding:8px 20px;text-align:right}
.p8-area:hover{background:var(--bg-2)}
.p8-area>svg.i:first-child{width:22px;height:22px;flex:none}
.p8-area>span{flex:1;display:flex;flex-direction:column}
.p8-area b{font:500 16px/22px var(--f)}
.p8-area small{font-size:12px;line-height:16px;color:var(--ink-2)}
.p8-area>svg.i:last-child{width:20px;height:20px;flex:none}
.p8-dot{width:7px;height:7px;border-radius:50%;background:var(--ink-3);margin-left:10px}
.p8-dot.on{background:var(--ok)}
.p8-pa{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.p8-pa-h{display:flex;align-items:center;justify-content:space-between;gap:16px}
.p8-pa-h h2{font:600 22px/28px var(--f);margin:0;display:flex;align-items:center}
.p8-pa .p8-sec-d{font-size:16px;line-height:23px;margin:-4px 0 4px}
.p8-pa .p8-sec-d .p2-a{display:inline-block;margin-top:8px}
.p8-pg h3{font:600 15px/20px var(--f);margin:16px 0 4px}
.p8-ins{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px;border-radius:12px;background:var(--bg-2);margin-top:20px}
.p8-ins p{margin:0;font-size:14px;line-height:20px;max-width:160px}
.p8-ins .p2-btn svg.i{width:18px;height:18px}

/* wizard */
.p8-wiz .p2-f-l em{font-size:13px}
.p8-mem .p8-ck{align-items:center}

/* ---------- team members: filters sheet / time off ---------- */
.p8-filt .p3-sh-b{gap:0}
.p3-sh.full.p8-filt .p3-sh-b,.p3-sh.full.p8-ns .p3-sh-b,.p3-sh.full.p8-secs .p3-sh-b,.p3-sh.full.p8-to .p3-sh-b{flex:1}
.p8-exp .p3-exp-h{min-height:52px;font-size:16px}
.p8-exp .p3-exp-h>svg.i:first-child{width:20px;height:20px}
.p8-pl{display:flex;flex-direction:column}
.p8-pl button{display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:0 32px 0 0;font:400 16px/22px var(--f);text-align:right;color:var(--ink)}
.p8-pl button svg.i{width:20px;height:20px}
.p8-cks{padding-right:32px}
.p8-ckloc{align-items:center}
.p8-loc-ic{width:32px;height:32px;border-radius:8px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.p8-loc-ic svg.i{width:18px;height:18px}
.p8-filt .p3-cks:not(.p8-cks){padding-right:32px}
.p8-to .p3-sh-b{gap:16px}
.p8-to-f{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.p8-to-f p{margin:6px 0 0;font-size:16px;line-height:22px}
.p8-ns .p3-sh-b{min-height:200px}

/* ---------- add / edit team member ---------- */
.p8-col{display:flex;flex-wrap:wrap;gap:12px 16px}
.p8-col label{position:relative;display:block;width:28px;height:28px;cursor:pointer}
.p8-col input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.p8-col i{display:block;width:28px;height:28px;border-radius:50%}
.p8-col input:checked+i{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--brand)}
.p8-col input:focus-visible+i{outline:2px solid var(--brand);outline-offset:4px}
.p8-din{position:relative;display:block}
.p8-din svg.i{position:absolute;left:14px;top:50%;width:18px;height:18px;transform:translateY(-50%);color:var(--ink-2);pointer-events:none}
.p8-birth .p2-f-b .p3-f{gap:0}
.p8-birth .p3-sel{padding:0 12px 0 36px}
.p8-birth .p3-selw>svg.i{left:10px}
.p8-avm{overflow:visible}
.p8-avm img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.p8-svc{display:flex;flex-direction:column;margin-top:16px}
.p8-svh{padding:16px 0 8px}
.p8-svh b{font:600 16px/22px var(--f)!important;display:flex;align-items:center;gap:8px}
.p8-svr{align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.p8-svr>span{flex:1}
.p8-svr b{font-size:16px;line-height:22px}
.p8-svr small{font-size:14px;line-height:20px}
.p8-svr em{font-style:normal;font-size:16px;line-height:22px}
.p8-add .p2-srch{width:100%;height:44px;border-radius:8px}
.p8-loc{display:flex;align-items:flex-start;gap:16px}
.p8-loc .p8-loc-ic{width:44px;height:44px;border-radius:8px}
.p8-loc .p8-loc-ic svg.i{width:22px;height:22px}
.p8-loc b{font:600 16px/22px var(--f)}
.p8-loc p{margin:2px 0 6px;color:var(--ink-2)}
.p8-loc .p8-tag{margin:0}
.p8-adv{margin-top:-4px}
.p8-adv .p3-exp{border:0}
.p8-adv .p3-exp-h{min-height:40px;gap:4px;font-size:15px;justify-content:flex-start}
.p8-adv .p3-exp-h>span{flex:none}
.p8-adv .p3-exp-h>svg.i{width:16px;height:16px}
.p8-rdesc{margin-top:-8px}
.p8-pm{display:flex;align-items:center;gap:16px;padding:16px;border:1px solid var(--line);border-radius:12px}
.p8-pm>div{flex:1;display:flex;flex-direction:column}
.p8-pm b{font:500 16px/22px var(--f)}
.p8-pm small{color:var(--ink-2);font-size:14px;line-height:20px}
.p8-pm-ic{width:44px;height:44px;border-radius:8px;border:1px solid var(--line);display:grid;place-items:center;flex:none}
.p8-pm-ic svg.i{width:22px;height:22px}
.p8-pmr{display:flex;align-items:center;gap:12px;cursor:pointer}
.p8-pmr input{position:absolute;opacity:0}
.p8-pmr>i{width:20px;height:20px;border-radius:50%;border:1.5px solid var(--line-2);flex:none}
.p8-pmr input:checked+i{border:6px solid var(--brand)}
.p8-pmr>span:last-child{display:flex;flex-direction:column}
.p8-pmr b{font-weight:500}
.p8-pmr small{color:var(--ink-2);font-size:14px}
.p8-cm{display:flex;flex-direction:column;gap:24px;background:var(--bg-2);border-radius:16px;padding:32px}
.p8-cm-t{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.p8-cm h2{font:700 32px/38px var(--f);margin:0}
.p8-cm p{margin:0;font-size:16px;line-height:24px}
.p8-cm ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.p8-cm li{display:flex;gap:10px;font-size:15px;line-height:22px}
.p8-cm li svg.i{width:18px;height:18px;flex:none;margin-top:2px}
.p8-cm-art{position:relative;height:220px;overflow:hidden;border-radius:12px;background:linear-gradient(160deg,var(--bg-2),var(--brand-soft))}
.p8-ph{position:absolute;bottom:-20px;width:150px;height:220px;border-radius:22px;border:5px solid var(--ink);background:var(--bg);padding:14px 10px;display:flex;flex-direction:column;gap:8px;font-size:9px}
.p8-ph.a{right:20%}
.p8-ph.b{right:calc(20% + 130px);align-items:center;text-align:center;top:24px}
.p8-ph b{font-size:10px}
.p8-ph small{font-size:8px;color:var(--ink-2)}
.p8-ph .s{height:12px;border-radius:6px;background:var(--bg-2)}
.p8-ph-r{display:flex;align-items:center;gap:6px;width:100%;justify-content:space-between}
.p8-ph-r em{font-style:normal;color:var(--ok);font-size:8px}
.p8-av{width:20px;height:20px;border-radius:50%;overflow:hidden;flex:none}
.p8-av.l{width:44px;height:44px}
.p8-av img{width:100%;height:100%;object-fit:cover}
@container (max-width:600px){
  .p8-tabs{position:sticky;top:0;z-index:4;background:var(--bg);padding-top:4px;padding-bottom:8px}
  .p8-add .p2-fm-s h2,.p8-add .p8-sec-h h2{font:600 22px/28px var(--f)}
  .p8-cm{padding:20px;margin:0 -4px}
  .p8-cm h2{font-size:32px;line-height:40px}
  .p8-cm-art{height:200px}
  .p8-ph.a{right:8%}.p8-ph.b{right:calc(8% + 120px)}
}

/* ---------- settings: pay period schedule, tip, tags art ---------- */
.p8-sched{background:var(--bg-2);border-radius:12px;padding:20px}
.p8-sched>b{font:600 15px/20px var(--f)}
.p8-sched ol{list-style:none;margin:12px 0 0;padding:0 16px 0 0;border-right:1px solid var(--line-2);display:flex;flex-direction:column;gap:16px}
.p8-sched li{position:relative;display:flex;flex-direction:column;gap:2px;font-size:14px;line-height:20px}
.p8-sched li::before{content:'';position:absolute;right:-20px;top:7px;width:7px;height:7px;border-radius:50%;background:var(--line-2)}
.p8-sched li b{font-weight:600}
.p8-ed .p3-full-in{max-width:640px}
.p8-tip{position:relative;display:flex;gap:12px;align-items:flex-start;margin:16px 0 0;padding:16px;border-radius:12px;background:var(--brand);color:var(--on-ink);font:600 15px/22px var(--f)}
.p8-tip::after{content:'';position:absolute;bottom:-7px;right:40px;width:14px;height:14px;background:var(--brand);transform:rotate(45deg)}
.p8-tip p{margin:0;flex:1}
.p8-tip button{color:var(--on-ink);flex:none}
.p8-tip button svg.i{width:20px;height:20px}
.p8-tags .p8-tagart{position:relative;display:flex;align-items:flex-end;justify-content:center;gap:16px;height:96px;margin-bottom:16px}
.p8-tagart span{position:relative;display:block;width:56px;height:56px;border-radius:50%;overflow:visible}
.p8-tagart span.b{width:80px;height:80px}
.p8-tagart img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.p8-tagart em{position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);background:var(--bg);border-radius:999px;padding:1px 6px;font:500 10px/14px var(--f);font-style:normal;box-shadow:var(--sh-small);white-space:nowrap}

/* ---------- billing ---------- */
.p8-bnav a>svg.i:first-child{display:block;width:20px;height:20px;flex:none}
.p8-bnav a{justify-content:flex-start}
.p8-bnav a span{flex:1}
.p8-bmob .p2-st-ml button svg.i:first-child{width:22px;height:22px}
.p8-bmob-d{margin:-8px 0 16px}
.p8-bempty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:64px 24px;gap:8px}
.p8-bempty b{font:600 17px/24px var(--f)}
.p8-bempty p{margin:0;color:var(--ink-2);font-size:14px;line-height:20px;max-width:360px}
.p8-disc{display:flex;flex-direction:column;gap:24px;padding:28px 24px;border-radius:12px;background:var(--bg-2);margin-top:8px}
.p8-disc b{font:600 20px/28px var(--f)}
.p8-disc a{display:inline-flex;align-items:center;gap:8px;font:500 15px/20px var(--f)}
.p8-disc a svg.i{width:18px;height:18px}
.p8-bh{font:600 15px/20px var(--f);margin:24px 0 8px}
.p8-sub{display:flex;align-items:center;gap:14px;padding:16px 0}
.p8-sub>div{flex:1;display:flex;flex-direction:column}
.p8-sub b{font:600 15px/20px var(--f)}
.p8-sub small{color:var(--ink-2);font-size:14px;line-height:20px}
.p8-sub-ic{width:48px;height:48px;border-radius:8px;display:grid;place-items:center;flex:none;color:var(--on-ink);background:linear-gradient(135deg,var(--brand),#c026d3)}
.p8-sub-ic.b{background:linear-gradient(135deg,#3b82f6,#2d76ec)}
.p8-sub-ic svg.i{width:24px;height:24px}

/* ---------- forms ---------- */
.p8-eb{margin:8px 0 -12px;font-size:13px;line-height:18px;color:var(--ink-2)}
.p8-fb .p3-full-d{margin-top:-14px}
.p8-fb-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:170px;border:1px solid var(--line);border-radius:12px;padding:24px;width:100%}
.p8-fb-add svg.i{width:28px;height:28px;color:var(--brand)}
.p8-fb-add b{font:600 17px/24px var(--f)}
.p8-fb-add small{font-size:12px;line-height:16px;color:var(--ink-2)}
.p8-bad{background:var(--bad);border-color:var(--bad);color:#fff}
.p8-exit .p3-sh-b{display:none}
.p8-secs .p3-sh-b{gap:8px}
.p8-secg{display:flex;gap:12px;margin-bottom:8px}
.p8-secc{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:126px;height:62px;border:1px solid var(--line);border-radius:8px;cursor:pointer;font:500 11px/14px var(--f);box-shadow:var(--sh-small)}
.p8-secc input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.p8-secc svg.i{width:20px;height:20px;color:var(--brand)}
.p8-secc:has(input:checked){border:2px solid var(--brand)}
.p8-secc:nth-child(1) svg.i{color:var(--brand)}
.p8-secs .p8-secg:last-of-type svg.i{color:var(--p2-orange)}
@container (max-width:600px){
  .p2-cc-b{flex-wrap:wrap;gap:6px}
  .p2-cc-b .p2-btn{height:32px;padding:0 10px;font-size:13px;line-height:18px;gap:6px}
  .p2-cc-b .p2-btn svg.i{width:16px;height:16px}
}
.p8-phf .p3-f{gap:0}
.p8-phf .p3-sel{padding:0 12px 0 32px;direction:ltr;text-align:left}
.p8-phf .p3-selw>svg.i{left:8px}
.p8-pin{display:flex;flex-direction:column;gap:4px;padding:24px;border-radius:12px;background:var(--p2-card);box-shadow:var(--inset)}
.p8-pin b{font:600 16px/22px var(--f);display:flex;align-items:center}
@container (max-width:600px){.p8-pin{padding:8px 0;box-shadow:none;background:none}}
.p8-sec.sub .p8-sec-h h2{font:600 17px/24px var(--f)}
.p8-sec.sub .p8-sec-d{font-size:14px;line-height:20px}
@container (max-width:600px){
  .p8-add .p8-sec-h h2,.p8-add .p2-fm-s h2{font:600 20px/28px var(--f)}
  .p8-add .p8-sec.sub .p8-sec-h h2{font:600 17px/24px var(--f)}
  .p2-tm-m .p2-av.s72{width:60px;height:60px}
}
@container (max-width:600px){.p2-sh-mob .p2-sh-mr .p2-av.s64{width:48px;height:48px}}
.p-pop .it[data-go="set-team-permission-new"]{color:var(--brand)}

/* == panel B review 1405-07-24: working team list, shifts, timesheets, pay runs, billing, form builder == */
.p8-ini.l{font-size:20px}
.p2-av.s32 .p8-ini.l,.p2-av.s40 .p8-ini.l{font-size:13px}
.p8-cb{position:relative;display:inline-grid;place-items:center;width:20px;height:20px;cursor:pointer}
.p8-cb input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.p8-cb i{width:20px;height:20px;border-radius:4px;border:1px solid var(--line-2);background:var(--bg)}
.p8-cb input:checked+i{background:var(--brand);border-color:var(--brand);box-shadow:inset 0 0 0 4px var(--brand),inset 0 0 0 10px var(--on-ink)}
.p8-selbar{display:flex;align-items:center;gap:8px;padding:12px 16px;margin:0 0 16px;border-radius:12px;background:var(--brand-soft);color:var(--ink)}
.p8-selbar b{font:600 15px/20px var(--f)}
.p8-fc{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--ink);color:var(--on-ink);font:600 11px/1 var(--f);font-style:normal;margin-inline-start:4px}
.p8-none{display:flex;flex-direction:column;align-items:center;gap:6px;padding:48px 16px;text-align:center;color:var(--ink-2)}
.p8-none svg.i{width:32px;height:32px;color:var(--ink-3)}
.p8-none b{color:var(--ink);font:600 17px/24px var(--f)}
.p8-none p{margin:0;font-size:14px}
.p8-lc{display:flex;align-items:center;gap:12px;padding:12px 16px;margin-bottom:12px;border:1px solid var(--line);border-radius:12px}
.p8-lc>div{flex:1;display:flex;flex-direction:column;gap:2px}
.p8-lc b{font:600 15px/20px var(--f)}
.p8-lc small{color:var(--ink-2);font-size:13px;line-height:18px}
.p8-cmr{display:flex;flex-direction:column;gap:4px}
.p8-avs{display:inline-flex;margin-inline-end:8px}
.p8-avs .p2-av{border:2px solid var(--bg);margin-inline-start:-8px}
.p8-tblw{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.p8-tbl{width:100%}
.p8-tbl td,.p8-tbl th{padding:12px 16px;text-align:right;white-space:nowrap}
.p8-wk{font:600 15px/20px var(--f)}
/* scheduled shifts: phone member rows open the week, week mode lists each day */
.p8-shm{border-bottom:1px solid var(--line);margin-bottom:8px}
.p8-shm .p2-sh-mr{width:100%;background:none;border:0;text-align:right;padding:0;cursor:pointer;color:inherit}
.p8-shm.open .p2-sh-mr>svg.i{transform:rotate(180deg)}
.p8-shd{display:flex;flex-direction:column;padding:0 0 16px}
.p8-shr{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;padding:6px 0;background:none;border:0;border-bottom:1px solid var(--line);color:inherit;text-align:right;cursor:pointer}
.p8-shr span{display:flex;align-items:center;gap:10px}
.p8-shr span small{color:var(--ink-2);font-size:13px}
.p8-shr b{font:500 15px/20px var(--f)}
.p8-shr em{font-style:normal;padding:6px 10px;border-radius:8px;background:var(--brand-soft);font-size:13px;line-height:16px}
.p8-shr em.off{background:var(--bg-3);color:var(--ink-2)}
.p8-shw{margin-bottom:20px}
.p8-shw-h{display:flex;justify-content:space-between;margin:0 0 4px;font-size:15px}
.p8-shw-h small{color:var(--ink-2)}
.p8-regs{display:flex;flex-direction:column}
.p8-reg{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:10px 0;border-bottom:1px solid var(--line)}
.p8-reg>.p3-ck{min-width:120px}
.p8-reg-t{display:flex;align-items:center;gap:8px;flex:1}
.p8-reg-t[hidden]{display:none}
.p8-reg-t .p3-f{flex:1;margin:0}
/* QR + contact page preview */
.p8-qrw{display:flex;flex-direction:column;align-items:center;gap:12px;padding:8px 0}
.p8-qr{width:220px;height:220px;border-radius:12px;border:1px solid var(--line)}
.p8-qrw p{margin:0;color:var(--ink-2);font-size:14px}
.p8-cpv-in{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.p8-cpv-in .p3-f{width:100%;text-align:right}
.p8-cpv-in h2{margin:8px 0 0;font:600 20px/28px var(--f)}
/* form builder */
.p8-fbs{border:1px solid var(--line);border-radius:12px;padding:16px;margin:0 0 16px;display:flex;flex-direction:column;gap:12px}
.p8-fbs-h{display:flex;align-items:center;justify-content:space-between}
.p8-fbs-h b{font:600 17px/24px var(--f)}
.p8-fbq{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:8px;background:var(--bg-2)}
.p8-fbq span{flex:1;display:flex;flex-direction:column}
.p8-fbq small{color:var(--ink-2);font-size:13px}
.p8-fbn{display:flex;gap:8px;justify-content:flex-start;margin-top:24px}
.p8-fps{margin-bottom:24px}
.p8-fps h3{font:600 17px/24px var(--f);margin:0 0 12px}
.p8-fq{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.p8-fq b{font:500 15px/20px var(--f)}
.p8-fq input,.p8-fq textarea{height:44px;border:1px solid var(--line-2);border-radius:8px;background:var(--bg-2)}
.p8-fq textarea{height:88px}
.p8-yn{display:flex;gap:8px}
.p8-yn span{padding:8px 16px;border:1px solid var(--line-2);border-radius:999px;font-size:14px}
.p8-secc.dis{opacity:.45;cursor:default}
@container (max-width:600px){.p8-fbn{position:sticky;bottom:0;background:var(--bg);padding:16px 0}.p8-fbn .p2-btn{flex:1}}
.p8-svr[hidden],.p8-area[hidden],.p8-ck[hidden]{display:none}

/* ======================= restyle v3 (business) — panel8 finish: team + settings part 2 (form only) ======================= */
.p8-fsel,.p8-fq input,.p8-fq textarea,.p8-fbq,.p8-secc{border-radius:var(--r-ctl);transition:border-color var(--d-2),box-shadow var(--d-2)}
.p8-fsel{height:44px}
.p8-fsel:hover{border-color:var(--ink-3)}
.p8-fsel:focus-visible,.p8-fq input:focus,.p8-fq textarea:focus{border-color:var(--brand);box-shadow:var(--ring);outline:0}
.p8-info,.p8-areas,.p8-ins,.p8-pm,.p8-cm,.p8-sched,.p8-tip,.p8-disc,.p8-fb-add,.p8-pin,.p8-selbar,.p8-lc,.p8-tblw,.p8-qr,.p8-fbs{border-radius:var(--r-card)}
.p8-areas,.p8-pm,.p8-lc,.p8-tblw,.p8-pin{box-shadow:var(--sh-1)}
.p8-tblw tbody tr{transition:background-color var(--d-1)}
.p8-tblw tbody tr:hover{background:var(--p-row-h)}
.p8-loc-ic,.p8-pm-ic,.p8-sub-ic{border-radius:var(--r-ctl)}
@container (max-width:600px){.p8-areas,.p8-pm,.p8-lc,.p8-tblw,.p8-pin{box-shadow:none}}
/* ======================= end restyle v3 (business) — panel8 ======================= */

/* ======================= restyle v3 palette (business) — Accord LIGHT colours (panel8) ======================= */
:root{--p8-fill:var(--night); --p8-sub:linear-gradient(135deg,#0b7658,#0b6f7c); --p8-sub-b:linear-gradient(135deg,#0f9db0,#0b6f7c)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p8-fill:var(--brand); --p8-sub:linear-gradient(135deg,var(--brand),#c026d3); --p8-sub-b:linear-gradient(135deg,#3b82f6,#2d76ec)}}
:root[data-theme="dark"]{--p8-fill:var(--brand); --p8-sub:linear-gradient(135deg,var(--brand),#c026d3); --p8-sub-b:linear-gradient(135deg,#3b82f6,#2d76ec)}
.p8-tip,.p8-tip::after{background:var(--p8-fill)}
.p8-sub-ic{background:var(--p8-sub)}
.p8-sub-ic.b{background:var(--p8-sub-b)}
/* ======================= end restyle v3 palette (business) panel8 ======================= */


/* panel9 — app chrome + personal / side areas (More, search, insights, earn, news, help, guides, avatar area,
   account settings, notifications, Connect, continue setup). Prefix p9-. Sizes from capture/phone b-*@1x (dp≈px)
   and capture/out p-more2-m.json (mobile web, exact px). */
:root{
  --p9-g1:#2d6cf6; --p9-g1b:#5a8dff; --p9-g2:#3fb93a; --p9-g2b:#b4e33d; --p9-g3:#d63ce0; --p9-g3b:#f06bd4;
  --p9-cn1:#6950f3; --p9-cn2:#3b5bdb; --p9-tm1:#0f9d6b; --p9-tm2:#7fd24a; --p9-earn:#0f6f78; --p9-on:#e6f8e3; --p9-on-ink:#1f8900;
  --p9-red:#d4163a; --p9-reqbg:#d4163a; --p9-navy:#1a1638; --p9-inv1:#0a3c66; --p9-inv2:#0d6e8c; --p9-goo:#4285f4; --p9-cn3:#59c3c3; --p9-help:#6950f3; --p9-help2:#5b8def;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --p9-g1:#2457c9; --p9-g1b:#3b6ee0; --p9-g2:#2f8f2b; --p9-g2b:#7fae2c; --p9-g3:#a82db0; --p9-g3b:#c4519f;
  --p9-cn1:#5240c4; --p9-cn2:#2e48ad; --p9-tm1:#0b7a53; --p9-tm2:#5d9c36; --p9-earn:#0b545b; --p9-on:#183214; --p9-on-ink:#5cc04a;
  --p9-red:#e0284a; --p9-reqbg:#b81232; --p9-navy:#141129; --p9-inv1:#082f50; --p9-inv2:#0b5a72; --p9-goo:#5a95f5; --p9-cn3:#3f9d9d; --p9-help:#5a43d6; --p9-help2:#4a74c9;
}}
:root[data-theme="dark"]{
  --p9-g1:#2457c9; --p9-g1b:#3b6ee0; --p9-g2:#2f8f2b; --p9-g2b:#7fae2c; --p9-g3:#a82db0; --p9-g3b:#c4519f;
  --p9-cn1:#5240c4; --p9-cn2:#2e48ad; --p9-tm1:#0b7a53; --p9-tm2:#5d9c36; --p9-earn:#0b545b; --p9-on:#183214; --p9-on-ink:#5cc04a;
  --p9-red:#e0284a; --p9-reqbg:#b81232; --p9-navy:#141129; --p9-inv1:#082f50; --p9-inv2:#0b5a72; --p9-goo:#5a95f5; --p9-cn3:#3f9d9d; --p9-help:#5a43d6; --p9-help2:#4a74c9;
}

/* ---------------- full-screen page frame ---------------- */
.p9-fs{max-width:760px;margin:0 auto;padding:16px 32px 48px;color:var(--ink)}
.p9-tb{display:flex;align-items:center;gap:8px;min-height:48px;margin:0 -12px 8px}
.p9-tb .sp{flex:1}
.p9-tb-t{flex:1;font-size:20px;font-weight:600;line-height:28px;opacity:0;transition:opacity .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p9-fs.sc .p9-tb-t{opacity:1}
.p9-tb-t:empty{display:none}
.p9-tbb{width:48px;height:48px;border-radius:8px;display:grid;place-items:center;color:var(--ink);flex:none;background:none}
.p9-tbb:hover{background:var(--bg-3)}
.p9-tbb svg.i{width:24px;height:24px}
.p9-tbb.s{width:36px;height:36px}
.p9-tbb.p-btn{border:0;padding:0;width:48px;height:48px}
.p9-fs-f{display:flex;gap:8px;justify-content:flex-end;padding-top:24px}
.p9-mute{font-size:15px;line-height:21px;color:var(--ink-2);margin:0}
.p9-mute.s{margin-top:16px}
.p9-h1{font-size:28px;font-weight:600;line-height:36px;margin:0 0 4px}
.p9-h2{font-size:20px;font-weight:600;line-height:28px;margin:0}
.p9-h2.t{margin-top:32px}
.p9-h3{font-size:17px;font-weight:600;line-height:24px;margin:24px 0 8px}
.p9-lbl{font-size:15px;font-weight:600;margin:32px 0 12px}
.p9-hr{border:0;border-top:1px solid var(--line);margin:32px 0}
.p9-card{background:var(--p-card);border:1px solid var(--line);border-radius:12px}
.p9-dk{display:flex}
.p9-mb{display:none!important}
.p9-red.p-btn{background:var(--p9-red);border-color:var(--p9-red);color:#fff}

/* ---------------- More tab ---------------- */
.p9-mt{gap:0!important;height:60px!important;padding:0 8px 0 20px!important}
.p9-mt .sp{flex:1}
.p9-mt .p-tb{width:48px;height:48px;border-radius:8px}
.p9-mt .p-tb svg.i{width:24px;height:24px}
.p9-mt .p-av.s{margin-right:12px}
.p9-more{max-width:720px;margin:0 auto;padding:24px 20px 24px}
.p9-tiles{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px}
.p9-tile{display:flex;flex-direction:column;align-items:flex-start;gap:8px;height:88px;padding:16px;border-radius:12px;background:var(--p-card);box-shadow:inset 0 0 0 1px var(--line);font-size:17px;font-weight:500;line-height:24px;color:var(--ink);text-align:right}
.p9-tile:hover{background:var(--bg-2)}
.p9-tile svg.i{width:24px;height:24px}
.p9-rows{list-style:none;padding:12px 8px;margin:0 0 24px}
.p9-row{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:12px;border-radius:8px;font-size:17px;font-weight:500;line-height:24px;color:var(--ink);text-align:right}
.p9-row:hover{background:var(--bg-2)}
.p9-row .t{flex:1}
.p9-row>svg.i{width:20px;height:20px}
.p9-ric{position:relative;display:grid;place-items:center;width:24px;height:24px;flex:none}
.p9-ric svg.i{width:24px;height:24px}
.p9-rdot{position:absolute;top:-2px;left:-2px;width:8px;height:8px;border-radius:999px;background:var(--bad);box-shadow:0 0 0 2px var(--p-card)}
.p9-flag{width:24px;display:grid;place-items:center;flex:none}
.p9-flg{width:21px;height:14px;border-radius:2px;box-shadow:0 0 0 1px var(--line)}

/* ---------------- language sheet ---------------- */
.ov.p3-sh.p9-lang .mdl{width:min(640px,calc(100% - 32px))}
.p9-lh{font-size:17px;font-weight:600;line-height:24px;margin:8px 0 0}
.p9-lg{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.p9-lc{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:64px;padding:12px 16px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink);text-align:right}
.p9-lc b{font-size:15px;font-weight:600;line-height:20px}
.p9-lc small{font-size:13px;color:var(--ink-2);line-height:18px}
.p9-lc.on{border:2px solid var(--brand);padding:11px 15px}

/* ---------------- search ---------------- */
.p9-srb{min-height:144px;display:block;padding:8px 0}
.p-srch-b.p9-srb{display:block;height:auto}
.p9-sr-e{display:grid;place-items:center;min-height:128px;font-size:15px;font-weight:600;text-align:center;margin:0}
.p9-srl{padding:0 12px 8px}
.p9-sr-h{font-size:13px;font-weight:600;color:var(--ink-2);margin:12px 12px 4px}
.p9-sr-i{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border-radius:8px;font-size:15px;color:var(--ink);text-align:right}
.p9-sr-i:hover{background:var(--bg-2)}
.p9-sr-i svg.i{width:20px;height:20px;color:var(--ink-2)}
.p9-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:12px 24px}
.p9-chips::-webkit-scrollbar{display:none}
.p9-chips button{flex:none;height:36px;padding:0 15px;border-radius:999px;border:1px solid var(--line-2);background:var(--bg);font-size:15px;font-weight:500;color:var(--ink)}
.p9-chips button[aria-selected="true"]{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.p9-dkch{border-bottom:1px solid var(--line)}
.p9-srp-t{display:flex;align-items:center;gap:8px;padding:8px 0}
.p9-srp-in{flex:1;display:flex;align-items:center;gap:8px;height:48px;padding:0 16px;border-radius:999px;border:2px solid var(--brand);background:var(--bg)}
.p9-srp-in svg.i{width:20px;height:20px;color:var(--ink-2)}
.p9-srp-in input{flex:1;border:0;outline:0;background:none;font:inherit;font-size:15px;color:var(--ink)}
.p9-srp .p9-chips{padding:12px 0}

/* ---------------- performance insights ---------------- */
.p9-ins{display:flex;flex-direction:column}
.p9-ins-hd h1{font-size:28px;font-weight:600;line-height:34px;margin:0 0 4px}
.p9-ins-hd{margin-bottom:20px}
.p9-seg{display:grid;grid-template-columns:repeat(4,1fr);background:var(--bg-3);border-radius:8px;padding:2px;margin-bottom:44px;position:sticky;top:0;z-index:3}
.p9-seg button{height:33px;border-radius:6px;font-size:15px;color:var(--ink)}
.p9-seg button[aria-selected="true"]{background:var(--p-card);box-shadow:var(--sh-small)}
.p9-ins>.p9-mute{margin-bottom:16px}
.p9-ic{background:var(--p-card);border:1px solid var(--line);border-radius:12px;padding:20px;margin-top:16px}
.p9-ic-h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.p9-ic-h b{display:flex;align-items:center;gap:6px;font-size:17px;font-weight:600;line-height:24px}
.p9-ic-h svg.i{width:16px;height:16px;color:var(--ink-3)}
.p9-ic-h .p-link{font-size:15px}
.p9-big{display:flex;align-items:baseline;gap:8px;font-size:24px;font-weight:600;line-height:32px;margin:4px 0 0}
.p9-chg{display:inline-flex;align-items:center;gap:2px;font-size:13px;font-weight:400;color:var(--ink-2);line-height:16px}
.p9-chg svg.i{width:12px!important;height:12px!important}
.p9-ic>.p9-chg{margin-top:4px}
.p9-ch{position:relative;height:150px;margin:24px 0 8px;display:flex;gap:8px}
.p9-ch svg{flex:1;min-width:0;width:100%;height:100%;overflow:visible}
.p9-ch .g line{stroke:var(--line);stroke-dasharray:4 4;stroke-width:1;vector-effect:non-scaling-stroke}
.p9-ch .l{fill:none;stroke:var(--brand);stroke-width:2;vector-effect:non-scaling-stroke}
.p9-ch-y{display:flex;flex-direction:column;justify-content:space-between;font-size:11px;color:var(--ink-2);line-height:12px;margin:-6px 0}
.p9-ch-x{display:flex;justify-content:space-between;font-size:11px;color:var(--ink-2);padding:0 24px}
.p9-ch-d{display:grid!important;grid-template-columns:repeat(7,1fr);text-align:center;font-size:11px;color:var(--ink-2);line-height:14px}
.p9-ch-d span{display:flex;flex-direction:column;padding:4px 0;border-radius:6px}
.p9-ch-d b{font-weight:400}
.p9-ch-d .on{background:var(--bg-3);color:var(--ink);font-weight:600}
.p9-ic .p9-h3{margin:24px 0 12px}
.p9-ic .p9-h3.t{margin:0 0 16px}
.p9-lines p{display:flex;align-items:center;gap:8px;font-size:13px;line-height:21px;margin:0 0 3px}
.p9-lines i{flex:1;border-bottom:1px dashed var(--line);margin-top:8px}
.p9-lines b{font-weight:400;min-width:24px;text-align:left}
.p9-ic2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.p9-ic2 .p9-ic{margin-top:16px}
.p9-sec{display:flex;align-items:center;justify-content:space-between;margin:40px 0 0}
.p9-sec+.p9-mute{margin-top:4px}
.p9-sec .p-link{font-size:15px}
.p9-mkt{margin-top:16px;border-radius:12px;background:var(--brand);color:#fff;padding:20px}
.p9-mkt b{display:block;font-size:17px;font-weight:600;line-height:24px}
.p9-mkt p{font-size:24px;font-weight:600;line-height:32px;margin:8px 0 0}
.ov.p-dr.p9-insd .mdl{width:min(436px,100%)}
.p9-insd .p-dr-b{padding:24px 20px}
.p9-insd .p9-seg{position:static;margin-bottom:28px}

/* ---------------- earn ---------------- */
.p9-earn{padding:0}
.p9-earn-h{position:relative;height:396px;overflow:hidden;background:var(--p9-earn);color:#fff}
.p9-earn-h img{position:absolute;bottom:0;left:10%;width:46%;height:52%;object-fit:cover;object-position:top;border-radius:120px 120px 0 0}
.p9-earn-tb{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;padding:14px 19px}
.p9-cb{width:37px;height:37px;border-radius:999px;display:grid;place-items:center;background:rgba(0,0,0,.25);color:#fff}
.p9-cb svg.i{width:20px;height:20px}
.p9-wpill.p-btn{background:transparent;border-color:#fff;color:#fff}
.p9-earn-h h1{position:relative;z-index:1;font-size:32px;font-weight:700;line-height:40px;margin:10px 19px 0;max-width:340px}
.p9-earn-s{position:relative;margin-top:-16px;border-radius:16px 16px 0 0;background:var(--bg);padding:28px 19px 8px}
.p9-steps{list-style:none;padding:0;margin:20px 0 24px}
.p9-steps li{display:flex;gap:16px;align-items:center}
.p9-steps li>div{flex:1;padding:16px 0;border-bottom:1px solid var(--line)}
.p9-steps li:last-child>div{border-bottom:0}
.p9-steps .n{width:36px;height:36px;border-radius:999px;background:var(--bg-3);display:grid;place-items:center;font-weight:600;flex:none}
.p9-steps b{display:block;font-size:17px;font-weight:600;line-height:25px}
.p9-steps small{display:block;font-size:15px;color:var(--ink-2);line-height:21px}
.p9-rows.b{padding:0 8px}

/* ---------------- news ---------------- */
.p9-news{background:var(--p-card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-top:16px}
.p9-news-img{position:relative;border-radius:8px;overflow:hidden;height:219px;margin-bottom:12px;background:linear-gradient(180deg,var(--brand) 0%,var(--p9-navy) 70%);display:flex;flex-direction:column;align-items:center;padding-top:16px}
.p9-news-img .logo{color:#fff;font-size:22px;font-weight:800;margin-bottom:12px}
.p9-na{width:78%;flex:1;background:var(--bg);border-radius:6px 6px 0 0;padding:10px;display:flex;flex-direction:column;gap:6px}
.p9-na span{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;flex:1}
.p9-na i{border-radius:3px;background:var(--bg-2)}
.p9-na i.c1{background:var(--p-appt)}.p9-na i.c2{background:var(--p9-g2b)}
.p9-news h3{font-size:17px;font-weight:600;line-height:25px;margin:0}
.p9-news small{display:block;font-size:13px;color:var(--ink-2);line-height:17px;margin-bottom:12px}
.p9-news p{font-size:15px;line-height:20px;margin:0}
.p9-news .p-btn{margin-top:12px}

/* ---------------- help & support ---------------- */
.p9-hc{display:flex;align-items:center;gap:16px;width:100%;min-height:73px;padding:12px 20px;margin-top:10px;border-radius:12px;background:linear-gradient(200deg,var(--p9-help2),var(--p9-help));color:#fff;text-align:right}
.p9-hc:first-of-type{margin-top:32px}
.p9-hc svg.i{width:28px;height:28px}
.p9-hc b{display:block;font-size:15px;font-weight:600;line-height:21px}
.p9-hc small{display:block;font-size:15px;line-height:21px;opacity:.9}
.p9-prem{display:flex;gap:12px;align-items:stretch;margin:16px 0 48px;border-radius:12px;background:var(--bg-3);overflow:hidden;min-height:185px}
.p9-prem>div{flex:1;padding:20px 24px}
.p9-prem small{font-size:13px;font-weight:600}
.p9-prem b{display:block;font-size:17px;font-weight:600;line-height:24px;margin:8px 0}
.p9-prem p{font-size:15px;line-height:20px;margin:0}
.p9-prem img{width:129px;object-fit:cover}
.p9-hcl{display:flex;align-items:center;gap:16px;width:100%;min-height:69px;padding:12px 20px;margin-top:16px;font-size:15px;color:var(--ink);text-align:right}
.p9-hcl span{flex:1}
.p9-hcl svg.i{width:20px;height:20px}

/* ---------------- avatar area ---------------- */
.p9-me-h{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}
.p9-me-h small{font-size:15px;color:var(--ink-2)}
.p9-me-h h1{font-size:28px;font-weight:600;line-height:37px;margin:0}
.p9-me-h p{font-size:15px;color:var(--ink-2);margin:0}
.p9-me-h .p-av{width:64px;height:64px;font-size:20px;margin:0}
.p9-inv{display:flex;align-items:center;gap:12px;width:100%;padding:16px;border-radius:12px;background:linear-gradient(90deg,var(--p9-inv1),var(--p9-inv2));color:#fff;text-align:right;font-weight:600;font-size:15px;line-height:21px;margin-bottom:24px}
.p9-inv span{flex:1}
.p9-avm .p9-inv{margin-bottom:8px;border-radius:8px}
.p9-me .p9-rows{padding:8px}
.p9-me .p9-row{min-height:48px;font-size:15px;font-weight:500}
.p9-pt{display:flex;align-items:center;gap:12px}
.p9-pt.sb{justify-content:space-between}
.p9-pt .p9-h1{margin:0}
.p9-on{background:var(--p9-on);color:var(--p9-on-ink);font-size:13px;font-weight:600;line-height:16px;padding:2px 8px;border-radius:999px}
.p9-sq.p-btn{width:37px;height:37px;padding:0;border-color:transparent}
.p9-pcard{position:relative;margin-top:44px;padding:56px 20px 24px;border-radius:16px;box-shadow:var(--sh-card);text-align:center;background:var(--p-card)}
.p9-pedit.p-btn{position:absolute;top:16px;left:16px}
.p9-bigav{width:120px;height:120px;border-radius:999px;background:var(--brand-soft);color:var(--brand);display:inline-grid;place-items:center}
.p9-bigav svg.i{width:56px!important;height:56px!important}
.p9-pcard h2{font-size:28px;font-weight:600;line-height:37px;margin:32px 0 8px}
.p9-pcard p{font-size:17px;color:var(--ink-2);margin:0}
.p9-pcard hr{border:0;border-top:1px solid var(--line);margin:48px 0 40px}
.p9-pcard h3{font-size:17px;font-weight:600;text-align:right;margin:0 0 16px}
.p9-tags{display:flex;gap:8px;flex-wrap:wrap}
.p9-tags span{background:var(--bg-3);border-radius:999px;padding:4px 12px;font-size:15px}
.p9-psec{margin-top:56px}
.p9-emp{display:flex;flex-direction:column;align-items:center;text-align:center;padding:40px 16px}
.p9-ill{width:64px;height:64px;border-radius:16px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--p9-g3b),var(--brand));margin-bottom:20px}
.p9-ill svg.i{width:32px!important;height:32px!important}
.p9-emp b{font-size:17px;font-weight:600;line-height:23px}
.p9-emp p{font-size:15px;color:var(--ink-2);line-height:19px;margin:8px 0 0;max-width:300px}
.p9-emp .p-btn{margin-top:20px}
.p9-pills{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin:24px 0 32px}
.p9-pills::-webkit-scrollbar{display:none}
.p9-pills button{flex:none;height:37px;padding:0 15px;border-radius:999px;font-size:15px;font-weight:500;color:var(--ink)}
.p9-pills button[aria-selected="true"]{background:var(--ink);color:var(--on-ink)}
.p9-pe{display:flex;flex-direction:column;gap:20px}
.p9-pe>.p9-h2+.p9-mute{margin-top:-16px}
.p9-pe .p9-h2:not(:first-child){margin-top:24px}
.p9-avedit{position:relative;width:121px;height:120px;margin:0 auto}
.p9-avpen{position:absolute;bottom:2px;left:0;width:34px;height:34px;border-radius:999px;background:var(--bg);border:1px solid var(--line);display:grid;place-items:center;color:var(--ink-2)}
.p9-avpen svg.i{width:16px;height:16px}
.p9-langs{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px}
.p9-langs li{display:flex;align-items:center;justify-content:space-between;font-size:15px;font-weight:600;min-height:28px}
.p9-pe>.p-btn{align-self:flex-start}
.p9-pe .p9-h3{margin:8px 0 -8px}
.p9-ints{display:flex;flex-wrap:wrap;gap:8px}
.p9-int{display:inline-flex;align-items:center;gap:6px;height:37px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:var(--bg);font-size:14px;color:var(--ink)}
.p9-int[aria-pressed="true"]{background:var(--brand-soft);border-color:var(--brand);color:var(--brand)}
.p9-more-n{font-size:14px;color:var(--ink);margin:-8px 0 0}
.p9-sin{display:flex;align-items:center;gap:8px;height:48px;padding:0 16px;border-radius:999px;border:1px solid var(--line-2);background:var(--bg)}
.p9-sin svg.i{width:20px;height:20px;color:var(--ink-2)}
.p9-sin input{flex:1;min-width:0;border:0;outline:0;background:none;font:inherit;font-size:15px;color:var(--ink)}
.p9-addl .p9-sin{border-radius:8px}
.p9-ll{display:flex;flex-direction:column}
.p9-li{text-align:right;padding:14px 0;font-size:15px;color:var(--ink)}
.p9-li:hover{color:var(--brand)}
.p9-hero{font-size:32px;font-weight:700;line-height:40px;margin:16px 0 20px}
.p9-ck{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.p9-ck li{display:flex;gap:12px;font-size:15px;line-height:24px}
.p9-ck svg.i{width:20px;height:20px;flex:none;margin-top:2px}
.p9-coll{position:relative;height:340px;margin:32px -32px -48px;background:linear-gradient(180deg,var(--bg) 0%,var(--brand-soft) 60%,var(--brand-soft) 100%);overflow:hidden}
.p9-coll span{position:absolute;border-radius:8px;overflow:hidden;box-shadow:0 0 0 4px var(--bg);background:var(--bg-3)}
.p9-coll img{width:100%;height:100%;object-fit:cover}
.p9-coll .c0{top:8px;right:28%;width:153px;height:102px}.p9-coll .c1{top:16px;right:-10px;width:69px;height:94px}
.p9-coll .c2{top:130px;right:56%;width:175px;height:99px}.p9-coll .c3{top:130px;right:0;width:166px;height:149px}
.p9-coll .c4{top:256px;right:40%;width:157px;height:106px}.p9-coll .c5{top:300px;right:11%;width:122px;height:92px}.p9-coll .c6{top:300px;right:-4px;width:18px;height:92px}
.p9-sbar{display:flex;gap:12px;margin:24px 0 24px}
.p9-sbar .p9-sin{flex:1}
.p9-sq48.p-btn{width:49px;height:49px;padding:0}
.p9-rvemp{padding:40px 16px}
.p9-rvemp .p9-emp{padding:0}
.p9-rt{grid-template-columns:auto auto 1fr auto!important;align-items:center}
.p9-rt{display:flex!important;align-items:center;gap:12px}
.p9-rt>span{width:16px}
.p9-rtbar{flex:1;height:4px;border-radius:999px;background:var(--bg-3)}
.p9-rt small{font-size:15px;color:var(--ink)}
.p9-ws{display:flex;gap:16px;padding:16px 13px;align-items:center}
.p9-wsic{width:47px;height:47px;border-radius:8px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.p9-ws b{display:block;font-size:15px;font-weight:600}
.p9-ws small{display:block;font-size:15px;color:var(--ink-2);line-height:21px}
.p9-ws .p-btn{margin-top:8px}
.p9-box{padding:24px;margin-top:24px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.p9-box .p9-h3{margin:0}
.p9-box .p9-pt{width:100%}
.p9-box .p-btn{margin-top:8px}

/* ---------------- account settings ---------------- */
.p9-acct .p9-h1{margin-bottom:8px}
.p9-acct>.p9-fs-b>.p9-mute{margin-bottom:32px}
.p9-rows.s{padding:0}
.p9-rows.s .p9-row{font-size:15px;padding:12px 20px;border-radius:0}
.p9-kv{margin:24px 0 0;display:grid;gap:4px}
.p9-kv dt{font-size:15px;font-weight:600;line-height:21px;margin-top:16px}
.p9-kv dt:first-child{margin-top:0}
.p9-kv dd{margin:0;font-size:15px;color:var(--ink-2);line-height:21px}
.p9-acct .p9-hr+.p9-h2+.p9-mute{margin:4px 0 20px}
.p9-note{margin-top:56px;padding:24px;display:flex;flex-direction:column;gap:8px}
.p9-note svg.i{width:32px;height:32px;color:var(--brand)}
.p9-note b{font-size:17px;font-weight:600;margin-top:16px}
.p9-note p{font-size:15px;line-height:21px;color:var(--ink-2);margin:0}
.p9-sr{display:flex;align-items:center;gap:16px;margin-top:24px}
.p9-sr>div{flex:1}
.p9-sr b{display:block;font-size:15px;font-weight:600;line-height:21px}
.p9-sr b i{font-style:normal;font-weight:400;font-size:13px;color:var(--ink-2)}
.p9-sr small{display:block;font-size:13px;color:var(--ink-2);line-height:18px}
.p9-sr.ses{margin-top:28px}
.p9-sr.ses>svg.i{width:24px;height:24px}
.p9-sr+.p-btn{margin-top:24px}
.p9-g{width:37px;height:37px;display:grid;place-items:center;font-size:24px;font-weight:700;color:var(--p9-goo);flex:none}
.p9-acct .p9-h2+.p9-mute{margin-top:4px}
.p9-thm{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:24px;max-width:480px}
.p9-thm button{display:flex;flex-direction:column;align-items:flex-start;gap:6px;height:66px;padding:10px 13px;border-radius:12px;border:1px solid var(--line);background:var(--bg);font-size:15px;color:var(--ink)}
.p9-thm button svg.i{width:20px;height:20px}
.p9-thm button[aria-checked="true"]{border:2px solid var(--brand);padding:9px 12px}

/* ---------------- notifications ---------------- */
.p9-ul{display:flex;gap:20px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line);margin:0 -19px;padding:0 19px}
.p9-ul::-webkit-scrollbar{display:none}
.p9-ul button{flex:none;height:44px;font-size:15px;font-weight:500;color:var(--ink);border-bottom:2px solid transparent}
.p9-ul button[aria-selected="true"]{border-color:var(--ink);font-weight:600}
.p9-ntb{padding-top:16px}
.p9-ntb.e{margin-top:16px;background:var(--p-card);border:1px solid var(--line);border-radius:12px}
.p9-nth{font-size:17px;font-weight:600;margin:8px 0 12px}
.p9-ntb .p-nt-c{padding:16px}
.p9-nt .p9-tb-t{opacity:1}
.p9-prefs .p3-sh-b{gap:12px}
.p9-prg{border-top:1px solid var(--line);padding-top:24px;margin-top:16px;display:flex;flex-direction:column;gap:12px}
.p9-prg-h{display:flex;gap:16px;align-items:flex-start}
.p9-prg-h>div{flex:1}
.p9-prg-h .p9-h3{margin:0;display:flex;align-items:center;gap:8px}
.p9-onb{font-style:normal;background:var(--p9-on);color:var(--p9-on-ink);font-size:13px;font-weight:600;line-height:16px;padding:2px 8px;border-radius:999px}
.p9-onb.off{background:var(--bg-3);color:var(--ink-2)}
.p9-prh,.p9-pr{display:grid;grid-template-columns:1fr 56px 56px 56px;align-items:center;gap:4px}
.p9-prh{padding-bottom:12px;border-bottom:1px solid var(--line)}
.p9-prt{margin-top:24px}
.p9-prt b{display:block;font-size:17px;font-weight:600;line-height:24px}
.p9-prt small{display:block;font-size:15px;color:var(--ink-2);line-height:21px}
.p9-prefs .p3-sh-h h2{font-size:28px;line-height:36px}
.p9-prefs .p3-sh-b>.p9-h2{margin-top:24px}
.p9-prg-h .p9-h2{display:flex;align-items:center;gap:8px;margin:0}
.p9-prh b{display:block;font-size:15px;font-weight:600}
.p9-prh small{display:block;font-size:13px;color:var(--ink-2);line-height:18px}
.p9-prh>span{font-size:13px;color:var(--ink);text-align:center}
.p9-pr{padding:12px 0;border-bottom:1px solid var(--line)}
.p9-pr b{display:block;font-size:15px;font-weight:600;line-height:20px}
.p9-pr small{display:block;font-size:13px;color:var(--ink-2);line-height:18px}
.p9-ulk{color:var(--ink);font-weight:600}
.p9-dash{justify-self:center;width:16px;border-top:1px solid var(--line-2)}
.p9-cb2{justify-self:center;position:relative;width:24px;height:24px}
.p9-cb2 input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.p9-cb2 i{width:24px;height:24px;border-radius:4px;border:1px solid var(--line-2);display:grid;place-items:center;color:transparent;pointer-events:none}
.p9-cb2 i svg.i{width:14px!important;height:14px!important}
.p9-cb2 input:checked+i{background:var(--brand);border-color:var(--brand);color:#fff}
.p9-cb2 input:focus-visible+i{outline:2px solid var(--brand);outline-offset:2px}

/* ---------------- Connect ---------------- */
.p9-cn{max-width:1100px}
.p9-cni{display:flex;align-items:center;gap:48px;padding:24px 0}
.p9-cni-t{flex:1;max-width:440px}
.p9-eb{display:block;font-size:13px;font-weight:600;color:var(--brand);letter-spacing:.02em;margin-bottom:8px}
.p9-cni h1{font-size:28px;font-weight:700;line-height:36px;margin:0 0 16px}
.p9-cni-t>p{font-size:15px;line-height:21px;margin:0 0 20px}
.p9-cni .p9-ck li{font-size:15px}
.p9-cni-b{display:flex;gap:8px;margin-top:24px}
.p9-cn .p9-fs-f{display:none}
.p9-cnph{flex:none;width:280px;height:560px;border-radius:44px;padding:10px;background:linear-gradient(160deg,var(--line-2),var(--ink-3));margin:0 auto}
.p9-cnscr{height:100%;border-radius:36px;padding:56px 14px;background:linear-gradient(170deg,var(--p9-cn2),var(--p9-cn3) 55%,var(--p9-cn1));color:#fff;text-align:center;overflow:hidden}
.p9-cnscr .d{font-size:15px;font-weight:600;margin:0}
.p9-cnscr .t{font-size:72px;font-weight:700;line-height:80px;margin:0 0 140px}
.p9-cnn{display:flex;align-items:center;gap:8px;text-align:right;background:rgba(255,255,255,.22);border-radius:16px;padding:8px 10px;margin-top:8px}
.p9-cnn>span{width:32px;height:32px;border-radius:999px;overflow:hidden;flex:none;background:var(--bg-3)}
.p9-cnn img{width:100%;height:100%;object-fit:cover}
.p9-cnn div{flex:1;min-width:0}
.p9-cnn b{display:block;font-size:12px}
.p9-cnn small{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.9}
.p9-cnn em{font-style:normal;font-size:10px;align-self:flex-start}
.p9-fs.p9-cnin{max-width:640px;padding:24px 0}
.p9-cnin .p9-cnh{border-radius:16px 16px 0 0}
.p9-cnh{background:linear-gradient(120deg,var(--p9-cn1),var(--p9-cn2));color:#fff;padding:4px 8px 40px}
.p9-cnh.team{background:linear-gradient(120deg,var(--p9-tm1),var(--p9-tm2))}
.p9-cnh-t{display:flex;align-items:center;gap:4px;height:56px;padding-right:11px}
.p9-cnh-t .sp{flex:1}
.p9-cnh .p9-tbb{color:#fff}
.p9-cnh .p9-tbb:hover{background:rgba(255,255,255,.15)}
.p9-cnlogo{display:flex;align-items:center;gap:6px;font-size:17px}
.p9-cnlogo b{font-size:20px;font-weight:800}
.p9-cnlogo svg.i{width:20px;height:20px}
.p9-cnseg{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:4px 11px 0;padding:3px;border-radius:999px;background:rgba(255,255,255,.2)}
.p9-cnseg button{height:32px;border-radius:999px;color:#fff;font-size:14px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px}
.p9-cnseg button[aria-selected="true"]{background:var(--bg);color:var(--ink)}
.p9-cnseg em{font-style:normal;font-size:12px;background:rgba(255,255,255,.3);border-radius:999px;padding:0 6px;line-height:18px}
.p9-cnseg button[aria-selected="true"] em{background:var(--bg-3)}
.p9-cnb{position:relative;margin-top:-24px;border-radius:16px 16px 0 0;background:var(--bg);min-height:560px;padding:20px 19px 96px}
.p9-cnf{display:flex;gap:8px;margin-bottom:16px}
.p9-cnf button{height:32px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);font-size:14px;color:var(--ink);display:flex;align-items:center;gap:8px}
.p9-cnf button[aria-pressed="true"]{border:2px solid var(--brand);padding:0 13px}
.p9-cnf em{font-style:normal;font-size:12px;background:var(--bg-3);border-radius:999px;padding:0 6px;line-height:18px}
.p9-cnc{display:flex;align-items:center;gap:12px;width:100%;padding:8px 0;text-align:right;color:var(--ink)}
.p9-cnc div{flex:1;min-width:0}
.p9-cnc b{display:block;font-size:14px;font-weight:600}
.p9-cnc small{display:block;font-size:13px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p9-cnc em{font-style:normal;font-size:12px;color:var(--ink-2);align-self:flex-start}
.p9-cnav{width:40px;height:40px;border-radius:999px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-size:13px;font-weight:600;flex:none}
.p9-cnav.s{width:32px;height:32px;font-size:11px}
.p9-cnfab{position:absolute;left:19px;bottom:24px;width:56px;height:56px;border-radius:999px;background:linear-gradient(135deg,var(--p9-cn2),var(--p9-cn1));color:#fff;display:grid;place-items:center;box-shadow:var(--sh-pop)}
.p9-cnfab svg.i{width:24px;height:24px}
.p9-cnb .p9-emp{padding-top:120px}
.p9-tc{display:flex;flex-direction:column;gap:12px}
.p9-tcl{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;margin:0}
.p9-tcl span{width:28px;height:28px;border-radius:8px;background:var(--p9-tm1);color:#fff;display:grid;place-items:center}
.p9-tcl svg.i{width:18px;height:18px}
.p9-tc h2{font-size:24px;font-weight:700;line-height:32px;margin:0}
.p9-tc>p{font-size:15px;line-height:21px;margin:0}
.p9-tcp{font-size:20px!important;font-weight:700;line-height:28px!important;margin-top:16px!important}
.p9-tcb{display:flex;gap:8px;margin-top:8px}
.p9-chatp .p9-fs-b{min-height:420px}
.p9-tb.chat .p9-cnnm{font-size:15px;font-weight:600;margin-right:8px}
.p9-tb.chat .p9-cnav{margin-right:4px}
.p9-chat{display:flex;flex-direction:column;align-items:flex-start;padding-top:240px}
.p9-day{align-self:center;font-size:13px;font-weight:600;margin:0 0 20px}
.p9-from{font-size:12px;color:var(--ink-2);margin:0 0 6px}
.p9-msg{background:var(--bg-3);border-radius:12px;padding:12px 16px;max-width:85%}
.p9-msg p{font-size:14px;margin:0}
.p9-msg small{display:block;text-align:left;font-size:11px;color:var(--ink-2);margin-top:4px}
.p9-comp{flex:1;border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.p9-req{display:flex;align-items:center;gap:8px;background:var(--p9-reqbg);color:#fff;padding:10px 12px;font-size:13px}
.p9-req span{flex:1}
.p9-req a{color:#fff;font-weight:600}
.p9-req svg.i{width:18px;height:18px}
.p9-cin{padding:12px;background:var(--bg)}
.p9-cin input{width:100%;border:0;outline:0;background:none;font:inherit;font-size:14px;color:var(--ink);height:32px}
.p9-cia{display:flex;align-items:center;gap:8px;margin-top:8px;color:var(--ink-2)}
.p9-cia .sp{flex:1}
.p9-cia button{width:28px;height:28px;display:grid;place-items:center;color:inherit}
.p9-cia svg.i{width:20px;height:20px}
.p9-cia .snd{width:32px;height:32px;border-radius:999px;background:var(--ink-3);color:#fff}

/* ---------------- continue setup / guides ---------------- */
.p9-gd-h{color:#fff;padding:24px 24px 20px;background:linear-gradient(120deg,var(--p9-g1),var(--p9-g1b))}
.p9-gd-h.g-superstar{background:linear-gradient(120deg,var(--p9-g2),var(--p9-g2b))}
.p9-gd-h.g-boss{background:linear-gradient(120deg,var(--p9-g3),var(--p9-g3b))}
.p9-gd-h small{display:block;font-size:13px;font-weight:600;margin-bottom:4px}
.p9-gd-h b{display:block;font-size:20px;font-weight:600;line-height:28px}
.p9-hexs{display:flex;gap:8px;margin-top:8px;align-items:flex-start}
.p9-hxo{position:relative;width:37px;height:40px;display:grid;place-items:center;color:#fff}
.p9-hxo .p9-hxb{position:absolute;inset:0;width:100%;height:100%}
.p9-hxo .p9-hxb path{fill:none;stroke:rgba(255,255,255,.6);stroke-width:1.5}
.p9-hxo svg.i{position:relative;width:20px;height:20px}
.p9-hxo.on .p9-hxb path{fill:var(--p9-g1);stroke:rgba(255,255,255,.85);stroke-width:2}
.g-superstar .p9-hxo.on .p9-hxb path{fill:var(--p9-g2)}
.g-boss .p9-hxo.on .p9-hxb path{fill:var(--p9-g3)}
.p9-hxo.on::after{content:"";position:absolute;bottom:-9px;width:5px;height:5px;border-radius:9px;background:#fff}
.g-learner .p9-gs .n{border-color:var(--p9-g1);color:var(--p9-g1)}
.g-superstar .p9-gs .n{border-color:var(--p9-g2);color:var(--p9-g2)}
.g-boss .p9-gs .n{border-color:var(--p9-g3);color:var(--p9-g3)}
.p9-hx{position:relative;width:34px;height:38px;display:grid;place-items:center;color:#fff;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:rgba(255,255,255,.28)}
.p9-hx svg.i{width:18px;height:18px}
.p9-hx.on{background:rgba(255,255,255,.5)}
.p9-gd-h .p9-hexs .p9-hx.on::after{content:"";position:absolute;bottom:-1px;width:4px;height:4px;border-radius:9px;background:#fff}
.p9-hx.big{width:108px;height:122px}
.p9-hx.big svg.i{width:36px!important;height:36px!important}
.p9-hx.big.h0{background:linear-gradient(160deg,var(--p9-g1b),var(--p9-g1))}
.p9-hx.big.h1{background:linear-gradient(160deg,var(--p9-g2b),var(--p9-g2))}
.p9-hx.big.h2{background:linear-gradient(160deg,var(--p9-g3b),var(--p9-g3))}
.p9-gd-b{padding:20px;display:flex;flex-direction:column;gap:12px;background:var(--bg-2)}
.p9-gd-h{padding-bottom:28px}
.p9-gd-v{position:relative;height:210px;border-radius:12px;overflow:hidden;background:var(--bg-3)}
.p9-gd-v img{width:100%;height:100%;object-fit:cover}
.p9-gd-v b{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:22px;font-weight:700;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.p9-gd-v span{position:absolute;bottom:12px;right:12px;width:40px;height:40px;border-radius:999px;background:rgba(0,0,0,.45);color:#fff;display:grid;place-items:center}
.p9-gd-v span svg.i{width:20px;height:20px}
.p9-gs{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 16px;border-radius:12px;background:var(--p-card);border:1px solid var(--line);text-align:right;color:var(--ink);font-size:15px;line-height:21px}
.p9-gs .n{width:22px;height:22px;border-radius:999px;border:1.5px solid var(--brand);color:var(--brand);display:grid;place-items:center;font-size:12px;flex:none}
.p9-gs .t{flex:1}
.p9-gs .ok{width:22px;height:22px;border-radius:999px;background:var(--ok);color:#fff;display:grid;place-items:center}
.p9-gs .ok svg.i{width:14px;height:14px}
.p9-gs>svg.i{width:20px;height:20px}
.p9-gs .p-btn{pointer-events:none}
.p9-skip{display:flex;align-items:center;gap:6px;font-size:15px;color:var(--ink-2);margin:4px 0 12px}
.p9-skip svg.i{width:16px;height:16px}
.p9-hcard{position:relative;background:var(--p-card);border:1px solid var(--line);border-radius:12px;padding:24px 20px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.p9-hcard b{font-size:20px;font-weight:600}
.p9-hcard p{font-size:15px;line-height:21px;margin:0}
.p9-hcb{position:absolute;top:24px;left:20px;width:28px;height:20px;border-radius:10px;background:linear-gradient(90deg,var(--brand),var(--p9-g3b));transform:skewX(-20deg)}
.ov.p-dr.p9-gdd .mdl{width:min(468px,100%)}
.p9-gdd .p-nt-m{overflow-y:auto}
.p9-gd .p9-fs-b,.p9-gd{padding:0}
.p9-gmp .p9-fs-b{display:flex;flex-direction:column;align-items:center}
.p9-gm-t{font-size:24px;font-weight:600;line-height:34px;text-align:center;margin:31px 0 30px}
.p9-gm{position:relative;width:100%;max-width:373px;height:380px}
.p9-gm-l{position:absolute;inset:0;width:100%;height:100%}
.p9-gm-l path{stroke:var(--ink-3);stroke-width:1.5;stroke-dasharray:3 4;fill:none}
.p9-gm-i{position:absolute;width:130px;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:15px;color:var(--ink)}
.p9-gm-i b{font-weight:600}
.p9-gm-i.i0{top:0;right:26px}.p9-gm-i.i1{top:112px;left:26px}.p9-gm-i.i2{top:224px;right:26px}
.p9-bk{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:999px;background:var(--bg);border:1px solid var(--line);font-size:15px;font-weight:500;color:var(--ink)}
.p9-bk svg.i{width:20px;height:20px}
.p9-iv{position:relative;display:block;width:100%;height:211px;margin-top:64px;border-radius:12px;overflow:hidden;background:var(--bg-3)}
.p9-iv img{width:100%;height:100%;object-fit:cover}
.p9-iv .pl{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:999px;background:rgba(255,255,255,.55);display:grid;place-items:center;color:#fff}
.p9-iv em{position:absolute;bottom:10px;left:10px;font-style:normal;font-size:12px;color:#fff;background:rgba(0,0,0,.5);border-radius:999px;padding:2px 8px}
.p9-ivt{font-size:32px;font-weight:700;line-height:42px;text-align:center;margin:24px 0 12px}
.p9-ivt span{color:var(--p9-g3b)}
.p9-ivd{font-size:17px;line-height:25px;text-align:center;margin:0 0 20px}
.p9-ivp .p9-fs-b{display:flex;flex-direction:column;align-items:center}
.p9-ivp .p9-fs-b>.p9-bk{align-self:flex-start}
.p9-watch.p-btn{background:var(--bg)}

/* ---------------- phone (Fresha's business app = mobile layout) ---------------- */
@container (max-width:600px){
  .p-app:has(.p9-fs) .p-setup-m,.p-app:has(.p9-fs) .p-tabbar{display:none}
  .p-app:has(.p9-fs) .p-main{padding-bottom:0}
  .p9-dk{display:none!important}
  .p9-mb{display:flex!important}
  .p9-fs{max-width:none;min-height:100%;padding:0 19px 24px;display:flex;flex-direction:column}
  .p9-fs.has-f{padding-bottom:0}
  .p9-fs-b{flex:1}
  .p9-tb{position:sticky;top:0;z-index:10;height:58px;margin:0 -19px;padding:10px 8px 0;background:inherit}
  .p9-fs{background:var(--bg)}
  .p-main.grey .p9-fs{background:var(--p-mbg)}
  .p9-tb{background:var(--bg)}
  .p-main.grey .p9-tb{background:var(--p-mbg)}
  .p9-tb .p-btn.s{height:38px}
  .p9-fs-f{position:sticky;bottom:0;z-index:10;margin:0 -19px;padding:12px 19px 16px;background:inherit;justify-content:stretch}
  .p9-fs-f{background:var(--bg)}
  .p-main.grey .p9-fs-f{background:var(--p-mbg)}
  .p9-fs-f>.p-btn{flex:1;height:48px}
  .p9-fs-f>.p9-comp{margin:0}
  .p9-h1{font-size:28px;line-height:36px;margin-top:12px}
  .p9-more{padding:24px 20px}
  .p9-lg{grid-template-columns:1fr 1fr}
  .ov.p3-sh.p9-lang .mdl{width:100%;max-height:calc(100% - 16px)}
  .p9-lang .p3-sh-h h2{font-size:28px;line-height:36px}
  /* search */
  .p9-srfs{padding-top:4px}
  .p9-srp-t{margin:0 -11px 0 0}
  .p9-srp .p9-chips{margin:0 -19px;padding:12px 19px}
  .p9-srp .p9-sr-e{min-height:120px;font-size:13px}
  /* insights */
  .p9-insp .p9-ins-hd{margin-top:12px}
  .p9-insp .p9-seg{top:58px;margin:0 -19px 44px;padding:2px;border-radius:0;background:var(--p-mbg);box-shadow:none}
  .p9-insp .p9-seg::before{content:"";position:absolute;inset:0 19px;border-radius:8px;background:var(--bg-3);z-index:-1}
  .p9-insp .p9-seg{display:grid;grid-template-columns:repeat(4,1fr);padding:2px 21px;isolation:isolate}
  .p9-ic2{grid-template-columns:1fr;gap:0}
  .p9-ic{padding:20px 20px 16px}
  .p9-ch{height:180px}
  /* earn */
  .p9-earn{padding:0}
  .p9-earn .p9-fs-f{margin:0;padding:12px 19px 16px}
  /* avatar */
  .p9-me .p9-fs-b{padding-top:8px}
  .p9-pcard{margin-top:44px}
  .p9-coll{margin:32px -19px 0}
  .p9-port .p9-fs-f{background:var(--brand-soft)}
  .p9-hero{font-size:32px;line-height:40px}
  /* connect */
  .p9-cni{flex-direction:column;align-items:stretch;gap:32px;padding:12px 0 0}
  .p9-cni h1{font-size:24px;line-height:32px}
  .p9-cnph{width:250px;height:420px;margin-bottom:-24px;border-radius:40px 40px 0 0;padding:10px 10px 0}
  .p9-cnscr{border-radius:32px 32px 0 0;padding-top:40px}
  .p9-cnscr .t{margin-bottom:60px}
  .p9-fs.p9-cnin{padding:0;max-width:none}
  .p9-cnin .p9-cnh{border-radius:0}
  .p9-cnin .p9-cnb{min-height:700px;display:flex;flex-direction:column}
  .p9-cni-b{display:none}
  .p9-cn .p9-fs-f{display:flex}
  .p9-cnfab{position:sticky;bottom:24px;left:auto;margin-top:auto;align-self:flex-end}
  .p9-cnin .p9-fs-b{display:flex;flex-direction:column}
  .p9-cnin .p9-cnb{flex:1;padding-bottom:0}
  .p9-chatp .p9-tb .p9-tb-t{display:none}
  .p9-chatp .p9-fs-f{padding:8px 12px 12px}
  /* guides */
  .p9-fs.p9-gd{padding:0}
  .p9-ivp{padding-top:12px}
  .p9-gd .p9-tb{background:linear-gradient(120deg,var(--p9-g1),var(--p9-g1b));color:#fff;margin:0;padding:10px 8px 0}
  .p9-gd.g-superstar .p9-tb{background:linear-gradient(120deg,var(--p9-g2),var(--p9-g2b))}
  .p9-gd.g-boss .p9-tb{background:linear-gradient(120deg,var(--p9-g3),var(--p9-g3b))}
  .p9-gd .p9-tb .p9-tbb{color:#fff}
  .p9-gd .p9-tb-t{opacity:1;font-size:20px;font-weight:600}
  .p9-gd .p9-gd-h{padding:4px 19px 32px}
  .p9-gd .p9-gd-b{padding:16px 19px 24px}
  .p9-gd .p9-gs{min-height:65px;font-size:15px;margin-bottom:-2px}
  .p9-gmp .p9-fs-f .p-btn{height:48px}
}
@container (max-width:600px){
  .p9-chatp .p9-fs-b{display:flex;flex-direction:column;justify-content:flex-end}
  .p9-chatp .p9-chat{padding:0 0 16px}
}
.p9-rvf .p3-exp:first-child{border-top:1px solid var(--line)}
.p9-rvf .p3-exp-b{padding-right:30px}
.p9-cnseg{border:1px solid rgba(255,255,255,.55)}
.p9-cnph.tm{width:260px;height:300px;margin:24px auto -20px;border-radius:44px 44px 0 0;padding:8px 8px 0}
.p9-cnph.tm .p9-cnscr{background:var(--bg);color:var(--ink);border-radius:36px 36px 0 0;padding:16px 14px;text-align:right}
.p9-cnph.tm .tt{font-size:13px;font-weight:600;margin:0 8px 16px}
.p9-cnph.tm .p9-cnn{background:var(--bg-2)}
.p9-cnph.tm .p9-cnn .p-cav{width:32px;height:32px;box-shadow:none}
.p9-addl .p9-sin{flex:none;height:48px}
.p9-day{display:flex;align-items:center;gap:12px;align-self:stretch}
.p9-day::before,.p9-day::after{content:"";flex:1;border-top:1px solid var(--line)}

/* == panel B review 1405-07-24: sent messages, photo pickers, portfolio, team channels, support chat == */
.p9-chat{display:flex;flex-direction:column;gap:8px}
.p9-msg.me{align-self:flex-end;background:var(--brand-soft)}
.p9-cia .p9-cia-b.p-btn{width:28px;height:28px;min-height:0;padding:0;border:0;background:none;color:inherit}
.p9-cia .snd:not(:disabled){background:var(--ink);color:var(--on-ink)}
.p9-bigav img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.p9-pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0}
.p9-pimg{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--bg-3)}
.p9-pimg img{width:100%;height:100%;object-fit:cover}
.p9-pimg .p9-tbb{position:absolute;top:6px;left:6px;width:28px;height:28px;border-radius:999px;background:var(--bg);box-shadow:var(--sh-small)}
.p9-padd{aspect-ratio:1;border:1px dashed var(--line-2);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--ink-2);font-size:13px;background:var(--bg)}
.p9-tch{display:flex;flex-direction:column;gap:4px;padding:8px 0}
.p9-hcin{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line)}
.p9-hcin .snd{width:36px;height:36px;border-radius:999px;background:var(--ink);color:var(--on-ink);display:grid;place-items:center;flex:none}
.p9-li{display:flex;align-items:center;gap:10px;width:100%}
.p9-tips .p9-ck{margin:0}
/* guide step numbers: the darker dark-theme hue is a background colour; text uses the lighter step (contrast ≥ 4.5) */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .g-learner .p9-gs .n{color:var(--p9-g1b);border-color:var(--p9-g1b)}:root:not([data-theme="light"]) .g-superstar .p9-gs .n{color:var(--p9-g2b);border-color:var(--p9-g2b)}:root:not([data-theme="light"]) .g-boss .p9-gs .n{color:var(--p9-g3b);border-color:var(--p9-g3b)}}
:root[data-theme="dark"] .g-learner .p9-gs .n{color:var(--p9-g1b);border-color:var(--p9-g1b)}:root[data-theme="dark"] .g-superstar .p9-gs .n{color:var(--p9-g2b);border-color:var(--p9-g2b)}:root[data-theme="dark"] .g-boss .p9-gs .n{color:var(--p9-g3b);border-color:var(--p9-g3b)}

/* ======================= restyle v3 (business) — panel9 finish: chrome, More, insights, Connect, guides (form only) ======================= */
.p9-tbb{border-radius:var(--r-btn);transition:background-color var(--d-2)}
.p9-tbb:hover{background:var(--hover-tint)}
.p9-card,.p9-ic,.p9-news,.p9-mkt,.p9-hc,.p9-prem,.p9-inv,.p9-msg,.p9-comp,.p9-gd-v,.p9-gs,.p9-hcard,.p9-iv,.p9-pimg,.p9-padd{border-radius:var(--r-card)}
.p9-card,.p9-ic,.p9-news{box-shadow:var(--sh-1)}
/* More: navigable tiles lift, rows get a soft hover */
.p9-tile{border-radius:var(--r-card);box-shadow:inset 0 0 0 1px var(--line),var(--sh-1);transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease),background-color var(--d-2)}
.p9-tile:hover{background:var(--p-card)}
@media (hover:hover){.p9-tile:hover{transform:translateY(var(--lift));box-shadow:inset 0 0 0 1px var(--line),var(--sh-2)}}
.p9-tile:active{transform:scale(.985)}
.p9-row{border-radius:var(--r-ctl);transition:background-color var(--d-2)}
.p9-row:hover{background:var(--hover-tint)}
.p9-hc{transition:transform var(--d-3) var(--ease),box-shadow var(--d-3) var(--ease)}
@media (hover:hover){.p9-hc:hover{transform:translateY(var(--lift));box-shadow:var(--sh-2)}}
/* insights: KPI figure + flat delta chip */
.p9-ic{padding:18px}
.p9-ic-h b{font-size:13.5px;font-weight:600;color:var(--ink-2)}
.p9-big{font-size:clamp(24px,1rem + .8vw,30px);font-weight:650;line-height:1.2;margin-top:8px}
.p9-chg{height:22px;padding:0 8px;border-radius:var(--r-pill);background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line);font-size:12px;font-weight:600;gap:3px}
.p9-seg{border-radius:var(--r-ctl);padding:3px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
.p9-seg button{border-radius:7px;font-weight:500;color:var(--p-seg-ink);transition:background-color var(--d-2),color var(--d-2),box-shadow var(--d-2)}
.p9-seg button[aria-selected="true"]{background:var(--p-seg-on);color:var(--ink);box-shadow:var(--sh-seg)}
.p9-lc,.p9-sr-i,.p9-news-img,.p9-tcl span,.p9-wsic,.p9-coll span{border-radius:var(--r-ctl)}
.p9-thm button{border-radius:var(--r-card)}
.p9-pcard,.p9-cnb,.p9-ill,.p9-earn-s{border-radius:var(--r-lg)}
/* ======================= end restyle v3 (business) — panel9 ======================= */

/* ======================= restyle v3 palette (business) — Accord LIGHT colours (panel9) =======================
   Guide levels / Connect / help / invite: Accord deep stage hues + night + emerald (white text ≥4.5:1). Dark blocks at the
   top of this file keep the owner's dark values. */
:root{
  --p9-g1:#0b6f7c; --p9-g1b:#0f8a9b; --p9-g2:#17734f; --p9-g2b:#1f8f5f; --p9-g3:#a8394a; --p9-g3b:#bf4a5c;
  --p9-cn1:#0b7658; --p9-cn2:#14231d; --p9-tm1:#17734f; --p9-tm2:#1f8f5f; --p9-earn:#0b6f7c; --p9-on:var(--ok-soft); --p9-on-ink:var(--ok);
  --p9-red:#b42318; --p9-reqbg:#b42318; --p9-navy:#14231d; --p9-inv1:#14231d; --p9-inv2:#0b5440; --p9-cn3:#0b6f7c; --p9-help:#0b7658; --p9-help2:#0b6f7c;
  --p9-fill:var(--night);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p9-fill:var(--brand)}}
:root[data-theme="dark"]{--p9-fill:var(--brand)}
.p9-mkt{background:var(--p9-fill)}
/* ======================= end restyle v3 palette (business) panel9 ======================= */


/* papp — Fresha business phone app: the same pages as the panel's mobile layout inside the phone frame. Prefix m-. */
html.bare [data-ver="papp"] .phone{height:max(100dvh,844px)}
/* the phone screen's view (below the status bar) is the containing block of the panel's position:fixed full-screen pages and bars (p2-fm, p3-full,
   p8-full, p2-up, bottom bars), so they stay inside the phone frame instead of covering the whole browser window */
.screen[data-app="papp"]>.app-view{contain:layout}

/* ======================= restyle v3 palette (business) — Accord LIGHT colours (papp + panel phone layout) =======================
   Raised «+» of the phone tab bar = night (Accord action colour) with a night-tinted glow; dark = previous purple. */
[data-app="panel"],[data-app="papp"]{--q-accent:var(--night); --q-on-accent:var(--on-night); --q-fab-sh:0 10px 22px -6px #14231d8c,0 2px 4px #14231d24; --q-tb-bg:var(--bg)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is([data-app="panel"],[data-app="papp"]){--q-accent:#6950f3; --q-on-accent:#ffffff; --q-fab-sh:0 8px 18px -4px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06); --q-tb-bg:var(--bg-2)}}
:root[data-theme="dark"] :is([data-app="panel"],[data-app="papp"]){--q-accent:#6950f3; --q-on-accent:#ffffff; --q-fab-sh:0 8px 18px -4px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06); --q-tb-bg:var(--bg-2)}
/* ======================= end restyle v3 palette (business) papp ======================= */


/* Q7-035: the cover tag and «کاور کن» on the venue image thumbnails */
.p6-drop>.p6-thumbs{flex-direction:row;min-height:0;background:none;border-radius:0;padding:0 0 6px}   /* the row .p6-thumbs means: «.p6-drop>div» had turned it into a grey column */
.p6-vimgs .p6-th1{cursor:grab}.p6-vcov{position:absolute;inset-inline:4px;bottom:4px;border:0;border-radius:6px;background:var(--bg);color:var(--ink);font:600 11px/18px var(--f);text-align:center;cursor:pointer}.p6-vcov.on{background:var(--ink);color:var(--bg)}
.p6-ordl{display:flex;flex-direction:column;gap:10px}.p6-ordr{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line,#eee)}.p6-ordr>div{flex:1;display:flex;flex-direction:column}.p6-ordr small{color:var(--muted,#777)}.p6-ordr input{width:96px;text-align:center}
.p4-cst-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-inline-end:8px;vertical-align:middle}
.p5-segf{display:flex;align-items:center;gap:12px;margin:0 0 12px;padding:10px 14px;border-radius:12px;background:var(--p-soft,#f4f1ec)}
.p5-segf span{flex:1}.p5-segf-0{margin:0 0 12px}
/* v8 fixes (ChatGPT audit Q7, 1405-07-29) */
/* Q7-001: the site's photo viewer (sLayer full) sits above the gallery dialog (.ov 910) */
.s-ddl{z-index:920}
/* Q7-010: the panel's full-screen pages (client profile, add / edit client, new segment) start below the demo bar */
[data-app="panel"][data-shell="page"] .app-view>:is(.p5-cp,.p5-fm,.p5-sn){top:var(--hub-h)}
/* Q7-017: a full-screen intro (.p2-up) or the phone shifts page covers the whole screen and has its own back button, so the
   tab bar is hidden under it (as with .p-promo) instead of covering its «شروع کنید» / «بیشتر بدانید» bar */
@container (max-width:600px){.p-app:has(.p2-up,.p2-sh-mob) .p-tabbar{display:none}}
/* Q7-008: the portfolio intro's collage (negative bottom margin) lay over the «ادامه» footer; the footer is lifted above it */
@container (min-width:601px){.p9-fs-f{position:relative;z-index:1}}
/* Q7-033: the review step's discount-code box (the gift-card code field's look) */
.c-dc .c-btn{margin-top:12px}.c-dc p:not(.c-err){margin-bottom:12px}
.s2-dc .s2-gca2-c{margin-top:0}.s2-dc .s2-btn{margin-top:12px}.s2-dc-e{margin-top:8px;font:400 14px/20px var(--f)}
/* Q7-022: the purchase row's text column ignores the pointer, so its «لغو عضویت» link takes it back */
.c-arow-b .c-link{pointer-events:auto;align-self:flex-start}
/* Q7-002/012/025: the service editor's saved photos (with a remove button), a form's «فعال» status and the resource list */
.p6-th1{position:relative;display:inline-flex}
.p6-th-x{position:absolute;top:-6px;inset-inline-end:-6px;width:22px;height:22px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:600 14px/1 var(--f);cursor:pointer}
.p6-ok{font-style:normal;color:var(--ok,#16a34a)}
.p6-res{display:flex;flex-direction:column;gap:12px}
/* Q7-023: a photo sent in the salon's chat */
.p9-mimg{display:block;max-width:220px;max-height:220px;border-radius:12px;object-fit:cover}
@font-face{font-family:'IRANSansX';src:url('/assets/IRANSansXFaNum-Regular-DXxhdWXb.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IRANSansX';src:url('/assets/IRANSansXFaNum-Medium-C42ZCwRn.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'IRANSansX';src:url('/assets/IRANSansXFaNum-DemiBold-BsXUFZgZ.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'IRANSansX';src:url('/assets/IRANSansXFaNum-Bold-D2LZRy8C.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'IRANSansX';src:url('/assets/IRANSansXFaNum-ExtraBold-CgZ-4DhW.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap}
/* TASK-K-LOOK-V12 (lock docs/audit/TASK-K-LOOK-V12-LOCK.md §2): demo v12's global rules over the v8 lift, each under
 * its v12 line (~/dev/gheichy-demo-v12/gheichy-demo-v12.html, read only). The rows are src/v12-global.rules.ts's
 * V12_GLOBAL in its order; test/v12-global.test.ts pins this file to it. Imported right after demo-v8.css. */
/* v12 32606 */
html{text-wrap:pretty}
/* v12 32578 */
.s2-done h1,.s-au-hd p,.s2-bk-h h1,.s3-dl-in h1{text-wrap:balance}
/* v12 108 */
:root[data-theme="dark"]{--ink-3:#818181}
/* v12 89 */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--ink-3:#818181}}
/* v12 32724 */
:root[data-theme="dark"]{--sel:#6950f3}
/* v12 32725 */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--sel:#6950f3}}
/* v12 32726 */
:root[data-theme="dark"] .p2-rg-c em,:root[data-theme="dark"] .p5-rg-c .p-rg-open,:root[data-theme="dark"] .p4-adh.st-done{background:#1f8900}
/* v12 32726 */
:root[data-theme="dark"] .p-btn.p6-bad,:root[data-theme="dark"] .p-btn.p7-bad,:root[data-theme="dark"] .p8-bad,:root[data-theme="dark"] .s3-btn.danger{background:#d4163a;border-color:#d4163a}
/* v12 32726 */
:root[data-theme="dark"] .p4-adh.st-noshow,:root[data-theme="dark"] .p4-adh.st-cancelled{background:#d4163a}
/* v12 32726 */
:root[data-theme="dark"] .p4-adh.st-started{background:var(--p-act)}
/* v12 32726 */
:root[data-theme="dark"] .p4-adh{background:#2771ec}
/* v12 32726 */
:root[data-theme="dark"] .s-scard.on,:root[data-theme="dark"] .s-scard.on small,:root[data-theme="dark"] .s-dcard.on,:root[data-theme="dark"] .s-dcard.on small{color:#8d86ff}
/* v12 32727 */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .p2-rg-c em,:root:not([data-theme="light"]) .p5-rg-c .p-rg-open,:root:not([data-theme="light"]) .p4-adh.st-done{background:#1f8900}}
/* v12 32727 */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .p-btn.p6-bad,:root:not([data-theme="light"]) .p-btn.p7-bad,:root:not([data-theme="light"]) .p8-bad,:root:not([data-theme="light"]) .s3-btn.danger{background:#d4163a;border-color:#d4163a}}
/* v12 32727 */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .p4-adh.st-noshow,:root:not([data-theme="light"]) .p4-adh.st-cancelled{background:#d4163a}}
/* v12 32727 */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .p4-adh.st-started{background:var(--p-act)}}
/* v12 32727 */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .p4-adh{background:#2771ec}}
/* v12 32727 */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .s-scard.on,:root:not([data-theme="light"]) .s-scard.on small,:root:not([data-theme="light"]) .s-dcard.on,:root:not([data-theme="light"]) .s-dcard.on small{color:#8d86ff}}
/* v12 32730 */
:root[data-theme="dark"]{--p9-fill:#6950f3}
/* v12 32731 */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--p9-fill:#6950f3}}
/* K-HOME11 C-1: v11:5452 (its container), 5483, 5494 (the container closed) */
@container (max-width:600px){
  .s-car--hm .s-car-i{width:240px}
}
/* K-HOME11 C-2: v11:5687-5712 */
/* ======================= home below the slider like Fresha (owner 1405-08-06) =======================
   «از زیر اسلایدر و از دسته‌بندی»: header and slider stay full width; categories, promos, every row and the sections under
   them sit in one centred 1376px column with empty sides; each card row shows exactly four Fresha venue cards (322×214 at
   1376), 28px apart, the round arrow on the column's edge at the photo's middle. ≥1024 only; tablet/phone unchanged. */
@container (min-width:1024px){
  [data-app="site"] .s-page--home :is(.s-hm>.s-hm-sec,.s-hm>.s-hm-promos,.s-hm>.s-hm-note,.s-secs>.s-sec,.s-sec--rv,.s-sec--city,.s-catp){max-width:1376px;width:calc(100% - 2*var(--sg));margin-inline:auto;padding-inline:0}
  [data-app="site"] .s-page--home :is(.s-hm-h,.s-hm-cats,.s-hm-promos,.s-hm .s-car,.s-sec>.s-h2,.s-sec>.s-car){padding-inline:0}
  [data-app="site"] .s-page--home .s-car:not(.s-car--rv,.s-car--city,.s-car--pills){--hm-w:min(1376px,100cqw - 2*var(--sg));padding:0}
  [data-app="site"] .s-page--home .s-car:not(.s-car--rv,.s-car--city,.s-car--pills) .s-car-t{gap:28px;margin-inline:0;padding-inline:0;scroll-padding:0}
  [data-app="site"] .s-page--home .s-car:not(.s-car--rv,.s-car--city,.s-car--pills) .s-car-i{width:calc((var(--hm-w) - 84px)/4)}
  [data-app="site"] .s-page--home .s-car:not(.s-car--rv,.s-car--city,.s-car--pills) :is(.s-vc-im,.s-ba-im){height:auto;aspect-ratio:322/214}
  [data-app="site"] .s-page--home .s-car:not(.s-car--rv,.s-car--city,.s-car--pills) .s-car-b{top:calc(24px + (var(--hm-w) - 84px)/4*214/322/2 - 24px)}
  [data-app="site"] .s-page--home .s-car:not(.s-car--city,.s-car--pills) .s-car-next{left:-24px}
  [data-app="site"] .s-page--home .s-car:not(.s-car--city,.s-car--pills) .s-car-prev{right:-24px}
  /* Fresha's proportions at 1900: heading ~30px, title 17px, grey lines 15px, ~72px between rows */
  [data-app="site"] .s-page--home :is(.s-hm,.s-secs){gap:72px}
  [data-app="site"] .s-page--home :is(.s-hm-sec,.s-secs>.s-sec) .s-h2{font-size:30px;line-height:40px}
  [data-app="site"] .s-page--home .s-vc-n{font-size:17px;line-height:24px}
  [data-app="site"] .s-page--home .s-vc-m{font-size:15px;line-height:22px}
  /* owner 1405-08-06 «دسته‌بندی‌ها اندازهٔ کارت‌های زیرش»: the 22 tiles fill the same column edge to edge, 11 a row */
  [data-app="site"] .s-page--home .s-hm .hm22{grid-template-columns:repeat(11,minmax(0,1fr));gap:24px 16px;padding:0;justify-content:stretch;overflow:visible}
  [data-app="site"] .s-page--home .s-hm .hm22>button{width:auto;gap:10px}
  [data-app="site"] .s-page--home .s-hm .hm22>button>span:first-child,[data-app="site"] .s-page--home .s-hm .hm22>button:is(:hover,:active)>span:first-child{width:100%;height:auto;aspect-ratio:1;max-height:112px;border-radius:20px}
  [data-app="site"] .s-page--home .s-hm .hm22>button>span:first-child .i{width:34px!important;height:34px!important}
  [data-app="site"] .s-page--home .s-hm .hm22>button>span:last-child{font-size:14px;line-height:20px}
}
/* K-HOME11 C-3: v11:32381-32388 */
/* v10 F-4b/F-4c: Fresha's tile (owner's shot ×1.21): tile 56 radius 17 light grey + hairline, no shadow, icon 24 stroke 1.9 ink, column 74 + gap 4, label 11 one line 8 under the tile, 16 from a label to the next row's tile */
.hm22{display:grid;grid-auto-flow:row;grid-template-columns:repeat(11,74px);grid-template-rows:none;grid-auto-rows:auto;gap:16px 4px;justify-content:safe center;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-padding-inline:16px}
[data-app] .hm22,[data-app="site"] .s-hm .hm22{padding:0 16px}
.hm22::-webkit-scrollbar{display:none}
.hm22>button{display:flex;flex-direction:column;align-items:center;gap:8px;width:74px;min-width:0;min-height:0}
.hm22>button>span:first-child,.hm22>button:hover>span:first-child,.hm22>button:active>span:first-child{width:56px;height:56px;border-radius:17px;flex:none;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line);transform:none;color:var(--ink)}
.hm22>button>span:first-child .i{width:24px!important;height:24px!important;stroke-width:1.9;color:var(--ink)}
.hm22>button>span:last-child{display:block;font-size:11px;font-weight:500;line-height:18px;color:var(--ink);white-space:nowrap;overflow:visible;-webkit-line-clamp:unset;text-align:center}
/* HOME-CLAIMS-CHECK OP-HC-1, OP-HC-4 (I-061), its own sheet (home11.css is v11's text alone, T-4): «به‌زودی» in place of Fresha's rank sentence keeps v8's paragraph box at every width:
   v8 12783's text measured at each container width 300…1920 (IRANSansX, 24px lines below 601): four lines to 315, three
   to 453, two to 600; from 601 both are two 36px lines, so no floor there. */
@container (max-width:600px){.s-biz-t>p{min-height:48px}}
@container (max-width:453px){.s-biz-t>p{min-height:72px}}
@container (max-width:315px){.s-biz-t>p{min-height:96px}}
/* TASK-K-PAYLINK §12 (lock rev. 0.7, part 5a) P-C3: v12's rules of the pay page, as v12 has them and in its order:
   1607-1653 (UR5 C10 R-4), 32962-32968 (fparity c7, the tips), 33002 (fparity c8 «به‌زودی»), 33574-33575 (the spinner). */
.ur-pl .s2-bk-h h1{margin-bottom:4px}
.ur-plr{display:flex;justify-content:space-between;gap:12px;font-size:15px;line-height:22px;padding:4px 0}
.ur-plr span{color:var(--ink-2)}.ur-plr.t span,.ur-plr.t b{color:var(--ink);font-weight:700;font-size:17px}
.ur-pll{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:8px 0}
.ur-pll>span{display:flex;flex-direction:column;gap:2px}.ur-pll small{color:var(--ink-2);font-size:13px}.ur-pll s{opacity:.7}
.ur-plbill .s2-hr{margin:12px 0}
.c7-tips.ur-pltips{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.ur-pl .c7-tips.ur-pltips{grid-template-columns:repeat(3,1fr)}
.ur-pl .c7-tip{display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 8px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);background:var(--bg);font-size:13px}
.ur-pl .c7-tip b{font-size:16px}
.c7-tip:disabled,.ur-plcus:disabled{opacity:.55;cursor:not-allowed}
.ur-plcus{margin-top:8px;width:100%}
.ur-pltn{font-size:13px;line-height:20px;margin-top:10px}
.ur-pllog{margin-top:12px;font-size:14px;color:var(--ink-2)}
.ur-plsec{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:20px;font-size:13px;color:var(--ink-2)}
.ur-plsec .i{width:16px;height:16px}
.ur-plv .s2-rt{display:flex;align-items:center;gap:4px;font-size:13px}
.ur-plok{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:8px 0 4px}
.ur-plok b{font-size:22px;line-height:30px}
.ur-plok-ic{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--brand);color:#fff}
.ur-plok-ic .i{width:28px;height:28px}
.ur-plh,.ur-cplh{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ur-plh{margin-bottom:16px}
/* v12's `.ur-plh h2{margin:0}` (1629) loses to its later `.s2-cbox h2{margin-bottom:16px}` (1983); here it would win
   (this sheet comes after the base), so the cascade's result is written out */
.ur-plh h2{margin:0 0 16px}
.ur-plst{font-size:12px;font-weight:600;padding:2px 10px;border-radius:999px;background:color-mix(in srgb,#1f9d55 14%,transparent);color:#1f8a4c}
.ur-plst.part{background:color-mix(in srgb,#c08a1e 16%,transparent);color:#9a6b0d}
.ur-plsub{font-weight:600;margin:4px 0}
.ur-plcode{font-size:13px;color:var(--ink-2);margin-top:8px}
.ur-plinv{margin-top:12px;display:inline-flex;align-items:center;gap:6px}
.ur-placts{display:flex;flex-wrap:wrap;gap:8px}
.ur-plcl p{display:flex;align-items:center;gap:8px;margin-bottom:12px}.ur-plcl p:last-child{margin:0}
.ur-plwait,.ur-plw{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:16px 0}
.ur-spin{width:32px;height:32px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--brand);animation:ur-rot .9s linear infinite}
@keyframes ur-rot{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ur-spin{animation-duration:3s}}
.ur-plw-st{font-weight:600}
.ur-plbox{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);margin:12px 0;font-size:14px;overflow-wrap:anywhere}
.ur-plpend{margin-bottom:12px}
.ur-cplsub{margin:-4px 0 16px;font-size:14px}
.ur-cplrt{display:flex;align-items:center;gap:4px}.ur-cplrt .c-stars{display:inline-flex}
.ur-cplsec{display:flex;align-items:center;justify-content:center;gap:6px;margin:20px 0 8px;font-size:13px;color:var(--ink-2)}
.ur-cplsec .i{width:16px;height:16px}
.ur-cplinv{margin:12px 0;display:inline-flex;gap:6px;align-items:center}
.ur-cplacts{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 16px}
.ur-cplcl{padding:16px}.ur-cplcl p{display:flex;align-items:center;gap:8px;margin-bottom:12px}.ur-cplcl p:last-child{margin:0}
.ur-plvm{display:none}
@container (max-width:999px){.ur-pl .ur-plvm{display:block;padding:16px}}
@container (min-width:1000px){.ur-pl .s2-bk-main{padding-top:56px}}
.c7-tips{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.c7-tip{display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 8px;border-radius:var(--r-card);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--bg)}
.c7-tip b{font-size:18px;line-height:24px}
.c7-tip span{font-size:13px;line-height:18px;color:var(--ink-2)}
.c7-tip.on{box-shadow:inset 0 0 0 2px var(--ink)}
.c7-tipm{display:block;margin:12px 0 0;min-height:44px}
.c7-tipb .c-h3a{margin-top:20px}
.c8-soon{font-style:normal;font:500 12px/16px var(--f);color:var(--ink-2);background:var(--bg-2);border-radius:999px;padding:2px 8px;margin-inline-start:8px;flex:none}
.ur-spin{display:inline-block;width:40px;height:40px;border-radius:50%;border:3px solid var(--brand-soft);border-top-color:var(--brand);animation:ur-sp 1s linear infinite}
@keyframes ur-sp{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.ur-spin{animation:none}}
/* v12's 32578 (F-15) and 32606 (F-29), scoped to the pay page and its wait window (the site's base has neither) */
.ur-pl .s2-bk-h h1{text-wrap:balance}
.ur-pl,.ur-plwm{text-wrap:pretty}
/* TASK-K-PAYLINK §12 (lock rev. 0.8a, part 5b) P-C4: the app's pay page (`?v=app`, way «ب»). v12's rules matched by
   `#capp.paylink.bare` in every state (bill, method sheet, paying sheet, receipt, claim, the three bad states), as v12
   has them and in its order, each scoped to the page's `.screen.ur-pla` (`:is(.ur-pla,.ur-pla *)` on its last
   compound; the frame's `.stage` and `.phone` by `:has`) so no site page sees them. The page is always bare: v12's
   `html.bare` rules hold unconditionally. v12's `:root[data-theme="dark"]` rules are left out: each has its
   `prefers-color-scheme` twin, kept. */
@keyframes c-rot{to{transform:rotate(360deg)}}
@keyframes c-up{from{transform:translateY(40%);opacity:.4}}
@keyframes fq-fade{from{opacity:0}}
:root:has(.ur-pla) { --ink: #14231d; --ink-2: #45554e; --ink-3: #5c6a63; --ink-4: #b3c4bb; --page: #f6f6f1; --bg: #fffffd; --bg-2: #f1f2ec; --bg-3: #e7e9e2; --bg-4: #fbfbf8; --band: #e2efe8; --band-2: #cde2d6; --line: #e5e7df; --line-2: #d6d9cf; --night: #14231d; --night-2: #213a2f; --on-night: #f2f5f0; --on-night-2: #b3c4bb; --sel: var(--night); --on-sel: var(--on-night); --accent: #12a079; --accent-deep: #0b7658; --accent-soft: #d3eee2; --accent-ring: #12a0793d; --brand: #0b7658; --brand-2: #08654b; --brand-3: #0b5440; --brand-soft: #d3eee2; --brand-soft-2: #cde2d6; --brand-soft-3: #b9dccb; --ok: #17734f; --ok-soft: #dcf1e7; --ok-2: #d6f0e2; --bad: #b42318; --bad-2: #9b1e15; --bad-soft: #fbe2df; --warn: #9a5a06; --warn-soft: #fbeed6; --star: #e0a21a; --blue: #0b6f7c; --blue-soft: #d2eef2; --rose: #a8394a; --rose-soft: #fbdfe2; --on-ink: #f2f5f0; --ink-web: #14231d; --scrim: rgb(8 16 12 / .45); --glass: rgba(255,255,253,.72); --sh-card: 0 1px 0 #14231d08,0 10px 28px -20px #14231d47,0 0 0 1px #e5e7df; --sh-pop: 0 2px 0 #14231d08,0 26px 50px -24px #14231d6b,0 0 0 1px #e5e7df; --sh-small: 0 1px 2px #14231d24; --inset: inset 0 0 0 1px #e5e7df; --f: 'IRANSansX',sans-serif; --f-serif: 'IRANSansX',sans-serif; --hub-h: 55px; --r-xs: 6px; --r-sm: 8px; --r-ctl: 10px; --r-btn: 12px; --r-md: 12px; --r-card: 14px; --r-lg: 18px; --r-xl: 22px; --r-pill: 999px; --bw: 1px; --bd: var(--bw) solid var(--line); --bd-2: var(--bw) solid var(--line-2); --sh-1: 0 1px 0 #14231d08,0 10px 28px -20px #14231d47; --sh-2: 0 2px 0 #14231d08,0 26px 50px -24px #14231d6b; --sh-3: 0 30px 80px -20px #08100c80,0 0 0 1px #14231d0a; --sh-pop-2: 0 14px 30px -14px #14231d8c,0 0 0 1px #14231d0d; --sh-seg: 0 1px 2px #14231d24,inset 0 0 0 1px var(--line); --ring: 0 0 0 3px var(--accent-ring); --ring-c: var(--accent); --band-hover: #14231d0f; --hover-tint: color-mix(in srgb,var(--ink) 5%,transparent); --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-7: 28px; --s-8: 32px; --s-10: 40px; --s-12: 48px; --edge: clamp(16px,2.2vw,40px); --gap: clamp(14px,1.2vw,20px); --pad: clamp(16px,1.3vw,22px); --t-cap: 12px; --t-sm: 13.5px; --t-md: 15px; --t-lg: 18px; --t-xl: 22px; --t-h2: clamp(20px,1rem + .6vw,26px); --t-title: clamp(26px,1.1rem + 1.4vw,36px); --t-fig: clamp(26px,1.2rem + 1.1vw,38px); --lh-tight: 1.3; --lh-head: 1.35; --tr-head: -.012em; --tr-fig: -.03em; --tr-label: .01em; --w-head: 700; --w-title: 650; --w-label: 600; --h-ctl: 40px; --h-ctl-sm: 34px; --h-chip: 34px; --h-btn: 44px; --ease: cubic-bezier(.22,1,.36,1); --ease-spring: cubic-bezier(.34,1.56,.64,1); --d-1: .15s; --d-2: .2s; --d-3: .3s; --lift: -2px; --sh-card-1: inset 0 0 0 1px var(--line),var(--sh-1); --sh-card-h: inset 0 0 0 1px var(--line-2),var(--sh-2); --sh-card-on: inset 0 0 0 2px var(--brand),var(--sh-1); color-scheme: light; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --ink: #f5f5f5; --ink-2: #bfbfbf; --ink-3: #818181; --ink-4: #626262; --bg: #0d0d0d; --bg-2: #181818; --bg-3: #262626; --bg-4: #131313; --line: #333333; --line-2: #404040; --page: #0d0d0d; --band: #0d0d0d; --band-2: #262626; --band-hover: color-mix(in srgb,#f5f5f5 7%,transparent); --night: #f5f5f5; --night-2: #d9d9d9; --on-night: #0d0d0d; --on-night-2: #404040; --sel: var(--brand); --on-sel: #ffffff; --accent: #8880ff; --accent-deep: #8880ff; --accent-soft: #201e45; --accent-ring: color-mix(in srgb,#8880ff 32%,transparent); --rose: #f0828e; --rose-soft: #47222a; --brand: #8880ff; --brand-2: #b0b1fd; --brand-3: #d1d4ff; --brand-soft: #201e45; --brand-soft-2: #2b2660; --brand-soft-3: #403591; --ok: #45b020; --ok-soft: #182914; --ok-2: #18390e; --bad: #ff4360; --bad-2: #fe9a9a; --bad-soft: #421015; --warn: #f19101; --warn-soft: #371c0c; --star: #ffc00a; --blue: #5791f0; --blue-soft: #133263; --on-ink: #0d0d0d; --scrim: rgba(0,0,0,.6); --glass: rgba(29,29,29,.7); --ink-web: #e8eaee; --sh-card: 0 0 0 1px #262626; --sh-pop: 0 2px 8px 0 rgba(0,0,0,.4),0 4px 20px 0 rgba(0,0,0,.5),0 0 0 1px #262626; --sh-small: 0 2px 4px 0 rgba(0,0,0,.5); --inset: inset 0 0 0 1px #333333; --sh-1: 0 0 0 1px #262626,0 12px 30px -20px rgba(0,0,0,.7); --sh-2: 0 0 0 1px #333333,0 28px 54px -24px rgba(0,0,0,.85); --sh-3: 0 30px 80px -20px rgba(0,0,0,.8),0 0 0 1px #333333; --sh-pop-2: 0 18px 44px -18px rgba(0,0,0,.75),0 0 0 1px #333333; --sh-seg: 0 1px 2px rgba(0,0,0,.5),inset 0 0 0 1px var(--line); --ring: 0 0 0 3px color-mix(in srgb,var(--brand) 32%,transparent); --hover-tint: color-mix(in srgb,var(--ink) 7%,transparent); color-scheme: dark; } }
:is(.ur-pla,.ur-pla *), :is(.ur-pla,.ur-pla *)::before, :is(.ur-pla,.ur-pla *)::after { box-sizing: border-box; }
html:has(.ur-pla) { direction: rtl; text-size-adjust: 100%; }
body:has(.ur-pla) { margin: 0px; background: var(--page); color: var(--ink); font: 400 16px/1.5 var(--f); -webkit-font-smoothing: antialiased; overflow-x: hidden; text-rendering: optimizelegibility; }
h1:is(.ur-pla,.ur-pla *), h2:is(.ur-pla,.ur-pla *), h3:is(.ur-pla,.ur-pla *), h4:is(.ur-pla,.ur-pla *), p:is(.ur-pla,.ur-pla *) { margin: 0px; }
button:is(.ur-pla,.ur-pla *), input:is(.ur-pla,.ur-pla *), select:is(.ur-pla,.ur-pla *), textarea:is(.ur-pla,.ur-pla *) { font: inherit; color: inherit; }
button:is(.ur-pla,.ur-pla *) { cursor: pointer; background: none; border: 0px; padding: 0px; }
img:is(.ur-pla,.ur-pla *) { display: block; max-width: 100%; }
.i:is(.ur-pla,.ur-pla *) { width: 20px; height: 20px; flex: 0 0 auto; }
:focus-visible:is(.ur-pla,.ur-pla *) { outline: 2px solid var(--ring-c); outline-offset: 2px; }
.sr:is(.ur-pla,.ur-pla *) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { :is(.ur-pla,.ur-pla *), :is(.ur-pla,.ur-pla *)::before, :is(.ur-pla,.ur-pla *)::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; } }
.toast:is(.ur-pla,.ur-pla *) { border-radius: var(--r-md); box-shadow: var(--sh-pop-2); font-size: var(--t-sm); transition: opacity var(--d-3) var(--ease),transform var(--d-3) var(--ease); }
.ov:is(.ur-pla,.ur-pla *) { animation: fq-fade var(--d-2) var(--ease); }
html:has(.ur-pla) { --hub-h: 0px; }
.stage:has(.ur-pla) { display: flex; justify-content: center; padding: 28px 16px 48px; }
.phone:has(.ur-pla) { width: 390px; height: 844px; border-radius: 54px; padding: 12px; background: rgb(17, 17, 17); box-shadow: rgba(0, 0, 0, 0.45) 0px 30px 60px -20px, rgb(42, 42, 42) 0px 0px 0px 2px inset; position: relative; flex: 0 0 auto; }
.phone:has(.ur-pla)::before { content: ""; position: absolute; top: 22px; left: 50%; transform: translateX(-50%); width: 118px; height: 32px; border-radius: 20px; background: rgb(0, 0, 0); z-index: 30; }
.screen:is(.ur-pla,.ur-pla *) { position: relative; width: 100%; height: 100%; border-radius: 42px; overflow: hidden; background: var(--bg); display: flex; flex-direction: column; isolation: isolate; container-type: inline-size; }
.sbar:is(.ur-pla,.ur-pla *) { height: 50px; flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; padding: 6px 30px 0px; font: 600 15px/1 var(--f); direction: ltr; color: var(--ink); }
.sbar .sig i:is(.ur-pla,.ur-pla *) { display: block; width: 17px; height: 10px; border-radius: 2px; background: currentcolor; }
.screen .app-view:is(.ur-pla,.ur-pla *) { flex: 1 1 0%; min-height: 0px; display: flex; flex-direction: column; }
.screen .scroll-host:is(.ur-pla,.ur-pla *) { flex: 1 1 0%; min-height: 0px; overflow: hidden auto; scrollbar-width: none; position: relative; }
.screen .scroll-host:is(.ur-pla,.ur-pla *)::-webkit-scrollbar { display: none; }
.screen .ov:is(.ur-pla,.ur-pla *) { border-radius: 42px; overflow: hidden; position: absolute !important; }
@media (max-width: 440px) { .stage:has(.ur-pla) { padding: 0px; } }
@media (max-width: 440px) { .phone:has(.ur-pla) { width: 100%; height: calc(100dvh - var(--hub-h)); border-radius: 0px; padding: 0px; background: none; box-shadow: none; } }
@media (max-width: 440px) { .phone:has(.ur-pla)::before, .sbar:is(.ur-pla,.ur-pla *) { display: none; } }
@media (max-width: 440px) { .screen:is(.ur-pla,.ur-pla *), .screen .ov:is(.ur-pla,.ur-pla *) { border-radius: 0px; } }
@media (min-width: 441px) and (max-height: 960px) { .phone:has(.ur-pla) { height: max(560px,calc(100dvh - var(--hub-h) - 56px)); } }
@media (min-width: 441px) and (max-height: 600px) and (pointer: coarse) { .stage:has(.ur-pla) { padding: 0px; } }
@media (min-width: 441px) and (max-height: 600px) and (pointer: coarse) { .phone:has(.ur-pla) { height: calc(100dvh - var(--hub-h)); border-radius: 0px; padding: 0px; background: none; box-shadow: none; } }
@media (min-width: 441px) and (max-height: 600px) and (pointer: coarse) { .phone:has(.ur-pla)::before, .sbar:is(.ur-pla,.ur-pla *) { display: none; } }
@media (min-width: 441px) and (max-height: 600px) and (pointer: coarse) { .screen:is(.ur-pla,.ur-pla *), .screen .ov:is(.ur-pla,.ur-pla *) { border-radius: 0px; } }
.stage:has(.ur-pla) { padding: 0px; }
.phone:has(.ur-pla) { width: 100%; height: 100dvh; border-radius: 0px; padding: 0px; background: none; box-shadow: none; }
.phone:has(.ur-pla)::before, .sbar:is(.ur-pla,.ur-pla *) { display: none; }
.screen:is(.ur-pla,.ur-pla *), .screen .ov:is(.ur-pla,.ur-pla *) { border-radius: 0px; }
.ov:is(.ur-pla,.ur-pla *) { position: fixed; inset: 0px; z-index: 800; background: var(--scrim); display: grid; place-items: center; animation: 0.2s ease 0s 1 normal none running fq-fade; }
.mdl:is(.ur-pla,.ur-pla *) { background: var(--bg); color: var(--ink); max-height: 100%; overflow: auto; }
.toast:is(.ur-pla,.ur-pla *) { position: fixed; bottom: 24px; left: 50%; z-index: 950; transform: translate(-50%, 16px); opacity: 0; pointer-events: none; display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-radius: 12px; background: var(--ink); color: var(--on-ink); font-size: 14px; font-weight: 500; box-shadow: var(--sh-pop); transition: opacity 0.2s, transform 0.2s; max-width: calc(-32px + 100vw); }
.toast.show:is(.ur-pla,.ur-pla *) { opacity: 1; transform: translate(-50%, 0px); }
.screen .toast:is(.ur-pla,.ur-pla *) { position: absolute; bottom: 90px; }
[data-app]:is(.ur-pla,.ur-pla *) { container-type: inline-size; }
.ov:is(.ur-pla,.ur-pla *) { z-index: 910; }
:root:has(.ur-pla) { --q-accent: var(--night); --q-on-accent: var(--on-night); --q-on-photo: #ffffff; --q-pin-on: var(--accent); --q-tb-bg: var(--bg); --q-tb-h: 64px; --q-tb-r: 22px; --q-fab: 56px; --q-fab-rise: 22px; --q-tb-space: calc(var(--q-tb-h) + 24px + env(safe-area-inset-bottom,0px)); --q-tb-sh: drop-shadow(0 -1px 0 var(--line)) drop-shadow(0 -6px 14px rgba(19,19,19,.07)); --q-fab-sh: 0 10px 22px -8px #14231d8c,0 1px 2px #14231d1a; --q-pin-sh: drop-shadow(0 2px 3px rgba(19,19,19,.32)); --q-dot: rgba(255,255,255,.55); --q-photo-fade: linear-gradient(270deg,rgba(13,13,13,.72) 0%,rgba(13,13,13,.45) 48%,rgba(13,13,13,.05) 100%); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --q-tb-bg: var(--bg-2); --q-accent: #6950f3; --q-on-accent: #ffffff; --q-pin-on: #6950f3; --q-tb-sh: drop-shadow(0 -1px 0 var(--line)) drop-shadow(0 -6px 14px rgba(0,0,0,.55)); --q-fab-sh: 0 8px 18px -4px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06); --q-pin-sh: drop-shadow(0 2px 4px rgba(0,0,0,.7)); --q-dot: rgba(255,255,255,.45); } }
:root:has(.ur-pla) { --ok-deep: color-mix(in srgb,var(--ok) 80%,var(--ink)); --ink-2-deep: color-mix(in srgb,var(--ink-2) 80%,var(--ink)); --q-tb-sh: drop-shadow(0 -1px 0 var(--line)) drop-shadow(0 -10px 18px rgba(13,13,13,.05)); --q-fab-sh: 0 10px 22px -8px #14231d8c,0 1px 2px #14231d1a; }
:root:has(.ur-pla) { --s-glow-1: transparent; --s-glow-2: transparent; --s-hero-bg: var(--band); --s-map-land: #e2efe8; --s-map-park: #c4e3d2; --s-map-blk: #eceee7; --s-map-water: #a9dbe2; --s-map-st: #d6d9cf; --s-map-hw: #b3c4bb; --s-map-lab: #45554e; --s-promo: var(--night); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --s-glow-1: #d5d3ff; --s-glow-2: #ffd7ff; --s-hero-bg: transparent; --s-promo: #0d0d0d; --s-map-land: #1d2026; --s-map-park: #1b3426; --s-map-blk: #262626; --s-map-water: #16324a; --s-map-st: #363b44; --s-map-hw: #56627a; --s-map-lab: #c9ccd1; } }
:root:has(.ur-pla) { --s-canvas: var(--page); --s-top: var(--band); --s-top-home: var(--band); --s-big-open: var(--band-2); --s-best: var(--accent-deep); --s-pin-ph: var(--night); --s-biz-g: rgba(18,160,121,.30); --s-gp-ic: #0b7658; --s-gp-s2: #12a079; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --s-canvas: var(--bg); --s-top: var(--bg); --s-top-home: transparent; --s-big-open: linear-gradient(90deg,#c7c2ff 0%,#efc1fb 55%,#f8b5f3 100%); --s-best: #a93ae8; --s-pin-ph: #403591; --s-biz-g: rgba(214,255,90,.55); --s-gp-ic: #8e3fd1; --s-gp-s2: #b07de6; } }
:root:has(.ur-pla) { --s2-dot: #78d240; --s2-cnt: rgba(19,19,19,.05); --s2-side-sh: 0 4px 12px 0 rgba(19,19,19,.08),0 2px 6px 2px rgba(19,19,19,.02); --s2-map-l: #f2efe9; --s2-map-w: #8ed8ec; --s2-map-p: #cdebc4; --s2-map-mi: #ffffff; --s2-map-ro: #ffffff; --s2-map-tx: #8a8a8a; --s2-gift: #191f21; --s2-surf: #ffffff; --s2-ring: rgba(19,19,19,.1); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --s2-cnt: rgba(255,255,255,.08); --s2-side-sh: 0 0 0 0 transparent; --s2-surf: #181818; --s2-ring: rgba(255,255,255,.1); --s2-map-l: #1e2224; --s2-map-w: #0e2b38; --s2-map-p: #1b3022; --s2-map-mi: #2a2f33; --s2-map-ro: #3a4147; --s2-map-tx: #8a8f93; } }
.c7-tips.ur-pltips:is(.ur-pla,.ur-pla *) { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.c7-tip:disabled:is(.ur-pla,.ur-pla *), .ur-plcus:disabled:is(.ur-pla,.ur-pla *) { opacity: 0.55; cursor: not-allowed; }
.ur-pltn:is(.ur-pla,.ur-pla *) { font-size: 13px; line-height: 20px; margin-top: 10px; }
.ur-plh:is(.ur-pla,.ur-pla *), .ur-cplh:is(.ur-pla,.ur-pla *) { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ur-plst:is(.ur-pla,.ur-pla *) { font-size: 12px; font-weight: 600; padding: 2px 10px; border-radius: 999px; background: color-mix(in srgb, rgb(31, 157, 85) 14%, transparent); color: rgb(31, 138, 76); }
.ur-cplsub:is(.ur-pla,.ur-pla *) { margin: -4px 0px 16px; font-size: 14px; }
.ur-cplrt:is(.ur-pla,.ur-pla *) { display: flex; align-items: center; gap: 4px; }
.ur-cplrt .c-stars:is(.ur-pla,.ur-pla *) { display: inline-flex; }
.ur-cplsec:is(.ur-pla,.ur-pla *) { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 20px 0px 8px; font-size: 13px; color: var(--ink-2); }
.ur-cplsec .i:is(.ur-pla,.ur-pla *) { width: 16px; height: 16px; }
.ur-cplinv:is(.ur-pla,.ur-pla *) { margin: 12px 0px; display: inline-flex; gap: 6px; align-items: center; }
.ur-cplacts:is(.ur-pla,.ur-pla *) { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0px 16px; }
.ur-cplcl:is(.ur-pla,.ur-pla *) { padding: 16px; }
.ur-cplcl p:is(.ur-pla,.ur-pla *) { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.ur-cplcl p:last-child:is(.ur-pla,.ur-pla *) { margin: 0px; }
:root:has(.ur-pla) { --s2-dot: #22a06b; --s2-map-l: #eef1ea; --s2-map-w: #a9dbe2; --s2-map-p: #c4e3d2; --s2-map-tx: #5c6a63; --s2-gift: #14231d; --s2-surf: var(--bg); --s2-ring: #14231d1a; --s2-canvas: var(--page); --s2-tro-1: #0b7658; --s2-tro-2: #12a079; --s2-tro-3: #0b5440; --s2-gc-g: radial-gradient(42% 70% at 6% 22%,rgba(18,160,121,.75) 0%,rgba(11,118,88,.55) 32%,rgba(20,35,29,0) 72%),radial-gradient(30% 34% at 2% 72%,rgba(211,238,226,.35) 0%,rgba(20,35,29,0) 75%); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --s2-dot: #78d240; --s2-map-tx: #8a8f93; --s2-gift: #191f21; --s2-canvas: var(--bg-2); --s2-tro-1: #a259f5; --s2-tro-2: #b57af7; --s2-tro-3: #9b45f0; --s2-gc-g: radial-gradient(42% 70% at 6% 22%,rgba(150,112,214,.95) 0%,rgba(104,74,190,.75) 32%,rgba(25,31,33,0) 72%),radial-gradient(30% 34% at 2% 72%,rgba(176,82,170,.55) 0%,rgba(25,31,33,0) 75%); } }
:root:has(.ur-pla) { --s2-gc-brand: linear-gradient(225deg,#12a079 0%,#0b7658 55%,#14231d 100%); --s2-gc-solid: #0b7658; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --s2-gc-brand: linear-gradient(225deg,#ff7dfa 0%,#6950f3 55%,#6950f3 100%); --s2-gc-solid: #6950f3; } }
:root:has(.ur-pla) { --s3-ink: #14231d; --s3-mk2: #5c6a63; --s3-lav: #d3eee2; --s3-g1: #fbfbf8; --s3-faq: #f1f2ec; --s3-foot: #14231d; --s3-glass: rgba(255,255,253,.72); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --s3-ink: #f5f5f5; --s3-mk2: #bfbfbf; --s3-lav: #201e45; --s3-g1: #131313; --s3-faq: #262626; --s3-foot: #000; --s3-glass: rgba(29,29,29,.7); } }
:root:has(.ur-pla) { --s3p-pbl: linear-gradient(160deg,#0b7658,#14231d); --s3p-cta: radial-gradient(60% 90% at 100% 100%,#12a079 0,transparent 70%),linear-gradient(100deg,#0b7658 0%,#14231d 100%); --s3p-ph: linear-gradient(to left bottom,var(--s3-lav),rgba(18,160,121,.25),rgba(18,160,121,0)); --s3p-c-w: var(--page); --s3p-wal: #14231d; --s3p-p3: #0b7658; --s3p-p2: #9fd8c2; --s3p-p4: #14231d; --s3p-top: var(--band); --s3p-side: var(--bg-4); --s3p-p1: #12a079; --s3p-dlca: linear-gradient(115deg,#f1f2ec 0%,#e2efe8 30%,#cde2d6 60%,#b9dccb 100%); --s3p-son: var(--bg-2); --s3p-hero: linear-gradient(180deg,var(--band) 0,var(--band) 42%,#cde2d6 58%,#0b7658 76%,#14231d 100%); --s3p-c-b2: var(--page); --s3p-c-b4: var(--page); --s3p-ptic: linear-gradient(135deg,#12a079,#0b7658); --s3p-grad: linear-gradient(90deg,#0b7658,#12a079); --s3p-son-sh: inset 0 0 0 1px var(--line-2); --s3p-tmapc: rgba(18,160,121,.40); --s3p-posb: linear-gradient(135deg,#12a079,#0b7658); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --s3p-pbl: linear-gradient(160deg,#c43ea6,#e04a9b 40%,#9a6cf0); --s3p-cta: radial-gradient(40% 70% at 0% 60%,#f15ad1 0,transparent 70%),radial-gradient(35% 60% at 42% 20%,#9e8cff 0,transparent 70%),radial-gradient(60% 90% at 100% 100%,#4a00e8 0,transparent 70%),linear-gradient(100deg,#c637e5 0%,#8f2ef5 40%,#7a12f2 70%,#5a06ea 100%); --s3p-ph: linear-gradient(to left bottom,var(--s3-lav),rgba(167,131,251,.4),rgba(167,131,251,0)); --s3p-c-w: var(--bg); --s3p-wal: linear-gradient(253deg,#fa6cfd 0%,#c467fd 18%,#9563fe 30%,#6960ff 44%,#6960ff 100%); --s3p-p3: #5b48d6; --s3p-p2: #a18cff; --s3p-p4: #272063; --s3p-top: var(--bg); --s3p-side: var(--bg); --s3p-p1: #6950f3; --s3p-dlca: linear-gradient(115deg,#ebe9ff 0%,#e3ddff 30%,#7e6bff 60%,#6f5cff 100%); --s3p-son: var(--brand-soft); --s3p-hero: radial-gradient(70% 38% at 18% 70%,rgba(214,68,255,.75),transparent 70%),radial-gradient(60% 40% at 80% 80%,rgba(105,40,243,.95),transparent 70%),radial-gradient(90% 30% at 50% 92%,#7a24f1,transparent 80%),linear-gradient(180deg,var(--bg) 0,var(--bg) 42%,#a98bff 62%,#8a3cf4 80%,#6a1fe6 100%); --s3p-c-b2: var(--bg-2); --s3p-c-b4: var(--bg-4); --s3p-ptic: linear-gradient(135deg,#f06bff,#6950f3); --s3p-grad: linear-gradient(90deg,#ef6997,#e85cba,#b84cdc); --s3p-son-sh: none; --s3p-tmapc: rgba(105,80,243,.45); --s3p-posb: linear-gradient(135deg,#3b6cff,#8a5cff); } }
[data-app="capp"]:is(.ur-pla,.ur-pla *) { --c-map-land: #eef1ea; --c-map-water: #a9dbe2; --c-map-urb: #e2efe8; --c-map-park: #c4e3d2; --c-map-road: #d6d9cf; --c-map-hw: #b3c4bb; --c-map-lab: #14231d; --c-badge: rgba(255,255,253,.92); --c-hl: #d3eee2; --c-blue-g: #0b7658; --c-navy: #14231d; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) [data-app="capp"]:is(.ur-pla,.ur-pla *) { --c-map-land: #1d2026; --c-map-water: #16324a; --c-map-urb: #262626; --c-map-park: #1b3426; --c-map-road: #363b44; --c-map-hw: #56627a; --c-map-lab: #c9ccd1; --c-badge: rgba(13,13,13,.86); --c-hl: #2b2660; --c-blue-g: linear-gradient(135deg,#1d4fa6 0%,#3b7fd6 100%); --c-navy: #d1d4ff; } }
[data-app="capp"]:is(.ur-pla,.ur-pla *) { font-size: 14px; line-height: 20px; color: var(--ink); }
[data-app="capp"] .i:is(.ur-pla,.ur-pla *) { width: 24px; height: 24px; }
[data-app="capp"] img:is(.ur-pla,.ur-pla *) { width: 100%; height: 100%; object-fit: cover; }
.c-pg:is(.ur-pla,.ur-pla *) { position: relative; flex: 1 1 0%; min-height: 0px; display: flex; flex-direction: column; background: var(--cp-canvas); }
.c-sc:is(.ur-pla,.ur-pla *) { flex: 1 1 0%; min-height: 0px; overflow: hidden auto; scrollbar-width: none; position: relative; }
.c-sc:is(.ur-pla,.ur-pla *)::-webkit-scrollbar { display: none; }
.c-pad:is(.ur-pla,.ur-pla *) { padding: 0px 20px; }
.c-g:is(.ur-pla,.ur-pla *) { color: var(--ink-2); }
.c-link:is(.ur-pla,.ur-pla *) { color: var(--brand); font-weight: 400; }
.c-pt:is(.ur-pla,.ur-pla *) { font-size: 28px; line-height: 36px; font-weight: 600; }
.c-ib:is(.ur-pla,.ur-pla *) { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: var(--ink); }
.c-ib .i:is(.ur-pla,.ur-pla *) { width: 24px; height: 24px; }
.c-ib0:is(.ur-pla,.ur-pla *) { width: 48px; flex: 0 0 auto; }
.c-btn:is(.ur-pla,.ur-pla *) { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 999px; font-weight: 600; white-space: nowrap; flex: 0 0 auto; }
.c-btn-s:is(.ur-pla,.ur-pla *) { height: 48px; padding: 0px 16px; font-size: 16px; font-weight: 500; }
.c-btn-o:is(.ur-pla,.ur-pla *) { background: var(--bg); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-2); }
.c-btn-navy:is(.ur-pla,.ur-pla *) { background: var(--c-navy); color: var(--bg); height: 44px; padding: 0px 20px; border-radius: 8px; font-size: 14px; font-weight: 600; }
.c-top:is(.ur-pla,.ur-pla *) { flex: 0 0 auto; display: flex; align-items: center; height: 64px; padding: 0px 6px; background: var(--cp-canvas); position: relative; z-index: 10; }
.c-top-t:is(.ur-pla,.ur-pla *) { flex: 1 1 0%; min-width: 0px; font-size: 18px; line-height: 24px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-inline-start: 4px; }
.c-top-a:is(.ur-pla,.ur-pla *) { display: flex; align-items: center; }
.c-top-big .c-top-t:is(.ur-pla,.ur-pla *) { opacity: 0; transition: opacity 0.15s; }
.c-bigt:is(.ur-pla,.ur-pla *) { padding: 0px 20px; margin-bottom: 16px; }
.c-bigt h2:is(.ur-pla,.ur-pla *) { font-size: 28px; line-height: 36px; font-weight: 600; }
.c-bb:is(.ur-pla,.ur-pla *) { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 80px; padding: 16px 20px; background: var(--bg); border-top: 1px solid var(--line); position: relative; z-index: 10; }
.c-bb-l:is(.ur-pla,.ur-pla *) { display: flex; flex-direction: column; min-width: 0px; }
.c-bb-p:is(.ur-pla,.ur-pla *) { font-size: 16px; line-height: 22px; font-weight: 600; }
[data-app="capp"] .ov.c-ov:is(.ur-pla,.ur-pla *) { place-items: end stretch; background: var(--scrim); }
[data-app="capp"] .c-ov .mdl:is(.ur-pla,.ur-pla *) { width: 100%; max-height: calc(100% - 32px); border-radius: 28px 28px 0px 0px; display: flex; flex-direction: column; overflow: hidden; animation: 0.22s ease-out 0s 1 normal none running c-up; }
.c-shd:is(.ur-pla,.ur-pla *) { display: flex; align-items: center; gap: 8px; padding: 18px 20px 10px; flex: 0 0 auto; }
.c-shd h2:is(.ur-pla,.ur-pla *) { flex: 1 1 0%; font-size: 18px; line-height: 24px; font-weight: 600; }
.c-shd .c-ib-x:is(.ur-pla,.ur-pla *) { margin-inline-end: -12px; }
.c-shb:is(.ur-pla,.ur-pla *) { padding: 0px 20px 20px; overflow-y: auto; flex: 1 1 0%; min-height: 0px; scrollbar-width: none; }
.c-spin:is(.ur-pla,.ur-pla *) { display: grid; place-items: center; height: 100%; min-height: 400px; color: var(--ink-2); }
.c-spin .i:is(.ur-pla,.ur-pla *) { width: 40px; height: 40px; animation: 0.9s linear 0s infinite normal none running c-rot; }
.c-star:is(.ur-pla,.ur-pla *) { color: var(--star); width: 20px !important; height: 20px !important; }
.c-stars:is(.ur-pla,.ur-pla *) { display: inline-flex; gap: 2px; }
.c-stars .c-star:is(.ur-pla,.ur-pla *) { width: 22px !important; height: 22px !important; }
.c-radio:is(.ur-pla,.ur-pla *) { width: 24px; height: 24px; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--line-2); flex: 0 0 auto; position: relative; }
[aria-checked="true"] > .c-radio:is(.ur-pla,.ur-pla *) { box-shadow: inset 0 0 0 2px var(--brand); }
[aria-checked="true"] > .c-radio:is(.ur-pla,.ur-pla *)::after { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: var(--brand); }
.c-empty:is(.ur-pla,.ur-pla *) { flex: 1 1 0%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 60px 24px 40px; gap: 0px; }
.c-empty b:is(.ur-pla,.ur-pla *) { font-size: 18px; line-height: 24px; font-weight: 600; margin-bottom: 4px; }
.c-empty p:is(.ur-pla,.ur-pla *) { color: var(--ink-2); font-size: 16px; line-height: 22px; margin-bottom: 20px; }
.c-sub2:is(.ur-pla,.ur-pla *) { font-size: 16px; line-height: 22px; color: var(--ink); margin-top: 10px; }
.c-radios:is(.ur-pla,.ur-pla *) { display: flex; flex-direction: column; }
.c-pg-web .c-sc:is(.ur-pla,.ur-pla *) { background: var(--bg); }
.c-web:is(.ur-pla,.ur-pla *) { padding-bottom: 30px; }
.c-wt:is(.ur-pla,.ur-pla *) { font-size: 32px; line-height: 40px; font-weight: 700; margin: 2px 0px 24px; }
.c-pg-web > .c-top:is(.ur-pla,.ur-pla *) { height: 56px; }
.c-bb-web:is(.ur-pla,.ur-pla *) { border-top: 1px solid var(--line); }
.c-bb-web .c-bb-l:is(.ur-pla,.ur-pla *) { flex-direction: column; }
[data-app="capp"]:is(.ur-pla,.ur-pla *) { --c-wal-g: #14231d; --c-foot-bg: #14231d; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) [data-app="capp"]:is(.ur-pla,.ur-pla *) { --c-wal-g: radial-gradient(140% 170% at 100% 0%,#b84bb6 0%,#8a4bc0 22%,#5246c4 45%,#4b45c2 60%); --c-foot-bg: #000; } }
.c-h3a:is(.ur-pla,.ur-pla *) { font-size: 18px; line-height: 24px; font-weight: 600; margin: 40px 0px 16px; }
.c-empty2:is(.ur-pla,.ur-pla *) { padding: 40px 24px; }
.c-empty2 .c-eart:is(.ur-pla,.ur-pla *) { width: 48px; height: 48px; margin-bottom: 16px; }
.c-empty2 p:is(.ur-pla,.ur-pla *) { max-width: 330px; }
.c-acard:is(.ur-pla,.ur-pla *) { background: var(--bg); border-radius: 16px; box-shadow: inset 0 0 0 1px var(--line); padding: 20px; }
.c-aact-ic:is(.ur-pla,.ur-pla *) { width: 48px; height: 48px; border-radius: 50%; background: var(--brand-soft); color: var(--brand); display: grid; place-items: center; flex: 0 0 auto; }
.c-aact-ic .i:is(.ur-pla,.ur-pla *) { width: 22px !important; height: 22px !important; }
.c-aov-r:is(.ur-pla,.ur-pla *) { display: flex; justify-content: space-between; gap: 12px; font-size: 16px; line-height: 22px; }
.c-aov-r > span:first-child:is(.ur-pla,.ur-pla *) { display: flex; flex-direction: column; min-width: 0px; }
.c-aov-r .c-g:is(.ur-pla,.ur-pla *) { font-size: 14px; line-height: 20px; margin-top: 2px; }
.c-aov-r + .c-aov-r:is(.ur-pla,.ur-pla *) { margin-top: 16px; }
.c-aov-hr:is(.ur-pla,.ur-pla *) { display: block; height: 1px; background: var(--line); margin: 20px 0px; }
.c-aov-t b:is(.ur-pla,.ur-pla *) { font-weight: 600; }
.c-acard p:is(.ur-pla,.ur-pla *) { font-size: 16px; line-height: 22px; }
.c-btn-navy:is(.ur-pla,.ur-pla *) { height: 48px; padding: 0px 18px; font-size: 16px; }
.c-bb-web .c-bb-l .c-g:is(.ur-pla,.ur-pla *) { font-size: 16px; line-height: 22px; }
.c-web:is(.ur-pla,.ur-pla *), .c-web .c-wopt:is(.ur-pla,.ur-pla *), .c-web .c-wrow:is(.ur-pla,.ur-pla *), .c-web .c-wt:is(.ur-pla,.ur-pla *), .c-web .c-wt2:is(.ur-pla,.ur-pla *), .c-web .c-lbl2:is(.ur-pla,.ur-pla *), .c-pg-hc .c-hc-b:is(.ur-pla,.ur-pla *), .c-pg-hc .c-hc-h:is(.ur-pla,.ur-pla *) { color: var(--ink-web); }
.c-rvw-v:is(.ur-pla,.ur-pla *) { display: flex; align-items: center; gap: 12px; padding: 12px; }
.c-rvw-ph:is(.ur-pla,.ur-pla *) { width: 64px; height: 64px; border-radius: 8px; overflow: hidden; flex: 0 0 auto; background: var(--bg-3); }
.c-rvw-ph img:is(.ur-pla,.ur-pla *) { width: 100%; height: 100%; object-fit: cover; }
.c-rvw-vb:is(.ur-pla,.ur-pla *) { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; gap: 2px; font-size: 16px; line-height: 22px; }
.c-rvw-vb b:is(.ur-pla,.ur-pla *) { font-weight: 600; }
.c-rvw-vb .c-g:is(.ur-pla,.ur-pla *) { font-size: 14px; line-height: 20px; }
.c-rvw .c-h3a:is(.ur-pla,.ur-pla *) { margin: 32px 0px 12px; }
.c-payr:is(.ur-pla,.ur-pla *), .c-paysel:is(.ur-pla,.ur-pla *) { display: flex; align-items: center; gap: 12px; width: 100%; text-align: start; color: var(--ink); }
.c-payr:is(.ur-pla,.ur-pla *) { padding: 12px 16px 12px 12px; }
.c-payr .c-link:is(.ur-pla,.ur-pla *) { font-size: 14px; flex: 0 0 auto; }
.c-payr > .i:is(.ur-pla,.ur-pla *), .c-paysel > .i:is(.ur-pla,.ur-pla *) { width: 20px; height: 20px; color: var(--ink-3); flex: 0 0 auto; }
.c-payr-b:is(.ur-pla,.ur-pla *) { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; font-size: 16px; line-height: 22px; }
.c-payr-b .c-g:is(.ur-pla,.ur-pla *) { font-size: 14px; line-height: 20px; }
.c-paysel:is(.ur-pla,.ur-pla *) { min-height: 72px; padding: 8px 0px; border-bottom: 1px solid var(--line); }
.c-paysel:last-child:is(.ur-pla,.ur-pla *) { border-bottom: 0px; }
.c-done:is(.ur-pla,.ur-pla *) { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 24px 24px 28px; }
.c-done-ic:is(.ur-pla,.ur-pla *) { width: 72px; height: 72px; border-radius: 50%; background: var(--ok); color: var(--on-ink); display: grid; place-items: center; margin-bottom: 20px; }
.c-done-ic .i:is(.ur-pla,.ur-pla *) { width: 36px !important; height: 36px !important; }
.c-done .c-sub2:is(.ur-pla,.ur-pla *) { color: var(--ink-2); margin-top: 8px; }
.c-btn:is(.ur-pla,.ur-pla *) { border-radius: var(--r-btn); transition: background-color var(--d-2) var(--ease),box-shadow var(--d-2),transform var(--d-1),opacity var(--d-2); }
.c-btn:active:not(:disabled):is(.ur-pla,.ur-pla *) { transform: scale(0.98); }
.c-btn-o:hover:is(.ur-pla,.ur-pla *) { background: var(--bg-2); }
.c-btn-navy:is(.ur-pla,.ur-pla *) { border-radius: var(--r-btn); }
.c-ib:is(.ur-pla,.ur-pla *) { transition: background-color var(--d-2); }
.c-ib:active:is(.ur-pla,.ur-pla *) { background: var(--hover-tint); }
.c-link:is(.ur-pla,.ur-pla *), .c-seeall:is(.ur-pla,.ur-pla *), .c-seeall2:is(.ur-pla,.ur-pla *), .c-link-b:is(.ur-pla,.ur-pla *) { font-weight: 600; }
.c-pt:is(.ur-pla,.ur-pla *), .c-pt2:is(.ur-pla,.ur-pla *), .c-bigt h2:is(.ur-pla,.ur-pla *), .c-prof-t h1:is(.ur-pla,.ur-pla *), .c-mpc-n:is(.ur-pla,.ur-pla *), .c-vi-n:is(.ur-pla,.ur-pla *), .c-gi h1:is(.ur-pla,.ur-pla *), .c-hc-ti:is(.ur-pla,.ur-pla *) { font-weight: 700; letter-spacing: var(--tr-head); line-height: 1.3; }
.c-h2:is(.ur-pla,.ur-pla *), .c-h2v:is(.ur-pla,.ur-pla *), .c-h2a:is(.ur-pla,.ur-pla *), .c-h3a:is(.ur-pla,.ur-pla *), .c-sug-h:is(.ur-pla,.ur-pla *), .c-bg > .c-h3:is(.ur-pla,.ur-pla *), .c-pg-bt .c-pad > .c-h3:is(.ur-pla,.ur-pla *), .c-opt-h .c-h3:is(.ur-pla,.ur-pla *), .c-ths .c-h3:is(.ur-pla,.ur-pla *), .c-vgs-h:is(.ur-pla,.ur-pla *), .c-try-h:is(.ur-pla,.ur-pla *), .c-pfs .c-h2v:is(.ur-pla,.ur-pla *) { font-weight: 700; letter-spacing: var(--tr-head); }
.c-top-t:is(.ur-pla,.ur-pla *), .c-shd h2:is(.ur-pla,.ur-pla *), .c-sh-t:is(.ur-pla,.ur-pla *), .c-shtop-t:is(.ur-pla,.ur-pla *) { font-weight: 650; letter-spacing: var(--tr-head); }
.c-wt:is(.ur-pla,.ur-pla *), .c-wt2:is(.ur-pla,.ur-pla *), .c-adh h1:is(.ur-pla,.ur-pla *), .c-ad-when:is(.ur-pla,.ur-pla *) { letter-spacing: -0.02em; }
.c-bs-p b:is(.ur-pla,.ur-pla *), .c-sc1-p b:is(.ur-pla,.ur-pla *), .c-bb-p:is(.ur-pla,.ur-pla *) { font-weight: 650; letter-spacing: var(--tr-head); }
.c-bb-p:is(.ur-pla,.ur-pla *) { font-size: 18px; line-height: 24px; }
.c-bb:is(.ur-pla,.ur-pla *) { border-top-color: var(--line); box-shadow: rgba(13, 13, 13, 0.45) 0px -10px 24px -22px; }
[data-app="capp"] .c-ov .mdl:is(.ur-pla,.ur-pla *) { border-radius: var(--r-xl) var(--r-xl) 0 0; animation: c-up .3s var(--ease); }
.c-bs:is(.ur-pla,.ur-pla *), .c-bp:is(.ur-pla,.ur-pla *), .c-me:is(.ur-pla,.ur-pla *), .c-time:is(.ur-pla,.ur-pla *), .c-dt:is(.ur-pla,.ur-pla *), .c-fvo:is(.ur-pla,.ur-pla *), .c-opt2:is(.ur-pla,.ur-pla *), .c-try:is(.ur-pla,.ur-pla *), .c-incc:is(.ur-pla,.ur-pla *), .c-pkg:is(.ur-pla,.ur-pla *), .c-acard:is(.ur-pla,.ur-pla *), .c-pcard:is(.ur-pla,.ur-pla *), .c-ncard:is(.ur-pla,.ur-pla *), .c-adr:is(.ur-pla,.ur-pla *), .c-wopt:is(.ur-pla,.ur-pla *), .c-wrow:is(.ur-pla,.ur-pla *) { border-radius: var(--r-card); box-shadow: var(--sh-card-1); transition: box-shadow var(--d-2) var(--ease),transform var(--d-2) var(--ease),background-color var(--d-2); }
.c-done-ic:is(.ur-pla,.ur-pla *) { box-shadow: 0 0 0 8px color-mix(in srgb,var(--ok) 12%,transparent); }
.c-rvw-ph:is(.ur-pla,.ur-pla *), .c-arow-ph:is(.ur-pla,.ur-pla *), .c-nbiz-ph:is(.ur-pla,.ur-pla *) { border-radius: var(--r-ctl); }
[data-app="capp"]:is(.ur-pla,.ur-pla *) { --cp-canvas: var(--page); --cp-prof: var(--page); --cp-band: var(--band); --cp-dis-bg: var(--bg-3); --cp-dis-ink: var(--ink-3); --cp-btn-g: var(--night); --cp-btn-gi: var(--on-night); --cp-laur: #12a079; --cp-laur2: #0b7658; --cp-blob: linear-gradient(90deg,#0b7658,#12a079); --cp-gi: linear-gradient(180deg,#14231d 0%,#14231d 55%,#0b5440 100%); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) [data-app="capp"]:is(.ur-pla,.ur-pla *) { --cp-canvas: var(--bg); --cp-prof: var(--bg-4); --cp-band: transparent; --cp-dis-bg: var(--ink-3); --cp-dis-ink: var(--on-ink); --cp-btn-g: linear-gradient(90deg,#1a73e8 0%,#4f6cf0 70%,#6a5cf3 100%); --cp-btn-gi: #fff; --cp-laur: #b46cff; --cp-laur2: #a24dff; --cp-blob: linear-gradient(90deg,#6950f3,#b46cff); --cp-gi: linear-gradient(180deg,#0d0d0d 0%,#0d0d0d 55%,#2a1f4e 100%); } }
:root:has(.ur-pla) { --ca-cwg1: #e2efe8; --ca-cwg2: #cde2d6; --ca-cwr1: #12a079; --ca-cwr2: #0b7658; --ca-cea1: #d3eee2; --ca-cea2: #12a079; --ca-ceb1: #0b7658; --ca-ceb2: #9fd8c2; --ca-ccg1: #9fd8c2; --ca-ccg2: #0b7658; --ca-pink: #12a079; --ca-deep: #14231d; --ca-pur: #0b7658; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --ca-cwg1: #eeeaff; --ca-cwg2: #d9d2ff; --ca-cwr1: #8b6cff; --ca-cwr2: #5b3df0; --ca-cea1: #d4ccff; --ca-cea2: #8a76f7; --ca-ceb1: #6950f3; --ca-ceb2: #f45dfc; --ca-ccg1: #a99bff; --ca-ccg2: #6950f3; --ca-pink: #f45dfc; --ca-deep: #4b3bbf; --ca-pur: #6950f3; } }
.c-eart [id^="cea-"] stop:first-child:is(.ur-pla,.ur-pla *) { stop-color: var(--ca-cea1); }
.c-eart [id^="cea-"] stop:last-child:is(.ur-pla,.ur-pla *) { stop-color: var(--ca-cea2); }
.c-eart [id^="ceb-"] stop:first-child:is(.ur-pla,.ur-pla *) { stop-color: var(--ca-ceb1); }
.c-eart [id^="ceb-"] stop:last-child:is(.ur-pla,.ur-pla *) { stop-color: var(--ca-ceb2); }
:root:has(.ur-pla) { --p-rail-line: #0d0d0d; --p-act: #6950f3; --p-card: #ffffff; --p-btn: #ffffff; --p-grid: #f3f3f4; --p-axis: #879ac0; --p-av-bg: #ebf8fe; --p-av-ink: #0075a8; --p-green: #2c7016; --p-line-green: #00a36d; --p-appt: #a5dff8; --p-appt-ink: #0d0d0d; --p-hatch: #e9e9e9; --p-hatch-bg: #f2f2f2; --p-tip: #0d0d0d; --p-tip-ink: #fff; --p-row-hover: #f9f9f9; --p-past: #bfbfbf; --p-mbg: #f5f5f5; --p-dr-sh: 0 8px 32px 0 rgba(19,19,19,.16),0 -1px 0 0 #e5e5e5; --p-rail: #1d1a21; --p-rail-ink: #e9e7ee; --p-rail-tile: rgba(255,255,255,.07); --p-rail-tile-h: rgba(255,255,255,.14); --p-rail-edge: rgba(255,255,255,.04); --p-rail-act: #ffffff; --p-rail-act-ink: #0d0d0d; --p-rail-act-l: #ffffff; --p-rail-mk: #8880ff; --p-rail-ring: #b0b1fd; --p-rail-sh: 0 1px 0 rgba(13,13,13,.04),0 18px 40px -22px rgba(13,13,13,.55); --p-badge: #c8391a; --p-badge-ink: #ffffff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p-rail-line: #333333; --p-card: #181818; --p-btn: #181818; --p-grid: #818282; --p-axis: #877d5f; --p-av-bg: #022231; --p-av-ink: #00a0e5; --p-green: #2c7016; --p-line-green: #00a36d; --p-appt: #61b4d2; --p-appt-ink: #0d0d0d; --p-hatch: #2f2f2f; --p-hatch-bg: #262626; --p-tip: #f5f5f5; --p-tip-ink: #0d0d0d; --p-row-hover: #181818; --p-past: #626262; --p-mbg: #0d0d0d; --p-dr-sh: 0 8px 32px 0 rgba(0,0,0,.5),0 -1px 0 0 #333333; --p-rail: #1f1d25; --p-rail-ink: #e9e7ee; --p-rail-tile: rgba(255,255,255,.07); --p-rail-tile-h: rgba(255,255,255,.14); --p-rail-edge: rgba(255,255,255,.05); --p-rail-act: #f5f5f5; --p-rail-act-ink: #0d0d0d; --p-rail-act-l: #f5f5f5; --p-rail-mk: #8880ff; --p-rail-ring: #b0b1fd; --p-rail-sh: 0 0 0 1px rgba(255,255,255,.06),0 18px 40px -22px rgba(0,0,0,.8); --p-badge: #d4401f; --p-badge-ink: #ffffff; } }
:root:has(.ur-pla) { --p-seg-ink: color-mix(in srgb,var(--ink) 78%,var(--bg-2)); --p-seg-on: var(--bg); --p-row-h: color-mix(in srgb,var(--ink) 3.5%,transparent); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p-seg-on: var(--bg-3); --p-row-h: color-mix(in srgb,var(--ink) 5%,transparent); } }
:root:has(.ur-pla) { --p-act: var(--night); --p-act-ink: var(--on-night); --p-card: var(--bg); --p-btn: var(--bg); --p-grid: var(--line); --p-axis: var(--ink-3); --p-av-bg: var(--accent-soft); --p-av-ink: var(--brand-3); --p-green: var(--ok); --p-line-green: #e0832a; --p-ch1: #12a079; --p-ch2: #e0832a; --p-ch3: #0f9db0; --p-ch4: #e05a6a; --p-ch-muted: #b3c4bb; --p-appt: #d2eef2; --p-appt-ink: var(--ink); --p-appt-bar: #0f9db0; --p-ap-booked: #d2eef2; --p-ap-booked-b: #0f9db0; --p-ap-confirmed: #d6f0e2; --p-ap-confirmed-b: #22a06b; --p-ap-started: #fbe6d1; --p-ap-started-b: #e0832a; --p-ap-done: #e7e9e2; --p-ap-done-b: #b3c4bb; --p-ap-noshow: #fbdfe2; --p-ap-noshow-b: #e05a6a; --p-hatch: #e7e9e2; --p-hatch-bg: #f1f2ec; --p-tip: var(--night); --p-tip-ink: var(--on-night); --p-row-hover: var(--bg-2); --p-past: #b3c4bb; --p-mbg: var(--page); --p-dr-sh: 0 30px 80px -20px #08100c80,0 0 0 1px #14231d0a; --p-now: var(--accent); --p-now-ink: var(--accent-deep); --p-top-bg: var(--band); --p-main-bg: var(--page); --p-band: var(--band); --p-band-gap: 22px; --p-top-line: transparent; --p-rail-mk: #4fd1a5; --p-rail-ring: #4fd1a5; --p-row-h: var(--bg-2); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p-act: #6950f3; --p-act-ink: #ffffff; --p-ch1: #6950f3; --p-ch2: #00a36d; --p-ch3: #00a36d; --p-ch4: #ff4360; --p-ch-muted: #626262; --p-appt-bar: transparent; --p-ap-booked: #61b4d2; --p-ap-confirmed: #61b4d2; --p-ap-started: #61b4d2; --p-ap-done: #61b4d2; --p-ap-noshow: #61b4d2; --p-ap-booked-b: transparent; --p-ap-confirmed-b: transparent; --p-ap-started-b: transparent; --p-ap-done-b: transparent; --p-ap-noshow-b: transparent; --p-now: var(--bad); --p-now-ink: var(--bad); --p-top-bg: var(--bg); --p-main-bg: var(--bg); --p-band: transparent; --p-band-gap: 0px; --p-top-line: var(--line); } }
:root:has(.ur-pla) { --p-lg-2: var(--p-line-green); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p-lg-2: var(--p-green); } }
:root:has(.ur-pla) { --p-inv: linear-gradient(90deg,#0b5440,#14231d); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p-inv: linear-gradient(90deg,#0d6e8c,#0a3c66); } }
:root:has(.ur-pla) { --p-mtop-bg: var(--band); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p-mtop-bg: var(--bg); } }
[data-app]:is(.ur-pla,.ur-pla *) { --p2-tag-blue: #a5dff8; --p2-yellow: #fff8db; --p2-yellow-line: #ffe9a3; --p2-orange: #b7570b; --p2-soft: #f9f9f9; --p2-badge: rgba(19,19,19,.05); --p2-teal: #2bd6c6; --p2-sky: #2d76ec; --p2-ok-chip: #edfbe9; --p2-card: #fff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) [data-app]:is(.ur-pla,.ur-pla *) { --p2-tag-blue: #a5dff8; --p2-yellow: #371c0c; --p2-yellow-line: #5c3412; --p2-orange: #f19101; --p2-soft: #131313; --p2-badge: rgba(255,255,255,.08); --p2-sky: #5791f0; --p2-ok-chip: #182914; --p2-card: #181818; } }
[data-app]:is(.ur-pla,.ur-pla *) { --p2-tag-blue: #0f9db0; --p2-yellow: #fbeed6; --p2-yellow-line: #f1d7a6; --p2-orange: #9a5a06; --p2-soft: var(--bg-4); --p2-badge: #14231d0d; --p2-teal: #0f9db0; --p2-sky: #0b6f7c; --p2-ok-chip: var(--ok-soft); --p2-card: var(--bg); --p2-wrap: var(--page); --p2-wrap-w: var(--page); --p2-fill: var(--night); --p2-fill-ink: var(--on-night); --p2-imp: linear-gradient(-135deg,#14231d 0%,#14231d 44%,#0b7658 76%,#12a079 100%); --p2-ccb: linear-gradient(90deg,#14231d,#0b5440 55%,#0b7658); --p2-ccb-eb: #b3c4bb; --p2-scr: linear-gradient(135deg,#12a079,#0b7658); --p2-ws-ic: linear-gradient(135deg,#0f9db0,#0b7658); --p2-cp-ic: linear-gradient(135deg,#0f9db0,#0b6f7c); --p2-ill-1: #12a079; --p2-ill-1-soft: #d3eee2; --p2-ill-dl: #d3eee2; --p2-ill-2: #0b7658; --p2-u-p1: #cde2d6; --p2-u-p3: #d3eee2; --p2-u-p2: #e2efe8; --p2-u-b1: #bfe6ec; --p2-u-b3: #d2eef2; --p2-u-b2: #d3eee2; --p2-u-t1: #b9dccb; --p2-u-t3: #d3eee2; --p2-u-t2: #d2eef2; --p2-u-k1: #fbdfe2; --p2-u-k3: #fbe6d1; --p2-u-k2: #f6efe0; --p2-u-v1: #cde2d6; --p2-u-v3: #d2eef2; --p2-u-v2: #e2efe8; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) [data-app]:is(.ur-pla,.ur-pla *) { --p2-teal: #2bd6c6; --p2-wrap: var(--bg-2); --p2-wrap-w: var(--bg); --p2-fill: var(--brand); --p2-fill-ink: #fff; --p2-imp: linear-gradient(-135deg,#141414 0%,#141414 44%,#7303c0 71%,#ec3812 100%); --p2-ccb: linear-gradient(90deg,#4f6ff3,#6950f3 50%,#8a2be2); --p2-ccb-eb: #d8d6ff; --p2-scr: linear-gradient(135deg,#2d76ec,#6950f3); --p2-ws-ic: linear-gradient(135deg,#0ea5b7,#4f46e5); --p2-cp-ic: linear-gradient(135deg,#3b82f6,#1d4ed8); --p2-ill-1: #a99bf8; --p2-ill-1-soft: #d8d0ff; --p2-ill-dl: #ecebff; --p2-ill-2: #a43bd8; --p2-u-p1: #c7b0fb; --p2-u-p3: #d7a6ee; --p2-u-p2: #f3c3f2; --p2-u-b1: #a4abf9; --p2-u-b3: #8fc4fb; --p2-u-b2: #9aeae2; --p2-u-t1: #7ee7dc; --p2-u-t3: #6fe3e2; --p2-u-t2: #b8f0d6; --p2-u-k1: #d5b0f3; --p2-u-k3: #df9fd2; --p2-u-k2: #f2c0ef; --p2-u-v1: #a8a3fb; --p2-u-v3: #8fb6fb; --p2-u-v2: #9feee6; } }
:root:has(.ur-pla) { --p4-on-c: #ffffff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p4-on-c: #ffffff; } }
:root:has(.ur-pla) { --p4-fill: var(--night); --p4-fill-ink: var(--on-night); --p4-adh: #0b6f7c; --p4-adh-started: #9a5a06; --p4-adh-done: #45554e; --p4-adh-bad: #b42318; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p4-fill: var(--brand); --p4-fill-ink: #ffffff; --p4-adh: var(--blue); --p4-adh-started: var(--brand); --p4-adh-done: var(--ok); --p4-adh-bad: var(--bad); } }
:root:has(.ur-pla) { --p5-il0: #d9d3ff; --p5-il1: #b9a8ff; --p5-il2: #7a5cf5; --p5-il3: #e45bd3; --p5-or1: #ffb03a; --p5-or2: #f2512d; --p5-hex1: #ffd0f0; --p5-hex2: #ff8fb8; --p5-hex3: #fff2fa; --p5-loy1: #f7e3ff; --p5-loy2: #ffc4dc; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p5-il0: #3b3570; --p5-il1: #8f7cf0; --p5-il2: #6950f3; --p5-il3: #c64ab8; --p5-or1: #e89a2a; --p5-or2: #d84422; --p5-hex1: #5b2d4c; --p5-hex2: #a8466f; --p5-hex3: #3a2433; --p5-loy1: #2d2140; --p5-loy2: #4a2236; } }
:root:has(.ur-pla) { --p5-il0: #d3eee2; --p5-il1: #9fd6bf; --p5-il2: #12a079; --p5-il3: #0f9db0; --p5-or1: #f0a35a; --p5-or2: #e0832a; --p5-hex1: #fbdfe2; --p5-hex2: #a8394a; --p5-hex3: #fdf1f2; --p5-loy1: #e2efe8; --p5-loy2: #d3eee2; --p5-fill: var(--night); --p5-fill-ink: var(--on-night); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p5-fill: var(--brand); --p5-fill-ink: var(--on-ink); } }
[data-app]:is(.ur-pla,.ur-pla *) { --p6-promo: linear-gradient(135deg,#1d9fd8,#16c5c9 60%,#17d2c4); --p6-p1: #fde7f3; --p6-p2: #e8f6ff; --p6-p3: #efeaff; --p6-p4: #fff1e1; --p6-p5: #e7f8ee; --p6-tip: #6950f3; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) [data-app]:is(.ur-pla,.ur-pla *) { --p6-promo: linear-gradient(135deg,#106f98,#0f8b8e 60%,#0f948a); --p6-p1: #3a1c2c; --p6-p2: #13283a; --p6-p3: #241f45; --p6-p4: #3a2914; --p6-p5: #15301f; --p6-tip: #5b47d6; } }
[data-app]:is(.ur-pla,.ur-pla *) { --p6-promo: linear-gradient(135deg,#0b6f7c,#0b7658 60%,#17734f); --p6-p1: #fbdfe2; --p6-p2: #d2eef2; --p6-p3: #e2efe8; --p6-p4: #fbe6d1; --p6-p5: #d6f0e2; --p6-tip: var(--night); --p6-fill: var(--night); --p6-ill1: linear-gradient(160deg,#9fd6bf,#0b7658); --p6-ill2: linear-gradient(135deg,#9fd6bf,#0b7658); --p6-ill3: linear-gradient(135deg,#d3eee2,#12a079); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) [data-app]:is(.ur-pla,.ur-pla *) { --p6-fill: var(--brand); --p6-ill1: linear-gradient(160deg,#c084fc,var(--brand)); --p6-ill2: linear-gradient(135deg,#a78bfa,var(--brand)); --p6-ill3: linear-gradient(135deg,#c4b5fd,#8b5cf6); } }
:root:has(.ur-pla) { --p7-st-blue: #2d76ec; --p7-st-amber: #f2a73b; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p7-st-blue: #5b95f0; --p7-st-amber: #f5b85e; } }
:root:has(.ur-pla) { --p7-st-blue: #0f9db0; --p7-st-amber: #e0832a; --p7-fill: var(--night); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p7-fill: var(--brand); } }
:root:has(.ur-pla) { --p8-fill: var(--night); --p8-sub: linear-gradient(135deg,#0b7658,#0b6f7c); --p8-sub-b: linear-gradient(135deg,#0f9db0,#0b6f7c); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p8-fill: var(--brand); --p8-sub: linear-gradient(135deg,var(--brand),#c026d3); --p8-sub-b: linear-gradient(135deg,#3b82f6,#2d76ec); } }
:root:has(.ur-pla) { --p9-g1: #2d6cf6; --p9-g1b: #5a8dff; --p9-g2: #3fb93a; --p9-g2b: #b4e33d; --p9-g3: #d63ce0; --p9-g3b: #f06bd4; --p9-cn1: #6950f3; --p9-cn2: #3b5bdb; --p9-tm1: #0f9d6b; --p9-tm2: #7fd24a; --p9-earn: #0f6f78; --p9-on: #e6f8e3; --p9-on-ink: #1f8900; --p9-red: #d4163a; --p9-reqbg: #d4163a; --p9-navy: #1a1638; --p9-inv1: #0a3c66; --p9-inv2: #0d6e8c; --p9-goo: #4285f4; --p9-cn3: #59c3c3; --p9-help: #6950f3; --p9-help2: #5b8def; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p9-g1: #2457c9; --p9-g1b: #3b6ee0; --p9-g2: #2f8f2b; --p9-g2b: #7fae2c; --p9-g3: #a82db0; --p9-g3b: #c4519f; --p9-cn1: #5240c4; --p9-cn2: #2e48ad; --p9-tm1: #0b7a53; --p9-tm2: #5d9c36; --p9-earn: #0b545b; --p9-on: #183214; --p9-on-ink: #5cc04a; --p9-red: #e0284a; --p9-reqbg: #b81232; --p9-navy: #141129; --p9-inv1: #082f50; --p9-inv2: #0b5a72; --p9-goo: #5a95f5; --p9-cn3: #3f9d9d; --p9-help: #5a43d6; --p9-help2: #4a74c9; } }
:root:has(.ur-pla) { --p9-g1: #0b6f7c; --p9-g1b: #0f8a9b; --p9-g2: #17734f; --p9-g2b: #1f8f5f; --p9-g3: #a8394a; --p9-g3b: #bf4a5c; --p9-cn1: #0b7658; --p9-cn2: #14231d; --p9-tm1: #17734f; --p9-tm2: #1f8f5f; --p9-earn: #0b6f7c; --p9-on: var(--ok-soft); --p9-on-ink: var(--ok); --p9-red: #b42318; --p9-reqbg: #b42318; --p9-navy: #14231d; --p9-inv1: #14231d; --p9-inv2: #0b5440; --p9-cn3: #0b6f7c; --p9-help: #0b7658; --p9-help2: #0b6f7c; --p9-fill: var(--night); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p9-fill: var(--brand); } }
.c-bigt h2:is(.ur-pla,.ur-pla *) { text-wrap: balance; }
html:has(.ur-pla) { text-wrap: pretty; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --sel: #6950f3; } }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):has(.ur-pla) { --p9-fill: #6950f3; } }
.c6-pay:is(.ur-pla,.ur-pla *) { text-align: center; padding: 24px 16px; }
.c6-slow:is(.ur-pla,.ur-pla *) { margin-top: 12px; }
.c7-tips:is(.ur-pla,.ur-pla *) { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.c7-tip:is(.ur-pla,.ur-pla *) { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 14px 8px; border-radius: var(--r-card); box-shadow: inset 0 0 0 1px var(--line-2); background: var(--bg); }
.c7-tip b:is(.ur-pla,.ur-pla *) { font-size: 18px; line-height: 24px; }
.c7-tip span:is(.ur-pla,.ur-pla *) { font-size: 13px; line-height: 18px; color: var(--ink-2); }
.c8-soon:is(.ur-pla,.ur-pla *) { font: 500 12px/16px var(--f); color: var(--ink-2); background: var(--bg-2); border-radius: 999px; padding: 2px 8px; margin-inline-start: 8px; flex: 0 0 auto; }
/* TASK-K-ARCH1C §6b L-N31: the home's header without JS. v8 sets `solid` past 8 px from its scroll listener; the
   page without JS has no listener, so the header, once stuck under the hub bar, draws on its `::before` what
   `.s-hd--home.solid` ends at in v8's cascade: the background of demo-v8.css 1420 and the shadow of 1310.
   `entry.client.tsx` marks `<html data-js>`, so the hydrated page draws v8's own class only. Chromium 133+;
   elsewhere the header without JS stays transparent. */
html:not([data-js]) .s-hd--home {
  container-type: scroll-state;
}
@container scroll-state(stuck: top) {
  html:not([data-js]) .s-hd--home::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--s-top);
    box-shadow: 0 1px 0 var(--line), 0 8px 24px -20px rgba(13, 13, 13, 0.45);
  }
}
/* TASK-K-011W part 62 (T-S14 dark): v8's dark rules written for `:root[data-theme="dark"]` only, with no twin in
   v8's `prefers-color-scheme` blocks. The site has no `data-theme` (root.tsx) and follows the system, as v8's own
   variables do in demo-v8.css's media blocks; each rule here is v8's, its line in demo-v8.css, under that media. */
@media (prefers-color-scheme: dark) {
  /* demo-v8.css 587 */
  :root:not([data-theme='light']) .s-tab {
    box-shadow: inset 0 0 0 1px var(--line-2);
  }
}
/* TASK-K-LEGAL10 R-9 (lock rev. 0.2, Δ-15): v9's legal hub look, lifted verbatim: v9 3611-3641 and `.c8-soon` 32484.
   Not in @bs/look's demo-v8.css: that file is v8's lift, pinned byte for byte by the drift check (web/tools/test/lift.test.ts T-8). */
/* v9 UR R-2: the legal hub (Fresha terms site: the document list beside the text on the laptop; tabs on the phone) */
.ur-legal .s3-doc{max-width:1080px}
.ur-lg{display:grid;grid-template-columns:240px minmax(0,1fr);gap:48px;align-items:start}
.ur-lmain{display:flex;flex-direction:column;gap:32px;min-width:0}
.ur-lmain .s3-sub{margin-top:-16px}
.ur-lnav{position:sticky;top:96px}
.ur-ltabs{flex-direction:column;gap:4px;margin:0;overflow:visible}
.ur-ltabs li{height:auto;min-height:40px;padding:8px 16px;border-radius:12px;box-shadow:none;white-space:normal}
.ur-ltabs li.on{background:var(--bg-2);color:var(--ink)}
.ur-lov{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.ur-lovc{display:flex;flex-direction:column;gap:8px;padding:24px}
.ur-lovc h2{font:600 18px/24px var(--f);display:flex;align-items:center}
.ur-lovc p{font:400 15px/24px var(--f);color:var(--ink-2);flex:1}
.ur-lsoon{display:flex;align-items:flex-start;gap:12px;padding:24px;flex-wrap:wrap}
.ur-lsoon>.i{width:24px;height:24px;flex:none;color:var(--ink-2)}
.ur-lsoon p{flex:1;min-width:200px;display:flex;flex-direction:column;gap:4px}
.ur-lsoon b{font:600 16px/22px var(--f);display:flex;align-items:center}.ur-lsoon span{color:var(--ink-2)}
.s3-h1 .c8-soon{vertical-align:middle;font-size:14px}
.ur-cct{overflow-x:auto;margin-top:12px}
.ur-cct table{width:100%;border-collapse:collapse;font:400 14px/20px var(--f)}
.ur-cct th{text-align:start;font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line-2);white-space:nowrap}
.ur-cct td{padding:12px;border-bottom:1px solid var(--line);color:var(--ink-2)}
.ur-ccb{align-self:flex-start}
@container (max-width:900px){
  .ur-lg{grid-template-columns:minmax(0,1fr);gap:24px}
  .ur-lnav{position:static}
  .ur-ltabs{flex-direction:row;gap:8px;overflow-x:auto;scrollbar-width:none}
  .ur-ltabs li{height:36px;min-height:0;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);white-space:nowrap}
  .ur-ltabs li.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
  .ur-lov{grid-template-columns:minmax(0,1fr)}
}
.c8-soon{font-style:normal;font:500 12px/16px var(--f);color:var(--ink-2);background:var(--bg-2);border-radius:999px;padding:2px 8px;margin-inline-start:8px;flex:none}
/* TASK-K-COOKIE P-1, P-2 (lock rev. 0.2): v9's cookie bar and its dialog rows, lifted verbatim: v9 32871-32878.
   Not in @bs/look's demo-v8.css: that file is v8's lift, pinned byte for byte by the drift check. */
.ud-cc{position:sticky;bottom:0;z-index:30;padding:16px;pointer-events:none}
.ud-cc-in{pointer-events:auto;max-width:960px;margin:0 auto;display:flex;align-items:center;gap:24px;padding:20px 24px;border-radius:16px;background:var(--bg);box-shadow:0 8px 32px rgba(0,0,0,.16),inset 0 0 0 1px var(--line);color:var(--ink)}
.ud-cc-in p{margin:4px 0 0;color:var(--ink-2);font-size:14px;line-height:20px}
.ud-cc-b{display:flex;gap:8px;flex:none}
@container (max-width:767px){.ud-cc-in{flex-direction:column;align-items:stretch;gap:16px}.ud-cc-b{flex-wrap:wrap}.ud-cc-b>*{flex:1}}
.ud-ccr label{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%}
.ud-ccr small{display:block;color:var(--ink-2);font-size:13px;line-height:18px}
.ud-ccr .tg[aria-disabled=true]{opacity:.5}
/* TASK-K-RESP-PKG-SITEMORE (lead ruling 2026-10-31 05:49): v12's rules of the venue page's «بیشتر», as v12 has them
   and in its order: 32751-32757 (fparity C2 G-7, G-9), then 32767-32769 (fparity C2b G-6: with «بیشتر» the tabs
   scroll sideways on a phone, as v12's tab bar; the 360 look pair found the page 388 wide without them). */
.s2-mrws{display:flex;flex-direction:column}
.s2-mrw{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.s2-mrw:last-child{border-bottom:0}
.s2-mrw>span{display:flex;flex-direction:column;min-width:0}
.s2-mrw b{font:500 16px/22px var(--f)}
.s2-mrw small{font:400 14px/20px var(--f);color:var(--ink-2)}
.s2-card-b.s2-mrws{gap:0;padding-top:16px;padding-bottom:16px}
.s2-stab ul{overflow-x:auto;scrollbar-width:none}
.s2-stab ul::-webkit-scrollbar{display:none}
.s2-stab li{flex:none}
/* TASK-K-DG-INSTA D1 (lock rev 0.6 §11): the DG-C8 demo copy's rules of the Instagram feed as it writes them,
   gheichy-demo-v12-dg-c-instagram.html 35262-35311 (the site's section #s2-ig, the gallery and post windows; the
   app's rules ride along unused, as in the demo). */
/* DG-C8: the Instagram feed (app section, professional block, gallery page, post preview; site section and its two modals) */
.dg-igh{display:flex;align-items:center;gap:8px;margin:0 0 12px}
.dg-igl,.dg-igh img.dg-igl,.dg-igpc-h img.dg-igl{width:32px!important;height:32px!important;min-width:0;max-width:none;flex:none;border-radius:8px;display:block;position:static;object-fit:contain}
.dg-igt{margin:0!important;line-height:1.4}
.dg-igt0{margin:0;font-size:16px;font-weight:600;line-height:24px}
.dg-igu{margin:0;font-size:13px;line-height:20px;color:var(--ink-2);text-align:start}
.dg-igti{position:relative;display:block;aspect-ratio:1;overflow:hidden;padding:0;border:0;cursor:pointer;background:var(--bg-3)}
.dg-igti img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.dg-igb{position:absolute;top:6px;inset-inline-end:6px;color:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.55));line-height:0}
.dg-igb .i{width:20px;height:20px}
.dg-igm{position:absolute;inset:0;background:rgba(0,0,0,.45);color:#fff;display:grid;place-items:center;font-size:17px;font-weight:600}
.dg-ighr{margin:20px 0}
.dg-iglm{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px 16px 28px;text-align:center;color:var(--ink-2)}
.dg-iglm p{margin:0;font-size:14px;line-height:1.6}
.dg-igsp{width:28px;height:28px;border-radius:50%;border:2.5px solid var(--line);border-top-color:var(--ink);animation:c-rot .9s linear infinite}
.dg-igpg .c-pfg{margin-top:4px}
.dg-igpv{padding:16px 20px 32px}
.dg-igpc{display:flex;flex-direction:column;gap:12px;border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--bg)}
.dg-igpc-h{display:flex;align-items:center;gap:8px;font-size:14px}
.dg-igpc-h img.dg-igl{width:28px!important;height:28px!important}
.dg-igpc-i{position:relative;aspect-ratio:1;border-radius:8px;overflow:hidden;background:var(--bg-3)}
.dg-igpc-i img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dg-igout{text-decoration:none;display:flex;align-items:center;justify-content:center}
/* website */
.dg-s2igs .dg-igh{margin-bottom:16px}
.dg-s2igp{margin-top:24px}
.dg-s2g4{grid-template-columns:repeat(4,1fr)!important}
.dg-s2g .dg-igti{border-radius:inherit}
.s2-pf.dg-s2g button{border-radius:16px}
.ov.dg-igfull,.ov.dg-igpm{place-items:stretch;padding:0}
.ov.dg-igfull .mdl,.ov.dg-igpm .mdl{width:100%;height:100%;max-width:none;max-height:none;border-radius:0;margin:0}
.dg-igfh{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg);border-bottom:1px solid var(--line)}
.dg-igfh h2{margin:0;font-size:17px;font-weight:600}
.dg-igx{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--ink);display:grid;place-items:center;cursor:pointer}
.dg-igx .i{width:20px;height:20px}
.dg-igfb{max-width:960px;margin:0 auto;padding:20px 16px 40px}
.dg-s2gall{grid-template-columns:repeat(3,1fr)}
.dg-s2rb{margin:0}
.ov.dg-igpm .mdl{background:#000;color:#fff;display:flex;flex-direction:column}
.dg-igph{display:flex;align-items:center;justify-content:space-between;padding:12px 16px}
.dg-igph .dg-igx{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.dg-igpn{font-size:14px;color:#fff}
.dg-igpb{flex:1;display:flex;align-items:center;justify-content:center;gap:16px;padding:8px 16px 32px}
.dg-igpm .dg-igpc{width:min(480px,100%);color:var(--ink)}
.dg-igar{width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;display:grid;place-items:center;cursor:pointer;flex:none}
.dg-igar .i{width:22px;height:22px}
.dg-igpr .i{transform:scaleX(1)}
.dg-ignx .i{transform:scaleX(-1)}
.dg-igout2{align-self:center;font-size:14px;font-weight:600;color:var(--ink);text-decoration:underline}
@media (max-width:599px){.dg-igar{display:none}.dg-igpb{padding:8px 12px 24px}}
/* TASK-K-013W part c1 (and c2 below): v12 33434-33435 (v9 UH, the first-visit question), as v12 has them; then S-10's direct-pay
   block «بعداً فعال می‌گردد» (no v12 row: the lead's interim payment ruling), drawn with v12's radios, dimmed. */
.uh-fv{display:flex;flex-direction:column;gap:12px}
.uh-fv .s2-radio>span:last-child{display:flex;flex-direction:column;gap:2px}
.s2-pdir{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.s2-pdir .s2-radio[aria-disabled="true"]{opacity:.5;cursor:not-allowed;pointer-events:none}
/* TASK-K-013W part c2: the waitlist's range rows (v9 UG U-6), v12 32580 (F-16, the phone rule) and 33421-33426, in v12 order. */
@container (max-width:600px){.s2-wrow{flex-direction:column;align-items:stretch}.ug-rng{flex-wrap:wrap;row-gap:4px}.ug-rng .s2-selb{flex:1 1 100%}.ug-rng .ug-to{flex:1 1 100%;line-height:20px}}
.ug-wf{display:flex;flex-direction:column;gap:12px;flex:1;min-width:0}
.ug-rng{display:flex;align-items:center;gap:8px}
.ug-rng .s2-selb{flex:1;min-width:0}
.ug-to{color:var(--ink-3);flex:none}
@container (min-width:601px){.ug-wrow{align-items:flex-start}.ug-wrow .s2-wdel{margin-top:24px}}
@container (max-width:600px){.ug-wrow .s2-wdel{align-self:flex-end}}
/* TASK-K-013W part e1: v12's later rules on the booking steps, in v12 order: 32607, 32778-32781, 33659. */
.s2-pc-t h4{text-wrap:balance}
.s2-var-l+.s2-var-h{margin-top:32px}
.s2-var-ad>.s2-add{flex:none;display:grid}
.s2-var-ad.on .s2-add{background:var(--sel);border-color:var(--sel);color:var(--on-sel)}
.s2-mdx .s-md-b p{font:400 16px/22px var(--f)}
@container (max-width:600px){[data-app].has-ov .toast{bottom:104px}}
/* TASK-K-013W part e2: v12 32576 (F-14), the done mark's ring. */
.s2-done{padding-top:8px}
/* TASK-K-013W parts d1, d2: v12 `<style id="fparity-c4-site">` (32817-32843) rows of the detail, the waitlist entry,
   manage, reschedule, cancel, the review and the account switch; and its C7 rows (32957-32995) of the review window. */
.s3-anote{font-size:14px;line-height:20px}
.s3-rvq{flex-direction:column;align-items:flex-start;gap:12px}
.s3-rstars-s{justify-content:flex-start}
.s3-rstars-s .s3-rst .i{width:28px;height:28px}
.s3-rvq .s3-rst:hover{color:var(--star)}
.s3-myrv-h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.s3-myrv-h>span:last-child{display:flex;gap:8px}
.s3-myrv>p{margin-top:8px}
.s3-pre{white-space:pre-line}
.s3-det .s3-amap{height:197px;margin:0}
.s3-mpv{display:flex;align-items:center;gap:12px}
.s3-mpv .s3-thumb{width:56px;height:56px}
.s3-mpv .s3-ac-mt{display:flex;flex-direction:column;gap:2px;min-width:0}
.s3-mpv .s3-ac-mt b{font:600 16px/20px var(--f)}
.s3-mpv .s3-ac-mt i{font:400 14px/20px var(--f);font-style:normal;color:var(--ink-2)}
.s3-rspro{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px}
.s3-rspro .s3-slot{flex:none;padding-inline:16px}
.s3-rsw{display:flex;flex-direction:column;gap:4px}
.s3-rsw-n{font:600 16px/22px var(--f);margin:0}
.s3-done{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.s3-done svg{width:72px;height:72px}
.s3-cxlc{flex-direction:row;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px}
.s3-wl-bk{width:100%;justify-content:center}
.s3-other{max-width:560px;display:flex;flex-direction:column;gap:16px}
.s3-other .s3-mf{display:flex;gap:8px;padding:0}
.c7-rvhid{display:flex;gap:8px;align-items:flex-start;margin-top:8px;font-size:13px;line-height:18px}
.c7-rvhid .i{width:16px;height:16px;flex:none;margin-top:1px}
.c7-anon{display:flex;align-items:center;gap:12px;margin-top:12px}
.c7-thx{padding-top:48px}
.c7-err{margin:4px 0 0;color:var(--bad);font:400 13px/18px var(--f)}
.c7-rvopt{margin-top:8px}
.s3-opts button small{margin-inline-start:8px;color:var(--ink-3);font:400 13px/18px var(--f)}
.s3-pol.c7-anon{flex-direction:row;align-items:center;gap:12px;padding:16px;margin-top:8px}
.c7-anon>span{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.c7-anon small{color:var(--ink-2);font:400 13px/18px var(--f)}
/* TASK-K-LOYALTYME W-2: v12's `.c10-mh` (33095), the modal `s3loyal`'s headings (`.c8-soon` is legal.css's). */
.c10-mh{font:600 16px/22px var(--f);margin:20px 0 8px}
/* TASK-K-013W F-2: v12 `<style id="fparity-c5-site">` rows of the forms page (32883-32885); Z-41, Z-42. */
.c5-sfrm{margin-top:16px}
.c5-sfrm .s3-lct{flex:1;min-width:0}
.c5-sfq0{margin:32px 0;text-align:center}