*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'DM Sans',sans-serif;color:#4a3f35;background:#fff8f0;line-height:1.6}
.site-nav{background:#fff;border-bottom:2px solid #f5e6d3;padding:12px 0;position:sticky;top:0;z-index:100}
.site-nav-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.nav-brand{font-family:'Playfair Display',serif;font-size:1.05rem;font-weight:700;color:#3d2e24;text-decoration:none;white-space:nowrap}
.nav-brand:hover{color:#e25563}
.nav-links{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;margin:0;padding:0}
.nav-links a{color:#8a7b6b;text-decoration:none;font-size:.88rem;font-weight:600;transition:color .2s}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:#e25563}
.faq{padding:36px 20px 20px}
.faq h2{font-size:1.5rem;margin-bottom:14px;color:#3d2e24}
.faq h3{font-size:1.1rem;margin:18px 0 8px;color:#3d2e24}
.faq p{color:#8a7b6b;margin-bottom:12px;font-size:.98rem}
.faq a{color:#e87da0;text-decoration:underline}
.faq a:hover{color:#d45d79}
h1,h2,h3{font-family:'Playfair Display',serif;line-height:1.25}
.container{max-width:900px;margin:0 auto;padding:0 20px}
header{text-align:center;padding:40px 20px 24px}
header h1{font-size:2rem;color:#3d2e24;margin-bottom:8px}
header h1::before{content:'🐾 ';font-size:1.5rem}
header h1::after{content:' 🐾';font-size:1.5rem}
header p{font-size:1rem;color:#8a7b6b}
.back-link{display:inline-block;margin:20px 0;padding:10px 24px;border:2px solid #ffb6c1;border-radius:24px;background:#fff;color:#ff91a4;font-family:'DM Sans',sans-serif;font-size:.95rem;font-weight:600;text-decoration:none;transition:all .2s}
.back-link:hover{background:#ffb6c1;color:#fff}
.gen-btn{padding:14px 48px;border:none;border-radius:28px;background:linear-gradient(135deg,#ffb6c1 0%,#ff91a4 100%);color:#fff;font-family:'DM Sans',sans-serif;font-size:1.05rem;font-weight:700;cursor:pointer;transition:all .2s;box-shadow:0 4px 14px rgba(255,145,164,.3);text-decoration:none;display:inline-block}
.gen-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(255,145,164,.4)}
.home-btn{background:linear-gradient(135deg,#a89a8a 0%,#8a7b6b 100%);box-shadow:0 4px 14px rgba(138,123,107,.3)}
.home-btn:hover{background:linear-gradient(135deg,#8a7b6b 0%,#6b5d4f 100%);box-shadow:0 6px 20px rgba(138,123,107,.4)}
.btn-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:24px auto}
.name-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin:20px 0}
.name-card{background:#fff;border-radius:16px;padding:18px 14px;text-align:center;border:2px solid #f5e6d3;transition:all .2s;position:relative}
.name-card:hover{box-shadow:0 6px 20px rgba(0,0,0,.07);transform:translateY(-3px)}
.name-card .heart{position:absolute;top:8px;right:10px;cursor:pointer;color:#d4c5b5;transition:color .2s;width:22px;height:22px}
.name-card .heart.liked{color:#e25563}
.name-card .heart svg{width:22px;height:22px}
.name-card .name{font-family:'Playfair Display',serif;font-size:1.2rem;font-weight:700;color:#5a8c3f;margin-bottom:4px}
.name-card .meaning{font-size:.78rem;color:#a89a8a;margin-top:4px}
.dl-wrap{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:20px;margin-bottom:32px}
.dl-btns{display:flex;align-items:center;flex-wrap:wrap;gap:8px;justify-content:center}
.download-btn{display:inline-block;padding:12px 36px;border:2px solid #ffb6c1;border-radius:28px;background:#fff;color:#ff91a4;font-family:'DM Sans',sans-serif;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s}
.download-btn:hover{background:#ffb6c1;color:#fff}
.dl-count{font-size:.8rem;color:#a89a8a;white-space:nowrap}
.clear-btn{display:inline-block;padding:12px 24px;border:1.5px solid #f0e0d0;border-radius:28px;background:transparent;color:#a89a8a;font-family:'DM Sans',sans-serif;font-size:.85rem;cursor:pointer;transition:all .2s}
.clear-btn:hover{border-color:#e25563;color:#e25563}
.intro{padding:36px 20px 20px}
.intro h2{font-size:1.5rem;margin-bottom:14px;color:#3d2e24}
.intro h3{font-size:1.15rem;margin:20px 0 8px;color:#3d2e24}
.intro p{color:#8a7b6b;margin-bottom:12px;font-size:.98rem}
.intro ul{margin:0 0 16px 20px;color:#8a7b6b;font-size:.98rem}
.intro ul li{margin-bottom:6px}
.intro a{color:#e87da0;text-decoration:underline}
.intro a:hover{color:#d45d79}
.intro a.no-underline{text-decoration:none}
.intro a.no-underline:hover{color:#d45d79;text-decoration:underline}
.share-section{text-align:center;padding:28px 24px;background:#fff;border-radius:20px;box-shadow:0 4px 20px rgba(0,0,0,.05);margin-bottom:32px;border:2px solid #f5e6d3}
.share-section h3{font-size:1.1rem;color:#3d2e24;margin-bottom:16px;font-family:'DM Sans',sans-serif;font-weight:600}
.share-buttons{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.share-btn{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;border-radius:24px;text-decoration:none;font-size:.88rem;font-weight:600;font-family:'DM Sans',sans-serif;transition:all .2s;color:#fff}
.share-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.15)}
.share-facebook{background:#1877f2}
.share-twitter{background:#000}
.share-pinterest{background:#e60023}
.share-reddit{background:#ff4500}
.share-whatsapp{background:#25d366}
.share-copy{background:#8a7b6b}
.share-copy.copied{background:#66bb6a}
footer{text-align:center;padding:20px;color:#c4b5a5;font-size:.85rem;border-top:1px solid #f5e6d3;margin-top:24px}
.footer-links{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:12px}
.footer-links a{color:#a89a8a;text-decoration:none;font-size:.82rem;transition:color .2s}
.footer-links a:hover{color:#e25563}
@media(max-width:600px){
header h1{font-size:1.6rem}
.name-grid{grid-template-columns:repeat(2,1fr)}
}
