:root{
  --bg:#f4f1ec;
  --paper:#fffdf9;
  --ink:#17181c;
  --muted:#76777c;
  --line:rgba(23,24,28,.10);
  --dark:#111216;
  --dark-2:#1a1b20;
  --dark-3:#25262c;
  --cream:#f3e7d2;
  --accent:#ef625f;
  --accent-2:#d94b55;
  --green:#2e9b69;
  --shadow:0 24px 60px rgba(22,20,18,.11);
  --radius:28px;
  --radius-sm:16px;
  --rail:88px;

  --pro-blue:#2f6df6;
  --pro-blue-soft:#edf3ff;
  --pro-ink:#14161a;
  --pro-muted:#737781;
  --pro-card:#fff;
  --pro-bg:#f7f5f1;
  --pro-warm:#f0e7da;
  --pro-border:rgba(20,22,26,.09);
  --pro-shadow:0 18px 50px rgba(28,29,33,.09);

  --font:DM Sans,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --display:Outfit,DM Sans,sans-serif;

  --search-bezier:cubic-bezier(.22,1,.36,1);
}

html{
  scroll-behavior:smooth;
  background:var(--pro-bg);
}

*{
  box-sizing:border-box;
}

body{
  margin:0;
  font-family:var(--font);
  color:var(--ink);
  background:var(--pro-bg);
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

body.search-open{
  overflow:hidden;
}

a{
  color:inherit;
  text-decoration:none;
}

button,
input,
textarea,
select{
  font:inherit;
}

button{
  cursor:pointer;
}

.app-body{
  min-height:100vh;
}

.page-noise{
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.025;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
  z-index:1000;
}

.icon{
  display:block;
  flex:0 0 auto;
}

.eyebrow{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:800;
}

.micro-label{
  display:block;
  color:#a0a0a5;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.13em;
  margin-bottom:2px;
}

.muted{
  color:#9a9a9e;
  font-size:.85em;
}

.btn{
  border:0;
  border-radius:14px;
  padding:13px 17px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font-weight:700;
  transition:.25s ease;
  white-space:nowrap;
}

.btn:hover{
  transform:translateY(-1px);
}

.btn:disabled{
  opacity:.65;
  cursor:not-allowed;
  transform:none;
}

.btn-primary{
  background:var(--accent);
  color:#fff;
  box-shadow:0 12px 28px rgba(239,98,95,.23);
}

.btn-dark{
  background:var(--dark);
  color:#fff;
}

.btn-light{
  background:#fff;
  border:1px solid var(--line);
  color:var(--ink);
}

.btn-glass{
  background:rgba(255,255,255,.1);
  backdrop-filter:blur(20px);
  color:#fff;
  border:1px solid rgba(255,255,255,.16);
}

.btn-xl{
  padding:15px 21px;
  border-radius:16px;
}

.btn-full{
  width:100%;
}

.icon-button,
.circle-ghost,
.round-filter{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:50%;
  width:42px;
  height:42px;
}

.icon-button.soft{
  background:#fff;
  border:1px solid var(--line);
  color:var(--ink);
}

.icon-button.has-dot{
  position:relative;
}

.icon-button.has-dot:after{
  content:"";
  position:absolute;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--accent);
  right:7px;
  top:7px;
  border:2px solid #fff;
}

.server-flash{
  position:fixed;
  z-index:2000;
  top:18px;
  left:50%;
  transform:translateX(-50%);
  padding:12px 16px;
  border-radius:999px;
  backdrop-filter:blur(15px);
  font-weight:700;
  font-size:13px;
  box-shadow:var(--shadow);
}

.server-flash.success{
  background:#e2f5ea;
  color:#17633f;
}

.server-flash.error{
  background:#ffe4e2;
  color:#922f35;
}

.server-flash.is-hidden{
  display:none;
}

.toast-stack{
  position:fixed;
  z-index:2500;
  right:18px;
  bottom:18px;
  display:grid;
  gap:8px;
}

.toast{
  background:var(--dark);
  color:#fff;
  border-radius:14px;
  padding:12px 15px;
  display:flex;
  align-items:center;
  gap:10px;
  max-width:340px;
  box-shadow:var(--shadow);
  opacity:0;
  transform:translateY(8px);
  transition:.24s;
}

.toast.show{
  opacity:1;
  transform:none;
}

.toast.error{
  background:#842f31;
}

.toast-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--accent);
  flex:0 0 auto;
}

.page-loader{
  position:fixed;
  inset:0;
  background:rgba(17,18,22,.94);
  z-index:5000;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  color:#fff;
  opacity:0;
  pointer-events:none;
  transition:.25s;
}

.page-loader.is-visible{
  opacity:1;
  pointer-events:auto;
}

.loader-orb{
  width:34px;
  height:34px;
  border-radius:50%;
  border:3px solid rgba(255,255,255,.15);
  border-top-color:var(--cream);
  animation:spin 1s linear infinite;
}

.loader-copy{
  font-size:12px;
  color:#d0d0d4;
}

@keyframes spin{
  to{
    transform:rotate(360deg);
  }
}

/* =========================================================
   RAIL
========================================================= */

.desktop-rail{
  position:fixed;
  left:0;
  top:0;
  bottom:0;
  width:82px;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:16px 10px;
  border-right:1px solid rgba(20,22,26,.075);
  background:rgba(250,248,244,.9);
  backdrop-filter:blur(18px);
  box-shadow:6px 0 30px rgba(0,0,0,.025);
  z-index:900;
}

.brand-mark{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:7px;
}

.brand-icon{
  width:40px;
  height:40px;
  border-radius:14px;
  background:#17191d;
  color:var(--cream);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 8px 20px rgba(0,0,0,.09);
}

.brand-name{
  font-size:8px;
  letter-spacing:.16em;
  font-weight:800;
  color:#5d6068;
}

.rail-nav{
  display:grid;
  gap:6px;
  margin-top:38px;
}

.rail-bottom{
  margin-top:auto;
  display:grid;
  gap:6px;
}

.rail-item{
  position:relative;
  width:60px;
  min-height:56px;
  border-radius:17px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  color:#85858a;
  font-size:8px;
  font-weight:700;
  border:0;
  background:transparent;
}

.rail-item:hover,
.rail-item.is-active{
  background:#fff;
  color:var(--ink);
  box-shadow:none;
}

.rail-item.is-active .icon{
  color:var(--pro-blue);
}

.rail-item.is-active:before{
  content:"";
  position:absolute;
  left:-10px;
  width:3px;
  height:23px;
  border-radius:0 5px 5px 0;
  background:var(--pro-blue);
}

.rail-button{
  cursor:pointer;
}

.mobile-bottom-nav{
  display:none;
}

.app-main.with-app-nav{
  margin-left:82px;
  padding-bottom:24px;
}

/* =========================================================
   LANDING
========================================================= */

.landing-body{
  background:#0d0e12;
  color:#fff;
  min-height:100vh;
}

.landing-topbar{
  position:absolute;
  z-index:20;
  top:0;
  left:0;
  right:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:26px 42px;
}

.landing-logo{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:600;
}

.landing-logo b{
  font-weight:800;
}

.landing-top-actions{
  display:flex;
  align-items:center;
  gap:12px;
}

.landing-top-actions a{
  padding:9px 12px;
  font-size:13px;
  color:#ddd;
}

.landing-top-actions .soft-link{
  border:1px solid rgba(255,255,255,.15);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  backdrop-filter:blur(14px);
}

.landing-hero{
  position:relative;
  min-height:82vh;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
  padding:130px 8vw 90px;
}

.landing-hero-image{
  position:absolute;
  inset:0;
  background-image:url('https://images.unsplash.com/photo-1512690459411-b0fd40d0b4b3?auto=format&fit=crop&w=2200&q=90');
  background-size:cover;
  background-position:center 42%;
  filter:saturate(.78);
}

.landing-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(7,8,10,.92) 0%,rgba(7,8,10,.63) 38%,rgba(7,8,10,.18) 72%,rgba(7,8,10,.78) 100%),
    linear-gradient(0deg,rgba(7,8,10,.9) 0%,rgba(7,8,10,.08) 56%);
}

.landing-content{
  position:relative;
  z-index:2;
  max-width:650px;
}

.eyebrow-pill{
  display:inline-flex;
  align-items:center;
  gap:7px;
  border-radius:999px;
  padding:8px 11px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(18px);
  font-size:11px;
  color:#efe9e0;
  margin-bottom:18px;
}

.landing-content h1{
  font-family:var(--display);
  font-weight:600;
  font-size:clamp(48px,7vw,92px);
  line-height:.94;
  margin:0;
  letter-spacing:-.045em;
}

.landing-content h1 em{
  font-style:normal;
  color:#ead8bb;
}

.landing-content>p{
  max-width:560px;
  color:#d4d3d7;
  font-size:18px;
  line-height:1.55;
  margin:24px 0 28px;
}

.landing-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.landing-proof{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:28px;
  color:#f0f0f0;
}

.landing-proof strong,
.landing-proof small{
  display:block;
}

.landing-proof strong{
  font-size:12px;
}

.landing-proof small{
  font-size:11px;
  color:#a9a9ae;
  margin-top:2px;
}

.proof-stack{
  display:flex;
}

.proof-stack span{
  width:29px;
  height:29px;
  border-radius:50%;
  background:#22242b;
  border:2px solid #0d0e12;
  margin-left:-6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:9px;
  font-weight:800;
}

.proof-stack span:first-child{
  margin-left:0;
  background:#f3e7d2;
  color:#111;
}

.landing-float-card{
  position:absolute;
  right:7vw;
  bottom:92px;
  z-index:3;
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  border-radius:18px;
}

.card-glass{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(18px);
}

.mini-avatar{
  width:38px;
  height:38px;
  border-radius:12px;
  background-image:var(--photo);
  background-size:cover;
  background-position:center;
}

.landing-float-card strong,
.landing-float-card span{
  display:block;
}

.landing-float-card strong{
  font-size:12px;
}

.landing-float-card span{
  font-size:11px;
  color:#c0c1c5;
}

.status-dot{
  width:8px;
  height:8px;
  background:#46c779;
  border-radius:50%;
  margin-left:2px;
}

.landing-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.1);
  border-bottom:1px solid rgba(255,255,255,.1);
  background:#0f1014;
}

.landing-strip>div{
  padding:22px 30px;
  border-right:1px solid rgba(255,255,255,.08);
  display:grid;
  gap:3px;
}

.landing-strip>div:last-child{
  border-right:0;
}

.strip-number{
  font-size:11px;
  color:#7e8088;
}

.landing-strip b{
  font-family:var(--display);
  font-size:19px;
  font-weight:600;
}

.landing-strip small{
  color:#8d8e94;
  font-size:11px;
}

.landing-owner-cta{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:50px;
  padding:85px 8vw;
  background:#ede6db;
  color:#17181c;
}

.landing-owner-cta>div{
  max-width:720px;
}

.landing-owner-cta h2{
  font-family:var(--display);
  font-size:clamp(36px,4vw,58px);
  letter-spacing:-.04em;
  line-height:1;
  margin:10px 0 15px;
}

.landing-owner-cta p{
  color:#65656a;
  max-width:620px;
}

.landing-footer{
  display:flex;
  justify-content:space-between;
  padding:22px 8vw;
  background:#ede6db;
  color:#77777c;
  font-size:11px;
  border-top:1px solid rgba(23,24,28,.09);
}

/* =========================================================
   APP
========================================================= */

.app-wrap{
  max-width:1500px;
  margin:0 auto;
  padding:34px 44px 72px;
}

.topbar-app{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
}

.location-pill{
  border:0;
  padding:3px 0;
  background:transparent;
  display:flex;
  align-items:center;
  gap:7px;
  font-size:14px;
  color:var(--ink);
}

.location-pill .icon{
  color:var(--accent);
}

.topbar-actions{
  display:flex;
  gap:8px;
}

.discover-search-wrap{
  display:grid;
  grid-template-columns:minmax(0,760px) auto;
  gap:10px;
  align-items:center;
}

.search-bar{
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid var(--line);
  background:var(--paper);
  border-radius:17px;
  padding:4px 14px;
}

.search-bar svg{
  color:#999;
}

.search-bar input{
  border:0;
  outline:0;
  background:transparent;
  width:100%;
  padding:12px 0;
  color:var(--ink);
}

.search-bar-large{
  margin-top:26px;
  max-width:760px;
}

.search-bar input::placeholder{
  color:#aaa;
}

.search-clear{
  border:0;
  background:transparent;
  font-size:22px;
  color:#929297;
}

.search-launcher{
  appearance:none;
  width:100%;
  min-height:50px;
  text-align:left;
  padding:3px 8px 3px 15px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 24px rgba(20,22,26,.04);
  border:1px solid rgba(20,22,26,.08);
  color:#91949a;
  transition:
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease;
}

.search-launcher:hover{
  transform:translateY(-1px);
  border-color:rgba(47,109,246,.22);
  box-shadow:0 14px 34px rgba(20,22,26,.07);
}

.search-launcher:focus-visible{
  outline:0;
  box-shadow:
    0 0 0 4px rgba(47,109,246,.08),
    0 14px 34px rgba(20,22,26,.07);
  border-color:rgba(47,109,246,.35);
}

.search-placeholder{
  flex:1;
  font-size:13px;
  color:#85888f;
}

.search-launch-shortcut{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:43px;
  height:30px;
  padding:0 8px;
  border:1px solid #e6e7ea;
  border-radius:9px;
  background:#f7f7f8;
  color:#a1a3a8;
  font-size:9px;
  font-weight:800;
  letter-spacing:.03em;
}

.round-filter{
  width:48px;
  height:48px;
  border-radius:15px;
  background:#17191d;
  box-shadow:0 10px 24px rgba(17,18,22,.15);
  color:#fff;
}

.premium-filter{
  color:#fff;
}

.filter-row-pro{
  display:flex;
  gap:8px;
  overflow:auto;
  padding:11px 0 4px;
  scrollbar-width:none;
}

.filter-row-pro::-webkit-scrollbar{
  display:none;
}

.filter-chip{
  border:1px solid var(--line);
  background:transparent;
  border-radius:999px;
  padding:9px 13px;
  color:#65666b;
  white-space:nowrap;
  font-size:12px;
  font-weight:700;
}

.filter-row-pro .filter-chip{
  background:#fff;
  border-color:rgba(20,22,26,.08);
  font-size:11px;
  padding:9px 13px;
  transition:.2s ease;
}

.filter-row-pro .filter-chip:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 15px rgba(20,22,26,.05);
}

.filter-chip.is-active{
  background:var(--dark);
  color:#fff;
  border-color:var(--dark);
}

.filter-row-pro .filter-chip.is-active{
  background:#17191d;
  color:#fff;
  border-color:#17191d;
}

/* =========================================================
   HERO / FEATURED
========================================================= */

.featured-shop-pro{
  display:grid;
  grid-template-columns:minmax(0,1.65fr) .75fr;
  gap:12px;
  margin-top:27px;
}

.featured-shop-media{
  min-height:420px;
  position:relative;
  border-radius:27px;
  overflow:hidden;
  background:#18191d;
  isolation:isolate;
}

.featured-slides{
  position:absolute;
  inset:0;
}

.featured-slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transform:scale(1.018);
  transition:
    opacity .55s var(--search-bezier),
    transform .9s var(--search-bezier),
    visibility 0s linear .55s;
}

