* {
    letter-spacing: 0;
}

body {
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.client-logo-link {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 0.75rem;
    border-radius: 0.6rem;
    transition: opacity 150ms ease, transform 150ms ease;
}

.client-logo-link:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

.client-logo-frame {
    display: inline-flex;
    height: 2.5rem;
    width: 8.75rem;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 0;
}

.client-logo-image {
    max-height: 1.8rem;
    max-width: 100%;
    object-fit: contain;
}

@media (max-width: 520px) {
    .client-logo-frame {
        width: 6.8rem;
    }
}

.icon-button {
    display: inline-flex;
    height: 2.5rem;
    width: 2.5rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    border: 1px solid rgb(228 228 231);
    background: rgb(255 255 255);
    color: rgb(63 63 70);
    transition: border-color 150ms ease, color 150ms ease, transform 150ms ease;
}

.dark .icon-button {
    border-color: rgb(39 39 42);
    background: rgb(24 24 27);
    color: rgb(212 212 216);
}

.icon-button:hover {
    border-color: rgb(16 185 129);
    color: rgb(4 120 87);
    transform: translateY(-1px);
}

.field {
    width: 100%;
    border-radius: 0.5rem;
    border: 1px solid rgb(212 212 216);
    background: rgb(255 255 255);
    padding: 0.7rem 0.85rem;
    color: rgb(24 24 27);
    outline: none;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.field:focus {
    border-color: rgb(16 185 129);
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.16);
}

.dark .field {
    border-color: rgb(63 63 70);
    background: rgb(9 9 11);
    color: rgb(244 244 245);
}

.label {
    margin-bottom: 0.4rem;
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    color: rgb(82 82 91);
}

.dark .label {
    color: rgb(161 161 170);
}

.primary-button,
.secondary-button {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-radius: 0.5rem;
    padding: 0.7rem 1rem;
    font-size: 0.875rem;
    font-weight: 700;
    transition: transform 150ms ease, background 150ms ease, border-color 150ms ease;
}

.primary-button {
    border: 1px solid rgb(5 150 105);
    background: rgb(5 150 105);
    color: white;
}

.primary-button:hover,
.secondary-button:hover {
    transform: translateY(-1px);
}

.secondary-button {
    border: 1px solid rgb(228 228 231);
    background: rgb(255 255 255);
    color: rgb(63 63 70);
}

.dark .secondary-button {
    border-color: rgb(63 63 70);
    background: rgb(24 24 27);
    color: rgb(228 228 231);
}

.login-shell {
    display: flex;
    min-height: calc(100vh - 10rem);
    align-items: center;
    justify-content: center;
}

.login-card {
    display: grid;
    width: min(100%, 28rem);
    gap: 1.25rem;
    border-radius: 0.75rem;
    border: 1px solid rgb(228 228 231);
    background: rgb(255 255 255);
    padding: 1.5rem;
    box-shadow: 0 18px 45px -28px rgba(15, 23, 42, 0.45);
}

.dark .login-card {
    border-color: rgb(39 39 42);
    background: rgb(24 24 27);
}

.metric {
    border-radius: 0.5rem;
    border: 1px solid rgb(228 228 231);
    background: rgb(255 255 255);
    padding: 1rem;
    box-shadow: 0 18px 45px -28px rgba(15, 23, 42, 0.45);
}

.metric span {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    color: rgb(82 82 91);
}

.metric strong {
    margin-top: 0.25rem;
    display: block;
    font-size: 1.875rem;
    line-height: 2.25rem;
}

.dark .metric {
    border-color: rgb(39 39 42);
    background: rgb(24 24 27);
}

.dark .metric span {
    color: rgb(161 161 170);
}

.info-block {
    min-width: 0;
    border-radius: 0.5rem;
    border: 1px solid rgb(244 244 245);
    background: rgb(250 250 250);
    padding: 0.85rem;
}

.info-block dt {
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
    color: rgb(113 113 122);
}

.info-block dd {
    margin-top: 0.25rem;
    overflow-wrap: anywhere;
    font-size: 0.875rem;
    line-height: 1.35rem;
    color: rgb(39 39 42);
}

.dark .info-block {
    border-color: rgb(39 39 42);
    background: rgb(9 9 11);
}

.dark .info-block dd {
    color: rgb(228 228 231);
}

.condition-group {
    border-radius: 0.5rem;
    border: 1px solid rgb(228 228 231);
    background: rgb(255 255 255);
    padding: 1.25rem;
    box-shadow: 0 18px 45px -28px rgba(15, 23, 42, 0.45);
}

.condition-group-header,
.condition-row-top {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.condition-group-actions {
    display: flex;
    flex-shrink: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
}

.line-count-pill,
.year-filter-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    background: rgb(244 244 245);
    color: rgb(63 63 70);
    font-size: 0.875rem;
    font-weight: 700;
    min-height: 2rem;
    padding: 0.35rem 0.7rem;
}

.condition-year-filter {
    margin-bottom: 0.85rem;
}

.condition-year-filter p {
    margin-bottom: 0.35rem;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    color: rgb(82 82 91);
}

.year-filter-pill {
    border: 1px solid transparent;
    text-decoration: none;
    transition: border-color 150ms ease, color 150ms ease, background 150ms ease, transform 150ms ease;
}

.year-filter-pill:hover,
.year-filter-pill-active {
    border-color: rgb(16 185 129);
    background: rgb(236 253 245);
    color: rgb(4 120 87);
    transform: translateY(-1px);
}

.condition-row {
    border-radius: 0.5rem;
    border: 1px solid rgb(228 228 231);
    background: rgb(250 250 250);
    padding: 1rem;
}

.condition-row-copy {
    align-self: flex-start;
}

.dark .condition-group {
    border-color: rgb(39 39 42);
    background: rgb(24 24 27);
}

.dark .condition-row {
    border-color: rgb(39 39 42);
    background: rgb(9 9 11);
}

.dark .line-count-pill,
.dark .year-filter-pill {
    background: rgb(39 39 42);
    color: rgb(212 212 216);
}

.dark .condition-year-filter p {
    color: rgb(161 161 170);
}

.dark .year-filter-pill:hover,
.dark .year-filter-pill-active {
    border-color: rgb(16 185 129);
    background: rgba(6, 78, 59, 0.45);
    color: rgb(167 243 208);
}

@media (min-width: 1024px) {
    .condition-group-header,
    .condition-row-top {
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
    }

    .condition-group-actions {
        align-items: flex-end;
    }
}

.badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    border: 1px solid transparent;
    padding: 0.28rem 0.6rem;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1rem;
}

