/* AI Record. This page only. One sheet; the writing box stays at the bottom. */
*{box-sizing:border-box}
body:has(> #app){display:flex;flex-direction:column;height:100dvh;overflow:hidden;margin:0;background:#eef2f4;font-family:Georgia,"Times New Roman",serif;color:#172a33}
body:has(> #app) #app{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;padding:10px 12px}
#ai-record-host{flex:1 1 auto;min-height:0;height:100%;display:flex;flex-direction:column}

.ai-record{--ai-pt:14pt;flex:1 1 auto;min-height:0;height:100%;display:flex;flex-direction:column;color:#172a33}
.ai-record .ai-paper{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;margin:6px 8px 0;background:#fff;border:16px solid #8d8d8d;box-shadow:inset 0 0 0 1px #5e5e5e;padding:16px 22px 14px}
.ai-record .ai-top{flex:0 0 auto;display:grid;grid-template-columns:max-content minmax(0,1fr);grid-template-rows:auto auto;column-gap:18px;row-gap:2px;align-items:start;margin:0 8px 4px}
.ai-record .ai-top h1{grid-column:1;grid-row:1 / span 2;display:flex;align-items:center;gap:10px;margin:0;padding:0 8px 0 0;font:400 34px/1 Georgia,"Times New Roman",serif;color:#1a3f6e;letter-spacing:-.02em;background:transparent}
.ai-record .ai-rec{width:18px;height:18px;flex:0 0 18px;margin:10px 0 0;padding:0;border:0;border-radius:1px;background:#111;cursor:pointer}
.ai-record .ai-rec.is-on{background:#c42020}
.ai-record .ai-tools{grid-column:2;grid-row:1;display:flex;flex-wrap:nowrap;align-items:center;gap:2px;min-width:0;margin:6px 0 0;overflow-x:auto}
.ai-record .edit-strip{display:flex;flex-wrap:nowrap;gap:2px;align-items:center;margin:0}
.ai-record .note-btn{width:26px;height:24px;flex:0 0 26px;padding:0;border:1px solid #d5dee3;background:#fff;color:#172a33;font:12px/1 Georgia,"Times New Roman",serif;cursor:pointer}
.ai-record .note-btn.is-pen{position:relative;z-index:1;box-shadow:0 0 0 2px #172a33,0 0 12px 4px var(--pen,#ffe14a)}
.ai-record .note-btn.ai-pen{width:32px;height:30px;flex:0 0 32px;margin-top:-8px;border:0;background:transparent}
.ai-record .note-btn.ai-pen img{display:block;width:30px;height:30px;margin:0 auto;pointer-events:none}
.ai-record .ai-pt{display:inline-flex;align-items:center;gap:3px;height:24px;flex:0 0 auto;margin-left:4px;padding:0 4px;border:1px solid #d5dee3;background:#fff;font:12px/1 Arial,Helvetica,sans-serif;color:#172a33}
.ai-record .ai-pt select{width:auto;min-width:0;height:20px;margin:0;padding:0;border:0;background:transparent;font:12px/1 Arial,Helvetica,sans-serif;color:#172a33}
.ai-record .ai-top .breadcrumbs{grid-column:2;grid-row:2;display:flex;flex-wrap:nowrap;gap:8px;align-items:center;min-width:0;margin:0;overflow:hidden;white-space:nowrap;font:14px/1.2 Georgia,"Times New Roman",serif;color:#5d737c}
.ai-record .ai-top .breadcrumbs a{color:#5d737c;text-decoration:none}
.ai-record .ai-top .breadcrumbs a:hover{text-decoration:underline}
.ai-record .ai-chats{margin-left:auto;display:inline-flex;align-items:center;gap:6px}
.ai-record .ai-chats select,.ai-record .ai-chats button{height:24px;max-width:200px;border:1px solid #d5dee3;background:#fff;color:#172a33;font:12px/1 Arial,Helvetica,sans-serif;cursor:pointer}
.ai-record .ai-chats button{padding:0 8px}
.ai-record .ai-chats button.is-on{color:#1d6b2f;border-color:#9bc7a5}
.ai-record .ai-start{margin:0 0 8px}
.ai-record .ai-start input{width:min(360px,100%);height:28px;margin:0;padding:2px 8px;border:1px solid #c5c5c5;background:#fff;font:14px/1.3 Georgia,"Times New Roman",serif;color:#172a33}
.ai-record .ai-scroll{flex:1 1 auto;min-height:0;overflow:auto}
.ai-record .ai-chat-title{margin:4px 0 14px;font:700 var(--ai-pt)/1.3 Georgia,"Times New Roman",serif;color:#1a3f6e}
/* The title box (Mark, 24 October 2026): the same light blue New/Title/Date box as a new note. Until the page
   has a title, the rest of the page waits (dimmed and not usable). The start date stands beside the title. */
.ai-record .ai-start.ai-title-box{display:flex;justify-content:center;margin:2px 0 14px}
.ai-record .ai-title-box input{width:auto;min-width:18ch;max-width:100%;field-sizing:content;height:auto;padding:4px 12px;border:1px solid #7eb8c4;background:#fff;text-align:center;font:16px/1.15 Georgia,"Times New Roman",serif;color:#000}
.ai-record .ai-title-box input::placeholder{color:#8ec4d0}
.ai-record .ai-title-box input:focus{outline:2px solid #7eb8c4;outline-offset:2px}
.ai-record.is-untitled .ai-tools,.ai-record.is-untitled #ai-flow,.ai-record.is-untitled #record-send,.ai-record.is-untitled [data-record-light]{opacity:.4}
.ai-record .ai-chat-when{margin-left:14px;font:400 16px/1.3 Georgia,"Times New Roman",serif;color:#000;white-space:nowrap}
.ai-record .ai-flow{min-height:0;overflow:visible;padding:8px 4px 12px;outline:none;font:var(--ai-pt)/1.45 Georgia,"Times New Roman",serif}
.ai-record .ai-flow p{margin:0 0 12px;white-space:pre-wrap}
.ai-record .ai-flow b{font-weight:700}
.ai-record .ai-index{margin-right:.4em;color:#888;font-weight:400}
.ai-record .ai-status{flex:0 0 auto;min-height:0;margin:0;color:#a32020;font:12px/1.3 Georgia,"Times New Roman",serif}
.ai-record .ai-status:empty{display:none}
.ai-record .ai-status.is-calm{color:#5d6b78}
.ai-record .ai-write{flex:0 0 auto;display:flex;align-items:flex-end;gap:10px;margin-top:8px}
.ai-record .ai-query{flex:1 1 auto;display:flex;align-items:flex-start;gap:8px;min-height:72px;padding:10px 12px;border:1px solid #24343c;background:#fff}
.ai-record .ai-query b{flex:0 0 auto;font:700 var(--ai-pt)/1.2 Georgia,"Times New Roman",serif;color:#24343c}
.ai-record .ai-query textarea{flex:1 1 auto;width:auto;min-width:0;min-height:48px;margin:0;padding:0;border:0;resize:none;background:transparent;font:var(--ai-pt)/1.45 Georgia,"Times New Roman",serif;color:#172a33;outline:none}
.ai-record .ai-send{width:42px;height:42px;flex:0 0 42px;border:0;border-radius:50%;padding:0;background:#1a8cff;color:#fff;cursor:pointer;display:grid;place-items:center}
.ai-record .ai-send[disabled]{opacity:.5;cursor:progress}
.ai-record .ai-send svg{width:20px;height:20px;display:block}
.ai-record .ai-copy{flex:0 0 auto;margin:8px 8px 0;text-align:center;font:12px/1.5 Georgia,"Times New Roman",serif;color:#5d737c}

@media (max-width:640px){
  #app{padding:6px}
  .ai-record .ai-top{grid-template-columns:minmax(0,1fr);margin:0 4px 4px}
  .ai-record .ai-top h1{grid-row:1;font-size:24px}
  .ai-record .ai-tools,.ai-record .ai-top .breadcrumbs{grid-column:1;grid-row:auto}
  .ai-record .ai-top .breadcrumbs{flex-wrap:wrap;white-space:normal;row-gap:4px}
  .ai-record .ai-chats{margin-left:0}
  .ai-record .ai-paper{margin:4px 2px 0;border-width:8px;padding:10px 10px 8px}
}

#ai-record-host{min-width:0;max-width:100%;overflow:hidden}
.ai-record{min-width:0;max-width:100%;overflow:hidden}
.ai-record .ai-top{position:relative;z-index:5;background:#eef2f4;overflow:visible;flex:none}
.ai-record .ai-top .breadcrumbs{position:relative;z-index:6;background:#eef2f4}
.ai-record .ai-paper{position:relative;z-index:1;min-width:0;overflow:hidden;flex:1 1 auto}
.ai-record .ai-top h1{position:relative;z-index:6;align-self:center;background:#eef2f4;padding-left:8px}
.ai-record .ai-tools{position:relative;z-index:1;align-self:center;max-width:100%;overflow-x:auto;overflow-y:hidden}
.ai-record .ai-paper{position:relative;z-index:1;min-width:0;overflow:hidden}
.ai-record .ai-scroll{min-width:0;overflow:auto;overscroll-behavior:contain}
.ai-record .ai-math-draw{display:block;margin:2px 0 8px 4.2em;max-width:100%;overflow-x:auto}
.ai-record .ai-math-draw .ai-math{display:block}
.ai-record .ai-math-draw .ai-math[data-display="1"]{margin:4px 0}
.ai-record .ai-math-draw svg{max-width:100%;height:auto}

body:has(#ai-record-host),html:has(#ai-record-host){height:100dvh;max-height:100dvh;overflow:hidden}
body:has(#ai-record-host){display:flex;flex-direction:column}
body:has(#ai-record-host) .masthead{position:relative;top:auto;flex:0 0 auto}
body:has(#ai-record-host) .workspace{flex:1 1 auto;min-height:0;height:auto;overflow:hidden}
body:has(#ai-record-host) #main{min-height:0;height:100%;overflow:hidden;display:flex;flex-direction:column;padding-bottom:8px}
body:has(#ai-record-host) .left-rail,body:has(#ai-record-host) .right-rail{position:relative;top:auto;height:100%;max-height:100%;overflow:auto}
body:has(#ai-record-host) .stage{flex:1 1 auto;min-height:0;overflow:hidden;display:flex;flex-direction:column}

/* No add-on for this browser yet: one plain line under the title row (Mark, 27 October 2026). */
.ai-record .ai-browser-note{margin:0 0 8px;padding:6px 10px;border:1px solid #c9d6da;background:#f5f9f8;color:#24343c;font:14px/1.4 Georgia,"Times New Roman",serif}
/* The title can always be changed: it shows it can be clicked (Mark, 28 October 2026). */
.ai-record .ai-chat-title{cursor:text;border-radius:3px}
.ai-record .ai-chat-title:hover,.ai-record .ai-chat-title:focus-visible{background:#eef5fb;outline:1px dashed #9ab6cc;outline-offset:3px}
/* One source per record: lines from another AI kept aside (Mark, 29 October 2026). */
.ai-record .ai-aside{margin:-6px 0 14px;padding:10px 14px;border-left:4px solid #d1a56a;background:#fffaf1;font:15px/1.45 Georgia,"Times New Roman",serif;color:#24343c}
.ai-record .ai-aside-go{margin-left:6px;padding:5px 12px;border:1px solid #1c3340;border-radius:4px;background:#1c3340;color:#fff;font:600 14px/1.2 Georgia,"Times New Roman",serif;cursor:pointer}
/* The Auto LaTeX ∑, as on every edit line (Mark, 4 November 2026). */
.ai-record .edit-strip .note-btn[data-edit="latex"]{border:0;background:transparent;color:#3b2f9a;font:28px/1 Georgia,'Times New Roman',serif;margin-top:-5px}
.ai-record .edit-strip .note-btn[data-edit="latex"][aria-pressed="true"]{color:#5a3fd0;text-shadow:0 0 6px #b9a9ff}
