/* sghgjos 1.0.1 — desktop shell (boot / menubar / windows / dock / spotlight) */
:root {
  --menubar-h: 24px;
  --menubar-fg: #fff;
  --menubar-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
  --accent: #0a84ff;
  --traffic-r: #ff5f57;
  --traffic-y: #febc2e;
  --traffic-g: #28c840;
  --win-radius: 10px;
  --glass: rgba(246, 246, 248, 0.78);
  --glass-border: rgba(255, 255, 255, 0.35);
  --glass-solid: rgba(246, 246, 248, 0.92);
  --panel-bg: rgba(246, 246, 248, 0.92);
  --panel-border: rgba(0, 0, 0, 0.14);
  --panel-shadow: 0 14px 44px rgba(0, 0, 0, 0.28);
  --surface: #f5f5f7;
  --surface-2: #ebebed;
  --titlebar-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.18));
  --titlebar-active-bg: linear-gradient(180deg, #f7f7f9, #ebebed);
  --titlebar-border: rgba(0, 0, 0, 0.08);
  --body-bg: #fff;
  --input-bg: rgba(255, 255, 255, 0.85);
  --input-border: rgba(0, 0, 0, 0.12);
  --divider: rgba(0, 0, 0, 0.1);
  --text: #1d1d1f;
  --muted: #8e8e93;
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text",
    "Helvetica Neue", "PingFang SC", "Segoe UI", sans-serif;
  --mono: "SF Mono", ui-monospace, Menlo, Consolas, monospace;
  --dock-icon: 48px;
  --dock-h: 52px;
  --dock-bg: rgba(255, 255, 255, 0.55);
  --shadow-window: 0 5px 30px rgba(0, 0, 0, 0.3);
  --shadow-window-active: 0 8px 40px rgba(0, 0, 0, 0.4);
}

