/* Zwarta skala pulpitu XNOS — czytelność zbliżona do klasycznego systemu desktopowego. */
html:has(body.login-page) { font-size: 14px; }
html:has(body.xnos-desktop) { font-size: 13px; }

.login-shell { width: min(24rem, 100%); }
.login-card { padding: 1.65rem; border-radius: .9rem; }
.login-card .brand { margin-bottom: 2rem; }
.login-card h1 { font-size: 2.3rem; margin-bottom: 1.25rem; }
.login-card .login-form { gap: .8rem; }
.login-card input { padding: .7rem .75rem; border-radius: .55rem; }
.login-card .button { padding: .72rem .9rem; border-radius: .58rem; }
.login-card .brand-mark { width: 2.1rem; height: 2.1rem; border-radius: .55rem; }

.desktop-icons {
  top: 1.1rem;
  left: 1rem;
  bottom: 4.25rem;
  grid-template-columns: repeat(2, 5.8rem);
  grid-auto-rows: 6rem;
  gap: .15rem;
}

.desktop-icon { gap: .35rem; padding: .4rem; border-radius: .6rem; }
.desktop-icon > span { width: 3rem; height: 3rem; border-radius: .82rem; }
.desktop-icon .ui-icon { width: 1.72rem; height: 1.72rem; }
.desktop-icon strong { font-size: .78rem; max-width: 5.4rem; }
.desktop-brand { top: 1rem; right: 1.25rem; gap: .55rem; }
.desktop-brand .brand-mark { width: 2.25rem; height: 2.25rem; }
.desktop-toast { display: flex; align-items: center; gap: .8rem; transition: opacity .2s ease, transform .2s ease; }
.desktop-toast > span { min-width: 0; }
.desktop-toast > button { margin-left: auto; border: 0; border-radius: .35rem; background: transparent; color: #bcd2d8; font-size: 1.25rem; line-height: 1; cursor: pointer; }
.desktop-toast > button:hover { background: rgba(255,255,255,.1); color: #fff; }
.desktop-toast.is-leaving { opacity: 0; transform: translate(-50%,-8px); pointer-events: none; }

.window-layer { inset: 0 0 3.65rem; }
.x-window { min-width: 18rem; min-height: 13rem; border-radius: .7rem; }
.x-window[data-app="servers"] { --w: 680px !important; --h: 450px !important; }
.x-window[data-app="accounts"] { --w: 820px !important; --h: 570px !important; }
.x-window[data-app="files"] { --w: 760px !important; --h: 520px !important; }
.x-window[data-app="notes"] { --w: 650px !important; --h: 500px !important; }
.x-window[data-app="packages"] { --w: 820px !important; --h: 560px !important; }
.x-window[data-app="system"] { --w: 520px !important; --h: 400px !important; }
.x-window[data-app="activity"] { --w: 650px !important; --h: 440px !important; }
.x-window[data-app="calculator"] { --w: 300px !important; --h: 390px !important; }
.x-window[data-app^="package-"] { --w: 620px !important; --h: 440px !important; }
.window-titlebar { height: 2.45rem; flex-basis: 2.45rem; gap: .55rem; }
.window-app-icon { width: 1.55rem; height: 1.55rem; border-radius: .38rem; }
.window-actions button { width: 1.8rem; height: 1.65rem; }
.window-body { padding: 1rem; }
.window-body,
.account-list,
.notes-list,
.file-app > section {
  scrollbar-width: thin;
  scrollbar-color: #4f91a8 #091a22;
}
.window-body::-webkit-scrollbar,
.account-list::-webkit-scrollbar,
.notes-list::-webkit-scrollbar,
.file-app > section::-webkit-scrollbar { width: 10px; height: 10px; }
.window-body::-webkit-scrollbar-track,
.account-list::-webkit-scrollbar-track,
.notes-list::-webkit-scrollbar-track,
.file-app > section::-webkit-scrollbar-track { background: #091a22; }
.window-body::-webkit-scrollbar-thumb,
.account-list::-webkit-scrollbar-thumb,
.notes-list::-webkit-scrollbar-thumb,
.file-app > section::-webkit-scrollbar-thumb {
  min-height: 36px;
  border: 2px solid #091a22;
  border-radius: 99px;
  background: linear-gradient(#5ab4c5, #3b718d);
}
.window-body::-webkit-scrollbar-thumb:hover,
.account-list::-webkit-scrollbar-thumb:hover,
.notes-list::-webkit-scrollbar-thumb:hover,
.file-app > section::-webkit-scrollbar-thumb:hover { background: #64cad1; }
.window-body .page-header { margin-bottom: 1.25rem; }
.window-body .page-header h1 { font-size: 2.05rem; }
.panel { padding: 1.05rem; border-radius: .8rem; }
.server-card { padding: 1rem; border-radius: .8rem; }
.server-icon { width: 3rem; height: 3rem; }
.metrics { gap: .7rem; margin: .7rem 0; }
.metrics article { padding: .9rem; border-radius: .75rem; }
.metrics strong { font-size: 1.8rem; }
.account-form { gap: .75rem; }
.account-form fieldset { padding: .75rem; }
.choice { padding: .45rem; }
.account-row, .package-row { padding: .7rem; gap: .7rem; }
.x-window[data-app="accounts"] .window-body { overflow-y: scroll; }
.accounts-panel { min-width: 0; }
.account-card { padding: .85rem; border: 1px solid var(--line); border-radius: .75rem; background: rgba(5,15,21,.42); }
.account-summary { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .7rem; }
.account-heading { display: grid; min-width: 0; }
.account-heading small { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.account-details { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem .8rem; margin: .75rem 0 0; }
.account-details div { min-width: 0; }
.account-details dt { color: var(--muted); font-size: .72rem; }
.account-details dd { margin: .12rem 0 0; overflow-wrap: anywhere; font-size: .82rem; font-weight: 700; }
.account-actions { display: flex; align-items: flex-start; flex-wrap: wrap; gap: .45rem; margin-top: .75rem; }
.account-actions .button { padding: .5rem .7rem; font-size: .78rem; cursor: pointer; }
.button.danger { border-color: rgba(255,107,114,.45); color: #ff8e94; background: rgba(255,107,114,.08); }
.account-editor { position: relative; }
.account-editor > summary { list-style: none; user-select: none; }
.account-editor > summary::-webkit-details-marker { display: none; }
.account-editor[open] { flex-basis: 100%; }
.account-editor[open] > summary { margin-bottom: .65rem; }
.edit-account-form { grid-template-columns: 1fr 1fr; padding: .8rem; border: 1px solid var(--line); border-radius: .7rem; background: #091a22; }
.edit-account-form fieldset, .edit-account-form .button { grid-column: 1 / -1; }
.edit-account-form fieldset { display: flex; flex-wrap: wrap; gap: .4rem; }
.edit-account-form .choice { display: flex; }
.file-toolbar { margin-bottom: .75rem; }
.file-grid { gap: .55rem; }
.file-item { padding: .7rem; }
.notes-app { grid-template-columns: 16rem 1fr; gap: .75rem; }
.note-editor textarea { min-height: 15rem; }

.taskbar {
  left: .45rem;
  right: .45rem;
  bottom: .4rem;
  height: 2.85rem;
  gap: .4rem;
  padding: .28rem .35rem;
  border-radius: .75rem;
}
.start-button { position: relative; z-index: 2; flex: 0 0 auto; min-width: 6.4rem; height: 2.15rem; padding: .2rem .55rem; }
.start-button span { width: 1.65rem; height: 1.65rem; }
.task-items { padding-left: .15rem; border-left: 1px solid rgba(163,220,230,.16); }
.desktop-icon.is-selected { background: rgba(104,218,225,.14); border-color: rgba(151,235,239,.35); }
.task-item { height: 2.1rem; padding: .25rem .55rem; }
.task-clock { min-width: 4.6rem; }
.start-menu { bottom: 3.55rem; width: min(22rem, calc(100vw - 1.2rem)); }
.start-menu header { padding: .85rem; }
.start-apps { padding: .6rem; }
.start-apps button { padding: .5rem; }
.start-apps span { width: 1.8rem; height: 1.8rem; }
.start-menu footer { padding: .65rem; text-align: initial; }
.start-menu footer form { margin: 0; }
.start-menu footer .logout-button { width: 100%; display: flex; align-items: center; justify-content: flex-start; gap: .65rem; padding: .7rem .8rem; border: 1px solid rgba(255,107,114,.25); border-radius: .6rem; background: rgba(255,107,114,.08); color: #ffd6d8; font-weight: 750; cursor: pointer; }
.start-menu footer .logout-button:hover { background: rgba(255,107,114,.16); border-color: rgba(255,107,114,.5); color: #fff; }
.start-menu footer .logout-button span { color: #ff7e85; font-size: 1.15rem; }

@media (max-width: 760px) {
  html:has(body.login-page), html:has(body.xnos-desktop) { font-size: 15px; }
  .login-shell { width: min(24rem, 100%); }
  .x-window[data-app] { --w: calc(100vw - .8rem) !important; --h: calc(100vh - 5rem) !important; }
  .edit-account-form, .account-details { grid-template-columns: 1fr; }
}