:root { --dsh-desktop-titlebar-h: 36px; } * { box-sizing: border-box; } html, body { margin: 0; } html.dsh-desktop-offset { box-sizing: border-box; padding-top: var(--dsh-desktop-titlebar-h); } #dsh-desktop-titlebar { position: fixed; top: 0; left: 0; right: 0; height: var(--dsh-desktop-titlebar-h); z-index: 2147483646; display: flex; align-items: center; padding: 0 12px; box-sizing: border-box; background: rgba(246, 246, 248, 0.92); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); border-bottom: 0.5px solid rgba(0, 0, 0, 0.06); user-select: none; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif; } #dsh-desktop-titlebar .traffic { display: flex; gap: 8px; align-items: center; height: 100%; } #dsh-desktop-titlebar .tl { width: 12px; height: 12px; min-width: 12px; min-height: 12px; max-width: 12px; max-height: 12px; flex: none; overflow: hidden; box-sizing: border-box; border-radius: 50%; border: 0; padding: 0; margin: 0; display: grid; place-items: center; cursor: default; position: relative; } #dsh-desktop-titlebar .tl.close { background: #ff5f57; } #dsh-desktop-titlebar .tl.min { background: #febc2e; } #dsh-desktop-titlebar .tl.zoom { background: #28c840; } #dsh-desktop-titlebar .tl::after { content: ""; font-size: 9px; line-height: 1; font-weight: 700; color: rgba(0,0,0,0.55); opacity: 0; } #dsh-desktop-titlebar .traffic:hover .tl.close::after { content: "×"; opacity: 1; } #dsh-desktop-titlebar .traffic:hover .tl.min::after { content: "–"; opacity: 1; } #dsh-desktop-titlebar .traffic:hover .tl.zoom::after { content: "+"; opacity: 1; } #dsh-desktop-titlebar .drag { flex: 1; height: 100%; } #dsh-desktop-titlebar .more { appearance: none; border: 0; background: transparent; color: rgba(0,0,0,0.35); font-size: 15px; letter-spacing: 0.08em; width: 28px; height: 20px; border-radius: 6px; cursor: default; } #dsh-desktop-titlebar .more:hover, #dsh-desktop-titlebar .more.open { background: rgba(0,0,0,0.06); color: rgba(0,0,0,0.7); } #dsh-desktop-titlebar .menu { position: absolute; top: calc(var(--dsh-desktop-titlebar-h) + 2px); left: 8px; min-width: 168px; padding: 4px; border-radius: 10px; background: rgba(255,255,255,0.96); box-shadow: 0 8px 28px rgba(0,0,0,0.16); display: none; flex-direction: column; } #dsh-desktop-titlebar .menu.open { display: flex; } #dsh-desktop-titlebar .menu button { appearance: none; border: 0; background: transparent; text-align: left; padding: 7px 10px; border-radius: 6px; font: 13px/1.3 -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif; color: #1d1d1f; cursor: default; } #dsh-desktop-titlebar .menu button:hover { background: rgba(0,0,0,0.05); }