/* =========================================================
   Eroded Networks Admin Theme
   Visual-only cleanup: keeps existing PHP forms, endpoints and Steam auth untouched.
   ========================================================= */

:root {
    color-scheme: dark;
    --en-bg: #070912;
    --en-bg-2: #0d1322;
    --en-surface: rgba(19, 25, 39, 0.92);
    --en-surface-2: rgba(25, 33, 49, 0.94);
    --en-surface-3: rgba(35, 44, 62, 0.96);
    --en-border: rgba(164, 181, 210, 0.16);
    --en-border-strong: rgba(120, 92, 255, 0.38);
    --en-text: #f5f7fb;
    --en-muted: #a8b0c3;
    --en-dim: #737d92;
    --en-purple: #8b5cf6;
    --en-purple-2: #6d4aff;
    --en-cyan: #22d3ee;
    --en-blue: #38bdf8;
    --en-red: #ef4444;
    --en-red-2: #ff2d38;
    --en-green: #22c55e;
    --en-orange: #f59e0b;
    --en-radius: 18px;
    --en-radius-sm: 12px;
    --en-shadow: 0 18px 55px rgba(0, 0, 0, 0.42);
    --en-glow: 0 0 0 1px rgba(139, 92, 246, 0.18), 0 0 32px rgba(34, 211, 238, 0.08);
    --en-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* {
    box-sizing: border-box;
    transition: none;
}

html {
    min-height: 100%;
    background: var(--en-bg);
    scroll-behavior: smooth;
}

body {
    min-height: 100vh !important;
    margin: 0 !important;
    color: var(--en-text) !important;
    font-family: var(--en-font) !important;
    line-height: 1.55 !important;
    background:
        radial-gradient(circle at 11% 0%, rgba(139, 92, 246, 0.24), transparent 34rem),
        radial-gradient(circle at 91% 9%, rgba(34, 211, 238, 0.17), transparent 32rem),
        linear-gradient(115deg, #0a0813 0%, #0d1020 45%, #071923 100%) !important;
    background-attachment: fixed !important;
    overflow-x: hidden;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    background:
        linear-gradient(rgba(255,255,255,0.028) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.022) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: radial-gradient(circle at center, rgba(0,0,0,0.85), transparent 78%);
}

body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(139,92,246,0.08), transparent 35%, rgba(34,211,238,0.075));
    opacity: .95;
}

::selection {
    background: rgba(34, 211, 238, 0.32);
    color: #fff;
}

body.en-page-ready .content,
body.en-page-ready .container,
body.en-page-ready .page-container,
body.en-page-ready .profile-container,
body.en-page-ready .status-box,
body.en-page-ready .message {
    animation: enFadeUp .34s ease-out both;
}

@keyframes enFadeUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes enSoftPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(34,211,238,.0), var(--en-glow); }
    50% { box-shadow: 0 0 0 5px rgba(34,211,238,.045), var(--en-glow); }
}

@keyframes enStatusPulseGreen {
    0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,.2); }
    50% { box-shadow: 0 0 0 7px rgba(34,197,94,0); }
}

@keyframes enStatusPulseRed {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239,68,68,.24); }
    50% { box-shadow: 0 0 0 7px rgba(239,68,68,0); }
}

/* ---------- Shared layout ---------- */
.content,
.container,
.page-container,
.profile-container {
    width: min(1180px, calc(100% - 36px)) !important;
    max-width: 1180px !important;
    margin: 32px auto !important;
}

.content > h1:first-child,
.container > h1:first-child,
.page-container > h1:first-child,
.profile-container > h1:first-child,
.content > h2:first-child,
.container > h2:first-child,
.page-container > h2:first-child,
.profile-container > h2:first-child {
    margin-top: 0 !important;
}

h1, h2, h3, h4 {
    color: var(--en-text) !important;
    letter-spacing: -0.025em;
}

h1 {
    font-size: clamp(2rem, 4vw, 3.25rem) !important;
    line-height: 1.05 !important;
}

h2 {
    font-size: clamp(1.3rem, 2vw, 1.9rem) !important;
}

p,
li,
small,
.task-content,
.task-meta,
.profile-info,
.profile-details {
    color: var(--en-muted);
}

a {
    color: #dbeafe;
    text-decoration-color: rgba(34,211,238,.55);
    text-underline-offset: 3px;
}

a:hover {
    color: var(--en-cyan) !important;
}