.badge-green {
    border-color: rgb(187 247 208);
    background: rgb(240 253 244);
    color: rgb(22 101 52);
}

.badge-amber {
    border-color: rgb(253 230 138);
    background: rgb(255 251 235);
    color: rgb(146 64 14);
}

.badge-red {
    border-color: rgb(254 202 202);
    background: rgb(254 242 242);
    color: rgb(153 27 27);
}

.badge-gray {
    border-color: rgb(228 228 231);
    background: rgb(244 244 245);
    color: rgb(82 82 91);
}

.badge-blue {
    border-color: rgb(191 219 254);
    background: rgb(239 246 255);
    color: rgb(30 64 175);
}

.dark .badge-green {
    border-color: rgba(34, 197, 94, 0.35);
    background: rgba(20, 83, 45, 0.45);
    color: rgb(187 247 208);
}

.dark .badge-amber {
    border-color: rgba(245, 158, 11, 0.35);
    background: rgba(120, 53, 15, 0.45);
    color: rgb(253 230 138);
}

.dark .badge-red {
    border-color: rgba(239, 68, 68, 0.35);
    background: rgba(127, 29, 29, 0.45);
    color: rgb(254 202 202);
}

.dark .badge-gray {
    border-color: rgb(63 63 70);
    background: rgb(39 39 42);
    color: rgb(212 212 216);
}

.dark .badge-blue {
    border-color: rgba(59, 130, 246, 0.35);
    background: rgba(30, 58, 138, 0.35);
    color: rgb(191 219 254);
}

