:root {
  --ink:#172133; --muted:#667085; --line:#dfe4eb; --blue:#006cff; --blue-dark:#0056cc;
  --green:#087a4b; --bg:#f5f6f8; --purple:#6236ff;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink);
}
* { box-sizing:border-box; }
[hidden] { display:none!important; }
body { margin:0; background:var(--bg); }
button,input { font:inherit; }
button { cursor:pointer; }
.site-header { height:72px; padding:0 44px; display:flex; align-items:center; gap:32px; background:white; border-bottom:1px solid #e6e9ee; position:sticky; top:0; z-index:20; }
.brand { color:#111827; text-decoration:none; font-weight:800; font-size:25px; letter-spacing:-.7px; display:flex; align-items:center; gap:9px; }
.brand-tree { width:25px; height:31px; position:relative; display:inline-block; }
.brand-tree i { width:7px; height:7px; border-radius:50%; position:absolute; }
.brand-tree i:nth-child(1){background:#f3cf00;left:9px;top:0}.brand-tree i:nth-child(2){background:#f04c39;left:1px;top:7px}.brand-tree i:nth-child(3){background:#e44498;left:17px;top:7px}.brand-tree i:nth-child(4){background:#8638b2;left:5px;top:14px}.brand-tree i:nth-child(5){background:#176ee8;left:14px;top:14px}.brand-tree i:nth-child(6){background:#05a660;left:9px;top:21px}.brand-tree i:nth-child(7){background:#05a660;left:9px;top:27px;width:7px;height:4px;border-radius:2px}
.header-search { width:min(430px,42vw); margin-left:auto; border:1px solid #ccd4df; border-radius:9px; display:flex; align-items:center; gap:9px; padding:0 13px; color:#637083; }
.header-search input { width:100%; height:42px; border:0; outline:0; }
.header-actions { display:flex; align-items:center; gap:14px; }
.my-orders-link { color:#38475c; font-size:13px; font-weight:750; text-decoration:none; white-space:nowrap; }
.post-button { border:0; border-radius:8px; padding:11px 17px; background:#f3ecff; color:var(--purple); font-weight:750; }
.avatar { width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:#eff3f7; font-weight:700; }
.page-shell { width:min(1160px,calc(100% - 32px)); margin:0 auto 70px; }
.breadcrumbs { display:flex; gap:9px; align-items:center; padding:24px 0 18px; color:#7a8495; font-size:13px; }
.breadcrumbs a { color:#526074; text-decoration:none; }
.title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:24px; }
.eyebrow,.section-kicker { color:var(--blue); letter-spacing:.1em; font-size:11px; font-weight:800; margin:0 0 7px; }
.title-row h1 { font-size:34px; letter-spacing:-1px; margin:0 0 9px; }
.listing-meta { color:var(--muted); margin:0; }
.icon-button { width:44px; height:44px; border:1px solid #d8dee6; background:white; border-radius:50%; font-size:25px; color:#3d4858; }
.icon-button.saved { color:#d5386c; background:#fff2f7; border-color:#f4bfd1; }
.detail-layout { display:grid; grid-template-columns:minmax(0,1fr) 350px; gap:24px; align-items:start; }
.main-column { display:grid; gap:20px; }
.gallery-card,.content-card,.contact-card { background:white; border:1px solid #e0e5eb; border-radius:14px; box-shadow:0 4px 18px rgba(31,44,65,.055); }
.gallery-card { padding:14px; }
.hero-photo { height:430px; position:relative; overflow:hidden; border-radius:10px; background:linear-gradient(145deg,#d8e6ed,#f2e6d9 58%,#d1e0d6); }
.family-photo { display:block; width:100%; height:100%; object-fit:cover; object-position:center 51%; }
.family-art { position:absolute; inset:0; overflow:hidden; background:radial-gradient(circle at 65% 25%,rgba(255,255,255,.8),transparent 34%),linear-gradient(180deg,transparent 68%,rgba(88,110,91,.14) 68%); }
.family-art:before,.family-art:after { content:""; position:absolute; border-radius:50%; filter:blur(1px); background:rgba(255,255,255,.36); }
.family-art:before { width:310px;height:310px;left:-70px;top:-95px}.family-art:after{width:240px;height:240px;right:-55px;bottom:-80px}
.cat { position:absolute; border-radius:47% 47% 44% 44%; box-shadow:inset 0 -16px 22px rgba(48,60,69,.12),0 16px 28px rgba(47,57,70,.18); }
.cat:before,.cat:after { content:""; position:absolute; top:-24%; width:45%; height:52%; background:inherit; clip-path:polygon(50% 0,100% 100%,0 78%); }
.cat:before{left:2%}.cat:after{right:2%}
.cat span:before,.cat span:after { content:""; position:absolute; top:45%; width:9px; height:13px; background:#273444; border-radius:50%; box-shadow:0 0 0 5px rgba(244,210,118,.36); }
.cat span:before{left:29%}.cat span:after{right:29%}
.mother { width:190px;height:160px;left:50%;top:40%;transform:translate(-50%,-50%);background:#7f91a5; }
.kitten { width:102px;height:87px;top:63%;background:#9aaabe; }
.k1{left:17%;background:#8799ae}.k2{left:35%;background:#b6a4c0}.k3{right:34%;background:#8d9eb2}.k4{right:16%;background:#c0a9a2}
.hero-photo.individual-photo .kitten { display:none; }
.hero-photo.individual-photo .mother { width:220px; height:188px; top:50%; }
.hero-photo.individual-photo.lilac .mother { background:#a593af; }
.hero-photo.individual-photo.cream .mother { background:#ac948c; }
.photo-label,.photo-count { position:absolute; bottom:16px; padding:7px 11px; border-radius:7px; background:rgba(17,27,42,.78); color:white; font-size:12px; }
.photo-label{left:16px}.photo-count{right:16px}
.thumbnail-row { display:grid; grid-template-columns:repeat(5,1fr); gap:9px; margin-top:10px; }
.thumbnail { height:76px; border:2px solid transparent; border-radius:8px; padding:0; overflow:hidden; background:#e8edf1; position:relative; }
.thumbnail.selected { border-color:var(--blue); box-shadow:0 0 0 2px rgba(0,108,255,.12); }
.thumb-family { height:100%; background:linear-gradient(145deg,#d8e6ed,#f2e6d9); display:grid; place-items:center; color:#5a6d77; font-size:26px; }
.pet-art { display:grid; place-items:center; position:relative; overflow:hidden; background:linear-gradient(145deg,#d8e7ee,#eef4f6); }
.pet-art { height:100%; }
.pet-art.lilac { background:linear-gradient(145deg,#ddd4e5,#f3eef6); }
.pet-art.cream { background:linear-gradient(145deg,#eadbd3,#f8f1eb); }
.pet-art:before { content:""; display:block; width:42%; aspect-ratio:1; border-radius:48%; background:#8193a8; position:relative; box-shadow:inset 0 -7px 11px rgba(40,53,70,.15); }
.pet-art.lilac:before { background:#a593af; }.pet-art.cream:before{background:#ac948c}
.pet-art:after { content:"••"; position:absolute; letter-spacing:7px; margin-left:7px; color:#253347; font-size:13px; }
.content-card { padding:29px 31px; }
.content-card h2 { margin:0 0 12px; font-size:24px; letter-spacing:-.4px; }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:22px; margin-bottom:18px; }
.section-heading h2 { margin-bottom:0; }.section-heading>p { color:var(--muted); margin:0; font-size:14px; }
.unit-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.unit-card { border:1.5px solid #d9e0e8; border-radius:11px; padding:10px; background:white; display:grid; grid-template-columns:78px 1fr; gap:12px; text-align:left; position:relative; }
.unit-card.unavailable { background:#f8f9fb; }
.unit-card .pet-art { height:72px; border-radius:8px; }
.unit-copy { min-width:0; padding-top:2px; }.unit-name-row{display:flex;justify-content:space-between;gap:8px;align-items:center}.unit-copy h3{margin:0;font-size:16px}.unit-copy p{margin:5px 0;color:var(--muted);font-size:12px}.unit-copy b{font-size:15px}
.status { display:inline-flex; border-radius:999px; padding:4px 7px; font-size:10px; font-weight:800; white-space:nowrap; }
.status.available{color:#087a4b;background:#e9f7ef}.status.pending{color:#9a6300;background:#fff3d6}.status.reserved{color:#7752b4;background:#f2ebff}
.description { color:#3f4b5d; line-height:1.7; margin:0 0 24px; }
.shared-heading { margin-bottom:24px; }
.shared-info-columns { display:grid; grid-template-columns:1.05fr 1.35fr .9fr; border-top:1px solid #e5e9ef; padding-top:22px; }
.info-group { min-width:0; padding:0 21px; border-right:1px solid #e5e9ef; }
.info-group:first-child { padding-left:0; }.info-group:last-child { padding-right:0; border-right:0; }
.info-group h3 { display:flex; align-items:center; gap:8px; margin:0 0 17px; font-size:16px; }
.info-group h3 span { color:#344054; font-size:19px; }
.detail-list { display:grid; gap:11px; margin:0; }
.detail-list div { display:grid; grid-template-columns:minmax(72px,1fr) 1.1fr; gap:9px; font-size:12px; line-height:1.35; }
.detail-list dt { color:var(--muted); }.detail-list dd { margin:0; color:#263346; font-weight:650; }
.check-list { display:grid; gap:10px; margin:0; padding:0; list-style:none; }
.check-list li { position:relative; padding-left:20px; color:#344054; font-size:12px; line-height:1.35; }
.check-list li:before { position:absolute; left:0; top:-1px; font-weight:900; }
.check-list li.yes:before { content:"✓"; color:var(--green); }.check-list li.no:before { content:"—"; color:#8a94a3; }
.contact-card { padding:24px; position:sticky; top:92px; }
.sidebar-price span,.sidebar-price b,.sidebar-price small { display:block; }
.sidebar-price span { color:var(--muted); font-size:12px; margin-bottom:5px; }
.sidebar-price b { font-size:30px; letter-spacing:-.8px; }
.sidebar-price small { color:var(--green); font-size:12px; font-weight:750; margin-top:4px; }
.seller-brief { display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:center; }
.seller-avatar { width:48px; height:48px; display:grid; place-items:center; border-radius:50%; background:#e9eff9; color:#285a9f; font-weight:800; }
.seller-brief h2 { margin:0 0 4px; font-size:20px; }.seller-brief p { margin:0; color:var(--muted); font-size:12px; }
.reply-time { margin-top:15px; color:#465266; font-size:12px; }.reply-time span { color:var(--green); margin-right:5px; }
.contact-card hr { border:0; border-top:1px solid #e5e9ef; margin:20px 0; }
.contact-card h3 { margin:0 0 7px; font-size:18px; }.contact-card>p { margin:0 0 18px; color:var(--muted); font-size:13px; line-height:1.5; }
.primary-button,.secondary-button { border-radius:9px; padding:13px 17px; font-weight:750; border:1.5px solid var(--blue); }.primary-button{width:100%;background:var(--blue);color:white}.primary-button:hover{background:var(--blue-dark)}.secondary-button{background:white;color:var(--blue)}.secondary-button.full{width:100%;margin-top:10px}.safe-note{display:flex;gap:8px;color:var(--muted);font-size:12px;line-height:1.45;margin:17px 0 0}.safe-note span{color:var(--green);font-weight:900}.primary-button:disabled{background:#aab3c0;border-color:#aab3c0;cursor:not-allowed}
.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,20px);opacity:0;background:#172133;color:white;padding:11px 16px;border-radius:8px;font-size:13px;transition:.2s;pointer-events:none;z-index:60}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){.header-search{display:none}.detail-layout{grid-template-columns:1fr}.contact-card{position:static;order:-1}.hero-photo{height:360px}.shared-info-columns{grid-template-columns:1fr 1fr}.info-group:nth-child(2){border-right:0}.info-group:last-child{grid-column:1/-1;border-top:1px solid #e5e9ef;margin-top:20px;padding:20px 0 0}}
@media(max-width:620px){.site-header{padding:0 17px}.post-button{display:none}.page-shell{width:min(100% - 22px,1160px)}.title-row h1{font-size:27px}.hero-photo{height:285px}.thumbnail-row{grid-template-columns:repeat(5,72px);overflow:auto}.content-card{padding:23px 19px}.unit-grid{grid-template-columns:1fr}.section-heading{align-items:flex-start;flex-direction:column}.shared-info-columns{grid-template-columns:1fr}.info-group:nth-child(n){padding:20px 0;border-right:0;border-top:1px solid #e5e9ef}.info-group:first-child{padding-top:0;border-top:0}.info-group:last-child{grid-column:auto;margin-top:0}.mother{width:145px;height:125px}.kitten{width:72px;height:62px}}
.pet-photo{display:block;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:inherit}.unit-card>.pet-photo{height:72px;border-radius:8px}.hero-photo.individual-photo{background-size:cover;background-position:center 38%}.hero-photo.individual-photo .family-photo{display:none}

.reserve-backdrop { position:fixed; inset:0; z-index:50; padding:20px; display:grid; place-items:center; background:rgba(18,28,45,.54); }
.reserve-modal { position:relative; width:min(550px,100%); max-height:calc(100dvh - 40px); overflow-y:auto; overscroll-behavior:contain; padding:27px; border-radius:16px; background:#fff; box-shadow:0 24px 70px rgba(9,19,34,.24); }
.reserve-close { position:absolute; top:13px; right:15px; border:0; border-radius:7px; width:30px; height:30px; background:#f2f4f7; color:#58677c; font-size:23px; line-height:1; }
.reserve-modal h2 { margin:5px 30px 10px 0; font-size:25px; letter-spacing:-.5px; }
.reserve-intro { margin:0 0 19px; color:var(--muted); font-size:12px; line-height:1.5; }
.reserve-options { display:grid; gap:9px; margin-bottom:16px; }
.reserve-pet-option { width:100%; display:grid; grid-template-columns:48px 1fr auto; align-items:center; gap:11px; padding:11px; text-align:left; border:1.5px solid #dce2e9; border-radius:10px; background:#fff; color:var(--ink); }
.reserve-pet-option img { width:48px; height:48px; object-fit:cover; border-radius:8px; }
.reserve-pet-option.selected { border-color:var(--blue); background:#f5f9ff; box-shadow:0 0 0 2px rgba(0,108,255,.08); }
.reserve-pet-option:disabled { background:#f7f8fa; opacity:.58; cursor:not-allowed; }
.reserve-pet-option:focus-visible,.reserve-close:focus-visible { outline:3px solid #95bfff; outline-offset:2px; }
.reserve-pet-copy { display:grid; gap:3px; min-width:0; }
.reserve-pet-copy b { font-size:13px; }
.reserve-pet-copy small { color:var(--muted); font-size:10px; }
.reserve-pet-copy>span { color:#59677b; font-size:10px; line-height:1.5; }
.reserve-pet-copy strong { color:#29364b; font-weight:750; }
.reserve-summary { padding:13px 15px; margin-bottom:15px; border:1px solid #dce6f4; border-radius:10px; background:#f7faff; }
.reserve-summary>b { font-size:11px; color:#354963; }
.reserve-summary dl { display:grid; gap:8px; margin:12px 0 0; }
.reserve-summary dl>div { display:flex; align-items:center; justify-content:space-between; gap:14px; font-size:11px; }
.reserve-summary dt { color:var(--muted); }
.reserve-summary dd { margin:0; font-weight:750; }
.reserve-summary .reserve-total { padding-top:9px; border-top:1px solid #dce6f4; }
.reserve-summary .reserve-total dt,.reserve-summary .reserve-total dd { color:var(--ink); font-weight:800; }
.reserve-footnote { margin:11px 4px 0; color:#8590a2; text-align:center; font-size:10px; line-height:1.5; }
.reserve-error { padding:10px 12px; margin:0 0 12px; color:#a53646; background:#fff0f2; border-radius:8px; font-size:11px; line-height:1.4; }
@media(max-width:620px) { .reserve-backdrop { padding:12px; }.reserve-modal { max-height:calc(100dvh - 24px); padding:23px 18px; }.reserve-modal h2 { font-size:22px; }.reserve-pet-option { gap:8px; padding:9px; grid-template-columns:42px 1fr auto; }.reserve-pet-option img { width:42px; height:42px; }.reserve-pet-option .status { font-size:8px; padding:4px 5px; }.my-orders-link { font-size:12px; } }