/* ═══════════════════════════════════════════════════════════════
   table.css  –  Modern table & button system (2026 redesign)
   ═══════════════════════════════════════════════════════════════ */

/* ─── Table wrappers ─────────────────────────────────────────── */
.table_global,
.table_main {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
    width: 100%;
    border-collapse: collapse;
}

/* ─── Header rows ────────────────────────────────────────────── */
.tr_header {
    background: linear-gradient(90deg, #1e3a5f 0%, #0f4c75 100%);
    color: #e2e8f0;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: .04em;
    text-transform: uppercase;
    height: 44px;
}
.tr_header td, .tr_header th {
    padding: 10px 16px;
    border: none;
}

.tr_block_header_Add {
    height: 38px;
    background: linear-gradient(90deg, #0ea5e9 0%, #0284c7 100%);
    color: #ffffff;
    font-weight: 600;
}
.tr_block_header_Add td { padding: 8px 14px; border: none; }

.tr_block_header_edit {
    height: 38px;
    background: linear-gradient(90deg, #22c55e 0%, #16a34a 100%);
    color: #ffffff;
    font-weight: 600;
}
.tr_block_header_edit td { padding: 8px 14px; border: none; }

.tr_search {
    background: #eff6ff;
    height: 38px;
    border-bottom: 1px solid #bfdbfe;
}
.tr_search td { padding: 6px 14px; }

/* ─── Data rows ──────────────────────────────────────────────── */
.table_cell_tr {
    height: 38px;
    transition: background .15s;
    border-bottom: 1px solid #f1f5f9;
}
.table_cell_tr:hover { background: #f0f9ff; }

.table_cell_tr_enable {
    background: #ecfdf5;
    border-bottom: 1px solid #d1fae5;
}
.table_cell_tr_enable:hover { background: #d1fae5; }

.table_cell_tr_debug {
    background: #fefce8;
    border-bottom: 1px solid #fef08a;
}
.table_cell_tr_debug:hover { background: #fef08a; }

.table_cell_tr_disable {
    background: #fff1f2;
    border-bottom: 1px solid #fecdd3;
}
.table_cell_tr_disable:hover { background: #fecdd3; }

.table_cell_td {
    text-align: center;
    font-size: 13.5px;
    padding: 6px 12px;
    color: #334155;
}

/* ─── Label ──────────────────────────────────────────────────── */
.label_main {
    display: inline-flex;
    align-items: center;
    font-size: 16px;
    font-weight: 600;
    color: #0f172a;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 6px 18px;
    margin-bottom: 10px;
}

/* ─── Buttons (shared base) ──────────────────────────────────── */
.button_edit,
.Button_Blue,
.Button_Red,
.Button_Green,
.Button_Orange {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 12.5px;
    height: 30px;
    padding: 0 14px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    transition: filter .15s, transform .1s, box-shadow .15s;
    box-shadow: 0 1px 3px rgba(0,0,0,.12);
    white-space: nowrap;
    text-decoration: none;
}
.button_edit:hover,
.Button_Blue:hover,
.Button_Red:hover,
.Button_Green:hover,
.Button_Orange:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0,0,0,.15);
}
.button_edit:active,
.Button_Blue:active,
.Button_Red:active,
.Button_Green:active,
.Button_Orange:active {
    transform: translateY(0);
    filter: brightness(.96);
}

.button_edit   { background: #facc15; color: #1e293b; }
.Button_Blue   { background: #0ea5e9; color: #ffffff; }
.Button_Red    { background: #ef4444; color: #ffffff; }
.Button_Green  { background: #22c55e; color: #ffffff; }
.Button_Orange { background: #f97316; color: #ffffff; }

.buttonHolder { text-align: left; padding: 8px 0; }

/* ─── Active List layout ─────────────────────────────────────── */
.al-page-header {
    margin-bottom: 14px;
}

.dlp-header-main {
    width: calc(100vw - clamp(10px, 1.6vw, 24px));
    margin-left: calc(50% - 50vw + clamp(5px, 0.8vw, 12px));
    margin-right: calc(50% - 50vw + clamp(5px, 0.8vw, 12px));
    margin-bottom: 14px;
    padding: 0 clamp(12px, 2.2vw, 28px);
}
.al-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}
.al-title-row h1 {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.al-icon { color: #0ea5e9; font-size: 22px; }

.al-total-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(135deg, #0f4c75 0%, #1e3a5f 100%);
    color: #bfdbfe;
    font-size: 12.5px;
    font-weight: 600;
    padding: 5px 14px;
    border-radius: 999px;
    letter-spacing: .03em;
}

/* ─── Search bar ─────────────────────────────────────────────── */
.al-table-wrap {
    padding: 0 !important;
    overflow: visible !important;
}
.al-search-bar {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 10px 14px;
    padding: 14px 16px;
    background: #f8fbff;
    border-bottom: 1px solid #dbeafe;
    border-radius: 14px 14px 0 0;
}
.al-search-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1 1 180px;
}
.al-search-field.al-field-sm { flex: 0 1 160px; }
.al-search-field.al-field-btn { flex: 0 0 auto; }
.al-search-label {
    font-size: 11px;
    font-weight: 600;
    color: #4d6e8a;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.al-search-input,
.al-search-select {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}
.al-search-btn {
    height: 36px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
}

/* ─── Table scroll wrapper ───────────────────────────────────── */
.al-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.al-table {
    border-radius: 0 !important;
    min-width: 820px;
}

/* ─── Column helpers ─────────────────────────────────────────── */
.al-id {
    font-weight: 700;
    color: #6b8aaa;
    font-size: 12.5px;
}
.al-mono {
    font-family: 'JetBrains Mono', 'Fira Mono', monospace;
    font-size: 12.5px;
    letter-spacing: .03em;
}
.al-date {
    font-size: 12.5px;
    color: #4d6e8a;
    white-space: nowrap;
}

/* ─── SN badge button ────────────────────────────────────────── */
.al-sn-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(90deg, #0ea5e9 0%, #0369a1 100%);
    color: #ffffff;
    font-weight: 700;
    font-size: 12px;
    font-family: 'JetBrains Mono', 'Fira Mono', monospace;
    letter-spacing: .05em;
    padding: 4px 12px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: filter .15s, transform .1s;
    box-shadow: 0 2px 6px rgba(14,165,233,.22);
    white-space: nowrap;
}
.al-sn-btn:hover {
    filter: brightness(1.1);
    transform: translateY(-1px);
}

/* ─── Model badge chip ───────────────────────────────────────── */
.al-model-badge {
    display: inline-flex;
    align-items: center;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1d4ed8;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    white-space: nowrap;
}

.al-link-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    text-decoration: none;
    font-weight: 700;
    font-size: 12px;
    color: #0b4a6f;
    background: linear-gradient(135deg, #dff4ff 0%, #bfdbfe 100%);
    border: 1px solid #93c5fd;
    box-shadow: 0 3px 10px rgba(14,165,233,.14);
    transition: transform .12s, filter .18s;
}
.al-link-badge:hover {
    filter: brightness(1.03);
    transform: translateY(-1px);
}

/* ─── RE Active cell ─────────────────────────────────────────── */
.al-react-cell {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.al-react-btn {
    height: 28px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
}
.al-react-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    background: #f97316;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    border-radius: 999px;
    padding: 0 5px;
}

/* ─── Footer row ─────────────────────────────────────────────── */
.al-footer-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 12px;
}
.al-record-count {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    font-weight: 600;
    color: #4d6e8a;
    background: #f0f9ff;
    border: 1px solid #bae6fd;
    padding: 5px 14px;
    border-radius: 999px;
}

/* ─── DSP model workspace ───────────────────────────────────── */
.dspm-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
    gap: 18px;
    align-items: stretch;
    padding: 20px 22px;
    background:
        radial-gradient(circle at top right, rgba(14,165,233,.14), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #f5fbff 52%, #eef7ff 100%);
}
.dspm-hero-copy {
    min-width: 0;
}
.dspm-kicker {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #0284c7;
}
.dspm-title {
    margin: 0 0 8px;
    font-size: clamp(26px, 3vw, 34px);
    line-height: 1.08;
    color: #10243e;
}
.dspm-lead {
    margin: 0;
    max-width: 760px;
    color: #54708c;
    line-height: 1.7;
}
.dspm-status {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    border-radius: 16px;
    border: 1px solid #d7ebff;
    background: rgba(255,255,255,.92);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.dspm-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    max-width: 100%;
    padding: 7px 12px;
    border-radius: 999px;
    background: linear-gradient(135deg, #0f4c75 0%, #1d4ed8 100%);
    color: #eff6ff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
}
.dspm-status-note {
    color: #46637e;
    line-height: 1.65;
    font-size: 13px;
}
.dspm-stack {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.dspm-section {
    padding: 18px;
}
.dspm-section > .al-page-header:first-child {
    margin-bottom: 16px;
}

/* ─── Firmware manager ──────────────────────────────────────── */
.fwm-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(260px, .95fr);
    gap: 18px;
    padding: 20px 22px;
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.12), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #f7fbff 45%, #eef9f1 100%);
}
.fwm-kicker {
    display: inline-flex;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #0284c7;
}
.fwm-title {
    margin: 0 0 8px;
    font-size: clamp(24px, 3vw, 33px);
    line-height: 1.08;
    color: #12263f;
}
.fwm-lead {
    margin: 0;
    max-width: 760px;
    color: #55708b;
    line-height: 1.7;
}
.fwm-summary {
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: space-between;
    padding: 16px 18px;
    border-radius: 16px;
    border: 1px solid #dcefe2;
    background: rgba(255,255,255,.92);
}
.fwm-summary-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    max-width: 100%;
    padding: 7px 12px;
    border-radius: 999px;
    background: linear-gradient(135deg, #0f766e 0%, #16a34a 100%);
    color: #ecfeff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
}
.fwm-summary-note {
    color: #4b667f;
    line-height: 1.65;
    font-size: 13px;
}
.fwm-form-wrap {
    padding: 18px 20px;
}
.fwm-form-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
}
.fwm-form-head h3 {
    margin: 0 0 6px;
    color: #10243e;
}
.fwm-form-head p {
    margin: 0;
    color: #58748f;
}
.fwm-id-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #eff6ff;
    color: #1d4ed8;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 700;
}
.fwm-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px 16px;
}
.fwm-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}
.fwm-field-sm {
    grid-column: span 1;
}
.fwm-field-wide {
    grid-column: span 2;
}
.fwm-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #57728d;
}
.fwm-input,
.fwm-file {
    width: 100%;
    box-sizing: border-box;
}
.fwm-static {
    min-height: 38px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-radius: 10px;
    border: 1px solid #d6e4f1;
    background: #f8fbff;
    color: #12314d;
    font-weight: 700;
}
.fwm-help {
    font-size: 12px;
    color: #64819b;
}
.fwm-actions {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding-top: 4px;
}
.fwm-inline-reset {
    display: inline-flex;
}
.fwm-list-head {
    justify-content: space-between;
    align-items: center;
}
.fwm-list-subtitle {
    color: #5c7891;
    font-size: 13px;
    margin-top: 4px;
}

/* ─── User log page ─────────────────────────────────────────── */
.ulog-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr);
    gap: 18px;
    padding: 20px 22px;
    background:
        radial-gradient(circle at top right, rgba(249,115,22,.12), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #fff8f2 52%, #f4fbff 100%);
}
.ulog-kicker {
    display: inline-flex;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #ea580c;
}
.ulog-title {
    margin: 0 0 8px;
    font-size: clamp(24px, 3vw, 33px);
    line-height: 1.08;
    color: #12263f;
}
.ulog-lead {
    margin: 0;
    max-width: 760px;
    color: #58708a;
    line-height: 1.7;
}
.ulog-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.ulog-metric-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 8px;
    min-height: 92px;
    padding: 14px 14px 12px;
    border-radius: 16px;
    border: 1px solid #ffe2cf;
    background: rgba(255,255,255,.94);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.ulog-metric-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #8a5d43;
}
.ulog-metric-card strong {
    color: #10243e;
    font-size: 19px;
    line-height: 1.2;
}
.ulog-toolbar {
    justify-content: space-between;
    align-items: end;
}
.ulog-toolbar-copy {
    min-width: 220px;
}
.ulog-toolbar-note {
    margin-top: 4px;
    color: #5d7891;
    font-size: 13px;
}

/* ─── Active user page ──────────────────────────────────────── */
.aul-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr);
    gap: 18px;
    padding: 20px 22px;
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.12), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #f4fff9 45%, #eef7ff 100%);
}
.aul-kicker {
    display: inline-flex;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #059669;
}
.aul-title {
    margin: 0 0 8px;
    font-size: clamp(24px, 3vw, 33px);
    line-height: 1.08;
    color: #12263f;
}
.aul-lead {
    margin: 0;
    max-width: 760px;
    color: #58708a;
    line-height: 1.7;
}
.aul-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.aul-metric-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 8px;
    min-height: 92px;
    padding: 14px 14px 12px;
    border-radius: 16px;
    border: 1px solid #d9efe1;
    background: rgba(255,255,255,.94);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.aul-metric-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #557265;
}
.aul-metric-card strong {
    color: #10243e;
    font-size: 19px;
    line-height: 1.2;
}
.aul-toolbar {
    justify-content: space-between;
    align-items: end;
}
.aul-toolbar-copy {
    min-width: 220px;
}
.aul-toolbar-note {
    margin-top: 4px;
    color: #5d7891;
    font-size: 13px;
}

