:root{--header-height: 52px;--header-bg: color-mix(in srgb, var(--ds-color-bg-surface) 72%, transparent);--header-border-color: color-mix(in srgb, var(--ds-color-border-subtle) 72%, transparent);--header-shadow: var(--ds-shadow-soft);--text-primary: var(--ds-color-text-primary);--text-secondary: var(--ds-color-text-secondary);--text-tertiary: var(--ds-color-text-muted);--bg-hover: color-mix(in srgb, var(--ds-color-text-primary) 3%, transparent);--search-bg: color-mix(in srgb, var(--ds-color-text-primary) 3%, transparent);--search-bg-hover: color-mix(in srgb, var(--ds-color-text-primary) 6%, transparent);--search-bg-focus: var(--ds-color-bg-surface);--search-border-focus: color-mix(in srgb, var(--ds-color-text-primary) 8%, transparent);--search-focus-shadow: 0 4px 12px color-mix(in srgb, var(--ds-color-text-primary) 3%, transparent);--shortcut-border: color-mix(in srgb, var(--ds-color-text-primary) 8%, transparent);--divider-color: color-mix(in srgb, var(--ds-color-text-primary) 10%, transparent);--button-primary-bg: var(--ds-button-primary-bg);--button-primary-hover-bg: var(--ds-button-primary-hover-bg);--button-primary-active-bg: color-mix(in srgb, var(--ds-button-primary-hover-bg) 84%, var(--ds-color-text-primary));--button-primary-text: var(--ds-button-primary-text);--button-success-bg: var(--ds-color-success);--button-success-hover-bg: color-mix(in srgb, var(--ds-color-success) 84%, var(--ds-color-text-primary));--button-success-active-bg: color-mix(in srgb, var(--ds-color-success) 72%, var(--ds-color-text-primary));--button-disabled-bg: color-mix(in srgb, var(--ds-color-text-primary) 10%, var(--ds-color-bg-surface));--button-disabled-text: var(--ds-color-text-muted);--button-shadow: 0 1px 2px color-mix(in srgb, var(--ds-color-text-primary) 5%, transparent);--button-shadow-hover: 0 2px 4px color-mix(in srgb, var(--ds-color-text-primary) 10%, transparent);--notification-dot-bg: var(--ds-color-danger);--notification-dot-ring: var(--ds-color-bg-surface);--profile-hover-bg: var(--ds-color-bg-surface);--profile-hover-border: color-mix(in srgb, var(--ds-color-text-primary) 4%, transparent);--profile-hover-shadow: 0 2px 6px color-mix(in srgb, var(--ds-color-text-primary) 2%, transparent);--avatar-bg: color-mix(in srgb, var(--ds-color-text-primary) 10%, var(--ds-color-bg-surface));--mobile-border-color: color-mix(in srgb, var(--ds-color-text-primary) 5%, transparent)}.top-header{flex-shrink:0;height:var(--header-height);background:var(--header-bg);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border-radius:10px;border:1px solid var(--header-border-color);display:flex;align-items:center;justify-content:space-between;padding:0 20px;position:relative;transition:left .4s cubic-bezier(.16,1,.3,1),width .4s cubic-bezier(.16,1,.3,1)}.header-left-section{display:flex;align-items:center;gap:16px}.top-header-back-button{display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;color:var(--text-secondary);width:24px;height:24px;padding:0;border-radius:6px;transition:all .2s;opacity:.8;margin-left:-4px}.top-header-back-button:hover{background:var(--bg-hover);color:var(--text-primary);opacity:1}.header-page-title{font-size:15px;font-weight:600;color:var(--text-primary);margin:0;letter-spacing:-.2px;display:flex;align-items:center;gap:8px}.header-title-icon{color:var(--text-primary);opacity:.8}.header-center-search{flex:1;max-width:480px;height:36px;background:transparent;border-radius:20px;display:flex;align-items:center;padding:0 4px 0 12px;gap:8px;transition:all .2s ease;margin:0 24px;cursor:text;border:1px solid transparent;background:var(--search-bg)}.header-center-search:hover{background:var(--search-bg-hover)}.header-center-search:focus-within{background:var(--search-bg-focus);border-color:var(--search-border-focus);box-shadow:var(--search-focus-shadow)}.header-center-search.disabled{opacity:.7;cursor:not-allowed;background:color-mix(in srgb,var(--ds-color-text-primary) 1%,transparent)}.header-center-search.disabled .search-input{cursor:not-allowed}.search-icon{font-size:16px;color:var(--text-secondary);opacity:.6;flex-shrink:0}.search-input{border:none;background:transparent;outline:none;font-size:14px;flex:1;color:var(--text-primary);padding:0;font-weight:400;height:100%}.search-input::-moz-placeholder{color:var(--text-secondary);opacity:.5}.search-input::placeholder{color:var(--text-secondary);opacity:.5}.search-shortcut{font-size:10px;color:var(--text-secondary);border:1px solid var(--shortcut-border);border-radius:4px;padding:1px 4px;opacity:.6;font-family:-apple-system,BlinkMacSystemFont,monospace;margin-right:8px}.search-button{height:28px;padding:0 16px;background-color:var(--button-primary-bg);color:var(--button-primary-text);border:none;border-radius:14px;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1);white-space:nowrap;box-shadow:var(--button-shadow);margin-left:4px}.search-button:hover:not(:disabled){background-color:var(--button-primary-hover-bg);transform:translateY(-.5px);box-shadow:var(--button-shadow-hover)}.search-button:active:not(:disabled){transform:scale(.98);background-color:var(--button-primary-active-bg)}.search-button-secondary{background-color:var(--button-success-bg)!important;border-color:var(--button-success-bg)}.search-button-secondary:hover:not(:disabled){background-color:var(--button-success-hover-bg)!important;transform:translateY(-.5px);box-shadow:var(--button-shadow-hover)}.search-button-secondary:active:not(:disabled){transform:scale(.98);background-color:var(--button-success-active-bg)!important}.search-button:disabled{background-color:var(--button-disabled-bg);color:var(--button-disabled-text);cursor:default;box-shadow:none;transform:none}.header-right-section{display:flex;align-items:center;gap:8px}.header-time{font-size:13px;font-weight:500;color:var(--text-primary);font-variant-numeric:tabular-nums;margin-right:8px}.header-divider{width:1px;height:12px;background:var(--divider-color)}.header-icon-btn{width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-secondary);font-size:16px;position:relative;transition:all .2s;background:transparent;border:none}.header-icon-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.notification-dot{position:absolute;top:6px;right:6px;width:5px;height:5px;background:var(--notification-dot-bg);border-radius:50%;box-shadow:0 0 0 1.5px var(--notification-dot-ring)}.user-profile{display:flex;align-items:center;gap:8px;cursor:pointer;padding:2px 8px 2px 2px;border-radius:14px;transition:all .2s;margin-left:8px;border:1px solid transparent}.user-profile:hover{background:var(--profile-hover-bg);border-color:var(--profile-hover-border);box-shadow:var(--profile-hover-shadow)}.user-avatar{width:24px;height:24px;border-radius:50%;overflow:hidden;background:var(--avatar-bg);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:var(--text-primary)}.user-avatar img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.sidebar-toggle{display:none}@media (max-width: 768px){.top-header{left:0;top:0;right:0;width:100%;border-radius:0;border:none;border-bottom:1px solid var(--mobile-border-color);padding:0 16px}.sidebar-toggle{display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--text-primary);padding:0;margin-right:12px}.header-center-search,.search-shortcut,.header-time{display:none}}