/*! Copyright (c) 2026 Mark T. Fulwider. All rights reserved. */
/* SPLIT SCREEN (Mark, 24 October 2026). The symbol after the page name, the split page, and a page inside a half.
   The behaviour is in split-screen.js. */

/* The symbol: small, right after the page name, the same ink as the name. */
.split-btn{display:inline-grid;place-items:center;vertical-align:middle;width:30px;height:26px;margin:0 0 0 10px;position:relative;top:-3px;padding:0;border:1px solid transparent;border-radius:3px;background:transparent;color:#28444e;cursor:pointer}
.split-btn svg{width:22px;height:22px;display:block}
.split-btn:hover{border-color:#d8dfe0;background:#fff}
.split-btn[aria-pressed="true"]{color:#bc8d41}
@media (max-width:899px){html:not(.split-half) .split-btn{display:none}}

/* The split page: two halves the same size, side by side, filling the space between the side bars. */
body.split-page #main{padding:6px 6px 0;min-width:0}
body.split-page .split-name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.split-page .split-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px;height:calc(100vh - var(--split-top,88px) - 6px);min-height:420px}
body.split-page .split-half-box{position:relative;min-width:0;min-height:0;border-top:3px solid transparent;background:#e9eef0}
body.split-page .split-half-box.is-chosen{border-top-color:#bc8d41}
body.split-page .split-half-box iframe{display:block;width:100%;height:100%;border:0;background:#e9eef0}
body.split-page .tp-copyright,body.split-page main>.tp-copyright{display:none}

/* A page inside a half, and a detached page (its own window, ?pane=1): only the sheet (Mark, 24 October 2026). The split page around it has the masthead and both side bars. */
html:is(.split-half,.pane-window) .skip,html:is(.split-half,.pane-window) .masthead,html:is(.split-half,.pane-window) #masthead,html:is(.split-half,.pane-window) #left-rail,html:is(.split-half,.pane-window) #right-rail,html:is(.split-half,.pane-window) .tp-copyright{display:none!important}
html:is(.split-half,.pane-window) .workspace{grid-template-columns:minmax(0,1fr)!important;max-width:none!important;width:100%;margin:0;min-height:100vh}
html:is(.split-half,.pane-window) #main{padding:10px 12px 30px;max-width:none}
html:is(.split-half,.pane-window) .detach-word{display:none}

/* Inside a half the edit strip stays on one line: the buttons get narrower instead of wrapping. */
html:is(.split-half,.pane-window) body .sheet-lock .doc-top{column-gap:10px}
html:is(.split-half,.pane-window) body .sheet-lock .doc-top .edit-strip{flex-wrap:nowrap!important;gap:2px}
html:is(.split-half,.pane-window) body .sheet-lock .doc-top .edit-strip .note-btn{min-width:15px;font-size:14px}
html:is(.split-half,.pane-window) body .sheet-lock .doc-top .edit-strip .note-btn[data-edit="pen"]{min-width:22px}
html:is(.split-half,.pane-window) body .sheet-lock .doc-top .edit-strip .note-btn[data-edit="pen"] img{width:100%;max-width:38px;height:auto}
html:is(.split-half,.pane-window) body .sheet-lock .doc-top .edit-strip .note-btn[data-edit="latex"]{font-size:26px}
html:is(.split-half,.pane-window) .ai-record .ai-tools{overflow:visible;flex-wrap:wrap;row-gap:4px}
html:is(.split-half,.pane-window) .ai-record .edit-strip{width:100%}
html:is(.split-half,.pane-window) .ai-record .note-btn{flex:1 1 0;width:auto;min-width:14px;max-width:26px}
html:is(.split-half,.pane-window) .ai-record .note-btn.ai-pen{flex:1 1 0;min-width:20px;max-width:32px}
html:is(.split-half,.pane-window) .ai-record .note-btn.ai-pen img{width:100%;max-width:30px;height:auto}

/* Key Hop (Shift, Shift): a short gold glow shows where the typing landed. */
.key-hop-here{outline:2px solid #bc8d41!important;outline-offset:2px;transition:outline-color .4s}

/* A detached window has no split symbol (split the main window instead). */
html.pane-window .split-btn{display:none}