/* ── Display ── */
.hidden  { display: none; }
.d-block   { display: block; }
.d-inline  { display: inline; }
.d-contents { display: contents; }
.d-flex         { display: flex; }
.d-inline-block { display: inline-block; }

/* ── Flex helpers ── */
.flex-1        { flex: 1; }
.flex-shrink-0 { flex-shrink: 0; }
.flex-wrap     { flex-wrap: wrap; }
.align-center  { align-items: center; }
.align-start   { align-items: flex-start; }
.justify-between { justify-content: space-between; }
.justify-center  { justify-content: center; }
.gap-4   { gap: 4px; }
.gap-6   { gap: 6px; }
.gap-8   { gap: 8px; }
.gap-10  { gap: 10px; }
.gap-12  { gap: 12px; }
.gap-16  { gap: 16px; }
.gap-20  { gap: 20px; }

/* ── Margin ── */
.m-0    { margin: 0; }
.mb-0   { margin-bottom: 0; }
.mt-24  { margin-top: 24px; }
.mt-4   { margin-top: 4px; }
.mt-6   { margin-top: 6px; }
.mt-8   { margin-top: 8px; }
.mt-10  { margin-top: 10px; }
.mt-12  { margin-top: 12px; }
.mt-14  { margin-top: 14px; }
.mt-20  { margin-top: 20px; }
.mb-4   { margin-bottom: 4px; }
.mb-6   { margin-bottom: 6px; }
.mb-8   { margin-bottom: 8px; }
.mb-10  { margin-bottom: 10px; }
.mb-12  { margin-bottom: 12px; }
.mb-14  { margin-bottom: 14px; }
.mb-16  { margin-bottom: 16px; }
.mb-20  { margin-bottom: 20px; }
.mb-24  { margin-bottom: 24px; }
.ml-8   { margin-left: 8px; }
.ml-20  { margin-left: 20px; }
.ml-auto { margin-left: auto; }

/* ── Padding ── */
.p-0   { padding: 0; }
.p-32  { padding: 32px; }
.px-20 { padding-left: 20px; padding-right: 20px; }
.py-16 { padding-top: 16px; padding-bottom: 16px; }

/* ── Text ── */
.text-center { text-align: center; }
.text-right  { text-align: right; }
.nowrap      { white-space: nowrap; }
.break-all   { word-break: break-all; }
.fw-400 { font-weight: 400; }
.fw-600 { font-weight: 600; }
.fw-700 { font-weight: 700; }
.fw-800 { font-weight: 800; }
.fs-11  { font-size: 11px; }
.fs-12  { font-size: 12px; }
.fs-13  { font-size: 13px; }
.fs-14  { font-size: 14px; }
.lh-1   { line-height: 1; }

/* ── Colors (shared across layouts) ── */
.c-required  { color: #e53935; }
.c-danger    { color: #C62828; }
.c-subtle    { color: #9CA3AF; }
.c-muted     { color: var(--text-muted); }
.c-hint      { color: var(--text-hint); }
.c-blue      { color: var(--blue); }
.c-green     { color: #2E7D32; }
.c-orange    { color: #E65100; }
.c-success   { color: #16a34a; }
.c-error-red { color: #dc2626; }
.c-inherit   { color: inherit; }

/* ── Overflow ── */
.overflow-x-auto { overflow-x: auto; }
.overflow-hidden  { overflow: hidden; }

/* ── Misc ── */
.w-full     { width: 100%; }
.w-fit      { width: fit-content; }
.w-44       { width: 44px; }
.w-70       { width: 70px; }
.w-80       { width: 80px; }
.w-100      { width: 100px; }
.w-120      { width: 120px; }
.w-140      { width: 140px; }
.w-150      { width: 150px; }
.w-160      { width: 160px; }
.min-w-0    { min-width: 0; }
.cursor-pointer { cursor: pointer; }
.resize-none { resize: none; }
.font-mono  { font-family: 'Courier New', monospace; }
.monospace  { font-family: monospace; }
.no-list    { list-style: none; padding: 0; margin: 0; }
.text-line-through { text-decoration: line-through; }
.vertical-middle { vertical-align: middle; }