html.sghgjos-dark {
  --glass: rgba(40, 40, 42, 0.82);
  --glass-border: rgba(255, 255, 255, 0.12);
  --glass-solid: rgba(40, 40, 42, 0.92);
  --panel-bg: rgba(40, 40, 42, 0.92);
  --panel-border: rgba(255, 255, 255, 0.12);
  --panel-shadow: 0 14px 44px rgba(0, 0, 0, 0.5);
  --surface: #2c2c2e;
  --surface-2: #3a3a3c;
  --titlebar-bg: linear-gradient(180deg, rgba(70, 70, 72, 0.9), rgba(50, 50, 52, 0.85));
  --titlebar-active-bg: linear-gradient(180deg, #3a3a3c, #2c2c2e);
  --titlebar-border: rgba(255, 255, 255, 0.08);
  --body-bg: #1c1c1e;
  --input-bg: rgba(28, 28, 30, 0.9);
  --input-border: rgba(255, 255, 255, 0.14);
  --divider: rgba(255, 255, 255, 0.12);
  --text: #f5f5f7;
  --muted: #98989d;
  --dock-bg: rgba(40, 40, 42, 0.72);
}

/* Mobile / desktop visibility helpers */
.sghgjos-mobile-only {
  display: none !important;
}

.sghgjos-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  height: 100%;
  height: 100dvh;
  min-height: -webkit-fill-available;
  overflow: hidden;
  overscroll-behavior: none;
  font-family: var(--font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: #000;
  color: var(--text);
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

button,
input,
textarea {
  font: inherit;
}

.sghgjos-desktop-page {
  height: 100%;
  height: 100dvh;
  min-height: -webkit-fill-available;
}

/* ===== Boot ===== */
.sghgjos-boot {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 32px;
  background: #000;
  color: #fff;
  transition: opacity 0.5s ease, visibility 0.5s;
}

.sghgjos-boot.is-done {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.sghgjos-boot-logo {
  animation: sghgjos-boot-breathe 2s ease-in-out infinite;
}

.sghgjos-boot-bar {
  width: 180px;
  height: 4px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.16);
  overflow: hidden;
}

.sghgjos-boot-bar i {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: #fff;
  transition: width 0.12s linear;
}

.sghgjos-boot-name {
  font-size: 12px;
  letter-spacing: 0.08em;
  opacity: 0.55;
  font-weight: 500;
}

@keyframes sghgjos-boot-breathe {
  0%,
  100% {
    opacity: 0.75;
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(1.03);
  }
}

/* 窗口内 / 手机首页：轻量加载条（复用开机条视觉，非全屏遮罩） */
.sghgjos-win-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 140px;
  width: 100%;
  height: 100%;
  padding: 24px;
  box-sizing: border-box;
  color: var(--text-secondary, rgba(0, 0, 0, 0.45));
}

.sghgjos-win-loading-bar {
  width: 140px;
  height: 3px;
  border-radius: 99px;
  background: rgba(128, 128, 128, 0.22);
  overflow: hidden;
}

.sghgjos-win-loading-bar i {
  display: block;
  height: 100%;
  width: 40%;
  border-radius: inherit;
  background: var(--sghgjos-accent, #0a84ff);
  animation: sghgjos-win-loading-slide 1s ease-in-out infinite;
}

.sghgjos-win-loading-text {
  font-size: 12px;
  letter-spacing: 0.04em;
  opacity: 0.75;
  font-weight: 500;
}

.sghgjos-window-body.is-refreshing {
  pointer-events: none;
}

.sghgjos-win-loading-overlay {
  position: absolute;
  inset: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(246, 246, 246, 0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.sghgjos-win-loading-overlay .sghgjos-win-loading {
  min-height: 0;
  height: auto;
}

html.sghgjos-dark .sghgjos-win-loading-overlay {
  background: rgba(28, 28, 30, 0.55);
}

html.sghgjos-dark .sghgjos-win-loading-bar {
  background: rgba(255, 255, 255, 0.14);
}

@keyframes sghgjos-win-loading-slide {
  0% {
    transform: translateX(-120%);
  }
  100% {
    transform: translateX(350%);
  }
}

#sghgjos-home-blog.is-refreshing,
#sghgjos-home-jike.is-refreshing {
  position: relative;
  pointer-events: none;
}

/* ===== Root / Wallpaper ===== */
.sghgjos-root {
  position: relative;
  width: 100%;
  height: 100%;
  height: var(--sghgjos-vvh, 100dvh);
  min-height: -webkit-fill-available;
  overflow: hidden;
  -webkit-touch-callout: none;
}

.sghgjos-wallpaper {
  position: absolute;
  inset: -2%;
  background-size: cover;
  background-position: center;
  transition: background-image 0.6s ease, filter 0.4s ease, transform 8s ease-out;
  will-change: transform;
}

.sghgjos-wallpaper.is-zooming {
  transform: scale(1.06);
}

.sghgjos-wallpaper.has-image {
  background-color: #111;
  background-repeat: no-repeat;
}

/* ===== Menubar ===== */
.sghgjos-menubar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9000;
  height: var(--menubar-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px 0 6px;
  color: var(--menubar-fg);
  text-shadow: var(--menubar-shadow);
  font-size: 13px;
  font-weight: 500;
  background: rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  overflow: visible;
}

.sghgjos-menubar.is-dark {
  background: rgba(18, 18, 20, 0.82);
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

.sghgjos-menubar-left,
.sghgjos-menubar-right {
  display: flex;
  align-items: center;
  gap: 2px;
  height: 100%;
  min-width: 0;
  overflow: visible;
}

.sghgjos-menubar-right {
  gap: 4px;
}

.sghgjos-apple,
.sghgjos-menubar-menus button,
.sghgjos-mb-icon,
.sghgjos-menubar-app-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 18px;
  max-height: calc(100% - 6px);
  border: 0;
  background: transparent;
  color: inherit;
  cursor: default;
  border-radius: 4px;
  padding: 0 8px;
  font-size: 13px;
  line-height: 1.15;
}

.sghgjos-apple {
  width: 28px;
  padding: 0;
}

.sghgjos-apple:hover,
.sghgjos-menubar-menus button:hover,
.sghgjos-menubar-menus button.is-open,
.sghgjos-mb-icon:hover,
.sghgjos-mb-icon.is-open,
.sghgjos-menubar-app-btn:hover {
  background: rgba(255, 255, 255, 0.18);
}

.sghgjos-menubar.is-dark .sghgjos-apple:hover,
.sghgjos-menubar.is-dark .sghgjos-menubar-menus button:hover,
.sghgjos-menubar.is-dark .sghgjos-mb-icon:hover {
  background: rgba(255, 255, 255, 0.16);
}

.sghgjos-menubar-app {
  font-weight: 700;
  padding: 0 6px;
  white-space: nowrap;
}

.sghgjos-menubar-menus {
  display: flex;
  gap: 0;
  position: relative;
}

.sghgjos-clock {
  font-variant-numeric: tabular-nums;
  font-size: 13px;
  padding: 0 6px;
  white-space: nowrap;
}

/* Dropdown menus */
.sghgjos-dropdown {
  position: absolute;
  top: calc(var(--menubar-h) + 2px);
  z-index: 9500;
  min-width: 220px;
  padding: 5px;
  border-radius: 8px;
  background: rgba(246, 246, 246, 0.88);
  backdrop-filter: blur(50px) saturate(180%);
  -webkit-backdrop-filter: blur(50px) saturate(180%);
  box-shadow:
    0 0 0 0.5px rgba(0, 0, 0, 0.14),
    0 14px 44px rgba(0, 0, 0, 0.28);
  color: #1d1d1f;
  text-shadow: none;
  animation: sghgjos-pop 0.14s ease-out;
}

html.sghgjos-dark .sghgjos-dropdown {
  background: var(--panel-bg);
  color: var(--text);
  box-shadow:
    0 0 0 0.5px var(--panel-border),
    var(--panel-shadow);
}

.sghgjos-dropdown[hidden] {
  display: none !important;
}

.sghgjos-dropdown button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 13px;
  color: inherit;
  cursor: default;
  gap: 24px;
}

.sghgjos-dropdown button:hover:not(:disabled) {
  background: var(--accent);
  color: #fff;
}

.sghgjos-dropdown button:disabled {
  opacity: 0.35;
}

.sghgjos-dropdown button .kbd {
  font-size: 12px;
  opacity: 0.55;
  font-variant-numeric: tabular-nums;
}

.sghgjos-dropdown button:hover .kbd {
  opacity: 0.9;
  color: inherit;
}

.sghgjos-dropdown hr {
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  margin: 4px 8px;
}

html.sghgjos-dark .sghgjos-dropdown hr {
  border-top-color: rgba(255, 255, 255, 0.12);
}

@keyframes sghgjos-pop {
  from {
    opacity: 0;
    transform: translateY(-4px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* Control Center */
.sghgjos-cc {
  position: absolute;
  top: calc(var(--menubar-h) + 6px);
  right: 10px;
  z-index: 9600;
  width: 320px;
  padding: 14px;
  border-radius: 16px;
  background: rgba(246, 246, 248, 0.78);
  backdrop-filter: blur(40px) saturate(180%);
  -webkit-backdrop-filter: blur(40px) saturate(180%);
  box-shadow:
    0 0 0 0.5px rgba(0, 0, 0, 0.12),
    0 20px 50px rgba(0, 0, 0, 0.3);
  color: #1d1d1f;
  text-shadow: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  animation: sghgjos-pop 0.16s ease-out;
}

.sghgjos-cc[hidden] {
  display: none !important;
}

html.sghgjos-dark .sghgjos-cc {
  background: rgba(40, 40, 42, 0.88);
  color: #f5f5f7;
}

.sghgjos-cc-tile {
  border: 0;
  border-radius: 14px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.65);
  text-align: left;
  cursor: default;
  color: inherit;
  min-height: 72px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

html.sghgjos-dark .sghgjos-cc-tile {
  background: rgba(60, 60, 62, 0.9);
}

.sghgjos-cc-tile.is-on {
  background: var(--accent);
  color: #fff;
}

.sghgjos-cc-tile .label {
  font-size: 12px;
  font-weight: 600;
}

.sghgjos-cc-tile .sub {
  font-size: 11px;
  opacity: 0.7;
}

.sghgjos-cc-wide {
  grid-column: 1 / -1;
}

.sghgjos-cc-slider {
  width: 100%;
  accent-color: #fff;
}

.sghgjos-cc-tile.is-on .sghgjos-cc-slider {
  accent-color: #fff;
}

/* ===== Desktop icons ===== */
/* ===== Home pager (mobile swipe; desktop = overlay layout) ===== */
.sghgjos-home-pager {
  position: absolute;
  inset: 0;
  z-index: 20;
  pointer-events: none;
  overflow: visible;
}

.sghgjos-home-track {
  display: block;
  width: 100%;
  height: 100%;
  transform: none;
}

.sghgjos-home-screen[data-page="-1"],
.sghgjos-home-screen[data-page="1"] {
  display: none;
}

.sghgjos-home-screen[data-page="0"] {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.sghgjos-home-jike,
.sghgjos-home-blog {
  height: 100%;
  pointer-events: auto;
}

.sghgjos-home-jike .sghgjos-jike {
  height: 100%;
}

.sghgjos-home-dots {
  display: none;
}

.sghgjos-desktop-icons {
  position: absolute;
  top: calc(var(--menubar-h) + 14px);
  right: 16px;
  bottom: 110px;
  z-index: 20;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap-reverse;
  align-content: flex-start;
  gap: 12px 16px;
  pointer-events: none;
}

.sghgjos-desk-icon {
  pointer-events: auto;
  width: 78px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  border: 0;
  background: transparent;
  padding: 6px 4px 4px;
  border-radius: 8px;
  cursor: default;
  color: #fff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}

.sghgjos-desk-icon:hover {
  background: rgba(255, 255, 255, 0.12);
}

.sghgjos-desk-icon.is-selected {
  background: rgba(10, 132, 255, 0.35);
}

.sghgjos-desk-icon .sghgjos-icon-face,
.sghgjos-desk-icon .sghgjos-desk-ico-img {
  width: 54px;
  height: 54px;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.35));
}

.sghgjos-desk-icon .sghgjos-desk-ico-img {
  display: block;
  border-radius: 12px;
  object-fit: cover;
  background: rgba(255, 255, 255, 0.2);
}

.sghgjos-desk-icon span:not(.sghgjos-icon-face) {
  font-size: 11px;
  text-align: center;
  line-height: 1.25;
  max-width: 100%;
  word-break: break-word;
}

/* ===== Context menu ===== */
.sghgjos-ctx {
  position: absolute;
  z-index: 9800;
  min-width: 180px;
  padding: 5px;
  border-radius: 8px;
  background: rgba(246, 246, 246, 0.9);
  backdrop-filter: blur(40px);
  -webkit-backdrop-filter: blur(40px);
  box-shadow:
    0 0 0 0.5px rgba(0, 0, 0, 0.14),
    0 12px 36px rgba(0, 0, 0, 0.28);
  color: #1d1d1f;
  text-shadow: none;
  animation: sghgjos-pop 0.12s ease-out;
}

.sghgjos-ctx[hidden] {
  display: none !important;
}

.sghgjos-ctx button {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 13px;
  color: inherit;
  cursor: default;
}

.sghgjos-ctx button:hover {
  background: var(--accent);
  color: #fff;
}

.sghgjos-ctx hr {
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  margin: 4px 8px;
}

/* ===== Windows ===== */
.sghgjos-windows {
  position: absolute;
  inset: var(--menubar-h) 0 0;
  z-index: 100;
  pointer-events: none;
}

.sghgjos-snap-guide {
  position: absolute;
  inset: 8px;
  z-index: 90;
  border-radius: 12px;
  border: 2px solid rgba(10, 132, 255, 0.55);
  background: rgba(10, 132, 255, 0.18);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.12s;
}

.sghgjos-snap-guide.is-show {
  opacity: 1;
}

.sghgjos-snap-guide.left {
  right: 50%;
}
.sghgjos-snap-guide.right {
  left: 50%;
}

.sghgjos-window {
  position: absolute;
  min-width: 320px;
  min-height: 200px;
  display: flex;
  flex-direction: column;
  border-radius: var(--win-radius);
  overflow: hidden;
  background: var(--glass);
  backdrop-filter: blur(40px) saturate(160%);
  -webkit-backdrop-filter: blur(40px) saturate(160%);
  box-shadow: var(--shadow-window);
  border: 0.5px solid rgba(0, 0, 0, 0.18);
  pointer-events: auto;
  color: var(--text);
  text-shadow: none;
  transform-origin: center center;
  animation: sghgjos-win-in 0.28s cubic-bezier(0.16, 1, 0.3, 1);
}

.sghgjos-window.is-active {
  box-shadow: var(--shadow-window-active);
}

.sghgjos-window.is-minimized {
  display: none;
}

.sghgjos-window.is-maximized {
  border-radius: 0 !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
}

.sghgjos-window.is-closing {
  animation: sghgjos-win-out 0.2s ease-in forwards;
}

.sghgjos-window.is-minimizing {
  animation: sghgjos-win-min 0.22s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes sghgjos-win-in {
  from {
    opacity: 0;
    transform: scale(0.92) translateY(10px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes sghgjos-win-out {
  to {
    opacity: 0;
    transform: scale(0.95);
  }
}

@keyframes sghgjos-win-min {
  to {
    opacity: 0;
    transform: scale(0.9) translateY(16px);
  }
}

.sghgjos-titlebar {
  height: 38px;
  flex-shrink: 0;
  display: grid;
  grid-template-columns: 88px 1fr 88px;
  align-items: center;
  padding: 0 12px;
  background: var(--titlebar-bg);
  border-bottom: 1px solid var(--titlebar-border);
  cursor: default;
}

.sghgjos-window.is-active .sghgjos-titlebar {
  background: var(--titlebar-active-bg);
}

.sghgjos-traffic {
  display: flex;
  align-items: center;
  gap: 9px;
}

.sghgjos-traffic button {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: none;
  padding: 0;
  cursor: default;
  position: relative;
  box-shadow: inset 0 0 0 0.5px rgba(0, 0, 0, 0.18);
  flex-shrink: 0;
}

.sghgjos-traffic .btn-close {
  background: var(--traffic-r);
}
.sghgjos-traffic .btn-min {
  background: var(--traffic-y);
}
.sghgjos-traffic .btn-max {
  background: var(--traffic-g);
}

.sghgjos-window:not(.is-active) .sghgjos-traffic button {
  background: #d0d0d2;
}

html.sghgjos-dark .sghgjos-window:not(.is-active) .sghgjos-traffic button {
  background: #555;
}

.sghgjos-traffic button::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 9px;
  transition: opacity 0.1s;
}

/* 桌面：划过时显示图标；触控/手机：默认常显（无 hover） */
@media (hover: hover) and (pointer: fine) {
  .sghgjos-window.is-active .sghgjos-traffic:hover button::after {
    opacity: 1;
  }
}

@media (hover: none), (pointer: coarse) {
  .sghgjos-window.is-active .sghgjos-traffic .btn-close::after,
  .sghgjos-window.is-active .sghgjos-traffic .btn-min::after {
    opacity: 1;
  }

  /* 触控端：隐藏缩放按钮（绿点一并去掉） */
  .sghgjos-traffic .btn-max {
    display: none;
  }
}

.sghgjos-traffic .btn-close::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath stroke='%234d0000' stroke-width='1.4' d='M3 3l6 6M9 3L3 9'/%3E%3C/svg%3E");
}
.sghgjos-traffic .btn-min::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath stroke='%235c4000' stroke-width='1.4' d='M2.5 6h7'/%3E%3C/svg%3E");
}
.sghgjos-traffic .btn-max::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23004600' stroke-width='1.2' d='M4 3.5h4.5V8M3.5 4.5v4H8'/%3E%3C/svg%3E");
}

.sghgjos-title {
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  opacity: 0.88;
}

.sghgjos-window-toolbar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  background: rgba(246, 246, 248, 0.95);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

html.sghgjos-dark .sghgjos-window-toolbar {
  background: rgba(44, 44, 46, 0.95);
  border-bottom-color: rgba(255, 255, 255, 0.06);
}

.sghgjos-tb-btn {
  width: 28px;
  height: 24px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: default;
}

.sghgjos-tb-btn:hover:not(:disabled) {
  background: rgba(0, 0, 0, 0.06);
  color: var(--text);
}

.sghgjos-tb-btn:disabled {
  opacity: 0.3;
}

.sghgjos-tb-btn.is-on {
  background: rgba(0, 0, 0, 0.1);
  color: var(--text);
}

.sghgjos-tb-group {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 1px;
  border-radius: 7px;
  background: rgba(0, 0, 0, 0.05);
}

html.sghgjos-dark .sghgjos-tb-group {
  background: rgba(255, 255, 255, 0.08);
}

.sghgjos-finder-status .sep {
  margin: 0 6px;
  opacity: 0.45;
}

.sghgjos-tb-search {
  margin-left: auto;
  height: 24px;
  border-radius: 6px;
  border: 0;
  background: rgba(0, 0, 0, 0.05);
  padding: 0 10px;
  font-size: 12px;
  width: 160px;
  flex-shrink: 0;
  color: var(--text);
  outline: none;
}

html.sghgjos-dark .sghgjos-tb-search {
  background: rgba(255, 255, 255, 0.08);
}

.sghgjos-window-body {
  position: relative;
  flex: 1;
  min-height: 0;
  overflow: auto;
  background: #fff;
  user-select: text;
  -webkit-user-select: text;
}

.sghgjos-window-body.is-fill,
.sghgjos-window-body:has(.sghgjos-app-finder),
.sghgjos-window-body:has(.sghgjos-memo),
.sghgjos-window-body:has(.sghgjos-blog-app),
.sghgjos-window-body:has(.sghgjos-settings-app),
.sghgjos-window-body:has(.sghgjos-jike),
.sghgjos-window-body:has(.sghgjos-album),
.sghgjos-window-body:has(.sghgjos-calendar),
.sghgjos-window-body:has(.sghgjos-about),
.sghgjos-window-body:has(.sghgjos-calc),
.sghgjos-window-body:has(.sghgjos-term) {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Calculator — dark chrome flush with keypad */
.sghgjos-window:has(.sghgjos-calc) {
  min-width: 232px;
  background: #1c1c1e;
  border-color: rgba(255, 255, 255, 0.1);
}

.sghgjos-window:has(.sghgjos-calc) .sghgjos-titlebar,
.sghgjos-window.is-active:has(.sghgjos-calc) .sghgjos-titlebar {
  background: #1c1c1e;
  border-bottom: none;
  color: rgba(255, 255, 255, 0.55);
}

.sghgjos-window:has(.sghgjos-calc) .sghgjos-title {
  color: rgba(255, 255, 255, 0.55);
  font-weight: 500;
  opacity: 1;
}

.sghgjos-window-body:has(.sghgjos-calc) {
  background: #1c1c1e;
  container-type: size;
  container-name: calc-win;
}

.sghgjos-window-body:has(.sghgjos-app-finder) {
  container-type: inline-size;
  container-name: finder;
}

.sghgjos-window-body:has(.sghgjos-calendar) {
  background: #f2f2f7;
  container-type: size;
  container-name: cal-win;
}

html.sghgjos-dark .sghgjos-window-body:has(.sghgjos-calendar) {
  background: #000;
}

html.sghgjos-dark .sghgjos-window-body {
  background: #1c1c1e;
}

.sghgjos-window-body::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.sghgjos-window-body::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.18);
  border-radius: 99px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

.sghgjos-resize {
  position: absolute;
  width: 16px;
  height: 16px;
  right: 0;
  bottom: 0;
  cursor: nwse-resize;
}

/* ===== Dock (align macOS) ===== */
.sghgjos-dock-wrap {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 5px;
  z-index: 9998;
  display: flex;
  justify-content: center;
  pointer-events: none;
}

/* Apps above dock: desktop maximize, or any open app on mobile (always full-bleed). */
.sghgjos-root:has(.sghgjos-window.is-maximized:not(.is-minimized)) .sghgjos-dock-wrap,
html.sghgjos-mobile:not(.sghgjos-shell-home) .sghgjos-dock-wrap {
  z-index: 50;
}

.sghgjos-dock-wrap > * {
  pointer-events: auto;
}

.sghgjos-dock {
  box-sizing: content-box;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  width: auto;
  max-width: 100%;
  height: var(--dock-h);
  padding: 5px 12px;
  border-radius: 15px;
  background-color: rgba(211, 211, 211, 0.22);
  border: 1px solid rgba(255, 255, 255, 0.31);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.37);
  overflow: visible;
}

.sghgjos-dock-track {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  min-width: 0;
  height: 100%;
  overflow: visible;
}

html.sghgjos-dark .sghgjos-dock {
  background-color: rgba(0, 0, 0, 0.22);
  border-color: rgba(199, 199, 199, 0.31);
}

.sghgjos-dock-item {
  position: relative;
  margin: 0 2px;
  border: 0;
  padding: 0;
  background: transparent;
  cursor: default;
  transform-origin: bottom center;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
}

.sghgjos-dock-item .sghgjos-dock-ico {
  width: var(--dock-icon);
  height: var(--dock-icon);
  display: block;
  will-change: width, height;
  transition: width 0.08s linear, height 0.08s linear;
  filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.28));
  pointer-events: none;
}

.sghgjos-dock-item .sghgjos-dock-ico .sghgjos-icon-face,
.sghgjos-dock-item .sghgjos-dock-ico .sghgjos-dock-ico-img {
  width: 100%;
  height: 100%;
  display: block;
}

.sghgjos-dock-item .sghgjos-dock-ico .sghgjos-dock-ico-img {
  object-fit: cover;
  border-radius: 22%;
}

.sghgjos-dock-item.is-bounce .sghgjos-dock-ico {
  animation: sghgjos-dock-bounce 0.55s cubic-bezier(0.28, 0.84, 0.42, 1);
}

@keyframes sghgjos-dock-bounce {
  0% { transform: translateY(0); }
  30% { transform: translateY(-18px); }
  50% { transform: translateY(0); }
  65% { transform: translateY(-8px); }
  80% { transform: translateY(0); }
  90% { transform: translateY(-3px); }
  100% { transform: translateY(0); }
}

.sghgjos-dock-indicator {
  width: 4px;
  height: 4px;
  margin-top: 2px;
  border-radius: 9999px;
  flex-shrink: 0;
  background: transparent;
}

.sghgjos-dock-item.is-open .sghgjos-dock-indicator {
  background: #141414;
}

html.sghgjos-dark .sghgjos-dock-item.is-open .sghgjos-dock-indicator {
  background: rgba(245, 245, 247, 0.92);
}

.sghgjos-dock-item.is-open.is-running .sghgjos-dock-indicator {
  background: rgba(60, 60, 60, 0.7);
}

.sghgjos-dock-tip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 6px);
  transform: translateX(-50%);
  z-index: 10;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.85);
  color: rgba(0, 0, 0, 0.95);
  font-size: 11px;
  white-space: nowrap;
  min-width: max-content;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.sghgjos-dock-tip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-top: 5px solid rgba(255, 255, 255, 0.85);
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
}