/* ---------- Navbar ---------- */
.navbar,
.top-nav {
    position: sticky !important;
    top: 0 !important;
    z-index: 80 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    min-height: 68px !important;
    padding: 12px clamp(16px, 3vw, 34px) !important;
    color: var(--en-text) !important;
    background:
        linear-gradient(180deg, rgba(42, 49, 64, 0.96), rgba(19, 24, 35, 0.96)),
        linear-gradient(90deg, rgba(139,92,246,.16), rgba(34,211,238,.12)) !important;
    border-bottom: 1px solid var(--en-border-strong) !important;
    box-shadow: 0 12px 38px rgba(0,0,0,.34) !important;
    backdrop-filter: blur(16px);
}

.navbar::before,
.top-nav::before {
    content: "Eroded Networks Admin";
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    font-weight: 900;
    font-size: 1.05rem;
    letter-spacing: -0.02em;
    color: #fff;
    margin-right: 4px;
}

.nav-links,
.top-nav .nav-left {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    flex-wrap: wrap !important;
}

.nav-links a,
.top-nav .nav-left a,
.navbar a {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
    color: rgba(245,247,251,.76) !important;
    text-decoration: none !important;
    font-size: .94rem !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    border: 1px solid transparent !important;
    transition: transform .16s ease, background-color .16s ease, color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

.nav-links a:hover,
.top-nav .nav-left a:hover,
.navbar a:hover {
    color: #fff !important;
    transform: translateY(-1px);
    background: rgba(255,255,255,.06) !important;
    border-color: rgba(255,255,255,.1) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.2) !important;
}

.nav-links a.en-active,
.top-nav .nav-left a.en-active,
.navbar a.en-active {
    color: #fff !important;
    background: linear-gradient(90deg, rgba(139,92,246,.24), rgba(34,211,238,.15)) !important;
    border-color: rgba(139,92,246,.48) !important;
    box-shadow: inset 0 -2px 0 rgba(34,211,238,.85), 0 0 24px rgba(139,92,246,.12) !important;
}

.profile {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    position: relative !important;
    margin-left: auto !important;
    color: var(--en-muted) !important;
    font-weight: 800 !important;
}

.profile img,
.profile-pic,
.avatar-small {
    width: 42px !important;
    height: 42px !important;
    object-fit: cover !important;
    border-radius: 999px !important;
    border: 2px solid rgba(255,255,255,.1) !important;
    box-shadow: 0 0 0 3px rgba(139,92,246,.15), 0 10px 24px rgba(0,0,0,.35) !important;
}

.dropdown,
#logout-dropdown,
#profile-dropdown {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    right: 0 !important;
    min-width: 160px !important;
    padding: 8px !important;
    border-radius: 14px !important;
    background: rgba(13, 19, 34, .98) !important;
    border: 1px solid var(--en-border) !important;
    box-shadow: var(--en-shadow) !important;
    z-index: 120 !important;
}

.dropdown a,
#logout-dropdown a,
#profile-dropdown a {
    width: 100% !important;
    justify-content: flex-start !important;
}

/* ---------- Surfaces / cards ---------- */
.section,
.task-form,
.filter-bar,
.task-card,
.stat-card,
.system-summary,
.server-box,
.service-box,
.card,
.user-card,
.notification,
.form-card,
.warning-item,
.warning-form,
.warning-list,
.profile-header,
.risk-card,
.linked-section,
.scrollable-table,
.table-scroll,
.status-box,
.message,
.agreement,
.profile-container,
.page-container,
.container,
.report-card,
.modal-content {
    background:
        linear-gradient(135deg, rgba(139,92,246,.08), transparent 38%),
        linear-gradient(145deg, var(--en-surface), rgba(9, 17, 28, .94)) !important;
    border: 1px solid var(--en-border) !important;
    border-radius: var(--en-radius) !important;
    box-shadow: var(--en-shadow) !important;
}

.section,
.task-form,
.filter-bar,
.task-card,
.system-summary,
.server-box,
.service-box,
.card,
.user-card,
.notification,
.form-card,
.warning-item,
.warning-form,
.warning-list,
.profile-header,
.risk-card,
.linked-section,
.status-box,
.message,
.agreement {
    padding: clamp(18px, 2.2vw, 26px) !important;
}

.section:hover,
.task-card:hover,
.stat-card:hover,
.user-card:hover,
.card:hover,
.server-box:hover,
.service-box:hover,
.warning-item:hover {
    border-color: rgba(34,211,238,.28) !important;
    transform: translateY(-2px) !important;
    box-shadow: var(--en-shadow), 0 0 36px rgba(34,211,238,.06) !important;
}

