.user-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); gap: 20px; align-items: start; }
.inline-form { display: flex; gap: 8px; align-items: center; margin: 0; }
.inline-form select, .inline-form input { min-width: 120px; padding: 8px; }
.inline-form button { padding: 8px 11px; white-space: nowrap; }
.user-meta { color: var(--muted); font-size: 12px; }
.user-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.module-alert { margin-top: 20px; }
.field-help { color: var(--muted); font-size: 11px; font-weight: 500; }
button:disabled { cursor: not-allowed; opacity: .55; }
.pet-portrait { display: block; width: min(100%, 360px); max-height: 360px; object-fit: cover; border-radius: 14px; border: 1px solid var(--line); margin: 14px 0 18px; }
.portrait-form { display: flex; align-items: end; gap: 10px; margin: 12px 0 20px; }
.record-client { display: flex; align-items: center; gap: 11px; }
.pet-thumb { width: 44px; height: 44px; flex: 0 0 44px; object-fit: cover; border-radius: 50%; border: 1px solid var(--line); background: var(--mint); }
.pet-thumb.placeholder { display: grid; place-items: center; font-size: 19px; }
.calendar-nav { display: flex; justify-content: center; gap: 10px; margin-top: 18px; }
.calendar { padding: 0; overflow: hidden; }
.calendar-weekdays,.calendar-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); }
.calendar-weekdays { background: var(--navy); color: white; }
.calendar-weekdays strong { padding: 10px; text-align: center; font-size: 11px; text-transform: uppercase; }
.calendar-day { min-height: 125px; padding: 9px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: white; }
.calendar-day.outside { background: #f3f5f3; color: #9aa4a6; }
.calendar-day.today { box-shadow: inset 0 0 0 2px var(--coral); }
.day-number { display: block; font-size: 12px; font-weight: 800; margin-bottom: 7px; }
.calendar-event { display: block; padding: 6px 7px; margin: 4px 0; border-radius: 6px; background: #e3edf6; color: #355f85; text-decoration: none; font-size: 10px; line-height: 1.25; }
.calendar-event strong,.calendar-event span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-event.submitted,.calendar-event.needs_changes { background: #fff1d8; color: #8b5a13; }
.calendar-event.approved { background: #dff3e5; color: #286641; }
.calendar-event.declined { background: #f7dddd; color: #873838; }
.agreement { max-width: 850px; margin: 20px auto; }
.agreement h2 { margin-top: 28px; color: var(--navy); }
.agreement p { max-width: 76ch; }
.upgrade-layout { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(0, 1.4fr); gap: 20px; align-items: start; }
.upgrade-layout > .card { position: sticky; top: 20px; }
.upgrade-list .card { margin-top: 20px; }
.upgrade-card h2 { margin-top: 4px; }
.upgrade-category { color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .8px; text-transform: uppercase; }
.upgrade-badges { display: flex; align-items: flex-end; gap: 6px; flex-direction: column; }
.priority { display: inline-block; padding: 4px 8px; border-radius: 20px; background: #edf1ef; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.priority.important { background: #fff1d8; color: #8b5a13; }
.priority.urgent { background: #f7dddd; color: #873838; }
.status.planned { background: #e3edf6; color: #355f85; }
.status.in_progress { background: #fff1d8; color: #8b5a13; }
.status.completed { background: #dff3e5; color: #286641; }
.upgrade-description { white-space: normal; }
details { border-top: 1px solid var(--line); margin-top: 18px; padding-top: 14px; }
summary { cursor: pointer; color: var(--navy); font-weight: 800; }
@media (max-width: 850px) { .user-grid { grid-template-columns: 1fr; } .inline-form { align-items: stretch; flex-direction: column; } }
@media (max-width: 720px) { .calendar { overflow-x: auto; } .calendar-weekdays,.calendar-grid { min-width: 760px; } .calendar-nav { justify-content: flex-start; overflow-x: auto; } .upgrade-layout { grid-template-columns: 1fr; } .upgrade-layout > .card { position: static; } }
