/* 설치된 OS 모바일 앱 전용. Electron·웹·메신저의 배치는 그대로 유지한다. */
html.honest-native-mobile {
    --fs-badge: 12px;
    --fs-meta: 13px;
    --fs-base: 15px;
    --fs-body: 16px;
    --fs-title: 18px;
    --topbar-h: 112px;
}
html.honest-native-mobile body { height: 100dvh; font-size: var(--fs-base); }
html.honest-native-mobile .app-body,
html.honest-native-mobile .main-content { min-height: 0; min-width: 0; }
html.honest-native-mobile .content-area {
    padding: 16px !important;
    padding-bottom: max(24px, env(safe-area-inset-bottom)) !important;
}

/* 계정·알림과 업무 탭을 두 줄로 나누어 폰·태블릿에서도 손가락 크기를 유지한다. */
html.honest-native-mobile .app-topbar {
    display: grid; grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: 56px 56px; height: auto; min-height: var(--topbar-h);
    padding: 0 12px !important; gap: 0;
}
html.honest-native-mobile .topbar-left { display: contents; }
html.honest-native-mobile .topbar-left > .w-px { display: none; }
html.honest-native-mobile .topbar-logo { grid-row: 1; grid-column: 1; padding: 0; min-width: 0; overflow: hidden; }
html.honest-native-mobile #sidebarLogoText {
    display: block; font-size: var(--fs-base); min-width: 0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
html.honest-native-mobile .topbar-right { display: none !important; }
html.honest-native-mobile .mobile-topbar-right {
    display: flex !important; grid-row: 1; grid-column: 2; gap: 8px; padding: 0;
}
html.honest-native-mobile .topbar-sections {
    grid-row: 2; grid-column: 1 / -1; width: 100%; min-width: 0;
    overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none;
    gap: 4px; scroll-padding-inline: 4px;
}
html.honest-native-mobile .app-topbar .topbar-section-btn {
    flex: 1 0 auto; min-width: 72px; height: 56px; padding: 0 12px;
    font-size: var(--fs-base); justify-content: center;
    transition: color .15s, background-color .15s, border-color .15s;
}
html.honest-native-mobile .app-topbar .topbar-section-btn svg { width: 20px; height: 20px; }
html.honest-native-mobile .mobile-topbar-icon {
    width: 48px; height: 48px; transition: color .12s, background-color .12s;
}
html.honest-native-mobile .mobile-topbar-icon svg { width: 22px; height: 22px; }
html.honest-native-mobile .mobile-user-dropdown {
    top: 56px; right: 12px; max-width: calc(100vw - 24px);
    max-height: calc(100dvh - 68px); overflow-y: auto;
}

/* 공통 탐색과 대화상자만 확대한다. 고정 행 높이를 쓰는 견적·지출 편집기는 별도 규칙이다. */
html.honest-native-mobile :is(.mobile-user-menu-item, .fin-mobile-nav-button, #finMobileMenu button,
    .fin-trs-tabs button, .approval-inbox-folders button, .os-modal button, .ctx-nav-item) {
    min-height: 48px; font-size: var(--fs-base);
}
html.honest-native-mobile :is(button, a, input, select, textarea) { touch-action: manipulation; }
html.honest-native-mobile :is(.os-modal, #loginOverlay) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="color"]), select, textarea) {
    min-height: 48px; font-size: var(--fs-body) !important; scroll-margin-block: 20px;
}
html.honest-native-mobile .os-modal-overlay { padding: 12px; }
html.honest-native-mobile .os-modal {
    max-height: calc(100dvh - 24px); max-width: 100%; min-height: 0;
}
html.honest-native-mobile .os-modal-body { min-height: 0; overscroll-behavior-y: contain; }
html.honest-native-mobile .os-modal-header h3 { font-size: var(--fs-title) !important; }
html.honest-native-mobile .os-modal-close { min-width: 48px; }
html.honest-native-mobile .os-modal-footer { flex-wrap: wrap; padding-bottom: max(12px, env(safe-area-inset-bottom)) !important; }

/* 큰 태블릿에서 마우스 호버가 없어도 보조 메뉴 이름을 읽을 수 있어야 한다. */
@media (min-width: 901px) {
    html.honest-native-mobile body.compact-sidebar .context-panel {
        width: 216px; transition: none; padding-bottom: 16px;
    }
    html.honest-native-mobile body.compact-sidebar .ctx-nav-item {
        font-size: var(--fs-base); height: auto; padding: 10px 12px; white-space: normal;
    }
    html.honest-native-mobile body.compact-sidebar .ctx-nav-item > *:not(svg) {
        opacity: 1; transform: none; pointer-events: auto;
    }
    html.honest-native-mobile body.compact-sidebar :is(.ctx-section-header, .v48-nav-group-toggle, .ctx-workspace-select) {
        opacity: 1; height: auto !important; padding: 12px !important;
    }
    html.honest-native-mobile body.compact-sidebar .compact-pin-btn { display: none; }
}
@media (max-width: 600px) {
    html.honest-native-mobile .content-area { padding-inline: 12px !important; }
    html.honest-native-mobile .os-modal-overlay { align-items: flex-end; }
}
/* 가로로 든 폰은 높이가 부족하다. 탐색과 계정은 한 줄에 두고 로고 자리만 비운다. */
@media (min-width: 601px) and (max-height: 500px) {
    html.honest-native-mobile { --topbar-h: 56px; }
    html.honest-native-mobile .app-topbar {
        grid-template-rows: 56px; height: 56px; border-bottom: 0;
        box-shadow: inset 0 -1px 0 var(--border);
    }
    html.honest-native-mobile .topbar-logo { display: none; }
    html.honest-native-mobile .topbar-sections { grid-row: 1; grid-column: 1; }
}
/* 키보드로 높이가 줄어도 입력 본문이 남도록 머리글·버튼의 여백만 줄인다. */
@media (max-height: 500px) {
    html.honest-native-mobile :is(.os-modal-header, .os-modal-footer) { padding: 8px 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
    html.honest-native-mobile :is(.os-modal, .os-modal-overlay, .context-panel, .topbar-section-btn) {
        animation: none !important; transition: none !important;
    }
}