/* Responsive typography layer: respects device font scaling while keeping the UI compact. */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    font-size: clamp(14px, 0.92rem + 0.22vw, 17px);
    line-height: 1.5;
}

button,
input,
select,
textarea {
    font-size: max(16px, 1em);
    line-height: 1.35;
}

.topbar .brand strong {
    font-size: clamp(17px, 1rem + 1vw, 22px);
    line-height: 1.15;
}

.topbar .brand small {
    font-size: clamp(11px, .72rem + .3vw, 14px);
    line-height: 1.25;
}

.student-dashboard-v2,
.student-permit-page,
.permit-detail-shell,
.gate-control-shell {
    font-size: clamp(14px, 0.88rem + 0.18vw, 17px);
}

.student-greeting-card h1,
.student-permit-heading h1,
.permit-detail-topbar h1,
.gate-student-card h1 {
    font-size: clamp(1.45rem, 1.12rem + 3.4vw, 2.15rem);
    line-height: 1.12;
}

.student-section-heading h2,
.student-active-permit-card h2,
.student-quick-card h2,
.student-history-v2 h2,
.student-permit-form h2,
.permit-card-heading h2,
.gate-verification-sheet h2 {
    font-size: clamp(1.05rem, .92rem + 1.25vw, 1.45rem);
    line-height: 1.2;
}

.student-eyebrow,
.permit-detail-eyebrow,
.student-permit-heading p,
.student-card-topline span,
.student-section-heading span {
    font-size: clamp(.68rem, .6rem + .55vw, .82rem);
}

.student-permit-tabs a,
.student-quick-grid a,
.student-quick-grid button,
.student-button,
.permit-qr-expand,
.satpam-batch-tabs a,
.gate-bottom-nav a,
.bottom-nav a {
    font-size: clamp(.78rem, .7rem + .45vw, .95rem);
    line-height: 1.18;
}

.student-permit-form label > span,
.student-permit-participants > div > span,
.student-permit-upload > div > span,
.permit-detail-facts dt,
.gate-fact-grid small,
.gate-details-card dt {
    font-size: clamp(.78rem, .68rem + .42vw, .95rem);
}

.student-permit-form input:not([type=file]),
.student-permit-form select,
.student-permit-form textarea,
.permit-field input,
.permit-field select,
.permit-field textarea,
.gate-token-input input {
    min-height: clamp(48px, 2.75rem + 1.2vw, 58px);
    padding-block: .72em;
    font-size: max(16px, 1rem);
}

.student-permit-form textarea,
.permit-field textarea {
    min-height: clamp(112px, 7rem + 3vw, 156px);
}

.student-permit-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.student-permit-tabs a {
    min-height: clamp(50px, 3rem + 1.2vw, 64px);
    white-space: normal;
}

.student-permit-tabs a i {
    flex: 0 0 auto;
}

.student-permit-identity-row strong,
.student-history-copy strong,
.student-permit-identity-row span:not(.student-permit-avatar),
.student-history-copy small {
    white-space: normal;
    overflow-wrap: anywhere;
}

.student-permit-identity-row em {
    flex: 0 0 auto;
}

.student-stats-card strong,
.dashboard-stat strong,
.stat-value {
    font-size: clamp(1.4rem, 1.05rem + 2.2vw, 2rem);
    line-height: 1.08;
}

.student-stats-card span,
.student-permit-note span,
.student-empty-active-card p,
.permit-qr-body p,
.gate-action-hint,
.gate-security-note {
    font-size: clamp(.76rem, .68rem + .35vw, .92rem);
    line-height: 1.45;
}

.student-bottom-nav,
.bottom-nav,
.gate-bottom-nav {
    font-size: clamp(.72rem, .64rem + .38vw, .88rem);
}

@media (max-width: 390px) {
    .student-permit-tabs a {
        gap: 4px;
        padding-inline: 4px;
    }

    .student-permit-tabs a i {
        font-size: 1.05em;
    }

    .student-permit-grid,
    .student-permit-actions {
        grid-template-columns: 1fr;
    }

    .student-permit-actions a {
        min-height: 44px;
    }
}

@media (max-width: 350px) {
    .student-permit-tabs {
        grid-template-columns: 1fr;
    }
}