.mypage-compact-header, .mypage-compact-select, #mypageMobileMenu { display: none; }

@media (max-width: 1600px) {
  #myGoalStats { display: block; }
  #myChannelsSection .my-metric-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)) !important; }
  #myChannelsSection .my-metric-grid > div { min-width: 0; overflow-wrap: anywhere; }
  #myChannelsSection .my-goals-layout > .my-inner-card { min-height: 0 !important; }
}

@media (max-width: 1000px) {
  html.mypage-document, body.mypage-workspace-page { height: 100%; overflow: hidden; }
  body.mypage-workspace-page { padding: 0 !important; min-width: 0; }
  body.mypage-workspace-page .cs-sidebar ~ .container {
    margin-left: 52px !important;
    width: calc(100% - 52px) !important;
    height: 100dvh !important;
    padding: 12px 16px max(20px, env(safe-area-inset-bottom)) !important;
    transition: none;
  }
  .mypage-workspace-page :is(.unified-container, .main-content, .content-area) { min-width: 0; }
  .mypage-workspace-page .main-content { min-height: 0; }
  .mypage-workspace-page .content-area { padding: 16px; }
  .mypage-select-source { display: none !important; }
  .mypage-compact-header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
  .mypage-compact-title { font-size: 16px; font-weight: 700; white-space: nowrap; }
  .mypage-compact-select {
    display: block; min-width: 0; max-width: 100%; min-height: 44px;
    border: 1px solid var(--border-color); border-radius: 10px;
    background: var(--bg-primary); color: var(--text-primary);
    padding: 8px 30px 8px 12px; font: inherit; font-size: 16px;
    text-overflow: ellipsis; cursor: pointer;
  }
  #mypageSectionSelect { flex: 1; width: 0; }
  .mypage-compact-select:focus-visible, #mypageMobileMenu:focus-visible { outline: 2px solid #3b82f6; outline-offset: 2px; }
  body.dark-theme .mypage-compact-select { color-scheme: dark; }
  .info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .info-item, .info-value { min-width: 0; overflow-wrap: anywhere; }
  .history-filter-bar { gap: 8px; }
  #mypageHistorySelect { flex: 1; width: 0; }
  .history-items-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
  .history-card { min-width: 0; }
  .hist-pagination { flex-wrap: wrap; }
  #collectionsSection .items-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }
  #collectionsSection .section-header-content { flex-wrap: wrap; }
  #collectionsSection :is(.item-actions, [id$="SelectControlsBar"], [id$="SelectControls"]) { flex-wrap: wrap; gap: 8px; }
  #collectionsSection :is(.folder-item, .item-info) { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
  #collectionsSection .item-title { display: block; white-space: normal; overflow-wrap: anywhere; }
  .member-type-card :is(select, button), .history-delete-all-btn, .collection-action-btn { min-height: 44px; }
  .member-type-card select { min-width: 0; max-width: 100%; }
  #myChannelsSection .mc-toolbar { gap: 10px; }
  #mypageChannelSelect { width: 100%; }
  #myChannelsSection .mc-toolbar-sep { display: none; }
  #myChannelsSection [id$="Toolbar"] { width: 100%; }
  #myChannelsSection :is(input, select) { min-width: 0 !important; font-size: 16px !important; }
  #myChannelsSection .mc-toolbar :is(input, select, button) { min-height: 40px; }
  #mySmartHelpWrap > div, #myGoalsToolbar > div > div { left: auto !important; right: 0; transform: none !important; max-width: calc(100vw - 64px); }
  #myChannelsSection :is(#mySmartInput, #myGoalChannel, #myExecChannel) { flex: 1; width: 0 !important; }
  #myCompareToolbar select { flex: 1; width: 0 !important; }
  #myCompareStartBtn { flex-basis: 100%; }
  #myChannelsSection :is(.my-ch-list, .my-result-grid) { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
  #myChannelsSection :is(.my-compare-display, .my-stats-grid) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #myChannelsSection :is(.my-inner-card, .my-ch-card, .my-result-card) { min-width: 0; }
  #myChannelsSection :is(.my-card-title, .my-ch-actions, .my-ch-footer) { flex-wrap: wrap; gap: 8px; }
  #myChannelsSection :is(.my-ch-name, .my-compare-ch-name) { white-space: normal; overflow-wrap: anywhere; }
  #myChannelsSection .my-period-btns { flex-wrap: wrap; }
  #myChannelsSection .my-period-btn { min-height: 36px; }
  #myChannelsSection .my-calendar-grid { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
  #myChannelsSection .my-calendar-grid > div { min-width: 0; overflow-wrap: anywhere; }
  #myChannelsSection .my-compare-right .accordion-content { overflow-x: auto; }
  .ac-workspace :is(.ac-filter-tabs, .ac-buttons, .ac-hero-actions) { flex-wrap: wrap; }
  .ac-workspace .ac-campaign-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .ac-workspace :is(.ac-campaign-main, .ac-row-actions) { grid-column: 1 / -1; }
  .ac-workspace :is(.ac-row-actions, .ac-filterbar) { flex-wrap: wrap; }
  .ac-workspace :is(.ac-title, .ac-campaign-name) { overflow-wrap: anywhere; }
}