html.sghgjos-dark .sghgjos-dock-tip {
  background: rgba(44, 44, 46, 0.92);
  color: #f5f5f7;
}

html.sghgjos-dark .sghgjos-dock-tip::after {
  border-top-color: rgba(44, 44, 46, 0.92);
}

.sghgjos-dock-item:hover .sghgjos-dock-tip,
.sghgjos-dock-item.dock-active .sghgjos-dock-tip {
  opacity: 1;
}

.sghgjos-dock-sep,
.sghgjos-dock-divider {
  width: 1px;
  height: calc(100% - 16px);
  margin: 0 4px;
  background: rgba(0, 0, 0, 0.2);
  align-self: center;
  flex-shrink: 0;
}

html.sghgjos-dark .sghgjos-dock-sep,
html.sghgjos-dark .sghgjos-dock-divider {
  background: rgba(255, 255, 255, 0.22);
}

/* ===== Icons (unified squircle system) =====
   Shared language: 165° soft gradients, white glyphs on 64×64 with ~14px inset,
   rounded geometry, top gloss via ::before, optional rim via box-shadow. */
.sghgjos-icon-face {
  display: block;
  border-radius: 22.5%;
  position: relative;
  overflow: hidden;
  background: #8e8e93;
  box-shadow: inset 0 0 0 0.5px rgba(255, 255, 255, 0.22),
    inset 0 -1px 0 rgba(0, 0, 0, 0.12);
}

.sghgjos-icon-face::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.42) 0%,
    rgba(255, 255, 255, 0.12) 38%,
    transparent 55%
  );
  pointer-events: none;
  z-index: 1;
}

.sghgjos-icon-face::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background-position: center;
  background-size: 68%;
  background-repeat: no-repeat;
}

/* Finder — blue folder (file browser) */
.icon-finder {
  background: linear-gradient(165deg, #6ec8ff 0%, #2f9cf5 48%, #0071e3 100%);
}
.icon-finder::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M12 24.5c0-2.5 2-4.5 4.5-4.5H26l3.2 3.2h18.3c2.5 0 4.5 2 4.5 4.5V44c0 2.5-2 4.5-4.5 4.5h-31C14 48.5 12 46.5 12 44V24.5z' fill='%23fff'/%3E%3Cpath d='M12 28.5h40' stroke='%230071e3' stroke-width='1.6' opacity='.22'/%3E%3Cpath d='M20 36.5h10M20 41h16' stroke='%230071e3' stroke-width='2.4' stroke-linecap='round' opacity='.35'/%3E%3C/svg%3E");
  background-size: 74%;
  background-position: center 54%;
}

/* Memo — notepad */
.icon-memo {
  background: linear-gradient(165deg, #ffe566 0%, #ffd60a 52%, #ffb800 100%);
}
.icon-memo::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Crect x='15' y='11' width='34' height='42' rx='5' fill='%23fffef5'/%3E%3Crect x='15' y='11' width='34' height='8' rx='5' fill='%23fff'/%3E%3Cpath d='M21 28h22M21 36h22M21 44h14' stroke='%23c9a000' stroke-width='2.8' stroke-linecap='round' opacity='.85'/%3E%3C/svg%3E");
  background-size: 74%;
}

/* Settings — gear */
.icon-settings {
  background: linear-gradient(165deg, #e5e5ea 0%, #c7c7cc 45%, #8e8e93 100%);
}
.icon-settings::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M32 14l2.6 4.2 4.8-.8 1.6 4.6 4.4 2.1-1.6 4.6 2.6 4.2-4.2 2.6.8 4.8-4.6 1.6-2.1 4.4-4.6-1.6-4.2 2.6-2.6-4.2-4.8.8-1.6-4.6-4.4-2.1 1.6-4.6-2.6-4.2 4.2-2.6-.8-4.8 4.6-1.6 2.1-4.4 4.6 1.6z' fill='%23fff'/%3E%3Ccircle cx='32' cy='32' r='7' fill='%23a1a1a6'/%3E%3Ccircle cx='32' cy='32' r='3.6' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 70%;
}