.featured-slide.is-active{
  opacity:1;
  visibility:visible;
  transform:scale(1);
  transition:
    opacity .55s var(--search-bezier),
    transform 5.2s var(--search-bezier),
    visibility 0s;
  z-index:1;
}

.featured-slide>img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transform:scale(1.02);
}

.featured-slide.is-active>img{
  animation:featuredImageBreath 5.2s var(--search-bezier) forwards;
}

@keyframes featuredImageBreath{
  from{
    transform:scale(1.045);
  }

  to{
    transform:scale(1);
  }
}

.featured-shop-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(0deg,rgba(10,10,12,.88),rgba(10,10,12,.06) 62%),
    linear-gradient(90deg,rgba(10,10,12,.40),transparent 58%);
}

.featured-shop-top{
  position:absolute;
  top:15px;
  left:15px;
  right:15px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  z-index:3;
}

.featured-badge{
  padding:7px 10px;
  border-radius:999px;
  color:#fff;
  font-size:9px;
  letter-spacing:.14em;
  font-weight:800;
  background:rgba(20,20,24,.48);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.12);
}

.heart-button{
  position:relative;
  width:38px;
  height:38px;
  border-radius:50%;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.55);
  background:rgba(20,20,22,.23);
  backdrop-filter:blur(12px);
  color:#fff;
  z-index:3;
  transition:
    background .2s ease,
    border-color .2s ease,
    transform .2s ease;
}

.heart-button:hover{
  transform:scale(1.04);
  background:rgba(20,20,22,.34);
}

.heart-button.is-saved{
  background:var(--accent);
  border-color:var(--accent);
}

.heart-button.is-saved .icon{
  fill:#fff;
}

.featured-shop-copy{
  position:absolute;
  left:23px;
  right:23px;
  bottom:23px;
  color:#fff;
  z-index:3;
}

.featured-slide.is-active .featured-shop-copy{
  animation:featuredCopyIn .65s var(--search-bezier) both;
}

@keyframes featuredCopyIn{
  from{
    opacity:0;
    transform:translateY(16px);
  }

  to{
    opacity:1;
    transform:none;
  }
}

.featured-rating{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:11px;
}

.featured-rating span{
  display:inline-flex;
  gap:5px;
  align-items:center;
  padding:7px 8px;
  border-radius:999px;
  background:rgba(255,255,255,.94);
  color:#16171a;
  font-weight:800;
}

.featured-rating small{
  color:#e2e2e5;
}

.featured-shop-copy h2{
  font-family:var(--display);
  font-size:38px;
  letter-spacing:-.045em;
  margin:10px 0 2px;
}

.featured-shop-copy p{
  margin:0 0 16px;
  color:#d6d6da;
  font-size:12px;
}

.featured-view-link{
  box-shadow:0 7px 18px rgba(0,0,0,.10);
}

.featured-carousel-controls{
  position:absolute;
  left:18px;
  right:18px;
  bottom:18px;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:8px;
  z-index:5;
  pointer-events:none;
}

.featured-arrow{
  width:36px;
  height:36px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(20,20,24,.40);
  backdrop-filter:blur(14px);
  color:#fff;
  display:grid;
  place-items:center;
  pointer-events:auto;
  transition:.2s ease;
}

.featured-arrow:hover{
  background:rgba(20,20,24,.58);
  transform:translateY(-1px);
}

.featured-dots{
  display:flex;
  align-items:center;
  gap:6px;
  padding:0 4px;
}

.featured-dot{
  width:5px;
  height:5px;
  padding:0;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.42);
  transition:.25s ease;
  pointer-events:auto;
}

.featured-dot.is-active{
  width:18px;
  border-radius:999px;
  background:#fff;
}

.featured-slide-count{
  position:absolute;
  right:18px;
  top:18px;
  z-index:4;
  display:flex;
  align-items:center;
  gap:7px;
  color:#fff;
  font-size:8px;
  letter-spacing:.13em;
  font-weight:800;
  pointer-events:none;
}

.featured-slide-count i{
  width:22px;
  height:1px;
  background:rgba(255,255,255,.4);
}

.featured-slide-count small{
  font-size:8px;
  color:rgba(255,255,255,.56);
}

.featured-shop-side{
  background:#fff;
  border:1px solid var(--pro-border);
  border-radius:27px;
  padding:27px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:420px;
}

.featured-shop-side-pro{
  position:relative;
  overflow:hidden;
}

.featured-shop-side-pro:after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-90px;
  top:-90px;
  border-radius:50%;
  border:1px solid rgba(47,109,246,.09);
  box-shadow:
    0 0 0 32px rgba(47,109,246,.018),
    0 0 0 64px rgba(47,109,246,.012);
  pointer-events:none;
}

.featured-side-top{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
}

.featured-side-counter{
  font-size:8px;
  color:#a0a2a7;
  letter-spacing:.11em;
  font-weight:800;
}

.featured-side-main{
  position:relative;
  z-index:1;
  padding-top:35px;
}

.featured-side-icon{
  width:42px;
  height:42px;
  border-radius:13px;
  display:grid;
  place-items:center;
  background:#f4f0ea;
  color:#6e737c;
  margin-bottom:16px;
}

.featured-shop-side h3{
  font-family:var(--display);
  font-size:28px;
  line-height:1.03;
  margin:9px 0 10px;
  letter-spacing:-.03em;
}

.featured-shop-side>p{
  font-size:12px;
  color:#81838a;
  line-height:1.6;
  margin:0 0 22px;
}

.feature-checks{
  display:grid;
  gap:9px;
  position:relative;
  z-index:1;
}

.feature-checks span{
  display:flex;
  gap:8px;
  align-items:center;
  font-size:11px;
  color:#55585f;
}

.feature-checks span strong{
  font-weight:700;
}

.feature-checks .icon{
  color:#5e9b72;
}

.featured-side-bottom{
  position:relative;
  z-index:1;
  margin-top:25px;
}

.featured-side-bottom>span{
  display:block;
  font-size:8px;
  letter-spacing:.13em;
  color:#a4a6aa;
  font-weight:800;
  margin-bottom:8px;
}

.featured-side-progress{
  height:3px;
  border-radius:999px;
  background:#edf0f2;
  overflow:hidden;
}

.featured-side-progress i{
  display:block;
  width:0%;
  height:100%;
  border-radius:inherit;
  background:#17191d;
  transition:width .08s linear;
}

/* =========================================================
   SERVICES
========================================================= */

.service-section,
.shops-section{
  margin-top:38px;
}

.section-heading{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:15px;
  margin-bottom:14px;
}

.section-heading h2{
  margin:5px 0 0;
  font-family:var(--display);
  font-size:28px;
  letter-spacing:-.03em;
}

.section-heading a,
.section-heading>span{
  color:#a36a67;
  font-size:12px;
  font-weight:700;
}

.service-scroller{
  display:flex;
  gap:11px;
  overflow:auto;
  padding:2px 0 8px;
}

.service-scroller::-webkit-scrollbar,
.date-scroller::-webkit-scrollbar{
  display:none;
}

.service-pill{
  border:1px solid var(--line);
  background:var(--paper);
  border-radius:16px;
  min-width:108px;
  padding:12px 12px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:7px;
  color:#62636a;
  transition:.22s;
}

.service-pill:hover{
  transform:translateY(-2px);
}

.service-pill.is-active{
  border-color:var(--accent);
  box-shadow:0 10px 22px rgba(239,98,95,.12);
}

.service-icon{
  width:38px;
  height:38px;
  border-radius:12px;
  background:#fce5e1;
  color:#c75054;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
}

.service-pill span:last-child{
  font-size:12px;
  font-weight:700;
}

.service-pro{
  margin-top:34px;
}

.service-scroller-pro{
  gap:10px;
}

.service-scroller-pro .service-pill{
  min-width:120px;
  border-radius:17px;
  padding:12px;
  background:#fff;
}

.service-scroller-pro .service-icon{
  background:#f3f1ee;
  color:#23272e;
}

.service-scroller-pro .service-pill.is-active .service-icon{
  background:#e8eefc;
  color:var(--pro-blue);
}

/* =========================================================
   SHOP GRID
========================================================= */

.shops-pro{
  margin-top:35px;
}

.shop-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}

.shop-grid-pro{
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}

.shop-card{
  background:var(--paper);
  border-radius:22px;
  border:1px solid var(--line);
  overflow:hidden;
  transition:.28s ease;
  min-width:0;
  box-shadow:0 10px 25px rgba(30,28,25,.04);
}

.shop-card:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 40px rgba(30,28,25,.10);
}

.shop-card[hidden]{
  display:none;
}

.shop-media{
  height:245px;
  position:relative;
  overflow:hidden;
  background:#ddd;
}

.shop-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .5s ease;
}

.shop-card:hover .shop-media img{
  transform:scale(1.04);
}

.shop-media-pro{
  height:240px;
}

.media-gradient{
  position:absolute;
  inset:auto 0 0;
  height:95px;
  background:linear-gradient(0deg,rgba(0,0,0,.62),transparent);
}

.rating-badge{
  position:absolute;
  left:12px;
  top:12px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  padding:7px 9px;
  font-size:11px;
  font-weight:800;
}

.rating-badge small{
  font-size:10px;
  color:#7b7b80;
  font-weight:600;
}

.shop-media-top{
  position:absolute;
  top:11px;
  left:11px;
  right:11px;
  display:flex;
  justify-content:space-between;
  z-index:3;
}

.shop-media-top .rating-badge{
  position:static;
  box-shadow:0 5px 16px rgba(0,0,0,.1);
}

.shop-media-bottom{
  position:absolute;
  left:11px;
  right:11px;
  bottom:11px;
  display:flex;
  justify-content:space-between;
  color:#fff;
  font-size:9px;
}

.shop-media-bottom span{
  background:rgba(15,16,19,.52);
  border:1px solid rgba(255,255,255,.11);
  backdrop-filter:blur(10px);
  border-radius:999px;
  padding:6px 8px;
}

.floating-tag{
  position:absolute;
  left:11px;
  bottom:11px;
  border-radius:999px;
  background:rgba(18,18,20,.65);
  backdrop-filter:blur(8px);
  color:#fff;
  padding:6px 8px;
  font-size:10px;
  font-weight:700;
}

.shop-card-body{
  padding:14px 15px 16px;
}

.shop-card-body-pro{
  padding:15px;
}

.shop-title-row{
  display:flex;
  align-items:center;
  gap:10px;
}

.shop-title-row h3{
  font-family:var(--display);
  font-size:19px;
  margin:0;
  letter-spacing:-.03em;
  flex:1;
}

.distance{
  color:#8a8a8f;
  font-size:10px;
  white-space:nowrap;
}

.shop-card-body p{
  color:#86868b;
  font-size:12px;
  margin:6px 0 14px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.shop-card-body-pro p{
  font-size:11px;
  margin-bottom:13px;
}

.shop-meta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:#626369;
  font-size:11px;
}

.shop-meta-pro{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  font-size:10px;
  color:#96989f;
}

.shop-meta-pro b{
  color:#17191d;
}

.status{
  padding:5px 8px;
  border-radius:999px;
  background:#f0efec;
}

.status.open{
  background:#e7f7ef;
  color:#26764f;
}

.shop-meta b{
  color:var(--ink);
}

.empty-state{
  text-align:center;
  padding:60px 20px;
}

.empty-icon{
  width:58px;
  height:58px;
  border-radius:20px;
  background:#fff;
  border:1px solid var(--line);
  display:grid;
  place-items:center;
  margin:0 auto 16px;
}

.empty-state h3{
  font-family:var(--display);
  font-size:24px;
  margin:0 0 8px;
}

.empty-state p{
  color:var(--muted);
  margin:0 auto 20px;
  max-width:420px;
}

.empty-state-pro{
  border:1px dashed rgba(20,22,26,.14);
  background:#fff;
  border-radius:24px;
  margin-top:12px;
}

/* =========================================================
   OWNER BANNER
========================================================= */

.owner-banner{
  margin-top:44px;
  border-radius:26px;
  padding:24px;
  background:#ece4d7;
  display:flex;
  align-items:center;
  gap:16px;
}

.owner-banner h3{
  margin:3px 0 3px;
  font-family:var(--display);
  font-size:22px;
}

.owner-banner p{
  margin:0;
  color:#727277;
  font-size:12px;
}

.owner-banner .eyebrow{
  font-size:9px;
}

.owner-banner .btn{
  flex:0 0 auto;
}

.owner-banner-pro{
  margin-top:38px;
  border-radius:28px;
  background:#f0e9df;
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:20px;
  padding:33px 35px;
}

.owner-banner-pro .owner-banner-copy{
  max-width:670px;
}

.owner-banner-pro h3{
  font-family:var(--display);
  font-size:30px;
  line-height:1.05;
  letter-spacing:-.035em;
  margin:7px 0 8px;
}

.owner-banner-pro p{
  color:#7d7b76;
  font-size:12px;
  max-width:590px;
  margin:0;
}

/* =========================================================
   SEARCH MODAL
========================================================= */

.search-modal{
  position:fixed;
  inset:0 0 0 82px;
  z-index:4500;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:18px 18px 18px 0;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:
    opacity .22s ease,
    visibility 0s linear .22s;
}

.search-modal[hidden]{
  display:flex;
}

.search-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:
    opacity .22s ease,
    visibility 0s;
}

.search-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(16,18,22,.48);
  backdrop-filter:blur(11px);
}

.search-modal-panel{
  position:relative;
  width:min(940px,100%);
  max-height:calc(100vh - 36px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.72);
  border-radius:30px;
  background:rgba(250,248,244,.97);
  box-shadow:
    0 40px 110px rgba(10,11,14,.20),
    0 8px 28px rgba(10,11,14,.08);
  transform:translateY(-16px) scale(.985);
  opacity:0;
  transition:
    transform .32s var(--search-bezier),
    opacity .25s ease;
}

.search-modal.is-open .search-modal-panel{
  transform:none;
  opacity:1;
}

.search-modal-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:22px 24px 15px;
}

.search-modal-heading{
  display:flex;
  align-items:center;
  gap:13px;
}

.search-modal-heading h2{
  margin:4px 0 0;
  font-family:var(--display);
  font-size:28px;
  line-height:1;
  letter-spacing:-.035em;
}

.search-modal-back{
  width:39px;
  height:39px;
  border-radius:13px;
  border:1px solid var(--pro-border);
  background:#fff;
  color:#60636a;
  display:grid;
  place-items:center;
  box-shadow:0 6px 18px rgba(20,22,26,.04);
  transition:.2s ease;
}

.search-modal-back:hover{
  transform:translateX(-2px);
}

.search-modal-desktop-hint{
  display:flex;
  align-items:center;
  gap:7px;
  color:#9ca0a6;
}

.search-modal-desktop-hint span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:33px;
  height:25px;
  padding:0 7px;
  border-radius:7px;
  border:1px solid #e1e2e5;
  background:#fff;
  font-size:8px;
  font-weight:800;
}

.search-modal-desktop-hint small{
  font-size:9px;
}

.search-modal-input-shell{
  margin:0 24px;
  height:58px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:0 10px 0 17px;
  background:#fff;
  border:1px solid rgba(20,22,26,.09);
  border-radius:18px;
  box-shadow:
    0 12px 30px rgba(20,22,26,.055),
    inset 0 0 0 1px rgba(255,255,255,.35);
}

.search-modal-input-shell>.icon{
  color:#83868d;
}

