:root { --camino-art-yellow: var(--brand-sun-500, #F2A900); --camino-art-yellow-soft: #fff0c7; }
.camino-ui-icon { display: inline-block; width: 22px; height: 22px; vertical-align: middle; flex-shrink: 0; pointer-events: none; }
.site-header .site-header__control { display: grid; place-items: center; min-width: 36px; min-height: 36px; padding: 6px; border: 1px solid var(--brand-stone-300, #e3dccf); border-radius: 11px; color: var(--brand-sea-900, #12297a); background: var(--brand-stone-100, #f5f1e8); box-shadow: 0 2px 5px #12297a0a; cursor: pointer; }
.site-header .site-header__control[aria-pressed="true"] { background: var(--camino-art-yellow); border-color: var(--camino-art-yellow); box-shadow: 0 3px 8px #f2a90033; }
.site-header__control:focus-visible,
.password-toggle:focus-visible { outline: 2px solid #4057b2; outline-offset: 3px; }
.password-toggle { background: var(--camino-art-yellow-soft); border-radius: 9px; color: var(--brand-sea-900, #12297a); min-width: 36px; min-height: 36px; }
.daily-reminder-icon { color: var(--brand-sea-900, #12297a); display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: var(--camino-art-yellow); }
.camino-avatar-art { display: inline-block; width: 32px; height: 32px; object-fit: contain; vertical-align: middle; flex-shrink: 0; }
.leaderboard-avatar { display: inline-flex; width: 20px; height: 20px; margin-right: 6px; vertical-align: middle; }
.leaderboard-avatar .camino-avatar-art { width: 20px; height: 20px; }
.user-sticker-avatar .camino-avatar-art { width: 24px; height: 24px; }
.profile-avatar > .camino-avatar-art { width: 64%; height: 64%; }
.avatar-item .camino-avatar-art { width: 36px; height: 36px; }
.badge-emoji .camino-avatar-art { width: 32px; height: 32px; }
.edit-avatar-badge .camino-ui-icon { width: 15px; height: 15px; }
.profile-avatar { background: var(--camino-art-yellow-soft); border: 1px solid var(--camino-art-yellow); box-shadow: 0 2px 8px #12297a0a; }
.site-header .site-header__control:hover,
.password-toggle:hover,
.password-toggle[aria-pressed="true"] { background: var(--camino-art-yellow); color: var(--brand-sea-900, #12297a); }
#daily-reminder-enable-btn { background: var(--camino-art-yellow); border-color: var(--camino-art-yellow); color: var(--brand-sea-950, #0c1d57); }
#daily-reminder-enable-btn:hover { background: var(--camino-art-yellow-soft); border-color: var(--camino-art-yellow); }
#daily-reminder-disable-btn { background: var(--camino-art-yellow-soft); color: var(--brand-sea-950, #0c1d57); }
.avatar-item.selected { background: var(--camino-art-yellow-soft); border-color: var(--camino-art-yellow); }
.edit-avatar-badge { background: var(--camino-art-yellow); color: var(--brand-sea-900, #12297a); }
.camino-inline-icon { display: inline-block; width: 1.25em; height: 1.25em; object-fit: contain; vertical-align: -0.22em; flex-shrink: 0; }
button .camino-inline-icon,
.daily-arrow .camino-inline-icon,
.leaderboard-table td .camino-inline-icon { width: 20px; height: 20px; }
.onboarding-emoji .camino-inline-icon { width: 32px; height: 32px; }
.daily-streak-flame .camino-inline-icon { width: 24px; height: 24px; }
.avatar-item.locked::after { content: ''; background: #fff url('/src/public/icons/lock.svg') center / 13px 13px no-repeat; }
.mobile-mode-card__icon > img { display: block; width: 34px; height: 34px; }
.mobile-mode-card--camino .mobile-mode-card__icon { background: linear-gradient(145deg, var(--brand-sea-900, #12297a), var(--brand-sea-950, #0c1d57)); box-shadow: 0 4px 12px #12297a33; }
.mobile-mode-card--daily .mobile-mode-card__icon { background: var(--camino-art-yellow); box-shadow: 0 4px 12px #f2a90033; }
.mobile-mode-card--collect .mobile-mode-card__icon { background: linear-gradient(145deg, #d24a43, #a82d2b); box-shadow: 0 4px 12px #a82d2b44; }