/* ═════════════════════════════════════════════════════════════════════════
   ONE CORNER (2026-11-02)
   Operator: "lets not mix and use a consistent border radius across the
   page" — then, from the four-way comparison (claude-design/skills/dc-skill/
   dc-radius-compare.html): "lets try all pills".

   Every control, filter box, tag and status label takes `--dc-radius-ctl`
   (999px). Loaded LAST (app.py) so it wins over the per-component radii that
   grew up separately (segment 10px, header filters 5px, tags 4px, chips 5px,
   Bootstrap inputs 7px). To change the shape everywhere, change the token.

   Deliberately NOT here: panels (cards, the drawer, modal boxes, popovers)
   keep --dc-radius-lg; circles (avatars, dots, spinners) stay circles;
   posters/thumbnails and tick boxes keep their small corners.
   ═════════════════════════════════════════════════════════════════════════ */

.ig-bar .ig-sb, .ig-canvas-head .ig-sb, .ig-rail__label .ig-sb, .ig-rail__filters .ig-sb,
.ig-bar .ig-sb-select, .ig-canvas-head .ig-sb-select, .ig-rail__label .ig-sb-select, .ig-rail__filters .ig-sb-select,
.vnd-subrow .ig-sb-select, .fst-subrow .ig-sb-select,
.ig-bar .ig-sb-date, .ig-canvas-head .ig-sb-date,
.ig-seg, .ig-tab,
.dc-wtoggle, .ig-canvas-head .dc-wtoggle,
.btn, .form-control, .form-select,
.dc-modal .form-control,
.ig-rail__search-box,
.dc-table-output .tabulator-header-filter input,
.dc-table-output .tabulator-header-filter select,
.dc-hf-btn,
.dc-hf-pop__search,
.dc-hf-range__input {
  border-radius: var(--dc-radius-ctl);
}
/* A segment clips its end buttons to the same round ends. */
.ig-seg { overflow: hidden; }
.ig-seg > button:first-child { border-radius: var(--dc-radius-ctl) 0 0 var(--dc-radius-ctl); }
.ig-seg > button:last-child  { border-radius: 0 var(--dc-radius-ctl) var(--dc-radius-ctl) 0; }
.ig-seg > button:only-child  { border-radius: var(--dc-radius-ctl); }

/* Tags, chips and status labels. */
.tag, .dc-table-output .tag,
.dc-pill, .dc-chip,
.dc-hf-btn__cnt,
.cur-people__pill,
.ig-tab-count,
.selectize-input .item {
  border-radius: var(--dc-radius-ctl);
}

/* Panels stay boxes: a 240px pill would not read as a panel. */
.dc-hf-pop { border-radius: var(--dc-radius-lg); }

/* A multi-line text box is a small panel, not a pill: at 999px its corners
   clip the first and last letters of every line (2026-11-04, Add playlist
   note). One-line inputs keep the pill. */
textarea.form-control, .dc-modal textarea.form-control,
textarea.ig-input { border-radius: var(--dc-radius-lg); }