.section,
.task-card,
.stat-card,
.user-card,
.card,
.server-box,
.service-box,
.warning-item,
button,
.btn,
a,
input,
select,
textarea {
    transition: transform .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease, color .16s ease !important;
}

.welcome {
    text-align: left !important;
    margin: 0 0 28px !important;
    padding: clamp(20px, 3vw, 34px) !important;
    border-radius: 24px !important;
    background:
        radial-gradient(circle at 12% 0%, rgba(139,92,246,.28), transparent 28rem),
        radial-gradient(circle at 90% 20%, rgba(34,211,238,.17), transparent 32rem),
        rgba(12,18,30,.86) !important;
    border: 1px solid rgba(139,92,246,.24) !important;
    box-shadow: var(--en-shadow) !important;
}

.welcome h1,
.welcome h2 {
    margin-bottom: 8px !important;
    background: linear-gradient(90deg, #fff, #dbeafe 50%, #67e8f9);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
}

.welcome p {
    margin: 0 !important;
    font-weight: 700;
}

/* ---------- Forms ---------- */
input,
textarea,
select {
    min-height: 42px !important;
    padding: 10px 13px !important;
    color: var(--en-text) !important;
    background: rgba(6, 10, 20, .74) !important;
    border: 1px solid rgba(164,181,210,.18) !important;
    border-radius: 12px !important;
    outline: none !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}

textarea {
    min-height: 92px !important;
    resize: vertical;
}

input:focus,
textarea:focus,
select:focus {
    border-color: rgba(34,211,238,.62) !important;
    box-shadow: 0 0 0 4px rgba(34,211,238,.09), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

input::placeholder,
textarea::placeholder {
    color: rgba(168,176,195,.58) !important;
}

label,
.form-group label {
    color: var(--en-muted) !important;
    font-weight: 850 !important;
    font-size: .9rem !important;
}

button,
.btn,
.button,
.redirect,
.back-link,
.maintenance-btn,
.delete-btn,
input[type="submit"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: auto !important;
    min-height: 40px !important;
    padding: 9px 15px !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 12px !important;
    color: #fff !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    background: linear-gradient(135deg, var(--en-purple), var(--en-cyan)) !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.26), 0 0 22px rgba(139,92,246,.14) !important;
}

button:hover,
.btn:hover,
.button:hover,
.redirect:hover,
.back-link:hover,
.maintenance-btn:hover,
.delete-btn:hover,
input[type="submit"]:hover {
    transform: translateY(-1px) !important;
    filter: brightness(1.08) !important;
}

button:active,
.btn:active,
.button:active,
.redirect:active,
.maintenance-btn:active,
.delete-btn:active {
    transform: translateY(0) scale(.99) !important;
}

button[name*="delete"],
button.delete-btn,
.btn-danger,
.decline,
.delete-link,
button[onclick*="delete" i] {
    background: linear-gradient(135deg, #dc2626, #f97316) !important;
}

.accept,
button[name="create_task"],
button[name="update_task"],
button[name="toggle_checklist"] {
    background: linear-gradient(135deg, #16a34a, #22d3ee) !important;
}

/* ---------- Data display ---------- */
.stats-grid,
.servers-container,
.user-cards-container,
.overview-grid,
.risk-grid,
.linked-users,
.cards-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 16px !important;
}

.stat-card {
    padding: 22px !important;
    text-align: left !important;
}

.stat-card h3 {
    margin: 0 0 8px !important;
    color: var(--en-muted) !important;
    font-size: .95rem !important;
    letter-spacing: .02em;
}

.stat-card p,
.summary-item p,
.value {
    color: #fff !important;
    font-weight: 950 !important;
}

.stat-card p {
    margin: 0 !important;
    font-size: 2rem !important;
    letter-spacing: -0.04em;
}

.status-row,
.stat-row,
.summary-item,
.linked-user,
.checklist-item,
.draggable {
    background: rgba(255,255,255,.035) !important;
    border: 1px solid rgba(255,255,255,.07) !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    margin: 8px 0 !important;
}

.status-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
}

.status-name {
    color: var(--en-text) !important;
    font-weight: 850 !important;
}

.status-badge,
.badge,
.tag,
.label,
.risk-badge,
.status,
.data-toggle,
.priority-Low,
.priority-Medium,
.priority-High,
.status-Completed,
.status-InProgress,
.status-ToDo {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    width: fit-content !important;
    min-height: 26px !important;
    padding: 5px 10px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    color: #fff !important;
    font-size: .78rem !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
}

.status-badge::before,
.status::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: currentColor;
}

.online,
.status-badge.online,
.status.Up,
.status-up,
.priority-Low,
.progress-bar.green {
    background: rgba(34,197,94,.16) !important;
    color: #86efac !important;
    border-color: rgba(34,197,94,.28) !important;
}

.online::before,
.status-badge.online::before {
    animation: enStatusPulseGreen 1.7s infinite;
}

.offline,
.status-badge.offline,
.status.Down,
.status-down,
.priority-High,
.value.danger {
    background: rgba(239,68,68,.17) !important;
    color: #fecaca !important;
    border-color: rgba(239,68,68,.34) !important;
}

.offline::before,
.status-badge.offline::before {
    animation: enStatusPulseRed 1.7s infinite;
}

.partial,
.priority-Medium,
.value.warn {
    background: rgba(245,158,11,.17) !important;
    color: #fde68a !important;
    border-color: rgba(245,158,11,.3) !important;
}

.status-Completed {
    background: rgba(34,197,94,.16) !important;
    color: #bbf7d0 !important;
}

.status-InProgress {
    background: rgba(56,189,248,.15) !important;
    color: #bae6fd !important;
}

.status-ToDo {
    background: rgba(148,163,184,.15) !important;
    color: #e2e8f0 !important;
}

/* ---------- Tables ---------- */
table,
.table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    overflow: hidden !important;
    color: var(--en-text) !important;
    background: rgba(8, 12, 22, .58) !important;
    border: 1px solid var(--en-border) !important;
    border-radius: 16px !important;
}

