@media (max-width:767px){
  .topbar{ min-height:56px; padding:8px 10px; gap:6px; }
  .topbar-actions{ gap:4px; }
  .topbar-brand{ gap:6px; min-width:0; }
  .topbar-brand-logo{ height:18px; }
  .topbar > .presence-stack{ display:none; }
  .split-menu{ max-width:calc(100vw - 16px); }

  body.home-body .app-row{ flex-direction:column; }
  body.home-body .app-nav{
    order:2; width:100%; height:auto; flex-direction:row; justify-content:space-around; align-items:center;
    gap:0; padding:4px 0 calc(4px + env(safe-area-inset-bottom)); border-top:1px solid var(--ui-border);
    z-index:30;
  }
  body.home-body .app-nav-item{ flex:1 1 0; width:auto; padding:2px 0 4px; gap:2px; }
  body.home-body .app-nav-icon{ width:32px; height:32px; }
  body.home-body .app-nav-avatar-wrap{ flex:0 0 auto; position:relative; margin:0 8px; }
  body.home-body .app-nav-avatar-wrap .split-menu.rail-avatar-menu{ top:auto; bottom:calc(100% + 8px); left:auto; right:0; }
  body.home-body .app-page-body{ border-radius:0; flex:1 1 auto; min-height:0; box-shadow:none; }

  .home-main{ padding:36px 14px 32px; }
  .home-hero{ min-height:auto; flex-direction:column; align-items:stretch; }
  .home-hero-panel{ max-width:none; padding:20px 14px 12px; }
  .home-greeting-text{ font-size:28px; }
  .home-greeting-img{ width:40px; height:40px; }
  .home-generate-textarea{ min-height:104px; }
  .home-generate-textarea:focus{ min-height:140px; }
  .home-hero-ctas-wrap{ padding:0 14px; }
  .home-hero-ctas{ width:fit-content; box-sizing:border-box; flex-direction:row; padding:6px; border-radius:14px; }
  .home-hero-ctas .btn{ flex:0 0 auto; justify-content:center; }
  .home-cta-primary, .home-cta-secondary{ padding:9px 14px; font-size:var(--text-base); border-radius:10px; }
  .home-cta-word{ display:none; }
  .home-section{ margin-top:28px; }
  .home-section-header{ flex-wrap:wrap; gap:8px; }
  .home-section-toolbar{ height:auto; flex-wrap:wrap; gap:8px; }
  .home-decks-search{ flex:1 1 90px; width:auto; min-width:0; max-width:none; margin-left:0; order:0; }
  .deck-filter-pills{ width:100%; }
  .trash-team-filter{ margin-left:auto; }
  .trash-search{ flex:1 1 60px; }
  .trash-empty-all-btn span{ display:none; }
  .trash-empty-all-btn{ padding:0 10px; }
  body.home-body .app-nav-divider{ display:none; }
  .trash-row, #trashTable .trash-row{ grid-template-columns:32px 56px minmax(170px, 1fr) 90px 130px 164px 130px 100px 40px; min-width:1024px; }
  .home-generate-submit{ right:10px; bottom:10px; width:36px; height:36px; }
  .home-generate-textarea{ padding-right:54px; padding-bottom:52px; }
  .home-scroll-row .layout-thumb{ flex:0 0 200px; }
  .home-templates-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }
  .decks-banner{ height:110px; }

  .home-discovery-back{ margin:8px 0 0 8px; }
  .home-discovery-body{ flex-direction:column; gap:12px; padding:8px 12px calc(12px + env(safe-area-inset-bottom)); }
  .home-discovery-chat,
  .home-discovery-body.has-outline .home-discovery-chat{ flex:1 1 auto; min-width:0; max-width:none; }
  .home-discovery-body.has-outline .home-discovery-chat{ flex:0 0 42%; }
  .home-discovery-outline{ flex:1 1 auto; max-width:none; border-left:none; padding-left:0; border-top:1px solid var(--ui-border); padding-top:12px; }

  .trash-table{ margin:0 -14px; padding:0 14px; }
  .trash-table, .deck-filter-pills{ scrollbar-width:none; }
  .trash-table::-webkit-scrollbar, .deck-filter-pills::-webkit-scrollbar{ display:none; }
  .hs-more-right{
    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 48px), transparent);
    mask-image:linear-gradient(to right, #000 calc(100% - 48px), transparent);
  }
  .hs-more-left{
    -webkit-mask-image:linear-gradient(to right, transparent, #000 48px);
    mask-image:linear-gradient(to right, transparent, #000 48px);
  }
  .hs-more-left.hs-more-right{
    -webkit-mask-image:linear-gradient(to right, transparent, #000 48px, #000 calc(100% - 48px), transparent);
    mask-image:linear-gradient(to right, transparent, #000 48px, #000 calc(100% - 48px), transparent);
  }
  .trash-table.hs-more-right{
    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 14px - 48px), transparent calc(100% - 14px));
    mask-image:linear-gradient(to right, #000 calc(100% - 14px - 48px), transparent calc(100% - 14px));
  }
  .trash-table.hs-more-left{
    -webkit-mask-image:linear-gradient(to right, transparent 14px, #000 calc(14px + 48px));
    mask-image:linear-gradient(to right, transparent 14px, #000 calc(14px + 48px));
  }
  .trash-table.hs-more-left.hs-more-right{
    -webkit-mask-image:linear-gradient(to right, transparent 14px, #000 calc(14px + 48px), #000 calc(100% - 14px - 48px), transparent calc(100% - 14px));
    mask-image:linear-gradient(to right, transparent 14px, #000 calc(14px + 48px), #000 calc(100% - 14px - 48px), transparent calc(100% - 14px));
  }
  .mobile-only{ display:revert !important; }
  .split-menu button.mobile-only{ display:flex !important; }

  .login-col-left{ padding:32px 20px; }
  .login-title{ font-size:var(--text-4xl); }

  body.editor-body .app-nav{ display:none; }
  body.editor-body .topbar .sidebar-collapse-btn,
  body.editor-body #rightRailCollapseBtn,
  body.editor-body .topbar-sep,
  body.editor-body #autosavePill,
  body.editor-body #viewMenuWrap,
  body.editor-body #deckLangWrap{ display:none; }
  body.editor-body #commentsToggleBtn,
  body.editor-body #presentSplit .split-main{ font-size:0; padding:0 10px; height:34px; gap:0; }
  body.editor-body #commentsToggleBtn i,
  body.editor-body #presentSplit .split-main i{ font-size:15px; }
  body.editor-body #commentsToggleBtn .comments-count-badge{ font-size:11px; margin-left:4px; }
  body.editor-body #presentSplit .split-caret{ height:34px; }
  body.editor-body #shareDeckBtn{ font-size:0; padding:0 10px; height:34px; gap:0; }
  body.editor-body #shareDeckBtn i{ font-size:15px; }
  body.editor-body #templateEditSaveBtn{ padding:0 10px; height:34px; font-size:var(--text-md); }

  body.editor-body .main{ flex-direction:column; }
  body.editor-body .stage-wrapper{
    order:1; flex:1 1 auto; min-height:0; width:100%;
    border-radius:0; border-left:none; border-right:none; box-shadow:none;
  }
  body.editor-body .stage{ padding:12px; }
  body.editor-body #framesContainer::after{ right:-12px; bottom:-12px; }
  body.editor-body .presenter-notes-box{ left:8px; right:8px; bottom:8px; padding:6px 10px; }
  body.editor-body .stage-mode-bar{ bottom:8px; }
  body.editor-body .stage-wrapper:has(.stage-mode-bar) .presenter-notes-box{ bottom:62px; }

  body.editor-body .sidebar-left{
    order:2; width:100%; flex:0 0 auto; flex-direction:row; align-items:stretch;
    margin:0; border-radius:0; box-shadow:none; border-top:1px solid var(--ui-border);
    background:var(--md-color-grey-white); transition:none;
  }
  body.editor-body .sidebar-header{ padding:8px 6px 8px 8px; align-items:center; border-right:1px solid var(--ui-border); }
  body.editor-body .sidebar-header .split-main{ padding:0 10px; height:34px; }
  body.editor-body .sidebar-header .split-caret{ height:34px; }
  body.editor-body #createSlideMenu{ left:0; right:auto; top:auto; bottom:calc(100% + 6px); }
  body.editor-body .slide-list{
    flex:1 1 auto; min-width:0; flex-direction:row; align-items:center; gap:8px;
    padding:8px 10px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
  }
  body.editor-body .slide-list::-webkit-scrollbar{ display:none; }
  body.editor-body .slide-item,
  body.editor-body .slide-item-skeleton{ flex:0 0 auto; width:132px; padding:4px; scroll-snap-align:center; }
  body.editor-body .slide-item .slide-number{ width:16px; }
  body.editor-body .slide-gap-hit{ display:none; }
  body.editor-body .slide-item.active .slide-more-btn{ opacity:1; pointer-events:auto; }

  body.editor-body .rail-dock{ order:3; width:100%; height:auto; flex:0 0 auto; flex-direction:column; align-items:stretch; }
  body.editor-body .icon-rail-dock{ height:auto; width:100%; }
  body.editor-body .icon-rail{
    width:100%; flex-direction:row; justify-content:space-around; align-items:stretch; gap:0;
    padding:2px 4px calc(4px + env(safe-area-inset-bottom)); border-top:1px solid var(--ui-border); box-sizing:border-box;
  }
  body.editor-body .icon-rail-btn{ flex:1 1 0; min-width:0; padding:6px 0 4px; gap:3px; border-radius:10px; }
  body.editor-body .icon-rail-btn i{ font-size:var(--text-2xl); }
  body.editor-body .rail-panel.open{
    position:fixed; left:0; right:0; bottom:0; top:auto; width:auto !important; height:min(72vh, 600px);
    margin:0; border-radius:16px 16px 0 0; z-index:950;
    box-shadow:0 -8px 28px rgba(var(--shadow-rgb),0.18); border-top:1px solid var(--ui-border);
    padding-bottom:env(safe-area-inset-bottom);
    animation:mobile-sheet-in .28s cubic-bezier(.22,1,.36,1) both;
  }
  body.editor-body .rail-panel-resize-handle{ display:none; }
  body.editor-body .rail-panel-header{ padding-top:14px; }
  body.editor-body .rail-panel.open::before{
    content:''; position:absolute; top:6px; left:50%; width:36px; height:4px; margin-left:-18px;
    border-radius:2px; background:var(--ui-border-strong); z-index:2;
  }

  body.editor-body #commentPopover{
    left:8px !important; right:8px !important; top:auto !important;
    bottom:calc(8px + env(safe-area-inset-bottom)) !important; width:auto; max-height:70vh; overflow:auto;
    border-radius:14px; box-sizing:border-box;
  }
  #selectionToolbar, #aiRewritePopover, #aiRewriteReviewToolbar, .link-popover{ max-width:calc(100vw - 16px); }
  #aiRewritePopover, .link-popover{ width:auto; min-width:min(300px, calc(100vw - 16px)); }

  #templateLibraryModal, #imageLibraryModal, #fileImportModal, #dataTableModal, #imageCardEditModal,
  #nameModalModal, #importDeckModal, #thumbnailModalModal, #shareModalModal, #avatarModalModal,
  #personalInfoModalModal{
    width:auto; max-width:calc(100vw - 16px); max-height:calc(100vh - 16px); box-sizing:border-box;
  }
  #templateLibraryModal, #imageLibraryModal{ height:calc(100vh - 16px); }
  #confirmDialogModal{ max-width:calc(100vw - 24px); }
}

@keyframes mobile-sheet-in{ from{ transform:translateY(24px); opacity:0; } to{ transform:none; opacity:1; } }

@media (max-width:420px){
  .home-templates-grid{ grid-template-columns:minmax(0, 1fr); }
  .home-greeting-text{ font-size:24px; }
  body.editor-body .slide-item, body.editor-body .slide-item-skeleton{ width:116px; }
}

@media (max-width:767px) and (max-height:480px){
  body.editor-body .slide-item, body.editor-body .slide-item-skeleton{ width:96px; }
  body.editor-body .slide-list{ padding:4px 8px; }
  body.editor-body .icon-rail-btn{ flex-direction:row; gap:6px; padding:4px 0; }
  body.editor-body .rail-panel.open{ height:calc(100vh - 56px); }
}

@media (max-width:767px){
  :is(.topbar, .rail-panel, .sidebar-left, #commentsPanel, #commentPopover, .app-page-body, .home-discovery-overlay, [id$="Modal"], #confirmDialogModal) .btn{
    min-height:44px; padding:10px 16px; font-size:var(--text-xl); border-radius:12px;
  }
  :is(.topbar, .rail-panel, .sidebar-left, #commentsPanel, #commentPopover, .app-page-body, .home-discovery-overlay, [id$="Modal"], #confirmDialogModal) .btn.btn-sm{
    min-height:36px; padding:7px 12px; font-size:var(--text-lg);
  }
  :is(.topbar, .rail-panel, .sidebar-left, #commentsPanel, #commentPopover, .app-page-body, .home-discovery-overlay, [id$="Modal"], #confirmDialogModal) .btn-ghost{
    min-height:44px; padding:0 14px; font-size:var(--text-xl);
  }
  :is(.topbar, .rail-panel, .sidebar-left, #commentsPanel, #commentPopover, .app-page-body, .home-discovery-overlay, [id$="Modal"], #confirmDialogModal) .icon-btn{
    width:40px; height:40px; border-radius:12px; font-size:var(--text-xl);
  }
  :is(.topbar, .rail-panel, .sidebar-left, #commentsPanel, #commentPopover, .app-page-body, .home-discovery-overlay, [id$="Modal"], #confirmDialogModal) .icon-btn-ghost{
    width:44px; height:44px;
  }
  .split-menu button, .view-menu-option, .deck-lang-option{ min-height:44px; }
  :is(.rail-panel, #commentsPanel, #commentPopover, .app-page-body, .home-discovery-overlay, [id$="Modal"]) :is(input[type="text"], input[type="email"], input[type="search"], input[type="number"], textarea, select){
    min-height:44px; font-size:16px;
  }
  .prop-field input, .prop-field textarea{ font-size:16px; }
  .prop-span-field, .prop-grid-field{ height:44px; }
  .prop-span-field button, .prop-grid-field button{ width:36px; height:36px; }
  .cols-group button, .mini-segment button{ min-height:36px; }
  .deck-filter-pills button{ min-height:40px; padding:0 16px; }
  .home-input-mode-btn{ min-height:40px; padding:0 18px; }
  .home-generate-submit{ width:44px; height:44px; }
  .search-box input{ min-height:44px; font-size:16px; }
  .home-generate-placeholder{ font-size:16px; }
  .slide-more-btn{ width:36px; height:36px; }
  body.editor-body .stage-mode-btn{ width:48px; height:48px; }
  body.editor-body .icon-rail-btn{ min-height:56px; }
  body.home-body .app-nav-item{ min-height:56px; }
  .switch{ transform:scale(1.15); transform-origin:right center; }
  .comment-entry .entry-actions button, .comment-resolve-btn{ min-width:40px; min-height:40px; }
}

@media (max-width:767px){
  body.home-body .app-nav-icon{ width:40px; height:40px; border-radius:12px; }
  body.home-body .app-nav-icon i{ font-size:20px; }
  body.home-body .app-nav-item{ font-size:11px; gap:3px; }
  body.home-body .app-nav-avatar{ width:40px; height:40px; font-size:var(--text-xl); }
  .rail-panel-header-actions .icon-btn-ghost, .comments-header .icon-btn-ghost{ font-size:26px; line-height:1; }
  .rail-panel-header-actions .icon-btn-ghost i, .comments-header .icon-btn-ghost i{ font-size:18px; }
  #railPanelTitle, .comments-header span{ font-size:var(--text-2xl); }
  .split-menu{ min-width:220px; padding:8px; }
  .split-menu button{ font-size:var(--text-xl); padding:10px 12px; }
  :is(.topbar, .rail-panel, .sidebar-left, #commentsPanel, #commentPopover, .app-page-body, .home-discovery-overlay, [id$="Modal"], #confirmDialogModal) .btn-split .split-main{ border-radius:12px 0 0 12px; }
  :is(.topbar, .rail-panel, .sidebar-left, #commentsPanel, #commentPopover, .app-page-body, .home-discovery-overlay, [id$="Modal"], #confirmDialogModal) .btn-split .split-caret{ border-radius:0 12px 12px 0; padding:0 12px; min-height:44px; }
  :is(.topbar, .rail-panel, .sidebar-left, #commentsPanel, #commentPopover, .app-page-body, .home-discovery-overlay, [id$="Modal"], #confirmDialogModal) .btn-split.caret-left .split-main{ border-radius:0 12px 12px 0; }
  :is(.topbar, .rail-panel, .sidebar-left, #commentsPanel, #commentPopover, .app-page-body, .home-discovery-overlay, [id$="Modal"], #confirmDialogModal) .btn-split.caret-left .split-caret{ border-radius:12px 0 0 12px; }
  body.editor-body .sidebar-header .split-main, body.editor-body .sidebar-header .split-caret{ height:44px; }
  body.editor-body #presentSplit .split-caret{ height:44px; }
  body.editor-body #presentSplit .split-main{ display:none; }
  body.editor-body #presentSplit .split-caret{
    display:inline-flex; align-items:center; gap:7px; border-left:none; border-radius:12px; padding:0 12px; font-size:var(--text-xs);
  }
  body.editor-body #presentSplit .split-caret::before{
    font-family:"Font Awesome 6 Pro"; font-weight:var(--font-weight-black); content:"\f04b"; font-size:15px;
  }
}