.dk-host { flex: 1; min-height: 0; position: relative; margin-top: 2px; }
.dk-root { position: absolute; inset: 0; display: flex; flex-direction: column; background: var(--face); }
.dk-row { flex: 1; min-height: 0; display: flex; }
.dk-center { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.dk-stack { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
.dk-stack.dk-left, .dk-stack.dk-right { flex: none; }
.dk-stack.dk-main { flex: 1; }
.dk-stack.dk-bottom { flex: 1; }
.dk-grp { flex: 1 1 0; min-height: 0; min-width: 0; display: flex; flex-direction: column; background: var(--face); box-shadow: var(--raised); padding: 2px; }
.dk-grp.dk-max { flex: 1; }
.dk-bar { flex: none; display: flex; align-items: flex-end; height: 22px; border-bottom: 1px solid var(--hi); }
.dk-fill { flex: 1; align-self: stretch; }
.dk-tab { touch-action: none; height: 20px; margin: 2px 0 0; padding: 0 10px; border: 0; background: var(--face); color: #000; box-shadow: inset 1px 1px var(--hi), inset -1px 0 var(--dk), inset -2px 0 var(--shadow); cursor: default; white-space: nowrap; }
.dk-tab.on { height: 22px; margin: 0 -2px -1px; position: relative; z-index: 1; }
.dk-tab:focus-visible { outline: 1px dotted #000; outline-offset: -4px; }
.dk-btn { flex: none; width: 14px; height: 14px; margin: 0 1px 3px 0; padding: 0; border: 1px solid transparent; background: transparent; }
.dk-btn svg { display: block; width: 8px; height: 8px; margin: auto; }
.dk-btn:hover { border-color: var(--dk); background: var(--hi); }
.dk-btn:active { box-shadow: var(--pushed); }
.dk-body { flex: 1; min-height: 0; position: relative; display: flex; flex-direction: column; margin-top: 2px; box-shadow: var(--sunk); background: var(--face); }
.dk-pane { flex: 1; min-height: 0; min-width: 0; position: relative; display: flex; flex-direction: column; overflow: hidden; }
.client > .dk-pane { margin-top: 0; }

.dk-split { flex: none; background: var(--face); }
.dk-split.dk-v { width: 4px; cursor: ew-resize; }
.dk-split.dk-h { height: 4px; cursor: ns-resize; }
.dk-split:hover { background: var(--shadow); }

.dk-strip { flex: none; display: flex; gap: 2px; padding: 2px; background: var(--face); }
.dk-strip.dk-left, .dk-strip.dk-right { flex-direction: column; width: 24px; }
.dk-strip.dk-bottom { height: 24px; }
.dk-strip.dk-left .dk-tab, .dk-strip.dk-right .dk-tab { height: auto; width: 20px; padding: 8px 0; margin: 0; border: 1px solid var(--dk); border-radius: 0; background: var(--face); writing-mode: vertical-rl; }
.dk-strip .dk-tab { margin: 0; border: 1px solid var(--dk); border-radius: 0; background: var(--face); }
.dk-strip .dk-tab.on { background: var(--hi); }
.dk-fly { position: absolute; z-index: 20; display: flex; box-shadow: 2px 2px 0 var(--dk); }
.dk-fly.dk-left { left: 28px; top: 0; bottom: 0; }
.dk-fly.dk-right { right: 28px; top: 0; bottom: 0; }
.dk-fly.dk-bottom { left: 0; right: 0; bottom: 28px; }
.dk-fly .dk-grp { flex: 1; }
.dk-ind { position: absolute; z-index: 30; background: rgba(0, 120, 215, 0.3); border: 1px solid #0078d7; pointer-events: none; }
.dk-ind.dk-fixed { position: fixed; z-index: 99990; }
.dk-ind[hidden] { display: none; }

.dk-mbar { z-index: 40; }
.dk-sc { margin-left: auto; padding-left: 28px; font-style: normal; }
.dk-has > .dk-sub { display: none; position: absolute; left: 100%; top: -2px; }
.dk-has { position: relative; padding-right: 14px; }
.dk-has::after { content: ''; position: absolute; right: 4px; border: 4px solid transparent; border-left-color: currentColor; border-right: 0; }
.dk-has:hover > .dk-sub { display: block; }
.vmenu.dk-menu { z-index: 2500; }
.vmenu.dk-ctx { position: fixed; }
.vmenu.dk-menu .vi { position: relative; white-space: nowrap; }