@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--n-000: #0d0f0e;--n-050: #141916;--n-100: #1c221e;--n-150: #242c27;--n-200: #2e3830;--n-300: #3f4f43;--n-400: #5a6e5f;--n-500: #7d9483;--n-600: #a3b8a8;--n-700: #c8d8cc;--n-800: #e4ede7;--n-900: #f2f7f3;--g-300: #2d6a4f;--g-400: #3a8a65;--g-500: #52b788;--g-600: #74c69d;--g-700: #95d5b2;--a-300: #92400e;--a-400: #b45309;--a-500: #d97706;--a-600: #f59e0b;--a-700: #fcd34d;--r-300: #7f1d1d;--r-400: #991b1b;--r-500: #dc2626;--r-600: #ef4444;--r-700: #fca5a5;--t-400: #0e7490;--t-500: #0891b2;--t-600: #22d3ee;--t-700: #a5f3fc;--p-400: #6d28d9;--p-500: #7c3aed;--p-600: #8b5cf6;--p-700: #c4b5fd;--color-bg: var(--n-000);--color-surface: var(--n-050);--color-surface-raised: var(--n-100);--color-surface-input: var(--n-150);--color-border: var(--n-200);--color-border-subtle: var(--n-300);--color-text-primary: var(--n-900);--color-text-secondary: var(--n-600);--color-text-muted: var(--n-500);--color-text-disabled: var(--n-400);--color-primary: var(--g-500);--color-primary-hover: var(--g-600);--color-primary-pressed: var(--g-300);--color-primary-text: var(--g-700);--color-primary-subtle: color-mix(in srgb, var(--g-500) 12%, transparent);--color-danger: var(--r-500);--color-danger-hover: var(--r-600);--color-danger-text: var(--r-700);--color-danger-subtle: color-mix(in srgb, var(--r-500) 12%, transparent);--color-warning: var(--a-500);--color-warning-hover: var(--a-600);--color-warning-text: var(--a-700);--color-warning-subtle: color-mix(in srgb, var(--a-500) 12%, transparent);--color-success: var(--g-500);--color-success-text: var(--g-700);--color-success-subtle: color-mix(in srgb, var(--g-500) 12%, transparent);--color-info: var(--t-500);--color-info-text: var(--t-700);--color-info-subtle: color-mix(in srgb, var(--t-500) 12%, transparent);--color-accent: var(--p-600);--color-accent-text: var(--p-700);--color-accent-subtle: color-mix(in srgb, var(--p-600) 12%, transparent);--text-xs: .8125rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--leading-tight: 1.25;--leading-snug: 1.375;--leading-normal: 1.5;--leading-relaxed: 1.625;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 20px;--radius-full: 9999px;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .4);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);--header-height: 56px;--bottom-bar-height: 60px;--bottom-tab-height: 60px;--touch-target: 44px;--z-sticky: 10;--z-modal: 100;--spacing-1: var(--space-1);--spacing-2: var(--space-2);--spacing-3: var(--space-3);--spacing-4: var(--space-4);--spacing-5: var(--space-5);--spacing-6: var(--space-6);--spacing-8: var(--space-8);--spacing-10: var(--space-10);--spacing-12: var(--space-12);--spacing-16: var(--space-16);--color-bg-elevated: var(--color-surface-raised);--color-error: var(--color-danger);--color-error-hover: var(--color-danger-hover);--color-female: #e879f9;--color-male: #60a5fa;--g-50: color-mix(in srgb, var(--g-500) 6%, transparent);--g-100: color-mix(in srgb, var(--g-500) 14%, transparent);--a-50: color-mix(in srgb, var(--a-500) 6%, transparent);--a-100: color-mix(in srgb, var(--a-500) 14%, transparent);--r-50: color-mix(in srgb, var(--r-500) 6%, transparent);--r-100: color-mix(in srgb, var(--r-500) 14%, transparent);--r-200: color-mix(in srgb, var(--r-500) 24%, transparent);--r-800: #450a0a;--p-100: color-mix(in srgb, var(--p-600) 14%, transparent);--t-100: color-mix(in srgb, var(--t-500) 14%, transparent);--gradient-page: linear-gradient( 145deg, #0b100d 0%, #0d1610 55%, #0a0f0c 100% );--gradient-card: linear-gradient(135deg, var(--n-050) 0%, #131c16 100%);--gradient-nav: linear-gradient(90deg, #0e1510 0%, var(--n-050) 100%);--gradient-brand: linear-gradient(90deg, var(--g-500) 0%, var(--t-500) 100%)}@keyframes dot-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4}body{line-height:var(--leading-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,video,svg{display:block;max-width:100%}button,input,select,textarea{font:inherit}button{cursor:pointer;border:none;background:none}a{color:inherit;text-decoration:none}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.app-shell{display:flex;flex-direction:column;height:100%}.app-shell__main{flex:1;overflow-y:auto;padding-bottom:calc(var(--bottom-tab-height) + env(safe-area-inset-bottom,0px));scrollbar-width:none}.app-shell__main::-webkit-scrollbar{display:none}.header{height:var(--header-height);background:color-mix(in srgb,var(--color-surface) 80%,transparent);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:var(--z-sticky);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.header__inner{display:flex;align-items:center;gap:var(--spacing-4);height:100%;padding:0 var(--spacing-4);max-width:1200px;margin:0 auto}.header__logo{display:flex;align-items:center;gap:var(--spacing-2);text-decoration:none;flex-shrink:0}.header__logo-mark{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--gradient-brand);border-radius:var(--radius-lg);color:#fff;flex-shrink:0}.header__logo-text{font-size:var(--text-lg);font-weight:var(--font-weight-bold);color:var(--color-text-primary);letter-spacing:-.02em}.header__nav{display:none;gap:var(--spacing-1);margin-left:var(--spacing-4)}@media(min-width:768px){.header__nav{display:flex}}.header__nav-link{padding:var(--spacing-2) var(--spacing-3);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);text-decoration:none;transition:background .12s,color .12s}.header__nav-link:hover{background:var(--color-bg-elevated);color:var(--color-text-primary)}.header__nav-link.active{background:var(--color-bg-elevated);color:var(--color-text-primary);box-shadow:inset 0 -2px 0 var(--color-primary)}.header__spacer{flex:1}.header__burger{background:none;border:none;padding:var(--spacing-2);border-radius:var(--radius-md);cursor:pointer;color:var(--color-text-secondary);display:flex;align-items:center;justify-content:center}.header__burger:hover{background:var(--color-bg-elevated);color:var(--color-text-primary)}.header__menu-btn{display:flex;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:var(--spacing-2);border-radius:var(--radius-md);width:44px;height:44px;flex-shrink:0;color:var(--color-text-secondary)}.header__menu-btn span{display:block;height:2px;width:20px;background:currentColor;border-radius:2px;transition:opacity .15s}.header__menu-btn:hover{background:var(--color-surface-raised);color:var(--color-text-primary)}@media(min-width:768px){.header__menu-btn{display:none}}.bottom-tab-bar{position:fixed;bottom:0;left:0;right:0;height:calc(var(--bottom-tab-height) + env(safe-area-inset-bottom,0px));background:var(--gradient-nav);border-top:1px solid var(--color-border);display:flex;z-index:var(--z-sticky);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}@media(min-width:768px){.bottom-tab-bar{display:none}}.bottom-tab-bar__tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-decoration:none;font-size:var(--text-xs);font-weight:var(--font-weight-medium);color:var(--color-text-muted);transition:color .12s;padding:var(--spacing-1);min-height:44px;position:relative;background:none;border:none;cursor:pointer}.bottom-tab-bar__tab.bottom-tab-bar__tab--active,.bottom-tab-bar__tab:hover{color:var(--color-primary)}.bottom-tab-bar__tab.bottom-tab-bar__tab--active:before{content:"";position:absolute;top:6px;left:50%;transform:translate(-50%);width:20px;height:3px;background:var(--color-primary);border-radius:var(--radius-full)}.bottom-tab-bar__icon{display:flex;align-items:center;justify-content:center;line-height:1}.burger-overlay,.burger-menu__backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;z-index:var(--z-modal)}.burger-menu{position:fixed;top:0;right:0;bottom:0;width:min(320px,85vw);background:var(--gradient-nav);border-left:1px solid var(--color-border);z-index:calc(var(--z-modal) + 1);display:flex;flex-direction:column;padding:var(--spacing-6) var(--spacing-4);overflow-y:auto;gap:var(--spacing-4);transition:transform .25s cubic-bezier(.4,0,.2,1)}.burger-menu--closed{transform:translate(100%)}.burger-menu__close{align-self:flex-end;background:none;border:none;font-size:var(--text-xl);cursor:pointer;color:var(--color-text-secondary);padding:var(--spacing-1);line-height:1}.burger-menu__section{display:flex;flex-direction:column;gap:var(--spacing-1)}.burger-menu__label{font-size:var(--text-xs);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);padding:0 var(--spacing-3);margin-bottom:var(--spacing-1)}.burger-menu__link{display:block;padding:var(--spacing-2) var(--spacing-3);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);text-decoration:none;transition:background .12s,color .12s}.burger-menu__link:hover,.burger-menu__link.active{background:var(--color-bg-elevated);color:var(--color-text-primary)}.burger-menu__logout{display:block;width:100%;padding:var(--spacing-2) var(--spacing-3);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);background:none;border:none;text-align:right;cursor:pointer;transition:background .12s,color .12s}.burger-menu__logout:hover{background:var(--color-bg-elevated);color:var(--color-text-primary)}.burger-menu__divider{height:1px;background:var(--color-border-subtle);margin:var(--spacing-2) 0}.page{max-width:800px;margin:0 auto;padding:var(--spacing-6) var(--spacing-4);display:flex;flex-direction:column;gap:var(--spacing-6)}.page__header{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-4);flex-wrap:wrap}.page__title{font-size:var(--text-2xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);line-height:var(--leading-tight);margin:0}.page__empty{color:var(--color-text-muted);font-size:var(--text-sm);padding:var(--spacing-8) 0;text-align:center}.page__empty a{color:var(--color-primary);text-decoration:underline}.empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-3);padding:var(--space-10) var(--space-4);color:var(--color-text-muted)}.empty-state__title{font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text)}.empty-state__description{font-size:var(--text-sm);color:var(--color-text-secondary)}.detail-nav{display:flex;align-items:center;justify-content:space-between;padding:var(--space-2) var(--space-4);position:sticky;top:var(--header-height);z-index:var(--z-sticky);background:var(--color-bg)}.detail-nav__btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);background:none;border:none;cursor:pointer;color:var(--color-text-secondary);transition:background .12s,color .12s}.detail-nav__btn:hover{background:var(--color-surface-raised);color:var(--color-text-primary)}.section{display:flex;flex-direction:column;gap:var(--spacing-4)}.section--danger{border:1px solid var(--color-error);border-radius:var(--radius-lg);padding:var(--spacing-4)}.section-header{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-4)}.section-title{font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);border:none;border-radius:var(--radius-md);font-family:inherit;font-weight:var(--font-weight-medium);cursor:pointer;transition:background .12s,color .12s,opacity .12s,box-shadow .12s;text-decoration:none;white-space:nowrap;flex-shrink:0}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--sm{font-size:var(--text-xs);padding:var(--spacing-1) var(--spacing-3);height:2rem;min-height:36px}.btn--md{font-size:var(--text-sm);padding:var(--spacing-2) var(--spacing-4);height:2.5rem}.btn--lg{font-size:var(--text-base);padding:var(--spacing-3) var(--spacing-6);height:3rem}.btn--primary{background:var(--color-primary);color:#fff}.btn--primary:hover:not(:disabled){background:var(--g-600)}.btn--secondary{background:var(--color-bg-elevated);color:var(--color-text-primary);border:1px solid var(--color-border)}.btn--secondary:hover:not(:disabled){background:var(--color-border-subtle)}.btn--primary:active,.btn--secondary:active{transform:scale(.97);box-shadow:none;transition:transform 80ms}.btn--danger{background:var(--color-error);color:#fff}.btn--danger:hover:not(:disabled){background:var(--r-600)}.btn--ghost{background:transparent;color:var(--color-text-secondary)}.btn--ghost:hover:not(:disabled){background:var(--color-bg-elevated);color:var(--color-text-primary)}.btn__spinner{width:1em;height:1em;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.form{display:flex;flex-direction:column;gap:var(--spacing-4);max-width:480px}.form-field{display:flex;flex-direction:column;gap:var(--spacing-1)}.form-field__label{font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.form-field__label--required:after{content:" *";color:var(--color-error)}.form-field__error{font-size:var(--text-xs);color:var(--color-danger-text);margin-top:var(--space-1);display:block}.input,.form-input,.select,.form-select,.textarea{width:100%;padding:var(--spacing-2) var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-input);color:var(--color-text-primary);font-family:inherit;font-size:var(--text-sm);min-height:var(--touch-target);transition:border-color .12s,box-shadow .12s;-webkit-appearance:none}.input:focus,.form-input:focus,.select:focus,.form-select:focus,.textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--g-500) 18%,transparent)}.input::placeholder,.form-input::placeholder,.textarea::placeholder{color:var(--color-text-muted)}.select,.form-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%237d9483' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;background-size:1.25rem;padding-right:2.5rem;cursor:pointer}.textarea{min-height:6rem;resize:vertical}.form__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--spacing-4)}.form__actions{display:flex;justify-content:flex-end;gap:var(--spacing-2);padding-top:var(--spacing-2)}@media(max-width:600px){.form__actions{flex-direction:row-reverse}}.inline-form{display:flex;align-items:flex-end;gap:var(--spacing-3);flex-wrap:wrap}@media(max-width:600px){.inline-form{flex-direction:column}}.filter-bar{display:flex;flex-direction:column;gap:var(--space-2)}@media(min-width:640px){.filter-bar{flex-direction:row;align-items:center}}.filter-bar__search{flex:1;min-width:0}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:var(--spacing-4)}.modal{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);width:100%;max-width:480px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden}.modal__header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-5) var(--spacing-6) var(--spacing-4);border-bottom:1px solid var(--color-border-subtle)}.modal__title{font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.modal__close{background:none;border:none;cursor:pointer;padding:var(--spacing-1);font-size:var(--text-xl);color:var(--color-text-muted);line-height:1;border-radius:var(--radius-sm)}.modal__close:hover{color:var(--color-text-primary);background:var(--color-surface-raised)}.modal__body{padding:var(--spacing-5) var(--spacing-6);overflow-y:auto;flex:1}.modal__footer{padding:var(--spacing-4) var(--spacing-6);border-top:1px solid var(--color-border-subtle);display:flex;justify-content:flex-end;gap:var(--spacing-2)}.badge{display:inline-flex;align-items:center;padding:.15em .55em;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-weight-semibold);line-height:1.4;white-space:nowrap}.badge--primary{background:var(--color-primary-subtle);color:var(--color-primary-text)}.badge--warning{background:var(--color-warning-subtle);color:var(--color-warning-text)}.badge--danger{background:var(--color-danger-subtle);color:var(--color-danger-text)}.badge--muted{background:var(--color-surface-raised);color:var(--color-text-muted)}.badge--info{background:var(--color-info-subtle);color:var(--color-info-text)}.badge--purple{background:var(--color-accent-subtle);color:var(--color-accent-text)}.feeding-dot{width:.5rem;height:.5rem;border-radius:50%;display:inline-block;flex-shrink:0}.feeding-dot--ok,.feeding-dot--fed{background:var(--g-500)}.feeding-dot--warn,.feeding-dot--approaching{background:var(--a-500);animation:dot-pulse 2s ease-in-out infinite}.feeding-dot--overdue{background:var(--r-500);animation:dot-pulse 1.2s ease-in-out infinite}.animal-card__photo-dot{position:absolute;top:var(--space-2);right:var(--space-2);width:10px;height:10px;border-radius:50%;flex-shrink:0;outline:2px solid var(--color-surface);outline-offset:0}.tabs{display:flex;flex-direction:column;gap:var(--spacing-4)}.tabs__list{display:flex;gap:var(--spacing-1);border-bottom:1px solid var(--color-border-subtle)}.tabs__tab{padding:var(--spacing-2) var(--spacing-4);background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted);cursor:pointer;transition:color .12s,border-color .12s}.tabs__tab:hover{color:var(--color-text-secondary)}.tabs__tab--active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.tab-panel{display:flex;flex-direction:column;gap:var(--spacing-3);animation:tabFadeIn .1s ease both}@keyframes tabFadeIn{0%{opacity:0}to{opacity:1}}.skeleton{background:linear-gradient(90deg,var(--n-100) 25%,var(--n-200) 37%,var(--n-100) 63%);background-size:400% 100%;animation:shimmer 1.4s ease infinite;border-radius:var(--radius-md)}@keyframes shimmer{0%{background-position:100% 50%}to{background-position:0% 50%}}.spinner{width:1.5rem;height:1.5rem;border:2px solid var(--color-border-subtle);border-top-color:var(--color-primary);border-radius:50%;animation:spin .6s linear infinite}.spinner--lg{width:2.5rem;height:2.5rem;border-width:3px}.page-loader{display:flex;align-items:center;justify-content:center;padding:var(--spacing-16) 0;background:var(--color-background, var(--gradient-page))}.page-transition{animation:fadeInUp .2s ease-out both}@keyframes fadeInUp{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.list{display:flex;flex-direction:column;gap:var(--spacing-2)}.list-item{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);text-decoration:none;color:inherit;transition:box-shadow .12s,border-color .12s}a.list-item:hover{box-shadow:var(--shadow-sm);border-color:var(--color-border-subtle)}.list-item__main{flex:1;display:flex;flex-direction:column;gap:var(--spacing-1);min-width:0}.list-item__title{font-size:var(--text-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.list-item__meta{font-size:var(--text-xs);color:var(--color-text-muted)}.list-item__badge{font-size:var(--text-xs);color:var(--color-text-muted);white-space:nowrap;display:flex;align-items:center;flex-shrink:0}.list-item__chevron{transition:transform .12s}a.list-item:hover .list-item__chevron{transform:translate(4px)}.list-item__action-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--color-surface-raised);border-radius:var(--radius-md);flex-shrink:0}.animal-card-wrapper{position:relative;overflow:hidden;border-radius:var(--radius-xl)}.animal-card-actions{position:absolute;top:0;right:0;bottom:0;width:160px;display:flex}.animal-card-action{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);font-size:var(--text-xs);font-weight:var(--font-weight-medium);color:#fff;border:none;cursor:pointer}.animal-card-action--feed{background:var(--color-primary)}.animal-card-action--weight{background:#0d9488}.animal-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-4)}@media(min-width:480px){.animal-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}.animal-card{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:box-shadow .15s,border-color .15s,transform .15s}.animal-card:hover{box-shadow:var(--shadow-md);border-color:var(--color-border-subtle);transform:translateY(-1px)}.animal-card--overdue{border-color:color-mix(in srgb,var(--r-500) 40%,transparent)}.animal-card--inactive{opacity:.6}.animal-card__photo{width:100%;aspect-ratio:4 / 3;object-fit:cover;background:var(--color-bg-elevated);position:relative}.animal-card__photo-placeholder{width:100%;aspect-ratio:4 / 3;background:linear-gradient(145deg,var(--n-100) 0%,var(--n-150) 100%);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:center;color:var(--color-text-muted)}.animal-card__body{padding:var(--spacing-3);display:flex;flex-direction:column;gap:var(--spacing-2);flex:1}.animal-card__header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--spacing-2)}.animal-card__name{font-size:var(--text-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);line-height:var(--leading-tight)}.animal-card__id{font-size:var(--text-xs);color:var(--color-text-muted);font-family:JetBrains Mono,monospace}.animal-card__morph{font-size:var(--text-xs);color:var(--color-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.animal-card__footer{display:flex;align-items:center;gap:var(--spacing-2);margin-top:auto;border-top:1px solid var(--color-border);padding-top:var(--space-1)}.animal-card__weight{font-size:var(--text-xs);color:var(--color-text-muted);margin-left:auto}.het-selector{display:flex;flex-direction:column;gap:var(--spacing-2)}.het-selector__row{display:flex;gap:var(--spacing-2);flex-wrap:wrap}.het-selector__option{display:flex;align-items:center;gap:var(--spacing-2);cursor:pointer;padding:var(--spacing-2) var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-xs);font-weight:var(--font-weight-medium);transition:background .12s,border-color .12s}.het-selector__option input{display:none}.het-selector__option:has(input:checked){background:var(--color-primary-subtle);border-color:var(--color-primary);color:var(--color-primary-text)}.detail-stats{display:flex;gap:var(--spacing-6);flex-wrap:wrap}.detail-stat{display:flex;flex-direction:column;gap:var(--spacing-1)}.detail-stat__value{font-size:var(--text-2xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);line-height:1}.detail-stat__label{font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.detail-notes{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.gene-panel{display:flex;flex-direction:column;gap:var(--spacing-3)}.gene-panel__chips{display:flex;flex-wrap:wrap;gap:var(--spacing-2)}.chip{display:inline-flex;align-items:center;padding:.2em .65em;background:var(--color-accent-subtle);color:var(--color-accent-text);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-weight-medium)}.gene-panel__add{display:flex;gap:var(--spacing-2);align-items:flex-end}.dashboard-hero{border-left:3px solid var(--color-primary);padding-left:var(--space-4)}.dashboard-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-4)}@media(min-width:480px){.dashboard-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}}.summary-card{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--spacing-5);display:flex;flex-direction:column;gap:var(--spacing-2);transition:box-shadow .15s,border-color .15s}.summary-card:hover{box-shadow:var(--shadow-sm);border-color:var(--color-border-subtle)}.summary-card__icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);flex-shrink:0}.summary-card__label{font-size:var(--text-xs);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted)}.summary-card__value{font-size:var(--text-3xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);line-height:1}.summary-card__sub{font-size:var(--text-xs);color:var(--color-text-muted)}.collection-switcher{display:flex;flex-direction:column;gap:var(--spacing-2)}.collection-switcher__item{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-sm);transition:background .12s}.collection-switcher__item:hover,.collection-switcher__item--active{background:var(--color-bg-elevated)}.collection-switcher__dot{width:8px;height:8px;border-radius:50%;background:var(--color-primary);flex-shrink:0}.collection-switcher__dot--inactive{background:var(--color-border)}.login-page{position:relative;overflow:hidden;min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--gradient-page);background-attachment:fixed;padding:var(--spacing-4)}.login-page:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 800px 600px at 50% 0%,color-mix(in srgb,var(--g-500) 8%,transparent) 0%,transparent 70%);pointer-events:none;z-index:0}.login-card{position:relative;z-index:1;background:var(--gradient-card);border-radius:var(--radius-2xl);padding:var(--spacing-10) var(--spacing-8);width:min(400px,calc(100vw - var(--space-8, 2rem)));display:flex;flex-direction:column;align-items:center;gap:var(--spacing-6);box-shadow:0 0 0 1px var(--color-border),var(--shadow-lg)}.login-card__hero{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-4)}.login-card__logo-mark{color:var(--color-primary);display:flex;align-items:center;justify-content:center}.login-card__brand{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-1)}.login-card__title{font-size:var(--text-3xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);letter-spacing:-.02em;margin:0}.login-card__tagline{font-size:var(--text-sm);color:var(--color-text-muted);text-align:center;margin:0}.login-card__google-btn{display:flex;align-items:center;justify-content:center;gap:var(--spacing-3);width:100%;min-height:var(--touch-target);padding:var(--spacing-3) var(--spacing-4);background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius-xl);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);text-decoration:none;transition:background .12s,border-color .12s,box-shadow .12s;cursor:pointer}.login-card__google-btn:hover{background:var(--color-bg-elevated);border-color:var(--color-border);box-shadow:var(--shadow-sm)}.login-card__error{width:100%;padding:var(--spacing-3) var(--spacing-4);background:var(--color-danger-subtle);border:1px solid var(--color-danger);border-radius:var(--radius-md);color:var(--color-danger-text);font-size:var(--text-sm);text-align:center}.login-card__privacy{font-size:var(--text-xs);color:var(--color-text-muted);text-align:center;margin:0}.genetics-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}.genetics-table th,.genetics-table td{padding:var(--spacing-2) var(--spacing-3);text-align:left;border-bottom:1px solid var(--color-border-subtle)}.genetics-table th{font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em}.warning-banner{display:flex;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);background:var(--color-warning-subtle);border:1px solid var(--a-500);border-left-width:3px;border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--color-warning-text)}.warning-banner--danger{background:var(--color-danger-subtle);border-color:var(--color-danger);color:var(--color-danger-text)}.fab{position:fixed;bottom:calc(var(--bottom-tab-height) + 16px + env(safe-area-inset-bottom,0px));right:16px;width:56px;height:56px;border-radius:50%;background:var(--color-primary);box-shadow:var(--shadow-lg);display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;color:#fff;z-index:40}.fab:active{transform:scale(.95)}.quick-log-sheet__backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:50}.quick-log-sheet{position:fixed;bottom:0;left:0;right:0;background:var(--color-surface);border-radius:var(--radius-xl) var(--radius-xl) 0 0;padding:var(--space-6) var(--space-4) var(--space-8);z-index:51;max-height:80vh;overflow-y:auto;transition:transform .3s ease-out}.quick-log-sheet--closed{transform:translateY(100%)}.quick-log-sheet__handle{width:32px;height:4px;background:var(--color-border);border-radius:var(--radius-full);margin:0 auto var(--space-5)}.quick-log-sheet__title{font-size:var(--text-lg);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-4)}.quick-log-sheet__type-btn{width:100%;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--space-2);cursor:pointer;font-size:var(--text-base);color:var(--color-text-primary);font-family:inherit;transition:background .12s,border-color .12s}.quick-log-sheet__type-btn:hover{background:var(--color-bg-elevated);border-color:var(--color-border-subtle)}.quick-log-sheet__confirm{width:100%;min-height:56px;margin-top:var(--space-4)}.stepper{display:flex;gap:0;margin-bottom:var(--spacing-6)}.stepper__step{flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-2);position:relative}.stepper__step:before{content:"";position:absolute;top:1rem;left:50%;right:-50%;height:2px;background:var(--color-border-subtle);z-index:0}.stepper__step:last-child:before{display:none}.stepper__step--done:before{background:var(--color-primary)}.stepper__dot{width:2rem;height:2rem;border-radius:50%;border:2px solid var(--color-border);background:var(--color-surface);display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);font-weight:var(--font-weight-bold);z-index:1;position:relative;color:var(--color-text-muted)}.stepper__step--active .stepper__dot{border-color:var(--color-primary);color:var(--color-primary)}.stepper__step--done .stepper__dot{border-color:var(--color-primary);background:var(--color-primary);color:#fff}.stepper__label{font-size:var(--text-xs);color:var(--color-text-muted);text-align:center}.stepper__step--active .stepper__label{color:var(--color-primary);font-weight:var(--font-weight-medium)}html,body,#root{height:100%}body{font-family:Inter,system-ui,sans-serif;font-size:var(--text-base);font-weight:var(--font-weight-normal);color:var(--color-text-primary);background:var(--gradient-page);background-attachment:fixed;min-height:100vh;line-height:var(--leading-normal)}.mono{font-family:JetBrains Mono,ui-monospace,monospace}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--color-bg)}::-webkit-scrollbar-thumb{background:var(--color-border-subtle);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--n-400)}