:root {
    --portal-primary: #0f6cbf;
    --portal-primary-soft: #dceeff;
    --portal-accent: #18a37c;
    --portal-warning: #d28a00;
    --portal-danger: #c64747;
    --portal-bg-a: #eef6ff;
    --portal-bg-b: #f7fbff;
    --portal-surface: #ffffff;
    --portal-text: #16324a;
    --portal-muted: #6f8398;
    --portal-border: #e2ecf4;
}

body {
    color: var(--portal-text);
}

.portal-page {
    padding-top: 5rem;
    padding-bottom: 7rem;
    min-height: 100vh;
    background:
        radial-gradient(1200px 500px at 10% -10%, #d8eaff 0%, transparent 55%),
        radial-gradient(1000px 500px at 90% -20%, #e6fff6 0%, transparent 50%),
        linear-gradient(180deg, var(--portal-bg-a) 0%, var(--portal-bg-b) 100%);
}

.portal-header {
    margin-bottom: 1rem;
}

.portal-title {
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 0.2rem;
}

.portal-subtitle {
    color: var(--portal-muted);
    font-size: 0.85rem;
}

.portal-chip {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 0.35rem 0.8rem;
    font-weight: 600;
    font-size: 0.75rem;
    background: var(--portal-primary-soft);
    color: var(--portal-primary);
}

.portal-card {
    border: 1px solid var(--portal-border);
    border-radius: 1rem;
    background: var(--portal-surface);
    box-shadow: 0 10px 20px rgba(6, 41, 77, 0.05);
    overflow: hidden;
}

.portal-card-head {
    background: linear-gradient(130deg, #0f6cbf 0%, #22a88a 100%);
    color: #fff;
    padding: 0.9rem 1rem;
}

.portal-stat-grid .portal-stat-box {
    background: #f8fbfe;
    border: 1px solid var(--portal-border);
    border-radius: 0.75rem;
    text-align: center;
    padding: 0.65rem 0.5rem;
}

.portal-stat-box small {
    color: var(--portal-muted);
}

.portal-stat-box .value {
    margin-top: 0.15rem;
    font-weight: 700;
}

.portal-soft {
    background: #f7fbff;
    border: 1px solid var(--portal-border);
    border-radius: 0.75rem;
}

.portal-empty {
    border: 1px dashed #b8d2ea;
    background: #f4f9ff;
    color: #51708f;
    border-radius: 0.9rem;
    padding: 1rem;
    text-align: center;
}

.portal-table thead th {
    background: #f4f9ff;
    color: #2c5577;
    font-size: 0.78rem;
}

.portal-table td {
    font-size: 0.82rem;
}