th,
td {
    padding: 12px 14px !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
    color: var(--en-muted) !important;
    vertical-align: top !important;
}

th {
    color: #fff !important;
    background: rgba(255,255,255,.055) !important;
    font-weight: 950 !important;
    text-align: left !important;
}

tr:hover td {
    background: rgba(34,211,238,.04) !important;
    color: #dbeafe !important;
}

tr:last-child td {
    border-bottom: 0 !important;
}

.scrollable-table,
.table-scroll {
    overflow: auto !important;
    padding: 0 !important;
}

/* ---------- Tasks ---------- */
.task-form form,
.filter-bar form,
.edit-form {
    display: grid !important;
    grid-template-columns: repeat(12, 1fr) !important;
    gap: 12px !important;
}

.task-form input,
.task-form textarea,
.task-form select,
.filter-bar input,
.filter-bar select,
.edit-form input,
.edit-form textarea,
.edit-form select {
    width: 100% !important;
    margin: 0 !important;
}

.task-form input,
.task-form textarea,
.edit-form input,
.edit-form textarea {
    grid-column: 1 / -1;
}

.task-form select,
.edit-form select {
    grid-column: span 4;
}

.task-form button,
.edit-form button,
.filter-bar button {
    grid-column: 1 / -1;
    justify-self: start;
}

.filter-bar input {
    grid-column: span 5;
}

.filter-bar select {
    grid-column: span 2;
}

.filter-bar button {
    grid-column: span 1;
    min-width: 92px;
}

.task-title {
    color: #fff !important;
    font-size: 1.15rem !important;
    font-weight: 950 !important;
    letter-spacing: -0.02em;
}

.task-meta {
    margin-top: 12px !important;
    color: var(--en-dim) !important;
}

.drag-area {
    background: rgba(0,0,0,.16) !important;
    border: 1px dashed rgba(164,181,210,.25) !important;
    border-radius: 16px !important;
}

.draggable {
    cursor: grab !important;
}

.draggable:active {
    cursor: grabbing !important;
}

.progress-ring {
    filter: drop-shadow(0 0 14px rgba(34,211,238,.12));
}

.progress-bg {
    stroke: rgba(148,163,184,.25) !important;
}

