/* =====================================================================
   Guardrail Redesign v1.4.14
   Functional operational UI — scoped to explicitly redesigned pages.
   ===================================================================== */

.guardrail-landing,
.guardrail-auth,
.guardrail-dashboard,
.guardrail-access,
.guardrail-qr-token,
.guardrail-rekap,
.guardrail-report,
.guardrail-backup,
.guardrail-delete,
.guardrail-tasks,
.guardrail-secretary {
    --op-bg: #0f172a;
    --op-surface: #172033;
    --op-surface-2: #1d293d;
    --op-border: rgba(226,232,240,.17);
    --op-border-strong: rgba(226,232,240,.28);
    --op-text: #eef2f7;
    --op-muted: #aeb9ca;
    --op-accent: #4dd3a7;
    --op-accent-soft: rgba(77,211,167,.12);
    --op-warning: #f5b94c;
    --op-warning-soft: rgba(245,185,76,.12);
    --op-danger: #f87171;
    --op-danger-soft: rgba(248,113,113,.12);
    --op-info: #60a5fa;
    --op-info-soft: rgba(96,165,250,.12);
    --op-radius: 8px;
    --op-shadow-overlay: 0 18px 48px rgba(2,8,23,.36);
    color: var(--op-text);
}

html[data-theme="light"] .guardrail-landing,
html[data-theme="light"] .guardrail-auth,
html[data-theme="light"] .guardrail-dashboard,
html[data-theme="light"] .guardrail-access,
html[data-theme="light"] .guardrail-qr-token,
html[data-theme="light"] .guardrail-rekap,
html[data-theme="light"] .guardrail-report,
html[data-theme="light"] .guardrail-backup,
html[data-theme="light"] .guardrail-delete,
html[data-theme="light"] .guardrail-tasks,
html[data-theme="light"] .guardrail-secretary {
    --op-bg: #f4f6f8;
    --op-surface: #ffffff;
    --op-surface-2: #f8fafc;
    --op-border: #d8dee7;
    --op-border-strong: #b8c2d1;
    --op-text: #172033;
    --op-muted: #5e6b7e;
    --op-accent: #087d63;
    --op-accent-soft: #e6f5f0;
    --op-warning: #9a6300;
    --op-warning-soft: #fff4d7;
    --op-danger: #b42318;
    --op-danger-soft: #fff0ee;
    --op-info: #175cd3;
    --op-info-soft: #edf4ff;
}

.guardrail-landing,
.guardrail-auth,
.guardrail-dashboard,
.guardrail-access,
.guardrail-qr-token,
.guardrail-rekap,
.guardrail-report,
.guardrail-backup,
.guardrail-delete,
.guardrail-tasks,
.guardrail-secretary {
    background: var(--op-bg);
}

.guardrail-dashboard .glass-card,
.guardrail-access .glass-card,
.guardrail-qr-token .glass-card,
.guardrail-rekap .glass-card,
.guardrail-report .glass-card,
.guardrail-backup .glass-card,
.guardrail-delete .glass-card,
.guardrail-tasks .glass-card,
.guardrail-secretary .glass-card,
.guardrail-auth .glass-card {
    background: var(--op-surface);
    border: 1px solid var(--op-border);
    border-radius: var(--op-radius);
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.guardrail-dashboard :is(button,a,input,select,textarea):focus-visible,
.guardrail-access :is(button,a,input,select,textarea):focus-visible,
.guardrail-qr-token :is(button,a,input,select,textarea):focus-visible,
.guardrail-rekap :is(button,a,input,select,textarea):focus-visible,
.guardrail-report :is(button,a,input,select,textarea):focus-visible,
.guardrail-backup :is(button,a,input,select,textarea):focus-visible,
.guardrail-delete :is(button,a,input,select,textarea):focus-visible,
.guardrail-tasks :is(button,a,input,select,textarea):focus-visible,
.guardrail-secretary :is(button,a,input,select,textarea):focus-visible,
.guardrail-auth :is(button,a,input,select,textarea):focus-visible,
.guardrail-landing :is(button,a,input,select,textarea):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--op-info) 55%, transparent);
    outline-offset: 2px;
}

.guardrail-dashboard .sidebar,
.guardrail-access .sidebar,
.guardrail-qr-token .sidebar,
.guardrail-rekap .sidebar,
.guardrail-report .sidebar,
.guardrail-backup .sidebar,
.guardrail-delete .sidebar,
.guardrail-tasks .sidebar {
    background: var(--op-surface);
    border-right: 1px solid var(--op-border);
    box-shadow: none;
    backdrop-filter: none;
}

.guardrail-dashboard .sidebar nav a,
.guardrail-access .sidebar nav a,
.guardrail-qr-token .sidebar nav a,
.guardrail-rekap .sidebar nav a,
.guardrail-report .sidebar nav a,
.guardrail-backup .sidebar nav a,
.guardrail-delete .sidebar nav a,
.guardrail-tasks .sidebar nav a {
    border-radius: 7px;
    min-height: 42px;
    display: flex;
    align-items: center;
}

.guardrail-dashboard .sidebar nav a:hover,
.guardrail-access .sidebar nav a:hover,
.guardrail-qr-token .sidebar nav a:hover,
.guardrail-rekap .sidebar nav a:hover,
.guardrail-report .sidebar nav a:hover,
.guardrail-backup .sidebar nav a:hover,
.guardrail-delete .sidebar nav a:hover,
.guardrail-tasks .sidebar nav a:hover {
    background: var(--op-surface-2);
}

