:root {
  --bg: #f5f3eb;
  --bg-2: #efeee6;
  --panel: rgba(255,255,255,.78);
  --panel-solid: #fffef9;
  --panel-soft: #eef3ed;
  --sidebar: #14201e;
  --sidebar-2: #1b2a27;
  --text: #17211f;
  --muted: #6f7975;
  --line: rgba(28,43,39,.11);
  --line-strong: rgba(28,43,39,.2);
  --accent: #75a88f;
  --accent-deep: #477361;
  --accent-soft: #dfece5;
  --cream: #f7f1df;
  --danger: #b95f5f;
  --warning: #b8873c;
  --success: #4d8a6f;
  --shadow: 0 24px 70px rgba(25,37,33,.12);
  --shadow-soft: 0 10px 30px rgba(25,37,33,.08);
  --radius-xl: 28px;
  --radius-lg: 22px;
  --radius-md: 15px;
  --radius-sm: 10px;
  --sidebar-width: 278px;
  --font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-theme="dark"] {
  --bg: #0f1715;
  --bg-2: #111b18;
  --panel: rgba(24,36,32,.82);
  --panel-solid: #18241f;
  --panel-soft: #202f2a;
  --sidebar: #0a100f;
  --sidebar-2: #111c19;
  --text: #edf4ef;
  --muted: #95a39d;
  --line: rgba(218,236,227,.1);
  --line-strong: rgba(218,236,227,.2);
  --accent-soft: #263f35;
  --cream: #2d2b21;
  --shadow: 0 24px 70px rgba(0,0,0,.34);
  --shadow-soft: 0 10px 30px rgba(0,0,0,.22);
}

