:root {
  --eb-ink: #302b27;
  --eb-muted: #756c64;
  --eb-line: #e2d9cf;
  --eb-paper: #fffdf9;
  --eb-milk: #f6f1ea;
  --eb-accent: #9a7851;
  --eb-accent-dark: #6d5032;
  --eb-danger: #9c463f;
}
* { box-sizing: border-box; }
html, body { max-width: 100%; overflow-x: hidden; }
body { margin: 0; color: var(--eb-ink); font-family: Inter, Arial, sans-serif; }
button, input, textarea { font: inherit; }
button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(154,120,81,.35); outline-offset: 2px;
}
.eb-page { min-height: 100vh; background: linear-gradient(135deg,#eee6dc,#faf7f2); padding: 32px; }
.eb-page .eb-shell { margin: 0 auto; min-height: calc(100vh - 64px); }
.eb-shell {
  width: min(100%, 560px); background: var(--eb-paper); border: 1px solid var(--eb-line);
  color: var(--eb-ink); box-shadow: 0 24px 70px rgba(59,47,37,.14); overflow: hidden;
  display: flex; flex-direction: column; border-radius: 28px; min-width: 0;
}
.eb-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:28px 30px 18px; flex:none; }
.eb-brand,.eb-eyebrow { color:var(--eb-accent); letter-spacing:.18em; font-size:12px; font-weight:700; }
.eb-header h1 { font-family: Georgia,serif; font-size:32px; line-height:1.1; margin:6px 0 0; letter-spacing:-.02em; }
.eb-icon-button { border:1px solid var(--eb-line); background:var(--eb-paper); width:44px; height:44px; border-radius:50%; font-size:26px; cursor:pointer; }
.eb-progress { padding:0 30px; color:var(--eb-muted); font-size:12px; display:flex; align-items:center; gap:14px; flex:none; }
.eb-progress__track { position:relative; height:2px; flex:1; min-width:0; overflow:hidden; background:var(--eb-line); }
.eb-progress__bar { position:absolute; inset:0 auto 0 0; width:0; background:var(--eb-accent); transition:width .25s ease; }
.eb-progress span { flex:none; white-space:nowrap; }
.eb-toolbar { min-height:44px; padding:10px 30px 0; }
.eb-back { background:none; border:0; color:var(--eb-accent-dark); min-height:36px; cursor:pointer; }
.eb-content { padding:12px 30px 34px; overflow-y:auto; overflow-x:hidden; flex:1 1 auto; width:100%; min-width:0; }
.eb-content > * { max-width:100%; }
.eb-title { font: 28px/1.2 Georgia,serif; margin:0 0 8px; }
.eb-subtitle { color:var(--eb-muted); margin:0 0 22px; line-height:1.55; overflow-wrap:anywhere; }
.eb-search,.eb-input,.eb-textarea {
  display:block; width:100%; max-width:100%; min-width:0; border:1px solid var(--eb-line); background:#fff; border-radius:14px;
  padding:13px 15px; color:var(--eb-ink); min-height:48px;
}
.eb-search { margin-bottom:18px; padding-left:44px; background:
  linear-gradient(#fff,#fff) padding-box,
  linear-gradient(135deg,#e8dfd5,#d8c8b7) border-box; }
.eb-search-wrap { position:relative; }
.eb-search-wrap::before {
  content:""; position:absolute; z-index:1; left:16px; top:15px; width:15px; height:15px;
  border:1.5px solid var(--eb-muted); border-radius:50%; pointer-events:none;
}
.eb-search-wrap::after {
  content:""; position:absolute; z-index:1; left:29px; top:29px; width:7px; height:1.5px;
  background:var(--eb-muted); transform:rotate(45deg); pointer-events:none;
}
.eb-catalog { display:grid; gap:10px; }
.eb-category {
  margin:0; overflow:hidden; background:rgba(255,255,255,.58);
  border:1px solid var(--eb-line); border-radius:18px;
}
.eb-category[open] { background:#fff; box-shadow:0 10px 28px rgba(70,53,37,.055); }
.eb-category__summary {
  list-style:none; display:flex; align-items:center; gap:12px; min-height:62px; padding:13px 16px;
  cursor:pointer; user-select:none; color:var(--eb-ink);
}
.eb-category__summary::-webkit-details-marker { display:none; }
.eb-category__summary:focus-visible { outline:3px solid rgba(154,120,81,.28); outline-offset:-3px; border-radius:17px; }
.eb-category__name { flex:1; min-width:0; font-size:14px; font-weight:700; line-height:1.3; }
.eb-category__count {
  display:inline-grid; place-items:center; min-width:25px; height:25px; padding:0 7px;
  border-radius:999px; background:var(--eb-milk); color:var(--eb-muted); font-size:11px;
}
.eb-category__chevron {
  width:9px; height:9px; border-right:1.5px solid var(--eb-accent-dark);
  border-bottom:1.5px solid var(--eb-accent-dark); transform:rotate(45deg) translateY(-2px);
  transition:transform .2s ease;
}
.eb-category[open] .eb-category__chevron { transform:rotate(225deg) translate(-2px,-2px); }
.eb-service-list { border-top:1px solid var(--eb-line); }
.eb-service {
  width:100%; display:grid; grid-template-columns:minmax(0,1fr) 118px; gap:8px 16px;
  text-align:left; background:#fff; border:0; border-bottom:1px solid var(--eb-line);
  padding:17px 16px; cursor:pointer; color:var(--eb-ink); transition:background .15s;
}
.eb-service:last-child { border-bottom:0; }
.eb-service:hover { background:#fbf7f2; }
.eb-service__body { min-width:0; }
.eb-service__name { display:block; font-size:15px; font-weight:700; line-height:1.35; overflow-wrap:anywhere; }
.eb-service__description {
  display:-webkit-box; margin-top:5px; overflow:hidden; color:var(--eb-muted); font-size:12px;
  line-height:1.45; -webkit-line-clamp:2; -webkit-box-orient:vertical;
}
.eb-service__price {
  align-self:start; text-align:right; color:var(--eb-ink); font:700 15px/1.35 Georgia,serif;
}
.eb-service__price small { display:block; margin-bottom:2px; color:var(--eb-accent); font:600 10px/1.2 Arial,sans-serif; letter-spacing:.08em; text-transform:uppercase; }
.eb-service__meta { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:6px; margin-top:3px; }
.eb-pill {
  display:inline-flex; align-items:center; min-height:25px; padding:3px 9px; border-radius:999px;
  background:var(--eb-milk); color:var(--eb-muted); font-size:11px; line-height:1.2;
}
.eb-empty { padding:32px 18px; border:1px dashed var(--eb-line); border-radius:18px; text-align:center; color:var(--eb-muted); }
.eb-card {
  position:relative; width:100%; text-align:left; background:#fff; border:1px solid var(--eb-line);
  border-radius:18px; padding:18px 44px 18px 18px; margin:0 0 10px; cursor:pointer; color:var(--eb-ink);
  transition:transform .15s, border-color .15s, box-shadow .15s;
}
.eb-card::after {
  content:""; position:absolute; right:20px; top:50%; width:8px; height:8px;
  border-top:1.5px solid var(--eb-accent-dark); border-right:1.5px solid var(--eb-accent-dark);
  transform:translateY(-50%) rotate(45deg);
}
.eb-card:hover { transform:translateY(-1px); border-color:#c8b39b; box-shadow:0 8px 24px rgba(80,59,38,.08); }
.eb-card strong { display:block; font-size:17px; margin-bottom:5px; overflow-wrap:anywhere; }
.eb-card small { color:var(--eb-muted); line-height:1.45; }
.eb-meta { display:flex; flex-wrap:wrap; gap:7px 13px; margin-top:12px; color:var(--eb-accent-dark); font-size:13px; }
.eb-doctor { display:grid; grid-template-columns:62px 1fr; gap:14px; align-items:center; }
.eb-any-doctor {
  display:grid; grid-template-columns:48px 1fr; align-items:center; gap:14px;
  background:linear-gradient(135deg,#f8f2ea,#fff); border-color:#d8c5af;
}
.eb-any-doctor__icon {
  display:grid; place-items:center; width:48px; height:48px; border-radius:50%;
  background:var(--eb-ink); color:#fff; font:28px/1 Georgia,serif;
}
.eb-avatar { width:62px; height:62px; border-radius:50%; object-fit:cover; background:var(--eb-milk); }
.eb-days { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin:18px 0; }
.eb-day,.eb-slot { border:1px solid var(--eb-line); background:#fff; border-radius:13px; min-height:52px; padding:8px; cursor:pointer; color:var(--eb-ink); transition:background .15s,border-color .15s,transform .15s; }
.eb-day:hover,.eb-slot:hover { border-color:#c8b39b; transform:translateY(-1px); }
.eb-day[aria-pressed=true],.eb-slot[aria-pressed=true] { background:var(--eb-ink); color:#fff; border-color:var(--eb-ink); }
.eb-date { margin-top:10px; }
.eb-slot-group h3 { color:var(--eb-muted); font-size:13px; text-transform:uppercase; letter-spacing:.08em; }
.eb-slots { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:20px; }
.eb-form { display:grid; gap:14px; }
.eb-form .eb-button { width:100%; margin-top:4px; }
.eb-label { display:grid; gap:7px; font-size:14px; }
.eb-check { display:flex; align-items:flex-start; gap:10px; color:var(--eb-muted); font-size:13px; }
.eb-check input { margin-top:3px; }
.eb-button {
  display:inline-flex; justify-content:center; align-items:center; min-height:50px; border:0;
  border-radius:14px; padding:0 22px; background:var(--eb-ink); color:#fff; cursor:pointer;
  text-decoration:none; font-weight:600;
}
.eb-button:hover { background:#191715; color:#fff; }
.eb-error { padding:12px 14px; background:#f9ece9; color:var(--eb-danger); border-radius:12px; }
.eb-success { text-align:center; }
.eb-success__mark { width:68px;height:68px;border-radius:50%;background:#e8eee6;display:grid;place-items:center;margin:0 auto 18px;font-size:30px; }
.eb-summary { text-align:left;background:var(--eb-milk);border-radius:18px;padding:18px;margin:20px 0;line-height:1.8; }
.eb-actions { display:grid; gap:10px; }
.eb-actions .eb-button:nth-child(2) { background:var(--eb-milk); color:var(--eb-ink); border:1px solid var(--eb-line); }
.eb-loading { padding:40px 0; text-align:center; color:var(--eb-muted); }
.eb-demo { min-height:100vh;background:#efe8df;display:grid;place-items:center;padding:24px; }
.eb-demo__main { max-width:900px;text-align:center; }
.eb-demo h1 { font:clamp(40px,7vw,86px)/1 Georgia,serif;margin:18px 0; }
.eb-demo p { color:var(--eb-muted); }
@media (max-width:600px) {
  .eb-page { padding:0; }
  .eb-page .eb-shell,.eb-shell { width:100%; max-width:100%; min-height:100vh;border-radius:0;border:0; }
  .eb-header { padding:22px 20px 15px; }
  .eb-header h1 { font-size:29px; }
  .eb-content,.eb-progress { padding-left:20px;padding-right:20px; }
  .eb-toolbar { padding-left:20px; }
  .eb-days { grid-template-columns:repeat(3,1fr); }
  .eb-service { grid-template-columns:minmax(0,1fr) 102px; column-gap:10px; padding:16px 14px; }
  .eb-service__description { -webkit-line-clamp:2; }
  .eb-category__summary { padding-inline:14px; }
}
@media (max-width:360px) {
  .eb-content,.eb-progress { padding-left:16px; padding-right:16px; }
  .eb-header { padding-left:16px; padding-right:16px; }
  .eb-service { grid-template-columns:1fr; }
  .eb-service__price { grid-row:2; text-align:left; }
  .eb-service__meta { grid-row:3; }
}
