/* Window chrome + resize handles + snap preview + alt-tab. */

#windows-layer {
  position: absolute; inset: 0;
}
#windows-layer.ws-switching { opacity: .4; transition: opacity .1s; }

.window {
  position: absolute;
  display: flex; flex-direction: column;
  background: var(--surface-solid);
  border: 1px solid var(--stroke-2);
  border-radius: var(--radius-l);
  box-shadow: 0 24px 64px rgba(0,0,0,.5), 0 4px 16px rgba(0,0,0,.35);
  overflow: hidden;
  min-width: 320px; min-height: 200px;
  contain: layout paint style;
}
.window.focused { border-color: color-mix(in srgb, var(--accent) 45%, var(--stroke-2)); }
.window.opening { animation: winin .18s var(--ease); }
.window.closing { animation: winout .16s var(--ease) forwards; }
.window.minimized { animation: winmin .18s var(--ease) forwards; }
.window.maximized { border-radius: 0; border: none; }
@keyframes winin { from { opacity: 0; transform: scale(.96) translateY(10px) } }
@keyframes winout { to { opacity: 0; transform: scale(.96) translateY(8px) } }
@keyframes winmin { to { opacity: 0; transform: scale(.9) translateY(40px) } }

.win-titlebar {
  display: flex; align-items: center; justify-content: space-between;
  height: 38px; padding: 0 6px 0 12px;
  background: var(--bg-2);
  border-bottom: 1px solid var(--stroke);
  cursor: grab; touch-action: none; flex: none;
  user-select: none;
}
.window.maximized .win-titlebar { cursor: default; }
.win-titlebar:active { cursor: grabbing; }
.window:not(.focused) .win-titlebar { opacity: .75; }
.win-title { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 500; color: var(--text-2); min-width: 0; }
.window.focused .win-title { color: var(--text-1); }
.win-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.win-ico { color: var(--text-2); display: flex; }

.win-controls { display: flex; gap: 2px; }
.wc {
  width: 30px; height: 26px; border-radius: var(--radius-s);
  display: grid; place-items: center; color: var(--text-2);
}
.wc:hover { background: var(--hover); color: var(--text-1); }
.wc-close:hover { background: var(--danger); color: #fff; }

.win-body { flex: 1; min-height: 0; display: flex; flex-direction: column; position: relative; }

.rz { position: absolute; z-index: 6; touch-action: none; }
.rz-n { top: -4px; left: 12px; right: 12px; height: 9px; cursor: n-resize; }
.rz-s { bottom: -4px; left: 12px; right: 12px; height: 9px; cursor: s-resize; }
.rz-e { right: -4px; top: 12px; bottom: 12px; width: 9px; cursor: e-resize; }
.rz-w { left: -4px; top: 12px; bottom: 12px; width: 9px; cursor: w-resize; }
.rz-ne { top: -5px; right: -5px; width: 18px; height: 18px; cursor: ne-resize; }
.rz-nw { top: -5px; left: -5px; width: 18px; height: 18px; cursor: nw-resize; }
.rz-se { bottom: -5px; right: -5px; width: 18px; height: 18px; cursor: se-resize; }
.rz-sw { bottom: -5px; left: -5px; width: 18px; height: 18px; cursor: sw-resize; }

#snap-preview {
  position: absolute; z-index: 899;
  background: var(--accent-soft);
  border: 1.5px solid var(--accent);
  border-radius: var(--radius-l);
  pointer-events: none;
  transition: all .12s var(--ease);
  backdrop-filter: blur(2px);
}

#alt-tab {
  position: absolute; z-index: 1200; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  display: flex; gap: 10px; padding: 16px;
  background: var(--surface); border: 1px solid var(--stroke-2);
  border-radius: var(--radius-l); backdrop-filter: blur(18px);
  box-shadow: var(--shadow-w);
  max-width: 80vw; flex-wrap: wrap; justify-content: center;
}
.at-item {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 14px 16px; border-radius: var(--radius-m); min-width: 96px;
  color: var(--text-2); border: 1.5px solid transparent;
}
.at-item.active { background: var(--accent-soft); border-color: var(--accent); color: var(--text-1); }
.at-title { font-size: 11.5px; max-width: 110px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.app-crash { padding: 24px; color: var(--text-2); display: grid; gap: 8px; place-content: center; height: 100%; text-align: center; }