.search-modal-input-shell:focus-within{
  border-color:rgba(47,109,246,.28);
  box-shadow:
    0 0 0 4px rgba(47,109,246,.07),
    0 14px 30px rgba(20,22,26,.06);
}

.search-modal-input-shell input{
  flex:1;
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--ink);
  font-size:16px;
}

.search-modal-input-shell input::placeholder{
  color:#a3a5aa;
}

.search-modal-clear{
  width:34px;
  height:34px;
  border:0;
  border-radius:10px;
  background:#f2f3f5;
  color:#767980;
  display:grid;
  place-items:center;
}

.search-modal-status{
  min-height:31px;
  display:flex;
  align-items:center;
  gap:7px;
  margin:0 24px;
  color:#8a8d94;
  font-size:10px;
  padding:8px 0 2px;
}

.search-status-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#b8bbc0;
  transition:.2s ease;
}

.search-status-dot.is-active{
  background:#54ae78;
  box-shadow:0 0 0 4px rgba(84,174,120,.09);
}

.search-modal-content{
  min-height:0;
  overflow:auto;
  padding:6px 24px 20px;
  scrollbar-width:thin;
  scrollbar-color:#d5d6d9 transparent;
}

.search-modal-content::-webkit-scrollbar{
  width:8px;
}

.search-modal-content::-webkit-scrollbar-thumb{
  border-radius:20px;
  background:#d9dadd;
}

.search-section-label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 1px 10px;
}

.search-section-label>span{
  font-size:9px;
  letter-spacing:.15em;
  color:#777a81;
  font-weight:800;
}

.search-section-label small{
  font-size:9px;
  color:#a4a6ab;
}

.search-section-label-spaced{
  margin-top:24px;
}

.search-suggestion-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.search-suggestion-chips button{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:40px;
  padding:7px 12px 7px 8px;
  border:1px solid rgba(20,22,26,.08);
  border-radius:13px;
  background:#fff;
  color:#4b4e55;
  font-size:10px;
  font-weight:800;
  box-shadow:0 5px 15px rgba(20,22,26,.025);
  transition:
    transform .2s ease,
    box-shadow .2s ease,
    border-color .2s ease;
}

.search-suggestion-chips button:hover{
  transform:translateY(-2px);
  border-color:rgba(47,109,246,.20);
  box-shadow:0 9px 22px rgba(20,22,26,.065);
}

.search-suggestion-chips button>span{
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  background:#f3f4f5;
  border-radius:9px;
  color:#646972;
}

.search-featured-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:9px;
}

.search-mini-card{
  text-align:left;
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
  border:1px solid rgba(20,22,26,.08);
  background:#fff;
  border-radius:15px;
  padding:8px;
  transition:
    transform .2s ease,
    box-shadow .2s ease;
}

.search-mini-card:hover{
  transform:translateY(-2px);
  box-shadow:0 11px 24px rgba(20,22,26,.07);
}

.search-mini-image{
  width:44px;
  height:44px;
  flex:0 0 auto;
  border-radius:11px;
  overflow:hidden;
  background:#e8e5df;
}

.search-mini-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.search-mini-copy{
  min-width:0;
}

.search-mini-copy strong,
.search-mini-copy small{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.search-mini-copy strong{
  font-size:10px;
}

.search-mini-copy small{
  font-size:8px;
  color:#92959b;
  margin-top:3px;
}

.search-smart-tip{
  display:flex;
  gap:10px;
  align-items:flex-start;
  margin-top:23px;
  padding:13px 14px;
  background:#f6f2eb;
  border:1px solid #ebe4da;
  border-radius:16px;
}

.search-smart-icon{
  width:31px;
  height:31px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#fff;
  color:#777c83;
}

.search-smart-tip strong{
  font-size:10px;
  color:#53565d;
}

.search-smart-tip p{
  margin:3px 0 0;
  color:#8a8d93;
  font-size:9px;
  line-height:1.45;
}

.search-results-view{
  animation:searchResultsIn .24s ease both;
}

@keyframes searchResultsIn{
  from{
    opacity:0;
    transform:translateY(5px);
  }

  to{
    opacity:1;
    transform:none;
  }
}

.search-results-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}

.search-result-card{
  display:grid;
  grid-template-columns:72px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:8px;
  border:1px solid rgba(20,22,26,.08);
  background:#fff;
  border-radius:17px;
  min-width:0;
  transition:
    transform .2s ease,
    box-shadow .2s ease,
    border-color .2s ease;
}

.search-result-card:hover{
  transform:translateY(-2px);
  border-color:rgba(47,109,246,.15);
  box-shadow:0 12px 28px rgba(20,22,26,.065);
}

.search-result-image{
  position:relative;
  width:72px;
  height:72px;
  border-radius:13px;
  overflow:hidden;
  background:#e8e5df;
}

.search-result-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.search-result-rating{
  position:absolute;
  left:6px;
  bottom:6px;
  padding:5px 6px;
  border-radius:999px;
  background:rgba(16,18,21,.68);
  backdrop-filter:blur(8px);
  color:#fff;
  font-size:8px;
  font-weight:800;
}

.search-result-copy{
  min-width:0;
}

.search-result-copy>strong,
.search-result-copy>small,
.search-result-copy>.search-result-services{
  display:block;
}

.search-result-copy>strong{
  font-family:var(--display);
  font-size:13px;
  line-height:1.12;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.search-result-copy>small{
  color:#8f9298;
  font-size:8px;
  margin-top:4px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.search-result-copy mark{
  background:#fff0c9;
  color:inherit;
  padding:0 2px;
  border-radius:3px;
}

.search-result-services{
  display:flex!important;
  flex-wrap:wrap;
  gap:4px;
  margin-top:7px;
}

.search-result-services i{
  max-width:100px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-style:normal;
  font-size:8px;
  color:#71747b;
  background:#f3f2ef;
  border-radius:999px;
  padding:4px 6px;
}

.search-result-side{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  min-width:45px;
}

.search-result-side strong{
  font-family:var(--display);
  font-size:11px;
}

.search-result-side small{
  color:#a3a5aa;
  font-size:7px;
  margin-top:1px;
}

.search-result-arrow{
  width:28px;
  height:28px;
  border-radius:9px;
  display:grid;
  place-items:center;
  background:#f3f4f5;
  color:#70747b;
  margin-top:8px;
  font-size:14px;
}

.search-results-empty{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:50px 20px 40px;
}

.search-results-empty-icon{
  width:53px;
  height:53px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:#f0efec;
  color:#777b82;
  margin-bottom:14px;
}

.search-results-empty strong{
  font-family:var(--display);
  font-size:19px;
}

.search-results-empty p{
  max-width:340px;
  margin:6px 0 0;
  color:#92959b;
  font-size:10px;
}

.search-modal-footer{
  min-height:46px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  padding:10px 24px;
  border-top:1px solid rgba(20,22,26,.07);
  background:rgba(248,246,241,.92);
}

.search-modal-footer>span{
  display:flex;
  align-items:center;
  gap:6px;
  color:#9a9da2;
  font-size:8px;
}

.search-modal-footer button{
  border:0;
  background:transparent;
  color:#5f636a;
  font-size:9px;
  font-weight:800;
}

/* =========================================================
   DETAIL
========================================================= */

.shop-detail{
  background:var(--dark);
  min-height:100vh;
}

.detail-hero-media{
  height:min(54vh,640px);
  position:relative;
  overflow:hidden;
}

.detail-hero-media>img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.detail-hero-scrim{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(9,9,11,.25),transparent 35%,rgba(9,9,11,.8) 100%);
}

.detail-nav{
  position:absolute;
  left:22px;
  right:22px;
  top:24px;
  display:flex;
  justify-content:space-between;
  z-index:3;
}

.detail-nav-actions{
  display:flex;
  gap:8px;
}

.circle-ghost{
  background:rgba(255,255,255,.9);
  color:#1c1c20;
  backdrop-filter:blur(12px);
  box-shadow:0 8px 20px rgba(0,0,0,.12);
}

.detail-sheet{
  max-width:1040px;
  margin:-110px auto 0;
  position:relative;
  z-index:4;
  background:#f7f3ed;
  border-radius:34px 34px 0 0;
  padding:27px 34px 60px;
  min-height:500px;
}

.rating-ribbon{
  display:inline-flex;
  align-items:center;
  gap:4px;
  background:var(--accent);
  color:#fff;
  border-radius:999px;
  padding:8px 11px;
  font-size:11px;
  font-weight:800;
  box-shadow:0 10px 24px rgba(239,98,95,.22);
  transform:translateY(-44px);
}

.rating-ribbon span{
  font-weight:500;
  opacity:.88;
}

.detail-heading{
  display:flex;
  justify-content:space-between;
  gap:25px;
  margin-top:-24px;
}

.detail-heading h1{
  font-family:var(--display);
  font-size:42px;
  line-height:1;
  margin:5px 0;
}

.detail-heading p{
  color:#78787d;
  margin:0;
}

.detail-price{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}

.detail-price small{
  color:#96969a;
  font-size:11px;
}

.detail-price strong{
  font-family:var(--display);
  font-size:23px;
}

.detail-meta-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:20px;
  padding-top:17px;
  border-top:1px solid var(--line);
  color:#67686d;
  font-size:12px;
}

.detail-meta-row span{
  display:inline-flex;
  align-items:center;
  gap:7px;
}

.detail-meta-row .icon{
  color:var(--accent);
}

.action-strip{
  display:flex;
  gap:10px;
  margin-top:20px;
  overflow:auto;
  padding-bottom:3px;
}

.action-strip a,
.action-strip button{
  min-width:78px;
  border:0;
  background:#fff;
  border-radius:16px;
  padding:12px 10px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:7px;
  color:#55565c;
  border:1px solid var(--line);
  font-size:10px;
  font-weight:700;
}

.action-strip .icon{
  color:var(--accent);
}

.detail-tabs{
  display:flex;
  gap:22px;
  border-bottom:1px solid var(--line);
  margin-top:24px;
  overflow:auto;
}

.detail-tab{
  border:0;
  background:transparent;
  padding:14px 0 11px;
  color:#96979c;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
  position:relative;
}

.detail-tab.is-active{
  color:var(--ink);
}

.detail-tab.is-active:after{
  content:"";
  position:absolute;
  height:2px;
  left:0;
  right:0;
  bottom:-1px;
  background:var(--accent);
  border-radius:2px;
}

.detail-panel{
  display:none;
  padding:22px 0 6px;
}

.detail-panel.is-active{
  display:block;
}

.detail-copy h2,
.services-list h2{
  font-family:var(--display);
  margin:0 0 8px;
  font-size:22px;
}

.detail-copy p{
  color:#78797e;
  max-width:800px;
}

.mini-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:18px;
}

.mini-stats>div{
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:13px 14px;
}

.mini-stats strong,
.mini-stats span{
  display:block;
}

.mini-stats strong{
  font-family:var(--display);
  font-size:21px;
}

.mini-stats span{
  color:#909095;
  font-size:10px;
  margin-top:2px;
}

.services-list{
  display:grid;
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
}

.service-line{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:15px 16px;
  background:#fff;
  border-bottom:1px solid var(--line);
}

.service-line:last-child{
  border-bottom:0;
}

.service-line>div{
  display:flex;
  flex-direction:column;
}

.service-line span{
  font-size:10px;
  color:#94949a;
  margin-top:2px;
}

.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}

.gallery-photo{
  aspect-ratio:1;
  overflow:hidden;
  border-radius:14px;
  background:#ddd;
}

.gallery-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.review-summary{
  display:flex;
  gap:15px;
  align-items:center;
  background:#fff;
  border:1px solid var(--line);
  padding:18px;
  border-radius:18px;
}

.review-score{
  font-family:var(--display);
  font-size:32px;
  display:flex;
  gap:3px;
  align-items:center;
}

.review-score span{
  color:#f3a24f;
  font-size:19px;
}

.review-summary p{
  margin:4px 0 0;
  color:#8d8e93;
  font-size:11px;
}

.booking-zone{
  margin-top:26px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:23px;
  padding:17px;
}

.booking-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
}

.booking-head h2{
  font-family:var(--display);
  font-size:24px;
  margin:5px 0 0;
}

.availability-chip{
  font-size:10px;
  color:#22754b;
  background:#e6f5ed;
  padding:7px 9px;
  border-radius:999px;
}

.date-scroller{
  display:flex;
  gap:8px;
  overflow:auto;
  margin-top:15px;
  padding-bottom:2px;
}

.date-chip{
  min-width:67px;
  border:1px solid var(--line);
  border-radius:15px;
  background:#fbfaf7;
  padding:10px 8px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
  color:#8a8b90;
}

.date-chip span{
  font-size:10px;
}

.date-chip b{
  font-family:var(--display);
  font-size:18px;
  color:var(--ink);
}

.date-chip.is-active{
  background:#f8e5cf;
  border-color:#f0d4b0;
}

.time-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:7px;
  margin-top:12px;
}

.time-chip{
  border:1px solid var(--line);
  background:#fbfaf7;
  border-radius:12px;
  padding:10px 5px;
  font-size:10px;
  color:#77787e;
}

.time-chip.is-active{
  background:var(--dark);
  color:#fff;
  border-color:var(--dark);
}

.btn-book{
  margin-top:16px;
}

.modal-overlay{
  position:fixed;
  inset:0;
  z-index:4000;
  background:rgba(11,12,15,.62);
  backdrop-filter:blur(7px);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:16px;
}

.modal-overlay[hidden]{
  display:none;
}

.modal-overlay.is-open .modal-card{
  transform:translateY(0);
  opacity:1;
}

.modal-card{
  width:min(640px,100%);
  background:#f8f3eb;
  border-radius:28px 28px 20px 20px;
  padding:9px 20px 20px;
  transform:translateY(20px);
  opacity:0;
  transition:.22s ease;
  max-height:92vh;
  overflow:auto;
}

.sheet-handle{
  width:46px;
  height:5px;
  border-radius:999px;
  background:#d8d2c7;
  margin:2px auto 14px;
}

.sheet-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  margin-bottom:15px;
}

.sheet-head h2{
  font-family:var(--display);
  margin:4px 0 0;
  font-size:25px;
}

/* =========================================================
   CREATOR / AUTH
========================================================= */

.form-stack{
  display:grid;
  gap:14px;
}

.form-stack label,
.creator-card label,
.form-editor label{
  display:grid;
  gap:7px;
  font-size:11px;
  color:#6c6d72;
  font-weight:700;
}

.form-stack input,
.form-stack select,
.form-stack textarea,
.creator-card input,
.creator-card select,
.creator-card textarea,
.form-editor input,
.form-editor select,
.form-editor textarea{
  width:100%;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fffdf9;
  padding:12px 13px;
  outline:0;
  color:var(--ink);
  resize:vertical;
}

.creator-card{
  background:#fffdf9;
  border:1px solid var(--line);
  border-radius:30px;
  box-shadow:var(--shadow);
  padding:28px;
}

.creator-page{
  min-height:100vh;
  background:#f2eee7;
}

.creator-topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:22px 38px;
  border-bottom:1px solid var(--line);
  background:rgba(242,238,231,.86);
  backdrop-filter:blur(18px);
  position:sticky;
  top:0;
  z-index:10;
}

.creator-shell{
  max-width:1180px;
  margin:0 auto;
  padding:55px 34px 80px;
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:40px;
}

.creator-intro{
  padding-top:30px;
  position:sticky;
  top:100px;
  align-self:start;
}

