/* Компоновка для широких экранов, мобильная версия остаётся прежней. */
@media (min-width: 900px) {
  body.desktop-home {max-width: 1160px; padding: 0 32px 100px}
  .desktop-home .top {padding-top: 24px}
  .desktop-home .hi {margin-top:var(--sp-6)}
  .desktop-home .hi h1 {font-size: 34px}
  .desktop-home h2 {margin-top:34px}
  .desktop-home .grid {grid-template-columns: repeat(4, minmax(0, 1fr)); gap:var(--sp-3)}
  .desktop-home .tile {aspect-ratio: 1.12; padding:var(--sp-4)}
  .desktop-home .t {font-size: 17px}
  .desktop-home .nav-in {max-width: 1100px}
  .desktop-home .nav button {flex-direction: row; justify-content: center; gap:9px; font-size: 13px}
  .desktop-home .nav button svg {width: 20px; height: 20px}
  .desktop-home .nav button.on {background: var(--s2)}
  .desktop-home .grid.tools-grid {grid-template-columns: repeat(2, minmax(0, 300px))}
  body.desktop-editor #app {max-width: 1400px; padding: 0 32px 24px}
  body.menu-editor #app {display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(340px, 1fr); grid-template-rows: 76px auto 40px minmax(0, 1fr); column-gap: 32px; align-content: start}
  .menu-editor #app > .bar {grid-column: 1 / -1; grid-row: 1; height: 76px}
  .menu-editor #app > .stage {grid-column: 1; grid-row: 2; align-self: start}
  .menu-editor #app > #hint {grid-column: 1; grid-row: 3; align-self: start}
  .menu-editor #app > .sub {grid-column: 2; grid-row: 2; height: 46px; align-self: start}
  .menu-editor #app > .pane {grid-column: 2; grid-row: 2 / 5; margin-top:50px; padding:0 var(--sp-2) var(--sp-4) 0; scrollbar-width: thin; scrollbar-color: #444 transparent}
  .menu-editor #app > .pane::-webkit-scrollbar {display: block; width: 6px}
  .menu-editor #app > .pane::-webkit-scrollbar-thumb {background: #444; border-radius: 8px}
  .meta-editor #app {max-width: 1050px; padding-top:var(--sp-3)}
  .meta-editor #app > .stage {padding: 24px}
  .meta-editor #app > .edbox {min-height: 200px}
  .meta-editor #set .in {max-width: 850px}
}
/* Общие размеры ограничены для очень больших мониторов и учитывают высоту окна. */
@media (min-width: 900px) {
  .desktop-home .grid {grid-template-columns: repeat(4, minmax(0, 1fr))}
  .desktop-home .tile {aspect-ratio: 1.15; max-height: 250px}
  .menu-editor #app {grid-template-columns: minmax(0, 1.35fr) minmax(330px, 0.9fr); grid-template-rows: 72px minmax(0, auto) 36px minmax(0, 1fr); gap:0 clamp(var(--sp-4), 2.5vw, 36px)}
  .menu-editor #app > .stage {max-height: calc(100vh - 145px); overflow: hidden}
  .menu-editor #app > .stage #cv {width: auto; max-height: calc(100vh - 169px); max-width: 100%; object-fit: contain}
  .meta-editor #app {width: min(100%, 1050px)}
  .meta-editor .edbox .dr {width: 100%; display: flex}
  .meta-editor .edbox .dr .fb {max-width: none; flex: 1 1 0}
  .meta-editor .edbox .dock .row2 {justify-content: space-between; gap:var(--sp-1); padding-right:var(--sp-1); mask-image: none; -webkit-mask-image: none}
  .meta-editor .edbox .row2 .dot {flex-shrink: 0}
  .meta-editor #set .in {width: min(100%, 850px)}
}
@media (min-width: 900px) and (max-height: 650px) {
  .menu-editor #app > .stage {max-height: calc(100vh - 135px)}
  .menu-editor #app > .stage #cv {max-height: calc(100vh - 159px)}
}
@media (min-width: 1400px) {body.desktop-editor #app {max-width: 1320px}}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[contenteditable]:focus-visible {outline: 2px solid #70baff; outline-offset: 2px}
.confirm-overlay[hidden]{display:none}.confirm-overlay{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.6);display:grid;place-items:center;padding:var(--sp-4)}.confirm-dialog{width:min(320px,100%);background:#141416;color:#fff;border-radius:24px;padding:var(--sp-5) var(--sp-4) var(--sp-4);box-shadow:0 20px 60px rgba(0,0,0,.5);font:14px/1.45 var(--sans)}#confirm-title{font-size:17px;font-weight:600;letter-spacing:-.01em}.confirm-dialog p{color:#8e8e93;margin:var(--sp-1) 0 var(--sp-4)}.confirm-buttons{display:flex;gap:8px}.confirm-buttons button{flex:1;min-width:0;height:46px;border:0;border-radius:999px;background:#1c1c1e;color:#fff;font:600 15px var(--sans);cursor:pointer}.confirm-buttons button:hover{background:#222225}.confirm-buttons .confirm-accept{background:#0088ff}.confirm-buttons .confirm-accept:hover{background:#0077e6}
@media (min-width: 900px) {
  .menu-editor #app > .pane .big {flex: 0 0 auto; min-height: 64px}
}
@media (min-width: 900px) {
  .desktop-home #g1, .desktop-home #g2 {grid-template-columns: repeat(4, minmax(0, 220px)); gap:var(--sp-3)}
}
@media (min-width: 900px) {
  body.desktop-home:has(#g1) {max-width: 980px}
  .desktop-home #g1, .desktop-home #g2 {grid-template-columns: repeat(4, minmax(0, 1fr))}
}