.mock-app{--mock-lime:#b6f36b;--mock-purple:#c5adff;--mock-ink:#0c0d10;--mock-muted:#6c6f7b;color:var(--mock-ink);background:#fff;font-size:12px;height:566px;position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:0 0 25px 25px}.mock-app button{background:none;padding:0;color:inherit}.mock-app p{line-height:1.65}.mock-header{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;flex-shrink:0;border-bottom:1px solid #ececf0}.mock-header>button{width:44px;height:44px;font-size:23px;display:grid;place-items:center}.mock-header>strong{font-size:17px;font-weight:750}.mock-avatar{width:32px;height:32px;border-radius:50%;background:#e9e9ee;object-fit:contain;flex-shrink:0}.mock-page{position:relative;display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.mock-scroll{overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0;scrollbar-width:none;touch-action:pan-y}.mock-scroll::-webkit-scrollbar{display:none}.mock-padded{padding:15px}.mock-tabs{height:52px;display:flex;padding:3px 4px 0;border-top:1px solid #e3e4e8;flex-shrink:0;background:#fff}.mock-tabs button{position:relative;width:20%;height:46px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:9px;color:var(--mock-muted)}.mock-tabs button[aria-pressed=true]{color:var(--mock-ink);font-weight:600}.mock-tabs svg{width:23px;height:23px;fill:currentColor;stroke:none}.mock-tabs i{position:absolute;width:5px;height:5px;top:4px;right:13px;border-radius:50%;background:#e84d63}.mock-header+ .mock-page .mock-segments{display:flex;flex-shrink:0;border-bottom:1px solid #ececf0}.mock-segments button{width:33.33%;height:40px;position:relative;font-size:12px;color:var(--mock-muted)}.mock-segments button[aria-pressed=true]{color:var(--mock-ink);font-weight:650}.mock-segments button[aria-pressed=true]:after{content:"";height:3px;width:23px;background:var(--mock-lime);border-radius:3px;position:absolute;bottom:0;left:50%;transform:translateX(-50%)}.mock-post{display:flex;align-items:flex-start;gap:9px;padding:14px 12px;border-bottom:1px solid #e8e9ed;text-align:left}.post-body{min-width:0;flex:1}.mock-author{display:flex;justify-content:space-between;align-items:flex-start}.mock-author strong{display:block;font-size:12px;line-height:1.5}.mock-author small{display:block;font-size:9px;color:var(--mock-muted);margin:2px 0 6px}.mock-author button{width:28px;min-height:30px;font-size:20px;margin-top:-7px}.mock-app .post-text{display:block;line-height:1.7;text-align:left;font-size:12px;min-height:44px}.mock-app .post-topic{font-size:10px;color:var(--mock-muted);min-height:32px}.mock-app .pet-mention{display:flex;gap:5px;align-items:center;font-size:10px;height:30px;margin-bottom:8px}.pet-mention img{width:22px;height:22px;object-fit:contain;border-radius:50%;background:#e4d8ff}.mock-app .mock-photo{width:100%;height:172px;background:#e5d8fb;border-radius:14px;display:block;overflow:hidden}.mock-photo.cat{background:#e9eddf}.mock-photo img{width:100%;height:100%;object-fit:contain;padding:8px}.post-actions{display:flex;align-items:center;justify-content:space-between;height:42px}.post-actions button{height:40px;min-width:34px;font-size:14px;display:flex;gap:5px;align-items:center;color:var(--mock-muted)}.post-actions span{font-size:9px}.post-actions svg{width:16px;height:16px}.post-actions [aria-pressed=true]{color:#a34e77}.post-actions [aria-pressed=true] svg{fill:currentColor}.mock-app .mock-compose{position:absolute;right:15px;bottom:13px;width:45px;height:45px;background:var(--mock-lime);border-radius:50%;font-size:31px;box-shadow:0 3px 10px #0000000a}.mock-padded h3{font-size:19px;line-height:1.4;letter-spacing:-.04em}.mock-muted{font-size:10px;color:var(--mock-muted);margin:6px 0 12px}.mock-search{display:flex;background:#f3f3f6;border-radius:13px;margin-bottom:20px;padding-left:12px;align-items:center}.mock-search input{width:100%;border:0;background:none;outline:none;font:inherit;font-size:11px;min-height:39px;min-width:0}.mock-search button{width:35px;height:39px;font-size:22px}.topic-chips{display:flex;gap:6px;flex-wrap:wrap;margin:15px 0}.mock-app .topic-chips button{padding:8px 10px;background:var(--mock-lime);border-radius:20px;font-size:10px;min-height:35px}.island-row{padding:15px 0;border-bottom:1px solid #eee;display:flex;align-items:center;gap:10px}.island-row>div{flex:1}.island-row strong{font-size:13px}.island-row p{font-size:9px;color:var(--mock-muted);margin-top:5px}.mock-app .island-row button{padding:7px 10px;border:1px solid #ddd;border-radius:20px;font-size:10px;white-space:nowrap;min-height:36px}.mock-app .island-row button[aria-pressed=true]{background:var(--mock-lime);border-color:var(--mock-lime)}.island-prompt{padding:16px;border-radius:16px;background:#f4efff;font-size:9px;margin-top:18px}.island-prompt h4{font-size:13px;margin:8px 0}.mock-app .island-prompt button{height:35px;font-size:10px}.ask-welcome{padding:20px 0 18px}.ask-welcome>svg{width:38px;height:38px;fill:var(--mock-purple);stroke:none;margin-bottom:16px}.ask-welcome h3{font-size:17px}.ask-welcome p{font-size:11px;color:var(--mock-muted);margin-top:8px}.mock-app .question-prompt{display:flex;justify-content:space-between;gap:5px;text-align:left;align-items:center;width:100%;min-height:45px;border-radius:14px;background:#f4f4f7;padding:10px 12px;margin-bottom:8px;font-size:10px}.mock-composer{display:flex;align-items:center;gap:7px;padding:8px 12px;border-top:1px solid #eee;flex-shrink:0}.mock-composer input{font:inherit;font-size:11px;border:0;background:#f4f4f7;border-radius:17px;padding:10px 12px;min-width:0;width:100%;outline:none}.mock-app .mock-composer button{width:33px;height:33px;flex-shrink:0;border-radius:50%;background:var(--mock-lime);font-size:20px}.mock-disclaimer{font-size:8px;color:var(--mock-muted);margin:12px 0}.question-bubble{padding:12px;background:#eadfff;border-radius:16px 16px 3px 16px;line-height:1.7;font-size:11px;margin:10px 0 12px 25px}.answer-bubble{padding:13px;background:#f4f4f7;border-radius:16px;line-height:1.8;font-size:11px;margin:10px 0}.notice-categories{display:flex;gap:9px;margin:3px 0 20px}.mock-app .notice-categories button{position:relative;display:flex;flex-direction:column;gap:12px;text-align:left;background:#f5f5f7;border-radius:16px;width:50%;padding:14px}.notice-categories strong{font-size:11px}.notice-categories svg{width:19px;height:19px;color:#8e6ec4}.notice-categories b{position:absolute;top:10px;right:12px;background:#e74d61;color:white;border-radius:10px;padding:2px 5px;font-size:8px}.mock-app .conversation-row{display:flex;align-items:center;gap:9px;width:100%;text-align:left;padding:14px 0;border-bottom:1px solid #eee}.conversation-row>span{flex:1}.conversation-row strong{font-size:11px;display:block}.conversation-row small{font-size:8px;color:var(--mock-muted);display:block;margin-top:5px}.inbox-note{text-align:center;margin-top:30px}.mock-app .mock-care-banner{display:flex;align-items:center;gap:9px;background:var(--mock-lime);border-radius:18px;padding:14px 12px;width:100%;text-align:left}.mock-care-banner svg{width:25px;height:25px}.mock-care-banner strong{display:block;font-size:12px}.mock-care-banner small{display:block;font-size:8px;margin-top:5px}.mock-care-banner>span:last-child{margin-left:auto}.pets-title{display:flex;align-items:center;justify-content:space-between;margin-top:20px}.pets-title h3{font-size:20px}.pets-title p{font-size:9px;margin-bottom:10px}.mock-app .pets-title>button{width:35px;height:35px;border-radius:50%;background:var(--mock-lime);font-size:24px}.mock-pet-card .app-heading{display:none}.mock-pet-card .app-panel{display:block}.mock-pet-card .pet-switch{margin-bottom:10px}.mock-app .pet-switch button{font-size:10px}.mock-pet-card .resident-card{height:280px!important}.mock-pet-card .card-front>img{height:153px!important}.mock-pet-card .resident-name{font-size:21px}.mock-pet-card .swatches button{width:44px;height:44px}.mock-pet-card .tap-hint{font-size:8px}.pet-profile-links{margin-top:20px}.mock-app .pet-profile-links button{display:flex;justify-content:space-between;width:100%;height:44px;border-top:1px solid #eee;font-size:12px}.mock-care-summary{text-align:center;padding:14px 0 24px}.mock-care-summary>p{font-size:10px;color:var(--mock-muted)}.mock-care-summary>strong{display:block;font-size:49px;margin:15px}.mock-care-summary small{font-size:16px;color:var(--mock-muted)}.mock-care-summary h3{font-size:15px}.mock-app .mock-task{display:flex;align-items:center;gap:10px;width:100%;min-height:56px;border-top:1px solid #eee;text-align:left;font-size:11px}.mock-task>span{width:25px;height:25px;border:1px solid #ddd;border-radius:50%;display:grid;place-items:center}.mock-task[aria-pressed=true]>span{background:var(--mock-lime);border-color:var(--mock-lime)}.health-line{display:flex;align-items:center;gap:10px;border-bottom:1px solid #eee;padding:14px 0;font-size:11px}.health-line strong{margin-left:auto;font-size:11px}.health-line small{font-size:8px;color:var(--mock-muted)}.mock-overlay{position:absolute;inset:0;z-index:5;display:flex;align-items:flex-end}.mock-scrim{position:absolute;inset:0;background:#0005}.mock-sheet{position:relative;background:#fff;border-radius:22px 22px 0 0;max-height:94%;width:100%;display:flex;flex-direction:column;animation:sheet-in .25s ease-out}.sheet-handle{width:34px;height:4px;background:#d6d6db;border-radius:4px;margin:8px auto 0}.mock-sheet>header{padding:7px 16px;display:flex;align-items:center;justify-content:space-between;min-height:45px;border-bottom:1px solid #eee;font-size:13px}.mock-sheet>header>button{width:36px;height:36px;font-size:24px}.sheet-content{padding:15px;overflow:auto;overscroll-behavior:contain;min-height:90px;font-size:12px}.sheet-content textarea{width:100%;height:110px;resize:vertical;border:0;border-radius:12px;background:#f7f7f9;padding:12px;font:inherit;outline:none}.mock-app .mock-primary{background:var(--mock-lime);border-radius:22px;padding:12px 20px;font-size:12px;min-height:44px;margin-top:10px}.mock-app .sheet-row{width:100%;min-height:46px;border-bottom:1px solid #eee;text-align:left;padding:6px 2px;font-size:13px}.sheet-photo{width:100%;height:310px;object-fit:contain}.profile-cover{padding:12px 5px 20px}.profile-cover h3{font-size:24px;margin:12px 0 5px}.profile-cover p,.profile-cover span{font-size:11px;color:var(--mock-muted)}.sheet-content label{font-size:11px;display:block;margin-bottom:13px}.sheet-content label input,.sheet-content select{display:block;width:100%;padding:12px;border:1px solid #eee;border-radius:10px;font:inherit;margin-top:7px;background:white}.notice-item,.history-item{padding:12px 0;border-bottom:1px solid #eee;line-height:1.9;font-size:12px}.notice-item small{color:var(--mock-muted)}.reply-list{border-top:1px solid #eee;padding-top:10px;font-size:10px;line-height:1.8}.reply-list p{margin-bottom:12px}.mock-empty{text-align:center;padding:40px 20px}.mock-empty h3{font-size:18px}.mock-empty p{font-size:11px;color:var(--mock-muted);margin-top:15px}.mock-app input:focus-visible,.mock-app textarea:focus-visible{outline:2px solid #c5adff;outline-offset:1px}.cinematic-stage .phone{background:#fff}.cinematic-stage .device-stage.reveal{transform:scale(.86)}.cinematic-stage .phone .home-indicator{margin-top:6px}.cinematic-stage .phone .phone-status{background:white}@keyframes sheet-in{from{transform:translateY(25px);opacity:.5}to{transform:translateY(0);opacity:1}}
@media(max-width:1000px){.cinematic-stage .device-stage.reveal{transform:none}.mock-app{height:470px}.mock-header{height:40px}.mock-header>strong{font-size:15px}.mock-header>button{height:40px}.mock-tabs{height:48px}.mock-tabs button{height:43px;font-size:8px}.mock-tabs svg{width:21px;height:21px}.mock-app .mock-photo{height:145px}.mock-post{padding:12px 10px}.mock-padded{padding:12px}.cinematic-stage .experience .phone{width:310px}.mock-pet-card .resident-card{height:270px!important}.mock-pet-card .card-front>img{height:145px!important}}
@media(prefers-reduced-motion:reduce){.mock-sheet{animation:none}}
.post-actions svg:has(use[href^="#app-"]){fill:currentColor;stroke:none}.mock-header,.mock-page,.mock-tabs{transition:transform .22s ease-out}.drawer-open>.mock-header,.drawer-open>.mock-page,.drawer-open>.mock-tabs{transform:translateX(74%)}.mock-overlay:has(.drawer-sheet){align-items:stretch}.drawer-sheet{width:74%;max-height:100%;height:100%;border-radius:0;animation:drawer-in .22s ease-out}.drawer-sheet .sheet-handle{display:none}.mock-overlay:has(.drawer-sheet) .mock-scrim{left:74%;background:#ffffff88}.drawer-sheet .sheet-content{padding:15px}.drawer-sheet .profile-cover{padding-bottom:20px}.drawer-sheet .profile-cover .mock-avatar{width:42px;height:42px}@keyframes drawer-in{from{transform:translateX(-100%)}to{transform:translateX(0)}}