/* Reusable presentation helpers extracted from the HTML templates. */
.u-hidden { display: none; }
.u-flex { display: flex; }
.u-inline-flex { display: inline-flex; }
.u-flex-1 { flex: 1; }
.u-flex-wrap { flex-wrap: wrap; }
.u-gap-6 { gap: 6px; }
.u-gap-8 { gap: 8px; }
.u-mt-8 { margin-top: 8px; }
.u-mt-12 { margin-top: 12px; }
.u-mt-16 { margin-top: 16px; }
.u-mt-32 { margin-top: 32px; }
.u-ml-8 { margin-left: 8px; }
.u-mr-8 { margin-right: 8px; }
.u-p-20 { padding: 20px; }
.u-align-middle { vertical-align: middle; }
.u-text-center { text-align: center; }
.u-text-muted { color: var(--color-muted); }
.u-text-v2-muted { color: #8290a2; }
.u-text-16 { font-size: 16px; }
.u-text-12 { font-size: 12px; }
.u-break-all { word-break: break-all; }
.u-overflow-x { overflow-x: auto; }
.u-max-none { max-width: none; }
.u-min-auto { min-height: auto; }
.u-max-h-160 { max-height: 160px; }
.u-bordered { border: 1px solid var(--color-border); }
.u-rounded-4 { border-radius: 4px; }
.u-loading { padding: 20px; text-align: center; color: var(--color-muted); }
.u-loading-compact { padding: 12px; text-align: center; color: var(--color-muted); }
.u-loading-v2 { padding: 20px; text-align: center; color: #8290a2; }
.u-result-panel { background: #0f172a; color: #e2e8f0; padding: 16px; border-radius: 6px; overflow-x: auto; min-height: 60px; }

.u-w-60 { width: 60px; }
.u-w-70 { width: 70px; }
.u-w-80 { width: 80px; }
.u-w-90 { width: 90px; }
.u-w-100 { width: 100px; }
.u-w-110 { width: 110px; }
.u-w-120 { width: 120px; }
.u-w-140 { width: 140px; }
.u-w-160 { width: 160px; }
.u-w-180 { width: 180px; }
.u-w-200 { width: 200px; }
.u-w-220 { width: 220px; }
.u-w-240 { width: 240px; }