:root {
    --app-bg: #f5f7fb;
    --app-card-radius: 18px;
}

html { -webkit-text-size-adjust: 100%; }
body {
    background: var(--app-bg);
    min-width: 320px;
    color: #1f2937;
}

.app-shell { padding-bottom: calc(82px + env(safe-area-inset-bottom)); }

.menu-card {
    border: 0;
    border-radius: var(--app-card-radius);
    box-shadow: 0 6px 24px rgba(15, 23, 42, .07);
    transition: transform .15s ease, box-shadow .15s ease;
    height: 100%;
}
.menu-card:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(15, 23, 42, .10); }
.menu-icon {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.45rem;
    background: #eef2ff;
}

.mobile-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1030;
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(10px);
    border-top: 1px solid #e5e7eb;
    padding-bottom: env(safe-area-inset-bottom);
}
.mobile-nav a {
    color: #64748b;
    text-decoration: none;
    font-size: .72rem;
    min-width: 64px;
    padding: 9px 4px;
}
.mobile-nav i { display: block; font-size: 1.25rem; line-height: 1.2; }

.login-card {
    max-width: 430px;
    width: 100%;
    border: 0;
    border-radius: 22px;
    box-shadow: 0 12px 45px rgba(15, 23, 42, .10);
}

.form-control, .form-select, .btn { min-height: 44px; }

@media (min-width: 768px) {
    .app-shell { padding-bottom: 32px; }
    .mobile-nav { display: none; }
}

@media (max-width: 374px) {
    .navbar-brand { font-size: .97rem; }
    .menu-card .card-body { padding: 1rem; }
}

/* Fase 2 - Equipamentos */
.min-w-0 { min-width: 0; }
.btn-icon { width: 44px; min-width: 44px; padding-left: 0; padding-right: 0; }
.metric-mini { background: #f8fafc; border: 1px solid #eef2f7; border-radius: 14px; padding: .65rem .25rem; }
.metric-mini strong { display: block; font-size: 1.1rem; line-height: 1.1; }
.metric-mini span { display: block; color: #64748b; font-size: .68rem; margin-top: .25rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.metric-card { background: #fff; border-radius: 16px; box-shadow: 0 4px 18px rgba(15,23,42,.06); padding: .9rem 1rem; height: 100%; }
.metric-card span { color: #64748b; display:block; font-size:.78rem; }
.metric-card strong { display:block; font-size:1.5rem; margin-top:.1rem; }
.mobile-list-item { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.9rem 0; border-bottom:1px solid #eef2f7; }
.mobile-list-item:last-child { border-bottom:0; }
.table > :not(caption) > * > * { padding-top: .8rem; padding-bottom: .8rem; }
.card-header:first-child { border-radius: var(--app-card-radius) var(--app-card-radius) 0 0; }
@media (max-width: 374px) {
    .metric-card { padding: .75rem; }
    .metric-card strong { font-size: 1.25rem; }
    .metric-mini span { font-size: .63rem; }
}

/* Fase 4 - Manutenções */
.part-mobile-card { border:1px solid #e9eef5; border-radius:16px; padding:1rem; margin-bottom:.75rem; background:#fff; }
.part-mobile-card:last-child { margin-bottom:0; }
.sticky-submit { position:sticky; bottom:calc(72px + env(safe-area-inset-bottom)); z-index:1010; }
.problem-text { white-space:normal; overflow-wrap:anywhere; }
@media (min-width:768px){ .sticky-submit { bottom:12px; } }
@media (max-width:374px){ .part-mobile-card { padding:.8rem; } .sticky-submit .btn { width:100%; } }

/* Fase 5 - Expedição */
@media (max-width: 374px) {
    .metric-card span { font-size: .68rem; }
    .metric-card strong { font-size: 1.05rem; }
}