@media (prefers-color-scheme: dark) {
  html[data-theme="system"] {
    --bg: #0f1715;
    --bg-2: #111b18;
    --panel: rgba(24,36,32,.82);
    --panel-solid: #18241f;
    --panel-soft: #202f2a;
    --sidebar: #0a100f;
    --sidebar-2: #111c19;
    --text: #edf4ef;
    --muted: #95a39d;
    --line: rgba(218,236,227,.1);
    --line-strong: rgba(218,236,227,.2);
    --accent-soft: #263f35;
    --cream: #2d2b21;
    --shadow: 0 24px 70px rgba(0,0,0,.34);
    --shadow-soft: 0 10px 30px rgba(0,0,0,.22);
  }
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
html { background: var(--bg); color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
body {
  margin: 0;
  background:
    radial-gradient(circle at 84% -10%, color-mix(in srgb, var(--accent) 18%, transparent) 0, transparent 32%),
    var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; }
button { color: inherit; }
a { color: inherit; }
.hidden { display: none !important; }
.mobile-only { display: none !important; }

.boot-screen {
  position: fixed; inset: 0; z-index: 9999; display: grid; place-content: center; gap: 18px;
  background: #101917; color: #fff; text-align: center; transition: opacity .35s ease, visibility .35s ease;
}
.boot-screen.done { opacity: 0; visibility: hidden; }
.boot-mark { width: 82px; height: 82px; display: grid; place-items: center; border-radius: 26px; margin: auto; font-size: 36px; background: linear-gradient(145deg,#89b9a2,#416f5c); box-shadow: 0 18px 60px rgba(83,145,118,.3); }
.boot-name { font-size: 25px; font-weight: 800; letter-spacing: -.03em; }
.boot-bar { width: 180px; height: 4px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.11); }
.boot-bar i { display:block; width: 45%; height: 100%; background: #8dbda6; border-radius: inherit; animation: boot 1.1s infinite ease-in-out; }
@keyframes boot { 0%{transform:translateX(-120%)} 100%{transform:translateX(340%)} }

.brand { display:flex; align-items:center; gap:12px; text-decoration:none; min-width:0; }
.brand-mark, .mini-mark { display:grid; place-items:center; background:linear-gradient(145deg,var(--accent),var(--accent-deep)); box-shadow:0 8px 24px color-mix(in srgb,var(--accent) 28%,transparent); }
.brand-mark { width:42px; height:42px; border-radius:14px; font-size:20px; flex:0 0 auto; }
.brand span:last-child { display:grid; min-width:0; }
.brand b { font-size:18px; letter-spacing:-.03em; color:#f7fbf8; }
.brand small { color:#84928d; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.brand-large .brand-mark { width:58px; height:58px; border-radius:20px; font-size:26px; }
.brand-large b { font-size:24px; }
.brand-large small { font-size:13px; color:rgba(255,255,255,.62); }

.login-view { min-height:100vh; position:relative; overflow:hidden; background:#101917; color:#fff; }
.login-view::before { content:""; position:absolute; inset:0; background:linear-gradient(120deg,rgba(255,255,255,.02),transparent 45%), radial-gradient(circle at 20% 20%,rgba(116,168,143,.17),transparent 34%); }
.login-ambient { position:absolute; border-radius:999px; filter:blur(14px); opacity:.38; }
.login-ambient-a { width:500px; height:500px; background:#477361; top:-220px; right:-120px; }
.login-ambient-b { width:340px; height:340px; background:#8b7445; bottom:-180px; left:-80px; }
.login-layout { width:min(1240px,calc(100% - 48px)); min-height:100vh; margin:auto; display:grid; grid-template-columns:1.15fr .85fr; align-items:center; gap:90px; position:relative; z-index:1; padding:56px 0; }
.login-story { align-self:stretch; display:flex; flex-direction:column; justify-content:space-between; padding:22px 0; }
.login-copy { max-width:680px; }
.eyebrow { display:inline-block; font-size:11px; font-weight:800; letter-spacing:.16em; color:var(--accent); text-transform:uppercase; }
.login-copy h1 { margin:18px 0 22px; font-size:clamp(46px,6vw,82px); line-height:.98; letter-spacing:-.065em; font-weight:750; }
.login-copy h1 em { color:#90bea8; font-style:normal; }
.login-copy p { max-width:620px; color:rgba(255,255,255,.64); font-size:19px; line-height:1.65; }
.trust-row { display:flex; flex-wrap:wrap; gap:12px; }
.trust-row span { padding:9px 13px; border:1px solid rgba(255,255,255,.09); background:rgba(255,255,255,.04); border-radius:999px; color:rgba(255,255,255,.68); font-size:12px; }
.glass-panel { backdrop-filter:blur(28px); -webkit-backdrop-filter:blur(28px); background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.055)); border:1px solid rgba(255,255,255,.12); box-shadow:0 40px 100px rgba(0,0,0,.35); }
.login-panel { border-radius:32px; padding:38px; }
.login-panel-head { text-align:center; margin-bottom:28px; }
.mini-mark { width:52px; height:52px; border-radius:18px; margin:0 auto 16px; font-size:24px; }
.login-panel h2 { margin:0; font-size:30px; letter-spacing:-.04em; }
.login-panel-head p { margin:8px 0 0; color:rgba(255,255,255,.57); }
.stack-form { display:grid; gap:16px; }
.stack-form label, .field { display:grid; gap:7px; }
.stack-form label>span, .field>span, .form-label { font-size:12px; font-weight:700; color:inherit; }
input, select, textarea {
  width:100%; border:1px solid var(--line-strong); background:var(--panel-solid); color:var(--text); border-radius:13px;
  padding:12px 13px; outline:none; transition:border .18s, box-shadow .18s, transform .18s;
}
.login-panel input { background:rgba(0,0,0,.18); color:#fff; border-color:rgba(255,255,255,.13); padding:14px 15px; }
.login-panel input::placeholder { color:rgba(255,255,255,.3); }
input:focus, select:focus, textarea:focus { border-color:var(--accent); box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 17%,transparent); }
textarea { min-height:104px; resize:vertical; }
.password-wrap { position:relative; }
.password-wrap input { padding-right:48px; }
.password-wrap .icon-button { position:absolute; right:7px; top:50%; transform:translateY(-50%); color:rgba(255,255,255,.62); }
.button { border:0; border-radius:13px; padding:11px 16px; font-weight:800; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:9px; transition:transform .18s, box-shadow .18s, opacity .18s; text-decoration:none; }
.button:hover { transform:translateY(-1px); }
.button:active { transform:translateY(0); }
.button:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.button-primary { color:#fff; background:linear-gradient(135deg,var(--accent),var(--accent-deep)); box-shadow:0 10px 25px color-mix(in srgb,var(--accent) 28%,transparent); }
.button-secondary { background:var(--panel-soft); color:var(--text); border:1px solid var(--line); }
.button-danger { background:color-mix(in srgb,var(--danger) 13%,var(--panel-solid)); color:var(--danger); border:1px solid color-mix(in srgb,var(--danger) 30%,transparent); }
.button-ghost { background:transparent; color:var(--muted); border:1px solid var(--line); }
.button-wide { width:100%; padding:14px 18px; justify-content:space-between; margin-top:4px; }
.icon-button { border:0; background:transparent; width:40px; height:40px; border-radius:12px; display:grid; place-items:center; cursor:pointer; transition:background .18s, transform .18s; }
.icon-button:hover { background:var(--panel-soft); }
.text-button { border:0; background:transparent; color:#9ec9b5; cursor:pointer; padding:12px; width:100%; font-weight:700; }
.form-error { margin:0; padding:11px 13px; border-radius:11px; background:rgba(191,82,82,.16); color:#ffb9b9; font-size:13px; }
.login-security { margin-top:24px; padding-top:22px; border-top:1px solid rgba(255,255,255,.08); display:flex; gap:12px; align-items:flex-start; color:rgba(255,255,255,.46); font-size:11px; }
.login-security p { margin:0; }

.app-shell { min-height:100vh; }
.sidebar { position:fixed; inset:0 auto 0 0; width:var(--sidebar-width); background:linear-gradient(180deg,var(--sidebar),#0f1917 88%); color:#fff; z-index:30; display:flex; flex-direction:column; border-right:1px solid rgba(255,255,255,.04); }
.sidebar-head { padding:24px 22px 17px; display:flex; align-items:center; justify-content:space-between; }
.pet-switcher { margin:9px 15px 12px; }
.pet-switcher-button { width:100%; display:grid; grid-template-columns:42px 1fr auto; gap:11px; align-items:center; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.055); color:#fff; border-radius:16px; padding:10px; cursor:pointer; text-align:left; }
.pet-switcher-button:hover { background:rgba(255,255,255,.08); }
.pet-avatar { width:42px; height:42px; border-radius:13px; object-fit:cover; display:grid; place-items:center; background:linear-gradient(145deg,#d9c39a,#9b7654); font-size:20px; overflow:hidden; }
.pet-avatar img { width:100%; height:100%; object-fit:cover; }
.pet-switcher-button b { display:block; font-size:14px; }
.pet-switcher-button small { color:#84928d; font-size:11px; }
.pet-switcher-button>span:last-child { color:#71807a; }
.main-nav { padding:0 13px 20px; overflow:auto; flex:1; }
.main-nav p { margin:19px 11px 7px; color:#64716d; font-size:9px; font-weight:900; letter-spacing:.17em; }
.main-nav button { width:100%; border:0; background:transparent; color:#93a09b; padding:10px 12px; border-radius:12px; display:flex; gap:12px; align-items:center; cursor:pointer; font-size:13px; font-weight:650; margin:2px 0; text-align:left; }
.main-nav button span { width:20px; text-align:center; color:#81908a; font-size:17px; }
.main-nav button:hover { color:#e9f2ed; background:rgba(255,255,255,.045); }
.main-nav button.active { color:#fff; background:linear-gradient(90deg,rgba(117,168,143,.2),rgba(117,168,143,.08)); box-shadow:inset 3px 0 0 var(--accent); }
.main-nav button.active span { color:#9ac6b1; }
.sidebar-foot { border-top:1px solid rgba(255,255,255,.06); padding:15px; }
.security-chip { display:flex; gap:10px; align-items:center; padding:9px 10px; background:rgba(117,168,143,.08); border:1px solid rgba(117,168,143,.12); border-radius:13px; }
.security-chip i { width:8px; height:8px; border-radius:50%; background:#75c19e; box-shadow:0 0 0 5px rgba(117,193,158,.08); }
.security-chip span { display:grid; }
.security-chip b { font-size:11px; }
.security-chip small { color:#71807a; font-size:9px; }
.sidebar-logout { margin-top:9px; width:100%; border:0; background:transparent; color:#899691; display:flex; align-items:center; gap:11px; padding:10px; border-radius:11px; cursor:pointer; font-weight:700; font-size:12px; }
.sidebar-logout:hover { background:rgba(255,255,255,.04); color:#fff; }
.workspace { min-height:100vh; margin-left:var(--sidebar-width); }
.topbar { height:84px; padding:0 34px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:color-mix(in srgb,var(--bg) 84%,transparent); backdrop-filter:blur(16px); position:sticky; top:0; z-index:20; }
.topbar-copy span { font-size:9px; color:var(--muted); font-weight:900; letter-spacing:.16em; }
.topbar-copy h1 { margin:2px 0 0; font-size:25px; letter-spacing:-.035em; }
.topbar-actions { display:flex; align-items:center; gap:6px; }
.topbar .icon-button { color:var(--muted); border:1px solid transparent; }
.topbar .icon-button:hover { border-color:var(--line); background:var(--panel); }
.notification-button { position:relative; }
.notification-button i { position:absolute; right:8px; top:7px; width:6px; height:6px; border-radius:50%; background:var(--danger); display:none; }
.profile-button { border:0; background:transparent; display:grid; grid-template-columns:36px auto auto; align-items:center; gap:9px; border-left:1px solid var(--line); margin-left:7px; padding:4px 2px 4px 15px; cursor:pointer; text-align:left; }
.profile-button>span:first-child { width:36px; height:36px; display:grid; place-items:center; border-radius:12px; background:linear-gradient(145deg,var(--accent),var(--accent-deep)); color:#fff; font-weight:900; }
.profile-button>span:nth-child(2) { display:grid; }
.profile-button b { font-size:12px; }
.profile-button small { color:var(--muted); font-size:10px; text-transform:capitalize; }
.profile-button i { color:var(--muted); font-style:normal; }
.page-content { padding:30px 34px 80px; max-width:1680px; margin:0 auto; outline:none; }

.page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:24px; }
.page-head h2 { margin:0; font-size:30px; letter-spacing:-.045em; }
.page-head p { margin:7px 0 0; color:var(--muted); max-width:700px; }
.page-actions { display:flex; flex-wrap:wrap; gap:9px; }
.grid { display:grid; gap:18px; }
.grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.dashboard-grid { grid-template-columns:1.35fr .65fr; align-items:start; }
.panel { background:var(--panel); border:1px solid var(--line); box-shadow:var(--shadow-soft); border-radius:var(--radius-lg); overflow:hidden; backdrop-filter:blur(14px); }
.panel-pad { padding:20px; }
.panel-header { padding:18px 20px 14px; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.panel-header h3 { margin:0; font-size:16px; letter-spacing:-.02em; }
.panel-header p { margin:3px 0 0; color:var(--muted); font-size:11px; }
.panel-header .mini-action { border:0; background:transparent; color:var(--accent-deep); font-size:11px; font-weight:800; cursor:pointer; }
.hero-card { position:relative; overflow:hidden; min-height:214px; padding:26px; color:#fff; background:linear-gradient(125deg,#1d302b,#3f6858); border-radius:var(--radius-xl); box-shadow:var(--shadow); }
.hero-card::before { content:""; position:absolute; width:300px; height:300px; border-radius:50%; background:rgba(255,255,255,.08); right:-100px; top:-150px; }
.hero-card::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,.03)); pointer-events:none; }
.hero-card-content { position:relative; z-index:1; display:grid; grid-template-columns:1fr auto; align-items:end; height:100%; gap:20px; }
.hero-card .eyebrow { color:#a9d2bf; }
.hero-card h2 { margin:11px 0 7px; font-size:36px; letter-spacing:-.055em; }
.hero-card p { margin:0; color:rgba(255,255,255,.64); max-width:550px; }
.hero-pet-photo { width:150px; height:150px; border-radius:38px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16); display:grid; place-items:center; font-size:64px; overflow:hidden; transform:rotate(2deg); }
.hero-pet-photo img { width:100%; height:100%; object-fit:cover; }
.hero-actions { display:flex; gap:9px; margin-top:22px; }
.hero-actions .button-secondary { background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.12); }
.kpi-card { padding:18px; min-height:132px; position:relative; overflow:hidden; }
.kpi-card::after { content:""; position:absolute; right:-28px; bottom:-28px; width:86px; height:86px; border-radius:50%; background:color-mix(in srgb,var(--accent) 8%,transparent); }
.kpi-top { display:flex; justify-content:space-between; align-items:center; }
.kpi-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:11px; background:var(--accent-soft); color:var(--accent-deep); }
.kpi-card small { color:var(--muted); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.kpi-card strong { display:block; margin-top:15px; font-size:27px; letter-spacing:-.045em; }
.kpi-card p { margin:2px 0 0; color:var(--muted); font-size:11px; }
.status-pill { display:inline-flex; align-items:center; gap:6px; padding:5px 8px; border-radius:999px; font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.06em; }
.status-pill.good { background:color-mix(in srgb,var(--success) 13%,transparent); color:var(--success); }
.status-pill.warn { background:color-mix(in srgb,var(--warning) 14%,transparent); color:var(--warning); }
.status-pill.bad { background:color-mix(in srgb,var(--danger) 13%,transparent); color:var(--danger); }
.chart-wrap { padding:0 18px 18px; }
.weight-chart { width:100%; height:220px; display:block; overflow:visible; }
.chart-grid { stroke:var(--line); stroke-width:1; }
.chart-line { fill:none; stroke:var(--accent); stroke-width:3.5; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 6px 8px color-mix(in srgb,var(--accent) 28%,transparent)); }
.chart-area { fill:url(#areaFill); }
.chart-dot { fill:var(--panel-solid); stroke:var(--accent); stroke-width:3; }
.chart-label { fill:var(--muted); font-size:10px; }
.empty-chart { min-height:220px; display:grid; place-items:center; text-align:center; color:var(--muted); padding:20px; }
.empty-chart span { display:block; font-size:32px; margin-bottom:8px; }
.timeline-list, .record-list, .clean-list { list-style:none; margin:0; padding:0; }
.timeline-item { display:grid; grid-template-columns:38px 1fr auto; gap:12px; align-items:center; padding:13px 20px; border-top:1px solid var(--line); }
.timeline-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:11px; background:var(--panel-soft); }
.timeline-item b { display:block; font-size:12px; }
.timeline-item p { margin:2px 0 0; color:var(--muted); font-size:10px; }
.timeline-item time { color:var(--muted); font-size:10px; white-space:nowrap; }
.empty-state { padding:48px 24px; text-align:center; color:var(--muted); }
.empty-state .empty-icon { width:62px; height:62px; margin:0 auto 14px; display:grid; place-items:center; border-radius:20px; background:var(--panel-soft); font-size:27px; }
.empty-state h3 { color:var(--text); margin:0 0 6px; }
.empty-state p { max-width:470px; margin:0 auto 18px; }

.pet-card { position:relative; padding:18px; display:grid; grid-template-columns:76px 1fr auto; gap:15px; align-items:center; }
.pet-card .pet-avatar { width:76px; height:76px; border-radius:22px; font-size:34px; }
.pet-card h3 { margin:0; font-size:19px; letter-spacing:-.03em; }
.pet-card p { margin:4px 0 8px; color:var(--muted); font-size:12px; }
.pet-meta { display:flex; flex-wrap:wrap; gap:7px; }
.pet-meta span { padding:4px 7px; border-radius:7px; background:var(--panel-soft); color:var(--muted); font-size:9px; font-weight:800; }
.card-menu { position:relative; }
.card-menu-pop { position:absolute; right:0; top:43px; min-width:170px; padding:7px; background:var(--panel-solid); border:1px solid var(--line); border-radius:13px; box-shadow:var(--shadow); z-index:6; }
.card-menu-pop button { width:100%; border:0; background:transparent; padding:9px 10px; border-radius:8px; text-align:left; cursor:pointer; font-size:12px; }
.card-menu-pop button:hover { background:var(--panel-soft); }
.card-menu-pop button.danger { color:var(--danger); }
.profile-hero { padding:24px; display:grid; grid-template-columns:140px 1fr auto; gap:24px; align-items:center; }
.profile-hero .pet-avatar { width:140px; height:140px; border-radius:34px; font-size:58px; }
.profile-hero h2 { margin:0 0 4px; font-size:34px; letter-spacing:-.05em; }
.profile-hero p { margin:0; color:var(--muted); }
.profile-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:17px; }
.fact { padding:10px 12px; border-radius:12px; background:var(--panel-soft); }
.fact small { display:block; color:var(--muted); font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.fact b { display:block; margin-top:3px; font-size:12px; }

.segmented { display:inline-flex; gap:3px; background:var(--panel-soft); border:1px solid var(--line); padding:4px; border-radius:12px; }
.segmented button { border:0; background:transparent; color:var(--muted); padding:7px 11px; border-radius:8px; cursor:pointer; font-size:11px; font-weight:800; }
.segmented button.active { background:var(--panel-solid); color:var(--text); box-shadow:0 3px 10px rgba(0,0,0,.06); }
.record-card { padding:16px 18px; display:grid; grid-template-columns:42px 1fr auto; gap:13px; align-items:start; border-top:1px solid var(--line); }
.record-card:first-child { border-top:0; }
.record-icon { width:40px; height:40px; display:grid; place-items:center; border-radius:12px; background:var(--panel-soft); color:var(--accent-deep); }
.record-card h4 { margin:0; font-size:13px; }
.record-card p { margin:4px 0 0; color:var(--muted); font-size:11px; white-space:pre-wrap; }
.record-detail { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; }
.record-detail span { padding:4px 7px; border-radius:7px; background:var(--panel-soft); color:var(--muted); font-size:9px; }
.record-actions { display:flex; gap:4px; }
.record-actions button { width:31px; height:31px; font-size:12px; }
.medication-card { padding:19px; }
.medication-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.medication-card h3 { margin:0; font-size:17px; }
.medication-card p { color:var(--muted); font-size:11px; }
.med-progress { height:7px; border-radius:999px; background:var(--panel-soft); overflow:hidden; margin:15px 0 10px; }
.med-progress i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--accent),var(--accent-deep)); }
.dose-actions { display:flex; gap:8px; margin-top:14px; }

.expense-hero { padding:22px; display:grid; grid-template-columns:1fr 210px; align-items:center; gap:24px; }
.expense-total small { color:var(--muted); font-weight:800; text-transform:uppercase; letter-spacing:.08em; font-size:10px; }
.expense-total strong { display:block; margin-top:7px; font-size:42px; letter-spacing:-.055em; }
.donut { width:170px; height:170px; border-radius:50%; margin:auto; display:grid; place-items:center; position:relative; background:conic-gradient(var(--accent) 0 40%,#d7a46a 40% 65%,#9c86b5 65% 80%,#6f8fb8 80% 100%); }
.donut::after { content:""; width:108px; height:108px; border-radius:50%; background:var(--panel-solid); position:absolute; }
.donut span { z-index:1; text-align:center; }
.donut b { display:block; font-size:20px; }
.donut small { color:var(--muted); font-size:9px; }
.category-row { display:grid; grid-template-columns:1fr auto; gap:12px; padding:12px 20px; border-top:1px solid var(--line); }
.category-row b { font-size:12px; }
.category-row small { color:var(--muted); font-size:10px; }

.hygiene-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:0 18px 18px; }
.hygiene-score { padding:14px; border-radius:15px; background:var(--panel-soft); }
.hygiene-score strong { display:block; font-size:21px; }
.hygiene-score small { color:var(--muted); font-size:9px; }
.hygiene-score .freshness { height:5px; background:var(--line); border-radius:999px; margin-top:12px; overflow:hidden; }
.hygiene-score .freshness i { display:block; height:100%; border-radius:inherit; background:var(--accent); }

.wrapped-card { min-height:520px; padding:44px; color:#fff; background:radial-gradient(circle at 85% 12%,rgba(255,255,255,.16),transparent 28%),linear-gradient(145deg,#122320,#376451 58%,#b18a50); border-radius:34px; position:relative; overflow:hidden; box-shadow:var(--shadow); }
.wrapped-card::after { content:"✦"; position:absolute; right:-20px; bottom:-100px; font-size:330px; color:rgba(255,255,255,.05); transform:rotate(-12deg); }
.wrapped-year { font-size:12px; font-weight:900; letter-spacing:.2em; color:#b8dcc9; }
.wrapped-card h2 { font-size:clamp(42px,6vw,76px); line-height:.95; letter-spacing:-.065em; max-width:760px; margin:20px 0; }
.wrapped-card>p { color:rgba(255,255,255,.66); font-size:18px; max-width:620px; }
.wrapped-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:50px; position:relative; z-index:1; }
.wrapped-stat { padding:19px; border-radius:18px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.11); backdrop-filter:blur(12px); }
.wrapped-stat strong { display:block; font-size:28px; }
.wrapped-stat small { color:rgba(255,255,255,.6); }
.awards-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.award { padding:10px 14px; border-radius:999px; background:rgba(255,255,255,.11); border:1px solid rgba(255,255,255,.12); font-size:11px; font-weight:800; }

.settings-section { margin-bottom:22px; }
.settings-section>h3 { margin:0 0 11px 3px; font-size:13px; }
.setting-row { padding:16px 18px; display:grid; grid-template-columns:1fr auto; gap:18px; align-items:center; border-top:1px solid var(--line); }
.setting-row:first-child { border-top:0; }
.setting-row h4 { margin:0; font-size:13px; }
.setting-row p { margin:3px 0 0; color:var(--muted); font-size:10px; }
.setting-control { min-width:180px; max-width:320px; }
.switch { position:relative; width:44px; height:24px; display:inline-block; }
.switch input { opacity:0; width:0; height:0; }
.switch i { position:absolute; inset:0; background:var(--line-strong); border-radius:999px; cursor:pointer; transition:.2s; }
.switch i::before { content:""; position:absolute; width:18px; height:18px; left:3px; top:3px; background:white; border-radius:50%; box-shadow:0 2px 6px rgba(0,0,0,.2); transition:.2s; }
.switch input:checked+i { background:var(--accent); }
.switch input:checked+i::before { transform:translateX(20px); }
.integration-card { padding:18px; }
.integration-card-top { display:flex; justify-content:space-between; gap:12px; }
.integration-card h4 { margin:0; }
.integration-card p { color:var(--muted); font-size:11px; min-height:48px; }
.integration-status { font-size:9px; padding:5px 7px; border-radius:999px; background:var(--panel-soft); color:var(--muted); height:max-content; font-weight:900; text-transform:uppercase; }

.access-role { padding:18px; }
.access-role-head { display:flex; justify-content:space-between; align-items:start; }
.role-badge { padding:5px 8px; border-radius:999px; background:var(--accent-soft); color:var(--accent-deep); text-transform:capitalize; font-size:9px; font-weight:900; }
.access-role h3 { margin:0; }
.access-role p { color:var(--muted); font-size:11px; }
.access-pets { display:flex; gap:6px; flex-wrap:wrap; }
.access-pets span { background:var(--panel-soft); border-radius:7px; padding:4px 7px; font-size:9px; }
.share-link-card { padding:16px 18px; display:grid; grid-template-columns:1fr auto; gap:15px; border-top:1px solid var(--line); }
.share-link-card:first-child { border-top:0; }
.share-link-card h4 { margin:0; font-size:13px; }
.share-link-card p { margin:4px 0 7px; color:var(--muted); font-size:10px; }
.share-url { display:flex; gap:7px; align-items:center; }
.share-url code { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--accent-deep); font-size:10px; }
.audit-row { display:grid; grid-template-columns:170px 130px 1fr auto; gap:12px; align-items:center; padding:12px 18px; border-top:1px solid var(--line); font-size:11px; }
.audit-row:first-child { border-top:0; }
.audit-row time, .audit-row small { color:var(--muted); }
.audit-row code { font-size:10px; color:var(--accent-deep); }

.quick-action-button { position:fixed; right:28px; bottom:28px; width:58px; height:58px; border:0; border-radius:19px; color:#fff; background:linear-gradient(145deg,var(--accent),var(--accent-deep)); box-shadow:0 18px 42px color-mix(in srgb,var(--accent) 38%,transparent); z-index:25; cursor:pointer; transition:transform .2s; }
.quick-action-button:hover { transform:translateY(-3px) rotate(2deg); }
.quick-action-button span { font-size:30px; font-weight:300; }
.quick-action-menu { position:fixed; right:28px; bottom:96px; width:210px; padding:8px; border-radius:18px; background:var(--panel-solid); border:1px solid var(--line); box-shadow:var(--shadow); z-index:25; }
.quick-action-menu button { width:100%; border:0; background:transparent; display:flex; align-items:center; gap:10px; padding:10px; border-radius:11px; cursor:pointer; text-align:left; }
.quick-action-menu button:hover { background:var(--panel-soft); }
.quick-action-menu button span { width:29px; height:29px; display:grid; place-items:center; border-radius:9px; background:var(--accent-soft); color:var(--accent-deep); }
.quick-action-menu button b { font-size:11px; }

.modal-backdrop { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:24px; background:rgba(9,15,13,.64); backdrop-filter:blur(7px); }
.modal { width:min(650px,100%); max-height:min(860px,calc(100vh - 48px)); overflow:hidden; display:flex; flex-direction:column; background:var(--panel-solid); border:1px solid var(--line); border-radius:26px; box-shadow:0 40px 120px rgba(0,0,0,.34); animation:modal-in .2s ease; }
.modal.wide { width:min(900px,100%); }
@keyframes modal-in { from{opacity:0;transform:translateY(12px) scale(.985)} }
.modal>header { padding:20px 22px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; }
.modal>header h2 { margin:3px 0 0; font-size:22px; letter-spacing:-.035em; }
.modal-body { padding:22px; overflow:auto; }
.modal-footer { padding:15px 22px; border-top:1px solid var(--line); display:flex; justify-content:flex-end; gap:9px; background:var(--panel-soft); }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.form-grid .span-2 { grid-column:span 2; }
.form-help { color:var(--muted); font-size:10px; margin:2px 0 0; }
.check-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.check-card { display:flex; gap:10px; align-items:flex-start; padding:11px; border:1px solid var(--line); border-radius:12px; cursor:pointer; background:var(--panel); }
.check-card input { width:auto; margin-top:2px; }
.check-card b { display:block; font-size:11px; }
.check-card small { color:var(--muted); font-size:9px; }
.file-drop { border:1px dashed var(--line-strong); border-radius:16px; padding:28px; text-align:center; background:var(--panel-soft); cursor:pointer; }
.file-drop.dragging { border-color:var(--accent); background:var(--accent-soft); }
.file-drop input { display:none; }
.file-drop span { display:block; font-size:31px; }
.file-drop b { display:block; margin:9px 0 3px; }
.file-drop small { color:var(--muted); }
.secret-box { padding:15px; border-radius:13px; background:var(--panel-soft); border:1px solid var(--line); word-break:break-all; }
.secret-box code { font-size:12px; color:var(--accent-deep); }

.toast-region { position:fixed; right:24px; top:96px; z-index:200; display:grid; gap:9px; width:min(380px,calc(100vw - 48px)); }
.toast { display:grid; grid-template-columns:34px 1fr auto; gap:10px; align-items:start; padding:13px; background:var(--panel-solid); border:1px solid var(--line); box-shadow:var(--shadow); border-radius:15px; animation:toast-in .25s ease; }
@keyframes toast-in { from{opacity:0;transform:translateX(20px)} }
.toast>span { width:32px; height:32px; display:grid; place-items:center; border-radius:10px; background:var(--accent-soft); }
.toast b { display:block; font-size:12px; }
.toast p { margin:2px 0 0; color:var(--muted); font-size:10px; }
.toast button { border:0; background:transparent; color:var(--muted); cursor:pointer; }
.toast.error>span { background:color-mix(in srgb,var(--danger) 13%,transparent); color:var(--danger); }

.share-view { min-height:100vh; padding:34px; background:radial-gradient(circle at 80% 0,color-mix(in srgb,var(--accent) 15%,transparent),transparent 35%),var(--bg); }
.share-shell { max-width:980px; margin:auto; }
.share-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:34px; }
.share-top .brand b { color:var(--text); }
.share-top .brand small { color:var(--muted); }
.share-expiry { font-size:10px; color:var(--muted); }
.share-pet { padding:28px; display:grid; grid-template-columns:120px 1fr; gap:24px; align-items:center; }
.share-pet .pet-avatar { width:120px; height:120px; border-radius:30px; font-size:50px; }
.share-pet h1 { margin:0; font-size:38px; letter-spacing:-.05em; }
.share-pet p { color:var(--muted); }
.share-section { margin-top:18px; }
.share-section h2 { font-size:17px; }
.emergency-card { padding:24px; border-radius:24px; background:linear-gradient(145deg,#1a2c27,#497363); color:#fff; position:relative; overflow:hidden; }
.emergency-card h2 { margin:0; font-size:28px; }
.emergency-card p { color:rgba(255,255,255,.65); }
.emergency-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:18px; }
.emergency-grid div { padding:12px; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.07); border-radius:12px; }
.emergency-grid small { display:block; color:rgba(255,255,255,.52); font-size:9px; text-transform:uppercase; font-weight:900; }
.emergency-grid b { display:block; margin-top:4px; }

.drag-widget { cursor:grab; }
.drag-widget.dragging { opacity:.45; transform:scale(.99); }
.drag-handle { color:var(--muted); cursor:grab; }
.skeleton { position:relative; overflow:hidden; background:var(--panel-soft); border-radius:10px; min-height:18px; }
.skeleton::after { content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent); animation:shimmer 1.2s infinite; }
@keyframes shimmer { 100%{transform:translateX(100%)} }

@media (max-width:1180px) {
  .grid-4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-grid { grid-template-columns:1fr; }
  .login-layout { gap:45px; }
  .login-copy h1 { font-size:58px; }
  .wrapped-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px) {
  .mobile-only { display:grid !important; }
  .sidebar { transform:translateX(-102%); transition:transform .25s ease; box-shadow:20px 0 60px rgba(0,0,0,.25); }
  .sidebar.open { transform:translateX(0); }
  .sidebar-scrim { position:fixed; inset:0; z-index:29; background:rgba(0,0,0,.45); display:none; }
  .sidebar-scrim.open { display:block; }
  .workspace { margin-left:0; }
  .topbar { padding:0 19px; }
  .page-content { padding:24px 19px 80px; }
  .login-layout { grid-template-columns:1fr; width:min(560px,calc(100% - 30px)); }
  .login-story { display:none; }
  .login-panel { padding:30px; }
  .grid-3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .profile-hero { grid-template-columns:110px 1fr; }
  .profile-hero .pet-avatar { width:110px; height:110px; }
  .profile-hero>.page-actions { grid-column:span 2; }
  .expense-hero { grid-template-columns:1fr; }
  .audit-row { grid-template-columns:120px 110px 1fr; }
  .audit-row code { display:none; }
}
@media (max-width:640px) {
  .topbar { height:72px; }
  .topbar-copy span { display:none; }
  .topbar-copy h1 { font-size:20px; }
  .profile-button>span:nth-child(2), .profile-button i { display:none; }
  .profile-button { padding-left:9px; grid-template-columns:36px; }
  .page-head { display:block; }
  .page-actions { margin-top:15px; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns:1fr; }
  .hero-card { padding:21px; }
  .hero-card-content { grid-template-columns:1fr; }
  .hero-pet-photo { position:absolute; right:15px; top:15px; width:76px; height:76px; border-radius:22px; font-size:32px; opacity:.8; }
  .hero-card h2 { padding-right:70px; font-size:31px; }
  .hygiene-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .profile-hero { grid-template-columns:1fr; text-align:center; }
  .profile-hero .pet-avatar { margin:auto; }
  .profile-hero>.page-actions { grid-column:auto; justify-content:center; }
  .profile-facts { grid-template-columns:1fr 1fr; text-align:left; }
  .pet-card { grid-template-columns:64px 1fr auto; }
  .pet-card .pet-avatar { width:64px; height:64px; }
  .form-grid, .check-grid { grid-template-columns:1fr; }
  .form-grid .span-2 { grid-column:auto; }
  .modal-backdrop { padding:0; align-items:end; }
  .modal { width:100%; max-height:94vh; border-radius:24px 24px 0 0; }
  .wrapped-card { padding:28px 22px; }
  .wrapped-stats { grid-template-columns:1fr 1fr; }
  .share-view { padding:18px; }
  .share-top { align-items:flex-start; gap:15px; }
  .share-pet { grid-template-columns:1fr; text-align:center; }
  .share-pet .pet-avatar { margin:auto; }
  .emergency-grid { grid-template-columns:1fr; }
  .setting-row { grid-template-columns:1fr; }
  .setting-control { min-width:0; max-width:none; }
  .quick-action-button { right:18px; bottom:18px; }
  .quick-action-menu { right:18px; bottom:86px; }
  .audit-row { grid-template-columns:1fr auto; }
  .audit-row>*:nth-child(2), .audit-row>*:nth-child(4) { display:none; }
}

@media print {
  .sidebar, .topbar, .quick-action-button, .quick-action-menu, .page-actions, .record-actions { display:none !important; }
  .workspace { margin:0; }
  .page-content { padding:0; }
  body { background:#fff; }
  .panel, .hero-card, .emergency-card { box-shadow:none; break-inside:avoid; }
}

/* Enhanced document library, linked visits, and data portability */
.document-library { overflow:hidden; }
.document-toolbar { display:grid; grid-template-columns:minmax(240px,1fr) 190px auto; gap:10px; align-items:center; padding:0 18px 18px; }
.document-search { height:42px; display:flex; align-items:center; gap:9px; padding:0 12px; border:1px solid var(--line); border-radius:12px; background:var(--panel-soft); }
.document-search span { color:var(--muted); font-size:18px; }
.document-search input { padding:0; border:0; background:transparent; box-shadow:none; }
.document-search input:focus { box-shadow:none; }
.document-toolbar select { height:42px; }
.document-view-toggle { justify-self:end; }
.document-view-toggle button { min-width:40px; font-size:16px; }
.document-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:15px; padding:0 18px 18px; }
.document-card { min-width:0; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:var(--panel); box-shadow:0 7px 22px rgba(18,31,28,.045); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.document-card:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--accent) 42%,var(--line)); box-shadow:0 16px 38px rgba(18,31,28,.1); }
.document-thumbnail { position:relative; width:100%; height:190px; display:block; overflow:hidden; padding:0; border:0; border-bottom:1px solid var(--line); background:linear-gradient(145deg,var(--panel-soft),color-mix(in srgb,var(--accent) 8%,var(--panel))); cursor:pointer; }
.document-thumbnail img { width:100%; height:100%; object-fit:cover; display:block; }
.document-thumbnail iframe { width:calc(100% + 12px); height:calc(100% + 18px); margin:-4px -6px; border:0; pointer-events:none; background:#fff; }
.document-preview-hint { position:absolute; left:50%; bottom:12px; transform:translate(-50%,8px); padding:7px 10px; opacity:0; border-radius:999px; color:#fff; background:rgba(15,25,22,.82); backdrop-filter:blur(8px); font-size:9px; font-weight:850; letter-spacing:.03em; transition:.18s ease; }
.document-thumbnail:hover .document-preview-hint { opacity:1; transform:translate(-50%,0); }
.document-type-badge { position:absolute; top:11px; left:11px; padding:5px 8px; border-radius:8px; background:#b84949; color:#fff; font-size:9px; font-weight:900; box-shadow:0 5px 14px rgba(0,0,0,.16); }
.text-document-thumb { height:100%; padding:24px; text-align:left; background:linear-gradient(145deg,#faf7ef,var(--panel-soft)); color:#37443f; }
.text-document-thumb>span { display:inline-grid; place-items:center; min-width:42px; height:28px; padding:0 8px; border-radius:8px; background:var(--accent-deep); color:#fff; font-size:9px; font-weight:900; }
.text-document-thumb p { margin:18px 0 0; font:500 10px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace; white-space:pre-wrap; opacity:.72; }
.document-card-body { padding:14px; }
.document-title-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:start; }
.document-title-row h4 { margin:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:12px; }
.document-title-row p { margin:4px 0 0; color:var(--muted); font-size:9px; }
.document-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.document-meta span, .linked-record-chips span { padding:4px 7px; border-radius:999px; background:var(--panel-soft); color:var(--muted); font-size:8px; font-weight:760; }
.linked-record-chips { display:flex; gap:5px; flex-wrap:wrap; margin-top:8px; }
.linked-record-chips span { background:var(--accent-soft); color:var(--accent-deep); }
.document-card-actions { display:flex; gap:7px; align-items:center; margin-top:13px; }
.document-card-actions .button { min-height:34px; padding:0 10px; font-size:9px; }
.document-card-actions .button:first-child { flex:1; }
.document-card-actions a { text-decoration:none; }
.danger-icon { color:var(--danger); }
.document-empty.span-all, .span-all { grid-column:1/-1; }
.document-grid.list-view { display:block; }
.document-grid.list-view .document-card { display:grid; grid-template-columns:150px minmax(0,1fr); margin-bottom:10px; }
.document-grid.list-view .document-thumbnail { height:132px; border-bottom:0; border-right:1px solid var(--line); }
.document-grid.list-view .document-card-body { display:flex; flex-direction:column; justify-content:center; }
.document-grid.list-view .document-card-actions { justify-content:flex-end; }
.document-grid.list-view .document-card-actions .button:first-child { flex:0 0 auto; }
.document-link-picker { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:10px; max-height:270px; overflow:auto; padding:2px; }
.form-section-title { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:5px 0 4px; }
.form-section-title>span { font-size:11px; font-weight:850; }
.form-section-title small { color:var(--muted); font-size:9px; text-align:right; }
.visit-document-section { margin-top:4px; padding-top:15px; border-top:1px solid var(--line); }
.compact-file-drop { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:11px; padding:12px 14px; border:1px dashed var(--line-strong); border-radius:13px; background:var(--panel-soft); cursor:pointer; }
.compact-file-drop input { display:none; }
.compact-file-drop span { font-size:10px; font-weight:850; color:var(--accent-deep); }
.compact-file-drop small { color:var(--muted); font-size:8px; }
.selected-file-stack { display:grid; gap:6px; }
.selected-file-stack>span { display:flex; justify-content:space-between; gap:10px; padding:9px 11px; border:1px solid var(--line); border-radius:10px; background:var(--panel-soft); }
.selected-file-stack b { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:10px; }
.selected-file-stack small { flex:0 0 auto; color:var(--muted); font-size:8px; }
.modal-intro { margin:0 0 12px; color:var(--muted); font-size:10px; }
.document-preview-layout { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:18px; min-height:560px; }
.document-preview-stage { min-width:0; min-height:560px; display:grid; place-items:center; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:var(--panel-soft); }
.document-preview-stage img { max-width:100%; max-height:72vh; object-fit:contain; }
.document-preview-stage iframe { width:100%; height:72vh; min-height:560px; border:0; background:#fff; }
.document-preview-info { padding:4px 2px; }
.document-preview-info h3 { margin:14px 0 5px; font-size:19px; }
.document-preview-info>p { color:var(--muted); font-size:10px; line-height:1.6; }
.document-preview-info dl { display:grid; gap:0; margin:18px 0; border:1px solid var(--line); border-radius:13px; overflow:hidden; }
.document-preview-info dl div { display:flex; justify-content:space-between; gap:12px; padding:9px 10px; border-top:1px solid var(--line); }
.document-preview-info dl div:first-child { border-top:0; }
.document-preview-info dt { color:var(--muted); font-size:9px; }
.document-preview-info dd { margin:0; text-align:right; font-size:9px; font-weight:800; }
.preview-linked-list { display:grid; gap:6px; }
.preview-linked-list>span { display:grid; grid-template-columns:auto 1fr auto; gap:6px; align-items:center; padding:9px; border-radius:10px; background:var(--panel-soft); font-size:9px; }
.preview-linked-list small { color:var(--muted); }
.preview-actions { display:grid; gap:8px; margin-top:18px; }
.preview-actions a { text-decoration:none; }
.modal-document-grid { padding:0; }
.data-portability-card { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px; }
.data-portability-card>div { display:grid; grid-template-columns:46px 1fr; column-gap:13px; align-items:center; }
.data-portability-card h4 { margin:0; }
.data-portability-card p { grid-column:2; margin:3px 0 0; color:var(--muted); font-size:10px; }
.data-portability-icon { grid-row:1/3; width:46px; height:46px; display:grid; place-items:center; border-radius:14px; background:var(--accent-soft); color:var(--accent-deep); font-size:22px; }
.export-format-note { align-self:end; padding:11px; border-radius:12px; background:var(--panel-soft); border:1px solid var(--line); }
.export-format-note b { font-size:10px; }
.export-format-note p { margin:3px 0 0; color:var(--muted); font-size:8px; }
.export-section-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:10px; max-height:340px; overflow:auto; padding:2px; }

@media (max-width:900px) {
  .document-preview-layout { grid-template-columns:1fr; min-height:0; }
  .document-preview-stage, .document-preview-stage iframe { min-height:430px; height:55vh; }
  .document-preview-info { padding-bottom:8px; }
  .export-section-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:680px) {
  .document-toolbar { grid-template-columns:1fr; }
  .document-view-toggle { justify-self:stretch; }
  .document-view-toggle button { flex:1; }
  .document-grid { grid-template-columns:1fr; padding:0 12px 12px; }
  .document-grid.list-view .document-card { grid-template-columns:105px minmax(0,1fr); }
  .document-grid.list-view .document-thumbnail { height:145px; }
  .document-grid.list-view .document-card-actions { flex-wrap:wrap; justify-content:flex-start; }
  .document-link-picker, .export-section-grid { grid-template-columns:1fr; }
  .form-section-title { display:block; }
  .form-section-title small { display:block; margin-top:3px; text-align:left; }
  .compact-file-drop, .data-portability-card { align-items:flex-start; flex-direction:column; }
  .document-preview-stage, .document-preview-stage iframe { min-height:360px; height:48vh; }
}

/* Sharkster 2.0 product expansion */
.nav-emergency { color:#f0a4a4 !important; }
.nav-emergency span { color:#ffadad !important; }
.expansion-head { align-items:flex-end; }
.expansion-head h2 { font-size:clamp(28px,4vw,44px); line-height:1; letter-spacing:-.045em; margin:0 0 9px; }
.expansion-head p { max-width:760px; font-size:13px; line-height:1.65; }
.page-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:9px; }
.panel { overflow:hidden; }
.panel-header h3 { font-size:16px; }
.panel-header p { font-size:11px; }

.today-hero { position:relative; min-height:270px; border-radius:30px; padding:36px 38px; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:30px; color:#fff; background:linear-gradient(125deg,#152420 0%,#1d332c 57%,color-mix(in srgb,var(--accent) 68%,#274136) 130%); box-shadow:var(--shadow); }
.today-hero::before { content:""; position:absolute; inset:-30% -10% auto auto; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.14),transparent 65%); }
.today-hero h2 { margin:10px 0 0; font-size:clamp(35px,5vw,60px); line-height:1; letter-spacing:-.055em; }
.today-pet-name { margin:6px 0 22px; font-family:Georgia,serif; font-style:italic; font-size:31px; color:#a9d2bf; }
.today-pet-photo { position:relative; z-index:1; width:210px; height:210px; flex:0 0 auto; border-radius:44px; display:grid; place-items:center; overflow:hidden; font-size:90px; background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.04)); border:1px solid rgba(255,255,255,.15); box-shadow:0 30px 70px rgba(0,0,0,.28); transform:rotate(2deg); }
.today-pet-photo img { width:100%; height:100%; object-fit:cover; }
.normal-status { display:inline-flex; align-items:center; gap:11px; max-width:600px; padding:12px 15px; border:1px solid rgba(255,255,255,.12); border-radius:14px; background:rgba(255,255,255,.07); backdrop-filter:blur(16px); }
.normal-status>i { width:10px; height:10px; border-radius:50%; flex:0 0 auto; background:#7ad1a3; box-shadow:0 0 0 6px rgba(122,209,163,.12); }
.normal-status.attention>i { background:#e5b66c; box-shadow:0 0 0 6px rgba(229,182,108,.12); }
.normal-status span { display:grid; gap:2px; }
.normal-status b { font-size:12px; }
.normal-status small { color:rgba(255,255,255,.6); font-size:10px; }
.quick-strip { position:relative; z-index:3; display:grid; grid-template-columns:repeat(6,1fr); gap:9px; width:min(920px,calc(100% - 40px)); margin:-27px auto 20px; padding:10px; border:1px solid var(--line); border-radius:20px; background:color-mix(in srgb,var(--panel-solid) 90%,transparent); box-shadow:var(--shadow-soft); backdrop-filter:blur(18px); }
.quick-strip button { border:0; border-radius:14px; background:transparent; min-height:70px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; cursor:pointer; }
.quick-strip button:hover { background:var(--panel-soft); transform:translateY(-2px); }
.quick-strip span { font-size:22px; color:var(--accent-deep); }
.quick-strip b { font-size:11px; }
.today-kpis { margin-bottom:18px; }
.mini-stat { min-height:118px; padding:20px; display:flex; gap:14px; align-items:flex-start; }
.mini-stat>span { width:42px; height:42px; display:grid; place-items:center; border-radius:14px; background:var(--accent-soft); color:var(--accent-deep); font-size:19px; }
.mini-stat div { min-width:0; display:grid; }
.mini-stat small { color:var(--muted); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.mini-stat strong { margin-top:4px; font-size:24px; letter-spacing:-.04em; }
.mini-stat p { margin:3px 0 0; color:var(--muted); font-size:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dashboard-two-col { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(310px,.75fr); gap:18px; margin-bottom:18px; }
.dashboard-side-stack { display:grid; gap:18px; align-content:start; }
.today-list { padding:0 18px 18px; }
.attention-list { padding:0 15px 15px; display:grid; gap:8px; }
.attention-list button { width:100%; border:1px solid var(--line); border-radius:13px; padding:11px; background:var(--panel-soft); display:grid; grid-template-columns:34px 1fr auto; align-items:center; gap:10px; text-align:left; cursor:pointer; }
.attention-list button>span { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; background:var(--panel-solid); color:var(--warning); }
.attention-list button div { display:grid; }
.attention-list button b { font-size:10px; }
.attention-list button small { color:var(--muted); font-size:9px; }
.attention-list button i { color:var(--muted); }
.calm-empty { display:flex; gap:10px; align-items:center; padding:15px; color:var(--muted); }
.calm-empty>span { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--accent-soft); color:var(--success); }
.calm-empty p { margin:0; font-size:11px; }
.observation-card { padding:23px; background:linear-gradient(145deg,color-mix(in srgb,var(--accent-soft) 75%,var(--panel-solid)),var(--panel-solid)); }
.observation-card h3 { margin:10px 0 7px; font-size:20px; line-height:1.25; letter-spacing:-.035em; }
.observation-card p { margin:0; color:var(--muted); font-size:11px; line-height:1.7; }
.observation-card .text-button { padding:13px 0 0; text-align:left; color:var(--accent-deep); }
.normal-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border-top:1px solid var(--line); }
.normal-grid>div { min-width:0; background:var(--panel-solid); padding:15px; display:grid; gap:3px; }
.normal-grid small { color:var(--muted); font-size:9px; text-transform:uppercase; font-weight:850; letter-spacing:.07em; }
.normal-grid b { font-size:11px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.normal-grid span { color:var(--muted); font-size:9px; }

.timeline-toolbar { display:grid; grid-template-columns:minmax(250px,1fr) 170px 175px 140px 140px auto; gap:8px; padding:13px; margin-bottom:12px; }
.timeline-search { position:relative; }
.timeline-search span { position:absolute; left:13px; top:50%; transform:translateY(-50%); color:var(--muted); }
.timeline-search input { padding-left:37px; }
.timeline-toolbar input,.timeline-toolbar select { min-height:43px; font-size:10px; }
.timeline-context-banner { display:flex; align-items:center; gap:13px; margin:0 0 12px; padding:13px 16px; border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line)); border-radius:15px; background:var(--accent-soft); }
.timeline-context-banner>span { font-size:20px; color:var(--accent-deep); }
.timeline-context-banner b { display:block; font-size:11px; }
.timeline-context-banner p { margin:2px 0 0; color:var(--muted); font-size:9px; }
.universal-timeline { padding:10px 18px 20px; }
.universal-entry { position:relative; display:grid; grid-template-columns:38px minmax(0,1fr) auto; gap:10px; padding:14px 0; border-bottom:1px solid var(--line); }
.universal-entry:last-child { border-bottom:0; }
.universal-entry.is-abnormal { border-radius:14px; margin:5px -8px; padding:14px 8px; background:color-mix(in srgb,var(--warning) 7%,transparent); }
.universal-rail { position:relative; display:flex; justify-content:center; }
.universal-rail>span { position:relative; z-index:2; width:34px; height:34px; display:grid; place-items:center; border-radius:11px; background:var(--panel-soft); color:var(--accent-deep); font-size:15px; }
.universal-rail i { position:absolute; top:34px; bottom:-15px; width:1px; background:var(--line); }
.universal-entry:last-child .universal-rail i { display:none; }
.universal-body { min-width:0; }
.universal-top { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.universal-top h4 { margin:4px 0 0; font-size:13px; letter-spacing:-.015em; }
.universal-top time { flex:0 0 auto; color:var(--muted); font-size:9px; }
.timeline-type { display:inline-flex; align-items:center; gap:5px; color:var(--accent-deep); font-size:8px; font-weight:850; text-transform:uppercase; letter-spacing:.07em; }
.universal-body>p { margin:6px 0 8px; color:var(--muted); font-size:10px; line-height:1.55; }
.universal-entry.compact { padding:10px 0; grid-template-columns:32px minmax(0,1fr) auto; }
.universal-entry.compact .universal-rail>span { width:29px; height:29px; font-size:12px; }
.compact-timeline { padding-top:0; }

.profile-hero { padding:25px; display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.profile-identity { display:flex; align-items:center; gap:20px; }
.profile-photo { width:110px; height:110px; border-radius:27px; display:grid; place-items:center; overflow:hidden; background:var(--accent-soft); font-size:50px; }
.profile-photo img { width:100%; height:100%; object-fit:cover; }
.profile-identity h2 { margin:5px 0 2px; font-size:35px; letter-spacing:-.05em; }
.profile-identity p { margin:0; color:var(--muted); }
.profile-tags { display:flex; flex-wrap:wrap; gap:7px; margin-top:12px; }
.profile-tags span { padding:6px 9px; border-radius:999px; background:var(--panel-soft); color:var(--muted); font-size:9px; font-weight:750; }
.completion-ring { width:112px; height:112px; border-radius:50%; flex:0 0 auto; display:grid; place-content:center; text-align:center; background:conic-gradient(var(--accent) var(--progress),var(--panel-soft) 0); position:relative; }
.completion-ring::before { content:""; position:absolute; inset:10px; border-radius:50%; background:var(--panel-solid); }
.completion-ring strong,.completion-ring small { position:relative; z-index:1; }
.completion-ring strong { font-size:24px; }
.completion-ring small { color:var(--muted); font-size:8px; }
.profile-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:18px; }
.profile-main,.profile-side { display:grid; gap:18px; align-content:start; }
.detail-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border-top:1px solid var(--line); }
.detail-grid>div { padding:15px; background:var(--panel-solid); display:grid; gap:3px; min-width:0; }
.detail-grid small,.medical-identity small { color:var(--muted); font-size:8px; text-transform:uppercase; font-weight:850; letter-spacing:.07em; }
.detail-grid b { font-size:10px; overflow-wrap:anywhere; }
.body-map-wrap { display:grid; grid-template-columns:1fr 1fr; gap:18px; padding:8px 20px 22px; }
.dog-body-map { min-height:285px; position:relative; border-radius:24px; background:radial-gradient(circle at 50% 45%,var(--accent-soft),transparent 72%),var(--panel-soft); }
.dog-body-map span { position:absolute; display:grid; place-items:center; border:1px dashed color-mix(in srgb,var(--accent) 48%,var(--line)); background:color-mix(in srgb,var(--panel-solid) 85%,transparent); color:var(--muted); font-size:8px; border-radius:999px; }
.body-head { width:72px; height:72px; top:16px; left:50%; transform:translateX(-50%); }
.body-torso { width:150px; height:105px; top:92px; left:50%; transform:translateX(-50%); border-radius:45% !important; }
.body-leg { width:48px; height:86px; top:183px; }.body-leg.a{left:22%}.body-leg.b{right:22%}.body-leg.c{left:37%}.body-leg.d{right:37%}.body-tail{width:75px;height:30px;right:5%;top:115px;transform:rotate(-24deg)}
.marker-list { display:grid; align-content:start; gap:8px; }
.marker-list>div { display:flex; gap:10px; padding:10px; border:1px solid var(--line); border-radius:12px; background:var(--panel-soft); }
.marker-list>div>span { width:27px; height:27px; flex:0 0 auto; display:grid; place-items:center; border-radius:9px; background:var(--accent); color:#fff; font-size:9px; font-weight:850; }
.marker-list p { margin:0; display:grid; }
.marker-list b { font-size:10px; }.marker-list small{color:var(--muted);font-size:8px}
.medical-identity { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border-top:1px solid var(--line); }
.medical-identity>div { padding:15px; background:var(--panel-solid); display:grid; gap:4px; }
.medical-identity b { font-size:10px; }
.readiness-list { padding:0 15px 15px; display:grid; gap:7px; }
.readiness-list>div { display:grid; grid-template-columns:28px 1fr auto; align-items:center; gap:8px; padding:9px; border-radius:11px; background:var(--panel-soft); }
.readiness-list>div>span { width:26px; height:26px; display:grid; place-items:center; border-radius:9px; font-weight:900; }
.readiness-list .done>span { background:var(--accent-soft); color:var(--success); }.readiness-list .missing>span{background:color-mix(in srgb,var(--warning) 15%,transparent);color:var(--warning)}
.readiness-list b { font-size:9px; }.readiness-list small{color:var(--muted);font-size:8px}
.stack-actions { display:grid; gap:8px; padding:0 15px 15px; }
.stack-actions button { border:1px solid var(--line); background:var(--panel-soft); border-radius:11px; padding:11px; text-align:left; font-size:10px; font-weight:750; cursor:pointer; }

.health-summary-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-bottom:14px; }
.health-summary-grid .mini-stat { min-height:110px; padding:15px; display:grid; gap:9px; }
.health-summary-grid .mini-stat>span { width:35px; height:35px; }
.health-summary-grid .mini-stat strong { font-size:18px; }
.module-tabs { display:flex; gap:5px; overflow:auto; padding:6px; margin-bottom:12px; border:1px solid var(--line); border-radius:15px; background:var(--panel); }
.module-tabs button { border:0; background:transparent; padding:9px 13px; border-radius:10px; white-space:nowrap; color:var(--muted); cursor:pointer; font-size:10px; font-weight:800; }
.module-tabs button.active { color:var(--text); background:var(--panel-solid); box-shadow:var(--shadow-soft); }
.module-tabs button span { margin-left:4px; color:var(--accent-deep); }
.health-overview-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:18px; }
.medical-summary-list { display:grid; gap:1px; background:var(--line); border-top:1px solid var(--line); }
.medical-summary-list>div { background:var(--panel-solid); padding:14px; display:grid; gap:4px; }
.medical-summary-list small { color:var(--muted); font-size:8px; font-weight:850; letter-spacing:.07em; text-transform:uppercase; }
.medical-summary-list b { font-size:10px; }
.medication-safety-banner,.finance-command,.vault-feature-strip { display:flex; align-items:center; gap:14px; margin-bottom:16px; padding:14px 17px; border-radius:16px; border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line)); background:linear-gradient(100deg,var(--accent-soft),var(--panel-solid)); }
.medication-safety-banner>span,.finance-command>span,.vault-feature-strip>span { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:var(--panel-solid); color:var(--accent-deep); font-size:20px; }
.medication-safety-banner div,.finance-command div,.vault-feature-strip div { min-width:0; flex:1; }
.medication-safety-banner b,.finance-command b,.vault-feature-strip b { font-size:11px; }
.medication-safety-banner p,.finance-command p,.vault-feature-strip p { margin:2px 0 0; color:var(--muted); font-size:9px; }

.nutrition-hero-grid { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:10px; margin-bottom:14px; }
.feeding-plan-card { padding:20px; background:linear-gradient(145deg,var(--panel-solid),var(--cream)); }
.feeding-plan-card h3 { margin:9px 0 5px; font-size:20px; letter-spacing:-.035em; }
.feeding-plan-card p { margin:0; color:var(--muted); font-size:10px; }
.feeding-plan-card .text-button { width:auto; padding:13px 0 0; color:var(--accent-deep); }
.schedule-display { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:0 18px 18px; }
.schedule-display>div { padding:20px; border-radius:16px; background:var(--panel-soft); display:grid; gap:5px; }
.schedule-display span { color:var(--accent-deep); font-size:9px; font-weight:900; letter-spacing:.1em; }
.schedule-display b { font-size:14px; }.schedule-display small{color:var(--muted);font-size:9px}

.activity-layout { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.65fr); gap:18px; margin-top:18px; }
.activity-side { display:grid; gap:18px; align-content:start; }
.map-placeholder { min-height:270px; padding:25px; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; background:radial-gradient(circle at 75% 22%,color-mix(in srgb,var(--accent) 26%,transparent),transparent 30%),repeating-linear-gradient(35deg,transparent,transparent 24px,var(--line) 25px),var(--panel-soft); }
.map-placeholder>span { font-size:44px; color:var(--accent-deep); }.map-placeholder h3{font-size:22px;margin:10px 0 4px}.map-placeholder p{color:var(--muted);font-size:10px;line-height:1.6}.map-placeholder .button{margin-top:8px;width:100%}
.freshness-board { display:grid; grid-template-columns:repeat(6,1fr); gap:9px; margin-bottom:18px; }
.freshness-card { position:relative; padding:15px; display:flex; gap:10px; min-height:102px; }
.freshness-card>span { font-size:18px; color:var(--accent-deep); }.freshness-card div{display:grid;align-content:start}.freshness-card small{color:var(--muted);font-size:8px}.freshness-card strong{font-size:15px}.freshness-card p{margin:2px 0;color:var(--muted);font-size:8px}.freshness-card>i{position:absolute;left:0;bottom:0;width:var(--fresh);height:3px;background:var(--accent)}

.calendar-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(280px,.65fr); gap:18px; }
.calendar-layout>aside { display:grid; gap:18px; align-content:start; }
.calendar-panel { padding:17px; }
.calendar-month-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }.calendar-month-head h3{font-size:18px;margin:0}
.calendar-weekdays,.calendar-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:5px; }
.calendar-weekdays span { padding:7px; text-align:center; color:var(--muted); font-size:8px; font-weight:850; }
.calendar-grid>span,.calendar-day { min-height:82px; border:1px solid var(--line); border-radius:12px; background:var(--panel-soft); padding:8px; text-align:left; }
.calendar-day { cursor:pointer; }.calendar-day:hover{border-color:var(--accent)}.calendar-day.today{background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 40%,transparent)}
.calendar-day b { font-size:10px; }.calendar-day i{display:inline-block;width:6px;height:6px;margin:20px 2px 0;border-radius:50%;background:var(--accent)}
.agenda-list { display:grid; padding:0 14px 14px; gap:7px; }
.agenda-list button { border:1px solid var(--line); background:var(--panel-soft); border-radius:12px; padding:9px; display:grid; grid-template-columns:42px 1fr auto; align-items:center; gap:9px; text-align:left; cursor:pointer; }
.agenda-list time { width:42px; height:42px; border-radius:10px; background:var(--panel-solid); display:grid; place-content:center; text-align:center; }.agenda-list time b{font-size:15px;line-height:1}.agenda-list time small{font-size:7px;text-transform:uppercase;color:var(--muted)}
.agenda-list span{display:grid}.agenda-list span b{font-size:9px}.agenda-list span small{font-size:8px;color:var(--muted)}
.digest-card { padding:17px; display:flex; gap:12px; align-items:center; }.digest-card>span{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:var(--accent-soft);color:var(--accent-deep)}.digest-card b{font-size:10px}.digest-card p{font-size:8px;color:var(--muted);margin:3px 0}

.active-shift-banner { display:flex; align-items:center; gap:16px; margin-bottom:18px; padding:20px; border-radius:18px; color:#fff; background:linear-gradient(110deg,#183129,#315c4b); box-shadow:var(--shadow-soft); }.active-shift-banner .pulse{width:12px;height:12px;border-radius:50%;background:#77d6a7;box-shadow:0 0 0 8px rgba(119,214,167,.13);animation:pulse 1.8s infinite}.active-shift-banner div{flex:1}.active-shift-banner small{font-size:8px;letter-spacing:.13em;color:#9dd0b8}.active-shift-banner h3{margin:3px 0;font-size:19px}.active-shift-banner p{margin:0;color:rgba(255,255,255,.6);font-size:9px}.active-shift-banner button{border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.1);color:#fff;border-radius:11px;padding:10px 13px;cursor:pointer}
@keyframes pulse{50%{box-shadow:0 0 0 13px rgba(119,214,167,0)}}
.permission-role-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:18px; }.permission-role-grid article{padding:18px}.permission-role-grid article>span{font-size:24px;color:var(--accent-deep)}.permission-role-grid h3{margin:10px 0 5px;font-size:14px}.permission-role-grid p{min-height:48px;margin:0;color:var(--muted);font-size:9px;line-height:1.55}.permission-role-grid button{margin-top:13px;border:0;background:transparent;color:var(--accent-deep);font-size:9px;font-weight:850;cursor:pointer;padding:0}

.travel-top-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:18px; margin-bottom:18px; }
.passport-card { padding:22px; background:linear-gradient(145deg,#1b3029,#24463a); color:#fff; }.passport-card>div{display:flex;gap:14px;align-items:center}.passport-photo{width:72px;height:72px;border-radius:18px;display:grid;place-items:center;overflow:hidden;background:rgba(255,255,255,.1);font-size:30px}.passport-photo img{width:100%;height:100%;object-fit:cover}.passport-card small{font-size:7px;letter-spacing:.14em;color:#94c8af}.passport-card h2{margin:3px 0;font-size:25px}.passport-card p{margin:0;color:rgba(255,255,255,.55);font-size:9px}.passport-card dl{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin:20px 0;background:rgba(255,255,255,.09)}.passport-card dl div{padding:10px;background:#1d352d;display:grid}.passport-card dt{font-size:7px;color:rgba(255,255,255,.45)}.passport-card dd{margin:3px 0 0;font-size:9px;font-weight:800}.passport-card button{width:100%;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.09);color:#fff;padding:10px;border-radius:10px;cursor:pointer}
.travel-workspace { padding:32px; display:flex; flex-direction:column; justify-content:center; background:radial-gradient(circle at 85% 5%,var(--accent-soft),transparent 32%),var(--panel-solid); }.travel-workspace h2{font-size:30px;margin:10px 0 6px;letter-spacing:-.045em}.travel-workspace p{color:var(--muted);font-size:11px}.travel-progress{height:7px;border-radius:99px;background:var(--panel-soft);overflow:hidden;margin:20px 0 9px}.travel-progress i{display:block;height:100%;background:var(--accent)}.travel-meta{display:flex;gap:12px;flex-wrap:wrap}.travel-meta span{font-size:8px;color:var(--muted);padding:6px 8px;border-radius:99px;background:var(--panel-soft)}
.travel-checklist { display:grid; grid-template-columns:repeat(2,1fr); padding:0 18px 18px; gap:7px; }.travel-checklist label{display:flex;gap:9px;align-items:center;padding:9px;border:1px solid var(--line);border-radius:10px;background:var(--panel-soft);font-size:9px;font-weight:750}.travel-checklist input{width:auto}

.insight-explainer { display:flex; gap:13px; align-items:center; margin-bottom:14px; padding:14px 17px; border-radius:15px; background:var(--accent-soft); border:1px solid color-mix(in srgb,var(--accent) 25%,transparent); }.insight-explainer>span{font-size:22px;color:var(--accent-deep)}.insight-explainer b{font-size:11px}.insight-explainer p{margin:2px 0 0;color:var(--muted);font-size:9px}
.evidence-insight { padding:25px; margin-bottom:18px; background:linear-gradient(145deg,var(--panel-solid),var(--cream)); }.evidence-insight h2{max-width:900px;margin:10px 0;font-size:27px;line-height:1.2;letter-spacing:-.04em}.evidence-insight>p{color:var(--muted);font-size:11px}.evidence-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.evidence-row button{border:1px solid var(--line);background:var(--panel-solid);border-radius:10px;padding:9px;display:grid;text-align:left;cursor:pointer}.evidence-row b{font-size:8px;color:var(--accent-deep)}.evidence-row span{font-size:9px}
.report-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.report-card{padding:20px;display:grid;grid-template-columns:42px 1fr;gap:12px}.report-card>span{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:var(--accent-soft);color:var(--accent-deep);font-size:19px}.report-card h3{margin:0;font-size:13px}.report-card p{margin:5px 0;color:var(--muted);font-size:9px;line-height:1.55}.report-card button{grid-column:2;border:0;background:transparent;padding:5px 0;text-align:left;color:var(--accent-deep);font-size:9px;font-weight:850;cursor:pointer}
.print-report { max-width:900px; margin:auto; background:#fff; color:#18211f; border-radius:18px; padding:34px; box-shadow:var(--shadow-soft); }.print-report header{display:flex;align-items:center;gap:15px;padding-bottom:20px;border-bottom:2px solid #e5ebe7}.report-pet-photo{width:68px;height:68px;border-radius:17px;display:grid;place-items:center;overflow:hidden;background:#e7f0eb;font-size:30px}.report-pet-photo img{width:100%;height:100%;object-fit:cover}.print-report header span{font-size:8px;color:#5d7f70;font-weight:900;letter-spacing:.12em}.print-report h1{margin:4px 0;font-size:27px}.print-report header p{margin:0;color:#66736e;font-size:9px}.report-critical{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.report-critical>div{padding:12px;border-radius:10px;background:#f1f5f2;display:grid}.report-critical small{font-size:7px;color:#66736e}.report-critical b{font-size:9px}.print-report h2{font-size:17px;margin:22px 0 8px}.report-entry{display:grid;grid-template-columns:120px 1fr;gap:13px;padding:10px 0;border-bottom:1px solid #e7ece9}.report-entry time{font-size:8px;color:#66736e}.report-entry b{font-size:10px}.report-entry p{margin:3px 0;color:#66736e;font-size:8px}.print-report footer{margin-top:22px;padding-top:15px;border-top:1px solid #e7ece9;color:#66736e;font-size:8px}

.search-command { padding:20px; margin-bottom:18px; }.big-search{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:7px;border:1px solid var(--line-strong);border-radius:16px;background:var(--panel-soft)}.big-search>span{padding-left:10px;font-size:23px;color:var(--accent-deep)}.big-search input{border:0;box-shadow:none;background:transparent;font-size:14px}.search-examples{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.search-examples button{border:1px solid var(--line);background:var(--panel-solid);border-radius:99px;padding:7px 10px;color:var(--muted);font-size:8px;cursor:pointer}.search-result-head{display:flex;justify-content:space-between;gap:15px;margin:0 0 9px;padding:0 3px}.search-result-head b{font-size:11px}.search-result-head span{color:var(--muted);font-size:8px}.search-answer{display:flex;align-items:center;gap:13px;padding:19px;margin-bottom:12px;border-radius:17px;background:linear-gradient(130deg,#1b332b,#315947);color:#fff}.search-answer>span{font-size:27px}.search-answer div{display:grid}.search-answer small{font-size:7px;color:#a3cfbb}.search-answer strong{font-size:25px}.search-answer p{margin:0;color:rgba(255,255,255,.55);font-size:8px}.search-docs{display:grid;padding:0 15px 15px;gap:7px}.search-docs button{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;border:1px solid var(--line);background:var(--panel-soft);padding:9px;border-radius:11px;text-align:left;cursor:pointer}.search-docs button>span{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:var(--panel-solid);color:var(--accent-deep)}.search-docs button div{display:grid}.search-docs b{font-size:9px}.search-docs small{font-size:8px;color:var(--muted)}

.emergency-shell { margin:-32px; min-height:calc(100vh - 80px); padding:32px; background:linear-gradient(145deg,#291817,#1b2320 55%); color:#fff; }.emergency-head{display:flex;align-items:center;gap:18px;margin-bottom:22px}.emergency-head>span{width:64px;height:64px;display:grid;place-items:center;border-radius:20px;background:#bd5656;color:#fff;font-size:32px;font-weight:900;box-shadow:0 18px 45px rgba(189,86,86,.28)}.emergency-head>div{flex:1}.emergency-head small{font-size:8px;letter-spacing:.15em;color:#e19a9a}.emergency-head h2{margin:2px 0;font-size:38px}.emergency-head p{margin:0;color:rgba(255,255,255,.55);font-size:10px}.button-light{background:#fff;color:#202927}
.emergency-grid{display:grid;grid-template-columns:.75fr 1.1fr .8fr;gap:12px}.emergency-card,.emergency-last-normal{border:1px solid rgba(255,255,255,.09);border-radius:18px;background:rgba(255,255,255,.055);padding:20px}.emergency-card h3{margin:0 0 15px;font-size:15px}.emergency-photo{width:88px;height:88px;border-radius:22px;display:grid;place-items:center;overflow:hidden;background:rgba(255,255,255,.09);font-size:40px;margin-bottom:15px}.emergency-photo img{width:100%;height:100%;object-fit:cover}.emergency-card dl{margin:0;display:grid;gap:1px;background:rgba(255,255,255,.08)}.emergency-card dl div{padding:9px;background:#202c28;display:grid}.emergency-card dt,.emergency-card.critical small{font-size:7px;color:rgba(255,255,255,.45);text-transform:uppercase;letter-spacing:.07em}.emergency-card dd{margin:2px 0 0;font-size:9px;font-weight:800}.emergency-card.critical{display:grid;align-content:start;gap:9px}.emergency-card.critical>div{padding:11px;border-radius:10px;background:rgba(255,255,255,.055);display:grid;gap:3px}.emergency-card.critical b{font-size:9px}.emergency-card.contacts a{display:grid;grid-template-columns:36px 1fr;gap:9px;align-items:center;text-decoration:none;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}.emergency-card.contacts a>span{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.08)}.emergency-card.contacts a div{display:grid}.emergency-card.contacts b{font-size:9px}.emergency-card.contacts small{font-size:8px;color:rgba(255,255,255,.45)}.emergency-last-normal{margin-top:12px}.emergency-last-normal .panel-header{border-color:rgba(255,255,255,.08)}.emergency-last-normal .normal-grid{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.08)}.emergency-last-normal .normal-grid>div{background:#202c28}.emergency-last-normal .normal-grid small,.emergency-last-normal .normal-grid span{color:rgba(255,255,255,.45)}

.quick-center { display:grid; gap:18px; }.quick-center section h3{margin:0 0 8px;font-size:11px}.quick-center section>div{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.quick-center button,.capture-tools button{border:1px solid var(--line);background:var(--panel-soft);border-radius:13px;padding:12px;text-align:left;cursor:pointer;display:grid;grid-template-columns:34px 1fr;column-gap:9px}.quick-center button>span,.capture-tools button>span{grid-row:1/3;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:var(--panel-solid);color:var(--accent-deep)}.quick-center button b,.capture-tools button b{font-size:9px}.quick-center button small,.capture-tools button small{font-size:7px;color:var(--muted)}.capture-tools{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}
.voice-entry,.integration-explainer,.lost-mode { text-align:center; padding:15px; }.voice-entry>span,.integration-explainer>span,.lost-mode>span{font-size:45px}.voice-entry h3,.integration-explainer h3,.lost-mode h2{font-size:19px;margin:8px 0}.voice-entry p,.integration-explainer p,.lost-mode p{color:var(--muted);font-size:10px;line-height:1.6}.voice-entry textarea{margin:12px 0;text-align:left}.capture-choice{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:15px}.capture-choice button{border:1px solid var(--line);background:var(--panel-soft);border-radius:11px;padding:12px;cursor:pointer}
.live-walk { text-align:center; padding:20px; }.live-dot{display:block;width:14px;height:14px;border-radius:50%;background:#59c68e;box-shadow:0 0 0 8px rgba(89,198,142,.12);margin:0 auto 20px;animation:pulse 1.6s infinite}.live-walk h2{font-size:55px;letter-spacing:-.06em;margin:0}.live-walk p{color:var(--muted);font-size:10px}.live-walk div{display:grid;margin-top:20px}.live-walk strong{font-size:25px}.live-walk small{color:var(--muted);font-size:8px}

.settings-expansion { margin-top:18px; }.settings-toggle-list{display:grid;gap:8px}.settings-toggle-list label{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px;border-radius:11px;background:var(--panel-soft)}.settings-toggle-list label span{display:grid}.settings-toggle-list b{font-size:9px}.settings-toggle-list small{font-size:8px;color:var(--muted)}.settings-toggle-list input{width:auto}.integration-list{display:grid;gap:7px}.integration-list>div{display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center;padding:9px;border-radius:11px;background:var(--panel-soft)}.integration-list>div>span{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:var(--panel-solid);color:var(--accent-deep)}.integration-list p{margin:0;display:grid}.integration-list b{font-size:9px}.integration-list small{font-size:7px;color:var(--muted)}.integration-list i{font-style:normal;font-size:7px;color:var(--accent-deep);font-weight:850}
.large-text body { font-size:18px; }.large-text .main-nav button{font-size:15px}.large-text .button{font-size:16px}.high-contrast{--line:rgba(20,30,27,.27);--line-strong:rgba(20,30,27,.48);--muted:#4f5d58}.high-contrast[data-theme="dark"]{--line:rgba(255,255,255,.25);--line-strong:rgba(255,255,255,.48);--muted:#c3cec9}.reduced-motion *{animation:none!important;transition:none!important;scroll-behavior:auto!important}

@media print {
  body * { visibility:hidden; }
  .print-report,.print-report * { visibility:visible; }
  .print-report { position:absolute; inset:0; width:100%; max-width:none; box-shadow:none; border-radius:0; }
  .modal-backdrop { position:static; background:#fff; }
  .preview-actions { display:none!important; }
}

@media (max-width:1200px) {
  .health-summary-grid { grid-template-columns:repeat(3,1fr); }
  .freshness-board { grid-template-columns:repeat(3,1fr); }
  .timeline-toolbar { grid-template-columns:1fr 160px 160px; }
  .timeline-toolbar input[type="date"],.timeline-toolbar .button { grid-row:2; }
  .permission-role-grid,.report-grid { grid-template-columns:repeat(2,1fr); }
  .nutrition-hero-grid { grid-template-columns:repeat(3,1fr); }.feeding-plan-card{grid-column:1/-1}
}
@media (max-width:900px) {
  .today-hero { min-height:240px; padding:28px; }.today-pet-photo{width:150px;height:150px;border-radius:32px}.quick-strip{grid-template-columns:repeat(3,1fr);margin-top:-18px}.dashboard-two-col,.profile-layout,.health-overview-grid,.activity-layout,.calendar-layout,.travel-top-grid{grid-template-columns:1fr}.profile-side{grid-template-columns:repeat(2,1fr)}.health-summary-grid{grid-template-columns:repeat(2,1fr)}.detail-grid{grid-template-columns:repeat(2,1fr)}.body-map-wrap{grid-template-columns:1fr}.emergency-grid{grid-template-columns:1fr 1fr}.emergency-card.contacts{grid-column:1/-1}.normal-grid{grid-template-columns:repeat(2,1fr)}.quick-center section>div,.capture-tools{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:680px) {
  .expansion-head { align-items:flex-start; }.page-actions{width:100%;justify-content:stretch}.page-actions .button{flex:1}.today-hero{min-height:0;padding:25px;align-items:flex-start}.today-hero h2{font-size:35px}.today-pet-photo{width:92px;height:92px;border-radius:24px;font-size:42px}.today-pet-name{font-size:24px}.normal-status{padding:10px;max-width:none}.normal-status small{display:none}.quick-strip{width:calc(100% - 20px);grid-template-columns:repeat(3,1fr);padding:6px;border-radius:16px}.quick-strip button{min-height:59px}.today-kpis,.health-summary-grid,.freshness-board,.nutrition-hero-grid,.permission-role-grid,.report-grid{grid-template-columns:1fr 1fr}.dashboard-two-col{gap:12px}.profile-hero{align-items:flex-start}.profile-identity{align-items:flex-start}.profile-photo{width:72px;height:72px;border-radius:20px}.profile-identity h2{font-size:27px}.completion-ring{width:78px;height:78px}.completion-ring strong{font-size:17px}.profile-side{grid-template-columns:1fr}.detail-grid,.medical-identity,.schedule-display,.travel-checklist{grid-template-columns:1fr}.timeline-toolbar{grid-template-columns:1fr}.timeline-toolbar>*{grid-row:auto!important}.universal-entry{grid-template-columns:34px minmax(0,1fr)}.universal-entry>.record-actions{grid-column:2;justify-content:flex-start}.universal-top{display:block}.universal-top time{display:block;margin-top:4px}.calendar-grid>span,.calendar-day{min-height:55px}.calendar-day i{margin-top:7px}.emergency-shell{margin:-20px;padding:20px}.emergency-head{align-items:flex-start;flex-wrap:wrap}.emergency-head>span{width:50px;height:50px}.emergency-head h2{font-size:30px}.emergency-grid{grid-template-columns:1fr}.emergency-card.contacts{grid-column:auto}.emergency-last-normal .normal-grid{grid-template-columns:1fr}.quick-center section>div,.capture-tools{grid-template-columns:1fr 1fr}.report-critical{grid-template-columns:1fr}.report-entry{grid-template-columns:1fr}.big-search{grid-template-columns:auto 1fr}.big-search .button{grid-column:1/-1}.body-map-wrap{padding:8px 12px 15px}
}