/* ─── User list page ────────────────────────────────────────── */
.ulist-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr);
    gap: 18px;
    padding: 20px 22px;
    background:
        radial-gradient(circle at top right, rgba(14,165,233,.14), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #f4fbff 45%, #eef6ff 100%);
}
.ulist-kicker {
    display: inline-flex;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #0284c7;
}
.ulist-title {
    margin: 0 0 8px;
    font-size: clamp(24px, 3vw, 33px);
    line-height: 1.08;
    color: #12263f;
}
.ulist-lead {
    margin: 0;
    max-width: 760px;
    color: #58708a;
    line-height: 1.7;
}
.ulist-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.ulist-metric-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 8px;
    min-height: 92px;
    padding: 14px 14px 12px;
    border-radius: 16px;
    border: 1px solid #d7e8ff;
    background: rgba(255,255,255,.94);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.ulist-metric-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #54708a;
}
.ulist-metric-card strong {
    color: #10243e;
    font-size: 19px;
    line-height: 1.2;
}
.ulist-toolbar {
    justify-content: space-between;
    align-items: end;
}
.ulist-toolbar-copy {
    min-width: 220px;
}
.ulist-toolbar-note {
    margin-top: 4px;
    color: #5d7891;
    font-size: 13px;
}

/* ─── Unlock code page ─────────────────────────────────────── */
.ulc-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr);
    gap: 18px;
    padding: 20px 22px;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.12), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #f3faff 45%, #eef9ff 100%);
}
.ulc-kicker {
    display: inline-flex;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #0369a1;
}
.ulc-title {
    margin: 0 0 8px;
    font-size: clamp(24px, 3vw, 33px);
    line-height: 1.08;
    color: #12263f;
}
.ulc-lead {
    margin: 0;
    max-width: 760px;
    color: #58708a;
    line-height: 1.7;
}
.ulc-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.ulc-metric-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 8px;
    min-height: 92px;
    padding: 14px 14px 12px;
    border-radius: 16px;
    border: 1px solid #d9ebf8;
    background: rgba(255,255,255,.94);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.ulc-metric-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #54708a;
}
.ulc-metric-card strong {
    color: #10243e;
    font-size: 19px;
    line-height: 1.2;
}
.ulc-toolbar {
    justify-content: space-between;
    align-items: end;
}
.ulc-toolbar-copy {
    min-width: 220px;
}
.ulc-toolbar-note {
    margin-top: 4px;
    color: #5d7891;
    font-size: 13px;
}

