.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-full);overflow:hidden;flex-shrink:0;vertical-align:middle}.avatar--sm{width:20px;height:20px}.avatar--md{width:32px;height:32px}.avatar--lg{width:44px;height:44px}.avatar-img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-full);display:block}.avatar-initial{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--color-primary);color:var(--color-text-inverse);font-weight:600}.avatar--sm .avatar-initial{font-size:var(--font-size-2xs)}.avatar--md .avatar-initial{font-size:var(--font-size-sm)}.avatar--lg .avatar-initial{font-size:var(--font-size-md)}.btn{display:inline-flex;align-items:center;justify-content:center;font-weight:600;border-radius:var(--radius-md);border:none;cursor:pointer;transition:background-color var(--duration-base),transform var(--duration-fast),opacity var(--duration-base);white-space:nowrap;text-decoration:none}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn--sm{font-size:var(--font-size-xs);padding:4px 12px}.btn--md{font-size:var(--font-size-sm);padding:8px 20px}.btn--lg{font-size:var(--font-size-md);padding:14px 32px}.btn--default{--btn-color: var(--color-primary);--btn-color-dark: var(--color-primary-dark);--btn-bg-soft: var(--color-primary-light)}.btn--ai{--btn-color: var(--color-ai);--btn-color-dark: var(--color-ai-dark);--btn-bg-soft: var(--color-ai-bg-hover)}.btn--danger{--btn-color: var(--color-error);--btn-color-dark: var(--color-error-dark);--btn-bg-soft: var(--color-error-light)}.btn--primary{color:var(--color-text-inverse);background-color:var(--btn-color)}.btn--primary:hover:not(:disabled){background-color:var(--btn-color-dark);transform:var(--hover-lift-sm)}.btn--ghost{color:var(--btn-color);background-color:transparent;border:1.5px solid var(--btn-color)}.btn--ghost:hover:not(:disabled){background-color:var(--btn-bg-soft);transform:var(--hover-lift-sm)}.icon-btn{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;font-family:inherit;font-weight:400;line-height:1;padding:0;flex-shrink:0;transition:color var(--duration-base),background-color var(--duration-base)}.icon-btn:disabled{opacity:.35;cursor:not-allowed}.icon-btn--sm{width:24px;height:24px;font-size:var(--font-size-sm)}.icon-btn--md{width:32px;height:32px;font-size:var(--font-size-md)}.icon-btn--lg{width:40px;height:40px;font-size:var(--font-size-lg)}.icon-btn--square{border-radius:var(--radius-md)}.icon-btn--circle{border-radius:var(--radius-full)}.icon-btn--add{--icon-btn-color: var(--color-primary);--icon-btn-color-hover: var(--color-primary);--icon-btn-bg-hover: var(--color-primary-light)}.icon-btn--remove{--icon-btn-color: var(--color-text-muted);--icon-btn-color-hover: var(--color-error);--icon-btn-bg-hover: var(--color-error-light)}.icon-btn--dismiss{--icon-btn-color: var(--color-text-muted);--icon-btn-color-hover: var(--color-text-primary);--icon-btn-bg-hover: var(--color-surface-hover)}.icon-btn--default{color:var(--icon-btn-color)}.icon-btn--default:hover:not(:disabled){color:var(--icon-btn-color-hover);background-color:var(--icon-btn-bg-hover)}.icon-btn--inline{color:currentColor}.icon-btn--inline:hover:not(:disabled){color:var(--icon-btn-color-hover)}.dialog{padding:0;border:none;background:var(--color-surface);color:var(--color-text-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);overflow:auto}.dialog:not([open]){display:none}.dialog[open]{position:fixed;inset:0;margin:auto}.dialog::backdrop{background:#0006}@media(max-width:767px){.dialog[open].dialog--full-page-mobile{inset:var(--header-height) 0 0 0;margin:0;width:100%;max-width:100%;max-height:none;height:auto;min-height:calc(100vh - var(--header-height));border-radius:0;box-shadow:none;overflow-y:auto}.dialog--full-page-mobile::backdrop{background:transparent}}dialog.sign-in-modal{width:100%;max-width:400px;display:flex;flex-direction:column;padding:0}.sign-in-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 0}.sign-in-modal-title{font-size:var(--font-size-md);font-weight:700;color:var(--color-text-primary);margin:0}.sign-in-modal-body{padding:20px;display:flex;flex-direction:column;gap:12px}.sign-in-google-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px;border:1.5px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-primary);cursor:pointer;transition:background-color var(--duration-base),border-color var(--duration-base);font-family:inherit}.sign-in-google-btn:hover{background:var(--color-surface-hover);border-color:var(--color-text-muted)}.sign-in-divider{display:flex;align-items:center;gap:12px;color:var(--color-text-muted);font-size:var(--font-size-xs)}.sign-in-divider:before,.sign-in-divider:after{content:"";flex:1;height:1px;background:var(--color-border)}.sign-in-form{display:flex;flex-direction:column;gap:10px}.sign-in-field{display:flex;flex-direction:column;gap:4px}.sign-in-label{font-size:var(--font-size-xs);font-weight:600;color:var(--color-text-muted)}.sign-in-input{padding:9px 12px;border:1.5px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-family:inherit;color:var(--color-text-primary);background:var(--color-surface);transition:border-color var(--duration-base);outline:none}.sign-in-input:focus{border-color:var(--color-primary)}.sign-in-error{font-size:var(--font-size-sm);color:var(--color-error);background:var(--color-error-light);border-radius:var(--radius-sm);padding:8px 12px}.sign-in-modal-footer{display:flex;flex-direction:column;align-items:center;gap:6px;padding:0 20px 20px}.sign-in-switch-btn,.sign-in-reset-btn{background:none;border:none;font-size:var(--font-size-xs);color:var(--color-primary);cursor:pointer;padding:0;font-family:inherit;text-decoration:underline;transition:color var(--duration-base)}.sign-in-switch-btn:hover,.sign-in-reset-btn:hover{color:var(--color-primary-dark)}@media(max-width:767px){.dialog[open].sign-in-modal{max-width:100%;width:100%;margin-bottom:0;border-radius:var(--radius-lg) var(--radius-lg) 0 0}}.header{position:sticky;top:0;z-index:100;background-color:var(--color-surface);border-bottom:1px solid var(--color-border)}.header-inner{display:flex;align-items:center;gap:24px;padding:0 32px;height:60px}.header-logo{font-size:var(--font-size-xl);font-weight:700;color:var(--color-primary);text-decoration:none;letter-spacing:-.5px}.header-nav{display:flex;align-items:center;gap:8px;flex:1}.header-nav-link{font-size:var(--font-size-sm);color:var(--color-text-muted);text-decoration:none;padding:6px 12px;border-radius:var(--radius-sm);transition:background-color var(--duration-base),color var(--duration-base)}.header-nav-link:hover{background-color:var(--color-surface-hover);color:var(--color-text-primary)}.header-nav-link[data-status=active]{background-color:var(--color-primary-light);color:var(--color-primary);font-weight:600}.header-nav-link[data-status=active]:hover{background-color:var(--color-primary-hover);color:var(--color-primary)}.header-actions{margin-left:auto}.header-more{position:relative;display:none}.header-more-btn{background:none;border:none;padding:6px 12px;font-size:var(--font-size-sm);line-height:1;color:var(--color-text-muted);cursor:pointer;border-radius:var(--radius-sm);transition:background-color var(--duration-base),color var(--duration-base)}.header-more-btn:hover{background-color:var(--color-surface-hover);color:var(--color-text-primary)}.header-more-dropdown{right:auto;left:0}.header-user{position:relative}.header-avatar-btn{background:none;border:none;padding:0;cursor:pointer;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center}.header-avatar-btn .avatar{border:1.5px solid var(--color-border)}.header-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);min-width:160px;overflow:hidden;z-index:200}.header-dropdown-name{font-size:var(--font-size-xs);color:var(--color-text-muted);padding:10px 14px 8px;border-bottom:1px solid var(--color-border);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header-dropdown-item{display:block;width:100%;text-align:left;background:none;border:none;padding:10px 14px;font-size:var(--font-size-sm);color:var(--color-text-base);text-decoration:none;cursor:pointer;font-family:inherit;transition:background-color var(--duration-base)}.header-dropdown-item:hover{background:var(--color-surface-hover)}@media(max-width:767px){.header-nav-secondary{display:none}.header-more{display:block}}@media(max-width:640px){.header-inner{padding:0 16px;gap:12px}.header-nav{gap:2px}.header-nav-link-text{display:none}.header-nav-link,.header-more-btn{font-size:var(--font-size-xl);padding:4px 6px}}