.screen.bk-host { display: flex; flex-direction: column; overflow: hidden; padding-bottom: var(--sp-300); }
.bk-page { display: flex; flex-direction: column; gap: var(--sp-200); flex: 1; min-height: 0; }
.bk-page.fs-self { background: var(--bg); padding: var(--sp-200) var(--sp-300); }
.bk-head { align-items: center; }
.bk-name { display: flex; flex-direction: column; align-items: flex-start; gap: 0; min-width: 0; }
.bk-title { font-size: var(--fs-h); margin: 0; }
.bk-base { max-width: 100%; font-size: var(--fs-s); color: var(--ink2); }
.bk-head .icon-btn[aria-pressed="true"] { background: var(--a-200); color: var(--ink); }
.bk-name .title-field { min-width: 0; }
.bk-source { max-width: 220px; }

.bk-work {
  flex: 1; min-height: 0; display: grid; grid-template-columns: 220px minmax(0, 1fr);
  border: var(--bw) solid var(--line); border-radius: var(--r-l); overflow: clip; background: var(--card);
}
.bk-sheets { display: flex; flex-direction: column; min-height: 0; border-right: var(--bw) solid var(--line); }
.bk-sheets-head { display: flex; align-items: center; justify-content: space-between;
                  height: var(--h-field); padding: 0 var(--sp-100) 0 var(--sp-200); }
.bk-caption { font-size: var(--fs-s); color: var(--ink2); }
.bk-sheets-list { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column;
                  gap: var(--sp-025); padding: 0 var(--sp-100) var(--sp-100); }
.bk-sheet {
  display: flex; align-items: center; gap: var(--sp-100); flex: none;
  height: var(--h-row); padding: 0 var(--sp-100); border: 0; border-radius: var(--r-s);
  background: none; color: var(--ink); text-align: left; cursor: pointer;
}
.bk-sheet:hover { background: var(--a-100); }
.bk-sheet.on { background: var(--acc-weak); color: var(--acc-ink); }
.bk-sheet > svg { flex: none; }

.bk-editor { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.bk-desk { position: relative; display: flex; flex: 1; min-height: 0; }

.cp-pop:has(> .bk-pageset) { width: min(440px, calc(100vw - var(--sp-400))); }
.bk-pageset { display: flex; flex-direction: column; gap: var(--sp-200); padding: var(--sp-050); }
.bk-pageset-row { display: flex; flex-direction: column; gap: var(--sp-050); }
.bk-pageset-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-150) var(--sp-200); }
.bk-field { display: flex; flex-direction: column; gap: var(--sp-050); }

html[data-mob] .bk-work { grid-template-columns: minmax(0, 1fr); }
html[data-mob] .bk-sheets { display: none; }