.guardrail-dashboard .sidebar nav a.active,
.guardrail-access .sidebar nav a.active,
.guardrail-qr-token .sidebar nav a.active,
.guardrail-rekap .sidebar nav a.active,
.guardrail-report .sidebar nav a.active,
.guardrail-backup .sidebar nav a.active,
.guardrail-delete .sidebar nav a.active,
.guardrail-tasks .sidebar nav a.active {
    background: var(--op-accent-soft);
    border-color: color-mix(in srgb, var(--op-accent) 50%, transparent);
    color: var(--op-text);
}

/* ---------- Landing ---------- */
.guardrail-landing .landing-modern {
    background: var(--op-bg);
    padding: 24px;
}
.guardrail-landing .landing-modern::before,
.guardrail-landing .landing-modern::after,
.guardrail-landing .landing-brand-panel::before,
.guardrail-landing .modern-role-card::before,
.guardrail-landing .modern-role-card::after {
    display: none;
}
.guardrail-landing .landing-modern-shell {
    width: min(980px, 100%);
    gap: 18px;
}
.guardrail-landing .landing-brand-panel {
    background: var(--op-surface);
    border: 1px solid var(--op-border);
    border-radius: 10px;
    box-shadow: none;
    padding: 22px;
}
.guardrail-landing .school-logo-halo { display: none; }
.guardrail-landing .school-logo-frame {
    box-shadow: none;
    border: 1px solid var(--op-border);
    border-radius: 10px;
    background: var(--op-surface-2);
}
.guardrail-landing .landing-brand-title { color: var(--op-text); }
.guardrail-landing .landing-brand-subtitle { color: var(--op-muted); }
.guardrail-landing .modern-role-grid { gap: 10px; }
.guardrail-landing .modern-role-card {
    min-height: 78px;
    padding: 14px 16px;
    border-radius: 8px;
    border: 1px solid var(--op-border);
    background: var(--op-surface);
    box-shadow: none;
    transform: none;
}
.guardrail-landing .modern-role-card:hover {
    transform: none;
    border-color: var(--op-border-strong);
    background: var(--op-surface-2);
}
.guardrail-landing .modern-role-icon {
    width: 34px;
    height: 34px;
    min-width: 34px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--op-muted);
}
.guardrail-landing .modern-role-card-admin,
.guardrail-landing .role-siswa,
.guardrail-landing .role-petugas,
.guardrail-landing .role-sekretaris,
.guardrail-landing .role-staff,
.guardrail-landing .role-admin {
    background: var(--op-surface);
    color: var(--op-text);
}
.guardrail-landing .modern-role-label { font-size: 16px; }
.guardrail-landing .modern-role-arrow { color: var(--op-muted); }

