/* Original design decoration only; all pet data and labels remain native text. */
.onboarding .step-progress{position:relative;gap:12px}
.onboarding .step-progress i{width:14px;height:14px;border:1.5px solid #181c13;border-radius:50%;background:#faf9ef;position:relative;z-index:1}
.onboarding .step-progress i.done{background:#697534}
.onboarding .step-progress i:first-child:after{content:'';position:absolute;left:12px;top:5px;width:15px;height:1.5px;background:#181c13}
.onboarding:not(.pet-two-screen) .onboarding-title{position:relative;isolation:isolate;width:fit-content}
.onboarding:not(.pet-two-screen) .onboarding-title:after{content:'';position:absolute;left:0;right:-8px;bottom:1px;height:8px;z-index:-1;background:#e7f3aa;transform:rotate(-2deg)}
.onboarding .photo-picker{height:auto;aspect-ratio:812/710;border:0;border-radius:0;background:#e7f3aa;clip-path:polygon(7% 5%,96% 0,100% 5%,100% 93%,93% 100%,4% 98%,0 93%,0 13%);isolation:isolate}
.onboarding .photo-picker:after{content:'';position:absolute;inset:0;background:url('assets/design/onboarding-photo-frame.png') center/100% 100% no-repeat;pointer-events:none;z-index:3}
.onboarding .photo-picker img{inset:0;width:100%;height:100%;object-fit:cover}
.onboarding .photo-picker .photo-change{bottom:7%;right:5%;z-index:4;border:2px solid #181c13;border-radius:9px;box-shadow:0 0 0 2px #faf9ef;padding:6px 9px}
.onboarding:not(.pet-two-screen)>.field{margin:13px 0}
.onboarding:not(.pet-two-screen)>.field>label{display:flex;align-items:center;gap:9px;margin-bottom:7px}
.onboarding:not(.pet-two-screen)>.field>label:after{content:'';height:1px;flex:1;background:#252a1b}
.onboarding:not(.pet-two-screen)>.field input{border:2px solid #252a1b;border-radius:8px;min-height:43px;box-shadow:inset 0 0 0 1px #faf9ef}
.onboarding:not(.pet-two-screen) .chips{gap:5px}
.onboarding:not(.pet-two-screen) .chip{min-height:42px;border:2px solid #252a1b;border-radius:7px;padding:7px 8px;position:relative}
.onboarding .chip.on{background:#697534;color:#fffef3;box-shadow:inset 0 0 0 2px #f1f3d0}
.onboarding .chip.on:before{content:'✓';display:inline-block;margin-right:5px;color:#fffef3}
.onboarding .primary{background:#697534;border:0;border-radius:0;box-shadow:none;position:relative;isolation:isolate;min-height:58px;padding:12px 28px;clip-path:polygon(6% 0,94% 0,100% 50%,94% 100%,6% 100%,0 50%)}
.onboarding .primary:after{content:'';position:absolute;inset:0;background:url('assets/design/onboarding-button-frame.png') center/100% 100% no-repeat;z-index:-1;pointer-events:none}
.pet-two-screen .intro{align-items:center;gap:13px;margin-bottom:25px;padding-right:2px;position:relative}
.pet-two-screen .intro .avatar{width:83px;height:83px;flex-shrink:0;border:2px solid #181c13;padding:3px;box-shadow:0 0 0 2px #faf9ef}
.pet-two-screen .intro>div{min-width:0;flex:1}
.pet-two-screen .intro h2{margin-bottom:5px}
.pet-two-screen .intro .bubble{position:relative;isolation:isolate;background:#edf3b6;border:0;border-radius:0;padding:13px 11px 13px 20px;min-height:76px;clip-path:polygon(11% 9%,88% 0,100% 20%,100% 83%,90% 100%,11% 97%,6% 82%,6% 58%,0 49%,6% 40%,6% 23%)}
.pet-two-screen .intro .bubble:after{content:'';position:absolute;inset:0;background:url('assets/design/onboarding-bubble-frame.png') center/100% 100% no-repeat;pointer-events:none;z-index:-1}
.pet-two-screen .intro:after{content:'';position:absolute;right:0;bottom:-29px;width:44px;height:44px;background:url('assets/design/rong.png') center/contain no-repeat;pointer-events:none}
.pet-two-screen .optional-section{border:0;border-radius:0;box-shadow:none;padding:16px 12px 13px;position:relative;isolation:isolate;background:#faf9ef url('assets/design/paper.png') repeat;margin-top:12px}
.pet-two-screen .optional-section:after{content:'';position:absolute;inset:0;z-index:-1;background:url('assets/design/onboarding-section-frame.png') center/100% 100% no-repeat;pointer-events:none}
.pet-two-screen .optional-section h2{position:relative;isolation:isolate;width:fit-content;margin-bottom:9px}
.pet-two-screen .optional-section h2:before{content:'';position:absolute;left:0;right:30px;bottom:0;height:5px;background:#dfe79c;z-index:-1;transform:rotate(-2deg)}
.pet-two-screen .optional-section:first-child .field input,.pet-two-screen .optional-section:first-child .field select{background:transparent;border-color:#adb3a2;min-height:51px;height:51px}
.pet-two-screen .optional-section:first-child>.field:first-of-type input,.pet-two-screen .optional-section:first-child>.field:first-of-type select{border-radius:7px 7px 0 0}
.pet-two-screen .habit-field{margin:9px 0 10px;padding-bottom:9px;border-bottom:1px dashed #adb3a2}
.pet-two-screen .habit-field:last-child{border-bottom:0;padding-bottom:0;margin-bottom:0}
.pet-two-screen .habit-field .chips{gap:5px}
.pet-two-screen .habit-field .chip{min-height:36px;border:1px solid #252a1b;border-radius:7px;padding:6px 3px}
.pet-two-screen .habit-field .light-link{min-height:25px}
.pet-two-screen .pet-actions{padding-top:9px}
.pet-two-screen .pet-actions .primary{min-height:59px}
.pet-two-screen .pet-actions>.light-link{margin-top:6px!important;margin-bottom:3px!important}
.pet-two-screen{padding-bottom:125px}
@media(max-width:360px){.pet-two-screen .intro .avatar{width:69px;height:69px}.pet-two-screen .intro{gap:8px}.pet-two-screen .intro .bubble{padding:12px 9px 12px 17px}.onboarding .chip.on:before{margin-right:3px}.pet-two-screen .optional-section{padding-left:10px;padding-right:10px}}
.onboarding:not(.pet-two-screen) .step-progress:before{content:'';display:block;width:69px;height:19px;background:url('assets/design/onboarding-progress.png') center/contain no-repeat}
.onboarding:not(.pet-two-screen) .step-progress i{display:none}
.pet-two-screen .intro:after{clip-path:polygon(20% 4%,68% 1%,78% 13%,86% 14%,99% 34%,83% 43%,87% 73%,74% 88%,73% 99%,25% 99%,25% 88%,8% 78%,5% 71%,16% 60%,6% 39%,10% 24%)}
/* Second visual pass: original brushwork and isolated character outlines. */
.onboarding:not(.pet-two-screen) .onboarding-title{margin-bottom:5px}
.onboarding:not(.pet-two-screen) .onboarding-title:after{inset:0 -6px -2px -4px;height:auto;background:url('assets/design/onboarding-title-brush.png') center/100% 100% no-repeat;transform:none}
.onboarding:not(.pet-two-screen) .onboarding-title:before{content:'';position:absolute;right:-39px;top:22%;width:30px;height:35px;background:url('assets/design/onboarding-title-rays.png') center/contain no-repeat;pointer-events:none}
.onboarding:not(.pet-two-screen)>.muted{margin-bottom:8px!important}
.onboarding:not(.pet-two-screen) .page-head{height:52px}
.onboarding:not(.pet-two-screen)>.field{margin:10px 0}
.onboarding:not(.pet-two-screen)>.field>label{margin-bottom:5px}
.onboarding:not(.pet-two-screen) .primary{margin-top:11px;min-height:52px}
.onboarding:not(.pet-two-screen) .photo-picker{aspect-ratio:812/670}
.onboarding .photo-picker:after{background-image:url('assets/design/onboarding-photo-frame.png')}
.onboarding .photo-bubble{position:absolute;right:3%;top:10%;z-index:4;max-width:65%;background:#eef6b6 url('assets/design/onboarding-bubble-frame.png') center/100% 100% no-repeat;clip-path:polygon(11% 9%,88% 0,100% 20%,100% 83%,90% 100%,11% 97%,6% 82%,6% 58%,0 49%,6% 40%,6% 23%);padding:11px 13px 12px 20px;pointer-events:none}
.pet-two-screen .page-head{position:relative;height:58px;align-items:flex-start;padding-top:6px}
.pet-two-screen .step-progress{position:absolute;left:50%;top:4px;transform:translateX(-50%);flex-direction:column-reverse;gap:3px}
.pet-two-screen .step-progress i{display:none}
.pet-two-screen .step-progress:before{content:'';display:block;width:118px;height:14px;background:url('assets/design/onboarding-progress-two.png') center/contain no-repeat}
.pet-two-screen .intro{margin-bottom:37px;margin-top:12px}
.pet-two-screen .intro:after{width:68px;height:68px;right:1px;bottom:-43px;background-image:url('assets/design/onboarding-rong-cutout.png');clip-path:none}
.pet-two-screen .intro+.muted{margin-top:13px!important;margin-bottom:10px!important;padding-right:72px}
.pet-two-screen .habit-more{border-top:1px dashed #adb3a2;margin-top:8px;padding-top:7px}
.pet-two-screen .habit-more summary{cursor:pointer;list-style:none;min-height:36px;display:flex;align-items:center;justify-content:center;gap:8px;color:#6e755b}
.pet-two-screen .habit-more summary:after{content:'⌄';display:inline-block;transform:translateY(-2px)}
.pet-two-screen .habit-more[open] summary:after{transform:rotate(180deg)}
.pet-two-screen .habit-more summary::-webkit-details-marker{display:none}
.pet-two-screen .habit-more .habit-field{margin-top:7px;margin-bottom:7px}
.pet-two-screen .pet-basics-grid{display:grid;grid-template-columns:1fr 1fr;gap:0}
.pet-two-screen .pet-basics-grid .field{margin:0}
.pet-two-screen .pet-basics-grid .height-guide{width:95%;height:51px;object-fit:contain;object-position:center;align-self:end;mix-blend-mode:multiply}
.pet-two-screen .optional-section:first-child .pet-basics-grid .field>label{left:9px;top:5px}
@media(max-width:360px){.onboarding:not(.pet-two-screen) .onboarding-title:before{right:-29px;width:23px}.onboarding:not(.pet-two-screen)>.field{margin:8px 0}.onboarding:not(.pet-two-screen) .photo-picker{aspect-ratio:812/630}.pet-two-screen .intro:after{width:60px;height:60px;bottom:-38px}.pet-two-screen .intro+.muted{padding-right:65px}}
