/* Phone navigation belongs only to Space. Desktop/tablet retain their rail. */
.mobile-only { display:none; }
.mobile-create { display:none; }
.mobile-create-a11y { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.mobile-create[hidden]~.mobile-create-a11y { display:none; }
@media (max-width:600px) {
  .mobile-only { display:flex; }
  /* Anchor to the visible viewport, including Safari's keyboard focus pan.
     Keep scrolling inside the message/editor panes, not the document body. */
  .app { position:fixed; top:var(--mobile-app-top,0px); left:0; right:0; grid-template-columns:minmax(0,1fr); grid-template-rows:calc(52px + env(safe-area-inset-top)) minmax(0,1fr) calc(71px + env(safe-area-inset-bottom)); height:var(--mobile-app-height,100dvh); width:100%; min-width:0; }
  .app.keyboard-open { grid-template-rows:calc(52px + env(safe-area-inset-top)) minmax(0,1fr) 0; }
  .topbar { grid-column:1; grid-row:1; padding:env(safe-area-inset-top) 8px 0; gap:2px; min-width:0; }
  .topbar>.history,.topbar>.request-indicator,.topbar>.brand-word,.topbar>[data-action=personal-settings],.topbar>.grow { display:none; }
  .mobile-workspace { align-items:center; gap:6px; flex:1; min-width:0; height:44px; padding:0 8px; font-size:17px; font-weight:700; text-align:left; }
  .mobile-workspace>span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .mobile-workspace .icon { width:16px; flex-shrink:0; }
  .topbar .global-search { order:1; flex:0 0 44px; width:44px; height:44px; min-width:0; padding:0; border:0; background:transparent; justify-content:center; }
  .topbar .global-search span,.topbar .global-search kbd { display:none; }
  .topbar .notification-entry { order:2; flex:0 0 44px; height:44px; }
  .mobile-profile { order:3; flex:0 0 44px; height:44px; align-items:center; justify-content:center; }
  .mobile-profile .avatar { width:30px; height:30px; font-size:13px; }
  .rail { display:contents; }
  .rail>.workspace-mark,.rail>.rail-bottom { display:none; }
  .rail-nav { grid-column:1; grid-row:3; display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); align-items:stretch; gap:0; padding:4px 4px env(safe-area-inset-bottom); margin:0; background:var(--rail); border-top:1px solid var(--border); z-index:5; }
  /* Match planner-mobile-nav.css: fixed icon box keeps labels below the glyph. */
  :root .rail-nav > .rail-item { width:auto; min-width:0; height:66px; min-height:66px; padding:4px 0; gap:4px; justify-content:center; border-radius:8px; font-size:12px; line-height:18px; }
  .rail-nav > .rail-item .rail-icon { box-sizing:border-box; width:36px; height:36px; min-height:36px; padding:0; flex-shrink:0; border-radius:9px; display:flex; align-items:center; justify-content:center; }
  .rail-nav > .rail-item .icon { width:28px; height:28px; flex-shrink:0; }
  .rail-nav > .rail-item > span:last-child { line-height:18px; flex-shrink:0; }

  .rail-item.active { background:var(--selected); color:var(--text); }
  .keyboard-open .rail-nav { display:none; }
  .mobile-create:not([hidden]) { display:flex; position:fixed; width:52px; height:52px; padding:0; align-items:center; justify-content:center; border:0; border-radius:50%; background:var(--accent); color:var(--on-accent); box-shadow:0 3px 12px #0002; z-index:30; touch-action:none; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
  .mobile-create .icon { width:24px; height:24px; pointer-events:none; }
  .mobile-create.is-moving { cursor:grabbing; box-shadow:0 5px 18px #0003; outline:2px solid var(--accent); outline-offset:2px; }
  .mobile-create:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
  .keyboard-open .mobile-create { display:none; }
  .mobile-create-hint { margin:4px 10px 8px; max-width:230px; font-size:12px; color:var(--muted); }
  .app.mobile-create-list .side-scroll,.app.mobile-create-list .collection-list { padding-bottom:84px; }
  .sidebar .side-group[data-section=favorites] .group-label>[data-action=browse-channels],.sidebar .group-label>[data-action=new-channel],.collection-head>[data-action=new-dm] { display:none; }
  .app>.main { grid-column:1; grid-row:2; min-width:0; min-height:0; width:100%; }
  .app>.sidebar { display:none; position:relative; inset:auto; grid-column:1; grid-row:2; width:100%; max-width:none; min-width:0; height:100%; border:0; box-shadow:none; }
  .app.mobile-home>.sidebar { display:flex; }
  .app.mobile-home>.main { display:none; }
  .sidebar>.workspace-head { display:none; }
  .sidebar .side-find { margin:8px 16px; }
  .sidebar .side-find input { min-height:44px; font-size:16px; }
  .sidebar .side-search-status { padding-left:16px; padding-right:16px; }
  .sidebar .side-scroll { padding:0 12px 16px; overscroll-behavior:contain; }
  .side-shortcuts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; padding:4px 0 12px; border-bottom:1px solid var(--border); margin-bottom:8px; }
  .side-shortcuts .side-item { justify-content:center; gap:6px; font-size:13px; padding:0 4px; background:var(--surface); border-radius:8px; }
  .sidebar .side-item { min-height:46px; font-size:15px; }
  .sidebar .side-shortcuts .side-item { font-size:13px; }
  .sidebar .group-label { min-height:44px; }
  .sidebar .group-label .icon-btn,.sidebar .channel-priority { min-width:44px; min-height:44px; }
  .sidebar .side-channel-row>.side-item { padding-left:54px; }
  .sidebar .group-toggle { min-height:44px; }
  .mobile-home:not(.conversation-filtering) .side-group[data-section=dms] { display:none; }
  .main .mobile-menu { display:none; }
  .main .collection .mobile-menu { display:flex; width:44px; height:44px; flex-shrink:0; }
  .channel-head { min-height:52px; padding:4px 8px; gap:2px; }
  .channel-head>.icon-btn,.channel-head .head-actions>.icon-btn { width:40px; height:44px; flex-shrink:0; }
  .channel-head>[data-action=star],.channel-head .member-stack { display:none; }
  .channel-title { min-width:0; font-size:17px; }
  .channel-title span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .channel-title-count { display:inline; }
  .head-actions { gap:0; flex-shrink:0; }
  .channel-agent-badge span { display:none; }
  .channel-tabs { padding:0 12px; min-height:40px; gap:12px; overflow-x:auto; flex-shrink:0; }
  .channel-tabs button { white-space:nowrap; padding:9px 0; }
  .messages { padding-top:8px; }
  .message { padding-left:12px; padding-right:12px; gap:9px; }
  .message>.avatar { width:30px; height:30px; }
  .message-main { min-width:0; }
  .composer-wrap,.thread-pane .composer-wrap { padding:6px 10px 8px; }
  .composer-foot { display:none; }
  .composer .se-toolbar { display:none!important; }
  .formats-open .se-toolbar { display:block!important; }
  .composer .rich-composer { min-height:44px!important; max-height:min(160px,calc(var(--mobile-app-height,100dvh) * .2))!important; font-size:16px!important; padding:9px 10px!important; }
  .composer textarea { font-size:16px; min-height:44px; max-height:calc(var(--mobile-app-height,100dvh) * .2); }
  .compose-actions { padding:2px 4px; min-height:44px; gap:0; }
  .compose-actions .icon-btn { width:42px; height:40px; }
  .mobile-format { align-items:center; justify-content:center; font-size:16px; font-weight:600; }
  .mobile-format[aria-expanded=true] { background:var(--selected); }
  .thread-broadcast { padding:4px 8px; font-size:12px; }
  .thread-pane { width:100%; min-width:0; border:0; }
  .thread-pane .channel-head { padding:4px 12px; }
  .collection[data-view="dms"] > .collection-head { display:none; }
  .collection-head { padding:12px; gap:8px; flex-wrap:wrap; }
  .collection-head>div { flex:1 1 calc(100% - 56px); min-width:0; }
  .collection-head>.grow { display:none; }
  .collection-head h1 { font-size:21px; }
  .collection-head p { font-size:12px; margin-top:4px; }
  .collection-head>.secondary { min-height:40px; }
  .collection-list { padding:12px; }
  .directory-tabs { padding-left:12px; padding-right:12px; }
  .directory-toolbar { padding:12px; flex-wrap:wrap; }
  .directory-toolbar input { width:100%; min-width:0; font-size:16px; }
  .directory-toolbar select { min-width:0; max-width:100%; }
  .directory-body { padding:0 12px 12px; }
  .person-card { min-width:0; }
  .person-card>span { min-width:0; overflow-wrap:anywhere; }
  .result-context { padding:8px 10px; gap:6px; }
  .result-jump { flex-shrink:0; }
  .dialog-shade { padding:12px; }
  .dialog,.dialog.wide { width:100%; max-height:calc(100dvh - 24px); }
  .dialog-head { padding:12px 14px; }
  .dialog-head h2 { font-size:18px; }
  .dialog-content { padding:14px; }
  .dialog-footer { padding:12px 14px; flex-wrap:wrap; }
  .dialog input:not([type=checkbox]),.dialog textarea,.dialog select { font-size:16px; min-width:0; max-width:100%; }
  .menu-pop { max-width:calc(100vw - 16px); max-height:calc(100dvh - 16px); overflow:auto; }
  .menu-pop>button,.workspace-menu-footer>button,.workspace-menu-footer>a { min-height:44px; }
  .workspace-menu [data-action=forward] .icon { transform:rotate(180deg); }
  .empty { padding:24px 16px; }
  .empty h2 { font-size:20px; }
  #toasts { bottom:calc(76px + env(safe-area-inset-bottom)); max-width:calc(100vw - 24px); }
}

/* Mobile destinations: collaboration tools above the list, Planner always at right. */
.mobile-planner, .mobile-shortcut { display:none; }
@media (max-width:600px) {
  .rail-nav > [data-view="files"], .rail-nav > [data-view="saved"] { display:none; }
  .rail-nav > .mobile-planner { display:flex; border-radius:0; color:var(--accent); text-decoration:none; }
  .side-shortcuts .mobile-shortcut { display:flex; }
  .shortcut-strip { position:relative; border-bottom:1px solid var(--border); margin-bottom:8px; }
  .shortcut-strip .side-shortcuts { display:flex; overflow-x:auto; overscroll-behavior-x:contain; gap:6px; padding:4px 0 10px; margin:0; border:0; scrollbar-width:thin; scrollbar-color:var(--scroll-thumb) transparent; }
  .shortcut-strip .side-item { flex:0 0 auto; width:auto; min-width:100px; min-height:44px; padding:0 12px; white-space:nowrap; }
  .shortcut-strip::before, .shortcut-strip::after { position:absolute; top:4px; bottom:10px; width:20px; pointer-events:none; z-index:1; content:""; opacity:0; transition:opacity .15s ease; }
  .shortcut-strip::before { left:0; background:linear-gradient(to right,var(--sidebar),transparent); }
  .shortcut-strip::after { right:0; background:linear-gradient(to left,var(--sidebar),transparent); }
  .shortcut-strip.has-before::before, .shortcut-strip.has-after::after { opacity:1; }
}
@media (prefers-reduced-motion:reduce) {
  .shortcut-strip::before, .shortcut-strip::after { transition:none; }
}

/* Reading-first phone conversations; desktop and list navigation remain unchanged. */
@media(max-width:600px){
 .app:not(.mobile-home):has(>.main>.conversation){grid-template-rows:0 minmax(0,1fr) 0}
 .app:not(.mobile-home):has(>.main>.conversation)>.topbar,
 .app:not(.mobile-home):has(>.main>.conversation)>.rail>.rail-nav{display:none}
 .app:not(.mobile-home):has(>.main>.conversation)>.main{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
 .main>.conversation>.channel-head{min-height:52px;height:52px;padding:4px 8px;box-sizing:border-box}
 .main .channel-title-sub,.main>.conversation>.channel-tabs{display:none}
 #channel-notices>.channel-policy-note{display:none}
 #channel-line-pin:not(.mobile-line-open){display:none}
 .composer-wrap:not(.mobile-compose-open) .compose-actions,
 .composer-wrap:not(.mobile-compose-open) .thread-broadcast,
 .composer-wrap:not(.mobile-compose-open) .se-toolbar,
 .composer-wrap:not(.mobile-compose-open) .mobile-compose-close,
 .composer-wrap:not(.mobile-compose-open) .retention-hint{display:none!important}
 .composer-wrap:not(.mobile-compose-open) .rich-composer,
 .composer-wrap:not(.mobile-compose-open) textarea{height:44px!important;min-height:44px!important;max-height:44px!important;overflow:hidden!important}
 .composer-wrap:not(.mobile-compose-open) .sun-editor .se-wrapper-inner{min-height:44px!important;max-height:44px!important}
 .mobile-compose-close{margin-left:auto;padding:4px 10px;font-size:12px;color:var(--muted);min-height:32px}
 .composer-wrap{flex-shrink:0}
 .mobile-menu-planner{display:flex;align-items:center;gap:10px;padding:10px 14px;color:inherit;text-decoration:none}
}

/* Activity uses the same native scroll and edge cues as home shortcuts. */

@media (max-width:600px) {
 .collection[data-view="activity"] > .collection-head { display:none; }
 .activity-filter-strip { --sidebar:var(--surface); margin:0; padding:0 12px; }
 .activity-filter-strip .collection-filters { display:flex; flex-wrap:nowrap; overflow-x:auto; overscroll-behavior-x:contain; gap:6px; padding:8px 0 10px; scrollbar-width:thin; scrollbar-color:var(--scroll-thumb) transparent; }
 .activity-filter-strip [data-action="collection-filter"] { flex:0 0 auto; min-width:100px; min-height:44px; padding:0 12px; border-radius:8px; white-space:nowrap; background:var(--surface); }
 .activity-filter-strip [aria-pressed="true"] { background:var(--accent); color:var(--on-accent); }
 .activity-filter-strip::before,.activity-filter-strip::after { top:8px; }
 .collection[data-view="activity"] .activity-card .compact-message { padding:6px 12px; }
 .collection[data-view="activity"] .result-header { padding:8px 12px; }
 .collection[data-view="activity"] .collection-list { padding:8px 12px; }



}

@media (max-width:600px) {
 .collection[data-view="activity"] .channel-invite-card { padding:10px 12px; margin-bottom:8px; }
 .collection[data-view="activity"] .channel-invite-card p { margin:4px 0; }
}

/* Writing keeps the keyboard-adjacent area compact, on phones only. */
@media(max-width:600px){
 .app:has(.composer-wrap:focus-within) .message-tools{display:none!important}
 .composer-wrap.mobile-compose-open.mobile-compose-empty .rich-composer,
 .composer-wrap.mobile-compose-open.mobile-compose-empty textarea,
 .composer-wrap.mobile-compose-open.mobile-compose-empty .se-wrapper-inner{min-height:44px!important;height:44px!important;max-height:44px!important}
 .composer-wrap.mobile-compose-open .mobile-compose-close{margin:0;padding:0;width:36px;min-height:40px;font-size:12px;flex:none}
 .app.keyboard-open:not(.mobile-home):has(>.main>.conversation)>.main{padding-bottom:0}
 .keyboard-open .composer-wrap,.keyboard-open .thread-pane .composer-wrap{padding-bottom:2px}
 .keyboard-open .retention-hint:empty,.keyboard-open .pending-files:empty{display:none}
}

/* DM 목록(폰) — 제목 줄을 숨긴 만큼 목록을 위로: 위 여백 4px(4번 A), 갱신 안내는 목록 위에 떠 있는 알약(1번 A). */
@media (max-width:600px) {
  .collection[data-view="dms"] .collection-list, .collection[data-view="hidden-dms"] .collection-list { padding-top:4px; }
  .dm-refresh-head { display:none; }
  .dm-refresh-float { display:flex; justify-content:center; position:sticky; top:6px; height:0; z-index:4; overflow:visible; }
  .dm-refresh-pill { min-height:36px; padding:0 14px; border:0; border-radius:999px; background:var(--accent); color:var(--on-accent,#fff); font:inherit; font-size:13px; font-weight:650; box-shadow:0 4px 14px rgba(0,0,0,.18); white-space:nowrap; }
}

/* Visual-only keyboard resize also occurs on tablets. Keep native zoom/pan. */
.app.visual-viewport-bound{position:fixed;top:var(--mobile-app-top,0px);left:0;right:0;height:var(--mobile-app-height,100dvh)}
.visual-viewport-bound .conversation,.visual-viewport-bound .thread-pane{min-height:0;overflow-y:auto;overscroll-behavior-y:contain}
.visual-viewport-bound .composer-wrap{flex-shrink:0;max-height:max(100px,calc(var(--mobile-app-height,100dvh) - 64px));overflow-y:auto;overscroll-behavior-y:contain}
.visual-viewport-bound .composer .rich-composer{max-height:max(44px,min(180px,calc(var(--mobile-app-height,100dvh) * .22)))!important}
.visual-viewport-bound .pending-files{max-height:80px;overflow:auto}
.visual-viewport-low .messages{min-height:40px}
.visual-viewport-low .compose-actions{position:sticky;bottom:0;background:var(--raised);z-index:2;flex-wrap:wrap}
.visual-viewport-low .composer{overflow:visible}