/* ─── DB config page ───────────────────────────────────────── */
.dbc-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr);
    gap: 18px;
    padding: 20px 22px;
    background:
        radial-gradient(circle at top right, rgba(245,158,11,.12), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #fffaf0 45%, #eef7ff 100%);
}
.dbc-kicker {
    display: inline-flex;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #b45309;
}
.dbc-title {
    margin: 0 0 8px;
    font-size: clamp(24px, 3vw, 33px);
    line-height: 1.08;
    color: #12263f;
}
.dbc-lead {
    margin: 0;
    max-width: 760px;
    color: #58708a;
    line-height: 1.7;
}
.dbc-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.dbc-metric-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 8px;
    min-height: 92px;
    padding: 14px 14px 12px;
    border-radius: 16px;
    border: 1px solid #f6e1bf;
    background: rgba(255,255,255,.94);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.dbc-metric-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #7a6041;
}
.dbc-metric-card strong {
    color: #10243e;
    font-size: 19px;
    line-height: 1.2;
}
.dbc-add-wrap {
    padding: 18px 20px;
}
.dbc-add-head {
    margin-bottom: 14px;
}
.dbc-add-head h3 {
    margin: 0 0 6px;
    color: #10243e;
}
.dbc-add-head p {
    margin: 0;
    color: #58748f;
}
.dbc-add-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px 16px;
}
.dbc-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}
.dbc-field-wide {
    grid-column: span 2;
}
.dbc-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #57728d;
}
.dbc-actions {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding-top: 4px;
}
.dbc-toolbar {
    justify-content: space-between;
    align-items: end;
}
.dbc-toolbar-copy {
    min-width: 220px;
}
.dbc-toolbar-note {
    margin-top: 4px;
    color: #5d7891;
    font-size: 13px;
}