.creator-intro h1{
  font-family:var(--display);
  font-size:clamp(42px,5vw,68px);
  line-height:.96;
  letter-spacing:-.045em;
  margin:10px 0 15px;
}

.creator-intro h1 em{
  color:#a05d59;
  font-style:normal;
}

.creator-intro>p{
  color:#72737a;
  max-width:470px;
}

.creator-benefits{
  display:grid;
  gap:10px;
  margin-top:24px;
}

.creator-benefits div{
  display:flex;
  align-items:center;
  gap:9px;
  color:#4e4f54;
  font-size:13px;
}

.creator-benefits .icon{
  color:var(--green);
}

.creator-quote{
  margin-top:32px;
  border-radius:22px;
  padding:17px 17px 16px;
  color:#f8f4ec;
  max-width:430px;
  background:#18191d;
}

.quote-mark{
  font-family:Georgia;
  font-size:34px;
  color:#f1dfc5;
}

.creator-quote p{
  margin:0;
  color:#d3d3d5;
  font-size:12px;
  line-height:1.5;
}

.creator-card input:focus,
.creator-card textarea:focus,
.form-editor input:focus,
.form-editor textarea:focus,
.form-editor select:focus,
.form-stack input:focus,
.form-stack select:focus,
.form-stack textarea:focus{
  border-color:rgba(239,98,95,.55);
  box-shadow:0 0 0 4px rgba(239,98,95,.07);
}

.stepper{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:28px;
}

.step{
  display:flex;
  align-items:center;
  gap:7px;
  color:#9a9a9e;
  font-size:10px;
  font-weight:800;
}

.step span{
  width:28px;
  height:28px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:50%;
  display:grid;
  place-items:center;
}

.step.is-active{
  color:var(--ink);
}

.step.is-active span,
.step.is-done span{
  background:var(--dark);
  color:#fff;
  border-color:var(--dark);
}

.step.is-done span{
  color:var(--cream);
}

.step-line{
  height:1px;
  background:var(--line);
  flex:1;
}

.form-step{
  display:none;
}

.form-step.is-active{
  display:block;
  animation:rise .32s ease;
}

@keyframes rise{
  from{
    opacity:0;
    transform:translateY(8px);
  }

  to{
    opacity:1;
    transform:none;
  }
}

.form-heading h2{
  font-family:var(--display);
  font-size:31px;
  margin:6px 0;
}

.form-heading p{
  margin:0 0 24px;
  color:#7d7e83;
}

.form-grid{
  display:grid;
  gap:12px;
}

.form-grid.two{
  grid-template-columns:1fr 1fr;
}

.form-step label{
  margin-bottom:14px;
}

.form-actions{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  margin-top:26px;
  padding-top:18px;
  border-top:1px solid var(--line);
}

.service-builder{
  display:grid;
  gap:8px;
}

.service-row{
  display:grid;
  grid-template-columns:1.4fr .7fr .75fr auto;
  gap:7px;
  align-items:center;
}

.service-row input{
  margin:0!important;
}

.remove-row{
  width:38px;
  height:38px;
  border-radius:12px;
  border:1px solid var(--line);
  background:#fff;
  color:#9b9ba0;
}

.text-add{
  border:0;
  background:transparent;
  color:#b54e51;
  font-size:12px;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 0;
  margin-top:7px;
}

.publish-preview{
  display:flex;
  gap:12px;
  align-items:center;
  background:#f6efe5;
  border:1px solid #ecdcc8;
  border-radius:16px;
  padding:14px;
  margin:18px 0;
}

.publish-icon{
  width:42px;
  height:42px;
  border-radius:13px;
  background:#fff;
  display:grid;
  place-items:center;
  color:#b45e55;
}

.publish-preview strong{
  font-size:13px;
}

.publish-preview p{
  margin:3px 0 0;
  color:#77787d;
  font-size:10px;
}

.auth-page{
  min-height:100vh;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  background:#f4f0e9;
}

.auth-art{
  background:#131419;
  min-height:100vh;
  position:relative;
  background-image:
    linear-gradient(90deg,rgba(11,12,14,.76),rgba(11,12,14,.32)),
    url('https://images.unsplash.com/photo-1599351431202-1e0f0e9a47d0?auto=format&fit=crop&w=1600&q=88');
  background-size:cover;
  background-position:center;
}

.auth-art-content{
  position:absolute;
  left:9%;
  right:12%;
  bottom:10%;
  color:#fff;
}

.auth-art-content h1{
  font-family:var(--display);
  font-size:clamp(48px,5vw,76px);
  line-height:.96;
  letter-spacing:-.05em;
  margin:12px 0;
}

.auth-art-content em{
  font-style:normal;
  color:#e8d6bb;
}

.auth-art-content p{
  max-width:520px;
  color:#c9c9cd;
}

.auth-art-stat{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:25px;
}

.auth-art-stat strong{
  font-family:var(--display);
  font-size:30px;
  color:#f3e7d2;
}

.auth-art-stat span{
  color:#afb0b6;
  max-width:250px;
  font-size:12px;
}

.auth-panel{
  padding:35px;
  display:flex;
  flex-direction:column;
}

.back-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#77787d;
  font-size:12px;
  font-weight:700;
}

.auth-form{
  max-width:430px;
  width:100%;
  margin:auto;
}

.auth-form h2{
  font-family:var(--display);
  font-size:34px;
  margin:7px 0;
}

.auth-form>p{
  color:#7b7c81;
  margin:0 0 24px;
}

.auth-divider{
  display:flex;
  align-items:center;
  gap:9px;
  margin:20px 0;
  color:#9b9ba0;
  font-size:11px;
}

.auth-divider:before,
.auth-divider:after{
  content:"";
  height:1px;
  background:var(--line);
  flex:1;
}

.auth-divider span{
  padding:0 5px;
}

.error-page{
  min-height:70vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
}

.error-page h1{
  font-family:var(--display);
  font-size:40px;
}

/* =========================================================
   DASHBOARD
========================================================= */

.dashboard-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:25px;
  margin-bottom:24px;
}

.dashboard-head h1,
.edit-top h1{
  font-family:var(--display);
  font-size:45px;
  line-height:1;
  letter-spacing:-.045em;
  margin:7px 0;
}

.dashboard-head p,
.edit-top p{
  margin:0;
  color:#7d7e83;
}

.dashboard-head-actions{
  display:flex;
  gap:8px;
}

.dashboard-card,
.stat-card,
.empty-state-card{
  background:#fffdf9;
  border:1px solid var(--line);
  border-radius:24px;
}

.profile-hero-card{
  overflow:hidden;
}

.profile-cover{
  min-height:310px;
  background-size:cover;
  background-position:center;
  position:relative;
}

.profile-cover-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,rgba(12,13,16,.86),rgba(12,13,16,.05) 65%);
}

.profile-cover-content{
  position:absolute;
  left:22px;
  bottom:22px;
  color:#fff;
}

.status-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:rgba(255,255,255,.12);
  backdrop-filter:blur(12px);
  padding:7px 9px;
  border-radius:999px;
  font-size:10px;
}

.status-chip span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#52ca81;
}

.profile-cover-content h2{
  font-family:var(--display);
  font-size:37px;
  margin:12px 0 2px;
}

.profile-cover-content p{
  margin:0;
  color:#d4d4d7;
  font-size:12px;
}

.profile-card-footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:16px 18px;
}

.profile-mini-stats{
  display:flex;
  gap:22px;
}

.profile-mini-stats>div strong,
.profile-mini-stats>div span{
  display:block;
}

.profile-mini-stats strong{
  font-family:var(--display);
  font-size:19px;
}

.profile-mini-stats span{
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.09em;
  color:#999a9f;
}

.dashboard-stat-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-top:14px;
}

.stat-card{
  padding:16px;
}

.stat-icon{
  width:38px;
  height:38px;
  border-radius:13px;
  background:#f5e7d9;
  color:#b65b55;
  display:grid;
  place-items:center;
  margin-bottom:15px;
}

.stat-card small,
.stat-card>span{
  display:block;
  color:#999a9f;
  font-size:10px;
}

.stat-card strong{
  font-family:var(--display);
  font-size:27px;
  display:block;
  margin-top:4px;
}

.trend-up{
  color:#2c8d63!important;
  margin-top:3px;
}

.dashboard-two-col{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:12px;
  margin-top:14px;
}

.dashboard-two-col .dashboard-card{
  padding:20px;
}

.dash-card-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:13px;
}

.dash-card-head h2{
  font-family:var(--display);
  margin:5px 0 0;
  font-size:24px;
}

.small-pill{
  padding:7px 9px;
  border-radius:999px;
  background:#f0eeea;
  color:#77787d;
  font-size:9px;
  font-weight:800;
}

.booking-list{
  display:grid;
}

.booking-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 0;
  border-bottom:1px solid var(--line);
}

.booking-row:last-child{
  border-bottom:0;
}

.booking-avatar{
  width:38px;
  height:38px;
  border-radius:13px;
  background:#eee1d4;
  display:grid;
  place-items:center;
  font-family:var(--display);
  font-weight:800;
}

.booking-main{
  flex:1;
}

.booking-main strong,
.booking-main span{
  display:block;
}

.booking-main span{
  font-size:10px;
  color:#929399;
  margin-top:3px;
}

.booking-status{
  font-size:9px;
  padding:6px 8px;
  border-radius:999px;
  background:#f0efed;
}

.booking-status.pending{
  background:#fff0d3;
  color:#a66f1c;
}

.empty-inline{
  padding:34px 12px;
  text-align:center;
  color:#8f9095;
}

.empty-inline>div{
  width:42px;
  height:42px;
  border-radius:14px;
  background:#f6eee4;
  display:grid;
  place-items:center;
  margin:0 auto 10px;
  color:#b85c56;
}

.empty-inline p{
  font-size:11px;
  max-width:300px;
  margin:0 auto;
}

.quick-actions{
  display:grid;
}

.quick-actions a{
  display:flex;
  align-items:center;
  gap:11px;
  padding:13px 0;
  border-bottom:1px solid var(--line);
}

.quick-actions a:last-child{
  border-bottom:0;
}

.quick-actions>a>.icon:first-child{
  color:#b75a56;
}

.quick-actions div{
  flex:1;
}

.quick-actions strong,
.quick-actions span{
  display:block;
}

.quick-actions strong{
  font-size:12px;
}

.quick-actions span{
  font-size:10px;
  color:#94959a;
  margin-top:2px;
}

.edit-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:20px;
  margin-bottom:22px;
}

.form-editor{
  overflow:hidden;
}

.editor-section{
  padding:25px 26px;
  border-bottom:1px solid var(--line);
}

.editor-heading{
  margin-bottom:17px;
}

.editor-heading h2{
  font-family:var(--display);
  margin:5px 0 5px;
  font-size:26px;
}

.editor-heading p{
  margin:0;
  color:#85868b;
  font-size:12px;
}

.hours-editor{
  display:grid;
  grid-template-columns:1fr .8fr;
  gap:22px;
}

.hours-editor>div:first-child{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.hours-note{
  background:#f5efe5;
  border-radius:17px;
  padding:14px;
}

.hours-note p{
  font-size:11px;
  color:#7a7b80;
}

.cover-uploader{
  display:flex;
  align-items:center;
  gap:13px;
  margin-bottom:16px;
}

.current-cover{
  width:95px;
  height:78px;
  background-size:cover;
  background-position:center;
  border-radius:16px;
  display:grid;
  place-items:center;
}

.current-cover span{
  width:38px;
  height:38px;
  border-radius:13px;
  background:rgba(16,17,20,.58);
  color:#fff;
  display:grid;
  place-items:center;
}

.file-button{
  display:inline-flex!important;
  width:max-content!important;
  background:var(--dark);
  color:#fff!important;
  border-radius:12px;
  padding:10px 12px;
  cursor:pointer;
}

.file-button input{
  display:none;
}

.url-list{
  display:grid;
  gap:8px;
  margin-top:10px;
}

.url-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:7px;
}

.editor-save{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:18px 22px;
  background:#fcf7ef;
}

.editor-save strong,
.editor-save span{
  display:block;
}

.editor-save strong{
  font-size:12px;
}

.editor-save span{
  font-size:10px;
  color:#929399;
  margin-top:2px;
}

/* =========================================================
   PRO CREATOR / WORKSPACE / EDIT
========================================================= */

.pro-creator-page{
  min-height:100vh;
  background:linear-gradient(180deg,#f7f4ee 0%,#f1ede6 100%);
}

.creator-topbar-pro{
  position:sticky;
  top:0;
  z-index:40;
  padding:15px 36px;
  background:rgba(247,244,238,.84);
  backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(20,22,26,.06);
}

.creator-brand{
  color:#1d2024;
}

.creator-top-actions{
  display:flex;
  gap:8px;
  align-items:center;
}

.creator-back{
  font-size:11px;
  color:#777a80;
  font-weight:700;
  padding:8px 10px;
}

.btn-small{
  padding:9px 12px;
  border-radius:11px;
  font-size:11px;
}

.creator-workspace{
  max-width:1240px;
  margin:0 auto;
  padding:58px 32px 90px;
}

.creator-hero-pro{
  text-align:center;
  max-width:720px;
  margin:0 auto 34px;
}

.creator-kicker{
  display:inline-flex;
  gap:7px;
  align-items:center;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--pro-border);
  padding:8px 11px;
  color:#666970;
  font-size:10px;
  font-weight:800;
}

.status-live-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#56ad79;
}

.creator-hero-pro h1{
  font-family:var(--display);
  font-size:clamp(49px,6vw,78px);
  line-height:.92;
  letter-spacing:-.055em;
  margin:15px 0;
}

.creator-hero-pro h1 em{
  font-style:normal;
  color:#8c655d;
}

.creator-hero-pro>p{
  max-width:620px;
  margin:0 auto;
  color:#777a80;
  font-size:14px;
}

.creator-trust-row{
  display:flex;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
  margin-top:17px;
  color:#73767c;
  font-size:10px;
}

.creator-trust-row span{
  display:flex;
  align-items:center;
  gap:5px;
}

.creator-trust-row .icon{
  color:#5b9c70;
}

.creator-modal-shell{
  background:#fff;
  border:1px solid rgba(20,22,26,.08);
  border-radius:30px;
  box-shadow:0 35px 90px rgba(28,29,33,.12);
  overflow:hidden;
}

.creator-modal-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:18px 23px;
  border-bottom:1px solid var(--pro-border);
}

.creator-modal-title{
  display:flex;
  align-items:center;
  gap:10px;
}

.creator-modal-title strong{
  font-family:var(--display);
  font-size:17px;
}

.creator-modal-title>span:last-child{
  font-size:10px;
  color:#999ba1;
}

.creator-progress-meta{
  min-width:190px;
  display:flex;
  align-items:center;
  gap:10px;
}

.creator-progress-meta>span{
  font-size:9px;
  color:#8b8e95;
  white-space:nowrap;
}

.creator-progress{
  height:4px;
  background:#eef0f3;
  border-radius:999px;
  flex:1;
  overflow:hidden;
}

.creator-progress i{
  display:block;
  height:100%;
  width:20%;
  background:#17191d;
  border-radius:999px;
  transition:.35s ease;
}

.creator-layout{
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  min-height:640px;
}

.creator-step-nav{
  padding:20px 12px;
  background:#faf9f6;
  border-right:1px solid var(--pro-border);
}

