/* zitro.works app identity language
   Freestanding, layered marks identify apps. Lucide remains the action icon set. */
#zw-desktop {
  font-size: 14px;
  line-height: 1.48;
}

#zw-desktop h1 { font-size: 26px; }
#zw-desktop h2 { font-size: 20px; }
#zw-desktop h3 { font-size: 15px; }
#zw-desktop .zw-small { font-size: 12px; }
#zw-desktop .zw-kicker { font-size: 11px; letter-spacing: .82px; }
#zw-desktop .zw-badge { min-height: 26px; padding: 4px 9px; font-size: 11px; }
#zw-desktop .zw-btn { min-height: 37px; padding: 8px 12px; }
#zw-desktop .zw-search { min-height: 38px; font-size: 13px; }

#zw-desktop .zw-icon-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
  pointer-events: none;
}

#zw-desktop .zw-appmark {
  --zw-mark-size: 58px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: var(--zw-mark-size);
  height: var(--zw-mark-size);
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 0;
  filter: drop-shadow(0 5px 7px rgb(3 19 35 / .25));
  transition: transform .16s ease, filter .16s ease;
}

#zw-desktop .zw-appmark svg {
  display: block;
  width: var(--zw-mark-size);
  height: var(--zw-mark-size);
  overflow: visible;
}

#zw-desktop .zw-shortcut:hover .zw-appmark,
#zw-desktop .zw-app-tile:hover .zw-appmark {
  transform: translateY(-2px) scale(1.035);
  filter: drop-shadow(0 8px 10px rgb(3 19 35 / .32));
}

/* Desktop marks float freely, while the whole shortcut keeps a quiet hit area. */
#zw-desktop .zw-shortcuts {
  top: 82px;
  left: 16px;
  width: 108px;
  gap: 13px;
}

#zw-desktop .zw-shortcut {
  gap: 4px;
  min-height: 82px;
  padding: 5px 7px;
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -.1px;
  text-shadow: 0 1px 2px rgb(0 15 28 / .88), 0 0 8px rgb(0 15 28 / .46);
}

#zw-desktop .zw-shortcut:hover,
#zw-desktop .zw-shortcut:focus-visible {
  background: rgb(227 245 255 / .14);
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .16);
}

/* Window title marks are small app identities, not action glyphs. */
#zw-desktop .zw-titlebar { height: 50px; flex-basis: 50px; padding-left: 12px; }
#zw-desktop .zw-title { gap: 9px; font-size: 13.5px; }
#zw-desktop .zw-title-context { font-size: 11px; }
#zw-desktop .zw-title .zw-appmark {
  --zw-mark-size: 31px;
  margin-right: 1px;
  filter: drop-shadow(0 2px 3px rgb(3 19 35 / .2));
}
#zw-desktop .zw-title > svg.lucide { background: none; box-shadow: none; }
#zw-desktop .zw-window-controls button { width: 35px; height: 35px; }

/* App menu uses the same identity system at a compact but readable scale. */
#zw-desktop .zw-app-section h3 { font-size: 11px; }
#zw-desktop .zw-app-tile { gap: 7px; padding: 11px; font-size: 12px; line-height: 1.25; }
#zw-desktop .zw-app-tile .zw-appmark { --zw-mark-size: 43px; }
#zw-desktop .zw-app-tile small { font-size: 10px; line-height: 1.3; }

/* Dock marks stay recognizable without turning the dock into another launcher. */
#zw-desktop .zw-dock { height: 62px; }
#zw-desktop .zw-window-layer { bottom: 62px; }
#zw-desktop .zw-dock-app { height: 44px; font-size: 12px; }
#zw-desktop .zw-dock-app .zw-appmark {
  --zw-mark-size: 25px;
  filter: drop-shadow(0 2px 3px rgb(3 19 35 / .2));
}
#zw-desktop .zw-dock-status { font-size: 11px; }

/* DSM-like working scale, while retaining the existing information density. */
#zw-desktop .zw-topbar { height: 62px; }
#zw-desktop .zw-window-layer { top: 62px; }
#zw-desktop .zw-context-picker label,
#zw-desktop .zw-sim { font-size: 11px; }
#zw-desktop .zw-context-picker select { min-height: 38px; font-size: 13px; }
#zw-desktop .zw-avatar { width: 36px; height: 36px; font-size: 12px; }
#zw-desktop .zw-side-title { font-size: 11px; }
#zw-desktop .zw-side-btn { min-height: 36px; font-size: 12px; }
#zw-desktop .zw-app-head p { font-size: 12px; }
#zw-desktop .zw-row strong { font-size: 12px; }
#zw-desktop .zw-row small { font-size: 10.5px; }
#zw-desktop .zw-node strong { font-size: 12px; }
#zw-desktop .zw-node small { font-size: 10.5px; }
#zw-desktop .zw-project-tool { font-size: 11px; }
#zw-desktop .zw-file-list { font-size: 12px; }
#zw-desktop .zw-file-list th,
#zw-desktop .zw-file-list td { padding: 9px 7px; }
#zw-desktop .zw-package p { font-size: 10.5px; }
#zw-desktop .zw-package-note { font-size: 11.5px; }
#zw-desktop .zw-vm strong { font-size: 12px; }
#zw-desktop .zw-vm small { font-size: 10.5px; }
#zw-desktop .zw-cal-head,
#zw-desktop .zw-cal-times,
#zw-desktop .zw-event { font-size: 10.5px; }
#zw-desktop .zw-toast { font-size: 12px; }
#zw-desktop .zw-toast strong { font-size: 13px; }

#zw-desktop .zw-help-layout { grid-template-columns: 260px minmax(0, 1fr); }
#zw-desktop .zw-help-result strong { font-size: 12px; }
#zw-desktop .zw-help-result small { font-size: 10.5px; }
#zw-desktop .zw-help-article p,
#zw-desktop .zw-help-steps { font-size: 13.5px; }
#zw-desktop .zw-system-stat span { font-size: 11px; }
#zw-desktop .zw-system-stat strong { font-size: 19px; }
#zw-desktop .zw-field span,
#zw-desktop .zw-form-message { font-size: 12px; }
#zw-desktop .zw-files-live-entry span { font-size: 10.5px; }

@media (max-width: 720px) {
  #zw-desktop { font-size: 14px; }
  #zw-desktop .zw-topbar { height: 60px; }
  #zw-desktop .zw-window-layer { top: 60px; bottom: 63px; }
  #zw-desktop .zw-dock { height: 52px; }
  #zw-desktop .zw-titlebar { height: 48px; flex-basis: 48px; }
  #zw-desktop .zw-title { font-size: 13px; }
  #zw-desktop .zw-title-context { font-size: 10.5px; }
  #zw-desktop .zw-help-layout { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  #zw-desktop .zw-appmark { transition: none; }
}
