.tm-body {
    background: #f4f7fb;
    color: #1f2937;
    min-height: 100vh;
}

.tm-header {
    background: #ffffff;
}

.tm-brand span {
    letter-spacing: 0.2px;
}

.tm-main {
    padding: 2.5rem 0 3rem;
}

.tm-card {
    border: 0;
    border-radius: 16px;
    box-shadow: 0 18px 45px -36px rgba(15, 23, 42, 0.55);
}

.tm-kpi {
    border-radius: 14px;
    background: linear-gradient(145deg, #0f4c81, #0b2f55);
    color: #fff;
    padding: 1rem;
}

.tm-kpi__label {
    display: block;
    opacity: 0.82;
    font-size: 0.85rem;
}

.tm-kpi__value {
    display: block;
    font-size: 1.6rem;
    font-weight: 700;
}

.tm-table-wrap {
    background: #fff;
    border-radius: 14px;
    padding: 1rem;
    box-shadow: 0 18px 45px -36px rgba(15, 23, 42, 0.45);
}

.tm-login-card {
    width: 100%;
    max-width: 420px;
    border: 0;
    border-radius: 16px;
    box-shadow: 0 20px 50px -35px rgba(15, 23, 42, 0.6);
}

.tm-react-panel {
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 18px 45px -36px rgba(15, 23, 42, 0.55);
    padding: 1.25rem;
}

.tm-home-logo {
    width: 72px;
    height: 72px;
}

.tm-code {
    background: #0f172a;
    color: #dbeafe;
    border-radius: 10px;
    padding: 0.75rem;
    font-size: 0.875rem;
    overflow-x: auto;
}