/* Mini World Map — shared 3D/radial view, control panels, and overlays */ .galaxy-view-content { padding: 0; overflow: hidden; position: relative; } .galaxy-view-canvas { position: absolute; inset: 0; } .galaxy-view-canvas:focus { outline: none; } /* ---------- 控制面板 ---------- */ .galaxy-panel { position: absolute; top: 10px; left: 10px; z-index: 12; width: min(360px, calc(100vw - 20px)); border-radius: 8px; font-size: 12px; user-select: none; max-height: calc(100% - 20px); overflow: hidden; display: flex; flex-direction: column; background: var(--mwm-panel-bg, var(--background-secondary)); border: 1px solid var(--mwm-panel-border, var(--background-modifier-border)); color: var(--mwm-panel-text, var(--text-normal)); box-shadow: var(--mwm-panel-shadow, var(--shadow-s)); } .galaxy-panel.gx-theme-space { --background-primary: rgba(8, 12, 27, 0.92); --background-secondary: rgba(3, 6, 18, 0.88); --background-modifier-border: rgba(154, 164, 255, 0.18); --background-modifier-hover: rgba(127, 155, 255, 0.1); --background-modifier-active-hover: rgba(127, 155, 255, 0.18); --interactive-accent: #7c9cff; --text-normal: #e8ecf6; --text-muted: #aeb8d0; --text-on-accent: #080b18; --mwm-panel-bg: rgba(3, 6, 18, 0.88); --mwm-panel-border: rgba(154, 164, 255, 0.18); --mwm-panel-text: #e8ecf6; --mwm-panel-shadow: 0 18px 42px rgba(0, 0, 3, 0.42); backdrop-filter: blur(16px); } .galaxy-panel.gx-theme-dark { --background-primary: rgba(37, 37, 37, 0.95); --background-secondary: rgba(30, 30, 30, 0.94); --background-modifier-border: rgba(255, 255, 255, 0.12); --background-modifier-hover: rgba(255, 255, 255, 0.08); --background-modifier-active-hover: rgba(255, 255, 255, 0.14); --interactive-accent: #8b7cf6; --text-normal: #f8fafc; --text-muted: #a8adb7; --text-on-accent: #ffffff; --mwm-panel-bg: rgba(30, 30, 30, 0.94); --mwm-panel-border: rgba(255, 255, 255, 0.12); --mwm-panel-text: #f8fafc; --mwm-panel-shadow: 0 14px 34px rgba(0, 0, 0, 0.34); } .galaxy-panel.gx-theme-night { --background-primary: rgba(37, 37, 37, 0.95); --background-secondary: rgba(30, 30, 30, 0.94); --background-modifier-border: rgba(255, 255, 255, 0.12); --background-modifier-hover: rgba(255, 255, 255, 0.08); --background-modifier-active-hover: rgba(255, 255, 255, 0.14); --interactive-accent: #8b7cf6; --text-normal: #f8fafc; --text-muted: #a8adb7; --text-on-accent: #ffffff; --mwm-panel-bg: rgba(30, 30, 30, 0.94); --mwm-panel-border: rgba(255, 255, 255, 0.12); --mwm-panel-text: #f8fafc; --mwm-panel-shadow: 0 14px 34px rgba(0, 0, 0, 0.34); backdrop-filter: blur(14px); } .galaxy-panel.gx-theme-light { --background-primary: rgba(255, 252, 245, 0.88); --background-secondary: rgba(246, 244, 239, 0.94); --background-modifier-border: rgba(46, 42, 36, 0.16); --background-modifier-hover: rgba(46, 42, 36, 0.07); --background-modifier-active-hover: rgba(46, 42, 36, 0.12); --interactive-accent: #3f7fe8; --text-normal: #2e2a24; --text-muted: #70685f; --text-on-accent: #ffffff; --mwm-panel-bg: rgba(246, 244, 239, 0.94); --mwm-panel-border: rgba(46, 42, 36, 0.16); --mwm-panel-text: #2e2a24; --mwm-panel-shadow: 0 14px 34px rgba(46, 42, 36, 0.14); backdrop-filter: blur(14px); } .galaxy-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; } .galaxy-panel-stats { font-family: var(--font-monospace); font-size: 11px; opacity: 0.75; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .galaxy-panel-collapse { flex-shrink: 0; width: 22px; height: 22px; padding: 0; line-height: 1; background: transparent; border: 1px solid currentColor; color: inherit; opacity: 0.6; border-radius: 6px; cursor: pointer; box-shadow: none; } .galaxy-panel-body { padding: 0 10px 10px; overflow-y: auto; min-height: 0; scrollbar-gutter: stable; } .galaxy-panel-body.is-hidden { display: none; } .galaxy-panel-section { margin-top: 4px; } .galaxy-panel-section-title { font-size: 11px; font-weight: 600; opacity: 0.55; letter-spacing: 0.05em; margin: 8px 0 2px; } .galaxy-panel-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(108px, 1fr)); gap: 6px; margin-top: 10px; align-items: stretch; } .galaxy-panel-row button { display: inline-flex; align-items: center; justify-content: center; min-height: 28px; font-size: 11px; line-height: 1.2; padding: 5px 8px; background: var(--background-modifier-hover); border: 1px solid var(--background-modifier-border); color: inherit; border-radius: 6px; cursor: pointer; box-shadow: none; min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: break-word; } .galaxy-panel-row button:hover { background: var(--background-modifier-active-hover); } .galaxy-panel-dev { margin-top: 10px; border-top: 1px solid rgba(127, 127, 127, 0.2); padding-top: 6px; } .galaxy-panel-dev summary { font-size: 11px; opacity: 0.6; cursor: pointer; } .galaxy-panel-help { margin-top: 6px; display: flex; flex-direction: column; gap: 3px; font-size: 11px; opacity: 0.8; } /* ---------- Lightroom 式滑杆 ---------- */ .gx-slider { padding: 4px 0 2px; } .gx-slider-head { display: flex; justify-content: space-between; align-items: baseline; } .gx-slider-label { opacity: 0.85; } .gx-slider-value { font-family: var(--font-monospace); font-size: 11px; opacity: 0.9; } .gx-slider-value.is-default { opacity: 0.45; } .gx-slider-track { position: relative; height: 18px; cursor: ew-resize; touch-action: none; } .gx-slider-rail { position: absolute; left: 0; right: 0; top: 8px; height: 2px; border-radius: 1px; background: currentColor; opacity: 0.18; } .gx-slider-fill { position: absolute; top: 8px; height: 2px; border-radius: 1px; background: var(--interactive-accent); } .gx-theme-light .gx-slider-fill { background: var(--interactive-accent); } .gx-slider-notch { position: absolute; left: 50%; top: 4px; width: 1.5px; height: 10px; margin-left: -0.75px; background: currentColor; opacity: 0.4; } .gx-slider-thumb { position: absolute; top: 4px; width: 10px; height: 10px; margin-left: -5px; border-radius: 50%; background: var(--background-primary); border: 1.5px solid var(--interactive-accent); pointer-events: none; } .gx-theme-light .gx-slider-thumb { background: var(--background-primary); border-color: var(--interactive-accent); } .gx-slider-bounds { display: flex; justify-content: space-between; font-family: var(--font-monospace); font-size: 9px; opacity: 0.38; margin-top: -2px; } /* ---------- 浮层:标签与卡片 ---------- */ .gx-overlay { position: absolute; inset: 0; z-index: 8; pointer-events: none; overflow: hidden; } .gx-label { position: absolute; top: 0; left: 0; z-index: 1; transform: translate3d(-1000px, -1000px, 0); translate: -50% -100%; font-size: 11px; white-space: nowrap; color: #dbe2f2; text-shadow: 0 0 6px rgba(0, 0, 6, 0.95); transition: opacity 150ms ease; } .gx-daylight .gx-label { color: #1f2933; text-shadow: 0 0 6px rgba(246, 244, 239, 0.95); } .gx-label-hover, .gx-label-neighbor { font-size: 11px; } .gx-label-hover { font-size: 13px; font-weight: 600; } .gx-card { position: absolute; top: 0; left: 0; z-index: 6; /* 卡片永远盖住浮层标签(G2 bug 修复) */ width: 280px; transform: translate3d(-1000px, -1000px, 0); pointer-events: auto; border-radius: 10px; padding: 12px 14px; font-size: 12px; background: rgba(10, 14, 24, 0.78); backdrop-filter: blur(16px); border: 1px solid rgba(255, 255, 255, 0.08); color: #e8ecf6; } .gx-daylight .gx-card { background: rgba(252, 250, 245, 0.88); border: 1px solid rgba(31, 41, 51, 0.14); color: #1f2933; } .gx-card-title { font-size: 15px; font-weight: 600; margin-bottom: 4px; } .gx-card-meta { display: flex; align-items: center; gap: 6px; font-size: 11px; opacity: 0.7; } .gx-card-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; } .gx-card-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; } .gx-card-tag { font-size: 10px; padding: 1px 7px; border-radius: 8px; background: rgba(127, 155, 255, 0.18); border: 1px solid rgba(127, 155, 255, 0.3); } .gx-card-stats { margin-top: 8px; font-size: 11px; opacity: 0.75; } .gx-card-snippet { margin-top: 6px; font-size: 11px; line-height: 1.5; opacity: 0.65; max-height: 50px; overflow: hidden; } .gx-card-actions { display: flex; gap: 6px; margin-top: 10px; } .gx-card-actions button { flex: 1; font-size: 11px; padding: 3px 8px; background: rgba(127, 127, 127, 0.12); border: 1px solid rgba(127, 127, 127, 0.25); color: inherit; border-radius: 6px; cursor: pointer; box-shadow: none; } .gx-search-path { font-size: 11px; color: var(--text-muted); } /* ---------- 开场遮罩 ---------- */ .gx-mask { position: absolute; inset: 0; z-index: 20; background: #000003; display: flex; align-items: center; justify-content: center; transition: opacity 600ms ease; } .gx-mask.is-fading { opacity: 0; pointer-events: none; } .gx-mask-text { color: #aeb8d0; font-size: 13px; letter-spacing: 0.3em; animation: gx-pulse 1.6s ease-in-out infinite; } @keyframes gx-pulse { 0%, 100% { opacity: 0.35; } 50% { opacity: 0.9; } } /* ---------- 风格预设 chips 与折叠分区(面板 v3) ---------- */ .gx-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; } .gx-chip { flex: 1 1 72px; font-size: 11px; line-height: 1.2; padding: 5px 7px; border-radius: 6px; background: var(--background-modifier-hover); border: 1px solid var(--background-modifier-border); color: inherit; cursor: pointer; box-shadow: none; white-space: normal; overflow-wrap: anywhere; } .gx-chip:hover { background: var(--background-modifier-active-hover); } .gx-chip.is-active { background: var(--interactive-accent); border-color: var(--interactive-accent); color: var(--text-on-accent); } .gx-section { margin-top: 8px; border-top: 1px solid rgba(127, 127, 127, 0.16); padding-top: 4px; } .gx-section > summary { font-size: 11px; font-weight: 600; opacity: 0.6; letter-spacing: 0.05em; cursor: pointer; list-style: none; display: flex; align-items: center; gap: 4px; } .gx-section > summary::before { content: '▸'; font-size: 9px; transition: transform 120ms ease; } .gx-section[open] > summary::before { transform: rotate(90deg); } .gx-section-body { padding-top: 2px; } .gx-theme-select { width: 100%; margin-top: 8px; font-size: 11px; padding: 5px 6px; border-radius: 6px; background: var(--background-modifier-hover); border: 1px solid var(--background-modifier-border); color: inherit; cursor: pointer; } .gx-theme-select option { color: var(--text-normal); background: var(--background-primary); } /* ---------- M4 移动端 ---------- */ /* .gx-mobile .gx-card 比 .gx-card 更具体 → 靠选择器特异性覆盖 left/top/transform (JS 已在移动端清掉内联 transform,见 OverlayManager.setSelection) */ .gx-mobile .gx-card { left: 8px; right: 8px; top: auto; /* 自适应:实测 navbar 重叠(--gx-bottom-inset)与 iPhone 横条安全区取大者 */ bottom: calc(10px + max(var(--gx-bottom-inset, 0px), env(safe-area-inset-bottom, 0px))); width: auto; max-height: 40vh; overflow-y: auto; transform: none; } .gx-mask-btn { font-size: 13px; padding: 8px 18px; border-radius: 8px; background: rgba(127, 155, 255, 0.2); border: 1px solid rgba(127, 155, 255, 0.5); color: #e8ecf6; cursor: pointer; } /* ---------- Mini World Map shared / radial mode ---------- */ .mini-world-map-view { padding: 0; overflow: hidden; position: relative; background: var(--background-primary); color: var(--text-normal); } .mini-world-map-view.is-day-scheme { --mwm-radial-bg: #f8fafc; --mwm-radial-text: #172033; --mwm-radial-label: #172033; --mwm-radial-label-root: #3f7fe8; --mwm-radial-label-shadow: rgba(255, 255, 255, 0.92); --mwm-legend-root-color: #3f7fe8; --mwm-legend-folder-color: #7f92a8; --mwm-legend-meta-color: #4f8ecb; --mwm-legend-note-color: #a2abb7; --mwm-legend-external-color: #7b6fd6; --mwm-legend-unresolved-color: #dc4a4a; --mwm-legend-tree-color: #93a3b8; --mwm-legend-link-color: #a2acba; --mwm-legend-external-link-color: #b8752e; --mwm-floating-bg: rgba(255, 255, 255, 0.82); --mwm-floating-border: rgba(23, 32, 51, 0.14); --mwm-floating-color: #172033; } .mini-world-map-view.is-night-scheme, .theme-dark .mini-world-map-view:not(.is-day-scheme) { --mwm-radial-bg: #1e1e1e; --mwm-radial-text: #f8fafc; --mwm-radial-label: #f8fafc; --mwm-radial-label-root: #7c9cff; --mwm-radial-label-shadow: rgba(0, 0, 0, 0.92); --mwm-legend-root-color: #7c9cff; --mwm-legend-folder-color: #d7dae2; --mwm-legend-meta-color: #f59e0b; --mwm-legend-note-color: #a1a8b5; --mwm-legend-external-color: #c4b5fd; --mwm-legend-unresolved-color: #fb7185; --mwm-legend-tree-color: #818cf8; --mwm-legend-link-color: #94a3b8; --mwm-legend-external-link-color: #d97706; --mwm-floating-bg: rgba(10, 14, 24, 0.64); --mwm-floating-border: rgba(255, 255, 255, 0.12); --mwm-floating-color: #e8ecf6; } .mwm-boot-status { position: absolute; left: 12px; bottom: 12px; z-index: 40; max-width: min(420px, calc(100% - 24px)); padding: 6px 8px; border: 1px solid rgba(31, 41, 55, 0.16); border-radius: 6px; background: rgba(255, 255, 255, 0.9); color: #1f2937; font-family: var(--font-monospace); font-size: 11px; line-height: 1.35; pointer-events: none; box-shadow: 0 8px 24px rgba(15, 23, 42, 0.16); } .theme-dark .mwm-boot-status, .mini-world-map-view.is-night-scheme .mwm-boot-status { border-color: rgba(255, 255, 255, 0.14); background: rgba(15, 23, 42, 0.82); color: #f8fafc; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3); } .mwm-radial-host { position: absolute; inset: 0; overflow: hidden; background: var(--mwm-radial-bg, #0f1117); cursor: grab; touch-action: none; } .mwm-radial-host.is-pointing { cursor: pointer; } .mwm-radial-canvas { display: block; width: 100%; height: 100%; } .mwm-radial-labels { position: absolute; inset: 0; pointer-events: none; z-index: 4; overflow: hidden; } .mwm-radial-label { position: absolute; top: 0; left: 0; translate: -50% 0; max-width: 160px; padding: 0 3px; color: var(--mwm-radial-label, #f8fafc); font-family: var(--font-interface, system-ui), -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 12px; line-height: 1.17; text-align: center; text-shadow: 0 1px 4px var(--mwm-radial-label-shadow, rgba(0, 0, 0, 0.92)); white-space: normal; overflow: visible; overflow-wrap: anywhere; text-overflow: clip; } .mwm-radial-label.is-root { font-weight: 600; color: var(--mwm-radial-label-root, #aab6ff); } .mwm-radial-label.is-strong { font-weight: 600; } .mwm-radial-label.is-dim { opacity: 0.38; } .galaxy-mode-row, .mwm-panel-tabs, .mwm-floating-controls { display: flex; flex-wrap: wrap; gap: 6px; } .galaxy-mode-row { margin: 0; } .mwm-mode-switch { padding: 8px; margin: 4px 0 10px; border: 1px solid var(--background-modifier-border); border-radius: 8px; background: var(--background-primary); } .mwm-mode-switch-label { margin-bottom: 6px; color: var(--text-muted); font-size: 10px; font-weight: 600; line-height: 1.2; text-transform: uppercase; } .mwm-mode-row { flex-wrap: nowrap; gap: 4px; padding: 3px; border-radius: 7px; background: var(--background-secondary); } .mwm-mode-row button { flex: 1 1 0; min-width: 0; min-height: 32px; padding: 5px 7px; border: 0; border-radius: 5px; background: transparent; color: var(--text-muted); box-shadow: none; font-size: 11px; font-weight: 600; line-height: 1.2; white-space: normal; overflow-wrap: anywhere; cursor: pointer; } .mwm-mode-row button:hover { background: var(--background-modifier-hover); color: var(--text-normal); } .mwm-mode-row button.is-active { background: var(--interactive-accent); color: var(--text-on-accent); } .mwm-panel-settings { padding-top: 8px; border-top: 1px solid var(--background-modifier-border); } .mwm-panel-tabs { gap: 4px; display: grid; grid-template-columns: repeat(auto-fit, minmax(58px, 1fr)); } .mwm-panel-tabs button { min-height: 28px; font-size: 11px; line-height: 1.2; padding: 4px 7px; border: 1px solid var(--background-modifier-border); border-radius: 6px; background: transparent; color: inherit; cursor: pointer; box-shadow: none; min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: break-word; } .mwm-panel-tabs button.is-active, .galaxy-panel-row button.is-active { background: var(--interactive-accent); border-color: var(--interactive-accent); color: var(--text-on-accent); } .mwm-map-panel, .mwm-radial-panel { width: min(360px, calc(100vw - 20px)); color: var(--text-normal); } .mwm-panel-page { display: flex; flex-direction: column; gap: 8px; padding-top: 10px; } .mwm-panel-field, .mwm-panel-toggle { display: grid; grid-template-columns: minmax(88px, 0.42fr) minmax(0, 1fr); align-items: center; gap: 4px; font-size: 11px; } .mwm-panel-toggle { grid-template-columns: auto minmax(0, 1fr); justify-content: start; align-items: start; } .mwm-panel-field-stack { grid-template-columns: minmax(0, 1fr); } .mwm-panel-field > span, .mwm-panel-toggle > span { min-width: 0; line-height: 1.2; overflow-wrap: anywhere; } .mwm-panel-field input, .mwm-panel-field select, .mwm-panel-field textarea { min-width: 0; width: 100%; max-width: 100%; font-size: 11px; } .mwm-panel-field textarea { min-height: 72px; resize: vertical; } .mwm-panel-toggle input { flex: 0 0 auto; } .mwm-legend-item { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; gap: 8px; min-width: 0; padding: 6px 4px; border-radius: 6px; font-size: 11px; cursor: pointer; } .mwm-legend-item:hover { background: var(--background-modifier-hover); } .mwm-legend-item.is-muted { opacity: 0.52; } .mwm-legend-item input { margin: 0; } .mwm-legend-mark { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; flex: 0 0 18px; } .mwm-legend-mark::before { content: ""; display: block; width: 10px; height: 10px; border-radius: 999px; background: var(--mwm-legend-color, var(--text-muted)); box-shadow: 0 0 0 1px var(--background-modifier-border); } .mwm-legend-root { --mwm-legend-color: var(--mwm-legend-root-color); } .mwm-legend-folder { --mwm-legend-color: var(--mwm-legend-folder-color); } .mwm-legend-meta { --mwm-legend-color: var(--mwm-legend-meta-color); } .mwm-legend-note { --mwm-legend-color: var(--mwm-legend-note-color); } .mwm-legend-external, .mwm-legend-outside-file { --mwm-legend-color: var(--mwm-legend-external-color); } .mwm-legend-unresolved { --mwm-legend-color: var(--mwm-legend-unresolved-color); } .mwm-legend-outside-file::before { background: transparent; box-shadow: 0 0 0 2px var(--mwm-legend-color); } .mwm-legend-tree::before, .mwm-legend-link::before, .mwm-legend-link-external::before, .mwm-legend-link-unresolved::before { width: 18px; height: 0; border-radius: 0; background: transparent; box-shadow: none; border-top: 2px solid var(--mwm-legend-color, var(--text-muted)); } .mwm-legend-tree { --mwm-legend-color: var(--mwm-legend-tree-color); } .mwm-legend-link { --mwm-legend-color: var(--mwm-legend-link-color); } .mwm-legend-link-external { --mwm-legend-color: var(--mwm-legend-external-link-color); } .mwm-legend-link-unresolved { --mwm-legend-color: var(--mwm-legend-unresolved-color); } .mwm-legend-link-unresolved::before { border-top-style: dashed; } .mwm-legend-copy { display: grid; min-width: 0; gap: 1px; } .mwm-legend-label, .mwm-legend-desc { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .mwm-legend-label { color: var(--text-normal); } .mwm-legend-desc { color: var(--text-muted); font-size: 10px; } .mwm-side-title { font-size: 14px; font-weight: 600; } .mwm-side-path, .mwm-side-muted, .mwm-pin-meta { color: currentColor; font-size: 11px; opacity: 0.68; overflow-wrap: anywhere; } .mwm-side-heading { margin-top: 4px; font-size: 11px; font-weight: 600; opacity: 0.72; } .mwm-pin-group { display: grid; gap: 6px; margin-top: 8px; } .mwm-pin-group-header { display: flex; align-items: center; gap: 6px; min-width: 0; } .mwm-pin-group-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; font-weight: 600; } .mwm-pin-count { flex: 0 0 auto; min-width: 18px; padding: 1px 5px; border-radius: 999px; background: var(--background-modifier-hover); font-size: 10px; line-height: 1.4; text-align: center; opacity: 0.72; } .mwm-facts { display: grid; grid-template-columns: minmax(72px, max-content) minmax(0, 1fr); gap: 4px 8px; font-size: 11px; } .mwm-facts span { min-width: 0; overflow-wrap: anywhere; } .mwm-facts span:nth-child(odd) { opacity: 0.58; } .mwm-link-row, .mwm-pin-main { width: 100%; max-width: 100%; min-height: 28px; padding: 5px 6px; border: 1px solid var(--background-modifier-border); border-radius: 6px; background: var(--background-modifier-hover); color: inherit; font-size: 11px; line-height: 1.25; text-align: left; cursor: pointer; box-shadow: none; white-space: normal; overflow-wrap: break-word; } .mwm-pin-row, .mwm-pin-group-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; } .mwm-pin-row.is-muted { opacity: 0.58; } .mwm-pin-row > button:not(.mwm-pin-main), .mwm-pin-group-row > button, .mwm-pin-group-header > button { flex: 0 0 auto; font-size: 10px; padding: 3px 5px; } .mwm-pin-main { flex: 1; flex-basis: 150px; min-width: 0; white-space: normal; overflow: hidden; } .mwm-pin-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .mwm-pin-meta { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .mwm-floating-controls { position: absolute; top: 10px; right: 10px; z-index: 9; justify-content: flex-end; max-width: min(220px, calc(100% - 20px)); } .mwm-floating-button { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 1px solid var(--mwm-floating-border, rgba(255, 255, 255, 0.12)); border-radius: 6px; background: var(--mwm-floating-bg, rgba(10, 14, 24, 0.64)); backdrop-filter: blur(14px); color: var(--mwm-floating-color, #e8ecf6); cursor: pointer; box-shadow: none; } .mwm-floating-button svg { width: 16px; height: 16px; } .mwm-radial-host.is-radial-preparing .mwm-radial-canvas, .mwm-radial-host.is-radial-preparing .mwm-radial-labels { opacity: 0; visibility: hidden; } .mwm-radial-loading { position: absolute; left: 50%; top: 50%; z-index: 11; translate: -50% -50%; color: var(--mwm-radial-label, #aeb8d0); text-shadow: 0 1px 6px var(--mwm-radial-label-shadow, rgba(0, 0, 0, 0.92)); transition: opacity 220ms ease; pointer-events: none; } .mwm-radial-loading.is-fading { opacity: 0; }