.beatori-draggable-list { container-type:inline-size; display:grid; gap:var(--drag-list-spacing,8px); min-width:0; max-height:100%; overflow:auto; scrollbar-width:none; }
.beatori-draggable-list[data-show-scrollbars=true] { scrollbar-width:thin; }
.beatori-draggable-list[data-scrollable=false] { max-height:none; overflow:visible; }
.beatori-drag-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; position:relative; min-height:52px; padding:8px 12px; border:1px solid var(--theme-tube-unlit); border-radius:var(--theme-radius-sm); background:var(--theme-surface); }
.beatori-drag-content { min-width:0; color:var(--theme-text); font-size:16px; line-height:1.5; overflow-wrap:anywhere; }
.beatori-drag-content > :first-child { margin-top:0; }.beatori-drag-content > :last-child { margin-bottom:0; }
.beatori-drag-actions { display:flex; gap:4px; align-items:center; }
.beatori-drag-actions [data-drag-handle] { cursor: var(--beatori-cursor-grab, grab); touch-action:pan-y; scroll-margin-block:80px; }
.beatori-drag-actions [data-drag-handle]:active { cursor: var(--beatori-cursor-grabbing, grabbing); }
.beatori-drag-row.is-dragging > :not(.beatori-drag-targets) { opacity:.5; }
.beatori-drag-row[data-drop-position]::after { content:""; pointer-events:none; position:absolute; inset-inline:8px; height:2px; border-radius:1px; background:var(--theme-primary); }
.beatori-drag-row[data-drop-position=before]::after { top:0; }.beatori-drag-row[data-drop-position=after]::after { bottom:0; }
.beatori-drag-targets { display:none; position:absolute; inset:0; grid-template-rows:1fr 1fr; }
.beatori-draggable-list.is-dragging .beatori-drag-row:not(.is-dragging) > .beatori-drag-targets { display:grid; }
.beatori-drag-empty { min-width:0; }
@container (max-width:360px) { .beatori-drag-row { grid-template-columns:minmax(0,1fr); gap:8px; }.beatori-drag-actions { justify-content:flex-end; } }
.beatori-tree { container-type:inline-size; display:grid; gap:4px; min-width:0; }
.beatori-tree-row { position:relative; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; min-height:52px; padding:3px 8px; padding-inline-start:calc(8px + var(--tree-depth,0) * 12px); border:1px solid var(--theme-tube-unlit); border-radius:var(--theme-radius-sm); background:var(--theme-surface); scroll-margin-block:80px; }
.beatori-tree-row[hidden] { display:none; }
.beatori-tree-row:hover { background:var(--theme-surface-raised); }
.beatori-tree-row[aria-selected=true] { border-color:var(--theme-primary); background:color-mix(in srgb,var(--theme-primary) 15%,var(--theme-surface)); }
.beatori-tree-row:focus-visible { outline:2px solid var(--theme-primary); outline-offset:2px; }
.beatori-tree-identity { display:grid; grid-template-columns:44px 20px minmax(0,1fr); gap:6px; align-items:center; min-width:0; }
.beatori-tree-label { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--theme-text); font-family:var(--tree-label-font,inherit); font-size:16px; line-height:1.5; overflow-wrap:anywhere; }
.beatori-tree-label small { display:block; color:var(--theme-text-muted); font-size:13px; }
.beatori-tree-label small[hidden] { display:none; }
.beatori-tree-actions { display:flex; align-items:center; gap:4px; }
.beatori-tree-actions [data-drag-handle] { cursor: var(--beatori-cursor-grab, grab); touch-action:pan-y; }
.beatori-tree-row.is-dragging > :not(.beatori-drag-targets) { opacity:.5; }
.beatori-tree-row[data-drop-position]::after { content:""; position:absolute; pointer-events:none; inset-inline:8px; height:2px; background:var(--theme-primary); }
.beatori-tree-row[data-drop-position=before]::after { top:0; }.beatori-tree-row[data-drop-position=after]::after { bottom:0; }
.beatori-tree-row[data-drop-position=inside]::after { inset:2px; height:auto; border:2px solid var(--theme-primary); background:color-mix(in srgb,var(--theme-primary) 10%,transparent); border-radius:var(--theme-radius-sm); }
.beatori-tree .beatori-drag-targets { grid-template-rows:1fr 2fr 1fr; }
.beatori-tree.is-dragging .beatori-tree-row:not(.is-dragging) > .beatori-drag-targets { display:grid; }
.beatori-tree-menu .beatori-dropdown-panel { width:min(288px,calc(100vw - 32px)); min-width:0; }
.beatori-tree-menu .beatori-dropdown-panel button:disabled { opacity:.45; cursor: var(--beatori-cursor-arrow, default); }
@container (max-width:480px) {
    .beatori-tree-row { padding-inline-start:calc(8px + min(var(--tree-depth,0),2) * 8px); }
    .beatori-tree-actions [data-drag-handle] { display:none; }
    .beatori-tree-identity { gap:6px; }
    .beatori-tree-identity:has(> .beatori-tree-branch) { grid-template-columns:16px 20px minmax(0,1fr); }
}