.creator-step{
  width:100%;
  display:grid;
  grid-template-columns:35px 1fr;
  grid-template-rows:auto auto;
  column-gap:8px;
  text-align:left;
  border:0;
  background:transparent;
  padding:12px 11px;
  border-radius:14px;
  color:#9699a0;
}

.creator-step span{
  grid-row:1 / span 2;
  font-size:9px;
  align-self:center;
  color:#a0a2a8;
}

.creator-step b{
  font-size:11px;
  color:#6d7077;
}

.creator-step small{
  font-size:9px;
  color:#a2a4a9;
  margin-top:2px;
}

.creator-step.is-active{
  background:#fff;
  box-shadow:0 8px 20px rgba(20,22,26,.06);
  color:#15171b;
}

.creator-step.is-active span{
  color:#17191d;
  font-weight:800;
}

.creator-step.is-active b{
  color:#17191d;
}

.creator-step.is-done span{
  color:#5a9a71;
}

.creator-form-pro{
  padding:34px 42px;
}

.form-step-pro{
  display:none;
  animation:proStep .35s ease;
}

.form-step-pro.is-active{
  display:block;
}

@keyframes proStep{
  from{
    opacity:0;
    transform:translateY(7px);
  }

  to{
    opacity:1;
    transform:none;
  }
}

.form-heading-pro{
  margin-bottom:24px;
}

.form-heading-pro h2{
  font-family:var(--display);
  font-size:32px;
  letter-spacing:-.04em;
  margin:6px 0;
}

.form-heading-pro p{
  font-size:12px;
  color:#7d8087;
  margin:0;
}

.pro-form-grid{
  display:grid;
  gap:12px;
}

.pro-form-grid.two{
  grid-template-columns:1fr 1fr;
}

.creator-form-pro label,
.edit-form-pro label{
  display:grid;
  gap:7px;
  font-size:11px;
  color:#666a71;
  font-weight:700;
  letter-spacing:0;
  text-transform:none;
  margin-bottom:14px;
}

.creator-form-pro label input,
.creator-form-pro label textarea,
.creator-form-pro label select,
.edit-form-pro label input,
.edit-form-pro label textarea,
.edit-form-pro label select{
  width:100%;
  border:1px solid rgba(20,22,26,.10);
  background:#fbfaf8;
  border-radius:13px;
  outline:none;
  padding:12px 13px;
  color:#17191d;
  font-size:12px;
  resize:vertical;
  transition:.2s;
}

.creator-form-pro label input:focus,
.creator-form-pro label textarea:focus,
.creator-form-pro label select:focus,
.edit-form-pro label input:focus,
.edit-form-pro label textarea:focus,
.edit-form-pro label select:focus{
  border-color:#8ca7e7;
  box-shadow:0 0 0 4px rgba(47,109,246,.08);
  background:#fff;
}

.field-counter{
  float:right;
  font-size:9px;
  color:#9fa1a7;
  font-weight:500;
}

.pro-tip{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:13px 14px;
  border-radius:15px;
  background:#f6f4ef;
  border:1px solid #ebe6dd;
  margin-top:2px;
}

.pro-tip>span{
  width:32px;
  height:32px;
  border-radius:10px;
  background:#fff;
  display:grid;
  place-items:center;
  color:#666b74;
}

.pro-tip strong,
.pro-tip small{
  display:block;
}

.pro-tip strong{
  font-size:10px;
  color:#4d5158;
}

.pro-tip small{
  font-size:9px;
  color:#95979c;
  margin-top:3px;
}

.pro-form-actions{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  border-top:1px solid var(--pro-border);
  padding-top:18px;
  margin-top:24px;
}

.service-builder-pro{
  display:grid;
  gap:8px;
}

.service-row-pro{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) .7fr .8fr 38px;
  gap:8px;
  align-items:center;
  padding:8px;
  background:#fbfaf8;
  border:1px solid rgba(20,22,26,.08);
  border-radius:14px;
}

.service-row-pro input{
  border:0!important;
  background:#fff!important;
  margin:0!important;
  box-shadow:none!important;
  border-radius:10px!important;
}

.row-remove{
  width:36px;
  height:36px;
  border:0;
  background:#fff;
  border-radius:10px;
  color:#9c9fa5;
  display:grid;
  place-items:center;
}

.text-add-pro{
  border:0;
  background:transparent;
  padding:7px 0;
  color:#4e73b9;
  font-size:11px;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.pro-hours-card{
  margin-top:20px;
  padding:17px;
  border:1px solid #ebe5db;
  background:#faf7f1;
  border-radius:18px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}

.pro-hours-card h3{
  font-family:var(--display);
  font-size:18px;
  margin:4px 0;
}

.pro-hours-card p{
  font-size:10px;
  color:#888b91;
  margin:0;
}

.pro-hours-inputs{
  display:flex;
  align-items:center;
  gap:8px;
}

.pro-hours-inputs label{
  margin:0!important;
  min-width:115px!important;
}

.pro-hours-inputs span{
  font-size:11px;
  color:#9799a0;
}

.upload-dropzone{
  border:1.5px dashed #d3cec5;
  background:#faf9f6;
  border-radius:18px;
  padding:20px;
  display:flex;
  gap:13px;
  align-items:center;
}

.upload-dropzone-icon{
  width:44px;
  height:44px;
  border-radius:13px;
  background:#fff;
  display:grid;
  place-items:center;
  color:#6f737b;
  flex:0 0 auto;
}

.upload-dropzone strong,
.upload-dropzone p{
  display:block;
}

.upload-dropzone strong{
  font-size:12px;
}

.upload-dropzone p{
  font-size:10px;
  color:#999ba1;
  margin:3px 0 10px;
}

.cover-preview-pro{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:8px 10px;
  border-radius:15px;
  border:1px solid #e8e5e0;
  background:#fff;
}

.cover-preview-pro img{
  width:68px;
  height:52px;
  border-radius:10px;
  object-fit:cover;
}

.cover-preview-pro>div{
  flex:1;
}

.cover-preview-pro strong,
.cover-preview-pro span{
  display:block;
}

.cover-preview-pro strong{
  font-size:10px;
}

.cover-preview-pro span{
  font-size:9px;
  color:#7ea07f;
  margin-top:2px;
}

.gallery-upload-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-top:24px;
  margin-bottom:11px;
}

.gallery-upload-head h3{
  font-family:var(--display);
  font-size:20px;
  margin:3px 0;
}

.gallery-upload-head p{
  font-size:10px;
  color:#9699a0;
  margin:0;
}

.gallery-preview-pro{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:9px;
}

.gallery-preview-item,
.edit-gallery-item{
  position:relative;
  aspect-ratio:1/1;
  border-radius:14px;
  overflow:hidden;
  background:#ece9e4;
}

.gallery-preview-item img,
.edit-gallery-item img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.gallery-preview-item .gallery-remove,
.edit-gallery-item .gallery-remove{
  position:absolute;
  top:7px;
  right:7px;
  width:28px;
  height:28px;
  border:0;
  border-radius:9px;
  background:rgba(19,20,23,.62);
  color:#fff;
  display:grid;
  place-items:center;
}

.review-card-pro{
  display:grid;
  grid-template-columns:180px 1fr;
  gap:17px;
  border:1px solid var(--pro-border);
  border-radius:19px;
  padding:10px;
  background:#faf9f7;
}

.review-cover{
  height:150px;
  border-radius:13px;
  background:#ebe8e2 center/cover no-repeat;
}

.review-copy{
  align-self:center;
}

.review-copy h3{
  font-family:var(--display);
  font-size:27px;
  letter-spacing:-.03em;
  margin:5px 0 3px;
}

.review-copy p{
  font-size:11px;
  color:#85888e;
  margin:0;
}

.review-chips{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin-top:14px;
}

.review-chips span{
  font-size:9px;
  padding:6px 8px;
  border-radius:999px;
  background:#f0eee9;
  color:#676a71;
}

.pro-publish-note{
  display:flex;
  gap:10px;
  align-items:center;
  padding:13px 14px;
  border-radius:14px;
  background:#f2f8f1;
  border:1px solid #dcebd8;
  margin-top:14px;
}

.publish-check{
  width:33px;
  height:33px;
  border-radius:10px;
  background:#fff;
  color:#4d9564;
  display:grid;
  place-items:center;
}

.pro-publish-note strong,
.pro-publish-note small{
  display:block;
}

.pro-publish-note strong{
  font-size:10px;
}

.pro-publish-note small{
  font-size:9px;
  color:#7c8a7d;
  margin-top:2px;
}

/* =========================================================
   GATE
========================================================= */

.creator-gate-wrap{
  max-width:1220px;
  margin:0 auto;
  padding:72px 34px 90px;
}

.creator-gate-shell{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:28px;
  background:#fff;
  border:1px solid var(--pro-border);
  border-radius:30px;
  padding:48px;
  box-shadow:0 35px 90px rgba(28,29,33,.11);
}

.creator-gate-copy{
  align-self:center;
}

.creator-gate-copy h1{
  font-family:var(--display);
  font-size:clamp(45px,5vw,68px);
  line-height:.94;
  letter-spacing:-.05em;
  margin:10px 0 16px;
}

.creator-gate-copy>p{
  color:#74777d;
  max-width:550px;
  font-size:14px;
}

.gate-actions{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  margin-top:25px;
}

.gate-note{
  display:flex;
  gap:8px;
  align-items:center;
  margin-top:18px;
  font-size:10px;
  color:#8b8d93;
}

.gate-note .icon{
  color:#4e9564;
}

.owner-shop-stack{
  display:grid;
  gap:11px;
  align-content:center;
}

.owner-shop-preview{
  position:relative;
  min-height:182px;
  border-radius:20px;
  overflow:hidden;
  background:#15171a;
}

.owner-shop-preview img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.owner-shop-preview-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,rgba(10,10,12,.88),rgba(10,10,12,.12));
}

.owner-shop-preview-copy{
  position:absolute;
  left:17px;
  bottom:16px;
  color:#fff;
}

.owner-shop-preview-copy span,
.owner-shop-preview-copy strong,
.owner-shop-preview-copy small{
  display:block;
}

.owner-shop-preview-copy span{
  font-size:9px;
  color:#d0d0d4;
}

.owner-shop-preview-copy strong{
  font-family:var(--display);
  font-size:22px;
  margin-top:3px;
}

.owner-shop-preview-copy small{
  font-size:9px;
  color:#cacbd0;
  margin-top:3px;
}

.owner-shop-arrow{
  position:absolute;
  right:13px;
  top:13px;
  width:36px;
  height:36px;
  border-radius:11px;
  background:rgba(255,255,255,.14);
  backdrop-filter:blur(12px);
  display:grid;
  place-items:center;
  color:#fff;
}

.owner-shop-preview.featured{
  min-height:232px;
}

/* =========================================================
   WORKSPACE
========================================================= */

.owner-dashboard-pro{
  max-width:1280px;
}

.workspace-topbar{
  display:flex;
  justify-content:space-between;
  gap:25px;
  align-items:flex-end;
  padding-bottom:26px;
}

.workspace-greeting h1{
  font-family:var(--display);
  font-size:45px;
  line-height:1;
  letter-spacing:-.045em;
  margin:7px 0;
}

.workspace-greeting p{
  margin:0;
  color:#7b7e85;
  font-size:12px;
}

.workspace-actions{
  display:flex;
  gap:8px;
}

.workspace-empty-pro{
  background:#fff;
  border:1px solid var(--pro-border);
  border-radius:27px;
  padding:50px;
  display:grid;
  grid-template-columns:1.3fr .7fr;
  gap:30px;
  box-shadow:var(--pro-shadow);
}

.workspace-empty-copy h2{
  font-family:var(--display);
  font-size:40px;
  letter-spacing:-.045em;
  max-width:600px;
  margin:8px 0 13px;
}

.workspace-empty-copy p{
  color:#7a7d83;
  max-width:570px;
  font-size:13px;
  margin:0 0 22px;
}

.workspace-empty-art{
  min-height:260px;
  border-radius:22px;
  background:linear-gradient(145deg,#202329,#121317);
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
  color:#f3e7d2;
}

.empty-art-circle{
  position:absolute;
  width:230px;
  height:230px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:
    0 0 0 35px rgba(255,255,255,.025),
    0 0 0 70px rgba(255,255,255,.018);
}

.workspace-empty-art span{
  position:relative;
  z-index:1;
  width:64px;
  height:64px;
  border-radius:20px;
  background:rgba(255,255,255,.08);
  display:grid;
  place-items:center;
}

.workspace-empty-art small{
  position:absolute;
  bottom:16px;
  left:16px;
  font-size:9px;
  color:#a8aab0;
  line-height:1.4;
}

.shop-switcher-pro{
  margin-top:8px;
}

.shop-switcher-heading{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:12px;
}

.shop-switcher-heading h2{
  font-family:var(--display);
  font-size:27px;
  margin:4px 0 0;
}

.shop-count-pill{
  font-size:9px;
  padding:7px 9px;
  border-radius:999px;
  background:#eeeae4;
  color:#7d7f85;
  font-weight:800;
}

.shop-switcher-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}

.workspace-shop-card,
.workspace-add-card{
  min-height:105px;
  border-radius:18px;
  border:1px solid var(--pro-border);
  background:#fff;
  display:flex;
  align-items:center;
  gap:11px;
  padding:9px;
  position:relative;
  overflow:hidden;
}

.workspace-shop-card.is-selected{
  box-shadow:0 0 0 2px #17191d inset;
}

.workspace-shop-image{
  width:84px;
  height:84px;
  border-radius:13px;
  overflow:hidden;
  position:relative;
  flex:0 0 auto;
}

.workspace-shop-image img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.workspace-live{
  position:absolute;
  left:6px;
  bottom:6px;
  background:rgba(18,19,21,.63);
  backdrop-filter:blur(10px);
  color:#fff;
  border-radius:999px;
  padding:4px 6px;
  font-size:8px;
}

.workspace-live i{
  display:inline-block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#58bd7b;
  margin-right:3px;
}

.workspace-shop-copy{
  min-width:0;
  padding-right:24px;
}

.workspace-shop-copy strong,
.workspace-shop-copy span,
.workspace-shop-copy small{
  display:block;
}

.workspace-shop-copy strong{
  font-family:var(--display);
  font-size:15px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.workspace-shop-copy span{
  font-size:9px;
  color:#8b8d94;
  margin-top:2px;
}

.workspace-shop-copy small{
  font-size:9px;
  color:#65686f;
  margin-top:6px;
}

.workspace-shop-arrow{
  position:absolute;
  right:10px;
  top:10px;
  width:27px;
  height:27px;
  border-radius:9px;
  background:#f2f3f4;
  color:#6d7178;
  display:grid;
  place-items:center;
}

.workspace-add-card{
  border-style:dashed;
  display:grid;
  grid-template-columns:38px 1fr;
  column-gap:9px;
  align-content:center;
  padding:13px 15px;
}

.workspace-add-card>span{
  width:38px;
  height:38px;
  border-radius:12px;
  background:#f2f4f8;
  display:grid;
  place-items:center;
  color:#5f6f8f;
  grid-row:1 / span 2;
}

.workspace-add-card strong{
  font-size:11px;
}

.workspace-add-card small{
  font-size:9px;
  color:#95979e;
}

.workspace-shop-header{
  margin-top:16px;
  border-radius:26px;
  background:#fff;
  border:1px solid var(--pro-border);
  overflow:hidden;
  box-shadow:0 14px 34px rgba(20,22,26,.045);
}

.workspace-shop-cover{
  height:300px;
  position:relative;
}

.workspace-shop-cover img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.workspace-shop-cover-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,rgba(12,13,16,.83),rgba(12,13,16,.03) 68%);
}

