/* Desktop design adapter from the supplied office productivity package. */
@media screen and (min-width: 921px) {
/* FuuVo AI Document: two independent, keyboard-accessible PC splitters.
   Existing template cards, editor canvas and native event handlers are retained. */
.fv-document-splitter-track { display: none; }
.fv-document-splitter-help { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

@media screen and (min-width: 921px) {
  body.fv-document-motion .ai-document-app .ai-document-landing.fv-document-resizable {
    display: grid !important;
    grid-template-columns: var(--fv-document-intro-width, 340px) 24px minmax(0, 1fr) !important;
    column-gap: 0 !important;
    align-items: start;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }
  body.fv-document-motion .ai-document-app .ai-document-landing.fv-document-resizable[hidden] { display: none !important; }
  body.fv-document-motion .ai-document-landing.fv-document-resizable > .ai-document-intro {
    grid-column: 1; grid-row: 1; width: auto; min-width: 0; min-height: 0;
    max-width: 100%; padding: 25px 23px; box-sizing: border-box;
  }
  body.fv-document-motion .ai-document-intro h1 { max-width: none; margin-top: 26px; font-size: clamp(30px, 2.8vw, 43px); }
  body.fv-document-motion .ai-document-intro > p { max-width: none; }
  body.fv-document-motion .ai-document-landing.fv-document-resizable > .ai-document-library {
    grid-column: 3; grid-row: 1;
    width: calc(100% + var(--fv-document-library-expansion, 0px));
    margin-left: calc(-1 * var(--fv-document-library-expansion, 0px));
    min-width: 0; max-width: none;
    padding: 23px; box-sizing: border-box; position: relative; z-index: 1;
  }
  body.fv-document-motion .ai-document-landing .ai-document-prompt { min-width: 0; max-width: 100%; }
  body.fv-document-motion .ai-document-landing .ai-document-output-formats { min-width: 0; }
  body.fv-document-motion .ai-document-landing .ai-document-quick-prompts { flex-wrap: wrap; }
  body.fv-document-motion .ai-document-library-head { flex-wrap: wrap; gap: 13px; }
  body.fv-document-motion .ai-document-library-tools { flex-wrap: wrap; }
  body.fv-document-motion .ai-document-category-panel-top { flex-wrap: wrap; gap: 10px; }
  body.fv-document-motion .ai-document-category-panel-top nav { min-width: 0; flex: 1 1 320px; flex-wrap: wrap; overflow: visible; }
  body.fv-document-motion .ai-document-category-panel-top .ai-document-category-note { min-width: 0; }
  body.fv-document-motion .ai-document-template-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
  body.fv-document-motion .ai-document-template-head .ai-document-search { min-width: 0; max-width: 100%; flex: 0 1 220px; }
  body.fv-document-motion .ai-document-template-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)) !important; }
  body.fv-document-motion .ai-document-template-grid.is-compact { grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)) !important; }
  body.fv-document-motion .ai-document-template-card { min-width: 0; }
  body.fv-document-motion .ai-document-landing.fv-document-resizable { overflow-anchor: none; }
  body.fv-document-motion .ai-document-landing #ai-document-template-grid {
    position: relative;
    transform: translateY(var(--fv-document-catalog-offset, 0px));
    margin-bottom: var(--fv-document-catalog-offset, 0px);
    overflow-anchor: none;
  }
  body.fv-document-motion .ai-document-landing.fv-document-library-expanded > .fv-document-splitter-track { opacity: 0; pointer-events: none; }

  body.fv-document-motion .ai-document-editor-body.fv-document-resizable {
    --fv-document-outline-width: 170px;
    display: grid !important;
    grid-template-columns: var(--fv-document-outline-width) minmax(0, 1fr) 24px var(--fv-document-ai-width, 300px) !important;
    min-width: 0;
    align-items: stretch;
  }
  body.fv-document-motion .ai-document-app:not(.is-editor-preview) .ai-document-editor-body.fv-document-resizable > .ai-document-outline-panel {
    grid-column: 1; grid-row: 1; display: block; min-width: 0;
  }
  body.fv-document-motion .ai-document-editor-body.fv-document-resizable > .ai-document-canvas-panel {
    grid-column: 2; grid-row: 1; min-width: 0; max-width: 100%;
  }
  body.fv-document-motion .ai-document-app:not(.is-editor-preview) .ai-document-editor-body.fv-document-resizable > .ai-document-ai-panel {
    grid-column: 4; grid-row: 1; display: block; min-width: 0; max-width: 100%;
    box-sizing: border-box; padding-left: 13px; padding-right: 13px;
  }
  body.fv-document-motion .ai-document-canvas-wrap { min-width: 0; max-width: 100%; height: auto; padding: 24px 18px 42px; box-sizing: border-box; }
  body.fv-document-motion .ai-document-canvas { box-sizing: border-box; min-width: 0; max-width: 100%; padding-left: clamp(24px, 4vw, 66px); padding-right: clamp(24px, 4vw, 66px); overflow-wrap: anywhere; }
  body.fv-document-motion .ai-document-panel-tabs { flex-wrap: wrap; }
  body.fv-document-motion .ai-document-editor-topbar { gap: 10px; flex-wrap: wrap; padding-top: 12px; padding-bottom: 12px; }
  body.fv-document-motion .ai-document-editor-topbar-left { min-width: 0; }
  body.fv-document-motion .ai-document-editor-topbar-center { flex: 1 1 150px; justify-content: center; }
  body.fv-document-motion .ai-document-editor-title { min-width: 0; }
  body.fv-document-motion .ai-document-editor-title input { max-width: min(240px, 24vw); }
  body.fv-document-motion .ai-document-editor-actions { flex-wrap: wrap; margin-left: auto; }
  body.fv-document-motion .ai-document-editor-toolbar { flex-wrap: wrap; }
  body.fv-document-motion .ai-document-ai-panel textarea { box-sizing: border-box; }

  body.fv-document-motion .fv-document-resizable > .fv-document-splitter-track {
    display: block; min-width: 0; align-self: stretch; box-sizing: border-box;
    grid-row: 1; padding-top: 150px; position: relative;
  }
  body.fv-document-motion .ai-document-landing > .fv-document-splitter-track { grid-column: 2; align-self: start; }
  body.fv-document-motion .ai-document-editor-body > .fv-document-splitter-track { grid-column: 3; background: #f4f7f6; }
  body.fv-document-motion .fv-document-splitter {
    position: sticky; top: 150px; height: 122px; width: 100%; display: flex;
    align-items: center; justify-content: center; border: 0; border-radius: 8px;
    color: #80988f; background: transparent; cursor: col-resize; touch-action: none;
    outline: none; z-index: 4;
  }
  body.fv-document-motion .fv-document-splitter::before {
    content: ''; position: absolute; top: 6px; bottom: 6px; width: 2px; border-radius: 2px; background: #d2dfda;
  }
  body.fv-document-motion .fv-document-splitter-grip {
    position: relative; display: block; width: 14px; height: 36px; border: 1px solid #cddbd6;
    border-radius: 7px; background: #fff; box-shadow: 0 2px 5px #173b490a;
  }
  body.fv-document-motion .fv-document-splitter-grip::before,
  body.fv-document-motion .fv-document-splitter-grip::after { content: ''; position: absolute; top: 12px; width: 1px; height: 10px; background: currentColor; border-radius: 1px; }
  body.fv-document-motion .fv-document-splitter-grip::before { left: 4px; }
  body.fv-document-motion .fv-document-splitter-grip::after { right: 4px; }
  body.fv-document-motion .fv-document-splitter:is(:hover,:focus-visible,.is-dragging)::before { background: linear-gradient(180deg,#1678fa,#12a973 28%,#e9ad00 52%,#f34764 76%,#a14cb2); }
  body.fv-document-motion .fv-document-splitter:is(:hover,:focus-visible,.is-dragging) .fv-document-splitter-grip { border-color: #79a696; color: #397366; }
  body.fv-document-motion .fv-document-splitter:focus-visible .fv-document-splitter-grip { outline: 2px solid #267b6b; outline-offset: 3px; }
  body.fv-document-motion .fv-document-splitter-tip {
    position: absolute; top: -31px; left: 50%; transform: translateX(-50%); pointer-events: none;
    padding: 7px 9px; border: 1px solid #e1e8e4; border-radius: 6px; background: #fff;
    color: #46685e; font: 11px/1.4 system-ui,sans-serif; white-space: nowrap; opacity: 0;
    transition: opacity .12s ease;
  }
  body.fv-document-motion .fv-document-splitter:is(:hover,:focus-visible,.is-dragging) .fv-document-splitter-tip { opacity: 1; }
  body.fv-document-motion.fv-document-is-resizing, body.fv-document-motion.fv-document-is-resizing * { cursor: col-resize!important; user-select: none!important; }

  body.fv-document-motion .ai-document-app.is-editor-preview .ai-document-editor-body.fv-document-resizable { grid-template-columns: minmax(0,1fr)!important; }
  body.fv-document-motion .ai-document-app.is-editor-preview .ai-document-editor-body > .ai-document-canvas-panel { grid-column: 1 / -1; }
  body.fv-document-motion .ai-document-app.is-editor-preview .ai-document-editor-body > .fv-document-splitter-track { display: none; }
  body.fv-document-motion .ai-document-app.is-editor-fullscreen .ai-document-editor-shell { display: flex; flex-direction: column; }
  body.fv-document-motion .ai-document-app.is-editor-fullscreen .ai-document-editor-body { flex: 1; min-height: 0; overflow: auto; }
  body.fv-document-motion .ai-document-app.is-editor-fullscreen .ai-document-editor-topbar,
  body.fv-document-motion .ai-document-app.is-editor-fullscreen .ai-document-editor-toolbar,
  body.fv-document-motion .ai-document-app.is-editor-fullscreen .ai-document-editor-statusbar { flex: 0 0 auto; }
}
@media screen and (min-width: 921px) and (max-width: 1120px) {
  body.fv-document-motion .ai-document-editor-body.fv-document-resizable { --fv-document-outline-width: 140px; }
  body.fv-document-motion .ai-document-landing.fv-document-resizable > .ai-document-intro { padding: 22px 18px; }
  body.fv-document-motion .ai-document-landing.fv-document-resizable > .ai-document-library { padding: 20px 16px; }
  body.fv-document-motion .ai-document-canvas { padding-left: 23px; padding-right: 23px; }
  body.fv-document-motion .ai-document-editor-topbar-center { display: none; }
}
@media (prefers-reduced-motion: reduce) { body.fv-document-motion .fv-document-splitter-tip { transition: none; } }
@media print { .fv-document-splitter-track { display: none!important; } }
/* The shared shell centers flex children. Give the editor a stable width so
   resizing redistributes the two panels instead of widening the whole shell. */
body.fv-document-motion .ai-document-app:not(.is-editor-fullscreen) .ai-document-editor-shell {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

}