/* Keyboard shortcuts */
.icon-keyboard {
  background: linear-gradient(165deg, #7dd3fc 0%, #38bdf8 48%, #0284c7 100%);
}
.icon-keyboard::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Crect x='10' y='18' width='44' height='28' rx='5' fill='%23fff'/%3E%3Crect x='16' y='24' width='5' height='5' rx='1.2' fill='%230284c7' opacity='.85'/%3E%3Crect x='24' y='24' width='5' height='5' rx='1.2' fill='%230284c7' opacity='.85'/%3E%3Crect x='32' y='24' width='5' height='5' rx='1.2' fill='%230284c7' opacity='.85'/%3E%3Crect x='40' y='24' width='5' height='5' rx='1.2' fill='%230284c7' opacity='.85'/%3E%3Crect x='16' y='32' width='5' height='5' rx='1.2' fill='%230284c7' opacity='.55'/%3E%3Crect x='24' y='32' width='21' height='5' rx='1.2' fill='%230284c7' opacity='.55'/%3E%3Crect x='48' y='32' width='0' height='0'/%3E%3Crect x='43' y='32' width='5' height='5' rx='1.2' fill='%230284c7' opacity='.55'/%3E%3C/svg%3E");
  background-size: 78%;
}

/* Calculator */
.icon-calc {
  background: linear-gradient(165deg, #48484a 0%, #2c2c2e 50%, #1c1c1e 100%);
}
.icon-calc::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Crect x='14' y='10' width='36' height='44' rx='7' fill='%23fff' opacity='.12'/%3E%3Crect x='18' y='14' width='28' height='11' rx='3' fill='%23111113'/%3E%3Ccircle cx='23' cy='35' r='3.2' fill='%23fff'/%3E%3Ccircle cx='32' cy='35' r='3.2' fill='%23fff'/%3E%3Ccircle cx='41' cy='35' r='3.2' fill='%23fff'/%3E%3Ccircle cx='23' cy='45' r='3.2' fill='%23fff'/%3E%3Ccircle cx='32' cy='45' r='3.2' fill='%23fff'/%3E%3Ccircle cx='41' cy='45' r='3.2' fill='%23ff9f0a'/%3E%3C/svg%3E");
  background-size: 76%;
}

/* Terminal */
.icon-terminal {
  background: linear-gradient(165deg, #3a3a3c 0%, #1c1c1e 55%, #0a0a0a 100%);
}
.icon-terminal::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M18 22l13 10-13 10' stroke='%2330d158' stroke-width='4.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M35 42h13' stroke='%2330d158' stroke-width='4.2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-size: 70%;
}

/* Blog — article */
.icon-blog {
  background: linear-gradient(165deg, #ffb07a 0%, #ff7a45 48%, #e85d04 100%);
}
.icon-blog::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M17 12h22l10 10v30a4 4 0 01-4 4H17a4 4 0 01-4-4V16a4 4 0 014-4z' fill='%23fff'/%3E%3Cpath d='M39 12v10h10' fill='%23ffe0d0'/%3E%3Cpath d='M22 30h20M22 38h20M22 46h12' stroke='%23e85d04' stroke-width='2.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-size: 72%;
}