.progress-bar.red { stroke: #f87171 !important; }
.progress-bar.orange { stroke: #fbbf24 !important; }
.progress-bar.green { stroke: #4ade80 !important; }

.pagination {
    display: flex !important;
    gap: 10px !important;
    align-items: center !important;
    flex-wrap: wrap !important;
}

.pagination a,
.pagination span {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 38px !important;
    padding: 8px 13px !important;
    border-radius: 999px !important;
    border: 1px solid var(--en-border) !important;
    color: #fff !important;
    text-decoration: none !important;
    background: rgba(255,255,255,.05) !important;
}

.pagination a:hover,
.pagination .active,
.pagination .current {
    background: linear-gradient(135deg, rgba(139,92,246,.48), rgba(34,211,238,.28)) !important;
}

/* ---------- Profile/admin profile ---------- */
.profile-header {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    gap: 22px !important;
    align-items: center !important;
}

.profile-image,
.item-img {
    object-fit: cover !important;
    border-radius: 16px !important;
    border: 1px solid var(--en-border) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.3) !important;
}

.profile-image {
    width: 116px !important;
    height: 116px !important;
    border-radius: 28px !important;
}

.overview-column,
.profile-left,
.profile-right {
    min-width: 0 !important;
}

.modal {
    backdrop-filter: blur(12px);
    background: rgba(4,7,13,.72) !important;
}

.modal-content {
    max-width: 720px !important;
}

.close {
    color: #fff !important;
    opacity: .82;
}

/* ---------- Auth / NDA / standalone pages ---------- */
body.en-page-index,
body.en-page-logout,
body.en-page-nda,
body.en-page-backup_progress {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 100vh !important;
    padding: 28px !important;
}

body.en-page-index .container,
body.en-page-logout .message,
body.en-page-backup_progress .status-box {
    width: min(560px, 100%) !important;
    text-align: center !important;
    margin: 0 auto !important;
    padding: 34px !important;
    animation: enSoftPulse 4.5s ease-in-out infinite;
}

body.en-page-nda .container {
    width: min(980px, 100%) !important;
    max-height: calc(100vh - 56px) !important;
    overflow: auto !important;
}

.agreement {
    max-height: 58vh !important;
    overflow: auto !important;
    text-align: left !important;
    margin: 18px 0 !important;
}

body.en-page-index h1::before,
body.en-page-logout h1::before {
    content: "";
    display: block;
    width: 58px;
    height: 58px;
    margin: 0 auto 16px;
    border-radius: 18px;
    background:
        radial-gradient(circle at 35% 28%, #fff 0 8%, transparent 9%),
        linear-gradient(135deg, var(--en-purple), var(--en-cyan));
    box-shadow: 0 0 34px rgba(139,92,246,.28);
}

body.en-page-backup_progress #log-box {
    background: rgba(0,0,0,.42) !important;
    border: 1px solid var(--en-border) !important;
    border-radius: 14px !important;
    color: #dbeafe !important;
}

/* ---------- Reports / warnings ---------- */
.profile-container,
.warning-form,
.warning-list {
    text-align: left !important;
}

.profile-header img.profile-pic {
    width: 72px !important;
    height: 72px !important;
}

.buttons {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}

/* ---------- Inventory ---------- */
.item-img {
    width: 56px !important;
    height: 56px !important;
}

.delete-link {
    color: #fff !important;
    text-decoration: none !important;
}

/* ---------- Small scrollbar cleanup ---------- */
*::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

*::-webkit-scrollbar-track {
    background: rgba(255,255,255,.04);
}

*::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(139,92,246,.66), rgba(34,211,238,.52));
    border-radius: 999px;
    border: 2px solid rgba(7,9,18,.85);
}

/* ---------- Responsive ---------- */
@media (max-width: 850px) {
    .navbar,
    .top-nav {
        position: relative !important;
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    .navbar::before,
    .top-nav::before {
        margin-bottom: 2px;
    }

    .profile {
        margin-left: 0 !important;
    }

    .task-form form,
    .filter-bar form,
    .edit-form {
        grid-template-columns: 1fr !important;
    }

    .task-form input,
    .task-form textarea,
    .task-form select,
    .task-form button,
    .filter-bar input,
    .filter-bar select,
    .filter-bar button,
    .edit-form input,
    .edit-form textarea,
    .edit-form select,
    .edit-form button {
        grid-column: 1 / -1 !important;
    }

    .profile-header {
        grid-template-columns: 1fr !important;
        text-align: left !important;
    }

    table {
        font-size: .9rem !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}

/* Standalone report pages without the shared navbar */
body.en-page-reports > h2,
body.en-page-reports > form,
body.en-page-reports > p {
    width: min(1180px, calc(100% - 36px)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

body.en-page-reports > h2 {
    margin-top: 32px !important;
}

body.en-page-reports > form {
    display: flex !important;
    gap: 10px !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    padding: 18px !important;
    border-radius: var(--en-radius) !important;
    background: linear-gradient(145deg, var(--en-surface), rgba(9, 17, 28, .94)) !important;
    border: 1px solid var(--en-border) !important;
    box-shadow: var(--en-shadow) !important;
}

body.en-page-reports > form input {
    flex: 1 1 280px !important;
}