/* ---------- Authentication ---------- */
.guardrail-auth .auth-wrap {
    background: var(--op-bg);
    padding: 24px;
}
.guardrail-auth .auth-card {
    width: min(430px, 100%);
    padding: 24px;
}
.guardrail-auth .auth-card h1,
.guardrail-auth .auth-card h2 { margin-top: 6px; color: var(--op-text); }
.guardrail-auth .auth-card .sub,
.guardrail-auth .field-help { color: var(--op-muted); }
.guardrail-auth .auth-context-label {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 3px 8px;
    border-radius: 6px;
    border: 1px solid var(--op-border);
    color: var(--op-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.guardrail-auth .field { margin-bottom: 14px; }
.guardrail-auth .field label { color: var(--op-text); font-weight: 650; }
.guardrail-auth input {
    min-height: 44px;
    border-radius: 7px;
    border: 1px solid var(--op-border-strong);
    background: var(--op-surface-2);
    color: var(--op-text);
    box-shadow: none;
}
.guardrail-auth input:hover { border-color: color-mix(in srgb, var(--op-info) 35%, var(--op-border-strong)); }
.guardrail-auth input[aria-invalid="true"] { border-color: var(--op-danger); }
.guardrail-auth .secret-input-wrap { position: relative; }
.guardrail-auth .secret-input-wrap input { padding-right: 142px; width: 100%; }
.guardrail-auth .secret-toggle {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    min-height: 36px;
    border: 0;
    border-left: 1px solid var(--op-border);
    background: transparent;
    color: var(--op-muted);
    padding: 0 10px;
    border-radius: 0 5px 5px 0;
    cursor: pointer;
}
.guardrail-auth .secret-toggle:hover { color: var(--op-text); background: var(--op-surface); }
.guardrail-auth .field-help,
.guardrail-auth .field-error { display:block; margin-top:6px; font-size:12.5px; line-height:1.4; }
.guardrail-auth .field-error { color: var(--op-danger); font-weight: 650; }
.guardrail-auth .field-error::before { content: "! "; }
.guardrail-auth .alert-error { border-radius: 7px; border: 1px solid color-mix(in srgb, var(--op-danger) 55%, transparent); background: var(--op-danger-soft); color: var(--op-text); }
.guardrail-auth .btn {
    min-height: 44px;
    border-radius: 7px;
    box-shadow: none;
}
.guardrail-auth .btn.is-loading { cursor: progress; opacity:.72; }
.guardrail-auth .auth-secondary-link { color: var(--op-muted); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Shared page chrome ---------- */
.guardrail-dashboard .main,
.guardrail-access .main,
.guardrail-qr-token .main,
.guardrail-rekap .main,
.guardrail-report .main,
.guardrail-backup .main,
.guardrail-delete .main,
.guardrail-tasks .main {
    padding-top: 22px;
}
.guardrail-dashboard .topbar,
.guardrail-access .topbar,
.guardrail-qr-token .topbar,
.guardrail-rekap .topbar,
.guardrail-report .topbar,
.guardrail-backup .topbar,
.guardrail-delete .topbar,
.guardrail-tasks .topbar {
    margin-bottom: 16px;
}
.guardrail-dashboard .topbar h1,
.guardrail-access .topbar h1,
.guardrail-qr-token .topbar h1,
.guardrail-rekap .topbar h1,
.guardrail-report .topbar h1,
.guardrail-backup .topbar h1,
.guardrail-delete .topbar h1,
.guardrail-tasks .topbar h1 {
    font-size: clamp(22px, 2vw, 29px);
}

/* ---------- Dashboard class rows ---------- */
.guardrail-dashboard .db14-toolbar {
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:12px;
    margin: 0 0 12px;
}
.guardrail-dashboard .db14-filterbar {
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}
.guardrail-dashboard .db14-filterbar label { display:grid; gap:5px; color:var(--op-muted); font-size:12px; font-weight:700; }
.guardrail-dashboard .db14-filterbar select {
    min-width:160px;
    min-height:40px;
    padding:7px 34px 7px 10px;
    border:1px solid var(--op-border);
    border-radius:7px;
    background:var(--op-surface);
    color:var(--op-text);
}
.guardrail-dashboard .db14-class-list {
    border:1px solid var(--op-border);
    border-radius:8px;
    overflow:hidden;
    background:var(--op-surface);
}
.guardrail-dashboard .db14-class-head,
.guardrail-dashboard .db14-class-row {
    display:grid;
    grid-template-columns:minmax(170px,1.55fr) minmax(130px,1.1fr) repeat(6,minmax(48px,.5fr)) 44px;
    align-items:center;
    gap:0;
}
.guardrail-dashboard .db14-class-head {
    min-height:42px;
    background:var(--op-surface-2);
    border-bottom:1px solid var(--op-border);
    color:var(--op-muted);
    font-size:11px;
    font-weight:750;
    text-transform:uppercase;
    letter-spacing:.04em;
}
.guardrail-dashboard .db14-class-head > *,
.guardrail-dashboard .db14-class-row > * { padding:9px 10px; }
.guardrail-dashboard .db14-class-row {
    min-height:54px;
    border-bottom:1px solid var(--op-border);
    color:var(--op-text);
}
.guardrail-dashboard .db14-class-row:last-child { border-bottom:0; }
.guardrail-dashboard .db14-class-row:hover { background:var(--op-surface-2); }
.guardrail-dashboard .db14-class-name strong { display:block; font-size:14px; }
.guardrail-dashboard .db14-class-name small { color:var(--op-muted); font-size:11.5px; }
.guardrail-dashboard .db14-status {
    display:inline-flex;
    align-items:center;
    gap:6px;
    width:max-content;
    max-width:100%;
    font-size:12px;
    font-weight:700;
}
.guardrail-dashboard .db14-status::before { content:""; width:7px; height:7px; border-radius:50%; background:currentColor; flex:0 0 auto; }
.guardrail-dashboard .db14-status.is-final { color:var(--op-accent); }
.guardrail-dashboard .db14-status.is-pending { color:var(--op-warning); }
.guardrail-dashboard .db14-status.is-holiday { color:var(--op-info); }
.guardrail-dashboard .db14-metric { text-align:right; font-variant-numeric:tabular-nums; font-weight:700; }
.guardrail-dashboard .db14-metric.is-muted { color:var(--op-muted); font-weight:500; }
.guardrail-dashboard .db14-open { display:grid; place-items:center; width:36px; height:36px; border-radius:6px; border:1px solid transparent; color:var(--op-muted); }
.guardrail-dashboard .db14-open:hover { border-color:var(--op-border); background:var(--op-surface-2); color:var(--op-text); }
.guardrail-dashboard .db14-empty { padding:22px; color:var(--op-muted); text-align:center; }
.guardrail-dashboard .db21-analysis,
.guardrail-dashboard .db21-head-note,
.guardrail-dashboard .db21-summary-grid,
.guardrail-dashboard .db21-analysis-card {
    border-radius:8px;
    box-shadow:none;
}
.guardrail-dashboard .db21-analysis { border:1px solid var(--op-border); background:var(--op-surface); }

/* ---------- Manajemen Akses ---------- */
.guardrail-access .access14-page-head {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:12px;
    margin-bottom:14px;
}
.guardrail-access .access14-page-head p { margin:4px 0 0; color:var(--op-muted); }
.guardrail-access .access14-toolbar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin:10px 0;
    flex-wrap:wrap;
}
.guardrail-access .access14-tools { display:flex; gap:8px; flex-wrap:wrap; }
.guardrail-access .access14-tools input,
.guardrail-access .access14-tools select {
    min-height:40px;
    border:1px solid var(--op-border);
    border-radius:7px;
    background:var(--op-surface-2);
    color:var(--op-text);
    padding:8px 10px;
}
.guardrail-access .ma-tabs { border-radius:8px; background:var(--op-surface-2); border:1px solid var(--op-border); padding:4px; }
.guardrail-access .ma-tab { border-radius:6px; box-shadow:none; }
.guardrail-access .ma-card { border-radius:8px; border:1px solid var(--op-border); box-shadow:none; background:var(--op-surface); }
.guardrail-access .ma-table th { position:sticky; top:0; z-index:2; }
.guardrail-access .access14-backdrop {
    position:fixed;
    inset:0;
    background:rgba(2,8,23,.54);
    z-index:1990;
}
.guardrail-access .access14-drawer {
    position:fixed;
    top:0;
    right:0;
    width:min(560px,92vw);
    height:100dvh;
    z-index:2000;
    background:var(--op-surface);
    border-left:1px solid var(--op-border);
    box-shadow:var(--op-shadow-overlay);
    display:flex;
    flex-direction:column;
}
.guardrail-access .access14-backdrop[hidden],
.guardrail-access .access14-drawer[hidden] { display:none; }
.guardrail-access .access14-drawer-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 18px; border-bottom:1px solid var(--op-border); }
.guardrail-access .access14-drawer-head h2 { margin:0; font-size:20px; }
.guardrail-access .access14-drawer-close { width:44px; height:44px; border:0; border-radius:7px; background:transparent; color:var(--op-text); cursor:pointer; font-size:24px; }
.guardrail-access .access14-drawer-body { padding:18px; overflow:auto; }
.guardrail-access .access14-import-steps { margin:12px 0; padding-left:22px; color:var(--op-muted); }
.guardrail-access .access14-import-steps li { margin:6px 0; }
.guardrail-access .access14-import-actions { display:flex; gap:8px; flex-wrap:wrap; margin:14px 0; }
.guardrail-access .access14-import-form { padding-top:14px; border-top:1px solid var(--op-border); }

/* ---------- QR / Token ---------- */
.guardrail-qr-token .qr14-timebar {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border:1px solid var(--op-border);
    border-radius:8px;
    background:var(--op-surface);
    margin-bottom:12px;
}
.guardrail-qr-token .qr14-timeitem { padding:10px 12px; border-right:1px solid var(--op-border); }
.guardrail-qr-token .qr14-timeitem:last-child { border-right:0; }
.guardrail-qr-token .qr14-timeitem small { display:block; color:var(--op-muted); margin-bottom:2px; }
.guardrail-qr-token .qr14-timeitem strong { font-variant-numeric:tabular-nums; }
.guardrail-qr-token .qr14-token-primary,
.guardrail-qr-token .qr14-qr-section { padding:18px; margin-bottom:12px; }
.guardrail-qr-token .qr14-token-primary { border-color:color-mix(in srgb,var(--op-accent) 55%,var(--op-border)); }
.guardrail-qr-token .qr14-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
.guardrail-qr-token .qr14-section-head h2 { margin:0; font-size:20px; }
.guardrail-qr-token .qr14-section-head p { margin:4px 0 0; color:var(--op-muted); }
.guardrail-qr-token .qr14-token-value { font-size:clamp(32px,5vw,54px); letter-spacing:.08em; font-weight:800; margin:12px 0 6px; font-variant-numeric:tabular-nums; }
.guardrail-qr-token .op-warning { margin:12px 0; padding:10px 12px; border-left:3px solid var(--op-warning); background:var(--op-warning-soft); color:var(--op-text); border-radius:0 6px 6px 0; font-size:13px; }
.guardrail-qr-token .qr14-actions { display:flex; gap:8px; flex-wrap:wrap; }
.guardrail-qr-token .btn-outline { box-shadow:none; }
.guardrail-qr-token .qr14-qr-layout { display:grid; grid-template-columns:minmax(220px,320px) 1fr; gap:18px; align-items:start; }
.guardrail-qr-token .qr14-qr-layout img { max-width:100%; border-radius:8px; border:1px solid var(--op-border); background:#fff; }

/* ---------- Rekap ---------- */
.guardrail-rekap .rk17-filter {
    border:1px solid var(--op-border);
    background:var(--op-surface);
    border-radius:8px;
    box-shadow:none;
}
.guardrail-rekap .rk17-filter-grid.op-filter-grid {
    display:grid;
    grid-template-columns:1.1fr 1fr 1fr;
    gap:0;
}
.guardrail-rekap .op-filter-group { min-width:0; padding:12px; border-right:1px solid var(--op-border); }
.guardrail-rekap .op-filter-group:last-child { border-right:0; }
.guardrail-rekap .op-filter-group-title { margin:0 0 8px; font-size:11px; color:var(--op-muted); text-transform:uppercase; letter-spacing:.05em; }
.guardrail-rekap .op-filter-group-body { display:flex; align-items:flex-end; gap:8px; flex-wrap:wrap; }
.guardrail-rekap .op-filter-group-body > label { flex:1 1 135px; min-width:0; }
.guardrail-rekap .op-filter-actions-group .op-filter-group-body { align-items:flex-end; }
.guardrail-rekap .rk17-filter-actions { margin:0; display:flex; gap:7px; flex-wrap:wrap; }
.guardrail-rekap .rk17-summary {
    display:flex;
    gap:0;
    border:1px solid var(--op-border);
    border-radius:8px;
    background:var(--op-surface);
    overflow:auto;
    margin:12px 0;
}
.guardrail-rekap .rk17-card {
    flex:1 0 112px;
    min-width:112px;
    padding:10px 12px;
    border:0;
    border-right:1px solid var(--op-border);
    border-radius:0;
    background:transparent;
    box-shadow:none;
}
.guardrail-rekap .rk17-card:last-child { border-right:0; }
.guardrail-rekap .rk17-card .rk17-value,
.guardrail-rekap .rk17-card strong { font-variant-numeric:tabular-nums; }
.guardrail-rekap .rk17-table-wrap { border:1px solid var(--op-border); border-radius:8px; background:var(--op-surface); box-shadow:none; }
.guardrail-rekap .rk17-table th { position:sticky; top:0; z-index:3; background:var(--op-surface-2); }
.guardrail-rekap .rk17-table th,
.guardrail-rekap .rk17-table td { padding:8px 9px; }
.guardrail-rekap .rk17-table td:not(:first-child) { font-variant-numeric:tabular-nums; }

/* ---------- Reports & Control Data ---------- */
.guardrail-report .la-filter {
    position:sticky;
    top:10px;
    z-index:25;
    border:1px solid var(--op-border);
    background:var(--op-surface);
    border-radius:8px;
    box-shadow:0 6px 18px rgba(2,8,23,.12);
}
.guardrail-report .la-tabs { border-radius:8px; border:1px solid var(--op-border); background:var(--op-surface-2); box-shadow:none; }
.guardrail-report .la-tab { border-radius:6px; box-shadow:none; }
.guardrail-report .guardrail-report-canvas {
    border:1px solid var(--op-border);
    border-radius:8px;
    background:var(--op-surface);
    padding:14px;
}
.guardrail-report .guardrail-report-canvas .la-panel,
.guardrail-report .guardrail-report-canvas .la-card,
.guardrail-report .guardrail-report-canvas .la-chart-card {
    box-shadow:none;
}
.guardrail-report .guardrail-report-canvas .la-panel {
    border:0;
    border-radius:0;
    padding:14px 0;
    background:transparent;
    border-bottom:1px solid var(--op-border);
}
.guardrail-report .guardrail-report-canvas .la-panel:last-child { border-bottom:0; }
.guardrail-report .la-cards {
    display:flex;
    overflow:auto;
    gap:0;
    border:1px solid var(--op-border);
    border-radius:8px;
    background:var(--op-surface-2);
}
.guardrail-report .la-card {
    flex:1 0 130px;
    border:0;
    border-right:1px solid var(--op-border);
    border-radius:0;
    background:transparent;
    padding:10px 12px;
}
.guardrail-report .la-card:last-child { border-right:0; }
.guardrail-report .la-table-wrap { border:1px solid var(--op-border); border-radius:8px; box-shadow:none; }
.guardrail-report .la-table th { position:sticky; top:0; z-index:3; background:var(--op-surface-2); }
.guardrail-report .la-table th,
.guardrail-report .la-table td { padding:8px 9px; }
.guardrail-report .la-meter { background:var(--op-surface-2); border:1px solid var(--op-border); border-radius:4px; overflow:hidden; }
.guardrail-report .la-meter > span { border-radius:0; background:var(--op-accent); }
.guardrail-control .control14-exceptions { margin:0 0 14px; border:1px solid var(--op-border); border-radius:8px; overflow:hidden; background:var(--op-surface); }
.guardrail-control .control14-head { padding:12px 14px; border-bottom:1px solid var(--op-border); }
.guardrail-control .control14-head h2 { margin:0 0 3px; font-size:18px; }
.guardrail-control .control14-head p { margin:0; color:var(--op-muted); }
.guardrail-control .control14-row { display:grid; grid-template-columns:110px minmax(200px,1fr) 90px auto; align-items:center; gap:10px; padding:10px 14px; border-bottom:1px solid var(--op-border); }
.guardrail-control .control14-row:last-child { border-bottom:0; }
.guardrail-control .control14-severity { font-size:12px; font-weight:750; display:flex; align-items:center; gap:6px; }
.guardrail-control .control14-severity::before { content:""; width:8px; height:8px; border-radius:50%; background:currentColor; }
.guardrail-control .is-critical .control14-severity { color:var(--op-danger); }
.guardrail-control .is-check .control14-severity { color:var(--op-warning); }
.guardrail-control .is-normal { color:var(--op-muted); background:var(--op-surface-2); }
.guardrail-control .is-normal .control14-severity { color:var(--op-muted); }
.guardrail-control .control14-problem strong { display:block; color:var(--op-text); }
.guardrail-control .control14-problem small { color:var(--op-muted); }
.guardrail-control .control14-count { text-align:right; font-size:20px; font-weight:800; font-variant-numeric:tabular-nums; }
.guardrail-control .control14-action { min-height:36px; padding:7px 10px; border:1px solid var(--op-border); border-radius:6px; }

/* ---------- Backup ---------- */
.guardrail-backup .backup14-status,
.guardrail-delete .delete14-backup-status {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:0;
    border:1px solid var(--op-border);
    border-radius:8px;
    background:var(--op-surface);
    margin-bottom:12px;
}
.guardrail-backup .backup14-status > div,
.guardrail-delete .delete14-backup-status > div { padding:10px 12px; border-right:1px solid var(--op-border); }
.guardrail-backup .backup14-status > div:last-child,
.guardrail-delete .delete14-backup-status > div:last-child { border-right:0; }
.guardrail-backup .backup14-status small,
.guardrail-delete .delete14-backup-status small { display:block; color:var(--op-muted); margin-bottom:2px; }
.guardrail-backup .backup14-sensitive { padding:10px 12px; border-left:3px solid var(--op-warning); background:var(--op-warning-soft); border-radius:0 6px 6px 0; margin:12px 0; }
.guardrail-backup .backup14-recommended { padding:18px; border:1px solid color-mix(in srgb,var(--op-accent) 55%,var(--op-border)); border-radius:8px; background:var(--op-surface); }
.guardrail-backup .backup14-recommended h2 { margin:0 0 5px; }
.guardrail-backup .backup14-recommended p { margin:0 0 14px; color:var(--op-muted); }
.guardrail-backup .backup14-alternatives { margin-top:12px; border:1px solid var(--op-border); border-radius:8px; overflow:hidden; }
.guardrail-backup .backup14-alt { display:grid; grid-template-columns:1fr auto; gap:14px; align-items:center; padding:12px 14px; border-bottom:1px solid var(--op-border); background:var(--op-surface); }
.guardrail-backup .backup14-alt:last-child { border-bottom:0; }
.guardrail-backup .backup14-alt h3 { margin:0 0 3px; font-size:15px; }
.guardrail-backup .backup14-alt p { margin:0; color:var(--op-muted); font-size:13px; }

/* ---------- Delete all data ---------- */
.guardrail-delete .delete14-warning { padding:12px 14px; border:1px solid color-mix(in srgb,var(--op-danger) 45%,var(--op-border)); border-left:4px solid var(--op-danger); background:var(--op-danger-soft); border-radius:8px; margin-bottom:12px; }
.guardrail-delete .delete14-grid { display:grid; gap:10px; }
.guardrail-delete .delete14-card { border:1px solid var(--op-border); border-radius:8px; background:var(--op-surface); padding:14px; }
.guardrail-delete .delete14-card h3 { margin:0 0 4px; }
.guardrail-delete .delete14-impact { color:var(--op-danger); font-weight:750; margin:8px 0; }
.guardrail-delete .delete14-check { display:flex; align-items:flex-start; gap:9px; margin:10px 0; color:var(--op-text); }
.guardrail-delete .delete14-check input { width:20px; height:20px; margin-top:1px; }
.guardrail-delete .delete14-phrase { display:grid; gap:5px; }
.guardrail-delete .delete14-phrase input { min-height:42px; border:1px solid var(--op-border-strong); border-radius:7px; background:var(--op-surface-2); color:var(--op-text); padding:8px 10px; }
.guardrail-delete .delete14-submit { margin-top:10px; min-height:42px; border:1px solid var(--op-danger); background:var(--op-danger); color:#fff; border-radius:7px; font-weight:750; padding:8px 12px; cursor:pointer; }
.guardrail-delete .delete14-submit:disabled { opacity:.42; cursor:not-allowed; }
.guardrail-delete .delete14-dialog { width:min(480px,calc(100vw - 28px)); border:1px solid var(--op-border); border-radius:8px; background:var(--op-surface); color:var(--op-text); box-shadow:var(--op-shadow-overlay); padding:0; }
.guardrail-delete .delete14-dialog::backdrop { background:rgba(2,8,23,.66); }
.guardrail-delete .delete14-dialog-body { padding:18px; }
.guardrail-delete .delete14-dialog-actions { display:flex; justify-content:flex-end; gap:8px; padding:12px 18px; border-top:1px solid var(--op-border); }
.guardrail-delete .delete14-danger-btn { min-height:42px; border:1px solid var(--op-danger); background:var(--op-danger); color:white; border-radius:7px; padding:8px 12px; font-weight:750; }

/* ---------- Staff task navigation ---------- */
.guardrail-tasks .mq-page { max-width:980px; }
.guardrail-tasks .mq-section { margin-top:14px; }
.guardrail-tasks .mq-section-head { margin-bottom:7px; }
.guardrail-tasks .mq-section-head span { color:var(--op-muted); }
.guardrail-tasks .mq-grid { display:grid; grid-template-columns:1fr; gap:0; border:1px solid var(--op-border); border-radius:8px; overflow:hidden; background:var(--op-surface); }
.guardrail-tasks .mq-card,
.guardrail-tasks .mq-card[class*="mq-"] {
    min-height:70px;
    display:grid;
    grid-template-columns:28px 1fr 24px;
    gap:10px;
    align-items:center;
    padding:11px 14px;
    border:0;
    border-bottom:1px solid var(--op-border);
    border-radius:0;
    background:var(--op-surface);
    box-shadow:none;
    transform:none;
    color:var(--op-text);
}
.guardrail-tasks .mq-card:last-child { border-bottom:0; }
.guardrail-tasks .mq-card:hover { transform:none; background:var(--op-surface-2); }
.guardrail-tasks .mq-card::before,
.guardrail-tasks .mq-card::after { display:none; }
.guardrail-tasks .mq-icon { width:24px; height:24px; background:transparent; border:0; border-radius:0; box-shadow:none; color:var(--op-muted); }
.guardrail-tasks .mq-question { font-size:14px; color:var(--op-text); }
.guardrail-tasks .mq-description { color:var(--op-muted); font-size:12.5px; }
.guardrail-tasks .mq-arrow { width:auto; height:auto; border:0; border-radius:0; background:transparent; color:var(--op-muted); font-size:22px; }
.guardrail-tasks .mq-role { border-radius:6px; border:1px solid var(--op-border); background:var(--op-surface-2); color:var(--op-muted); box-shadow:none; }

/* ---------- Secretary ---------- */
.guardrail-secretary { background:var(--op-bg); }
.guardrail-secretary .secretary14-context {
    position:sticky;
    top:8px;
    z-index:30;
    display:grid;
    grid-template-columns:1fr auto auto;
    gap:12px;
    align-items:center;
    padding:10px 12px;
    margin:0 0 10px;
    border:1px solid var(--op-border);
    border-radius:8px;
    background:color-mix(in srgb,var(--op-surface) 96%,transparent);
    box-shadow:0 4px 14px rgba(2,8,23,.1);
}
.guardrail-secretary .secretary14-context strong { font-size:14px; }
.guardrail-secretary .secretary14-context span { color:var(--op-muted); font-size:12.5px; }
.guardrail-secretary .secretary-table-wrap,
.guardrail-secretary .secretary-postfinal-table-wrap { border:1px solid var(--op-border); border-radius:8px; overflow:auto; background:var(--op-surface); }
.guardrail-secretary .secretary-table th,
.guardrail-secretary .secretary-postfinal-table th { position:sticky; top:0; z-index:3; background:var(--op-surface-2); }
.guardrail-secretary .secretary-table th,
.guardrail-secretary .secretary-table td,
.guardrail-secretary .secretary-postfinal-table th,
.guardrail-secretary .secretary-postfinal-table td { padding:8px 9px; }
.guardrail-secretary .status-btn,
.guardrail-secretary .secretary-status-btn { min-width:44px; min-height:44px; border-radius:7px; }
.guardrail-secretary .secretary14-checkhit { display:grid; place-items:center; width:44px; height:44px; margin:auto; cursor:pointer; border-radius:7px; }
.guardrail-secretary .secretary14-checkhit:hover { background:var(--op-surface-2); }
.guardrail-secretary .secretary14-checkhit input { width:20px; height:20px; margin:0; }
.guardrail-secretary .secretary14-unresolved { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:10px 0; padding:10px 12px; border:1px solid var(--op-border); border-left:3px solid var(--op-warning); border-radius:0 7px 7px 0; background:var(--op-warning-soft); }
.guardrail-secretary .secretary14-unresolved.is-clear { border-left-color:var(--op-accent); background:var(--op-accent-soft); }
.guardrail-secretary .secretary14-unresolved strong { display:block; }
.guardrail-secretary .secretary14-unresolved small { color:var(--op-muted); }
.guardrail-secretary .secretary14-focus { min-height:40px; border:1px solid var(--op-border); border-radius:7px; background:var(--op-surface); color:var(--op-text); padding:7px 10px; }
.guardrail-secretary .secretary14-unresolved-row { outline:2px solid var(--op-warning); outline-offset:-2px; }
.guardrail-secretary .secretary-final-card { border-radius:8px; box-shadow:none; }

/* ---------- Buttons / semantic states on redesigned pages ---------- */
.guardrail-access .btn,
.guardrail-qr-token .btn,
.guardrail-rekap .btn,
.guardrail-report .btn,
.guardrail-backup .btn,
.guardrail-delete .btn,
.guardrail-secretary .btn {
    border-radius:7px;
    box-shadow:none;
}
.guardrail-access button:disabled,
.guardrail-qr-token button:disabled,
.guardrail-rekap button:disabled,
.guardrail-report button:disabled,
.guardrail-backup button:disabled,
.guardrail-delete button:disabled,
.guardrail-secretary button:disabled { opacity:.48; cursor:not-allowed; }

@media (max-width: 900px) {
    .guardrail-dashboard .db14-class-head { display:none; }
    .guardrail-dashboard .db14-class-row {
        grid-template-columns:1fr repeat(4,minmax(44px,auto));
        grid-template-areas:
            "name name status open"
            "tw tl s i"
            "d tka . .";
        padding:4px;
    }
    .guardrail-dashboard .db14-class-name { grid-area:name; }
    .guardrail-dashboard .db14-status-cell { grid-area:status; }
    .guardrail-dashboard .db14-open-cell { grid-area:open; }
    .guardrail-dashboard .metric-tw { grid-area:tw; }
    .guardrail-dashboard .metric-tl { grid-area:tl; }
    .guardrail-dashboard .metric-s { grid-area:s; }
    .guardrail-dashboard .metric-i { grid-area:i; }
    .guardrail-dashboard .metric-d { grid-area:d; }
    .guardrail-dashboard .metric-tka { grid-area:tka; }
    .guardrail-dashboard .db14-metric::before { display:block; color:var(--op-muted); font-size:10px; font-weight:700; }
    .guardrail-dashboard .db14-metric[data-label]::before { content:attr(data-label); }

    .guardrail-rekap .rk17-filter-grid.op-filter-grid { grid-template-columns:1fr; }
    .guardrail-rekap .op-filter-group { border-right:0; border-bottom:1px solid var(--op-border); }
    .guardrail-rekap .op-filter-group:last-child { border-bottom:0; }
    .guardrail-report .la-filter { top:64px; }
    .guardrail-control .control14-row { grid-template-columns:100px 1fr auto; }
    .guardrail-control .control14-count { grid-column:3; grid-row:1; }
    .guardrail-control .control14-action { grid-column:2 / 4; width:max-content; }
    .guardrail-qr-token .qr14-qr-layout { grid-template-columns:1fr; }
}

@media (max-width: 720px) {
    .guardrail-landing .landing-modern { padding:14px; }
    .guardrail-landing .landing-modern-shell { gap:10px; }
    .guardrail-landing .landing-brand-panel { padding:16px; }
    .guardrail-landing .modern-role-card { min-height:66px; padding:11px 12px; }

    .guardrail-auth input,
    .guardrail-dashboard input,
    .guardrail-dashboard select,
    .guardrail-access input,
    .guardrail-access select,
    .guardrail-access textarea,
    .guardrail-qr-token input,
    .guardrail-qr-token select,
    .guardrail-rekap input,
    .guardrail-rekap select,
    .guardrail-report input,
    .guardrail-report select,
    .guardrail-backup input,
    .guardrail-delete input,
    .guardrail-secretary input,
    .guardrail-secretary select,
    .guardrail-secretary textarea { font-size:16px; }

    .guardrail-auth button,
    .guardrail-auth a.btn,
    .guardrail-dashboard button,
    .guardrail-dashboard a.btn,
    .guardrail-access button,
    .guardrail-access a.btn,
    .guardrail-qr-token button,
    .guardrail-qr-token a.btn,
    .guardrail-rekap button,
    .guardrail-rekap a.btn,
    .guardrail-report button,
    .guardrail-report a.btn,
    .guardrail-backup button,
    .guardrail-backup a.btn,
    .guardrail-delete button,
    .guardrail-delete a.btn,
    .guardrail-secretary button,
    .guardrail-secretary a.btn,
    .guardrail-tasks a { min-height:44px; }

    .guardrail-access .access14-drawer { width:100vw; max-width:none; border-left:0; }
    .guardrail-access .access14-page-head { align-items:flex-start; }
    .guardrail-qr-token .qr14-timebar,
    .guardrail-backup .backup14-status,
    .guardrail-delete .delete14-backup-status { grid-template-columns:1fr; }
    .guardrail-qr-token .qr14-timeitem,
    .guardrail-backup .backup14-status > div,
    .guardrail-delete .delete14-backup-status > div { border-right:0; border-bottom:1px solid var(--op-border); }
    .guardrail-qr-token .qr14-timeitem:last-child,
    .guardrail-backup .backup14-status > div:last-child,
    .guardrail-delete .delete14-backup-status > div:last-child { border-bottom:0; }
    .guardrail-backup .backup14-alt { grid-template-columns:1fr; }
    .guardrail-secretary .secretary14-context { top:64px; grid-template-columns:1fr; gap:3px; }
    .guardrail-secretary .secretary14-unresolved { align-items:flex-start; flex-direction:column; }
}
@media print {
    .guardrail-report .guardrail-report-canvas { border:0; padding:0; background:#fff; }
}

/* v1.4.14 operational refinements */
.guardrail-auth .auth-secondary-link a { display:inline-flex; align-items:center; min-height:44px; }
.guardrail-report .la-badge,
.guardrail-report .la-trigger,
.guardrail-report .la-pattern-badge,
.guardrail-report .la-attention-summary span,
.guardrail-report .la-role-pill { border-radius:6px; box-shadow:none; }
.guardrail-dashboard .db21-analysis-summary { display:flex; gap:0; overflow:auto; border:1px solid var(--op-border); border-radius:8px; background:var(--op-surface-2); }
.guardrail-dashboard .db21-analysis-card { flex:1 0 140px; min-height:auto; padding:10px 12px; border:0; border-right:1px solid var(--op-border); border-radius:0; background:transparent; box-shadow:none; }
.guardrail-dashboard .db21-analysis-card:last-child { border-right:0; }
.guardrail-dashboard .db21-dist { border-radius:7px; box-shadow:none; }
.guardrail-secretary .sidebar {
    background:var(--op-surface);
    border-right:1px solid var(--op-border);
    box-shadow:none;
    backdrop-filter:none;
}
.guardrail-secretary .sidebar nav a {
    min-height:42px;
    display:flex;
    align-items:center;
    border-radius:7px;
}
.guardrail-secretary .sidebar nav a:hover { background:var(--op-surface-2); }
.guardrail-secretary .sidebar nav a.active { background:var(--op-accent-soft); border-color:color-mix(in srgb,var(--op-accent) 50%,transparent); }
@media (max-width:720px) {
    .guardrail-secretary .sidebar nav a { min-height:44px; }
}
.guardrail-rekap .rk17-filter-grid.op-filter-grid { grid-template-columns:1.1fr 1fr 1fr !important; }
@media (max-width:900px) {
    .guardrail-rekap .rk17-filter-grid.op-filter-grid { grid-template-columns:1fr !important; }
}
.guardrail-access .access-card { border-radius:8px; box-shadow:none; }
.guardrail-access .access-tabs { display:flex; gap:4px; padding:4px; border:1px solid var(--op-border); border-radius:8px; background:var(--op-surface-2); }
.guardrail-access .access-tab { border-radius:6px; box-shadow:none; }
.guardrail-access .access-badge,
.guardrail-access .scope-pill { border-radius:6px; box-shadow:none; }
.guardrail-dashboard .db21-date-form { border-radius:8px; box-shadow:none; background:var(--op-surface); border-color:var(--op-border); }
.guardrail-dashboard .db21-dist { background:var(--op-surface-2); border:1px solid var(--op-border); }

/* v1.4.37 — secret field checkbox control */
.guardrail-auth .secret-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    margin-top: 7px;
    color: var(--op-muted);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
    cursor: pointer;
    user-select: none;
}
.guardrail-auth .secret-checkbox input[type="checkbox"] {
    width: 17px;
    height: 17px;
    min-height: 17px;
    margin: 0;
    padding: 0;
    flex: 0 0 17px;
    accent-color: var(--op-info);
    cursor: pointer;
}
.guardrail-auth .secret-checkbox:hover span { color: var(--op-text); }
.guardrail-auth .secret-checkbox:focus-within {
    outline: 2px solid color-mix(in srgb, var(--op-info) 70%, transparent);
    outline-offset: 3px;
    border-radius: 4px;
}
@media (max-width: 600px) {
    .guardrail-auth .secret-checkbox {
        min-height: 36px;
        font-size: 14px;
    }
    .guardrail-auth .secret-checkbox input[type="checkbox"] {
        width: 19px;
        height: 19px;
        min-height: 19px;
        flex-basis: 19px;
    }
}