/* ДОМ КУЛЬТУРЫ · Web compact viewport / macOS 0.9.8
   13–14" MacBooks often expose a 1024–1440 CSS-pixel viewport after browser chrome.
   Keep every workspace reachable without scaling the whole page. */

.v2-layout,.v2-workspace,.v2-inspector,.workspace-head,.workspace-tools{min-width:0}
.v2-workspace,.v2-inspector{scrollbar-gutter:stable}
.party-status-grid,.party-master-grid-v28,.participant-grid,.settings-grid{min-width:0}
.party-status-card,.party-master-card-v28,.participant-card,.settings-card{min-width:0;overflow-wrap:anywhere}
.party-own-bank-v093{border-color:var(--cyan)!important;box-shadow:0 0 0 1px rgba(22,215,223,.22),0 0 14px rgba(22,215,223,.10)!important}
.party-remote-bank-v093{border-style:dashed!important;opacity:.76}
.inspector-drawer-btn-v098.active{outline:1px solid var(--cyan);box-shadow:0 0 12px rgba(22,215,223,.18)}

@media (max-width:1440px), (max-height:820px){
  .v2-shell{grid-template-rows:54px minmax(0,1fr) 34px}
  .v2-topbar{min-width:0;height:54px;padding:4px 7px;gap:4px;overflow:hidden}
  .v2-brand{height:42px;min-width:52px;width:52px;padding:0 7px;border-right:0}
  .v2-brand strong{display:none}
  .project-chip{height:42px;min-width:108px;max-width:150px;padding:0 8px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .project-chip span{display:none}
  .global-transport{min-width:0;gap:3px}
  .transport-key,.bpm-box{height:38px;padding:0 8px;gap:5px}
  .transport-key.compact{width:38px;padding:0}
  .transport-key.compact span{display:none}
  .master-meter{display:none}
  .icon-button{width:36px;height:36px}

  .v2-layout{grid-template-columns:64px minmax(0,1fr) minmax(238px,286px)}
  .v2-sidebar{padding:5px 0}
  .nav-item{height:48px;justify-content:center;padding:0;gap:0}
  .nav-item b{display:none}
  .nav-item span{width:auto;font-size:19px}
  .v2-workspace,.v2-inspector{padding:8px}
  .workspace-head{align-items:flex-start;gap:8px;flex-wrap:wrap}
  .workspace-head>div:first-child{min-width:180px;flex:1}
  .workspace-tools{justify-content:flex-end;flex-wrap:wrap}
  .workspace-head h1{font-size:18px}
  .workspace-head p{font-size:9px}

  .pad-toolbar{align-items:flex-start;gap:6px;flex-wrap:wrap}
  .pad-grid-v2{grid-template-columns:repeat(4,minmax(94px,1fr));gap:6px}
  .pad-card-v2{min-height:96px;padding:6px}
  .pad-wave{height:31px}
  .pad-title{font-size:11px}

  .pattern-v24-head,.pattern-v24-actions,.pattern-v24-controlbar,.pattern-v24-navigation{min-width:0;flex-wrap:wrap!important}
  .pattern-grid-wrap,.piano-roll-grid-wrap,.scene-matrix-wrap,.scene-matrix-scroll-v26,.sound-table{max-width:100%;overflow:auto}
  .pattern-local-cue-v092{gap:4px!important}
  .pattern-local-cue-v092 .ui-btn{white-space:nowrap}

  .browser-v2{grid-template-columns:158px minmax(0,1fr);gap:6px}
  .browser-sidebar{padding:7px}
  .sound-row{grid-template-columns:38px minmax(130px,1fr) 70px 94px 84px;gap:5px;padding:0 6px}

  .party-room-head{display:flex;align-items:flex-start;flex-wrap:wrap}
  .party-status-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .party-master-grid-v28{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .participant-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  .v2-statusbar{height:34px;overflow:hidden}
  .status-cell{padding:0 8px;white-space:nowrap}
  .audio-device{min-width:130px;max-width:220px;overflow:hidden}
  .status-cell.cpu i{width:45px}
}

@media (max-width:1180px){
  .project-chip{min-width:82px;max-width:110px}
  .transport-key{padding:0 6px}
  .transport-key span{font-size:8px}
  .bpm-box{padding:0 5px}.bpm-box input{width:44px}
  .v2-layout{grid-template-columns:52px minmax(0,1fr) 224px}
  .nav-item{height:44px}
  .v2-inspector{padding:6px}
  .inspector-grid{grid-template-columns:1fr}
  .pad-grid-v2{grid-template-columns:repeat(4,minmax(82px,1fr))}
  .browser-v2{grid-template-columns:132px minmax(0,1fr)}
  .sound-row{grid-template-columns:34px minmax(110px,1fr) 64px 72px}.sound-row>:nth-child(5){display:none}
  .status-cell.cpu,.status-cell.network{display:none}
}

/* On narrow desktop/MacBook viewports the inspector becomes an overlay drawer.
   A dedicated ☷ top-bar button from web-inspector-drawer-v098.js keeps it fully
   reachable while giving Pattern/Scene the whole remaining width. */
@media (max-width:1100px){
  .v2-layout{grid-template-columns:52px minmax(0,1fr)!important;position:relative;overflow:hidden}
  .v2-workspace{grid-column:2;min-width:0;max-width:100%;overflow:auto}
  .v2-inspector{
    position:fixed;
    top:54px;
    right:0;
    bottom:34px;
    width:min(340px,88vw);
    max-width:88vw;
    z-index:80;
    overflow:auto;
    background:var(--panel,#11171c);
    border-left:1px solid rgba(255,255,255,.10);
    box-shadow:-18px 0 36px rgba(0,0,0,.34);
    transform:translateX(102%);
    transition:transform .16s ease-out;
    visibility:hidden;
    pointer-events:none;
  }
  .inspector-open-v098 .v2-inspector{
    transform:translateX(0);
    visibility:visible;
    pointer-events:auto;
  }
  .inspector-drawer-btn-v098{display:inline-flex!important}
  .scene-matrix-scroll-v26,.pattern-grid-wrap,.piano-roll-grid-wrap{width:100%;max-width:100%;overflow:auto}
}

@media (max-width:980px){
  .v2-layout{grid-template-columns:48px minmax(0,1fr)!important}
  .project-chip{display:none}
  #metronomeBtn,#audioInfoBtn{display:none}
  .pad-grid-v2{grid-template-columns:repeat(2,minmax(110px,1fr))}
  .party-status-grid,.party-master-grid-v28,.participant-grid{grid-template-columns:1fr!important}
}

@media (max-height:700px){
  .v2-shell{grid-template-rows:48px minmax(0,1fr) 30px}
  .v2-topbar{height:48px}
  .v2-brand,.project-chip,.transport-key,.bpm-box{height:34px}
  .nav-item{height:39px}
  .v2-workspace,.v2-inspector{padding-top:6px;padding-bottom:6px}
  .workspace-head{margin-bottom:6px}
  .section-card{margin-bottom:6px}
  .mini-wave{height:46px}
}

@media (max-width:1100px) and (max-height:700px){
  .v2-inspector{top:48px;bottom:30px}
}