/* Desktop shelves change density without scaling application documents. */
.stable-desktop {
  --desktop-rail-width: 282px;
  --desktop-panel-width: 254px;
  --desktop-item-height: 26px;
  --desktop-icon-width: 20px;
  --desktop-icon-height: 20px;
  --desktop-icon-font: 18px;
  --desktop-label-size: 11px;
  --desktop-label-height: 20px;
  --desktop-icon-gap: 8px;
  --desktop-row-gap: 1px;
  --desktop-column-gap: 0;
  --desktop-item-padding: 2px 6px;
  --desktop-panel-padding: 3px;
  --desktop-panel-gap: 8px;
  --desktop-area-gap: 7px;
  --desktop-section-gap: 15px;
  --desktop-rail-padding: 9px 8px 12px;
  --desktop-heading-size: 11px;
  --desktop-heading-height: 23px;
  --desktop-heading-line: 21px;
  --desktop-toolbar-height: 36px;
  --desktop-toolbar-padding: 5px;
  --desktop-tab-height: 25px;
  --desktop-tab-size: 11px;
  --desktop-badge-size: 10px;
  --desktop-badge-font: 8px;
}
.stable-desktop[data-desktop-size="small"] {
  --desktop-rail-width: 242px;
  --desktop-panel-width: 214px;
  --desktop-item-height: 22px;
  --desktop-icon-width: 16px;
  --desktop-icon-height: 16px;
  --desktop-icon-font: 16px;
  --desktop-label-size: 10px;
  --desktop-label-height: 16px;
  --desktop-icon-gap: 7px;
  --desktop-row-gap: 0;
  --desktop-column-gap: 0;
  --desktop-item-padding: 2px 5px;
  --desktop-panel-padding: 2px;
  --desktop-panel-gap: 6px;
  --desktop-area-gap: 5px;
  --desktop-section-gap: 11px;
  --desktop-rail-padding: 6px;
  --desktop-heading-size: 10px;
  --desktop-heading-height: 21px;
  --desktop-heading-line: 19px;
  --desktop-toolbar-height: 32px;
  --desktop-toolbar-padding: 4px;
  --desktop-tab-height: 23px;
  --desktop-tab-size: 10px;
  --desktop-badge-size: 9px;
  --desktop-badge-font: 7px;
}
.stable-desktop[data-desktop-size="large"] {
  --desktop-rail-width: 322px;
  --desktop-panel-width: 294px;
  --desktop-item-height: 30px;
  --desktop-icon-width: 24px;
  --desktop-icon-height: 24px;
  --desktop-icon-font: 20px;
  --desktop-label-size: 12px;
  --desktop-label-height: 24px;
  --desktop-icon-gap: 10px;
  --desktop-row-gap: 1px;
  --desktop-column-gap: 0;
  --desktop-item-padding: 2px 7px;
  --desktop-panel-padding: 4px;
  --desktop-panel-gap: 10px;
  --desktop-area-gap: 9px;
  --desktop-section-gap: 18px;
  --desktop-rail-padding: 11px 10px 14px;
  --desktop-heading-size: 12px;
  --desktop-heading-height: 27px;
  --desktop-heading-line: 25px;
  --desktop-toolbar-height: 42px;
  --desktop-toolbar-padding: 6px;
  --desktop-tab-height: 29px;
  --desktop-tab-size: 12px;
  --desktop-badge-size: 12px;
  --desktop-badge-font: 9px;
}
.stable-desktop[data-desktop-layout="icons"] {
  --desktop-rail-width: 342px;
  --desktop-panel-width: 314px;
  --desktop-item-height: 80px;
  --desktop-icon-width: 50px;
  --desktop-icon-height: 40px;
  --desktop-icon-font: 26px;
  --desktop-label-height: 30px;
  --desktop-icon-gap: 3px;
  --desktop-row-gap: 2px;
  --desktop-column-gap: 5px;
  --desktop-item-padding: 3px 2px;
  --desktop-badge-size: 16px;
  --desktop-badge-font: 12px;
}
.stable-desktop[data-desktop-layout="icons"][data-desktop-size="small"] {
  --desktop-rail-width: 282px;
  --desktop-panel-width: 254px;
  --desktop-item-height: 66px;
  --desktop-icon-width: 40px;
  --desktop-icon-height: 32px;
  --desktop-icon-font: 22px;
  --desktop-label-height: 26px;
  --desktop-icon-gap: 2px;
  --desktop-row-gap: 1px;
  --desktop-column-gap: 3px;
  --desktop-item-padding: 2px 1px;
  --desktop-badge-size: 13px;
  --desktop-badge-font: 10px;
}
.stable-desktop[data-desktop-layout="icons"][data-desktop-size="large"] {
  --desktop-rail-width: 402px;
  --desktop-panel-width: 374px;
  --desktop-item-height: 96px;
  --desktop-icon-width: 60px;
  --desktop-icon-height: 48px;
  --desktop-icon-font: 30px;
  --desktop-label-height: 34px;
  --desktop-icon-gap: 5px;
  --desktop-row-gap: 3px;
  --desktop-column-gap: 7px;
  --desktop-item-padding: 4px 2px;
  --desktop-badge-size: 18px;
  --desktop-badge-font: 13px;
}
.stable-desktop .desktop-columns > :is(#desktop-groups, #desktop-groups-right).desktop-rail {
  width: min(var(--desktop-rail-width), 100%);
}
.stable-desktop .rail-panels {
  gap: var(--desktop-section-gap);
  padding: var(--desktop-rail-padding);
}
.stable-desktop .stable-area { gap: var(--desktop-area-gap); }
.stable-desktop .stable-area-title { font-size: var(--desktop-heading-size); }
.stable-desktop :is(.stable-area-panels, .stable-panels) { gap: var(--desktop-panel-gap); }
.stable-desktop .stable-area .tag-frame.desktop-frame {
  width: var(--desktop-panel-width);
  padding: var(--desktop-panel-padding);
}
.stable-desktop .stable-area .frame-heading,
.stable-desktop .stable-area .frame-title { min-height: var(--desktop-heading-height); }
.stable-desktop .stable-area .frame-heading :is(h2, h3) {
  font-size: var(--desktop-heading-size);
  line-height: var(--desktop-heading-line);
}
.stable-desktop .stable-area .frame-icons,
.stable-desktop .stable-area .is-expanded .frame-icons {
  grid-auto-rows: var(--desktop-item-height);
  gap: var(--desktop-row-gap) var(--desktop-column-gap);
}
.stable-desktop .stable-area .frame-icons .desktop-icon {
  gap: var(--desktop-icon-gap);
  height: var(--desktop-item-height);
  padding: var(--desktop-item-padding);
  font-size: var(--desktop-label-size);
}
.stable-desktop[data-desktop-layout="icons"] .stable-area .frame-icons,
.stable-desktop[data-desktop-layout="icons"] .stable-area .is-expanded .frame-icons {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.stable-desktop[data-desktop-layout="icons"] .stable-area .frame-icons .desktop-icon {
  display: block;
  text-align: center;
  text-shadow: 0 1px 4px #000;
}
.stable-desktop .stable-area .frame-icons .glyph {
  width: var(--desktop-icon-width);
  height: var(--desktop-icon-height);
  margin: 0;
  font-size: var(--desktop-icon-font);
}
.stable-desktop[data-desktop-layout="icons"] .stable-area .frame-icons .glyph {
  margin: 0 auto var(--desktop-icon-gap);
  border-radius: 7px;
  background: #c5d5ae;
  box-shadow: 0 5px 16px #0002;
}
.stable-desktop[data-desktop-layout="icons"] .stable-area .frame-icons .glyph img {
  border-radius: 6px;
}
.stable-desktop .stable-area .desktop-icon > span:last-child:not(.glyph) {
  max-height: var(--desktop-label-height);
}
.stable-desktop[data-desktop-layout="icons"] .stable-area .desktop-icon > span:last-child:not(.glyph) {
  flex: none;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
}
.stable-desktop .stable-area .glyph .external-badge {
  width: var(--desktop-badge-size);
  height: var(--desktop-badge-size);
  font-size: var(--desktop-badge-font);
  line-height: calc(var(--desktop-badge-size) - 2px);
}
.stable-desktop .stable-toolbar {
  min-height: var(--desktop-toolbar-height);
  padding: var(--desktop-toolbar-padding);
}
.stable-desktop .stable-toolbar .rail-tabs > button {
  min-height: var(--desktop-tab-height);
  font-size: var(--desktop-tab-size);
}
@media (min-width: 1001px) {
  .stable-desktop .desktop-search {
    width: min(440px, calc(100% - var(--desktop-rail-width) - var(--desktop-rail-width) - 36px));
  }
}
@media (min-width: 1001px) and (max-width: 1200px) {
  .stable-desktop[data-desktop-layout="icons"][data-desktop-size="large"] .desktop-search { top: 16px; width: min(440px, calc(100% - 32px)); }
  .stable-desktop[data-desktop-layout="icons"][data-desktop-size="large"] .desktop-columns { top: 70px; }
  .stable-desktop[data-desktop-layout="icons"][data-desktop-size="large"] .desktop-search.has-status ~ .desktop-columns { top: 110px; }
}
@media (max-width: 740px) {
  .stable-desktop .desktop-columns > :is(#desktop-groups, #desktop-groups-right).desktop-rail {
    width: min(var(--desktop-rail-width), 100%);
  }
}
@media (max-width: 700px) {
  .stable-desktop[data-desktop-layout="icons"][data-desktop-size="default"] { --desktop-badge-size: 14px; --desktop-badge-font: 11px; }
}
.window.desktop-size-window:not(.maximized):not(.between-icons) {
  min-width: 270px;
  min-height: 280px;
  max-width: calc(100% - 16px);
  max-height: calc(100% - 16px);
}
.desktop-size-settings {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 16px;
  background: #f3f1e9;
  color: #28382f;
  color-scheme: light;
  font: 12px/1.4 "Segoe UI", Arial, sans-serif;
}
.desktop-size-settings h2 { margin: 0 0 14px; font: 24px/1.2 Georgia, serif; }
.desktop-size-options { min-width: 0; margin: 0; padding: 0; border: 0; }
.desktop-size-options legend { margin-bottom: 9px; padding: 0; font-size: 12px; font-weight: 600; }
.desktop-size-choices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.desktop-size-option {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 10px 8px;
  border: 1px solid #bdc8b4;
  border-radius: 6px;
  background: #fffdf6;
  cursor: pointer;
}
.desktop-size-option:has(input:checked) { border-color: #527147; background: #e4ecd8; box-shadow: inset 0 0 0 1px #527147; }
.desktop-size-option:focus-within { outline: 2px solid #42654e; outline-offset: 2px; }
.desktop-size-option input { width: 14px; height: 14px; margin: 0 0 8px; accent-color: #527147; }
.desktop-size-preview { display: flex; align-items: flex-end; justify-content: center; gap: 4px; height: 32px; margin-bottom: 10px; }
.desktop-size-preview i { width: 19px; height: 23px; border: 1px solid #768b6b; border-radius: 3px; background: #b5cba3; box-shadow: inset 0 -5px 0 #ffffff55; }
[data-preview="small"] .desktop-size-preview { gap: 2px; }
[data-preview="small"] .desktop-size-preview i { width: 14px; height: 17px; }
[data-preview="large"] .desktop-size-preview { gap: 5px; }
[data-preview="large"] .desktop-size-preview i { width: 23px; height: 29px; }
.stable-desktop[data-desktop-layout="outline"] .desktop-size-preview {
  --preview-icon-size: 7px;
  --preview-label-width: 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
}
.stable-desktop[data-desktop-layout="outline"] [data-preview="small"] .desktop-size-preview {
  --preview-icon-size: 5px;
  --preview-label-width: 24px;
}
.stable-desktop[data-desktop-layout="outline"] [data-preview="large"] .desktop-size-preview {
  --preview-icon-size: 9px;
  --preview-label-width: 40px;
}
.stable-desktop[data-desktop-layout="outline"] .desktop-size-preview i {
  position: relative;
  flex: none;
  width: calc(var(--preview-icon-size) + 4px + var(--preview-label-width));
  height: var(--preview-icon-size);
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}
.stable-desktop[data-desktop-layout="outline"] .desktop-size-preview i::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  box-sizing: border-box;
  width: var(--preview-icon-size);
  height: var(--preview-icon-size);
  border: 1px solid #768b6b;
  border-radius: 1px;
  background: #b5cba3;
}
.stable-desktop[data-desktop-layout="outline"] .desktop-size-preview i::after {
  content: '';
  position: absolute;
  top: 50%;
  left: calc(var(--preview-icon-size) + 4px);
  width: var(--preview-label-width);
  height: 2px;
  border-radius: 1px;
  background: #92a683;
  transform: translateY(-50%);
}
.desktop-size-copy strong { display: block; font-size: 12px; font-weight: 600; }
.desktop-size-copy > span { display: block; margin-top: 4px; color: #65745e; font-size: 10px; }
.desktop-size-note { margin: 14px 0 0; color: #65745e; font-size: 11px; }
.desktop-layout-options { min-width: 0; margin: 0 0 14px; padding: 0; border: 0; }
.desktop-layout-options legend { margin-bottom: 9px; padding: 0; font-size: 12px; font-weight: 600; }
.desktop-layout-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.desktop-layout-option { display: grid; grid-template-columns: 14px 36px minmax(0, 1fr); align-items: center; gap: 8px; min-width: 0; padding: 10px 8px; border: 1px solid #bdc8b4; border-radius: 6px; background: #fffdf6; cursor: pointer; }
.desktop-layout-option:has(input:checked) { border-color: #527147; background: #e4ecd8; box-shadow: inset 0 0 0 1px #527147; }
.desktop-layout-option:focus-within { outline: 2px solid #42654e; outline-offset: 2px; }
.desktop-layout-option input { width: 14px; height: 14px; margin: 0; accent-color: #527147; }
.desktop-layout-preview { display: grid; grid-template-columns: repeat(3, 9px); align-content: center; gap: 3px; height: 32px; }
.desktop-layout-preview i { display: block; position: relative; width: 9px; height: 9px; border: 1px solid #768b6b; border-radius: 2px; background: #b5cba3; }
[data-layout-preview="outline"] { grid-template-columns: 1fr; gap: 4px; }
[data-layout-preview="outline"] i { width: 7px; height: 6px; }
[data-layout-preview="outline"] i::after { content: ''; position: absolute; left: 10px; top: 1px; width: 22px; height: 2px; border-radius: 1px; background: #92a683; }
@media (max-width: 360px) {
  .desktop-size-settings { padding: 12px; }
  .desktop-size-choices { gap: 5px; }
  .desktop-size-option { padding: 8px 5px; }
  [data-preview="large"] .desktop-size-preview { gap: 3px; }
  [data-preview="large"] .desktop-size-preview i { width: 19px; }
  .desktop-layout-choices { gap: 5px; }
  .desktop-layout-option { grid-template-columns: 14px minmax(0, 1fr); gap: 6px; padding: 8px 5px; }
  .desktop-layout-option .desktop-layout-preview { display: none; }
}