@media (max-width: 700px) {
  body.mypage-workspace-page .cs-sidebar ~ .container {
    margin-left: 0 !important; width: 100% !important;
    padding: 8px max(10px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left)) !important;
  }
  .mypage-workspace-page .cs-sidebar.collapsed { visibility: hidden; pointer-events: none; transform: translateX(-100%); }
  .mypage-workspace-page .cs-sidebar { height: 100dvh; max-width: 85vw; }
  .mypage-workspace-page .content-area { padding: 0; border: 0; background: transparent; }
  .mypage-compact-header { flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
  #mypageMobileMenu {
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; width: 44px; height: 44px; border: 1px solid var(--border-color);
    border-radius: 10px; background: var(--bg-primary); color: var(--text-primary); cursor: pointer;
  }
  #mypageMobileMenu svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; }
  #mypageSectionSelect { flex-basis: 100%; }
  .info-card { padding: 14px; }
  .info-grid { gap: 14px 10px; }
  .member-type-card { gap: 10px; }
  .member-type-card label { flex-basis: 100%; }
  .member-type-card select { flex: 1; width: 0; font-size: 16px; }
  .member-type-card button { flex-basis: 100%; }
  #collectionsSection :is(.section-header-content, .section-content) { padding: 12px; }
  #collectionsSection .section-header { padding: 0; }
  #collectionsSection .section-title { padding: 0; border: 0; font-size: 17px; }
  #collectionsSection .section-content { overflow-x: visible; }
  #collectionsSection :is([id$="SelectControlsBar"], [id$="SelectControls"]) { padding-inline: 12px !important; }
  #collectionsSection .collection-item { gap: 8px; }
  #collectionsSection :is(.item-actions button, .memo-actions button, .create-folder-btn, .folder-item) { min-height: 40px; }
  #collectionsSection .memo-textarea, .folder-modal-input { font-size: 16px; }
  .folder-modal-content { padding: 20px; max-height: calc(100dvh - 24px); overflow-y: auto; }
  #myChannelsSection, .ac-workspace { margin-top: 0; }
  #myChannelsSection .mc-toolbar { padding: 10px; }
  #myChannelsSection .my-inner-card { padding: 14px; }
  #myGoalStats .my-metric-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 148px), 1fr)) !important; }
  #myGoalStats .my-metric-grid > div > div:nth-child(2) { font-size: 1.1rem !important; }
  #myChannelsSection .my-ch-header { padding: 18px 14px 14px; gap: 12px; }
  #myChannelsSection .my-ch-thumb { width: 56px; height: 56px; border-radius: 12px; }
  #myChannelsSection .my-ch-badge { position: static; display: inline-block; margin-bottom: 6px; }
  #myChannelsSection .my-ch-stat { padding: 16px 8px; }
  #myChannelsSection .my-ch-stat-value { font-size: 17px; overflow-wrap: anywhere; }
  #myChannelsSection .my-ch-perf { padding-inline: 14px; }
  #myChannelsSection .my-intensity-btn { padding: 16px 6px; overflow-wrap: anywhere; }
  #myChannelsSection .my-compare-ch { flex-wrap: wrap; }
  #myChannelsSection .my-exec-summary > div:first-child { flex-wrap: wrap; gap: 12px; }
  #myChannelsSection .my-exec-values { flex-wrap: wrap; gap: 6px; }
  #my-sub-exec > div { padding: 10px !important; }
  #myExecCalendar > div:last-child { padding: 8px !important; }
  #myChannelsSection .my-calendar-grid > div { padding: 4px 2px !important; min-height: 0 !important; }
  #myChannelsSection .my-calendar-grid > div:nth-child(n + 8) { min-height: 72px !important; }
  #myChannelsSection .my-calendar-grid > div > div { flex-wrap: wrap; }
  .ac-workspace .ac-filter-tab { min-height: 40px; }
  .ac-workspace :is(input, select, textarea) { font-size: 16px; }
  .ac-workspace .ac-kpi { padding: 14px; }
}

@media (max-width: 380px) {
  .info-grid { grid-template-columns: minmax(0, 1fr); }
  #myChannelsSection .my-intensity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}