.empty-state {
    display: flex;
    min-height: 12rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    border-radius: 0.5rem;
    border: 1px dashed rgb(212 212 216);
    background: rgb(255 255 255);
    padding: 2rem;
    text-align: center;
    color: rgb(82 82 91);
}

.dark .empty-state {
    border-color: rgb(63 63 70);
    background: rgb(24 24 27);
    color: rgb(161 161 170);
}

.mina-toolbar {
    margin-bottom: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    border-radius: 0.5rem;
    border: 1px solid rgb(228 228 231);
    background: rgb(255 255 255);
    padding: 0.85rem;
    box-shadow: 0 18px 45px -28px rgba(15, 23, 42, 0.45);
}

.mina-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.mina-toolbar-button {
    min-width: 10.5rem;
    white-space: nowrap;
}

.dark .mina-toolbar {
    border-color: rgb(39 39 42);
    background: rgb(24 24 27);
}

@media (min-width: 768px) {
    .mina-toolbar {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.pagination-bar {
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid rgb(228 228 231);
    background: rgb(255 255 255);
    padding: 0.85rem 1rem;
    color: rgb(82 82 91);
    font-size: 0.875rem;
    font-weight: 700;
    box-shadow: 0 18px 45px -28px rgba(15, 23, 42, 0.45);
}

.pagination-bar-bottom {
    margin-top: 1rem;
    margin-bottom: 0;
}

.pagination-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.pagination-current {
    border-radius: 0.5rem;
    background: rgb(244 244 245);
    padding: 0.7rem 0.85rem;
    color: rgb(63 63 70);
}

.pagination-disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.pagination-disabled:hover {
    transform: none;
}

.dark .pagination-bar {
    border-color: rgb(39 39 42);
    background: rgb(24 24 27);
    color: rgb(212 212 216);
}

.dark .pagination-current {
    background: rgb(39 39 42);
    color: rgb(212 212 216);
}

@media (min-width: 768px) {
    .pagination-bar {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.upload-modal {
    position: fixed;
    inset: 0;
    z-index: 70;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 200ms ease;
}

.upload-modal.hidden {
    display: none;
}

.upload-modal.is-visible {
    opacity: 1;
    pointer-events: auto;
}

.upload-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.48);
    backdrop-filter: blur(3px);
}

.upload-modal__panel {
    position: relative;
    width: min(94vw, 40rem);
    border-radius: 1rem;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: rgba(255, 255, 255, 0.98);
    padding: 1.25rem;
    box-shadow: 0 26px 60px -30px rgba(15, 23, 42, 0.5);
}

.dark .upload-modal__panel {
    border-color: rgba(63, 63, 70, 0.8);
    background: rgba(24, 24, 27, 0.98);
}

.upload-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.upload-modal__title {
    color: rgb(24 24 27);
    font-size: 1.05rem;
    font-weight: 800;
}

.dark .upload-modal__title {
    color: rgb(244 244 245);
}

.upload-modal__close {
    display: inline-flex;
    height: 2rem;
    width: 2rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid rgb(228 228 231);
    background: rgb(250 250 250);
    color: rgb(63 63 70);
    transition: border-color 150ms ease, color 150ms ease, transform 150ms ease;
}

.upload-modal__close:hover {
    border-color: rgb(16 185 129);
    color: rgb(4 120 87);
    transform: translateY(-1px);
}

.dark .upload-modal__close {
    border-color: rgb(63 63 70);
    background: rgb(39 39 42);
    color: rgb(212 212 216);
}

.upload-modal__description {
    margin-top: 0.65rem;
    color: rgb(82 82 91);
    font-size: 0.875rem;
    line-height: 1.5;
}

.dark .upload-modal__description {
    color: rgb(212 212 216);
}

.upload-modal__form {
    margin-top: 1rem;
    display: grid;
    gap: 0.85rem;
}

.upload-modal__field {
    display: grid;
    gap: 0.35rem;
}

.upload-modal__label {
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    color: rgb(82 82 91);
}

.dark .upload-modal__label {
    color: rgb(161 161 170);
}

.upload-modal__input {
    width: 100%;
    border-radius: 0.75rem;
    border: 1px solid rgb(212 212 216);
    background: rgb(250 250 250);
    color: rgb(24 24 27);
    font-size: 0.875rem;
    padding: 0.6rem 0.7rem;
    outline: none;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.upload-modal__input:focus {
    border-color: rgb(16 185 129);
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.16);
}

.dark .upload-modal__input {
    border-color: rgb(63 63 70);
    background: rgb(9 9 11);
    color: rgb(244 244 245);
}

.upload-modal__status {
    border-radius: 0.75rem;
    border: 1px solid transparent;
    padding: 0.65rem 0.75rem;
    font-size: 0.83rem;
    line-height: 1.4;
}

.upload-modal__status.is-info {
    border-color: rgba(16, 185, 129, 0.3);
    background: rgba(236, 253, 245, 0.9);
    color: rgb(4 120 87);
}

.dark .upload-modal__status.is-info {
    border-color: rgba(16, 185, 129, 0.35);
    background: rgba(6, 78, 59, 0.35);
    color: rgb(167 243 208);
}

.upload-modal__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.55rem;
}

.upload-modal__cancel,
.upload-modal__submit {
    border-radius: 0.65rem;
    padding: 0.6rem 0.9rem;
    font-size: 0.875rem;
    font-weight: 800;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease, transform 150ms ease;
}

.upload-modal__cancel {
    border: 1px solid rgb(228 228 231);
    background: rgb(255 255 255);
    color: rgb(63 63 70);
}

.upload-modal__submit {
    border: 1px solid rgb(5 150 105);
    background: rgb(5 150 105);
    color: white;
}

.upload-modal__cancel:hover,
.upload-modal__submit:hover {
    transform: translateY(-1px);
}

.dark .upload-modal__cancel {
    border-color: rgb(63 63 70);
    background: rgb(24 24 27);
    color: rgb(228 228 231);
}

.upload-modal__submit:disabled,
.upload-modal__cancel:disabled,
.upload-modal__close:disabled {
    opacity: 0.65;
    pointer-events: none;
}

body.upload-modal-open {
    overflow: hidden;
}

.backup-history-list {
    margin-top: 1rem;
    display: grid;
    max-height: min(55vh, 28rem);
    gap: 0.7rem;
    overflow-y: auto;
    padding-right: 0.15rem;
}

.backup-modal-actions {
    margin-top: 1rem;
}

.backup-history-item {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    border-radius: 0.75rem;
    border: 1px solid rgb(228 228 231);
    background: rgb(250 250 250);
    padding: 0.85rem;
}

.backup-history-name {
    overflow-wrap: anywhere;
    color: rgb(24 24 27);
    font-size: 0.875rem;
    font-weight: 800;
}

.backup-history-meta {
    margin-top: 0.25rem;
    color: rgb(82 82 91);
    font-size: 0.75rem;
    font-weight: 700;
}

.backup-history-empty {
    display: flex;
    min-height: 8rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-radius: 0.75rem;
    border: 1px dashed rgb(212 212 216);
    color: rgb(82 82 91);
    text-align: center;
}

.dark .backup-history-item {
    border-color: rgb(39 39 42);
    background: rgb(9 9 11);
}

.dark .backup-history-name {
    color: rgb(244 244 245);
}

.dark .backup-history-meta,
.dark .backup-history-empty {
    color: rgb(161 161 170);
}

.dark .backup-history-empty {
    border-color: rgb(63 63 70);
}

@media (min-width: 640px) {
    .backup-history-item {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.toast {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 60;
    max-width: 22rem;
    border-radius: 0.5rem;
    background: rgb(24 24 27);
    padding: 0.85rem 1rem;
    color: white;
    box-shadow: 0 18px 45px -24px rgba(15, 23, 42, 0.8);
}

.dark .toast {
    background: rgb(244 244 245);
    color: rgb(24 24 27);
}