/* ─── Form user list page ──────────────────────────────────── */
.ful-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr);
    gap: 18px;
    padding: 20px 22px;
    background:
        radial-gradient(circle at top right, rgba(168,85,247,.14), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #faf5ff 45%, #eef7ff 100%);
}
.ful-kicker {
    display: inline-flex;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #7e22ce;
}
.ful-title {
    margin: 0 0 8px;
    font-size: clamp(24px, 3vw, 33px);
    line-height: 1.08;
    color: #12263f;
}
.ful-lead {
    margin: 0;
    max-width: 760px;
    color: #58708a;
    line-height: 1.7;
}
.ful-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.ful-metric-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 8px;
    min-height: 92px;
    padding: 14px 14px 12px;
    border-radius: 16px;
    border: 1px solid #ead9ff;
    background: rgba(255,255,255,.94);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.ful-metric-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #6a548a;
}
.ful-metric-card strong {
    color: #10243e;
    font-size: 19px;
    line-height: 1.2;
}
.ful-toolbar {
    justify-content: space-between;
    align-items: end;
}
.ful-toolbar-copy {
    min-width: 220px;
}
.ful-toolbar-note {
    margin-top: 4px;
    color: #5d7891;
    font-size: 13px;
}

@media (max-width: 980px) {
    .ulog-hero {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .ulog-metrics {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .aul-hero {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .aul-metrics {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .ulist-hero {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .ulist-metrics {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .ulc-hero {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .ulc-metrics {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .dbc-hero {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .dbc-metrics {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .dbc-add-form {
        grid-template-columns: 1fr 1fr;
    }

    .dbc-field-wide {
        grid-column: span 2;
    }

    .ful-hero {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .ful-metrics {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .ulog-metrics {
        grid-template-columns: 1fr;
    }

    .aul-metrics {
        grid-template-columns: 1fr;
    }

    .ulist-metrics {
        grid-template-columns: 1fr;
    }

    .ulc-metrics {
        grid-template-columns: 1fr;
    }

    .dbc-metrics {
        grid-template-columns: 1fr;
    }

    .dbc-add-form {
        grid-template-columns: 1fr;
    }

    .dbc-field-wide,
    .dbc-actions {
        grid-column: span 1;
    }

    .ful-metrics {
        grid-template-columns: 1fr;
    }
}

/* ─── Download manager ─────────────────────────────────────── */
.dlm-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 1fr);
    gap: 18px;
    padding: 20px 22px;
    background:
        radial-gradient(circle at top right, rgba(2,132,199,.12), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #f2f9ff 50%, #eef8ff 100%);
}
.dlm-kicker {
    display: inline-flex;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #0369a1;
}
.dlm-title {
    margin: 0 0 8px;
    font-size: clamp(24px, 3vw, 33px);
    line-height: 1.08;
    color: #12263f;
}
.dlm-lead {
    margin: 0;
    color: #58708a;
    line-height: 1.7;
}
.dlm-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.dlm-metric-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: space-between;
    min-height: 92px;
    padding: 14px 14px 12px;
    border-radius: 16px;
    border: 1px solid #d9ebf8;
    background: rgba(255,255,255,.94);
}
.dlm-metric-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #54708a;
}
.dlm-metric-card strong {
    color: #10243e;
    font-size: 19px;
}
.dlm-toolbar {
    justify-content: space-between;
    align-items: end;
}
.dlm-toolbar-copy {
    min-width: 240px;
}
.dlm-toolbar-note {
    margin-top: 4px;
    color: #5d7891;
    font-size: 13px;
}
.dlm-toolbar-actions {
    display: inline-flex;
    gap: 8px;
    flex-wrap: wrap;
}
.dlm-comment-input {
    width: 100%;
    min-width: 220px;
    height: 34px;
    padding: 0 10px;
    border: 1px solid #cdddee;
    border-radius: 8px;
    background: #ffffff;
    color: #12314d;
    font-size: 12.5px;
    box-sizing: border-box;
}
.dlm-comment-input:focus {
    outline: none;
    border-color: #7dd3fc;
    box-shadow: 0 0 0 3px rgba(14,165,233,.15);
}

/* ─── Public download page ─────────────────────────────────── */
.dlp-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 1fr);
    gap: 16px;
    padding: 20px 22px;
    background:
        radial-gradient(circle at top right, rgba(16,185,129,.13), transparent 36%),
        linear-gradient(135deg, #ffffff 0%, #f0fdf7 50%, #eef8ff 100%);
}

.dlp-hero-main {
    width: calc(100vw - clamp(10px, 1.6vw, 24px));
    margin-left: calc(50% - 50vw + clamp(5px, 0.8vw, 12px));
    margin-right: calc(50% - 50vw + clamp(5px, 0.8vw, 12px));
    border-radius: 10px;
}
.dlp-kicker {
    display: inline-flex;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #0f766e;
}
.dlp-title {
    margin: 0 0 8px;
    font-size: clamp(24px, 3vw, 33px);
    line-height: 1.08;
    color: #12263f;
}
.dlp-lead {
    margin: 0;
    color: #58708a;
    line-height: 1.7;
}
.dlp-badge-wrap {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
}
.dlp-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #ecfeff;
    color: #0e7490;
    border: 1px solid #a5f3fc;
    border-radius: 999px;
    padding: 7px 12px;
    font-size: 12px;
    font-weight: 600;
}
.dlp-list-wrap {
    padding: 18px 20px;
}

.dlp-list-wrap-main {
    width: calc(100vw - clamp(10px, 1.6vw, 24px));
    margin-left: calc(50% - 50vw + clamp(5px, 0.8vw, 12px));
    margin-right: calc(50% - 50vw + clamp(5px, 0.8vw, 12px));
    border-radius: 10px;
    padding-left: clamp(12px, 2.2vw, 28px);
    padding-right: clamp(12px, 2.2vw, 28px);
}
.dlp-list-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
}
.dlp-list-head h3 {
    margin: 0;
    color: #10243e;
}
.dlp-empty {
    color: #64748b;
    text-align: center;
    padding: 18px 10px;
    border: 1px dashed #cbd5e1;
    border-radius: 12px;
    background: #f8fafc;
}
.dlp-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 12px;
}
.dlp-card {
    display: block;
    text-decoration: none;
    border: 1px solid #dbeafe;
    border-radius: 14px;
    padding: 12px;
    background: #ffffff;
    color: inherit;
    transition: transform .12s, box-shadow .18s, border-color .18s;
}
.dlp-card:hover {
    transform: translateY(-2px);
    border-color: #93c5fd;
    box-shadow: 0 10px 22px rgba(14,116,144,.12);
}
.dlp-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    color: #0e7490;
}
.dlp-ext {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 700;
}
.dlp-name {
    font-weight: 700;
    color: #10243e;
    margin-bottom: 6px;
    word-break: break-word;
}
.dlp-comment {
    color: #35526c;
    font-size: 12.5px;
    line-height: 1.45;
    margin-bottom: 6px;
    min-height: 18px;
    word-break: break-word;
}
.dlp-meta {
    color: #5d7891;
    font-size: 12px;
}

@media (max-width: 980px) {
    .dlm-hero,
    .dlp-hero {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .dlm-metrics {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .dlp-badge-wrap {
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .dlm-metrics {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 980px) {
    .fwm-hero {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .fwm-form-grid {
        grid-template-columns: 1fr 1fr;
    }

    .fwm-field-wide {
        grid-column: span 2;
    }
}

@media (max-width: 640px) {
    .fwm-form-wrap {
        padding: 14px;
    }

    .fwm-form-grid {
        grid-template-columns: 1fr;
    }

    .fwm-field-wide,
    .fwm-field-sm,
    .fwm-actions {
        grid-column: span 1;
    }
}

@media (max-width: 980px) {
    .dspm-hero {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .dspm-section {
        padding: 12px;
    }
}

/* ─── Form inputs inside tables ──────────────────────────────── */
.table_main input[type=text],
.table_main input[type=number],
.table_main select,
.table_main textarea {
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 5px 10px;
    font-size: 13px;
    transition: border-color .2s, box-shadow .2s;
    background: #f8fafc;
    width: 100%;
}
.table_main input[type=text]:focus,
.table_main input[type=number]:focus,
.table_main select:focus,
.table_main textarea:focus {
    outline: none;
    border-color: #0ea5e9;
    box-shadow: 0 0 0 3px rgba(14,165,233,.15);
    background: #fff;
}