/* Area stylesheet owned by b3. Layout only; components come from components.css. */
.b3-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.b3-muted { color: var(--ink-muted); }
.b3-note { color: var(--ink-muted); margin: 0 0 var(--space-4); font-size: 14px; }
.b3-pick { margin: var(--space-4) 0 0; }
.b3-help { margin: 0 0 var(--space-3); font-size: 14px; line-height: 1.5; color: var(--ink-muted); }
.b3-help:last-child { margin-bottom: 0; }
.b3-mono { font-family: var(--font-mono, ui-monospace, monospace); letter-spacing: .02em; }

.b3-tabs { display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin: 0 0 var(--space-4); }
.b3-tab { padding: 10px var(--space-4); color: var(--ink-muted); text-decoration: none; font-weight: 700; font-size: 14px; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.b3-tab:hover { color: var(--ink); }
.b3-tab.active { color: var(--ink); border-bottom-color: var(--purple); }
.b3-detail-head { margin-bottom: var(--space-3); }

.b3-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: var(--space-4); align-items: start; }
.b3-main, .b3-split > div { display: grid; gap: var(--space-4); min-width: 0; }
.b3-split { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(0, 2fr); gap: var(--space-4); align-items: start; min-width: 0; }
.b3-side { min-width: 0; }

.b3-new { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.b3-new .jm-input { width: auto; min-width: 0; }
.b3-new input.jm-input { width: 220px; max-width: 100%; }

.b3-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.b3-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.b3-wide { margin-top: var(--space-4); }
.b3-subhead { font-size: 15px; margin: var(--space-5, 24px) 0 var(--space-3); padding-top: var(--space-4); border-top: 1px solid var(--line); }
.b3-textarea { min-height: 88px; height: auto; resize: vertical; width: 100%; box-sizing: border-box; }
.b3-table .jm-table th, .b3-table .jm-table td { padding-left: 10px; padding-right: 10px; }
.b3-table .jm-table th { white-space: normal; }
.b3-flag { margin-bottom: var(--space-4); }
.b3-flag .jm-badge { white-space: normal; text-align: left; }

.b3-links-head, .b3-link-row { display: grid; grid-template-columns: 2fr 1fr 2fr 1.3fr 1.3fr; gap: var(--space-3); align-items: end; }
.b3-links-head { font-size: 13px; font-weight: 700; color: var(--ink-muted); padding-bottom: var(--space-2); border-bottom: 1px solid var(--line); margin-bottom: var(--space-3); grid-template-columns: 2fr 1fr 2fr 1.3fr 1.3fr 110px; }
.b3-link-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 110px; gap: var(--space-3); align-items: end; padding-bottom: var(--space-3); margin-bottom: var(--space-3); border-bottom: 1px solid var(--line); }
.b3-link-wrap .jm-field label, .b3-links-head + .b3-link-wrap ~ .b3-link-wrap .jm-field label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.b3-link-new { grid-template-columns: 2fr 1fr 2fr 1.3fr 1.3fr 110px; margin-top: var(--space-4); }
.b3-link-actions form { margin: 0; }
.b3-link-actions .jm-btn { width: 100%; }

.b3-tree, .b3-tree ul { list-style: none; margin: 0; padding: 0; }
.b3-tree ul { margin-left: 14px; padding-left: 14px; border-left: 1px solid var(--line-strong); }
.b3-node { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; text-decoration: none; color: var(--ink); border-left: 3px solid transparent; font-size: 14px; }
.b3-node:hover { background: var(--surface-sunken, var(--surface)); }
.b3-node.active { border-left-color: var(--purple); background: var(--surface-sunken, var(--surface)); }
.b3-node-name { font-weight: 700; }
.b3-node .b3-muted { font-size: 13px; }

.b3-dialog { border: 1px solid var(--line-strong); border-radius: 0; background: var(--surface-raised); color: var(--ink); padding: var(--space-5, 24px); max-width: 480px; }
.b3-dialog::backdrop { background: rgb(0 0 0 / .45); }
.b3-dialog h2 { margin-top: 0; }
.b3-dialog-actions { display: flex; gap: var(--space-3); justify-content: flex-end; flex-wrap: wrap; }
.b3-dialog-actions form { margin: 0; }

@media (max-width: 1279px) {
  .b3-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1023px) {
  .b3-grid, .b3-grid-2, .b3-split { grid-template-columns: 1fr; }
  .b3-links-head { display: none; }
  .b3-link-wrap { grid-template-columns: 1fr; }
  .b3-link-row, .b3-link-new { grid-template-columns: 1fr 1fr; }
  .b3-link-wrap .jm-field label { position: static; width: auto; height: auto; clip: auto; }
}
.b3-stack { display: grid; gap: var(--space-4); min-width: 0; }
.b3-stack .jm-panel-head { flex-wrap: wrap; gap: var(--space-3); }
.b3-table .jm-table td:first-child { white-space: nowrap; }
.b3-stack > *, .b3-main > *, .b3-split > *, .b3-layout > * { min-width: 0; }
.b3-table { min-width: 0; max-width: 100%; overflow-x: auto; }
.b3-table .jm-tablewrap { max-width: 100%; overflow-x: auto; }
.b3-prefill { flex-basis: 100%; margin: 0; font-size: 13px; color: var(--ink-muted); }