/* Mobile product layout. Loaded after legacy module styles; desktop stays unchanged. */
/* Approved mobile workbench: real routes/state only, no prototype data. */
:root{--work-motion:180ms;--work-ease:cubic-bezier(.16,1,.3,1)}
.post-reader-dialog{min-width:0;overflow:hidden}
.post-reader-languages{display:block!important;flex-shrink:0;padding:0!important;border-radius:12px!important}
.post-reader-languages>summary{display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 14px;cursor:pointer;list-style:none}
.post-reader-languages>summary::-webkit-details-marker{display:none}
.post-reader-languages .publish-locale-title{font-size:13px}
.post-reader-languages .publish-locale-summary{font-size:12px;color:var(--muted)}
.post-reader-language-action{margin-left:auto;white-space:nowrap;font-size:13px;font-weight:600}
.post-reader-languages[open] .post-reader-language-action{color:var(--text)}
.post-reader-languages>.publish-locale-options{padding:4px 14px 10px;max-height:22dvh;overflow:auto}
.post-reader-languages>.publish-locale-help{padding:0 14px 12px;font-size:12px}
.post-reader-languages>summary:focus-visible{outline:2px solid var(--accent);outline-offset:-3px;border-radius:12px}
@media(prefers-reduced-motion:no-preference){
 .m-sheet.open,.assistant-floating{animation:work-panel-in 220ms var(--work-ease)}
 .nav-btn,.m-tab,.cs-rail-button,.btn{transition:background-color var(--work-motion),color var(--work-motion),border-color var(--work-motion),box-shadow var(--work-motion)}
 .btn:active:not(:disabled){transform:translateY(1px)}
}
@keyframes work-panel-in{from{opacity:.8;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:820px),(max-width:1024px) and (max-height:500px){
 #app{--bg:#f5f5f3;--surface:#fff;--accent:#ffcc33}
 #main-content{background:#f5f5f3;font-family:ui-rounded,'SF Pro Rounded','PingFang SC','Microsoft YaHei',system-ui,sans-serif}
 #app .dashboard-page{padding:20px 16px!important}
 #app .dashboard-page-title{font-size:25px!important;line-height:1.3;letter-spacing:-.02em}
 #app .dashboard-page-subtitle{font-size:13px;line-height:1.7}
 #app #main-content .dashboard-page-home .cs-staircase{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:stretch}
 #app .dashboard-page-home .cs-staircase .kb-stat{min-height:112px!important;height:auto!important;transform:none!important;padding:14px!important;border-radius:14px;border:1px solid var(--line);background:#fff!important;color:var(--text)!important;box-shadow:none!important}
 #app .dashboard-page-home .cs-staircase .kb-stat::before,#app .dashboard-page-home .cs-staircase .kb-stat::after{display:none!important}
 #app .dashboard-page-home .cs-staircase .label{color:var(--muted)!important;font-size:13px}
 #app .dashboard-page-home .cs-staircase a{color:var(--text)!important;display:inline-flex;align-items:center;min-height:44px;font-size:12px!important}
 #app .dashboard-page-home .cs-metric-note{font-size:12px;line-height:1.6}
 #app .cs-shortcut-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 #app .m-tabbar{background:#fff!important;border-top:1px solid var(--line);box-shadow:none!important;backdrop-filter:none!important}
 #app .m-tab.active{color:#222321!important;background:#fff2c8;border-radius:12px}
 #app .post-reader-dialog{width:100%!important;height:100dvh!important;max-height:100dvh;border-radius:0!important}
 #app .post-reader-languages{margin:0 12px 8px!important}
 #app .post-reader-languages>summary{gap:8px;padding:8px 10px;flex-wrap:wrap}
 #app .post-reader-languages .publish-locale-title{font-size:12px}
 #app .post-reader-languages>.publish-locale-options{max-height:18dvh}
 #app .post-reader-languages>.publish-locale-help{max-height:9dvh;overflow:auto}
}
@media(prefers-reduced-motion:reduce){#app *,#app *::before,#app *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.mw-mobile-picker, .mobile-locale-toggle { display: none; }
.main > .social-workspace { margin: 0; }
.mobile-ux-toggle { display:none; }

@media(max-width:820px){
  #app .mobile-ux-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin:0 0 10px;font-size:13px;white-space:normal}
  #app .mobile-ux-fold:not(.mobile-ux-open){display:none!important}
  #app .mobile-lead-kpis{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:0!important;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:12px 0!important}
  #app .mobile-lead-kpis .kpi-card{padding:10px 6px!important;border:0!important;border-radius:0!important;min-height:76px!important;min-width:0;box-shadow:none;text-align:center}
  #app .mobile-lead-kpis .kpi-card+.kpi-card{border-left:1px solid var(--line)!important}
  #app .mobile-lead-kpis .kpi-label{font-size:12px;white-space:normal}
  #app .mobile-lead-kpis .kpi-value{font-size:23px;margin:4px 0}
  #app .mobile-lead-kpis .kpi-sub{display:none}
  #app .lead-drawer-head:not(.mobile-contact-expanded) :is(.lead-drawer-contact,.lead-drawer-meta,.lead-drawer-clocks,.lead-drawer-interest){display:none}
  #app .lead-drawer-head .mobile-ux-toggle{margin:8px 0 0}
  #app .lead-drawer-head{padding:12px 16px}
  #app .inquiry-detail-note{font-size:13px}
  #app .product-row{display:grid!important;grid-template-columns:44px 64px minmax(0,1fr);gap:12px!important;align-items:start!important}
  #app .product-row>input{grid-column:1;grid-row:1;align-self:center;justify-self:center}
  #app .product-row>div:nth-of-type(1){grid-column:2;grid-row:1}
  #app .product-row>div:nth-of-type(2){grid-column:1/-1;grid-row:2}
  #app .product-row>div:nth-of-type(2)>div:nth-child(2){white-space:normal!important;font-size:15px!important;line-height:1.5;overflow-wrap:anywhere}
  #app .product-row>div:nth-of-type(2)>div:nth-child(3){white-space:normal!important;font-size:13px!important;overflow-wrap:anywhere}
  #app .product-row>div:nth-of-type(3){grid-column:3;grid-row:1;align-self:center}
  #app .product-row>div:nth-of-type(4){grid-column:1/-1;grid-row:3;justify-content:flex-end;border-top:1px solid var(--line);padding-top:10px}
  #app .model-workbench .mw-editor-actions{position:static;padding-bottom:12px}
  #main-content.main-chat .chat-empty{padding-top:16px}
  #main-content.main-chat .chat-empty-hero{margin-bottom:16px}
  #main-content.main-chat .chat-empty-card{padding:12px}
  #main-content.main-chat .chat-empty-grid{gap:8px}
}

@media (max-width: 820px), (max-width: 1024px) and (max-height: 500px) {
  #app { --mobile-gutter: 14px; }
  #app > .sidebar { display: none !important; }
  #main-content { min-width: 0; height: 100dvh; padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
  #app button, #app .btn, #app summary {
    min-height: 44px;
    min-width: 44px;
    touch-action: manipulation;
  }
  #app input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
  #app select, #app textarea, #app [contenteditable=true] {
    font-size: 16px;
    min-height: 44px;
    max-width: 100%;
  }
  #app :is(button, a, input, select, textarea, summary):focus-visible {
    outline: 2px solid var(--green);
    outline-offset: 3px;
  }
  #main-content > .header {
    display: flex; flex-direction: column; align-items: stretch;
    flex: 0 0 auto;
    padding: 8px var(--mobile-gutter);
    gap: 4px;
  }
  #main-content .shell-page-heading { font-size: 16px; line-height: 1.5; margin: 0; }
  #main-content > .header > .shell-header-actions { width: 100%; gap: 6px !important; overflow: visible; }
  #main-content .shell-header-actions .tab-freshness { display: inline-flex; margin-right: auto; }
  #main-content .user-menu-trigger { height: 44px; }
  #main-content .user-menu-panel { max-width: calc(100vw - 28px); max-height: calc(100dvh - 160px); overflow-y: auto; }
  #app .m-tabbar {
    display: grid; grid-template-columns: repeat(var(--mobile-nav-columns, 5), minmax(0, 1fr));
    position: fixed; inset: auto 0 0; z-index: 40; height: calc(56px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom); background: var(--surface); border-top: 1px solid var(--line);
  }
  #app .m-tab { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; border: 0; background: transparent; color: var(--muted); font: inherit; font-size: 12px; padding: 4px 2px; position: relative; }
  #app .m-tab.active { color: var(--green); background: var(--surface-soft); }
  #app .m-tab-icon { display: grid; place-items: center; }
  #app .m-tab-icon svg { width: 20px; height: 20px; }
  #app .m-sheet {
    display: flex; flex-direction: column; position: fixed; inset: auto 0 0; z-index: 81;
    max-height: calc(100dvh - 24px); padding-bottom: env(safe-area-inset-bottom);
    background: var(--surface); border-radius: 16px 16px 0 0;
  }
  #app .m-sheet-backdrop { display: none; }
  /* Same stack as the base sheet: above header 70, below business modals 90. */
  #app .m-sheet-backdrop.open { display: block; position: fixed; inset: 0; z-index: 80; background: #0005; }
  #app .m-sheet-header { display: flex; align-items: center; justify-content: space-between; padding: 4px 16px 8px; flex-shrink: 0; }
  #app .m-sheet-title { font-size: 18px; }
  #app .m-sheet-close { padding: 8px 12px; border-radius: 8px; }
  #app .m-sheet-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 16px 24px; }
  .m-menu-search { display: flex; align-items: center; gap: 6px; padding: 0 16px 12px; flex-shrink: 0; }
  .m-menu-search .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .m-menu-search .input { width: 100%; min-width: 0; }
  .m-menu-empty { padding: 16px; color: var(--muted); line-height: 1.6; }
  #app .m-sheet-row { display: flex; align-items: center; width: 100%; min-height: 52px; gap: 10px; border: 0; border-bottom: 1px solid var(--line); padding: 8px 10px; background: var(--surface); color: var(--ink); text-align: left; font: inherit; font-size: 14px; }
  #app .m-sheet-row-icon svg { width: 20px; height: 20px; }
  #app .m-sheet-row-label { min-width: 0; overflow-wrap: anywhere; }
  #app .m-sheet-row-sub { max-width: 36%; overflow-wrap: anywhere; white-space: normal; }
  #app .m-sheet-section-title { font-size: 12px; margin-top: 16px; }

  /* Keep configuration at hand instead of placing a long model list above it. */
  #main-content .model-workbench { padding: 16px var(--mobile-gutter) 24px; }
  .model-workbench .settings-page-header { gap: 12px; padding-bottom: 16px; margin-bottom: 12px; }
  .model-workbench .settings-page-title { font-size: 22px; }
  .model-workbench .settings-page-subtitle { font-size: 13px; line-height: 1.6; }
  .model-workbench .settings-page-actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .model-workbench .mw-summary-disclosure { margin-bottom: 12px; }
  .model-workbench .mw-summary-disclosure > summary { padding: 8px 0; gap: 6px 12px; }
  .model-workbench .mw-summary-hint { display: none; }
  .model-workbench .mw-tabs { margin-bottom: 14px; gap: 18px; }
  .model-workbench .mw-layout { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .model-workbench .mw-mobile-picker {
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
    width: 100%; border: 0; background: transparent; padding: 12px 16px;
    font: inherit; text-align: left; color: var(--ink); cursor: pointer;
  }
  .mw-mobile-picker > span:first-child { min-width: 0; }
  .mw-mobile-picker small { display: block; color: var(--muted); font-size: 12px; margin-bottom: 4px; }
  .mw-mobile-picker strong { display: block; font-size: 14px; overflow-wrap: anywhere; }
  .mw-mobile-picker > span:last-child { flex-shrink: 0; color: var(--green); font-size: 13px; }
  .mw-library:not(.mobile-library-open) #model-library-content { display: none; }
  .model-workbench .mw-model-list { max-height: 40dvh; overscroll-behavior: contain; }
  .model-workbench .mw-editor { padding: 16px; }
  .model-workbench .mw-editor-heading { margin-bottom: 14px; gap: 10px; }
  .model-workbench .mw-section-links { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 8px; margin-bottom: 16px; }
  .model-workbench .mw-section-links button { flex: 0 0 auto; font-size: 12px; padding: 8px; }
  .model-workbench .mw-context-presets { display: flex; flex-wrap: wrap; gap: 6px; }
  .model-workbench .mw-context-presets button { font-size: 13px; padding: 8px 10px; }
  .model-workbench .mw-fields { grid-template-columns: minmax(0, 1fr); }
  .model-workbench .mw-editor-actions { gap: 8px; padding: 12px 0; }
  .model-workbench .mw-editor-actions .mw-footnote { font-size: 12px; line-height: 1.5; }
  .model-workbench .mw-secondary-actions { flex-wrap: wrap; gap: 10px; }
  #main-content .mobile-locale-panel { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px; }
  #main-content .mobile-locale-toggle { display: inline-flex; }
  .mobile-locale-panel :is(.publish-locale-options, .publish-locale-help) { grid-column: 1 / -1; }
  .mobile-locale-panel:not(.mobile-locale-open) :is(.publish-locale-options, .publish-locale-help) { display: none; }
  #main-content .publish-locale-chip { min-height: 44px; }
  #main-content :is(.mobile-analysis-grid, .mobile-geo-grid) { grid-template-columns: minmax(0, 1fr) !important; }
  #main-content #geo-world-map { min-width: 0; height: 240px !important; }
  #main-content .collection-toolbar { gap: 8px; }
  #main-content .collection-search { min-width: 0; max-width: none; }
  #main-content .collection-toolbar-actions { margin-left: 0; gap: 8px; }

  /* A genuine phone viewport, not a desktop canvas with negative gutters. */
  #main-content > .social-workspace { margin: 0; width: 100%; padding: 12px var(--mobile-gutter) 24px; }
  .social-workspace .social-workspace-head { padding: 14px; }
  .social-workspace .social-workspace-head h1 { font-size: 22px; }
  .social-workspace .social-head-actions { display: flex; flex-wrap: wrap; }
  .social-workspace .social-head-actions > .btn { flex: 1 1 140px; }
  .social-workspace .social-pane-body { font-size: 14px; }
  .social-workspace .social-current-post-bar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .social-workspace .social-current-post-main { grid-column: 1 / -1; }
  .social-workspace .social-current-post-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; }
  .social-workspace .social-current-post-actions > button { flex: 1 1 auto; }
  .social-workspace :is(.social-content-layout, .social-workbench-grid, .social-queue-grid, .social-connection-grid) { grid-template-columns: minmax(0, 1fr); }
  #main-content .dashboard-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #main-content .dashboard-kpi-card { min-width: 0; }
  #main-content .dashboard-kpi-value { font-size: 24px; overflow-wrap: anywhere; }
  #main-content .dashboard-header-actions { flex-wrap: wrap; }

  /* Composer text gets its own row; controls no longer compete for 72px of text. */
  #main-content.main-chat .composer { flex-wrap: wrap; gap: 6px; padding: 8px !important; }
  #main-content.main-chat .composer textarea.chat-ta { order: -1; flex: 1 0 100%; width: 100%; min-width: 0; max-height: 120px; font-size: 16px; }
  #main-content.main-chat .composer :is(.composer-img-btn, .composer-mic, .send-btn) { width: 44px; height: 44px; flex-shrink: 0; }
  #main-content.main-chat .composer .send-btn { margin-left: auto; }
  #main-content.main-chat .composer-model-btn { max-width: 130px; }
  #main-content.main-chat .chat-toolbar { justify-content: flex-end; }
  #main-content.main-chat .auto-gear { height: 44px !important; min-height: 44px !important; }
  #main-content.main-chat .chat-toolbar > .btn { display: none; } /* Duplicate: new conversation remains in title bar. */
  #main-content.main-chat .chat-titlebar { gap: 4px; padding: 4px; }
  #main-content.main-chat .chat-titlebar-title { min-width: 0; }
  #main-content.main-chat .chat-titlebar :is(.chat-titlebar-history, .chat-titlebar-new) { width: 44px; height: 44px; }
  #main-content.main-chat .chat-titlebar .conversation-confirmations { font-size: 12px; padding-inline: 8px; }
  #main-content.main-chat .chat-queue-manage { font-size: 12px; padding-inline: 6px; }
  #main-content.main-chat .msg-ai { padding: 14px 12px; }
  #main-content.main-chat .auto-settings { max-height: min(440px, 65dvh); max-width: calc(100vw - 28px); overflow-y: auto; }
  #app :is(.modal-card, .ux-mail-dialog, .drawer-panel, .kb-drawer) { max-width: 100%; }
  #app .modal-overlay { padding: max(8px, env(safe-area-inset-top)) 8px max(8px, env(safe-area-inset-bottom)); }
  #app .modal-card { max-height: calc(100dvh - 32px) !important; }
  #app :is(.drawer-body, .m-sheet-body, .modal-card) { overscroll-behavior: contain; }
}

