/* Ensure proper overflow handling for body and html */
html {
    height: 100%;
    width: 100%;
    overflow: hidden;
    margin: 0;
    padding: 0;
    max-width: 100%;
    --chrome-ui-zoom: 1;
    background: #1a1a1a;
}

html:not([data-theme]),
html[data-theme="dark"] {
    background: #1a1a1a;
    color: #ffffff;
}

body {
    height: 100%;
    width: 100%;
    overflow: hidden;
    margin: 0;
    padding: 0;
    max-width: 100%;
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: auto;
    text-rendering: optimizeLegibility;
    font-kerning: normal;
    font-synthesis: none;
    user-select: none;
    -webkit-user-select: none;
    background: #1a1a1a;
    color: #ffffff;
}

html:not([data-theme]) body,
html[data-theme="dark"] body {
    background: #1a1a1a;
    color: #ffffff;
}

/* Ctrl+wheel chrome scaling: keep labels on one line, fit strip, no clip */
.chrome-ui-scaled,
.glass-titlebar .chrome-ui-scaled,
.top-bar .chrome-ui-scaled,
.status-bar .chrome-ui-scaled,
.bookmarks-bar .chrome-ui-scaled {
    max-width: 100%;
    box-sizing: border-box;
    flex-shrink: 1;
    min-width: 0;
}

.tab.chrome-ui-scaled,
.tab-group-chip.chrome-ui-scaled,
.address-bar-container.chrome-ui-scaled,
.nav-controls.chrome-ui-scaled,
.status-item.chrome-ui-scaled,
.security-indicator.chrome-ui-scaled,
.extension-toolbar.chrome-ui-scaled {
    white-space: nowrap;
    flex-wrap: nowrap;
}

.tab-group-chip.chrome-ui-scaled,
.address-bar-container.chrome-ui-scaled,
.nav-controls.chrome-ui-scaled,
.status-item.chrome-ui-scaled,
.security-indicator.chrome-ui-scaled,
.extension-toolbar.chrome-ui-scaled {
    overflow: hidden;
    text-overflow: ellipsis;
}

.tab.chrome-ui-scaled {
    /* Keep the chip stroke visible; title ellipsis handles overflow. */
    overflow: visible;
}

.tab.chrome-ui-scaled .tab-title,
.status-item.chrome-ui-scaled,
.address-bar-container.chrome-ui-scaled #address-bar {
    white-space: nowrap;
}

.status-item.chrome-ui-scaled,
.address-bar-container.chrome-ui-scaled #address-bar {
    overflow: hidden;
    text-overflow: ellipsis;
}

.tab.chrome-ui-scaled .tab-title,
.tab.chrome-ui-scaled .tab-title-text {
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Toolbar groups: never flex-shrink or max-width clip under UI zoom */
.toolbar-icon-group.chrome-ui-scaled,
.toolbar-group-btn.chrome-ui-scaled,
html.chrome-ui-zoomed .toolbar-icon-group,
html.chrome-ui-zoomed .toolbar-group-btn,
.top-bar:has(.chrome-ui-scaled) .toolbar-icon-group,
.top-bar:has(.chrome-ui-scaled) .toolbar-group-btn {
    flex-shrink: 0 !important;
    min-width: auto !important;
    max-width: none !important;
}

html.chrome-ui-zoomed,
html.chrome-ui-zoomed body {
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* When Ctrl+wheel chrome zoom is active, keep fixed docks flush to the
   window edges so no parent-fill black strip shows above/below. */
html.chrome-ui-zoomed .glass-titlebar,
html.chrome-ui-zoomed .top-bar,
html.chrome-ui-zoomed .status-bar,
html.chrome-ui-zoomed .bookmarks-bar {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.top-bar.chrome-ui-zoomed,
html.chrome-ui-zoomed .top-bar,
html.chrome-ui-zoomed .status-bar,
html.chrome-ui-zoomed .glass-titlebar,
html.chrome-ui-zoomed .bookmarks-bar {
    flex-wrap: nowrap;
}

html.chrome-ui-zoomed .tabs-container,
html.chrome-ui-zoomed .status-bar,
html.chrome-ui-zoomed .glass-titlebar,
html.chrome-ui-zoomed .bookmarks-bar,
.status-bar:has(.chrome-ui-scaled),
.glass-titlebar:has(.chrome-ui-scaled),
.bookmarks-bar:has(.chrome-ui-scaled) {
    overflow: hidden !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}

/* Keep toolbar hover states unclipped by the tab strip above */
html.chrome-ui-zoomed .top-bar,
html.chrome-ui-zoomed .browser-menu,
.top-bar:has(.chrome-ui-scaled),
.browser-menu:has(.chrome-ui-scaled) {
    overflow: visible !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}

/* Layout containment makes fixed chrome use .browser-container as its
   containing block while .glass-titlebar stays viewport-fixed. Under CSS
   zoom those two coordinate spaces diverge and the tab strip covers the
   top of the URL/toolbar row. Drop layout containment while zoomed. */
html.chrome-ui-zoomed .browser-container,
.browser-container:has(.top-bar .chrome-ui-scaled),
.browser-container:has(.top-bar [data-ui-zoom]:not([data-ui-zoom="1"])) {
    contain: style !important;
}

/* Per-control CSS zoom grows icons past the locked 32px strip. Expand the
   bar downward so controls stay fully visible under the tab strip. */
html.chrome-ui-zoomed .top-bar:has(.chrome-ui-scaled),
.top-bar:has(.chrome-ui-scaled),
.top-bar:has([data-ui-zoom]:not([data-ui-zoom="1"])),
html.chrome-ui-zoomed .top-bar.chrome-toolbar-fit {
    height: auto !important;
    min-height: 32px !important;
    max-height: none !important;
    overflow: visible !important;
    align-items: center !important;
}

html body.toolbar-labels .top-bar:has(.chrome-ui-scaled),
html body.toolbar-labels .top-bar:has([data-ui-zoom]:not([data-ui-zoom="1"])),
html body.toolbar-labels .top-bar.chrome-toolbar-fit {
    min-height: 52px !important;
}

html.chrome-ui-zoomed .tabs-container {
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

html.chrome-ui-zoomed .tabs-container::-webkit-scrollbar,
html.chrome-ui-zoomed .status-bar::-webkit-scrollbar,
html.chrome-ui-zoomed .top-bar::-webkit-scrollbar,
html.chrome-ui-zoomed .glass-titlebar::-webkit-scrollbar,
html.chrome-ui-zoomed .bookmarks-bar::-webkit-scrollbar,
html.chrome-ui-zoomed .browser-menu::-webkit-scrollbar,
.top-bar:has(.chrome-ui-scaled)::-webkit-scrollbar,
.status-bar:has(.chrome-ui-scaled)::-webkit-scrollbar,
.glass-titlebar:has(.chrome-ui-scaled)::-webkit-scrollbar,
.bookmarks-bar:has(.chrome-ui-scaled)::-webkit-scrollbar,
.browser-menu:has(.chrome-ui-scaled)::-webkit-scrollbar,
.browser-menu::-webkit-scrollbar,
.glass-titlebar::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
}

.browser-menu {
    overflow: visible !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}

/* Keep main menu above content HWNDs and free of scroll chrome */
#main-menu.menu-dropdown,
#main-menu.menu-dropdown.show {
    z-index: 2147483647 !important;
    overflow: hidden !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}

#main-menu.menu-dropdown::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

input,
textarea,
[contenteditable="true"] {
    user-select: text !important;
    -webkit-user-select: text !important;
}

/* Global scrollbar styling removed to prevent UI overlap - specific scrollbars handled in search-cards.css */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
}

/* GPU acceleration for animated elements.
   Tabs are excluded: translateZ + overflow/radius compositing can clip the
   right border stroke at fractional DPI until an unrelated reflow restores it. */
.nav-btn,
.control-btn,
.glass-control-btn,
.menu-item,
.search-result-card,
.suggestion-item,
.dropdown-item,
.toggle-switch,
.action-btn,
button,
a {
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* Optimize transitions - use specific properties instead of 'all' */
.tab,
.nav-btn,
.control-btn,
.glass-control-btn {
    transition: background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

/* Contain layout for performance */
.browser-container,
.welcome-screen,
.search-results {
    contain: style;
}

body {
    font-family: var(--browser-ui-font, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Open Sans', sans-serif);
    background: #1a1a1a;
    color: #ffffff;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
    max-width: 100%;
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: auto;
    text-rendering: optimizeLegibility;
    font-kerning: normal;
    font-synthesis: none;
}

/* Theme variants moved to separate CSS files under ui/themes/ */

/* Chrome-style titlebar */
.chrome-titlebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100003;
    -webkit-app-region: drag;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 32px;
    background: linear-gradient(90deg, #2a2a2a 0%, #1f1f1f 50%, #050505 100%);
    border-bottom: 1px solid #404040;
    padding: 0 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    box-sizing: border-box;
}

.chrome-titlebar * { -webkit-app-region: no-drag; }

.title-section {
    display: flex;
    align-items: center;
    gap: 10px;
}

.title-logo {
    height: 20px;
    width: 20px;
    opacity: 0.95;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.5));
}

.title-text {
    font-size: 13px;
    font-weight: 500;
    color: #ffffff;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

.window-controls {
    display: flex;
    gap: 1px;
}

.control-btn {
    width: 32px;
    height: 24px;
    border: none;
    background: transparent;
    color: #cccccc;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.15s ease, color 0.15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.control-btn:hover {
    background: rgba(255,255,255,0.1);
    color: #ffffff;
}

.control-btn.close:hover {
    background: #e74c3c;
    color: #ffffff;
}

.control-btn svg {
    opacity: 0.8;
}

.control-btn:hover svg {
    opacity: 1;
}

.browser-container {
    position: absolute;
    top: 0 !important;
    left: 0;
    right: 0;
    width: 100%;
    height: 100% !important;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* Keep auto so fixed .top-bar can stack above sibling .glass-titlebar.
       A non-auto z-index traps the URL strip under the tab strip and clips
       toolbar labels that hang into that band when icons are enlarged. */
    z-index: auto;
}

/* Tab Bar - REMOVED (Merged into Titlebar) */
.tab-bar {
    display: none !important;
}

.tabs-container {
    display: flex;
    flex: 0 1 auto !important;
    gap: 4px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    align-items: center;
    height: 32px;
    min-width: 0;
    max-width: 100%;
    width: auto;
    margin: 0;
    /* Horizontal slack: fractional font metrics (e.g. Segoe UI) and subpixel
       flex widths can make the container's rounded clientWidth fall short of
       scrollWidth, clipping tab right borders under the overflow clip. */
    padding: 0 2px;
    box-sizing: border-box;
    -webkit-app-region: no-drag;
}

.tabs-container::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
}

.tab {
    display: flex;
    align-items: center;
    background: #2d2d2d;
    border: 1px solid #404040;
    border-radius: 3px;
    padding: 0 10px;
    box-sizing: border-box;
    min-width: var(--tab-shrink-floor, 60px);
    max-width: var(--max-tab-width, 240px);
    width: auto;
    cursor: pointer;
    transition: background-color 0.06s ease-out, border-color 0.06s ease-out;
    position: relative;
    gap: 6px;
    height: 26px;
    line-height: 1;
    user-select: none;
    contain: layout style;
    -webkit-app-region: no-drag;
    flex: 0 1 auto;
    flex-shrink: 1;
    /* Visible so the 1px stroke is never eaten by overflow+radius compositing.
       Title/favicon clipping stays on .tab-title / .tab-title-text. */
    overflow: visible;
}

.tab:hover {
    background: #3d3d3d;
    background-image: none;
    border-color: #505050;
    transform: none;
}

.tab.active:hover {
    background: #4a4a4a;
    border-color: #4900c2;
    transform: none;
}

.tab.active {
    background: #4a4a4a;
    border-color: #4900c2;
    border-bottom-color: #4a4a4a;
}

.tab.pinned {
    flex: 0 0 auto;
    min-width: 100px;
    padding-left: 8px;
    border-color: #6b5cff;
}

.tab.pinned.active {
    border-color: #4900c2;
}

.tab.pinned .tab-pin-mark {
    flex-shrink: 0;
    font-size: 9px;
    margin-right: 4px;
    color: #a78bfa;
    transform: rotate(-45deg);
    opacity: 0.95;
}

.tab.private {
    border-color: #5b6478;
    background: #2a2f3a;
}

.tab.private:hover {
    background: #343b4a;
    border-color: #6d788f;
}

.tab.private.active {
    background: #353c4d;
    border-color: #8b95a8;
    border-bottom-color: #353c4d;
}

.tab.private .tab-private-eye {
    color: #d7deea !important;
    font-size: 12px !important;
    opacity: 1 !important;
    margin-right: 5px;
}

.tab.pinned .tab-title {
    justify-content: flex-start;
}

.incognito-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
    margin-right: 6px;
    padding: 2px 8px;
    border-radius: 999px;
    border: 1px solid rgba(197, 205, 219, 0.35);
    background: rgba(42, 47, 58, 0.92);
    color: #d7deea;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.2;
    user-select: none;
    -webkit-app-region: no-drag;
}

.incognito-badge[hidden] {
    display: none !important;
}

.incognito-badge i {
    font-size: 11px;
    opacity: 0.95;
}

body.incognito-active .address-bar-container,
html.incognito-active .address-bar-container {
    border-color: rgba(139, 149, 168, 0.55);
    background: color-mix(in srgb, #2a2f3a 72%, transparent);
}

body.incognito-active #address-bar,
html.incognito-active #address-bar {
    color: #e8edf7;
}

.tab-audio-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    flex: 0 0 14px;
    width: 14px;
    min-width: 14px;
    height: 14px;
    margin-right: 4px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    line-height: 1;
}

.tab-audio-btn.is-playing {
    color: #7dd3fc;
}

.tab-audio-btn.is-playing-muted {
    color: #94a3b8;
}

.tab.muted .tab-mute-icon,
.tab.audible .tab-mute-icon,
.tab.media-playing-muted .tab-mute-icon {
    margin-right: 0;
    font-size: 10px;
    opacity: 0.9;
}

.tab-audio-btn:hover .tab-mute-icon {
    opacity: 1;
}

.tab.grouped,
.tab.grouped:hover,
.tab.grouped.active {
    /* Opaque mix only. Alpha fills + backdrop-filter under the strip strobe.
       Outline uses the group color so every open-group member stays visible. */
    border: 1px solid var(--tab-group-color, #4285f4) !important;
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 28%, #1c1c1c) !important;
    background-color: color-mix(in srgb, var(--tab-group-color, #4285f4) 28%, #1c1c1c) !important;
    background-image: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transition: none !important;
    outline: none !important;
}

.tab.grouped:hover {
    border-color: var(--tab-group-color, #4285f4) !important;
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 34%, #242424) !important;
    background-color: color-mix(in srgb, var(--tab-group-color, #4285f4) 34%, #242424) !important;
}

.tab.grouped.active,
.tab.grouped.active:hover {
    border-color: var(--tab-group-color, #4285f4) !important;
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 42%, #1a1a1a) !important;
    background-color: color-mix(in srgb, var(--tab-group-color, #4285f4) 42%, #1a1a1a) !important;
}

.tab.grouped .tab-title {
    color: #ffffff;
}

.tab.dragging {
    opacity: 0.45;
}

.tab.drag-over {
    box-shadow: inset 2px 0 0 #ffffff;
}

.tab.drag-group {
    outline: 2px solid color-mix(in srgb, var(--tab-group-color, #4285f4) 75%, #000000);
    outline-offset: -2px;
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 22%, #1c1c1c) !important;
    background-color: color-mix(in srgb, var(--tab-group-color, #4285f4) 22%, #1c1c1c) !important;
    transition: none !important;
}

.tab.split-pane {
    border-color: #24c1e0;
}

.tab-group-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    height: 26px;
    min-width: 28px;
    max-width: 140px;
    margin: 0 2px 0 0;
    padding: 0 8px 0 6px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 6px;
    border-left: 3px solid var(--tab-group-color, #4285f4);
    background: rgba(45, 45, 45, 0.95) !important;
    color: #f0f0f0 !important;
    font-size: 11px;
    font-weight: 600;
    font-family: inherit;
    line-height: 1;
    cursor: grab;
    user-select: none;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: none;
    outline: none;
    -webkit-app-region: no-drag;
    transition: background-color 0.12s ease, border-color 0.12s ease;
}

.tab-group-chip:active {
    cursor: grabbing;
}

.tab-group-chip.dragging {
    opacity: 0.45;
}

.tab-group-chip.drag-over {
    box-shadow: inset 2px 0 0 var(--tab-group-color, #4285f4);
    border-color: var(--tab-group-color, #4285f4);
}

.tab-group-chip:hover {
    background: rgba(60, 60, 60, 0.98) !important;
    border-color: rgba(255, 255, 255, 0.2);
}

.tab-group-chip.collapsed {
    opacity: 1;
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 35%, #2d2d2d) !important;
    border-color: var(--tab-group-color, #4285f4) !important;
}

.tab-group-chip .tab-group-icon {
    color: var(--tab-group-color, #4285f4);
    font-size: 11px;
    width: 12px;
    text-align: center;
    flex-shrink: 0;
}

.tab-group-chip .tab-group-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #f0f0f0;
    max-width: 100px;
}

.tab-group-chip.unnamed .tab-group-name {
    display: none;
}

.tab-group-chip.unnamed {
    padding: 0 7px;
    justify-content: center;
}

.tab-group-chip.editing {
    padding: 0 4px;
    max-width: 160px;
}

.pinned-group-bar {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    min-width: 0;
    max-width: min(70vw, 920px);
    overflow-x: auto;
    overflow-y: hidden;
    margin-left: 4px;
    padding: 0 4px 0 2px;
    -webkit-app-region: no-drag;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.pinned-group-bar::-webkit-scrollbar,
.pinned-group-rail-tabs::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

.pinned-group-bar[hidden] {
    display: none !important;
}

.pinned-group-rail {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    min-width: 0;
    max-width: 100%;
}

.pinned-group-rail-tabs {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: 0 1 auto;
    min-width: 0;
    max-width: min(56vw, 720px);
    overflow-x: auto;
    overflow-y: hidden;
    padding: 2px 4px 2px 2px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.pinned-group-rail-tabs .tab {
    flex: 0 0 auto !important;
    min-width: 96px !important;
    max-width: 200px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

.pinned-group-bar-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    height: 26px;
    max-width: 120px;
    padding: 0 8px 0 6px;
    border: 1px solid color-mix(in srgb, var(--tab-group-color, #4285f4) 70%, #1a1a1a);
    border-radius: 6px;
    border-left: 3px solid var(--tab-group-color, #4285f4);
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 22%, #1c1c1c);
    color: #f2f4f8;
    font-size: 11px;
    font-weight: 600;
    font-family: inherit;
    line-height: 1;
    cursor: pointer;
    -webkit-app-region: no-drag;
}

.pinned-group-bar-chip:hover {
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 32%, #242424);
    border-color: var(--tab-group-color, #4285f4);
}

.pinned-group-bar-chip.is-open {
    border-color: var(--tab-group-color, #4285f4);
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 38%, #1a1a1a);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tab-group-color, #4285f4) 55%, transparent);
}

.pinned-group-bar-icon {
    color: var(--tab-group-color, #4285f4);
    font-size: 11px;
    width: 12px;
    text-align: center;
    flex-shrink: 0;
}

.pinned-group-bar-icon-img {
    width: 14px;
    height: 14px;
    object-fit: contain;
    border-radius: 3px;
    flex-shrink: 0;
}

.pinned-group-bar-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 84px;
}

.pinned-group-bar-chip.unnamed {
    gap: 0;
    padding: 0 7px 0 6px;
}

.pinned-group-bar-chip.unnamed .pinned-group-bar-label {
    display: none;
}

.pinned-group-icon-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 6px 10px 10px;
}

.pinned-group-icon-swatch,
.tab-context-menu button.pinned-group-icon-swatch {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 6px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    color: #f2f4f8 !important;
}

.tab-group-rename-input {
    width: 96px;
    height: 20px;
    margin: 0;
    padding: 0 6px;
    border: 1px solid var(--tab-group-color, #4285f4) !important;
    border-radius: 4px;
    background: #1a1a1a !important;
    color: #ffffff !important;
    font-size: 11px;
    font-family: inherit;
    font-weight: 600;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: none;
}

.tab-group-rename-input::placeholder {
    color: rgba(255, 255, 255, 0.35);
}

.tab-context-menu {
    position: fixed !important;
    z-index: 2147483647 !important;
    min-width: 248px;
    max-width: min(320px, calc(100vw - 16px));
    max-height: calc(100vh - 16px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 6px;
    border-radius: 10px;
    background: var(--chrome-surface-2, rgba(28, 28, 32, 0.98)) !important;
    border: 1px solid var(--ui-border, rgba(255, 255, 255, 0.12)) !important;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.55),
        inset 0 1px 0 var(--ui-highlight, rgba(255, 255, 255, 0.06)) !important;
    color: var(--ui-text, #e8e8e8) !important;
    font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Open Sans', sans-serif;
    font-size: 11px;
    -webkit-app-region: no-drag;
    pointer-events: auto !important;
    backdrop-filter: blur(16px) saturate(140%);
    -webkit-backdrop-filter: blur(16px) saturate(140%);
}

/* Page right-click menu: same live CSS glass as Minimal URL bubble
   (blur(18px) saturate(1.2) + translucent fill). No page-frost CDP bake. */
#page-context-menu,
.page-context-menu {
    --panel-fill-alpha: 0.62;
    min-width: 148px;
    width: max-content;
    max-width: min(260px, calc(100vw - 16px));
    padding: 6px;
    border-radius: 12px;
    overflow: hidden;
    isolation: isolate;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    background: rgba(18, 18, 22, var(--panel-fill-alpha, 0.62)) !important;
    background-color: rgba(18, 18, 22, var(--panel-fill-alpha, 0.62)) !important;
    background-image: none !important;
    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.30),
        inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
    backdrop-filter: blur(18px) saturate(1.2) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.2) !important;
    color: #f2f2f6 !important;
}

#page-context-menu.show,
.page-context-menu.show {
    display: block !important;
}

[data-theme="light"] #page-context-menu,
[data-theme="light"] .page-context-menu {
    --panel-fill-alpha: 0.72;
    border: 1px solid rgba(40, 32, 24, 0.12) !important;
    background: rgba(246, 242, 236, var(--panel-fill-alpha, 0.72)) !important;
    background-color: rgba(246, 242, 236, var(--panel-fill-alpha, 0.72)) !important;
    box-shadow:
        0 8px 24px rgba(40, 32, 24, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.55) !important;
    color: #1a1a1a !important;
}

[data-theme="stealth-glass"] #page-context-menu,
[data-theme="stealth-float"] #page-context-menu,
[data-theme="stealth-glass"] .page-context-menu,
[data-theme="stealth-float"] .page-context-menu {
    --panel-fill-alpha: 0.62;
    background: rgba(18, 18, 22, var(--panel-fill-alpha, 0.62)) !important;
    background-color: rgba(18, 18, 22, var(--panel-fill-alpha, 0.62)) !important;
    background-image: none !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.30),
        inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
    backdrop-filter: blur(18px) saturate(1.2) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.2) !important;
}

#page-context-menu > button,
.page-context-menu > button,
body > #page-context-menu > button {
    width: auto;
    min-width: 100%;
    white-space: nowrap;
    padding: 3px 9px;
    font-size: 11px !important;
    height: 24px;
}

#page-context-menu > button:hover:not(:disabled),
#page-context-menu > button.is-hot:not(:disabled),
.page-context-menu > button:hover:not(:disabled),
.page-context-menu > button.is-hot:not(:disabled) {
    background: rgba(255, 255, 255, 0.16) !important;
    color: #ffffff !important;
}

[data-theme="light"] #page-context-menu > button:hover:not(:disabled),
[data-theme="light"] #page-context-menu > button.is-hot:not(:disabled),
[data-theme="light"] .page-context-menu > button:hover:not(:disabled),
[data-theme="light"] .page-context-menu > button.is-hot:not(:disabled) {
    background: rgba(40, 32, 24, 0.1) !important;
    color: #1a1a1a !important;
}

.page-context-menu-dismiss {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483645 !important;
    background: transparent !important;
    pointer-events: auto !important;
    -webkit-app-region: no-drag;
}

.page-context-menu-dismiss.hidden {
    display: none !important;
}

.page-context-menu-dismiss.show {
    display: block !important;
}

.tab-context-menu.hidden {
    display: none !important;
}

.tab-context-menu.ghost-icon-menu {
    min-width: 0;
    width: max-content;
    max-width: min(220px, calc(100vw - 16px));
    padding: 4px;
}

#toolbar-hide-context-menu,
#status-privacy-blur-menu,
.tab-context-menu.toolbar-hide-menu {
    min-width: 0;
    width: max-content;
    max-width: min(180px, calc(100vw - 16px));
    max-height: none;
    height: auto;
    padding: 4px;
    overflow: hidden;
}

#toolbar-hide-context-menu > button,
#status-privacy-blur-menu > button,
.tab-context-menu.toolbar-hide-menu > button {
    width: auto;
    min-width: 96px;
    white-space: nowrap;
    padding: 7px 12px;
}

.tab-context-menu > button {
    display: flex;
    align-items: center;
    gap: 7px;
    width: 100%;
    padding: 3px 10px;
    border: none;
    border-radius: 5px;
    background: transparent !important;
    color: var(--ui-text, #c8c8c8) !important;
    text-align: left;
    cursor: pointer;
    font: inherit;
    font-size: 11px !important;
    height: 24px;
    -webkit-appearance: none;
    appearance: none;
}

.tab-context-menu > button:hover:not(:disabled) {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.1)) !important;
    color: var(--ui-text, #ffffff) !important;
}

.tab-context-menu > button:disabled {
    color: color-mix(in srgb, var(--ui-text, #c8c8c8) 35%, transparent) !important;
    cursor: default;
    pointer-events: none;
}

.tab-context-menu > button:disabled .tab-menu-shortcut {
    opacity: 0.25;
}

.tab-context-menu > button[role="menuitemradio"] {
    padding-left: 28px;
    position: relative;
}

.tab-context-menu > button[role="menuitemradio"].tab-menu-checked::before {
    content: "";
    position: absolute;
    left: 11px;
    top: 50%;
    width: 6px;
    height: 10px;
    border: solid var(--ui-accent, #4c8dff);
    border-width: 0 2px 2px 0;
    transform: translateY(-60%) rotate(45deg);
}

.tab-context-menu > button i {
    width: 14px;
    text-align: center;
    color: var(--ui-muted, #a1a1aa);
    opacity: 1;
}

.tab-context-menu > button:hover i {
    color: var(--ui-text, #ffffff);
}

.tab-context-menu .tab-menu-label {
    display: block;
    padding: 6px 11px 4px;
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ui-muted, #a1a1aa);
}

.tab-context-menu .tab-menu-check {
    display: flex;
    align-items: center;
    gap: 7px;
    width: 100%;
    padding: 4px 10px 7px;
    margin: 0;
    border-radius: 5px;
    color: var(--ui-text, #c8c8c8);
    font: inherit;
    font-size: 11px !important;
    cursor: pointer;
    user-select: none;
    box-sizing: border-box;
}

.tab-context-menu .tab-menu-check:hover {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.08));
    color: var(--ui-text, #ffffff);
}

.tab-context-menu .tab-menu-check input[type="checkbox"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 14px;
    height: 14px;
    margin: 0;
    flex-shrink: 0;
    box-sizing: border-box;
    border: 1px solid var(--ui-border, rgba(255, 255, 255, 0.28));
    border-radius: 3px;
    background: color-mix(in srgb, var(--ui-bg, rgba(20, 20, 28, 0.75)) 70%, #000000);
    accent-color: var(--ui-accent, #5a0dd6);
    color-scheme: dark;
    cursor: pointer;
    display: inline-grid;
    place-content: center;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.tab-context-menu .tab-menu-check input[type="checkbox"]::before {
    content: "";
    width: 8px;
    height: 8px;
    transform: scale(0);
    transition: transform 0.12s ease;
    box-shadow: inset 1em 1em #ffffff;
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

.tab-context-menu .tab-menu-check input[type="checkbox"]:checked {
    background: linear-gradient(135deg, var(--ui-accent, #5a0dd6), var(--ui-accent-2, #4900c2));
    border-color: var(--ui-accent, #5a0dd6);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--ui-accent, #5a0dd6) 40%, transparent);
}

.tab-context-menu .tab-menu-check input[type="checkbox"]:checked::before {
    transform: scale(1);
}

.tab-context-menu .tab-menu-check input[type="checkbox"]:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--ui-accent, #5a0dd6) 65%, transparent);
    outline-offset: 2px;
}

[data-theme="light"] .tab-context-menu .tab-menu-check input[type="checkbox"] {
    background: rgba(255, 255, 255, 0.82);
    border-color: rgba(40, 32, 24, 0.32);
    color-scheme: light;
}

[data-theme="light"] .tab-context-menu .tab-menu-check input[type="checkbox"]:checked {
    background: linear-gradient(135deg, var(--ui-accent, #5a0dd6), var(--ui-accent-2, #4900c2));
    border-color: var(--ui-accent, #5a0dd6);
}

[data-theme="stealth"] .tab-context-menu .tab-menu-check input[type="checkbox"] {
    background: rgba(12, 4, 26, 0.55);
    border-color: rgba(196, 142, 255, 0.35);
}

[data-theme="stealth"] .tab-context-menu .tab-menu-check input[type="checkbox"]:checked {
    background: linear-gradient(135deg, var(--ui-accent, #5a0dd6), var(--ui-accent-2, #4900c2));
    border-color: #a78bfa;
}

[data-theme="stealth-glass"] .tab-context-menu .tab-menu-check input[type="checkbox"],
[data-theme="stealth-float"] .tab-context-menu .tab-menu-check input[type="checkbox"] {
    background: rgba(18, 18, 26, 0.55);
    border-color: rgba(255, 255, 255, 0.28);
}

[data-theme="dark"] .tab-context-menu .tab-menu-check input[type="checkbox"] {
    background: rgba(0, 0, 0, 0.35);
    border-color: rgba(255, 255, 255, 0.28);
}

.tab-context-menu .tab-menu-check input[type="checkbox"]:disabled {
    cursor: default;
    opacity: 0.45;
}

.tab-context-menu .tab-menu-check:has(input:disabled) {
    cursor: default;
    opacity: 0.65;
}

.tab-context-menu .tab-menu-check:has(input:disabled):hover {
    background: transparent;
}

.tab-context-menu .tab-menu-check span {
    line-height: 1.3;
}

.tab-menu-sep {
    height: 1px;
    margin: 6px 4px;
    background: var(--ui-border, rgba(255, 255, 255, 0.12));
}

.tab-menu-shortcut {
    margin-left: auto;
    opacity: 0.45;
    font-size: 10px;
    color: var(--ui-muted, #a1a1aa);
}

.tab-menu-submenu {
    max-height: 180px;
    overflow-y: auto;
}

.tab-menu-submenu > button {
    display: flex;
    align-items: center;
    gap: 7px;
    width: 100%;
    padding: 3px 10px;
    border: none;
    border-radius: 5px;
    background: transparent !important;
    color: var(--ui-text, #c8c8c8) !important;
    text-align: left;
    cursor: pointer;
    font: inherit;
    font-size: 11px !important;
    height: 24px;
    -webkit-appearance: none;
    appearance: none;
}

.tab-menu-submenu > button:hover:not(:disabled) {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.1)) !important;
    color: var(--ui-text, #ffffff) !important;
}

.tab-menu-submenu button .group-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--swatch-color);
}

.tab-group-color-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
    padding: 8px 10px 12px;
    width: 100%;
    box-sizing: border-box;
}

.tab.colored,
.tab.colored:hover,
.tab.colored.active {
    border: 1px solid var(--tab-group-color, #4285f4) !important;
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 28%, #1c1c1c) !important;
    background-color: color-mix(in srgb, var(--tab-group-color, #4285f4) 28%, #1c1c1c) !important;
    background-image: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transition: none !important;
    outline: none !important;
}

.tab.colored:hover {
    border-color: var(--tab-group-color, #4285f4) !important;
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 34%, #242424) !important;
    background-color: color-mix(in srgb, var(--tab-group-color, #4285f4) 34%, #242424) !important;
}

.tab.colored.active,
.tab.colored.active:hover {
    border-color: var(--tab-group-color, #4285f4) !important;
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 42%, #1a1a1a) !important;
    background-color: color-mix(in srgb, var(--tab-group-color, #4285f4) 42%, #1a1a1a) !important;
}

.tab.colored .tab-title {
    color: #ffffff;
}

.tab-context-menu .tab-color-swatch-none,
.tab-context-menu button.tab-color-swatch-none {
    background:
        linear-gradient(135deg, transparent calc(50% - 1px), rgba(220, 80, 80, 0.95) calc(50% - 1px), rgba(220, 80, 80, 0.95) calc(50% + 1px), transparent calc(50% + 1px)),
        rgba(80, 80, 80, 0.55) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22);
}

.tab-context-menu .tab-group-color-swatch,
.tab-context-menu button.tab-group-color-swatch {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    min-height: 18px !important;
    margin: 0;
    border-radius: 50%;
    aspect-ratio: 1 / 1;
    border: 2px solid transparent !important;
    padding: 0 !important;
    gap: 0 !important;
    cursor: pointer;
    flex: 0 0 18px !important;
    -webkit-appearance: none;
    appearance: none;
    background: var(--swatch-color) !important;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.28);
    transition: transform 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
}

.tab-context-menu .tab-group-color-swatch:hover,
.tab-context-menu button.tab-group-color-swatch:hover {
    transform: scale(1.12);
    background: var(--swatch-color) !important;
    box-shadow:
        inset 0 0 0 1px rgba(0, 0, 0, 0.2),
        0 0 0 2px color-mix(in srgb, var(--swatch-color) 55%, transparent);
}

.tab-context-menu .tab-group-color-swatch.active,
.tab-context-menu button.tab-group-color-swatch.active {
    border-color: var(--ui-text, #ffffff) !important;
    box-shadow:
        inset 0 0 0 1px rgba(0, 0, 0, 0.15),
        0 0 0 2px color-mix(in srgb, var(--swatch-color) 70%, transparent);
}

[data-theme="light"] .tab-context-menu {
    background: var(--chrome-surface-2, rgba(236, 232, 224, 0.98)) !important;
    box-shadow:
        0 8px 28px rgba(40, 32, 24, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.55) !important;
}

[data-theme="stealth"] .tab-context-menu {
    background: var(--chrome-surface-2, rgba(26, 18, 40, 0.98)) !important;
}

[data-theme="stealth-glass"] .tab-context-menu,
[data-theme="stealth-float"] .tab-context-menu {
    background: rgba(22, 22, 30, 0.72) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    backdrop-filter: blur(22px) saturate(160%);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
}

/* Vertical tabs layout: hide horizontal tab bar, show left sidebar strip */
body.vertical-tabs .glass-titlebar {
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    overflow: visible !important;
    pointer-events: none !important;
    top: 0 !important;
    bottom: auto !important;
}

/* Keep the tab rail + window controls; other titlebar chrome is rehosted or unused. */
body.vertical-tabs .glass-titlebar > :not(.tabs-container):not(.glass-window-controls) {
    display: none !important;
}

body.vertical-tabs .glass-titlebar > .tabs-container,
html.vertical-tabs .glass-titlebar > .tabs-container,
body.vertical-tabs.longer-tabs .glass-titlebar > .tabs-container,
html.vertical-tabs.longer-tabs .glass-titlebar > .tabs-container,
body.longer-tabs.vertical-tabs .glass-titlebar > .tabs-container,
html.longer-tabs.vertical-tabs .glass-titlebar > .tabs-container {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    width: 200px !important;
    min-width: 200px !important;
    max-width: 200px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: none !important;
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    align-content: flex-start !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 8px 6px 16px !important;
    gap: 4px !important;
    z-index: 2147483646 !important;
    background: var(--chrome-surface, rgba(20, 20, 24, 0.96)) !important;
    border-right: 1px solid rgba(124, 58, 237, 0.35) !important;
    border-left: none !important;
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    backdrop-filter: blur(16px);
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

body.vertical-tabs .tabs-container .tab,
body.vertical-tabs .tabs-container .tab-group-chip {
    max-width: none !important;
    width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    align-self: stretch !important;
}

body.vertical-tabs .tabs-container .tab-title,
body.vertical-tabs .tabs-container .tab-title-text {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.vertical-tabs .tabs-container .new-tab-btn,
body.vertical-tabs .glass-titlebar > .new-tab-btn,
body.vertical-tabs.longer-tabs .tabs-container .new-tab-btn,
html.vertical-tabs.longer-tabs .tabs-container .new-tab-btn {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin: 4px 0 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 28px !important;
    min-height: 28px !important;
    flex: 0 0 auto !important;
    align-self: stretch !important;
    pointer-events: auto !important;
    z-index: 2 !important;
}

/* Pinned group chips live inside the vertical rail (rehosted by JS). */
body.vertical-tabs .tabs-container > .pinned-group-bar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    overflow: visible !important;
    flex: 0 0 auto !important;
}

body.vertical-tabs .tabs-container > .pinned-group-bar[hidden] {
    display: none !important;
}

body.vertical-tabs .tabs-container > .pinned-group-bar .pinned-group-rail {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
}

body.vertical-tabs .tabs-container > .pinned-group-bar .pinned-group-rail-tabs {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}

body.vertical-tabs .tabs-container > .pinned-group-bar .pinned-group-bar-chip {
    width: 100% !important;
    max-width: none !important;
}

body.vertical-tabs .tabs-container > .pinned-group-bar .pinned-group-rail-tabs .tab {
    min-width: 0 !important;
    max-width: none !important;
    width: 100% !important;
}

/* Corner window controls clear the vertical rail. */
body.vertical-tabs.window-controls-pos-top-left .glass-window-controls,
html.vertical-tabs.window-controls-pos-top-left .glass-window-controls {
    left: 214px !important;
    right: auto !important;
}

/* The welcome screen lives inside .web-content inside .browser-container and
   inherits the container shift; giving it an offset of its own doubles the
   inset and opens a dead band to the right of the tab rail. */
body.vertical-tabs .browser-container,
body.vertical-tabs .top-bar,
body.vertical-tabs .status-bar,
body.vertical-tabs .bookmarks-bar {
    margin-left: 200px;
    width: calc(100% - 200px);
}

body.vertical-tabs .web-content {
    margin-left: 0;
}

/* Bottom dock + vertical tabs: sidebar clears bottom chrome stack */
html.bottom-layout-html.vertical-tabs .glass-titlebar > .tabs-container,
body.bottom-layout-body.vertical-tabs .glass-titlebar > .tabs-container,
.browser-container.bottom-layout body.vertical-tabs .tabs-container,
body.bottom-layout-body.vertical-tabs .tabs-container,
html.bottom-layout-html.vertical-tabs.longer-tabs .glass-titlebar > .tabs-container,
body.bottom-layout-body.vertical-tabs.longer-tabs .glass-titlebar > .tabs-container,
html.longer-tabs.bottom-layout-html.vertical-tabs .glass-titlebar > .tabs-container,
body.longer-tabs.bottom-layout-body.vertical-tabs .glass-titlebar > .tabs-container {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    bottom: 54px !important;
    width: 200px !important;
    max-width: 200px !important;
    height: auto !important;
    min-width: 200px !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: none !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 8px 6px 16px !important;
    gap: 4px !important;
    z-index: 2147483646 !important;
    background: var(--chrome-surface, rgba(20, 20, 24, 0.96)) !important;
    border-right: 1px solid rgba(124, 58, 237, 0.35) !important;
    border-left: none !important;
    backdrop-filter: blur(16px) !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    display: flex !important;
}

html.bottom-layout-html.vertical-tabs.security-bar-hidden .glass-titlebar > .tabs-container,
body.bottom-layout-body.vertical-tabs.security-bar-hidden .glass-titlebar > .tabs-container,
body.bottom-layout-body.vertical-tabs.security-bar-hidden .tabs-container {
    bottom: 40px !important;
}

html.bottom-layout-html.vertical-tabs .glass-titlebar,
body.bottom-layout-body.vertical-tabs .glass-titlebar {
    top: 0 !important;
    bottom: auto !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    width: 0 !important;
    max-width: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: none !important;
    pointer-events: none !important;
}

/* One 200px shift per element: margin carries it, so left must stay 0.
   Setting margin-left AND left together on positioned boxes stacked to 400px,
   and the nested welcome screen (which inherits the container shift) must not
   appear here at all or the home page lands 600px past the tab rail. */
html.bottom-layout-html.vertical-tabs .browser-container,
html.bottom-layout-html.vertical-tabs .top-bar,
html.bottom-layout-html.vertical-tabs .status-bar,
html.bottom-layout-html.vertical-tabs .bookmarks-bar,
body.bottom-layout-body.vertical-tabs .browser-container.bottom-layout .top-bar,
body.bottom-layout-body.vertical-tabs .browser-container.bottom-layout .status-bar,
body.bottom-layout-body.vertical-tabs .top-bar,
body.bottom-layout-body.vertical-tabs .status-bar,
body.bottom-layout-body.vertical-tabs .bookmarks-bar {
    margin-left: 200px !important;
    width: calc(100% - 200px) !important;
    left: 0 !important;
    right: 0 !important;
}

body.bottom-layout-body.vertical-tabs .tabs-container .tab,
html.bottom-layout-html.vertical-tabs .tabs-container .tab {
    max-width: none !important;
    width: 100% !important;
    min-width: 0 !important;
    flex-shrink: 0 !important;
}

body.bottom-layout-body.vertical-tabs .tabs-container .new-tab-btn,
html.bottom-layout-html.vertical-tabs .tabs-container .new-tab-btn {
    width: 100% !important;
    margin: 4px 0 0 !important;
    height: 28px !important;
    min-height: 28px !important;
    display: inline-flex !important;
    flex: 0 0 auto !important;
}

/* Vertical tabs always uses corner window-control placement (top-left / top-right). */

.tab-title {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    white-space: nowrap;
    overflow: hidden;
    font-size: 11px;
    color: #ffffff;
    line-height: 1;
    user-select: none;
}

.tab-title-text {
    flex: 1 1 auto;
    align-self: center;
    min-width: 0;
    height: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 14px;
}

/* Favicon images in tabs: preserve aspect ratio */
.tab-title .tab-fav,
img.tab-fav {
    width: 16px;
    height: 16px;
    object-fit: contain;
    margin-right: 6px;
    flex-shrink: 0;
    align-self: center;
}

/* Fallback icons for tabs — hidden unless .is-visible (never sit next to a loaded favicon) */
.tab-fav-fallback {
    display: none !important;
    width: 14px;
    height: 14px;
    font-size: 12px;
    line-height: 1;
    margin-right: 6px;
    color: var(--text-muted, #888);
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
}

.tab-fav-fallback.is-visible {
    display: inline-flex !important;
}

.tab-close {
    background: transparent;
    border: none;
    color: #888;
    cursor: pointer;
    padding: 0;
    margin: 0;
    border-radius: 2px;
    font-size: 14px;
    line-height: 0;
    width: 14px;
    height: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    align-self: center;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.tab-close:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

body.html-fullscreen-active .tabs-container,
body.html-fullscreen-active .tab-close,
body.html-fullscreen-active .tab {
    pointer-events: none !important;
}

.new-tab-btn {
    background: #404040;
    border: none;
    color: #ffffff;
    padding: 2px 6px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 16px;
    width: 26px;
    height: 26px;
    transition: background-color 0.15s ease, transform 0.15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    -webkit-app-region: no-drag;
}

.new-tab-btn:hover {
    background: #505050;
    transform: none;
    filter: brightness(1.12);
}

/* Top Bar: URL strip is the primary chrome; never paint under tabs/status */
.top-bar {
    position: fixed;
    top: var(--titlebar-height, 40px);
    left: 0;
    right: 0;
    /* Above .glass-titlebar (100003) so zoomed icon labels are not covered. */
    z-index: 100004;
    display: flex;
    align-items: center;
    background: transparent;
    padding: 2px 8px;
    --toolbar-gap: 11px;
    gap: var(--toolbar-gap);
    height: 32px;
    box-sizing: border-box;
    overflow: visible;
    min-width: 0;
    user-select: none !important;
    -webkit-user-select: none !important;
}

/* Chrome-style chrome: nav + omnibox + tools + STEALTH / Account / Layout /
   Menu all live as direct children of the row and can be click-hold reordered.
   The omnibox grows so any slot dragged behind it is pushed to the right edge.
   Flex order follows DOM order, so no explicit `order` is pinned here. */
.top-bar > .nav-controls,
.top-bar > .nav-btn[data-toolbar-item] {
    flex: 0 0 auto;
    flex-shrink: 0;
}
/* Consecutive nav / chrome slots share the row gap. Do not re-tighten with
   negative margins: those made the packed measure narrower than the painted
   distributed row and shoved Menu off the content edge on wide monitors. */
.top-bar > .nav-btn[data-toolbar-item] + .nav-btn[data-toolbar-item] {
    margin-left: 0;
}
html body .top-bar > .address-bar-container {
    flex: 1 1 220px;
    min-width: 180px !important;
    max-width: 100%;
}
html body.address-bar-fixed-width .top-bar > .address-bar-container {
    min-width: 120px !important;
}
.top-bar.chrome-toolbar-width-fit > .address-bar-container {
    min-width: 180px !important;
}
.top-bar > .browser-chrome-item {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    flex-shrink: 0;
}
.top-bar > .browser-chrome-item + .browser-chrome-item {
    margin-left: 0;
}
.top-bar > .browser-chrome-item[hidden] {
    display: none !important;
}
/* Retained for legacy saves that still nest tools; flattened at runtime. */
.top-bar > .toolbar-middle-cluster {
    display: flex;
    align-items: center;
    gap: var(--toolbar-gap, 11px);
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    overflow: visible;
}
.top-bar > .toolbar-overflow {
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-left: 2px;
    z-index: 6;
}

.top-bar > .toolbar-overflow[hidden] {
    display: none !important;
}
.top-bar .toolbar-overflow-btn {
    min-width: 28px !important;
    height: 28px !important;
    padding: 6px 8px !important;
    flex-shrink: 0 !important;
}
.top-bar .toolbar-overflow-btn i {
    pointer-events: none;
    font-size: 12px;
}

/* Beat every toolbar container's display:flex !important so overflowed
   tools actually leave the bar (duplicates in >> were from specificity loss). */
html body .top-bar [data-toolbar-overflow="1"],
html body .top-bar .toolbar-middle-cluster > [data-toolbar-overflow="1"],
html body .top-bar .nav-controls > [data-toolbar-overflow="1"],
html body .top-bar .browser-menu [data-toolbar-overflow="1"],
html body .top-bar .browser-menu-end > [data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar [data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .toolbar-middle-cluster > [data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .security-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .night-light-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .hide-it-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .no-dubs-netflix-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .playlist-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .volume-control-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .downloads-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .clipboard-history-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .link-scan-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .settings-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .history-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .instant-answer-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .screenshot-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .pip-toggle-container[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .extension-toolbar[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar .powerup-toolbar[data-toolbar-overflow="1"],
html body .top-bar #stealth-logo-btn[data-toolbar-overflow="1"],
html body .top-bar #profile-avatar-btn[data-toolbar-overflow="1"],
html body .top-bar #home-btn[data-toolbar-overflow="1"],
html body .top-bar #forward-btn[data-toolbar-overflow="1"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    position: absolute !important;
    left: -10000px !important;
    top: 0 !important;
}

/* After fitting, the omnibox is the only elastic element on the bar. Anything
   else that can shrink spills its contents over its neighbours instead of
   moving into >>, which is what produced stacked/overlapping icons. */
html body .top-bar.chrome-toolbar-width-fit > *:not(.address-bar-container),
html body .top-bar.chrome-toolbar-width-fit > .toolbar-middle-cluster > *,
html body .top-bar.chrome-toolbar-width-fit > .nav-controls > *,
html body .top-bar.chrome-toolbar-width-fit > .browser-chrome-item > *,
html body .top-bar.chrome-toolbar-width-fit > .browser-menu > *,
html body.toolbar-labels .top-bar.chrome-toolbar-width-fit > *:not(.address-bar-container),
html body.toolbar-labels .top-bar.chrome-toolbar-width-fit > .toolbar-middle-cluster > * {
    flex-shrink: 0 !important;
}

/* Measurement pass: flex compression lets toolbar items squash into each other
   instead of overrunning the bar, which hides the real space deficit. Pinning
   every item to its natural width makes the overrun measurable. */
.top-bar.chrome-toolbar-measuring {
    overflow: visible !important;
}
.top-bar.chrome-toolbar-measuring > *,
.top-bar.chrome-toolbar-measuring > .toolbar-middle-cluster > *,
.top-bar.chrome-toolbar-measuring > .nav-controls > *,
.top-bar.chrome-toolbar-measuring > .browser-chrome-item > *,
.top-bar.chrome-toolbar-measuring > .browser-menu > * {
    flex-shrink: 0 !important;
}
.top-bar.chrome-toolbar-measuring > .toolbar-middle-cluster,
.top-bar.chrome-toolbar-measuring > .nav-controls,
.top-bar.chrome-toolbar-measuring > .browser-menu {
    overflow: visible !important;
}
.top-bar.chrome-toolbar-measuring > .address-bar-container {
    flex: 0 0 var(--chrome-address-fit-min, 180px) !important;
    width: var(--chrome-address-fit-min, 180px) !important;
    min-width: var(--chrome-address-fit-min, 180px) !important;
    max-width: var(--chrome-address-fit-min, 180px) !important;
}

/* The shared .menu-dropdown floor (280px) would leave dead space under the
   last entry as items move back onto the bar during a live resize. */
body > .toolbar-overflow-menu.menu-dropdown,
.toolbar-overflow-menu.menu-dropdown {
    min-height: 0 !important;
}

/* Portaled to body while open (guidelines: Window layering), so it must own
   its own stacking context above every chrome strip in both docks. */
body > .toolbar-overflow-menu.menu-dropdown,
.toolbar-overflow-menu.menu-dropdown {
    position: fixed;
    z-index: 2147483647;
    min-width: 220px;
    max-width: min(320px, 92vw);
    max-height: min(70vh, 480px);
    overflow-x: hidden;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(124, 58, 237, 0.7) transparent;
    border-radius: var(--stealth-cut-panel, 22px 4px 4px 4px) !important;
    border: 1px solid var(--menu-border-color, rgba(255, 255, 255, 0.14));
    background: var(--menu-bg-gradient, rgba(20, 20, 28, 0.92));
    box-shadow: var(--menu-shadow, 0 8px 32px rgba(0, 0, 0, 0.5));
    backdrop-filter: blur(28px) saturate(180%);
    -webkit-backdrop-filter: blur(28px) saturate(180%);
    padding: 8px;
    color: inherit;
}
.toolbar-overflow-menu.menu-dropdown[hidden] {
    display: none !important;
}
/* Same scroller treatment as the other menus / result lists. */
.toolbar-overflow-menu.menu-dropdown::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    display: block !important;
}
.toolbar-overflow-menu.menu-dropdown::-webkit-scrollbar-track {
    background: transparent;
}
.toolbar-overflow-menu.menu-dropdown::-webkit-scrollbar-thumb {
    background: rgba(124, 58, 237, 0.4);
    border-radius: 4px;
}
.toolbar-overflow-menu.menu-dropdown::-webkit-scrollbar-thumb:hover {
    background: rgba(124, 58, 237, 0.6);
}
.toolbar-overflow-menu.menu-dropdown::-webkit-scrollbar-button {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}
.toolbar-overflow-menu .toolbar-overflow-logo {
    justify-content: center !important;
    padding: 10px 10px 12px 10px;
    gap: 0;
}
/* .menu-dropdown button img caps art at 16px; the header wordmark opts out. */
.toolbar-overflow-menu .toolbar-overflow-logo img {
    width: auto !important;
    height: 26px !important;
    min-height: 26px !important;
    max-height: 26px !important;
    max-width: 170px !important;
}
[data-theme="light"] .toolbar-overflow-menu .toolbar-overflow-logo img {
    filter: none;
}
.toolbar-overflow-menu .toolbar-overflow-item {
    display: flex !important;
    align-items: center;
    gap: 10px;
    width: 100%;
    text-align: left;
    white-space: nowrap;
    border-radius: var(--stealth-cut, 12px 2px 2px 2px) !important;
    color: inherit;
    background: transparent;
    border: none;
    padding: 8px 10px;
    cursor: pointer;
}
.toolbar-overflow-menu .toolbar-overflow-item:hover {
    background: rgba(90, 13, 214, 0.28);
    color: #fff;
}
[data-theme="light"] .toolbar-overflow-menu .toolbar-overflow-item {
    color: #1a1a22;
}
[data-theme="light"] .toolbar-overflow-menu .toolbar-overflow-item:hover {
    background: rgba(90, 13, 214, 0.16);
    color: #1a1a22;
}
.toolbar-overflow-menu .toolbar-overflow-item img {
    width: 16px;
    height: 16px;
    object-fit: contain;
    flex-shrink: 0;
    pointer-events: none;
    display: block;
}
.toolbar-overflow-menu .toolbar-overflow-item i {
    width: 16px;
    text-align: center;
    flex-shrink: 0;
    pointer-events: none;
}
.toolbar-overflow-menu .toolbar-overflow-item svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    pointer-events: none;
    display: block;
}
.toolbar-overflow-menu .toolbar-overflow-item > span.toolbar-overflow-label {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
}
.toolbar-overflow-menu .toolbar-overflow-item > span.toolbar-overflow-icon {
    flex: 0 0 auto !important;
    aspect-ratio: 1 / 1 !important;
    overflow: visible;
}
.toolbar-overflow-menu .toolbar-overflow-sep {
    height: 1px;
    margin: 4px 8px;
    background: rgba(255, 255, 255, 0.12);
    pointer-events: none;
}
[data-theme="light"] .toolbar-overflow-menu .toolbar-overflow-sep {
    background: rgba(0, 0, 0, 0.12);
}

/* Trailing menu host holds only the dropdowns + collapse control. It must
   NOT participate in the top-bar flex row: even a zero-width flex sibling
   still consumes row `gap`, which painted as dead space after Menu and made
   the right edge look wider than the left. Absolute + width 0 keeps the
   portal host mounted without taking a slot. */
.top-bar > .browser-menu {
    position: absolute !important;
    left: auto !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    flex: 0 0 0px !important;
    overflow: visible !important;
    border: none !important;
    pointer-events: none !important;
}
.top-bar > .browser-menu > * {
    pointer-events: auto;
}
.top-bar .browser-menu-end {
    flex-shrink: 0 !important;
}
.top-bar > [data-toolbar-item="layout"],
.top-bar > [data-toolbar-item="menu"] {
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: auto !important;
    min-width: 28px !important;
    max-width: none !important;
    overflow: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    left: auto !important;
}
/* Identical square footprint for both, so UI zoom scales them the same. Glyph
   metrics differ (vertical arrows vs kebab), so the box cannot be content-sized. */
html body .top-bar #layout-toggle,
html body .top-bar #menu-btn {
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    padding: 0 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    pointer-events: auto !important;
    position: relative !important;
    left: auto !important;
}

/* Layout + Menu are never overflowed into >> — beat the hide rule. */
html body .top-bar > [data-toolbar-item="layout"][data-toolbar-overflow="1"],
html body .top-bar > [data-toolbar-item="menu"][data-toolbar-overflow="1"],
html body .top-bar #layout-toggle[data-toolbar-overflow="1"],
html body .top-bar #menu-btn[data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar > [data-toolbar-item="layout"][data-toolbar-overflow="1"],
html body.toolbar-labels .top-bar > [data-toolbar-item="menu"][data-toolbar-overflow="1"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: auto !important;
    min-width: 28px !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: initial;
    overflow: visible !important;
    border: initial;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    pointer-events: auto !important;
}
.top-bar { -webkit-app-region: no-drag; }
.top-bar * { -webkit-app-region: no-drag; }
.top-bar,
.top-bar * {
    user-select: none !important;
    -webkit-user-select: none !important;
}
.top-bar img,
.top-bar svg,
.top-bar i {
    -webkit-user-drag: none;
    pointer-events: none;
}
.top-bar button img,
.top-bar button svg,
.top-bar button i,
.top-bar .bookmark-button img,
.top-bar .bookmark-button span,
.top-bar #go-icon svg,
.top-bar #copy-url-btn i,
.top-bar .security-indicator img {
    pointer-events: none;
}
.top-bar #address-bar {
    user-select: text !important;
    -webkit-user-select: text !important;
    pointer-events: auto;
}

.toolbar-actions {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 1 auto;
    flex-shrink: 1;
    min-width: 0;
    max-width: none;
}

.top-bar > [data-toolbar-item],
.top-bar .toolbar-middle-cluster > [data-toolbar-item] {
    touch-action: none;
    flex-shrink: 0;
}

.top-bar.toolbar-reordering,
body.toolbar-icon-reordering {
    cursor: grabbing !important;
    user-select: none !important;
}

.top-bar > [data-toolbar-item].toolbar-item-dragging,
.top-bar .toolbar-middle-cluster > [data-toolbar-item].toolbar-item-dragging {
    opacity: 1;
    z-index: 40;
    transform: translateY(-5px) scale(1.12);
    filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.45))
        drop-shadow(0 0 10px rgba(90, 13, 214, 0.45));
    animation: toolbar-item-hold-pulse 0.9s ease-in-out infinite;
    will-change: transform, filter;
}

@keyframes toolbar-item-hold-pulse {
    0%,
    100% {
        transform: translateY(-5px) scale(1.1);
        filter: drop-shadow(0 7px 12px rgba(0, 0, 0, 0.4))
            drop-shadow(0 0 8px rgba(90, 13, 214, 0.35));
    }
    50% {
        transform: translateY(-8px) scale(1.16);
        filter: drop-shadow(0 12px 18px rgba(0, 0, 0, 0.5))
            drop-shadow(0 0 14px rgba(90, 13, 214, 0.55));
    }
}

body.toolbar-icon-reordering .top-bar > [data-toolbar-item]:not(.toolbar-item-dragging),
body.toolbar-icon-reordering .top-bar .toolbar-middle-cluster > [data-toolbar-item]:not(.toolbar-item-dragging) {
    opacity: 0.72;
}

.top-bar > [data-toolbar-item].toolbar-item-drop-before,
.top-bar .toolbar-middle-cluster > [data-toolbar-item].toolbar-item-drop-before {
    box-shadow: inset 3px 0 0 0 #5a0dd6 !important;
}

.top-bar > [data-toolbar-item].toolbar-item-drop-after,
.top-bar .toolbar-middle-cluster > [data-toolbar-item].toolbar-item-drop-after {
    box-shadow: inset -3px 0 0 0 #5a0dd6 !important;
}

.top-bar > [data-toolbar-item].toolbar-item-drop-stack,
.top-bar .toolbar-middle-cluster > [data-toolbar-item].toolbar-item-drop-stack {
    box-shadow: 0 0 0 2px #5a0dd6, 0 0 0 4px rgba(90, 13, 214, 0.35) !important;
    transform: scale(1.08) !important;
}

#toolbar-grouped-stash {
    display: none !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

.toolbar-icon-group {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    margin: 0 1px;
    position: relative;
    z-index: 6;
    pointer-events: auto !important;
}

.toolbar-group-btn {
    position: relative;
    z-index: 7;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    padding: 2px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border: 1px solid color-mix(in srgb, var(--toolbar-group-color, #a142f4) 55%, rgba(255, 255, 255, 0.22)) !important;
    background:
        linear-gradient(160deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.02) 46%),
        color-mix(in srgb, var(--toolbar-group-color, #a142f4) 34%, rgba(22, 22, 30, 0.78)) !important;
    border-radius: 8px !important;
    cursor: pointer;
    overflow: visible;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
    pointer-events: auto !important;
    -webkit-app-region: no-drag !important;
    box-shadow:
        0 1px 4px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
    backdrop-filter: blur(10px) saturate(1.15);
    -webkit-backdrop-filter: blur(10px) saturate(1.15);
}

.toolbar-group-btn .toolbar-group-mosaic {
    overflow: hidden;
    border-radius: 6px;
}

.toolbar-group-btn:hover,
.toolbar-group-btn.is-open {
    background:
        linear-gradient(160deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.04) 46%),
        color-mix(in srgb, var(--toolbar-group-color, #a142f4) 48%, rgba(22, 22, 30, 0.82)) !important;
    border-color: color-mix(in srgb, var(--toolbar-group-color, #a142f4) 85%, #fff) !important;
}

.toolbar-group-mosaic {
    display: grid;
    gap: 1px;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    box-sizing: border-box;
    pointer-events: none;
    align-content: stretch;
    justify-content: stretch;
    overflow: hidden;
}

.toolbar-group-mosaic.count-1,
.toolbar-group-mosaic.is-single {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
}

.toolbar-group-mosaic.count-2 {
    display: block;
    position: relative;
    gap: 0;
}

.toolbar-group-mosaic.count-2 .toolbar-group-mosaic-cell {
    position: absolute;
    width: 56%;
    height: 56%;
    min-width: 0;
    min-height: 0;
}

.toolbar-group-mosaic.count-2 .toolbar-group-mosaic-cell:nth-child(1) {
    top: 0;
    left: 0;
    z-index: 1;
}

.toolbar-group-mosaic.count-2 .toolbar-group-mosaic-cell:nth-child(2) {
    right: 0;
    bottom: 0;
    z-index: 2;
}

/* Front icon cuts into the back one with a matching disc, no stroke until hover. */
.toolbar-group-mosaic.count-2 .toolbar-group-mosaic-cell:nth-child(2) .toolbar-group-mini-btn {
    border-radius: 50%;
    background: color-mix(in srgb, var(--toolbar-group-color, #a142f4) 42%, rgba(22, 22, 30, 0.96));
    border: 0;
    box-shadow: none;
    padding: 1px;
}

.toolbar-group-btn:hover .toolbar-group-mosaic.count-2 .toolbar-group-mosaic-cell:nth-child(2) .toolbar-group-mini-btn,
.toolbar-group-btn.is-open .toolbar-group-mosaic.count-2 .toolbar-group-mosaic-cell:nth-child(2) .toolbar-group-mini-btn {
    border: 1px solid rgba(255, 255, 255, 0.22);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.28);
}

.toolbar-group-mosaic.count-3,
.toolbar-group-mosaic.count-4 {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
}

.toolbar-group-mosaic.count-3 .toolbar-group-mosaic-cell:nth-child(3) {
    grid-column: 1 / -1;
    width: 50%;
    justify-self: center;
}

.toolbar-group-mosaic-cell {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: transparent;
    overflow: hidden;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    padding: 0;
}

.toolbar-group-mini-btn {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    border-radius: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    box-shadow: none;
    box-sizing: border-box;
    overflow: hidden;
    flex-shrink: 1;
}

.toolbar-group-mosaic.is-single .toolbar-group-mini-btn,
.toolbar-group-mosaic.count-1 .toolbar-group-mini-btn {
    border-radius: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.toolbar-group-btn .toolbar-group-mini-btn img {
    width: 70% !important;
    height: 70% !important;
    max-width: 70% !important;
    max-height: 70% !important;
    display: block !important;
    object-fit: contain !important;
    object-position: center !important;
    flex-shrink: 1 !important;
}

.toolbar-group-btn .toolbar-group-mosaic.count-2 .toolbar-group-mini-btn img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
}

.toolbar-group-mosaic.is-custom .toolbar-group-mosaic-cell,
.toolbar-group-mosaic.is-custom .toolbar-group-mini-btn {
    width: 100%;
    height: 100%;
    border-radius: 6px;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.toolbar-group-btn .toolbar-group-mosaic.is-custom img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important;
    border-radius: 6px;
}

.toolbar-group-mosaic-fallback {
    font-size: 8px;
    font-weight: 700;
    line-height: 1;
    color: rgba(255, 255, 255, 0.95);
}

.toolbar-group-context-menu .tab-group-color-swatch,
.toolbar-group-context-menu button.tab-group-color-swatch {
    background: var(--swatch-color) !important;
}

.toolbar-group-rename-row {
    padding: 2px 8px 8px;
}

.toolbar-group-rename-input {
    width: 100%;
    box-sizing: border-box;
    height: 30px;
    padding: 0 10px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--stealth-cut-sm, 8px 2px 2px 2px);
    background: rgba(0, 0, 0, 0.28);
    color: inherit;
    font-size: 13px;
    font-weight: 600;
    outline: none;
}

.toolbar-group-rename-input:focus {
    border-color: #5a0dd6;
    box-shadow: 0 0 0 2px rgba(90, 13, 214, 0.35);
}

[data-theme="light"] .toolbar-group-rename-input {
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(0, 0, 0, 0.14);
    color: #202124;
}

.top-bar > [data-toolbar-item].toolbar-item-drop-stack.toolbar-icon-group .toolbar-group-btn,
.top-bar > [data-toolbar-item].toolbar-item-drop-stack .toolbar-icon-btn,
.top-bar > [data-toolbar-item].toolbar-item-drop-stack .instant-answer-button,
.top-bar .toolbar-middle-cluster > [data-toolbar-item].toolbar-item-drop-stack.toolbar-icon-group .toolbar-group-btn,
.top-bar .toolbar-middle-cluster > [data-toolbar-item].toolbar-item-drop-stack .toolbar-icon-btn,
.top-bar .toolbar-middle-cluster > [data-toolbar-item].toolbar-item-drop-stack .instant-answer-button {
    outline: 2px solid #5a0dd6;
    outline-offset: 2px;
}

.toolbar-group-popup {
    position: fixed;
    display: none;
    flex-direction: column;
    width: 248px;
    max-width: min(248px, calc(100vw - 24px));
    min-width: 160px;
    min-height: 120px;
    padding: 10px 10px 12px;
    box-sizing: border-box;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(22, 22, 30, var(--panel-fill-alpha, 0.55));
    box-shadow:
        0 16px 48px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.16);
    color: #f3f3f7;
    --panel-fill-alpha: 0.55;
}

.toolbar-group-popup.show {
    display: flex;
}

.toolbar-group-popup[data-columns="1"] {
    width: 160px;
    max-width: min(160px, calc(100vw - 24px));
}

.toolbar-group-popup[data-columns="2"] {
    width: 170px;
    max-width: min(170px, calc(100vw - 24px));
}

body > #toolbar-group-popup.toolbar-group-popup,
body > .toolbar-group-popup {
    right: auto !important;
    bottom: auto !important;
}

.toolbar-group-popup-sheen {
    pointer-events: none;
    position: absolute;
    inset: 0;
    z-index: 0;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.12), transparent 42%);
    opacity: 0.55;
}

.toolbar-group-popup-header {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    z-index: 1;
}

.toolbar-group-name-input {
    flex: 1;
    min-width: 0;
    height: 28px;
    padding: 0 10px;
    border: 1px solid color-mix(in srgb, var(--toolbar-group-color, #a142f4) 55%, rgba(255, 255, 255, 0.2));
    border-radius: var(--stealth-cut-sm, 8px 2px 2px 2px);
    background: rgba(0, 0, 0, 0.22);
    color: inherit;
    font-size: 13px;
    font-weight: 600;
    outline: none;
}

.toolbar-group-name-input:focus {
    border-color: var(--toolbar-group-color, #5a0dd6);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--toolbar-group-color, #5a0dd6) 35%, transparent);
}

.toolbar-group-popup-close {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: var(--stealth-cut-sm, 8px 2px 2px 2px);
    background: rgba(255, 255, 255, 0.08);
    color: inherit;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}

.toolbar-group-popup-close:hover {
    background: rgba(255, 255, 255, 0.16);
}

.toolbar-group-popup-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.toolbar-group-popup[data-columns="1"] .toolbar-group-popup-grid {
    grid-template-columns: minmax(0, 1fr);
}

.toolbar-group-popup[data-columns="2"] .toolbar-group-popup-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.toolbar-group-popup-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    min-width: 0;
    padding: 8px 4px 6px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--stealth-cut, 12px 2px 2px 2px);
    background: rgba(255, 255, 255, 0.06);
    color: inherit;
    cursor: pointer;
}

.toolbar-group-popup-item:hover {
    background: color-mix(in srgb, var(--toolbar-group-color, #5a0dd6) 28%, rgba(255, 255, 255, 0.1));
    border-color: color-mix(in srgb, var(--toolbar-group-color, #5a0dd6) 55%, rgba(255, 255, 255, 0.2));
}

.toolbar-group-popup-mini {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.toolbar-group-popup-item:hover .toolbar-group-popup-mini,
.toolbar-group-popup-item:focus-visible .toolbar-group-popup-mini {
    background: rgba(45, 45, 45, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

.toolbar-group-popup-item img {
    width: 16px;
    height: 16px;
    display: block;
    object-fit: contain;
}

.tab-context-section-label {
    padding: 6px 8px 2px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    opacity: 0.55;
}

.toolbar-group-icon-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 4px 8px 8px;
}

.toolbar-group-icon-pick {
    width: 28px;
    height: 28px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--stealth-cut-sm, 8px 2px 2px 2px);
    background: rgba(255, 255, 255, 0.06);
    color: inherit;
    cursor: pointer;
}

.toolbar-group-icon-pick:hover,
.toolbar-group-icon-pick.active {
    border-color: rgba(90, 13, 214, 0.85);
    background: rgba(90, 13, 214, 0.22);
}

.toolbar-group-icon-pick img {
    width: 14px;
    height: 14px;
    display: block;
    object-fit: contain;
}

.toolbar-group-context-menu .tab-context-item.is-active {
    color: #c4b5fd;
}

.toolbar-group-popup-item-fallback {
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--stealth-cut-sm, 8px 2px 2px 2px);
    background: color-mix(in srgb, var(--toolbar-group-color, #a142f4) 45%, rgba(0, 0, 0, 0.35));
    font-size: 11px;
    font-weight: 700;
}

.toolbar-group-popup-item-label {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10px;
    line-height: 1.2;
    opacity: 0.9;
}

.toolbar-group-context-menu {
    min-width: 168px;
    padding: 6px;
}

.toolbar-group-context-menu .tab-group-color-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px 6px;
}

.security-toggle-container {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    visibility: visible !important;
    opacity: 1 !important;
}

.clipboard-history-toggle-container {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
}

.downloads-toggle-container {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
}

.link-scan-toggle-container {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
}

#link-scan-toggle-container.feature-off,
#link-scan-toggle-container[hidden],
#link-scan-toggle-container.appearance-hidden {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

.pip-toggle-container {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
}

.playlist-toggle-container:not([hidden]):not(.appearance-hidden) {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
}

.audio-toggle-container:not([hidden]):not(.appearance-hidden),
.notes-toggle-container:not([hidden]):not(.appearance-hidden),
.rss-toggle-container:not([hidden]):not(.appearance-hidden),
.vpn-toggle-container:not([hidden]):not(.appearance-hidden),
.tor-toggle-container:not([hidden]):not(.appearance-hidden) {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
}

#rss-toolbar-container[hidden],
#rss-toolbar-container.appearance-hidden,
.top-bar #rss-toolbar-container[hidden],
.top-bar #rss-toolbar-container.appearance-hidden {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

#split-tunnel-toolbar-container[hidden],
#split-tunnel-toolbar-container.appearance-hidden,
.top-bar #split-tunnel-toolbar-container[hidden],
.top-bar #split-tunnel-toolbar-container.appearance-hidden,
#proxy-toolbar-container[hidden],
#proxy-toolbar-container.appearance-hidden,
.top-bar #proxy-toolbar-container[hidden],
.top-bar #proxy-toolbar-container.appearance-hidden,
#vpn-toolbar-container[hidden],
#vpn-toolbar-container.appearance-hidden,
.top-bar #vpn-toolbar-container[hidden],
.top-bar #vpn-toolbar-container.appearance-hidden,
#tor-toolbar-container[hidden],
#tor-toolbar-container.appearance-hidden,
.top-bar #tor-toolbar-container[hidden],
.top-bar #tor-toolbar-container.appearance-hidden {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.offline-page-toggle-container:not([hidden]):not(.appearance-hidden),
.file-converter-toggle-container:not([hidden]):not(.appearance-hidden),
.meme-maker-toggle-container:not([hidden]):not(.appearance-hidden),
.night-light-toggle-container:not([hidden]):not(.appearance-hidden),
.hide-it-toggle-container:not([hidden]):not(.appearance-hidden),
.no-dubs-netflix-toggle-container:not([hidden]):not(.appearance-hidden),
.wayback-look-toggle-container:not([hidden]):not(.appearance-hidden),
.reading-mode-toggle-container:not([hidden]):not(.appearance-hidden) {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
}

#audio-toggle-container[hidden],
#audio-toggle-container.appearance-hidden,
.top-bar #audio-toggle-container[hidden],
.top-bar #audio-toggle-container.appearance-hidden,
#notes-toggle-container[hidden],
#notes-toggle-container.appearance-hidden,
.top-bar #notes-toggle-container[hidden],
.top-bar #notes-toggle-container.appearance-hidden,
#offline-page-toggle-container[hidden],
#offline-page-toggle-container.appearance-hidden,
.top-bar #offline-page-toggle-container[hidden],
.top-bar #offline-page-toggle-container.appearance-hidden,
#file-converter-toggle-container[hidden],
#file-converter-toggle-container.appearance-hidden,
.top-bar #file-converter-toggle-container[hidden],
.top-bar #file-converter-toggle-container.appearance-hidden,
#meme-maker-toggle-container[hidden],
#meme-maker-toggle-container.appearance-hidden,
.top-bar #meme-maker-toggle-container[hidden],
.top-bar #meme-maker-toggle-container.appearance-hidden,
#night-light-toggle-container[hidden],
#night-light-toggle-container.appearance-hidden,
.top-bar #night-light-toggle-container[hidden],
.top-bar #night-light-toggle-container.appearance-hidden,
#hide-it-toggle-container[hidden],
#hide-it-toggle-container.appearance-hidden,
.top-bar #hide-it-toggle-container[hidden],
.top-bar #hide-it-toggle-container.appearance-hidden,
#no-dubs-netflix-toggle-container[hidden],
#no-dubs-netflix-toggle-container.appearance-hidden,
.top-bar #no-dubs-netflix-toggle-container[hidden],
.top-bar #no-dubs-netflix-toggle-container.appearance-hidden,
#wayback-look-toggle-container[hidden],
#wayback-look-toggle-container.appearance-hidden,
.top-bar #wayback-look-toggle-container[hidden],
.top-bar #wayback-look-toggle-container.appearance-hidden,
#reading-mode-toggle-container[hidden],
#reading-mode-toggle-container.appearance-hidden,
.top-bar #reading-mode-toggle-container[hidden],
.top-bar #reading-mode-toggle-container.appearance-hidden {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.top-bar .toolbar-user-hidden,
#chrome-tools-dock .toolbar-user-hidden,
.toolbar-user-hidden[data-toolbar-item],
#powerup-toolbar .toolbar-user-hidden,
.top-bar #powerup-toolbar .toolbar-user-hidden {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    opacity: 0 !important;
}

.settings-toggle-container:not([hidden]):not(.appearance-hidden),
.history-toggle-container:not([hidden]):not(.appearance-hidden),
.password-toggle-container:not([hidden]):not(.appearance-hidden) {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
}

#playlist-toggle-container[hidden],
#playlist-toggle-container.appearance-hidden,
#settings-toggle-container[hidden],
#settings-toggle-container.appearance-hidden,
#history-toggle-container[hidden],
#history-toggle-container.appearance-hidden,
#password-toggle-container[hidden],
#password-toggle-container.appearance-hidden,
.top-bar #playlist-toggle-container[hidden],
.top-bar #playlist-toggle-container.appearance-hidden,
.top-bar #settings-toggle-container[hidden],
.top-bar #settings-toggle-container.appearance-hidden,
.top-bar #history-toggle-container[hidden],
.top-bar #history-toggle-container.appearance-hidden,
.top-bar #password-toggle-container[hidden],
.top-bar #password-toggle-container.appearance-hidden {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

#pip-toggle-btn.is-active {
    border-color: rgba(124, 58, 237, 0.65);
    background: rgba(73, 0, 194, 0.35);
}

#pip-toggle-btn.is-disabled,
#pip-toggle-btn[aria-disabled="true"],
#pip-toggle-btn:disabled {
    opacity: 0.38 !important;
    cursor: not-allowed;
    filter: grayscale(1);
}

#pip-toggle-btn.is-disabled:hover,
#pip-toggle-btn[aria-disabled="true"]:hover,
#pip-toggle-btn:disabled:hover {
    background: rgba(45, 45, 45, 0.95);
    border-color: rgba(255, 255, 255, 0.14);
}

#pip-toggle-btn.is-disabled img,
#pip-toggle-btn[aria-disabled="true"] img,
#pip-toggle-btn:disabled img {
    filter: brightness(0) saturate(100%) invert(55%) !important;
}

.screenshot-toggle-container {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
    margin: 0 2px 0 0;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
}

.screenshot-popup {
    position: fixed;
    z-index: 2147483647;
    min-width: 168px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 6px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(32, 33, 36, 0.96);
    color: #e8eaed;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
    overflow: hidden;
    -webkit-app-region: no-drag;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.14s ease;
}

.screenshot-popup.show {
    opacity: 1;
    pointer-events: auto;
}

.screenshot-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    border: none;
    background: transparent;
    color: #e8eaed;
    font-size: 13px;
    line-height: 1.2;
    text-align: left;
    padding: 9px 10px;
    border-radius: 8px;
    cursor: pointer;
}

.screenshot-menu-item i {
    width: 14px;
    text-align: center;
    opacity: 0.9;
    color: #b39dff;
}

.screenshot-menu-item:hover {
    background: rgba(255, 255, 255, 0.08);
}

.screenshot-menu-item:disabled {
    opacity: 0.55;
    cursor: wait;
}

.screenshot-menu-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    border: none;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    background: transparent;
    color: #e8eaed;
    font-size: 12px;
    line-height: 1.2;
    text-align: left;
    padding: 9px 10px;
    margin-top: 2px;
    border-radius: 8px;
    cursor: pointer;
}

.screenshot-menu-toggle i {
    width: 14px;
    text-align: center;
    opacity: 0.9;
    color: #b39dff;
}

.screenshot-menu-toggle .screenshot-toggle-state {
    margin-left: auto;
    font-size: 11px;
    opacity: 0.7;
    min-width: 22px;
    text-align: right;
}

.screenshot-menu-toggle[aria-pressed="true"] {
    background: rgba(179, 157, 255, 0.12);
}

.screenshot-menu-toggle[aria-pressed="true"] .screenshot-toggle-state {
    color: #b39dff;
    opacity: 1;
}

.screenshot-menu-toggle:hover {
    background: rgba(255, 255, 255, 0.08);
}

#screenshot-toggle-btn.capturing {
    opacity: 0.65;
    pointer-events: none;
}

[data-theme="light"] .screenshot-popup {
    background: rgba(255, 255, 255, 0.97);
    color: #202124;
    border-color: rgba(0, 0, 0, 0.12);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
}

[data-theme="light"] .screenshot-menu-item {
    color: #202124;
}

[data-theme="light"] .screenshot-menu-item:hover {
    background: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .screenshot-menu-toggle {
    color: #202124;
    border-top-color: rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .screenshot-menu-toggle:hover {
    background: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .screenshot-menu-toggle[aria-pressed="true"] {
    background: rgba(95, 70, 180, 0.1);
}

.screenshot-gif-overlay {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    pointer-events: none;
    -webkit-app-region: no-drag;
}

.screenshot-gif-overlay[hidden] {
    display: none !important;
}

.screenshot-gif-bar {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(20, 21, 24, 0.94);
    color: #e8eaed;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
    pointer-events: auto;
    -webkit-app-region: no-drag;
}

.screenshot-gif-bar .gif-rec-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ff5a5f;
    box-shadow: 0 0 0 0 rgba(255, 90, 95, 0.55);
    animation: gif-rec-pulse 1.1s ease-out infinite;
}

@keyframes gif-rec-pulse {
    0% { box-shadow: 0 0 0 0 rgba(255, 90, 95, 0.55); }
    70% { box-shadow: 0 0 0 8px rgba(255, 90, 95, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 90, 95, 0); }
}

.screenshot-gif-bar .gif-rec-timer {
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    min-width: 42px;
}

.screenshot-gif-bar .gif-rec-label {
    font-size: 12px;
    opacity: 0.8;
}

.screenshot-gif-bar button {
    border: none;
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    color: #fff;
    background: #ff5a5f;
}

.screenshot-gif-bar button.gif-cancel {
    background: rgba(255, 255, 255, 0.12);
    color: #e8eaed;
}

.screenshot-gif-bar button:disabled {
    opacity: 0.6;
    cursor: wait;
}

[data-theme="light"] .screenshot-gif-bar {
    background: rgba(255, 255, 255, 0.96);
    color: #202124;
    border-color: rgba(0, 0, 0, 0.12);
}

[data-theme="light"] .screenshot-gif-bar button.gif-cancel {
    background: rgba(0, 0, 0, 0.08);
    color: #202124;
}

.screenshot-clip-overlay {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    cursor: crosshair;
    background: rgba(0, 0, 0, 0.38);
    -webkit-app-region: no-drag;
    user-select: none;
    touch-action: none;
}

.screenshot-clip-overlay.selecting {
    background: transparent;
}

.screenshot-clip-overlay[hidden] {
    display: none !important;
}

.screenshot-clip-hint {
    position: fixed;
    left: 50%;
    top: 28px;
    transform: translateX(-50%);
    z-index: 1;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(20, 21, 24, 0.92);
    color: #e8eaed;
    font-size: 13px;
    line-height: 1.2;
    white-space: nowrap;
    pointer-events: none;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.screenshot-clip-selection {
    position: fixed;
    z-index: 2;
    border: 2px solid #b39dff;
    background: transparent;
    box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.45);
    pointer-events: none;
    display: none;
}

.screenshot-clip-selection.active {
    display: block;
}

.screenshot-clip-size {
    position: absolute;
    left: 0;
    top: calc(100% + 6px);
    padding: 3px 7px;
    border-radius: 6px;
    background: rgba(20, 21, 24, 0.92);
    color: #e8eaed;
    font-size: 11px;
    line-height: 1.2;
    white-space: nowrap;
    pointer-events: none;
}

[data-theme="light"] .screenshot-clip-hint,
[data-theme="light"] .screenshot-clip-size {
    background: rgba(255, 255, 255, 0.96);
    color: #202124;
    border-color: rgba(0, 0, 0, 0.12);
}

.toolbar-icon-btn {
    width: 25px;
    height: 25px;
    min-width: 25px;
    max-width: 25px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(45, 45, 45, 0.95);
    color: #ffffff;
    cursor: pointer;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    visibility: visible !important;
    opacity: 1 !important;
    -webkit-appearance: none;
    appearance: none;
    position: relative;
}

.toolbar-icon-btn img {
    width: 15px;
    height: 15px;
    object-fit: contain;
    pointer-events: none;
    /* Default / dark: white, then per-icon colors below */
    filter: brightness(0) saturate(100%) invert(100%);
}

/* Stealth AntiSponsor: brand tile fills the circular toolbar button */
.toolbar-icon-btn.stealth-sponsor-powerup-btn {
    overflow: hidden;
    padding: 0;
    background: transparent;
    border-color: rgba(120, 70, 255, 0.45);
}

.toolbar-icon-btn.stealth-sponsor-powerup-btn img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 50%;
    filter: none !important;
    display: block;
}

#screenshot-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    /* Cyan */
    filter: brightness(0) saturate(100%) invert(72%) sepia(62%) saturate(2800%) hue-rotate(160deg) brightness(1.05);
}

#security-toggle-btn img {
    /* Brand purple */
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
}

#pip-toggle-btn img {
    /* Amber */
    filter: brightness(0) saturate(100%) invert(78%) sepia(48%) saturate(900%) hue-rotate(359deg) brightness(102%) contrast(101%);
}

#downloads-toggle-btn img {
    width: 10px;
    height: 10px;
    /* Soft green */
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(85deg) brightness(1.05);
}

#link-scan-toggle-btn img {
    width: 10px;
    height: 10px;
    display: block;
    object-fit: contain;
    /* Idle / off: muted gray */
    filter: brightness(0) saturate(100%) invert(62%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0.95);
}

#link-scan-toggle-btn.is-active img {
    /* On: soft green */
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(85deg) brightness(1.05);
}

#settings-toggle-btn img {
    /* Cool blue; gear glyph fills its viewBox, so keep it smaller than peers */
    width: 10px;
    height: 10px;
    filter: brightness(0) saturate(100%) invert(58%) sepia(48%) saturate(1200%) hue-rotate(185deg) brightness(1.05);
}

#password-toggle-btn img {
    /* Soft violet key; match settings icon size */
    width: 10px;
    height: 10px;
    filter: brightness(0) saturate(100%) invert(48%) sepia(70%) saturate(1800%) hue-rotate(240deg) brightness(1.05);
}

#payment-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(48%) sepia(70%) saturate(1800%) hue-rotate(240deg) brightness(1.05);
}

#playlist-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    /* Magenta accent */
    filter: brightness(0) saturate(100%) invert(52%) sepia(68%) saturate(1800%) hue-rotate(300deg) brightness(1.02);
}

#audio-toggle-btn img {
    /* Vibrant red waveform accent */
    filter: brightness(0) saturate(100%) invert(42%) sepia(78%) saturate(2200%) hue-rotate(340deg) brightness(1.05);
    width: 11px;
    height: 11px;
    display: block;
}

#media-controls-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(130deg) brightness(1.05);
}

#video-downloader-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(68%) sepia(48%) saturate(1200%) hue-rotate(196deg) brightness(1.05);
}

#cast-to-tv-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(24%) sepia(90%) saturate(4200%) hue-rotate(258deg) brightness(0.95);
}

#audio-toggle-btn.is-open,
#audio-toggle-btn.is-normalizing {
    border-color: rgba(239, 68, 68, 0.65);
    background: rgba(153, 27, 27, 0.28);
}

#clipboard-history-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    /* Soft teal clipboard accent */
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(130deg) brightness(1.05);
}

#split-tunnel-toolbar-btn.is-disabled,
#split-tunnel-toolbar-btn:disabled {
    opacity: 0.42;
    cursor: not-allowed;
}

#rss-toolbar-btn.has-unread {
    border-color: color-mix(in srgb, #3b82f6 55%, transparent);
    background: color-mix(in srgb, #3b82f6 22%, transparent);
}

.rss-unread-ticker {
    position: absolute;
    top: -4px;
    right: -5px;
    min-width: 12px;
    height: 12px;
    padding: 0 3px;
    border-radius: 999px;
    background: #3b82f6;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    line-height: 12px;
    text-align: center;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
    pointer-events: none;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#rss-toolbar-btn .rss-unread-ticker[hidden] {
    display: none !important;
}

#rss-toolbar-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(48%) sepia(80%) saturate(1800%) hue-rotate(200deg) brightness(1.05);
}

#split-tunnel-toolbar-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(52%) sepia(12%) saturate(700%) hue-rotate(175deg) brightness(0.95);
}

#proxy-toolbar-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(62%) sepia(48%) saturate(1400%) hue-rotate(230deg) brightness(1.05);
}

#proxy-toolbar-btn.is-active {
    border-color: rgba(167, 139, 250, 0.75);
    background: rgba(76, 29, 149, 0.38);
}

#proxy-toolbar-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(82%) sepia(28%) saturate(900%) hue-rotate(220deg) brightness(1.08);
}

#vpn-toolbar-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(62%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0.95);
}

#vpn-toolbar-btn.is-active {
    border-color: rgba(52, 211, 153, 0.7);
    background: rgba(6, 95, 70, 0.38);
}

#vpn-toolbar-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(85deg) brightness(1.05);
}

#vpn-toolbar-btn.is-connecting {
    border-color: rgba(250, 204, 21, 0.65);
    background: rgba(113, 63, 18, 0.32);
}

#tor-toolbar-btn img {
    width: 13px;
    height: 13px;
    display: block;
    object-fit: contain;
    filter: grayscale(1) brightness(0.65);
}

#tor-toolbar-btn.is-active {
    border-color: rgba(155, 89, 182, 0.7);
    background: rgba(74, 44, 90, 0.42);
}

#tor-toolbar-btn.is-active img,
#tor-toolbar-btn.is-connecting img {
    filter: none;
}

#tor-toolbar-btn.is-connecting {
    border-color: rgba(155, 89, 182, 0.45);
    background: rgba(74, 44, 90, 0.22);
}

#tor-toolbar-btn.is-error {
    border-color: rgba(239, 68, 68, 0.7);
    background: rgba(153, 27, 27, 0.32);
}

#vpn-toolbar-btn.is-connecting,
#tor-toolbar-btn.is-connecting {
    animation: vpn-tor-toolbar-pulse 1.2s ease-in-out infinite;
}

#vpn-toolbar-btn:disabled,
#tor-toolbar-btn:disabled {
    opacity: 0.55;
    cursor: wait;
}

@keyframes vpn-tor-toolbar-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.62; }
}

#offline-page-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(68%) sepia(62%) saturate(1600%) hue-rotate(345deg) brightness(1.05);
}

#file-converter-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(62%) sepia(78%) saturate(2200%) hue-rotate(285deg) brightness(1.05);
}

#meme-maker-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(86%) sepia(62%) saturate(1200%) hue-rotate(5deg) brightness(1.05);
}

#no-dubs-netflix-toggle-btn img {
    width: 18px;
    height: 18px;
    display: block;
    object-fit: contain;
    border-radius: 4px;
    filter: none !important;
}
#hide-it-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(86%) sepia(62%) saturate(1200%) hue-rotate(5deg) brightness(1.05);
}

#block-it-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(28%) sepia(82%) saturate(2400%) hue-rotate(330deg) brightness(0.98);
}

#parental-controls-toggle-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(24%) sepia(90%) saturate(3200%) hue-rotate(260deg) brightness(1.1);
}

#wayback-look-toggle-btn img {
    width: 12px;
    height: 12px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(78%) sepia(48%) saturate(900%) hue-rotate(359deg) brightness(102%) contrast(101%);
}

#crypto-toolbar-btn.has-alerts {
    border-color: color-mix(in srgb, var(--accent, #5a0dd6) 55%, transparent);
    background: color-mix(in srgb, var(--accent, #5a0dd6) 22%, transparent);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent, #5a0dd6) 18%, transparent);
}

#crypto-toolbar-btn.has-fired-alert {
    border-color: rgba(229, 57, 53, 0.8);
    background: rgba(120, 20, 20, 0.42);
    box-shadow: 0 0 0 1px rgba(229, 57, 53, 0.25), 0 0 10px rgba(229, 57, 53, 0.28);
    animation: crypto-alert-pulse 1.4s ease-in-out infinite;
}

@keyframes crypto-alert-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.04); }
}

.crypto-alert-ticker {
    position: absolute;
    top: -4px;
    right: -5px;
    min-width: 12px;
    height: 12px;
    padding: 0 3px;
    border-radius: 999px;
    background: var(--accent, #5a0dd6);
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    line-height: 12px;
    text-align: center;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
    pointer-events: none;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#crypto-toolbar-btn.has-fired-alert .crypto-alert-ticker {
    background: #e53935;
}

#crypto-toolbar-btn .crypto-alert-ticker[hidden] {
    display: none !important;
}

#stocks-toolbar-btn.has-alerts {
    border-color: color-mix(in srgb, #06b6d4 55%, transparent);
    background: color-mix(in srgb, #06b6d4 22%, transparent);
    box-shadow: 0 0 0 1px color-mix(in srgb, #06b6d4 18%, transparent);
}

#stocks-toolbar-btn.has-fired-alert {
    border-color: rgba(229, 57, 53, 0.8);
    background: rgba(120, 20, 20, 0.42);
    box-shadow: 0 0 0 1px rgba(229, 57, 53, 0.25), 0 0 10px rgba(229, 57, 53, 0.28);
    animation: stocks-alert-pulse 1.4s ease-in-out infinite;
}

@keyframes stocks-alert-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.04); }
}

.stocks-alert-ticker {
    position: absolute;
    top: -4px;
    right: -5px;
    min-width: 12px;
    height: 12px;
    padding: 0 3px;
    border-radius: 999px;
    background: #06b6d4;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    line-height: 12px;
    text-align: center;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
    pointer-events: none;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#stocks-toolbar-btn.has-fired-alert .stocks-alert-ticker {
    background: #e53935;
}

#stocks-toolbar-btn .stocks-alert-ticker[hidden] {
    display: none !important;
}

#stocks-toolbar-btn img {
    width: 11px;
    height: 11px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(68%) sepia(58%) saturate(1200%) hue-rotate(155deg) brightness(1.05);
}

#social-toolbar-btn img {
    width: 17px;
    height: 17px;
    display: block;
    object-fit: contain;
    filter: none;
}

#crypto-toolbar-btn img {
    width: 17px;
    height: 17px;
    display: block;
    object-fit: contain;
    filter: none;
}

#email-toolbar-btn img {
    width: 12px;
    height: 12px;
    object-fit: contain;
    /* Envelope SVG is solid black paths; invert to a readable accent */
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(160deg) brightness(1.05);
}

/* Light theme: muted ink tones (no neon). Keep subtle hue identity only. */
[data-theme="light"] .toolbar-icon-btn {
    border-color: rgba(40, 32, 24, 0.22);
}

[data-theme="light"] .toolbar-icon-btn img {
    filter: brightness(0) saturate(100%) invert(28%) sepia(8%) saturate(450%) hue-rotate(8deg) brightness(0.95);
}

[data-theme="light"] #screenshot-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(36%) sepia(18%) saturate(420%) hue-rotate(155deg) brightness(0.92);
}

[data-theme="light"] #security-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(28%) sepia(35%) saturate(700%) hue-rotate(245deg) brightness(0.9);
}

[data-theme="light"] #pip-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(42%) sepia(22%) saturate(480%) hue-rotate(8deg) brightness(0.95);
}

[data-theme="light"] #downloads-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(38%) sepia(16%) saturate(420%) hue-rotate(85deg) brightness(0.92);
}

[data-theme="light"] #link-scan-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(40%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0.88);
}

[data-theme="light"] #link-scan-toggle-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(34%) sepia(28%) saturate(500%) hue-rotate(110deg) brightness(0.92);
}

[data-theme="light"] #settings-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(34%) sepia(16%) saturate(500%) hue-rotate(180deg) brightness(0.92);
}

[data-theme="light"] #password-toggle-btn img,
[data-theme="light"] #payment-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(30%) sepia(28%) saturate(600%) hue-rotate(240deg) brightness(0.9);
}

[data-theme="light"] #playlist-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(32%) sepia(24%) saturate(520%) hue-rotate(290deg) brightness(0.92);
}

[data-theme="light"] #audio-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(32%) sepia(30%) saturate(550%) hue-rotate(340deg) brightness(0.92);
}

[data-theme="light"] #media-controls-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(36%) sepia(16%) saturate(450%) hue-rotate(130deg) brightness(0.92);
}

[data-theme="light"] #video-downloader-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(34%) sepia(18%) saturate(480%) hue-rotate(190deg) brightness(0.92);
}

[data-theme="light"] #cast-to-tv-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(18%) sepia(80%) saturate(3500%) hue-rotate(258deg) brightness(0.9);
}

[data-theme="light"] #clipboard-history-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(36%) sepia(16%) saturate(450%) hue-rotate(130deg) brightness(0.92);
}

[data-theme="light"] #rss-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(34%) sepia(22%) saturate(520%) hue-rotate(195deg) brightness(0.92);
}

[data-theme="light"] #split-tunnel-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(36%) sepia(12%) saturate(650%) hue-rotate(175deg) brightness(0.9);
}

[data-theme="light"] #proxy-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(34%) sepia(24%) saturate(900%) hue-rotate(230deg) brightness(0.92);
}

[data-theme="light"] #proxy-toolbar-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(32%) sepia(28%) saturate(1100%) hue-rotate(235deg) brightness(0.95);
}

[data-theme="light"] #vpn-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(40%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0.88);
}

[data-theme="light"] #vpn-toolbar-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(38%) sepia(16%) saturate(420%) hue-rotate(85deg) brightness(0.92);
}

[data-theme="light"] #tor-toolbar-btn img {
    filter: grayscale(1) brightness(0.75);
}

[data-theme="light"] #tor-toolbar-btn.is-active img,
[data-theme="light"] #tor-toolbar-btn.is-connecting img {
    filter: none;
}

[data-theme="light"] #offline-page-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(40%) sepia(18%) saturate(420%) hue-rotate(350deg) brightness(0.94);
}

[data-theme="light"] #file-converter-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(32%) sepia(22%) saturate(500%) hue-rotate(275deg) brightness(0.92);
}

[data-theme="light"] #meme-maker-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(42%) sepia(90%) saturate(1800%) hue-rotate(5deg) brightness(0.95);
}


[data-theme="light"] #hide-it-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(42%) sepia(14%) saturate(380%) hue-rotate(20deg) brightness(0.94);
}

[data-theme="light"] #block-it-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(28%) sepia(30%) saturate(600%) hue-rotate(330deg) brightness(0.9);
}

[data-theme="light"] #parental-controls-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(22%) sepia(40%) saturate(800%) hue-rotate(260deg) brightness(0.9);
}

[data-theme="light"] #wayback-look-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(40%) sepia(18%) saturate(420%) hue-rotate(8deg) brightness(0.94);
}

[data-theme="light"] #email-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(34%) sepia(16%) saturate(450%) hue-rotate(160deg) brightness(0.92);
}

[data-theme="light"] #reading-mode-toggle-btn img,
[data-theme="light"] .top-bar #reading-mode-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(36%) sepia(16%) saturate(420%) hue-rotate(90deg) brightness(0.92) !important;
}

[data-theme="light"] #notes-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(30%) sepia(28%) saturate(580%) hue-rotate(245deg) brightness(0.9);
}

[data-theme="light"] #night-light-toggle-btn img,
[data-theme="light"] .top-bar #night-light-toggle-btn img {
    filter: saturate(0.42) brightness(0.82) contrast(0.95) !important;
}

[data-theme="light"] #crypto-toolbar-btn img {
    filter: saturate(0.55) brightness(0.88) contrast(0.96);
}

[data-theme="light"] #stocks-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(40%) sepia(80%) saturate(1200%) hue-rotate(155deg) brightness(0.95);
}

[data-theme="light"] #social-toolbar-btn img {
    filter: saturate(0.55) brightness(0.88) contrast(0.96);
}

[data-theme="light"] #instant-answer-btn img,
[data-theme="light"] #ai-assistant-btn img {
    filter: saturate(0.5) brightness(0.85) contrast(0.96);
}

[data-theme="light"] .instant-answer-button:hover {
    background: rgba(91, 33, 182, 0.12) !important;
    border-color: rgba(91, 33, 182, 0.35) !important;
}

/* Stealth Purple: purple-family tints, still distinct per icon */
[data-theme="stealth"] #screenshot-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(78%) sepia(35%) saturate(1200%) hue-rotate(200deg) brightness(1.05);
}

[data-theme="stealth"] #security-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(62%) saturate(2800%) hue-rotate(250deg) brightness(1.05);
}

[data-theme="stealth"] #pip-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(85%) sepia(20%) saturate(900%) hue-rotate(280deg) brightness(1.05);
}

[data-theme="stealth"] #downloads-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(90%) sepia(15%) saturate(500%) hue-rotate(240deg) brightness(1.05);
}

[data-theme="stealth"] #link-scan-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(70%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0.95);
}

[data-theme="stealth"] #link-scan-toggle-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(82%) sepia(28%) saturate(900%) hue-rotate(140deg) brightness(1.05);
}

[data-theme="stealth"] #settings-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(82%) sepia(28%) saturate(900%) hue-rotate(200deg) brightness(1.05);
}

[data-theme="stealth"] #password-toggle-btn img,
[data-theme="stealth"] #payment-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(78%) sepia(35%) saturate(1200%) hue-rotate(250deg) brightness(1.05);
}

[data-theme="stealth"] #playlist-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(78%) sepia(35%) saturate(1200%) hue-rotate(310deg) brightness(1.05);
}

[data-theme="stealth"] #audio-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(52%) sepia(70%) saturate(1800%) hue-rotate(330deg) brightness(1.05);
}

[data-theme="stealth"] #offline-page-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(45%) saturate(1400%) hue-rotate(340deg) brightness(1.05);
}

[data-theme="stealth"] #file-converter-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(68%) sepia(70%) saturate(2000%) hue-rotate(280deg) brightness(1.05);
}

[data-theme="stealth"] #meme-maker-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(86%) sepia(62%) saturate(1200%) hue-rotate(5deg) brightness(1.05);
}


[data-theme="stealth"] #hide-it-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(88%) sepia(40%) saturate(1000%) hue-rotate(5deg) brightness(1.05);
}

[data-theme="stealth"] #block-it-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(42%) sepia(70%) saturate(2200%) hue-rotate(325deg) brightness(1.02);
}

[data-theme="stealth"] #parental-controls-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(1800%) hue-rotate(230deg) brightness(1.05);
}

[data-theme="stealth"] #night-light-toggle-btn img {
    filter: none;
}

[data-theme="stealth"] #clipboard-history-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(78%) sepia(35%) saturate(1200%) hue-rotate(160deg) brightness(1.05);
}

[data-theme="stealth"] #crypto-toolbar-btn img {
    filter: none;
}

[data-theme="stealth"] #stocks-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(58%) saturate(1200%) hue-rotate(155deg) brightness(1.05);
}

[data-theme="stealth"] #social-toolbar-btn img {
    filter: none;
}

[data-theme="stealth"] #vpn-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(70%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0.95);
}

[data-theme="stealth"] #vpn-toolbar-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(82%) sepia(28%) saturate(900%) hue-rotate(140deg) brightness(1.05);
}

[data-theme="stealth"] #tor-toolbar-btn img {
    filter: grayscale(1) brightness(0.8);
}

[data-theme="stealth"] #tor-toolbar-btn.is-active img,
[data-theme="stealth"] #tor-toolbar-btn.is-connecting img {
    filter: none;
}

/* Stealth Glass: light icons */
[data-theme="stealth-glass"] .toolbar-icon-btn img,
[data-theme="stealth-glass"] #screenshot-toggle-btn img,
[data-theme="stealth-glass"] #security-toggle-btn img,
[data-theme="stealth-glass"] #pip-toggle-btn img,
[data-theme="stealth-glass"] #downloads-toggle-btn img,
[data-theme="stealth-glass"] #settings-toggle-btn img,
[data-theme="stealth-glass"] #password-toggle-btn img,
[data-theme="stealth-glass"] #payment-toggle-btn img,
[data-theme="stealth-glass"] #playlist-toggle-btn img,
[data-theme="stealth-glass"] #audio-toggle-btn img,
[data-theme="stealth-glass"] #media-controls-toggle-btn img,
[data-theme="stealth-glass"] #cast-to-tv-toggle-btn img,
[data-theme="stealth-glass"] #clipboard-history-toggle-btn img,
[data-theme="stealth-glass"] #offline-page-toggle-btn img,
[data-theme="stealth-glass"] #file-converter-toggle-btn img,
[data-theme="stealth-glass"] #meme-maker-toggle-btn img,
[data-theme="stealth-glass"] #hide-it-toggle-btn img,
[data-theme="stealth-glass"] #block-it-toggle-btn img,
[data-theme="stealth-glass"] #parental-controls-toggle-btn img,
[data-theme="stealth-glass"] #wayback-look-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(96%) sepia(6%) saturate(200%) hue-rotate(190deg) brightness(1.05);
}

[data-theme="stealth-glass"] #night-light-toggle-btn img {
    filter: none;
}

[data-theme="stealth-glass"] #link-scan-toggle-btn img {
    filter: brightness(0) saturate(100%) invert(68%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0.95);
}

[data-theme="stealth-glass"] #link-scan-toggle-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(85deg) brightness(1.05);
}

[data-theme="stealth-glass"] #crypto-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(96%) sepia(12%) saturate(400%) hue-rotate(250deg) brightness(1.05);
}

[data-theme="stealth-glass"] #stocks-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(58%) saturate(1200%) hue-rotate(155deg) brightness(1.05);
}

[data-theme="stealth-glass"] #social-toolbar-btn img {
    filter: none;
}

[data-theme="stealth-glass"] #rss-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(48%) sepia(80%) saturate(1800%) hue-rotate(200deg) brightness(1.05);
}

[data-theme="stealth-glass"] #split-tunnel-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(52%) sepia(12%) saturate(700%) hue-rotate(175deg) brightness(0.95);
}

[data-theme="stealth-glass"] #proxy-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(38%) saturate(900%) hue-rotate(230deg) brightness(1.05);
}

[data-theme="stealth-glass"] #proxy-toolbar-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(82%) sepia(28%) saturate(900%) hue-rotate(220deg) brightness(1.08);
}

[data-theme="stealth-glass"] #vpn-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(68%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0.95);
}

[data-theme="stealth-glass"] #vpn-toolbar-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(85deg) brightness(1.05);
}

[data-theme="stealth-glass"] #tor-toolbar-btn img {
    filter: grayscale(1) brightness(0.75);
}

[data-theme="stealth-glass"] #tor-toolbar-btn.is-active img,
[data-theme="stealth-glass"] #tor-toolbar-btn.is-connecting img {
    filter: none;
}

[data-theme="stealth-float"] #crypto-toolbar-btn img {
    filter: none;
}

[data-theme="stealth-float"] #stocks-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(58%) saturate(1200%) hue-rotate(155deg) brightness(1.05);
}

[data-theme="stealth-float"] #social-toolbar-btn img {
    filter: none;
}

[data-theme="stealth-float"] #rss-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(48%) sepia(80%) saturate(1800%) hue-rotate(200deg) brightness(1.05);
}

[data-theme="stealth-float"] #split-tunnel-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(52%) sepia(12%) saturate(700%) hue-rotate(175deg) brightness(0.95);
}

[data-theme="stealth-float"] #proxy-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(38%) saturate(900%) hue-rotate(230deg) brightness(1.05);
}

[data-theme="stealth-float"] #proxy-toolbar-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(82%) sepia(28%) saturate(900%) hue-rotate(220deg) brightness(1.08);
}

[data-theme="stealth-float"] #vpn-toolbar-btn img {
    filter: brightness(0) saturate(100%) invert(68%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0.95);
}

[data-theme="stealth-float"] #vpn-toolbar-btn.is-active img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(85deg) brightness(1.05);
}

[data-theme="stealth-float"] #tor-toolbar-btn img {
    filter: grayscale(1) brightness(0.75);
}

[data-theme="stealth-float"] #tor-toolbar-btn.is-active img,
[data-theme="stealth-float"] #tor-toolbar-btn.is-connecting img {
    filter: none;
}

.toolbar-icon-btn:hover {
    background: rgba(70, 70, 70, 0.98);
    border-color: rgba(124, 58, 237, 0.55);
}

#downloads-toggle-btn.has-active,
#downloads-toggle-btn.is-open {
    border-color: rgba(124, 58, 237, 0.65);
    background: rgba(73, 0, 194, 0.35);
}

#link-scan-toggle-btn.is-off {
    opacity: 0.72 !important;
}

#link-scan-toggle-btn.is-active {
    border-color: rgba(34, 160, 90, 0.65);
    background: rgba(20, 83, 45, 0.35);
    opacity: 1 !important;
}

#link-scan-toggle-btn.is-scanning {
    border-color: rgba(245, 158, 11, 0.75);
    background: rgba(120, 70, 10, 0.4);
    box-shadow: 0 0 0 1px rgba(245, 158, 11, 0.2), 0 0 10px rgba(245, 158, 11, 0.22);
    animation: link-scan-pulse 1.1s ease-in-out infinite;
}

#link-scan-toggle-btn.is-scanning img {
    filter: brightness(0) saturate(100%) invert(78%) sepia(48%) saturate(900%) hue-rotate(359deg) brightness(102%) contrast(101%);
}

#link-scan-toggle-btn.has-risk {
    border-color: rgba(229, 57, 53, 0.8);
    background: rgba(120, 20, 20, 0.42);
    box-shadow: 0 0 0 1px rgba(229, 57, 53, 0.25), 0 0 10px rgba(229, 57, 53, 0.28);
}

#link-scan-toggle-btn.has-risk img {
    filter: brightness(0) saturate(100%) invert(52%) sepia(85%) saturate(2500%) hue-rotate(330deg) brightness(1.05);
}

#link-scan-toggle-btn.has-risk .link-scan-ticker,
#link-scan-toggle-btn.is-scanning .link-scan-ticker {
    display: inline-flex;
}

@keyframes link-scan-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.06); }
}

.link-scan-ticker {
    position: absolute;
    top: -4px;
    right: -5px;
    min-width: 12px;
    height: 12px;
    padding: 0 3px;
    border-radius: 999px;
    background: #e53935;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    line-height: 12px;
    text-align: center;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
    pointer-events: none;
    z-index: 2;
}

#link-scan-toggle-btn.is-scanning .link-scan-ticker {
    background: #f59e0b;
    color: #1a1200;
}

#playlist-toggle-btn.has-media {
    border-color: rgba(219, 39, 119, 0.55);
    background: rgba(157, 23, 77, 0.28);
    box-shadow: 0 0 0 1px rgba(236, 72, 153, 0.18), 0 0 10px rgba(219, 39, 119, 0.22);
}

#playlist-toggle-btn.is-open {
    border-color: rgba(219, 39, 119, 0.65);
    background: rgba(157, 23, 77, 0.35);
}

#downloads-toggle-btn.download-pulse {
    animation: downloads-icon-pulse 0.55s ease;
}

@keyframes downloads-icon-pulse {
    0% { transform: scale(1); }
    35% { transform: scale(1.18); }
    100% { transform: scale(1); }
}

.downloads-badge {
    position: absolute;
    top: -4px;
    right: -5px;
    min-width: 12px;
    height: 12px;
    padding: 0 3px;
    border-radius: 999px;
    background: #7c3aed;
    color: #fff;
    font-size: 8px;
    line-height: 12px;
    font-weight: 700;
    text-align: center;
    pointer-events: none;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);
}

.downloads-progress-ring {
    position: absolute;
    inset: -2px;
    border-radius: 50%;
    pointer-events: none;
    background: conic-gradient(#7c3aed var(--dl-progress, 0%), transparent 0);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1px));
    mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1px));
}

.downloads-popup {
    position: fixed;
    z-index: 2147483647;
    width: 340px;
    max-width: calc(100vw - 16px);
    max-height: min(420px, calc(100vh - 24px));
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(32, 33, 36, 0.98);
    background-clip: padding-box;
    color: #e8eaed;
    box-shadow: 0 10px 32px rgba(0, 0, 0, 0.48);
    overflow: hidden;
    clip-path: inset(0 round 12px);
    -webkit-clip-path: inset(0 round 12px);
    -webkit-app-region: no-drag;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.14s ease;
    isolation: isolate;
    transform: translateZ(0);
    -webkit-font-smoothing: subpixel-antialiased;
    color-scheme: dark;
}

.downloads-popup.show {
    opacity: 1;
    pointer-events: auto;
}

#downloads-popup {
    width: 400px;
}

#downloads-popup .downloads-popup-name {
    font-size: 12px;
}

.downloads-popup-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 4px 12px;
    min-height: 28px;
    font-size: 13px;
    font-weight: 600;
    color: #e8eaed;
}

.downloads-popup-header-actions {
    display: flex;
    align-items: center;
    gap: 2px;
}

.downloads-popup-icon-btn {
    border: none;
    background: transparent;
    color: rgba(232, 234, 237, 0.55);
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    padding: 4px 6px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.downloads-popup-icon-btn:hover {
    color: #8ab4f8;
    background: rgba(138, 180, 248, 0.12);
}

.downloads-popup-action {
    border: none;
    background: transparent;
    color: #8ab4f8;
    font-size: 12px;
    cursor: pointer;
    padding: 2px 4px;
    border-radius: 4px;
}

.downloads-popup-action:hover {
    background: rgba(138, 180, 248, 0.12);
}

.downloads-popup-list {
    overflow-y: auto;
    padding: 4px 6px 8px;
    flex: 1 1 auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.28) transparent;
    color-scheme: dark;
}

.downloads-popup-list::-webkit-scrollbar {
    width: 8px;
}

.downloads-popup-list::-webkit-scrollbar-track {
    background: transparent;
}

.downloads-popup-list::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.22);
    border-radius: 8px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.downloads-popup-list::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.35);
    background-clip: padding-box;
}

.downloads-popup-list::-webkit-scrollbar-corner {
    background: transparent;
}

.downloads-popup-list::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

.downloads-popup-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 28px 16px;
    color: #9aa0a6;
    font-size: 13px;
}

.downloads-popup-empty i {
    font-size: 22px;
    opacity: 0.8;
}

.downloads-popup-item {
    display: grid;
    grid-template-columns: 28px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 8px 8px;
    border-radius: 8px;
}

.downloads-popup-item[data-dl-draggable="true"] {
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
}

.downloads-popup-item[data-dl-draggable="true"].is-dragging {
    cursor: grabbing;
    opacity: 0.72;
}

.downloads-popup-item:hover {
    background: rgba(255, 255, 255, 0.06);
}

.downloads-popup-icon {
    width: 32px;
    height: 32px;
    border-radius: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: #c5c7ca;
    font-size: 16px;
    overflow: visible;
    flex-shrink: 0;
}

.downloads-popup-icon.has-preview {
    background: transparent;
    color: inherit;
}

.downloads-popup-thumb {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 0;
    display: block;
    background: transparent;
}

.downloads-popup-item.is-error .downloads-popup-icon {
    background: transparent;
    color: #f28b82;
}

.downloads-popup-item.is-complete .downloads-popup-icon {
    background: transparent;
    color: #81c995;
}

.downloads-popup-item.is-progress .downloads-popup-icon {
    background: transparent;
    color: #c4b5fd;
}

.downloads-popup-info {
    min-width: 0;
}

.downloads-popup-name {
    font-size: 13px;
    font-weight: 600;
    color: #e8eaed;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.downloads-popup-status {
    margin-top: 2px;
    font-size: 11px;
    color: #9aa0a6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.downloads-popup-item.is-error .downloads-popup-status {
    color: #f28b82;
}

.downloads-popup-progress {
    margin-top: 6px;
    height: 3px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.downloads-popup-progress > div {
    height: 100%;
    border-radius: inherit;
    background: #8ab4f8;
}

.downloads-popup-actions {
    display: flex;
    align-items: center;
    gap: 2px;
}

.downloads-popup-actions button {
    width: 26px;
    height: 26px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: #9aa0a6;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.downloads-popup-actions button:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #e8eaed;
}


.find-bar {
    display: none;
    align-items: center;
    gap: 6px;
    padding: 8px 10px;
    min-width: 320px;
    max-width: min(420px, calc(100vw - 16px));
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background: rgba(32, 33, 36, 0.98);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.42);
    color: #e8eaed;
    pointer-events: auto;
}

.find-bar.show {
    display: inline-flex;
}

.find-bar-input {
    flex: 1 1 auto;
    min-width: 0;
    height: 30px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.28);
    color: inherit;
    padding: 0 10px;
    font-size: 13px;
    outline: none;
}

.find-bar-input:focus {
    border-color: rgba(138, 180, 248, 0.7);
}

.find-bar-count {
    flex: 0 0 auto;
    min-width: 42px;
    text-align: center;
    font-size: 12px;
    color: #9aa0a6;
    font-variant-numeric: tabular-nums;
}

.find-bar-count.is-empty {
    color: #f28b82;
}

.find-bar-btn {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #c4c7c5;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
}

.find-bar-btn:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #e8eaed;
}

.find-bar-case.is-active {
    background: rgba(138, 180, 248, 0.22);
    color: #8ab4f8;
}

[data-theme="light"] .find-bar {
    background: rgba(255, 255, 255, 0.98);
    border-color: rgba(0, 0, 0, 0.1);
    color: #202124;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
}

[data-theme="light"] .find-bar-input {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.12);
    color: #202124;
}

[data-theme="light"] .find-bar-btn {
    color: #5f6368;
}

[data-theme="light"] .find-bar-btn:hover {
    background: rgba(0, 0, 0, 0.06);
    color: #202124;
}

[data-theme="stealth"] .find-bar {
    background: rgba(10, 24, 24, 0.96);
    border-color: rgba(94, 234, 212, 0.18);
}


.downloads-popup-footer {
    border: none;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    background: transparent;
    color: #8ab4f8;
    font-size: 12px;
    font-weight: 600;
    padding: 10px 14px;
    text-align: left;
    cursor: pointer;
}

.downloads-popup-footer:hover {
    background: rgba(138, 180, 248, 0.08);
}

.download-flyer {
    position: fixed;
    z-index: 2147483646;
    width: 28px;
    height: 28px;
    margin-left: -14px;
    margin-top: -14px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(124, 58, 237, 0.92);
    color: #fff;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
    pointer-events: none;
    transition: transform 0.55s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.55s ease;
    font-size: 12px;
}

[data-theme="light"] .downloads-popup {
    background: rgba(255, 255, 255, 0.98);
    border-color: rgba(0, 0, 0, 0.1);
    color: #202124;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
    color-scheme: light;
}

[data-theme="light"] .downloads-popup-list {
    scrollbar-color: rgba(0, 0, 0, 0.28) transparent;
    color-scheme: light;
}

[data-theme="light"] .downloads-popup-list::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.22);
    background-clip: padding-box;
}

[data-theme="light"] .downloads-popup-list::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.35);
    background-clip: padding-box;
}

[data-theme="light"] .downloads-popup-header,
[data-theme="light"] .downloads-popup-name {
    color: #202124;
}

[data-theme="light"] .downloads-popup-status,
[data-theme="light"] .downloads-popup-empty,
[data-theme="light"] .downloads-popup-actions button {
    color: #5f6368;
}

[data-theme="light"] .downloads-popup-item:hover {
    background: rgba(60, 64, 67, 0.06);
}

[data-theme="light"] .downloads-popup-icon {
    background: transparent;
    color: #5f6368;
}

[data-theme="light"] .downloads-popup-progress {
    background: rgba(60, 64, 67, 0.12);
}

[data-theme="light"] .downloads-popup-progress > div {
    background: #1a73e8;
}

[data-theme="light"] .downloads-popup-action,
[data-theme="light"] .downloads-popup-footer {
    color: #1a73e8;
}

[data-theme="light"] .downloads-popup-icon-btn {
    color: rgba(95, 99, 104, 0.75);
}

[data-theme="light"] .downloads-popup-footer {
    border-top-color: rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .downloads-popup-footer:hover,
[data-theme="light"] .downloads-popup-action:hover,
[data-theme="light"] .downloads-popup-icon-btn:hover {
    background: rgba(26, 115, 232, 0.08);
}

[data-theme="light"] .downloads-popup-icon-btn:hover {
    color: #1a73e8;
}

[data-theme="light"] .downloads-popup-actions button:hover {
    background: rgba(60, 64, 67, 0.1);
    color: #202124;
}

.clipboard-history-search-row {
    padding: 0 10px 8px;
}

.clipboard-history-search {
    width: 100%;
    height: 30px;
    padding: 0 10px;
    border-radius: 8px;
    border: 1px solid var(--ui-border, rgba(255, 255, 255, 0.14));
    background: var(--ui-bg-elevated, rgba(255, 255, 255, 0.06));
    color: var(--ui-text, #e8eaed);
    font-size: 12px;
    outline: none;
}

.clipboard-history-search::placeholder {
    color: var(--ui-text-muted, #9aa0a6);
}

.clipboard-history-search:focus {
    border-color: rgba(0, 184, 184, 0.55);
    box-shadow: 0 0 0 2px rgba(0, 184, 184, 0.12);
}

.clipboard-history-icon {
    overflow: hidden;
}

.clipboard-history-thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    display: block;
}

.clipboard-history-item {
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
}

.clipboard-history-item.is-dragging {
    cursor: grabbing;
    opacity: 0.72;
}

[data-theme="light"] .clipboard-history-search {
    background: rgba(255, 255, 255, 0.95);
    border-color: rgba(0, 0, 0, 0.12);
    color: #202124;
}

[data-theme="light"] .clipboard-history-search::placeholder {
    color: #80868b;
}

[data-theme="stealth"] .clipboard-history-search:focus {
    border-color: rgba(94, 234, 212, 0.55);
    box-shadow: 0 0 0 2px rgba(94, 234, 212, 0.12);
}

[data-theme="stealth"] .downloads-popup {
    background: rgba(10, 24, 24, 0.96);
    border-color: rgba(94, 234, 212, 0.18);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.5);
}

[data-theme="stealth"] .downloads-popup-list {
    scrollbar-color: rgba(94, 234, 212, 0.4) transparent;
}

[data-theme="stealth"] .downloads-popup-list::-webkit-scrollbar-thumb {
    background: rgba(94, 234, 212, 0.35);
    background-clip: padding-box;
}

[data-theme="stealth"] .downloads-popup-list::-webkit-scrollbar-thumb:hover {
    background: rgba(94, 234, 212, 0.55);
    background-clip: padding-box;
}

[data-theme="stealth"] .downloads-popup-action,
[data-theme="stealth"] .downloads-popup-footer {
    color: #5eead4;
}

[data-theme="stealth"] .downloads-popup-icon-btn:hover {
    color: #5eead4;
    background: rgba(94, 234, 212, 0.12);
}

[data-theme="stealth"] .downloads-popup-progress > div {
    background: #2dd4bf;
}

[data-theme="stealth-glass"] .downloads-popup {
    background: rgba(12, 12, 18, 0.72);
    border-color: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
}

.playlist-popup {
    width: 360px;
    max-width: calc(100vw - 16px);
    border-radius: 12px !important;
    overflow: hidden !important;
    clip-path: inset(0 round 12px);
    -webkit-clip-path: inset(0 round 12px);
    isolation: isolate;
    transform: translateZ(0);
    background: rgba(32, 33, 36, 0.98);
    background-clip: padding-box;
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.5);
}

.playlist-popup-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px 8px;
}

.playlist-url-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 10px 8px;
}

.playlist-url-input {
    flex: 1 1 auto;
    min-width: 0;
    height: 28px;
    padding: 0 8px;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.06);
    color: #e8eaed;
    font-size: 12px;
    outline: none;
}

.playlist-url-input:focus {
    border-color: rgba(236, 72, 153, 0.55);
}

.playlist-scan-status {
    padding: 0 12px 8px;
    font-size: 11px;
    color: #9aa0a6;
}

.audio-sidebar {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 380px;
    z-index: 60;
    display: flex;
    flex-direction: column;
    background: var(--chrome-surface, rgba(24, 24, 28, 0.96));
    border-left: 1px solid var(--ui-border, rgba(255, 255, 255, 0.1));
    box-shadow: -12px 0 36px rgba(0, 0, 0, 0.35);
    color: var(--ui-text, #e8eaed);
    pointer-events: auto;
}

.audio-sidebar[hidden] {
    display: none !important;
}

body:not(.bottom-layout-body) .audio-sidebar { top: 94px; }
body:not(.bottom-layout-body).security-bar-hidden .audio-sidebar { top: 72px; }
body.bottom-layout-body .audio-sidebar { top: 0; bottom: var(--bottom-chrome-reserve, 94px); }
body.bottom-layout-body.security-bar-hidden .audio-sidebar { bottom: var(--bottom-chrome-reserve, 80px); }
body.vertical-tabs .audio-sidebar { left: auto; }

body.audio-sidebar-open .web-content {
    right: 380px !important;
    width: calc(100% - 380px) !important;
}
body.audio-sidebar-open.vertical-tabs .web-content {
    left: 200px !important;
    width: calc(100% - 580px) !important;
}
body.audio-sidebar-open.sidebar-right:has(#browser-sidebar:not([hidden])) .web-content {
    right: 600px !important;
    width: calc(100% - 600px) !important;
}

.audio-sidebar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 14px 10px;
    flex-shrink: 0;
}

.audio-sidebar-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 700;
    color: var(--ui-text, #e8eaed);
}

.audio-sidebar-title i { color: #22d3ee; }

.audio-sidebar-close {
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 50%;
    background: var(--ui-highlight, rgba(255, 255, 255, 0.06));
    color: var(--ui-muted, #d6d3e0);
    font-size: 18px;
    cursor: pointer;
}

.audio-sidebar-close:hover {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.14));
    color: var(--ui-text, #fff);
}

.audio-sidebar-body {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: 0 14px 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.audio-sidebar-lead {
    margin: 0;
    font-size: 12px;
    line-height: 1.45;
    color: var(--ui-muted, #a1a1aa);
}

.audio-sidebar-card {
    border: 1px solid var(--ui-border, rgba(255, 255, 255, 0.1));
    background: var(--ui-bg, rgba(255, 255, 255, 0.04));
    border-radius: 12px;
    padding: 12px;
}

.audio-sidebar-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.audio-sidebar-row + .audio-sidebar-row {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--ui-border, rgba(255, 255, 255, 0.08));
}

.audio-sidebar-row-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.audio-sidebar-row-text label {
    font-size: 13px;
    font-weight: 600;
    color: var(--ui-text, #e8eaed);
}

.audio-sidebar-row-text span {
    font-size: 11px;
    color: var(--ui-muted, #a1a1aa);
}

.audio-strength-row {
    flex-direction: column;
    align-items: stretch;
}

.audio-strength-row .audio-sidebar-row-text {
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
    width: 100%;
}

#audio-norm-strength {
    width: 100%;
    accent-color: #22d3ee;
}

.audio-meter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}

.audio-norm-status {
    font-size: 12px;
    font-weight: 600;
    color: var(--ui-muted, #a1a1aa);
}

.audio-norm-status.is-active {
    color: #22d3ee;
}

.audio-norm-media-count {
    font-size: 11px;
    color: var(--ui-muted, #71717a);
}

.audio-norm-wave {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 3px;
    height: 54px;
    margin-bottom: 14px;
    padding: 8px 6px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--ui-bg, #111) 70%, transparent);
    border: 1px solid var(--ui-border, rgba(255, 255, 255, 0.08));
}

.audio-norm-wave span {
    flex: 1;
    border-radius: 999px;
    background: linear-gradient(180deg, #67e8f9, #0891b2);
    opacity: 0.85;
    transform-origin: bottom center;
    height: 0;
    transition: height 160ms linear;
}

.audio-norm-wave.is-live span {
    background: linear-gradient(180deg, #a5f3fc, #06b6d4 55%, #0e7490);
}

.audio-meter-bars {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.audio-meter-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.audio-meter-track {
    width: 100%;
    height: 110px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--ui-bg, #0b0b10) 80%, transparent);
    border: 1px solid var(--ui-border, rgba(255, 255, 255, 0.08));
    overflow: hidden;
    display: flex;
    align-items: flex-end;
}

.audio-meter-fill {
    width: 100%;
    height: 0%;
    transition: height 90ms linear;
}

.audio-meter-fill.in {
    background: linear-gradient(180deg, #fbbf24, #d97706);
}
.audio-meter-fill.out {
    background: linear-gradient(180deg, #34d399, #059669);
}
.audio-meter-fill.red {
    background: linear-gradient(180deg, #22d3ee, #0284c7);
}

.audio-meter-name {
    font-size: 11px;
    font-weight: 600;
    color: var(--ui-text, #e8eaed);
}

.audio-meter-label {
    font-size: 10px;
    color: var(--ui-muted, #a1a1aa);
}

.audio-sidebar-tips {
    border-top: 1px solid var(--ui-border, rgba(255, 255, 255, 0.08));
    padding-top: 10px;
}

.audio-tip-title {
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 6px;
    color: var(--ui-text, #e8eaed);
}

.audio-sidebar-tips ul {
    margin: 0;
    padding-left: 16px;
    color: var(--ui-muted, #a1a1aa);
    font-size: 11px;
    line-height: 1.45;
}

.audio-sidebar-tips li + li { margin-top: 4px; }

.audio-sidebar .toggle-group {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.audio-sidebar .toggle-input {
    display: none !important;
    appearance: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    opacity: 0 !important;
    position: absolute !important;
    pointer-events: none !important;
}

.audio-sidebar .toggle {
    position: relative;
    display: inline-block;
    width: 34px;
    height: 18px;
    background: color-mix(in srgb, var(--ui-muted, #71717a) 35%, transparent);
    border: 1px solid var(--ui-border, rgba(255, 255, 255, 0.12));
    border-radius: 9px;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease;
    flex-shrink: 0;
}

.audio-sidebar .toggle::before {
    content: '';
    position: absolute;
    top: 1px;
    left: 1px;
    width: 14px;
    height: 14px;
    background: var(--chrome-surface-2, #1a1a22);
    border-radius: 50%;
    transition: transform 0.15s ease;
}

.audio-sidebar .toggle-input:checked + .toggle {
    background: #0891b2;
    border-color: rgba(34, 211, 238, 0.75);
}

.audio-sidebar .toggle-input:checked + .toggle::before {
    transform: translateX(16px);
    background: #041016;
}

[data-theme="light"] .audio-sidebar {
    background: var(--chrome-surface, rgba(255, 255, 255, 0.98));
    color: var(--ui-text, #202124);
}

[data-theme="stealth"] .audio-sidebar {
    background: var(--chrome-surface, rgba(14, 10, 22, 0.96));
}

[data-theme="stealth-glass"] .audio-sidebar,
[data-theme="stealth-float"] .audio-sidebar {
    background: var(--ui-bg, rgba(16, 18, 26, 0.72));
    backdrop-filter: blur(18px);
}

.playlist-sidebar {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 380px;
    z-index: 40;
    display: flex;
    flex-direction: column;
    background: rgba(24, 24, 28, 0.96);
    border-left: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: -12px 0 36px rgba(0, 0, 0, 0.35);
    color: #e8eaed;
}

.playlist-sidebar[hidden] {
    display: none !important;
}

body:not(.bottom-layout-body) .playlist-sidebar { top: 94px; }
body:not(.bottom-layout-body).security-bar-hidden .playlist-sidebar { top: 72px; }
body.bottom-layout-body .playlist-sidebar { top: 0; bottom: var(--bottom-chrome-reserve, 94px); }
body.bottom-layout-body.security-bar-hidden .playlist-sidebar { bottom: var(--bottom-chrome-reserve, 80px); }
body.vertical-tabs .playlist-sidebar { left: auto; }

body.playlist-sidebar-open .web-content {
    right: 380px !important;
    width: calc(100% - 380px) !important;
}
body.playlist-sidebar-open.vertical-tabs .web-content {
    left: 200px !important;
    width: calc(100% - 580px) !important;
}
body.playlist-sidebar-open.sidebar-right:has(#browser-sidebar:not([hidden])) .web-content {
    right: 600px !important;
    width: calc(100% - 600px) !important;
}

/* Width + left, with right:auto. Avoid left+right+width over-constraint so the
   page HWND / .web-content actually shrink on the right the same as the left. */
body.ai-side-dock-open.ai-side-dock-right .web-content {
    left: 0 !important;
    right: auto !important;
    width: calc(100% - var(--ai-side-dock-width, 420px)) !important;
    max-width: calc(100% - var(--ai-side-dock-width, 420px)) !important;
}
body.ai-side-dock-open.ai-side-dock-left .web-content {
    left: var(--ai-side-dock-width, 420px) !important;
    right: auto !important;
    width: calc(100% - var(--ai-side-dock-width, 420px)) !important;
    max-width: calc(100% - var(--ai-side-dock-width, 420px)) !important;
}
body.ai-side-dock-open.ai-side-dock-right.vertical-tabs .web-content {
    left: 200px !important;
    right: auto !important;
    width: calc(100% - 200px - var(--ai-side-dock-width, 420px)) !important;
    max-width: calc(100% - 200px - var(--ai-side-dock-width, 420px)) !important;
}
body.ai-side-dock-open.ai-side-dock-left.vertical-tabs .web-content {
    left: calc(200px + var(--ai-side-dock-width, 420px)) !important;
    right: auto !important;
    width: calc(100% - 200px - var(--ai-side-dock-width, 420px)) !important;
    max-width: calc(100% - 200px - var(--ai-side-dock-width, 420px)) !important;
}
body.ai-side-dock-open.ai-side-dock-right.sidebar-right:has(#browser-sidebar:not([hidden])) .web-content {
    left: 0 !important;
    right: auto !important;
    width: calc(100% - 220px - var(--ai-side-dock-width, 420px)) !important;
    max-width: calc(100% - 220px - var(--ai-side-dock-width, 420px)) !important;
}
body.ai-side-dock-open.ai-side-dock-left:not(.sidebar-right):has(#browser-sidebar:not([hidden])) .web-content {
    left: calc(220px + var(--ai-side-dock-width, 420px)) !important;
    right: auto !important;
    width: calc(100% - 220px - var(--ai-side-dock-width, 420px)) !important;
    max-width: calc(100% - 220px - var(--ai-side-dock-width, 420px)) !important;
}

.playlist-sidebar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 14px 10px;
    flex-shrink: 0;
}

.playlist-sidebar-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 700;
}

.playlist-sidebar-title i { color: #ec4899; }

.playlist-sidebar-count {
    font-size: 11px;
    font-weight: 600;
    color: #b9b4cc;
    background: rgba(255, 255, 255, 0.06);
    padding: 2px 8px;
    border-radius: 999px;
}

.playlist-sidebar-close {
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
    color: #d6d3e0;
    font-size: 18px;
    cursor: pointer;
}

.playlist-sidebar-close:hover {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

.playlist-sidebar-toolbar,
.playlist-sidebar-url-row {
    padding-left: 12px;
    padding-right: 12px;
}

.playlist-sidebar-player {
    padding: 8px 12px 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    flex-shrink: 0;
}

.playlist-sidebar-player video {
    max-height: 200px;
}

.playlist-player-controls {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 8px;
}

.playlist-player-controls button {
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    color: #e8eaed;
    cursor: pointer;
}

.playlist-player-controls button:hover {
    background: rgba(236, 72, 153, 0.35);
}

.playlist-sidebar-list {
    flex: 1;
    overflow-y: auto;
    padding: 6px 0 16px;
}

.playlist-sidebar-item {
    display: grid;
    grid-template-columns: 44px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 8px 12px;
    cursor: pointer;
}

.playlist-sidebar-item:hover,
.playlist-sidebar-item.is-playing {
    background: rgba(219, 39, 119, 0.12);
}

.playlist-media-picker {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(6, 6, 10, 0.55);
    backdrop-filter: blur(3px);
}

.playlist-media-picker[hidden] {
    display: none !important;
}

.playlist-media-picker-panel {
    width: min(560px, calc(100vw - 32px));
    max-height: min(78vh, 720px);
    background: rgba(32, 33, 36, 0.98);
    border-radius: 14px;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.55);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    color: #e8eaed;
}

.playlist-media-picker-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 18px 6px;
}

.playlist-media-picker-header h2 {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
}

.playlist-media-picker-sub {
    margin: 0;
    padding: 0 18px 10px;
    font-size: 12.5px;
    color: #9aa0a6;
}

.playlist-picker-filter-row {
    display: flex;
    gap: 6px;
    padding: 0 18px 10px;
}

.playlist-picker-filter {
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.04);
    color: #c4c7cc;
    border-radius: 999px;
    padding: 5px 12px;
    font-size: 12px;
    cursor: pointer;
}

.playlist-picker-filter.is-active {
    background: rgba(236, 72, 153, 0.22);
    border-color: rgba(236, 72, 153, 0.5);
    color: #fff;
}

.playlist-picker-list {
    flex: 1;
    overflow-y: auto;
    padding: 0 10px 10px;
    min-height: 180px;
}

.playlist-picker-item {
    display: grid;
    grid-template-columns: 22px 44px 1fr;
    gap: 10px;
    align-items: center;
    padding: 8px;
    border-radius: 10px;
}

.playlist-picker-item:hover {
    background: rgba(255, 255, 255, 0.05);
}

.playlist-picker-item .picker-meta {
    font-size: 11px;
    color: #9aa0a6;
}

.playlist-picker-kind {
    display: inline-block;
    margin-right: 6px;
    padding: 1px 6px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    background: rgba(255, 255, 255, 0.08);
}

.playlist-picker-kind.audio { color: #67e8f9; }
.playlist-picker-kind.video { color: #f9a8d4; }
.playlist-picker-kind.page { color: #c4b5fd; }

.playlist-media-picker-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.playlist-picker-add-btn {
    background: rgba(236, 72, 153, 0.28) !important;
    border-color: rgba(236, 72, 153, 0.45) !important;
}

[data-theme="light"] .playlist-sidebar,
[data-theme="light"] .playlist-media-picker-panel {
    background: rgba(255, 255, 255, 0.98);
    color: #202124;
}

[data-theme="light"] .playlist-url-input {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.12);
    color: #202124;
}

.playlist-select {
    flex: 1 1 auto;
    min-width: 0;
    height: 28px;
    padding: 0 8px;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.06);
    color: #e8eaed;
    font-size: 12px;
    outline: none;
}

.playlist-select:focus {
    border-color: rgba(236, 72, 153, 0.55);
}

.playlist-player {
    padding: 0 10px 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.playlist-player video,
.playlist-player audio {
    display: block;
    width: 100%;
    max-width: 100%;
    max-height: 160px;
    border-radius: 8px;
    background: #000;
}

.playlist-player audio {
    max-height: none;
    height: 36px;
}

.playlist-now-playing {
    margin-top: 6px;
    font-size: 11px;
    color: #9aa0a6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.playlist-popup-item {
    grid-template-columns: 44px 1fr auto;
}

.playlist-popup-item.is-playing {
    background: rgba(219, 39, 119, 0.12);
}

.playlist-popup-thumb-wrap,
.playlist-drawer-thumb-wrap {
    width: 44px;
    height: 44px;
    border-radius: 6px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.playlist-popup-thumb,
.playlist-drawer-thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.playlist-popup-thumb-fallback,
.playlist-drawer-thumb-fallback {
    width: 100%;
    height: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ec4899;
    font-size: 14px;
}

.playlist-popup-footer-row {
    display: flex;
    gap: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0 0 12px 12px;
    overflow: hidden;
}

.playlist-popup-footer-row .downloads-popup-footer {
    flex: 1 1 50%;
    border-top: none;
    border-radius: 0;
}

.playlist-popup-footer-row .downloads-popup-footer:first-child {
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0 0 0 12px;
}

.playlist-popup-footer-row .downloads-popup-footer:last-child {
    border-radius: 0 0 12px 0;
}

.playlist-popup .downloads-popup-header {
    border-radius: 12px 12px 0 0;
}

.playlist-popup-header-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.playlist-popup-close {
    width: 26px;
    height: 26px;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #9aa0a6;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.playlist-popup-close:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #e8eaed;
}

[data-theme="light"] .playlist-popup-close:hover {
    background: rgba(0, 0, 0, 0.06);
    color: #202124;
}

.playlist-drawer-toolbar {
    flex-wrap: wrap;
    gap: 8px;
}

.playlist-drawer-toolbar .playlist-select {
    flex: 1 1 160px;
}

.playlist-drawer-item {
    display: grid;
    grid-template-columns: 44px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.playlist-drawer-item:hover {
    background: rgba(255, 255, 255, 0.04);
}

.playlist-drawer-item .download-actions button:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

[data-theme="light"] .playlist-popup {
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.18);
}

[data-theme="light"] .playlist-select {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.12);
    color: #202124;
}

[data-theme="light"] .playlist-popup-item.is-playing {
    background: rgba(219, 39, 119, 0.08);
}

[data-theme="light"] .playlist-popup-thumb-wrap,
[data-theme="light"] .playlist-drawer-thumb-wrap {
    background: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .playlist-popup-thumb-fallback,
[data-theme="light"] .playlist-drawer-thumb-fallback {
    color: #db2777;
}

[data-theme="light"] .playlist-now-playing {
    color: #5f6368;
}

[data-theme="light"] .playlist-popup-footer-row,
[data-theme="light"] .playlist-player {
    border-color: rgba(0, 0, 0, 0.08);
}

[data-theme="light"] #playlist-toggle-btn.has-media {
    border-color: rgba(219, 39, 119, 0.45);
    background: rgba(219, 39, 119, 0.12);
    box-shadow: 0 0 0 1px rgba(219, 39, 119, 0.12), 0 0 8px rgba(219, 39, 119, 0.16);
}

[data-theme="light"] #playlist-toggle-btn.is-open {
    border-color: rgba(219, 39, 119, 0.55);
    background: rgba(219, 39, 119, 0.18);
}

[data-theme="stealth-glass"] .playlist-popup {
    background: rgba(12, 12, 18, 0.72);
    border-color: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
}

#security-toggle-btn.bar-hidden {
    opacity: 0.55 !important;
}

#security-toggle-btn.bar-hidden img {
    filter: brightness(0) saturate(100%) invert(70%) !important;
}

#security-toggle-btn:not(.bar-hidden) {
    border-color: rgba(124, 58, 237, 0.65);
    background: rgba(73, 0, 194, 0.35);
}

/* Extension Toolbar */
.extension-toolbar {
    display: none; /* Hidden by default */
    align-items: center;
    gap: 4px;
    padding: 0 4px;
    flex-shrink: 0;
    margin-right: 0;
}

.extension-icon-slot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-width: 0;
}

body.toolbar-labels .top-bar .extension-icon-slot {
    min-width: var(--ext-slot-min, 28px);
}

.extensions-menu-btn i {
    font-size: 11px;
    line-height: 1;
    color: #3db8ff;
    pointer-events: none;
}

.extensions-menu-btn img,
.top-bar .extensions-menu-btn img,
.top-bar .extensions-menu-btn img.ext-toolbar-icon,
.top-bar .extensions-menu-btn img[src*="plugin.svg"],
[data-theme] .top-bar .extensions-menu-btn img[src*="plugin.svg"] {
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(200deg) brightness(1.05) !important;
}

.extensions-menu-btn.is-open {
    border-color: rgba(61, 184, 255, 0.75) !important;
    background: rgba(61, 184, 255, 0.18) !important;
}

.extensions-menu,
#extensions-menu.menu-dropdown,
#powerups-menu.menu-dropdown,
body > #extensions-menu.menu-dropdown,
body > #powerups-menu.menu-dropdown {
    display: none;
    flex-direction: column;
    gap: 0;
    min-width: 300px;
    max-width: min(360px, calc(100vw - 16px));
    max-height: min(420px, calc(100vh - 24px));
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    box-sizing: border-box;
}

.extensions-menu.show {
    display: flex !important;
}

.extensions-menu-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    position: relative;
    width: 100%;
    box-sizing: border-box;
    padding: 10px 36px 6px 12px;
    font-size: 13px;
    font-weight: 650;
    color: var(--ui-text, #f3f3f3);
}

.extensions-menu-close {
    position: absolute;
    top: 8px;
    right: 8px;
    border: 0;
    background: transparent;
    color: var(--ui-muted, rgba(255, 255, 255, 0.55));
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    margin: 0;
    flex: 0 0 auto;
}

.extensions-menu-close:hover {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.08));
    color: var(--ui-text, #fff);
}

.extensions-menu-sub {
    padding: 0 12px 8px;
    font-size: 11px;
    line-height: 1.35;
    color: var(--ui-muted, rgba(255, 255, 255, 0.5));
}

.extensions-menu-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0 6px 8px;
    overflow-y: auto;
    min-height: 0;
    flex: 1 1 auto;
    scrollbar-width: thin;
}

.extensions-menu-list::-webkit-scrollbar-button {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

.extensions-menu-footer {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch;
    gap: 4px;
    margin-top: auto;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    padding: 6px;
    min-width: 0;
    box-sizing: border-box;
}

html[data-theme="light"] .extensions-menu-footer,
html.theme-light .extensions-menu-footer {
    border-top-color: rgba(0, 0, 0, 0.08);
    background: rgba(0, 0, 0, 0.03);
}

#powerups-menu .extensions-menu-footer,
body > #powerups-menu .extensions-menu-footer {
    grid-template-columns: minmax(0, 1fr);
}

.extensions-menu-empty {
    padding: 16px 10px;
    text-align: center;
    font-size: 12px;
    color: var(--ui-muted, rgba(255, 255, 255, 0.45));
}

.extensions-menu-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    width: 100%;
    box-sizing: border-box;
    border-radius: 8px;
    padding: 2px;
}

.extensions-menu-row:hover {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.06));
}

.extensions-menu-row.is-disabled {
    opacity: 0.62;
}

.extensions-menu-row.is-disabled .extensions-menu-open {
    cursor: default;
}

.extensions-menu-row.is-disabled .extensions-menu-pin {
    opacity: 0.45;
    cursor: default;
}

.extensions-menu-action.is-off {
    color: rgba(255, 255, 255, 0.42) !important;
}

/* Close / manage / store / row actions: escape main-menu button width:100% / height:32px.
   Open / pin / action are sized explicitly below so controls stay on the right. */
#extensions-menu.menu-dropdown button.extensions-menu-close,
#powerups-menu.menu-dropdown button.extensions-menu-close,
#extensions-menu.menu-dropdown button.extensions-menu-action,
#powerups-menu.menu-dropdown button.extensions-menu-action,
body > #extensions-menu.menu-dropdown button.extensions-menu-close,
body > #powerups-menu.menu-dropdown button.extensions-menu-close,
body > #extensions-menu.menu-dropdown button.extensions-menu-action,
body > #powerups-menu.menu-dropdown button.extensions-menu-action {
    width: 24px !important;
    max-width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
}

#powerups-menu.menu-dropdown button.extensions-menu-action,
body > #powerups-menu.menu-dropdown button.extensions-menu-action,
#extensions-menu.menu-dropdown button.extensions-menu-action,
body > #extensions-menu.menu-dropdown button.extensions-menu-action {
    width: auto !important;
    max-width: none !important;
    min-width: 28px !important;
    height: auto !important;
    min-height: 0 !important;
}

#extensions-menu.menu-dropdown button.extensions-menu-close,
#powerups-menu.menu-dropdown button.extensions-menu-close,
body > #extensions-menu.menu-dropdown button.extensions-menu-close,
body > #powerups-menu.menu-dropdown button.extensions-menu-close {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    width: 24px !important;
    max-width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
}

#extensions-menu.menu-dropdown button.extensions-menu-manage,
#powerups-menu.menu-dropdown button.extensions-menu-manage,
#extensions-menu.menu-dropdown button.extensions-menu-store,
body > #extensions-menu.menu-dropdown button.extensions-menu-manage,
body > #powerups-menu.menu-dropdown button.extensions-menu-manage,
body > #extensions-menu.menu-dropdown button.extensions-menu-store {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 32px !important;
}

.extensions-menu-header > span {
    display: block !important;
    flex: 1 1 auto;
    min-width: 0;
    color: #f3f3f3 !important;
    -webkit-text-fill-color: #f3f3f3 !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 1.3 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

html[data-theme="light"] .extensions-menu-header > span,
html.theme-light .extensions-menu-header > span {
    color: #1c1916 !important;
    -webkit-text-fill-color: #1c1916 !important;
}

#extensions-menu.menu-dropdown button.extensions-menu-open,
body > #extensions-menu.menu-dropdown button.extensions-menu-open,
#extensions-menu .extensions-menu-open,
body > #extensions-menu .extensions-menu-open,
.extensions-menu-open {
    flex: 1 1 0% !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 36px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    border: 0 !important;
    background: transparent !important;
    color: #f3f3f3 !important;
    -webkit-text-fill-color: #f3f3f3 !important;
    text-align: left !important;
    cursor: pointer;
    padding: 7px 8px !important;
    border-radius: 7px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.extensions-menu-icon {
    width: 22px;
    height: 22px;
    min-width: 22px;
    flex: 0 0 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: rgba(45, 45, 45, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-sizing: border-box;
}

.extensions-menu-icon img,
.extensions-menu-icon .extension-icon-letter {
    width: 13px;
    height: 13px;
    object-fit: contain;
}

#extensions-menu .extensions-menu-name,
body > #extensions-menu .extensions-menu-name,
.extensions-menu-name {
    display: block !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 48px !important;
    max-width: none !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
    color: #f3f3f3 !important;
    -webkit-text-fill-color: #f3f3f3 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

html[data-theme="light"] .extensions-menu-name,
html.theme-light .extensions-menu-name,
html[data-theme="light"] #extensions-menu .extensions-menu-name,
html.theme-light #extensions-menu .extensions-menu-name {
    color: #1c1916 !important;
    -webkit-text-fill-color: #1c1916 !important;
}

html[data-theme="light"] .extensions-menu-open,
html.theme-light .extensions-menu-open,
html[data-theme="light"] #extensions-menu .extensions-menu-open,
html.theme-light #extensions-menu .extensions-menu-open {
    color: #1c1916 !important;
    -webkit-text-fill-color: #1c1916 !important;
}

.extensions-menu-actions {
    display: inline-flex;
    align-items: center;
    gap: 1px;
    flex: 0 0 auto;
    margin-left: auto;
}

#extensions-menu.menu-dropdown button.extensions-menu-pin,
#extensions-menu.menu-dropdown button.extensions-menu-action,
body > #extensions-menu.menu-dropdown button.extensions-menu-pin,
body > #extensions-menu.menu-dropdown button.extensions-menu-action,
#extensions-menu .extensions-menu-pin,
#extensions-menu .extensions-menu-action,
body > #extensions-menu .extensions-menu-pin,
body > #extensions-menu .extensions-menu-action,
.extensions-menu-pin,
.extensions-menu-action {
    flex: 0 0 28px !important;
    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: rgba(255, 255, 255, 0.55) !important;
    cursor: pointer;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

#extensions-menu.menu-dropdown button.extensions-menu-pin,
body > #extensions-menu.menu-dropdown button.extensions-menu-pin,
#extensions-menu .extensions-menu-pin,
body > #extensions-menu .extensions-menu-pin,
.extensions-menu-pin {
    color: rgba(120, 170, 255, 0.85) !important;
}

.extensions-menu-pin i,
.extensions-menu-action i {
    font-size: 11px;
    opacity: 0.78;
}

.extensions-menu-pin i {
    transform: rotate(45deg);
    opacity: 0.72;
}

.extensions-menu-pin.is-pinned {
    color: var(--ui-text, #fff) !important;
}

.extensions-menu-pin.is-pinned i {
    transform: none;
    opacity: 1;
}

.extensions-menu-pin:hover,
.extensions-menu-action:hover {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.08));
    color: var(--ui-text, #fff) !important;
}

.extensions-menu-action.is-danger:hover {
    color: #ff7b7b !important;
    background: rgba(255, 80, 80, 0.12);
}

.extensions-menu-manage,
.extensions-menu-store {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex: none;
    width: 100%;
    min-width: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--ui-text, #f3f3f3);
    padding: 8px 6px;
    cursor: pointer;
    font-size: 12px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
}

.extensions-menu-manage span,
.extensions-menu-store span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.extensions-menu-manage:hover,
.extensions-menu-store:hover {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.06));
}

html[data-theme="light"] .extensions-menu-icon,
html.theme-light .extensions-menu-icon {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(55, 48, 40, 0.16);
}

html[data-theme="light"] .extensions-menu-pin,
html.theme-light .extensions-menu-pin {
    color: rgba(40, 90, 180, 0.9) !important;
}

html[data-theme="light"] .extensions-menu-action,
html.theme-light .extensions-menu-action {
    color: rgba(55, 48, 40, 0.55) !important;
}

html[data-theme="light"] .extensions-menu-action:hover,
html.theme-light .extensions-menu-action:hover {
    color: #1c1916 !important;
}

html[data-theme="stealth-glass"] .extensions-menu-btn.is-open,
html.theme-stealth-glass .extensions-menu-btn.is-open {
    border-color: rgba(61, 184, 255, 0.75);
    background: rgba(61, 184, 255, 0.18);
}

/* Volume Control */
.volume-control-container {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    flex-shrink: 0;
    border: none;
}

.volume-button-knob {
    position: relative;
    width: 25px;
    height: 25px;
    min-width: 25px;
    min-height: 25px;
    max-width: 25px;
    max-height: 25px;
    cursor: pointer;
    padding: 2px;
    border-radius: 50%;
    transition: background-color 0.1s ease-out;
    box-sizing: border-box;
}

.volume-button-knob:hover {
    background: rgba(255, 255, 255, 0.1);
    transform: scale(1.1);
}

.volume-button-knob svg {
    display: block;
    width: 100%;
    height: 100%;
}

.volume-button-knob .volume-mute-glyph {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    margin: 0;
    font-size: 8px;
    line-height: 1;
    color: var(--ui-text, rgba(255, 255, 255, 0.92));
    pointer-events: none;
    z-index: 2;
}

.volume-button-knob.is-muted .volume-mute-glyph {
    display: flex;
}

.volume-button-knob.is-muted svg .slider,
.volume-button-knob.is-muted svg .slider-wrap {
    opacity: 0.22;
}

.volume-tabs-menu {
    display: none;
    flex-direction: column;
    min-width: 220px;
    max-width: min(320px, calc(100vw - 16px));
    max-height: min(360px, calc(100vh - 24px));
    padding: 0;
    overflow: hidden;
    box-sizing: border-box;
}

.volume-tabs-menu.show {
    display: flex !important;
}

.volume-tabs-menu-header {
    padding: 10px 12px 6px;
    font-size: 12px;
    font-weight: 650;
    color: var(--ui-text, #f3f3f3);
}

.volume-tabs-menu-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0 6px 8px;
    overflow-y: auto;
    min-height: 0;
}

.volume-tabs-menu-empty {
    padding: 12px 10px;
    font-size: 12px;
    color: var(--ui-muted, rgba(255, 255, 255, 0.5));
    text-align: center;
}

.volume-tabs-menu-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--ui-text, #f3f3f3);
    padding: 7px 8px;
    cursor: pointer;
    text-align: left;
}

.volume-tabs-menu-item:hover {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.08));
}

.volume-tabs-menu-fav {
    width: 14px;
    height: 14px;
    min-width: 14px;
    border-radius: 3px;
    object-fit: contain;
    flex-shrink: 0;
}

.volume-tabs-menu-fav-fallback {
    width: 14px;
    height: 14px;
    min-width: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    color: var(--ui-muted, rgba(255, 255, 255, 0.55));
    flex-shrink: 0;
}

.volume-tabs-menu-title {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
}

.volume-tabs-menu-meta {
    flex: 0 0 auto;
    font-size: 10px;
    color: var(--ui-muted, rgba(255, 255, 255, 0.45));
}

.tab-overflow-menu {
    min-width: 260px;
    max-width: min(360px, calc(100vw - 16px));
    max-height: min(420px, calc(100vh - 24px));
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.tab-overflow-menu.hidden {
    display: none !important;
}

.tab-overflow-menu-header {
    flex: 0 0 auto;
    padding: 10px 12px 6px;
    font-size: 12px;
    font-weight: 650;
    color: var(--ui-text, #f3f3f3);
}

.tab-overflow-menu-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0 6px 8px;
    overflow-y: auto;
    min-height: 0;
}

.tab-overflow-menu-empty {
    padding: 12px 10px;
    font-size: 12px;
    color: var(--ui-muted, rgba(255, 255, 255, 0.5));
    text-align: center;
}

.tab-overflow-menu-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--ui-text, #f3f3f3);
    padding: 7px 8px;
    cursor: pointer;
    text-align: left;
    font: inherit;
}

.tab-overflow-menu-item:hover {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.08));
}

.tab-overflow-menu-item.is-active {
    background: var(--ui-bg-active, rgba(124, 58, 237, 0.22));
}

.tab-overflow-menu-fav-wrap {
    width: 16px;
    height: 16px;
    min-width: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tab-overflow-menu-fav {
    width: 16px;
    height: 16px;
    border-radius: 3px;
    object-fit: contain;
}

.tab-overflow-menu-fav-fallback {
    font-size: 11px;
    color: var(--ui-muted, rgba(255, 255, 255, 0.55));
}

.tab-overflow-menu-title {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
}

.tab-overflow-menu-pin {
    flex: 0 0 auto;
    font-size: 10px;
    color: var(--ui-muted, rgba(255, 255, 255, 0.45));
}

[data-theme="light"] .tab-overflow-menu-header,
[data-theme="light"] .tab-overflow-menu-item {
    color: #1a1a1a;
}

[data-theme="light"] .tab-overflow-menu-item.is-active {
    background: rgba(73, 0, 194, 0.12);
}

.volume-button-knob .circle {
    fill: var(--volume-circle-fill, #404040);
    stroke: var(--volume-circle-stroke, #555);
    stroke-width: 6px;
}

.volume-button-knob .slider-wrap {
    filter: url(#inset-shadow);
}

.volume-button-knob .slider {
    --deg: 0deg;
    --h: 270;
    --s: 60%;
    transform-origin: 50% 50%;
    transform: rotate(var(--deg));
    fill: hsl(var(--h), var(--s), 55%);
    cursor: grab;
    /* Only color; rotating transform must not interpolate or the needle
       spins the long way around the dial on large volume jumps. */
    transition: fill 0.1s ease-in-out;
}

.volume-button-knob.without-animate .slider {
    transition: unset;
    cursor: grabbing;
}

.volume-button-knob .gradate line {
    --deg: 0deg;
    --h: 135;
    --s: 10%;
    --a: 0.3;
    stroke-linecap: round;
    stroke-width: 12px;
    stroke: hsla(var(--h), var(--s), 55%, var(--a));
    transform: rotate(var(--deg));
    transform-origin: 50% 50%;
}

.volume-button-knob .gradate line:hover,
.volume-button-knob .gradate line.active {
    --a: 1;
    --s: 60%;
    filter: url(#shadow);
}

.extension-toolbar.has-extensions {
    display: flex; /* Show when extensions are present */
}

#powerup-toolbar.has-powerups:not(.toolbar-user-hidden):not([hidden]):not(.appearance-hidden) {
    display: inline-flex !important;
    align-items: center;
    gap: 4px;
    padding: 0 4px;
    flex-shrink: 0;
}

#extension-toolbar.appearance-hidden,
#extension-toolbar[hidden],
.top-bar #extension-toolbar.appearance-hidden,
.top-bar #extension-toolbar[hidden],
#powerup-toolbar.appearance-hidden,
#powerup-toolbar[hidden],
#powerup-toolbar.toolbar-user-hidden,
.top-bar #powerup-toolbar.appearance-hidden,
.top-bar #powerup-toolbar[hidden],
.top-bar #powerup-toolbar.toolbar-user-hidden,
#chrome-tools-dock #powerup-toolbar.appearance-hidden,
#chrome-tools-dock #powerup-toolbar[hidden],
#chrome-tools-dock #powerup-toolbar.toolbar-user-hidden {
    display: none !important;
}

.powerups-menu-btn i {
    font-size: 11px;
    line-height: 1;
    color: #c084fc;
    pointer-events: none;
}

.powerups-menu-btn.is-open {
    border-color: rgba(192, 132, 252, 0.75) !important;
    background: rgba(192, 132, 252, 0.18) !important;
}

.extension-icon {
    width: 22px;
    height: 22px;
    min-width: 22px;
    cursor: pointer;
    border-radius: 50%;
    padding: 0;
    transition: background-color 0.1s ease-out, border-color 0.1s ease-out;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(45, 45, 45, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.14);
    overflow: visible;
    flex-shrink: 0;
    box-sizing: border-box;
}

.extension-icon img,
.extension-icon .extension-icon-letter {
    overflow: hidden;
    border-radius: 50%;
}

.extension-icon:hover {
    background: rgba(60, 60, 60, 0.95);
    border-color: rgba(255, 255, 255, 0.22);
}

.extension-icon img,
.extension-icon img.ext-toolbar-icon,
.top-bar .extension-icon img,
.top-bar .extension-icon img.ext-toolbar-icon {
    width: 13px !important;
    height: 13px !important;
    max-width: 13px !important;
    max-height: 13px !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 50%;
    filter: none !important;
    pointer-events: none;
    display: block;
}

.extension-icon-letter {
    width: 12px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 8px;
    font-weight: 700;
    color: #fff;
    border-radius: 2px;
    background: linear-gradient(135deg, #7c6cff, #6c5cff);
    line-height: 1;
}

/* Base styling for plugin icons */
.extension-icon img[src*="plugin.svg"],
.menu-dropdown button img[src*="plugin.svg"],
button[onclick="showPlugins()"] img[src*="plugin.svg"] {
    width: 16px !important;
    height: 16px !important;
    vertical-align: middle;
}

/* Dark / Stealth themes – plugin icon white */
[data-theme="dark"] .extension-icon img[src*="plugin.svg"],
[data-theme="stealth"] .extension-icon img[src*="plugin.svg"],
[data-theme="dark"] .menu-dropdown button img[src*="plugin.svg"],
[data-theme="stealth"] .menu-dropdown button img[src*="plugin.svg"],
[data-theme="dark"] button[onclick="showPlugins()"] img[src*="plugin.svg"],
[data-theme="stealth"] button[onclick="showPlugins()"] img[src*="plugin.svg"] {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%) !important;
}

/* Light theme – plugin icon dark */
[data-theme="light"] .extension-icon img[src*="plugin.svg"],
[data-theme="light"] .menu-dropdown button img[src*="plugin.svg"],
[data-theme="light"] button[onclick="showPlugins()"] img[src*="plugin.svg"] {
    filter: brightness(0) saturate(100%) invert(13%) sepia(8%) saturate(7460%) hue-rotate(217deg) brightness(95%) contrast(100%) !important;
}

/* Use ::before so toolbar-label ::after text is never painted with this badge. */
.extension-icon.has-popup::before {
    content: '';
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 6px;
    height: 6px;
    background: #7c3aed;
    border-radius: 50%;
    border: 1px solid #1a1a1a;
    font-size: 8px;
    pointer-events: none;
    z-index: 3;
}

/* Labels already identify the plugin; hide the popup badge so it cannot tint the label. */
body.toolbar-labels .top-bar .extension-icon.has-popup::before {
    display: none !important;
}

/* Extension Popup */
.extension-popup {
    position: fixed !important;
    top: 32px;
    right: 120px; /* Clear window controls */
    width: 400px;
    height: 600px;
    background: #ffffff;
    border: 1px solid #404040;
    border-radius: 8px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
    z-index: 2147483647 !important;
    display: none;
    pointer-events: auto !important;
}

.extension-popup.show {
    display: block;
}

.extension-popup iframe {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

/* Instant Answer Button - Match Extension Toolbar Style Exactly */
.instant-answer-container {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.instant-answer-button {
    width: 25px;
    height: 25px;
    cursor: pointer;
    border-radius: 50%;
    padding: 2px;
    transition: background-color 0.1s ease-out;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
}

.instant-answer-button:hover {
    background: rgba(0, 184, 184, 0.1);
    transform: scale(1.1);
}

.instant-answer-button img {
    width: 21px;
    height: 21px;
    object-fit: contain;
    object-position: center;
    display: block;
    margin: 0;
}

/* Instant Answer Dropdown — frosted glass over native acrylic */
.instant-answer-dropdown {
    position: fixed !important;
    display: none;
    opacity: 1;
    visibility: visible;
    pointer-events: none;
    width: 450px;
    max-width: calc(100vw - 24px);
    z-index: 2147483647 !important;
    border-radius: 16px;
    overflow: hidden;
    background: rgba(22, 22, 30, 0.96) !important;
    border: 1px solid rgba(255, 255, 255, 0.18);
    box-shadow:
        0 16px 48px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.16);
    backdrop-filter: blur(28px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(28px) saturate(180%) !important;
    -webkit-font-smoothing: subpixel-antialiased;
    text-rendering: optimizeLegibility;
    transform: none !important;
    transition: none !important;
    margin: 0 !important;
    isolation: isolate;
    clip-path: inset(0 round 16px);
    -webkit-clip-path: inset(0 round 16px);
}

.instant-answer-glass-sheen {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 0;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.03) 42%, rgba(120, 80, 220, 0.08) 100%);
    filter: url(#glass-distort);
    opacity: 0.85;
}

.instant-answer-dropdown,
.instant-answer-dropdown .instant-answer-content-wrapper {
    text-shadow: none !important;
}

.instant-answer-dropdown .instant-answer-content-wrapper {
    position: relative;
    z-index: 1;
}

.instant-answer-dropdown.show {
    display: flex;
    flex-direction: column;
    pointer-events: auto !important;
    transform: none !important;
    overflow: hidden;
}

/* Keep panel in the content area; JS sets exact top/bottom against chrome bars */
.browser-container:not(.bottom-layout) .instant-answer-dropdown,
.browser-container.bottom-layout .instant-answer-dropdown {
    top: auto;
    bottom: auto;
    margin: 0 !important;
}

.instant-answer-content-wrapper {
    padding: 12px;
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    height: 100%;
}

.instant-answer-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    position: relative;
    padding: 4px 8px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 8px;
    flex-shrink: 0;
    cursor: grab;
    user-select: none;
    touch-action: none;
}

.instant-answer-header:active {
    cursor: grabbing;
}

.instant-answer-header .instant-answer-controls,
.instant-answer-header button {
    cursor: pointer;
    user-select: none;
}

.instant-answer-header .instant-answer-title {
    flex: 1;
    text-align: left;
}

.instant-answer-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.control-btn {
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.6);
    font-size: 14px;
    cursor: pointer;
    padding: 4px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: background-color 0.1s ease-out, color 0.1s ease-out;
}

.control-btn:hover {
    color: rgba(255, 255, 255, 1);
    background: rgba(255, 255, 255, 0.1);
}

.instant-answer-actions {
    display: none;
    flex-direction: row;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    flex-shrink: 0;
}

.instant-answer-actions.show {
    display: flex;
}

.action-button {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.9);
    padding: 8px 12px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 12px;
    transition: background-color 0.1s ease-out, border-color 0.1s ease-out;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    justify-content: center;
}

.action-button:hover {
    background: rgba(73, 0, 194, 0.2);
    border-color: rgba(73, 0, 194, 0.5);
}

.instant-answer-icon {
    width: 14px;
    height: 14px;
    opacity: 0.8;
}

.instant-answer-title {
    font-size: 12px;
    font-weight: 500;
    color: #1a0b2e;
    text-shadow: none;
}

/* Text color themes */
.instant-answer-dropdown.dark-text .instant-answer-title,
.instant-answer-dropdown.dark-text .instant-answer-input,
.instant-answer-dropdown.dark-text .instant-answer-content,
.instant-answer-dropdown.dark-text .instant-answer-content h1,
.instant-answer-dropdown.dark-text .instant-answer-content h2,
.instant-answer-dropdown.dark-text .instant-answer-content h3,
.instant-answer-dropdown.dark-text .instant-answer-content p {
    color: #1a0b2e !important;
}

.instant-answer-dropdown.dark-text .instant-answer-input::placeholder {
    color: #2a1540 !important;
}

.instant-answer-dropdown.light-text .instant-answer-title,
.instant-answer-dropdown.light-text .instant-answer-input,
.instant-answer-dropdown.light-text .instant-answer-content,
.instant-answer-dropdown.light-text .instant-answer-content h1,
.instant-answer-dropdown.light-text .instant-answer-content h2,
.instant-answer-dropdown.light-text .instant-answer-content h3,
.instant-answer-dropdown.light-text .instant-answer-content p {
    color: #ffffff !important;
}

.instant-answer-dropdown.light-text .instant-answer-input::placeholder {
    color: rgba(255,255,255,0.6) !important;
}

/* Theme support for all buttons and controls */
.instant-answer-dropdown.dark-text .control-btn,
.instant-answer-dropdown.dark-text .instant-answer-close,
.instant-answer-dropdown.dark-text .action-button {
    color: #1a0b2e !important;
}

.instant-answer-dropdown.light-text .control-btn,
.instant-answer-dropdown.light-text .instant-answer-close,
.instant-answer-dropdown.light-text .action-button {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* PNG icon inversion for light mode */
.instant-answer-dropdown.light-text .instant-answer-icon {
    filter: invert(1) brightness(1);
}

/* Theme support for links */
.instant-answer-dropdown.dark-text .instant-answer-content a {
    color: #1a0b2e !important;
}

.instant-answer-dropdown.light-text .instant-answer-content a {
    color: #ffffff !important;
}

.instant-answer-close {
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.6);
    font-size: 16px;
    cursor: pointer;
    padding: 2px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background-color 0.1s ease-out, color 0.1s ease-out;
}

.instant-answer-close:hover {
    color: rgba(255, 255, 255, 1);
    background: rgba(255, 255, 255, 0.1);
}

.instant-answer-input-wrapper {
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 8px;
    transition: border-color 0.1s ease-out;
    flex-shrink: 0;
}

.instant-answer-input-wrapper:focus-within {
    border-color: rgba(0, 184, 184, 0.6);
}

.instant-answer-input {
    flex: 1;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    padding: 14px 18px;
    color: #1a0b2e;
    font-size: 15px;
    outline: none;
    font-weight: 500;
    text-shadow: none;
}

.instant-answer-input::placeholder {
    color: #2a1540;
    text-shadow: none;
}

.instant-answer-search-glass {
    background: rgba(255, 255, 255, 0.05);
    border: none;
    color: rgba(255, 255, 255, 0.8);
    padding: 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.1s ease-out, color 0.1s ease-out;
    border-radius: 0 12px 12px 0;
    position: relative;
    margin: -1px -1px -1px 0;
}

.instant-answer-search-glass:hover {
    color: rgba(255, 255, 255, 1);
    background: rgba(255, 255, 255, 0.1);
}

/* Theme support for glass search button */
.instant-answer-dropdown.dark-text .instant-answer-search-glass {
    color: #1a0b2e;
}

.instant-answer-dropdown.dark-text .instant-answer-search-glass::before {
    background: linear-gradient(135deg, rgba(26, 11, 46, 0.1) 0%, rgba(26, 11, 46, 0.05) 100%);
}

.instant-answer-dropdown.dark-text .instant-answer-search-glass:hover {
    color: #1a0b2e;
    box-shadow: 0 4px 12px rgba(26, 11, 46, 0.2);
}

.instant-answer-dropdown.dark-text .instant-answer-search-glass:hover::before {
    background: linear-gradient(135deg, rgba(26, 11, 46, 0.2) 0%, rgba(26, 11, 46, 0.1) 100%);
}

.instant-answer-dropdown.light-text .instant-answer-search-glass {
    color: rgba(255, 255, 255, 0.9);
}

.instant-answer-dropdown.light-text .instant-answer-search-glass:hover {
    color: rgba(255, 255, 255, 1);
}

.instant-answer-results {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    padding: 16px;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
    display: none;
    flex: 1 1 auto;
    min-height: 0;
}

.instant-answer-results.show {
    display: block;
    overflow-y: auto;
    max-height: none;
    min-height: 0;
}

.instant-answer-loader {
    display: none;
    justify-content: center;
    align-items: center;
    height: 100px;
    gap: 8px;
}

.instant-answer-loader.show {
    display: flex;
    animation: fadeIn 0.3s ease-out;
}

.loader-dot {
    width: 12px;
    height: 12px;
    background-color: #a855f7;
    border-radius: 50%;
    animation: bounce 1.4s infinite ease-in-out both;
}

.loader-dot:nth-child(1) {
    animation-delay: -0.32s;
}

.loader-dot:nth-child(2) {
    animation-delay: -0.16s;
}

@keyframes bounce {
    0%, 80%, 100% {
        transform: scale(0);
    }
    40% {
        transform: scale(1);
    }
}

.instant-answer-content {
    color: #ffffff;
    font-size: 14px;
    line-height: 1.6;
    text-shadow: none !important;
    font-weight: 500;
    -webkit-font-smoothing: subpixel-antialiased;
    text-rendering: optimizeLegibility;
    filter: none !important;
    transform: none !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: normal;
}

.instant-answer-content p {
    margin: 0 0 12px 0;
    white-space: pre-wrap;
}

.instant-answer-content h1,
.instant-answer-content h2,
.instant-answer-content h3 {
    margin-top: 16px;
    margin-bottom: 8px;
    color: #ffffff;
    font-weight: 700;
    text-shadow: 0 2px 4px rgba(0,0,0,0.4);
}

.instant-answer-content p {
    margin-bottom: 12px;
    color: #f0f0f0;
    font-weight: 500;
    background: transparent;
    padding: 8px;
    border-radius: 6px;
}

.instant-answer-content a {
    color: #00B8B8;
    text-decoration: none;
}

.instant-answer-content a:hover {
    text-decoration: underline;
}

.instant-answer-content img {
    max-width: 100%;
    border-radius: 4px;
    margin: 8px 0;
}

.instant-answer-content code {
    background: rgba(255, 255, 255, 0.1);
    padding: 2px 4px;
    border-radius: 4px;
    font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Open Sans', sans-serif;
}

.instant-answer-content pre {
    background: rgba(255, 255, 255, 0.05);
    padding: 12px;
    border-radius: 8px;
    overflow-x: auto;
    margin: 12px 0;
}

.instant-answer-content pre code {
    background: transparent;
    padding: 0;
}

.instant-answer-content ul,
.instant-answer-content ol {
    margin: 12px 0;
    padding-left: 24px;
}

.instant-answer-content li {
    margin-bottom: 6px;
}

.instant-answer-content blockquote {
    border-left: 3px solid #00B8B8;
    padding-left: 12px;
    margin: 12px 0;
    color: #ccc;
    font-style: italic;
}

.instant-answer-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 16px 0;
}

.instant-answer-content th,
.instant-answer-content td {
    padding: 8px 12px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    text-align: left;
}

.instant-answer-content th {
    background: rgba(255, 255, 255, 0.05);
    font-weight: 600;
}

.instant-answer-content .source {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 12px;
    color: #888;
}

.instant-answer-content .source a {
    color: #00B8B8;
}

.instant-answer-content .no-results {
    text-align: center;
    color: #888;
    padding: 24px 0;
}

.instant-answer-content .error {
    color: #ff6b6b;
    text-align: center;
    padding: 24px 0;
}

/* Improved content sections - transparent for glass effect */
.instant-answer-content .answer-section,
.instant-answer-content .abstract-section,
.instant-answer-content .definition-section {
    margin-bottom: 16px;
    padding: 12px;
    background: transparent;
    border-radius: 8px;
    border-left: 3px solid #00B8B8;
    box-shadow: none;
}

.instant-answer-content .related-section {
    margin-top: 16px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 8px;
}

.instant-answer-content .related-section ul {
    margin: 8px 0;
    padding-left: 16px;
}

.instant-answer-content .related-section li {
    margin-bottom: 4px;
}

.instant-answer-content .image-section {
    text-align: center;
    margin-bottom: 16px;
}

.instant-answer-content .image-section img {
    max-width: 150px;
    max-height: 150px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* Animation for the instant answer dropdown */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Scrollbar styling for instant answer results */
.instant-answer-results::-webkit-scrollbar {
    width: 6px;
}

.instant-answer-results::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 3px;
}

.instant-answer-results::-webkit-scrollbar-thumb {
    background: rgba(0, 184, 184, 0.6);
    border-radius: 3px;
}

.instant-answer-results::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 184, 184, 0.8);
}

.nav-controls {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}

.nav-btn {
    background: #404040;
    border: 1px solid #555555;
    color: #ffffff;
    padding: 4px 8px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    min-width: 32px;
    height: 28px;
    transition: background-color 0.08s ease-out, border-color 0.08s ease-out;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* fa-rotate-right fills more of the em-square than fa-arrow-left/right */
#reload-btn > i {
    font-size: 0.82em;
    line-height: 1;
}

.nav-btn:hover {
    background: #505050;
    border-color: #666666;
}

.nav-btn:active {
    background: #454545;
}

.nav-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.nav-btn:disabled:hover {
    background: #404040;
    border-color: #555555;
}

.address-bar-container {
    /* Grow to fill free space. Keep a stable normal omnibox floor so adding
       toolbar icons does not keep crushing the URL field. */
    flex: 1 1 auto;
    min-width: 48px;
    max-width: 100%;
    display: flex;
    align-items: center;
    background: #1a1a1a;
    border: 1px solid #404040;
    border-radius: 8px;
    padding: 2px;
    gap: 8px;
    transition: border-color 0.08s ease-out;
    overflow: hidden;
}

.address-bar-container:focus-within {
    border-color: #4900c2;
}

.address-input-wrapper {
    flex: 1 1 0;
    position: relative;
    min-width: 0;
    width: 100%;
    overflow: hidden;
}

/* Theme-aware URL suggestions container */
[data-theme="dark"] {
    --dropdown-bg-start: #161024;
    --dropdown-bg-end: #241a38;
}

[data-theme="light"] {
    --dropdown-bg-start: #ffffff;
    --dropdown-bg-end: #f8fafc;
}

[data-theme="stealth"] {
    --dropdown-bg-start: #0a0a0a;
    --dropdown-bg-end: #1a1a1a;
}

.url-suggestions {
    position: fixed !important;
    border-radius: 0 0 12px 12px;
    max-height: 200px;
    overflow-y: auto;
    z-index: 2147483647 !important;
    display: none;
    background: var(--ui-bg, rgba(20, 20, 28, 0.92));
    border: 1px solid var(--ui-border, rgba(255, 255, 255, 0.14));
    pointer-events: auto !important;
    box-sizing: border-box;
    box-shadow:
        var(--ui-shadow, 0 8px 28px rgba(0, 0, 0, 0.45)),
        inset 0 1px 0 var(--ui-highlight, rgba(255, 255, 255, 0.08));
    backdrop-filter: blur(16px) saturate(140%);
    -webkit-backdrop-filter: blur(16px) saturate(140%);
    isolation: isolate;
    -webkit-font-smoothing: subpixel-antialiased;
}

.url-suggestions[hidden] {
    display: none !important;
}

/* Portaled to body so suggestions stack above tab strip / chrome bars. */
body > #url-suggestions,
body > #url-suggestions.show {
    position: fixed !important;
    z-index: 2147483647 !important;
    pointer-events: auto !important;
}

[data-theme="stealth-glass"] .url-suggestions,
[data-theme="stealth-glass"] body > #url-suggestions {
    background: linear-gradient(180deg, rgba(28, 28, 38, 0.96) 0%, rgba(20, 20, 28, 0.96) 100%);
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: 0 10px 32px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.12);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

@keyframes dropdownPulse {
    0%, 100% { 
        background-position: 0% 0%, 0% 50% !important;
        box-shadow: 0 4px 25px rgba(124, 58, 237, 0.3) !important;
        border-color: rgba(124, 58, 237, 0.8) !important;
    }
    25% { 
        background-position: 0% 0%, 100% 50% !important;
        box-shadow: 0 6px 30px rgba(79, 70, 229, 0.4) !important;
        border-color: rgba(79, 70, 229, 0.9) !important;
    }
    50% { 
        background-position: 0% 0%, 200% 50% !important;
        box-shadow: 0 8px 35px rgba(139, 92, 246, 0.5) !important;
        border-color: rgba(139, 92, 246, 1.0) !important;
    }
    75% { 
        background-position: 0% 0%, 300% 50% !important;
        box-shadow: 0 6px 30px rgba(168, 85, 247, 0.4) !important;
        border-color: rgba(168, 85, 247, 0.9) !important;
    }
}

/* Bottom layout: open upward above the address bar (position set in JS). */
body.bottom-layout-body > #url-suggestions,
html.bottom-layout-html body > #url-suggestions {
    border-radius: 12px 12px 0 0;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.3);
    z-index: 2147483647 !important;
    pointer-events: auto !important;
}

/* Theme-aware URL suggestion item borders */
[data-theme="dark"] .url-suggestion {
    border-bottom: 1px solid rgba(168, 85, 247, 0.15);
}

[data-theme="light"] .url-suggestion {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

[data-theme="stealth"] .url-suggestion {
    border-bottom: 1px solid rgba(0, 184, 184, 0.15);
}

.url-suggestion {
    padding: 8px 12px;
    cursor: pointer;
    transition: background-color 0.08s ease-out;
    display: flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    min-height: 36px;
}

.suggestion-content {
    min-width: 0;
    flex: 1;
    overflow: hidden;
}

.url-suggestion:last-child {
    border-bottom: none;
}

/* Theme-aware URL suggestion hover and selection */
[data-theme="dark"] .url-suggestion:hover,
[data-theme="dark"] .url-suggestion.selected {
    background: rgba(124, 58, 237, 0.15);
}

[data-theme="light"] .url-suggestion:hover,
[data-theme="light"] .url-suggestion.selected {
    background: rgba(124, 58, 237, 0.08);
}

[data-theme="stealth"] .url-suggestion:hover,
[data-theme="stealth"] .url-suggestion.selected {
    background: rgba(0, 184, 184, 0.15);
}

.suggestion-icon {
    width: 16px;
    height: 16px;
    opacity: 0.9;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; /* Prevent icon from shrinking */
}

/* Favicon image - hidden by default, shown when loaded successfully */
.suggestion-icon img {
    width: 16px;
    height: 16px;
    border-radius: 3px;
    object-fit: contain;
    filter: none !important;
}

/* Fallback icon - hidden by default, shown when favicon fails to load */
.suggestion-icon span {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 16px;
    height: 16px;
    align-items: center;
    justify-content: center;
    color: var(--ui-muted, #a1a1aa);
    font-size: 12px;
    border-radius: 3px;
}

/* Theme tint for Font Awesome fallback only (not real favicon images) */
[data-theme="dark"] .suggestion-icon span i,
[data-theme="stealth-glass"] .suggestion-icon span i {
    filter: brightness(0) saturate(100%) invert(98%) sepia(6%) saturate(1207%) hue-rotate(212deg) brightness(99%) contrast(100%);
}

[data-theme="stealth"] .suggestion-icon span i {
    filter: brightness(0) saturate(100%) invert(72%) sepia(62%) saturate(2800%) hue-rotate(160deg) brightness(1.05);
}

[data-theme="light"] .suggestion-icon span i {
    filter: brightness(0) saturate(100%) invert(13%) sepia(8%) saturate(7460%) hue-rotate(217deg) brightness(95%) contrast(100%);
}

/* Theme-aware URL suggestions text colors */
[data-theme="dark"] .suggestion-text {
    color: #f5f3ff;
}

[data-theme="light"] .suggestion-text {
    color: #1e293b;
}

[data-theme="stealth"] .suggestion-text {
    color: #ffffff;
}

.suggestion-text {
    flex: 1;
    font-size: 13px;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-theme="dark"] .suggestion-url {
    color: #e9d5ff;
}

[data-theme="light"] .suggestion-url {
    color: #64748b;
}

[data-theme="stealth"] .suggestion-url {
    color: #b8c5d6;
}

[data-theme="stealth-glass"] .suggestion-text {
    color: var(--ui-text, #f2f4f8);
}

[data-theme="stealth-glass"] .suggestion-url {
    color: var(--ui-muted, #c7cdd8);
}

[data-theme="stealth-glass"] .url-suggestion:hover,
[data-theme="stealth-glass"] .url-suggestion.selected {
    background: var(--ui-bg-hover, rgba(255, 255, 255, 0.14));
}

.suggestion-url {
    font-size: 11px;
    opacity: 0.7;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Theme-aware scrollbars for URL suggestions dropdown */
[data-theme="dark"] .url-suggestions::-webkit-scrollbar {
    width: 8px;
}

[data-theme="dark"] .url-suggestions::-webkit-scrollbar-track {
    background: #141414;
    border-radius: 4px;
}

[data-theme="dark"] .url-suggestions::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #5a0dd6 0%, #7b2fcc 100%);
    border-radius: 4px;
    border: 1px solid #141414;
}

[data-theme="dark"] .url-suggestions::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #6b26e6 0%, #8b44e0 100%);
}

[data-theme="light"] .url-suggestions::-webkit-scrollbar {
    width: 8px;
}

[data-theme="light"] .url-suggestions::-webkit-scrollbar-track {
    background: #d4cec4;
    border-radius: 4px;
}

[data-theme="light"] .url-suggestions::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #5b21b6 0%, #7c3aed 100%);
    border-radius: 4px;
    border: 1px solid #d4cec4;
}

[data-theme="light"] .url-suggestions::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #8b44e0 0%, #b866f7 100%);
}

[data-theme="stealth"] .url-suggestions::-webkit-scrollbar {
    width: 8px;
}

[data-theme="stealth"] .url-suggestions::-webkit-scrollbar-track {
    background: #0a0a0a;
    border-radius: 4px;
}

[data-theme="stealth"] .url-suggestions::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #4900c2 0%, #6a1b9a 100%);
    border-radius: 4px;
    border: 1px solid #0a0a0a;
}

[data-theme="stealth"] .url-suggestions::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #5c1ad1 0%, #7b1fa2 100%);
}

.security-indicator {
    padding: 4px 6px;
    display: flex;
    align-items: center;
    position: relative;
    gap: 4px;
    flex: 0 0 auto;
    overflow: visible;
}

.security-indicator.chrome-ui-scaled {
    overflow: visible;
}

.security-icon-slot {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
}

.stealth-blocked-badge {
    min-width: 14px;
    height: 14px;
    padding: 0 3px;
    border-radius: 7px;
    background: linear-gradient(135deg, #4900c2 0%, #7c3aed 100%);
    color: #ffffff;
    font-size: 9px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
    box-sizing: border-box;
    pointer-events: none;
    font-variant-numeric: tabular-nums;
}

.stealth-block-notify {
    position: absolute;
    top: -4px;
    right: -5px;
    min-width: 11px;
    height: 11px;
    padding: 0 2px;
    border-radius: 6px;
    background: linear-gradient(135deg, #4900c2 0%, #7c3aed 100%);
    color: #ffffff;
    font-size: 7px;
    font-weight: 700;
    line-height: 11px;
    text-align: center;
    box-sizing: border-box;
    pointer-events: none;
    font-variant-numeric: tabular-nums;
    z-index: 3;
    box-shadow: 0 0 0 1px rgba(10, 8, 16, 0.45);
}

.stealth-blocked-badge[hidden],
.stealth-block-notify[hidden] {
    display: none !important;
}

.stealth-blocked-badge.is-paused {
    position: static;
    min-width: 22px;
    flex: 0 0 auto;
    background: linear-gradient(135deg, #b45309 0%, #d97706 100%);
    font-size: 8px;
    letter-spacing: 0.02em;
    text-transform: lowercase;
    z-index: 2;
}

.security-indicator img {
    width: 16px;
    height: 16px;
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
    /* This filter creates the purple Stealth color #4900c2 */
}

/* Different security states */
.security-indicator.ssl-secure img {
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
}

.security-indicator.protection-paused img {
    filter: brightness(0) saturate(100%) invert(41%) sepia(97%) saturate(1234%) hue-rotate(4deg) brightness(98%) contrast(95%);
}

.security-indicator.ssl-insecure img {
    filter: brightness(0) saturate(100%) invert(41%) sepia(97%) saturate(1234%) hue-rotate(4deg) brightness(98%) contrast(95%);
    /* Orange color for insecure */
}

.security-indicator.vpn-connected img {
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
}

.security-indicator.vpn-disconnected img {
    filter: brightness(0) saturate(100%) invert(60%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
    /* Gray for disconnected */
}

#address-bar {
    display: block;
    width: 100%;
    box-sizing: border-box;
    background: transparent;
    border: none;
    color: #ffffff;
    padding: 6px;
    font-size: 13px;
    outline: none;
    min-width: 0;
    user-select: text !important;
    -webkit-user-select: text !important;
}

#address-bar::placeholder {
    color: #888888;
}

html[data-theme="light"] #address-bar::placeholder,
html.theme-light #address-bar::placeholder {
    color: #6b655c;
    opacity: 1;
}

/* Shared address-bar action icons (copy / bookmark / go) */
.address-bar-action {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin: 0;
    padding: 0;
    color: var(--text-secondary, #c4c4c4);
    transition: background-color 0.1s ease-out, color 0.1s ease-out;
}

.address-bar-action i,
.address-bar-action svg,
.address-bar-action .bookmark-star {
    width: 14px;
    height: 14px;
    font-size: 14px;
    line-height: 1;
    display: block;
    flex-shrink: 0;
}

.address-bar-action .bookmark-star {
    width: 18px;
    height: 18px;
    font-size: 18px;
}

#copy-url-btn i {
    width: 12px;
    height: 12px;
    font-size: 12px;
    font-weight: 300;
}

/* Clear button rides next to Copy and is only mounted while the omnibox is
   focused with text in it, so the hidden attribute has to beat the flex row. */
#clear-url-btn[hidden] {
    display: none !important;
}

#clear-url-btn svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
}

.address-bar-action:hover {
    background: rgba(73, 0, 194, 0.12);
    color: #4900c2;
}

/* Bookmark button */
.bookmark-button {
    color: var(--text-secondary, #c4c4c4);
}

.bookmark-button:hover {
    background: rgba(73, 0, 194, 0.12);
    color: #4900c2;
}

.bookmark-button.bookmarked {
    background: transparent;
    color: #4900c2;
}

.bookmark-button.bookmarked:hover {
    background: rgba(73, 0, 194, 0.12);
    color: #5c1ad1;
}

.bookmark-star {
    transition: color 0.1s ease-out;
    display: block;
    font-size: 18px;
    line-height: 1;
    width: 18px;
    height: 18px;
    text-align: center;
}

/* Bookmark popup modal */
.bookmark-popup {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 2147483647 !important;
    pointer-events: auto !important;
}

.bookmark-popup-content {
    background: #2a2a2a;
    border: 1px solid #444;
    border-radius: 12px;
    padding: 24px;
    width: 400px;
    max-width: 90vw;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
    z-index: 2147483647 !important;
    pointer-events: auto !important;
    position: relative;
}

.bookmark-popup-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}

.bookmark-popup-icon {
    font-size: 24px;
    color: #5a0dd6;
}

.bookmark-popup-title {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
}

.bookmark-popup-field {
    margin-bottom: 16px;
}

.bookmark-popup-label {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    color: #ccc;
    font-weight: 500;
}

.bookmark-popup-input {
    width: 100%;
    padding: 10px 12px;
    background: #1a1a1a;
    border: 1px solid #444;
    border-radius: 6px;
    color: #fff;
    font-size: 14px;
    font-family: inherit;
}

.bookmark-popup-input:focus {
    outline: none;
    border-color: #5a0dd6;
    box-shadow: 0 0 0 2px rgba(90, 13, 214, 0.2);
}

.bookmark-popup-buttons {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 24px;
}

.bookmark-popup-btn {
    padding: 8px 16px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.1s ease-out;
}

.bookmark-popup-btn.primary {
    background: linear-gradient(135deg, #5a0dd6 0%, #7b2fcc 100%);
    color: #fff;
}

.bookmark-popup-btn.primary:hover {
    background: linear-gradient(135deg, #6b26e6 0%, #8b44e0 100%);
}

.bookmark-popup-btn.secondary {
    background: #333;
    color: #ccc;
    border: 1px solid #444;
}

.bookmark-popup-btn.secondary:hover {
    background: #444;
    color: #fff;
}

/* URL bar Go / AI compact slider */
.url-send-toggle {
    position: relative;
    z-index: 30;
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    height: 20px;
    padding: 1px;
    margin: 0 1px 0 0;
    border-radius: 999px;
    background: rgba(73, 0, 194, 0.10);
    border: 1px solid rgba(73, 0, 194, 0.22);
    box-sizing: border-box;
}

.url-send-btn {
    -webkit-app-region: no-drag !important;
    app-region: no-drag !important;
}

.url-send-thumb {
    position: absolute;
    top: 1px;
    left: 1px;
    width: 17px;
    height: 16px;
    border-radius: 999px;
    background: #4900c2;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    transition: transform 0.16s ease-out, background-color 0.16s ease-out;
    pointer-events: none;
}

.url-send-toggle[data-mode="ai"] .url-send-thumb {
    transform: translateX(17px);
    background: linear-gradient(135deg, #7c3aed, #a855f7);
}

.url-send-btn {
    position: relative;
    z-index: 1;
    width: 17px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
    border: none;
    background: transparent;
    border-radius: 999px;
    cursor: pointer;
    color: #4900c2;
    transition: color 0.16s ease-out;
}

.url-send-btn svg {
    display: block;
    fill: currentColor;
    width: 11px;
    height: 11px;
}

.url-send-btn.is-active {
    color: #fff;
}

.url-send-toggle:not([data-mode="ai"]) #url-ai-icon:not(.is-active) {
    color: rgba(73, 0, 194, 0.55);
}

.url-send-toggle[data-mode="ai"] #go-icon:not(.is-active) {
    color: rgba(73, 0, 194, 0.55);
}

.browser-menu {
    display: flex;
    align-items: center;
    gap: 0;
    flex: 0 0 auto;
    margin-left: 0;
    overflow: visible !important;
}

.browser-menu-spacer {
    display: none !important;
    flex: 0 0 0 !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.browser-menu-end {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex: 0 0 auto;
    margin-left: 0;
}

.profile-avatar-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 2px !important;
    border: none !important;
    background: transparent !important;
    cursor: pointer !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
    -webkit-app-region: no-drag !important;
    pointer-events: auto !important;
}

.profile-avatar-btn[hidden] {
    display: none !important;
}

.profile-avatar-btn:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}

.profile-avatar-chip {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 11px;
    background: #5a0dd6;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22);
    pointer-events: none;
}

.profile-avatar-chip i {
    line-height: 1;
}

.top-bar #menu-btn:hover,
.top-bar #layout-toggle:hover,
.top-bar .browser-menu .nav-btn:hover,
.top-bar .toolbar-icon-btn:hover:not(.is-disabled):not([aria-disabled="true"]) {
    transform: none !important;
    z-index: 100005 !important;
}

.menu-profiles-btn {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.menu-profile-avatar {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 10px;
    background: #5a0dd6;
    flex-shrink: 0;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.menu-profile-avatar i {
    line-height: 1;
}

.stealth-logo-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 2px 4px !important;
    border: none !important;
    background: transparent !important;
    cursor: pointer !important;
    border-radius: 6px !important;
    flex-shrink: 0 !important;
    position: relative !important;
    overflow: visible !important;
    -webkit-app-region: no-drag !important;
    pointer-events: auto !important;
}

.stealth-logo-btn .stealth-block-notify {
    top: -1px;
    right: -1px;
    z-index: 4;
}

.stealth-logo-btn:hover {
    background: rgba(255, 255, 255, 0.06) !important;
}

.stealth-logo-btn[aria-expanded="true"] {
    background: rgba(255, 255, 255, 0.10) !important;
}

.stealth-logo {
    display: block !important;
    width: 80px !important;
    height: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
    max-width: 80px !important;
    pointer-events: none !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    object-fit: contain !important;
    -webkit-user-drag: none;
    user-select: none;
    -webkit-app-region: no-drag !important;
}

.stealth-logo-menu.menu-dropdown,
#stealth-logo-menu.menu-dropdown,
#stealth-logo-menu.menu-dropdown.show,
body > #stealth-logo-menu.menu-dropdown,
body > #stealth-logo-menu.menu-dropdown.show {
    position: fixed !important;
    width: auto !important;
    min-width: 248px !important;
    max-width: min(320px, calc(100vw - 16px)) !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    padding: 8px !important;
    z-index: 2147483647 !important;
    overflow: visible !important;
}

.stealth-logo-menu-site {
    padding: 6px 8px 8px !important;
}

.stealth-logo-menu-site-label,
.stealth-logo-menu-section-label {
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    color: rgba(240, 240, 245, 0.45) !important;
    margin: 0 0 4px !important;
    padding: 0 4px !important;
}

.stealth-logo-menu-section-label {
    margin: 2px 0 4px !important;
}

.stealth-logo-menu-site-host {
    font-size: 13px !important;
    font-weight: 650 !important;
    color: #f2f2f5 !important;
    line-height: 1.3 !important;
    word-break: break-all !important;
    padding: 0 4px !important;
}

.stealth-logo-menu-site-status {
    margin-top: 4px !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
    color: rgba(240, 240, 245, 0.62) !important;
    padding: 0 4px !important;
    min-height: 0 !important;
}

.stealth-logo-menu-site-status.is-paused {
    color: #fbbf24 !important;
}

.stealth-logo-menu-bypass-hint {
    margin: 6px 0 0 !important;
    padding: 0 4px !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    color: rgba(240, 240, 245, 0.42) !important;
}

.protection-blocked-panel {
    margin-top: 8px !important;
    padding: 0 4px !important;
}

.protection-blocked-stats {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 4px !important;
    margin: 0 0 6px 0 !important;
}

.protection-blocked-stat {
    display: flex !important;
    align-items: baseline !important;
    justify-content: space-between !important;
    gap: 6px !important;
    padding: 3px 7px !important;
    border-radius: 5px !important;
    background: rgba(0, 0, 0, 0.22) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.protection-blocked-stat span {
    font-size: 10px !important;
    font-weight: 650 !important;
    color: rgba(240, 240, 245, 0.62) !important;
}

.protection-blocked-stat strong {
    font-size: 12px !important;
    font-weight: 750 !important;
    color: #f4f4f8 !important;
    font-variant-numeric: tabular-nums !important;
}

.protection-blocked-list-label {
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    color: rgba(240, 240, 245, 0.45) !important;
    margin: 0 0 4px !important;
}

.protection-blocked-list {
    max-height: 168px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
}

.protection-blocked-empty {
    font-size: 10.5px !important;
    color: rgba(240, 240, 245, 0.45) !important;
    padding: 6px 2px !important;
}

.protection-blocked-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 5px 6px !important;
    border-radius: 6px !important;
    background: rgba(0, 0, 0, 0.18) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.protection-blocked-row.is-allowed {
    opacity: 0.72 !important;
}

.protection-blocked-copy {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

.protection-blocked-host {
    display: block !important;
    font-size: 11px !important;
    font-weight: 650 !important;
    color: #f2f2f5 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1.25 !important;
}

.protection-blocked-meta {
    display: block !important;
    font-size: 10px !important;
    color: rgba(240, 240, 245, 0.5) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1.25 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

.protection-blocked-bypass,
#stealth-logo-menu .protection-blocked-bypass,
#stealth-logo-menu.menu-dropdown .protection-blocked-bypass,
body > #stealth-logo-menu .protection-blocked-bypass,
body > #stealth-logo-menu.menu-dropdown .protection-blocked-bypass {
    appearance: none !important;
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 54px !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    height: 22px !important;
    padding: 0 8px !important;
    border-radius: 5px !important;
    border: 1px solid rgba(167, 139, 250, 0.4) !important;
    background: rgba(124, 58, 237, 0.22) !important;
    color: #efe9ff !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    line-height: 1 !important;
    text-align: center !important;
    gap: 0 !important;
}

.protection-blocked-bypass:hover,
#stealth-logo-menu .protection-blocked-bypass:hover,
body > #stealth-logo-menu .protection-blocked-bypass:hover {
    background: rgba(124, 58, 237, 0.34) !important;
}

.protection-blocked-row.is-allowed .protection-blocked-bypass,
#stealth-logo-menu .protection-blocked-row.is-allowed .protection-blocked-bypass,
body > #stealth-logo-menu .protection-blocked-row.is-allowed .protection-blocked-bypass {
    border-color: rgba(255, 255, 255, 0.14) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    color: #f2f2f5 !important;
}

.stealth-logo-menu-custom {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px 4px 4px !important;
    position: relative !important;
}

.stealth-logo-menu-custom input[type="number"],
.stealth-pause-unit-trigger {
    height: 28px !important;
    border-radius: var(--stealth-cut-sm, 8px 2px 2px 2px) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    background: rgba(0, 0, 0, 0.28) !important;
    color: #f2f2f5 !important;
    font-size: 12px !important;
    padding: 0 8px !important;
    color-scheme: dark;
}

.stealth-logo-menu-custom input[type="number"] {
    width: 58px !important;
    flex: 0 0 58px !important;
}

.stealth-pause-unit-select {
    position: relative !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

.stealth-pause-unit-trigger {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 6px !important;
    cursor: pointer !important;
    text-align: left !important;
    font: inherit !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

#stealth-logo-menu .stealth-pause-unit-trigger,
body > #stealth-logo-menu .stealth-pause-unit-trigger {
    background: rgba(0, 0, 0, 0.28) !important;
    color: #f2f2f5 !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    height: 28px !important;
    padding: 0 8px !important;
    border-radius: var(--stealth-cut-sm, 8px 2px 2px 2px) !important;
}

#stealth-logo-menu .stealth-pause-unit-trigger:hover,
body > #stealth-logo-menu .stealth-pause-unit-trigger:hover {
    background: rgba(73, 0, 194, 0.28) !important;
    border-color: rgba(90, 13, 214, 0.55) !important;
}

#stealth-logo-menu .stealth-pause-unit-trigger[aria-expanded="true"],
body > #stealth-logo-menu .stealth-pause-unit-trigger[aria-expanded="true"] {
    background: rgba(73, 0, 194, 0.4) !important;
    border-color: rgba(90, 13, 214, 0.7) !important;
}

.stealth-pause-unit-label {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: inherit !important;
}

.stealth-pause-unit-caret {
    width: 0 !important;
    height: 0 !important;
    border-left: 4px solid transparent !important;
    border-right: 4px solid transparent !important;
    border-top: 5px solid rgba(242, 242, 245, 0.75) !important;
    flex: 0 0 auto !important;
}

.stealth-pause-unit-menu,
body > .stealth-pause-unit-menu {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: calc(100% + 4px) !important;
    z-index: 2147483647 !important;
    margin: 0 !important;
    padding: 4px !important;
    list-style: none !important;
    max-height: 180px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #12121a !important;
    background-color: #12121a !important;
    color: #f2f2f5 !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: var(--stealth-cut-sm, 8px 2px 2px 2px) !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45) !important;
    color-scheme: dark !important;
    -webkit-color-scheme: dark !important;
}

body > .stealth-pause-unit-menu {
    position: fixed !important;
    right: auto !important;
    bottom: auto !important;
}

.stealth-pause-unit-menu[hidden] {
    display: none !important;
}

.stealth-pause-unit-option {
    padding: 7px 8px !important;
    border-radius: 3px !important;
    font-size: 12px !important;
    color: #f4f4f5 !important;
    background: transparent !important;
    cursor: pointer !important;
    line-height: 1.3 !important;
}

.stealth-pause-unit-option:hover,
.stealth-pause-unit-option.is-active {
    background: rgba(73, 0, 194, 0.35) !important;
    color: #ffffff !important;
}

.stealth-pause-unit-option.is-selected {
    background: rgba(73, 0, 194, 0.55) !important;
    color: #ffffff !important;
}

.stealth-logo-menu-custom button#stealth-pause-custom-apply {
    width: auto !important;
    min-width: 58px !important;
    height: 28px !important;
    padding: 0 10px !important;
    justify-content: center !important;
    background: linear-gradient(135deg, #5a0dd6, #4900c2) !important;
    color: #fff !important;
    border-radius: var(--stealth-cut-sm, 8px 2px 2px 2px) !important;
    border: none !important;
}

.stealth-logo-menu-custom button#stealth-pause-custom-apply:hover {
    background: linear-gradient(135deg, #6b1ee0, #5a0dd6) !important;
}

#stealth-resume-protection-item {
    color: #fbbf24 !important;
}

#stealth-split-tunnel-item {
    color: #c4b5fd !important;
}

#stealth-split-tunnel-item:disabled,
#stealth-split-tunnel-item.is-disabled {
    opacity: 0.42 !important;
    cursor: not-allowed !important;
}

/* .menu-dropdown button { display:flex } must not override the hidden attribute */
#stealth-logo-menu button[hidden],
#stealth-logo-menu #stealth-resume-protection-item[hidden],
#stealth-logo-menu #stealth-resume-separator[hidden],
body > #stealth-logo-menu button[hidden],
body > #stealth-logo-menu #stealth-resume-protection-item[hidden],
body > #stealth-logo-menu #stealth-resume-separator[hidden] {
    display: none !important;
}

[data-theme="light"] .stealth-logo-menu-site-host {
    color: #1a1a22 !important;
}

[data-theme="light"] .stealth-logo-menu-site-label,
[data-theme="light"] .stealth-logo-menu-section-label {
    color: rgba(26, 26, 34, 0.45) !important;
}

[data-theme="light"] .stealth-logo-menu-bypass-hint {
    color: rgba(26, 26, 34, 0.42) !important;
}

[data-theme="light"] .protection-blocked-stat {
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] .protection-blocked-stat span,
[data-theme="light"] .protection-blocked-list-label,
[data-theme="light"] .protection-blocked-empty,
[data-theme="light"] .protection-blocked-meta {
    color: rgba(26, 26, 34, 0.5) !important;
}

[data-theme="light"] .protection-blocked-stat strong,
[data-theme="light"] .protection-blocked-host {
    color: #1a1a22 !important;
}

[data-theme="light"] .protection-blocked-row {
    background: rgba(0, 0, 0, 0.03) !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] .stealth-logo-menu-custom input[type="number"],
[data-theme="light"] .stealth-pause-unit-trigger,
[data-theme="light"] #stealth-logo-menu .stealth-pause-unit-trigger,
[data-theme="light"] body > #stealth-logo-menu .stealth-pause-unit-trigger,
[data-theme="light"] .stealth-pause-unit-menu,
[data-theme="light"] body > .stealth-pause-unit-menu {
    background: #f4f4f7 !important;
    background-color: #f4f4f7 !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
    color: #1a1a22 !important;
    color-scheme: light !important;
    -webkit-color-scheme: light !important;
}

[data-theme="light"] .stealth-pause-unit-caret {
    border-top-color: rgba(26, 26, 34, 0.65) !important;
}

[data-theme="light"] .stealth-pause-unit-option {
    color: #1a1a22 !important;
}

[data-theme="light"] .stealth-pause-unit-option:hover,
[data-theme="light"] .stealth-pause-unit-option.is-active,
[data-theme="light"] .stealth-pause-unit-option.is-selected {
    background: rgba(73, 0, 194, 0.18) !important;
    color: #1a1a22 !important;
}

[data-theme="light"] .stealth-pause-unit-trigger:hover,
[data-theme="light"] .stealth-pause-unit-trigger[aria-expanded="true"] {
    background: rgba(73, 0, 194, 0.12) !important;
    border-color: rgba(90, 13, 214, 0.45) !important;
}

[data-theme="stealth"] .stealth-pause-unit-menu,
[data-theme="stealth-glass"] .stealth-pause-unit-menu,
[data-theme="stealth-float"] .stealth-pause-unit-menu,
body[data-theme="stealth"] > .stealth-pause-unit-menu,
body[data-theme="stealth-glass"] > .stealth-pause-unit-menu,
body[data-theme="stealth-float"] > .stealth-pause-unit-menu {
    background: #12121a !important;
    background-color: #12121a !important;
    color: #f2f2f5 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

#menu-btn {
    position: relative;
    background: #404040 !important;
    border: 1px solid #555555 !important;
    color: rgba(255, 255, 255, 0.8);
    padding: 6px 8px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 16px;
    min-width: 28px;
    height: 28px;
    transition: background-color 0.1s ease-out, color 0.1s ease-out;
    display: flex !important;
    align-items: center;
    justify-content: center;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 2147483647 !important;
    touch-action: manipulation;
    -webkit-app-region: no-drag;
}

#menu-btn:hover {
    color: rgba(255, 255, 255, 1);
    background: rgba(255, 255, 255, 0.1);
    transform: none;
    z-index: 2147483647 !important;
}

#menu-btn:active {
    background: rgba(255, 255, 255, 0.15);
    transform: none;
}

/* Dropdown Menu - Optimized */
.menu-dropdown {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    
    font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Open Sans', sans-serif;
    color: #b0b0b0;
    
    position: fixed !important;
    top: 100%;
    right: 58px;
    min-width: 196px;
    min-height: 0;
    max-width: calc(100vw - 20px);
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    padding: 4px;
    z-index: 2147483647 !important;
    margin-top: 4px;
    -webkit-app-region: no-drag;
    
    background: rgba(20, 20, 28, 0.55);
    backdrop-filter: blur(28px) saturate(180%);
    -webkit-backdrop-filter: blur(28px) saturate(180%);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
    overflow: hidden;
}

.menu-dropdown.show {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 2147483647 !important;
}

.menu-dropdown::-webkit-scrollbar {
    display: none;
}

/* Theme-specific CSS variables for neon glass menu */
[data-theme="dark"] {
    --menu-hue1: 255;
    --menu-hue2: 222;
    --menu-border-color: hsl(222, 12%, 20%);
    --menu-bg-gradient: linear-gradient(235deg, hsl(255 50% 10% / 0.4), hsl(255 50% 10% / 0) 33%), linear-gradient(45deg , hsl(222 50% 10% / 0.4), hsl(222 50% 10% / 0) 33%), linear-gradient(hsl(220deg 25% 4.8% / 0.3));
    --menu-shadow: hsl(222 50% 2%) 0px 10px 16px -8px, hsl(222 50% 4%) 0px 20px 36px -14px;
}

[data-theme="light"] {
    --menu-hue1: 200;
    --menu-hue2: 240;
    --menu-border-color: hsl(240, 12%, 80%);
    --menu-bg-gradient: linear-gradient(235deg, hsl(200 50% 90% / 0.4), hsl(200 50% 90% / 0) 33%), linear-gradient(45deg , hsl(240 50% 90% / 0.4), hsl(240 50% 90% / 0) 33%), linear-gradient(hsl(220deg 25% 95% / 0.3));
    --menu-shadow: hsl(240 50% 80%) 0px 10px 16px -8px, hsl(240 50% 70%) 0px 20px 36px -14px;
}

[data-theme="stealth"] {
    --menu-hue1: 180;
    --menu-hue2: 160;
    --menu-border-color: hsl(180, 12%, 20%);
    --menu-bg-gradient: linear-gradient(235deg, hsl(180 50% 10% / 0.4), hsl(180 50% 10% / 0) 33%), linear-gradient(45deg , hsl(160 50% 10% / 0.4), hsl(160 50% 10% / 0) 33%), linear-gradient(hsl(170deg 25% 4.8% / 0.3));
    --menu-shadow: hsl(180 50% 2%) 0px 10px 16px -8px, hsl(180 50% 4%) 0px 20px 36px -14px;
}

/* Hide shine and glow elements for performance */
.menu-dropdown .shine,
.menu-dropdown .glow {
    display: none;
}

/* REMOVED: Conflicting bottom layout CSS - let JavaScript handle it */

/* BOTTOM LAYOUT MENU - Inherit theme styling */
.browser-container.bottom-layout .menu-dropdown {
    /* Force menu to appear above all bottom UI elements */
    z-index: 2147483647 !important;
    /* Let JavaScript handle positioning */
    position: fixed !important;
}

.browser-container.bottom-layout .menu-dropdown.show {
    pointer-events: auto !important;
}



/* Animation removed - normal styling */

/* Ensure menu button is visible in bottom layout */
.browser-container.bottom-layout #menu-btn {
    visibility: visible !important;
    display: flex !important;
    opacity: 1 !important;
    z-index: 999999 !important;
}

/* Ensure browser-menu container is visible in bottom layout */
.browser-container.bottom-layout .browser-menu {
    visibility: visible !important;
    display: flex !important;
    opacity: 1 !important;
    z-index: 999999 !important;
}

/* REMOVED: Duplicate show rule */

.menu-dropdown button {
    position: relative;
    width: 100%;
    background: transparent;
    border: none;
    color: #b0b0b0;
    padding: 3px 10px;
    text-align: left;
    cursor: pointer;
    font-size: 11px !important;
    font-weight: 400;
    line-height: 1.2;
    transition: background-color 0.08s ease-out, color 0.08s ease-out;
    display: flex;
    align-items: center;
    gap: 7px;
    border-radius: 5px;
    height: 24px;
    font-family: inherit;
}

.menu-dropdown button[hidden],
#main-menu.menu-dropdown button[hidden],
body > #main-menu.menu-dropdown button[hidden] {
    display: none !important;
}

.menu-dropdown button:hover {
    background: rgba(73, 0, 194, 0.2);
    color: #ffffff;
}

.menu-dropdown button i {
    font-size: 11px;
    width: 14px;
    text-align: center;
}

#main-menu.menu-dropdown button,
body > #main-menu.menu-dropdown button {
    font-size: 11px !important;
    padding: 3px 10px;
    height: 24px;
    gap: 7px;
}


/* Menu item icons */
/* FontAwesome icons are rendered directly in markup; remove emoji pseudo-icons */

/* Ensure plugin icon displays correctly in dropdown menu */
.menu-dropdown button img {
    filter: none !important;
    max-width: 16px;
    max-height: 16px;
    object-fit: contain;
    display: inline-block;
    vertical-align: middle;
}


/* Separator lines in menu */
.menu-separator {
    height: 1px;
    background: #404040;
    margin: 4px 0;
}

/* Status Bar */
.status-bar {
    position: fixed;
    top: 72px;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 100002;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    padding: 2px 6px;
    border-bottom: none;
    border-top: none;
    gap: 4px;
    font-size: 10px;
    color: #ffffff;
    height: 22px;
    min-height: 22px;
    flex-shrink: 0;
    box-shadow: none;
    overflow: hidden;
    white-space: nowrap;
    visibility: visible;
    pointer-events: auto;
    box-sizing: border-box;
    user-select: none !important;
    -webkit-user-select: none !important;
}

.status-bar,
.status-bar * {
    user-select: none !important;
    -webkit-user-select: none !important;
}

.status-bar img,
.status-bar svg,
.status-bar i {
    -webkit-user-drag: none;
    pointer-events: none;
}

html.security-bar-hidden .status-bar,
body.security-bar-hidden .status-bar,
.browser-container.security-bar-hidden .status-bar {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

.status-bar-center {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.status-item {
    display: inline-flex !important;
    align-items: center;
    gap: 4px;
    padding: 0 6px !important;
    height: 18px;
    min-height: 18px;
    max-height: 18px;
    box-sizing: border-box;
    border-radius: 4px;
    transition: background-color 0.1s ease-out;
    background: transparent;
    border: none;
    flex-shrink: 1;
    min-width: 0;
    color: #ffffff;
    visibility: visible !important;
    opacity: 1 !important;
    white-space: nowrap;
    overflow: hidden;
}

.status-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
    color: #ffffff;
    font-size: 10px;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Responsive top / status bars: when the host narrows, ONLY the omnibox and
   spacing give up width. Toolbar icons, Layout, and Menu keep their natural
   size and aspect ratio -- never smash control hit targets. */

/* These thresholds are CSS pixels, so Windows display scaling moves a monitor
   across them without the user resizing anything: a maximized 1920x1080 window
   at the recommended 150% scale reports exactly 1280px, and 2560x1440 at 200%
   reports the same. Keeping the first tier below that width stops a full-size
   monitor from picking up compact-window spacing purely because of its scale
   factor. Genuine crowding is handled by the overflow pass in
   fitChromeToolbarToWidth, which measures the bar instead of the viewport. */

@media (max-width: 1240px) {
    html body .top-bar {
        --toolbar-gap: 8px !important;
        padding: 2px 8px 2px 6px !important;
    }
    html body .address-bar-container {
        min-width: 180px !important;
    }
    html body .toolbar-actions {
        gap: 6px !important;
    }
}

@media (max-width: 1100px) {
    html body .top-bar {
        --toolbar-gap: 6px !important;
    }
    html body .toolbar-actions {
        gap: 4px !important;
    }
    html body .address-bar-container {
        min-width: 180px !important;
    }
}

@media (max-width: 900px) {
    html body .top-bar {
        --toolbar-gap: 4px !important;
        padding: 2px 8px 2px 4px !important;
    }
    html body .toolbar-actions {
        gap: 3px !important;
    }
    html body .address-bar-container {
        min-width: 180px !important;
    }
}

/* Status bar responsive rules: shrink and progressively hide low-priority
   items so critical VPN / Security indicators are always visible. */
@media (max-width: 1200px) {
    .status-bar {
        gap: 6px;
        font-size: 10px;
    }
    .status-item {
        gap: 3px;
        padding: 2px 3px;
    }
}

@media (max-width: 900px) {
    .status-bar {
        gap: 4px;
    }
    .status-item.cookie-blocker,
    .status-item.tracker-blocker {
        display: none;
    }
}

@media (max-width: 700px) {
    .status-item.ad-blocker {
        display: none;
    }
    .status-text {
        display: none;
    }
    .status-item.client-ip .status-text {
        display: inline !important;
    }
}

@media (max-width: 500px) {
    .status-item.secure-dns {
        display: none;
    }
}

.status-item.ad-blocker.has-breakdown,
.status-item.ad-blocker {
    cursor: pointer;
    position: relative;
    pointer-events: auto !important;
}

.adblock-breakdown-sidebar {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 360px;
    z-index: 60;
    display: flex;
    flex-direction: column;
    background: var(--chrome-surface, rgba(24, 24, 28, 0.98));
    border-left: 1px solid var(--ui-border, rgba(255, 255, 255, 0.1));
    box-shadow: -12px 0 36px rgba(0, 0, 0, 0.35);
    color: var(--ui-text, #e8eaed);
    pointer-events: auto;
}

.adblock-breakdown-sidebar[hidden] {
    display: none !important;
}

body:not(.bottom-layout-body) .adblock-breakdown-sidebar { top: 94px; }
body:not(.bottom-layout-body).security-bar-hidden .adblock-breakdown-sidebar { top: 72px; }
body.bottom-layout-body .adblock-breakdown-sidebar { top: 0; bottom: var(--bottom-chrome-reserve, 94px); }
body.bottom-layout-body.security-bar-hidden .adblock-breakdown-sidebar { bottom: var(--bottom-chrome-reserve, 80px); }

body.adblock-breakdown-sidebar-open .web-content {
    right: 360px !important;
    width: calc(100% - 360px) !important;
}

body.adblock-breakdown-sidebar-open.vertical-tabs .web-content {
    left: 200px !important;
    width: calc(100% - 560px) !important;
}

.adblock-breakdown-sidebar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px;
    border-bottom: 1px solid var(--ui-border, rgba(255, 255, 255, 0.1));
    flex-shrink: 0;
}

.adblock-breakdown-sidebar-title {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size: 14px;
    font-weight: 700;
}

.adblock-breakdown-sidebar-title img {
    width: 15px;
    height: 15px;
}

.adblock-breakdown-sidebar-close {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: inherit;
    font-size: 21px;
    line-height: 1;
    cursor: pointer;
}

.adblock-breakdown-sidebar-close:hover {
    background: rgba(255, 255, 255, 0.1);
}

.adblock-breakdown-sidebar-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 14px;
    font-size: 12px;
    line-height: 1.4;
}

.adblock-breakdown-title {
    font-weight: 700;
    font-size: 13px;
    margin-bottom: 12px;
}

.adblock-breakdown-empty {
    opacity: 0.7;
    margin-bottom: 8px;
}

.adblock-breakdown-group + .adblock-breakdown-group {
    margin-top: 14px;
}

.adblock-breakdown-group-title {
    font-size: 10px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    opacity: 0.65;
    margin-bottom: 4px;
}

.adblock-breakdown-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 12px;
    padding: 5px 0;
}

.adblock-breakdown-row.is-empty {
    opacity: 0.45;
}

.adblock-breakdown-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.adblock-breakdown-count {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.adblock-breakdown-total {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 12px;
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-weight: 700;
}

[data-theme="light"] .adblock-breakdown-sidebar {
    background: rgba(255, 255, 255, 0.98);
    border-left-color: rgba(0, 0, 0, 0.12);
    color: #1c1c22;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}

[data-theme="light"] .adblock-breakdown-total {
    border-top-color: rgba(0, 0, 0, 0.1);
}

.tor-circuit-sidebar {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 360px;
    z-index: 60;
    display: flex;
    flex-direction: column;
    background: var(--chrome-surface, rgba(24, 24, 28, 0.98));
    border-left: 1px solid var(--ui-border, rgba(255, 255, 255, 0.1));
    box-shadow: -12px 0 36px rgba(0, 0, 0, 0.35);
    color: var(--ui-text, #e8eaed);
    pointer-events: auto;
}

.tor-circuit-sidebar[hidden] {
    display: none !important;
}

body:not(.bottom-layout-body) .tor-circuit-sidebar { top: 94px; }
body:not(.bottom-layout-body).security-bar-hidden .tor-circuit-sidebar { top: 72px; }
body.bottom-layout-body .tor-circuit-sidebar { top: 0; bottom: var(--bottom-chrome-reserve, 94px); }
body.bottom-layout-body.security-bar-hidden .tor-circuit-sidebar { bottom: var(--bottom-chrome-reserve, 80px); }

body.tor-circuit-sidebar-open .web-content {
    right: 360px !important;
    width: calc(100% - 360px) !important;
}

body.tor-circuit-sidebar-open.vertical-tabs .web-content {
    left: 200px !important;
    width: calc(100% - 560px) !important;
}

.tor-circuit-sidebar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px;
    border-bottom: 1px solid var(--ui-border, rgba(255, 255, 255, 0.1));
    flex-shrink: 0;
}

.tor-circuit-sidebar-title {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size: 14px;
    font-weight: 700;
}

.tor-circuit-sidebar-title img {
    width: 15px;
    height: 15px;
}

.tor-circuit-sidebar-close {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: inherit;
    font-size: 21px;
    line-height: 1;
    cursor: pointer;
}

.tor-circuit-sidebar-close:hover {
    background: rgba(255, 255, 255, 0.1);
}

.tor-circuit-sidebar-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 14px;
    font-size: 12px;
    line-height: 1.45;
}

.tor-circuit-lead {
    opacity: 0.75;
    margin: 0 0 14px;
}

.tor-circuit-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 14px;
}

.tor-circuit-stat {
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.tor-circuit-stat span {
    display: block;
    opacity: 0.65;
    font-size: 11px;
    margin-bottom: 4px;
}

.tor-circuit-stat strong {
    font-size: 13px;
    font-weight: 700;
}

.tor-circuit-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
}

.tor-circuit-actions button {
    appearance: none;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.06);
    color: inherit;
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    text-align: left;
}

.tor-circuit-actions button:hover {
    background: rgba(255, 255, 255, 0.1);
}

.tor-circuit-actions button:disabled {
    opacity: 0.5;
    cursor: default;
}

.tor-circuit-actions button.is-danger {
    border-color: rgba(220, 80, 80, 0.35);
    color: #f0a0a0;
}

.tor-circuit-hops-title {
    font-weight: 700;
    font-size: 13px;
    margin-bottom: 10px;
}

.tor-circuit-updated {
    margin-top: 12px;
    font-size: 11px;
    opacity: 0.6;
    text-align: right;
}

.tor-circuit-hop {
    display: flex;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 8px;
}

.tor-circuit-hop-index {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: rgba(140, 80, 255, 0.18);
    color: #cbb4ff;
    font-weight: 700;
    font-size: 12px;
}

.tor-circuit-hop-meta {
    min-width: 0;
    flex: 1;
}

.tor-circuit-hop-role {
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 10px;
    opacity: 0.65;
    margin-bottom: 2px;
}

.tor-circuit-hop-name {
    font-weight: 700;
    font-size: 13px;
    word-break: break-word;
}

.tor-circuit-hop-fp {
    opacity: 0.55;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 10px;
    word-break: break-all;
    margin-top: 3px;
}

.tor-circuit-empty {
    opacity: 0.7;
}

[data-theme="light"] .tor-circuit-sidebar {
    background: rgba(250, 250, 252, 0.98);
    box-shadow: -12px 0 36px rgba(0, 0, 0, 0.12);
}

[data-theme="light"] .tor-circuit-stat,
[data-theme="light"] .tor-circuit-hop,
[data-theme="light"] .tor-circuit-actions button {
    background: rgba(0, 0, 0, 0.03);
    border-color: rgba(0, 0, 0, 0.08);
}

.status-item:hover {
    background: transparent;
    border-color: transparent;
}

.status-icon {
    font-size: 14px;
    display: flex;
    align-items: center;
}

.status-icon img {
    width: 14px;
    height: 14px;
}

.status-item.vpn-status,
.status-item.tor-status {
    cursor: pointer;
}

.client-ip .status-icon i {
    font-size: 12px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    filter: brightness(0) saturate(100%) invert(60%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
}

.status-item.client-ip {
    cursor: pointer;
}

.status-item.client-ip.is-blurred .status-text,
.status-item.vpn-status.is-blurred .status-text {
    filter: blur(8px);
    user-select: none;
}

/* Flatten buttons inside status bar (e.g., VPN/Tor toggle). Must beat
   glass.css .nav-btn { height: 24px !important } or VPN/Tor chips clip. */
.status-bar .nav-btn,
.status-bar #vpn-toggle,
.status-bar #tor-toggle,
.status-bar #tor-circuit-settings-btn {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    min-width: 14px !important;
    width: 14px !important;
    max-width: 14px !important;
    height: 14px !important;
    min-height: 14px !important;
    max-height: 14px !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer;
    color: #ffffff;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 9px !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
}
.status-bar .nav-btn:hover,
.status-bar .nav-btn:active,
.status-bar .nav-btn:disabled,
.status-bar .nav-btn:disabled:hover,
.status-bar #vpn-toggle:hover,
.status-bar #tor-toggle:hover,
.status-bar #tor-circuit-settings-btn:hover {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
}

.status-bar #tor-circuit-settings-btn[hidden] {
    display: none !important;
}

/* Tor Status Icons */
.tor-status .status-icon img {
    filter: brightness(0) saturate(100%) invert(60%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
}

.tor-status.connected .status-icon img {
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
}

.tor-status.error {
    border-color: rgba(220, 80, 80, 0.45);
}

.tor-status.error .status-text {
    color: #f0a0a0;
}

/* VPN Status Icons */
.vpn-status .status-icon img {
    filter: brightness(0) saturate(100%) invert(60%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
}

.vpn-status.connected .status-icon img {
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
}

/* Ad Blocker Icon */
.ad-blocker .status-icon img {
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
    /* Purple for active ad blocking */
}

.ad-blocker.disabled .status-icon img {
    filter: brightness(0) saturate(100%) invert(60%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
    /* Gray for disabled */
}

/* Tracker Blocker Icon */
.tracker-blocker .status-icon img {
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
    /* Purple for active tracker blocking */
}

.tracker-blocker.disabled .status-icon img {
    filter: brightness(0) saturate(100%) invert(60%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
    /* Gray for disabled */
}

/* Cookie Blocker Icon */
.cookie-blocker .status-icon img {
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
    /* Purple for active cookie blocking */
}

.cookie-blocker.disabled .status-icon img {
    filter: brightness(0) saturate(100%) invert(60%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
    /* Gray for disabled */
}

/* DNS Status Icons */
.secure-dns .status-icon img {
    filter: brightness(0) saturate(100%) invert(60%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
}

.secure-dns.secure .status-icon img {
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
}

/* Security Level Icon */
.security-level .status-icon img {
    filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(6421%) hue-rotate(270deg) brightness(95%) contrast(120%);
    /* Purple for high security */
}

.security-level.medium .status-icon img {
    filter: brightness(0) saturate(100%) invert(41%) sepia(97%) saturate(1234%) hue-rotate(4deg) brightness(98%) contrast(95%);
    /* Orange for medium security */
}

.security-level.low .status-icon img {
    filter: brightness(0) saturate(100%) invert(27%) sepia(98%) saturate(7461%) hue-rotate(357deg) brightness(95%) contrast(120%);
    /* Red for low security */
}

/* Web Content */
.web-content {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    padding: 0 !important;
    margin: 0 !important;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Changed from auto to hidden - webview handles its own scrolling */
}

/* Welcome screen owns scrolling; keep web-content clipped to chrome bounds */
.web-content.showing-welcome,
.browser-container.bottom-layout .web-content.showing-welcome {
    overflow: hidden !important;
}

/* AGGRESSIVE BOTTOM LAYOUT FIX */
.browser-container.bottom-layout {
    top: 0 !important;
    height: 100% !important;
}

/* Force UI bars to bottom with maximum z-index */
.browser-container.bottom-layout .tab-bar { 
    position: fixed !important;
    bottom: 60px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    z-index: 999999 !important;
    box-sizing: border-box !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
}

.browser-container.bottom-layout .top-bar { 
    position: fixed !important;
    top: auto !important;
    /* Live measured stats height under chrome zoom; 22px is the resting strip. */
    bottom: var(--bottom-status-height, 22px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    z-index: 1000001 !important;
    box-sizing: border-box !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.browser-container.bottom-layout.security-bar-hidden .top-bar {
    bottom: 0 !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 6px 8px 6px !important;
    box-sizing: border-box !important;
}

.browser-container.bottom-layout .status-bar { 
    position: fixed !important;
    top: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    z-index: 999999 !important;
    box-sizing: border-box !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
}

/* SIMPLE BOTTOM LAYOUT BOUNDARIES - leave room for bottom chrome.
   --bottom-chrome-reserve is synced from layout measurement so search/home
   never paints under the status/URL/tab bars in any appearance theme. */
.browser-container.bottom-layout .web-content {
    top: 0 !important;
    bottom: var(--bottom-chrome-reserve, 94px) !important;
    height: auto !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    z-index: 1 !important;
}

.browser-container.bottom-layout.security-bar-hidden .web-content {
    bottom: var(--bottom-chrome-reserve, 80px) !important;
    height: auto !important;
}

/* Home/search is HTML chrome content: never edge-to-edge under bottom bars */
.browser-container.bottom-layout .web-content.showing-welcome,
html body.floating-toolbar-widget .browser-container.bottom-layout .web-content.showing-welcome,
html body.floating-toolbar-widget .web-content.showing-welcome,
html body.chrome-widget-collapsed .browser-container.bottom-layout .web-content.showing-welcome,
html body.chrome-widget-collapsed .web-content.showing-welcome,
html.bottom-layout-html.chrome-widget-collapsed .browser-container.bottom-layout .web-content.showing-welcome,
body.bottom-layout-body.chrome-widget-collapsed .browser-container.bottom-layout .web-content.showing-welcome {
    top: 0 !important;
    bottom: var(--bottom-chrome-reserve, 94px) !important;
    height: auto !important;
    z-index: 1 !important;
}

/* SIMPLE WEBVIEW BOUNDARIES */
.browser-container.bottom-layout .web-content webview,
.browser-container.bottom-layout .web-content #webview {
    bottom: 0 !important;
    top: 0 !important;
    height: 100% !important;
    width: 100% !important;
    overflow: hidden !important;
    position: absolute !important;
    z-index: 1 !important;
}

/* Top layout: status bar stays in normal flow - use default styling */

/* Top layout: webview fills entire container so UI floats ON TOP of it */
.browser-container:not(.bottom-layout) .web-content {
    height: calc(100% - 94px) !important; /* 40+32+22 */
    position: absolute !important;
    top: 94px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    z-index: 1 !important;
}

/* Must follow the full-bleed width:100% rule above. Same !important + higher
   specificity so a right AI dock actually shrinks .web-content (and the HWND
   measure) instead of sitting on top of a full-width page. */
body.ai-side-dock-open.ai-side-dock-right .browser-container:not(.bottom-layout) .web-content,
body.ai-side-dock-open.ai-side-dock-right .browser-container .web-content {
    left: 0 !important;
    right: auto !important;
    width: calc(100% - var(--ai-side-dock-width, 420px)) !important;
    max-width: calc(100% - var(--ai-side-dock-width, 420px)) !important;
}
body.ai-side-dock-open.ai-side-dock-left .browser-container:not(.bottom-layout) .web-content,
body.ai-side-dock-open.ai-side-dock-left .browser-container .web-content {
    left: var(--ai-side-dock-width, 420px) !important;
    right: auto !important;
    width: calc(100% - var(--ai-side-dock-width, 420px)) !important;
    max-width: calc(100% - var(--ai-side-dock-width, 420px)) !important;
}
body.ai-side-dock-open.ai-side-dock-right.vertical-tabs .browser-container:not(.bottom-layout) .web-content,
body.ai-side-dock-open.ai-side-dock-right.vertical-tabs .browser-container .web-content {
    left: 200px !important;
    right: auto !important;
    width: calc(100% - 200px - var(--ai-side-dock-width, 420px)) !important;
    max-width: calc(100% - 200px - var(--ai-side-dock-width, 420px)) !important;
}
body.ai-side-dock-open.ai-side-dock-left.vertical-tabs .browser-container:not(.bottom-layout) .web-content,
body.ai-side-dock-open.ai-side-dock-left.vertical-tabs .browser-container .web-content {
    left: calc(200px + var(--ai-side-dock-width, 420px)) !important;
    right: auto !important;
    width: calc(100% - 200px - var(--ai-side-dock-width, 420px)) !important;
    max-width: calc(100% - 200px - var(--ai-side-dock-width, 420px)) !important;
}

/* Longer tabs grow the title strip (48 instead of 40). */
html.longer-tabs body .browser-container:not(.bottom-layout) .web-content,
body.longer-tabs .browser-container:not(.bottom-layout) .web-content {
    top: 102px !important; /* 48+32+22 */
    height: calc(100% - 102px) !important;
}

/* Collapse the content reservation along with the security/status bar. */
.browser-container.security-bar-hidden:not(.bottom-layout) .web-content {
    height: calc(100% - 72px) !important; /* 40px titlebar + 32px toolbar */
    top: 72px !important;
}

html.longer-tabs body .browser-container.security-bar-hidden:not(.bottom-layout) .web-content,
body.longer-tabs .browser-container.security-bar-hidden:not(.bottom-layout) .web-content {
    top: 80px !important; /* 48+32 */
    height: calc(100% - 80px) !important;
}

/* Ensure webview is also full size */
.browser-container:not(.bottom-layout) .web-content webview,
.browser-container:not(.bottom-layout) .web-content #webview {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute !important;
    z-index: 1 !important;
}

/* Welcome screen fills web-content; chrome inset is handled by web-content bounds.
   Do not add top/bottom chrome padding here or the scrollbar is clipped. */

/* Basic webview styling */
html.cef-native-content .web-content > webview,
html.cef-native-content #webview {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

html:not(.cef-native-content) .web-content > webview,
html:not(.cef-native-content) #webview {
    display: flex !important;
    width: 100% !important;
    height: 100% !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    border: none !important;
    z-index: 1 !important;
}

/* Appearance settings */
.tab {
    min-width: var(--tab-shrink-floor, 60px);
    max-width: var(--max-tab-width, 240px);
    flex: 0 1 var(--min-tab-width, 120px);
}
html.longer-tabs,
body.longer-tabs {
    --titlebar-height: 48px;
    --tab-chip-height: 34px;
    --tab-strip-height: 40px;
}
html.longer-tabs .tab,
body.longer-tabs .tab {
    height: var(--tab-chip-height, 34px);
    padding-top: 0;
    padding-bottom: 0;
}
html.longer-tabs:not(.vertical-tabs) .tabs-container,
body.longer-tabs:not(.vertical-tabs) .tabs-container {
    height: var(--tab-strip-height, 40px);
    min-height: var(--tab-strip-height, 40px);
}
html.longer-tabs .tab-group-chip,
body.longer-tabs .tab-group-chip {
    height: var(--tab-chip-height, 34px);
}
html.longer-tabs .new-tab-btn:not(.tab-strip-new-tab-docked),
body.longer-tabs .new-tab-btn:not(.tab-strip-new-tab-docked) {
    width: 28px;
    height: 28px;
}
html.longer-tabs .glass-titlebar,
body.longer-tabs .glass-titlebar {
    height: var(--titlebar-height, 48px);
    min-height: var(--titlebar-height, 48px);
}
html.longer-tabs .top-bar,
body.longer-tabs .top-bar,
html.longer-tabs body .browser-container:not(.bottom-layout) .top-bar,
body.longer-tabs .browser-container:not(.bottom-layout) .top-bar {
    top: var(--titlebar-height, 48px);
}
body.hide-tab-close .tab-close,
body.hide-tab-mute .tab-mute-icon,
body.hide-tab-mute .tab-audio-btn { display: none !important; }
body.scrollable-tab-strip .tabs-container { overflow-x: auto; }
#home-btn[hidden],
#home-btn.appearance-hidden,
.bookmarks-bar[hidden],
.bookmarks-bar.appearance-hidden,
.browser-sidebar[hidden],
.browser-sidebar.appearance-hidden {
    display: none !important;
}
/* Chrome-like strip: tabs share the free width and shrink toward min-width.
   Scroll/arrows only kick in after every tab is already at min-width. */
body.scrollable-tab-strip:not(.vertical-tabs) .glass-titlebar > .tabs-container > .tab:not(.pinned),
body.scrollable-tab-strip:not(.vertical-tabs) .tabs-container > .tab:not(.pinned) {
    flex: 0 1 var(--min-tab-width, 120px) !important;
    width: auto !important;
    min-width: var(--tab-shrink-floor, 60px) !important;
    max-width: var(--max-tab-width, 240px) !important;
}
body.scrollable-tab-strip:not(.vertical-tabs) .glass-titlebar > .tabs-container > .tab.pinned,
body.scrollable-tab-strip:not(.vertical-tabs) .tabs-container > .tab.pinned {
    flex: 0 0 auto !important;
    width: auto !important;
}
.tab-strip-scroll-btn {
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    border: 1px solid var(--ui-border, rgba(255,255,255,.12));
    border-radius: 6px;
    color: inherit;
    background: var(--ui-bg, rgba(30,30,42,.85));
    cursor: pointer;
    -webkit-app-region: no-drag;
    z-index: 6;
    position: relative;
}
.tab-strip-scroll-btn[hidden] { display: none !important; }
.tab-strip-scroll-btn:disabled {
    opacity: 0.35;
    cursor: default;
}
.tab-strip-scroll-btn:hover:not(:disabled) { background: var(--ui-bg-hover, rgba(60,60,80,.9)); }
body.vertical-tabs .tab-strip-scroll-btn { display: none !important; }

body.scrollable-tab-strip .tabs-container.tab-strip-overflow,
body.vertical-tabs .tabs-container.tab-strip-overflow {
    cursor: grab;
}

/* Horizontal tab strip alignment. Only applies to the horizontal strip; the
   vertical-tabs rules below always win via :not(.vertical-tabs) guards. */
body.tabs-align-center:not(.vertical-tabs) .glass-titlebar > .tabs-container,
body.tabs-align-center:not(.vertical-tabs) .tabs-container {
    flex: 1 1 auto !important;
    justify-content: center !important;
}

body.tabs-align-center:not(.vertical-tabs) .tabs-container.tabs-center-overflow,
body.tabs-align-center:not(.vertical-tabs) .tabs-container.tab-strip-overflow,
body.tabs-align-center:not(.vertical-tabs) .glass-titlebar > .tabs-container.tabs-center-overflow,
body.tabs-align-center:not(.vertical-tabs) .glass-titlebar > .tabs-container.tab-strip-overflow {
    justify-content: flex-start !important;
}

body.tabs-align-center:not(.vertical-tabs) .glass-titlebar > .tab-strip-drag-region,
body.tabs-align-right:not(.vertical-tabs) .glass-titlebar > .tab-strip-drag-region,
body.tabs-align-center:not(.vertical-tabs).bottom-layout-body .glass-titlebar > .tab-strip-drag-region,
body.tabs-align-right:not(.vertical-tabs).bottom-layout-body .glass-titlebar > .tab-strip-drag-region,
body.tabs-align-center:not(.vertical-tabs).window-controls-pos-top-left .glass-titlebar > .tab-strip-drag-region,
body.tabs-align-center:not(.vertical-tabs).window-controls-pos-top-right .glass-titlebar > .tab-strip-drag-region,
body.tabs-align-center:not(.vertical-tabs).window-controls-pos-between-tabs .glass-titlebar > .tab-strip-drag-region,
body.tabs-align-right:not(.vertical-tabs).window-controls-pos-top-left .glass-titlebar > .tab-strip-drag-region,
body.tabs-align-right:not(.vertical-tabs).window-controls-pos-top-right .glass-titlebar > .tab-strip-drag-region,
body.tabs-align-right:not(.vertical-tabs).window-controls-pos-between-tabs .glass-titlebar > .tab-strip-drag-region,
html.bottom-layout-html body.tabs-align-center:not(.vertical-tabs) .glass-titlebar > .tab-strip-drag-region,
html.bottom-layout-html body.tabs-align-right:not(.vertical-tabs) .glass-titlebar > .tab-strip-drag-region {
    flex: 0 0 0 !important;
    min-width: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
}

/* Once centered tabs overflow the strip, pack them left and scroll instead of
   holding a centered layout that would clip the leading tabs. */
body.tabs-align-center:not(.vertical-tabs) .tabs-container.tabs-center-overflow,
body.tabs-align-center:not(.vertical-tabs) .tabs-container.tab-strip-overflow {
    justify-content: flex-start !important;
}

/* Temporary probe used by tabStripNaturalContentOverflows. */
.tabs-container[data-tab-strip-measure="1"],
.glass-titlebar > .tabs-container[data-tab-strip-measure="1"] {
    justify-content: flex-start !important;
}
.tabs-container[data-tab-strip-measure="1"] > .tab:not(.pinned),
.glass-titlebar > .tabs-container[data-tab-strip-measure="1"] > .tab:not(.pinned) {
    flex: 0 1 var(--min-tab-width, 120px) !important;
    width: auto !important;
    min-width: var(--tab-shrink-floor, 60px) !important;
    max-width: var(--max-tab-width, 240px) !important;
}

body.tabs-align-right:not(.vertical-tabs) .glass-titlebar > .tabs-container,
body.tabs-align-right:not(.vertical-tabs) .tabs-container {
    flex: 1 1 auto !important;
    justify-content: flex-end !important;
}

body.tabs-align-right:not(.vertical-tabs) .tabs-container.tab-strip-overflow {
    justify-content: flex-start !important;
}

/* Centered / right-aligned tabs keep a 240px cap so leftover space can still
   justify the pack. flex-shrink lets them narrow as the strip fills, matching
   left-aligned Chrome-like behavior. Pinned chips stay content-sized. */
body.tabs-align-center:not(.vertical-tabs) .tabs-container .tab:not(.pinned),
body.tabs-align-right:not(.vertical-tabs) .tabs-container .tab:not(.pinned) {
    flex: 0 1 var(--min-tab-width, 120px) !important;
    min-width: var(--tab-shrink-floor, 60px) !important;
    max-width: var(--max-tab-width, 240px) !important;
}
body.tabs-align-center:not(.vertical-tabs) .tabs-container .tab.pinned,
body.tabs-align-right:not(.vertical-tabs) .tabs-container .tab.pinned {
    flex: 0 0 auto !important;
}
.tabs-container.tab-strip-grabbing,
.tabs-container.tab-strip-grabbing .tab {
    cursor: grabbing !important;
    user-select: none;
}

.bookmarks-bar {
    position: fixed;
    left: 0;
    right: 0;
    /* Chrome strip, not a floating overlay. Menus/downloads stay above. */
    z-index: 100004;
    min-height: 34px;
    height: 34px;
    padding: 4px 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    overflow-y: hidden;
    font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Open Sans', sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: var(--ui-text, inherit);
    /* Solid themed surface so it never shows the CEF content HWND behind it. */
    background: var(--chrome-surface, #111111);
    border: 0;
    border-bottom: 1px solid var(--ui-border, rgba(255, 255, 255, 0.12));
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    -webkit-app-region: no-drag;
    box-sizing: border-box;
}
.bookmarks-bar,
.bookmarks-bar * {
    font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Open Sans', sans-serif;
}
.bookmarks-bar[hidden],
.bookmarks-bar.appearance-hidden { display: none !important; }

.bookmarks-bar-pin {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--ui-border, rgba(255, 255, 255, 0.14));
    border-radius: 6px;
    background: var(--ui-bg, rgba(45, 45, 45, 0.92));
    color: var(--ui-text, inherit);
    cursor: pointer;
    padding: 0;
    font-size: 12px;
    box-sizing: border-box;
}
.bookmarks-bar-pin:hover {
    background: var(--ui-bg-hover, rgba(60, 60, 60, 0.95));
    border-color: var(--ui-highlight, rgba(255, 255, 255, 0.2));
}

.bookmarks-bar-scroll {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.bookmarks-bar-scroll::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
    background: transparent !important;
}

/* Top dock: under titlebar + URL bar + status strip (not overlapping status at 72px) */
body:not(.bottom-layout-body) .bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    top: 94px !important;
    bottom: auto !important;
    border-top: none;
    border-bottom: 1px solid var(--ui-border, rgba(255, 255, 255, 0.12));
}
body:not(.bottom-layout-body).security-bar-hidden .bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    top: 72px !important;
}
.browser-container:not(.bottom-layout) #bookmarks-bar:not([hidden]):not(.appearance-hidden) ~ .web-content,
body:not(.bottom-layout-body).bookmarks-bar-visible .web-content {
    top: 128px !important;
    height: calc(100% - 128px) !important;
}
body:not(.bottom-layout-body).security-bar-hidden.bookmarks-bar-visible .web-content,
.browser-container.security-bar-hidden:not(.bottom-layout).bookmarks-bar-visible .web-content {
    top: 106px !important;
    height: calc(100% - 106px) !important;
}
.browser-container:not(.bottom-layout) #bookmarks-bar:not([hidden]):not(.appearance-hidden) ~ .browser-sidebar,
body:not(.bottom-layout-body).bookmarks-bar-visible .browser-sidebar {
    top: 128px;
}
body:not(.bottom-layout-body).security-bar-hidden.bookmarks-bar-visible .browser-sidebar {
    top: 106px;
}

/* Bottom dock: flush above the tab strip (titlebar bottom:54 + height:40 = 94) */
body.bottom-layout-body .bookmarks-bar:not([hidden]):not(.appearance-hidden),
html.bottom-layout-html .bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    top: auto !important;
    bottom: 94px !important;
    border-bottom: none !important;
    border-top: 1px solid var(--ui-border, rgba(255, 255, 255, 0.12)) !important;
    z-index: 100004 !important;
}
body.bottom-layout-body.security-bar-hidden .bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    bottom: 80px !important;
}
body.bottom-layout-body.vertical-tabs .bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    bottom: 54px !important;
}
body.bottom-layout-body.vertical-tabs.security-bar-hidden .bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    bottom: 40px !important;
}
body.bottom-layout-body.bookmarks-bar-visible .browser-container.bottom-layout .web-content:not(.showing-welcome) {
    bottom: 128px !important;
}
body.bottom-layout-body.security-bar-hidden.bookmarks-bar-visible .browser-container.bottom-layout .web-content:not(.showing-welcome) {
    bottom: 114px !important;
}
body.bottom-layout-body.vertical-tabs.bookmarks-bar-visible .browser-container.bottom-layout .web-content:not(.showing-welcome) {
    bottom: 88px !important;
}
body.bottom-layout-body.vertical-tabs.security-bar-hidden.bookmarks-bar-visible .browser-container.bottom-layout .web-content:not(.showing-welcome) {
    bottom: 74px !important;
}
body.bottom-layout-body .browser-container.bottom-layout .web-content.showing-welcome,
body.bottom-layout-body.bookmarks-bar-visible .browser-container.bottom-layout .web-content.showing-welcome,
body.bottom-layout-body.security-bar-hidden.bookmarks-bar-visible .browser-container.bottom-layout .web-content.showing-welcome,
body.bottom-layout-body.vertical-tabs.bookmarks-bar-visible .browser-container.bottom-layout .web-content.showing-welcome,
body.bottom-layout-body.vertical-tabs.security-bar-hidden.bookmarks-bar-visible .browser-container.bottom-layout .web-content.showing-welcome {
    bottom: var(--bottom-chrome-reserve, 94px) !important;
}

.bookmarks-bar-items, .bookmarks-bar-groups {
    display: flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    min-width: max-content;
}
.bookmark-bar-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 200px;
    min-height: 24px;
    height: 24px;
    padding: 0 8px;
    border: 1px solid var(--ui-border, rgba(255, 255, 255, 0.12));
    border-radius: 6px;
    color: var(--ui-text, inherit);
    background: var(--ui-bg, rgba(45, 45, 45, 0.92));
    cursor: pointer;
    font-family: inherit;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
    flex: 0 0 auto;
    box-shadow: none;
    box-sizing: border-box;
}
.bookmark-bar-chip:hover {
    background: var(--ui-bg-hover, rgba(60, 60, 60, 0.95));
    border-color: var(--ui-highlight, rgba(255, 255, 255, 0.2));
}
.bookmark-bar-chip img {
    width: 14px;
    height: 14px;
    object-fit: contain;
    flex: 0 0 auto;
}
.bookmark-bar-chip i {
    font-size: 11px;
    color: var(--ui-muted, inherit);
    opacity: 0.85;
    flex: 0 0 auto;
}
.bookmark-bar-chip .bookmark-bar-label {
    overflow: hidden;
    text-overflow: ellipsis;
    color: inherit;
}
.bookmark-bar-chip .bookmark-bar-remove {
    display: none;
    margin-left: 2px;
    width: 14px;
    height: 14px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    opacity: .75;
    font-size: 12px;
}
.bookmark-bar-chip:hover .bookmark-bar-remove { display: inline-flex; align-items: center; justify-content: center; }
.bookmark-bar-chip .bookmark-bar-remove:hover { opacity: 1; background: rgba(255, 80, 80, 0.25); }
.tab-group-bookmark-chip { border-left: 3px solid var(--group-color); }

.browser-sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: 220px;
    z-index: 100000;
    padding: 12px 10px;
    background: var(--ui-bg, rgba(20,20,28,.9));
    border-right: 1px solid var(--ui-border, rgba(255,255,255,.1));
    backdrop-filter: blur(18px);
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}
body:not(.bottom-layout-body) .browser-sidebar { top: 94px; }
body:not(.bottom-layout-body).security-bar-hidden .browser-sidebar { top: 72px; }
body.bottom-layout-body .browser-sidebar { top: 0; bottom: var(--bottom-chrome-reserve, 94px); }
body.bottom-layout-body.security-bar-hidden .browser-sidebar { bottom: var(--bottom-chrome-reserve, 80px); }
body.vertical-tabs .browser-sidebar { left: 200px; }
body.vertical-tabs.sidebar-right .browser-sidebar { left: auto; }
.browser-sidebar[hidden],
.browser-sidebar.appearance-hidden { display: none !important; }
body.sidebar-right .browser-sidebar { left: auto; right: 0; border-right: 0; border-left: 1px solid var(--ui-border, rgba(255,255,255,.1)); }
.browser-sidebar-header { padding: 4px 8px 10px; font-size: 12px; font-weight: 700; opacity: .8; }
.browser-sidebar-content { display: grid; gap: 4px; }
.browser-sidebar-link { display: flex; align-items: center; gap: 9px; padding: 8px; border: 0; border-radius: 7px; background: transparent; color: inherit; cursor: pointer; text-align: left; }
.browser-sidebar-link:hover { background: var(--ui-bg-hover, rgba(60,60,80,.9)); }
body.sidebar-left:has(#browser-sidebar:not([hidden])):not(.vertical-tabs) .web-content { left: 220px !important; width: calc(100% - 220px) !important; }
body.sidebar-left.vertical-tabs:has(#browser-sidebar:not([hidden])) .web-content { left: 420px !important; width: calc(100% - 420px) !important; }
body.sidebar-right:has(#browser-sidebar:not([hidden])) .web-content { right: 220px !important; width: calc(100% - 220px) !important; }
body.sidebar-right.vertical-tabs:has(#browser-sidebar:not([hidden])) .web-content { left: 200px !important; width: calc(100% - 420px) !important; }

/* Toolbar button labels (Appearance -> Show toolbar button labels)
   Labels are absolute under fixed-size circles. Never widen/stretch the
   buttons themselves (that ovalizes icons and blows flex spacing apart). */
html body.toolbar-labels .top-bar,
html body.toolbar-labels .browser-container .top-bar,
html body.toolbar-labels .browser-container:not(.bottom-layout) .top-bar {
    height: 52px !important;
    min-height: 52px !important;
    /* Match left/right edge inset. A fatter right pad parked Menu further
       from the window than STEALTH sat from the left, which read as dead
       space beside the pinned cluster on wide monitors. */
    padding: 2px 6px 14px 6px !important;
    align-items: center !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    --toolbar-gap: 14px;
    gap: 14px !important;
}

html body.toolbar-labels .top-bar .toolbar-actions,
html body.toolbar-labels .top-bar .nav-controls,
html body.toolbar-labels .top-bar .browser-menu,
html body.toolbar-labels .top-bar .toolbar-middle-cluster,
html body.toolbar-labels .top-bar .toolbar-overflow {
    gap: 14px !important;
    align-items: center !important;
}

html body.toolbar-labels .top-bar .extension-toolbar {
    gap: 9px !important;
    align-items: center !important;
}

html body.toolbar-labels .top-bar .screenshot-toggle-container,
html body.toolbar-labels .top-bar .instant-answer-container,
html body.toolbar-labels .top-bar .rss-toggle-container,
html body.toolbar-labels .top-bar .split-tunnel-toggle-container,
html body.toolbar-labels .top-bar .vpn-toggle-container,
html body.toolbar-labels .top-bar .tor-toggle-container,
html body.toolbar-labels .top-bar .security-toggle-container,
html body.toolbar-labels .top-bar .pip-toggle-container,
html body.toolbar-labels .top-bar .playlist-toggle-container,
html body.toolbar-labels .top-bar .audio-toggle-container,
html body.toolbar-labels .top-bar .notes-toggle-container,
html body.toolbar-labels .top-bar .offline-page-toggle-container,
html body.toolbar-labels .top-bar .file-converter-toggle-container,
html body.toolbar-labels .top-bar .meme-maker-toggle-container,
html body.toolbar-labels .top-bar .night-light-toggle-container,
html body.toolbar-labels .top-bar .hide-it-toggle-container,
html body.toolbar-labels .top-bar .no-dubs-netflix-toggle-container,
html body.toolbar-labels .top-bar .wayback-look-toggle-container,
html body.toolbar-labels .top-bar .reading-mode-toggle-container,
html body.toolbar-labels .top-bar .clipboard-history-toggle-container,
html body.toolbar-labels .top-bar .link-scan-toggle-container,
html body.toolbar-labels .top-bar .downloads-toggle-container,
html body.toolbar-labels .top-bar .history-toggle-container,
html body.toolbar-labels .top-bar .password-toggle-container,
html body.toolbar-labels .top-bar .settings-toggle-container,
html body.toolbar-labels .top-bar .volume-control-container {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    justify-content: center !important;
    align-items: center !important;
    flex-shrink: 0 !important;
    overflow: visible !important;
}

/* Keep every labeled control a fixed circle / square. Labels hang outside. */
html body.toolbar-labels .top-bar [data-toolbar-label] {
    position: relative !important;
    overflow: visible !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
}

html body.toolbar-labels .top-bar .toolbar-icon-btn[data-toolbar-label],
html body.toolbar-labels .top-bar .instant-answer-button[data-toolbar-label] {
    width: 25px !important;
    min-width: 25px !important;
    max-width: 25px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Groups keep a square chip; overflow stays visible so the name label can hang outside. */
html body.toolbar-labels .top-bar .toolbar-group-btn[data-toolbar-label] {
    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    border-radius: 8px !important;
    aspect-ratio: 1 / 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    flex-shrink: 0 !important;
}

html body.toolbar-labels .top-bar .toolbar-group-btn[data-toolbar-label] .toolbar-group-mosaic {
    overflow: hidden !important;
    border-radius: 6px;
}

html body.toolbar-labels .top-bar .nav-btn[data-toolbar-label],
html body.toolbar-labels .top-bar .browser-menu > .nav-btn[data-toolbar-label] {
    width: 29px !important;
    min-width: 29px !important;
    max-width: 29px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    padding: 0 4px !important;
}

/* Layout / Menu IDs lock 28px elsewhere and beat the nav-btn label size. */
html body.toolbar-labels .top-bar #layout-toggle,
html body.toolbar-labels .top-bar #menu-btn,
html body.toolbar-labels .top-bar #toolbar-overflow-btn {
    width: 29px !important;
    min-width: 29px !important;
    max-width: 29px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    padding: 0 4px !important;
}

html body.toolbar-labels .top-bar .volume-button-knob[data-toolbar-label],
html body.toolbar-labels .top-bar .volume-control-container .volume-button-knob {
    width: 25px !important;
    min-width: 25px !important;
    max-width: 25px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    padding: 2px !important;
    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important;
    transform: none !important;
}

html body.toolbar-labels .top-bar .extension-icon-slot {
    min-width: var(--ext-slot-min, 28px) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

html body.toolbar-labels .top-bar .extension-icon,
html body.toolbar-labels .top-bar .extension-toolbar .extension-icon,
html body.toolbar-labels .top-bar .extensions-menu-btn,
html body.toolbar-labels .top-bar .powerups-menu-btn {
    width: 25px !important;
    min-width: 25px !important;
    max-width: 25px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
}

html body.toolbar-labels .top-bar .extension-icon img,
html body.toolbar-labels .top-bar .extension-toolbar .extension-icon img {
    width: 15px !important;
    height: 15px !important;
    max-width: 15px !important;
    max-height: 15px !important;
    object-fit: contain !important;
}

html body.toolbar-labels .top-bar .extensions-menu-btn i,
html body.toolbar-labels .top-bar .powerups-menu-btn i {
    font-size: 12px !important;
}

html body.toolbar-labels .top-bar .toolbar-icon-btn[data-toolbar-label] img,
html body.toolbar-labels .top-bar .instant-answer-button[data-toolbar-label] img {
    width: 15px !important;
    height: 15px !important;
    max-width: 15px !important;
    max-height: 15px !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
    margin: 0 auto !important;
    flex-shrink: 0 !important;
}

html body.toolbar-labels .top-bar .toolbar-icon-btn.stealth-sponsor-powerup-btn[data-toolbar-label] img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    margin: 0 !important;
    border-radius: 50%;
    filter: none !important;
}

html body.toolbar-labels .top-bar #downloads-toggle-btn img,
.top-bar #downloads-toggle-btn img {
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
}

html body.toolbar-labels .top-bar #crypto-toolbar-btn img,
html body.toolbar-labels .top-bar #crypto-toolbar-btn.instant-answer-button img {
    width: 17px !important;
    height: 17px !important;
    max-width: 17px !important;
    max-height: 17px !important;
}

html body.toolbar-labels .top-bar #stocks-toolbar-btn img,
html body.toolbar-labels .top-bar #stocks-toolbar-btn.instant-answer-button img {
    width: 11px !important;
    height: 11px !important;
    max-width: 11px !important;
    max-height: 11px !important;
}

html body.toolbar-labels .top-bar #social-toolbar-btn img,
html body.toolbar-labels .top-bar #social-toolbar-btn.instant-answer-button img {
    width: 17px !important;
    height: 17px !important;
    max-width: 17px !important;
    max-height: 17px !important;
}

html body.toolbar-labels .top-bar #email-toolbar-btn img,
html body.toolbar-labels .top-bar #email-toolbar-btn.instant-answer-button img {
    width: 15px !important;
    height: 15px !important;
    filter: brightness(0) saturate(100%) invert(72%) sepia(42%) saturate(650%) hue-rotate(160deg) brightness(1.05) !important;
}

body.toolbar-labels .top-bar [data-toolbar-label]::after {
    content: attr(data-toolbar-label);
    position: absolute;
    left: 50%;
    right: auto;
    top: calc(100% + 3px);
    bottom: auto;
    transform: translateX(-50%);
    font-size: 8px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.02em;
    color: rgba(255, 255, 255, 0.48);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 40px;
    width: max-content;
    height: auto;
    text-align: center;
    pointer-events: none;
    user-select: none;
    z-index: 6;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
}

body.toolbar-labels .top-bar .extension-icon-slot [data-toolbar-label]::after {
    max-width: calc(var(--ext-slot-min, 40px) - 4px);
}

body.toolbar-labels .top-bar .stealth-logo-btn::after,
body.toolbar-labels .top-bar .stealth-logo::after {
    content: none !important;
    display: none !important;
}

body.toolbar-labels .top-bar .downloads-badge,
body.toolbar-labels .top-bar .link-scan-ticker,
body.toolbar-labels .top-bar .crypto-alert-ticker,
body.toolbar-labels .top-bar .stocks-alert-ticker,
body.toolbar-labels .top-bar .rss-unread-ticker {
    top: -3px;
    right: -3px;
}

html[data-theme="light"] body.toolbar-labels .top-bar [data-toolbar-label]::after,
html.theme-light body.toolbar-labels .top-bar [data-toolbar-label]::after {
    color: rgba(32, 33, 36, 0.5);
}

html[data-theme="stealth-glass"] body.toolbar-labels .top-bar [data-toolbar-label]::after,
html.theme-stealth-glass body.toolbar-labels .top-bar [data-toolbar-label]::after {
    color: rgba(255, 255, 255, 0.58);
}

/* Top dock: titlebar 40 + labeled toolbar 52 = 92. Keep page HWND below labels. */
html body.toolbar-labels:not(.bottom-layout-body) .status-bar,
html body.toolbar-labels .browser-container:not(.bottom-layout) .status-bar {
    top: 92px !important;
}

/* Longer tabs override the 92px labels dock (48 + 52 = 100). */
html.longer-tabs body.toolbar-labels:not(.bottom-layout-body) .status-bar,
html.longer-tabs body.toolbar-labels .browser-container:not(.bottom-layout) .status-bar {
    top: 100px !important;
}

html body.toolbar-labels .browser-container:not(.bottom-layout) .web-content {
    top: 114px !important;
    height: calc(100% - 114px) !important;
}

html.longer-tabs body.toolbar-labels .browser-container:not(.bottom-layout) .web-content {
    top: 122px !important;
    height: calc(100% - 122px) !important;
}

html body.toolbar-labels .browser-container.security-bar-hidden:not(.bottom-layout) .web-content,
html body.toolbar-labels.security-bar-hidden:not(.bottom-layout-body) .web-content {
    top: 92px !important;
    height: calc(100% - 92px) !important;
}

html.longer-tabs body.toolbar-labels .browser-container.security-bar-hidden:not(.bottom-layout) .web-content,
html.longer-tabs body.toolbar-labels.security-bar-hidden:not(.bottom-layout-body) .web-content {
    top: 100px !important;
    height: calc(100% - 100px) !important;
}

html body.toolbar-labels:not(.bottom-layout-body) .bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    top: 114px !important;
}

html body.toolbar-labels.security-bar-hidden:not(.bottom-layout-body) .bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    top: 92px !important;
}

html body.toolbar-labels:not(.bottom-layout-body).bookmarks-bar-visible .web-content,
html body.toolbar-labels .browser-container:not(.bottom-layout).bookmarks-bar-visible .web-content {
    top: 148px !important;
    height: calc(100% - 148px) !important;
}

html body.toolbar-labels.security-bar-hidden:not(.bottom-layout-body).bookmarks-bar-visible .web-content,
html body.toolbar-labels .browser-container.security-bar-hidden:not(.bottom-layout).bookmarks-bar-visible .web-content {
    top: 126px !important;
    height: calc(100% - 126px) !important;
}

html body.toolbar-labels:not(.bottom-layout-body) .browser-sidebar,
html body.toolbar-labels:not(.bottom-layout-body) .playlist-sidebar,
html body.toolbar-labels:not(.bottom-layout-body) .audio-sidebar {
    top: 114px;
}

html body.toolbar-labels.security-bar-hidden:not(.bottom-layout-body) .browser-sidebar,
html body.toolbar-labels.security-bar-hidden:not(.bottom-layout-body) .playlist-sidebar,
html body.toolbar-labels.security-bar-hidden:not(.bottom-layout-body) .audio-sidebar {
    top: 92px;
}

html body.toolbar-labels:not(.bottom-layout-body).bookmarks-bar-visible .browser-sidebar {
    top: 148px;
}

html body.toolbar-labels.security-bar-hidden:not(.bottom-layout-body).bookmarks-bar-visible .browser-sidebar {
    top: 126px;
}

/* Bottom dock: labels open toward the tabs (above icons) so they never paint
   into the security statistics strip under the URL bar. */
html body.toolbar-labels.bottom-layout-body .top-bar [data-toolbar-label]::after,
html body.toolbar-labels .browser-container.bottom-layout .top-bar [data-toolbar-label]::after {
    top: auto !important;
    bottom: calc(100% + 3px) !important;
}

html.bottom-layout-html:not(.security-bar-hidden) body.toolbar-labels:not(.security-bar-hidden) .glass-titlebar,
html.bottom-layout-html:not(.security-bar-hidden) body.toolbar-labels.bottom-layout-body:not(.security-bar-hidden) .glass-titlebar {
    bottom: calc(var(--bottom-status-height, 22px) + 51px) !important;
}

html.bottom-layout-html:not(.security-bar-hidden) body.toolbar-labels:not(.security-bar-hidden) .browser-container.bottom-layout .top-bar,
html.bottom-layout-html:not(.security-bar-hidden) body.toolbar-labels.bottom-layout-body:not(.security-bar-hidden) .browser-container.bottom-layout .top-bar {
    bottom: var(--bottom-status-height, 22px) !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 14px 6px 2px 6px !important;
}

html.bottom-layout-html:not(.security-bar-hidden) body.toolbar-labels:not(.security-bar-hidden) .status-bar,
html.bottom-layout-html:not(.security-bar-hidden) body.toolbar-labels:not(.security-bar-hidden) .browser-container.bottom-layout .status-bar {
    bottom: 0 !important;
    top: auto !important;
    height: 22px !important;
    min-height: 22px !important;
    z-index: 100003 !important;
}

html.security-bar-hidden.bottom-layout-html body.toolbar-labels .glass-titlebar,
html.bottom-layout-html.security-bar-hidden body.toolbar-labels .glass-titlebar,
html.security-bar-hidden body.toolbar-labels.bottom-layout-body .glass-titlebar {
    bottom: calc(var(--bottom-status-height, 0px) + 51px) !important;
}

html.security-bar-hidden.bottom-layout-html body.toolbar-labels .browser-container.bottom-layout .top-bar,
html.bottom-layout-html.security-bar-hidden body.toolbar-labels .browser-container.bottom-layout .top-bar,
html.security-bar-hidden body.toolbar-labels .browser-container.bottom-layout .top-bar {
    bottom: 0 !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 14px 6px 2px 6px !important;
    box-sizing: border-box !important;
}

html body.toolbar-labels.bottom-layout-body .bookmarks-bar:not([hidden]):not(.appearance-hidden),
html.bottom-layout-html body.toolbar-labels .bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    bottom: 114px !important;
}

html body.toolbar-labels.bottom-layout-body.security-bar-hidden .bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    bottom: 92px !important;
}

html body.address-bar-fixed-width .top-bar > .address-bar-container,
html body.address-bar-fixed-width .address-bar-container {
    position: relative;
    flex: 0 0 var(--short-address-bar-width, 420px) !important;
    width: var(--short-address-bar-width, 420px) !important;
    min-width: 120px !important;
    max-width: var(--short-address-bar-width, 420px) !important;
}
/* Fixed-width omnibox: leftover width lives in side gaps so left/right
   resize can pin one edge and icons on each side spread independently. */
html body.address-bar-fixed-width .top-bar {
    justify-content: flex-start;
}
html body.address-bar-fixed-width .top-bar.chrome-toolbar-width-fit > .address-bar-container {
    min-width: 120px !important;
}
.address-bar-side-gap {
    display: none;
    flex: 0 0 0px;
    min-width: 0;
    height: 1px;
    align-self: center;
    background: transparent;
    overflow: hidden;
    pointer-events: none;
    -webkit-app-region: no-drag !important;
    app-region: no-drag !important;
}
.address-bar-resize {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 10px;
    z-index: 22;
    cursor: ew-resize;
    touch-action: none;
    pointer-events: auto;
    -webkit-app-region: no-drag !important;
    app-region: no-drag !important;
    background: transparent;
}
.address-bar-container {
    position: relative;
}
.address-bar-resize-left {
    left: 0;
}
.address-bar-resize-right {
    right: 0;
}
.address-bar-resize:hover,
.address-bar-resize:active {
    background: transparent;
}
/* Invisible hold-to-move grips only at the outer top corners so the URL
   typing/click target in the center never arms a grab. */
.address-bar-move {
    display: block;
    position: absolute;
    top: 0;
    width: 28px;
    height: 5px;
    z-index: 21;
    cursor: grab;
    touch-action: none;
    pointer-events: auto;
    -webkit-app-region: no-drag !important;
    app-region: no-drag !important;
    background: transparent;
}
.address-bar-move-left {
    left: 10px;
}
.address-bar-move-right {
    right: 10px;
}
.address-bar-move:hover,
.address-bar-move:active,
body.toolbar-icon-reordering .address-bar-move {
    background: transparent;
}
body.address-bar-resizing,
body.address-bar-resizing *,
body.short-address-bar-resizing,
body.short-address-bar-resizing * {
    cursor: ew-resize !important;
    user-select: none !important;
}
body.rounded-content .web-content {
    border-radius: 12px;
    overflow: hidden;
    margin: 0 !important;
}
/* Square the edge that meets the chrome bar so cut corners do not show above/below it */
body.rounded-content.bottom-layout-body .web-content,
body.rounded-content .browser-container.bottom-layout .web-content {
    border-radius: 12px 12px 0 0;
}
body.rounded-content:not(.bottom-layout-body) .web-content {
    border-radius: 0 0 12px 12px;
}
/* Inactive tab styles: dotted outline on the tab chip, never around the favicon.
   Grouped / colored tabs keep their group-color outline instead. */
body.inactive-tabs-dotted .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html.inactive-tabs-dotted .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html.inactive-tabs-dotted.bottom-layout-html .glass-titlebar .tabs-container .tab:not(.active):not(.grouped):not(.colored),
body.inactive-tabs-dotted.bottom-layout-body .glass-titlebar .tabs-container .tab:not(.active):not(.grouped):not(.colored) {
    border-style: dotted !important;
    border-color: rgba(196, 181, 253, 0.95) !important;
}
html[data-theme="light"].inactive-tabs-dotted .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html[data-theme="light"] body.inactive-tabs-dotted .tabs-container .tab:not(.active):not(.grouped):not(.colored) {
    border-color: rgba(91, 33, 182, 0.85) !important;
}
html.inactive-tabs-dotted .tabs-container .tab.grouped:not(.active),
html.inactive-tabs-dotted .tabs-container .tab.colored:not(.active),
body.inactive-tabs-dotted .tabs-container .tab.grouped:not(.active),
body.inactive-tabs-dotted .tabs-container .tab.colored:not(.active) {
    border-style: solid !important;
    border-color: var(--tab-group-color, #4285f4) !important;
}
/* Dimmed must beat glass.css `.tab { opacity: 1 !important }` and bottom-layout tab rules.
   Skip grouped / colored so open group members keep a readable group outline. */
html.inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored),
body.inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html.inactive-tabs-dimmed.bottom-layout-html .glass-titlebar .tabs-container .tab:not(.active):not(.grouped):not(.colored),
body.inactive-tabs-dimmed.bottom-layout-body .glass-titlebar .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html.inactive-tabs-dimmed .browser-container.bottom-layout .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html.chrome-ui-faded.inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored) {
    opacity: 0.42 !important;
    filter: saturate(0.72) !important;
}
html.inactive-tabs-dimmed .tabs-container .tab.active,
body.inactive-tabs-dimmed .tabs-container .tab.active,
html.inactive-tabs-dimmed .tabs-container .tab.grouped,
html.inactive-tabs-dimmed .tabs-container .tab.colored,
body.inactive-tabs-dimmed .tabs-container .tab.grouped,
body.inactive-tabs-dimmed .tabs-container .tab.colored {
    opacity: 1 !important;
    filter: none !important;
}
html.inactive-tabs-dimmed .tabs-container .tab:not(.active):hover,
body.inactive-tabs-dimmed .tabs-container .tab:not(.active):hover,
html.inactive-tabs-dimmed.bottom-layout-html .glass-titlebar .tabs-container .tab:not(.active):hover,
body.inactive-tabs-dimmed.bottom-layout-body .glass-titlebar .tabs-container .tab:not(.active):hover,
html.chrome-ui-faded.inactive-tabs-dimmed .tabs-container .tab:not(.active):hover {
    opacity: 1 !important;
    filter: none !important;
}
/* Theme-aware mute so inactive chips read quieter against the active theme. */
html[data-theme="dark"].inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html[data-theme="dark"] body.inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored) {
    color: rgba(255, 255, 255, 0.5) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    background: rgba(26, 26, 26, 0.55) !important;
    background-image: none !important;
}
html[data-theme="light"].inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html[data-theme="light"] body.inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored) {
    color: rgba(28, 25, 22, 0.45) !important;
    border-color: rgba(55, 48, 40, 0.16) !important;
    background: rgba(228, 225, 219, 0.55) !important;
    background-image: none !important;
}
html[data-theme="stealth"].inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html[data-theme="stealth"] body.inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored) {
    color: rgba(245, 243, 255, 0.48) !important;
    border-color: rgba(168, 85, 247, 0.22) !important;
    background: rgba(26, 18, 40, 0.55) !important;
    background-image: none !important;
}
html[data-theme="stealth-glass"].inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html[data-theme="stealth-glass"] body.inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored) {
    color: rgba(242, 244, 248, 0.48) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    background: rgba(255, 255, 255, 0.04) !important;
    background-image: none !important;
    box-shadow: none !important;
}
html[data-theme="stealth-float"].inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html[data-theme="stealth-float"] body.inactive-tabs-dimmed .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html[data-theme="stealth-float"].inactive-tabs-dimmed.floating-toolbar-widget:not(.chrome-widget-collapsed) .tabs-container .tab:not(.active):not(.grouped):not(.colored),
html[data-theme="stealth-float"] body.inactive-tabs-dimmed.floating-toolbar-widget:not(.chrome-widget-collapsed) .tabs-container .tab:not(.active):not(.grouped):not(.colored) {
    color: rgba(242, 244, 248, 0.48) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    background: rgba(12, 14, 20, 0.28) !important;
    background-color: rgba(12, 14, 20, 0.28) !important;
    background-image: none !important;
    box-shadow: none !important;
    opacity: 0.42 !important;
    filter: saturate(0.72) !important;
}
/* Open group / colored tabs always keep the group-color outline and tint. */
html.inactive-tabs-dimmed .tabs-container .tab.grouped,
html.inactive-tabs-dimmed .tabs-container .tab.colored,
body.inactive-tabs-dimmed .tabs-container .tab.grouped,
body.inactive-tabs-dimmed .tabs-container .tab.colored,
html[data-theme].inactive-tabs-dimmed .tabs-container .tab.grouped,
html[data-theme].inactive-tabs-dimmed .tabs-container .tab.colored,
html[data-theme] body.inactive-tabs-dimmed .tabs-container .tab.grouped,
html[data-theme] body.inactive-tabs-dimmed .tabs-container .tab.colored {
    border: 1px solid var(--tab-group-color, #4285f4) !important;
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 28%, #1c1c1c) !important;
    background-color: color-mix(in srgb, var(--tab-group-color, #4285f4) 28%, #1c1c1c) !important;
    background-image: none !important;
    opacity: 1 !important;
    filter: none !important;
}
html.inactive-tabs-dimmed .tabs-container .tab.grouped.active,
html.inactive-tabs-dimmed .tabs-container .tab.colored.active,
body.inactive-tabs-dimmed .tabs-container .tab.grouped.active,
body.inactive-tabs-dimmed .tabs-container .tab.colored.active,
html[data-theme].inactive-tabs-dimmed .tabs-container .tab.grouped.active,
html[data-theme].inactive-tabs-dimmed .tabs-container .tab.colored.active {
    background: color-mix(in srgb, var(--tab-group-color, #4285f4) 42%, #1a1a1a) !important;
    background-color: color-mix(in srgb, var(--tab-group-color, #4285f4) 42%, #1a1a1a) !important;
}
html.inactive-tabs-dimmed .tabs-container .tab:not(.active) .tab-title,
html.inactive-tabs-dimmed .tabs-container .tab:not(.active) .tab-title-text,
html.inactive-tabs-dimmed .tabs-container .tab:not(.active) .tab-audio-btn,
body.inactive-tabs-dimmed .tabs-container .tab:not(.active) .tab-title,
body.inactive-tabs-dimmed .tabs-container .tab:not(.active) .tab-title-text,
body.inactive-tabs-dimmed .tabs-container .tab:not(.active) .tab-audio-btn {
    color: inherit !important;
    opacity: 1 !important;
}
#tab-hover-card {
    position: fixed;
    z-index: 2147483647;
    width: max-content;
    max-width: min(360px, calc(100vw - 24px));
    min-width: 0;
    padding: 10px 12px;
    display: grid;
    gap: 4px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 16px;
    background: rgba(22, 22, 30, var(--panel-fill-alpha, 0.48));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
    backdrop-filter: blur(22px) saturate(160%);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
    pointer-events: none;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
    clip-path: inset(0 round 16px);
    -webkit-clip-path: inset(0 round 16px);
    -webkit-font-smoothing: subpixel-antialiased;
    text-rendering: optimizeLegibility;
    color: #f2f4f8;
    opacity: 0;
    transform: none;
    transition: opacity 160ms ease;
}
#tab-hover-card.is-visible {
    opacity: 1;
    transform: none;
}
#tab-hover-card.has-preview {
    width: 280px;
    max-width: min(320px, calc(100vw - 24px));
    gap: 8px;
    padding: 10px;
}
#tab-hover-card .tab-hover-glass-sheen {
    display: none !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    z-index: 0 !important;
    background: none !important;
    opacity: 0 !important;
}
/* Absolute chrome (sheen / frost) must stay absolute or the page HWND paints
   a hard dark slab over the rounded perimeter. */
#tab-hover-card > *:not(.page-frost-layer):not(.tab-hover-glass-sheen) {
    position: relative;
    z-index: 1;
}
#tab-hover-card .tab-hover-preview {
    display: block;
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 10;
    border-radius: 10px;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.08);
    transform: translateZ(0);
}
#tab-hover-card .tab-hover-preview[hidden] {
    display: none;
}
#tab-hover-card .tab-hover-preview-img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    background: #111;
}
#tab-hover-card.page-frost-host {
    --panel-fill-alpha: 0.48;
    --frost-tint-alpha: 0.20;
    background: rgba(22, 22, 30, var(--panel-fill-alpha, 0.48)) !important;
    background-color: rgba(22, 22, 30, var(--panel-fill-alpha, 0.48)) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-radius: 16px !important;
    clip-path: inset(0 round 16px) !important;
    -webkit-clip-path: inset(0 round 16px) !important;
    overflow: hidden !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}
#tab-hover-card.page-frost-host.page-frost-over-chrome {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
#tab-hover-card.page-frost-host .page-frost-layer,
#tab-hover-card.page-frost-host .page-frost-image,
#tab-hover-card.page-frost-host .page-frost-layer::after {
    border-radius: 16px !important;
    clip-path: inset(0 round 16px) !important;
    -webkit-clip-path: inset(0 round 16px) !important;
    overflow: hidden !important;
}
[data-theme="stealth"] #tab-hover-card,
[data-theme="stealth-glass"] #tab-hover-card,
[data-theme="stealth-float"] #tab-hover-card {
    background: rgba(36, 22, 58, var(--panel-fill-alpha, 0.48));
    border-color: rgba(196, 142, 255, 0.28);
}
[data-theme="light"] #tab-hover-card {
    background: rgba(252, 252, 255, var(--panel-fill-alpha, 0.58));
    border-color: rgba(0, 0, 0, 0.12);
    color: #1a1a22;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}
[data-theme="light"] #tab-hover-card .tab-hover-glass-sheen {
    display: none !important;
    background: none !important;
}
#tab-hover-card[hidden] { display: none; }
#tab-hover-card .tab-hover-title,
#tab-hover-card .tab-hover-url,
#tab-hover-card .tab-hover-memory {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: transparent;
    box-shadow: none;
    border: 0;
    margin: 0;
}
#tab-hover-card.has-preview .tab-hover-title,
#tab-hover-card.has-preview .tab-hover-url,
#tab-hover-card.has-preview .tab-hover-memory {
    padding: 0 2px;
}
#tab-hover-card .tab-hover-url,
#tab-hover-card .tab-hover-memory {
    font-size: 11px;
    opacity: .7;
}

/* Welcome Screen */
.welcome-screen {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    padding: 0;
    margin: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: auto;
    height: auto;
    overflow-y: auto;
    overflow-x: hidden;
    box-sizing: border-box;
    z-index: 1;
}

.welcome-screen iframe {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

.home-vanta-bg {
    position: absolute !important;
    top: 0;
    left: 0;
    right: 0;
    height: 46vh;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    opacity: 0.38;
    flex: none !important;
    width: auto !important;
    max-height: none;
    -webkit-mask-image: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.7) 0%,
        rgba(0, 0, 0, 0.4) 42%,
        rgba(0, 0, 0, 0.14) 72%,
        rgba(0, 0, 0, 0) 100%
    );
    mask-image: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.7) 0%,
        rgba(0, 0, 0, 0.4) 42%,
        rgba(0, 0, 0, 0.14) 72%,
        rgba(0, 0, 0, 0) 100%
    );
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

.home-vanta-bg canvas {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
}

html[data-theme="light"] .home-vanta-bg,
html.theme-light .home-vanta-bg {
    opacity: 0.52;
    background: #ebe4f6;
}

.home-vanta-bg.is-pending {
    opacity: 0 !important;
}

.home-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 8vh;
    gap: 20px;
    pointer-events: auto !important;
    position: relative;
    z-index: 2;
    flex: 0 0 auto;
    flex-shrink: 0;
    min-height: auto;
}

.home-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    flex: 0 0 auto;
    flex-shrink: 0;
}

.home-logo img {
    height: 120px;
    width: auto;
    opacity: 0.95;
    flex-shrink: 0;
    object-fit: contain;
}

.home-logo img.home-main-logo {
    height: 140px;
    width: 140px;
    flex-shrink: 0;
    object-fit: contain;
    filter: drop-shadow(0 0 12px rgba(73, 0, 194, 0.45));
}

.home-logo img.home-wordmark {
    height: 40px;
    width: auto;
    flex-shrink: 0;
    object-fit: contain;
}

.home-logo img.home-main-logo.is-custom-image {
    height: auto;
    width: auto;
    max-width: min(320px, 70vw);
    max-height: 160px;
    border-radius: 14px 4px 4px 4px;
    filter: none;
}

.home-tagline {
    margin-top: -4px;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.62);
    text-align: center;
}

.home-tagline[hidden],
.home-logo[hidden],
.home-search-mode[hidden] {
    display: none !important;
}

.home-pinned-sites {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    width: min(900px, 92%);
    margin: 14px auto 0;
}

.home-pinned-sites[hidden] {
    display: none !important;
}

.home-pinned-site {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 180px;
    padding: 8px 12px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px 2px 2px 2px;
    background: rgba(255, 255, 255, 0.04);
    color: inherit;
    cursor: pointer;
    font: inherit;
}

.home-pinned-site:hover {
    background: rgba(90, 13, 214, 0.22);
    border-color: rgba(90, 13, 214, 0.4);
}

.home-pinned-favicon,
.home-pinned-favicon-fallback {
    width: 18px;
    height: 18px;
    border-radius: 4px;
    flex-shrink: 0;
}

.home-pinned-favicon-fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    background: rgba(90, 13, 214, 0.35);
}

.home-pinned-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
}

html[data-theme="light"] .home-tagline,
html.theme-light .home-tagline {
    color: rgba(0, 0, 0, 0.55);
}

html[data-theme="light"] .home-pinned-site,
html.theme-light .home-pinned-site {
    background: rgba(255, 255, 255, 0.28);
    border-color: rgba(90, 13, 214, 0.16);
}

.home-search {
    display: flex;
    align-items: stretch;
    width: min(900px, 92%);
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 999px;
    overflow: hidden;
    background-clip: padding-box;
    clip-path: inset(0 round 999px);
    transition: border-color 0.1s ease-out;
    position: relative;
    pointer-events: auto !important;
    z-index: 10 !important;
}

.home-search:hover {
    background: rgba(255,255,255,0.08);
    border-color: rgba(255,255,255,0.2);
}

.home-search.focused {
    background: rgba(255,255,255,0.1);
    border-color: #4900c2;
}

.home-search-mode {
    display: flex;
    align-items: stretch;
    gap: 0;
    flex-shrink: 0;
    margin: 8px 0 8px 8px;
    padding: 0;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.1);
    align-self: center;
    z-index: 2;
}

.home-search-mode-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 40px;
    padding: 0 14px;
    border: none;
    border-radius: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.62);
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.04em;
    cursor: pointer;
    transition: background-color 0.15s ease-out, color 0.15s ease-out;
    pointer-events: auto !important;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-left: none;
    min-width: 0;
}

.home-search-mode-btn:first-child {
    border-radius: 999px 0 0 999px;
}

.home-search-mode-btn:last-child {
    border-radius: 0 999px 999px 0;
}

.home-search-mode-btn svg {
    width: 14px;
    height: 14px;
    display: block;
    opacity: 0.9;
    filter: none;
    flex-shrink: 0;
}

.home-search-mode-btn:hover {
    color: rgba(255, 255, 255, 0.92);
    background: rgba(255, 255, 255, 0.08);
    border-left-color: transparent;
}

.home-search-mode-btn.is-active {
    color: #fff;
    background: rgba(124, 58, 237, 0.55);
    box-shadow: none;
}

.home-search-mode-btn[data-mode="ai"].is-active {
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.85), rgba(168, 85, 247, 0.7));
}

.home-search-mode-btn:active {
    background: rgba(124, 58, 237, 0.35);
    color: #fff;
}

.home-search input {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: #fff;
    font-size: 18px;
    padding: 18px 16px 18px 14px;
    font-weight: 400;
    letter-spacing: 0.5px;
    caret-color: #fff;
    user-select: text !important;
    -webkit-user-select: text !important;
    cursor: text;
    pointer-events: auto !important;
    z-index: 1 !important;
    position: relative !important;
    min-width: 0;
}

.home-search input::placeholder {
    color: rgba(255,255,255,0.5);
    transition: color 0.3s ease;
}

.home-search input:focus {
    color: #fff;
    caret-color: #fff !important;
    cursor: text;
}

.home-search input:focus::placeholder {
    color: rgba(255,255,255,0.3);
}

html[data-theme="light"] .home-search,
html.theme-light .home-search {
    background: rgba(255, 255, 255, 0.38);
    border-color: rgba(90, 13, 214, 0.22);
    box-shadow: none;
}

html[data-theme="light"] .home-search:hover,
html.theme-light .home-search:hover {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(90, 13, 214, 0.34);
}

html[data-theme="light"] .home-search.focused,
html.theme-light .home-search.focused {
    background: rgba(255, 255, 255, 0.58);
    border-color: #4900c2;
}

html[data-theme="light"] .home-search input,
html[data-theme="light"] .home-search input:focus,
html.theme-light .home-search input,
html.theme-light .home-search input:focus {
    color: #1c1916;
    caret-color: #4900c2;
}

html[data-theme="light"] .home-search input::placeholder,
html[data-theme="light"] .home-search input:focus::placeholder,
html.theme-light .home-search input::placeholder,
html.theme-light .home-search input:focus::placeholder {
    color: #6b655c;
}

html[data-theme="light"] .weather-strip,
html.theme-light .weather-strip {
    color: #1c1916;
}

html[data-theme="light"] .home-search-mode,
html.theme-light .home-search-mode {
    background: rgba(90, 13, 214, 0.1);
    border-color: rgba(90, 13, 214, 0.18);
}

html[data-theme="light"] .home-search-mode-btn,
html.theme-light .home-search-mode-btn {
    color: #6b655c;
}

html[data-theme="light"] .home-search-mode-btn:hover,
html.theme-light .home-search-mode-btn:hover {
    color: #1c1916;
    background: rgba(73, 0, 194, 0.08);
}

html[data-theme="light"] .home-search-mode-btn.is-active,
html.theme-light .home-search-mode-btn.is-active {
    color: #fff;
    background: #4900c2;
    box-shadow: none;
}

html[data-theme="light"] .home-search-mode-btn[data-mode="ai"].is-active,
html.theme-light .home-search-mode-btn[data-mode="ai"].is-active {
    background: linear-gradient(135deg, #4900c2, #7c3aed);
}

.home-search > #home-search-btn {
    align-self: stretch;
    flex-shrink: 0;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.92);
    border: none;
    border-left: 1px solid rgba(255, 255, 255, 0.12);
    padding: 0 22px;
    margin: 0;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.15s ease-out, color 0.15s ease-out, border-color 0.15s ease-out;
    border-radius: 0 999px 999px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
    pointer-events: auto !important;
    z-index: 1 !important;
}

.home-search > #home-search-btn svg {
    width: 18px;
    height: 18px;
    display: block;
    opacity: 0.95;
    filter: drop-shadow(0 0 6px rgba(168, 85, 247, 0.35));
}

.home-search > #home-search-btn .home-search-icon-ai {
    display: none;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
    user-select: none;
}

.home-search[data-home-search-mode="ai"] > #home-search-btn {
    background: rgba(124, 58, 237, 0.28);
    color: #fff;
    border-left-color: rgba(168, 85, 247, 0.45);
    min-width: 72px;
}

.home-search[data-home-search-mode="ai"] > #home-search-btn .home-search-icon-search {
    display: none;
}

.home-search[data-home-search-mode="ai"] > #home-search-btn .home-search-icon-ai {
    display: block;
}

.home-search > #home-search-btn:hover {
    background: rgba(124, 58, 237, 0.22);
    color: #fff;
    border-left-color: rgba(168, 85, 247, 0.35);
}

.home-search[data-home-search-mode="ai"] > #home-search-btn:hover {
    background: rgba(124, 58, 237, 0.4);
}

.home-search > #home-search-btn:active {
    background: rgba(124, 58, 237, 0.32);
    color: #fff;
}

html[data-theme="light"] .home-search > #home-search-btn,
html.theme-light .home-search > #home-search-btn {
    background: rgba(73, 0, 194, 0.08);
    color: #4900c2;
    border-left-color: rgba(55, 48, 40, 0.12);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

html[data-theme="light"] .home-search > #home-search-btn svg,
html.theme-light .home-search > #home-search-btn svg {
    filter: none;
}

html[data-theme="light"] .home-search[data-home-search-mode="ai"] > #home-search-btn,
html.theme-light .home-search[data-home-search-mode="ai"] > #home-search-btn {
    background: rgba(73, 0, 194, 0.18);
    color: #3a0095;
    border-left-color: rgba(73, 0, 194, 0.35);
}

html[data-theme="light"] .home-search > #home-search-btn:hover,
html.theme-light .home-search > #home-search-btn:hover {
    background: rgba(73, 0, 194, 0.14);
    color: #3a0095;
    border-left-color: rgba(73, 0, 194, 0.28);
}

html[data-theme="light"] .home-search[data-home-search-mode="ai"] > #home-search-btn:hover,
html.theme-light .home-search[data-home-search-mode="ai"] > #home-search-btn:hover {
    background: rgba(73, 0, 194, 0.26);
}

html[data-theme="light"] .home-search > #home-search-btn:active,
html.theme-light .home-search > #home-search-btn:active {
    background: rgba(73, 0, 194, 0.2);
}

.home-recent-sites {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px 18px;
    width: min(720px, 92%);
    margin-top: 4px;
    pointer-events: auto;
    z-index: 5;
}

.home-recent-sites[hidden] {
    display: none !important;
}

.home-recent-site {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 96px;
    padding: 8px 4px;
    border: none;
    background: transparent;
    color: rgba(255, 255, 255, 0.92);
    cursor: pointer;
    border-radius: 12px;
    transition: background-color 0.12s ease-out;
}

.home-recent-site:hover {
    background: rgba(255, 255, 255, 0.08);
}

.home-recent-site:focus-visible {
    outline: 2px solid #4900c2;
    outline-offset: 2px;
}

.home-recent-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.45);
    border: 1px solid rgba(255, 255, 255, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.22);
}

.home-recent-favicon {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.home-recent-favicon-fallback {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    background: linear-gradient(145deg, #3a0095, #5c1ad1);
}

.home-recent-label {
    width: 100%;
    text-align: center;
    font-size: 12px;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: rgba(255, 255, 255, 0.88);
}

html[data-theme="light"] .home-recent-site,
html.theme-light .home-recent-site {
    color: #1c1916;
}

html[data-theme="light"] .home-recent-site:hover,
html.theme-light .home-recent-site:hover {
    background: rgba(40, 32, 24, 0.06);
}

html[data-theme="light"] .home-recent-icon,
html.theme-light .home-recent-icon {
    background: rgba(255, 255, 255, 0.42);
    border-color: rgba(90, 13, 214, 0.18);
    box-shadow: none;
}

html[data-theme="light"] .home-recent-label,
html.theme-light .home-recent-label {
    color: #3a342c;
}

.weather-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    color: #fff;
    background: transparent;
    border: none;
    padding: 10px 0;
    border-radius: 0;
    position: relative;
    align-self: flex-start;
    margin-bottom: 24px;
    box-shadow: none;
    font-size: 13px;
    font-weight: 500;
    gap: 16px;
}

.weather-location {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
}

.weather-info {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    justify-content: flex-end;
}

.location-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: rgba(90, 13, 214, 0.25);
    border: 1px solid rgba(90, 13, 214, 0.3);
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    color: #ffffff;
    letter-spacing: 0.3px;
}

.location-chip i {
    font-size: 12px;
    opacity: 0.9;
    color: #5a0dd6;
}

.weather-strip:hover {
    background: transparent;
    cursor: pointer;
}

.weather-strip.loading {
    animation: weatherPulse 2s infinite;
}

@keyframes weatherPulse {
    0%, 100% { 
        opacity: 1; 
    }
    50% { 
        opacity: 0.7; 
    }
}

.weather-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: rgba(255,255,255,0.1);
    border: none;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
}

.weather-chip i {
    font-size: 11px;
    opacity: 0.9;
}

.weather-chip:hover {
    background: rgba(255,255,255,0.12);
}

/* Responsive design */
@media (max-width: 768px) {
    .home-hero {
        padding-top: 4vh;
        gap: 16px;
    }
    
    .home-search {
        width: 95%;
    }

    .home-recent-sites {
        width: 95%;
        gap: 10px 12px;
    }

    .home-recent-site {
        width: 72px;
    }

    .home-recent-icon {
        width: 44px;
        height: 44px;
    }
    
    .weather-strip {
        font-size: 12px;
        padding: 8px 12px;
        margin-bottom: 16px;
        align-self: flex-start;
    }
    
    .weather-chip {
        font-size: 11px;
        padding: 3px 6px;
    }
    
    .stealth-logo {
        width: 60px !important;
        max-width: 60px;
    }
}

@media (max-width: 1024px) {
    .stealth-logo {
        width: 70px !important;
        max-width: 70px;
    }
}

.welcome-content {
    text-align: center;
    max-width: 800px;
    padding: 40px;
}

.welcome-content h1 {
    font-size: 3em;
    margin-bottom: 0.5em;
    text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

.welcome-content h2 {
    font-size: 1.5em;
    margin-bottom: 2em;
    opacity: 0.9;
    font-weight: 300;
}

.features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin: 40px 0;
}

.feature {
    background: rgba(255,255,255,0.1);
    padding: 30px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.2);
}

.feature-icon {
    font-size: 2.5em;
    margin-bottom: 15px;
}

.feature h3 {
    font-size: 1.2em;
    margin-bottom: 10px;
}

.feature p {
    opacity: 0.8;
    line-height: 1.5;
}

.quick-actions {
    margin-top: 40px;
    display: flex;
    gap: 20px;
    justify-content: center;
}

.action-btn {
    padding: 15px 30px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease-out;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.action-btn.primary {
    background: #ffffff;
    color: #667eea;
}

.action-btn.primary:hover {
    background: #f0f0f0;
}

.action-btn.secondary {
    background: transparent;
    color: #ffffff;
    border: 2px solid rgba(255,255,255,0.3);
}

.action-btn.secondary:hover {
    background: rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.5);
}

/* Hide welcome screen when browsing */
body.browsing .welcome-screen,
body.browsing #welcome-screen {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Hide welcome screen when error page is active */
.welcome-screen.error-page-active,
.error-page-active.welcome-screen {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: -9999 !important;
}

/* All global html/body scrollbar styling completely removed to prevent UI overlap */

/* Global scrollbar button styles removed - scrollbars only in specific containers */

/* Modal styles */
.modal-overlay {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2147483647 !important;
    pointer-events: auto !important;
}

.drawer-overlay {
    position: fixed !important;
    inset: 0;
    background: rgba(6, 6, 10, 0.5);
    backdrop-filter: blur(3px) saturate(120%);
    -webkit-backdrop-filter: blur(3px) saturate(120%);
    z-index: 2147483647 !important;
    pointer-events: auto !important;
    opacity: 0;
    transition: opacity .28s ease;
}
.drawer-overlay.visible { opacity: 1; }

.drawer {
    --drawer-accent: #7b5cff;
    --drawer-accent-soft: rgba(123, 92, 255, 0.16);
    position: fixed !important;
    top: 0;
    right: 0;
    bottom: 0;
    width: 420px;
    max-width: 92vw;
    height: auto;
    max-height: 100%;
    background: rgba(24, 24, 28, 0.92);
    border-left: 1px solid rgba(255, 255, 255, 0.08);
    z-index: 2147483647 !important;
    box-shadow: -24px 0 60px rgba(0, 0, 0, 0.5);
    transform: translateX(100%);
    transition: transform .34s cubic-bezier(0.22, 1, 0.36, 1);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    pointer-events: auto !important;
    isolation: isolate;
}

/* Blur on a non-scroll layer. backdrop-filter on the flex host breaks
   overflow scrolling on some GPUs / display drivers. */
.drawer::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(24, 24, 28, 0.72);
    backdrop-filter: blur(34px) saturate(180%);
    -webkit-backdrop-filter: blur(34px) saturate(180%);
    pointer-events: none;
    z-index: 0;
}

.drawer > * {
    position: relative;
    z-index: 1;
}

.drawer.visible { transform: translateX(0); }

.drawer-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 20px 20px 14px;
    color: #fff;
    flex-shrink: 0;
}

.drawer-title {
    font-size: 21px;
    font-weight: 700;
    letter-spacing: -0.02em;
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
}
.drawer-title .drawer-title-icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #7b5cff, #5a0dd6);
    font-size: 14px;
    color: #fff;
    box-shadow: 0 4px 14px rgba(90, 13, 214, 0.4);
}
.drawer-count {
    font-size: 12px;
    font-weight: 600;
    color: #b9b4cc;
    background: rgba(255, 255, 255, 0.06);
    padding: 3px 9px;
    border-radius: 999px;
}
.drawer-close {
    background: rgba(255, 255, 255, 0.06);
    border: none;
    color: #d6d3e0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .18s ease, color .18s ease, transform .18s ease;
}
.drawer-close:hover { background: rgba(255, 255, 255, 0.14); color: #fff; transform: rotate(90deg); }

.drawer-toolbar {
    padding: 0 20px 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.drawer-search {
    position: relative;
    flex: 1;
}
.drawer-search i {
    position: absolute;
    left: 13px;
    top: 50%;
    transform: translateY(-50%);
    color: #8a869b;
    font-size: 13px;
    pointer-events: none;
}
.drawer-search input {
    width: 100%;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 11px;
    color: #fff;
    font-size: 13.5px;
    padding: 10px 12px 10px 34px;
    outline: none;
    transition: border-color .18s ease, background .18s ease;
}
.drawer-search input::placeholder { color: #8a869b; }
.drawer-search input:focus {
    border-color: var(--drawer-accent);
    background: rgba(255, 255, 255, 0.09);
}
.drawer-clear-all {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.07);
    color: #cfccdd;
    font-size: 12.5px;
    font-weight: 600;
    padding: 10px 14px;
    border-radius: 11px;
    cursor: pointer;
    white-space: nowrap;
    transition: all .18s ease;
}
.drawer-clear-all:hover { background: rgba(255, 90, 90, 0.16); border-color: rgba(255, 90, 90, 0.4); color: #ff8a8a; }

.drawer-body {
    padding: 4px 12px 20px;
    overflow-x: hidden;
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
    overscroll-behavior: contain;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
}

.drawer-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 100%;
    min-height: 300px;
    color: #8a869b;
    gap: 14px;
    padding: 20px;
}
.drawer-empty .drawer-empty-icon {
    width: 72px;
    height: 72px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    color: var(--drawer-accent);
    background: var(--drawer-accent-soft);
}
.drawer-empty .drawer-empty-title { font-size: 16px; font-weight: 600; color: #d6d3e0; }
.drawer-empty .drawer-empty-sub { font-size: 13px; max-width: 240px; line-height: 1.5; }

.drawer-group-label {
    font-size: 11.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #8a869b;
    padding: 16px 10px 8px;
}
.drawer-group-label:first-child { padding-top: 6px; }

.history-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 13px;
    margin-bottom: 3px;
    cursor: pointer;
    transition: background .16s ease;
    position: relative;
}
.history-item:hover { background: rgba(255, 255, 255, 0.06); }
.history-favicon {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    flex-shrink: 0;
    background: rgba(255, 255, 255, 0.06);
    object-fit: cover;
    padding: 4px;
}
.history-favicon-fallback {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    flex-shrink: 0;
    background: rgba(255, 255, 255, 0.06);
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(167, 139, 250, 0.9);
    font-size: 13px;
}
.history-item-info { flex: 1; min-width: 0; }
.history-title {
    color: #f4f2fb;
    font-size: 13.5px;
    font-weight: 500;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.history-url {
    color: #8a869b;
    font-size: 11.5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.history-time {
    color: #74707f;
    font-size: 11px;
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
}
.history-delete {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: transparent;
    border: none;
    color: #8a869b;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    flex-shrink: 0;
    opacity: 0;
    transition: all .16s ease;
}
.history-item:hover .history-delete { opacity: 1; }
.history-item:hover .history-time { display: none; }
.history-delete:hover { background: rgba(255, 90, 90, 0.18); color: #ff8a8a; }

.download-item {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 12px;
    border-radius: 14px;
    margin-bottom: 6px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: background .16s ease, border-color .16s ease;
}
.download-item:hover { background: rgba(255, 255, 255, 0.07); }
.download-icon {
    width: 42px;
    height: 42px;
    border-radius: 0;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: #c5c7ca;
    background: transparent;
    overflow: visible;
}

.download-icon.has-preview {
    background: transparent;
    padding: 0;
    color: inherit;
}

.download-icon .downloads-popup-thumb {
    border-radius: 0;
    object-fit: contain;
    background: transparent;
}
.download-icon.type-image,
.download-icon.type-video,
.download-icon.type-audio,
.download-icon.type-archive,
.download-icon.type-doc,
.download-icon.type-exe { background: transparent; }
.download-info { flex: 1; min-width: 0; }
.download-name {
    color: #f4f2fb;
    font-size: 13.5px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 3px;
}
.download-meta {
    color: #8a869b;
    font-size: 11.5px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.download-meta .dot { opacity: 0.5; }
.download-progress {
    height: 4px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
    margin-top: 7px;
}
.download-progress .bar {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #7b5cff, #a78bff);
    transition: width .3s ease;
}
.download-actions {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}
.download-actions button {
    width: 32px;
    height: 32px;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.06);
    border: none;
    color: #cfccdd;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    transition: all .16s ease;
}
.download-actions button:hover { background: var(--drawer-accent-soft); color: var(--drawer-accent); }

.drawer-body::-webkit-scrollbar { width: 10px; }
.drawer-body::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.04); border-radius: 999px; }
.drawer-body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.28);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}
.drawer-body::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.42); background-clip: padding-box; }

.modal-content {
    background: #2d2d2d;
    border-radius: 8px;
    width: 90%;
    max-width: 600px;
    max-height: 80vh;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    z-index: 2147483647 !important;
    position: relative;
    pointer-events: auto !important;
}

.modal-header {
    background: #1a1a1a;
    padding: 16px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #404040;
}

.modal-header h2 {
    margin: 0;
    color: #ffffff;
    font-size: 18px;
}

.modal-close {
    background: transparent;
    border: none;
    color: #ffffff;
    font-size: 24px;
    cursor: pointer;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-close:hover {
    background: rgba(255,255,255,0.1);
    border-radius: 4px;
}

.modal-body {
    padding: 20px;
    max-height: 60vh;
    overflow-y: auto;
}

.history-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.history-list .history-item {
    padding: 12px;
    background: #3d3d3d;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.history-list .history-item:hover {
    background: rgba(73, 0, 194, 0.2);
}

.history-list .history-title {
    color: #ffffff;
    font-weight: 500;
    margin-bottom: 4px;
}

.history-list .history-url {
    color: #888888;
    font-size: 12px;
    margin-bottom: 4px;
}

.history-list .history-time {
    color: #666666;
    font-size: 11px;
}

.setting-item {
    margin-bottom: 16px;
}

.setting-item label {
    color: #ffffff;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.setting-item button {
    background: #4900c2;
    color: #ffffff;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
}

.setting-item button:hover {
    background: #5a0dd6;
}

.about-content {
    text-align: center;
    color: #ffffff;
    padding: 4px 0 0;
}

.about-modal.modal-content {
    max-width: 380px;
    width: min(92vw, 380px);
    background: #16161e;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
}

.about-modal .modal-header {
    background: #12121a;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.about-modal .modal-header h2 {
    font-size: 14px;
    font-weight: 600;
    font-variant: small-caps;
    letter-spacing: 0.06em;
}

.about-modal .modal-body {
    padding: 18px 16px 16px;
}

.about-modal .about-logo {
    width: 56px !important;
    max-width: 56px !important;
    height: 56px !important;
    margin: 0 auto 10px !important;
    object-fit: contain;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    display: block;
}

.about-modal .version-info h3,
.about-modal .about-version-line {
    font-size: 13px !important;
    font-weight: 600 !important;
    font-variant: small-caps;
    letter-spacing: 0.05em;
    margin: 0 0 4px 0 !important;
    color: #f4f4f5 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    width: 100% !important;
}

.about-modal #modal-version {
    font-size: 13px !important;
    font-weight: 600 !important;
    font-variant: small-caps;
    letter-spacing: 0.05em;
    color: #f4f4f5 !important;
}

.about-modal .private-indicator-animated,
.about-content .private-indicator-animated {
    display: none;
    align-items: center;
    justify-content: center;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    line-height: 1;
    padding: 0 5px;
    height: 12px;
    min-height: 12px;
    border: 1px solid rgba(139, 92, 246, 0.45);
    border-radius: 2px;
    background:
        linear-gradient(180deg, rgba(139, 92, 246, 0.12), rgba(91, 33, 182, 0.18)),
        linear-gradient(
            90deg,
            #8b5cf6 0%,
            #a78bfa 25%,
            #c4b5fd 50%,
            #a78bfa 75%,
            #8b5cf6 100%
        );
    background-size: auto, 200% auto;
    -webkit-background-clip: padding-box, text;
    background-clip: padding-box, text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    animation: private-gradient-flow 2.4s linear infinite;
    box-shadow:
        0 0 5px rgba(139, 92, 246, 0.28),
        inset 0 0 3px rgba(139, 92, 246, 0.1);
    vertical-align: middle;
}

.about-modal .private-indicator-animated:not([hidden]),
.about-content .private-indicator-animated:not([hidden]) {
    display: inline-flex !important;
}

@keyframes private-gradient-flow {
    0% { background-position: 0 0, 0% center; }
    100% { background-position: 0 0, 200% center; }
}

.about-modal .version-info p {
    color: #a1a1aa !important;
    font-size: 12px !important;
    margin: 0 0 6px 0 !important;
}

.about-modal .about-site {
    margin: 0 0 14px 0 !important;
}

.about-modal .about-site-link {
    color: #ddd6fe !important;
    text-decoration: none !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    -webkit-text-fill-color: #ddd6fe !important;
}

.about-modal .about-site-link:hover,
.about-modal .about-site-link:visited,
.about-modal .about-site-link:active {
    color: #f5f3ff !important;
    -webkit-text-fill-color: #f5f3ff !important;
    text-decoration: underline !important;
    background: transparent !important;
}

.about-modal .about-links {
    display: flex;
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
}

.about-modal .about-action-btn {
    -webkit-appearance: none !important;
    appearance: none !important;
    background: rgba(255, 255, 255, 0.06) !important;
    background-image: none !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    color: #f4f4f5 !important;
    -webkit-text-fill-color: #f4f4f5 !important;
    padding: 7px 12px !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    cursor: pointer !important;
    font-family: inherit !important;
    box-shadow: none !important;
    outline: none !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.about-modal .about-action-btn:hover {
    background: rgba(73, 0, 194, 0.28) !important;
    border-color: rgba(167, 139, 250, 0.55) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    transform: none !important;
}

.about-content .about-logo {
    max-width: 56px;
    width: 56px;
    height: auto;
    margin: 0 auto 10px;
    object-fit: contain;
    background: transparent;
    border: none;
    box-shadow: none;
    border-radius: 0;
    display: block;
}

.about-content .version-info h3 {
    font-size: 13px;
    font-weight: 600;
    font-variant: small-caps;
    letter-spacing: 0.05em;
    margin: 0 0 4px 0;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    width: 100%;
}

.about-content .version-info p {
    color: #a1a1aa;
    font-size: 12px;
    margin: 0 0 6px 0;
}

.about-content .about-site {
    margin-bottom: 14px;
}

.about-content .about-site-link {
    color: #ddd6fe;
    text-decoration: none;
    font-weight: 500;
}

.about-content .about-site-link:hover {
    color: #f5f3ff;
    text-decoration: underline;
}

.about-content .about-links {
    display: flex;
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
}

.about-content h3 {
    margin: 16px 0 8px 0;
    color: #ffffff;
}

.about-content p {
    margin: 8px 0;
    color: #cccccc;
}

.inline-video {
    margin-top: 10px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

/* Settings sidebar plugin icon theming */
.nav-item img[src*="plugin.svg"] {
    width: 16px !important;
    height: 16px !important;
    vertical-align: middle;
}

[data-theme="dark"] .nav-item img[src*="plugin.svg"],
[data-theme="stealth"] .nav-item img[src*="plugin.svg"] {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%) !important;
}

[data-theme="light"] .nav-item img[src*="plugin.svg"] {
    filter: brightness(0) saturate(100%) invert(13%) sepia(8%) saturate(7460%) hue-rotate(217deg) brightness(95%) contrast(100%) !important;
}

/* Security bar toggle button hidden state */
#security-toggle-btn.bar-hidden {
    opacity: 0.55 !important;
}

#security-toggle-btn.bar-hidden:hover {
    opacity: 0.85 !important;
}

/* =============================================================================
   Floating toolbar widget
   Expanded: no solid chrome bars. Tabs / URL / buttons / stats float as glass.
   Collapsed: compact movable restore widget.
   ============================================================================= */

.chrome-widget-collapse-btn[hidden] {
    display: none !important;
}

body.floating-toolbar-widget .chrome-widget-collapse-btn:not([hidden]) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

.chrome-float-widget {
    position: fixed;
    left: 20px;
    bottom: 20px;
    z-index: 2147483647 !important;
    display: none;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    min-width: 48px;
    max-width: 48px;
    max-height: 48px;
    padding: 0;
    margin: 0;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 50%;
    outline: none;
    background: #010103;
    background-color: #010103;
    color: #f2f4f8;
    box-shadow:
        0 10px 28px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.18);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
    pointer-events: auto;
    overflow: hidden;
    transform: translateZ(0) scale(0.86);
    opacity: 0;
    transition:
        opacity 220ms ease,
        transform 280ms cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 180ms ease,
        background-color 180ms ease;
}

.chrome-float-widget.show {
    display: inline-flex !important;
}

.chrome-float-widget.visible {
    opacity: 1;
    transform: translateZ(0) scale(1);
}

.chrome-float-widget:hover {
    background: rgba(26, 30, 40, 0.7);
    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.52),
        inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.chrome-float-widget:active,
.chrome-float-widget.dragging {
    cursor: grabbing;
    transform: translateZ(0) scale(0.98);
}

.chrome-float-widget-logo {
    width: 26px;
    height: 26px;
    flex: 0 0 auto;
    pointer-events: none;
}

[data-theme="light"] .chrome-float-widget {
    background: rgba(245, 247, 252, 0.62);
    color: #1a1d26;
    border-color: rgba(20, 24, 36, 0.14);
}

/* Expanded floating mode: kill solid bar bands completely */
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) #bookmarks-bar,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .browser-container .top-bar,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .browser-container .status-bar,
html[data-theme="dark"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html[data-theme="dark"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html[data-theme="dark"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar,
html[data-theme="dark"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) #bookmarks-bar,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) #bookmarks-bar,
html[data-theme="stealth"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html[data-theme="stealth"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html[data-theme="stealth"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar,
html[data-theme="stealth"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) #bookmarks-bar,
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar,
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) #bookmarks-bar,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) #bookmarks-bar,
html.theme-dark body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html.theme-dark body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html.theme-dark body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar,
html.theme-light body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html.theme-light body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html.theme-light body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar,
html.theme-stealth body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html.theme-stealth body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html.theme-stealth body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar,
html.theme-stealth-glass body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html.theme-stealth-glass body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html.theme-stealth-glass body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    overflow: visible !important;
    -webkit-app-region: no-drag !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-titlebar,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .top-bar,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-bar,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) #bookmarks-bar {
    gap: 8px !important;
    pointer-events: none !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .tabs-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .nav-controls,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .browser-menu,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .extension-toolbar,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .volume-control-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .instant-answer-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .security-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .clipboard-history-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .link-scan-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .downloads-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .password-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .history-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .settings-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .screenshot-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .pip-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .playlist-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .audio-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .notes-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .rss-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .vpn-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .tor-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .offline-page-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .file-converter-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .meme-maker-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .night-light-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .hide-it-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .no-dubs-netflix-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .wayback-look-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .reading-mode-toggle-container,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-title-section,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .bookmarks-bar-scroll,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .bookmarks-bar-items,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .bookmarks-bar-groups {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    pointer-events: none !important;
    gap: 8px !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .tab-strip-drag-region {
    background: transparent !important;
    pointer-events: auto !important;
    opacity: 1 !important;
}

/* Individual floating glass chips */
/* Stealth Float chip fills live in glass.css (#010103 acrylic key). */

html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .tab:hover {
    background: rgba(255, 255, 255, 0.16) !important;
    background-color: rgba(255, 255, 255, 0.16) !important;
    background-image: none !important;
    border-color: rgba(167, 139, 250, 0.55) !important;
    transform: none !important;
}

html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .new-tab-btn:hover,
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .nav-btn:hover,
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .toolbar-icon-btn:hover:not(.is-disabled):not([aria-disabled="true"]),
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .instant-answer-button:hover,
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-item:hover,
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .bookmark-bar-chip:hover,
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-control-btn:hover,
html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) #chrome-widget-collapse-btn:hover {
    background: rgba(18, 18, 22, 0.78) !important;
    background-color: rgba(18, 18, 22, 0.78) !important;
    border-color: rgba(167, 139, 250, 0.55) !important;
}

html[data-theme="stealth-float"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .tab.active {
    background: rgba(26, 22, 44, 0.72) !important;
    background-color: rgba(26, 22, 44, 0.72) !important;
    border-color: rgba(167, 139, 250, 0.85) !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-item {
    border-radius: 10px !important;
    margin: 0 !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .volume-button-knob {
    border-radius: 50% !important;
    overflow: hidden;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-window-controls {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    pointer-events: none !important;
    gap: 6px !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-window-controls .glass-control-btn {
    pointer-events: auto !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .stealth-logo {
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    pointer-events: none !important;
}

html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .tab,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .new-tab-btn,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .tab-strip-scroll-btn,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-title-logo,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .nav-btn,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .address-bar-container,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .toolbar-icon-btn,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .instant-answer-button,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .volume-button-knob,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-item,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .bookmark-bar-chip,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .bookmarks-bar-pin,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-control-btn,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .extension-toolbar > *,
html[data-theme="light"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) #chrome-widget-collapse-btn,
html.theme-light body.floating-toolbar-widget:not(.chrome-widget-collapsed) .tab,
html.theme-light body.floating-toolbar-widget:not(.chrome-widget-collapsed) .nav-btn,
html.theme-light body.floating-toolbar-widget:not(.chrome-widget-collapsed) .address-bar-container,
html.theme-light body.floating-toolbar-widget:not(.chrome-widget-collapsed) .toolbar-icon-btn,
html.theme-light body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-item,
html.theme-light body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-control-btn {
    background: rgba(255, 255, 255, 0.48) !important;
    background-color: rgba(255, 255, 255, 0.48) !important;
    border-color: rgba(20, 24, 36, 0.14) !important;
    color: #1a1d26 !important;
    box-shadow:
        0 8px 22px rgba(15, 20, 35, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.65) !important;
}

html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .tab,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .new-tab-btn,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .nav-btn,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .address-bar-container,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .toolbar-icon-btn,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .instant-answer-button,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-item,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .bookmark-bar-chip,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .bookmarks-bar-pin,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .glass-control-btn,
html[data-theme="stealth-glass"] body.floating-toolbar-widget:not(.chrome-widget-collapsed) .extension-toolbar > *,
html.theme-stealth-glass body.floating-toolbar-widget:not(.chrome-widget-collapsed) .tab,
html.theme-stealth-glass body.floating-toolbar-widget:not(.chrome-widget-collapsed) .nav-btn,
html.theme-stealth-glass body.floating-toolbar-widget:not(.chrome-widget-collapsed) .address-bar-container,
html.theme-stealth-glass body.floating-toolbar-widget:not(.chrome-widget-collapsed) .toolbar-icon-btn,
html.theme-stealth-glass body.floating-toolbar-widget:not(.chrome-widget-collapsed) .status-item {
    background: rgba(255, 255, 255, 0.1) !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    backdrop-filter: blur(24px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .browser-container.bottom-layout .web-content:not(.showing-welcome),
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .web-content:not(.showing-welcome) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: auto !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) #bookmarks-bar:not([hidden]):not(.appearance-hidden) {
    display: flex !important;
    visibility: visible !important;
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    pointer-events: none !important;
    z-index: 100002 !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .browser-container:not(.bottom-layout) ~ #bookmarks-bar,
html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .browser-container:not(.bottom-layout) #bookmarks-bar {
    top: 78px !important;
    bottom: auto !important;
}

html body.floating-toolbar-widget:not(.chrome-widget-collapsed) .browser-container.bottom-layout #bookmarks-bar {
    top: auto !important;
    bottom: 102px !important;
}

body.chrome-widget-collapsing .tab,
body.chrome-widget-collapsing .new-tab-btn,
body.chrome-widget-collapsing .nav-btn,
body.chrome-widget-collapsing .address-bar-container,
body.chrome-widget-collapsing .toolbar-icon-btn,
body.chrome-widget-collapsing .instant-answer-button,
body.chrome-widget-collapsing .status-item,
body.chrome-widget-collapsing .volume-button-knob,
body.chrome-widget-collapsing .bookmark-bar-chip,
body.chrome-widget-collapsing .glass-control-btn {
    transition:
        opacity 220ms ease,
        transform 260ms cubic-bezier(0.4, 0, 0.2, 1) !important;
    opacity: 0 !important;
    transform: scale(0.86) translateY(10px) !important;
    pointer-events: none !important;
}

body.chrome-widget-expanding .tab,
body.chrome-widget-expanding .new-tab-btn,
body.chrome-widget-expanding .nav-btn,
body.chrome-widget-expanding .address-bar-container,
body.chrome-widget-expanding .toolbar-icon-btn,
body.chrome-widget-expanding .instant-answer-button,
body.chrome-widget-expanding .status-item,
body.chrome-widget-expanding .volume-button-knob,
body.chrome-widget-expanding .bookmark-bar-chip,
body.chrome-widget-expanding .glass-control-btn {
    animation: chrome-float-piece-in 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.chrome-widget-expanding .tab:nth-child(2),
body.chrome-widget-expanding .status-item:nth-child(2),
body.chrome-widget-expanding .nav-btn:nth-child(2) { animation-delay: 30ms; }
body.chrome-widget-expanding .tab:nth-child(3),
body.chrome-widget-expanding .status-item:nth-child(3),
body.chrome-widget-expanding .nav-btn:nth-child(3) { animation-delay: 55ms; }
body.chrome-widget-expanding .tab:nth-child(4),
body.chrome-widget-expanding .status-item:nth-child(4) { animation-delay: 80ms; }
body.chrome-widget-expanding .address-bar-container { animation-delay: 70ms; }

@keyframes chrome-float-piece-in {
    from {
        opacity: 0;
        transform: scale(0.88) translateY(12px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

body.chrome-widget-collapsed .glass-titlebar {
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    overflow: visible !important;
    pointer-events: none !important;
    opacity: 1 !important;
    transform: none !important;
}

body.chrome-widget-collapsed .glass-titlebar > :not(.glass-window-controls) {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

body.chrome-widget-collapsed .glass-titlebar .glass-window-controls,
html.chrome-widget-collapsed .glass-titlebar .glass-window-controls {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    bottom: auto !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 2147483646 !important;
    -webkit-app-region: no-drag !important;
}

body.chrome-widget-collapsed .top-bar,
body.chrome-widget-collapsed .status-bar,
body.chrome-widget-collapsed #bookmarks-bar,
body.chrome-widget-collapsed .browser-container .top-bar,
body.chrome-widget-collapsed .browser-container .status-bar {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    opacity: 0 !important;
}

body.chrome-widget-collapsed.vertical-tabs .glass-titlebar > .tabs-container,
html.chrome-widget-collapsed.vertical-tabs .glass-titlebar > .tabs-container,
body.chrome-widget-collapsed.vertical-tabs .tabs-container {
    display: none !important;
    width: 0 !important;
    max-width: 0 !important;
    pointer-events: none !important;
}

body.chrome-widget-collapsed .browser-container.bottom-layout .web-content,
body.chrome-widget-collapsed .web-content {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: auto !important;
}

/* Full Power: hot racing glow, particles, and subtle chrome quake */
.full-power-window-celebrate {
    position: fixed;
    inset: 0;
    z-index: 2147483010;
    pointer-events: none !important;
    display: none;
    overflow: visible;
    --pu-color: #8b5cf6;
    --pu-color-hot: #ffffff;
    --pu-color-soft: rgba(139, 92, 246, 0.42);
    --pu-color-border: rgba(196, 181, 253, 0.75);
}

.full-power-window-celebrate.show {
    display: block;
}

.full-power-window-celebrate[hidden] {
    display: none !important;
}

.full-power-particle-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none !important;
    z-index: 6;
}

.full-power-celebrate-edge {
    position: absolute;
    pointer-events: none !important;
    opacity: 0;
}

.full-power-window-celebrate.show .full-power-celebrate-edge.top {
    top: 0;
    left: 0;
    right: 0;
    height: 52px;
}

.full-power-window-celebrate.show .full-power-celebrate-edge.bottom {
    bottom: 0;
    left: 0;
    right: 0;
    height: 52px;
}

.full-power-window-celebrate.show .full-power-celebrate-edge.left {
    top: 0;
    left: 0;
    bottom: 0;
    width: 52px;
}

.full-power-window-celebrate.show .full-power-celebrate-edge.right {
    top: 0;
    right: 0;
    bottom: 0;
    width: 52px;
}

.full-power-celebrate-frame {
    position: absolute;
    inset: 8px;
    pointer-events: none !important;
    overflow: visible;
    border-radius: var(--stealth-cut-panel, 22px 4px 4px 4px);
    border: 1px solid transparent;
}

.full-power-celebrate-frame.powerup-celebrate {
    z-index: 4;
    border-color: var(--pu-color-hot);
    box-shadow:
        0 0 0 1px #ffffff,
        0 0 10px rgba(255, 255, 255, 0.65),
        0 0 28px rgba(192, 132, 252, 0.85),
        0 0 60px rgba(90, 13, 214, 0.7),
        0 0 110px rgba(90, 13, 214, 0.35);
    animation: fullPowerFramePulse 1.1s ease-in-out 2;
}

.full-power-celebrate-frame .full-power-hotspot-ring {
    position: absolute;
    inset: -6px;
    border-radius: inherit;
    pointer-events: none;
    z-index: 3;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.35),
        inset 0 0 24px rgba(192, 132, 252, 0.35);
    opacity: 0;
    animation: fullPowerHotspot 1.2s ease-out 0.05s 2 both;
}

.full-power-celebrate-frame .powerup-sketch-lines {
    position: absolute;
    inset: -2px;
    pointer-events: none;
    z-index: 5;
    overflow: visible;
}

.full-power-celebrate-frame .powerup-sketch-lines > div {
    position: absolute;
    inset: 0;
    overflow: visible;
}

.full-power-celebrate-frame .powerup-sketch-lines > div:last-child {
    transform: rotate(180deg);
}

.full-power-celebrate-frame .powerup-sketch-lines svg {
    display: block;
    position: absolute;
    inset: 0;
    overflow: visible;
    fill: none;
    stroke-width: 2.8;
    stroke: var(--pu-color);
    stroke-linecap: round;
    stroke-linejoin: round;
    width: 100%;
    height: 100%;
    stroke-dasharray: 1.15 9.6;
    stroke-dashoffset: var(--fp-dash-offset, 14);
    opacity: 0;
}

.full-power-celebrate-frame.powerup-celebrate .powerup-sketch-lines.fp-pass-a svg {
    animation: fullPowerSketchStroke 1.15s linear 0s 2 forwards;
}

.full-power-celebrate-frame.powerup-celebrate .powerup-sketch-lines.fp-pass-b svg {
    animation: fullPowerSketchStroke 1.05s linear 0.18s 2 forwards;
}

.full-power-celebrate-frame.powerup-celebrate .powerup-sketch-lines.fp-pass-c svg {
    animation: fullPowerSketchStroke 0.95s linear 0.34s 2 forwards;
}

.full-power-celebrate-frame .powerup-sketch-lines svg:nth-child(1) {
    stroke: #ffffff;
    stroke-opacity: 1;
    stroke-width: 3.4px;
}

.full-power-celebrate-frame .powerup-sketch-lines svg:nth-child(2) {
    stroke-width: 10px;
    filter: blur(14px);
    stroke: #f5d0fe;
}

.full-power-celebrate-frame .powerup-sketch-lines svg:nth-child(3) {
    stroke-width: 6px;
    filter: blur(5px);
    stroke: #c084fc;
}

.full-power-celebrate-frame .powerup-sketch-lines svg:nth-child(4) {
    stroke-width: 18px;
    filter: blur(34px);
    stroke: #7c3aed;
}

.full-power-celebrate-frame .powerup-fill-burst {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
    border-radius: inherit;
    background:
        radial-gradient(ellipse at 20% 20%, rgba(255, 255, 255, 0.22), transparent 42%),
        radial-gradient(ellipse at 80% 75%, rgba(192, 132, 252, 0.35), transparent 50%),
        var(--pu-color-soft);
    box-shadow: inset 0 0 0 1px var(--pu-color-border);
    opacity: 0;
    transform: scale(0.92);
}

.full-power-celebrate-frame.powerup-celebrate .powerup-fill-burst {
    animation: fullPowerFillBurst 1.15s cubic-bezier(0.2, 0.85, 0.25, 1) 0.08s both;
}

@keyframes fullPowerSketchStroke {
    0% {
        opacity: 0;
        stroke-dashoffset: var(--fp-dash-offset, 14);
    }
    12%,
    70% {
        opacity: 1;
    }
    100% {
        stroke-dashoffset: 2;
        opacity: 0;
    }
}

@keyframes fullPowerFillBurst {
    0% {
        opacity: 0;
        transform: scale(0.92);
    }
    35% {
        opacity: 0.85;
        transform: scale(1);
    }
    100% {
        opacity: 0.12;
        transform: scale(1);
    }
}

@keyframes fullPowerFramePulse {
    0%,
    100% {
        filter: brightness(1);
    }
    45% {
        filter: brightness(1.35);
    }
}

@keyframes fullPowerHotspot {
    0% {
        opacity: 0;
        transform: scale(0.985);
    }
    40% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: scale(1.01);
    }
}

html.full-power-quake-active .full-power-quake-a {
    animation: fullPowerQuakeA 0.42s ease-in-out var(--fp-quake-delay, 0s) 3;
}

html.full-power-quake-active .full-power-quake-b {
    animation: fullPowerQuakeB 0.5s ease-in-out var(--fp-quake-delay, 0s) 2;
}

html.full-power-quake-active .full-power-quake-c {
    animation: fullPowerQuakeC 0.36s ease-in-out var(--fp-quake-delay, 0s) 3;
}

@keyframes fullPowerQuakeA {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    20% { transform: translate(-1.5px, 1px) rotate(-0.25deg); }
    45% { transform: translate(1.8px, -1px) rotate(0.3deg); }
    70% { transform: translate(-1px, -1.2px) rotate(-0.15deg); }
}

@keyframes fullPowerQuakeB {
    0%, 100% { transform: translate(0, 0); }
    25% { transform: translate(1.2px, 1.4px); }
    55% { transform: translate(-1.6px, 0.6px); }
    80% { transform: translate(0.8px, -1.3px); }
}

@keyframes fullPowerQuakeC {
    0%, 100% { transform: translate(0, 0) scale(1); }
    30% { transform: translate(-1px, 1.5px) scale(1.015); }
    60% { transform: translate(1.4px, -0.8px) scale(0.99); }
}

@media (prefers-reduced-motion: reduce) {
    .full-power-celebrate-frame.powerup-celebrate .powerup-sketch-lines svg,
    .full-power-celebrate-frame.powerup-celebrate .powerup-fill-burst,
    .full-power-celebrate-frame.powerup-celebrate,
    .full-power-celebrate-frame .full-power-hotspot-ring,
    html.full-power-quake-active .full-power-quake-a,
    html.full-power-quake-active .full-power-quake-b,
    html.full-power-quake-active .full-power-quake-c {
        animation: none !important;
    }

    .full-power-celebrate-frame.powerup-celebrate .powerup-fill-burst {
        opacity: 0.2;
        transform: none;
    }

    .full-power-particle-canvas {
        display: none !important;
    }
}

/* Stealth toast (guidelines: frosted fill, cut corners, purple accent) */
.stealth-toast {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 2147483647;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    max-width: min(380px, calc(100vw - 32px));
    padding: 12px 14px;
    box-sizing: border-box;
    border-radius: var(--stealth-cut-lg, 14px 4px 4px 4px);
    overflow: hidden;
    clip-path: inset(0 round 14px 4px 4px 4px);
    -webkit-clip-path: inset(0 round 14px 4px 4px 4px);
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(22, 22, 30, var(--panel-fill-alpha, 0.55));
    box-shadow:
        0 16px 48px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.16);
    color: #f3f3f7;
    font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Open Sans', sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
    pointer-events: auto;
    opacity: 0;
    transform: translateX(18px);
    transition: opacity 0.22s ease, transform 0.22s ease;
}

.stealth-toast.show {
    opacity: 1;
    transform: translateX(0);
}

.stealth-toast.hiding {
    opacity: 0;
    transform: translateX(18px);
}

.stealth-toast-sheen {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.03) 42%, rgba(90, 13, 214, 0.12) 100%);
    opacity: 0.85;
}

.stealth-toast-icon,
.stealth-toast-message {
    position: relative;
    z-index: 1;
}

.stealth-toast-icon {
    flex-shrink: 0;
    margin-top: 1px;
    font-size: 14px;
    color: #a78bfa;
}

.stealth-toast-message {
    flex: 1;
    min-width: 0;
}

.stealth-toast-success {
    border-color: rgba(90, 13, 214, 0.55);
    box-shadow:
        0 16px 48px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 0 0 1px rgba(90, 13, 214, 0.18);
}

.stealth-toast-success .stealth-toast-icon { color: #c4b5fd; }

.stealth-toast-error {
    border-color: rgba(239, 68, 68, 0.55);
}

.stealth-toast-error .stealth-toast-icon { color: #f87171; }

.stealth-toast-warning {
    border-color: rgba(245, 158, 11, 0.55);
}

.stealth-toast-warning .stealth-toast-icon { color: #fbbf24; }

.stealth-toast-info .stealth-toast-icon { color: #a78bfa; }

[data-theme="light"] .stealth-toast {
    background: rgba(248, 246, 242, 0.82);
    border-color: rgba(73, 0, 194, 0.28);
    color: #1c1916;
    box-shadow:
        0 16px 40px rgba(28, 25, 22, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

[data-theme="light"] .stealth-toast-sheen {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.55) 0%, rgba(90, 13, 214, 0.08) 100%);
}

[data-theme="light"] .stealth-toast-success .stealth-toast-icon,
[data-theme="light"] .stealth-toast-info .stealth-toast-icon {
    color: #5a0dd6;
}

@media (prefers-reduced-motion: reduce) {
    .stealth-toast {
        transition: opacity 0.15s ease;
        transform: none;
    }
    .stealth-toast.show,
    .stealth-toast.hiding {
        transform: none;
    }
}

/* =============================================================================
   UI layout presets (right-click Layout control)
   ============================================================================= */

.chrome-tools-dock {
    --panel-fill-alpha: 0.62;
    display: none;
    position: fixed;
    left: 50%;
    /* Keep the pill above the window edge so labels never clip. */
    bottom: 20px;
    transform: translate3d(-50%, 0, 0);
    z-index: 1000010;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    max-width: min(920px, calc(100vw - 24px));
    padding: 6px 14px;
    border-radius: 18px;
    box-sizing: border-box;
    background: rgba(18, 18, 22, var(--panel-fill-alpha, 0.62));
    background-clip: padding-box;
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
        0 10px 28px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(18px) saturate(1.2);
    -webkit-backdrop-filter: blur(18px) saturate(1.2);
    pointer-events: auto;
    overflow: hidden !important;
    isolation: isolate;
    clip-path: inset(0 round 18px);
    -webkit-clip-path: inset(0 round 18px);
}

/* Frosted glass punch (guidelines.md / Stealth AI / Minimal URL bubble). */
#chrome-tools-dock.show,
#chrome-tools-dock.is-active.show,
#chrome-tools-dock.page-frost-host {
    overflow: hidden !important;
    border-radius: 18px !important;
    clip-path: inset(0 round 18px) !important;
    -webkit-clip-path: inset(0 round 18px) !important;
    background-clip: padding-box !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#chrome-tools-dock.page-frost-host .page-frost-layer,
#chrome-tools-dock.page-frost-host .page-frost-image,
#chrome-tools-dock.page-frost-host .page-frost-layer::after {
    border-radius: 18px !important;
    clip-path: inset(0 round 18px) !important;
    -webkit-clip-path: inset(0 round 18px) !important;
    overflow: hidden !important;
}

#chrome-tools-dock.page-frost-host > *:not(.page-frost-layer) {
    position: relative;
    z-index: 1;
}

html[data-theme="light"] .chrome-tools-dock,
body[data-theme="light"] .chrome-tools-dock {
    background: rgba(236, 231, 223, 0.55);
    border-color: rgba(60, 48, 32, 0.16);
    box-shadow:
        0 10px 28px rgba(28, 25, 22, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

html[data-theme="stealth"] .chrome-tools-dock,
body[data-theme="stealth"] .chrome-tools-dock {
    background: rgba(18, 12, 28, 0.45);
    border-color: rgba(160, 120, 255, 0.28);
}

html[data-theme="stealth-glass"] .chrome-tools-dock,
html[data-theme="stealth-float"] .chrome-tools-dock,
body[data-theme="stealth-glass"] .chrome-tools-dock,
body[data-theme="stealth-float"] .chrome-tools-dock {
    background: rgba(18, 18, 26, 0.28);
    border-color: rgba(255, 255, 255, 0.16);
}

.browser-container.chrome-layout-tools-dock .chrome-tools-dock,
html.chrome-layout-tools-dock-html .chrome-tools-dock,
body.chrome-layout-tools-dock-body .chrome-tools-dock {
    display: flex;
}

.chrome-tools-dock > [data-toolbar-item],
.chrome-tools-dock > .browser-menu,
.chrome-tools-dock > .toolbar-icon-group {
    flex: 0 0 auto;
}

.chrome-tools-dock .browser-menu-spacer {
    display: none;
}

/* Labels on/off for the floating tools dock (same glyph + label language as .top-bar).
   Icons sit near the top; label text lives in the bottom padding so it stays
   inside the frosted pill and never hangs under the window edge. */
html body.toolbar-labels .chrome-tools-dock.is-active,
html body.toolbar-labels.chrome-layout-tools-dock-body .chrome-tools-dock {
    bottom: 28px;
    min-height: 58px;
    padding: 8px 16px 18px 16px;
    gap: 14px;
    align-items: flex-start;
    overflow: hidden !important;
    max-width: min(1100px, calc(100vw - 16px));
}

html body:not(.toolbar-labels) .chrome-tools-dock.is-active,
html body:not(.toolbar-labels).chrome-layout-tools-dock-body .chrome-tools-dock {
    bottom: 20px;
    min-height: 44px;
    padding: 6px 14px;
    gap: 8px;
    align-items: center;
    /* Keep overflow:hidden so the pill clip-path / native punch stay round.
       A scrollport longhand here squared the frost edge under the CSS radius. */
    overflow: hidden !important;
}

/* Tools dock: STEALTH leads on the left; right chrome cluster stays tight.
   Wordmark shares the 25px icon-glyph row (not the full dock + label pad). */
.chrome-tools-dock > #stealth-logo-btn.tools-dock-stealth-lead,
.chrome-tools-dock > .tools-dock-stealth-lead {
    order: -1;
    flex: 0 0 auto;
    align-self: center;
    margin: 0 6px 0 0 !important;
    padding: 0 4px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    line-height: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    isolation: isolate;
    z-index: 2;
}

html body.toolbar-labels .chrome-tools-dock > #stealth-logo-btn.tools-dock-stealth-lead,
html body.toolbar-labels .chrome-tools-dock > .tools-dock-stealth-lead {
    align-self: flex-start;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
}

.chrome-tools-dock > #stealth-logo-btn.tools-dock-stealth-lead .stealth-logo,
.chrome-tools-dock > .tools-dock-stealth-lead .stealth-logo {
    width: 80px !important;
    max-width: 80px !important;
    height: 18px !important;
    max-height: 18px !important;
    object-fit: contain !important;
    object-position: center center !important;
    image-rendering: auto;
    -ms-interpolation-mode: bicubic;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    filter: none !important;
}

.chrome-tools-dock > #stealth-logo-btn.tools-dock-stealth-lead .stealth-block-notify,
.chrome-tools-dock > .tools-dock-stealth-lead .stealth-block-notify {
    top: 0;
    right: 0;
}

.chrome-tools-dock > .browser-menu {
    margin-left: 4px;
    flex: 0 0 auto;
}

.chrome-tools-dock .browser-menu-end {
    gap: 10px;
    align-items: center;
}

html body.toolbar-labels .chrome-tools-dock .browser-menu-end {
    align-items: flex-start;
}

html body.toolbar-labels .chrome-tools-dock [data-toolbar-label] {
    position: relative !important;
    overflow: visible !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
}

html body.toolbar-labels .chrome-tools-dock .toolbar-icon-btn[data-toolbar-label],
html body.toolbar-labels .chrome-tools-dock .instant-answer-button[data-toolbar-label] {
    width: 25px !important;
    min-width: 25px !important;
    max-width: 25px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

html body.toolbar-labels .chrome-tools-dock .nav-btn[data-toolbar-label],
html body.toolbar-labels .chrome-tools-dock .browser-menu .nav-btn[data-toolbar-label] {
    width: 29px !important;
    min-width: 29px !important;
    max-width: 29px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    padding: 0 4px !important;
}

html body.toolbar-labels .chrome-tools-dock #profile-avatar-btn[data-toolbar-label],
html body.toolbar-labels .chrome-tools-dock .profile-avatar-btn[data-toolbar-label] {
    width: 25px !important;
    min-width: 25px !important;
    max-width: 25px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    padding: 0 !important;
    position: relative !important;
    overflow: visible !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

html body.toolbar-labels .chrome-tools-dock .volume-button-knob[data-toolbar-label] {
    width: 25px !important;
    min-width: 25px !important;
    max-width: 25px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important;
}

body.toolbar-labels .chrome-tools-dock [data-toolbar-label]::after {
    content: attr(data-toolbar-label);
    position: absolute;
    left: 50%;
    right: auto;
    top: calc(100% + 3px);
    bottom: auto;
    transform: translateX(-50%);
    font-size: 8px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.02em;
    color: rgba(255, 255, 255, 0.48);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 40px;
    width: max-content;
    text-align: center;
    pointer-events: none;
    user-select: none;
    z-index: 2;
}

body.toolbar-labels .chrome-tools-dock .stealth-logo-btn::after,
body.toolbar-labels .chrome-tools-dock .stealth-logo::after {
    content: none !important;
    display: none !important;
}

html[data-theme="light"] body.toolbar-labels .chrome-tools-dock [data-toolbar-label]::after,
html.theme-light body.toolbar-labels .chrome-tools-dock [data-toolbar-label]::after {
    color: rgba(32, 33, 36, 0.5);
}

.browser-container.chrome-layout-tools-dock .top-bar {
    justify-content: flex-start;
    top: 32px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.browser-container.chrome-layout-tools-dock .top-bar .address-bar-container {
    flex: 1 1 auto;
}

/* Chrome-like tight stack: tabs hug the URL strip (no empty ghost band). */
html.chrome-layout-tools-dock-html .glass-titlebar,
body.chrome-layout-tools-dock-body .glass-titlebar {
    top: 0 !important;
    bottom: auto !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 0 8px !important;
    align-items: center !important;
}

html.chrome-layout-tools-dock-html .glass-window-controls,
body.chrome-layout-tools-dock-body .glass-window-controls {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    filter: none !important;
    transform: none !important;
    z-index: 30 !important;
    flex: 0 0 auto !important;
}

.browser-container.chrome-layout-tools-dock .status-bar {
    top: 68px !important;
    bottom: auto !important;
}

.browser-container.chrome-layout-tools-dock.security-bar-hidden .status-bar {
    display: none !important;
}

.browser-container.chrome-layout-tools-dock .web-content {
    top: 90px !important;
    bottom: 0 !important;
    height: auto !important;
    position: absolute !important;
}

.browser-container.chrome-layout-tools-dock.security-bar-hidden .web-content {
    top: 68px !important;
    bottom: 0 !important;
}

html body.toolbar-labels .browser-container.chrome-layout-tools-dock .top-bar {
    top: 32px !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 2px 6px 14px 6px !important;
}

html body.toolbar-labels .browser-container.chrome-layout-tools-dock .status-bar {
    top: 84px !important;
}

html body.toolbar-labels .browser-container.chrome-layout-tools-dock .web-content {
    top: 106px !important;
    bottom: 0 !important;
}

html body.toolbar-labels .browser-container.chrome-layout-tools-dock.security-bar-hidden .web-content {
    top: 84px !important;
    bottom: 0 !important;
}

/* Tabs on top, URL/Toolbar on bottom */
.browser-container.chrome-layout-tabs-top-url-bottom .top-bar {
    position: fixed !important;
    top: auto !important;
    bottom: var(--bottom-status-height, 22px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 1000001 !important;
}

.browser-container.chrome-layout-tabs-top-url-bottom.security-bar-hidden .top-bar {
    bottom: 0 !important;
}

.browser-container.chrome-layout-tabs-top-url-bottom .status-bar {
    position: fixed !important;
    top: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 999999 !important;
}

html.chrome-layout-tabs-top-url-bottom-html .glass-titlebar,
body.chrome-layout-tabs-top-url-bottom-body .glass-titlebar {
    top: 0 !important;
    bottom: auto !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 0 8px !important;
    align-items: center !important;
}

html.chrome-layout-tabs-top-url-bottom-html .glass-window-controls,
body.chrome-layout-tabs-top-url-bottom-body .glass-window-controls {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    filter: none !important;
    transform: none !important;
    z-index: 30 !important;
    flex: 0 0 auto !important;
}

.browser-container.chrome-layout-tabs-top-url-bottom .web-content {
    top: 32px !important;
    /* Prefer live measured reserve; fall back to toolbar(36)+status(22). */
    bottom: var(--bottom-chrome-reserve, 58px) !important;
    height: auto !important;
    position: absolute !important;
}

html body.toolbar-labels .browser-container.chrome-layout-tabs-top-url-bottom .top-bar {
    height: 52px !important;
    min-height: 52px !important;
    padding: 14px 6px 2px 6px !important;
}

html body.toolbar-labels.chrome-layout-tabs-top-url-bottom-body .top-bar [data-toolbar-label]::after,
html body.toolbar-labels .browser-container.chrome-layout-tabs-top-url-bottom .top-bar [data-toolbar-label]::after {
    top: auto !important;
    bottom: calc(100% + 3px) !important;
}

/* URL/Toolbar on top, Tabs on bottom */
.browser-container.chrome-layout-url-top-tabs-bottom .top-bar {
    position: fixed !important;
    top: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 1000001 !important;
    height: 36px !important;
    min-height: 36px !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
}

html body.toolbar-labels .browser-container.chrome-layout-url-top-tabs-bottom .top-bar {
    height: 52px !important;
    min-height: 52px !important;
    padding: 2px 6px 14px 6px !important;
}

.browser-container.chrome-layout-url-top-tabs-bottom .status-bar {
    position: fixed !important;
    top: 36px !important;
    bottom: auto !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 999999 !important;
}

html body.toolbar-labels .browser-container.chrome-layout-url-top-tabs-bottom .status-bar {
    top: 52px !important;
}

html.chrome-layout-url-top-tabs-bottom-html .glass-titlebar,
body.chrome-layout-url-top-tabs-bottom-body .glass-titlebar {
    top: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 0 8px !important;
    align-items: center !important;
}

/* Window controls stay on the tab strip (bottom) in this preset. */
html.chrome-layout-url-top-tabs-bottom-html .glass-window-controls,
body.chrome-layout-url-top-tabs-bottom-body .glass-window-controls,
.browser-container.chrome-layout-url-top-tabs-bottom .glass-window-controls {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    right: auto !important;
    left: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    filter: none !important;
    transform: none !important;
    z-index: 30 !important;
    flex: 0 0 auto !important;
}

.browser-container.chrome-layout-url-top-tabs-bottom .web-content {
    top: 58px !important;
    bottom: var(--bottom-chrome-reserve, 32px) !important;
    height: auto !important;
    position: absolute !important;
}

.browser-container.chrome-layout-url-top-tabs-bottom.security-bar-hidden .web-content {
    top: 36px !important;
}

html body.toolbar-labels .browser-container.chrome-layout-url-top-tabs-bottom .web-content {
    top: 74px !important;
}

html body.toolbar-labels .browser-container.chrome-layout-url-top-tabs-bottom.security-bar-hidden .web-content {
    top: 52px !important;
}

html.longer-tabs.chrome-layout-tools-dock-html .glass-titlebar,
body.longer-tabs.chrome-layout-tools-dock-body .glass-titlebar,
html.longer-tabs.chrome-layout-tabs-top-url-bottom-html .glass-titlebar,
body.longer-tabs.chrome-layout-tabs-top-url-bottom-body .glass-titlebar,
html.longer-tabs.chrome-layout-url-top-tabs-bottom-html .glass-titlebar,
body.longer-tabs.chrome-layout-url-top-tabs-bottom-body .glass-titlebar {
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
}

html.longer-tabs.chrome-layout-tools-dock-html .glass-window-controls,
body.longer-tabs.chrome-layout-tools-dock-body .glass-window-controls,
html.longer-tabs.chrome-layout-tabs-top-url-bottom-html .glass-window-controls,
body.longer-tabs.chrome-layout-tabs-top-url-bottom-body .glass-window-controls,
html.longer-tabs.chrome-layout-url-top-tabs-bottom-html .glass-window-controls,
body.longer-tabs.chrome-layout-url-top-tabs-bottom-body .glass-window-controls,
html.longer-tabs .browser-container.chrome-layout-url-top-tabs-bottom .glass-window-controls {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    right: auto !important;
    left: auto !important;
}

html.longer-tabs .browser-container.chrome-layout-tools-dock .top-bar {
    top: 40px !important;
}

html.longer-tabs .browser-container.chrome-layout-tools-dock .status-bar {
    top: 76px !important;
}

html.longer-tabs .browser-container.chrome-layout-tools-dock .web-content {
    top: 98px !important;
}

html.longer-tabs .browser-container.chrome-layout-tools-dock.security-bar-hidden .web-content {
    top: 76px !important;
}

html.longer-tabs body.toolbar-labels .browser-container.chrome-layout-tools-dock .top-bar {
    top: 40px !important;
}

html.longer-tabs body.toolbar-labels .browser-container.chrome-layout-tools-dock .status-bar {
    top: 92px !important;
}

html.longer-tabs body.toolbar-labels .browser-container.chrome-layout-tools-dock .web-content {
    top: 114px !important;
}

html.longer-tabs body.toolbar-labels .browser-container.chrome-layout-tools-dock.security-bar-hidden .web-content {
    top: 92px !important;
}

html.longer-tabs .browser-container.chrome-layout-tabs-top-url-bottom .web-content {
    top: 40px !important;
}

html.longer-tabs .browser-container.chrome-layout-url-top-tabs-bottom .web-content {
    bottom: var(--bottom-chrome-reserve, 40px) !important;
}

.layout-preset-menu .tab-menu-label {
    padding-top: 8px;
}

.pip-opacity-menu {
    min-width: 220px;
    max-width: 280px;
    padding-bottom: 6px;
}

.pip-opacity-menu .pip-opacity-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 12px 4px;
}

.pip-opacity-menu #pip-opacity-slider {
    flex: 1;
    min-width: 0;
    margin: 0;
    accent-color: var(--accent, #5b8def);
}

.pip-opacity-menu #pip-opacity-value {
    flex: 0 0 auto;
    min-width: 40px;
    text-align: right;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
    opacity: 0.85;
}

.pip-opacity-menu .pip-opacity-hint {
    padding: 2px 12px 8px;
    font-size: 11px;
    line-height: 1.35;
    opacity: 0.65;
}

/* Match connected bottom chrome surfaces for split presets. */
html[data-theme="light"] .browser-container.chrome-layout-tabs-top-url-bottom .top-bar,
html[data-theme="light"] .browser-container.chrome-layout-tabs-top-url-bottom .status-bar,
html[data-theme="light"] .browser-container.chrome-layout-url-top-tabs-bottom .top-bar,
html[data-theme="light"] .browser-container.chrome-layout-url-top-tabs-bottom .status-bar,
html[data-theme="light"].chrome-layout-url-top-tabs-bottom-html .glass-titlebar {
    background: #d4cec4 !important;
    background-color: #d4cec4 !important;
}

html[data-theme="dark"] .browser-container.chrome-layout-tabs-top-url-bottom .top-bar,
html[data-theme="dark"] .browser-container.chrome-layout-tabs-top-url-bottom .status-bar,
html[data-theme="dark"] .browser-container.chrome-layout-url-top-tabs-bottom .top-bar,
html[data-theme="dark"] .browser-container.chrome-layout-url-top-tabs-bottom .status-bar,
html[data-theme="dark"].chrome-layout-url-top-tabs-bottom-html .glass-titlebar {
    background: #111111 !important;
    background-color: #111111 !important;
}

html[data-theme="stealth"] .browser-container.chrome-layout-tabs-top-url-bottom .top-bar,
html[data-theme="stealth"] .browser-container.chrome-layout-tabs-top-url-bottom .status-bar,
html[data-theme="stealth"] .browser-container.chrome-layout-url-top-tabs-bottom .top-bar,
html[data-theme="stealth"] .browser-container.chrome-layout-url-top-tabs-bottom .status-bar,
html[data-theme="stealth"].chrome-layout-url-top-tabs-bottom-html .glass-titlebar {
    background: #0e0a16 !important;
    background-color: #0e0a16 !important;
}

@media (max-width: 1200px) {
    html body .browser-container .top-bar {
        --toolbar-gap: 5px;
        gap: 5px !important;
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    html body.toolbar-labels .top-bar .toolbar-actions,
    html body.toolbar-labels .top-bar .nav-controls,
    html body.toolbar-labels .top-bar .browser-menu,
    html body.toolbar-labels .top-bar .browser-menu-end,
    html body .top-bar .toolbar-actions,
    html body .top-bar .nav-controls,
    html body .top-bar .browser-menu,
    html body .top-bar .browser-menu-end {
        gap: 4px !important;
    }

    html body.toolbar-labels .top-bar .extension-toolbar,
    html body .top-bar .extension-toolbar {
        gap: 2px !important;
        padding-left: 1px !important;
        padding-right: 1px !important;
    }

    html body .top-bar .address-bar-container {
        min-width: 96px !important;
    }
}

/* Welcome Page dashboard */
.welcome-screen.home-dashboard-mode {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    padding: 0;
    box-sizing: border-box;
    overflow: hidden;
}

.welcome-screen.home-dashboard-mode > #home-vanta-bg {
    position: absolute !important;
    inset: 0;
    height: auto !important;
    z-index: 0;
}

/* In dashboard mode the hero shell collapses; its pieces live inside tiles. */
.welcome-screen.home-dashboard-mode > .home-hero {
    position: static;
    display: contents;
}

.home-dashboard {
    position: relative;
    z-index: 3;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
    /* Tiles are sized after the first paint. Scroll anchoring reacts to that by
       nudging the board down, which clipped the top row on open. */
    overflow-anchor: none;
}

.home-dashboard::-webkit-scrollbar {
    width: 8px;
}

.home-dashboard::-webkit-scrollbar-track {
    background: transparent;
}

.home-dashboard::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.22);
    border-radius: 8px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.home-dashboard::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.35);
    background-clip: padding-box;
}

.home-dashboard::-webkit-scrollbar-corner {
    background: transparent;
}

.home-dashboard::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

.home-dash-board {
    position: relative;
    width: 100%;
    min-height: 100%;
    overflow-anchor: none;
}

/* Content only. No hover frame, no chrome box. Raise z-index on hover so the
   resize edges under a neighboring tile can still be grabbed. */
.home-dash-widget {
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: none;
    outline: none;
    z-index: 2;
    touch-action: none;
    cursor: default;
    transition: none;
}

.home-dash-widget:hover {
    z-index: 40;
}

.home-dash-widget.is-interacting {
    border-color: rgba(167, 139, 250, 0.45);
    transition: none;
    cursor: grabbing;
    z-index: 999;
}

/* Native embeds own their HWND, so the tile itself stays chrome-free at rest.
   A thin drag strip remains so the tile can still be moved without a visible
   frame around the page. */
.home-dash-widget.is-embed {
    background: rgba(12, 10, 18, 0.35);
    border-color: rgba(167, 139, 250, 0.22);
    overflow: hidden;
    z-index: 28;
}

.home-dash-widget.is-embed:hover,
.home-dash-widget.is-embed.is-interacting {
    z-index: 60;
}

.home-dash-embed-surface {
    width: 100%;
    height: 100%;
    min-height: 48px;
    flex: 1 1 auto;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.25);
}

.home-dash-widget.is-embed > .home-dash-widget-head {
    position: relative;
    opacity: 0;
    pointer-events: none;
    flex: 0 0 auto;
    min-height: 14px;
    background: transparent;
    border-radius: 0;
}

.home-dash-widget.is-embed.is-head-hot > .home-dash-widget-head,
.home-dash-widget.is-embed.is-interacting > .home-dash-widget-head {
    opacity: 0.7;
    pointer-events: auto;
    background: rgba(12, 10, 18, 0.55);
}

/* Drag strip stays invisible until the pointer is on the top edge. */
.home-dash-widget-head {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 2px 6px;
    min-height: 14px;
    background: transparent;
    border-radius: 6px 6px 0 0;
    cursor: grab;
    user-select: none;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.1s ease, background 0.1s ease;
    z-index: 8;
}

.home-dash-widget.is-head-hot > .home-dash-widget-head,
.home-dash-widget.is-interacting > .home-dash-widget-head {
    opacity: 0.9;
    pointer-events: auto;
    background: rgba(12, 10, 18, 0.55);
}

.home-dash-widget.is-head-timed-out:not(.is-interacting) > .home-dash-widget-head {
    opacity: 0 !important;
    pointer-events: none !important;
    background: transparent !important;
}

.home-dash-widget-head h3 {
    display: none;
}


.home-dash-widget-head:active {
    cursor: grabbing;
}

.home-dash-drag-grip {
    color: rgba(255, 255, 255, 0.45);
    font-size: 9px;
}

.home-dash-widget-body {
    padding: 2px;
    flex: 1;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    overflow: hidden;
    border-radius: 6px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}

.home-dash-widget-body::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.home-dash-widget-body::-webkit-scrollbar-track {
    background: transparent;
}

.home-dash-widget-body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.22);
    border-radius: 8px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.home-dash-widget-body::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.35);
    background-clip: padding-box;
}

.home-dash-widget-body::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

/* Inset the embed so the right/bottom resize edges are never underneath the
   native window and stay grabbable. */
.home-dash-widget.is-embed .home-dash-widget-body {
    padding: 0;
    gap: 0;
    overflow: hidden;
    min-height: 0;
}

.home-dash-context {
    position: fixed;
    z-index: 2147483647 !important;
    min-width: 160px;
    max-height: calc(100vh - 16px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 4px;
    border-radius: 8px;
    background: rgba(18, 14, 28, 0.96);
    border: 1px solid rgba(167, 139, 250, 0.35);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.home-dash-context-item {
    flex: 0 0 auto;
}

.home-dash-context-item {
    border: none;
    background: transparent;
    color: rgba(255, 255, 255, 0.9);
    text-align: left;
    padding: 4px 9px;
    border-radius: 5px;
    font: inherit;
    font-size: 11px !important;
    height: 24px;
    cursor: pointer;
}

.home-dash-context-item:hover {
    background: rgba(90, 13, 214, 0.35);
}

.home-dash-context-item.is-danger {
    color: #fca5a5;
}

.home-dash-widget.is-hero .home-dash-widget-body {
    padding: 0;
    gap: 0;
    overflow: visible;
    align-items: center;
    justify-content: center;
}

.home-dash-hero-slot {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    overflow: visible;
    min-height: 0;
    min-width: 0;
}

/* Hero content is sized to the tile instead of the full page, so nothing
   spills outside its box. */
.home-dash-hero-slot > * {
    max-width: 100%;
    min-width: 0;
}

.home-dash-hero-slot .home-logo,
.home-dash-hero-slot .home-search {
    width: 100%;
    max-width: 100%;
    margin: 0;
}

.home-dash-widget[data-widget-type="hero-filters"] > .home-dash-widget-body {
    overflow: auto;
    padding: 2px 4px 4px;
    min-height: 0;
}

/* Search tile must not paint a square fill behind the rounded search bar. */
.home-dash-widget[data-widget-type="hero-search"] {
    background: transparent !important;
    border-color: transparent !important;
    border-radius: 999px;
    box-shadow: none !important;
    overflow: visible;
}

.home-dash-widget[data-widget-type="hero-search"].is-interacting,
.home-dash-widget[data-widget-type="hero-search"]:hover {
    border-color: transparent !important;
    box-shadow: none !important;
    background: transparent !important;
}

.home-dash-widget[data-widget-type="hero-search"] > .home-dash-widget-body {
    overflow: visible;
    padding: 0;
    min-height: 0;
    background: transparent !important;
    border-radius: 999px;
    box-shadow: none !important;
}

.home-dash-hero-slot[data-hero-slot="hero-search"] {
    height: 100%;
    min-height: 0;
    overflow: visible;
    justify-content: center;
    border-radius: 999px;
    background: transparent !important;
}

.home-dash-hero-slot[data-hero-slot="hero-search"] .home-search {
    height: 100%;
    max-height: 100%;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    border-radius: 999px !important;
    overflow: hidden !important;
    isolation: isolate;
    background-clip: padding-box !important;
    clip-path: inset(0 round 999px);
}

.home-dash-widget[data-widget-type="hero-search"][data-fit-h="xs"] .home-search-mode,
.home-dash-widget[data-widget-type="hero-search"][data-fit-h="sm"] .home-search-mode {
    margin: 2px 0 2px 4px;
    padding: 0;
}

.home-dash-widget[data-widget-type="hero-search"][data-fit-h="xs"] .home-search-mode-btn,
.home-dash-widget[data-widget-type="hero-search"][data-fit-h="sm"] .home-search-mode-btn {
    padding: 2px 8px;
    font-size: 11px;
    min-height: 0;
    height: 28px;
}

.home-dash-widget[data-widget-type="hero-search"][data-fit-h="xs"] .home-search input,
.home-dash-widget[data-widget-type="hero-search"][data-fit-h="sm"] .home-search input {
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 13px;
}

.home-dash-widget[data-widget-type="hero-filters"][data-fit-h="xs"] .search-filter-tabs .filter-tab,
.home-dash-widget[data-widget-type="hero-filters"][data-fit-h="sm"] .search-filter-tabs .filter-tab {
    padding: 4px 8px;
    font-size: 12px;
}

.home-dash-widget[data-widget-type="hero-search"] > .home-dash-edge,
.home-dash-widget[data-widget-type="hero-filters"] > .home-dash-edge {
    z-index: 40;
}

.home-dash-hero-slot .home-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    padding: 0;
}

/* Logo, tagline and weather each own a tile, so each fills the space it has. */
.home-dash-hero-slot[data-hero-slot="hero-logo"] {
    gap: 4px;
    padding: 6px;
}

.home-dash-hero-slot .home-main-logo {
    max-height: min(96px, 58%);
    max-width: 82%;
    width: auto;
    height: auto;
    min-height: 36px;
    object-fit: contain;
    margin: 0;
    flex: 0 1 auto;
}

.home-dash-hero-slot .home-wordmark {
    max-height: min(40px, 28%);
    max-width: 92%;
    width: auto;
    height: auto;
    min-height: 14px;
    object-fit: contain;
    margin: 0;
    flex: 0 1 auto;
}

.home-dash-hero-slot .home-tagline {
    font-size: clamp(12px, 1.5vw, 16px);
    margin: 0;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.home-dash-hero-slot .weather-strip {
    margin: 0;
    flex: 1 1 auto;
    width: 100%;
    max-width: 100%;
    min-height: 28px;
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 4px;
    box-sizing: border-box;
}

.home-dash-hero-slot .weather-strip.is-split {
    display: none !important;
}

.home-dash-widget[data-widget-type^="hero-weather"],
.home-dash-widget[data-widget-type^="hero-weather"].is-hero {
    overflow: hidden;
}

.home-dash-widget[data-widget-type^="hero-weather"] > .home-dash-widget-body,
.home-dash-widget[data-widget-type^="hero-weather"].is-hero > .home-dash-widget-body {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    height: 100%;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    box-sizing: border-box;
}

/* The slot sizes to its chips so tagTileFit can measure natural size and
   zoom the whole pill to fit. No width:100% or overflow:hidden here or the
   temperature clips instead of scaling. */
.home-dash-widget[data-widget-type^="hero-weather"] > .home-dash-widget-body > .home-dash-hero-slot {
    width: max-content;
    max-width: none;
    height: max-content;
    max-height: none;
    overflow: visible;
    align-items: center;
    justify-content: center;
}

.home-dash-hero-slot #weather-part-location,
.home-dash-hero-slot #weather-part-temp,
.home-dash-hero-slot #weather-part-wind,
.home-dash-hero-slot #weather-part-condition {
    margin: 0;
    width: max-content;
    max-width: none;
    max-height: none;
    min-width: 0;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: visible;
    font-size: 13px;
    padding: 6px 14px;
    gap: 8px;
}

.home-dash-hero-slot #weather-part-location i,
.home-dash-hero-slot #weather-part-temp i,
.home-dash-hero-slot #weather-part-wind i,
.home-dash-hero-slot #weather-part-condition i {
    font-size: 12px;
    flex: 0 0 auto;
}

.home-dash-widget-body > .home-dash-hero-slot,
.home-dash-widget-body > .home-dash-tools,
.home-dash-widget-body > .home-dash-vpn,
.home-dash-widget-body > .home-dash-clock {
    will-change: transform;
}

/* Scrollable hero panels: the tile body must scroll, not clip the top.
   Search results grow the tile instead of scrolling inside a short box. */
.home-dash-widget[data-widget-type="hero-filters"] > .home-dash-widget-body,
.home-dash-widget[data-widget-type="hero-recent"] > .home-dash-widget-body {
    overflow: auto;
    padding: 2px 4px 4px;
}

.home-dash-hero-slot[data-hero-slot="hero-results"],
.home-dash-hero-slot[data-hero-slot="hero-filters"],
.home-dash-hero-slot[data-hero-slot="hero-recent"],
.home-dash-hero-slot[data-hero-slot="hero-pinned"] {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    width: 100%;
    overflow: auto;
    align-items: stretch;
    justify-content: flex-start;
}

.home-dash-hero-slot[data-hero-slot="hero-results"] {
    height: auto;
    min-height: 100%;
    overflow: visible;
    justify-content: flex-start;
}

.home-dash-widget[data-widget-type="hero-ai-overview"] {
    --home-dash-ai-radius: 14px;
    border-radius: var(--home-dash-ai-radius);
    overflow: hidden;
    min-height: 84px;
    isolation: isolate;
}

.home-dash-widget[data-widget-type="hero-ai-overview"] > .home-dash-widget-body {
    overflow: hidden;
    padding: 0;
    align-items: stretch;
    justify-content: stretch;
    border-radius: inherit;
    background-clip: padding-box;
    clip-path: inset(0 round var(--home-dash-ai-radius, 14px));
}

.home-dash-widget[data-widget-type="hero-ai-overview"] > .home-dash-widget-body > .home-dash-hero-slot {
    will-change: auto;
}

.home-dash-hero-slot[data-hero-slot="hero-ai-overview"] {
    flex: 1 1 auto;
    overflow: hidden;
    justify-content: stretch;
    align-items: stretch;
    padding: 0;
    min-height: 0;
    height: 100%;
    width: 100%;
    border-radius: inherit;
    background-clip: padding-box;
    clip-path: inset(0 round var(--home-dash-ai-radius, 14px));
}

.home-dash-hero-slot[data-hero-slot="hero-ai-overview"].is-empty {
    justify-content: center;
    align-items: stretch;
    padding: 0;
}

.home-dash-ai-preview {
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
    align-items: stretch;
    justify-content: stretch;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: inherit;
    background-clip: padding-box;
    clip-path: inset(0 round var(--home-dash-ai-radius, 14px));
}

.home-dash-ai-preview-card {
    width: 100%;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 10px 12px;
    border-radius: var(--home-dash-ai-radius, 14px);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(167, 139, 250, 0.28);
    box-shadow: none;
    box-sizing: border-box;
    overflow: hidden;
    isolation: isolate;
    background-clip: padding-box;
    clip-path: inset(0 round var(--home-dash-ai-radius, 14px));
}

.home-dash-ai-preview-header {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

.home-dash-ai-preview-icon {
    width: 22px;
    height: 22px;
    object-fit: contain;
    flex: 0 0 auto;
}

.home-dash-ai-preview-title {
    font-size: 14px;
    font-weight: 650;
    color: rgba(255, 255, 255, 0.92);
}

.home-dash-ai-preview-meta,
.home-dash-ai-preview-header .ai-search-answer-model {
    margin-left: auto;
    max-width: 55%;
}

.home-dash-ai-preview-header .ai-search-answer-model {
    height: 24px;
    font-size: 11px;
    padding: 0 20px 0 8px;
    background-position: calc(100% - 10px) 9px, calc(100% - 6px) 9px;
}

.home-dash-ai-preview-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1 1 auto;
    min-height: 0;
    justify-content: flex-start;
    overflow: auto;
    border-radius: 0 0 10px 10px;
    background: transparent;
    background-clip: padding-box;
}

.home-dash-ai-preview-body::-webkit-scrollbar-corner {
    background: transparent;
}

.home-dash-ai-preview-lead {
    margin: 0;
    font-size: 13px;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.72);
    overflow: visible;
    display: block;
    flex: 0 1 auto;
    min-height: 0;
}

.home-dash-ai-preview-lines {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.home-dash-ai-preview-lines li {
    height: 10px;
    min-height: 0;
    flex: 1 1 0;
    max-height: 10px;
    border-radius: 999px;
    background: linear-gradient(90deg,
        rgba(167, 139, 250, 0.28),
        rgba(255, 255, 255, 0.08) 55%,
        rgba(255, 255, 255, 0.04));
    opacity: 0.9;
}

.home-dash-ai-preview-lines li:nth-child(1) { width: 92%; }
.home-dash-ai-preview-lines li:nth-child(2) { width: 78%; }
.home-dash-ai-preview-lines li:nth-child(3) { width: 64%; }

.home-dash-widget[data-fit-h="xs"][data-widget-type="hero-ai-overview"] .home-dash-ai-preview-card,
.home-dash-widget[data-fit-h="sm"][data-widget-type="hero-ai-overview"] .home-dash-ai-preview-card,
.home-dash-widget[data-fit-h="md"][data-widget-type="hero-ai-overview"] .home-dash-ai-preview-card {
    padding: 8px 10px;
    gap: 4px;
    justify-content: flex-start;
}

.home-dash-widget[data-fit-h="xs"][data-widget-type="hero-ai-overview"] .home-dash-ai-preview-lines,
.home-dash-widget[data-fit-h="sm"][data-widget-type="hero-ai-overview"] .home-dash-ai-preview-lines,
.home-dash-widget[data-fit-h="md"][data-widget-type="hero-ai-overview"] .home-dash-ai-preview-lines {
    display: none;
}

.home-dash-widget[data-fit-h="xs"][data-widget-type="hero-ai-overview"] .home-dash-ai-preview-lead,
.home-dash-widget[data-fit-h="sm"][data-widget-type="hero-ai-overview"] .home-dash-ai-preview-lead,
.home-dash-widget[data-fit-h="md"][data-widget-type="hero-ai-overview"] .home-dash-ai-preview-lead {
    font-size: 12px;
    line-height: 1.35;
}

html[data-theme="light"] .home-dash-ai-preview-card,
html.theme-light .home-dash-ai-preview-card {
    background: rgba(255, 255, 255, 0.32);
    border-color: rgba(90, 13, 214, 0.22);
    box-shadow: none;
}

html[data-theme="light"] .home-dash-ai-preview-title,
html.theme-light .home-dash-ai-preview-title {
    color: rgba(20, 16, 28, 0.92);
}

html[data-theme="light"] .home-dash-ai-preview-meta,
html[data-theme="light"] .home-dash-ai-preview-lead,
html.theme-light .home-dash-ai-preview-meta,
html.theme-light .home-dash-ai-preview-lead {
    color: rgba(20, 16, 28, 0.55);
}

/* The results frame is a page-level block; inside a tile it fills the tile.
   Height follows content so long result lists are not clipped inside a short box. */
.home-dash-hero-slot #search-results-frame,
.home-dash-hero-slot #ai-search-answer {
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    overflow: visible;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}

.home-dash-hero-slot #ai-search-answer:not([hidden]) {
    min-height: 0;
    height: 100%;
    display: flex !important;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--home-dash-ai-radius, 14px);
    background-clip: padding-box;
    clip-path: inset(0 round var(--home-dash-ai-radius, 14px));
}

.home-dash-hero-slot #ai-search-answer .ai-search-answer-card {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 10px 12px 12px;
    box-sizing: border-box;
    border-radius: var(--home-dash-ai-radius, 14px);
    isolation: isolate;
    background-clip: padding-box;
    box-shadow: none;
    clip-path: inset(0 round var(--home-dash-ai-radius, 14px));
}

.home-dash-hero-slot #ai-search-answer .ai-search-answer-header {
    flex: 0 0 auto;
    margin-bottom: 8px;
}

.home-dash-hero-slot #ai-search-answer .ai-search-answer-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    border-radius: 0 0 10px 10px;
    background: transparent;
    background-clip: padding-box;
}

.home-dash-hero-slot #ai-search-answer .ai-search-answer-body::-webkit-scrollbar-corner {
    background: transparent;
}

.home-dash-hero-slot #ai-search-answer[hidden] {
    display: none !important;
    min-height: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

.home-dash-hero-slot #search-results-frame .search-results,
.home-dash-hero-slot #search-results.search-results {
    margin: 0 !important;
    padding: 12px 14px 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    border-radius: 12px !important;
}

.home-dash-widget[data-widget-type="hero-results"] {
    overflow: hidden;
}

.home-dash-widget[data-widget-type="hero-results"] > .home-dash-widget-body {
    overflow: visible;
    align-items: stretch;
    justify-content: flex-start;
}

.home-dash-hero-slot .search-results:empty::before {
    margin: 0;
    padding: 18px;
    font-size: 13px;
}

.home-dash-hero-slot .home-pinned-sites,
.home-dash-hero-slot .home-recent-sites {
    width: 100%;
    max-width: 100%;
    max-height: none;
    margin: 0;
    overflow: visible;
}

.home-dash-hero-slot .search-filter-tabs {
    width: 100%;
    max-width: 100%;
    max-height: none;
    margin: 0;
    overflow: visible;
}

/* Recent visits: vertical list that uses the rail width. */
.home-dash-hero-slot .home-recent-sites {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
    align-content: flex-start;
    gap: 4px;
    padding: 2px 0;
}

.home-dash-hero-slot .home-recent-site {
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    max-width: 100%;
    gap: 10px;
    padding: 6px 8px;
    text-align: left;
    border-radius: 10px 2px 2px 2px;
}

.home-dash-hero-slot .home-recent-icon {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
}

.home-dash-hero-slot .home-recent-favicon {
    width: 16px;
    height: 16px;
}

.home-dash-hero-slot .home-recent-label {
    width: auto;
    flex: 1 1 auto;
    text-align: left;
    white-space: nowrap;
    -webkit-line-clamp: unset;
    display: block;
}

/* Pinned sizing is defined with the engines/filters block below so chip
   icons stay fixed while the tile is resized. */

/* Engines tile: scale the badge strip to the tile box so wrapped rows are
   never clipped when the board is short. Overflow stays hidden; fit zoom
   owns the visible size. */
.home-dash-widget[data-widget-type="hero-engines"] {
    overflow: visible;
}

.home-dash-widget[data-widget-type="hero-engines"] > .home-dash-widget-body {
    overflow: visible !important;
    align-items: stretch;
    justify-content: flex-start !important;
    padding: 8px 10px 12px;
    min-height: 0 !important;
    max-height: none;
}

.home-dash-widget[data-widget-type="hero-engines"] > .home-dash-widget-body > .home-dash-hero-slot {
    will-change: auto;
}

.home-dash-hero-slot[data-hero-slot="hero-engines"] {
    align-items: stretch;
    justify-content: flex-start;
    flex: 1 1 auto;
    min-height: 0 !important;
    height: 100%;
    max-height: none;
    overflow: visible;
    padding: 0;
}

.home-dash-hero-slot[data-hero-slot="hero-engines"] .search-status {
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
    padding: 4px 2px 8px;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    box-sizing: border-box;
    background: transparent;
    border: none;
    transform-origin: top left;
}

.home-dash-hero-slot .search-status {
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
    padding: 4px 2px 8px;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    box-sizing: border-box;
    background: transparent;
    border: none;
}

.home-dash-hero-slot .search-status-indicator {
    margin: 0;
    font-size: 12px;
    gap: 6px;
    flex: 0 0 auto;
}

.home-dash-hero-slot .search-sources {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: flex-start;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 8px 6px 10px;
    overflow: visible;
    flex: 0 0 auto;
}

.home-dash-widget.is-content-center[data-widget-type="hero-engines"] .home-dash-hero-slot .search-sources,
.home-dash-widget.is-content-center[data-widget-type="hero-engines"] .search-sources {
    justify-content: center;
    align-content: center;
}

.home-dash-widget.is-icons-only[data-widget-type="hero-engines"] .source-badge > span,
.home-dash-widget.is-icons-only[data-widget-type="hero-engines"] .search-sources .source-badge > span {
    display: none !important;
}

.home-dash-widget.is-icons-only[data-widget-type="hero-engines"] .source-badge,
.home-dash-widget.is-icons-only[data-widget-type="hero-engines"] .search-sources .source-badge {
    padding-left: 8px;
    padding-right: 8px;
    min-width: 34px;
    justify-content: center;
}

.home-dash-widget.is-hide-title[data-widget-type="hero-engines"] .search-status-indicator,
.home-dash-widget.is-hide-title[data-widget-type="hero-filters"] .search-status-indicator {
    display: none !important;
}

.home-dash-widget.is-content-center[data-widget-type="hero-pinned"] .home-pinned-sites,
.home-dash-widget.is-content-center[data-widget-type="hero-pinned"] .home-dash-hero-slot .home-pinned-sites {
    justify-content: center;
    align-content: center;
}

.home-dash-widget.is-icons-only[data-widget-type="hero-pinned"] .home-pinned-label {
    display: none !important;
}

.home-dash-widget.is-content-center[data-widget-type="hero-filters"] .search-filter-tabs {
    justify-content: center;
}

.home-dash-widget.is-icons-only[data-widget-type="hero-filters"] .filter-tab > span {
    display: none !important;
}

.home-dash-widget.is-content-center[data-widget-type="vpn"] .home-dash-vpn,
.home-dash-widget.is-content-center[data-widget-type="clock"] .home-dash-clock,
.home-dash-widget.is-content-center[data-widget-type="security"] .home-dash-stat-grid {
    align-items: center;
    justify-content: center;
    text-align: center;
}

.home-dash-widget.is-content-center[data-widget-type="vpn"] .home-dash-vpn-status {
    justify-content: center;
}

.home-dash-widget.is-content-center > .home-dash-widget-body {
    align-items: center;
    justify-content: center;
}

.home-dash-widget.is-content-center[data-widget-type="hero-pinned"] > .home-dash-widget-body,
.home-dash-widget.is-content-center[data-widget-type="hero-filters"] > .home-dash-widget-body {
    align-items: center;
    justify-content: center;
}

/* Engines must top-align. Vertical centering clips badge glow top and bottom
   when the wrapped row is taller than the tile. */
.home-dash-widget.is-content-center[data-widget-type="hero-engines"] > .home-dash-widget-body {
    align-items: center;
    justify-content: flex-start;
}

.home-dash-widget.is-content-center .home-dash-hero-slot {
    align-items: center;
    justify-content: center;
}

.home-dash-widget.is-content-center[data-widget-type="hero-engines"] .home-dash-hero-slot {
    align-items: center;
    justify-content: flex-start;
}

.home-dash-widget.is-content-center[data-widget-type="hero-pinned"] .home-dash-hero-slot {
    align-items: center;
    justify-content: center;
}

.home-dash-hero-slot .search-sources .source-badge {
    flex: 0 0 auto;
    pointer-events: auto !important;
    max-width: 100%;
}

.home-dash-widget[data-widget-type="hero-engines"][data-fit-h="md"] .home-dash-hero-slot .search-sources,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-w="md"] .home-dash-hero-slot .search-sources {
    gap: 6px;
    padding: 4px 4px 6px;
}

.home-dash-widget[data-widget-type="hero-engines"][data-fit-h="sm"] .home-dash-hero-slot .search-sources,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-w="sm"] .home-dash-hero-slot .search-sources {
    gap: 5px;
    padding: 2px 2px 4px;
}

.home-dash-widget[data-widget-type="hero-engines"][data-fit-h="xs"] .home-dash-hero-slot .search-sources,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-w="xs"] .home-dash-hero-slot .search-sources {
    gap: 4px;
    padding: 1px 1px 2px;
}

.home-dash-widget[data-widget-type="hero-engines"][data-fit-h="md"] .home-dash-hero-slot .search-sources .source-badge,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-w="md"] .home-dash-hero-slot .search-sources .source-badge {
    padding: 5px 8px;
    font-size: 10px;
}

.home-dash-widget[data-widget-type="hero-engines"][data-fit-h="sm"] .home-dash-hero-slot .search-sources .source-badge,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-w="sm"] .home-dash-hero-slot .search-sources .source-badge,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-h="xs"] .home-dash-hero-slot .search-sources .source-badge,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-w="xs"] .home-dash-hero-slot .search-sources .source-badge {
    padding: 4px 7px;
    font-size: 10px;
    min-height: 0;
}

.home-dash-widget[data-widget-type="hero-engines"][data-fit-h="sm"] .source-badge-icon,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-w="sm"] .source-badge-icon,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-h="xs"] .source-badge-icon,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-w="xs"] .source-badge-icon,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-h="sm"] .search-sources .source-badge img,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-w="sm"] .search-sources .source-badge img,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-h="xs"] .search-sources .source-badge img,
.home-dash-widget[data-widget-type="hero-engines"][data-fit-w="xs"] .search-sources .source-badge img {
    width: 12px !important;
    height: 12px !important;
    min-width: 12px !important;
    min-height: 12px !important;
    max-width: 12px !important;
    max-height: 12px !important;
}

.home-dash-widget[data-fit-w="xs"] .home-dash-hero-slot .search-sources .source-badge,
.home-dash-widget[data-fit-h="xs"] .home-dash-hero-slot .search-sources .source-badge {
    transform: none;
}

/* Filter tabs wrap inside their tile instead of clipping off the right edge. */
.home-dash-hero-slot[data-hero-slot="hero-filters"] {
    justify-content: flex-start;
    align-items: stretch;
    padding: 2px 4px;
    overflow: hidden;
}

.home-dash-hero-slot .search-filter-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center;
    align-content: flex-start;
    justify-content: flex-start;
    gap: 4px;
    width: 100%;
    max-width: 100%;
    max-height: none;
    height: auto;
    margin: 0;
    padding: 2px 2px 4px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    overflow: visible !important;
}

/* Horizontal pipe dividers only make sense in a single row. */
.home-dash-hero-slot .search-filter-tabs .tab-divider {
    display: none !important;
}

.home-dash-hero-slot .search-filter-tabs .filter-tab {
    flex: 0 0 auto;
    padding: 8px 12px;
    font-size: 13px;
}

.home-dash-widget[data-widget-type="hero-filters"][data-fit-w="xs"] .search-filter-tabs .filter-tab,
.home-dash-widget[data-widget-type="hero-filters"][data-fit-w="sm"] .search-filter-tabs .filter-tab {
    padding: 6px 10px;
    font-size: 12px;
}

/* Pinned shortcuts keep fixed chip size. Resizing the tile must not shrink icons. */
.home-dash-hero-slot[data-hero-slot="hero-pinned"] {
    align-items: flex-start;
    justify-content: flex-start;
    overflow: hidden;
    padding: 6px;
}

.home-dash-hero-slot .home-pinned-sites {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 8px;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: none;
    margin: 0;
    padding: 0;
    overflow: visible;
}

.home-dash-hero-slot .home-pinned-site {
    flex: 0 0 auto;
    width: auto;
    max-width: 180px;
    height: auto;
    min-height: 0;
    padding: 8px 12px;
}

.home-dash-hero-slot .home-pinned-favicon,
.home-dash-hero-slot .home-pinned-favicon-fallback {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    min-height: 18px;
    flex: 0 0 auto;
}

.home-dash-widget[data-widget-type="hero-pinned"] > .home-dash-widget-body {
    align-items: flex-start;
    justify-content: flex-start;
    overflow: hidden;
}

.home-dash-widget[data-widget-type="hero-filters"] {
    overflow: hidden;
}

.home-dash-widget[data-widget-type="hero-filters"] > .home-dash-widget-body {
    overflow: hidden;
    align-items: stretch;
    justify-content: flex-start;
    min-height: 0;
}

.home-dash-widget[data-widget-type="hero-pinned"] {
    overflow: hidden;
}

/* Titles get the full tile width. Pinned can wrap; recent stays one line. */
.home-dash-hero-slot .home-pinned-label {
    max-width: none;
    white-space: normal;
    overflow-wrap: anywhere;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.home-dash-hero-slot .home-recent-label {
    max-width: none;
    flex: 1 1 auto;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    -webkit-line-clamp: unset;
}

.home-dash-hero-slot .home-recent-site,
.home-dash-hero-slot .home-pinned-site {
    height: auto;
    min-height: 0;
    align-items: center;
}

.home-dash-hero-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 11px;
    line-height: 1.45;
    text-align: center;
    color: rgba(255, 255, 255, 0.45);
}

.home-dash-hero-add-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border: 1px solid rgba(167, 139, 250, 0.5);
    border-radius: 8px;
    background: rgba(90, 13, 214, 0.28);
    color: #fff;
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s ease, border-color 0.12s ease;
}

.home-dash-hero-add-btn:hover {
    background: rgba(124, 58, 237, 0.45);
    border-color: rgba(167, 139, 250, 0.85);
}

html[data-theme="light"] .home-dash-hero-empty,
html.theme-light .home-dash-hero-empty {
    color: rgba(0, 0, 0, 0.45);
}

html[data-theme="light"] .home-dash-hero-add-btn,
html.theme-light .home-dash-hero-add-btn {
    color: #1c1916;
    background: rgba(124, 58, 237, 0.16);
    border-color: rgba(124, 58, 237, 0.45);
}

/* Resize grips stay inside the tile. No permanent bars: only the hovered edge paints. */
.home-dash-edge {
    position: absolute;
    z-index: 30;
    background: transparent;
    touch-action: none;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.08s ease, background 0.08s ease;
}

.home-dash-widget:hover > .home-dash-edge,
.home-dash-widget.is-interacting > .home-dash-edge {
    opacity: 1;
    pointer-events: auto;
    background: transparent;
}

.home-dash-edge:hover {
    background: rgba(167, 139, 250, 0.55) !important;
}

.home-dash-edge-n {
    left: 10px;
    right: 10px;
    top: 0;
    height: 8px;
    cursor: ns-resize;
}

.home-dash-edge-s {
    left: 10px;
    right: 10px;
    bottom: 0;
    height: 8px;
    cursor: ns-resize;
}

.home-dash-edge-e {
    top: 10px;
    bottom: 10px;
    right: 0;
    width: 8px;
    cursor: ew-resize;
}

.home-dash-edge-w {
    top: 10px;
    bottom: 10px;
    left: 0;
    width: 8px;
    cursor: ew-resize;
}

.home-dash-edge-se,
.home-dash-edge-sw,
.home-dash-edge-ne,
.home-dash-edge-nw {
    width: 14px;
    height: 14px;
    z-index: 31;
}

.home-dash-edge-se { right: 0; bottom: 0; cursor: nwse-resize; }
.home-dash-edge-sw { left: 0; bottom: 0; cursor: nesw-resize; }
.home-dash-edge-ne { right: 0; top: 0; cursor: nesw-resize; }
.home-dash-edge-nw { left: 0; top: 0; cursor: nwse-resize; }

/* The grid fills the tile width. Four columns only when the tile is wide
   enough that Ads / Trackers / Cookies / Scripts numbers stay fully visible. */
.home-dash-widget[data-widget-type="security"] > .home-dash-widget-body {
    align-items: stretch;
    justify-content: flex-start;
    padding: 6px 8px 8px;
    gap: 6px;
    overflow: hidden;
    container-type: inline-size;
    container-name: dash-sec;
}

.home-dash-stat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: minmax(0, 1fr);
    gap: 6px;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    align-self: stretch;
}

@container dash-sec (min-width: 280px) {
    .home-dash-stat-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.home-dash-stat {
    padding: 6px 6px;
    border-radius: 10px 2px 2px 2px;
    background: rgba(90, 13, 214, 0.14);
    border: 1px solid rgba(90, 13, 214, 0.22);
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    container-type: inline-size;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.home-dash-stat-label {
    display: block;
    font-size: clamp(8px, 22cqi, 11px);
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.home-dash-stat-value {
    font-size: clamp(11px, 34cqi, 18px);
    font-weight: 700;
    color: #fff;
    line-height: 1.15;
    white-space: nowrap;
    overflow: visible;
    min-width: 0;
    max-width: 100%;
    font-variant-numeric: tabular-nums;
}

.home-dash-stat-total {
    width: 100%;
    flex: 0 0 auto;
    font-size: 12px;
    line-height: 1.3;
    color: rgba(255, 255, 255, 0.65);
    white-space: normal;
    overflow: visible;
}

.home-dash-widget[data-widget-type="vpn"] {
    overflow: visible;
}

.home-dash-widget[data-widget-type="vpn"] > .home-dash-widget-body {
    overflow: visible;
    padding: 14px 12px;
    justify-content: center;
}

.home-dash-vpn {
    display: flex;
    flex-direction: column;
    gap: 12px;
    height: 100%;
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    padding: 4px;
}

.home-dash-vpn-status {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.home-dash-vpn-text {
    min-width: 0;
}

.home-dash-vpn-dot {
    width: 11px;
    height: 11px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #777;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.06);
}

.home-dash-vpn-dot.is-on {
    background: #34d399;
    box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.18);
}

.home-dash-vpn-dot.is-busy {
    background: #fbbf24;
}

.home-dash-vpn-label {
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.home-dash-vpn-meta {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.5);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Power icon only: the status line above it already says what state it is in.
   Fixed on both axes so the flex parent cannot stretch it into an oval. */
.home-dash-vpn-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    flex: 0 0 auto;
    box-sizing: border-box;
    width: 40px;
    min-width: 40px;
    max-width: 40px;
    height: 40px;
    min-height: 40px;
    max-height: 40px;
    aspect-ratio: 1 / 1;
    padding: 0;
    border: none;
    border-radius: 50%;
    font-size: 15px;
    cursor: pointer;
    color: #fff;
    background: linear-gradient(135deg, #6d28d9, #4c1d95);
    box-shadow: 0 6px 16px rgba(90, 13, 214, 0.35);
    transition: filter 0.15s ease, transform 0.05s ease;
}

.home-dash-vpn-btn:hover { filter: brightness(1.08); }
.home-dash-vpn-btn:active { transform: translateY(1px); }
.home-dash-vpn-btn.is-connected {
    background: linear-gradient(135deg, #059669, #047857);
    box-shadow: 0 6px 16px rgba(5, 150, 105, 0.32);
}
.home-dash-vpn-btn.is-busy {
    background: linear-gradient(135deg, #b45309, #92400e);
    cursor: wait;
}
.home-dash-vpn-btn[disabled] { opacity: 0.75; }

.home-dash-tools {
    display: grid;
    grid-template-columns: repeat(2, max-content);
    justify-content: center;
    align-content: start;
    gap: 4px;
    min-height: 0;
    width: 100%;
}

.home-dash-widget[data-widget-type="tools"] > .home-dash-widget-body {
    overflow: auto;
    align-items: center;
    justify-content: center;
}

.home-dash-tools.is-icons {
    grid-template-columns: repeat(auto-fill, minmax(32px, 1fr));
    gap: 4px;
}

/* One tool broken out of the group fills its own tile. */
.home-dash-tools.is-single {
    grid-template-columns: minmax(0, 1fr);
    height: 100%;
    width: 100%;
}

.home-dash-tools.is-single .home-dash-tool {
    justify-content: flex-start;
    height: 100%;
    text-align: left;
    width: 100%;
}

.home-dash-tools.is-single.is-content-center .home-dash-tool,
.home-dash-widget.is-content-center .home-dash-tools.is-single .home-dash-tool {
    justify-content: center;
    text-align: center;
}

.home-dash-tools.is-content-center:not(.is-single) {
    justify-items: center;
}

.home-dash-tools.is-content-center:not(.is-single) .home-dash-tool {
    justify-content: center;
    text-align: center;
    width: auto;
    max-width: 100%;
}

.home-dash-tools.is-content-stack .home-dash-tool,
.home-dash-widget.is-content-stack .home-dash-tools .home-dash-tool {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    gap: 4px;
}

.home-dash-tools.is-content-stack.is-content-center .home-dash-tool,
.home-dash-widget.is-content-stack.is-content-center .home-dash-tools .home-dash-tool {
    justify-content: center;
    align-items: center;
}

.home-dash-tools.is-single.is-icons .home-dash-tool {
    aspect-ratio: auto;
    justify-content: center;
}

.home-dash-tool {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 7px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.04);
    color: inherit;
    cursor: pointer;
    font: inherit;
    font-size: 12px;
    text-align: left;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.home-dash-tool > i {
    font-size: 14px;
    width: 18px;
    text-align: center;
    color: rgba(167, 139, 250, 0.95);
}

.home-dash-tool:hover {
    background: rgba(90, 13, 214, 0.24);
    border-color: rgba(90, 13, 214, 0.4);
}

.home-dash-tool span {
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-dash-tools.is-icons .home-dash-tool {
    justify-content: center;
    padding: 6px 0;
    aspect-ratio: 1 / 1;
}

.home-dash-tools.is-icons .home-dash-tool span {
    display: none;
}

.home-dash-tools.is-icons .home-dash-tool > i {
    font-size: 17px;
    width: auto;
}

/* ---- fit to tile -------------------------------------------------------
   data-fit-w / data-fit-h are set from the tile's live size. Content sheds
   labels, columns and padding as the tile shrinks so a resize never clips. */

.home-dash-widget[data-fit-h="xs"] .home-dash-widget-body {
    padding: 2px 6px;
}

.home-dash-widget[data-fit-h="sm"] .home-dash-widget-body {
    padding: 4px 8px;
    gap: 4px;
}

.home-dash-widget[data-fit-w="xs"] .home-dash-widget-body {
    padding-left: 6px;
    padding-right: 6px;
}

/* The header title is the first thing to go; the grip still moves the tile. */
.home-dash-widget[data-fit-w="xs"] .home-dash-widget-head h3,
.home-dash-widget[data-fit-h="xs"] .home-dash-widget-head h3 {
    display: none;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-widget-head {
    min-height: 18px;
    padding: 1px 6px;
}

/* Tools drop their labels rather than run past the tile edge. */
.home-dash-widget[data-fit-w="xs"] .home-dash-tool span,
.home-dash-widget[data-fit-w="sm"] .home-dash-tool span,
.home-dash-widget[data-fit-h="xs"] .home-dash-tool span {
    display: none;
}

.home-dash-widget[data-fit-w="xs"] .home-dash-tool,
.home-dash-widget[data-fit-w="sm"] .home-dash-tool,
.home-dash-widget[data-fit-h="xs"] .home-dash-tool {
    justify-content: center;
    padding: 4px;
    gap: 0;
}

.home-dash-widget[data-fit-w="xs"] .home-dash-tools,
.home-dash-widget[data-fit-w="sm"] .home-dash-tools {
    grid-template-columns: repeat(auto-fill, minmax(34px, 1fr));
    gap: 4px;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-tools,
.home-dash-widget[data-fit-h="sm"] .home-dash-tools {
    grid-auto-rows: min-content;
    align-content: start;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-tool,
.home-dash-widget[data-fit-h="sm"] .home-dash-tool {
    aspect-ratio: auto;
    min-height: 0;
}

/* A lone tool keeps its label as long as the tile is wide enough for it. */
.home-dash-tools.is-single .home-dash-tool {
    overflow: hidden;
}

.home-dash-tools.is-single .home-dash-tool span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

/* Security stats stack into one column before the numbers get clipped. */
.home-dash-widget[data-fit-w="xs"] .home-dash-stat-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-stat-grid,
.home-dash-widget[data-fit-h="sm"] .home-dash-stat-grid {
    gap: 4px;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-stat,
.home-dash-widget[data-fit-h="sm"] .home-dash-stat,
.home-dash-widget[data-fit-w="xs"] .home-dash-stat {
    padding: 4px 6px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-stat-label,
.home-dash-widget[data-fit-h="sm"] .home-dash-stat-label,
.home-dash-widget[data-fit-w="xs"] .home-dash-stat-label {
    margin-bottom: 0;
    font-size: 10px;
    overflow: visible;
    text-overflow: unset;
    white-space: normal;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-stat-value,
.home-dash-widget[data-fit-h="sm"] .home-dash-stat-value,
.home-dash-widget[data-fit-w="xs"] .home-dash-stat-value {
    font-size: clamp(10px, 34cqi, 14px);
}

.home-dash-widget[data-fit-h="xs"] .home-dash-stat-total {
    display: block;
    font-size: 10px;
    line-height: 1.2;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-stat-grid,
.home-dash-widget[data-fit-w="xs"][data-fit-h="xs"] .home-dash-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: minmax(0, 1fr);
    gap: 4px;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-stat {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 2px 4px;
    gap: 0;
    min-width: 0;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-stat-label {
    font-size: 9px;
    line-height: 1.1;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-stat-value {
    font-size: clamp(10px, 34cqi, 12px);
    line-height: 1.1;
}

/* VPN keeps the power button and sheds the wording around it. */
.home-dash-widget[data-fit-h="xs"] .home-dash-vpn,
.home-dash-widget[data-fit-w="xs"] .home-dash-vpn {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-vpn-meta,
.home-dash-widget[data-fit-w="xs"] .home-dash-vpn-meta {
    display: none;
}

.home-dash-widget[data-fit-w="xs"] .home-dash-vpn-label {
    font-size: 11px;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-vpn-btn,
.home-dash-widget[data-fit-w="xs"] .home-dash-vpn-btn {
    width: 28px;
    min-width: 28px;
    max-width: 28px;
    height: 28px;
    min-height: 28px;
    max-height: 28px;
    font-size: 12px;
    box-shadow: 0 4px 12px rgba(90, 13, 214, 0.35);
}

/* Grow status + power button when the tile is given room. */
.home-dash-widget[data-widget-type="vpn"][data-fit-h="md"] .home-dash-vpn-label,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="md"] .home-dash-vpn-label {
    font-size: 15px;
}

.home-dash-widget[data-widget-type="vpn"][data-fit-h="md"] .home-dash-vpn-btn,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="md"] .home-dash-vpn-btn {
    width: 48px;
    min-width: 48px;
    max-width: 48px;
    height: 48px;
    min-height: 48px;
    max-height: 48px;
    font-size: 17px;
}

.home-dash-widget[data-widget-type="vpn"][data-fit-h="lg"] .home-dash-vpn,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="lg"] .home-dash-vpn,
.home-dash-widget[data-widget-type="vpn"][data-fit-h="xl"] .home-dash-vpn,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="xl"] .home-dash-vpn {
    gap: 16px;
}

.home-dash-widget[data-widget-type="vpn"][data-fit-h="lg"] .home-dash-vpn-label,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="lg"] .home-dash-vpn-label,
.home-dash-widget[data-widget-type="vpn"][data-fit-h="xl"] .home-dash-vpn-label,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="xl"] .home-dash-vpn-label {
    font-size: 18px;
}

.home-dash-widget[data-widget-type="vpn"][data-fit-h="lg"] .home-dash-vpn-meta,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="lg"] .home-dash-vpn-meta,
.home-dash-widget[data-widget-type="vpn"][data-fit-h="xl"] .home-dash-vpn-meta,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="xl"] .home-dash-vpn-meta {
    font-size: 13px;
}

.home-dash-widget[data-widget-type="vpn"][data-fit-h="lg"] .home-dash-vpn-btn,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="lg"] .home-dash-vpn-btn,
.home-dash-widget[data-widget-type="vpn"][data-fit-h="xl"] .home-dash-vpn-btn,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="xl"] .home-dash-vpn-btn {
    width: 64px;
    min-width: 64px;
    max-width: 64px;
    height: 64px;
    min-height: 64px;
    max-height: 64px;
    font-size: 22px;
    box-shadow: 0 8px 22px rgba(90, 13, 214, 0.42);
}

.home-dash-widget[data-widget-type="vpn"][data-fit-h="lg"] .home-dash-vpn-btn.is-connected,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="lg"] .home-dash-vpn-btn.is-connected,
.home-dash-widget[data-widget-type="vpn"][data-fit-h="xl"] .home-dash-vpn-btn.is-connected,
.home-dash-widget[data-widget-type="vpn"][data-fit-w="xl"] .home-dash-vpn-btn.is-connected {
    box-shadow: 0 8px 22px rgba(5, 150, 105, 0.4);
}

.home-dash-vpn-label,
.home-dash-vpn-meta {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Page content scales with its tile instead of overflowing it. */
.home-dash-widget[data-fit-h="xs"] .home-dash-hero-slot .home-tagline,
.home-dash-widget[data-fit-w="xs"] .home-dash-hero-slot .home-tagline {
    font-size: 11px;
}

.home-dash-widget[data-fit-w="xs"] .home-dash-hero-slot .weather-strip,
.home-dash-widget[data-fit-h="xs"] .home-dash-hero-slot .weather-strip {
    font-size: 10px;
    gap: 4px;
}

.home-dash-widget[data-fit-h="xs"] .home-dash-hero-empty,
.home-dash-widget[data-fit-w="xs"] .home-dash-hero-empty {
    font-size: 10px;
    padding: 4px 6px;
    -webkit-line-clamp: 2;
}

.home-dash-widget[data-widget-type="clock"] {
    overflow: hidden;
}

/* Clock sizes to its content at a fixed base font so tagTileFit can zoom the
   whole block to fit. No width:100%, clamp, or ellipsis here or the time
   clips instead of scaling. */
.home-dash-clock {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: max-content;
    width: max-content;
    max-width: none;
    gap: 4px;
    min-height: 0;
    min-width: 0;
    overflow: visible;
}

.home-dash-clock-time {
    font-size: 46px;
    font-weight: 700;
    font-stretch: 100%;
    letter-spacing: -0.03em;
    line-height: 1;
    white-space: nowrap;
    overflow: visible;
}

.home-dash-clock-date {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.55);
    white-space: nowrap;
    overflow: visible;
}

.home-dash-clock.style-minimal .home-dash-clock-time {
    font-weight: 300;
    letter-spacing: 0.02em;
}

.home-dash-clock.style-digital-lcd .home-dash-clock-time {
    font-family: "Courier New", ui-monospace, monospace;
    font-weight: 700;
    color: #34d399;
    text-shadow: 0 0 12px rgba(52, 211, 153, 0.45);
}

.home-dash-clock.style-digital-lcd .home-dash-clock-date {
    font-family: "Courier New", ui-monospace, monospace;
    color: rgba(52, 211, 153, 0.6);
}

/* min-height must stay 0: a floor here lets the surface report a box larger
   than the tile, and the native window is positioned from that box. */
.home-dash-embed-surface {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    min-height: 0;
    border-radius: 0 0 0 10px;
    background: rgba(0, 0, 0, 0.4);
}

.home-dash-empty {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
}

.home-dash-widget.is-powerup {
    overflow: visible;
}

.home-dash-widget.is-powerup:hover,
.home-dash-widget.is-powerup:focus-within {
    z-index: 46;
}

.home-dash-widget.is-powerup > .home-dash-widget-body,
.home-dash-widget[data-widget-type="news"] > .home-dash-widget-body,
.home-dash-widget[data-widget-type="crypto"] > .home-dash-widget-body,
.home-dash-widget[data-widget-type="stocks"] > .home-dash-widget-body,
.home-dash-widget[data-widget-type="notes"] > .home-dash-widget-body {
    align-items: stretch;
    justify-content: flex-start;
    padding: 4px 6px 6px;
    overflow: visible;
}

.home-dash-pu {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    height: 100%;
    min-height: 0;
    min-width: 0;
}

.home-dash-pu-bar {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}

.home-dash-pu-hint {
    flex: 1;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.48);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.home-dash-pu-bar-actions {
    display: flex;
    gap: 4px;
    flex: 0 0 auto;
}

.home-dash-pu-icon,
.home-dash-pu-remove,
.home-dash-pu-add,
.home-dash-pu-chip,
.home-dash-pu-suggest-item,
.home-dash-pu-row,
.home-dash-pu-quote-main,
.home-dash-pu-note {
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.home-dash-pu-icon {
    width: 26px;
    height: 26px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.62);
    background: rgba(255, 255, 255, 0.06);
}

.home-dash-pu-icon:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

.home-dash-pu-search-wrap {
    position: relative;
    flex: 1;
    min-width: 0;
}

.home-dash-pu-search,
.home-dash-pu-note-input,
.home-dash-pu-note-body {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.22);
    color: inherit;
    border-radius: 8px;
    padding: 6px 8px;
    font-size: 12px;
    outline: none;
}

.home-dash-pu-search:focus,
.home-dash-pu-note-input:focus,
.home-dash-pu-note-body:focus {
    border-color: rgba(123, 92, 255, 0.7);
}

.home-dash-pu-suggest {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 4px);
    z-index: 8;
    max-height: 160px;
    overflow: auto;
    border-radius: 10px;
    background: rgba(18, 16, 28, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
}

.home-dash-pu-suggest-item {
    display: flex;
    gap: 8px;
    align-items: baseline;
    width: 100%;
    padding: 7px 10px;
    text-align: left;
}

.home-dash-pu-suggest-item:hover {
    background: rgba(123, 92, 255, 0.22);
}

.home-dash-pu-suggest-item span {
    color: rgba(255, 255, 255, 0.5);
    font-size: 11px;
}

.home-dash-pu-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.home-dash-pu-chip {
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    background: rgba(123, 92, 255, 0.16);
    color: rgba(255, 255, 255, 0.86);
}

.home-dash-pu-chip:hover {
    background: rgba(123, 92, 255, 0.32);
}

.home-dash-pu-list {
    flex: 1;
    min-height: 0;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 2px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}

.home-dash-pu-empty {
    padding: 10px 6px;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.48);
    line-height: 1.4;
}

.home-dash-pu-row,
.home-dash-pu-note {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    width: 100%;
    padding: 7px 8px;
    border-radius: 8px;
    text-align: left;
}

.home-dash-pu-note {
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

.home-dash-pu-row:hover,
.home-dash-pu-note:hover,
.home-dash-pu-quote:hover {
    background: rgba(255, 255, 255, 0.06);
}

.home-dash-pu-row-title {
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.home-dash-pu-row-meta {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.45);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.home-dash-pu-quote {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 6px;
    padding: 6px 4px 6px 8px;
    border-radius: 8px;
}

.home-dash-pu-quote-main {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    text-align: left;
}

.home-dash-pu-sym {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.home-dash-pu-name {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.45);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.home-dash-pu-quote-nums {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1px;
}

.home-dash-pu-price {
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.home-dash-pu-chg {
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: rgba(255, 255, 255, 0.5);
}

.home-dash-pu-chg.is-up { color: #4ade80; }
.home-dash-pu-chg.is-down { color: #f87171; }

.home-dash-pu-remove {
    width: 22px;
    height: 22px;
    border-radius: 6px;
    color: rgba(255, 255, 255, 0.4);
    opacity: 0.35;
}

.home-dash-pu-quote:hover .home-dash-pu-remove,
.home-dash-pu-remove:focus {
    opacity: 1;
}

.home-dash-pu-remove:hover {
    background: rgba(248, 113, 113, 0.18);
    color: #f87171;
}

.home-dash-pu-compose {
    display: flex;
    flex-direction: column;
    gap: 5px;
    flex: 0 0 auto;
}

.home-dash-pu-add {
    align-self: flex-end;
    padding: 5px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    background: rgba(123, 92, 255, 0.28);
    color: #fff;
}

.home-dash-pu-add:hover {
    background: rgba(123, 92, 255, 0.45);
}

.home-dash-pu-note-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex: 0 0 auto;
    background: #f6d860;
}

.home-dash-pu-note-dot[data-color="pink"] { background: #f472b6; }
.home-dash-pu-note-dot[data-color="green"] { background: #4ade80; }
.home-dash-pu-note-dot[data-color="blue"] { background: #60a5fa; }
.home-dash-pu-note-dot[data-color="purple"] { background: #a78bfa; }
.home-dash-pu-note-dot[data-color="orange"] { background: #fb923c; }

.home-dash-pu-note-copy {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

html[data-theme="light"] .home-dash-pu-hint,
html.theme-light .home-dash-pu-hint,
html[data-theme="light"] .home-dash-pu-empty,
html.theme-light .home-dash-pu-empty,
html[data-theme="light"] .home-dash-pu-row-meta,
html.theme-light .home-dash-pu-row-meta,
html[data-theme="light"] .home-dash-pu-name,
html.theme-light .home-dash-pu-name,
html[data-theme="light"] .home-dash-pu-suggest-item span,
html.theme-light .home-dash-pu-suggest-item span {
    color: rgba(28, 25, 22, 0.55);
}

html[data-theme="light"] .home-dash-pu-search,
html.theme-light .home-dash-pu-search,
html[data-theme="light"] .home-dash-pu-note-input,
html.theme-light .home-dash-pu-note-input,
html[data-theme="light"] .home-dash-pu-note-body,
html.theme-light .home-dash-pu-note-body {
    background: rgba(255, 255, 255, 0.55);
    border-color: rgba(0, 0, 0, 0.12);
    color: #1c1916;
}

html[data-theme="light"] .home-dash-pu-icon,
html.theme-light .home-dash-pu-icon {
    background: rgba(0, 0, 0, 0.06);
    color: rgba(28, 25, 22, 0.7);
}

html[data-theme="light"] .home-dash-pu-row:hover,
html.theme-light .home-dash-pu-row:hover,
html[data-theme="light"] .home-dash-pu-note:hover,
html.theme-light .home-dash-pu-note:hover,
html[data-theme="light"] .home-dash-pu-quote:hover,
html.theme-light .home-dash-pu-quote:hover {
    background: rgba(0, 0, 0, 0.05);
}

html[data-theme="light"] .home-dash-pu-suggest,
html.theme-light .home-dash-pu-suggest {
    background: rgba(255, 255, 255, 0.97);
    border-color: rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] .home-dash-pu-remove,
html.theme-light .home-dash-pu-remove {
    color: rgba(28, 25, 22, 0.45);
}

/* Tiles are chrome-free in every theme. A filled tile painted opaque cards
   behind transparent hero content in light mode. */
html[data-theme="light"] .home-dash-widget,
html.theme-light .home-dash-widget {
    background: transparent;
    border-color: transparent;
    color: #1c1916;
}

html[data-theme="light"] .home-dash-widget-head h3,
html.theme-light .home-dash-widget-head h3,
html[data-theme="light"] .home-dash-stat-label,
html.theme-light .home-dash-stat-label,
html[data-theme="light"] .home-dash-vpn-meta,
html.theme-light .home-dash-vpn-meta,
html[data-theme="light"] .home-dash-clock-date,
html.theme-light .home-dash-clock-date {
    color: rgba(0, 0, 0, 0.55);
}

html[data-theme="light"] .home-dash-stat-value,
html.theme-light .home-dash-stat-value,
html[data-theme="light"] .home-dash-clock-time,
html.theme-light .home-dash-clock-time,
html[data-theme="light"] .home-dash-vpn-label,
html.theme-light .home-dash-vpn-label {
    color: #111;
}

html[data-theme="light"] .home-dash-drag-grip,
html.theme-light .home-dash-drag-grip {
    color: rgba(0, 0, 0, 0.35);
}

html[data-theme="light"] .home-dash-widget.is-hero,
html.theme-light .home-dash-widget.is-hero {
    background: transparent;
    border-color: transparent;
}

html[data-theme="light"] .home-dash-clock.style-digital-lcd .home-dash-clock-time,
html.theme-light .home-dash-clock.style-digital-lcd .home-dash-clock-time {
    color: #059669;
}

@media (max-width: 900px) {
    .welcome-screen.home-dashboard-mode {
        overflow: auto;
    }
    .home-dashboard {
        min-height: 0;
    }
    .home-dash-board {
        min-height: 0;
    }
}

/* Packed board: widgets reflow instead of clipping when the window is restored. */
.home-dashboard[data-flow="two"] .home-dash-widget,
.home-dashboard[data-flow="one"] .home-dash-widget {
    overflow: visible;
}

.home-dashboard[data-flow="two"] .home-dash-widget[data-widget-type="hero-ai-overview"],
.home-dashboard[data-flow="one"] .home-dash-widget[data-widget-type="hero-ai-overview"],
.home-dashboard[data-flow="two"] .home-dash-widget[data-widget-type="hero-ai-overview"] > .home-dash-widget-body,
.home-dashboard[data-flow="one"] .home-dash-widget[data-widget-type="hero-ai-overview"] > .home-dash-widget-body {
    overflow: hidden;
    border-radius: var(--home-dash-ai-radius, 14px);
}

.home-dashboard[data-flow="two"] .home-dash-widget-body,
.home-dashboard[data-flow="one"] .home-dash-widget-body {
    overflow: visible;
    justify-content: flex-start;
}

.home-dashboard[data-flow="two"] .home-dash-edge,
.home-dashboard[data-flow="one"] .home-dash-edge {
    display: none;
}

.home-dashboard[data-flow="two"] .home-dash-stat-label,
.home-dashboard[data-flow="one"] .home-dash-stat-label,
.home-dashboard[data-flow="two"] .home-dash-vpn-label,
.home-dashboard[data-flow="one"] .home-dash-vpn-label,
.home-dashboard[data-flow="two"] .home-dash-vpn-meta,
.home-dashboard[data-flow="one"] .home-dash-vpn-meta,
.home-dashboard[data-flow="two"] .home-dash-tool span,
.home-dashboard[data-flow="one"] .home-dash-tool span,
.home-dashboard[data-flow="two"] .home-dash-clock-time,
.home-dashboard[data-flow="one"] .home-dash-clock-time,
.home-dashboard[data-flow="two"] .home-dash-clock-date,
.home-dashboard[data-flow="one"] .home-dash-clock-date {
    overflow: visible;
    text-overflow: unset;
    white-space: normal;
}

.home-dashboard[data-flow="two"] .home-dash-stat-grid,
.home-dashboard[data-flow="one"] .home-dash-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: auto;
}

.home-dashboard[data-flow="two"] .home-dash-tools,
.home-dashboard[data-flow="one"] .home-dash-tools {
    grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
    grid-auto-rows: minmax(44px, auto);
    width: 100%;
}

.home-dashboard[data-flow="one"] .home-dash-tools {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}

.home-dashboard[data-flow="two"] .home-dash-tool span,
.home-dashboard[data-flow="one"] .home-dash-tool span {
    display: inline !important;
}

.home-dashboard[data-flow="two"] .home-dash-widget[data-widget-type="tools"] > .home-dash-widget-body,
.home-dashboard[data-flow="one"] .home-dash-widget[data-widget-type="tools"] > .home-dash-widget-body,
.home-dashboard[data-flow="two"] .home-dash-widget[data-widget-type="security"] > .home-dash-widget-body,
.home-dashboard[data-flow="one"] .home-dash-widget[data-widget-type="security"] > .home-dash-widget-body {
    overflow: visible;
    align-items: stretch;
}

.home-dashboard[data-flow="two"] .home-dash-hero-slot .home-tagline,
.home-dashboard[data-flow="one"] .home-dash-hero-slot .home-tagline {
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
}

.home-dashboard[data-flow="one"] .home-dash-widget[data-widget-type="hero-search"] > .home-dash-widget-body,
.home-dashboard[data-flow="two"] .home-dash-widget[data-widget-type="hero-search"] > .home-dash-widget-body {
    overflow: visible;
}

.proxy-powerup-popup {
    min-width: 320px;
    width: 400px;
    max-width: calc(100vw - 16px);
    max-height: min(620px, calc(100vh - 24px));
    padding: 0;
    background: #202124;
    color: #e8eaed;
}

.proxy-popup-status {
    flex-shrink: 0;
    font-size: 12px;
    padding: 0 14px 8px;
    color: #c4c7cc;
}

.proxy-popup-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 0 12px 12px;
    overflow: auto;
    min-height: 0;
    flex: 1;
}

.proxy-popup-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #9aa0a6;
}

.proxy-popup-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.proxy-popup-chip {
    border: 1px solid #3c4043;
    background: #2b2d31;
    color: #e8eaed;
    font: inherit;
    font-size: 12px;
    line-height: 1.2;
    padding: 6px 10px;
    border-radius: 999px;
    cursor: pointer;
}

.proxy-popup-chip.is-on {
    background: #6d28d9;
    border-color: #7c3aed;
    color: #ffffff;
}

.proxy-popup-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 12px;
}

.proxy-popup-row input[type="number"],
.proxy-popup-add input,
.proxy-popup-add textarea {
    flex: 1;
    min-width: 0;
    border-radius: 8px;
    border: 1px solid #3c4043;
    background: #2b2d31;
    color: #e8eaed;
    font: inherit;
    font-size: 12px;
    padding: 6px 8px;
}

.proxy-popup-add input::placeholder,
.proxy-popup-add textarea::placeholder {
    color: #9aa0a6;
}

.proxy-popup-footer {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px 12px;
    border-top: 1px solid #3c4043;
    background: #202124;
}

.proxy-popup-feedback {
    min-height: 34px;
    font-size: 12px;
    line-height: 1.35;
    color: #e8eaed;
    background: #2b2d31;
    border: 1px solid #3c4043;
    border-radius: 8px;
    padding: 8px 10px;
}

.proxy-popup-feedback.is-busy {
    color: #fde68a;
    border-color: #a16207;
    background: #3f3a1f;
}

.proxy-popup-feedback.is-ok {
    color: #bbf7d0;
    border-color: #166534;
    background: #14532d;
}

.proxy-popup-feedback.is-error {
    color: #fecaca;
    border-color: #991b1b;
    background: #7f1d1d;
}

.proxy-popup-actions {
    display: flex;
    gap: 8px;
}

.proxy-popup-btn {
    border: 1px solid #3c4043;
    background: #3c4043;
    color: #e8eaed;
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    padding: 8px 12px;
    border-radius: 8px;
    cursor: pointer;
}

.proxy-popup-btn:hover {
    background: #4a4e52;
}

.proxy-popup-btn-small {
    padding: 4px 8px;
    font-weight: 500;
}

.proxy-popup-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 160px;
    overflow: auto;
}

.proxy-popup-empty {
    font-size: 12px;
    line-height: 1.4;
    color: #e8eaed;
    background: #2b2d31;
    border: 1px dashed #5f6368;
    border-radius: 10px;
    padding: 12px 10px;
}

.proxy-popup-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid #3c4043;
    border-radius: 10px;
    background: #2b2d31;
}

.proxy-popup-item.is-selected {
    border-color: #7c3aed;
    background: #3b2463;
}

.proxy-popup-item-name {
    font-size: 12px;
    font-weight: 600;
}

.proxy-popup-item-meta {
    font-size: 11px;
    color: #c4c7cc;
}

.proxy-popup-using {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #ddd6fe;
}

.proxy-popup-item-actions {
    display: flex;
    gap: 6px;
}

.proxy-popup-add {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.proxy-popup-add-title {
    font-size: 12px;
    font-weight: 600;
}

.proxy-popup-add-grid {
    display: grid;
    grid-template-columns: 1fr 72px;
    gap: 6px;
}

.proxy-popup-add-grid #proxy-pop-label {
    grid-column: 1 / -1;
}

.proxy-powerup-settings .proxy-add-grid,
.proxy-powerup-settings .proxy-endpoint-list {
    display: grid;
    gap: 8px;
}

.proxy-powerup-settings .proxy-add-grid {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    margin: 8px 0 16px;
}

.proxy-endpoint-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid color-mix(in srgb, var(--ui-border, #3a3a4a) 80%, transparent);
    border-radius: 10px;
}

.proxy-endpoint-row .proxy-endpoint-actions {
    display: flex;
    gap: 6px;
}

.pwa-app-title {
    display: none;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex: 1 1 auto;
    -webkit-app-region: drag;
    pointer-events: none;
}

.pwa-app-icon {
    width: 18px;
    height: 18px;
    border-radius: 4px;
    object-fit: cover;
    flex: 0 0 auto;
}

.pwa-app-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--ui-text, #e8e8ee);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

html.pwa-app-window .pwa-app-title,
body.pwa-app-window .pwa-app-title {
    display: flex !important;
}

html.pwa-app-window .glass-title-section {
    flex: 1 1 auto !important;
    max-width: none !important;
}

html.pwa-app-window #home-logo-btn,
html.pwa-app-window #pinned-group-bar,
html.pwa-app-window .tabs-container,
html.pwa-app-window #tab-strip-scroll-left,
html.pwa-app-window #tab-strip-scroll-right,
html.pwa-app-window .tab-strip-drag-region,
html.pwa-app-window .new-tab-btn,
html.pwa-app-window #bookmarks-bar,
html.pwa-app-window #wayback-timeline-bar,
html.pwa-app-window #chrome-tools-dock,
html.pwa-app-window .address-bar-container,
html.pwa-app-window .address-bar-side-gap,
html.pwa-app-window #home-btn,
html.pwa-app-window .status-bar,
html.pwa-app-window #toolbar-overflow,
html.pwa-app-window .stealth-logo-item,
html.pwa-app-window .account-item,
html.pwa-app-window .layout-item,
html.pwa-app-window .top-bar > [data-toolbar-item]:not([data-toolbar-item="back"]):not([data-toolbar-item="forward"]):not([data-toolbar-item="reload"]):not([data-toolbar-item="menu"]),
html.pwa-app-window #menu-install-app {
    display: none !important;
}

html.pwa-app-window .glass-titlebar {
    -webkit-app-region: drag;
}

html.pwa-app-window .glass-window-controls,
html.pwa-app-window .glass-window-controls * {
    -webkit-app-region: no-drag;
}

html.pwa-app-window .top-bar {
    -webkit-app-region: no-drag;
}

/* Installed web app windows expose only app identity and native window controls. */
html.pwa-app-window,
html.pwa-app-window body {
    --pwa-titlebar-height: 40px;
    background: var(--pwa-titlebar-color, #17171d) !important;
}

html.pwa-app-window body .glass-titlebar {
    position: fixed !important;
    inset: 0 0 auto 0 !important;
    width: 100% !important;
    height: var(--pwa-titlebar-height) !important;
    min-height: var(--pwa-titlebar-height) !important;
    max-height: var(--pwa-titlebar-height) !important;
    padding: 0 8px 0 12px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    overflow: hidden !important;
    background: var(--pwa-titlebar-color, #17171d) !important;
    color: var(--pwa-titlebar-foreground, #ffffff) !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--pwa-titlebar-foreground, #ffffff) 18%, transparent) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    pointer-events: auto !important;
    -webkit-app-region: drag !important;
}

html.pwa-app-window body .glass-titlebar > :not(.glass-title-section):not(.glass-window-controls) {
    display: none !important;
}

html.pwa-app-window body .glass-title-section {
    display: flex !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: 100% !important;
    align-items: center !important;
    order: 1 !important;
    color: inherit !important;
    pointer-events: none !important;
    -webkit-app-region: drag !important;
}

html.pwa-app-window body .pwa-app-title {
    display: flex !important;
    min-width: 0 !important;
    color: inherit !important;
}

html.pwa-app-window body .pwa-app-name {
    color: inherit !important;
}

html.pwa-app-window body .glass-window-controls {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    flex: 0 0 auto !important;
    align-self: center !important;
    order: 2 !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    pointer-events: auto !important;
    -webkit-app-region: no-drag !important;
}

html.pwa-app-window body .glass-window-controls::before {
    display: none !important;
    content: none !important;
}

html.pwa-app-window body .glass-control-btn {
    color: var(--pwa-titlebar-foreground, #ffffff) !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

html.pwa-app-window body .glass-control-btn:hover {
    background: color-mix(in srgb, var(--pwa-titlebar-foreground, #ffffff) 14%, transparent) !important;
}

html.pwa-app-window body .glass-control-btn.glass-close:hover {
    color: #ffffff !important;
    background: #e81123 !important;
}

html.pwa-app-window body .top-bar,
html.pwa-app-window body #status-bar,
html.pwa-app-window body .status-bar,
html.pwa-app-window body #bookmarks-bar,
html.pwa-app-window body #wayback-timeline-bar,
html.pwa-app-window body #chrome-tools-dock,
html.pwa-app-window body .browser-sidebar,
html.pwa-app-window body #playlist-sidebar,
html.pwa-app-window body #audio-sidebar,
html.pwa-app-window body #adblock-breakdown-sidebar,
html.pwa-app-window body #tor-circuit-sidebar,
html.pwa-app-window body #ai-side-dock,
html.pwa-app-window body #minimal-url-bubble {
    display: none !important;
}

html.pwa-app-window body .browser-container,
html.pwa-app-window body .browser-container.bottom-layout,
html.pwa-app-window body .browser-container.chrome-layout-tabs-top-url-bottom,
html.pwa-app-window body .browser-container.chrome-layout-url-top-tabs-bottom,
html.pwa-app-window body .browser-container.chrome-layout-tools-dock {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

html.pwa-app-window body .browser-container::before,
html.pwa-app-window body .browser-container::after {
    display: none !important;
    content: none !important;
}

html.pwa-app-window body .browser-container .web-content,
html.pwa-app-window body .browser-container.bottom-layout .web-content,
html.pwa-app-window body .browser-container.chrome-layout-tabs-top-url-bottom .web-content,
html.pwa-app-window body .browser-container.chrome-layout-url-top-tabs-bottom .web-content,
html.pwa-app-window body .browser-container.chrome-layout-tools-dock .web-content {
    position: absolute !important;
    inset: var(--pwa-titlebar-height) 0 0 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: calc(100% - var(--pwa-titlebar-height)) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    z-index: 1 !important;
}

html.cef-native-content.pwa-app-window body .browser-container .web-content,
html.cef-native-content.pwa-app-window body.pwa-app-window .browser-container .web-content {
    top: var(--pwa-titlebar-height) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    height: calc(100% - var(--pwa-titlebar-height)) !important;
}

html.pwa-app-window body #welcome-screen {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

