.site-body{max-width:430px;margin:0 auto;background:var(--page,#fff);min-height:100dvh;box-shadow:0 0 0 1px var(--border);padding-bottom:82px}.site-body .container{max-width:430px;padding-left:16px;padding-right:16px}.site-body .header{height:66px;gap:8px;background:#fff}.site-body .brand{font-size:21px;gap:10px;letter-spacing:0}.site-body .brand-icon{width:39px;height:39px;font-size:26px}.site-body .brand-caption{font-size:12px;color:#7c8793;white-space:nowrap}.directory-top{position:static;background:transparent;backdrop-filter:none;padding:3px 0 0}.directory-top .search-box{min-height:51px;padding:5px 6px 5px 15px;border:1px solid #e5e9e8;background:#f7f9f8;border-radius:28px;gap:9px}.search-box input{font-size:14px;padding:6px 0}.search-box>span{font-size:27px;color:#84918e}.search-box button{border:0;color:#fff;background:var(--orange);padding:10px 20px;border-radius:24px;min-height:39px;font-size:14px;flex-shrink:0}.search-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #0fa36b10}.location-card{display:flex;align-items:center;gap:10px;padding:12px 13px;margin-top:11px;background:#eefaf4;border-radius:14px}.location-symbol{font-size:32px;color:var(--primary);line-height:1}.location-card>div{flex:1;min-width:0}.location-card strong{font-size:14px;display:block;font-weight:650}.location-card>div>span{display:block;font-size:11px;color:#7a8b85;margin-top:3px}.location-card button{background:white;color:var(--primary);border:1px solid #e2f4e9;box-shadow:0 3px 9px #1289520c;border-radius:20px;padding:8px 12px;white-space:nowrap;font-size:12px}.location-status{font-size:12px;line-height:1.6;background:#f1f8f4;padding:10px;border-radius:8px;margin-top:8px;color:#527466}.welcome-banner{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:86px;margin-top:12px;padding:16px 90px 16px 60px;border:1px solid #fff0e3;border-radius:14px;background:#fff7ed;text-align:left;gap:5px;overflow:hidden}.welcome-banner strong{font-size:14px;line-height:1.55;position:relative;z-index:1}.welcome-banner>span:not(.recommend-icon){font-size:10px;color:#8c939b;line-height:1.7;position:relative;z-index:1}.recommend-icon{position:absolute;left:11px;top:24px;background:var(--orange);color:white;width:39px;height:39px;border-radius:10px;display:grid;place-items:center;font-size:27px}.national-group{position:absolute;inset:0;background:transparent;z-index:3;border-radius:inherit}.national-group:hover{background:#ff6a2a05}.national-group:focus-visible{outline-offset:-3px}.recommend-pets{position:absolute;right:-1px;bottom:-7px;width:100px;height:88px;object-fit:contain}.recommend-arrow{position:absolute;right:5px;top:13px;font-style:normal;color:#b27639;background:#ffe6bd;width:20px;height:20px;border-radius:50%;font-size:19px;line-height:18px;text-align:center}.area-tabs{display:flex;gap:6px;margin-top:13px;border:0;overflow-x:auto;padding:0 0 2px;scrollbar-width:none}.area-tabs button{flex:1;min-width:59px;background:#f4f6f7;color:#536273;border-radius:24px;font-size:14px;padding:11px 10px;line-height:1.4}.area-tabs button.active{background:var(--primary);color:#fff;box-shadow:0 3px 7px #188f6120}.area-tabs button.active:after{display:none}.search-hint{border-radius:12px;background:#edf9f3;color:#628074;font-size:10px;line-height:1.8;margin-top:9px;padding:9px 11px}.province-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:17px 5px;padding:20px 0 24px}.province-entry{font-size:12px;gap:6px;color:#344152}.province-badge{border-radius:14px;width:43px;height:43px;font-size:24px;background:#ea8647;box-shadow:inset 0 1px 0 #ffffff33}.province-entry:nth-child(5n+2) .province-badge{background:var(--region,#e7798a)}.province-entry:nth-child(5n+3) .province-badge{background:#6098e3}.province-entry:nth-child(5n+4) .province-badge{background:var(--primary)}.province-entry:nth-child(5n) .province-badge{background:#9d7cdd}.province-entry.active{color:var(--primary)}.province-entry.active .province-badge{box-shadow:0 0 0 3px #d8f1e4}.directory-tip{font-size:11px;background:#f5f7f6;border:1px solid var(--border);border-radius:9px;color:#88948d;padding:8px 11px;margin-top:0}.mobile-nav{position:fixed;bottom:0;left:50%;right:auto;transform:translateX(-50%);width:min(430px,100%);display:flex;align-items:center;justify-content:space-around;padding:11px 8px calc(10px + env(safe-area-inset-bottom));gap:0;z-index:5;background:#fffffff7;border-top:1px solid var(--border);backdrop-filter:blur(10px)}.mobile-nav button,.mobile-nav a{display:flex;flex-direction:column;gap:5px;align-items:center;background:transparent;color:#8a949c;flex:1;font-size:12px;line-height:1.5;white-space:nowrap;padding:0}.mobile-nav .active{color:var(--primary)}.mobile-nav svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.footer{display:block;padding-bottom:24px;margin-top:20px}.footer>p{font-size:12px}.photo-credits{font-size:10px;margin-top:10px}.photo-credits summary{text-align:left}.share-panel{margin:12px 16px 20px;padding:18px;border:1px solid var(--border);border-radius:12px}.advertising{margin-top:22px;scroll-margin-top:15px}.ad-grid{grid-template-columns:1fr;gap:12px}.ad-card{padding:21px;border-radius:12px;border-color:var(--border)}.ad-transport{background:#f2f8f5}.ad-supplies{background:#fff8f1}.ad-card h3{font-size:18px}.ad-card p{font-size:13px}.ad-link{font-size:13px;color:var(--primary)}.ad-heading h2{font-size:18px}.ad-note{font-size:11px}.groups-heading{margin-top:24px}.groups-heading h1{font-size:19px}.groups-heading>span{font-size:11px}.group-row{grid-template-columns:49px minmax(0,1fr) 56px;gap:11px;padding:19px 0}.group-thumb{width:49px;height:49px;border-radius:10px}.group-copy h2{font-size:16px;line-height:1.5}.group-copy p{font-size:12px;line-height:1.7}.join-group{font-size:12px;min-height:32px;padding:5px 8px;border-width:1px;border-color:var(--primary);color:var(--primary)}.detail-page{padding-top:5px;padding-bottom:24px}.page-heading{padding:15px 0 22px}.page-heading h1,.detail-hero h1{font-size:23px}.page-heading p,.detail-hero p{font-size:13px}.breadcrumbs{font-size:12px;margin:10px 0 20px}.detail-hero{background:#f0faf5;border-color:#deeee4;border-radius:14px;padding:23px 19px}.intro-grid{grid-template-columns:1fr;gap:12px}.intro-section{background:#fff;padding:21px 18px;border-color:var(--border)}.intro-section h2{font-size:17px}.intro-section p,.intro-section li{font-size:13px}.detail-pet-tabs a{font-size:13px;padding:10px 5px}.join-panel{display:block;padding:20px}.join-panel button{width:100%;margin-top:15px}.join-note{font-size:12px}.list-caption{font-size:14px}.list-caption span{font-size:11px}.site-body dialog{width:min(400px,calc(100% - 28px));border-radius:14px;padding:28px 23px;box-shadow:0 15px 60px #17212b20}.site-body dialog h2{font-size:22px}.site-body .setup-note,.site-body .message-preview p{font-size:13px}.site-body .pet-tabs button{font-size:13px}.site-body .route-fields input{font-size:13px}
@media(min-width:431px){html:has(.site-body){background:#f3f8f5}.site-body{min-height:100vh}}
@media(max-width:375px){.site-body .container{padding-left:13px;padding-right:13px}.brand-caption{font-size:11px!important}.location-card{padding:11px 10px;gap:7px}.location-card button{padding:8px;font-size:11px}.welcome-banner{padding-right:78px}.welcome-banner strong{font-size:13px}.search-box button{padding:10px 17px}}
.recommend-icon{font-style:normal}.recommend-icon svg{width:25px;height:25px}.location-symbol svg{width:24px;height:28px;display:block}