* { box-sizing: border-box; }
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    margin: 0;
    color: #1c1e21;
    background: #f4f5f7;
}
.portal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 2rem;
    background: #0b1f3a;
    color: #fff;
}
.portal-brand {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    font-size: 1.25rem;
    letter-spacing: 0.02em;
}
.portal-nav { display: flex; gap: 1rem; align-items: center; }
.portal-nav a { color: #cfd8e3; text-decoration: none; }
.portal-nav a:hover { color: #fff; }
.portal-user { opacity: 0.75; font-size: 0.9rem; }
.portal-main {
    max-width: 960px;
    margin: 2rem auto;
    padding: 0 1.5rem 3rem;
}
.portal-footer {
    display: flex;
    gap: 1.5rem;
    justify-content: center;
    padding: 1.5rem;
    color: #6b7280;
    border-top: 1px solid #e5e7eb;
    background: #fff;
}
.portal-footer a { color: #374151; text-decoration: none; }
.status-message {
    background: #ecfdf5;
    border-left: 4px solid #10b981;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
}
.card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}
.card h2 { margin-top: 0; }
.licence-row, .device-row { border-top: 1px solid #e5e7eb; padding: 0.75rem 0; }
.licence-row:first-of-type, .device-row:first-of-type { border-top: none; padding-top: 0; }
.status-badge {
    display: inline-block;
    padding: 0.1rem 0.6rem;
    border-radius: 999px;
    font-size: 0.8rem;
    background: #e0e7ff;
    color: #3730a3;
}
.status-badge.grace { background: #fef3c7; color: #92400e; }
.status-badge.expired, .status-badge.suspended { background: #fee2e2; color: #991b1b; }
button, .btn {
    background: #0b1f3a;
    color: #fff;
    border: none;
    padding: 0.6rem 1.1rem;
    border-radius: 6px;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
}
button.secondary { background: #6b7280; }
button.danger { background: #b91c1c; }
.form-field { display: block; margin-bottom: 1rem; }
.form-field label { display: block; font-weight: 500; margin-bottom: 0.25rem; }
.form-field input, .form-field textarea, .form-field select {
    width: 100%;
    padding: 0.55rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font: inherit;
}
.form-field textarea { min-height: 6rem; }
.validation-summary, .field-error { color: #b91c1c; font-size: 0.9rem; }
table.data { width: 100%; border-collapse: collapse; }
table.data th, table.data td { padding: 0.5rem 0.75rem; text-align: left; border-bottom: 1px solid #e5e7eb; }