.workspace-shop-cover-copy{
  position:absolute;
  left:22px;
  bottom:20px;
  color:#fff;
}

.workspace-shop-cover-copy h2{
  font-family:var(--display);
  font-size:36px;
  letter-spacing:-.04em;
  margin:8px 0 2px;
}

.workspace-shop-cover-copy p{
  font-size:11px;
  color:#d2d3d6;
  margin:0;
}

.workspace-shop-footer{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  padding:15px 18px;
}

.workspace-shop-meta{
  display:flex;
  gap:22px;
}

.workspace-shop-meta span{
  font-size:9px;
  color:#92949b;
}

.workspace-shop-meta b{
  font-family:var(--display);
  font-size:17px;
  color:#17191d;
  margin-right:3px;
}

.workspace-shop-actions{
  display:flex;
  gap:7px;
}

.workspace-stat-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-top:11px;
}

.workspace-stat{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:16px;
  border:1px solid var(--pro-border);
  background:#fff;
  border-radius:18px;
}

.workspace-stat-icon{
  width:37px;
  height:37px;
  border-radius:12px;
  background:#f4f1eb;
  color:#6a6f78;
  display:grid;
  place-items:center;
}

.workspace-stat small,
.workspace-stat strong,
.workspace-stat span{
  display:block;
}

.workspace-stat small{
  font-size:9px;
  color:#9a9ca2;
}

.workspace-stat strong{
  font-family:var(--display);
  font-size:25px;
  margin-top:2px;
}

.workspace-stat span{
  font-size:9px;
  color:#7f8289;
  margin-top:2px;
}

.workspace-content-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:10px;
  margin-top:11px;
}

.workspace-panel{
  background:#fff;
  border:1px solid var(--pro-border);
  border-radius:21px;
  padding:19px;
}

.workspace-panel-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:12px;
}

.workspace-panel-head h3{
  font-family:var(--display);
  font-size:24px;
  margin:4px 0 0;
}

.workspace-booking{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 0;
  border-bottom:1px solid var(--pro-border);
}

.workspace-booking:last-child{
  border-bottom:0;
}

.workspace-booking-avatar{
  width:36px;
  height:36px;
  border-radius:11px;
  background:#eeeae2;
  display:grid;
  place-items:center;
  font-family:var(--display);
  font-weight:700;
}

.workspace-booking>div:nth-child(2){
  flex:1;
}

.workspace-booking strong,
.workspace-booking span{
  display:block;
}

.workspace-booking strong{
  font-size:11px;
}

.workspace-booking span{
  font-size:9px;
  color:#999ba1;
  margin-top:2px;
}

.workspace-booking em{
  font-style:normal;
  font-size:8px;
  padding:5px 7px;
  border-radius:999px;
  background:#f4eee2;
  color:#967146;
}

.workspace-empty-inline{
  text-align:center;
  padding:30px 10px;
  color:#8c8e94;
}

.workspace-empty-inline>div{
  width:42px;
  height:42px;
  border-radius:13px;
  background:#f5f0e8;
  color:#a36d5b;
  display:grid;
  place-items:center;
  margin:0 auto 10px;
}

.workspace-empty-inline strong{
  display:block;
  font-size:11px;
  color:#4d5057;
}

.workspace-empty-inline p{
  font-size:9px;
  margin:4px auto 0;
  max-width:280px;
}

.workspace-actions-list{
  display:grid;
}

.workspace-actions-list a{
  display:flex;
  gap:10px;
  align-items:center;
  padding:13px 0;
  border-bottom:1px solid var(--pro-border);
}

.workspace-actions-list a:last-child{
  border-bottom:0;
}

.workspace-actions-list>a>span:first-child{
  width:34px;
  height:34px;
  border-radius:10px;
  background:#f4f1eb;
  color:#6d737c;
  display:grid;
  place-items:center;
}

.workspace-actions-list div{
  flex:1;
}

.workspace-actions-list strong,
.workspace-actions-list small{
  display:block;
}

.workspace-actions-list strong{
  font-size:11px;
}

.workspace-actions-list small{
  font-size:9px;
  color:#9698a0;
  margin-top:2px;
}

/* =========================================================
   EDIT WORKSPACE
========================================================= */

.edit-page-pro{
  max-width:1260px;
}

.edit-pro-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  padding-bottom:25px;
}

.edit-pro-intro .back-link{
  margin-bottom:11px;
}

.edit-title-row{
  display:flex;
  align-items:center;
  gap:12px;
}

.edit-shop-avatar{
  width:48px;
  height:48px;
  border-radius:14px;
  overflow:hidden;
  background:#ece8e0;
  flex:0 0 auto;
}

.edit-shop-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.edit-pro-intro h1{
  font-family:var(--display);
  font-size:35px;
  letter-spacing:-.04em;
  line-height:1;
  margin:5px 0 2px;
}

.edit-pro-intro p{
  font-size:10px;
  color:#8b8e95;
  margin:0;
}

.edit-pro-actions{
  display:flex;
  gap:7px;
}

.edit-workspace-grid{
  display:grid;
  grid-template-columns:210px minmax(0,1fr);
  gap:11px;
  align-items:start;
}

.edit-side-card{
  background:#fff;
  border:1px solid var(--pro-border);
  border-radius:18px;
  padding:10px;
  position:sticky;
  top:15px;
}

.edit-side-card>a{
  display:flex;
  gap:8px;
  align-items:center;
  padding:10px 9px;
  border-radius:11px;
  color:#777a82;
  font-size:10px;
  font-weight:700;
}

.edit-side-card>a.is-active{
  background:#f2f4f7;
  color:#17191d;
}

.edit-side-tip{
  margin-top:10px;
  border:1px solid #e9e4dc;
  background:#faf7f1;
  border-radius:17px;
  padding:13px;
}

.edit-side-tip>span{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:10px;
  background:#fff;
  color:#9a6e55;
  margin-bottom:8px;
}

.edit-side-tip strong{
  display:block;
  font-size:10px;
}

.edit-side-tip p{
  font-size:9px;
  color:#8e9096;
  line-height:1.45;
  margin:4px 0 0;
}

.edit-form-pro{
  background:#fff;
  border:1px solid var(--pro-border);
  border-radius:22px;
  overflow:hidden;
}

.edit-section-pro{
  padding:25px 26px;
  border-bottom:1px solid var(--pro-border);
}

.edit-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:15px;
  margin-bottom:19px;
}

.edit-section-head h2{
  font-family:var(--display);
  font-size:25px;
  letter-spacing:-.03em;
  margin:5px 0 4px;
}

.edit-section-head p{
  font-size:10px;
  color:#8c8f96;
  margin:0;
}

.cover-edit-pro{
  display:flex;
  align-items:center;
  gap:13px;
  padding:11px;
  border:1px solid var(--pro-border);
  border-radius:16px;
  background:#fbfaf8;
}

.cover-edit-preview{
  width:120px;
  height:86px;
  border-radius:13px;
  overflow:hidden;
  position:relative;
  background:#e9e6df;
  flex:0 0 auto;
}

.cover-edit-preview img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.cover-edit-overlay{
  position:absolute;
  left:7px;
  right:7px;
  bottom:7px;
  display:flex;
  align-items:center;
  gap:6px;
  color:#fff;
}

.cover-edit-overlay span{
  width:27px;
  height:27px;
  border-radius:9px;
  background:rgba(18,19,21,.58);
  display:grid;
  place-items:center;
}

.cover-edit-overlay strong{
  font-size:8px;
  background:rgba(18,19,21,.46);
  border-radius:999px;
  padding:5px 7px;
}

.cover-edit-pro h3{
  font-family:var(--display);
  font-size:18px;
  margin:0 0 3px;
}

.cover-edit-pro p{
  font-size:9px;
  color:#91949b;
  margin:0 0 10px;
}

.upload-control{
  cursor:pointer;
  width:max-content!important;
}

.edit-gallery-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-top:22px;
  margin-bottom:10px;
}

.edit-gallery-head h3{
  font-family:var(--display);
  font-size:18px;
  margin:0 0 3px;
}

.edit-gallery-head p{
  font-size:9px;
  color:#94979d;
  margin:0;
}

.edit-gallery-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:9px;
}

.edit-gallery-item{
  border:1px solid var(--pro-border);
}

.new-photo-label{
  position:absolute;
  left:7px;
  bottom:7px;
  padding:5px 7px;
  border-radius:999px;
  background:rgba(21,23,27,.65);
  color:#fff;
  font-size:8px;
}

.hours-pro-card{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  background:#faf7f1;
  border:1px solid #ece5db;
  border-radius:18px;
  padding:17px;
}

.hours-live{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:8px;
  color:#4e9368;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.13em;
}

.hours-live i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#5ab47d;
}

.hours-copy h3{
  font-family:var(--display);
  font-size:19px;
  margin:7px 0 3px;
}

.hours-copy p{
  font-size:9px;
  color:#8f9298;
  margin:0;
}

.hours-pro-inputs{
  display:flex;
  align-items:center;
  gap:7px;
}

.hours-pro-inputs label{
  margin:0!important;
  min-width:120px;
}

