/* ============================================================
   layout-b.css — PRO. Dense terminal aesthetic.
   Mono everywhere, hard edges, hairline borders, no shadows,
   striped tables, uppercase labels.
   ============================================================ */

.layout-b { font-family: 'JetBrains Mono', monospace; }
.layout-b .pos-page { padding: 14px 18px; }
.layout-b .pos-page-title { font-family: 'JetBrains Mono', monospace; font-size: 16px; font-weight: 700; letter-spacing: 0.02em; text-transform: lowercase; }
.layout-b .pos-page-sub { font-size: 11px; }
.layout-b .pos-crumb { font-size: 10px; letter-spacing: 0.08em; }

/* Tabs — flat, no rounding, uppercase */
.layout-b .pos-tabs { padding: 2px; border-radius: 4px; gap: 2px; background: color-mix(in oklab, var(--color-text) 5%, var(--color-surface)); border: 1px solid var(--color-border); }
.layout-b .pos-tab { padding: 5px 10px; border-radius: 2px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }

/* Cards — terminal panels */
.layout-b .pos-card { border-radius: 4px; padding: 12px 14px; box-shadow: none; }
.layout-b .pos-card__head { padding-bottom: 8px; margin-bottom: 10px; border-bottom: 1px solid var(--pos-divider, var(--color-border)); }
.layout-b .pos-card__title { font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.layout-b .pos-card__sub { font-size: 10px; }

/* Stat cards — terminal readout */
.layout-b .pos-stat { padding: 10px 12px; border-radius: 4px; }
.layout-b .pos-stat__label { font-size: 10px; letter-spacing: 0.06em; }
.layout-b .pos-stat__value { font-family: 'JetBrains Mono', monospace; font-size: 22px; font-weight: 700; letter-spacing: -0.01em; margin: 4px 0; }
.layout-b .pos-stat__delta { padding: 1px 6px; font-size: 10px; border-radius: 3px; }

/* Tables — dense + zebra stripes */
.layout-b .pos-table { font-size: 11px; font-family: 'JetBrains Mono', monospace; }
.layout-b .pos-table th { padding: 6px 8px; text-transform: uppercase; font-size: 9px; letter-spacing: 0.06em; background: color-mix(in oklab, var(--color-text) 8%, var(--color-surface)); }
.layout-b .pos-table td { padding: 4px 8px; }
.layout-b .pos-table--striped tbody tr:nth-child(odd) td,
.layout-b .pos-table tbody tr:nth-child(odd) td { background: color-mix(in oklab, var(--color-text) 4%, transparent); }
.layout-b .pos-table tbody tr:hover td { background: color-mix(in oklab, var(--color-primary) 10%, transparent); }

/* List items — compact */
.layout-b .pos-list-item { padding: 6px 4px; font-size: 11px; gap: 8px; }

/* Modals — terminal dialog */
.layout-b .pos-modal { border-radius: 6px; padding: 16px; }
.layout-b .pos-modal__title { font-family: 'JetBrains Mono', monospace; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.layout-b .pos-modal__sub { font-size: 11px; }
.layout-b .pos-modal__actions { padding-top: 12px; gap: 4px; }
.layout-b .pos-modal--fullscreen { border-radius: 0; padding: 24px; width: 100vw; height: 100vh; max-height: none; }

/* Forms — compact */
.layout-b .pos-input,
.layout-b .pos-select,
.layout-b .pos-textarea { height: 30px; padding: 0 8px; border-radius: 3px; font-size: 11px; font-family: 'JetBrains Mono', monospace; }
.layout-b .pos-textarea { height: auto; min-height: 60px; padding: 6px 8px; }
.layout-b .pos-label { font-size: 9px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }

/* Buttons — square, mono, uppercase */
.layout-b .pos-btn { height: 30px; padding: 0 10px; border-radius: 3px; font-family: 'JetBrains Mono', monospace; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.layout-b .pos-btn--icon { width: 30px; padding: 0; }
.layout-b .pos-btn--sm { height: 24px; padding: 0 8px; font-size: 9px; }
.layout-b .pos-btn--lg { height: 38px; padding: 0 14px; font-size: 12px; }
.layout-b .pos-btn--primary { background: var(--color-primary); color: var(--color-btn-primary-text, #fff); }

.layout-b .pos-btn-group .pos-btn:first-child { border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
.layout-b .pos-btn-group .pos-btn:last-child  { border-top-right-radius: 3px; border-bottom-right-radius: 3px; }

/* Chips — square pills */
.layout-b .pos-chip { padding: 1px 6px; border-radius: 2px; font-size: 9px; letter-spacing: 0.06em; text-transform: uppercase; }

/* Toggle switch — small */
.layout-b .pos-switch { width: 32px; height: 18px; border-radius: 2px; }
.layout-b .pos-switch__thumb { width: 14px; height: 14px; border-radius: 2px; }
.layout-b .pos-switch.is-on .pos-switch__thumb { transform: translateX(14px); }

/* Progress bar */
.layout-b .pos-progress { height: 4px; border-radius: 0; }

/* Mono keyboard hint helper */
.layout-b kbd, .layout-b .pos-kbd { display: inline-block; padding: 1px 5px; font-family: 'JetBrains Mono', monospace; font-size: 10px; background: var(--color-background); border: 1px solid var(--color-border); border-radius: 2px; color: var(--color-text-secondary); }