/* ============================================================
   KTOP Mobile UX Pack — 2026-07-15
   적용 범위: 화면 너비 900px 이하만 적용
   PC 레이아웃/인쇄 CSS에는 영향 없음
   ============================================================ */

@media screen and (max-width: 900px) {
  :root {
    --ktop-mobile-gap: 10px;
    --ktop-mobile-radius: 14px;
    --ktop-mobile-touch: 44px;
    --ktop-mobile-header: 66px;
    --ktop-mobile-safe-top: env(safe-area-inset-top, 0px);
    --ktop-mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
  }

  html {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-behavior: smooth;
  }

  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
    background: #eef4f9 !important;
    padding-bottom: var(--ktop-mobile-safe-bottom);
  }

  body.mobileNavOpenV20260715 {
    overflow: hidden !important;
    touch-action: none;
  }

  button,
  input,
  select,
  textarea,
  a,
  [role="button"] {
    -webkit-tap-highlight-color: transparent;
  }

  input,
  select,
  textarea {
    min-width: 0;
    max-width: 100% !important;
    font-size: 16px !important;
  }

  textarea {
    line-height: 1.55;
    resize: vertical;
  }

  input[type="date"],
  input[type="time"],
  input[type="datetime-local"] {
    min-height: var(--ktop-mobile-touch) !important;
  }

  img,
  video,
  canvas,
  iframe {
    max-width: 100%;
  }

  /* 앱 기본 구조 */
  .appLayout {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 100dvh !important;
  }

  .workArea {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    overflow: visible !important;
  }

  .commandStrip {
    display: none !important;
  }

  .siteWatermark {
    left: 0 !important;
    top: var(--ktop-mobile-header) !important;
    opacity: .4 !important;
  }

  .siteWatermark img {
    width: min(76vw, 360px) !important;
    opacity: .055 !important;
  }

  /* 모바일 메뉴 드로어 */
  .sideNav {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    width: min(84vw, 318px) !important;
    min-width: min(84vw, 318px) !important;
    max-width: min(84vw, 318px) !important;
    height: 100dvh !important;
    padding-top: var(--ktop-mobile-safe-top) !important;
    transform: translate3d(-105%, 0, 0) !important;
    transition: transform .24s cubic-bezier(.2,.75,.2,1) !important;
    z-index: 10020 !important;
    box-shadow: 18px 0 48px rgba(3, 18, 38, .28) !important;
    overflow: hidden !important;
  }

  .sideNav.open {
    transform: translate3d(0, 0, 0) !important;
  }

  .sideNav.open::after {
    content: none !important;
    display: none !important;
  }

  .sideBrand {
    min-height: 74px !important;
    padding: 12px 16px !important;
    justify-content: flex-start !important;
    gap: 12px !important;
  }

  .sideBrandSymbol {
    width: 48px !important;
    height: 48px !important;
    object-fit: contain !important;
  }

  .sideBrandText {
    display: block !important;
  }

  .sideBrandText strong {
    display: block !important;
    color: #fff !important;
    font-size: 18px !important;
    line-height: 1.05 !important;
  }

  .sideMenu {
    height: calc(100dvh - 74px - var(--ktop-mobile-safe-top)) !important;
    padding: 10px 10px calc(22px + var(--ktop-mobile-safe-bottom)) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  .navItem {
    min-height: 48px !important;
    height: auto !important;
    margin: 0 0 5px !important;
    padding: 11px 14px !important;
    border-radius: 13px !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
  }

  .mobileNavBackdropV20260715 {
    position: fixed;
    inset: 0;
    display: block;
    background: rgba(3, 14, 30, .52);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility .2s ease;
    z-index: 10010;
    backdrop-filter: blur(2px);
  }

  .mobileNavBackdropV20260715.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  /* 상단 헤더 */
  .workHeader {
    position: sticky !important;
    top: 0 !important;
    z-index: 3000 !important;
    width: 100% !important;
    min-height: var(--ktop-mobile-header) !important;
    height: auto !important;
    padding: calc(9px + var(--ktop-mobile-safe-top)) 10px 9px !important;
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 8px !important;
    background: rgba(255,255,255,.97) !important;
    border-bottom: 1px solid #d7e3ef !important;
    box-shadow: 0 5px 20px rgba(14, 43, 73, .08) !important;
    backdrop-filter: blur(12px) !important;
  }

  .hamburger {
    display: inline-flex !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 21px !important;
    box-shadow: none !important;
  }

  .workHeader > div:nth-child(2) {
    min-width: 0 !important;
  }

  .workHeader h2 {
    margin: 0 !important;
    font-size: clamp(17px, 5vw, 21px) !important;
    line-height: 1.22 !important;
    font-weight: 900 !important;
    letter-spacing: -.45px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .workHeader p {
    display: none !important;
  }

  .userPanel {
    grid-column: 1 / -1 !important;
    width: calc(100% + 2px) !important;
    margin: 1px -1px 0 !important;
    padding: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    border-radius: 12px !important;
    background: #f5f9fd !important;
  }

  .userPanel::-webkit-scrollbar {
    display: none;
  }

  .userPanel > span {
    flex: 0 0 auto !important;
    max-width: 190px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    padding: 0 7px !important;
    font-size: 12px !important;
  }

  .userPanel .btn,
  .userPanel button {
    flex: 0 0 auto !important;
    min-width: max-content !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 10px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    box-shadow: none !important;
  }

  /* 페이지/패널 */
  .pageSection {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 10px 8px calc(32px + var(--ktop-mobile-safe-bottom)) !important;
    overflow-x: clip !important;
  }

  .pageSection > * {
    min-width: 0 !important;
    max-width: 100%;
  }

  .panel,
  [class*="Panel"] {
    max-width: 100%;
  }

  .panel {
    margin-bottom: 10px !important;
    border-radius: var(--ktop-mobile-radius) !important;
    box-shadow: 0 4px 16px rgba(20, 51, 82, .07) !important;
    overflow: visible !important;
  }

  .panelHead,
  .panelSubHeadV20260710,
  .docArchiveBoardHeadV348,
  .eduCompletionImportHeadV20260715,
  .centerWeatherHeadV296,
  .safetyRateHead,
  .dashboardVideoHeadV280 {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    padding: 12px !important;
  }

  .panelHead h3,
  .panelSubHeadV20260710 h3 {
    font-size: 17px !important;
    line-height: 1.3 !important;
    word-break: keep-all !important;
  }

  .panelHead p,
  .panelSubHeadV20260710 p {
    font-size: 12px !important;
    line-height: 1.55 !important;
  }

  .headActions,
  .toolbarBtns,
  .btnRow,
  .rowActions,
  .actionRow,
  .cardActions,
  .eduApprovalActions,
  .activityApprovalActions,
  .hazardImpApprovalActionsV20260710,
  .adminPanelActionsV376,
  .risk2026ActionsV384,
  .centerWeatherActionsV377CV,
  .safetySignsToolbarV381 {
    width: 100% !important;
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    align-items: stretch !important;
    gap: 7px !important;
  }

  .headActions > *,
  .toolbarBtns > *,
  .btnRow > *,
  .rowActions > *,
  .actionRow > *,
  .cardActions > *,
  .eduApprovalActions > *,
  .activityApprovalActions > *,
  .hazardImpApprovalActionsV20260710 > *,
  .adminPanelActionsV376 > *,
  .risk2026ActionsV384 > *,
  .centerWeatherActionsV377CV > *,
  .safetySignsToolbarV381 > * {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  .headActions input,
  .headActions select,
  .toolbarBtns input,
  .toolbarBtns select {
    grid-column: 1 / -1;
  }

  .btn,
  .miniBtn,
  button:not(.navItem):not(.tickerBtn) {
    min-height: var(--ktop-mobile-touch) !important;
    height: auto !important;
    padding: 9px 12px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    word-break: keep-all !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .btn:hover,
  .miniBtn:hover,
  button:hover {
    transform: none !important;
  }

  .btn.small,
  .btn.tiny,
  .miniBtn {
    min-height: 40px !important;
    height: auto !important;
    padding: 8px 10px !important;
  }

  /* 입력 폼 공통 */
  .eduGrid2,
  .eduGrid4,
  .eduWorkGrid,
  .tbmWorkGrid,
  .activityWorkGrid,
  .activityFormGrid,
  .activityFormGrid2,
  .riskFormGrid,
  .risk2026FormGridV384,
  .hazardImpFormGridV20260710,
  .hazardImpPhotoGridV20260710,
  .adminFormGrid,
  .homeNoticeAdminGridV377DM,
  .adminVideoGridV281,
  .bulkPdfFilterGridV278,
  .fireLawSearchGridV377q,
  .eduCompletionUploadGridV20260716,
  .eduCompletionImportControlsV20260715,
  .accountsLayoutV283,
  .docArchiveLayoutV348,
  .myPageGrid,
  .adminGrid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .eduInline {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 7px !important;
  }

  label,
  .formLabel {
    min-width: 0 !important;
  }

  label > span,
  .formLabel > span {
    margin-bottom: 5px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  select,
  textarea {
    width: 100% !important;
    min-height: var(--ktop-mobile-touch) !important;
    border-radius: 11px !important;
    padding-left: 11px !important;
    padding-right: 11px !important;
  }

  input[type="file"] {
    width: 100% !important;
    min-height: var(--ktop-mobile-touch) !important;
    padding: 8px !important;
    border-radius: 11px !important;
  }

  .inputCenterBar,
  .filterBar,
  .filterRow,
  .riskArchiveFilter,
  .msdsDocFilter,
  .hazardImpFilterV20260710,
  .adminDocAuthorFiltersV377DV,
  .accountBulkToolbarV377CS,
  .accountFilterActionsV377CT,
  .uploadLine,
  .reflectGrid,
  .searchGrid,
  .lawGrid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
    gap: 8px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .inputCenterBar > *,
  .filterBar > *,
  .filterRow > *,
  .riskArchiveFilter > *,
  .msdsDocFilter > *,
  .hazardImpFilterV20260710 > *,
  .uploadLine > *,
  .reflectGrid > *,
  .searchGrid > *,
  .lawGrid > * {
    width: 100% !important;
    min-width: 0 !important;
  }

  .eduHelpLine,
  .hint,
  .warningNote,
  .inputHelpV377EB,
  .eduAutoNote,
  .accountBulkHintV377CS {
    margin: 8px 10px !important;
    padding: 11px 12px !important;
    border-radius: 11px !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
  }

  .empty {
    margin: 10px !important;
    padding: 22px 12px !important;
    border-radius: 12px !important;
  }

  /* 상단 모드 탭: 한 줄 가로 스크롤 */
  .eduModeTabsV284,
  .msdsTabBar,
  .riskTopTabs,
  .lawTopTabs,
  .fireLawTopTabsV377q,
  .modeTabs,
  .tabBar {
    width: 100% !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 7px !important;
    padding: 3px 2px 9px !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .eduModeTabsV284::-webkit-scrollbar,
  .msdsTabBar::-webkit-scrollbar,
  .riskTopTabs::-webkit-scrollbar,
  .lawTopTabs::-webkit-scrollbar,
  .fireLawTopTabsV377q::-webkit-scrollbar,
  .modeTabs::-webkit-scrollbar,
  .tabBar::-webkit-scrollbar {
    display: none;
  }

  .eduModeTabV284,
  .msdsTab,
  .riskTopTab,
  .fireLawTopTabV377q,
  .modeTab,
  .tabBtn {
    flex: 0 0 auto !important;
    min-width: max-content !important;
    min-height: 44px !important;
    padding: 9px 14px !important;
    white-space: nowrap !important;
  }

  /* 대시보드 */
  .disasterTicker {
    display: grid !important;
    grid-template-columns: auto minmax(0,1fr) !important;
    gap: 8px !important;
    min-height: 56px !important;
    margin-bottom: 10px !important;
    padding: 8px !important;
    border-radius: 14px !important;
  }

  .tickerBadge {
    min-width: 94px !important;
    padding: 0 10px !important;
  }

  .tickerBadgeEyebrow,
  .tickerScope,
  .tickerControls {
    display: none !important;
  }

  .tickerMain,
  .tickerViewport {
    min-width: 0 !important;
  }

  .centerWeatherPanelV296,
  .dashboardVideoPanelV280,
  .safetyRatePanel {
    margin-bottom: 10px !important;
    border-radius: 14px !important;
  }

  .centerWeatherGridV296,
  .summaryGrid,
  .integratedSummary,
  .safetyRateSummary,
  .myDocCountGrid,
  .mySignSummaryGrid,
  .adminHeroCards,
  .gptUsageStatsV380,
  .accountCenterSummaryV377CT {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 8px !important;
  }

  .centerWeatherCardV296,
  .summaryCard,
  .stat,
  .myDocCountGrid > *,
  .mySignSummaryGrid > * {
    min-width: 0 !important;
    padding: 12px !important;
  }

  .dashboardVideoBoxV280 iframe,
  .dashboardVideoBoxV280 video {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
  }

  .safetyRateTableWrap,
  .tableWrap,
  .excelInputWrap,
  .riskTableWrap,
  .risk2026TableWrapV384,
  .riskScoreTableWrap,
  .riskArchiveDetailTableWrap,
  .eduAttendeeList,
  .tbmList,
  .eduList,
  .recordDeleteRequestList,
  .adminDocAuthorTableV377DV,
  .adminOrphanTableWrapV248,
  .accountsUserListPanelV386,
  .docFileListV348 {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    position: relative;
  }

  .tableWrap,
  .excelInputWrap {
    padding: 8px !important;
    margin: 0 !important;
  }

  .dataTable,
  .excelInputTable,
  .risk2026TableV384,
  .riskScoreTable,
  .riskArchiveDetailTable,
  .safetyRateTable,
  .eduAttendanceTable {
    width: max-content !important;
    min-width: 760px !important;
  }

  table th,
  table td {
    font-size: 12px !important;
    line-height: 1.35 !important;
  }

  table th {
    position: relative;
  }

  .mobileScrollHintV20260715::after {
    content: "좌우로 밀어 전체 내용을 확인하세요";
    position: sticky;
    left: 8px;
    display: inline-flex;
    margin: 6px 0 2px 8px;
    padding: 5px 9px;
    border-radius: 999px;
    background: rgba(18, 75, 137, .92);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    pointer-events: none;
  }

  /* 검색/MSDS/법령 */
  .ktoSearchBanner,
  .regulationHero,
  .fireLawHeroV377q,
  .riskArchiveHero,
  .adminHero,
  .myPageHero,
  .bulkPdfHeroV278,
  .accountsHeroV283 {
    padding: 18px 14px !important;
    border-radius: 14px !important;
  }

  .ktoSearchBannerInner,
  .ktoMegaSearch,
  .regulationHeroSearch,
  .fireLawHeroV377q,
  .fireLawSplitV377q,
  .msdsDocWorkspace,
  .msdsDocSideLayoutV287,
  .chemicalDetailShell,
  .accountsMainV386 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .ktoSearchEmblem {
    display: none !important;
  }

  .ktoMegaControls,
  .regulationHeroSearch,
  .fireLawHeroActionsV377q {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .msdsDocCard,
  .msdsProductCard,
  .riskRecordCard,
  .eduListCard,
  .tbmListCard,
  .activityListCard,
  .hazardImpListCardV20260710,
  .deleteRequestCard {
    min-width: 0 !important;
    padding: 12px !important;
    border-radius: 13px !important;
  }

  .msdsDocActions,
  .riskRecordActions,
  .eduListActions,
  .tbmListActions,
  .activityListActions,
  .hazardImpListActionsV20260710,
  .deleteRequestActions {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 6px !important;
  }

  /* 위험성평가 */
  .riskGuideBox,
  .risk2026IntroV384,
  .risk2026NoticeV384,
  .riskActionRow,
  .riskScoreMethodBar,
  .hazardImpMethodBarV20260710,
  .hazardImpCheckGridV20260710 {
    grid-template-columns: 1fr !important;
  }

  .riskClassBoard,
  .riskArchiveSummary,
  .riskRecordList.compact {
    grid-template-columns: 1fr !important;
  }

  .risk2026PlanWorkBoxV392,
  .risk2026BuilderPanelV385 {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .riskEditableTable,
  .ocRiskTable,
  .hazardImpRiskTableV20260710 {
    min-width: 720px !important;
  }

  /* 교육일지 / TBM / 안전보건활동 / 위험개선활동 */
  .eduEditorPanel .panelHead,
  .tbmEditorPanel .panelHead,
  .activityEditorPanel .panelHead,
  .hazardImpEditorPanelV20260710 .panelSubHeadV20260710 {
    position: sticky !important;
    top: calc(var(--ktop-mobile-current-header, 112px) - 1px) !important;
    z-index: 120 !important;
    background: rgba(255,255,255,.97) !important;
    border-bottom: 1px solid #dbe6f1 !important;
    box-shadow: 0 7px 18px rgba(15, 47, 80, .08) !important;
    backdrop-filter: blur(10px) !important;
  }

  .eduEditorPanel .headActions,
  .tbmEditorPanel .headActions,
  .activityEditorPanel .headActions,
  .hazardImpTopActionsV20260710 {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scrollbar-width: none;
    padding-bottom: 2px !important;
  }

  .eduEditorPanel .headActions::-webkit-scrollbar,
  .tbmEditorPanel .headActions::-webkit-scrollbar,
  .activityEditorPanel .headActions::-webkit-scrollbar,
  .hazardImpTopActionsV20260710::-webkit-scrollbar {
    display: none;
  }

  .eduEditorPanel .headActions .btn,
  .tbmEditorPanel .headActions .btn,
  .activityEditorPanel .headActions .btn,
  .hazardImpTopActionsV20260710 .btn {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 84px !important;
    white-space: nowrap !important;
  }

  .eduFormPanel,
  .tbmFormPanel,
  .activityFormPanel,
  .hazardImpEditorPanelV20260710 {
    padding: 10px !important;
  }

  .eduPreviewPanel,
  .tbmPreviewPanel,
  .activityPreviewPanel,
  .hazardImpPrintPreviewV20260710 {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: auto !important;
    padding: 8px !important;
    border-radius: 12px !important;
    -webkit-overflow-scrolling: touch;
  }

  .eduPhotoPreview,
  .tbmPhotoPreview,
  .activityPhotoPreview,
  .hazardImpPhotoPreviewV20260710 {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .eduPhotoPreview img,
  .tbmPhotoPreview img,
  .activityPhotoPreview img,
  .hazardImpPhotoPreviewV20260710 img {
    width: 100% !important;
    max-height: 360px !important;
    object-fit: contain !important;
  }

  .eduApprovalSetup,
  .tbmAttendanceSetupV20260714,
  .hazardImpApprovalAreaV20260710,
  .activityApprovalSetup {
    padding: 10px !important;
    border-radius: 13px !important;
  }

  .eduApprovalEditor,
  .hazardImpApprovalEditorV20260710,
  .activityApprovalEditor {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .eduQrBox,
  .activityApprovalQrBox,
  .hazardImpApprovalQrBoxV20260710 {
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }

  .eduQrBox img,
  .activityApprovalQrBox img,
  .hazardImpApprovalQrBoxV20260710 img {
    max-width: 190px !important;
    height: auto !important;
  }

  .tbmWriteGuideV20260714 {
    margin: 8px !important;
    padding: 12px !important;
    display: grid !important;
    gap: 6px !important;
    font-size: 12px !important;
  }

  .tbmContentEditor textarea {
    min-height: 84px !important;
  }

  .activityPhotoSplitV346,
  .activityTextGrid,
  .activityScoreGrid,
  .hazardImpFrequencyBoxV20260710 {
    grid-template-columns: 1fr !important;
  }

  /* 목록 카드의 관리 버튼 */
  .eduList .rowActions,
  .tbmList .rowActions,
  .activityList .rowActions,
  .hazardImpListV20260710 .rowActions,
  .workStopList .rowActions {
    display: flex !important;
    width: auto !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
  }

  /* 작업중지 */
  .workStopWriteGrid,
  .workStopFormGrid,
  .workStopPhotoGrid {
    grid-template-columns: 1fr !important;
  }

  .mobileCameraBox {
    display: block !important;
  }

  .mobileCameraBtn {
    width: 100% !important;
  }

  /* 관리자/계정/서류보관함 */
  .adminHeroCards {
    display: grid !important;
  }

  .adminCreatePanel,
  .adminBulkCreatePanelV386,
  .accountsUserListPanelV386,
  .docArchiveMainV348,
  .docArchiveBoardsV348 {
    min-width: 0 !important;
  }

  .adminFormActions,
  .bulkUploadRowV386,
  .bulkOptionsV385,
  .compactOptionsV386,
  .docArchiveSearchV348 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  /* 모달: 모바일 전체화면 + 하단 안전영역 */
  .modal,
  [class*="ModalV"],
  .approvalDocModalV387,
  .hazardImpDocModalV20260714 {
    padding: 0 !important;
    align-items: stretch !important;
  }

  .modalCard,
  [class*="ModalCard"],
  .approvalDocModalPanelV387,
  .hazardImpDocModalV20260714 .approvalDocModalPanelV387 {
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    border-radius: 0 !important;
    padding-bottom: var(--ktop-mobile-safe-bottom) !important;
  }

  .modalHead,
  .approvalDocModalHeadV387,
  .eduCertificateModalHeadV20260716 {
    position: sticky !important;
    top: 0 !important;
    z-index: 20 !important;
    padding: calc(10px + var(--ktop-mobile-safe-top)) 12px 10px !important;
    background: rgba(255,255,255,.98) !important;
    backdrop-filter: blur(10px) !important;
  }

  .approvalDocModalFootV387,
  .modalFoot,
  .modalFooter {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 20 !important;
    padding: 8px 10px calc(8px + var(--ktop-mobile-safe-bottom)) !important;
    background: rgba(255,255,255,.98) !important;
    backdrop-filter: blur(10px) !important;
  }

  .approvalDocModalBodyV387,
  .modalBody,
  .eduCertificateModalListV20260716 {
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* A4 미리보기는 mobile-optimizer.js가 실제 폭에 맞게 축소 */
  .mobileDocumentFitHostV20260715 {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-align: left !important;
  }

  .mobileDocumentFitV20260715 {
    transform-origin: top left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

}

@media screen and (max-width: 900px) and (orientation: landscape) and (max-height: 520px) {
  .workHeader {
    position: relative !important;
  }

  .eduEditorPanel .panelHead,
  .tbmEditorPanel .panelHead,
  .activityEditorPanel .panelHead,
  .hazardImpEditorPanelV20260710 .panelSubHeadV20260710 {
    top: 0 !important;
  }

  .userPanel {
    display: none !important;
  }
}

@media screen and (max-width: 560px) {
  .centerWeatherGridV296,
  .summaryGrid,
  .integratedSummary,
  .safetyRateSummary,
  .myDocCountGrid,
  .mySignSummaryGrid,
  .adminHeroCards,
  .gptUsageStatsV380,
  .accountCenterSummaryV377CT {
    grid-template-columns: 1fr !important;
  }

  .headActions,
  .toolbarBtns:not(.hazardImpTopActionsV20260710),
  .btnRow,
  .actionRow,
  .cardActions,
  .eduApprovalActions,
  .activityApprovalActions,
  .hazardImpApprovalActionsV20260710,
  .adminPanelActionsV376,
  .risk2026ActionsV384,
  .centerWeatherActionsV377CV,
  .safetySignsToolbarV381 {
    grid-template-columns: 1fr !important;
  }

  .eduInline {
    grid-template-columns: 1fr !important;
  }

  .workHeader {
    grid-template-columns: 44px minmax(0,1fr) !important;
  }

  .userPanel > span {
    max-width: 140px !important;
  }

  .pageSection {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
}

/* V20260724: 교육일지 표형식 모바일 최적화 */
@media screen and (max-width:900px){
  .eduList.eduListTableMode{
    border-radius:13px !important;
    overflow:hidden !important;
  }
  .eduListSummary{
    padding:9px 11px !important;
  }
  .eduListTableWrap{
    overflow-x:auto !important;
    padding-bottom:2px;
  }
  .eduListTable{
    width:1040px !important;
    min-width:1040px !important;
  }
  .eduListTable th{
    position:static !important;
    height:38px !important;
    padding:7px 7px !important;
    font-size:11px !important;
  }
  .eduListTable td{
    height:56px !important;
    padding:8px 7px !important;
    font-size:11px !important;
  }
  .eduListTable .eduColNo{width:42px !important;}
  .eduListTable .eduColCenter{width:135px !important;}
  .eduListTable .eduColDate{width:110px !important;}
  .eduListTable .eduColTitle{width:215px !important;}
  .eduListTable .eduColType{width:94px !important;}
  .eduListTable .eduColLocation{width:112px !important;}
  .eduListTable .eduColAttend{width:58px !important;}
  .eduListTable .eduColQr{width:66px !important;}
  .eduListTable .eduColStatus{width:76px !important;}
  .eduListTable .eduColManage{width:210px !important;}
  .eduTableActions{
    display:flex !important;
    width:auto !important;
    grid-template-columns:none !important;
    gap:4px !important;
    flex-wrap:nowrap !important;
  }
  .eduTableActions .btn{
    min-width:58px !important;
    height:28px !important;
    padding:0 7px !important;
    font-size:10px !important;
  }
  .eduCellTitle strong{
    -webkit-line-clamp:2;
  }
}
