/* edet-focus.css — focus mode layout. The structural hides (sidebar,
   aux, preview, goal bar, most chrome) live in edet-base.css with the
   grid override; this file just centers + comfortably constrains the
   editor when #edet-app[data-focus="on"]. Tokens from site.css :root. */

/* Editor pane fills the whole width in focus mode so the "desk" background
   runs edge-to-edge like a real document app; the page sheet stays centered
   inside it via the editor's own max-width (the user's Page width pref). */
.edet-app[data-focus="on"] .dr-editor-pane {
    flex: 1 1 auto;
    width: 100%;
    border-right: none;
}
/* the chrome stays (for the word count + saved + exit button) but reads
   as a thin, quiet strip — no bottom rule (!important beats the grid-desk
   top-zone rule in site.css, which is more specific). */
.edet-app[data-focus="on"] .dr-chrome {
    border-bottom: none !important;
}

/* On the grid desk, focus removes the grid lines (plain desk) and LOCKS the board
   in place: cards + connector lines stay visible as a frozen backdrop but can't be
   dragged, resized, connected or selected (pointer-events off → a press falls
   through to pan/edit, never moves a card). Plus the chrome cleanup: hide the
   split-chapter read-only banner and suppress the frosted-chrome panes (their bars
   are hidden in focus, so they'd otherwise paint blurred rectangles). The page is
   recentered by edet-focus.js so it sits centered over the locked board. */
.edet-app[data-focus="on"] .dr-readonly-banner,
.edet-app[data-focus="on"] .dr-suggest-bar { display: none !important; }
.edet-app[data-focus="on"] .dr-canvas-grid { background-image: none !important; }   /* remove grid lines, keep desk bg */
.edet-app[data-focus="on"] .dr-board-card,
.edet-app[data-focus="on"] .dr-board-edge-hit { pointer-events: none !important; }   /* lock cards + lines in place */
body.edet.edet-focus::before,
body.edet.edet-focus::after { display: none !important; }