:root{--color-bg: #F5F3F0;--color-bg-secondary: #ECEAE6;--color-surface: #FFFFFF;--color-surface-hover: #FAFAF8;--color-border: #E5E3DF;--color-border-light: #EEECE8;--color-text: #1A1A1A;--color-text-secondary: #6B6B6B;--color-text-tertiary: #9B9B99;--color-text-inverse: #FFFFFF;--color-primary: #4A6741;--color-primary-light: #E8EFE7;--color-primary-hover: #3D5636;--color-primary-text: #FFFFFF;--color-accent: #C17F59;--color-accent-light: #F5EDE7;--color-danger: #B94A3D;--color-danger-light: #FDECEA;--color-warning: #D4851F;--color-warning-light: #FEF5E7;--color-success: #3D8B5E;--color-success-light: #E8F5EE;--color-info: #4A7091;--color-info-light: #E7F0F7;--font-sans: "Inter", "Noto Sans Thai", "Leelawadee UI", "Tahoma", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-size-xs: .6875rem;--font-size-sm: .8125rem;--font-size-base: .9375rem;--font-size-lg: 1.0625rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.625;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 20px;--radius-full: 9999px;--shadow-xs: 0 1px 2px rgba(0,0,0,.04);--shadow-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.03);--shadow-md: 0 4px 12px rgba(0,0,0,.06), 0 2px 4px rgba(0,0,0,.03);--shadow-lg: 0 12px 28px rgba(0,0,0,.08), 0 4px 8px rgba(0,0,0,.04);--sidebar-width: 240px;--topbar-height: 60px;--transition-fast: .15s ease;--transition-normal: .25s ease;--transition-slow: .35s ease}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:var(--line-height-normal);color:var(--color-text);background-color:var(--color-bg);overflow-x:hidden}a{color:inherit;text-decoration:none}button{font-family:inherit;font-size:inherit;cursor:pointer;border:none;background:none;color:inherit}input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}img{max-width:100%;display:block}h1,h2,h3,h4{font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight)}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-base{font-size:var(--font-size-base)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-2xl{font-size:var(--font-size-2xl)}.text-3xl{font-size:var(--font-size-3xl)}.text-secondary{color:var(--color-text-secondary)}.text-tertiary{color:var(--color-text-tertiary)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.app-container{display:flex;min-height:100vh}.sidebar{position:fixed;top:0;left:0;width:var(--sidebar-width);height:100vh;background:var(--color-surface);border-right:1px solid var(--color-border);display:flex;flex-direction:column;z-index:100;transition:transform var(--transition-normal)}.sidebar-brand{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-6) var(--space-5);border-bottom:1px solid var(--color-border-light)}.brand-icon{color:var(--color-primary);flex-shrink:0}.brand-text{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);letter-spacing:-.02em;color:var(--color-text)}.sidebar-nav{flex:1;padding:var(--space-3) var(--space-3);overflow-y:auto}.nav-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:all var(--transition-fast);margin-bottom:2px}.nav-item:hover{background:var(--color-bg);color:var(--color-text)}.nav-item.active{background:var(--color-primary-light);color:var(--color-primary)}.nav-item.active svg{stroke:var(--color-primary)}.sidebar-footer{padding:var(--space-4) var(--space-3);border-top:1px solid var(--color-border-light);display:flex;gap:var(--space-2)}.sidebar-action-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);text-decoration:none;transition:all var(--transition-fast)}.sidebar-action-btn[hidden]{display:none}.sidebar-action-btn:hover{background:var(--color-bg);color:var(--color-text)}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#0000004d;z-index:99;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.main{margin-left:var(--sidebar-width);flex:1;min-height:100vh;display:flex;flex-direction:column}.topbar{position:sticky;top:0;height:var(--topbar-height);background:#f5f3f0d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border-light);display:flex;align-items:center;padding:0 var(--space-8);gap:var(--space-4);z-index:50}.menu-btn{display:none;width:36px;height:36px;align-items:center;justify-content:center;border-radius:var(--radius-sm);color:var(--color-text-secondary);transition:all var(--transition-fast)}.menu-btn:hover{background:var(--color-bg-secondary)}.page-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);letter-spacing:-.01em}.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:var(--space-2)}.content{flex:1;padding:var(--space-8);max-width:1200px;width:100%}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:1;white-space:nowrap;transition:all var(--transition-fast);height:36px}.btn-primary{background:var(--color-primary);color:var(--color-primary-text)}.btn-primary:hover{background:var(--color-primary-hover)}.btn-secondary{background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{background:var(--color-bg-secondary)}.btn-danger{background:var(--color-danger-light);color:var(--color-danger)}.btn-danger:hover{background:var(--color-danger);color:#fff}.btn-ghost{color:var(--color-text-secondary)}.btn-ghost:hover{background:var(--color-bg);color:var(--color-text)}.btn-sm{height:30px;padding:var(--space-1) var(--space-3);font-size:var(--font-size-xs)}.btn-lg{height:42px;padding:var(--space-3) var(--space-6);font-size:var(--font-size-base)}.btn-icon{width:36px;height:36px;padding:0;border-radius:var(--radius-sm);color:var(--color-text-secondary)}.btn-icon:hover{background:var(--color-bg);color:var(--color-text)}.form-group{margin-bottom:var(--space-5)}.form-label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);margin-bottom:var(--space-2)}.form-input,.form-select,.form-textarea{width:100%;height:40px;padding:var(--space-2) var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);outline:none}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.form-input::placeholder,.form-textarea::placeholder{color:var(--color-text-tertiary)}.form-textarea{height:auto;min-height:80px;resize:vertical}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%236B6B6B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.form-hint{font-size:var(--font-size-xs);color:var(--color-text-tertiary);margin-top:var(--space-1)}.form-check{display:flex;align-items:center;gap:var(--space-2)}.form-check input[type=checkbox]{width:18px;height:18px;accent-color:var(--color-primary)}.card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-lg);overflow:hidden;transition:box-shadow var(--transition-normal),transform var(--transition-normal)}.card:hover{box-shadow:var(--shadow-md)}.card-body{padding:var(--space-5)}.card-header{padding:var(--space-5);border-bottom:1px solid var(--color-border-light);display:flex;align-items:center;justify-content:space-between}.card-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold)}.badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:2px var(--space-2);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);line-height:1.4}.badge-success{background:var(--color-success-light);color:var(--color-success)}.badge-warning{background:var(--color-warning-light);color:var(--color-warning)}.badge-danger{background:var(--color-danger-light);color:var(--color-danger)}.badge-info{background:var(--color-info-light);color:var(--color-info)}.settings-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:var(--space-5)}.settings-grid-user{grid-template-columns:minmax(0,720px)}.session-details{display:grid;gap:var(--space-4)}.session-details div{display:grid;gap:var(--space-1)}.session-details dt{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.04em}.session-details dd{font-size:var(--font-size-sm);color:var(--color-text);overflow-wrap:anywhere}.permission-list{display:grid;gap:var(--space-2)}.permission-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:var(--space-2);align-items:center;padding:var(--space-2) 0;border-bottom:1px solid var(--color-border-light);font-size:var(--font-size-sm)}.permission-row:last-child{border-bottom:0}.permission-cell{border-radius:var(--radius-full);padding:2px var(--space-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.permission-cell.allowed{background:var(--color-success-light);color:var(--color-success)}.permission-cell.denied{background:var(--color-danger-light);color:var(--color-danger)}.badge-neutral{background:var(--color-bg-secondary);color:var(--color-text-secondary)}.table-wrapper{overflow-x:auto;border:1px solid var(--color-border-light);border-radius:var(--radius-md)}table{width:100%;border-collapse:collapse}th{text-align:left;padding:var(--space-3) var(--space-4);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;background:var(--color-bg);border-bottom:1px solid var(--color-border)}td{padding:var(--space-3) var(--space-4);font-size:var(--font-size-sm);border-bottom:1px solid var(--color-border-light);vertical-align:middle}tr:last-child td{border-bottom:none}tr:hover td{background:var(--color-surface-hover)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:200;padding:var(--space-4);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fadeIn .2s ease}.modal{background:var(--color-surface);border-radius:var(--radius-lg);width:100%;max-width:560px;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-lg);animation:slideUp .25s ease}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--color-border-light)}.modal-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold)}.modal-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);color:var(--color-text-tertiary);transition:all var(--transition-fast)}.modal-close:hover{background:var(--color-bg);color:var(--color-text)}.modal-body{padding:var(--space-6)}.modal-footer{display:flex;justify-content:flex-end;gap:var(--space-3);padding:var(--space-4) var(--space-6);border-top:1px solid var(--color-border-light)}.toast-container{position:fixed;bottom:var(--space-6);right:var(--space-6);z-index:300;display:flex;flex-direction:column;gap:var(--space-2)}.toast{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-5);background:var(--color-text);color:var(--color-text-inverse);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);box-shadow:var(--shadow-lg);animation:slideInRight .3s ease;min-width:240px}.toast-success{border-left:3px solid var(--color-success)}.toast-error{border-left:3px solid var(--color-danger)}.toast-warning{border-left:3px solid var(--color-warning)}.toast-info{border-left:3px solid var(--color-info)}.toast-exit{animation:slideOutRight .25s ease forwards}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-16) var(--space-8);text-align:center;color:var(--color-text-tertiary)}.empty-state svg{margin-bottom:var(--space-4);opacity:.4}.empty-state h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);margin-bottom:var(--space-2)}.empty-state p{font-size:var(--font-size-sm);margin-bottom:var(--space-6);max-width:320px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-4);margin-bottom:var(--space-8)}.stat-card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-lg);padding:var(--space-5)}.stat-label{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-2)}.stat-value{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.stat-sub{font-size:var(--font-size-xs);color:var(--color-text-tertiary);margin-top:var(--space-1)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-5)}.section-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text)}.cats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--space-4);margin-bottom:var(--space-8)}.cat-card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-lg);padding:var(--space-5);text-align:center;cursor:pointer;transition:all var(--transition-normal);position:relative}.cat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.cat-avatar{width:72px;height:72px;border-radius:var(--radius-full);object-fit:cover;margin:0 auto var(--space-3);border:3px solid var(--color-border-light)}.cat-avatar-placeholder{width:72px;height:72px;border-radius:var(--radius-full);background:var(--color-bg-secondary);display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-3);font-size:1.75rem}.cat-card-name{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-1)}.cat-card-info{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.cat-card-add{display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px dashed var(--color-border);background:transparent;min-height:180px}.cat-card-add:hover{border-color:var(--color-primary);background:var(--color-primary-light)}.cat-card-add svg{color:var(--color-text-tertiary);margin-bottom:var(--space-2)}.cat-card-add span{font-size:var(--font-size-sm);color:var(--color-text-tertiary);font-weight:var(--font-weight-medium)}.profile-header{display:flex;align-items:center;gap:var(--space-6);padding:var(--space-6);background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-lg);margin-bottom:var(--space-6)}.profile-avatar{width:100px;height:100px;border-radius:var(--radius-full);object-fit:cover;border:3px solid var(--color-border-light);flex-shrink:0}.profile-avatar-placeholder{width:100px;height:100px;border-radius:var(--radius-full);background:var(--color-bg-secondary);display:flex;align-items:center;justify-content:center;font-size:2.5rem;flex-shrink:0}.profile-info h2{font-size:var(--font-size-2xl);margin-bottom:var(--space-1)}.profile-info p{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.profile-actions{margin-left:auto;display:flex;gap:var(--space-2)}.profile-tabs{display:flex;gap:var(--space-1);border-bottom:1px solid var(--color-border-light);margin-bottom:var(--space-6)}.profile-tab{padding:var(--space-3) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);border-bottom:2px solid transparent;transition:all var(--transition-fast);cursor:pointer;background:none}.profile-tab:hover{color:var(--color-text)}.profile-tab.active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.visit-card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-lg);padding:var(--space-5);margin-bottom:var(--space-4);transition:box-shadow var(--transition-normal);cursor:pointer}.visit-card:hover{box-shadow:var(--shadow-sm)}.visit-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3)}.visit-vn{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-primary);background:var(--color-primary-light);padding:2px var(--space-2);border-radius:var(--radius-sm)}.visit-date{font-size:var(--font-size-xs);color:var(--color-text-tertiary)}.visit-cat{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3)}.visit-cat-avatar{width:28px;height:28px;border-radius:var(--radius-full);object-fit:cover}.visit-cat-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.visit-details{display:grid;grid-template-columns:auto 1fr;gap:var(--space-1) var(--space-3);font-size:var(--font-size-sm)}.visit-detail-label{color:var(--color-text-tertiary);font-weight:var(--font-weight-medium)}.visit-detail-value{color:var(--color-text)}.visit-cost{display:flex;align-items:center;justify-content:flex-end;margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--color-border-light);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-accent)}.vaccine-timeline{position:relative;padding-left:var(--space-6)}.vaccine-timeline:before{content:"";position:absolute;left:8px;top:4px;bottom:4px;width:2px;background:var(--color-border)}.vaccine-item{position:relative;padding:var(--space-4);padding-left:var(--space-5);background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-md);margin-bottom:var(--space-3)}.vaccine-item:before{content:"";position:absolute;left:calc(-1 * var(--space-6) - 1px + 4px);top:50%;transform:translateY(-50%);width:10px;height:10px;border-radius:var(--radius-full);background:var(--color-primary);border:2px solid var(--color-surface)}.vaccine-item.overdue:before{background:var(--color-danger)}.vaccine-item.upcoming:before{background:var(--color-warning)}.appointment-list{display:flex;flex-direction:column;gap:var(--space-3)}.appointment-card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5);display:flex;align-items:center;gap:var(--space-4);transition:box-shadow var(--transition-fast)}.appointment-card:hover{box-shadow:var(--shadow-sm)}.appointment-date-block{text-align:center;min-width:48px;flex-shrink:0}.appointment-day{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);line-height:1;color:var(--color-primary)}.appointment-month{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-tertiary);text-transform:uppercase}.appointment-info{flex:1;min-width:0}.appointment-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);margin-bottom:var(--space-1)}.appointment-meta{font-size:var(--font-size-xs);color:var(--color-text-tertiary)}.expense-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-4);margin-bottom:var(--space-6)}.expense-chart-container{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-lg);padding:var(--space-5);margin-bottom:var(--space-6)}.chart-canvas-wrapper{position:relative;height:280px}.weight-chart-container{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-lg);padding:var(--space-5);margin-bottom:var(--space-6)}.weight-legend{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-bottom:var(--space-4)}.weight-legend-item{display:flex;align-items:center;gap:var(--space-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.weight-legend-dot{width:10px;height:10px;border-radius:var(--radius-full)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.mt-2{margin-top:var(--space-2)}.mt-4{margin-top:var(--space-4)}.mt-6{margin-top:var(--space-6)}.mb-2{margin-bottom:var(--space-2)}.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.mb-8{margin-bottom:var(--space-8)}.hidden{display:none!important}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list-toolbar{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-5);flex-wrap:wrap}.filter-select{height:36px;padding:var(--space-1) var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);color:var(--color-text);outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%236B6B6B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:30px}.search-input{height:36px;padding:var(--space-1) var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);outline:none;width:200px;transition:border-color var(--transition-fast)}.search-input:focus{border-color:var(--color-primary)}.photo-upload{width:100px;height:100px;border-radius:var(--radius-full);border:2px dashed var(--color-border);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-fast);overflow:hidden;position:relative;margin:0 auto var(--space-4)}.photo-upload:hover{border-color:var(--color-primary);background:var(--color-primary-light)}.photo-upload img{width:100%;height:100%;object-fit:cover}.photo-upload input[type=file]{display:none}.photo-upload-label{font-size:var(--font-size-xs);color:var(--color-text-tertiary);text-align:center}.visit-detail{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-lg);overflow:hidden}.visit-detail-header{padding:var(--space-6);border-bottom:1px solid var(--color-border-light);display:flex;align-items:center;gap:var(--space-4)}.visit-detail-body{padding:var(--space-6)}.visit-detail-section{margin-bottom:var(--space-6)}.visit-detail-section:last-child{margin-bottom:0}.visit-detail-section h4{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-3)}.visit-detail-section p{font-size:var(--font-size-sm);line-height:var(--line-height-relaxed)}.medications-list{list-style:none}.medication-item{padding:var(--space-3);background:var(--color-bg);border-radius:var(--radius-sm);margin-bottom:var(--space-2);font-size:var(--font-size-sm)}.medication-name{font-weight:var(--font-weight-medium);margin-bottom:var(--space-1)}.medication-detail{color:var(--color-text-secondary);font-size:var(--font-size-xs)}.confirm-message{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--space-4)}.back-btn{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--space-4);padding:var(--space-1) 0;cursor:pointer;transition:color var(--transition-fast);background:none;border:none}.back-btn:hover{color:var(--color-text)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}@keyframes slideOutRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(24px)}}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:768px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-overlay.visible{display:block}.main{margin-left:0}.menu-btn{display:flex}.content{padding:var(--space-4)}.topbar{padding:0 var(--space-4)}.cats-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.profile-header{flex-direction:column;text-align:center}.profile-actions{margin-left:0}.form-row{grid-template-columns:1fr}.stats-grid,.settings-grid{grid-template-columns:repeat(2,1fr)}.visit-header{flex-direction:column;align-items:flex-start;gap:var(--space-2)}.appointment-card{flex-direction:column;align-items:flex-start}.list-toolbar{flex-direction:column;align-items:stretch}.search-input{width:100%}.toast-container{left:var(--space-4);right:var(--space-4);bottom:var(--space-4)}.modal{margin:var(--space-4);max-height:calc(100vh - 2rem)}}@media(max-width:480px){.stats-grid,.settings-grid{grid-template-columns:1fr}.permission-row{grid-template-columns:1fr;align-items:start}.backup-health-grid{grid-template-columns:1fr}.cats-grid{grid-template-columns:1fr 1fr;gap:var(--space-3)}}.danger-summary{display:flex;flex-direction:column;gap:var(--space-4)}.danger-summary p{margin:0}.impact-list{list-style:none;display:grid;gap:var(--space-2);padding:var(--space-3);margin:0;border:1px solid var(--color-danger-light);border-radius:var(--radius-md);background:var(--color-danger-light)}.impact-list li{display:flex;justify-content:space-between;gap:var(--space-4);padding:var(--space-2) 0;border-bottom:1px solid rgba(185,74,61,.16)}.impact-list li:last-child{border-bottom:0}.danger-note{color:var(--color-danger);font-size:var(--font-size-sm)}.audit-log-card,.backup-status-card{grid-column:1 / -1}.backup-health-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-3)}.backup-health-item{border:1px solid var(--color-border-light);border-radius:var(--radius-md);background:var(--color-surface-hover);padding:var(--space-3)}.backup-health-row{overflow-wrap:anywhere}.backup-health-item.empty{color:var(--color-text-secondary)}.backup-health-item dt{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.04em;margin-bottom:var(--space-2)}.backup-health-item dd{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-2);font-size:var(--font-size-sm)}.backup-key{max-width:100%;overflow-wrap:anywhere;color:var(--color-text-tertiary)}.audit-log-list{display:grid;gap:var(--space-3)}.audit-log-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(140px,.45fr) auto;align-items:center;gap:var(--space-4);padding:var(--space-3);border:1px solid var(--color-border-light);border-radius:var(--radius-md);background:var(--color-surface-hover)}.audit-log-row strong{display:block;margin-bottom:var(--space-1)}.audit-log-target{word-break:break-word}.alert{padding:var(--space-3);border-radius:var(--radius-md);margin-bottom:var(--space-4);font-size:var(--font-size-sm)}.alert-warning{color:var(--color-warning);background:var(--color-warning-light);border:1px solid rgba(212,133,31,.24)}.alert-info{color:var(--color-info);background:var(--color-info-light);border:1px solid rgba(42,111,151,.24)}@media(max-width:640px){.audit-log-row{grid-template-columns:1fr;align-items:start}}body.sidebar-open{overflow:hidden;touch-action:none}.profile-quick-actions,.settings-account-actions{display:flex;flex-wrap:wrap;gap:var(--space-3)}.lifecycle-policy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}.lifecycle-policy-item{padding:var(--space-4);border:1px solid var(--color-border-light);border-radius:var(--radius-md);background:var(--color-bg)}@media(pointer:coarse){.btn,.btn-sm,.btn-icon,.modal-close,.sidebar-action-btn{min-height:44px}.btn-icon,.modal-close{min-width:44px}}@media(max-width:768px){.profile-header{align-items:center;text-align:center}.profile-actions{width:100%;justify-content:center;gap:var(--space-3)}.profile-actions .btn,.profile-actions .btn-sm{flex:1 1 140px;min-height:44px}.profile-quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.profile-quick-actions .btn{width:100%;min-height:44px;white-space:normal;line-height:1.25;text-align:center}.modal-footer{position:sticky;bottom:0;background:var(--color-surface);border-top:1px solid var(--color-border-light);padding-top:var(--space-4);z-index:2}.modal-footer .btn{min-height:44px}.settings-account-actions .btn,.settings-account-actions a.btn{flex:1 1 150px;min-height:44px}.lifecycle-policy-grid{grid-template-columns:1fr}}@media(max-width:480px){.profile-quick-actions,.settings-account-actions{grid-template-columns:1fr}.profile-quick-actions .btn,.settings-account-actions .btn,.settings-account-actions a.btn,.modal-footer .btn{width:100%}.cats-grid{grid-template-columns:minmax(0,1fr)}.cat-card{min-width:0}}
