:root {
  color-scheme: light;
  --ink: #1c3029;
  --sub: #4d6257;
  --pine: #194b3b;
  --pine-dark: #10382c;
  --paper: #f9f8f1;
  --white: #fffefa;
  --line: #dce2d6;
  --peach: #ffdbbc;
  --lime: #e6eed1;
  --radius: 21px;
  --shadow: 0 12px 36px #1531250b;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.55 system-ui, -apple-system, "Segoe UI", sans-serif; }
a { color: var(--pine); text-underline-offset: 3px; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: wait; opacity: .65; }
:focus-visible { outline: 3px solid #b16e35; outline-offset: 3px; }
h1,h2,h3,p { margin: 0 0 12px; }
h1,h2,h3 { letter-spacing: -.035em; line-height: 1.13; }
h1 { font-size: clamp(35px, 6vw, 64px); }
h2 { font-size: clamp(25px, 4vw, 37px); }
h3 { font-size: 22px; }
img, video, svg { max-width: 100%; }
.shell { width: min(1160px, calc(100% - 40px)); margin-inline: auto; }
.top { background: var(--paper); border-bottom: 1px solid var(--line); }
.top .shell { display: flex; min-height: 75px; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: inline-flex; align-items: center; gap: 11px; text-decoration: none; color: var(--ink); font-weight: 780; letter-spacing: -.04em; font-size: 19px; }
.brand-mark { display: grid; place-items: center; width: 36px; height: 36px; background: var(--pine); color: #fff; border-radius: 12px; flex: none; }
.top nav,.foot nav { display: flex; flex-wrap: wrap; gap: 12px 23px; }
.top nav a,.foot a { font-size: 14px; color: var(--sub); }
main { padding: 28px 0 66px; min-height: 65vh; }
.hero { border-radius: 27px; background: var(--pine-dark); color: #fffdf1; display: grid; grid-template-columns: 1.28fr .72fr; align-items: center; gap: 16px; overflow: hidden; }
.hero-copy { padding: clamp(23px, 4vw, 47px); }
.hero h1 { max-width: 690px; font-size: clamp(34px, 4.2vw, 56px); }
.hero p { color: #e0ecdf; max-width: 600px; }
.hero-art { width: 100%; align-self: stretch; min-height: 210px; object-fit: contain; padding: 16px 22px 0 0; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; color: var(--pine); font-size: 12px; font-weight: 800; letter-spacing: .10em; text-transform: uppercase; margin-bottom: 13px; }
.hero .eyebrow { color: #dbe6bc; }
.eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #e9a66c; }
.section { margin-top: 32px; }
.section-head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 4px 16px; }
.choice-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 15px; }
.choice { display: flex; flex-direction: column; min-height: 214px; padding: 22px; text-decoration: none; color: var(--ink); border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); box-shadow: var(--shadow); transition: transform .16s, border-color .16s; }
.choice:hover { transform: translateY(-3px); border-color: #739886; }
.choice p { color: var(--sub); }
.choice .go { color: var(--pine); font-weight: 750; margin-top: auto; }
.choice-icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 13px; background: var(--lime); margin-bottom: 15px; }
.choice:nth-child(2) .choice-icon { background: var(--peach); }
.choice:nth-child(3) .choice-icon { background: #e2ebf0; }
.choice-icon svg { width: 24px; height: 24px; }
.guide-strip { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; border-top: 1px solid var(--line); padding-top: 26px; }
.foot { border-top: 1px solid var(--line); padding: 26px 0 38px; color: var(--sub); }
.foot .shell { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; }
.narrow { width: min(790px, 100%); margin-inline: auto; }
.page-title { margin-bottom: 22px; }
.page-title h1 { font-size: clamp(33px,5vw,49px); margin-top: 10px; }
.page-title p,.muted { color: var(--sub); }
.crumb { font-size: 14px; font-weight: 650; }
.panel { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(17px, 3.5vw, 30px); box-shadow: var(--shadow); margin-bottom: 16px; min-width: 0; }
.panel h2 { font-size: 25px; }
.fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.field { display: block; min-width: 0; }
.field.wide { grid-column: 1/-1; }
.field > label,.field > span, legend { display: block; font-weight: 700; margin-bottom: 5px; }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
legend { padding: 0; }
input:not([type=checkbox]):not([type=radio]),select,textarea { width: 100%; border: 1px solid #b9c8bb; border-radius: 10px; background: #fff; color: var(--ink); min-height: 44px; padding: 8px 11px; }
input[type=file] { min-width: 0; max-width: 100%; }
textarea { min-height: 95px; resize: vertical; }
textarea.caption { min-height: 260px; }
input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--pine); flex: none; }
.options { display: flex; flex-wrap: wrap; gap: 8px; }
.check { display: inline-flex; gap: 8px; align-items: flex-start; }
.options .check { border: 1px solid var(--line); border-radius: 11px; background: #f6f8ef; padding: 7px 10px 7px 6px; align-items: center; }
.hint { color: var(--sub); font-size: 13px; display: block; margin-top: 4px; }
.error { display: block; color: #a12922; font-size: 14px; margin-top: 4px; }
.notice { border-radius: 12px; padding: 12px 15px; background: #eaf1de; border: 1px solid #d8e4c9; margin: 12px 0; }
.notice.error-box { background: #ffebe2; border-color: #efc9bd; color: #842820; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; padding: 9px 17px; color: #fff; background: var(--pine); border: 1px solid transparent; border-radius: 11px; text-decoration: none; font-weight: 720; }
.btn:hover { background: var(--pine-dark); }
.btn.secondary { color: var(--pine); background: #fff; border-color: #b9c8bb; }
.btn.secondary:hover { background: #edf2e8; }
.btn.danger { background: #92372d; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-top: 15px; }
.actions > form { margin: 0; }
details summary { cursor: pointer; font-weight: 700; }
details[open] summary { margin-bottom: 10px; }
.media-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(135px,1fr)); gap: 10px; margin: 12px 0; }
.media-tile { min-width: 0; border: 1px solid var(--line); background: #f1f4e9; border-radius: 12px; overflow: hidden; }
.media-tile img,.media-tile video { display: block; width: 100%; height: 135px; object-fit: contain; background: #e8eee1; }
.media-tile .media-tools { padding: 7px; display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.mini { padding: 4px 7px; border-radius: 7px; border: 1px solid #bacabb; background: #fff; color: var(--pine); font-size: 12px; }
.capsule { display: inline-block; font-size: 12px; font-weight: 750; padding: 3px 8px; background: var(--lime); color: var(--pine-dark); border-radius: 7px; }
.adtext { white-space: pre-wrap; overflow-wrap: anywhere; background: #f5f6ee; padding: 16px; border-radius: 11px; margin: 0 0 12px; }
.story { width: 245px; height: auto; border-radius: 12px; border: 1px solid var(--line); display: block; }
.story-story { display: grid; grid-template-columns: minmax(0,1fr) 285px; gap: 16px; align-items: start; }
.list { list-style: none; margin: 0; padding: 0; }
.list li + li { border-top: 1px solid var(--line); }
.list li { padding: 13px 0; }
.list li:first-child { padding-top: 0; }
.list li:last-child { padding-bottom: 0; }
.toolbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; margin-bottom: 16px; }
.toolbar .field { flex: 1 0 145px; }
.admin-nav { display: flex; gap: 8px; flex-wrap: wrap; padding-bottom: 16px; }
.admin-nav a { text-decoration: none; padding: 6px 10px; border-radius: 8px; font-weight: 650; }
.admin-nav a:hover,.admin-nav a[aria-current=page] { background: var(--lime); }
.admin-nav form { margin-left: auto; }
.metrics { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.metric { display: block; background: var(--white); border: 1px solid var(--line); padding: 14px; border-radius: 12px; margin-bottom: 16px; }
.metric strong { display: block; font-size: 24px; }
.item-row { display: flex; align-items: center; gap: 13px; flex-wrap: wrap; }
.item-row .item-body { flex: 1; min-width: 180px; }
.thumb { width: 64px; height: 64px; border-radius: 9px; object-fit: cover; background: var(--lime); }
.compact p { margin-bottom: 5px; }
.panel dd { margin: 0 0 7px; overflow-wrap: anywhere; }
.panel dt { font-weight: 700; }
.rule-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.rule-grid .check { display: flex; margin-bottom: 5px; }
@media (max-width: 760px) {
  .shell { width: calc(100% - 28px); }
  .top .shell { padding: 11px 0; align-items: flex-start; flex-direction: column; gap: 6px; }
  main { padding-top: 16px; }
  .hero { grid-template-columns: 1fr; gap: 0; }
  .hero-copy { padding-bottom: 7px; }
  .hero h1 { font-size: clamp(29px, 5.5vw, 39px); }
  .hero-art { max-height: 108px; min-height: 0; justify-self: end; object-position: right; padding: 0 12px 0 0; }
  .choice-grid,.guide-strip,.rule-grid { grid-template-columns: 1fr; }
  .choice { display: grid; grid-template-columns: 39px 1fr; column-gap: 12px; min-height: 0; padding: 16px; }
  .choice-icon { grid-row: 1/4; width: 39px; height: 39px; margin-bottom: 0; }
  .choice h3 { margin: 0 0 6px; }
  .choice p { margin-bottom: 9px; }
  .story-story { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .fields,.metrics { grid-template-columns: 1fr; }
  .metrics { gap: 6px; margin-bottom: 12px; }
  .metric { margin-bottom: 0; }
  .metric strong { display: inline; margin-right: 7px; }
  .admin-nav form { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { transition: none !important; } }

/* Warm editorial identity shared by the portal and moderation screens. */
:root { --ink:#292724; --sub:#6b6660; --pine:#b74529; --pine-dark:#8f311c; --paper:#faf8f5; --white:#fff; --line:#e7e1da; --peach:#f6e5d5; --lime:#f4e7d7; --radius:20px; --shadow:0 8px 28px #30251a05; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { -webkit-font-smoothing:antialiased; }
h1,h2,h3 { font-weight:750; }
.shell { width:min(1200px,calc(100% - 64px)); }
.top { background:#faf8f5ed; }
.top .shell { min-height:88px; }
.brand { font-size:21px; letter-spacing:-.045em; }
.brand-mark { background:var(--pine); border-radius:50%; width:40px; height:40px; }
.top nav a { text-decoration:none; font-weight:550; }
.top nav a:hover { color:var(--pine); }
main { padding-top:24px; }
.btn { border-radius:100px; padding:12px 23px; box-shadow:none; }
.btn.secondary { border-color:var(--line); }
.btn.secondary:hover { background:#f9eee4; }
.eyebrow { font-size:11px; letter-spacing:.1em; color:var(--pine); }
.eyebrow::before { display:none; }
.welcome { display:grid; grid-template-columns:1.14fr 1fr; align-items:center; gap:28px; min-height:460px; padding:14px 0 30px; }
.welcome-copy { padding:10px 0; }
.location-label { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:600; color:var(--sub); margin-bottom:23px; }
.location-label > span { color:var(--pine); font-size:25px; line-height:1; }
.welcome h1 { font-size:clamp(40px,4.65vw,67px); line-height:1.05; letter-spacing:-.065em; margin-bottom:22px; }
.welcome h1 em { font-style:normal; color:var(--pine); }
.welcome-copy > p { color:var(--sub); font-size:16px; max-width:490px; line-height:1.7; margin-bottom:24px; }
.welcome-cta { gap:32px; min-height:54px; font-size:15px; }
.welcome-cta > span { font-size:23px; font-weight:400; }
.welcome-note { font-size:12px; color:var(--sub); margin-top:12px; }
.welcome-note > span { color:var(--pine); margin-right:4px; }
.pet-collage { height:410px; position:relative; margin:0 8px 0 12px; }
.dog-frame { position:absolute; right:0; top:0; width:76%; height:95%; border-radius:150px 150px 26px 26px; overflow:hidden; transform:rotate(3deg); background:#497a93; }
.dog-frame img { width:100%; height:100%; object-fit:cover; object-position:50% 43%; }
.photo-caption { position:absolute; bottom:0; left:0; right:0; padding:35px 20px 22px; color:#fff; text-align:center; font-size:12px; background:linear-gradient(transparent,#171717b5); }
.cat-frame { position:absolute; width:40%; height:57%; left:0; bottom:0; border:7px solid #fff; border-bottom-width:36px; border-radius:22px; transform:rotate(-9deg); box-shadow:0 14px 30px #34241521; background:#171b1a; }
.cat-frame img { width:100%; height:100%; object-fit:cover; border-radius:13px 13px 0 0; }
.cat-frame > span { position:absolute; bottom:-29px; left:0; width:100%; text-align:center; font-size:12px; font-weight:650; }
.heart-stamp { position:absolute; right:-9px; top:7px; width:73px; height:73px; background:#f5d56f; color:#4f3b24; border-radius:50%; display:grid; place-items:center; font-size:47px; transform:rotate(14deg); }
.start-section { margin-top:30px; scroll-margin-top:20px; }
.section-head { margin-bottom:20px; }
.section-head h2 { font-size:27px; margin:0; }
.section-head .muted { font-size:13px; }
.choice-grid { gap:18px; }
.choice { position:relative; display:flex; flex-direction:column; padding:25px; min-height:282px; border:none; border-radius:20px; box-shadow:none; }
.choice-lost { background:#f3e9dc; }
.choice-found { background:#e9eee5; }
.choice-help { background:#ece9f1; }
.choice:hover { transform:translateY(-5px); box-shadow:0 10px 30px #31271e0f; }
.choice-avatar { width:65px; height:65px; object-fit:cover; object-position:center 38%; border-radius:50%; margin-bottom:18px; border:3px solid #ffffffb3; }
.choice-arrow { position:absolute; right:24px; top:27px; border:1px solid #29272429; width:35px; height:35px; border-radius:50%; display:grid; place-items:center; font-size:21px; }
.choice h3 { font-size:23px; margin-bottom:10px; }
.choice p { font-size:14px; line-height:1.6; margin-bottom:20px; }
.choice .go { font-size:13px; color:var(--ink); display:flex; justify-content:space-between; align-items:center; width:100%; }
.choice .go > span { font-size:19px; }
.how-section { display:grid; grid-template-columns:1fr 1.1fr; gap:90px; padding:80px 0; }
.how-intro h2,.guide-copy h2 { font-size:43px; line-height:1.12; letter-spacing:-.05em; }
.how-intro p { max-width:365px; color:var(--sub); margin-top:18px; font-size:15px; }
.steps { padding:0; margin:0; list-style:none; }
.steps li { display:flex; gap:20px; padding:18px 0; border-bottom:1px solid var(--line); }
.steps li:first-child { padding-top:0; }
.steps li:last-child { border-bottom:0; padding-bottom:0; }
.steps li > span { font-size:14px; color:var(--pine); padding-top:2px; font-weight:700; }
.steps h3 { font-size:18px; margin-bottom:6px; }
.steps p { font-size:14px; color:var(--sub); margin:0; }
.photo-guide { display:grid; grid-template-columns:.8fr 1fr; border-radius:26px; overflow:hidden; background:#f0e8dc; min-height:390px; }
.guide-photo { position:relative; min-height:390px; }
.guide-photo img { width:100%; height:100%; position:absolute; object-fit:cover; object-position:center 38%; }
.guide-photo > span { position:absolute; bottom:22px; left:22px; right:22px; width:fit-content; padding:9px 13px; background:#fff; border-radius:50px; font-size:11px; font-weight:600; }
.guide-copy { padding:48px 55px; }
.guide-copy p { font-size:15px; color:#655d53; margin:19px 0; }
.photo-order { display:flex; align-items:center; flex-wrap:wrap; gap:9px; font-size:12px; margin-bottom:23px; }
.photo-order b { display:grid; place-items:center; background:#fff9; border-radius:50%; width:24px; height:24px; }
.photo-order > span { padding:0 8px; }
.text-link { display:inline-flex; gap:24px; font-size:13px; font-weight:700; color:var(--ink); }
.outreach { display:flex; gap:40px; justify-content:space-between; align-items:center; padding:65px 0 0; }
.outreach h2 { font-size:32px; }
.outreach p { max-width:680px; color:var(--sub); font-size:14px; }
.outreach .btn { flex:none; font-size:13px; gap:20px; }
.foot { background:#f2eee8; border:0; font-size:12px; padding:32px 0; }
.foot a { font-size:12px; text-decoration:none; }
.narrow { width:min(820px,100%); }
.page-title { padding-top:12px; margin-bottom:28px; }
.page-title h1 { letter-spacing:-.05em; }
.page-title p { font-size:15px; }
.crumb { color:var(--sub); text-decoration:none; }
.intake-title { position:relative; padding-right:110px; }
.intake-title h1 { margin-top:20px; }
.intake-avatar { position:absolute; right:0; top:45px; border-radius:50%; object-fit:cover; border:5px solid #fff; box-shadow:0 5px 20px #29272410; }
.form-progress { display:flex; justify-content:space-between; gap:10px; margin:0 0 24px; font-size:12px; color:var(--sub); }
.form-progress > span { display:flex; align-items:center; gap:7px; }
.form-progress b { width:25px; height:25px; border-radius:50%; display:grid; place-items:center; background:#ede8e2; }
.form-progress [aria-current] { color:var(--pine); font-weight:700; }
.form-progress [aria-current] b { background:var(--pine); color:#fff; }
.panel { padding:30px; box-shadow:none; border-color:var(--line); }
.panel h2 { margin-bottom:22px; font-size:23px; }
.fields { gap:22px 18px; }
.field > label,.field > span,legend { font-size:14px; margin-bottom:8px; }
input:not([type=checkbox]):not([type=radio]),select,textarea { border-color:#d7d1ca; border-radius:10px; min-height:48px; background:#fdfcfa; }
.options .check { background:#faf8f5; border-color:#e7e1da; font-size:14px; min-height:43px; }
.options .check:has(input:checked) { border-color:var(--pine); background:#faeae2; }
input[type=file] { padding:20px!important; border:1px dashed #bcaca0!important; background:#faf5ee!important; }
input[type=file]::file-selector-button { background:#fff; border:1px solid var(--line); border-radius:7px; padding:8px 12px; margin-right:10px; color:var(--ink); cursor:pointer; }
.notice { background:#f4ede2; border-color:#e6d8c4; }
.adtext { background:#f6f2ec; }
.admin-nav { border-bottom:1px solid var(--line); margin-bottom:22px; }
.admin-nav a[aria-current=page] { background:var(--pine); color:#fff; }
.metric { border-radius:16px; padding:20px; }
.metric strong { font-size:32px; }
.thumb { border-radius:50%; }
@media(max-width:1000px) {
  .welcome { gap:16px; }
  .pet-collage { height:360px; margin-right:8px; }
  .welcome h1 { font-size:49px; }
  .desktop-break { display:none; }
  .choice { padding:22px; }
  .choice h3 { font-size:21px; }
  .how-section { gap:40px; }
  .guide-copy { padding:35px; }
  .outreach { flex-direction:column; align-items:flex-start; gap:16px; }
}
@media(max-width:760px) {
  .shell { width:calc(100% - 36px); }
  .top .shell { min-height:0; padding:15px 0 12px; gap:12px; }
  .brand { font-size:19px; }
  .brand-mark { width:34px; height:34px; }
  .top nav { gap:18px; }
  .top nav a { font-size:11px; }
  main { padding-top:12px; }
  .welcome { grid-template-columns:1fr; padding:8px 0 0; gap:14px; min-height:0; }
  .welcome-copy { padding:0; }
  .location-label { font-size:10px; margin-bottom:15px; gap:6px; }
  .location-label > span { font-size:20px; }
  .welcome h1 { font-size:clamp(36px,8.3vw,57px); letter-spacing:-.06em; margin-bottom:16px; }
  .welcome-copy > p { font-size:14px; line-height:1.6; margin-bottom:18px; }
  .welcome-cta { min-height:47px; padding:9px 20px; font-size:13px; }
  .welcome-note { font-size:10px; margin-top:9px; }
  .pet-collage { height:218px; width:min(420px,100%); justify-self:center; margin:9px 0 0; }
  .dog-frame { width:65%; height:100%; right:14px; border-radius:90px 90px 18px 18px; }
  .dog-frame img { object-position:center 42%; }
  .photo-caption { font-size:9px; padding:25px 8px 12px; }
  .cat-frame { width:36%; height:80%; left:10px; bottom:0; border-width:5px; border-bottom-width:28px; }
  .cat-frame > span { bottom:-23px; font-size:10px; }
  .heart-stamp { width:49px; height:49px; font-size:34px; right:0; top:5px; }
  .start-section { margin-top:35px; }
  .section-head { margin-bottom:14px; gap:6px; }
  .section-head h2 { font-size:24px; }
  .section-head .muted { font-size:11px; }
  .choice-grid { grid-template-columns:1fr; gap:12px; }
  .choice { display:grid; grid-template-columns:54px minmax(0,1fr); column-gap:14px; padding:20px; min-height:0; border-radius:17px; }
  .choice-avatar { grid-column:1; grid-row:1/4; width:54px; height:54px; margin:0; }
  .choice h3,.choice p,.choice .go { grid-column:2; }
  .choice h3 { font-size:19px; margin:0 0 8px; }
  .choice p { font-size:12px; margin-bottom:12px; }
  .choice .go { font-size:11px; }
  .choice-arrow { display:none; }
  .how-section { grid-template-columns:1fr; padding:45px 0; gap:24px; }
  .how-intro h2,.guide-copy h2 { font-size:34px; }
  .how-intro p { font-size:14px; }
  .steps li { gap:16px; }
  .steps h3 { font-size:17px; }
  .steps p { font-size:13px; }
  .photo-guide { grid-template-columns:1fr; border-radius:20px; }
  .guide-photo { min-height:250px; }
  .guide-photo img { object-position:50% 37%; }
  .guide-photo > span { left:15px; bottom:15px; font-size:10px; }
  .guide-copy { padding:27px; }
  .guide-copy p { font-size:14px; }
  .text-link { gap:12px; font-size:12px; }
  .outreach { padding-top:40px; }
  .outreach h2 { font-size:27px; }
  .foot .shell { flex-direction:column; }
  .foot nav { gap:12px 18px; }
  .intake-title { padding-right:0; }
  .intake-title .crumb { display:block; margin-bottom:20px; }
  .intake-title h1 { padding-right:65px; font-size:33px; min-height:60px; display:flex; align-items:center; }
  .intake-avatar { width:60px; height:60px; top:52px; border-width:3px; }
  .form-progress { gap:5px; font-size:10px; }
  .form-progress > span { gap:5px; }
  .form-progress b { width:20px; height:20px; }
  .panel { padding:20px; }
  .panel h2 { font-size:21px; margin-bottom:18px; }
  input[type=file] { padding:12px!important; font-size:12px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
.photo-caption { top:17px; bottom:auto; background:none; padding:0 12px; text-shadow:0 1px 8px #0008; }
@media(max-width:760px) { .photo-caption { top:15px; font-size:8px; padding:0 7px; } }
.budget-progress { display:block; width:100%; height:10px; accent-color:var(--pine); margin:5px 0 12px; }
.ai-usage-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; }
.ai-usage-row > div { min-width:0; overflow-wrap:anywhere; }
/* Keep native hidden semantics even when a component has display:flex/block. */
[hidden] { display:none!important; }
.top nav .nav-tips { background:#f5e6db; color:#96371e; padding:9px 14px; border-radius:30px; font-weight:700; }
.top nav { align-items:center; }
.tips-hook { display:block; width:fit-content; color:var(--sub); font-size:12px; text-decoration:none; margin-top:19px; }
.tips-hook span { display:block; color:var(--pine); text-decoration:underline; text-underline-offset:4px; font-weight:700; margin-top:4px; }
.form-benefit { display:flex; flex-direction:column; gap:6px; border-left:3px solid var(--pine); padding:16px 20px; background:#f6eadf; border-radius:0 15px 15px 0; margin:0 0 26px; font-size:14px; }
.form-benefit span { color:#63564e; }
.form-section-heading { display:flex; gap:15px; align-items:flex-start; margin-bottom:24px; }
.step-badge { display:inline-flex; flex:none; align-items:center; justify-content:center; min-width:38px; height:38px; padding:0 10px; border-radius:12px; background:#f5e6d9; color:var(--pine); font-size:13px; font-weight:750; }
.form-section-heading h2 { margin:1px 0 7px; }
.form-section-heading p { font-size:13px; margin:0; }
.situation-tips { margin-bottom:26px; padding:15px 18px; border-radius:14px; background:#eff2ea; font-size:13px; color:#47553d; }
.situation-tips summary { font-size:14px; }
.situation-tips a { font-size:12px; font-weight:650; }
.field[data-field=city],.field[data-field=place],.field[data-field=other_animal],.field[data-field=other_need],.field[data-field=post_url] { grid-column:1/-1; }
.number-options .check { position:relative; padding:10px 17px; min-width:45px; justify-content:center; cursor:pointer; font-size:15px; }
.number-options input { position:absolute; opacity:0; width:1px; height:1px; }
.number-options .check:has(input:checked) { background:var(--pine); border-color:var(--pine); color:#fff; }
.number-options .check:has(input:focus-visible) { outline:3px solid #b16e35; outline-offset:3px; }
.quick-dates { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-top:9px; }
.quick-dates button { background:#fff; border:1px solid var(--line); border-radius:25px; padding:7px 13px; color:var(--sub); font-size:12px; }
.quick-dates button[aria-pressed=true] { background:#f6e6d9; color:var(--pine); border-color:#cb9d83; }
.quick-dates .hint { font-size:11px; }
.result-guide { display:flex; gap:18px; margin:28px 0; padding:22px; border-radius:18px; background:#f2eadf; }
.result-guide h2 { font-size:23px; }
.result-guide p,.result-guide a { font-size:14px; }
#ready-text { min-height:360px; line-height:1.7; }
@media(max-width:760px) {
  .top nav .nav-tips { padding:7px 10px; }
  .top nav { gap:8px; }
  .form-benefit { font-size:12px; padding:14px 16px; }
  .form-section-heading { gap:10px; }
  .form-section-heading h2 { font-size:20px; }
  .situation-tips { padding:14px; }
  .number-options .check { padding:10px 13px; }
  .result-guide { flex-direction:column; }
  .result-guide .step-badge { align-self:flex-start; }
}

.guide-promise{display:flex;gap:28px;align-items:center;padding:38px 0;margin:20px 0 12px;border-top:1px solid var(--line)}.guide-promise>span{font-size:60px;color:var(--pine);flex-shrink:0}.guide-promise h2{font-size:27px;letter-spacing:-.03em;margin:0 0 9px}.guide-promise p{font-size:15px;color:var(--sub);max-width:700px;margin:0;line-height:1.7}@media(max-width:760px){.guide-promise{gap:17px;padding:30px 0}.guide-promise>span{font-size:40px}.guide-promise h2{font-size:21px}.guide-promise p{font-size:13px}}
.welcome-cta{width:100%;display:flex;justify-content:space-between;text-align:left}.welcome-copy>p{max-width:440px}.directory-page{max-width:1000px;margin:auto}.directory-heading{display:grid;grid-template-columns:1fr 240px;align-items:center;gap:30px;margin:12px 0 25px}.directory-heading h1{font-size:clamp(30px,3.8vw,46px);margin:22px 0 15px}.directory-heading p{font-size:15px;color:var(--sub);max-width:550px}.directory-disclaimer{display:flex;align-items:flex-start;gap:14px;background:#f1ebdf;border-radius:16px;padding:20px 24px;margin-bottom:28px}.directory-disclaimer>span{display:grid;place-items:center;flex:none;border:1px solid #ad9c81;border-radius:50%;width:25px;height:25px;color:#796b55;font-style:italic;font-family:serif}.directory-disclaimer p{font-size:13px;line-height:1.65;margin:0;color:#75664e}.directory-disclaimer strong{display:block;margin-bottom:3px;color:#4e4435}.city-picker{display:flex;flex-direction:column;align-items:start;gap:7px;margin:0 0 30px}.city-picker>label{font-size:12px;font-weight:650;color:var(--sub)}.city-picker>div{display:flex;gap:12px;width:min(100%,430px)}.city-picker select{width:100%;background:white;border:1px solid #d8cdc0;border-radius:12px;padding:13px 18px;font-weight:600;color:var(--ink);min-width:0}.directory-results-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:12px}.directory-results-heading h2{font-size:25px;margin:0}.directory-results-heading>span{font-size:12px;color:var(--sub)}.public-list{list-style:none;padding:0;margin:0;background:white;border:1px solid #e8ded4;border-radius:20px;overflow:hidden}.public-list>li{display:flex;align-items:center;gap:18px;padding:20px 25px;border-bottom:1px solid #eee6df}.public-list>li:last-child{border-bottom:0}.public-number{font-size:12px;color:#ad9c87;min-width:22px}.public-info{flex:1;min-width:0}.public-info strong{font-size:16px;overflow-wrap:anywhere}.public-handle{display:block;color:#8b8175;font-size:12px}.public-info p{font-size:12px;color:var(--sub);margin:5px 0 0}.public-go{display:flex;align-items:center;gap:20px;flex:none;border-radius:25px;padding:10px 16px;background:#f6e9df;color:#a44229;font-size:13px;font-weight:650;text-decoration:none}.public-go:hover{background:#ead4c2}.directory-owner{margin-top:28px;padding:23px 0;border-top:1px solid var(--line)}.directory-owner h3{font-size:18px}.directory-owner p{font-size:13px;color:var(--sub);max-width:650px}.public-list>.directory-empty{padding:35px}.directory-empty h3{font-size:21px}.directory-empty p,.directory-empty a{font-size:14px}.public-admin-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.public-admin-actions form{display:flex;gap:5px}.public-admin-actions .mini{border:1px solid var(--line);border-radius:8px;padding:9px 12px;background:white}.public-admin-actions button:disabled{opacity:.35;cursor:default}
@media(max-width:650px){.directory-heading{grid-template-columns:1fr;gap:0}.directory-heading>img{display:none}.directory-heading h1{font-size:32px}.directory-disclaimer{padding:16px;gap:11px}.directory-disclaimer p{font-size:12px}.directory-results-heading h2{font-size:23px}.public-list>li{padding:17px 13px;gap:9px}.public-number{min-width:18px;font-size:10px}.public-info strong{font-size:13px}.public-handle{font-size:11px}.public-go{padding:10px 12px;gap:7px;font-size:11px}.city-picker>div{width:100%}.public-list>.directory-empty{padding:24px}.public-admin-actions{width:100%}}
.sort-status{min-height:24px;margin:12px 0;color:#5d7865;font-size:13px}.sortable-publics .item-row{position:relative;align-items:center;gap:15px}.sort-handle{flex:none;width:38px;height:48px;display:grid;place-items:center;border:1px solid #ded4c9;border-radius:10px;background:#f7f2eb;color:#8c7e6a;font-size:25px;letter-spacing:-5px;padding-right:9px;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}.sort-handle:hover{background:#ece2d5;color:#5d5547}.sort-dragging{background:#f6e8d8!important;box-shadow:inset 0 0 0 2px #c99e7d;border-radius:12px;z-index:1}.sorting-publics,.sorting-publics *{cursor:grabbing!important;user-select:none!important}.sort-status.error{color:#b74529}.sortable-publics[aria-busy=true] .sort-handle{cursor:wait;opacity:.55}@media(max-width:650px){.sortable-publics .item-row{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px}.sort-handle{width:34px;align-self:start}.sortable-publics .public-admin-actions{grid-column:2}.sortable-publics .public-admin-actions .btn{font-size:12px;padding:9px 13px}.sortable-publics .item-body{overflow-wrap:anywhere}}