/* Calendar — live day number (scales with icon size) */
.icon-calendar {
  container-type: size;
  background: linear-gradient(180deg, #ffffff 0%, #f5f5f7 100%);
  box-shadow: inset 0 0 0 0.5px rgba(0, 0, 0, 0.06),
    inset 0 -1px 0 rgba(0, 0, 0, 0.08);
}
.icon-calendar::before {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.55) 0%,
    transparent 40%
  );
}
.icon-calendar::after {
  content: attr(data-day);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 12%;
  color: #1c1c1e;
  font-size: 48cqh;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  line-height: 1;
  background: linear-gradient(180deg, #ff3b30 0 26%, transparent 26%);
  background-size: auto;
}

/* About — info */
.icon-about {
  background: linear-gradient(165deg, #da8fff 0%, #bf5af2 42%, #5e5ce6 100%);
}
.icon-about::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Ccircle cx='32' cy='32' r='16.5' stroke='%23fff' stroke-width='3.2'/%3E%3Ccircle cx='32' cy='22.5' r='2.6' fill='%23fff'/%3E%3Cpath d='M32 29.5v16' stroke='%23fff' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E");
  background-size: 68%;
}

/* Account — person */
.icon-account {
  background: linear-gradient(165deg, #64d2ff 0%, #0a84ff 48%, #0071e3 100%);
}
.icon-account::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Ccircle cx='32' cy='24' r='11' fill='%23fff'/%3E%3Cellipse cx='32' cy='48' rx='16' ry='10' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 68%;
}

/* Album — photo */
.icon-album {
  background: linear-gradient(145deg, #ffd60a 0%, #ff9f0a 28%, #ff375f 62%, #bf5af2 100%);
}
.icon-album::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Crect x='13' y='16' width='38' height='32' rx='5' fill='%23fff'/%3E%3Ccircle cx='24' cy='27.5' r='4' fill='%23ff9f0a'/%3E%3Cpath d='M13 40.5l11.5-9.5 9 7.2 7.2-5.5L51 40.5V43a5 5 0 01-5 5H18a5 5 0 01-5-5v-2.5z' fill='%23ff375f' opacity='.9'/%3E%3C/svg%3E");
  background-size: 74%;
}

/* Trash */
.icon-trash {
  background: linear-gradient(165deg, #f2f2f7 0%, #d1d1d6 48%, #aeaeb2 100%);
}
.icon-trash::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M22 20h20l-1.6 28a5 5 0 01-5 4.6H28.6a5 5 0 01-5-4.6L22 20z' fill='%23fff'/%3E%3Cpath d='M18 20h28' stroke='%23fff' stroke-width='3.4' stroke-linecap='round'/%3E%3Cpath d='M27 16h10' stroke='%23fff' stroke-width='3.4' stroke-linecap='round'/%3E%3Cpath d='M28 28v14M32 28v14M36 28v14' stroke='%23aeaeb2' stroke-width='2.4' stroke-linecap='round' opacity='.9'/%3E%3C/svg%3E");
  background-size: 68%;
}

/* Music */
.icon-music {
  background: linear-gradient(165deg, #ff6b8a 0%, #ff2d55 48%, #d70040 100%);
}
.icon-music::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M42 14v26.5a7.5 7.5 0 11-4.2-6.7V21.2l14-3.6v5.4L42 26' fill='%23fff'/%3E%3Ccircle cx='30.5' cy='45.5' r='7.5' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 68%;
}

/* 即刻 — yellow bubble */
.icon-jike {
  background: linear-gradient(165deg, #ffe566 0%, #ffd60a 46%, #ff9f0a 100%);
}
.icon-jike::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M14 22c0-5.2 5.4-9.5 18-9.5S50 16.8 50 22v12c0 5.2-5.4 9.5-18 9.5-2.6 0-5.1-.3-7.3-1L12 48l2.8-7.2C15.2 38.6 14 36.5 14 34V22z' fill='%23fff'/%3E%3Ccircle cx='26' cy='28' r='2.6' fill='%23ff9f0a'/%3E%3Ccircle cx='32' cy='28' r='2.6' fill='%23ff9f0a'/%3E%3Ccircle cx='38' cy='28' r='2.6' fill='%23ff9f0a'/%3E%3C/svg%3E");
  background-size: 74%;
}

/* Launchpad — app grid */
.icon-launchpad {
  background: linear-gradient(165deg, #64d2ff 0%, #0a84ff 50%, #5856d6 100%);
}
.icon-launchpad::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Crect x='14' y='14' width='10' height='10' rx='3' fill='%23fff'/%3E%3Crect x='27' y='14' width='10' height='10' rx='3' fill='%23fff'/%3E%3Crect x='40' y='14' width='10' height='10' rx='3' fill='%23fff'/%3E%3Crect x='14' y='27' width='10' height='10' rx='3' fill='%23fff'/%3E%3Crect x='27' y='27' width='10' height='10' rx='3' fill='%23fff'/%3E%3Crect x='40' y='27' width='10' height='10' rx='3' fill='%23fff'/%3E%3Crect x='14' y='40' width='10' height='10' rx='3' fill='%23fff'/%3E%3Crect x='27' y='40' width='10' height='10' rx='3' fill='%23fff'/%3E%3Crect x='40' y='40' width='10' height='10' rx='3' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 70%;
}

/* Components — tiles */
.icon-components {
  background: linear-gradient(165deg, #7adfff 0%, #0a84ff 48%, #5e5ce6 100%);
}
.icon-components::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Crect x='13' y='13' width='17' height='17' rx='4.5' fill='%23fff'/%3E%3Crect x='34' y='13' width='17' height='17' rx='4.5' fill='%23fff' opacity='.82'/%3E%3Crect x='13' y='34' width='17' height='17' rx='4.5' fill='%23fff' opacity='.82'/%3E%3Crect x='34' y='34' width='17' height='17' rx='4.5' fill='%23fff' opacity='.64'/%3E%3C/svg%3E");
  background-size: 70%;
}

/* Custom desk presets — not used by built-in apps */
.icon-link {
  background: linear-gradient(165deg, #64d2ff 0%, #0a84ff 50%, #0055d4 100%);
}
.icon-link::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M28 36.5a10 10 0 0014.1 0l6.4-6.4a10 10 0 10-14.1-14.1l-3.2 3.2' stroke='%23fff' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M36 27.5a10 10 0 00-14.1 0l-6.4 6.4a10 10 0 1014.1 14.1l3.2-3.2' stroke='%23fff' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E");
  background-size: 68%;
}

.icon-globe {
  background: linear-gradient(165deg, #63e6be 0%, #20c997 48%, #0ca678 100%);
}
.icon-globe::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Ccircle cx='32' cy='32' r='16' stroke='%23fff' stroke-width='3.4'/%3E%3Cellipse cx='32' cy='32' rx='7' ry='16' stroke='%23fff' stroke-width='3.2'/%3E%3Cpath d='M16 32h32M18.5 24h27M18.5 40h27' stroke='%23fff' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-size: 70%;
}

.icon-mail {
  background: linear-gradient(165deg, #ffd43b 0%, #fab005 48%, #f08c00 100%);
}
.icon-mail::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Crect x='12' y='18' width='40' height='28' rx='5' fill='%23fff'/%3E%3Cpath d='M14 22l18 13 18-13' stroke='%23f08c00' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 72%;
}

.icon-folder {
  background: linear-gradient(165deg, #ffd08a 0%, #ff922b 48%, #fd7e14 100%);
}
.icon-folder::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M12 22a4 4 0 014-4h12l4 4h16a4 4 0 014 4v20a4 4 0 01-4 4H16a4 4 0 01-4-4V22z' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 74%;
}

.icon-code {
  background: linear-gradient(165deg, #2b2b2e 0%, #1c1c1e 55%, #0d0d0f 100%);
}
.icon-code::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M24 20l-12 12 12 12M40 20l12 12-12 12M36 18l-8 28' stroke='%2330d158' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 70%;
}

.icon-game {
  background: linear-gradient(165deg, #da77f2 0%, #be4bdb 48%, #9c36b5 100%);
}
.icon-game::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M18 28c0-5 4.5-9 14-9s14 4 14 9v10c0 3.5-2.2 6-6.5 6-2.2 0-3.6-1-4.8-2.2L32 39l-2.7 1.8C28.1 42 26.7 43 24.5 43 20.2 43 18 40.5 18 37V28z' fill='%23fff'/%3E%3Ccircle cx='40' cy='30' r='2.2' fill='%23be4bdb'/%3E%3Ccircle cx='45' cy='34' r='2.2' fill='%23be4bdb'/%3E%3Cpath d='M24 30v8M20 34h8' stroke='%23be4bdb' stroke-width='2.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-size: 74%;
}

.icon-cloud {
  background: linear-gradient(165deg, #a5d8ff 0%, #4dabf7 48%, #228be6 100%);
}
.icon-cloud::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M20 40h26a9 9 0 00.4-18 11 11 0 00-21.2-3.2A8.5 8.5 0 0020 40z' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 78%;
}

.icon-heart {
  background: linear-gradient(165deg, #ff8fab 0%, #ff2d55 48%, #d70040 100%);
}
.icon-heart::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M32 48s-16-10.2-16-21a9 9 0 0116-5.5A9 9 0 0148 27c0 10.8-16 21-16 21z' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 70%;
}

.icon-star {
  background: linear-gradient(165deg, #ffe066 0%, #fcc419 48%, #f59f00 100%);
}
.icon-star::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M32 12l5.4 12.4L51 26.2l-9.8 8.8L44 49 32 42.2 20 49l2.8-14L13 26.2l13.6-1.8L32 12z' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 70%;
}

.icon-video {
  background: linear-gradient(165deg, #ff8787 0%, #fa5252 48%, #e03131 100%);
}
.icon-video::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Crect x='11' y='18' width='30' height='28' rx='5' fill='%23fff'/%3E%3Cpath d='M44 26l10-5v22l-10-5V26z' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 72%;
}

.icon-shop {
  background: linear-gradient(165deg, #69db7c 0%, #40c057 48%, #2f9e44 100%);
}
.icon-shop::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M16 22h32l-2.5 24a5 5 0 01-5 4.5H23.5a5 5 0 01-5-4.5L16 22z' fill='%23fff'/%3E%3Cpath d='M24 22v-2a8 8 0 0116 0v2' stroke='%23fff' stroke-width='3.4' stroke-linecap='round'/%3E%3C/svg%3E");
  background-size: 70%;
}

.icon-map {
  background: linear-gradient(165deg, #91a7ff 0%, #5c7cfa 48%, #4263eb 100%);
}
.icon-map::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M32 12c-8.3 0-15 6.4-15 14.3 0 10.7 15 25.7 15 25.7s15-15 15-25.7C47 18.4 40.3 12 32 12z' fill='%23fff'/%3E%3Ccircle cx='32' cy='26' r='5.5' fill='%235c7cfa'/%3E%3C/svg%3E");
  background-size: 70%;
}

.icon-book {
  background: linear-gradient(165deg, #ffa94d 0%, #ff922b 48%, #f76707 100%);
}
.icon-book::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M14 16h16c4 0 6 2 6 6v28c0-3-2-5-6-5H14V16zM50 16H34c-4 0-6 2-6 6v28c0-3 2-5 6-5h16V16z' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 72%;
}

.icon-chat {
  background: linear-gradient(165deg, #66d9e8 0%, #22b8cf 48%, #1098ad 100%);
}
.icon-chat::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M14 18a6 6 0 016-6h24a6 6 0 016 6v18a6 6 0 01-6 6H28l-10 8v-8h-4a6 6 0 01-6-6V18z' fill='%23fff'/%3E%3Ccircle cx='26' cy='27' r='2.4' fill='%231098ad'/%3E%3Ccircle cx='32' cy='27' r='2.4' fill='%231098ad'/%3E%3Ccircle cx='38' cy='27' r='2.4' fill='%231098ad'/%3E%3C/svg%3E");
  background-size: 72%;
}

/* ===== Desktop widgets ===== */
@font-face {
  font-family: "Orbitron";
  src: url("../fonts/Orbitron-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

.sghgjos-widgets {
  position: absolute;
  inset: 0;
  z-index: 40;
  pointer-events: none;
}

.sghgjos-widget-clock {
  position: absolute;
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  max-width: min(92vw, 560px);
  text-align: center;
  pointer-events: none;
  z-index: 41;
  color: #fff;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.35), 0 1px 2px rgba(0, 0, 0, 0.25);
  user-select: none;
}

.sghgjos-widget-clock-time {
  display: flex;
  align-items: baseline;
  justify-content: center;
  font-family: "Orbitron", "DIN Alternate", "Bahnschrift", "Helvetica Neue", sans-serif;
  font-size: clamp(52px, 9vw, 80px);
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.08em;
  line-height: 1;
  font-feature-settings: 'tnum';
}

.sghgjos-widget-clock-h,
.sghgjos-widget-clock-m {
  display: inline-block;
  min-width: 1.15em;
  text-align: center;
}

.sghgjos-widget-clock-colon {
  display: inline-block;
  width: 0.28em;
  text-align: center;
  opacity: 1;
  /* 占位固定，仅改透明度，闪烁时不挤布局 */
  transition: none;
}

.sghgjos-widget-clock-colon.is-blink {
  opacity: 0;
}

.sghgjos-widget-clock-date {
  margin-top: 10px;
  font-size: clamp(16px, 2.8vw, 20px);
  font-weight: 500;
  letter-spacing: 0.06em;
  opacity: 0.92;
  white-space: nowrap;
}

.sghgjos-widget-clock-a11y {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.sghgjos-widget-search {
  position: absolute;
  top: 14%;
  left: 50%;
  transform: translateX(-50%);
  width: min(560px, 72vw);
  pointer-events: auto;
  z-index: 41;
  transition: width 0.38s cubic-bezier(0.22, 1, 0.36, 1);
}

.sghgjos-widget-search:has(.sghgjos-widget-search-input:focus) {
  width: min(720px, 90vw);
}

/* 搜索 + 时钟同时开启时，搜索下移避免叠在时钟上 */
.sghgjos-widgets:has(.sghgjos-widget-clock) .sghgjos-widget-search {
  top: calc(10% + 8.25rem);
}

.sghgjos-widget-search-bar {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 48px;
  padding: 0 10px 0 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.45);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(18px) saturate(1.4);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
}

html.sghgjos-dark .sghgjos-widget-search-bar {
  background: rgba(40, 40, 42, 0.72);
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.sghgjos-widget-search-engine {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 10px 0 6px;
  border: 0;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.05);
  color: var(--text);
  font: inherit;
  font-size: 12px;
  cursor: default;
  flex-shrink: 0;
}

html.sghgjos-dark .sghgjos-widget-search-engine {
  background: rgba(255, 255, 255, 0.08);
}

.sghgjos-widget-search-engine:hover {
  background: rgba(0, 0, 0, 0.08);
}

html.sghgjos-dark .sghgjos-widget-search-engine:hover {
  background: rgba(255, 255, 255, 0.12);
}

.sghgjos-search-engine-ico {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  display: block;
}

.sghgjos-widget-search-engine-name {
  max-width: 72px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sghgjos-widget-search-caret {
  opacity: 0.55;
}

.sghgjos-widget-search-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 6px;
  min-width: 168px;
  padding: 6px;
  border-radius: 12px;
  background: var(--panel-bg);
  border: 1px solid var(--panel-border);
  box-shadow: var(--panel-shadow);
  z-index: 50;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sghgjos-widget-search-menu[hidden] {
  display: none !important;
}

.sghgjos-widget-search-menu button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  border: 0;
  border-radius: 8px;
  padding: 8px 10px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  text-align: left;
  cursor: default;
}

.sghgjos-widget-search-menu button:hover,
.sghgjos-widget-search-menu button.is-active {
  background: rgba(10, 132, 255, 0.12);
}

.sghgjos-widget-search-input {
  flex: 1;
  min-width: 0;
  height: 36px;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 15px;
  padding: 0 4px;
}

.sghgjos-widget-search-input::placeholder {
  color: var(--muted);
}

.sghgjos-widget-search-go {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(10, 132, 255, 0.12);
  color: var(--accent);
  cursor: default;
  flex-shrink: 0;
}

.sghgjos-widget-search-go:hover {
  background: rgba(10, 132, 255, 0.2);
}

@media (max-width: 640px) {
  .sghgjos-widget-clock {
    top: 12%;
  }
  .sghgjos-widget-search {
    top: 18%;
    width: min(78vw, 420px);
  }
  .sghgjos-widget-search:has(.sghgjos-widget-search-input:focus) {
    width: min(94vw, 560px);
  }
  .sghgjos-widgets:has(.sghgjos-widget-clock) .sghgjos-widget-search {
    top: calc(12% + 7.25rem);
  }
  .sghgjos-widget-search-engine-name {
    display: none;
  }
}

/* ===== 即刻 ===== */
.sghgjos-jike {
  --jike-cover-overflow: 26px;
  flex: 1;
  min-height: 0;
  height: auto;
  display: block;
  background: #ededed;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

html.sghgjos-dark .sghgjos-jike {
  background: #000;
}

.sghgjos-jike-cover {
  position: relative;
  height: 230px;
  background-size: cover;
  background-position: center;
  overflow: visible;
}

.sghgjos-jike-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(0, 0, 0, 0.35));
  pointer-events: none;
  border-radius: inherit;
}

.sghgjos-jike-cover-info {
  position: absolute;
  right: 18px;
  bottom: calc(-1 * var(--jike-cover-overflow));
  z-index: 10;
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-end;
  gap: 12px;
}

.sghgjos-jike-cover-text {
  text-align: right;
  padding-bottom: 8px;
  color: #fff;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
}

.sghgjos-jike-nick {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 2px;
}

.sghgjos-jike-sign {
  font-size: 11px;
  opacity: 0.9;
  max-width: 180px;
}

.sghgjos-jike-avatar {
  border-radius: 8px;
  object-fit: cover;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
  border: 2px solid rgba(255, 255, 255, 0.9);
  flex-shrink: 0;
  display: block;
}

.sghgjos-jike-avatar-fallback {
  background: linear-gradient(135deg, #5ac8fa, #007aff);
  color: #fff;
  font-weight: 700;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sghgjos-jike-feed {
  margin-top: var(--jike-cover-overflow);
  padding: 12px 0 48px;
  background: #fff;
  overflow: visible;
}

html.sghgjos-dark .sghgjos-jike-feed {
  background: #1c1c1e;
}

.sghgjos-jike-feed > .sghgjos-empty {
  max-width: 560px;
  margin: 24px auto 0;
  width: 100%;
  box-sizing: border-box;
}

.sghgjos-jike-item {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 10px;
  padding: 14px 16px;
  max-width: 560px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  cursor: default;
}

html.sghgjos-dark .sghgjos-jike-item {
  border-bottom-color: rgba(255, 255, 255, 0.06);
}

.sghgjos-jike-item-av .sghgjos-jike-avatar {
  width: 40px !important;
  height: 40px !important;
  border-radius: 6px;
  border-width: 0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
}

.sghgjos-jike-item-name {
  font-size: 14px;
  font-weight: 700;
  color: #576b95;
  margin-bottom: 4px;
}

html.sghgjos-dark .sghgjos-jike-item-name {
  color: #7d94c9;
}

.sghgjos-jike-item-text {
  font-size: 14px;
  line-height: 1.55;
  color: var(--text);
  white-space: pre-wrap;
  word-break: break-word;
  margin-bottom: 8px;
}

.sghgjos-jike-more {
  border: 0;
  background: transparent;
  color: #576b95;
  font-size: 13px;
  cursor: default;
  padding: 0 0 0 4px;
}

.sghgjos-jike-avatar.avatar-shadow-on {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.4);
}

.sghgjos-jike-like .heart,
.sghgjos-jike-likes .heart {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 3px;
  vertical-align: -1px;
  background: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 14s-5.5-3.4-7-6.2C-.2 5.3 1.2 2.5 4 2.5c1.5 0 2.7.9 4 2.4 1.3-1.5 2.5-2.4 4-2.4 2.8 0 4.2 2.8 3 5.3C13.5 10.6 8 14 8 14z'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 14s-5.5-3.4-7-6.2C-.2 5.3 1.2 2.5 4 2.5c1.5 0 2.7.9 4 2.4 1.3-1.5 2.5-2.4 4-2.4 2.8 0 4.2 2.8 3 5.3C13.5 10.6 8 14 8 14z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.sghgjos-jike-imgs {
  display: grid;
  gap: 4px;
  margin-bottom: 8px;
  max-width: 260px;
}

.sghgjos-jike-imgs.one {
  grid-template-columns: 1fr;
  max-width: 200px;
}

.sghgjos-jike-imgs.one .sghgjos-jike-img {
  aspect-ratio: 4 / 3;
}

.sghgjos-jike-imgs.multi {
  grid-template-columns: repeat(3, 1fr);
}

.sghgjos-jike-imgs.four {
  grid-template-columns: repeat(2, 1fr);
  max-width: 180px;
}

.sghgjos-jike-img {
  border: 0;
  padding: 0;
  aspect-ratio: 1;
  border-radius: 4px;
  background-color: #eee;
  cursor: default;
  overflow: hidden;
  display: block;
}

.sghgjos-jike-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
}

.sghgjos-jike-item-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: var(--muted);
}

.sghgjos-jike-open {
  margin-left: auto;
  border: 0;
  background: transparent;
  color: #576b95;
  font-size: 12px;
  cursor: default;
  padding: 0;
}

.sghgjos-jike-open:hover {
  opacity: 0.75;
}

.sghgjos-jike-social {
  margin-top: 8px;
}

.sghgjos-jike-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.sghgjos-jike-like,
.sghgjos-jike-cmt-toggle {
  border: 0;
  background: transparent;
  color: #576b95;
  font-size: 12px;
  cursor: default;
  padding: 2px 6px;
  border-radius: 4px;
}

.sghgjos-jike-like.is-on {
  color: #fa5151;
  font-weight: 600;
}

.sghgjos-jike-like:hover,
.sghgjos-jike-cmt-toggle:hover {
  background: rgba(0, 0, 0, 0.04);
}

.sghgjos-jike-likes {
  margin-top: 6px;
  padding: 6px 8px;
  border-radius: 4px;
  background: #f7f7f7;
  font-size: 12px;
  color: #576b95;
  line-height: 1.4;
}

html.sghgjos-dark .sghgjos-jike-likes {
  background: #2c2c2e;
}

.sghgjos-jike-cmt-box {
  margin-top: 8px;
  padding: 8px;
  border-radius: 6px;
  background: #f7f7f7;
}

html.sghgjos-dark .sghgjos-jike-cmt-box {
  background: #2c2c2e;
}

/* Comments */
.sghgjos-cmt-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sghgjos-cmt-row {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 8px;
  font-size: 13px;
  line-height: 1.45;
  min-width: 0;
}

.sghgjos-cmt-body {
  min-width: 0;
}

.sghgjos-cmt-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  margin-bottom: 2px;
}

