:root{--cream:#f7f2ea;--paper:#fffdf9;--ink:#292825;--muted:#7d7972;--line:#e7dfd4;--coral:#ff6847;--coral-soft:#fff0eb;--mint:#bfe3d0;--mint-deep:#337a62;--butter:#f6d77b;--shadow:0 14px 45px #4b3c2a1a}*{box-sizing:border-box}html{background:var(--cream)}body{background:radial-gradient(circle at 8% 8%, #ff684714, transparent 26rem), radial-gradient(circle at 92% 18%, #5dbb971c, transparent 28rem), var(--cream);color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;font-family:PingFang SC,Microsoft YaHei,Noto Sans CJK SC,system-ui,sans-serif}button,input,textarea,select{font:inherit}button{color:inherit}::selection{background:var(--butter);color:var(--ink)}.app{width:min(100%,1120px);min-height:100svh;margin:0 auto;padding:28px 28px 110px}.topbar{justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-mark{background:var(--coral);color:#fff;border-radius:15px 15px 15px 6px;place-items:center;width:42px;height:42px;font-size:21px;display:grid;transform:rotate(-3deg);box-shadow:0 8px 20px #ff684742}.brand h1{letter-spacing:.04em;margin:0;font-size:20px}.brand p{color:var(--muted);margin:2px 0 0;font-size:12px}.top-actions{align-items:center;gap:10px;display:flex}.sync-pill,.round-button{border:1px solid var(--line);background:#fffdf9d1;box-shadow:0 6px 18px #4b3c2a0f}.sync-pill{cursor:pointer;border-radius:99px;align-items:center;gap:8px;height:40px;padding:0 14px;font-size:13px;display:flex}.sync-dot{background:#4eb88d;border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 4px #4eb88d1f}.sync-dot.busy{background:var(--butter);animation:1s infinite pulse}.round-button{cursor:pointer;border-radius:50%;place-items:center;width:40px;height:40px;font-weight:800;display:grid}.welcome{margin-bottom:22px}.eyebrow{color:var(--coral);letter-spacing:.12em;font-size:13px;font-weight:800}.welcome h2{letter-spacing:-.04em;margin:8px 0 6px;font-size:clamp(28px,5vw,44px);line-height:1.15}.welcome p{color:var(--muted);margin:0}.account-banner{background:#bfe3d05c;border:1px dashed #337a6261;border-radius:18px;justify-content:space-between;align-items:center;gap:16px;margin:18px 0 24px;padding:16px 18px;display:flex}.account-banner strong{margin-bottom:3px;font-size:14px;display:block}.account-banner span{color:#5f7169;font-size:12px}.text-button{color:var(--mint-deep);cursor:pointer;background:0 0;border:0;flex:none;font-weight:800}.dashboard{grid-template-columns:minmax(0,1.45fr) minmax(290px,.72fr);align-items:start;gap:22px;display:grid}.main-column,.side-column{gap:20px;display:grid}.pet-hero{color:#fff;min-height:250px;box-shadow:var(--shadow);background:#303a34;border-radius:30px;padding:30px;position:relative;overflow:hidden}.pet-hero:before,.pet-hero:after{content:"";border-radius:50%;position:absolute}.pet-hero:before{background:var(--mint);opacity:.9;width:220px;height:220px;top:-40px;right:-40px}.pet-hero:after{background:var(--butter);width:110px;height:110px;bottom:-65px;right:150px}.pet-copy{z-index:2;max-width:63%;position:relative}.pet-kicker{background:#ffffff21;border-radius:99px;padding:6px 10px;font-size:12px;display:inline-flex}.pet-copy h3{letter-spacing:-.05em;margin:20px 0 6px;font-size:38px}.pet-copy p{color:#ffffffb0;margin:0;font-size:14px}.pet-meta{gap:18px;margin-top:30px;display:flex}.pet-meta strong{font-size:18px;display:block}.pet-meta span{color:#ffffff8c;font-size:11px}.pet-avatar{z-index:1;filter:drop-shadow(0 14px 16px #1b211d2e);place-items:center;width:190px;height:190px;font-size:108px;display:grid;position:absolute;bottom:5px;right:27px}.section-card{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#fffdf9e0;border:1px solid #e7dfd4c2;border-radius:24px;padding:22px;box-shadow:0 10px 32px #4b3c2a0f}.section-head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;display:flex}.section-head h3{margin:0;font-size:17px}.section-head span,.section-head button{color:var(--muted);font-size:12px}.section-head button{cursor:pointer;background:0 0;border:0}.quick-grid{grid-template-columns:repeat(3,1fr);gap:11px;display:grid}.quick-item{cursor:pointer;background:#f8f5ef;border:1px solid #0000;border-radius:18px;min-height:96px;padding:13px 8px;transition:transform .18s,border-color .18s,box-shadow .18s}.quick-item:hover{border-color:var(--line);transform:translateY(-2px);box-shadow:0 8px 20px #4b3c2a14}.quick-icon{border-radius:14px;place-items:center;width:40px;height:40px;margin:0 auto 8px;font-size:20px;display:grid}.quick-item strong{font-size:13px;display:block}.quick-item span{color:var(--muted);margin-top:3px;font-size:10px;display:block}.timeline{display:grid}.timeline-item{grid-template-columns:48px 38px 1fr;align-items:center;gap:10px;padding:12px 0;display:grid;position:relative}.timeline-item:not(:last-child):after{content:"";background:var(--line);width:1px;position:absolute;top:48px;bottom:-12px;left:66px}.timeline-time{color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}.timeline-icon{z-index:1;border-radius:12px;place-items:center;width:34px;height:34px;font-size:16px;display:grid}.timeline-copy strong{font-size:13px;display:block}.timeline-copy span{color:var(--muted);font-size:11px}.today-ring{background:conic-gradient(var(--coral) 0 78%, #eee8de 78% 100%);border-radius:50%;place-items:center;width:132px;height:132px;margin:6px auto 18px;display:grid;position:relative}.today-ring:before{content:"";background:var(--paper);border-radius:50%;position:absolute;inset:10px}.ring-copy{z-index:1;text-align:center;position:relative}.ring-copy strong{font-size:30px;display:block}.ring-copy span{color:var(--muted);font-size:10px}.care-list{gap:8px;display:grid}.care-row{background:#f8f5ef;border-radius:14px;justify-content:space-between;align-items:center;padding:11px 12px;font-size:12px;display:flex}.care-row b{color:var(--mint-deep)}.quote-card{background:var(--butter);color:#423819;min-height:160px;position:relative;overflow:hidden}.quote-card:after{content:"♥";color:#ffffff61;font-size:130px;position:absolute;bottom:-34px;right:-8px;transform:rotate(-10deg)}.quote-card p{z-index:1;max-width:240px;margin:10px 0 0;font-size:22px;font-weight:800;line-height:1.5;position:relative}.records-page,.pets-page,.profile-page{gap:20px;display:grid}.page-title{margin:0 0 2px;font-size:clamp(28px,5vw,40px)}.page-subtitle{color:var(--muted);margin:0 0 10px}.filter-row{scrollbar-width:none;gap:8px;padding-bottom:2px;display:flex;overflow-x:auto}.filter-chip{border:1px solid var(--line);background:var(--paper);color:var(--muted);cursor:pointer;border-radius:99px;flex:none;padding:8px 13px;font-size:12px}.filter-chip.active{border-color:var(--ink);background:var(--ink);color:#fff}.record-list{gap:10px;display:grid}.record-card{border:1px solid var(--line);background:var(--paper);border-radius:18px;grid-template-columns:46px 1fr auto;align-items:center;gap:13px;padding:15px;display:grid}.record-icon{border-radius:15px;place-items:center;width:46px;height:46px;font-size:21px;display:grid}.record-card strong,.record-card span{display:block}.record-card strong{font-size:14px}.record-card span{color:var(--muted);margin-top:3px;font-size:11px}.record-date{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums;font-size:11px}.pet-list-card{border:1px solid var(--line);background:var(--paper);border-radius:22px;grid-template-columns:72px 1fr auto;align-items:center;gap:16px;padding:18px;display:grid}.pet-list-avatar{background:var(--mint);border-radius:24px;place-items:center;width:72px;height:72px;font-size:42px;display:grid}.pet-list-card h3{margin:0 0 5px}.pet-list-card p{color:var(--muted);margin:0;font-size:12px}.arrow{color:var(--muted);font-size:20px}.add-pet{min-height:112px;color:var(--muted);cursor:pointer;background:#fffdf973;border:1px dashed #bdb4a8;border-radius:22px}.profile-hero{align-items:center;gap:16px;display:flex}.profile-avatar{background:var(--coral-soft);width:58px;height:58px;color:var(--coral);border-radius:20px;place-items:center;font-size:24px;font-weight:900;display:grid}.profile-hero h3{margin:0 0 4px}.profile-hero p{color:var(--muted);margin:0;font-size:12px}.sync-card{color:#fff;background:#303a34}.sync-card .section-head span{color:#ffffff94}.sync-status{justify-content:space-between;align-items:flex-end;gap:20px;display:flex}.sync-status strong{margin-bottom:6px;font-size:24px;display:block}.sync-status p{color:#fff9;margin:0;font-size:12px}.primary-button,.secondary-button,.danger-button{cursor:pointer;border-radius:14px;min-height:44px;padding:0 18px;font-size:13px;font-weight:800}.primary-button{background:var(--coral);color:#fff;border:0;box-shadow:0 8px 18px #ff68473d}.primary-button:disabled{opacity:.5;cursor:wait}.secondary-button{border:1px solid var(--line);background:var(--paper)}.sync-card .secondary-button{color:var(--ink);background:#fff;border-color:#ffffff2e}.danger-button{color:#b6422b;background:#fff5f2;border:1px solid #f0c4bb}.menu-list{display:grid}.menu-item{border:0;border-bottom:1px solid var(--line);cursor:pointer;text-align:left;background:0 0;justify-content:space-between;align-items:center;min-height:54px;display:flex}.menu-item:last-child{border-bottom:0}.hidden-file{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.menu-label{align-items:center;gap:11px;display:flex}.menu-label i{background:#f5f0e8;border-radius:11px;place-items:center;width:32px;height:32px;font-style:normal;display:grid}.bottom-nav{z-index:20;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#fffdf9eb;border:1px solid #e7dfd4e6;border-radius:23px;grid-template-columns:repeat(4,1fr);gap:4px;width:min(100% - 32px,560px);height:68px;padding:7px;display:grid;position:fixed;bottom:18px;left:50%;transform:translate(-50%);box-shadow:0 16px 44px #3c2f202b}.nav-item{color:#8a857e;cursor:pointer;background:0 0;border:0;border-radius:17px;font-size:11px;font-weight:700}.nav-item b{margin-bottom:2px;font-size:18px;line-height:1;display:block}.nav-item.active{background:var(--ink);color:#fff}.scrim{z-index:40;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#221f1c70;place-items:end center;padding:20px;display:grid;position:fixed;inset:0}.sheet{background:var(--paper);border-radius:28px 28px 20px 20px;width:min(100%,520px);max-height:min(88svh,720px);padding:10px 22px 24px;animation:.22s ease-out sheet-in;overflow-y:auto;box-shadow:0 24px 80px #241f1a47}.sheet-handle{background:#d9d2c8;border-radius:9px;width:42px;height:5px;margin:2px auto 18px}.sheet h3{margin:0 0 7px;font-size:23px}.sheet-copy{color:var(--muted);margin:0 0 20px;font-size:12px;line-height:1.7}.form-grid{gap:14px;display:grid}.field{gap:7px;display:grid}.field label{font-size:12px;font-weight:800}.field input,.field textarea,.field select{border:1px solid var(--line);width:100%;color:var(--ink);background:#fbf8f3;border-radius:14px;outline:none;padding:12px 13px}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--coral);box-shadow:0 0 0 3px #ff68471a}.field textarea{resize:vertical;min-height:88px}.field-hint{color:var(--muted);font-size:10px;line-height:1.5}.sheet-actions{grid-template-columns:1fr 1.4fr;gap:10px;margin-top:20px;display:grid}.sync-choice{gap:10px;display:grid}.sync-option{border:1px solid var(--line);background:#fbf8f3;border-radius:16px;padding:15px}.sync-option strong,.sync-option span{display:block}.sync-option span{color:var(--muted);margin-top:4px;font-size:11px}.sync-option button{width:100%;margin-top:12px}.toast{z-index:60;color:#fff;background:#292825;border-radius:99px;max-width:calc(100% - 40px);padding:11px 16px;font-size:12px;animation:.18s ease-out toast-in;position:fixed;bottom:102px;left:50%;transform:translate(-50%);box-shadow:0 10px 34px #1e1b1833}.empty-state{text-align:center;color:var(--muted);padding:40px 20px}.empty-state b{color:var(--ink);margin-bottom:8px;display:block}@keyframes sheet-in{0%{opacity:0;transform:translateY(20px)}}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,8px)}}@keyframes pulse{50%{opacity:.45}}@media (max-width:820px){.app{padding:20px 18px 108px}.dashboard{grid-template-columns:1fr}.side-column{grid-template-columns:1fr 1fr}}@media (max-width:560px){.app{padding-inline:14px}.topbar{margin-bottom:24px}.brand p,.sync-label{display:none}.sync-pill{justify-content:center;width:40px;padding:0}.welcome h2{font-size:31px}.account-banner{align-items:flex-start}.pet-hero{border-radius:25px;min-height:236px;padding:23px}.pet-copy{max-width:70%}.pet-copy h3{font-size:32px}.pet-avatar{width:150px;height:150px;font-size:88px;bottom:-2px;right:2px}.pet-meta{gap:13px}.side-column{grid-template-columns:1fr}.quote-card{display:none}.section-card{border-radius:21px;padding:18px}.quick-grid{gap:8px}.quick-item{min-height:92px}.timeline-item{grid-template-columns:42px 34px 1fr;gap:8px}.timeline-item:not(:last-child):after{left:58px}.sync-status{flex-direction:column;align-items:flex-start}.sync-status button{width:100%}.scrim{padding:8px}.sheet{border-radius:28px 28px 14px 14px;padding-inline:18px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}