/* =============================================================
   TrainBase Utility CSS  —  SEC-014 (remove unsafe-inline)
   Generated to replace ALL inline style="..." attributes.
   DO NOT remove classes — many are referenced across templates.
   ============================================================= */

/* ---- Display ---- */
.u-hidden        { display: none !important; }
.u-block         { display: block; }
.u-inline        { display: inline; }
.u-inline-block  { display: inline-block; }
.u-flex          { display: flex; }
.u-grid          { display: grid; }
.u-flex-inline   { display: inline-flex; }

/* ---- Flex helpers ---- */
.u-flex-center        { display: flex; align-items: center; }
.u-flex-center-gap8   { display: flex; align-items: center; gap: 8px; }
.u-flex-center-gap10  { display: flex; align-items: center; gap: 10px; }
.u-flex-center-gap12  { display: flex; align-items: center; gap: 12px; }
.u-flex-center-gap15  { display: flex; align-items: center; gap: 15px; }
.u-flex-sb            { display: flex; justify-content: space-between; align-items: center; }
.u-flex-sb-mb15       { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; }
.u-flex-sb-mb20       { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.u-flex-sb-mt15       { display: flex; justify-content: space-between; align-items: center; margin-top: 15px; padding: 10px 0; }
.u-flex-sb-wrap       { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.u-flex-col           { display: flex; flex-direction: column; }
.u-flex-gap8          { display: flex; gap: 8px; }
.u-flex-gap10         { display: flex; gap: 10px; }
.u-flex-gap12         { display: flex; gap: 12px; }
.u-flex-center-jc     { display: flex; gap: 10px; justify-content: center; }
.u-flex-center-jc-mt20 { display: flex; gap: 10px; justify-content: center; margin-top: 20px; }
.u-flex-fs-gap10      { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; font-size: 0.85em; color: #475569; line-height: 1.5; }
.u-flex-sb-jsb        { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid #1e293b; }
.u-flex-3col          { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.u-flex-2col          { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; font-family: monospace; font-size: 1.1em; color: #e0e0e0; }
.u-grid-gap16         { display: grid; gap: 16px; }
.u-flex-1             { flex: 1; }
.u-flex-1-min120      { flex: 1; min-width: 120px; }
.u-flex-1-overflow    { flex: 1; overflow: hidden; }

/* ---- Text alignment ---- */
.u-text-center     { text-align: center; }
.u-text-left       { text-align: left; }
.u-text-right      { text-align: right; }

/* ---- Colors ---- */
.u-color-primary        { color: var(--primary); }
.u-color-primary-link   { color: var(--primary); text-decoration: none; font-weight: 600; }
.u-color-primary-link-sm { color: var(--primary); text-decoration: none; font-weight: 600; font-size: 0.9em; }
.u-color-primary-underline { color: var(--primary); text-decoration: underline; }
.u-color-dark           { color: var(--dark); }
.u-color-dark-card      { color: var(--dark); }
.u-color-white          { color: #fff; }
.u-color-white-08       { color: rgba(255,255,255,0.8); }
.u-color-muted          { color: var(--text-muted); }
.u-color-slate          { color: #94a3b8; }
.u-color-slate-75       { color: #9ca3af; }
.u-color-slate-dark     { color: #64748b; }
.u-color-slate-475      { color: #475569; }
.u-color-slate-mid      { color: #9ca3a4; }
.u-color-blue           { color: #2563eb; }
.u-color-blue-light     { color: #3b82f6; }
.u-color-blue-60a       { color: #60a5fa; }
.u-color-blue-3498      { color: #3498db; }
.u-color-green          { color: #10b981; }
.u-color-green-059      { color: #059669; }
.u-color-green-27ae     { color: #27ae60; }
.u-color-green-34d      { color: #34d399; }
.u-color-green-065      { color: #065f46; }
.u-color-amber          { color: #f59e0b; }
.u-color-amber-fbbf     { color: #fbbf24; }
.u-color-amber-f39      { color: #f39c12; }
.u-color-red            { color: #ef4444; }
.u-color-red-e74        { color: #e74c3c; }
.u-color-red-dc2        { color: #dc2626; }
.u-color-red-f87        { color: #f87171; }
.u-color-red-fca        { color: #fca5a5; }
.u-color-red-b91        { color: #b91c1c; }
.u-color-purple         { color: #8b5cf6; }
.u-color-purple-a78     { color: #a78bfa; }
.u-color-indigo-6366    { color: #6366f1; }
.u-color-pink-ec48      { color: #ec4899; }
.u-color-dark-0f1       { color: #0f172a; }
.u-color-dark-1e2       { color: #1e293b; }
.u-color-e0e0           { color: #e0e0e0; }
.u-color-f8fa           { color: #f8fafc; }
.u-color-a8b3           { color: #a8b3b4; }
.u-color-777            { color: #777; }
.u-color-aaa            { color: #aaa; }
.u-color-ccc            { color: #ccc; }

/* ---- Font sizes ---- */
.u-fs-07   { font-size: 0.7em; }
.u-fs-075  { font-size: 0.75em; }
.u-fs-078  { font-size: 0.78em; }
.u-fs-08   { font-size: 0.8em; }
.u-fs-085  { font-size: 0.85em; }
.u-fs-088  { font-size: 0.88em; }
.u-fs-09   { font-size: 0.9em; }
.u-fs-092  { font-size: 0.92em; }
.u-fs-095  { font-size: 0.95em; }
.u-fs-105  { font-size: 1.05em; }
.u-fs-11   { font-size: 1.1em; }
.u-fs-12px { font-size: 12px; }
.u-fs-13   { font-size: 1.3em; }
.u-fs-15   { font-size: 1.5em; }
.u-fs-115  { font-size: 1.15em; }
.u-fs-14   { font-size: 1.4em; }
.u-fs-18   { font-size: 1.8em; }
.u-fs-25   { font-size: 2.5em; }
.u-fs-05-vm { font-size: 0.5em; vertical-align: middle; }

/* ---- Font weight ---- */
.u-fw-500  { font-weight: 500; }
.u-fw-600  { font-weight: 600; }
.u-fw-700  { font-weight: 700; }
.u-fw-bold { font-weight: bold; }
.u-fw-800  { font-weight: 800; }

/* ---- Margin helpers ---- */
.u-m0          { margin: 0; }
.u-m0-white    { margin: 0; color: white; }
.u-m0-b8-sm    { margin: 0 0 8px; font-size: 1em; color: var(--dark); }
.u-m0-b8-lg    { margin: 0 0 8px; font-size: 1.1em; color: var(--dark); }
.u-m0-b12      { margin: 0 0 12px 0; }
.u-m0-b14-white { margin: 0 0 14px; color: #fff; font-size: 1.1em; }
.u-m0-b8       { margin: 0 0 8px 0; }
.u-mt0         { margin-top: 0; }
.u-mt4         { margin-top: 4px; }
.u-mt5         { margin-top: 5px; color: rgba(255,255,255,0.8); }  /* legacy compound */
.u-mt10        { margin-top: 10px; }
.u-mt15        { margin-top: 15px; }
.u-mt16        { margin-top: 16px; }
.u-mt20        { margin-top: 20px; }
.u-mt25        { margin-top: 25px; }
.u-mt30        { margin-top: 30px; }
.u-mt40        { margin-top: 40px; }
.u-mt50        { margin-top: 50px; }
.u-mb4         { margin-bottom: 4px; }
.u-mb5         { margin-bottom: 5px; }
.u-mb6         { margin-bottom: 6px; }
.u-mb8         { margin-bottom: 8px; }
.u-mb10        { margin-bottom: 10px; }
.u-mb12        { margin-bottom: 12px; }
.u-mb14        { margin-bottom: 14px; }
.u-mb15        { margin-bottom: 15px; }
.u-mb16        { margin-bottom: 16px; }
.u-mb20        { margin-bottom: 20px; }
.u-mb30        { margin-bottom: 30px; }
.u-mb40        { margin-bottom: 40px; }
.u-mr4         { margin-right: 4px; }
.u-mr5         { margin-right: 5px; }
.u-mr6         { margin-right: 6px; }
.u-mr8         { margin-right: 8px; }
.u-ml4         { margin-left: 4px; }
.u-ml20        { margin-left: 20px; }
.u-m16-0       { margin: 16px 0; }
.u-m12-0       { margin: 12px 0; }
.u-m8-0        { margin: 8px 0; }
.u-m4-0-t      { margin: 4px 0 0; }
.u-m8-0-t      { margin: 8px 0 0; }
.u-m0-line18   { margin: 0; line-height: 1.8; }
.u-mt20-color-sl { margin-top: 20px; color: #475569; }
.u-mt20-center  { text-align: center; margin-top: 20px; }
.u-mt20-center-sl { text-align: center; margin-top: 20px; color: #64748b; }
.u-mt15-center  { text-align: center; margin-top: 15px; color: #64748b; }
.u-mt30-center  { text-align: center; margin-top: 30px; }
.u-mt30-slate   { color: #0f172a; margin-top: 30px; }
.u-mt40-slate   { color: #94a3b8; font-size: 0.9em; margin-top: 40px; }
.u-mt25-border  { margin-top: 25px; padding-top: 20px; border-top: 1px solid #e2e8f0; }

/* ---- Padding helpers ---- */
.u-p0          { padding: 0; }
.u-p8          { padding: 8px; }
.u-p10         { padding: 10px; }
.u-p15         { padding: 15px; }
.u-p20         { padding: 20px; }
.u-p24-28      { padding: 24px 28px; }
.u-p30         { padding: 30px; }
.u-p40         { padding: 40px; }
.u-p6-12       { padding: 6px 12px; }
.u-p8-12       { padding: 8px 12px; }
.u-p10-12      { padding: 10px 12px; }
.u-p10-20      { padding: 10px 20px; }
.u-p12-15      { padding: 12px 15px; }
.u-p12-16      { padding: 12px 16px; font-weight: 500; }
.u-p6-14       { padding: 6px 14px; font-size: 0.85em; }
.u-p6-12-sm    { padding: 6px 12px; font-size: 0.85em; }
.u-p8-20-br8   { padding: 8px 20px; border-radius: 8px; }
.u-p7-12-dark  { padding: 7px 12px; background: #1e293b; border: 1px solid #334155; border-radius: 8px; color: #e0e0e0; font-size: 0.85em; cursor: pointer; }
.u-pl16-m2     { padding-left: 16px; margin: 2px 0; }

/* ---- Width/Height ---- */
.u-w100        { width: 100%; }
.u-w100-bc     { width: 100%; box-sizing: border-box; }
.u-w-18h-18    { width: 18px; height: 18px; }
.u-w-sep       { width: 1px; height: 30px; background: #555; margin: 0 10px; }

/* ---- Border helpers ---- */
.u-bb-1-1e2    { border-bottom: 1px solid #1e293b; }
.u-bb-1-e2e    { border-bottom: 1px solid #e2e8f0; }
.u-bb-2-334    { border-bottom: 2px solid #334155; }
.u-bb-1-var    { border-bottom: 1px solid var(--border); }
.u-bt-rgba     { border-top: 1px solid rgba(255,255,255,0.05); }

/* ---- Background helpers ---- */
.u-bg-success-soft { background: #f0fdf4; padding: 6px 12px; border-radius: 20px; border: 1px solid #bbf7d0; }
.u-bg-555          { background: #555; }
.u-bg-e74          { background: #e74c3c; }
.u-bg-27ae         { background: #27ae60; }
.u-bg-6366         { background: #6366f1; padding: 6px 14px; font-size: 0.85em; }
.u-bg-374-sm       { background: #374151; padding: 6px 12px; font-size: 0.85em; }
.u-bg-374-md       { background: #374151; padding: 6px 14px; font-size: 0.85em; }
.u-bg-334-link     { background: #334155; padding: 10px 18px; font-size: 0.85em; border-radius: 6px; text-decoration: none; color: #cbd5e1; }

/* ---- Opacity / cursor ---- */
.u-opacity-05     { opacity: 0.5; cursor: not-allowed; }
.u-opacity-06-fr  { opacity: 0.6; float: right; }
.u-opacity-03-mb  { margin-bottom: 15px; opacity: 0.3; }
.u-cursor-pointer   { cursor: pointer; }
.u-cursor-crosshair { cursor: crosshair; }
.u-cursor-default   { cursor: default; }

/* ---- Position ---- */
.u-position-relative { position: relative; }
.u-position-fixed-top { position: fixed; top: 0; left: 0; right: 0; padding: 15px 20px; background: rgba(15, 23, 42, 0.95); border-bottom: 1px solid #334155; z-index: 100; }

/* ---- Overflow ---- */
.u-overflow-y-400 { max-height: 400px; overflow-y: auto; }
.u-overflow-y-180 { max-height: 180px; overflow-y: auto; background: #1a1a2e; border: 1px solid #555; border-radius: 6px; padding: 8px; }

/* ---- Text decorations / transform ---- */
.u-uppercase-sm    { text-transform: uppercase; font-size: 0.9em; }
.u-uppercase-092   { text-transform: uppercase; font-size: 0.92em; }
.u-line-height-16  { line-height: 1.6; }
.u-line-height-18  { line-height: 1.8; }
.u-line-height-20  { line-height: 2; }

/* ---- Table styles ---- */
.u-table           { width: 100%; border-collapse: collapse; }
.u-table-m12       { width: 100%; border-collapse: collapse; margin: 12px 0; }
.u-table-m16       { width: 100%; border-collapse: collapse; margin: 16px 0; }
.u-table-sm        { width: 100%; border-collapse: collapse; font-size: 0.9em; }

/* ---- Table cell / header styles ---- */
.u-td-p8           { padding: 8px; }
.u-td-p8-center    { padding: 8px; text-align: center; }
.u-td-p8-center-fw { padding: 8px; text-align: center; font-weight: 600; }
.u-td-p8-left      { padding: 8px; text-align: left; }
.u-td-p8-center-slate { padding: 8px; color: #94a3b8; text-align: center; }
.u-td-p8-left-slate   { padding: 8px; color: #94a3b8; text-align: left; }
.u-td-p8-center-amber { padding: 8px; text-align: center; color: #fbbf24; }
.u-td-p8-center-purple { padding: 8px; text-align: center; color: #a78bfa; }
.u-td-p8-center-red   { padding: 8px; text-align: center; color: #f87171; }
.u-td-p8-purple    { padding: 8px; text-align: center; color: #a78bfa; }
.u-td-p10          { padding: 10px; }
.u-td-p10-slate    { padding: 10px; color: #94a3b8; }
.u-td-p10-blue     { padding: 10px; font-weight: 600; color: #60a5fa; }
.u-td-p10-purple   { padding: 10px; font-weight: 600; color: #a78bfa; }
.u-td-p10-lg-amber { padding: 10px; font-size: 1.3em; color: #fbbf24; font-weight: 700; }
.u-td-p10-lg-purple { padding: 10px; font-size: 1.3em; color: #a78bfa; font-weight: 700; }
.u-td-p10-lg-green  { padding: 10px; font-size: 1.3em; color: #34d399; font-weight: 700; }
.u-th-p12-15       { padding: 12px 15px; color: #9ca3af; font-weight: 600; font-size: 0.85em; text-transform: uppercase; }
.u-th-p12-15-left  { padding: 12px 15px; text-align: left; color: #9ca3af; font-size: 0.8em; text-transform: uppercase; }
.u-th-p12-15-center { padding: 12px 15px; text-align: center; color: #9ca3af; font-size: 0.8em; text-transform: uppercase; }
.u-th-p12-15-plain  { padding: 12px 15px; text-align: center; }
.u-th-p10-12-slate  { padding: 10px 12px; color: #9ca3af; font-weight: 600; }
.u-th-p15-slate     { padding: 15px; color: #9ca3af; font-weight: 600; font-size: 0.85em; text-transform: uppercase; }
.u-th-p12-slate-2col { padding: 12px 15px; color: #9ca3af; font-weight: 600; font-size: 0.85em; text-transform: uppercase; text-align: center; }
.u-th-p12-e2e      { padding: 12px 15px; color: #e2e8f0; }

/* ---- Card/container patterns ---- */
.u-card-white      { padding: 25px; background: white; border: 1px solid #e2e8f0; border-radius: 10px; }
.u-card-light      { padding: 30px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 12px; text-align: center; }
.u-card-dark       { padding: 25px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: 12px; }
.u-card-dark-deep  { background: #0f172a; border: 1px solid #334155; border-radius: 12px; padding: 20px; text-align: center; }
.u-card-dark-sm    { background: #0f172a; border: 1px solid #334155; border-radius: 8px; padding: 16px; margin: 10px 0; }
.u-card-dark-sm-center { background: #1e293b; border: 1px solid #334155; border-radius: 8px; padding: 16px; text-align: center; }
.u-card-dark-sm2   { background: #1e293b; border: 1px solid #334155; border-radius: 8px; padding: 14px; text-align: center; }
.u-card-dk-deep    { background: #0f172a; border: 1px dashed #334155; border-radius: 8px; padding: 20px; text-align: center; color: #475569; }
.u-card-dk-border  { background: var(--dark-card); border-radius: 10px; padding: 20px; border: 1px solid var(--border); }
.u-card-dk-overflow { background: var(--dark-card); border-radius: 10px; overflow: hidden; }
.u-card-2c50       { background: #2c3e50; border-radius: 10px; padding: 20px; border: 1px solid #34495e; }
.u-card-1e2-border { background: #1e293b; border: 2px solid #334155; border-radius: 16px; padding: 30px; margin-top: 30px; }
.u-card-1f29       { background: #1f2937; color: #d1d5db; border: 1px solid #374151; padding: 8px 12px; border-radius: 8px; font-size: 0.85em; }
.u-card-0f1-deep   { background: #0f172a; border: 1px solid #334155; border-radius: 14px; padding: 24px; margin: 24px 0; }
.u-card-0f1-sm     { background: #0f172a; border: 1px solid #334155; border-radius: 12px; padding: 24px; }
.u-card-error      { padding: 10px; background: #fee2e2; color: #b91c1c; border-radius: 6px; margin-bottom: 20px; text-align: center; }
.u-card-success    { padding: 10px; background: #ecfdf5; color: #065f46; border-radius: 6px; margin-bottom: 20px; text-align: center; }
.u-card-success-b  { background: #ecfdf5; border: 1px solid #10b981; padding: 15px; border-radius: 8px; text-align: center; margin-bottom: 20px; }
.u-card-page       { max-width: 400px; margin: 80px auto; padding: 40px; background: white; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
.u-card-page-center { max-width: 450px; margin: 100px auto; padding: 40px; background: white; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); text-align: center; }
.u-card-rgba-05    { background: rgba(255,255,255,0.05); text-align: left; }

/* ---- Bordered left panels ---- */
.u-panel-blue    { background: #1e293b; border-radius: 10px; padding: 16px; border-left: 4px solid #3b82f6; }
.u-panel-green   { background: #1e293b; border-radius: 10px; padding: 16px; border-left: 4px solid #34d399; }
.u-panel-purple  { background: #1e293b; border-radius: 10px; padding: 16px; border-left: 4px solid #a78bfa; }

/* ---- Bordered box styles ---- */
.u-box-blue      { background: #1e293b; border: 2px solid #3b82f6; border-radius: 8px; padding: 8px 16px; }
.u-box-green     { background: #1e293b; border: 2px solid #34d399; border-radius: 8px; padding: 8px 16px; }
.u-box-purple    { background: #1e293b; border: 2px solid #a78bfa; border-radius: 8px; padding: 8px 16px; }

/* ---- Badge / tag styles ---- */
.u-badge-red     { background: #dc2626; color: #fff; padding: 4px 10px; border-radius: 8px; font-size: 0.8em; font-weight: 700; }
.u-badge-amber   { background: #f0fdf4; padding: 6px 12px; border-radius: 20px; border: 1px solid #bbf7d0; }

/* ---- Icon circle styles ---- */
.u-icon-circle-blue  { width: 60px; height: 60px; background: #eff6ff; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 15px; }
.u-icon-avatar-blue  { width: 48px; height: 48px; border-radius: 50%; background: rgba(59,130,246,0.2); display: flex; align-items: center; justify-content: center; font-size: 1.3em; color: #60a5fa; }
.u-icon-avatar-amber { width: 48px; height: 48px; border-radius: 50%; background: rgba(251,191,36,0.2); display: flex; align-items: center; justify-content: center; font-size: 1.3em; color: #fbbf24; }
.u-icon-avatar-green { width: 48px; height: 48px; border-radius: 50%; background: rgba(16,185,129,0.2); display: flex; align-items: center; justify-content: center; font-size: 1.3em; color: #34d399; }
.u-avatar-error  { width: 64px; height: 64px; margin: 0 auto 20px; background: #fef2f2; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.u-avatar-success { width: 64px; height: 64px; margin: 0 auto 20px; background: #ecfdf5; border-radius: 50%; display: flex; align-items: center; justify-content: center; }

/* ---- Input / form field styles ---- */
.u-input-light  { width: 100%; padding: 12px; border: 1px solid #cbd5e1; border-radius: 6px; box-sizing: border-box; }
.u-input-dark   { width: 100%; padding: 10px; background: #1a1a1a; border: 1px solid #555; color: white; border-radius: 4px; box-sizing: border-box; }
.u-input-dark2  { width: 100%; padding: 8px 12px; background: #2a2a3e; border: 1px solid #4b5563; border-radius: 8px; color: #f1f5f9; font-size: 0.95em; }
.u-input-ghost  { width: 100%; padding: 10px 12px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2); border-radius: 8px; color: white; font-size: 1em; box-sizing: border-box; }
.u-input-full-nb { width: 100%; border: none; cursor: pointer; font-size: 1em; }
.u-input-dark-lg { flex: 1; padding: 10px 14px; border: 2px solid #334155; border-radius: 8px; background: #0f172a; color: #e0e0e0; font-size: 1em; }
.u-input-dark3  { width: 100%; padding: 12px; border: 2px solid #334155; border-radius: 8px; background: #0f172a; color: #e0e0e0; box-sizing: border-box; margin-bottom: 20px; font-size: 1em; }
.u-input-dark4  { width: 100%; padding: 10px 14px; background: #0f172a; border: 1px solid #334155; border-radius: 8px; color: #e0e0e0; }
.u-input-dark5  { width: 100%; padding: 10px 14px; background: #0f172a; border: 1px solid #334155; border-radius: 8px; color: #e0e0e0; min-height: 44px; }
.u-input-dark6  { width: 100%; padding: 10px; background: #0f172a; border: 1px solid #334155; border-radius: 8px; color: #e0e0e0; margin-bottom: 14px; }
.u-textarea-dark { width: 100%; padding: 14px; background: #0f172a; border: 1px solid #334155; border-radius: 10px; color: #e0e0e0; min-height: 100px; font-family: monospace; font-size: 0.85em; box-sizing: border-box; }
.u-input-score-red   { width: 65px; background: #2a2a3e; border: 1px solid #4b5563; border-radius: 4px; color: #e74c3c; text-align: center; font-size: inherit; padding: 2px 4px; cursor: text; }
.u-input-score-green { width: 65px; background: #2a2a3e; border: 1px solid #4b5563; border-radius: 4px; color: #2ecc71; text-align: center; font-size: inherit; padding: 2px 4px; cursor: text; }
.u-input-p6-10  { padding: 6px 10px; background: #1e293b; border: 1px solid #334155; border-radius: 4px; text-align: center; }
.u-input-check-blue  { margin-top: 4px; min-width: 18px; min-height: 18px; accent-color: var(--primary); }
.u-input-check-red   { width: 18px; height: 18px; accent-color: #e74c3c; }
.u-input-check-blue2 { width: 18px; height: 18px; accent-color: #3498db; }
.u-input-range  { flex: 1; cursor: pointer; accent-color: #3498db; }

/* ---- Button-like styles ---- */
.u-btn-reset    { background: none; border: none; color: inherit; font: inherit; cursor: pointer; padding: 0; display: inline; }
.u-btn-inline   { display: inline; margin: 0; padding: 0; }
.u-btn-dark-sm  { padding: 10px 20px; background: #334155; color: #e0e0e0; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; }
.u-btn-dark-mt  { margin-top: 16px; padding: 8px 16px; background: #334155; color: #e0e0e0; border: none; border-radius: 6px; cursor: pointer; font-size: 0.9em; }
.u-btn-block-red   { display: block; width: 100%; background: #e74c3c; color: #fff; border: none; border-radius: 4px; padding: 6px 10px; cursor: pointer; font-size: 0.8em; margin-bottom: 3px; text-align: left; }
.u-btn-block-orange { display: block; width: 100%; background: #e67e22; color: #fff; border: none; border-radius: 4px; padding: 6px 10px; cursor: pointer; font-size: 0.8em; margin-bottom: 3px; text-align: left; }
.u-btn-block-gray  { display: block; width: 100%; background: #444; color: #ccc; border: none; border-radius: 4px; padding: 6px 10px; cursor: pointer; font-size: 0.8em; text-align: left; }

/* ---- Progress bar elements ---- */
.u-progress-track { flex: 1; height: 4px; border-radius: 2px; background: #e2e8f0; transition: background 0.3s; }

/* ---- Label / block display text ---- */
.u-label-dark   { display: block; color: #cbd5e1; font-size: 0.85em; margin-bottom: 5px; font-weight: 600; }
.u-label-blue   { display: block; color: var(--primary); font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 5px; }
.u-label-slate  { display: block; margin-bottom: 8px; color: #64748b; font-weight: 500; }
.u-label-slate-sm { display: block; color: #9ca3af; font-size: 0.85em; font-weight: 600; text-transform: uppercase; margin-bottom: 8px; }
.u-label-slate-xs { display: block; color: #9ca3af; font-size: 0.85em; }
.u-label-slate-mini { display: block; color: #aaa; text-decoration: none; padding: 5px; text-align: center; font-size: 0.8em; }
.u-label-muted  { display: block; color: #94a3b8; font-size: 0.8em; margin-bottom: 6px; }
.u-label-muted-small { font-size: 0.9em; color: #aaa; display: block; margin-bottom: 5px; }
.u-label-muted-xs { color: #94a3b8; font-size: 0.8em; display: block; margin-bottom: 4px; }
.u-label-muted-xs2 { color: #94a3b8; font-size: 0.8em; display: block; margin-bottom: 4px; }
.u-label-muted-xs3 { display: block; color: #94a3b8; font-size: 0.85em; font-weight: 600; text-transform: uppercase; margin-bottom: 8px; }
.u-label-slate-uc { color: #64748b; font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; }
.u-label-slate-uc2 { color: #9ca3af; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.5px; }
.u-label-mini-uc { color: #94a3b8; font-size: 0.78em; margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.5px; }

/* ---- Misc text patterns ---- */
.u-text-slate-sm  { color: #94a3b8; font-size: 0.85em; }
.u-text-slate-sm2 { color: #64748b; font-size: 0.88em; margin: 0; }
.u-text-slate-xs  { color: #64748b; font-size: 0.8em; }
.u-text-slate-xs2 { color: #475569; font-size: 0.8em; }
.u-text-slate-xs3 { color: #9ca3af; font-size: 0.9em; }
.u-text-slate-mb  { color: #9ca3af; margin-bottom: 20px; }
.u-text-slate-line { color: #64748b; line-height: 1.6; }
.u-text-slate-italic { color: #64748b; font-style: italic; }
.u-text-blue-link { color: #60a5fa; font-size: 0.8em; text-decoration: none; }
.u-text-blue-under { color: #2563eb; text-decoration: underline; }
.u-text-blue-sm   { color: #2563eb; font-size: 0.8em; }
.u-text-blue-fw   { color: #3b82f6; text-decoration: none; font-weight: 600; font-size: 0.95em; }
.u-text-blue-bold { color: #3b82f6; font-weight: bold; margin: 15px 0; }
.u-text-green-mt  { margin: 8px 0 0; color: #065f46; }
.u-text-error-sm  { display: none; color: #b91c1c; font-size: 0.8em; margin-top: 4px; }
.u-text-err-sm2   { color: #ef4444; font-size: 0.85em; }
.u-text-muted-sm  { color: #9ca3af; font-size: 0.85em; text-transform: uppercase; font-weight: 600; }
.u-text-white-fw  { color: white; font-size: 1.4em; font-weight: 700; margin: 6px 0; }
.u-text-white-link { color: white; text-decoration: none; font-weight: 800; font-size: 1.2em; display: inline-flex; align-items: center; gap: 8px; }
.u-text-e0-fw     { color: #e0e0e0; font-size: 0.9em; font-weight: 600; }
.u-text-e0-mb     { color: #e0e0e0; margin-bottom: 20px; font-size: 1.5em; }
.u-text-e0-mb30   { color: #94a3b8; margin-bottom: 20px; font-size: 0.95em; }
.u-text-dark-mb10  { color: #0f172a; margin-bottom: 10px; }
.u-text-dark-center { text-align: center; color: #0f172a; margin-bottom: 10px; }
.u-text-dark-mt30  { color: #0f172a; margin-top: 40px; font-size: 1.15em; }
.u-text-1e2-mb     { color: #1e293b; margin-bottom: 10px; }
.u-text-center-slate { text-align: center; color: #64748b; margin-bottom: 40px; }
.u-text-center-slate2 { text-align: center; color: #64748b; margin-bottom: 30px; }
.u-text-center-dark   { text-align: center; color: var(--dark); margin-bottom: 8px; }
.u-text-center-slate3  { text-align: center; color: #9ca3af; }
.u-text-center-slate4  { color: #9ca3a4; text-align: center; }
.u-text-right-slate   { text-align: right; color: #94a3b8; font-size: 0.8em; margin-top: 30px; }

/* ---- Popover/overlay patterns ---- */
.u-popover-hidden  { position: fixed; z-index: 1000; background: #1e1e2e; border: 1px solid #e74c3c; border-radius: 8px; padding: 6px; box-shadow: 0 8px 24px rgba(0,0,0,0.6); min-width: 140px; }
.u-popover-blue    { display: none; position: fixed; z-index: 1000; background: #1e1e2e; border: 1px solid #3498db; border-radius: 8px; padding: 6px; box-shadow: 0 8px 24px rgba(0,0,0,0.6); min-width: 160px; }

/* ---- Inline display helpers for specific patterns ---- */
.u-inline-m0p0    { display: inline; margin: 0; padding: 0; }
.u-flex-ai-gap8   { display: flex; align-items: center; gap: 8px; }
.u-flex-ai-p8-12  { display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: #1e293b; border-radius: 8px; }
.u-flex-ai-p5     { display: flex; align-items: center; gap: 8px; padding: 5px; cursor: pointer; color: #e2e8f0; font-size: 0.9em; }

/* ---- Bar chart elements ---- */
.u-bar-blue  { width: 60px; background: linear-gradient(180deg, #3b82f6, #1d4ed8); border-radius: 6px 6px 0 0; min-height: 10px; transition: height 0.6s; }
.u-bar-purple { width: 60px; background: linear-gradient(180deg, #8b5cf6, #6d28d9); border-radius: 6px 6px 0 0; min-height: 10px; transition: height 0.6s; }

/* ---- Gradient button ---- */
.u-btn-gradient  { display: inline-block; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 15px 30px; border-radius: 50px; font-size: 1.1em; font-weight: 600; box-shadow: 0 10px 25px rgba(102, 126, 234, 0.3); }

/* ---- Misc compound patterns ---- */
.u-empty-state     { padding: 30px; text-align: center; color: #9ca3af; }
.u-empty-state-40  { padding: 40px; text-align: center; color: #9ca3af; }
.u-empty-state-red { padding: 40px; text-align: center; color: #ef4444; }
.u-empty-state-red2 { padding: 20px; text-align: center; color: #ef4444; }
.u-empty-dark      { padding: 40px; color: #94a3b8; text-align: center; }
.u-empty-dark2     { padding: 30px; text-align: center; color: #6b7280; }
.u-empty-center40  { padding: 40px; text-align: center; color: #9ca3a4; }
.u-empty-center20  { text-align: center; color: #9ca3a4; padding: 20px; }

/* ---- Icon size helpers ---- */
.u-icon-sm5   { margin-right: 5px; font-size: 0.85em; }
.u-icon-mr8   { margin-right: 8px; }
.u-icon-mr6   { margin-right: 6px; }
.u-icon-mr4   { margin-right: 4px; }
.u-icon-ml4   { margin-left: 4px; }
.u-icon-amber-xs  { font-size: 0.7em; color: #f59e0b; font-weight: 700; margin-left: 6px; }
.u-icon-red-mr    { color: #f87171; margin-right: 8px; }
.u-icon-blue-mr   { color: #3b82f6; margin-right: 8px; }
.u-icon-green-mr  { color: #34d399; margin-right: 8px; }
.u-icon-purple-mr { color: #a78bfa; margin-right: 8px; }
.u-icon-amber-xs2 { color: #ccc; font-size: 0.7em; padding: 2px 6px; margin-bottom: 4px; white-space: nowrap; }
.u-icon-ts-lg     { font-size: 1.8em; }
.u-icon-blue-15   { font-size: 1.5em; color: #2563eb; }
.u-icon-red-12    { color: #dc2626; font-size: 1.2em; }
.u-icon-green-12  { color: #059669; font-size: 1.2em; }
.u-icon-red-18    { font-size: 1.8em; color: #dc2626; }
.u-icon-green-18  { font-size: 1.8em; color: #059669; }
.u-icon-amber-fw  { color: #fbbf24; font-weight: 700; font-size: 0.85em; }
.u-icon-aaa-sm    { color: #aaa; font-size: 12px; min-width: 42px; }
.u-icon-aaa-sm2   { color: #aaa; font-size: 12px; min-width: 40px; }
.u-icon-slate-mini { color: #94a3b8; font-size: 0.75em; }
.u-icon-slate-mt4  { color: #94a3b8; margin: 4px 0 0; font-size: 0.85em; }
.u-icon-slate-mb4  { color: #94a3b8; font-size: 0.8em; display: block; margin-bottom: 4px; }
.u-icon-slate-m8   { color: #94a3b8; margin: 8px 0; }
.u-icon-muted-sm   { color: #94a3b8; font-size: 0.9em; margin-top: 4px; }
.u-icon-muted-mt   { color: rgba(255,255,255,0.8); margin-top: 5px; }
.u-icon-green-fw   { color: #22c55e; font-weight: 600; font-size: 1.05em; }

/* ---- Dark select-like control ---- */
.u-select-dark  { color: #aaa; font-size: 0.9em; margin-bottom: 10px; }
.u-min-200      { min-width: 200px; }

/* ---- Column widths for table layouts ---- */
.u-col-25   { width: 25%; }
.u-col-22   { width: 22%; }
.u-col-41   { width: 41%; }
.u-col-58   { width: 58%; }
.u-col-90   { width: 90%; }
.u-col-94   { width: 94%; }

/* ---- Footer link style (website/base.html) ---- */
.u-footer-link  { color: #94a3b8; text-decoration: none; }

/* ---- Trust strip ---- */
.u-trust-strip  { background: #f0fdf4; border-bottom: 1px solid #bbf7d0; padding: 10px 20px; text-align: center; font-size: 0.85em; color: #166534; font-weight: 500; }

/* ---- Nav icon ---- */
.u-nav-icon  { margin-right: 5px; font-size: 0.85em; }

/* ---- Sidebar footer ---- */
.u-sidebar-footer { padding: 15px; border-top: 1px solid #34495e; margin-top: auto; }

/* ---- Additional patterns (pass 2) ---- */
.u-td-p12-16-center     { padding: 12px 16px; text-align: center; }
.u-td-p12-16-center-sl  { padding: 12px 16px; text-align: center; color: #64748b; }
.u-td-p12-16-center-slate { padding: 12px 16px; text-align: center; color: #94a3b8; }
.u-color-white-mt0      { color: #fff; margin-top: 0; }
.u-color-a8b3           { color: #a8b3b4; }
.u-color-a8b3-mb        { color: #a8b3b4; margin-bottom: 10px; }
.u-text-64-085          { color: #64748b; font-size: 0.85em; }
.u-text-64-09           { color: #64748b; font-size: 0.9em; margin: 0; }
.u-text-ccc-mt          { color: #ccc; margin: 4px 0 0; }
.u-text-aaa-sm          { color: #aaa; font-size: 0.9em; margin-bottom: 10px; }
.u-mb20-555             { margin-bottom: 20px; color: #555; }
.u-th-p12-uc-center     { padding: 12px 15px; color: #9ca3af; font-weight: 600; font-size: 0.85em; text-transform: uppercase; text-align: center; }
.u-mb15-left            { margin-bottom: 15px; text-align: left; }
.u-mb20-left            { margin-bottom: 20px; text-align: left; }
.u-text-9ca-mt10        { font-size: 0.85em; color: #9ca3a4; margin-top: 10px; }
.u-text-64-mb16         { color: #64748b; font-size: 0.88em; margin-bottom: 16px; }
.u-color-white-fw       { color: #fff; font-weight: 600; }
.u-text-94-link-sm      { color: #94a3b8; text-decoration: none; font-size: 0.9em; }
.u-flex-ai-gap8-mb8     { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 0.88em; color: #334155; }
.u-margin-12-0-sl       { margin: 12px 0 0 0; color: #64748b; }
.u-color-white-m0-fw    { color: #fff; margin: 0 0 14px; font-size: 1.1em; }
.u-border-left-334      { border-left: 1px solid #334155; }
.u-m0-amber             { margin: 0; color: #f59e0b; }
.u-badge-amber-sm       { background: #f59e0b; color: #0f172a; padding: 2px 10px; border-radius: 12px; font-size: 0.75em; margin-left: 8px; }
.u-dropzone-hidden      { margin-bottom: 20px; border: 2px dashed #6366f1; border-radius: 12px; padding: 30px; text-align: center; background: rgba(99,102,241,0.05); cursor: pointer; transition: all 0.3s; }
.u-fs-2em-indigo        { font-size: 2em; color: #6366f1; margin-bottom: 10px; }
.u-text-e2e8-mb         { color: #e2e8f0; margin: 0 0 4px; font-weight: 600; }
.u-text-9ca-mb12        { color: #9ca3af; margin: 0 0 12px; font-size: 0.85em; }
.u-text-8b9-small       { color: #8b9bb5; font-size: 0.75em; margin: 0; display: flex; align-items: center; justify-content: center; gap: 6px; }
.u-grid-auto-280        { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 15px; }
.u-empty-center20b      { color: #9ca3af; text-align: center; padding: 20px; }
.u-modal-overlay        { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.8); z-index: 9999; align-items: center; justify-content: center; }
.u-modal-overlay.active { display: flex; }
.u-modal-content        { background: #1e293b; border-radius: 12px; max-width: 900px; width: 90%; max-height: 90vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,0.5); }
.u-modal-header         { display: flex; justify-content: space-between; align-items: center; padding: 15px 20px; border-bottom: 1px solid #334155; }
.u-modal-footer         { display: flex; gap: 10px; justify-content: flex-end; padding: 15px 20px; border-top: 1px solid #334155; }
.u-color-white-mt4      { color: white; margin: 4px 0 0; font-weight: 600; }
.u-color-white-0         { margin: 0; color: white; }
.u-btn-close-muted      { background: none; border: none; color: #9ca3af; font-size: 1.5em; cursor: pointer; }
.u-video-box            { width: 100%; max-height: 400px; background: #000; border-radius: 8px; }
.u-grid-mt15            { margin-top: 15px; display: grid; gap: 12px; }
.u-text-ccc-preformat   { color: #ccc; margin: 4px 0 0; white-space: pre-wrap; max-height: 200px; overflow-y: auto; background: #0f172a; padding: 10px; border-radius: 6px; font-size: 0.85em; }
.u-bg-374-lg            { background: #374151; padding: 10px 20px; }
.u-bg-dc2-lg            { background: #dc2626; padding: 10px 20px; }
.u-bg-059-lg            { background: #059669; padding: 10px 20px; }
.u-p6-12-sm2            { padding: 6px 12px; font-size: 0.9em; }
.u-text-777-mx          { color: #777; margin: 0 8px; }
.u-text-666-small       { color: #666; font-size: 0.75em; margin-left: 8px; }
.u-bg-f39-border        { background: #f39c12; border-color: #e67e22; }
.u-bg-e67               { background: #e67e22; }
.u-bg-3498              { background: #3498db; }
.u-bg-9b59              { background: #9b59b6; }
.u-overflow-y-500       { max-height: 500px; overflow-y: auto; }
.u-flex-sb-p15-bg       { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding: 15px; background: #344155; border-radius: 8px; }
.u-fs-13-p10-12         { font-size: 1.3em; padding: 10px 12px; }
.u-dropdown-right       { right: 0; left: auto; top: 100%; margin-top: 5px; }
.u-bg-1a1-border        { background: #1a1a1a; border: 1px solid #333; }
.u-video-container      { position: relative; width: 100%; max-width: 640px; margin: 0 auto; }
.u-video-rounded        { width: 100%; border-radius: 6px; background: #000; }
.u-flex-center-h200     { display: flex; align-items: center; justify-content: center; height: 200px; background: #2c3e50; border-radius: 6px; color: #94a3b8; }
.u-mb10-opacity5        { margin-bottom: 10px; opacity: 0.5; }

/* ---- Pass 3 — single-use patterns ---- */
.u-flex-center-jc-mt10  { display: flex; gap: 10px; justify-content: center; margin-top: 10px; }
.u-bg-3498-md   { background: #3498db; padding: 8px 15px; font-size: 0.85em; }
.u-bg-27ae-md   { background: #27ae60; padding: 8px 15px; font-size: 0.85em; }
.u-bg-9b59-md   { background: #9b59b6; padding: 8px 15px; font-size: 0.85em; }
.u-box-3498     { border: 1px solid #3498db; border-radius: 8px; padding: 15px; background: rgba(52, 152, 219, 0.05); }
.u-color-3498-mt0 { color: #3498db; margin-top: 0; }
.u-mb12-09      { margin-bottom: 12px; font-size: 0.9em; }
.u-color-3498-bold { color: #3498db; font-weight: bold; }
.u-flex-gap8-wrap { display: flex; gap: 8px; flex-wrap: wrap; }
.u-bg-27ae-sm   { background: #27ae60; padding: 8px 12px; font-size: 0.85em; }
.u-bg-3498-sm   { background: #3498db; padding: 8px 12px; font-size: 0.85em; }
.u-bg-9b59-sm   { background: #9b59b6; padding: 8px 12px; font-size: 0.85em; }
.u-info-box-hidden { margin-top: 12px; padding: 10px; background: rgba(52, 152, 219, 0.1); border-radius: 4px; }
.u-font-mono    { font-family: 'Courier New', monospace; }
.u-bg-27ae-mt10 { background: #27ae60; margin-top: 10px; }
.u-box-amber    { border: 1px solid #f39c12; border-radius: 8px; padding: 15px; background: rgba(243, 156, 18, 0.05); }
.u-color-f39-mt0 { color: #f39c12; margin-top: 0; }
.u-success-box-hidden { margin-top: 10px; padding: 10px; background: rgba(39, 174, 96, 0.1); border-radius: 4px; border: 1px solid #27ae60; }
.u-overflow-y-250 { max-height: 250px; overflow-y: auto; }
.u-overflow-y-200 { max-height: 200px; overflow-y: auto; }
.u-grid-auto-200  { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; margin-bottom: 30px; }
.u-card-grad-blue   { background: linear-gradient(135deg, #3b82f6, #2563eb); padding: 20px; border-radius: 10px; }
.u-card-grad-green  { background: linear-gradient(135deg, #10b981, #059669); padding: 20px; border-radius: 10px; }
.u-card-grad-amber  { background: linear-gradient(135deg, #f59e0b, #d97706); padding: 20px; border-radius: 10px; }
.u-card-grad-purple { background: linear-gradient(135deg, #8b5cf6, #7c3aed); padding: 20px; border-radius: 10px; }
.u-grid-2col-20     { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.u-color-blue-mb15  { color: #3b82f6; margin-bottom: 15px; }
.u-color-green-mb15 { color: #10b981; margin-bottom: 15px; }
.u-card-2c50-mt20   { background: #2c3e50; border-radius: 10px; padding: 20px; border: 1px solid #34495e; margin-top: 20px; }
.u-color-amber-mb15 { color: #f59e0b; margin-bottom: 15px; }
.u-chart-bar-container { display: flex; align-items: flex-end; gap: 10px; height: 150px; padding: 10px 0; }
.u-bg-3b82      { background: #3b82f6; }
.u-flex-gap10-ai { display: flex; gap: 10px; align-items: center; }
.u-pill-blue    { background: #3b82f6; padding: 5px 12px; border-radius: 20px; font-size: 0.9em; }
.u-bg-059-lg2   { background: #059669; padding: 8px 15px; }
.u-bg-374-lg2   { background: #374151; padding: 8px 15px; }
.u-info-card-blue { background: rgba(59, 130, 246, 0.1); border: 1px solid #3b82f6; border-radius: 8px; padding: 12px 15px; margin-bottom: 20px; }
.u-color-93c5   { color: #93c5fd; margin-left: 8px; }
.u-flex-gap12-mb15 { display: flex; gap: 12px; align-items: center; margin-bottom: 15px; flex-wrap: wrap; }
.u-bg-374-sm2   { background: #374151; padding: 8px 12px; font-size: 0.85em; }
.u-bg-059-sm2   { background: #059669; padding: 8px 15px; font-size: 0.85em; }
.u-th-p15-uc-center { padding: 15px; color: #9ca3af; font-weight: 600; font-size: 0.85em; text-transform: uppercase; text-align: center; }
.u-flex-gap6    { display: flex; gap: 6px; }
.u-color-d1d5-sm { color: #d1d5db; padding: 6px 12px; font-size: 0.9em; }
.u-mt20-flex-wrap { margin-top: 20px; display: flex; gap: 20px; flex-wrap: wrap; }
.u-badge-red-pill    { background: #dc2626; padding: 4px 12px; border-radius: 12px; font-size: 0.75em; font-weight: 600; display: inline-flex; align-items: center; line-height: 1; }
.u-badge-purple-pill { background: #7c3aed; padding: 4px 12px; border-radius: 12px; font-size: 0.75em; font-weight: 600; display: inline-flex; align-items: center; line-height: 1; }
.u-badge-blue-pill   { background: #2563eb; padding: 4px 12px; border-radius: 12px; font-size: 0.75em; font-weight: 600; display: inline-flex; align-items: center; line-height: 1; }
.u-badge-green-pill  { background: #059669; padding: 4px 12px; border-radius: 12px; font-size: 0.75em; font-weight: 600; display: inline-flex; align-items: center; line-height: 1; }
.u-bg-grad-green     { background: linear-gradient(135deg, #10b981, #059669); }
.u-card-dk-p20  { background: var(--dark-card); border-radius: 10px; padding: 20px; }
.u-flex-gap8-ai { display: flex; gap: 8px; align-items: center; }

/* ---- Pass 4 patterns ---- */
.u-flex-input-ghost  { flex: 1; padding: 10px; background: rgba(255,255,255,0.05); border: 1px solid #374151; border-radius: 6px; color: #e5e7eb; font-size: 0.9em; outline: none; }
.u-bg-blue-nowrap    { background: #3b82f6; padding: 10px 15px; white-space: nowrap; }
.u-color-slate-mt6   { color: #9ca3af; font-size: 0.8em; margin-top: 6px; }
.u-color-white-fw2   { color: white; font-weight: 600; }
.u-toggle-container  { position: relative; display: inline-block; width: 50px; height: 26px; cursor: pointer; }
.u-toggle-input      { opacity: 0; width: 0; height: 0; }
.u-toggle-track      { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #374151; border-radius: 26px; transition: 0.3s; }
.u-toggle-thumb      { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; background: white; border-radius: 50%; transition: 0.3s; }
.u-bg-059-p10        { background: #059669; padding: 10px 15px; }
.u-flex-wrap-gap8    { display: flex; flex-wrap: wrap; gap: 8px; }
.u-divider-mt30      { margin-top: 30px; border-top: 1px solid #333; padding-top: 20px; }
.u-color-818cf8      { margin: 0; color: #818cf8; }
.u-grid-auto-200-12  { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.u-stat-818cf8       { font-size: 1.8em; font-weight: 700; color: #818cf8; }
.u-stat-amber        { font-size: 1.8em; font-weight: 700; color: #f59e0b; }
.u-stat-green        { font-size: 1.8em; font-weight: 700; color: #10b981; }
.u-stat-blue         { font-size: 1.8em; font-weight: 700; color: #3b82f6; }
.u-flex-sb-mb20-wrap { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; flex-wrap: wrap; gap: 10px; }
.u-color-white-m0    { color: white; margin: 0; }
.u-color-slate-mt5   { color: #9ca3af; margin: 5px 0 0 0; }
.u-flex-gap10-mb15   { display: flex; gap: 10px; margin-bottom: 15px; flex-wrap: wrap; }
.u-select-dark-card  { padding: 8px 12px; background: var(--dark-card); border: 1px solid var(--border); color: white; border-radius: 6px; }
.u-card-dk-overflow-x { background: var(--dark-card); border-radius: 10px; border: 1px solid var(--border); overflow-x: auto; }
.u-empty-hidden      { text-align: center; padding: 40px; color: #9ca3af; }
.u-fs-2em-block      { font-size: 2em; margin-bottom: 10px; display: block; }
.u-max-550           { max-width: 550px; }
.u-flex-toggle-label { margin-top: 8px; display: flex; align-items: center; gap: 6px; color: #9ca3af; font-size: 0.85em; cursor: pointer; }
.u-flex-je           { display: flex; gap: 10px; justify-content: flex-end; }
.u-bg-374-lg3        { background: #374151; padding: 10px 20px; }
.u-p20-max700        { padding: 20px; max-width: 700px; }
.u-color-slate-mb30  { color: #9ca3af; margin-bottom: 30px; }
.u-card-dk-p25       { background: var(--dark-card); border-radius: 10px; padding: 25px; margin-bottom: 20px; border: 1px solid var(--border); }
.u-flex-sb-plain     { display: flex; justify-content: space-between; align-items: center; }
.u-btn-blue-full     { background: #2563eb; padding: 14px 28px; font-size: 1em; width: 100%; border-radius: 8px; }
.u-color-slate-mt10-center { color: #9ca3af; font-size: 0.8em; margin-top: 10px; text-align: center; }
.u-card-amber-soft   { background: rgba(245, 158, 11, 0.1); border: 1px solid #f59e0b; border-radius: 8px; padding: 15px; text-align: center; }
.u-color-amber-m0    { color: #fbbf24; margin: 0; }
.u-color-blue-under  { color: #3b82f6; text-decoration: underline; }
.u-flex-gap10-mb16   { display: flex; gap: 10px; margin-bottom: 16px; }
.u-btn-blue-sm       { background: #2563eb; color: #fff; padding: 8px 16px; border-radius: 8px; border: none; cursor: pointer; }
.u-btn-ghost-sm      { background: #1e293b; color: #94a3b8; padding: 8px 16px; border-radius: 8px; border: 1px solid #334155; cursor: pointer; }
.u-flex-gap12-mb20   { display: flex; gap: 12px; align-items: center; margin-bottom: 20px; flex-wrap: wrap; }
.u-select-white-card { background: var(--dark-card); color: white; border: 1px solid var(--border); border-radius: 6px; padding: 6px 12px; font-size: 0.9em; }
.u-overflow-x-auto   { overflow-x: auto; }
.u-table-sm2         { width: 100%; border-collapse: collapse; font-size: 0.85em; }
.u-flex-sb-card      { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding: 12px; background: rgba(255,255,255,0.03); border-radius: 8px; }
.u-flex-sb-card2     { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding: 15px; background: #344155; border-radius: 8px; }
.u-fs-13-p10         { font-size: 1.3em; padding: 10px 12px; }
.u-flex-center-h200  { display: flex; align-items: center; justify-content: center; height: 200px; background: #2c3e50; border-radius: 6px; color: #94a3b8; }
.u-flex-input-ghost2 { flex: 1; padding: 10px; background: rgba(255,255,255,0.05); border: 1px solid #374151; border-radius: 6px; color: #e5e7eb; }
.u-bb-2-var-left     { border-bottom: 2px solid var(--border); text-align: left; }
.u-btn-green-full    { background: linear-gradient(135deg, #10b981, #059669); padding: 14px 28px; font-size: 1em; border-radius: 8px; display: inline-flex; align-items: center; gap: 8px; }
.u-color-slate-mt10  { color: #9ca3af; font-size: 0.8em; margin-top: 10px; }
.u-grid-auto-mt30    { margin-top: 30px; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; }
.u-icon-amber-15-block { color: #f59e0b; font-size: 1.5em; margin-bottom: 10px; display: block; }
.u-icon-blue-15-block  { color: #3b82f6; font-size: 1.5em; margin-bottom: 10px; display: block; }
.u-icon-pink-15-block  { color: #ec4899; font-size: 1.5em; margin-bottom: 10px; display: block; }
.u-icon-orange-15-block { color: #f97316; font-size: 1.5em; margin-bottom: 10px; display: block; }
.u-mt25-flex-wrap    { margin-top: 25px; display: flex; gap: 10px; flex-wrap: wrap; }

    /* Pass 6 - remaining single-use patterns (hash-keyed) */
.u-xb483a9 { background: #059669; padding: 10px 25px; }
.u-x8b2f39 { background: #0f172a; border-radius: 8px; padding: 20px; font-size: 0.88em; line-height: 1.8; color: #cbd5e1; }
.u-xf6078a { background: #0f172a; border: 1px solid #1e293b; border-radius: 8px; padding: 20px; color: #e2e8f0; font-size: 0.9em; line-height: 1.7; white-space: pre-wrap; font-family: 'Courier New', monospace; max-height: 400px; overflow-y: auto; }
.u-x11c231 { background: #0f172a; border: 1px solid #334155; border-radius: 12px; padding: 20px; margin-bottom: 20px; }
.u-x84d661 { background: #0f172a; border: 1px solid #334155; border-radius: 12px; padding: 24px; text-align: center; }
.u-x03c8c3 { background: #10b981; padding: 8px 16px; }
.u-x6ddf3b { background: #15151f; padding: 8px 12px; border-radius: 0 0 8px 8px; display: flex; align-items: center; gap: 10px; }
.u-x153b74 { background: #2563eb; color: white; border: none; padding: 14px 40px; border-radius: 8px; font-size: 1.05em; font-weight: 600; cursor: pointer; }
.u-xb1c1ee { background: #374151; }
.u-xacc121 { background: #374151; padding: 10px 25px; }
.u-xdabf6c { background: #374151; padding: 8px 14px; }
.u-x5cfb56 { background: #374151; padding: 8px 16px; }
.u-x275bdf { background: #374151; padding: 8px 20px; }
.u-xf37ddc { background: #3b82f6; padding: 8px 16px; }
.u-x39b14b { background: #555; min-width: 100px; }
.u-x482155 { background: #6366f1; color: white; padding: 2px 10px; border-radius: 12px; font-size: 0.65em; margin-left: 8px; }
.u-xb5e7d0 { background: #6366f1; padding: 10px 16px; white-space: nowrap; }
.u-x0dc182 { background: #e74c3c; min-width: 100px; }
.u-x39b04b { background: #eff6ff; border: 1px solid #3b82f6; padding: 15px; border-radius: 8px; text-align: center; margin-bottom: 20px; }
.u-x095a81 { background: #f39c12; }
.u-xbf3319 { background: #f59e0b; color: #0f172a; text-align: center; padding: 10px 20px; font-size: 14px; font-family: 'Inter', Arial, sans-serif; position: relative; z-index: 9998; }
.u-x7dd451 { background: #f8f9fa; border: 1px dashed #dee2e6; }
.u-x91f330 { background: #f8fafc; padding: 20px; border-radius: 8px; border: 1px solid #e2e8f0; margin-top: 40px; }
.u-x7e4813 { background: #fef3c7; border: 1px solid #f59e0b; padding: 15px; border-radius: 8px; text-align: center; margin: 20px auto; max-width: 700px; }
.u-x8894d5 { background: #fef3c7; border: 2px solid #f59e0b; border-radius: 12px; padding: 25px; margin-top: 30px; text-align: center; }
.u-xf24816 { background: linear-gradient(135deg, #059669 0%, #047857 100%); }
.u-x8b1bca { background: linear-gradient(135deg, #059669 0%, #047857 100%); box-shadow: 0 10px 30px rgba(5, 150, 105, 0.4); }
.u-x4e1f28 { background: linear-gradient(135deg, #10b981, #059669); padding: 14px 28px; font-size: 1em; border-radius: 8px; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; color: white; }
.u-xdefa35 { background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%); box-shadow: 0 10px 30px rgba(37, 99, 235, 0.4); }
.u-xc53470 { background: linear-gradient(135deg, #7f1d1d, #991b1b); border: 2px solid #ef4444; border-radius: 16px; padding: 25px 30px; margin-top: 30px; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.u-x318441 { background: linear-gradient(135deg, #92400e 0%, #78350f 100%); border: 2px solid #f59e0b; border-radius: 12px; padding: 20px 24px; margin-bottom: 24px; display: flex; align-items: center; gap: 16px; }
.u-x53f46d { background: linear-gradient(135deg, #f59e0b, #d97706); padding: 12px 24px; }
.u-x20962c { background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%); border: 2px solid #f39c12; border-radius: 12px; padding: 20px; margin-bottom: 25px; text-align: left; }
.u-x7b3cbd { background: none; border: none; cursor: pointer; font-size: 14px; padding: 0; color: #3498db; }
.u-xcf11ad { background: rgba(243, 156, 18, 0.1); border: 1px solid #f39c12; border-radius: 6px; padding: 15px; margin: 15px 0; text-align: left; }
.u-x477eba { background: rgba(59, 130, 246, 0.1); border: 1px solid #3b82f6; border-radius: 8px; padding: 12px 15px; margin-bottom: 20px; }
.u-xeb2f23 { background: rgba(99,102,241,0.15); border: 1px solid #6366f1; padding: 6px 14px; border-radius: 20px; font-size: 0.85em; color: #a5b4fc; }
.u-x702871 { background: var(--dark-mid); border: 2px solid var(--border-light); border-radius: 16px; padding: 30px; margin-top: 30px; }
.u-x2144b5 { background:#059669; color:#fff; border:none; padding:12px; border-radius:8px; cursor:pointer; font-weight:600; }
.u-xcaee42 { background:#059669; color:#fff; border:none; padding:6px 14px; border-radius:6px; cursor:pointer; font-size:0.8em; font-weight:600; }
.u-x92d8cd { background:#0f172a; border-radius:10px; padding:20px; border-left:4px solid #10b981; margin:12px 0; }
.u-xf668dc { background:#0f172a; border-radius:10px; padding:20px; border-left:4px solid #3b82f6; margin:12px 0; }
.u-xd2d8f0 { background:#0f172a; border-radius:10px; padding:24px; border:1px solid #f59e0b; margin:12px 0; }
.u-xdd1358 { background:#0f172a; border:1px solid #334155; border-radius:12px; padding:24px; margin:24px 0; }
.u-x777d2f { background:#0f172a; border:1px solid #f59e0b; border-radius:14px; padding:24px; margin:24px 0; }
.u-x577948 { background:#0f172a;border:1px solid #334155;border-radius:10px;padding:14px;margin-bottom:16px;display:none; }
.u-x4a4b10 { background:#16a085; color:white; }
.u-x2864b5 { background:#1e1e2e; border-radius:16px; padding:30px; max-width:440px; width:90%; text-align:center; border:1px solid rgba(255,255,255,0.1); }
.u-x869816 { background:#1e1e2e; border-radius:16px; padding:30px; max-width:700px; width:95%; border:1px solid rgba(255,255,255,0.1); margin:auto; }
.u-xd7f419 { background:#1e1e2f; border-radius:16px; padding:40px 50px; text-align:center; box-shadow:0 8px 32px rgba(0,0,0,0.5); min-width:340px; }
.u-x7e4763 { background:#1e293b; border-radius:10px; padding:16px; border-left:4px solid #fbbf24; }
.u-x4fe417 { background:#1e293b; border-radius:8px; height:20px; overflow:hidden; }
.u-x454570 { background:#1e293b; border:2px solid #ef4444; border-radius:16px; padding:40px; max-width:450px; width:90%; text-align:center; }
.u-xc96739 { background:#1e293b; border:2px solid #fbbf24; border-radius:8px; padding:8px 16px; }
.u-x1efa32 { background:#1e293b; color:#94a3b8; border:1px solid #334155; padding:10px 24px; border-radius:8px; cursor:pointer; font-size:0.9em; }
.u-x16ecd0 { background:#333; color:white; display:none; }
.u-x79e286 { background:#3498db; color:white; border:none; padding:10px 15px; border-radius:4px; cursor:pointer; }
.u-x77b58c { background:#34d399; color:#0f172a; font-weight:800; padding:4px 14px; border-radius:50px; font-size:0.85em; }
.u-x7302f1 { background:#374151; color:#d1d5db; border:1px solid #4b5563; padding:10px 20px; border-radius:8px; cursor:pointer; font-weight:600; }
.u-x797bdb { background:#374151; color:#d1d5db; border:1px solid #4b5563; padding:12px; border-radius:8px; cursor:pointer; font-weight:600; }
.u-xa1c035 { background:#6366f1; color:#fff; border:none; padding:10px 24px; border-radius:8px; cursor:pointer; font-weight:600; }
.u-x08a7de { background:#dc2626; color:#fff; border:none; padding:12px; border-radius:8px; cursor:pointer; font-weight:600; }
.u-xf7aac9 { background:#dc2626; color:#fff; border:none; padding:6px 14px; border-radius:6px; cursor:pointer; font-size:0.8em; font-weight:600; }
.u-x46b28a { background:#dc2626; width:auto; flex: 0; }
.u-xeda8c4 { background:#e74c3c; }
.u-xadb9bd { background:#f59e0b; color:#000; border:none; padding:6px 14px; border-radius:6px; cursor:pointer; font-size:0.8em; font-weight:600; display:none; }
.u-x329d1a { background:#f59e0b; color:black; }
.u-xb4af18 { background:#f59e0b;color:#000;border:none;border-radius:6px;padding:6px 12px;cursor:pointer; }
.u-x056b2f { background:#f8fafc; border-bottom:2px solid #e2e8f0; }
.u-x18015e { background:linear-gradient(135deg, #0c2d1f, #0f172a); border:2px solid #34d399; border-radius:14px; padding:24px; margin:24px 0; }
.u-x0c8659 { background:linear-gradient(135deg, #0f3a2e, #1e293b); padding:20px 28px; border-bottom:1px solid #334155; display:flex; align-items:center; gap:14px; }
.u-xf5bef8 { background:linear-gradient(135deg, #1e3a5f, #1e293b); padding:20px 28px; border-bottom:1px solid #334155; display:flex; align-items:center; gap:14px; }
.u-xdd5d2f { background:linear-gradient(135deg, #3a2f0f, #1e293b); padding:20px 28px; border-bottom:1px solid #334155; display:flex; align-items:center; gap:14px; }
.u-x966197 { background:linear-gradient(90deg, #3b82f6, #8b5cf6); height:100%; border-radius:8px; transition:width 0.6s ease; width:0%; }
.u-x4818d9 { background:none; border:none; color:#f1c40f; cursor:pointer; }
.u-x292102 { background:none; border:none; color:#fff; cursor:pointer; font-size:16px; padding:2px 6px; }
.u-xc1a241 { background:rgba(239,68,68,0.08); border:1px solid rgba(239,68,68,0.3); border-radius:14px; padding:24px; margin:24px 0; }
.u-xf71622 { border-bottom:2px solid #334155; text-align:left; }
.u-xc1f5b3 { border-color: #10b981; }
.u-x6af79d { border-color: #27ae60; }
.u-x30646f { border-color: #f59e0b; }
.u-xf4077a { border-left:3px solid #10b981; margin:16px 0; }
.u-x867b51 { border-top-color: #6366f1; }
.u-x1ccf76 { border-top:1px solid #334155;margin:16px 0;padding-top:16px; }
.u-xfce5a3 { border: 1px solid #334155; padding: 20px; border-radius: 8px; background: #0f172a; }
.u-x0a7aed { border:1px solid #10b981; border-radius:14px; margin:24px 0; overflow:hidden; }
.u-x88f9c9 { border:1px solid #3b82f6; border-radius:14px; margin:24px 0; overflow:hidden; }
.u-x0317c8 { border:1px solid #f59e0b; border-radius:14px; margin:24px 0; overflow:hidden; }
.u-xd3b3ff { color: #00a4ef; font-size: 1.2em; width: 20px; text-align: center; }
.u-x3e3382 { color: #00ccbb; font-size: 1.2em; width: 20px; text-align: center; }
.u-x06b0ff { color: #059669; margin-bottom: 10px; }
.u-x743d48 { color: #0f172a; }
.u-xade410 { color: #10b981; font-size: 0.85em; text-align: center; margin-top: 10px; min-height: 1.2em; }
.u-xb5fd60 { color: #10b981; font-size: 1.5em; }
.u-x0466a4 { color: #10b981; font-weight: 700; font-size: 1.1em; }
.u-xa00784 { color: #10b981; text-align: center; margin-top: 0; }
.u-x158412 { color: #14b8a6; }
.u-x502e72 { color: #1e3a5f; text-decoration: underline; margin-left: 8px; }
.u-xb161df { color: #2563eb; font-size: 1.2em; }
.u-x564c1d { color: #3b82f6; font-weight: 700; font-size: 1.1em; }
.u-xc93b33 { color: #3b82f6; font-weight: bold; margin: 10px 0; }
.u-x804205 { color: #4285f4; font-size: 1.2em; width: 20px; text-align: center; }
.u-x574873 { color: #444; }
.u-x24cac8 { color: #475569; font-size: 0.8em; margin-top: 15px; }
.u-x74da91 { color: #475569; margin: 0 8px; }
.u-x36eea0 { color: #6366f1; text-align: center; }
.u-x2af0af { color: #64748b; font-size: 0.85em; }
.u-xd74a79 { color: #64748b; font-size: 0.85em; margin-top: 20px; }
.u-x08434f { color: #64748b; font-size: 0.9em; }
.u-xb8e4ef { color: #64748b; line-height: 1.6; margin-bottom: 20px; }
.u-xda1e67 { color: #64748b; margin-bottom: 10px; font-size: 0.9em; }
.u-xc43d43 { color: #64748b; margin-bottom: 30px; font-size: 0.85em; }
.u-x2d46b5 { color: #64748b; margin-top: 12px; font-size: 0.85em; }
.u-x431f35 { color: #6ee7b7; margin-bottom: 4px; font-weight: 600; font-size: 1.1em; }
.u-xc65a0e { color: #7f6c35; font-size: 0.9em; }
.u-xa95540 { color: #818cf8; }
.u-x78d10c { color: #818cf8; text-align: center; margin-top: 0; }
.u-xfcf288 { color: #8b9bb5; font-style: italic; }
.u-xcde776 { color: #8b9bb5; text-align: center; font-size: 0.9em; margin-bottom: 20px; }
.u-x17b1ff { color: #92400e; font-weight: 600; font-size: 1.1em; margin-bottom: 15px; }
.u-x9a99a1 { color: #93c5fd; margin-bottom: 12px; font-size: 0.95em; }
.u-xad0c97 { color: #94a3b8; font-family: monospace; font-size: 0.85em; }
.u-x764fd9 { color: #94a3b8; font-size: 0.88em; line-height: 1.5; }
.u-x18cbaa { color: #94a3b8; font-size: 0.8em; margin: 0 0 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; }
.u-xa5e993 { color: #94a3b8; margin-bottom: 25px; font-size: 0.95em; }
.u-xb7c215 { color: #94a3b8; margin: 0 0 14px 0; font-size: 0.85em; }
.u-xfb4541 { color: #94a3b8; margin: 4px 0 0 0; font-size: 0.9em; }
.u-xae013b { color: #94a3b8; text-align: center; font-size: 0.9em; margin-bottom: 16px; }
.u-xbeb035 { color: #9ca3a4; margin-bottom: 15px; }
.u-x890fc8 { color: #9ca3a4; margin-bottom: 15px; font-size: 0.9em; }
.u-x90740a { color: #d1d5db; margin: 0 0 8px 0; }
.u-x3b6945 { color: #d35400; font-size: 1.1em; }
.u-x1a61eb { color: #dc2626; margin-bottom: 10px; }
.u-xccb554 { color: #e0e0e0; margin-bottom: 10px; font-size: 0.95em; }
.u-xf79a63 { color: #e0e0e0; margin-bottom: 16px; font-size: 0.95em; }
.u-xc20d13 { color: #e0e0e0; margin-bottom: 8px; font-size: 1.5em; }
.u-x77cbe2 { color: #e0e0e0; margin: 0 0 6px 0; font-weight: 600; font-size: 0.95em; }
.u-x8c5a0b { color: #e67e22; font-size: 1.5em; margin-top: 2px; }
.u-xaf1df3 { color: #e67e22; font-weight: bold; font-size: 0.9em; margin-top: 20px; }
.u-xf1a80e { color: #e74c3c; font-size: 0.85em; margin: 0 0 20px 0; }
.u-xc57881 { color: #e74c3c; font-size: 0.9em; }
.u-x80988a { color: #e74c3c; font-weight: bold; margin-bottom: 8px; }
.u-x40521b { color: #e74c3c; margin: 0 0 10px 0; }
.u-x862830 { color: #ec3944; font-size: 1.2em; width: 20px; text-align: center; }
.u-x3c354c { color: #f1c40f; }
.u-xd89dca { color: #f1f5f9; font-size: 0.9em; font-weight: 500; }
.u-x606a2b { color: #f97316; }
.u-xa47f56 { color: #fca5a5; margin-bottom: 12px; font-size: 0.95em; }
.u-x689e81 { color: #fca5a5; margin: 0 0 6px 0; font-size: 1.1em; }
.u-x87a83e { color: #fde68a; font-size: 16px; }
.u-xb9f64f { color: #fde68a; margin-bottom: 12px; font-size: 0.95em; }
.u-xdfc08a { color: #fde68a; margin-bottom: 12px; font-weight: 600; }
.u-x6a9d37 { color: #fecaca; margin: 0; font-size: 0.95em; }
.u-x19ba22 { color: #fef3c7; margin: 4px 0 0 0; font-size: 14px; }
.u-xe0d25b { color: var(--text-bright); margin-bottom: 20px; font-size: 1.5em; }
.u-x490e54 { color: var(--text-muted); margin: 4px 0 0 0; font-size: 0.9em; }
.u-x5ae5de { color: var(--text-primary); font-weight: 600; }
.u-xe54b59 { color:#0077b5;border-color:#0077b5; }
.u-x429f3f { color:#047857; font-size:0.9em; line-height:1.6; }
.u-x34bde2 { color:#059669; font-size:1.3em; }
.u-xe29e73 { color:#065f46; font-size:1em; }
.u-x355ec5 { color:#0a66c2; }
.u-xb063e6 { color:#0a66c2;margin-right:8px; }
.u-x60be93 { color:#34d399; font-weight:600; }
.u-xb09a52 { color:#34d399; font-weight:700; }
.u-xa25082 { color:#34d399; margin-top:0; }
.u-x4689ca { color:#3b82f6;margin-right:8px; }
.u-xb35e1c { color:#475569; font-size:0.75em; margin-top:8px; }
.u-x2901db { color:#60a5fa; font-size:0.8em; margin-top:6px; }
.u-xd9f588 { color:#60a5fa; margin-top:0; }
.u-x0f16dc { color:#6366f1; font-weight:600; font-size:1.1em; }
.u-xae3612 { color:#64748b; font-size:0.82em; margin-top:8px; }
.u-x04dc5a { color:#64748b; font-size:0.9em; margin-bottom:15px; }
.u-x32f033 { color:#64748b; font-size:1.1em; }
.u-xf3e463 { color:#64748b; margin-bottom:20px; }
.u-xba06e0 { color:#64748b; margin-bottom:25px; }
.u-x62757c { color:#64748b; margin-bottom:30px; }
.u-x3304df { color:#64748b; margin-top:40px; font-size:0.9em; }
.u-xb19eb4 { color:#64748b;font-size:0.85em; }
.u-x975742 { color:#6b7280; font-size:0.75em; margin:8px 0 0; }
.u-xd92920 { color:#94a3b8; font-size:0.75em; text-transform:uppercase; letter-spacing:0.5px; margin-bottom:6px; }
.u-xbefcf7 { color:#94a3b8; font-size:0.85em; margin-bottom:15px; }
.u-xd94f10 { color:#94a3b8; font-size:0.8em; margin-top:15px; }
.u-x3a9fa5 { color:#94a3b8; font-size:0.9em; margin-bottom:20px; }
.u-xe51e5b { color:#94a3b8; font-size:0.9em; text-align:center; margin:0 0 28px; }
.u-x5e1918 { color:#94a3b8; margin-bottom:25px; font-size:0.95em; }
.u-x095ee6 { color:#94a3b8; margin-bottom:50px; font-size:1.1em; }
.u-x0a4581 { color:#94a3b8;font-size:0.85em;line-height:36px; }
.u-x80d7ca { color:#94a3b8;font-size:0.8em; }
.u-xa239b8 { color:#9ca3a4; font-size:0.75em; margin-left:8px; }
.u-xde8e14 { color:#a16207; margin:0; font-size:0.92em; }
.u-x4596ec { color:#a78bfa; font-size:0.8em; margin-top:6px; }
.u-xb197e6 { color:#a78bfa; margin-top:0; }
.u-x60d89a { color:#aaa; margin:0 0 0; font-size:14px; }
.u-x8f05b5 { color:#cbd5e1; font-size:0.85em; }
.u-xa44473 { color:#cbd5e1; font-size:1.05em; max-width:700px; margin:0 auto 30px; }
.u-xe73c61 { color:#e0e0e0; margin-bottom:10px; }
.u-x6beeb3 { color:#f1f5f9; margin:0 0 10px; }
.u-x8b4d0e { color:#f1f5f9; margin:0 0 15px; }
.u-xb1cc26 { color:#f39c12; }
.u-xfe071e { color:#f59e0b; margin-top:0; }
.u-xcf2e9d { color:#f59e0b;margin-right:8px; }
.u-xa3013d { color:#f87171; margin-top:0; }
.u-x3c453b { color:#fbbf24; font-weight:600; }
.u-xbf83b3 { color:#fbbf24; font-weight:700; }
.u-x1f04dd { color:#fbbf24; margin-right:8px; }
.u-x2f623b { color:#fbbf24; margin-top:0; }
.u-xb16159 { color:#fff; margin:0 0 10px; }
.u-xce9f84 { color:var(--dark); margin-bottom:8px; }
.u-x03996e { color:var(--text-muted); margin-left:8px; }
.u-x6d7266 { color:white; margin-bottom:8px; font-size:2em; }
.u-xbd0de9 { color:white; margin:0 0 6px; font-size:1.3em; text-align:center; }
.u-x9ae58d { cursor: default; }
.u-x809824 { display: flex; align-items: center; gap: 10px; cursor: pointer; padding: 10px; background: rgba(255,255,255,0.7); border-radius: 8px; border: 1px solid #f39c12; }
.u-x36ca47 { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; padding: 16px; background: rgba(16,185,129,0.1); border: 1px solid #10b981; border-radius: 10px; }
.u-x6229cb { display: flex; align-items: center; gap: 8px; cursor: pointer; color: #f1f5f9; }
.u-xbc5ba6 { display: flex; align-items: center; gap: 8px; cursor: pointer; color: #f1f5f9; font-size: 0.9em; }
.u-x4f2852 { display: flex; align-items: center; gap: 8px; cursor: pointer; margin-bottom: 8px; color: #f1f5f9; }
.u-x9ebebb { display: flex; align-items: center; gap: 8px; cursor: pointer; margin-bottom: 8px; color: #f1f5f9; font-size: 0.9em; }
.u-xf7df9b { display: flex; align-items: center; justify-content: center; height: 200px; background: #2c3e50; border-radius: 6px; color: #9ca3a4; }
.u-x62c997 { display: flex; align-items: center; justify-content: space-between; max-width: 400px; }
.u-x5ece15 { display: flex; align-items: flex-start; gap: 12px; }
.u-x971030 { display: flex; flex-direction: column; gap: 3px; font-size: 0.78em; }
.u-xd7bb5f { display: flex; flex-direction: column; gap: 8px; }
.u-x6c3a8f { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 15px; }
.u-x67507f { display: flex; gap: 10px; justify-content: center; margin-top: 16px; }
.u-x1f4991 { display: flex; gap: 10px; justify-content: center; margin-top: 25px; }
.u-xd92cb7 { display: flex; gap: 10px; justify-content: center; margin-top: 25px; position: sticky; bottom: 0; background: var(--dark-card, #1e293b); padding: 15px 0 5px; }
.u-xe75308 { display: flex; gap: 12px; flex-wrap: wrap; }
.u-x29bf12 { display: flex; gap: 15px; flex-wrap: wrap; }
.u-x53e5cc { display: flex; gap: 4px; margin-bottom: 6px; }
.u-x993fca { display: flex; gap: 8px; margin-bottom: 12px; }
.u-x889a9d { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; }
.u-x6d0e8f { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding: 15px; background: #34495e; border-radius: 8px; border: 1px solid #444; }
.u-x5a6c15 { display: flex; justify-content: space-between; padding: 4px 54px 0; font-size: 0.65em; color: #8b9bb5; font-weight: 500; }
.u-xab4dae { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 20px; }
.u-x7cf511 { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
.u-x208fd2 { display: inline-block; padding: 2px 10px; border-radius: 12px; font-size: 0.72em; font-weight: 700; text-transform: uppercase; letter-spacing: 0.6px; color: #fff; background: #6366f1; }
.u-xdf1690 { display: inline-block; padding: 8px 16px; background: #1e293b; border: 1px solid #334155; border-radius: 6px; color: #93c5fd; font-size: 1em; letter-spacing: 2px; user-select: all; }
.u-xd936ba { flex-wrap: wrap; }
.u-x3e5d36 { display: none; margin-bottom: 15px; }
.u-xb54c38 { margin-bottom: 15px; padding: 12px; border-radius: 6px; text-align: left; }
.u-x0279c1 { display: none; margin-bottom: 20px; }
.u-x65b3fc { display: none; margin-top: 20px; }
.u-xed7348 { display: none; margin-top: 20px; padding: 20px; background: rgba(16,185,129,0.1); border: 1px solid #10b981; border-radius: 10px; }
.u-x46195e { display: none; margin-top: 20px; padding: 20px; background: rgba(239,68,68,0.05); border: 1px solid #ef4444; border-radius: 10px; }
.u-xe65efd { display: none; margin-top: 20px; padding: 20px; background: rgba(245,158,11,0.1); border: 1px solid #f59e0b; border-radius: 10px; }
.u-x841c3e { display: none; margin-top: 20px; padding: 20px; background: rgba(59,130,246,0.05); border: 1px solid #3b82f6; border-radius: 10px; }
.u-x3fcd5a { display: none; position: absolute; bottom: 0; left: 0; right: 0; }
.u-x572138 { display:block; color:#aaa; text-decoration:none; padding:10px; text-align:center; font-size:0.9em; }
.u-xe8f1a4 { display:block; font-size:0.6em; opacity:0.8; margin-top:4px; }
.u-x83f51e { display:block; margin-top:20px; }
.u-xbcdf8b { display:block;color:#94a3b8;font-size:0.82em;font-weight:600;margin-bottom:10px; }
.u-xefa78a { display:flex; align-items:center; color:#64748b; font-size:1.5em; }
.u-xb6f0fe { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.u-x38012a { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.u-x8834a2 { display:flex; align-items:center; gap:6px; }
.u-xe7bbbe { display:flex; align-items:center; gap:8px; font-size:0.88em; color:#334155; }
.u-x2ac2bd { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.u-x2a5e9c { display:flex; align-items:end; gap:20px; justify-content:center; height:120px; margin:16px 0; }
.u-xe545c0 { display:flex; flex-direction:column; gap:10px; }
.u-xcc97a0 { display:flex; flex-direction:column; gap:4px; max-height:180px; overflow-y:auto; }
.u-x2756a1 { display:flex; gap:10px; justify-content:flex-end; }
.u-xdeb596 { display:flex; gap:15px; align-items:center; margin-bottom:20px; flex-wrap:wrap; }
.u-x3ec937 { display:flex; gap:15px; justify-content:center; }
.u-x168d09 { display:flex; gap:24px; flex-wrap:wrap; }
.u-x47aa33 { display:flex; gap:6px; flex-wrap:wrap; }
.u-x5d901b { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; }
.u-x424add { display:flex; justify-content:center; gap:12px; margin-bottom:24px; }
.u-xa1e219 { display:flex; justify-content:center; gap:15px; flex-wrap:wrap; }
.u-x7eb35b { display:flex; justify-content:center; gap:15px; flex-wrap:wrap; margin-top:10px; }
.u-xeba5af { display:flex; justify-content:center; gap:20px; flex-wrap:wrap; margin-top:15px; margin-bottom:10px; font-size:0.8em; color:#166534; }
.u-xf08ca1 { display:flex; justify-content:center; gap:30px; flex-wrap:wrap; color:#166534; font-size:0.9em; }
.u-x5e3bec { display:flex; justify-content:center; gap:30px; flex-wrap:wrap; text-align:center; }
.u-x1610e0 { display:flex; justify-content:space-between; margin-bottom:6px; }
.u-x48d9ac { display:flex; justify-content:space-between; margin-top:6px; font-size:0.75em; color:#64748b; }
.u-x279a76 { display:flex; justify-content:space-between; padding:8px 0; }
.u-xeeabc9 { display:flex;align-items:center;gap:16px;margin-bottom:16px; }
.u-xdf0ac7 { display:flex;align-items:center;gap:16px;margin-bottom:16px;flex-wrap:wrap; }
.u-x3f0ce9 { display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:12px;padding:10px 16px;background:#0f172a;border:1px solid #1e293b;border-radius:10px; }
.u-x993580 { display:grid; grid-template-columns:1fr 1fr; gap:16px 24px; margin-bottom:28px; }
.u-xb99f0e { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:24px 0; }
.u-xf53764 { display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; text-align:center; }
.u-xe7e84c { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; margin-bottom:40px; }
.u-x144d4d { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:16px; margin:24px 0; }
.u-x4bea2a { display:inline-block; background:#059669; color:white; padding:14px 32px; border-radius:8px; text-decoration:none; font-weight:700; font-size:1.05em; transition:0.2s; }
.u-x12c375 { display:inline-block; background:#2563eb; color:white; padding:12px 24px; border-radius:8px; text-decoration:none; font-weight:700; }
.u-x3e6a8f { display:inline-block; background:#2563eb; color:white; padding:14px 28px; border-radius:8px; text-decoration:none; font-weight:700; transition:0.2s; }
.u-x239479 { display:inline-block; background:linear-gradient(135deg, #f59e0b, #d97706); color:#fff; font-weight:700; font-size:0.95em; padding:8px 20px; border-radius:50px; letter-spacing:0.5px; }
.u-x050428 { display:inline-block; background:white; color:#2563eb; padding:14px 28px; border-radius:8px; text-decoration:none; font-weight:700; border:2px solid #2563eb; transition:0.2s; }
.u-x9cbc77 { display:inline-flex; align-items:center; gap:12px; text-decoration:none; color:#3b82f6; cursor:pointer; }
.u-xe0a6b3 { display:inline-flex; align-items:center; gap:8px; padding:10px 20px; background:linear-gradient(135deg,#10b981,#059669); color:#fff; border-radius:8px; text-decoration:none; font-weight:600; font-size:0.9em; transition:all 0.3s; }
.u-x615354 { display:inline-flex; align-items:center; gap:8px; padding:10px 20px; background:linear-gradient(135deg,#3b82f6,#2563eb); color:#fff; border-radius:8px; text-decoration:none; font-weight:600; font-size:0.9em; transition:all 0.3s; }
.u-x60da69 { display:none; background:#dc2626; color:#fff; border:none; padding:10px 24px; border-radius:8px; cursor:pointer; font-weight:600; font-size:0.9em; margin-top:12px; }
.u-xafff8f { display:none; background:linear-gradient(135deg,#e74c3c22,#c0392b22); border:1px solid #e74c3c44; border-radius:8px; padding:10px 16px; margin:8px 0; font-size:0.85em; }
.u-xb7231f { display:none; margin-bottom:20px; padding:14px 18px; background:#fefce8; border:1px solid #fde68a; border-radius:10px; text-align:center; font-size:0.9em; color:#92400e; }
.u-x71fc1e { display:none; margin-bottom:20px; padding:16px 20px; border-radius:10px; text-align:left; border:1px solid #d1fae5; background:linear-gradient(135deg, #ecfdf5, #f0fdf4); }
.u-xec3476 { display:none; margin-top: 10px; text-align: center; }
.u-x011381 { display:none; margin-top: 12px; }
.u-x208e6e { display:none; margin-top:10px; border-top:1px solid rgba(255,255,255,0.06); padding-top:10px; }
.u-xf08d2b { display:none; margin-top:12px; color:#3b82f6; font-size:0.95em; font-weight:600; }
.u-xb72be9 { display:none; margin-top:20px; padding:18px 20px; background:#fef2f2; border:1px solid #fecaca; border-radius:10px; text-align:left; }
.u-x0095dc { display:none; margin: 20px 0; }
.u-xb91d45 { display:none; margin:12px 0; padding:12px 16px; background:#1a1a2e; border:1px solid rgba(255,255,255,0.08); border-radius:10px; }
.u-xc3d506 { display:none; padding: 10px; background: #fee2e2; color: #b91c1c; border: 1px solid #fca5a5; border-radius: 6px; margin-bottom: 20px; text-align: center; }
.u-xafbdac { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:9999; display:none; justify-content:center; align-items:center; }
.u-x5f5a1b { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.8); z-index:9999; display:none; align-items:center; justify-content:center; }
.u-x1c3c23 { display:none; position:fixed; inset:0; z-index:9998; background:rgba(0,0,0,0.8); align-items:center; justify-content:center; overflow-y:auto; padding:20px 0; }
.u-x2729d7 { display:none; position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,0.7); display:none; align-items:center; justify-content:center; }
.u-xfcb7d5 { flex: 0 0 auto; }
.u-x7821eb { flex: 1; background: #0f172a; border: 1px solid #334155; color: #e2e8f0; padding: 8px; border-radius: 6px; font-size: 0.85em; }
.u-x51c2cf { flex: 1; background: #1e293b; border: 1px solid #334155; color: white; padding: 10px; border-radius: 6px; }
.u-x8ea199 { flex: 1; min-width: 200px; }
.u-xe2741b { flex:1; margin-right:8px; }
.u-x393d54 { flex:1;padding:10px 14px;background:#0f172a;border:1px solid #334155;border-radius:8px;color:#e0e0e0; }
.u-xba5c49 { flex:2; }
.u-x34eb6f { font-size: 0.75em; color: #8b9bb5; margin: 8px 0 0 26px; }
.u-x7ee723 { font-size: 0.7em; color: #8b9bb5; font-weight: 600; text-transform: uppercase; min-width: 44px; text-align: left; }
.u-xeb06b0 { font-size: 0.7em; color: #8b9bb5; font-weight: 600; text-transform: uppercase; min-width: 44px; text-align: right; }
.u-x16e9ac { font-size: 0.82em; color: #64748b; margin: 0 0 10px; }
.u-x23ccc8 { font-size: 0.85em; color: #64748b; }
.u-x8eae7c { font-size: 0.8em; color: #94a3b8; margin-top: 4px; }
.u-xab3778 { font-size: 0.8em; color: #94a3b8; margin: 12px 0 0; text-align: center; }
.u-x8ed0d9 { font-size: 0.95em; color: #94a3b8; }
.u-x6a9a71 { font-size: 0.9em; color: #aaa; }
.u-xaa64fc { font-size: 1.6em; color: #d97706; }
.u-xeb4d28 { font-size: 11px; color: #64748b; margin: 6px 0 0 0; }
.u-x5351c9 { font-size: 11px; color: #94a3b8; margin: 8px 0 0 26px; }
.u-xa4fe6f { font-size: 2.5em; margin-bottom: 12px; color: #e74c3c; }
.u-x5650a1 { font-size: 28px; color: #fbbf24; }
.u-x58b83d { font-size: 2em; color: #fca5a5; }
.u-x6fa0d1 { font-size: 3em; font-weight: bold; color: #e74c3c; font-family: monospace; }
.u-x427624 { font-size:0.75em; font-weight:400; opacity:0.8; margin-top:2px; }
.u-x41be5d { font-size:0.7em; }
.u-xa5d64b { font-size:0.85em; color:#94a3b8; margin-top:10px; }
.u-x0f6100 { font-size:0.8em; opacity:0.7; }
.u-x246f0a { font-size:1.1em; font-weight:700; }
.u-xd58ad0 { font-size:1.4em; animation: bounce 2s infinite; }
.u-x3ac1f3 { font-size:1.8em; color:#059669; margin-bottom:12px; }
.u-xd4ef56 { font-size:1.8em; color:#06b6d4; margin-bottom:12px; }
.u-x5e2a6a { font-size:1.8em; color:#2563eb; margin-bottom:12px; }
.u-x2b648e { font-size:1.8em; color:#8b5cf6; margin-bottom:12px; }
.u-x0f6938 { font-size:1.8em; color:#ec4899; margin-bottom:12px; }
.u-x342a43 { font-size:1.8em; color:#f59e0b; margin-bottom:12px; }
.u-xda8f03 { font-size:1.8em; font-weight:800; color:#34d399; }
.u-x42468c { font-size:1.8em; font-weight:800; color:#60a5fa; }
.u-x2456fb { font-size:1.8em; font-weight:800; color:#f87171; }
.u-x02e4e3 { font-size:2.2em; font-weight:800; color:#34d399; }
.u-xef5334 { font-size:2.2em; font-weight:800; color:#f87171; }
.u-x8b1ef3 { font-size:2.5em; color:#f59e0b; margin-bottom:15px; }
.u-x9b423c { font-size:2.5em; font-weight:800; color:#34d399; margin-bottom:5px; }
.u-x1945c9 { font-size:2.5em; font-weight:800; color:#60a5fa; margin-bottom:5px; }
.u-x0a9221 { font-size:2.5em; font-weight:800; color:#f87171; margin-bottom:5px; }
.u-x8a3b3e { font-size:2.5em; font-weight:800; color:#fbbf24; margin-bottom:5px; }
.u-x79529e { font-size:2em; color:#f59e0b; margin-bottom:10px; }
.u-x1e3283 { font-size:2em; font-weight:800; color:#34d399; margin:8px 0; }
.u-x638bfd { font-size:2em; font-weight:800; color:#60a5fa; margin:8px 0; }
.u-x4429b7 { font-size:2em; font-weight:800; color:#a78bfa; margin:8px 0; }
.u-x8e9693 { font-size:2em; font-weight:800; color:#f87171; margin:8px 0; }
.u-x608a1f { font-size:2em; font-weight:800; color:#fb923c; margin:8px 0; }
.u-x463303 { font-size:2em; font-weight:800; color:#fbbf24; margin:8px 0; }
.u-x435e3e { font-size:3em; color:#ef4444; margin-bottom:20px; }
.u-x81fb58 { font-size:48px; color:#3498db; margin-bottom:20px; display:block; }
.u-xbec55a { font-weight:600; font-size:1.1em; }
.u-xb7b9ba { font-weight:700; color:#166534; margin-bottom:10px; font-size:1.05em; }
.u-x7fc8f6 { font-weight:bold; margin-bottom:15px; }
.u-x43dd25 { left: 0%; }
.u-x9fdeca { left: 100%; }
.u-x4cc1f9 { left: 25%; }
.u-x120e88 { left: 50%; }
.u-xdccc4f { left: 75%; }
.u-xa97373 { line-height: 1.8; color: #334155; }
.u-x1f2818 { line-height:1.8; color:#94a3b8; font-size:0.9em; }
.u-xeb35b3 { line-height:2.2; color:#94a3b8; }
.u-x9151cd { line-height:2; color:#94a3b8; }
.u-xc32515 { margin-bottom: 20px; padding: 12px 16px; background: #2a2a3e; border: 1px solid rgba(255,255,255,0.08); border-radius: 8px; }
.u-xffbeea { margin-bottom: 25px; }
.u-x5f3000 { margin-bottom: 4px; display: flex; align-items: center; gap: 6px; }
.u-xc58d5b { margin-bottom:10px; }
.u-x157a9c { margin-bottom:14px; }
.u-x5534b3 { margin-bottom:16px; }
.u-x176841 { margin-bottom:20px; color:#64748b; }
.u-x7ecf0a { margin-bottom:30px; }
.u-x0b09d8 { margin-left:8px; }
.u-xcb7dd4 { margin-right: 3px; }
.u-xf0a8ce { margin-right: 4px; opacity: 0.7; }
.u-x876346 { margin-right:8px; color:#34d399; }
.u-xaf2677 { margin-top: 12px; display: flex; gap: 8px; }
.u-x55dc8d { margin-top: 15px; padding: 12px 16px; background: #2a2a3e; border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; text-align: left; }
.u-x19f020 { margin-top: 16px; margin-left: 8px; padding: 8px 16px; background: #10b981; color: white; border: none; border-radius: 6px; cursor: pointer; font-size: 0.9em; }
.u-x88c53d { margin-top: 20px; color: #94a3b8; font-size: 0.85em; }
.u-x9f3c73 { margin-top: 8px; display: none; }
.u-xb07084 { margin-top: 8px; margin-bottom: 8px; }
.u-x1bc9c9 { margin-top:0; color: #9ca3af; }
.u-x2fff56 { margin-top:10px; background:#dc2626; color:#fff; border:none; padding:8px 18px; border-radius:8px; cursor:pointer; font-weight:600; font-size:0.85em; }
.u-xfc752b { margin-top:10px; width:100%; }
.u-x887ca9 { margin-top:12px;display:flex;gap:10px; }
.u-xf4e330 { margin-top:14px; }
.u-xba7829 { margin-top:15px; }
.u-x87a2dc { margin-top:15px; padding:12px; background:#f0fdf4; border:1px solid #bbf7d0; border-radius:6px; text-align:center; font-size:0.8em; color:#166534; }
.u-xff6eee { margin-top:6px; }
.u-x15158b { margin: 0 30px 20px 30px; }
.u-x466f5e { margin: 10px 0 0 20px; padding: 0; color: #bdc3c7; font-size: 0.9em; }
.u-x1519eb { margin: 12px 0 0; padding: 8px 12px; font-size: 0.85em; color: #94a3b8; background: rgba(255,255,255,0.03); border-radius: 6px; border-left: 3px solid #6366f1; line-height: 1.45; }
.u-xf4f25b { margin: 20px 0; text-align: left; }
.u-x15b875 { margin: 6px 0 0; color: #047857; font-size: 0.85em; }
.u-x42b220 { margin: 8px 0 0 20px; }
.u-x571319 { margin: 8px 0 0; color: #1e40af; }
.u-xd1391a { margin: 8px 0 12px 0; color: #7f6c35; font-size: 0.95em; line-height: 1.5; }
.u-x002512 { margin:0 0 6px; font-weight:700; color:#991b1b; }
.u-x9f1963 { margin:0 0 8px; color:#1e3a5f; }
.u-x44b32f { margin:0 0 8px; color:#92400e; }
.u-x71dd10 { margin:0; color:#7f1d1d; font-size:0.9em; }
.u-x7609e5 { margin:0; color:#f1c40f; }
.u-x0869d4 { margin:12px 0 0 0; }
.u-x49b70e { margin:12px 0; color:#94a3b8; }
.u-x612097 { margin:8px 0 0 0; line-height:1.8; }
.u-x9413d6 { margin:8px 0; color:#94a3b8; }
.u-x6cc708 { max-width: 220px; border-radius: 8px; background: white; padding: 8px; }
.u-xfbe98b { max-width: 400px; }
.u-xf74347 { max-width: 400px; border-color: #e74c3c; }
.u-x1a1901 { max-width: 420px; border-color: #6366f1; }
.u-x0c820e { max-width: 420px; border-color: #e74c3c; }
.u-x2383b5 { max-width: 450px; }
.u-x1f146e { max-width: 450px; border-color: #f39c12; }
.u-xd99434 { max-width: 500px; }
.u-xb1e524 { max-width: 550px; text-align: left; border-color: #6366f1; }
.u-xedcb25 { max-width: 650px; border-color: #6366f1; text-align: left; max-height: 80vh; overflow-y: auto; }
.u-xf0744e { max-width: 700px; text-align: left; border-color: #10b981; max-height: 85vh; overflow-y: auto; }
.u-xa3e831 { max-width: 800px; margin: 60px auto; padding: 40px; background: white; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
.u-x01a047 { max-width:1000px; margin:0 auto; }
.u-x273022 { max-width:1000px; margin:0 auto; text-align:center; }
.u-xe32bc0 { max-width:500px; margin:0 auto 24px; text-align:center; }
.u-xdf0399 { max-width:600px; margin:0 auto; }
.u-x080ce6 { max-width:600px; margin:40px auto; text-align:center; padding:25px; background:#fefce8; border:1px solid #fde68a; border-radius:12px; }
.u-x852ae2 { max-width:680px; margin:0 auto; background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.15); border-radius:16px; padding:35px 30px; text-align:left; }
.u-x4a2ad6 { max-width:700px; }
.u-x32421f { max-width:700px; margin:0 auto 60px; padding:30px; background:linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%); border:1px solid #bfdbfe; border-radius:16px; text-align:center; }
.u-x4914f7 { max-width:700px; margin:60px auto; padding:0 20px; }
.u-xd5898e { max-width:800px; margin:0 auto 40px; padding:20px 30px; background:#f0fdf4; border:1px solid #bbf7d0; border-radius:12px; text-align:center; }
.u-xa7e54d { max-width:800px; margin:0 auto 40px; padding:30px; background:linear-gradient(135deg, #0f172a, #1e293b); border-radius:16px; color:white; }
.u-x0438f1 { max-width:800px; margin:40px auto; padding:0 20px; }
.u-x476a5d { min-height: 200px; }
.u-xfbe3d7 { min-height:250px;font-family:monospace;font-size:0.85em; }
.u-x77c814 { overflow-x:auto; }
.u-xa798ce { padding: 10px 20px; background: #334155; color: #e0e0e0; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; transition: background 0.3s; }
.u-xf14fed { padding: 10px 20px; background: #3b82f6; color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; }
.u-xa69d35 { padding: 10px 20px; background: #ef4444; color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; }
.u-x7280bd { padding: 10px 20px; background: transparent; color: #ef4444; border: 2px solid #ef4444; border-radius: 8px; font-weight: 600; cursor: pointer; transition: all 0.3s; }
.u-x3e5ba0 { padding: 10px 30px; background: #059669; color: white; border: none; border-radius: 8px; font-size: 1em; cursor: pointer; font-weight: 600; }
.u-x61de22 { padding: 10px 30px; background: #dc2626; color: white; border: none; border-radius: 8px; font-size: 1em; cursor: pointer; font-weight: 600; }
.u-xe21d91 { padding: 10px; background: #ecfdf5; color: #065f46; border: 1px solid #10b981; border-radius: 6px; margin-bottom: 20px; text-align: center; }
.u-x98b07b { padding: 10px; background: #fee2e2; color: #b91c1c; border: 1px solid #fca5a5; border-radius: 6px; margin-bottom: 20px; text-align: center; }
.u-xebe5b0 { padding: 10px; border-top: 1px solid #333; }
.u-x2df922 { padding: 12px 24px; }
.u-x3d9b78 { padding: 12px 24px; background: #16a34a; color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background 0.3s; }
.u-xbdd15b { padding: 12px 24px; background: transparent; color: #ef4444; border: 2px solid #ef4444; border-radius: 8px; font-weight: 600; cursor: pointer; transition: all 0.3s; }
.u-xf1055b { padding: 12px 24px; color: #94a3b8; font-size: 0.95em; }
.u-xfc8234 { padding:10px; font-weight:600; color:#34d399; }
.u-xccbc51 { padding:12px 16px; text-align:center; color:#059669; font-weight:600; }
.u-x4a376e { padding:12px 16px; text-align:center; color:#2563eb; font-weight:700; }
.u-x1bcf12 { padding:12px 16px; text-align:center; color:#dc2626; }
.u-xfde85b { padding:12px 16px; text-align:center; color:#f59e0b; }
.u-x548ca9 { padding:12px 16px; text-align:left; color:#64748b; }
.u-xbf348d { padding:12px 24px; background:#334155; color:#e0e0e0; border:none; border-radius:8px; font-weight:600; cursor:pointer; }
.u-x47f231 { padding:12px 24px; background:#ef4444; color:white; border:none; border-radius:8px; font-weight:600; cursor:pointer; }
.u-x896f27 { padding:20px 12px; background:rgba(248,113,113,0.1); border:1px solid rgba(248,113,113,0.25); border-radius:12px; }
.u-x27f126 { padding:20px 12px; background:rgba(52,211,153,0.1); border:1px solid rgba(52,211,153,0.25); border-radius:12px; }
.u-x24fc36 { padding:20px 12px; background:rgba(96,165,250,0.1); border:1px solid rgba(96,165,250,0.25); border-radius:12px; }
.u-xc0f6b1 { padding:20px; text-align:center; color:#555; }
.u-xd5c936 { padding:50px 20px; background:linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%); border-top:1px solid #bfdbfe; border-bottom:1px solid #bfdbfe; text-align:center; }
.u-xaa6bea { padding:56.25% 0 0 0;position:relative; }
.u-xc81e36 { padding:60px 20px; background:#f8fafc; border-top:1px solid #e2e8f0; border-bottom:1px solid #e2e8f0; }
.u-x3e8df8 { padding:60px 20px; background:#fff; max-width:1000px; margin:0 auto; }
.u-x30ea28 { padding:60px 20px; background:linear-gradient(135deg, #0f172a 0%, #1e293b 100%); color:white; }
.u-x235331 { padding:7px 12px;background:#1e293b;border:1px solid #334155;border-radius:8px;color:#e0e0e0;font-size:0.85em;width:170px; }
.u-x475857 { padding:8px 20px; border-radius:8px; border:1px solid #059669; background:rgba(5,150,105,0.2); color:#34d399; font-size:0.88em; cursor:pointer; font-weight:600; transition:0.2s; }
.u-xe19a86 { padding:8px 20px; border-radius:8px; border:1px solid rgba(255,255,255,0.2); background:rgba(255,255,255,0.05); color:#94a3b8; font-size:0.88em; cursor:pointer; transition:0.2s; }
.u-x1d0699 { padding:8px; text-align:center; color:#10b981; }
.u-x499a70 { padding:8px; text-align:center; color:#64748b; }
.u-x072473 { padding:8px; text-align:center; color:#fbbf24; font-weight:600; }
.u-xd1b0cf { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); height: 6px; border-radius: 3px; background: linear-gradient(to right, #22c55e 0%, #84cc16 25%, #6366f1 50%, #f59e0b 75%, #ef4444 100%); pointer-events: none; }
.u-x2a85bc { position: absolute; opacity: 0; width: 0; height: 0; }
.u-x018bf3 { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); background: none; border: none; color: #94a3b8; cursor: pointer; padding: 4px; }
.u-xbf252a { position: relative; display: inline-flex; align-items: center; cursor: pointer; gap: 10px; }
.u-xe27b03 { position: relative; flex: 1; height: 36px; display: flex; align-items: center; }
.u-xe3c6a5 { position: relative; width: 100%; height: 36px; -webkit-appearance: none; appearance: none; background: transparent; cursor: pointer; z-index: 2; margin: 0; }
.u-x0f1006 { position: relative; width: 50px; height: 26px; }
.u-x161fe0 { position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:#3b82f6;color:white;padding:12px 24px;border-radius:0 0 8px 8px;z-index:10000;font-weight:600;text-decoration:none;transition:top 0.2s; }
.u-x8a6b96 { position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#1e293b;color:#475569; }
.u-x4ab383 { position:sticky; top:0; z-index:100; background:rgba(255,255,255,0.95); backdrop-filter:blur(8px); border-bottom:1px solid #e2e8f0; padding:12px 0; text-align:center; box-shadow:0 2px 8px rgba(0,0,0,0.06); }
.u-xa2c43f { text-align: center; color: #0f172a; margin-bottom: 30px; }
.u-xc5db67 { text-align: center; color: #64748b; margin-bottom: 15px; }
.u-x4790ea { text-align: center; color: #64748b; margin-bottom: 20px; }
.u-x7b6f3a { text-align: center; color: #64748b; margin-bottom: 30px; }
.u-xa2e8e9 { text-align: center; color: #64748b; margin-bottom: 30px; font-size: 0.95em; }
.u-xffa12e { text-align: center; font-size: 1.05em; }
.u-x0ef7f5 { text-align: center; font-size: 1.1em; }
.u-xfea7bb { text-align: center; margin-top: 10px; color: #64748b; }
.u-x1bee25 { text-align: center; margin-top: 15px; }
.u-x7f1350 { text-align: center; margin-top: 16px; }
.u-xb2695f { text-align: right; margin-bottom: 20px; }
.u-xe36503 { text-align:center; color:#94a3b8; font-size:0.85em; margin-top:20px; margin-bottom:0; }
.u-x0fcc0a { text-align:center; margin-bottom:30px; }
.u-xd78a30 { text-align:center; margin-bottom:8px; }
.u-xca939f { text-align:center; margin-top:16px; }
.u-xba248d { text-align:center; margin-top:24px; }
.u-xe40d20 { text-align:left; margin-bottom:25px; padding:15px; background:#f8fafc; border-radius:8px; border:1px solid #e2e8f0; }
.u-x8fdce8 { text-decoration:none; }
.u-xa1f46f { text-transform: capitalize; }
.u-x759002 { width: 0% }
.u-xd62aee { width: 100%; background: #1e293b; border: 1px solid #334155; color: #e2e8f0; padding: 10px; border-radius: 6px; resize: vertical; font-size: 0.9em; box-sizing: border-box; }
.u-xa5c95c { width: 100%; max-height: 360px; background: #000; border-radius: 8px 8px 0 0; display: block; }
.u-xcf093a { width: 100%; padding: 10px; background: #222; border: 1px solid #555; color: white; border-radius: 4px; }
.u-x3fff51 { width: 100%; padding: 10px; background: #222; border: 1px solid #555; color: white; border-radius: 4px; box-sizing: border-box; }
.u-x6599bd { width: 100%; padding: 10px; background: #222; border: 1px solid #555; color: white; margin-top: 5px; border-radius: 4px; box-sizing: border-box; }
.u-x0a5487 { width: 100%; padding: 12px; border: 1px solid #cbd5e1; border-radius: 6px; box-sizing: border-box; background: #f1f5f9; color: #64748b; }
.u-x62bf39 { width: 100%; padding: 12px; padding-right: 44px; border: 1px solid #cbd5e1; border-radius: 6px; box-sizing: border-box; }
.u-x036933 { width: 100%; padding: 16px; border: 1px solid #cbd5e1; border-radius: 6px; box-sizing: border-box; font-size: 1.4em; text-align: center; letter-spacing: 0.3em; font-family: monospace; }
.u-x0784b8 { width: 160px; padding: 12px 16px; border: 2px solid #334155; border-radius: 8px; background: #0f172a; color: #e0e0e0; font-size: 1.3em; text-align: center; letter-spacing: 6px; font-family: monospace; }
.u-x64fa21 { width: 1px; height: 30px; background: #444; margin: 0 10px; }
.u-x3c2521 { width: 20px; height: 20px; cursor: pointer; }
.u-xc0860c { width: 64px; height: 64px; margin: 0 auto 20px; background: #fef3c7; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.u-xd08c8a { width:100%; border-radius:8px; border:1px solid #cbd5e1; box-shadow:0 10px 15px -3px rgba(0,0,0,0.1); margin-bottom:20px; }
.u-x56d807 { width:100%; margin-top:15px; }
.u-x10d14b { width:100%; max-height:360px; border-radius:8px; background:#000; margin-bottom:15px; }
.u-x8ccbe7 { width:22%; }
.u-x58449d { width:25%; }
.u-xfcfbc2 { width:41%; }
.u-x9888f3 { width:58%; }
.u-x644424 { width:90%; }
.u-x439725 { width:94%; }

/* =============================================================
   SEC-014 Phase 2  —  Utility classes for JS-injected styles
   These replace inline style="..." in admin.html <script> sections.
   ============================================================= */

/* ---- Table cell variants (admin tables) ---- */
.u-td-p12-e2e      { padding: 12px 15px; color: #e2e8f0; }
.u-td-p12-d1d5     { padding: 12px 15px; color: #d1d5db; }
.u-td-p12-9ca      { padding: 12px 15px; color: #9ca3af; }
.u-td-p12-9ca-085  { padding: 12px 15px; color: #9ca3af; font-size: 0.85em; }
.u-td-p12-9ca-09   { padding: 12px 15px; color: #9ca3af; font-size: 0.9em; }
.u-td-p12-center   { padding: 12px 15px; text-align: center; }
.u-td-p12-center-e2e { padding: 12px 15px; text-align: center; color: #e2e8f0; }
.u-td-p15-d1d5     { padding: 15px; color: #d1d5db; }
.u-td-p15-9ca      { padding: 15px; color: #9ca3af; }
.u-td-p15-9ca-09   { padding: 15px; color: #9ca3af; font-size: 0.9em; }
.u-td-p15-center   { padding: 15px; text-align: center; }
.u-td-p10-12-cbd   { padding: 10px 12px; color: #cbd5e1; white-space: nowrap; }
.u-td-p10-12-e2e   { padding: 10px 12px; color: #e2e8f0; }
.u-td-p10-12-9ca   { padding: 10px 12px; color: #9ca3af; }
.u-td-p10-12-6b7   { padding: 10px 12px; color: #6b7280; font-family: var(--font-mono); font-size: 0.8em; }
.u-td-p10-12       { padding: 10px 12px; }

/* ---- Table row / header patterns ---- */
.u-tr-border-subtle { border-bottom: 1px solid rgba(255,255,255,0.05); }
.u-tr-head-rgba     { background: rgba(255,255,255,0.05); text-align: left; }
.u-th-p15-uc        { padding: 15px; color: #9ca3af; font-weight: 600; font-size: 0.85em; text-transform: uppercase; }
.u-th-p15-uc-center { padding: 15px; color: #9ca3af; font-weight: 600; font-size: 0.85em; text-transform: uppercase; text-align: center; }

/* ---- Status badges ---- */
.u-badge-status-completed { padding: 3px 10px; border-radius: 12px; font-size: 0.8em; font-weight: 600; background: rgba(16,185,129,0.2); color: #10b981; }
.u-badge-status-pending   { padding: 3px 10px; border-radius: 12px; font-size: 0.8em; font-weight: 600; background: rgba(245,158,11,0.2); color: #f59e0b; }
.u-badge-pending-review   { background: #f59e0b33; color: #f59e0b; padding: 2px 8px; border-radius: 8px; font-size: 0.75em; white-space: nowrap; }
.u-badge-phi-action       { background: rgba(239,68,68,0.15); color: #fca5a5; padding: 2px 8px; border-radius: 4px; font-size: 0.85em; }

/* ---- Result / feedback states ---- */
.u-result-error   { background: rgba(239, 68, 68, 0.15); border: 1px solid #ef4444; }
.u-result-success { background: rgba(16, 185, 129, 0.15); border: 1px solid #10b981; }

/* ---- Role-based colors (data-attribute driven) ---- */
.u-role-pill       { color: white; border: none; padding: 4px 10px; border-radius: 12px; font-size: 0.8em; font-weight: 600; cursor: pointer; appearance: auto; }
.u-role-pill-static { padding: 4px 12px; border-radius: 12px; font-size: 0.8em; font-weight: 600; }
[data-role-color="owner"]   .u-role-pill, [data-role-color="owner"]   .u-role-pill-static,
.u-role-pill[data-role-color="owner"],   .u-role-pill-static[data-role-color="owner"]   { background: #6366f1; }
[data-role-color="admin"]   .u-role-pill, [data-role-color="admin"]   .u-role-pill-static,
.u-role-pill[data-role-color="admin"],   .u-role-pill-static[data-role-color="admin"]   { background: #2563eb; }
[data-role-color="hunter"]  .u-role-pill, [data-role-color="hunter"]  .u-role-pill-static,
.u-role-pill[data-role-color="hunter"],  .u-role-pill-static[data-role-color="hunter"]  { background: #059669; }
[data-role-color="trainee"] .u-role-pill, [data-role-color="trainee"] .u-role-pill-static,
.u-role-pill[data-role-color="trainee"], .u-role-pill-static[data-role-color="trainee"] { background: #f59e0b; }
[data-role-color="founder"] .u-role-pill, [data-role-color="founder"] .u-role-pill-static,
.u-role-pill[data-role-color="founder"], .u-role-pill-static[data-role-color="founder"] { background: #8b5cf6; }

/* ---- Tier-based colors (data-attribute driven) ---- */
[data-tier-color="growth"]     .u-role-pill, [data-tier-color="growth"]     .u-role-pill-static,
.u-role-pill[data-tier-color="growth"],     .u-role-pill-static[data-tier-color="growth"]     { background: #8b5cf6; }
[data-tier-color="standard"]   .u-role-pill, [data-tier-color="standard"]   .u-role-pill-static,
.u-role-pill[data-tier-color="standard"],   .u-role-pill-static[data-tier-color="standard"]   { background: #2563eb; }
[data-tier-color="free"]       .u-role-pill, [data-tier-color="free"]       .u-role-pill-static,
.u-role-pill[data-tier-color="free"],       .u-role-pill-static[data-tier-color="free"]       { background: #6b7280; }
[data-tier-color="trial"]      .u-role-pill, [data-tier-color="trial"]      .u-role-pill-static,
.u-role-pill[data-tier-color="trial"],      .u-role-pill-static[data-tier-color="trial"]      { background: #059669; }

/* ---- User avatar circle ---- */
.u-user-avatar { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
[data-role-color="owner"]   .u-user-avatar { background: #6366f133; color: #6366f1; }
[data-role-color="admin"]   .u-user-avatar { background: #2563eb33; color: #2563eb; }
[data-role-color="hunter"]  .u-user-avatar { background: #05966933; color: #059669; }
[data-role-color="trainee"] .u-user-avatar { background: #f59e0b33; color: #f59e0b; }
[data-role-color="founder"] .u-user-avatar { background: #8b5cf633; color: #8b5cf6; }

/* ---- Rank badges (leaderboard) ---- */
.u-rank-badge { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: bold; margin-right: 12px; flex-shrink: 0; }
[data-rank="0"] .u-rank-badge, .u-rank-badge[data-rank="0"] { background: #f59e0b; }
[data-rank="1"] .u-rank-badge, .u-rank-badge[data-rank="1"] { background: #94a3b8; }
[data-rank="2"] .u-rank-badge, .u-rank-badge[data-rank="2"] { background: #b45309; }
.u-rank-badge-default { background: #555; }

/* ---- Activity badge ---- */
.u-activity-badge { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-right: 10px; flex-shrink: 0; }
.u-activity-completed { background: #10b981; }
.u-activity-progress  { background: #3b82f6; }

/* ---- Analytics row ---- */
.u-analytics-row     { display: flex; align-items: center; padding: 12px; border-radius: 8px; margin-bottom: 10px; }
.u-analytics-primary { background: rgba(59, 130, 246, 0.1); border: 1px solid #3b82f6; }
.u-analytics-default { background: #34495e; border: 1px solid #444; }
.u-activity-row      { display: flex; align-items: center; padding: 10px; background: #34495e; border-radius: 6px; margin-bottom: 8px; font-size: 0.9em; }

/* ---- Chart bar ---- */
.u-chart-bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; }

/* ---- Text truncation ---- */
.u-text-ellipsis  { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.u-text-ellipsis-bold { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---- SOP markdown rendering ---- */
.u-md-h1        { color: #10b981; font-family: Arial; margin: 16px 0 8px; }
.u-md-h2        { color: #818cf8; font-family: Arial; font-size: 1.1em; margin: 14px 0 6px; }
.u-md-strong    { color: #f59e0b; }
.u-md-table-row { border-bottom: 1px solid #334155; padding: 4px 0; }

/* ---- Review queue card ---- */
.u-review-card { background: var(--dark-card); border: 1px solid #f59e0b33; border-radius: 10px; padding: 15px; cursor: pointer; transition: border-color 0.2s; }
.u-review-card-header { display: flex; justify-content: space-between; align-items: start; margin-bottom: 10px; }

/* ---- Misc button patterns ---- */
.u-btn-icon-delete  { background: none; border: none; color: #ef4444; cursor: pointer; font-size: 0.9em; }
.u-btn-icon-remove  { background: none; border: none; color: #ef4444; cursor: pointer; padding: 0 2px; font-size: 1em; }
.u-btn-approve      { flex: 1; background: #059669; padding: 8px; font-size: 0.85em; }
.u-btn-reject       { flex: 1; background: #dc2626; padding: 8px; font-size: 0.85em; }
.u-btn-copy-sm      { background: #374151; padding: 4px 10px; font-size: 0.8em; }
.u-btn-resend       { background: #6366f1; padding: 4px 10px; font-size: 0.8em; }
.u-btn-delete-sm    { background: #dc2626; padding: 4px 10px; font-size: 0.8em; }
.u-btn-retry-blue   { margin-top: 10px; background: #3b82f6; color: #fff; border: none; padding: 6px 16px; border-radius: 6px; cursor: pointer; }
.u-btn-publishing   { opacity: 0.7; }
.u-btn-published    { background: #065f46; }

/* ---- Image thumbnail ---- */
.u-img-thumbnail { width: 100%; border-radius: 6px; margin-bottom: 10px; max-height: 140px; object-fit: cover; }

/* ---- Invite link input ---- */
.u-input-invite-link { width: 100%; padding: 6px 8px; background: #1a1a2e; border: 1px solid #444; color: #d1d5db; border-radius: 4px; font-size: 0.85em; box-sizing: border-box; cursor: pointer; }

/* ---- Invite role badge (dynamic) ---- */
.u-badge-role-trainee { background: #059669; padding: 2px 8px; border-radius: 10px; font-size: 0.75em; font-weight: 600; }
.u-badge-role-hunter  { background: #2563eb; padding: 2px 8px; border-radius: 10px; font-size: 0.75em; font-weight: 600; }
.u-badge-role-admin   { background: #7c3aed; padding: 2px 8px; border-radius: 10px; font-size: 0.75em; font-weight: 600; }

/* ---- Status text colors ---- */
.u-status-pending   { color: #f59e0b; font-weight: 500; text-transform: capitalize; }
.u-status-accepted  { color: #10b981; font-weight: 500; text-transform: capitalize; }
.u-status-expired   { color: #6b7280; font-weight: 500; text-transform: capitalize; }
.u-status-revoked   { color: #ef4444; font-weight: 500; text-transform: capitalize; }

/* ---- Referral status ---- */
.u-ref-pending   { color: #f59e0b; font-weight: 500; }
.u-ref-signed-up { color: #10b981; font-weight: 500; }
.u-ref-rewarded  { color: #3b82f6; font-weight: 500; }

/* ---- Toggle switch (pure CSS) ---- */
.u-toggle-bg    { width: 48px; height: 24px; background: #374151; border-radius: 12px; position: relative; cursor: pointer; transition: background 0.2s; }
.u-toggle-thumb { width: 20px; height: 20px; background: white; border-radius: 50%; position: absolute; top: 2px; left: 2px; transition: transform 0.2s; }
.u-toggle-on .u-toggle-bg    { background: #059669; }
.u-toggle-on .u-toggle-thumb { transform: translateX(24px); }

/* ---- Public/private toggle text ---- */
.u-status-public  { color: #27ae60; }
.u-status-private { color: #ecf0f1; }

/* ---- Confirm modal themes ---- */
.u-confirm-red   { color: #e74c3c; }
.u-confirm-blue  { color: #2563eb; }
.u-confirm-amber { color: #f59e0b; }
.u-confirm-btn-red   { background: #e74c3c; }
.u-confirm-btn-blue  { background: #2563eb; }
.u-confirm-btn-amber { background: #f59e0b; }

/* ---- Dropzone drag state ---- */
.u-dropzone-dragover { border-color: #818cf8 !important; background: rgba(99,102,241,0.15) !important; }

/* ---- Difficulty colors ---- */
.u-shred-difficulty { background: #1a1a2e; border: 1px solid #333; border-radius: 4px; padding: 2px 6px; font-size: 0.8em; color: #f59e0b; }
.u-shred-difficulty[data-difficulty="Easy"]   { color: #10b981; }
.u-shred-difficulty[data-difficulty="Medium"] { color: #f59e0b; }
.u-shred-difficulty[data-difficulty="Hard"]   { color: #ef4444; }

/* ---- Current user row highlight ---- */
.u-row-current-user { background: rgba(59,130,246,0.08); }

/* ---- Color helpers (missing from Phase 1) ---- */
.u-color-green-22c  { color: #22c55e; }
.u-color-6b7        { color: #6b7280; }
.u-color-6ee7b7     { color: #6ee7b7; }
.u-color-94a3b8     { color: #94a3b8; }
.u-color-d1d5db     { color: #d1d5db; }
.u-color-e2e8f0     { color: #e2e8f0; }
.u-color-ecf0f1     { color: #ecf0f1; }
.u-color-cbd5e1     { color: #cbd5e1; }

/* ---- Misc compound helpers (JS templates) ---- */
.u-color-white-fw600  { font-weight: 600; color: white; }
.u-color-white-095    { color: white; font-size: 0.95em; }
.u-color-9ca-08-mt4   { color: #9ca3af; font-size: 0.8em; margin: 4px 0 0; }
.u-color-9ca-085      { color: #9ca3af; font-size: 0.85em; }
.u-color-9ca-08       { color: #9ca3af; font-size: 0.8em; }
.u-color-ef4-085      { color: #ef4444; font-size: 0.85em; }
.u-color-3b82-08      { color: #3b82f6; font-size: 0.8em; }
.u-color-9ca4-08      { color: #9ca3a4; font-size: 0.8em; }
.u-color-9ca4-085     { color: #9ca3a4; font-size: 0.85em; }
.u-empty-state-9ca4   { text-align: center; padding: 40px; color: #9ca3a4; }
.u-spinner-green      { font-size: 2em; color: #10b981; }
.u-loading-text       { color: #94a3b8; margin-top: 12px; }
.u-label-block-mb4    { display: block; margin-bottom: 4px; }
.u-flex-sb-start      { display: flex; justify-content: space-between; align-items: start; margin-bottom: 10px; }
.u-flex-gap6-jc       { display: flex; gap: 6px; justify-content: center; }
.u-flex-ai-p5         { display: flex; align-items: center; gap: 8px; padding: 5px; cursor: pointer; color: #e2e8f0; font-size: 0.9em; }
.u-flex-1-overflow    { flex: 1; overflow: hidden; }
.u-ml10               { margin-left: 10px; }
.u-mb5-mt5            { margin-bottom: 5px; margin-top: 5px; }
.u-empty-gridspan     { color: #9ca3af; text-align: center; padding: 20px; grid-column: 1/-1; }
.u-bar-count          { color: #9ca3a4; font-size: 0.8em; margin-bottom: 5px; }
.u-bar-label          { color: #a8b3b4; font-size: 0.75em; margin-top: 5px; }
.u-domain-pill        { display: inline-flex; align-items: center; gap: 6px; background: rgba(59,130,246,0.15); border: 1px solid #3b82f6; padding: 6px 12px; border-radius: 20px; color: #93c5fd; font-size: 0.9em; }
.u-cms-error-heading  { color: #e74c3c; text-align: center; padding: 20px; }
.u-td-p12-flex-center { padding: 12px 15px; text-align: center; display: flex; gap: 6px; justify-content: center; }

/* ---- Phase 3b additions ---- */
.u-ml-auto          { margin-left: auto; }
.u-shred-title-input { display: inline; width: 60%; background: transparent; border: none; color: #f59e0b; font-size: 1em; font-weight: 600; }
.u-min-h40          { min-height: 40px; }
.u-w80              { width: 80px; }
.u-mt8              { margin-top: 8px; }
.u-bg-2563          { background: #2563eb; }
.btn-not-helpful    { background: rgba(231,76,60,0.15); color: #e74c3c; border: 1px solid rgba(231,76,60,0.3); }

/* ---- Bounties.html inline style migration ---- */

/* Difficulty-colored badges (data-attribute driven) */
.bounty-points-badge[data-diff="Easy"]   { background: #22c55e; }
.bounty-points-badge[data-diff="Medium"] { background: #f59e0b; }
.bounty-points-badge[data-diff="Hard"]   { background: #ef4444; }
.bounty-difficulty-label[data-diff="Easy"]   { color: #22c55e; }
.bounty-difficulty-label[data-diff="Medium"] { color: #f59e0b; }
.bounty-difficulty-label[data-diff="Hard"]   { color: #ef4444; }
.progress-bar-fill[data-diff="Easy"]   { background: #22c55e; }
.progress-bar-fill[data-diff="Medium"] { background: #f59e0b; }
.progress-bar-fill[data-diff="Hard"]   { background: #ef4444; }

/* Entity/redaction UI */
.u-entity-row-left    { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; }
.u-entity-type-label  { font-size: 0.75em; text-transform: uppercase; font-weight: 600; white-space: nowrap; color: #94a3b8; }
.u-entity-type-label[data-entity-type="face"]           { color: #3498db; }
.u-entity-type-label[data-entity-type="PERSON"]         { color: #e74c3c; }
.u-entity-type-label[data-entity-type="DATE_TIME"]      { color: #f59e0b; }
.u-entity-type-label[data-entity-type="PHONE_NUMBER"]   { color: #8b5cf6; }
.u-entity-type-label[data-entity-type="EMAIL_ADDRESS"]  { color: #ec4899; }
.u-entity-type-label[data-entity-type="MEDICAL_RECORD"] { color: #ef4444; }
.u-entity-type-label[data-entity-type="US_SSN"]         { color: #ef4444; }
.u-entity-type-label[data-entity-type="DATE_OF_BIRTH"]  { color: #f59e0b; }
.u-entity-text        { color: #e2e8f0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.u-entity-count       { color: #8b9bb5; white-space: nowrap; }
.u-cursor-help        { cursor: help; }
.u-entity-actions     { display: flex; gap: 4px; flex-shrink: 0; }
.u-btn-entity-confirm { background: #059669; color: #fff; border: none; padding: 2px 8px; border-radius: 4px; cursor: pointer; font-size: 0.85em; }
.u-btn-entity-reject  { background: #dc2626; color: #fff; border: none; padding: 2px 8px; border-radius: 4px; cursor: pointer; font-size: 0.85em; }
.u-btn-entity-seek    { background: #374151; color: #cbd5e1; border: none; padding: 2px 8px; border-radius: 4px; cursor: pointer; font-size: 0.85em; }

/* Processing/workbench */
.u-processing-pct       { font-size: 0.7em; color: #f59e0b; font-weight: 700; margin-left: 6px; }
.u-progress-fill-amber  { background: #f59e0b; }
.u-workbench-processing { opacity: 0.8; cursor: wait; }
.u-badge-red-fw         { background: #dc2626; color: #fff; padding: 4px 10px; border-radius: 8px; font-size: 0.8em; font-weight: 700; }

/* Editor buttons */
.u-btn-orange      { background: #e67e22; color: #fff; }
.u-btn-red-left    { background: #dc2626; color: #fff; margin-right: auto; }
.u-btn-indigo      { background: #6366f1; color: #fff; }
.u-btn-purple-dark { background: #8e44ad; color: #fff; }
.u-readonly-label  { font-size: 0.7em; color: #f39c12; }
.u-chart-bar        { width: 100%; max-width: 40px; background: linear-gradient(to top, #3b82f6, #60a5fa); border-radius: 4px 4px 0 0; }

/* ---- Billing badge base ---- */
.u-billing-pill     { padding: 4px 14px; border-radius: 20px; font-size: 0.85em; font-weight: 600; }
.u-billing-growth   { background: #059669; color: white; }
.u-billing-standard { background: #2563eb; color: white; }
.u-billing-free     { background: #374151; color: #9ca3af; }
.u-billing-active   { background: rgba(16, 185, 129, 0.2); color: #10b981; }
.u-billing-past-due { background: rgba(245, 158, 11, 0.2); color: #f59e0b; }
.u-billing-inactive { background: rgba(107, 114, 128, 0.2); color: #9ca3af; }