.sghgjos-cmt-row b {
  color: #576b95;
  font-weight: 600;
}

.sghgjos-cmt-text {
  word-break: break-word;
  overflow-wrap: anywhere;
}

.sghgjos-cmt-av {
  width: 28px;
  height: 28px;
  border-radius: 4px;
  object-fit: cover;
}

.sghgjos-cmt-av-fb {
  background: linear-gradient(135deg, #5ac8fa, #007aff);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
}

.sghgjos-cmt-time {
  font-size: 11px;
  color: var(--muted);
}

.sghgjos-cmt-head .sghgjos-cmt-time {
  margin-top: 0;
}

.sghgjos-cmt-body > .sghgjos-cmt-time {
  margin-top: 2px;
}

.sghgjos-cmt-empty {
  font-size: 12px;
  color: var(--muted);
  padding: 6px 0;
}

.sghgjos-cmt-form {
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.sghgjos-cmt-form textarea,
.sghgjos-cmt-form input {
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  padding: 8px 10px;
  font: inherit;
  font-size: 13px;
  background: #fff;
  color: var(--text);
  resize: vertical;
  outline: none;
}

html.sghgjos-dark .sghgjos-cmt-form textarea,
html.sghgjos-dark .sghgjos-cmt-form input {
  background: #1c1c1e;
  border-color: rgba(255, 255, 255, 0.12);
}

.sghgjos-cmt-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.sghgjos-cmt-meta {
  font-size: 12px;
  color: var(--muted);
}

.sghgjos-cmt-login {
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.04);
  font-size: 13px;
  color: var(--muted);
}

html.sghgjos-dark .sghgjos-cmt-login {
  background: rgba(255, 255, 255, 0.06);
}

.sghgjos-cmt-login p {
  margin: 0;
}

.sghgjos-cmt-login button {
  flex-shrink: 0;
  border: 0;
  border-radius: 6px;
  padding: 6px 12px;
  background: var(--accent);
  color: #fff;
  font: inherit;
  font-size: 13px;
  cursor: default;
}

.sghgjos-cmt-form button[type="submit"] {
  align-self: flex-end;
  border: 0;
  border-radius: 6px;
  padding: 6px 14px;
  background: var(--accent);
  color: #fff;
  font-size: 13px;
  cursor: default;
}

.sghgjos-cmt-form button[type="submit"]:disabled {
  opacity: 0.5;
}

/* Lightbox */
.sghgjos-lightbox {
  position: absolute;
  inset: 0;
  z-index: 10050;
  background: rgba(0, 0, 0, 0.88);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 12px;
}

.sghgjos-lightbox[hidden] {
  display: none !important;
}

.sghgjos-lightbox img {
  max-width: 90vw;
  max-height: 80vh;
  max-height: 80dvh;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.5);
}

.sghgjos-lightbox-cap {
  color: rgba(255, 255, 255, 0.75);
  font-size: 13px;
}

.sghgjos-lightbox-nav {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.sghgjos-lightbox-nav button {
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
  font-size: 22px;
  cursor: default;
}

.sghgjos-lightbox-nav .prev {
  left: 16px;
}
.sghgjos-lightbox-nav .next {
  right: 16px;
}

.sghgjos-lightbox-close {
  position: absolute;
  top: 16px;
  right: 16px;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 28px;
  cursor: default;
  line-height: 1;
}

/* Finder main / status (full-bleed macOS layout) */
.sghgjos-finder-main {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.sghgjos-finder-main .sghgjos-finder-list {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overflow-anchor: none;
}

.sghgjos-finder-status {
  flex-shrink: 0;
  min-height: 24px;
  height: auto;
  padding: 3px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--muted);
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  background: #f0f0f0;
  box-sizing: border-box;
}

.sghgjos-finder-status-sel {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sghgjos-finder-more {
  margin-left: auto;
  border: 0;
  background: transparent;
  color: var(--accent, #007aff);
  font-size: 11px;
  line-height: 1;
  padding: 2px 6px;
  border-radius: 4px;
  cursor: pointer;
}

.sghgjos-finder-more:hover {
  background: rgba(0, 122, 255, 0.1);
}

.sghgjos-finder-more:disabled {
  opacity: 0.55;
  cursor: default;
}

html.sghgjos-dark .sghgjos-finder-status {
  background: #2c2c2e;
  border-top-color: rgba(255, 255, 255, 0.08);
}

.sghgjos-memo-folders .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ffcc00;
  display: inline-block;
  flex-shrink: 0;
}

.sghgjos-cal-grid .day.has-event {
  position: relative;
}

.sghgjos-cal-grid .day.has-event::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  /* 相对格子短边定位，始终落在正圆内侧下方 */
  width: max(3px, 10cqmin);
  height: max(3px, 10cqmin);
  margin: 0;
  border-radius: 50%;
  transform: translate(-50%, 32cqmin);
  background: var(--accent);
  z-index: 1;
  pointer-events: none;
}

.sghgjos-cal-grid .day.today.has-event::after {
  background: #fff;
}

/* ===== Spotlight ===== */
.sghgjos-spotlight {
  /* fixed + 高于开机遮罩：深链 /?spotlight= 时保证可见 */
  position: fixed;
  inset: 0;
  z-index: 100050;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: calc(var(--menubar-h) + 12px);
  background: rgba(0, 0, 0, 0.22);
  box-shadow: inset 0 0 140px 50px rgba(0, 0, 0, 0.28);
  animation: sghgjos-spotlight-fade 0.18s ease-out;
}

.sghgjos-spotlight[hidden] {
  display: none !important;
}

@keyframes sghgjos-spotlight-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.sghgjos-spotlight-panel {
  width: min(680px, 94vw);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(246, 246, 248, 0.82);
  backdrop-filter: blur(40px) saturate(180%);
  -webkit-backdrop-filter: blur(40px) saturate(180%);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42);
  color: #1d1d1f;
  text-shadow: none;
}