.edit-save-bar{
  padding:15px 20px;
  background:#faf7f1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.edit-save-bar strong,
.edit-save-bar span{
  display:block;
}

.edit-save-bar strong{
  font-size:10px;
}

.edit-save-bar span{
  font-size:9px;
  color:#92959b;
  margin-top:2px;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width:1100px){

  .shop-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .shop-grid-pro{
    grid-template-columns:repeat(2,1fr);
  }

  .featured-shop-pro{
    grid-template-columns:1fr;
  }

  .featured-shop-side{
    min-height:220px;
  }

  .featured-shop-side-pro{
    min-height:260px;
  }

  .workspace-stat-row{
    grid-template-columns:repeat(2,1fr);
  }

  .workspace-content-grid{
    grid-template-columns:1fr;
  }

  .shop-switcher-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .landing-float-card{
    display:none;
  }

  .search-featured-row{
    grid-template-columns:repeat(2,1fr);
  }
}

@media (max-width:820px){

  :root{
    --rail:0;
  }

  .desktop-rail{
    display:none;
  }

  .mobile-bottom-nav{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    height:72px;
    background:rgba(255,253,249,.94);
    border-top:1px solid var(--line);
    backdrop-filter:blur(20px);
    z-index:900;
    display:grid;
    grid-template-columns:1fr 1fr 70px 1fr 1fr;
    padding:
      0
      9px
      calc(env(safe-area-inset-bottom,0px) + 4px);
    box-shadow:0 -10px 35px rgba(20,22,26,.08);
  }

  .mobile-nav-item{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:4px;
    color:#8a8b90;
    font-size:9px;
    font-weight:700;
  }

  .mobile-nav-item.is-active{
    color:var(--accent);
  }

  .mobile-nav-fab{
    width:52px;
    height:52px;
    align-self:center;
    justify-self:center;
    border-radius:18px;
    background:var(--dark);
    color:#fff;
    display:grid;
    place-items:center;
    box-shadow:0 10px 24px rgba(17,18,22,.23);
  }

  .app-main.with-app-nav{
    margin-left:0;
    padding-bottom:86px;
  }

  .app-wrap{
    padding:
      16px
      12px
      calc(90px + env(safe-area-inset-bottom,0px));
  }

  .discover-search-wrap{
    grid-template-columns:1fr auto;
    gap:8px;
  }

  .search-launcher{
    min-height:49px;
  }

  .search-launch-shortcut{
    display:none;
  }

  .filter-row-pro{
    padding-top:10px;
  }

  .featured-shop-pro{
    margin-top:20px;
  }

  .featured-shop-media{
    min-height:390px;
    border-radius:23px;
  }

  .featured-shop-copy{
    left:17px;
    right:17px;
    bottom:19px;
  }

  .featured-shop-copy h2{
    font-size:31px;
  }

  .featured-shop-side-pro{
    min-height:280px;
    border-radius:23px;
    padding:23px;
  }

  .featured-side-main{
    padding-top:20px;
  }

  .creator-topbar-pro{
    padding:13px 17px;
  }

  .creator-top-actions .creator-back{
    display:none;
  }

  .creator-workspace{
    padding:38px 16px 90px;
  }

  .creator-hero-pro{
    text-align:left;
    margin-bottom:22px;
  }

  .creator-hero-pro h1{
    font-size:51px;
  }

  .creator-trust-row{
    justify-content:flex-start;
    gap:8px 13px;
  }

  .creator-modal-top{
    padding:14px 14px;
    align-items:flex-start;
    flex-direction:column;
  }

  .creator-progress-meta{
    width:100%;
  }

  .creator-layout{
    grid-template-columns:1fr;
    min-height:auto;
  }

  .creator-step-nav{
    display:flex;
    gap:5px;
    overflow:auto;
    padding:8px;
    border-right:0;
    border-bottom:1px solid var(--pro-border);
  }

  .creator-step{
    min-width:105px;
    grid-template-columns:27px 1fr;
    padding:9px;
  }

  .creator-step small{
    display:none;
  }

  .creator-form-pro{
    padding:21px 17px 26px;
  }

  .pro-form-grid.two{
    grid-template-columns:1fr;
  }

  .gallery-preview-pro,
  .edit-gallery-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .workspace-topbar{
    align-items:flex-start;
    flex-direction:column;
  }

  .workspace-actions{
    width:100%;
  }

  .workspace-actions .btn{
    flex:1;
  }

  .workspace-empty-pro{
    grid-template-columns:1fr;
    padding:28px;
  }

  .workspace-empty-art{
    display:none;
  }

  .shop-switcher-grid{
    grid-template-columns:1fr;
  }

  .workspace-shop-cover{
    height:250px;
  }

  .workspace-shop-footer{
    align-items:flex-start;
    flex-direction:column;
  }

  .workspace-shop-meta{
    width:100%;
    justify-content:space-between;
    gap:8px;
  }

  .workspace-shop-actions{
    width:100%;
  }

  .workspace-shop-actions .btn{
    flex:1;
  }

  .edit-pro-header{
    align-items:flex-start;
    flex-direction:column;
  }

  .edit-pro-actions{
    width:100%;
  }

  .edit-pro-actions .btn{
    flex:1;
  }

  .edit-workspace-grid{
    grid-template-columns:1fr;
  }

  .edit-side-nav{
    display:none;
  }

  .edit-section-pro{
    padding:21px 17px;
  }

  .edit-save-bar{
    align-items:flex-start;
    flex-direction:column;
  }

  .edit-save-bar .btn{
    width:100%;
  }

  .discover-hero-pro{
    align-items:flex-start;
    flex-direction:column;
    gap:16px;
  }

  .discover-hero-note{
    width:100%;
  }

  .owner-banner-pro{
    align-items:flex-start;
    flex-direction:column;
    padding:27px;
  }

  .creator-gate-wrap{
    padding:34px 16px 80px;
  }

  .creator-gate-shell{
    grid-template-columns:1fr;
    padding:25px;
  }

  .owner-shop-preview.featured{
    min-height:200px;
  }

  .creator-gate-copy h1{
    font-size:48px;
  }

  /* SEARCH MODAL — FULL SCREEN MOBILE */

  .search-modal{
    inset:0;
    padding:0;
    align-items:stretch;
  }

  .search-modal-backdrop{
    background:rgba(247,245,240,.90);
    backdrop-filter:blur(12px);
  }

  .search-modal-panel{
    width:100%;
    max-height:100%;
    min-height:100%;
    border-radius:0;
    border:0;
    background:#faf8f4;
    box-shadow:none;
    transform:translateY(14px);
  }

  .search-modal.is-open .search-modal-panel{
    transform:none;
  }

  .search-modal-header{
    padding:
      calc(14px + env(safe-area-inset-top,0px))
      14px
      12px;
  }

  .search-modal-heading h2{
    font-size:25px;
  }

  .search-modal-heading .eyebrow{
    font-size:9px;
  }

  .search-modal-back{
    width:38px;
    height:38px;
  }

  .search-modal-desktop-hint{
    display:none;
  }

  .search-modal-input-shell{
    margin:0 13px;
    height:56px;
    border-radius:17px;
  }

  .search-modal-input-shell input{
    font-size:15px;
  }

  .search-modal-status{
    margin:0 14px;
    min-height:33px;
  }

  .search-modal-content{
    padding:
      6px
      14px
      calc(24px + env(safe-area-inset-bottom,0px));
  }

  .search-suggestion-chips{
    gap:7px;
  }

  .search-suggestion-chips button{
    min-height:39px;
  }

  .search-featured-row{
    grid-template-columns:1fr;
  }

  .search-mini-card{
    padding:9px;
  }

  .search-results-list{
    grid-template-columns:1fr;
    gap:8px;
  }

  .search-result-card{
    grid-template-columns:64px minmax(0,1fr) auto;
  }

  .search-result-image{
    width:64px;
    height:64px;
  }

  .search-modal-footer{
    display:none;
  }
}

@media (max-width:560px){

  .shop-grid{
    grid-template-columns:1fr;
  }

  .shop-grid-pro{
    grid-template-columns:1fr;
  }

  .shop-media{
    height:260px;
  }

  .shop-media-pro{
    height:270px;
  }

  .offer-art{
    display:none;
  }

  .offer-copy h2{
    font-size:28px;
  }

  .form-grid.two,
  .hours-editor,
  .hours-editor>div:first-child{
    grid-template-columns:1fr;
  }

  .service-row{
    grid-template-columns:1fr 1fr auto;
  }

  .service-row .service-duration{
    grid-column:1 / span 2;
  }

  .detail-heading{
    align-items:flex-start;
  }

  .detail-price{
    padding-top:9px;
  }

  .detail-price strong{
    font-size:18px;
  }

  .detail-price small{
    font-size:10px;
  }

  .detail-heading h1{
    font-size:30px;
  }

  .action-strip a,
  .action-strip button{
    min-width:70px;
  }

  .gallery-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .time-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .dashboard-stat-grid{
    gap:8px;
  }

  .stat-card{
    padding:13px;
  }

  .stat-card strong{
    font-size:23px;
  }

  .profile-mini-stats{
    width:100%;
    justify-content:space-between;
    gap:8px;
  }

  .creator-intro h1{
    font-size:45px;
  }

  .step label{
    display:none;
  }

  .step{
    flex:0 0 auto;
  }

  .creator-topbar>div .micro-label{
    display:none;
  }

  .discover-search-wrap{
    gap:7px;
  }

  .premium-filter{
    width:48px;
    height:48px;
  }

  .featured-shop-media{
    min-height:360px;
  }

  .featured-shop-copy h2{
    font-size:29px;
  }

  .featured-shop-copy p{
    font-size:11px;
    margin-bottom:13px;
  }

  .featured-carousel-controls{
    left:12px;
    right:12px;
    bottom:12px;
    justify-content:flex-start;
  }

  .featured-slide-count{
    right:13px;
    top:13px;
  }

  .featured-badge{
    padding:6px 8px;
    font-size:8px;
  }

  .owner-banner-pro h3{
    font-size:27px;
  }

  .workspace-stat-row{
    grid-template-columns:1fr 1fr;
    gap:8px;
  }

  .workspace-stat{
    padding:12px;
  }

  .workspace-stat strong{
    font-size:21px;
  }

  .workspace-shop-meta{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .creator-gate-copy h1{
    font-size:44px;
  }

  .gate-actions .btn{
    width:100%;
  }

  .pro-hours-card,
  .hours-pro-card{
    align-items:flex-start;
    flex-direction:column;
  }

  .pro-hours-inputs{
    width:100%;
  }

  .pro-hours-inputs label{
    flex:1;
  }

  .review-card-pro{
    grid-template-columns:1fr;
  }

  .review-cover{
    height:180px;
  }

  .edit-pro-intro h1{
    font-size:30px;
  }

  .workspace-shop-cover-copy h2{
    font-size:30px;
  }

  /* Edge-friendly mobile spacing */

  .discover-page{
    padding-left:10px;
    padding-right:10px;
  }

  .discover-search-wrap,
  .filter-row-pro,
  .featured-shop-pro,
  .service-pro,
  .shops-pro,
  .owner-banner-pro{
    width:100%;
  }

  .service-scroller{
    padding-left:1px;
    padding-right:1px;
  }

  .filter-row-pro{
    padding-right:0;
  }
}

@media (prefers-reduced-motion:reduce){

  html{
    scroll-behavior:auto;
  }

  *,
  *:before,
  *:after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
}

@media (max-width:820px){

  html[data-theme='dark'] .search-modal-panel{
    background:#0f1014;
  }

  html[data-theme='dark'] .search-modal-backdrop{
    background:rgba(10,11,14,.96);
  }
}

/* =========================================================
   DARK MODE
========================================================= */

html[data-theme='dark']{
  --bg:#0d0e12;
  --paper:#17181d;
  --ink:#f2f2f3;
  --muted:#a7a8ad;
  --line:rgba(255,255,255,.10);

  --pro-bg:#0f1014;
  --pro-card:#17191e;
  --pro-border:rgba(255,255,255,.09);
}

html[data-theme='dark'] body{
  background:#0f1014;
  color:var(--ink);
}

html[data-theme='dark'] .desktop-rail{
  background:rgba(18,19,24,.9);
}

html[data-theme='dark'] .top-account-chip,
html[data-theme='dark'] .discover-hero-note,
html[data-theme='dark'] .featured-shop-side,
html[data-theme='dark'] .shop-card-pro,
html[data-theme='dark'] .service-scroller-pro .service-pill,
html[data-theme='dark'] .owner-banner-pro,
html[data-theme='dark'] .creator-modal-shell,
html[data-theme='dark'] .creator-step-nav,
html[data-theme='dark'] .creator-step.is-active,
html[data-theme='dark'] .workspace-empty-pro,
html[data-theme='dark'] .workspace-shop-card,
html[data-theme='dark'] .workspace-add-card,
html[data-theme='dark'] .workspace-shop-header,
html[data-theme='dark'] .workspace-stat,
html[data-theme='dark'] .workspace-panel,
html[data-theme='dark'] .edit-side-card,
html[data-theme='dark'] .edit-form-pro,
html[data-theme='dark'] .cover-edit-pro{
  background:#17191e;
  color:#f1f2f3;
}

html[data-theme='dark'] .filter-chip{
  color:#bfc0c4;
}

html[data-theme='dark'] .offer-card{
  border:1px solid rgba(255,255,255,.08);
}

html[data-theme='dark'] .service-icon{
  background:#2b1d1f;
}

html[data-theme='dark'] .shop-card-body p,
html[data-theme='dark'] .shop-meta,
html[data-theme='dark'] .section-heading>span,
html[data-theme='dark'] .section-heading a{
  color:#a3a4aa;
}

html[data-theme='dark'] .creator-page,
html[data-theme='dark'] .pro-creator-page{
  background:#0f1014;
}

html[data-theme='dark'] .creator-topbar-pro{
  background:rgba(15,16,20,.82);
}

html[data-theme='dark'] .creator-form-pro label input,
html[data-theme='dark'] .creator-form-pro label textarea,
html[data-theme='dark'] .creator-form-pro label select,
html[data-theme='dark'] .edit-form-pro label input,
html[data-theme='dark'] .edit-form-pro label textarea,
html[data-theme='dark'] .edit-form-pro label select{
  background:#111216;
  color:#eef0f2;
  border-color:rgba(255,255,255,.1);
}

html[data-theme='dark'] .service-row-pro{
  background:#111216;
  border-color:rgba(255,255,255,.08);
}

html[data-theme='dark'] .service-row-pro input{
  background:#17191e!important;
  color:#eef0f2!important;
}

html[data-theme='dark'] .creator-step b,
html[data-theme='dark'] .creator-step small,
html[data-theme='dark'] .discover-hero-copy-pro p,
html[data-theme='dark'] .workspace-greeting p,
html[data-theme='dark'] .edit-pro-intro p{
  color:#9da0a7;
}

html[data-theme='dark'] .workspace-stat-icon,
html[data-theme='dark'] .workspace-actions-list>a>span:first-child,
html[data-theme='dark'] .workspace-add-card>span{
  background:#212329;
}

html[data-theme='dark'] .review-card-pro,
html[data-theme='dark'] .pro-hours-card,
html[data-theme='dark'] .hours-pro-card,
html[data-theme='dark'] .edit-save-bar,
html[data-theme='dark'] .pro-tip,
html[data-theme='dark'] .gallery-upload-head{
  background:#111216;
  border-color:rgba(255,255,255,.08);
}

html[data-theme='dark'] .featured-shop-side>p,
html[data-theme='dark'] .feature-checks span,
html[data-theme='dark'] .review-copy p,
html[data-theme='dark'] .edit-section-head p{
  color:#a7a9af;
}

html[data-theme='dark'] .shop-meta-pro b{
  color:#f0f1f3;
}

html[data-theme='dark'] .search-launcher{
  background:#17191e;
  border-color:rgba(255,255,255,.09);
}

html[data-theme='dark'] .search-placeholder{
  color:#a0a3a9;
}

html[data-theme='dark'] .search-launch-shortcut{
  background:#111216;
  border-color:rgba(255,255,255,.08);
  color:#8b8e95;
}

html[data-theme='dark'] .search-modal-backdrop{
  background:rgba(4,5,7,.72);
}

html[data-theme='dark'] .search-modal-panel{
  background:rgba(20,22,27,.98);
  border-color:rgba(255,255,255,.06);
}

html[data-theme='dark'] .search-modal-back,
html[data-theme='dark'] .search-modal-input-shell,
html[data-theme='dark'] .search-suggestion-chips button,
html[data-theme='dark'] .search-mini-card,
html[data-theme='dark'] .search-result-card{
  background:#17191e;
  border-color:rgba(255,255,255,.08);
  color:#f1f2f3;
}

html[data-theme='dark'] .search-modal-input-shell input{
  color:#f1f2f3;
}

html[data-theme='dark'] .search-modal-input-shell input::placeholder{
  color:#7f828a;
}

html[data-theme='dark'] .search-modal-clear,
html[data-theme='dark'] .search-suggestion-chips button>span,
html[data-theme='dark'] .search-result-arrow{
  background:#111216;
  color:#a9acb2;
}

html[data-theme='dark'] .search-modal-status,
html[data-theme='dark'] .search-section-label>span,
html[data-theme='dark'] .search-mini-copy small,
html[data-theme='dark'] .search-result-copy>small,
html[data-theme='dark'] .search-result-side small,
html[data-theme='dark'] .search-modal-footer>span{
  color:#8f939b;
}

html[data-theme='dark'] .search-smart-tip{
  background:#111216;
  border-color:rgba(255,255,255,.07);
}

html[data-theme='dark'] .search-smart-icon{
  background:#1b1d22;
}

html[data-theme='dark'] .search-smart-tip strong{
  color:#d9dce1;
}

html[data-theme='dark'] .search-smart-tip p{
  color:#8e9299;
}

html[data-theme='dark'] .search-result-services i{
  background:#111216;
  color:#a4a7ad;
}

html[data-theme='dark'] .featured-shop-side{
  border-color:rgba(255,255,255,.08);
}

html[data-theme='dark'] .featured-side-icon{
  background:#212329;
  color:#b7bac0;
}

html[data-theme='dark'] .featured-side-progress{
  background:#26282e;
}

html[data-theme='dark'] .featured-side-progress i{
  background:#fff;
}

html[data-theme='dark'] .empty-state-pro{
  background:#17191e;
  border-color:rgba(255,255,255,.10);
}

/* =========================================================
   OPTIONAL EXTRAS USED BY THE REST OF THE APP
========================================================= */

.discover-hero-copy{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:24px;
  margin-top:36px;
}

.discover-hero-copy h1{
  font-family:var(--display);
  font-size:clamp(42px,5vw,66px);
  font-weight:600;
  letter-spacing:-.05em;
  line-height:1;
  margin:8px 0 12px;
}

.discover-hero-copy p{
  margin:0;
  color:var(--muted);
  max-width:560px;
}

.discover-hero-pro{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:35px;
  padding:42px 0 24px;
}

.discover-hero-copy-pro h1{
  font-family:var(--display);
  font-size:clamp(46px,5vw,72px);
  line-height:.93;
  letter-spacing:-.055em;
  margin:9px 0 17px;
}

.discover-hero-copy-pro h1 em{
  font-style:normal;
  color:#8b655b;
}

.discover-hero-copy-pro p{
  color:#6f7279;
  max-width:570px;
  font-size:15px;
  margin:0;
}

.discover-hero-note{
  display:flex;
  gap:11px;
  align-items:center;
  padding:11px 14px;
  border:1px solid var(--pro-border);
  background:#fff;
  border-radius:16px;
  min-width:245px;
}

.discover-hero-note>span{
  width:36px;
  height:36px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:#f7efe5;
  color:#a86b54;
}

.discover-hero-note strong,
.discover-hero-note small{
  display:block;
}

.discover-hero-note strong{
  font-size:11px;
}

.discover-hero-note small{
  font-size:10px;
  color:#9a9ca2;
  margin-top:2px;
}

.offer-card{
  margin-top:30px;
  background:linear-gradient(112deg,#131419,#2a2524 55%,#69504b);
  border-radius:26px;
  min-height:240px;
  padding:27px 30px;
  display:flex;
  justify-content:space-between;
  overflow:hidden;
  position:relative;
  color:#fff;
}

.offer-card:after{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  right:150px;
  top:-140px;
}

.offer-copy{
  position:relative;
  z-index:2;
  max-width:530px;
}

.tiny-badge{
  display:inline-flex;
  padding:5px 8px;
  border-radius:999px;
  background:#f3e7d2;
  color:#111216;
  font-weight:800;
  font-size:9px;
  letter-spacing:.12em;
}

.offer-copy h2{
  font-family:var(--display);
  font-size:32px;
  line-height:1.02;
  max-width:490px;
  margin:12px 0;
}

.offer-copy p{
  color:#c2c3c6;
  margin:0 0 20px;
  max-width:460px;
}

.offer-link{
  display:inline-flex;
  gap:6px;
  align-items:center;
  font-weight:700;
  font-size:12px;
}

.offer-art{
  position:relative;
  width:280px;
  min-width:180px;
}

.offer-circle{
  position:absolute;
  width:190px;
  height:190px;
  border-radius:50%;
  right:0;
  top:8px;
  background:
    radial-gradient(circle at 48% 38%,#e0b89e 0 7%,transparent 8%),
    radial-gradient(circle at 53% 38%,#ddb298 0 8%,transparent 9%),
    linear-gradient(145deg,#2d2220,#0d0e12 74%);
  box-shadow:inset -16px -12px 0 rgba(0,0,0,.18);
}

.offer-cut{
  position:absolute;
  right:22px;
  top:70px;
  color:#f3e7d2;
  transform:rotate(-13deg);
  font-family:var(--display);
  font-weight:800;
  font-size:34px;
  line-height:.8;
  letter-spacing:.08em;
}

.offer-cut b{
  font-size:16px;
}
/* =========================================================
   2026 PRO MOBILE / DISCOVERY PASS
========================================================= */
.rail-nav{gap:7px}
.rail-item{position:relative}
.rail-icon-box{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;transition:.22s ease}
.rail-item:hover .rail-icon-box{background:#f2f0eb;color:var(--ink);transform:translateY(-1px)}
.rail-item.is-active .rail-icon-box{background:#17191d;color:#fff;box-shadow:0 8px 20px rgba(17,18,22,.16)}
.rail-icon-accent{background:#f0e7da;color:#674d3d}

.discovery-categories-pro{margin-top:27px;padding-top:3px}
.discovery-heading-pro{align-items:flex-end}
.discovery-heading-pro>span{font-size:11px;color:#94969b}
.discovery-category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.discovery-category-card{min-height:118px;border-radius:20px;padding:15px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:end;gap:12px;border:1px solid rgba(20,22,26,.08);background:#fff;box-shadow:0 14px 32px rgba(25,24,22,.06);transition:.24s ease}
.discovery-category-card:hover{transform:translateY(-2px);box-shadow:0 20px 38px rgba(25,24,22,.09)}
.discovery-category-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.74);backdrop-filter:blur(10px);align-self:start}
.discovery-category-card small{display:block;font-size:8px;letter-spacing:.16em;font-weight:800;opacity:.65}
.discovery-category-card strong{display:block;font-family:var(--display);font-size:19px;letter-spacing:-.03em;margin-top:2px}
.discovery-category-card p{margin:4px 0 0;font-size:10px;color:#73767b}
.discovery-category-arrow{width:31px;height:31px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.65);align-self:start}
.discovery-salon{background:linear-gradient(135deg,#f7eee8,#fff)}
.discovery-locs{background:linear-gradient(135deg,#efe9df,#fff)}
.discovery-grooming{background:linear-gradient(135deg,#f4edf3,#fff)}
.discovery-shopping{background:linear-gradient(135deg,#edf1e9,#fff)}

.featured-shop-side-pro{min-height:420px}

@media (max-width:1100px){
  .discovery-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:820px){
  html,body{background:#f7f5f1!important}
  html[data-theme='dark'] body{background:#f7f5f1!important;color:#17181c!important}
  .page-noise{opacity:.018}
  .mobile-bottom-nav{background:rgba(255,253,249,.98);border-top-color:rgba(23,24,28,.08);box-shadow:0 -12px 30px rgba(20,22,26,.07)}
  .mobile-nav-item{color:#777b82}
  .mobile-nav-item.is-active{color:#17191d}
  .mobile-nav-fab{background:#17191d;box-shadow:0 10px 28px rgba(17,18,22,.18)}

  /* Featured: hide the desktop right rail and move controls into a true mobile overlay. */
  .featured-shop-side-pro{display:none!important}
  .featured-carousel-controls{position:absolute;left:12px;right:12px;bottom:12px;width:auto;margin:0;display:flex;align-items:center;justify-content:space-between;pointer-events:none;z-index:8}
  .featured-carousel-controls .featured-arrow{pointer-events:auto;position:relative;z-index:2}
  .featured-carousel-controls .featured-arrow:first-child{margin-left:auto}
  .featured-carousel-controls .featured-arrow + .featured-arrow{margin-left:5px}
  .featured-carousel-controls .featured-dots{position:absolute;left:50%;transform:translateX(-50%);bottom:0;pointer-events:auto;display:flex;align-items:center;justify-content:center}
  .featured-slide-count{display:none}

  /* Services: icon then label in one row, not stacked. */
  .service-scroller-pro{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
  .service-scroller-pro::-webkit-scrollbar{display:none}
  .service-scroller-pro .service-pill{flex:0 0 auto;min-width:126px;height:48px;padding:8px 12px;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:9px;border-radius:15px}
  .service-scroller-pro .service-icon{width:30px;height:30px;margin:0;border-radius:10px}
  .service-scroller-pro .service-pill span:last-child{font-size:11px}

  /* Category rails become premium compact list cards. */
  .discovery-categories-pro{margin-top:22px}
  .discovery-heading-pro{align-items:flex-start;gap:4px}
  .discovery-heading-pro>span{font-size:9px}
  .discovery-category-grid{grid-template-columns:1fr;gap:8px}
  .discovery-category-card{min-height:74px;border-radius:17px;padding:11px 12px;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;box-shadow:0 10px 22px rgba(25,24,22,.045)}
  .discovery-category-icon{width:36px;height:36px;border-radius:11px;align-self:center}
  .discovery-category-card small{font-size:7px}
  .discovery-category-card strong{font-size:15px}
  .discovery-category-card p{font-size:9px;margin-top:2px}
  .discovery-category-arrow{width:28px;height:28px;border-radius:9px}

  /* Barbers near you: horizontal rectangular card, image left/details right. */
  .shops-pro .section-heading{margin-bottom:10px}
  .shop-grid-pro{display:grid;grid-template-columns:1fr;gap:9px}
  .shop-card-pro{min-height:118px;display:grid;grid-template-columns:112px minmax(0,1fr);gap:0;align-items:stretch;border-radius:17px;overflow:hidden;background:#fff;border:1px solid rgba(20,22,26,.075);box-shadow:0 12px 28px rgba(25,24,22,.055)}
  .shop-media-pro{height:100%;min-height:118px;border-radius:0;background:#ded9d2}
  .shop-media-pro img{height:100%;object-fit:cover}
  .shop-media-top{top:7px;left:7px;right:7px}
  .shop-media-bottom{left:7px;right:7px;bottom:7px;gap:5px}
  .shop-media-bottom span{font-size:7px;padding:4px 6px;border-radius:7px}
  .rating-badge{font-size:8px;padding:5px 6px;border-radius:8px}
  .rating-badge small{font-size:7px}
  .shop-card-body-pro{padding:11px 12px 10px 13px;display:flex;flex-direction:column;justify-content:center;min-width:0}
  .shop-title-row h3{font-size:15px;line-height:1.1;letter-spacing:-.025em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .shop-card-body-pro p{font-size:9px;line-height:1.35;margin:4px 0 9px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .shop-meta-pro{padding-top:0;border-top:0;gap:7px;font-size:8px;align-items:center;flex-wrap:wrap}
  .shop-meta-pro span:first-child{font-size:8px}
  .shop-meta-pro b{font-size:10px}
  .shop-meta-pro span:last-child{padding-left:7px;border-left:1px solid var(--line)}

  /* Create shop: mobile is a full-screen setup surface. */
  .creator-mobile-hide{display:none!important}
  .pro-creator-page{min-height:100svh;background:#f7f5f1}
  .creator-topbar-pro{position:sticky;top:0;z-index:60;background:rgba(247,245,241,.98);backdrop-filter:blur(18px);padding:11px 12px;border-bottom:1px solid rgba(20,22,26,.07)}
  .creator-topbar-pro .creator-brand{font-size:12px}
  .creator-top-actions .btn{padding:9px 11px;font-size:10px}
  .creator-workspace{padding:0 0 calc(24px + env(safe-area-inset-bottom,0px));max-width:none}
  .creator-modal-fullscreen{border-radius:0;border-left:0;border-right:0;box-shadow:none;min-height:calc(100svh - 48px);border-color:rgba(20,22,26,.07)}
  .creator-modal-top{position:sticky;top:49px;z-index:48;padding:11px 12px;background:rgba(255,255,255,.96);backdrop-filter:blur(16px);border-bottom:1px solid rgba(20,22,26,.07)}
  .creator-modal-title{width:100%;justify-content:space-between}
  .creator-modal-title strong{font-size:14px}
  .creator-modal-title>span:last-child{display:none}
  .creator-progress-meta{width:100%;min-width:0}
  .creator-progress-meta>span{font-size:8px}
  .creator-layout{display:block;min-height:calc(100svh - 142px);position:relative}
  .creator-step-nav{position:sticky;top:119px;z-index:47;display:flex;gap:6px;padding:8px 9px;background:rgba(250,249,246,.96);backdrop-filter:blur(14px);border-bottom:1px solid rgba(20,22,26,.07);overflow-x:auto;scrollbar-width:none}
  .creator-step-nav::-webkit-scrollbar{display:none}
  .creator-step{min-width:84px;max-width:100px;display:grid;grid-template-columns:24px 1fr;grid-template-rows:auto;padding:8px;border-radius:12px;background:transparent;box-shadow:none}
  .creator-step b{font-size:10px;align-self:center}
  .creator-step small{display:none}
  .creator-step span{font-size:8px}
  .creator-step.is-active{background:#fff;box-shadow:0 8px 20px rgba(20,22,26,.065)}
  .creator-form-pro{padding:20px 13px 28px}
  .form-heading-pro{margin-bottom:19px}
  .form-heading-pro h2{font-size:27px;line-height:1.05}
  .form-heading-pro p{font-size:11px}
  .creator-form-pro label{margin-bottom:12px}
  .creator-form-pro label input,.creator-form-pro label textarea,.creator-form-pro label select{padding:13px;border-radius:14px;background:#fff}
  .service-row-pro{grid-template-columns:minmax(0,1fr) 82px 78px 34px;padding:6px}
  .service-row-pro input{min-width:0;padding:10px 9px!important}
  .pro-hours-card{padding:13px;border-radius:16px}
  .upload-dropzone{padding:14px;border-radius:16px}
  .gallery-preview-pro{grid-template-columns:repeat(3,1fr);gap:7px}
  .review-card-pro{grid-template-columns:96px minmax(0,1fr);padding:8px;gap:10px;border-radius:16px}
  .review-cover{height:106px}
  .review-copy h3{font-size:17px}
  .pro-form-actions{position:sticky;bottom:calc(0px + env(safe-area-inset-bottom,0px));z-index:30;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);margin:18px -13px -28px;padding:11px 13px calc(11px + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(20,22,26,.07)}

  /* Login becomes the actual mobile screen; photography panel disappears. */
  .auth-page-pro{display:block;min-height:100svh;background:#f7f5f1}
  .auth-art-pro{display:none!important}
  .auth-panel-pro{min-height:100svh;padding:18px 15px calc(30px + env(safe-area-inset-bottom,0px));background:#fff}
  .auth-form{max-width:none;margin:auto 0}
  .auth-form h2{font-size:31px}
  .auth-form>p{font-size:12px;line-height:1.55}
}

@media (max-width:560px){
  .discover-page{padding-left:9px;padding-right:9px}
  .featured-shop-media{min-height:344px;border-radius:20px}
  .featured-carousel-controls{left:10px;right:10px;bottom:10px}
  .featured-carousel-controls .featured-arrow{width:36px;height:36px;border-radius:11px}
  .featured-carousel-controls .featured-dots{gap:4px}
  .featured-carousel-controls .featured-dot{width:5px;height:5px}
  .featured-carousel-controls .featured-dot.is-active{width:18px}
  .shop-card-pro{grid-template-columns:104px minmax(0,1fr);min-height:108px}
  .shop-media-pro{min-height:108px}
  .shop-card-body-pro{padding:10px 10px 9px 11px}
  .shop-title-row h3{font-size:14px}
  .shop-card-body-pro p{font-size:8.5px}
  .service-scroller-pro .service-pill{min-width:118px}
  .creator-step-nav{top:117px}
  .creator-step{min-width:78px}
}

@media (max-width:820px){
  /* Keep shop-detail content close to the device edge; the hero can remain generous. */
  .shop-detail{padding:0!important}
  .detail-hero{width:100%!important}
  .detail-sheet{padding-left:12px!important;padding-right:12px!important;border-radius:22px 22px 0 0!important}
  .detail-heading{gap:10px}
  .detail-heading h1{font-size:29px;letter-spacing:-.035em}
  .detail-meta-row{padding-left:0!important;padding-right:0!important}
  .action-strip{margin-left:0!important;margin-right:0!important}
  .detail-tabs{margin-left:0!important;margin-right:0!important}
}


/* =========================================================
   LIVE FIREBASE DISCOVERY / CACHE-SAFE UI
========================================================= */
.live-skeleton-card{min-height:118px;border-radius:17px;overflow:hidden;background:#fff;border:1px solid rgba(20,22,26,.075);display:grid;grid-template-columns:112px minmax(0,1fr);box-shadow:0 12px 28px rgba(25,24,22,.045);animation:ebhPulse 1.35s ease-in-out infinite}
.live-skeleton-media{background:linear-gradient(90deg,#ebe8e3,#f5f3f0,#ebe8e3);background-size:200% 100%;animation:ebhShimmer 1.4s linear infinite}
.live-skeleton-copy{padding:20px 14px;display:flex;flex-direction:column;gap:9px;justify-content:center}.live-skeleton-copy span{height:9px;border-radius:999px;background:#ebe8e3;width:78%}.live-skeleton-copy span:nth-child(2){width:58%}.live-skeleton-copy span.short{width:38%}
@keyframes ebhShimmer{to{background-position:-200% 0}}@keyframes ebhPulse{50%{opacity:.82}}
.featured-live-empty{display:grid!important;place-items:center;background:#ebe8e3}.featured-live-skeleton{display:grid;gap:10px;justify-items:center;color:#777b82;font-size:11px}.featured-live-skeleton span{width:44px;height:44px;border-radius:14px;background:#f7f5f1;box-shadow:0 8px 28px rgba(0,0,0,.06)}.featured-live-no-image{width:100%;height:100%;display:grid;place-items:center;background:#eae6e0;color:#777;font-size:11px}
.category-live-section{margin-top:28px}.live-category-empty{margin-top:10px}.live-empty-icon{width:44px;height:44px;border-radius:14px;background:#f0eee9;display:grid;place-items:center;margin:0 auto 10px;color:#6f7278}
.workspace-shop-image.is-no-image{background:#f0eee9;display:grid;place-items:center}.workspace-no-image{font-size:8px;color:#888b91;text-align:center;padding:8px;line-height:1.2}.workspace-shop-cover.is-no-image{background:#eeeae5;display:grid;place-items:center}.workspace-cover-empty{padding:30px;color:#7c8087;font-size:12px;text-align:center}
@media(max-width:820px){.category-live-section{margin-top:22px}.live-skeleton-card{grid-template-columns:112px 1fr}}
@media(max-width:820px){
  .mobile-bottom-nav{grid-template-columns:repeat(4,minmax(0,1fr));}
  .mobile-nav-fab{display:none!important}
}


/* =========================================================
   GLOBAL SCROLL / SPA SAFETY
========================================================= */
html,body{min-height:100%;overflow-x:hidden}
body.app-body{overflow-y:auto}
.app-main{min-height:100svh}
body.modal-open{overflow:auto}
@media (max-width:820px){
  body.app-body{overflow-y:auto;-webkit-overflow-scrolling:touch}
  .app-main.with-app-nav{min-height:100svh}
  body[data-page="account"] .app-main.with-app-nav{padding-bottom:calc(88px + env(safe-area-inset-bottom,0px));overflow:visible}
}