/* Let controls reflow before introducing the desktop workspace. Document text
   and presentation preferences retain their original sizes. */
.subtitle-input{display:block;resize:none;max-height:72px;overflow:auto;line-height:1.5}
@media (max-width:1099px) and (min-height:501px) {
  .editor-shell .title-input{max-height:96px;overflow-y:auto}
}
@media (min-width:751px) {
  .editor-shell .editor-tools{flex-wrap:wrap;justify-content:flex-start;gap:6px;padding:6px 12px}
  .editor-shell .editor-tools .toolbar-wrap{flex:0 1 auto;min-width:0;padding:0}
  .editor-shell .editor-tools .toolbar{flex-wrap:wrap;overflow:visible;min-height:34px}
  .editor-shell .editor-tools .editor-smart-actions{flex:0 1 auto;flex-wrap:wrap;padding:0;gap:6px}
  .editor-shell .editor-tools .editor-smart-actions .btn{min-height:34px;padding:6px 9px}
}

@media (min-width:751px) and (max-width:1099px) {
  .editor-shell{width:100%;max-width:none}
  .editor-shell .editor-info{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'title type' 'subtitle subtitle' 'meta meta';gap:6px 14px;padding:12px 22px}
  .editor-shell .editor-info>.item-type{grid-area:type;margin:0;justify-self:end}
  .editor-shell .title-input{grid-area:title;font-size:24px!important;max-height:96px;min-height:30px;overflow-y:auto}
  .editor-shell .subtitle-input{grid-area:subtitle;margin:0;min-height:26px}
  .editor-shell .editor-meta{grid-area:meta;flex-wrap:wrap;overflow:visible;padding-top:4px;gap:7px}
  .editor-shell .editor-scroll{padding:14px 20px 28px}
  .editor-shell .editor-page{max-width:none}
}

@media (min-width:1100px), (min-width:751px) and (max-height:500px) {
  .app-shell{width:100%;max-width:1800px;padding-inline:clamp(28px,3vw,60px)}
  .app-shell .topbar{height:88px}
  .speech-grid,.category-grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
  .bottom-nav{max-width:1800px}

  .editor-shell{
    width:100%;max-width:none;height:100dvh;min-height:0;margin:0;
    padding-inline:clamp(20px,2vw,40px);
    display:grid;grid-template-columns:clamp(240px,18vw,300px) minmax(0,1fr);
    grid-template-rows:54px auto auto auto minmax(0,1fr) 36px;
    grid-template-areas:'top top' 'info tools' 'info participants' 'info scope' 'info canvas' 'info status';
    overflow:hidden;
  }
  .editor-shell .editor-top{grid-area:top;min-height:0;padding:6px 0;gap:12px}
  .editor-shell .editor-name{min-width:0;gap:8px}
  .editor-shell .editor-name>div{min-width:0}
  .editor-shell .editor-name .name{font-size:16px;line-height:1.3}
  .editor-shell .save-status{font-size:10px;margin-top:2px}
  .editor-shell .editor-top .icon-btn{width:36px;height:36px;border-radius:10px}
  .editor-shell .editor-top .editor-save{min-height:36px;padding:7px 13px}

  .editor-shell .editor-info,.editor-shell.part-editor .editor-info{
    grid-area:info;display:flex;flex-direction:column;align-items:stretch;gap:0;
    min-width:0;min-height:0;max-height:none;overflow:auto;
    padding:22px 20px 24px 0;border-right:1px solid var(--line);background:var(--bg);
  }
  .editor-shell .editor-info>.item-type,.editor-shell.part-editor .editor-info>.item-type{grid-area:auto;display:inline-flex;align-self:flex-start;margin:0 0 14px;padding:5px 8px}
  .editor-shell .title-input,.editor-shell.part-editor .title-input{grid-area:auto;flex:none;width:100%;min-height:28px;max-height:none;margin:0;font-size:22px!important;line-height:1.35;letter-spacing:-.4px;overflow:hidden;text-align:left}
  .editor-shell .subtitle-input{grid-area:auto;flex:none;width:100%;min-height:32px;max-height:120px;margin:10px 0 0;font-size:12px;line-height:1.5}
  .editor-shell .editor-meta,.editor-shell.part-editor .editor-meta{grid-area:auto;display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch;min-width:0;gap:9px;margin-top:22px;padding:0;overflow:visible}
  .editor-shell .editor-meta .meta-button{width:100%;min-width:0;max-width:100%;min-height:38px;justify-content:flex-start;padding:8px 10px;font-size:12px;gap:7px;text-align:left}
  .editor-shell .editor-meta .meta-button>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .editor-shell .editor-meta .meta-button svg{width:15px;height:15px}
  .editor-shell .editor-meta .content-version-selector{max-width:100%;width:100%}

  .editor-shell .editor-tools{grid-area:tools;align-content:center;align-items:center;min-width:0;min-height:50px;margin:0;padding:7px 18px;border-top:0;border-bottom:1px solid var(--line);background:var(--bg)}
  .editor-shell .editor-tools .toolbar-wrap{background:transparent;border:0}
  .editor-shell .editor-tools .toolbar{gap:2px}
  .editor-shell .editor-tools .toolbar .tool{width:34px;min-width:34px;height:34px}
  .editor-shell .editor-tools .toolbar .tool.sep{width:1px;min-width:1px;flex:0 0 1px;height:20px;margin-inline:4px}
  .editor-shell .editor-tools .toolbar .tool svg{width:18px;height:18px}
  .editor-shell .editor-tools .editor-smart-actions{background:transparent;border:0}
  .editor-shell .editor-tools .editor-smart-actions .btn{font-size:11px;min-height:34px}
  .editor-shell .scope-bar{grid-area:scope;min-width:0;min-height:26px;padding:3px 22px;font-size:10px}
  .editor-shell .editor-scroll{grid-area:canvas;min-width:0;min-height:0;height:100%;padding:16px 22px 28px;scrollbar-gutter:stable}
  .editor-shell .editor-page{width:100%;max-width:1400px;min-height:100%;margin-inline:auto;border-radius:10px}
  .editor-shell .ql-editor{min-height:100%;padding:28px clamp(28px,3vw,64px) 72px}
  .editor-shell .ql-editor.ql-blank:before{left:clamp(28px,3vw,64px);right:clamp(28px,3vw,64px)}
  .editor-shell .editor-status{grid-area:status;min-width:0;min-height:0;padding:3px 22px;font-size:11px}
  .editor-shell .editor-status .meta-button{min-height:28px;padding:4px 8px}

  .editor-shell .part-assignment-bar{grid-area:participants;min-width:0;padding:7px 20px;border-top:0}
  .editor-shell .speaker-chips{flex-wrap:wrap;max-height:96px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;gap:6px}
  .editor-shell .speaker-chip{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}
}

@media (min-width:751px) and (max-height:500px) {
  .editor-shell .part-assignment-bar{padding-block:3px}
  .editor-shell .assignment-heading{min-height:22px}
  .editor-shell .speaker-chips{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;min-height:32px;max-height:36px}
  .editor-shell .speaker-chip{flex-shrink:0;max-width:none;white-space:nowrap}
}