html.sghgjos-dark .sghgjos-spotlight-panel {
  background: rgba(40, 40, 42, 0.88);
  color: #f5f5f7;
}

.sghgjos-spotlight-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  color: var(--muted);
}

.sghgjos-spotlight-bar input {
  flex: 1;
  border: 0;
  background: transparent;
  outline: none;
  font-size: 22px;
  font-weight: 400;
  color: inherit;
}

.sghgjos-spotlight-results {
  list-style: none;
  margin: 0;
  padding: 6px;
  max-height: 420px;
  overflow: auto;
}

.sghgjos-spotlight-results li {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  cursor: default;
  font-size: 14px;
}

.sghgjos-spotlight-results li .ico {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  display: inline-flex;
}

.sghgjos-spotlight-results li .ico .sghgjos-icon-face {
  width: 100%;
  height: 100%;
}

.sghgjos-spotlight-results li:hover,
.sghgjos-spotlight-results li.is-active {
  background: var(--accent);
  color: #fff;
}

.sghgjos-spotlight-results .meta {
  margin-left: auto;
  flex: 0 0 auto;
  font-size: 12px;
  opacity: 0.65;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.sghgjos-spotlight-results li .name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sghgjos-spotlight-results li .title {
  flex: 1 1 auto;
  min-width: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  word-break: break-word;
}

.sghgjos-spotlight-section {
  padding: 8px 14px 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* 默认浏览：应用程序一行横排；有搜索词时仍用列表 */
.sghgjos-spotlight-results.is-apps-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 2px;
  max-height: none;
  overflow-x: auto;
  padding: 4px 8px 12px;
  scrollbar-width: thin;
}

.sghgjos-spotlight-results.is-apps-row li {
  flex: 1 1 0;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  padding: 10px 4px 8px;
  text-align: center;
  font-size: 11px;
  line-height: 1.25;
}

.sghgjos-spotlight-results.is-apps-row li .ico {
  width: 40px;
  height: 40px;
}

.sghgjos-spotlight-results.is-apps-row li .name {
  display: block;
  width: 100%;
}

.sghgjos-spotlight-results.is-apps-row li .meta {
  display: none;
}

/* 横排应用：用淡蓝高亮，避免整块实色蓝底像「默认 hover」 */
.sghgjos-spotlight-results.is-apps-row li:hover,
.sghgjos-spotlight-results.is-apps-row li.is-active {
  background: color-mix(in srgb, var(--accent) 16%, transparent);
  color: inherit;
}

html.sghgjos-dark .sghgjos-spotlight-results.is-apps-row li:hover,
html.sghgjos-dark .sghgjos-spotlight-results.is-apps-row li.is-active {
  background: color-mix(in srgb, var(--accent) 28%, transparent);
  color: inherit;
}

/* ===== Launchpad ===== */
.sghgjos-launchpad {
  position: absolute;
  inset: 0;
  z-index: 9600;
  display: flex;
  align-items: stretch;
  justify-content: center;
  padding: calc(var(--menubar-h) + 28px) 24px 96px;
  background: rgba(20, 20, 24, 0.42);
  backdrop-filter: blur(28px) saturate(160%);
  -webkit-backdrop-filter: blur(28px) saturate(160%);
  animation: sghgjos-lp-fade 0.22s ease-out;
}

.sghgjos-launchpad[hidden] {
  display: none !important;
}

@keyframes sghgjos-lp-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.sghgjos-lp-panel {
  width: min(1100px, 100%);
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  animation: sghgjos-lp-rise 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes sghgjos-lp-rise {
  from {
    opacity: 0;
    transform: scale(0.96) translateY(12px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.sghgjos-lp-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}

.sghgjos-lp-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.sghgjos-lp-tab {
  border: 0;
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 13px;
  cursor: pointer;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.sghgjos-lp-tab:hover {
  background: rgba(255, 255, 255, 0.26);
}

.sghgjos-lp-tab.is-active {
  background: rgba(255, 255, 255, 0.92);
  color: #1d1d1f;
  font-weight: 600;
}

.sghgjos-lp-search {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: min(240px, 100%);
  padding: 7px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.18);
  color: rgba(255, 255, 255, 0.85);
}

.sghgjos-lp-search input {
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  color: #fff;
  font-size: 14px;
  min-width: 0;
}

.sghgjos-lp-search input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

.sghgjos-lp-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.sghgjos-lp-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  justify-content: center;
  gap: 18px 12px;
  align-content: start;
  overflow: auto;
  padding: 4px 2px 12px;
  min-height: 0;
  flex: 1;
}

.sghgjos-lp-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  border: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
  padding: 8px 4px;
  border-radius: 14px;
  transition: transform 0.16s ease, background 0.16s ease;
  min-height: auto;
  height: auto;
  align-self: start;
}

.sghgjos-lp-item:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: scale(1.04);
}

.sghgjos-lp-item:focus {
  outline: none;
}

.sghgjos-lp-item:focus-visible {
  background: rgba(255, 255, 255, 0.14);
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.85);
  transform: scale(1.04);
}

.sghgjos-lp-ico {
  width: 64px;
  height: 64px;
  min-width: 64px;
  min-height: 64px;
  max-width: 64px;
  max-height: 64px;
  flex: 0 0 64px;
  aspect-ratio: 1;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.16);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
  box-sizing: border-box;
}

.sghgjos-lp-ico-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  flex: none;
}

.sghgjos-lp-ico-fallback {
  font-size: 24px;
  font-weight: 700;
  color: #fff;
}

.sghgjos-lp-label {
  font-size: 12px;
  line-height: 1.3;
  text-align: center;
  max-width: 92px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

.sghgjos-lp-empty {
  grid-column: 1 / -1;
  text-align: center;
  color: rgba(255, 255, 255, 0.72);
  font-size: 14px;
  padding: 48px 16px;
}

.sghgjos-lp-retry {
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-decoration: underline;
  cursor: pointer;
}

.sghgjos-lp-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.sghgjos-lp-skel {
  width: 64px;
  height: 84px;
  border-radius: 16px;
  justify-self: center;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.1),
    rgba(255, 255, 255, 0.22),
    rgba(255, 255, 255, 0.1)
  );
  background-size: 200% 100%;
  animation: sghgjos-lp-shimmer 1.1s ease-in-out infinite;
}

@keyframes sghgjos-lp-shimmer {
  from {
    background-position: 100% 0;
  }
  to {
    background-position: -100% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sghgjos-lp-skel {
    animation: none;
    background: rgba(255, 255, 255, 0.14);
  }

  .sghgjos-launchpad,
  .sghgjos-lp-panel {
    animation: none;
  }
}

html.sghgjos-dark .sghgjos-launchpad {
  background: rgba(0, 0, 0, 0.55);
}

/* Keep in sync with desktop.js MQ_MOBILE; detailed mobile LP styles in desktop-apps.css */
@media (max-width: 720px), (pointer: coarse) and (hover: none) {
  .sghgjos-launchpad {
    padding: calc(var(--menubar-h) + 10px)
      max(10px, env(safe-area-inset-right, 0px))
      calc(76px + env(safe-area-inset-bottom, 0px))
      max(10px, env(safe-area-inset-left, 0px));
  }
}

/* ===== Toast ===== */
.sghgjos-toast-wrap {
  position: absolute;
  top: calc(var(--menubar-h) + 12px);
  right: 14px;
  z-index: 9900;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}

.sghgjos-toast {
  position: relative;
  min-width: 260px;
  max-width: 320px;
  padding: 12px 14px 12px 16px;
  border-radius: 12px;
  background: rgba(246, 246, 248, 0.9);
  backdrop-filter: blur(30px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
  color: #1d1d1f;
  text-shadow: none;
  pointer-events: auto;
  animation: sghgjos-toast-in 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  overflow: hidden;
}

.sghgjos-toast::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--accent, #0a84ff);
}

.sghgjos-toast.is-success::before {
  background: #30d158;
}

.sghgjos-toast.is-error::before {
  background: #ff3b30;
}

/* 日程紧迫度：今天 / 明天 / 2天以后 */
.sghgjos-toast.is-cal-today::before,
.sghgjos-notify-item.is-cal-today::before {
  background: #ff3b30;
}

.sghgjos-toast.is-cal-tomorrow::before,
.sghgjos-notify-item.is-cal-tomorrow::before {
  background: #ff9f0a;
}

.sghgjos-toast.is-cal-later::before,
.sghgjos-notify-item.is-cal-later::before {
  background: #0a84ff;
}

.sghgjos-toast.is-notify {
  background: rgba(246, 246, 248, 0.96);
}

html.sghgjos-dark .sghgjos-toast,
html.sghgjos-dark .sghgjos-toast.is-notify {
  background: rgba(44, 44, 46, 0.94);
  color: #f5f5f7;
}

html.sghgjos-dark .sghgjos-toast span {
  color: #a1a1a6;
}

.sghgjos-toast.is-out {
  animation: sghgjos-toast-out 0.25s ease forwards;
}

.sghgjos-toast strong {
  display: block;
  font-size: 13px;
  margin-bottom: 2px;
}

.sghgjos-toast span {
  font-size: 12px;
  color: #666;
}

.sghgjos-toast span[hidden] {
  display: none !important;
}

@keyframes sghgjos-toast-in {
  from {
    opacity: 0;
    transform: translateX(24px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes sghgjos-toast-out {
  to {
    opacity: 0;
    transform: translateX(24px);
  }
}

.sghgjos-mb-badge {
  position: absolute;
  /* 收进按钮内，避免被 .sghgjos-root overflow:hidden 裁切顶边/右边 */
  top: 0;
  right: 1px;
  min-width: 14px;
  height: 14px;
  padding: 0 3px;
  border-radius: 999px;
  background: #ff3b30;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  line-height: 14px;
  text-align: center;
  pointer-events: none;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
  z-index: 3;
}

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

#sghgjos-notify-btn {
  overflow: visible;
}

/* ===== Notify center ===== */
.sghgjos-notify-center {
  position: absolute;
  top: calc(var(--menubar-h) + 6px);
  right: 10px;
  z-index: 9650;
  width: min(340px, calc(100vw - 20px));
  max-height: min(420px, calc(100dvh - var(--menubar-h) - 80px));
  display: flex;
  flex-direction: column;
  padding: 12px;
  border-radius: 16px;
  background: rgba(246, 246, 248, 0.82);
  backdrop-filter: blur(36px) saturate(180%);
  -webkit-backdrop-filter: blur(36px) saturate(180%);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28);
  color: #1d1d1f;
}

.sghgjos-notify-center[hidden] {
  display: none !important;
}

html.sghgjos-dark .sghgjos-notify-center {
  background: rgba(40, 40, 42, 0.9);
  color: #f5f5f7;
}

.sghgjos-notify-center-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 2px 4px 10px;
}

.sghgjos-notify-center-head strong {
  font-size: 14px;
}

.sghgjos-notify-clear {
  border: 0;
  background: transparent;
  color: var(--accent, #0a84ff);
  font-size: 12px;
  cursor: pointer;
  padding: 2px 4px;
}

.sghgjos-notify-center-list {
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 0;
}

.sghgjos-notify-center-empty {
  padding: 28px 12px;
  text-align: center;
  font-size: 13px;
  color: #8e8e93;
}

.sghgjos-notify-center-empty[hidden] {
  display: none !important;
}

.sghgjos-notify-item {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  border-radius: 12px;
  padding: 10px 12px 10px 14px;
  background: rgba(255, 255, 255, 0.55);
  color: inherit;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

html.sghgjos-dark .sghgjos-notify-item {
  background: rgba(255, 255, 255, 0.06);
}

.sghgjos-notify-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--accent, #0a84ff);
}

.sghgjos-notify-item.is-success::before {
  background: #30d158;
}

.sghgjos-notify-item.is-error::before {
  background: #ff3b30;
}

.sghgjos-notify-item.is-cal-today::before {
  background: #ff3b30;
}

.sghgjos-notify-item.is-cal-tomorrow::before {
  background: #ff9f0a;
}

.sghgjos-notify-item.is-cal-later::before {
  background: #0a84ff;
}

.sghgjos-notify-item strong {
  display: block;
  font-size: 13px;
  margin-bottom: 2px;
}

.sghgjos-notify-item span {
  display: block;
  font-size: 12px;
  color: #666;
  line-height: 1.35;
}

html.sghgjos-dark .sghgjos-notify-item span {
  color: #a1a1a6;
}

.sghgjos-notify-item time {
  display: block;
  margin-top: 6px;
  font-size: 11px;
  color: #8e8e93;
}

.sghgjos-notify-item:hover {
  filter: brightness(1.03);
}

/* ===== Modal dialog ===== */
.sghgjos-modal-host {
  position: absolute;
  inset: 0;
  z-index: 10060;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  padding-bottom: max(20px, env(safe-area-inset-bottom, 0px));
}

.sghgjos-modal-host[hidden] {
  display: none !important;
}

.sghgjos-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.38);
}