@media (max-width: 820px) {
  /* Content cards put the title first, with compact, still-labelled metrics. */
  #main-content .posts-list { display: block; width: 100%; }
  #main-content .posts-list thead { display: none; }
  #main-content .posts-list tbody { display: flex; flex-direction: column; gap: 12px; }
  #main-content .posts-list .post-row-click { padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
  #main-content .posts-list td { display: flex; justify-content: space-between; gap: 12px; width: 100%; border-bottom: 1px solid var(--line); padding: 10px 0; }
  #main-content .posts-list td::before { content: attr(data-label); color: var(--muted); font-size: 12px; }
  #main-content .post-row-click { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); column-gap: 8px; }
  #main-content .post-row-click td { min-width: 0; }
  #main-content .post-row-click td[data-label="标题"] { display: block; grid-column: 1 / -1; grid-row: 1; padding-right: 44px; max-width: none !important; text-align: left; }
  #main-content .post-row-click td[data-label="标题"] > div:first-child { white-space: normal !important; overflow-wrap: anywhere; font-size: 14px !important; line-height: 1.5; }
  #main-content .post-row-click td[data-label="标题"]::before,
  #main-content .post-row-click td[data-label="选中"]::before { display: none; }
  #main-content .post-row-click td[data-label="选中"] { grid-column: 6; grid-row: 1; z-index: 1; border: 0; padding: 0 !important; justify-self: end; }
  #main-content .post-row-click td[data-label="封面"] { grid-column: 1 / -1; }
  #main-content .post-row-click :is(td[data-label="状态"], td[data-label="Decay"], td[data-label="AEO"]) { grid-column: span 2; flex-direction: column; align-items: flex-start; gap: 8px; text-align: left !important; }
  #main-content .post-row-click :is(td[data-label="状态"], td[data-label="Decay"], td[data-label="AEO"])::before { min-width: 0; max-width: none; }
  #main-content .post-row-click td[data-label="操作"] { grid-column: 1 / -1; }
  #main-content .touch-checkbox { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; cursor: pointer; }
  #main-content .touch-checkbox input { width: 20px; height: 20px; }
}

@media (min-width: 821px) and (max-width: 1024px) and (max-height: 500px) {
  #main-content > .header { flex-direction: row; align-items: center; justify-content: space-between; }
  #main-content .shell-nav-toggle, #main-content .system-clock, #main-content .user-menu-name { display: none; }
  #main-content > .header > .shell-header-actions { width: auto; }
  #main-content .model-workbench .settings-page-header { flex-direction: row; align-items: center; }
  #main-content .model-workbench .settings-page-actions { width: auto; flex-shrink: 0; }
}

/* Landscape/short windows keep primary content scrollable and save actions reachable. */
@media (max-width: 1024px) and (max-height: 500px) {
  #main-content .mw-editor-actions { position: static; }
  #app .m-sheet { max-height: calc(100dvh - 12px) !important; }
  #main-content.main-chat .chat-titlebar { margin-top: 0; }
  #main-content.main-chat .chat-input-area:focus-within textarea.chat-ta { max-height: 70px; }
}