/* Pet-first homepage: a warm little world, using the extension's real sprites. */
:root { --paper:#fffaf2; --ink:#302e29; --muted:#77766c; --line:#e6e1d6; }
body { background:var(--paper); color:var(--ink); }
.header { background:#fffaf2ed; border-color:#eae5db; backdrop-filter:blur(16px); }
.brand { color:#363b2f; }
.nav-links a { color:#626454; }
.button.primary { background:#3f573e; color:#fffdf6; border-color:#3f573e; box-shadow:none; border-radius:50px; }
.button.primary:hover { background:#30452f; transform:translateY(-2px); }
.button.outline { border-radius:50px; }
.hero { min-height:710px; gap:65px; padding-block:65px 85px; }
.hero .eyebrow { background:transparent; border:0; padding:0; color:#788362; letter-spacing:2px; font-size:10px; }
.hero h1 { font-size:clamp(56px,5.7vw,82px); line-height:1.05; letter-spacing:-4px; font-weight:650; color:#333b2d; }
.hero h1 em { font-family:Georgia,serif; font-weight:400; color:#7b8c52; }
.hero-sub { color:#757568; font-size:17px; max-width:355px; line-height:1.85; margin-block:25px 30px; }
.hero-note { color:#858578; font-size:11px; margin-top:19px; }
.demo-link { color:#475b3d; }
.hero-actions { gap:24px; }
.pet-world { height:490px; isolation:isolate; background:#e9edcf; border:1px solid #d9dfbd; border-radius:180px 180px 30px 30px; box-shadow:12px 14px 0 #eeeddf; position:relative; overflow:hidden; width:100%; }
.world-window { position:absolute; left:0; right:0; bottom:0; height:54px; background:#f5f3e8; display:flex; align-items:center; gap:6px; padding:0 22px; z-index:5; border-top:1px solid #d9dfbd; }
.world-window > span { width:7px; height:7px; background:#c0c8a0; border-radius:50%; }
.world-window small { margin-left:auto; font-size:9px; color:#92977b; }
.world-sun { position:absolute; top:60px; right:60px; color:#e8b751; font-size:77px; line-height:1; }
.world-cloud { position:absolute; width:100px; height:30px; border-radius:70%; background:#fafbefa6; left:24px; top:150px; transform:rotate(-12deg); }
.world-floor { position:absolute; background:#d3dca9; width:140%; height:180px; border-radius:50% 50% 0 0; left:-20%; bottom:-20px; z-index:-1; }
.hero-pet-button { position:absolute; left:50%; top:46%; transform:translate(-50%,-50%); background:none; border:0; padding:0; cursor:pointer; z-index:3; transition:scale .2s; }
.hero-pet-button:hover { scale:1.06; }
.hero-pet-button .pet-sprite { --pet-width:290px; filter:drop-shadow(0 12px 0 #596b3c12); }
.pet-world .scene-hello { top:46px; left:43%; font-size:13px; color:#52613f; border:1px solid #d6dcbf; box-shadow:3px 4px 0 #bec89655; border-radius:20px 20px 20px 3px; padding:14px 19px; z-index:4; transform:translateX(-50%) rotate(-7deg); }
.world-doodle { position:absolute; z-index:4; font-family:Georgia,serif; }
.doodle-heart { left:40px; top:220px; font-size:55px; color:#bd7f67; transform:rotate(-18deg); }
.doodle-star { right:32px; top:260px; font-size:48px; color:#7b9054; }
.world-label { position:absolute; bottom:105px; left:50%; transform:translateX(-50%) rotate(-4deg); white-space:nowrap; display:flex; gap:10px; align-items:center; background:#fffdf2; padding:12px 18px; border-radius:7px; font-size:11px; color:#65704e; box-shadow:0 3px 10px #52613f10; z-index:4; }
.world-hint { position:absolute; bottom:69px; text-align:center; width:100%; font-size:10px; color:#6d7851; }
.world-flower { position:absolute; bottom:117px; left:35px; font-size:46px; color:#fff9dc; transform:rotate(12deg); }
.section { padding-block:80px; }
h2 { color:#383e30; letter-spacing:-1.7px; }
.pet-section { border-top:1px solid #e4e2d4; gap:100px; grid-template-columns:1.1fr 1fr; }
.pet-playground { background:#f1e5d5; border:0; border-radius:32px; padding:36px 20px 28px; }
.pet-bubble { color:#8b705a; border-color:#e6d3bf; box-shadow:3px 4px 0 #e4d0ba; }
.stage-shadow { background:#e1cdb4; }
.pet-copy .eyebrow { font-size:10px; color:#8c9471; letter-spacing:2px; }
.pet-copy h2 { font-size:clamp(38px,4vw,56px); line-height:1.13; }
.pet-copy .section-sub { font-size:16px; max-width:330px; color:#7b796b; }
.pet-picker { gap:7px; }
.pet-picker button { background:#fcf5eb; border:1px solid #e1d0bd; font-size:12px; padding:10px 15px; color:#8a7460; }
.pet-picker button[aria-pressed="true"] { background:#526547; border-color:#526547; box-shadow:none; }
#pet-hello { color:#4c6242; background:transparent; border-color:#b9c0a7; padding:13px 24px; }
.features .section-heading { display:block; text-align:center; margin-bottom:40px; }
.features .eyebrow { color:#8a9473; font-size:10px; letter-spacing:2px; margin-bottom:16px; }
.features h2 { font-size:clamp(32px,3.8vw,48px); }
.feature-grid { gap:25px; }
.feature-card,.feature-card:nth-child(2),.feature-card:nth-child(3) { background:none; border:0; box-shadow:none; border-radius:0; padding:0; display:block; }
.feature-card:hover { transform:translateY(-4px); box-shadow:none; }
.moment-art { position:relative; height:255px; border-radius:80px 80px 22px 22px; display:grid; place-items:center; margin-bottom:25px; overflow:hidden; background:#f2e5ba; }
.moment-2 { background:#eddfdf; border-radius:22px; }
.moment-3 { background:#e0e5ed; border-radius:22px 80px 22px 22px; }
.moment-art .pet-sprite { --pet-width:170px; margin-top:10px; }
.moment-sticker { position:absolute; top:20px; right:24px; font-size:43px; color:#ac8348; transform:rotate(12deg); }
.moment-2 .moment-sticker { color:#b78188; }
.moment-3 .moment-sticker { color:#7b87aa; }
.moment-caption { position:absolute; bottom:18px; left:20px; font-size:9px; letter-spacing:1.5px; color:#605d4c; }
.feature-card h3 { font-size:19px; margin-bottom:10px; letter-spacing:-.4px; }
.feature-card p { font-size:14px; line-height:1.8; color:#807d70; max-width:300px; }
.demo-section { border-top:1px solid #e4e2d4; }
.demo-heading h2 { font-size:31px; }
.assistant-intro { color:#817e72; font-size:14px; margin:15px 0 24px; max-width:540px; }
.assistant-disclosure > summary { cursor:pointer; color:#526547; font-size:14px; width:fit-content; padding:12px 0; }
.assistant-disclosure[open] > summary { margin-bottom:24px; }
.demo-tabs { background:#eeece1; border-color:#dedfce; }
.demo-tabs button[aria-selected="true"] { background:#526547; box-shadow:none; }
.browser-window { border-color:#dedfce; box-shadow:0 10px 30px #41483009; }
.browser-toolbar { background:#eceee0; }
.assistant-panel,.assistant-header { background:#f4f4eb; }
.assistant-header strong { color:#526547; }
.user-prompt { background:#e7ecd9; color:#526547; border-color:#d5ddc4; }
.pricing-section { background:#f2f0e5; border:0; }
.pricing-section .section-heading { align-items:start; }
.pricing-section h2 { font-size:36px; }
.price-card,.price-card.featured { box-shadow:none; border-color:#dedfce; background:#fffdf6; }
.price-card.featured { border-color:#83936a; }
.price-ribbon { background:#657a51; }
.price-card h3,.price strong { color:#46543b; }
.billing-switch { background:#e2e4d5; }
.billing-switch button[aria-pressed="true"] { color:#526547; }
.faq-section { padding-bottom:45px; }
.faq-list details,.faq-list details:first-child { border-color:#e3e1d5; }
.faq-plus { background:#e8ecd9; color:#697c4d; }
.discovery { padding-bottom:60px; }
.discovery h2 { font-size:22px; }
.discovery-links a { background:transparent; color:#70765e; border:0; border-radius:0; padding:0; font-size:12px; }
.download-section { background:#e5eacd; border:0; border-radius:30px; box-shadow:none; margin-bottom:40px; }
.download-section:before { background:#d5dfb4; }
.download-section h2 { color:#455337; font-size:clamp(36px,4vw,55px); }
.download-note { color:#76805f; }
.footer { border-color:#e1e2d4; }
.footer p,.footer a { color:#7e826d; }
@media(min-width:761px) { .hero-copy { padding-bottom:10px; } .pet-section .pet-copy { grid-column:1; grid-row:1; } .pet-section .pet-playground { grid-column:2; } }
@media(max-width:1050px) { .hero { gap:30px; min-height:650px; } .hero h1 { font-size:62px; } .pet-world { height:450px; } .hero-pet-button .pet-sprite { --pet-width:250px; } .pet-section { gap:50px; } }
@media(max-width:760px) {
 .hero { padding-block:45px 55px; gap:35px; } .hero h1 { font-size:60px; letter-spacing:-3px; } .hero-sub { font-size:16px; max-width:340px; margin-inline:auto; } .hero .eyebrow { font-size:9px; }
 .pet-world { height:420px; max-width:410px; margin:0 auto; border-radius:140px 140px 25px 25px; } .hero-pet-button .pet-sprite { --pet-width:245px; } .pet-world .scene-hello { top:42px; font-size:12px; } .world-sun { right:33px; font-size:60px; }
 .section { padding-block:55px; } .pet-section { gap:35px; } .pet-copy { text-align:center; } .pet-copy .section-sub { margin-inline:auto; } .pet-playground { order:2; } .pet-copy h2 { font-size:42px; }
 .moment-art { height:250px; } .moment-art .pet-sprite { --pet-width:175px; } .feature-grid { gap:35px; } .feature-card p { max-width:none; }
 .demo-heading { display:block; } .sample-label { margin-top:12px; } .demo-heading h2 { font-size:27px; } .pricing-section h2 { font-size:32px; } .discovery-links { gap:20px; } .discovery-links a { flex-basis:100%; } .download-section h2 { font-size:36px; }
}
@media(prefers-reduced-motion:reduce) { .hero-pet-button,.feature-card,.button { transition:none; } }
@media(max-width:760px) {
 .hero { padding-top:30px; gap:24px; }
 .hero h1 { font-size:48px; letter-spacing:-2.6px; }
 .hero-sub { font-size:14px; line-height:1.65; margin-block:17px 22px; }
 .hero-actions { gap:18px; }
 .hero .edge-install { display:none; }
 .hero-note { margin-top:14px; }
 .pet-world { height:365px; }
 .hero-pet-button .pet-sprite { --pet-width:225px; }
 .world-label { bottom:97px; }
 .world-hint { bottom:65px; }
}
.pet-world .scene-hello { max-width:85%; white-space:normal; text-align:center; width:max-content; }
@media(max-width:760px) {
 .pet-section { grid-template-columns:minmax(0,1fr); }
 .pet-playground { min-width:0; width:100%; }
 .pet-copy { min-width:0; }
}
html[lang="zh-CN"] .hero h1 em { color:#7b8c52; }