.sghgjos-modal {
  position: relative;
  z-index: 1;
  width: min(340px, 100%);
  padding: 20px 18px 16px;
  border-radius: 14px;
  background: rgba(246, 246, 248, 0.96);
  backdrop-filter: blur(30px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
  color: #1d1d1f;
}

html.sghgjos-dark .sghgjos-modal {
  background: rgba(44, 44, 46, 0.96);
  color: #f5f5f7;
}

.sghgjos-modal h3 {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 600;
}

.sghgjos-modal-body {
  margin: 0 0 16px;
  font-size: 13px;
  line-height: 1.45;
  color: #666;
}

html.sghgjos-dark .sghgjos-modal-body {
  color: #a1a1a6;
}

.sghgjos-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.sghgjos-modal-btn {
  border: 0;
  border-radius: 8px;
  padding: 7px 14px;
  font-size: 13px;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.06);
  color: inherit;
}

html.sghgjos-dark .sghgjos-modal-btn {
  background: rgba(255, 255, 255, 0.1);
}

.sghgjos-modal-ok {
  background: var(--accent, #0a84ff);
  color: #fff;
}

html.sghgjos-dark .sghgjos-modal-ok {
  background: var(--accent, #0a84ff);
  color: #fff;
}

.sghgjos-modal-ok.is-danger {
  background: #ff3b30;
  color: #fff;
}

/* ===== Apple / touch platform polish ===== */
button,
.sghgjos-desk-icon,
.sghgjos-dock-item,
.sghgjos-lp-item,
.sghgjos-mb-icon,
.sghgjos-apple,
.sghgjos-traffic button,
.tb-btn,
.sghgjos-tb-btn {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sghgjos-window-body,
.sghgjos-reader,
.sghgjos-cmt-form,
.sghgjos-spotlight-bar input {
  -webkit-touch-callout: default;
}

.sghgjos-window-body,
.sghgjos-finder-list,
.sghgjos-finder-grid,
.sghgjos-lp-grid,
.sghgjos-spotlight-results,
.sghgjos-settings-content,
.sghgjos-memo-body-scroll,
.tb-frame {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* Keep in sync with desktop.js MQ_MOBILE */
@media (max-width: 720px), (pointer: coarse) and (hover: none) {
  input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
  textarea,
  select {
    font-size: 16px;
  }

  .sghgjos-menubar,
  .sghgjos-window,
  .sghgjos-dock,
  .sghgjos-spotlight-panel,
  .sghgjos-cc,
  .sghgjos-dropdown,
  .sghgjos-toast,
  .sghgjos-launchpad {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .sghgjos-window {
    background: var(--glass-solid);
  }

  .sghgjos-menubar {
    background: rgba(28, 28, 30, 0.9);
  }

  .sghgjos-menubar.is-dark {
    background: rgba(18, 18, 20, 0.94);
  }

  .sghgjos-dock {
    background-color: rgba(246, 246, 248, 0.92);
  }

  html.sghgjos-dark .sghgjos-dock {
    background-color: rgba(40, 40, 42, 0.94);
  }

  /* Spotlight：手机端独立布局（贴边、随键盘高度、应用横排可滑） */
  .sghgjos-spotlight {
    align-items: stretch;
    justify-content: flex-start;
    padding: calc(var(--menubar-h) + 8px)
      max(10px, env(safe-area-inset-right, 0px))
      max(12px, env(safe-area-inset-bottom, 0px))
      max(10px, env(safe-area-inset-left, 0px));
    /* 大 inset 阴影在移动端很吃 GPU */
    box-shadow: none;
    background: rgba(0, 0, 0, 0.38);
    animation: none;
  }

  .sghgjos-spotlight-panel {
    width: 100%;
    max-width: none;
    border-radius: 12px;
    background: rgba(246, 246, 248, 0.96);
    max-height: calc(var(--sghgjos-vvh, 100dvh) - var(--menubar-h) - 20px);
    display: flex;
    flex-direction: column;
    min-height: 0;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  }

  html.sghgjos-dark .sghgjos-spotlight-panel {
    background: rgba(40, 40, 42, 0.96);
  }

  .sghgjos-spotlight-bar {
    padding: 12px 14px;
    gap: 10px;
    flex: 0 0 auto;
  }

  .sghgjos-spotlight-bar input {
    font-size: 16px;
  }

  #sghgjos-spotlight-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  .sghgjos-spotlight-results {
    max-height: none;
  }

  .sghgjos-spotlight-results li {
    padding: 12px;
    min-height: 44px;
    box-sizing: border-box;
  }

  /* 空搜索横排：固定宽度横向滑动，避免挤成一排小字 */
  .sghgjos-spotlight-results.is-apps-row {
    gap: 4px;
    padding: 6px 10px 14px;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }

  .sghgjos-spotlight-results.is-apps-row li {
    flex: 0 0 auto;
    width: 72px;
    min-width: 72px;
    padding: 10px 6px 8px;
    font-size: 12px;
    scroll-snap-align: start;
  }

  .sghgjos-spotlight-results.is-apps-row li .ico {
    width: 44px;
    height: 44px;
  }

  .sghgjos-launchpad {
    /* 与 desktop-apps 一致：无毛玻璃时用不透明底，避免透出桌面 */
    background: #121216;
  }

  html.sghgjos-dark .sghgjos-launchpad {
    background: #000;
  }

  .sghgjos-toast-wrap {
    top: calc(var(--menubar-h) + 8px);
    right: max(10px, env(safe-area-inset-right, 0px));
    left: max(10px, env(safe-area-inset-left, 0px));
  }

  .sghgjos-toast {
    min-width: 0;
    max-width: none;
  }
}

/* Prevent sticky :hover styles on touch devices */
@media (hover: none) {
  .sghgjos-finder-row:hover,
  .sghgjos-finder-card:hover,
  .sghgjos-desk-icon:hover,
  .sghgjos-lp-item:hover,
  .sghgjos-tb-btn:hover:not(:disabled),
  .tb-btn:hover:not(:disabled),
  .sghgjos-menubar-menus button:hover,
  .sghgjos-mb-icon:hover {
    background: transparent;
    transform: none;
  }

  .sghgjos-lp-item:hover {
    transform: none;
  }

  /* 聚焦：触摸上禁用 :hover 蓝底，只保留 is-active / :active */
  .sghgjos-spotlight-results li:hover {
    background: transparent;
    color: inherit;
  }

  .sghgjos-spotlight-results.is-apps-row li:hover {
    background: transparent;
    color: inherit;
  }

  .sghgjos-spotlight-results li:active,
  .sghgjos-spotlight-results li.is-active {
    background: var(--accent);
    color: #fff;
  }

  .sghgjos-spotlight-results.is-apps-row li:active,
  .sghgjos-spotlight-results.is-apps-row li.is-active {
    background: color-mix(in srgb, var(--accent) 16%, transparent);
    color: inherit;
  }

  html.sghgjos-dark .sghgjos-spotlight-results.is-apps-row li:active,
  html.sghgjos-dark .sghgjos-spotlight-results.is-apps-row li.is-active {
    background: color-mix(in srgb, var(--accent) 28%, transparent);
    color: inherit;
  }
}