/* ============================================================
 * Dikembangkan oleh Institut Teknologi Del
 * ============================================================
 * Utilitas CSS hasil ekstraksi style inline dari Blade.
 * Dibuat otomatis oleh scripts/extract_inline_styles.php
 *
 * Dikembangkan oleh Institut Teknologi Del
 * ============================================================ */

/* u-label — font-weight:600;display:block;margin-bottom:0.5rem;font-size:0.9rem */
.u-label { font-weight:600;display:block;margin-bottom:0.5rem;font-size:0.9rem }

/* u-label-slate — label styling with slate color */
.u-label-slate { font-weight:600;display:block;margin-bottom:0.5rem;font-size:0.9rem;color:#334155 }

/* u-flex-1 — flex:1 */
.u-flex-1 { flex:1 }

/* u-hint — color:var(--text-muted);display:block;margin-top:0.4rem;font-size:0.8rem */
.u-hint { color:var(--text-muted);display:block;margin-top:0.4rem;font-size:0.8rem }

/* u-hidden — display:none */
.u-hidden { display:none }

/* u-icon-badge — width:48px;height:48px;background:rgba(255,255,255,0.2);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0 */
.u-icon-badge { width:48px;height:48px;background:rgba(255,255,255,0.2);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0 }

/* u-mb-6 — margin-bottom:1.5rem */
.u-mb-6 { margin-bottom:1.5rem }

/* u-flex-1-min — flex:1;min-width:0 */
.u-flex-1-min { flex:1;min-width:0 }

/* u-flex-start-gap-4 — display:flex;align-items:flex-start;gap:1rem */
.u-flex-start-gap-4 { display:flex;align-items:flex-start;gap:1rem }

/* u-subtitle — font-size:0.85rem;opacity:0.9;margin:0 0 0.25rem 0 */
.u-subtitle { font-size:0.85rem;opacity:0.9;margin:0 0 0.25rem 0 }

/* u-h1-hero — font-size:1.85rem;font-weight:800;margin:0;line-height:1.1 */
.u-h1-hero { font-size:1.85rem;font-weight:800;margin:0;line-height:1.1 }

/* u-text-danger — color: #ef4444; */
.u-text-danger { color: #ef4444; }

/* u-muted — color:var(--text-muted);margin:0;font-size:0.9rem */
.u-muted { color:var(--text-muted);margin:0;font-size:0.9rem }

/* u-relative — position:relative */
.u-relative { position:relative }

/* u-label-simple — font-weight:600;display:block;margin-bottom:0.5rem */
.u-label-simple { font-weight:600;display:block;margin-bottom:0.5rem }

/* u-mb-8 — margin-bottom:2rem */
.u-mb-8 { margin-bottom:2rem }

/* u-flex-center-gap-2 — display:flex;align-items:center;gap:0.5rem */
.u-flex-center-gap-2 { display:flex;align-items:center;gap:0.5rem }



/* u-grid-2 — display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:1.5rem */
.u-grid-2 { display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:1.5rem }



/* u-inline-flex-center-gap-2 — display:inline-flex;align-items:center;gap:0.5rem */
.u-inline-flex-center-gap-2 { display:inline-flex;align-items:center;gap:0.5rem }

/* u-a1 — display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; background: white; color: #475569; border: 1px solid #e2e8f0; border-radius: 0.375rem; font-size: 0.875rem; text-decoration: none; transition: all 0.2s; */
.u-a1 { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; background: white; color: #475569; border: 1px solid #e2e8f0; border-radius: 0.375rem; font-size: 0.875rem; text-decoration: none; transition: all 0.2s; }

/* u-header-row — display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;gap:1rem;flex-wrap:wrap */
.u-header-row { display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;gap:1rem;flex-wrap:wrap }

/* u-page-title — font-size:1.5rem;font-weight:800;color:var(--text-dark);margin:0 0 0.25rem 0 */
.u-page-title { font-size:1.5rem;font-weight:800;color:var(--text-dark);margin:0 0 0.25rem 0 }

/* u-field-note — display: block; font-size: 0.8rem; font-weight: 500; color: #475569; margin-bottom: 0.375rem; */
.u-field-note { display: block; font-size: 0.8rem; font-weight: 500; color: #475569; margin-bottom: 0.375rem; }

/* u-icon-sm — width:14px;height:14px */
.u-icon-sm { width:14px;height:14px }

/* u-error-msg — color: #dc2626; font-size: 0.875rem; */
.u-error-msg { color: #dc2626; font-size: 0.875rem; }

/* u-text-danger-soft — font-size: 0.8rem; color: #991b1b; font-weight: 500; */
.u-text-danger-soft { font-size: 0.8rem; color: #991b1b; font-weight: 500; }

/* u-text-muted-sm — font-size:0.85rem;color:var(--text-muted) */
.u-text-muted-sm { font-size:0.85rem;color:var(--text-muted) }

/* u-mb-4 — margin-bottom:1rem */
.u-mb-4 { margin-bottom:1rem }



/* u-page-title-tight — font-size:1.5rem;font-weight:800;color:var(--text-dark);margin:0 0 0.25rem 0;letter-spacing:-0.5px */
.u-page-title-tight { font-size:1.5rem;font-weight:800;color:var(--text-dark);margin:0 0 0.25rem 0;letter-spacing:-0.5px }



/* u-inline-alert-danger — display: flex; align-items: center; gap: 0.375rem; margin-top: 0.375rem; padding: 0.5rem 0.75rem; background: #fef2f2; border: 1px solid #fecaca; border-radius: 0.375rem; */
.u-inline-alert-danger { display: flex; align-items: center; gap: 0.375rem; margin-top: 0.375rem; padding: 0.5rem 0.75rem; background: #fef2f2; border: 1px solid #fecaca; border-radius: 0.375rem; }

/* u-check-svg — opacity:0;transform:scale(0.5);transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1) */
.u-check-svg { opacity:0;transform:scale(0.5);transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1) }

/* u-hint-sm — color:var(--text-muted);display:block;margin-top:0.5rem;font-size:0.85rem */
.u-hint-sm { color:var(--text-muted);display:block;margin-top:0.5rem;font-size:0.85rem }

/* u-text-muted-xs — font-size:0.75rem;color:var(--text-muted) */
.u-text-muted-xs { font-size:0.75rem;color:var(--text-muted) }

/* u-form-actions — display:flex;gap:0.75rem;justify-content:flex-end;padding-top:1rem;border-top:1px solid rgba(0,0,0,0.04) */
.u-form-actions { display:flex;gap:0.75rem;justify-content:flex-end;padding-top:1rem;border-top:1px solid rgba(0,0,0,0.04) }

/* u-muted-plain — color:var(--text-muted) */
.u-muted-plain { color:var(--text-muted) }



/* u-deco-circle-tr — position: absolute; top: -20px; right: -20px; width: 120px; height: 120px; background: rgba(255,255,255,0.1); border-radius: 50%; backdrop-filter: blur(10px); */
.u-deco-circle-tr { position: absolute; top: -20px; right: -20px; width: 120px; height: 120px; background: rgba(255,255,255,0.1); border-radius: 50%; backdrop-filter: blur(10px); }

/* u-deco-circle-bl — position: absolute; bottom: -30px; left: -30px; width: 150px; height: 150px; background: rgba(255,255,255,0.05); border-radius: 50%; */
.u-deco-circle-bl { position: absolute; bottom: -30px; left: -30px; width: 150px; height: 150px; background: rgba(255,255,255,0.05); border-radius: 50%; }

/* u-error-text — font-size: 0.75rem; color: #ef4444; margin-top: 0.25rem; */
.u-error-text { font-size: 0.75rem; color: #ef4444; margin-top: 0.25rem; }

/* u-a2 — margin-top:1rem;display:none */
.u-a2 { margin-top:1rem;display:none }

/* u-a3 — font-size:0.85rem;color:var(--text-muted);white-space:nowrap;font-weight:500 */
.u-a3 { font-size:0.85rem;color:var(--text-muted);white-space:nowrap;font-weight:500 }

/* u-text-muted-xs2 — font-size:0.8rem;color:var(--text-muted) */
.u-text-muted-xs2 { font-size:0.8rem;color:var(--text-muted) }

/* u-hint-tight — color:var(--text-muted);display:block;margin-top:0.25rem */
.u-hint-tight { color:var(--text-muted);display:block;margin-top:0.25rem }

/* u-p-6 — padding: 1.5rem; */
.u-p-6 { padding: 1.5rem; }

/* u-cover — width:100%;height:100%;object-fit:cover; */
.u-cover { width:100%;height:100%;object-fit:cover; }

/* u-flex-center-gap-4-rel — display: flex; align-items: center; gap: 1rem; position: relative; z-index: 1; */
.u-flex-center-gap-4-rel { display: flex; align-items: center; gap: 1rem; position: relative; z-index: 1; }

/* u-text-sm-muted-2 — font-size: 0.875rem; color: #64748b; */
.u-text-sm-muted-2 { font-size: 0.875rem; color: #64748b; }

/* u-a4 — display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-bottom:2rem */
.u-a4 { display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-bottom:2rem }

/* u-select-chevron — position:absolute;right:0.75rem;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none */
.u-select-chevron { position:absolute;right:0.75rem;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none }

/* u-flex-center-gap-3 — display:flex;align-items:center;gap:0.75rem */
.u-flex-center-gap-3 { display:flex;align-items:center;gap:0.75rem }

/* u-a5 — display:flex;align-items:center;gap:0.5rem;padding:0.65rem 1rem;background:#f8fafc;border:1px solid rgba(0,0,0,0.06);border-radius:8px;cursor:pointer;transition:all 0.2s */
.u-a5 { display:flex;align-items:center;gap:0.5rem;padding:0.65rem 1rem;background:#f8fafc;border:1px solid rgba(0,0,0,0.06);border-radius:8px;cursor:pointer;transition:all 0.2s }

/* u-icon-btn-sm — width:18px;height:18px;cursor:pointer */
.u-icon-btn-sm { width:18px;height:18px;cursor:pointer }

/* u-inline-flex-gap-2-semibold — display:inline-flex;align-items:center;gap:0.4rem;font-weight:500;font-size:0.9rem */
.u-inline-flex-gap-2-semibold { display:inline-flex;align-items:center;gap:0.4rem;font-weight:500;font-size:0.9rem }

/* u-a6 — width: 100%; padding: 0.75rem 1rem; border: 1px solid #e2e8f0; border-radius: 0.5rem; font-size: 0.875rem; transition: all 0.2s; box-sizing: border-box; */
.u-a6 { width: 100%; padding: 0.75rem 1rem; border: 1px solid #e2e8f0; border-radius: 0.5rem; font-size: 0.875rem; transition: all 0.2s; box-sizing: border-box; }

/* u-inline-flex-gap-2-nowrap — display:inline-flex;align-items:center;gap:0.5rem;white-space:nowrap;flex-shrink:0 */
.u-inline-flex-gap-2-nowrap { display:inline-flex;align-items:center;gap:0.5rem;white-space:nowrap;flex-shrink:0 }

/* u-badge-soft — background:rgba(0,0,0,0.05);color:var(--text-muted);padding:2px 8px;border-radius:12px;font-size:0.75rem */
.u-badge-soft { background:rgba(0,0,0,0.05);color:var(--text-muted);padding:2px 8px;border-radius:12px;font-size:0.75rem }

/* u-header-row-wrap — display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap */
.u-header-row-wrap { display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap }

/* u-flex-1-min-200 — flex:1;min-width:200px */
.u-flex-1-min-200 { flex:1;min-width:200px }

/* u-position-left — position:absolute;left:0.75rem;top:50%;transform:translateY(-50%);color:var(--text-muted) */
.u-position-left { position:absolute;left:0.75rem;top:50%;transform:translateY(-50%);color:var(--text-muted) }

/* u-input-icon-left — padding:0.5rem 0.75rem 0.5rem 2.5rem;border:1px solid rgba(0,0,0,0.06);border-radius:8px;font-size:0.9rem;width:100%;transition:all 0.2s */
.u-input-icon-left { padding:0.5rem 0.75rem 0.5rem 2.5rem;border:1px solid rgba(0,0,0,0.06);border-radius:8px;font-size:0.9rem;width:100%;transition:all 0.2s }

/* u-position-right — position:absolute;right:0.75rem;top:50%;transform:translateY(-50%);color:var(--text-muted);text-decoration:none */
.u-position-right { position:absolute;right:0.75rem;top:50%;transform:translateY(-50%);color:var(--text-muted);text-decoration:none }

/* u-flex-center-gap-2-shrink — display:flex;align-items:center;gap:0.5rem;flex-shrink:0 */
.u-flex-center-gap-2-shrink { display:flex;align-items:center;gap:0.5rem;flex-shrink:0 }

/* u-eyebrow — font-size:0.75rem;font-weight:600;color:var(--text-muted);margin:0 0 0.5rem 0;text-transform:uppercase;letter-spacing:0.5px */
.u-eyebrow { font-size:0.75rem;font-weight:600;color:var(--text-muted);margin:0 0 0.5rem 0;text-transform:uppercase;letter-spacing:0.5px }

/* u-text-muted-lead — font-size: 0.95rem; color: #64748b; margin: 0; line-height: 1.6; */
.u-text-muted-lead { font-size: 0.95rem; color: #64748b; margin: 0; line-height: 1.6; }

/* u-icon-badge-lg — width: 4.5rem; height: 4.5rem; background: rgba(255,255,255,0.25); border-radius: 1rem; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); */
.u-icon-badge-lg { width: 4.5rem; height: 4.5rem; background: rgba(255,255,255,0.25); border-radius: 1rem; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }

/* u-a7 — font-size: 0.9rem; opacity: 0.95; margin: 0 0 0.5rem 0; font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; */
.u-a7 { font-size: 0.9rem; opacity: 0.95; margin: 0 0 0.5rem 0; font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; }

/* u-a8 — font-size: 3rem; font-weight: 800; margin: 0; line-height: 1; letter-spacing: -0.05em; */
.u-a8 { font-size: 3rem; font-weight: 800; margin: 0; line-height: 1; letter-spacing: -0.05em; }



/* u-text-sm-muted — font-size: 0.85rem; color: #64748b; */
.u-text-sm-muted { font-size: 0.85rem; color: #64748b; }

/* u-delete-btn — background:#f8fafc;color:#ef4444;padding:0.6rem;min-width:40px;border-radius:8px */
.u-delete-btn { background:#f8fafc;color:#ef4444;padding:0.6rem;min-width:40px;border-radius:8px }

/* u-a9 — display:flex;align-items:center;gap:0.75rem;cursor:pointer;padding:0.75rem 1rem;background:#f8fafc;border-radius:10px;transition:all 0.2s;width:fit-content */
.u-a9 { display:flex;align-items:center;gap:0.75rem;cursor:pointer;padding:0.75rem 1rem;background:#f8fafc;border-radius:10px;transition:all 0.2s;width:fit-content }

/* u-a10 — width:22px;height:22px;border:2px solid #cbd5e1;border-radius:6px;background:#fff;transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);display:flex;align-items:center;justify-content:center;flex-shrink:0 */
.u-a10 { width:22px;height:22px;border:2px solid #cbd5e1;border-radius:6px;background:#fff;transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);display:flex;align-items:center;justify-content:center;flex-shrink:0 }

/* u-check-label — font-weight:600;color:#334155;font-size:0.9rem;user-select:none */
.u-check-label { font-weight:600;color:#334155;font-size:0.9rem;user-select:none }

/* u-check-svg-fast — opacity:0;transform:scale(0.5);transition:all 0.25s */
.u-check-svg-fast { opacity:0;transform:scale(0.5);transition:all 0.25s }

/* u-check-label-block — font-weight:600;color:#334155;font-size:0.9rem;display:block */
.u-check-label-block { font-weight:600;color:#334155;font-size:0.9rem;display:block }

/* u-alert-danger-box — margin-top:1.5rem;padding:1rem;background:#fef2f2;border-radius:10px;color:#991b1b */
.u-alert-danger-box { margin-top:1.5rem;padding:1rem;background:#fef2f2;border-radius:10px;color:#991b1b }

/* u-label-simple — display:block;margin-bottom:0.5rem;font-weight:600 */
.u-label-simple { display:block;margin-bottom:0.5rem;font-weight:600 }

/* u-list-indent — padding-left:1.25rem;margin:0;font-size:0.9rem */
.u-list-indent { padding-left:1.25rem;margin:0;font-size:0.9rem }

/* u-mb-1 — margin-bottom:0.25rem */
.u-mb-1 { margin-bottom:0.25rem }

/* u-badge-blue — background:linear-gradient(135deg,#3182ce,#2b6cb0);color:#fff */
.u-badge-blue { background:linear-gradient(135deg,#3182ce,#2b6cb0);color:#fff }

/* u-tabs-row — display:flex;align-items:flex-end;gap:0.25rem;border-bottom:1px solid rgba(0,0,0,0.06);padding-bottom:0.5rem;overflow-x:auto */
.u-tabs-row { display:flex;align-items:flex-end;gap:0.25rem;border-bottom:1px solid rgba(0,0,0,0.06);padding-bottom:0.5rem;overflow-x:auto }

/* u-a11 — padding:0;overflow:hidden;border:1px solid rgba(0,0,0,0.06);border-radius:12px */
.u-a11 { padding:0;overflow:hidden;border:1px solid rgba(0,0,0,0.06);border-radius:12px }

/* u-eyebrow-xs — font-size:0.7rem;color:var(--text-muted);text-transform:uppercase;margin-bottom:0.25rem */
.u-eyebrow-xs { font-size:0.7rem;color:var(--text-muted);text-transform:uppercase;margin-bottom:0.25rem }

/* u-badge-green — display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;font-size:0.75rem;font-weight:600;background:rgba(34,197,94,0.1);color:#166534 */
.u-badge-green { display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;font-size:0.75rem;font-weight:600;background:rgba(34,197,94,0.1);color:#166534 }

/* u-a12 — display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;gap:1rem;flex-wrap:wrap */
.u-a12 { display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;gap:1rem;flex-wrap:wrap }

/* u-select-mini — padding:0.5rem 2.5rem 0.5rem 0.75rem;border:1px solid rgba(0,0,0,0.06);border-radius:8px;font-size:0.9rem;min-width:80px;transition:all 0.2s;cursor:pointer;background:white;appearance:none;-webkit-appearance:none;-moz-appearance:none */
.u-select-mini { padding:0.5rem 2.5rem 0.5rem 0.75rem;border:1px solid rgba(0,0,0,0.06);border-radius:8px;font-size:0.9rem;min-width:80px;transition:all 0.2s;cursor:pointer;background:white;appearance:none;-webkit-appearance:none;-moz-appearance:none }

/* u-caption — font-size:0.75rem;opacity:0.7;margin:0.25rem 0 0 0 */
.u-caption { font-size:0.75rem;opacity:0.7;margin:0.25rem 0 0 0 }



/* u-ellipsis-title — font-weight:600;color:var(--text-dark);font-size:0.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis */
.u-ellipsis-title { font-weight:600;color:var(--text-dark);font-size:0.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis }

/* u-input-block — width:100%;padding:0.75rem;border:1px solid #e2e8f0;border-radius:8px;background:#fff;font-size:0.9rem;transition:border-color 0.2s */
.u-input-block { width:100%;padding:0.75rem;border:1px solid #e2e8f0;border-radius:8px;background:#fff;font-size:0.9rem;transition:border-color 0.2s }

/* u-hint-line — color:var(--text-muted);display:block;margin-top:0.4rem;font-size:0.8rem;line-height:1.5 */
.u-hint-line { color:var(--text-muted);display:block;margin-top:0.4rem;font-size:0.8rem;line-height:1.5 }

/* u-a13 — background:#f8fafc;color:#475569;white-space:nowrap;padding:0.65rem 1rem;border-radius:8px;border:none;cursor:pointer;font-weight:600;font-size:0.85rem;transition:all 0.2s */
.u-a13 { background:#f8fafc;color:#475569;white-space:nowrap;padding:0.65rem 1rem;border-radius:8px;border:none;cursor:pointer;font-weight:600;font-size:0.85rem;transition:all 0.2s }

/* u-grid-2-plain — display:grid;grid-template-columns:1fr 1fr;gap:1.5rem */
.u-grid-2-plain { display:grid;grid-template-columns:1fr 1fr;gap:1.5rem }

/* u-px-6 — padding: 0 1.5rem; */
.u-px-6 { padding: 0 1.5rem; }

/* u-a14 — display: inline-flex; align-items: center; gap: 0.25rem; */
.u-a14 { display: inline-flex; align-items: center; gap: 0.25rem; }

/* u-a15 — display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; background: #f1f5f9; color: #94a3b8; border-radius: 0.375rem; font-size: 0.875rem; cursor: not-allowed; */
.u-a15 { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; background: #f1f5f9; color: #94a3b8; border-radius: 0.375rem; font-size: 0.875rem; cursor: not-allowed; }

/* u-a16 — display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; color: #94a3b8; font-size: 0.875rem; */
.u-a16 { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; color: #94a3b8; font-size: 0.875rem; }

/* u-text-2xl — font-size: 2rem; */
.u-text-2xl { font-size: 2rem; }

/* u-label-gray — display: block; font-size: 0.875rem; font-weight: 600; color: #374151; margin-bottom: 0.5rem; */
.u-label-gray { display: block; font-size: 0.875rem; font-weight: 600; color: #374151; margin-bottom: 0.5rem; }



/* u-a17 — display:block;font-size:0.8rem;color:var(--text-muted);margin-top:0.4rem */
.u-a17 { display:block;font-size:0.8rem;color:var(--text-muted);margin-top:0.4rem }

/* u-badge-green-solid — background:linear-gradient(135deg,#38a169,#2f855a);color:#fff */
.u-badge-green-solid { background:linear-gradient(135deg,#38a169,#2f855a);color:#fff }

/* u-a18 — width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:#94a3b8;border-radius:6px;transition:all 0.2s;cursor:pointer */
.u-a18 { width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:#94a3b8;border-radius:6px;transition:all 0.2s;cursor:pointer }

/* u-box-soft — padding:0.75rem;background:#f8fafc;border-radius:8px */
.u-box-soft { padding:0.75rem;background:#f8fafc;border-radius:8px }

/* u-a19 — margin-left:0.5rem;font-weight:600 */
.u-a19 { margin-left:0.5rem;font-weight:600 }

/* u-flex-center-gap-4 — display:flex;align-items:center;gap:1rem */
.u-flex-center-gap-4 { display:flex;align-items:center;gap:1rem }

/* u-th — padding:0.875rem 1rem;text-align:left;color:var(--text-muted);font-weight:600;font-size:0.75rem;text-transform:uppercase;letter-spacing:0.5px;border-bottom:2px solid rgba(0,0,0,0.08) */
.u-th { padding:0.875rem 1rem;text-align:left;color:var(--text-muted);font-weight:600;font-size:0.75rem;text-transform:uppercase;letter-spacing:0.5px;border-bottom:2px solid rgba(0,0,0,0.08) }

/* u-header-row-plain — display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap */
.u-header-row-plain { display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem }

/* u-error-block — color:#ef4444;display:block;margin-top:0.3rem;font-size:0.8rem */
.u-error-block { color:#ef4444;display:block;margin-top:0.3rem;font-size:0.8rem }

/* u-label-dark — display:block;font-weight:600;margin-bottom:0.5rem;color:var(--text-dark) */
.u-label-dark { display:block;font-weight:600;margin-bottom:0.5rem;color:var(--text-dark) }

/* u-box-padded — padding:1.5rem;margin-bottom:1.5rem */
.u-box-padded { padding:1.5rem;margin-bottom:1.5rem }

/* u-icon-badge-square — width:40px;height:40px;background:rgba(255,255,255,0.2);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0 */
.u-icon-badge-square { width:40px;height:40px;background:rgba(255,255,255,0.2);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0 }

/* u-a20 — font-weight:600;margin-bottom:0.25rem */
.u-a20 { font-weight:600;margin-bottom:0.25rem }

/* u-a21 — font-size:0.85rem;opacity:0.9 */
.u-a21 { font-size:0.85rem;opacity:0.9 }

/* u-a22 — font-weight:600;color:var(--text-dark);margin:0 */
.u-a22 { font-weight:600;color:var(--text-dark);margin:0 }

/* u-grid-gap-6 — display:grid;gap:1.5rem */
.u-grid-gap-6 { display:grid;gap:1.5rem }

/* u-a23 — font-size:0.875rem;color:var(--text-dark);margin:0 */
.u-a23 { font-size:0.875rem;color:var(--text-dark);margin:0 }

/* u-shrink-0 — flex-shrink: 0; */
.u-shrink-0 { flex-shrink: 0; }

/* u-h2-slate — font-size: 1.75rem; font-weight: 700; color: #1e293b; margin: 0 0 0.5rem 0; letter-spacing: -0.025em; */
.u-h2-slate { font-size: 1.75rem; font-weight: 700; color: #1e293b; margin: 0 0 0.5rem 0; letter-spacing: -0.025em; }

/* u-th-plain — padding: 1rem; text-align: left; font-size: 0.8rem; font-weight: 600; text-transform: uppercase; cursor: pointer; white-space: nowrap; */
.u-th-plain { padding: 1rem; text-align: left; font-size: 0.8rem; font-weight: 600; text-transform: uppercase; cursor: pointer; white-space: nowrap; }

/* u-section-title-dark — display: block; font-size: 0.9rem; font-weight: 700; color: #0f172a; margin-bottom: 0.75rem; */
.u-section-title-dark { display: block; font-size: 0.9rem; font-weight: 700; color: #0f172a; margin-bottom: 0.75rem; }

/* u-mb-5 — margin-bottom: 1.25rem; */
.u-mb-5 { margin-bottom: 1.25rem; }

/* u-a24 — width: 100%; padding: 0.625rem 0.875rem; border: 1px solid #e2e8f0; border-radius: 0.5rem; font-size: 0.875rem; transition: all 0.2s; */
.u-a24 { width: 100%; padding: 0.625rem 0.875rem; border: 1px solid #e2e8f0; border-radius: 0.5rem; font-size: 0.875rem; transition: all 0.2s; }

/* u-cover-round — width: 100%; height: 100%; object-fit: cover; border-radius: 50%; */
.u-cover-round { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }

/* u-a25 — color: #14b8a6; */
.u-a25 { color: #14b8a6; }

/* u-row-divider — display: flex; justify-content: space-between; padding-bottom: 0.75rem; border-bottom: 1px solid #f1f5f9; */
.u-row-divider { display: flex; justify-content: space-between; padding-bottom: 0.75rem; border-bottom: 1px solid #f1f5f9; }

/* u-a26 — display:flex;gap:0.75rem;margin-bottom:0.75rem */
.u-a26 { display:flex;gap:0.75rem;margin-bottom:0.75rem }

/* u-a27 — display:flex;align-items:center;gap:0.75rem;cursor:pointer;padding:0.75rem 1rem;background:#f8fafc;border-radius:10px;transition:all 0.2s;border:2px solid transparent */
.u-a27 { display:flex;align-items:center;gap:0.75rem;cursor:pointer;padding:0.75rem 1rem;background:#f8fafc;border-radius:10px;transition:all 0.2s;border:2px solid transparent }

/* u-a28 — width:22px;height:22px;border:2px solid #cbd5e1;border-radius:6px;background:#fff;transition:all 0.25s;display:flex;align-items:center;justify-content:center;flex-shrink:0 */
.u-a28 { width:22px;height:22px;border:2px solid #cbd5e1;border-radius:6px;background:#fff;transition:all 0.25s;display:flex;align-items:center;justify-content:center;flex-shrink:0 }

/* u-a29 — background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff */
.u-a29 { background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff }

/* u-a30 — font-weight:600;color:var(--text-dark) */
.u-a30 { font-weight:600;color:var(--text-dark) }

/* u-a31 — color:var(--text-muted);font-size:0.85rem */
.u-a31 { color:var(--text-muted);font-size:0.85rem }

/* u-a32 — font-weight:600;color:var(--text-dark);font-size:0.9rem */
.u-a32 { font-weight:600;color:var(--text-dark);font-size:0.9rem }

/* u-a33 — position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none;z-index:10 */
.u-a33 { position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none;z-index:10 }

/* u-a34 — background:#fef2f2;padding:1rem;margin-bottom:1.5rem;border-radius:10px;color:#dc2626 */
.u-a34 { background:#fef2f2;padding:1rem;margin-bottom:1.5rem;border-radius:10px;color:#dc2626 }

/* u-grid-gap-3 — display:grid;gap:0.75rem */
.u-grid-gap-3 { display:grid;gap:0.75rem }

/* u-a35 — opacity:0.6;flex-shrink:0 */
.u-a35 { opacity:0.6;flex-shrink:0 }

/* u-a36 — display:block;font-size:0.75rem;font-weight:600;color:var(--text-muted);margin-bottom:0.5rem;text-transform:uppercase;letter-spacing:0.5px */
.u-a36 { display:block;font-size:0.75rem;font-weight:600;color:var(--text-muted);margin-bottom:0.5rem;text-transform:uppercase;letter-spacing:0.5px }

/* u-text-right — text-align:right */
.u-text-right { text-align:right }

/* u-eyebrow-tight — font-size:0.75rem;font-weight:600;color:var(--text-muted);margin:0 0 0.25rem 0;text-transform:uppercase;letter-spacing:0.5px */
.u-eyebrow-tight { font-size:0.75rem;font-weight:600;color:var(--text-muted);margin:0 0 0.25rem 0;text-transform:uppercase;letter-spacing:0.5px }

/* u-p-0 — padding:0 */
.u-p-0 { padding:0 }

/* u-code-chip — font-family:monospace;background:#f1f5f9;padding:2px 6px;border-radius:4px;font-size:0.85rem */
.u-code-chip { font-family:monospace;background:#f1f5f9;padding:2px 6px;border-radius:4px;font-size:0.85rem }

/* u-a37 — width:40px;height:40px;border-radius:8px;background:rgba(139,92,246,0.1);display:flex;align-items:center;justify-content:center;flex-shrink:0 */
.u-a37 { width:40px;height:40px;border-radius:8px;background:rgba(139,92,246,0.1);display:flex;align-items:center;justify-content:center;flex-shrink:0 }

/* u-a38 — background:#fef2f2;color:#ef4444;border:none;padding:0.4rem 0.75rem;border-radius:6px;cursor:pointer;font-size:0.8rem;display:inline-flex;align-items:center;gap:0.25rem */
.u-a38 { background:#fef2f2;color:#ef4444;border:none;padding:0.4rem 0.75rem;border-radius:6px;cursor:pointer;font-size:0.8rem;display:inline-flex;align-items:center;gap:0.25rem }

/* u-a39 — display:flex;gap:1rem;flex-wrap:wrap */
.u-a39 { display:flex;gap:1rem;flex-wrap:wrap }

/* u-mr-2 — margin-right: 0.5rem; */
.u-mr-2 { margin-right: 0.5rem; }

/* u-grid-2-gap-4 — display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; */
.u-grid-2-gap-4 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

/* u-a40 — font-weight: 600; display: block; margin-bottom: 0.5rem; font-size: 0.9rem; */
.u-a40 { font-weight: 600; display: block; margin-bottom: 0.5rem; font-size: 0.9rem; }

/* u-a41 — color: var(--text-muted); display: block; margin-top: 0.25rem; */
.u-a41 { color: var(--text-muted); display: block; margin-top: 0.25rem; }

/* u-a42 — width:20px;height:20px;border:2px solid #cbd5e1;border-radius:5px;background:#fff;transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);display:flex;align-items:center;justify-content:center;flex-shrink:0 */
.u-a42 { width:20px;height:20px;border:2px solid #cbd5e1;border-radius:5px;background:#fff;transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);display:flex;align-items:center;justify-content:center;flex-shrink:0 }

/* u-a43 — font-size:0.9rem;color:#334155;user-select:none */
.u-a43 { font-size:0.9rem;color:#334155;user-select:none }

/* u-row-divider-border — display:flex;justify-content:space-between;padding:0.75rem 0;border-bottom:1px solid var(--border) */
.u-row-divider-border { display:flex;justify-content:space-between;padding:0.75rem 0;border-bottom:1px solid var(--border) }

/* u-semibold — font-weight:600 */
.u-semibold { font-weight:600 }

/* u-list-indent-sm — margin: 0.25rem 0 0 0; padding-left: 1.25rem; */
.u-list-indent-sm { margin: 0.25rem 0 0 0; padding-left: 1.25rem; }

/* u-a44 — display:none; width:100%;height:100%; background:linear-gradient(135deg,#cbd5e1,#94a3b8); display:flex;align-items:center;justify-content:center;color:#fff; */
.u-a44 { display:none; width:100%;height:100%; background:linear-gradient(135deg,#cbd5e1,#94a3b8); display:flex;align-items:center;justify-content:center;color:#fff; }

/* u-a45 — background:linear-gradient(135deg,#234e52,#285e61);color:#fff;border:none; */
.u-a45 { background:linear-gradient(135deg,#234e52,#285e61);color:#fff;border:none; }

/* u-a46 — display:none; width:100%;height:100%; background:linear-gradient(135deg,#4a5568,#2d3748); display:flex;align-items:center;justify-content:center;color:#fff; */
.u-a46 { display:none; width:100%;height:100%; background:linear-gradient(135deg,#4a5568,#2d3748); display:flex;align-items:center;justify-content:center;color:#fff; }

/* u-a47 — color:#f6e05e; */
.u-a47 { color:#f6e05e; }

/* u-a48 — color:#fff; */
.u-a48 { color:#fff; }

/* u-mr-1 — margin-right: 0.35rem; */
.u-mr-1 { margin-right: 0.35rem; }

/* u-text-sm — font-size: 0.875rem; */
.u-text-sm { font-size: 0.875rem; }

/* u-a49 — width: 100%; padding: 0.75rem 2.5rem 0.75rem 1rem; border: 1px solid #e5e7eb; border-radius: 0.625rem; font-size: 0.9rem; background: white; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url('data:image/svg+xml;charset=UTF-8,%3csvg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 24 24\' fill=\'none\' stroke=\'%239ca3af\' stroke-width=\'2\' stroke-linecap=\'round\' stroke-linejoin=\'round\'%3e%3cpolyline points=\'6 9 12 15 18 9\'%3e%3c/polyline%3e%3c/svg%3e'); background-repeat: no-repeat; background-position: right 0.75rem center; background-size: 1rem; transition: all 0.2s; */
.u-a49 { width: 100%; padding: 0.75rem 2.5rem 0.75rem 1rem; border: 1px solid #e5e7eb; border-radius: 0.625rem; font-size: 0.9rem; background: white; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url('data:image/svg+xml;charset=UTF-8,%3csvg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 24 24\' fill=\'none\' stroke=\'%239ca3af\' stroke-width=\'2\' stroke-linecap=\'round\' stroke-linejoin=\'round\'%3e%3cpolyline points=\'6 9 12 15 18 9\'%3e%3c/polyline%3e%3c/svg%3e'); background-repeat: no-repeat; background-position: right 0.75rem center; background-size: 1rem; transition: all 0.2s; }

/* u-section-title-slate — font-size: 0.9rem; font-weight: 600; color: #334155; margin-bottom: 1rem; display: flex; align-items: center; gap: 0.5rem; */
.u-section-title-slate { font-size: 0.9rem; font-weight: 600; color: #334155; margin-bottom: 1rem; display: flex; align-items: center; gap: 0.5rem; }

/* u-text-danger-lg — color: #ef4444; font-size: 1.25rem; */
.u-text-danger-lg { color: #ef4444; font-size: 1.25rem; }

/* u-card-white — background: white; border-radius: 0.75rem; box-shadow: 0 2px 12px rgba(0,0,0,0.06); border: 1px solid #e2e8f0; overflow: hidden; */
.u-card-white { background: white; border-radius: 0.75rem; box-shadow: 0 2px 12px rgba(0,0,0,0.06); border: 1px solid #e2e8f0; overflow: hidden; }



/* u-text-sm-strong — font-size: 0.85rem; font-weight: 500; color: #0f172a; */
.u-text-sm-strong { font-size: 0.85rem; font-weight: 500; color: #0f172a; }

/* u-a50 — width: 100%; padding: 0.75rem 2.5rem 0.75rem 1rem; border: 1px solid #e2e8f0; border-radius: 0.5rem; font-size: 0.875rem; background: white; box-sizing: border-box; cursor: pointer; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.75rem center; background-size: 16px; */
.u-a50 { width: 100%; padding: 0.75rem 2.5rem 0.75rem 1rem; border: 1px solid #e2e8f0; border-radius: 0.5rem; font-size: 0.875rem; background: white; box-sizing: border-box; cursor: pointer; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.75rem center; background-size: 16px; }

/* u-a51 — width:80px;height:80px;border-radius:12px;object-fit:cover;background:#f8fafc */
.u-a51 { width:80px;height:80px;border-radius:12px;object-fit:cover;background:#f8fafc }

/* u-a52 — color:var(--primary) */
.u-a52 { color:var(--primary) }

/* u-a53 — margin-top:1rem;display:flex;align-items:center;gap:1rem */
.u-a53 { margin-top:1rem;display:flex;align-items:center;gap:1rem }

/* u-a54 — flex:1;height:40px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:#94a3b8;border-radius:8px;transition:all 0.2s;cursor:pointer;text-decoration:none */
.u-a54 { flex:1;height:40px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:#94a3b8;border-radius:8px;transition:all 0.2s;cursor:pointer;text-decoration:none }

/* u-a55 — width:64px;height:64px;background:#f8fafc;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem */
.u-a55 { width:64px;height:64px;background:#f8fafc;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem }

/* u-a56 — display:flex;align-items:center;gap:0.75rem;padding:0.75rem;background:#f8fafc;border-radius:8px */
.u-a56 { display:flex;align-items:center;gap:0.75rem;padding:0.75rem;background:#f8fafc;border-radius:8px }

/* u-a57 — display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:20px;font-size:0.75rem;font-weight:600;background:rgba(34,197,94,0.1);color:#166534 */
.u-a57 { display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:20px;font-size:0.75rem;font-weight:600;background:rgba(34,197,94,0.1);color:#166534 }

/* u-a58 — padding:0.5rem 0.9rem;background:#fff;color:var(--text-dark);border:1px solid #e2e8f0;border-radius:8px;text-decoration:none;font-size:0.875rem;font-weight:500;min-width:40px;display:inline-flex;align-items:center;justify-content:center;gap:0.25rem;transition:all 0.2s */
.u-a58 { padding:0.5rem 0.9rem;background:#fff;color:var(--text-dark);border:1px solid #e2e8f0;border-radius:8px;text-decoration:none;font-size:0.875rem;font-weight:500;min-width:40px;display:inline-flex;align-items:center;justify-content:center;gap:0.25rem;transition:all 0.2s }

/* u-a59 — padding-right:2.5rem */
.u-a59 { padding-right:2.5rem }

/* u-a60 — position:absolute;right:0.6rem;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#94a3b8;padding:0.25rem */
.u-a60 { position:absolute;right:0.6rem;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#94a3b8;padding:0.25rem }

/* u-a61 — display:flex;gap:0.75rem;justify-content:flex-end */
.u-a61 { display:flex;gap:0.75rem;justify-content:flex-end }

/* u-a62 — margin-bottom:1.25rem */
.u-a62 { margin-bottom:1.25rem }

/* u-a63 — width:100%;padding:0.75rem 1rem;border:2px solid #e2e8f0;border-radius:8px;font-size:0.95rem */
.u-a63 { width:100%;padding:0.75rem 1rem;border:2px solid #e2e8f0;border-radius:8px;font-size:0.95rem }

/* u-a64 — display:flex;gap:0.75rem */
.u-a64 { display:flex;gap:0.75rem }
/* u-flex-wrap — flex-wrap:wrap (dipakai bersama baris tombol agar tidak overflow di layar sempit) */
.u-flex-wrap { flex-wrap:wrap }

/* u-a65 — font-size:0.85rem;color:var(--text-muted);margin:0 0 0.25rem 0 */
.u-a65 { font-size:0.85rem;color:var(--text-muted);margin:0 0 0.25rem 0 }

/* u-a66 — display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem */
.u-a66 { display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem }

/* u-a67 — display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;font-size:0.75rem;font-weight:600;background:rgba(239,68,68,0.1);color:#dc2626 */
.u-a67 { display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;font-size:0.75rem;font-weight:600;background:rgba(239,68,68,0.1);color:#dc2626 }

/* u-a68 — display:flex;align-items:center;gap:0.75rem;margin-bottom:0.5rem */
.u-a68 { display:flex;align-items:center;gap:0.75rem;margin-bottom:0.5rem }

/* u-a69 — font-size:1.1rem;font-weight:700;color:var(--primary);margin:0 */
.u-a69 { font-size:1.1rem;font-weight:700;color:var(--primary);margin:0 }

/* u-a70 — color:var(--text-muted);font-size:0.9rem;margin:0 0 1rem 0 */
.u-a70 { color:var(--text-muted);font-size:0.9rem;margin:0 0 1rem 0 }

/* u-a71 — padding:1.5rem;border-radius:12px */
.u-a71 { padding:1.5rem;border-radius:12px }

/* u-a72 — width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:#94a3b8;border-radius:6px;border:none;cursor:pointer;transition:all 0.2s */
.u-a72 { width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:#94a3b8;border-radius:6px;border:none;cursor:pointer;transition:all 0.2s }

/* u-a73 — margin-top:1.5rem */
.u-a73 { margin-top:1.5rem }

/* u-a74 — font-weight:600;margin-bottom:0.75rem */
.u-a74 { font-weight:600;margin-bottom:0.75rem }

/* u-a75 — background: linear-gradient(135deg, var(--primary), var(--primary-light)); */
.u-a75 { background: linear-gradient(135deg, var(--primary), var(--primary-light)); }

/* u-icon-badge-md — width: 4rem; height: 4rem; background: rgba(255,255,255,0.25); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); */
.u-icon-badge-md { width: 4rem; height: 4rem; background: rgba(255,255,255,0.25); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }

/* u-text-1xl — font-size: 1.75rem; */
.u-text-1xl { font-size: 1.75rem; }

/* u-subtitle-sm — font-size: 0.875rem; opacity: 0.95; margin: 0 0 0.25rem 0; font-weight: 500; */
.u-subtitle-sm { font-size: 0.875rem; opacity: 0.95; margin: 0 0 0.25rem 0; font-weight: 500; }

/* u-a76 — font-size: 2.5rem; font-weight: 800; margin: 0; line-height: 1; letter-spacing: -0.05em; */
.u-a76 { font-size: 2.5rem; font-weight: 800; margin: 0; line-height: 1; letter-spacing: -0.05em; }

/* u-a77 — width: 100%; padding: 0.625rem 2.5rem 0.625rem 1rem; border: 1px solid #e2e8f0; border-radius: 0.5rem; font-size: 0.875rem; background: white; cursor: pointer; appearance: none; */
.u-a77 { width: 100%; padding: 0.625rem 2.5rem 0.625rem 1rem; border: 1px solid #e2e8f0; border-radius: 0.5rem; font-size: 0.875rem; background: white; cursor: pointer; appearance: none; }

/* u-select-chevron-right — position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); color: #94a3b8; pointer-events: none; font-size: 0.75rem; */
.u-select-chevron-right { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); color: #94a3b8; pointer-events: none; font-size: 0.75rem; }

/* u-a78 — background: white; border-radius: 0.75rem; box-shadow: 0 1px 3px rgba(0,0,0,0.1); border: 1px solid #e2e8f0; overflow: hidden; */
.u-a78 { background: white; border-radius: 0.75rem; box-shadow: 0 1px 3px rgba(0,0,0,0.1); border: 1px solid #e2e8f0; overflow: hidden; }

/* u-a79 — display: flex; gap: 0.35rem; align-items: center; */
.u-a79 { display: flex; gap: 0.35rem; align-items: center; }

/* u-text-xs-muted — font-size: 0.875rem; color: #94a3b8; */
.u-text-xs-muted { font-size: 0.875rem; color: #94a3b8; }

/* u-h3-slate — font-size: 1.25rem; font-weight: 700; color: #1e293b; margin: 0 0 0.5rem 0; */
.u-h3-slate { font-size: 1.25rem; font-weight: 700; color: #1e293b; margin: 0 0 0.5rem 0; }

/* u-a80 — color: #059669; */
.u-a80 { color: #059669; }

/* u-a81 — color: #d97706; */
.u-a81 { color: #d97706; }

/* u-a82 — font-size: 0.8rem; color: #64748b; font-weight: 600; */
.u-a82 { font-size: 0.8rem; color: #64748b; font-weight: 600; }

/* u-a83 — display: flex; justify-content: space-between; */
.u-a83 { display: flex; justify-content: space-between; }



/* u-a84 — color: #0891b2; margin-right: 0.5rem; */
.u-a84 { color: #0891b2; margin-right: 0.5rem; }



/* u-a85 — display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.75rem; */
.u-a85 { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.75rem; }

/* u-a86 — margin-bottom: 0.25rem; */
.u-a86 { margin-bottom: 0.25rem; }

/* u-text-xs-muted-flat2 — font-size: 0.75rem; color: #94a3b8; margin: 0; */
.u-text-xs-muted-flat2 { font-size: 0.75rem; color: #94a3b8; margin: 0; }

/* u-a87 — flex: 1; text-align: left; overflow: hidden; */
.u-a87 { flex: 1; text-align: left; overflow: hidden; }

/* u-a88 — margin-bottom: 12px; */
.u-a88 { margin-bottom: 12px; }

/* u-a89 — display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; */
.u-a89 { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }

/* u-icon-badge-sm — width: 3rem; height: 3rem; background: rgba(255, 255, 255, 0.25); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); */
.u-icon-badge-sm { width: 3rem; height: 3rem; background: rgba(255, 255, 255, 0.25); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }

/* u-a90 — font-size: 1.5rem; color: white; */
.u-a90 { font-size: 1.5rem; color: white; }

/* u-h3 — font-size: 1.25rem; font-weight: 700; margin: 0 0 0.25rem 0; */
.u-h3 { font-size: 1.25rem; font-weight: 700; margin: 0 0 0.25rem 0; }

/* u-subtitle-flat — font-size: 0.875rem; opacity: 0.95; margin: 0; */
.u-subtitle-flat { font-size: 0.875rem; opacity: 0.95; margin: 0; }

/* u-text-xs-muted-flat — font-size: 0.75rem; color: #64748b; margin: 0; */
.u-text-xs-muted-flat { font-size: 0.75rem; color: #64748b; margin: 0; }

/* u-section-title — font-size: 0.9rem; font-weight: 700; color: #0891b2; margin: 0 0 1rem 0; display: flex; align-items: center; gap: 0.5rem; */
.u-section-title { font-size: 0.9rem; font-weight: 700; color: #0891b2; margin: 0 0 1rem 0; display: flex; align-items: center; gap: 0.5rem; }

/* u-box-slate — background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.5rem; padding: 1rem; */
.u-box-slate { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.5rem; padding: 1rem; }

/* u-field-note-xs — display: block; font-size: 0.75rem; color: #64748b; margin-bottom: 0.35rem; font-weight: 600; */
.u-field-note-xs { display: block; font-size: 0.75rem; color: #64748b; margin-bottom: 0.35rem; font-weight: 600; }

/* u-a91 — width: 1.5rem; height: 1.5rem; background: #f5f3ff; border-radius: 50%; display: flex; align-items: center; justify-content: center; */
.u-a91 { width: 1.5rem; height: 1.5rem; background: #f5f3ff; border-radius: 50%; display: flex; align-items: center; justify-content: center; }

/* u-a92 — color: #7c3aed; font-size: 0.7rem; */
.u-a92 { color: #7c3aed; font-size: 0.7rem; }



















/* u-a115 — display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.2rem 0.5rem; background: #fee2e2; color: #991b1b; border-radius: 0.25rem; font-size: 0.7rem; font-weight: 600; (dipulihkan dari HEAD) */
.u-a115 { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.2rem 0.5rem; background: #fee2e2; color: #991b1b; border-radius: 0.25rem; font-size: 0.7rem; font-weight: 600; }

/* u-a110 — font-size: 0.95rem; color: #475569; margin: 0 0 0.5rem 0; font-weight: 600; (dipulihkan dari HEAD) */
.u-a110 { font-size: 0.95rem; color: #475569; margin: 0 0 0.5rem 0; font-weight: 600; }



/* u-a117 — text-align: center; padding: 4rem 2rem; (dipulihkan dari HEAD) */
.u-a117 { text-align: center; padding: 4rem 2rem; }

/* u-bg-slate-200 — background: #e2e8f0; */
.u-bg-slate-200 { background: #e2e8f0; }

/* u-card-footer — padding: 1.25rem 1.75rem; border-top: 1px solid #e5e7eb; background: #f9fafb; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; */
.u-card-footer { padding: 1.25rem 1.75rem; border-top: 1px solid #e5e7eb; background: #f9fafb; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }

/* u-dot-blue — width: 1.5rem; height: 1.5rem; background: #f0f9ff; border-radius: 50%; display: flex; align-items: center; justify-content: center; */
.u-dot-blue { width: 1.5rem; height: 1.5rem; background: #f0f9ff; border-radius: 50%; display: flex; align-items: center; justify-content: center; }

/* u-flex-center-gap-2-wrap — display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; */
.u-flex-center-gap-2-wrap { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }

/* u-m-0 — margin: 0; */
/* u-m-0 — margin: 0 */
.u-m-0 { margin: 0; }

/* ---------- Utilitas tambahan (Admin Panel Desa) ----------
   Kelas-kelas berikut dipakai view hasil porting namun belum
   pernah didefinisikan — dilengkapi agar spacing konsisten. */

/* u-mt-4 — margin-top: 1rem (dipakai 30+ tempat) */
.u-mt-4 { margin-top: 1rem }

/* u-mb-2 — margin-bottom: 0.5rem */
.u-mb-2 { margin-bottom: 0.5rem }

/* u-mb-0 — margin-bottom: 0 */
.u-mb-0 { margin-bottom: 0 }

/* u-flex-between — baris horizontal: ujung kiri & kanan */
.u-flex-between { display:flex; align-items:center; justify-content:space-between; gap:1rem }

/* u-flex-end-gap-2 — deret tombol rata kanan */
.u-flex-end-gap-2 { display:flex; align-items:center; justify-content:flex-end; gap:0.5rem }

/* stats-grid — grid kartu statistik responsif (3 → 2 → 1 kolom) */
.stats-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem }
@media (max-width: 1024px) { .stats-grid { grid-template-columns:repeat(2,1fr) } }
@media (max-width: 640px)  { .stats-grid { grid-template-columns:1fr } }

/* stat-card — kartu statistik dasar (varian warna via u-badge-*) */
.stat-card {
  background: var(--card-bg, #fff);
  border-radius: 16px;
  padding: 1.5rem;
  border: none;
  display: flex;
  align-items: center;
  gap: 1.25rem;
  position: relative;
  overflow: hidden;
}

/* Varian solid stat-card: teal & merah (dipakai hub Admin Panel Desa). */
.stat-card.u-badge-teal-solid { background: linear-gradient(135deg, #0d9488, #0f766e) !important; color: #fff; }
.stat-card.u-badge-red-solid  { background: linear-gradient(135deg, #dc2626, #b91c1c) !important; color: #fff; }
.stat-card.u-badge-teal-solid .u-subtitle,
.stat-card.u-badge-red-solid .u-subtitle { color: rgba(255,255,255,.85); }
.stat-card.u-badge-teal-solid .u-icon-badge,
.stat-card.u-badge-red-solid .u-icon-badge { background: rgba(255,255,255,.18); color: #fff; }
.dark-mode .stat-card.u-badge-teal-solid { background: linear-gradient(135deg, #0f766e, #115e59) !important; }
.dark-mode .stat-card.u-badge-red-solid  { background: linear-gradient(135deg, #b91c1c, #7f1d1d) !important; }

/* u-mb-3 — margin-bottom: 0.75rem; */
.u-mb-3 { margin-bottom: 0.75rem; }

/* u-p-4 — padding: 1rem; */
.u-p-4 { padding: 1rem; }

/* u-section-title-sm — font-size: 0.9rem; font-weight: 700; color: #0891b2; margin: 0 0 0.75rem 0; display: flex; align-items: center; gap: 0.5rem; */
.u-section-title-sm { font-size: 0.9rem; font-weight: 700; color: #0891b2; margin: 0 0 0.75rem 0; display: flex; align-items: center; gap: 0.5rem; }

/* u-text-sm-strong-right — font-size: 0.85rem; font-weight: 500; color: #0f172a; text-align: right; max-width: 60%; */
.u-text-sm-strong-right { font-size: 0.85rem; font-weight: 500; color: #0f172a; text-align: right; max-width: 60%; }

/* u-text-xs — font-size: 0.65rem; */
.u-text-xs { font-size: 0.65rem; }

/* u-text-xxs — font-size: 0.6rem; */
.u-text-xxs { font-size: 0.6rem; }

/* ============================================================
   DARK MODE — Utility overrides
   Menggunakan selector .dark-mode untuk mengubah warna hardcoded
   pada utility classes agar sesuai tema gelap.
   ============================================================ */
.dark-mode {
  /* --- Background resets --- */
  .u-a5, .u-a9, .u-a27, .u-a56, .u-box-soft {
    background: #1e293b;
  }
  .u-a5:hover, .u-a9:hover, .u-a27:hover {
    background: rgba(255,255,255,0.06);
  }
  .u-a10, .u-a28, .u-a42 {
    background: #1e293b;
    border-color: #475569;
  }

  /* --- Text colors --- */
  .u-a43, .u-check-label, .u-check-label-block {
    color: var(--text-dark);
  }
  .u-a30, .u-a32, .u-a22 {
    color: var(--text-dark);
  }
  .u-label-slate, .u-label-dark, .u-label, .u-label-gray, .u-label-simple {
    color: var(--text-dark);
  }
  .u-h3-slate, .u-h2-slate, .u-section-title-dark, .u-section-title-slate {
    color: var(--text-dark);
  }
  .u-ellipsis-title, .u-text-sm-strong {
    color: var(--text-dark);
  }

  /* --- Input backgrounds --- */
  .u-a6, .u-a24, .u-a49, .u-a50, .u-a63, .u-a77, .u-input-block {
    background: #1e293b;
    border-color: #334155;
    color: var(--text-dark);
  }
  .u-a6:focus, .u-a24:focus, .u-a49:focus, .u-a50:focus, .u-input-block:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(20,184,166,0.2);
  }

  /* --- Select --- */
  .u-select-mini {
    background-color: #1e293b;
    border-color: #334155;
    color: var(--text-dark);
  }
  .u-select-mini option {
    background: #1e293b;
    color: var(--text-dark);
  }

  /* --- Search input --- */
  .u-input-icon-left {
    background: #1e293b;
    border-color: #334155;
    color: var(--text-dark);
  }

  /* --- Alert boxes --- */
  .u-inline-alert-danger {
    background: rgba(239,68,68,0.1);
    border-color: rgba(239,68,68,0.2);
    color: #fca5a5;
  }
  .u-a34 {
    background: rgba(239,68,68,0.1);
    color: #fca5a5;
  }

  /* --- Badge variants --- */
  .u-badge-soft {
    background: rgba(255,255,255,0.08);
    color: var(--text-muted);
  }
  .u-badge-green {
    background: rgba(34,197,94,0.15);
    color: #4ade80;
  }
  .u-a67 {
    background: rgba(239,68,68,0.15);
    color: #f87171;
  }

  /* --- Card backgrounds --- */
  .u-card-white, .u-a78 {
    background: #1e293b;
    border-color: #334155;
  }

  /* --- Pagination --- */
  .u-a58 {
    background: #1e293b;
    border-color: #334155;
    color: var(--text-dark);
  }
  .u-a58:hover {
    background: #334155;
  }

  /* --- Field note colors --- */
  .u-field-note {
    color: var(--text-muted);
  }
  .u-text-sm-muted-2, .u-text-sm-muted {
    color: var(--text-muted);
  }
  .u-text-muted-lead {
    color: var(--text-muted);
  }
  .u-text-xs-muted {
    color: var(--text-muted);
  }

  /* --- Hardcoded #475569 → muted --- */
  .u-a43, .u-a45, .u-a54, .u-a72 {
    color: var(--text-muted);
  }

  /* --- Background #f8fafc → dark --- */
  .u-a15, .u-a38, .u-a72 {
    background: #334155;
  }

  /* --- White backgrounds → dark --- */
  .u-a1, .u-a10, .u-a28, .u-a42, .u-a49, .u-a50, .u-a63, .u-a77 {
    background: #1e293b;
    border-color: #334155;
    color: var(--text-dark);
  }

  /* --- Select option dark --- */
  select option {
    background: #1e293b;
    color: var(--text-dark);
  }

  /* --- File input --- */
  input[type="file"] {
    background: #1e293b;
    border-color: #334155;
    color: var(--text-dark);
  }

  /* --- Section titles --- */
  .u-section-title-dark, .u-section-title-slate {
    color: var(--text-dark);
  }

  /* --- Hardcoded #f8fafc backgrounds --- */
  .u-box-soft {
    background: #1e293b;
  }

  /* --- Form actions border --- */
  .u-form-actions {
    border-top-color: rgba(255,255,255,0.08);
  }

  /* --- Row dividers --- */
  .u-row-divider-border {
    border-bottom-color: rgba(255,255,255,0.08);
  }

  /* --- Code chips --- */
  .u-code-chip {
    background: #334155;
    color: var(--text-dark);
  }
}

/* Dikembangkan oleh Institut Teknologi Del */