
/* InkFlow • Apple-inspired interface preview
   All application features and bindings are inherited from the UI Review build.
   This layer affects presentation only; printable A4 pages are unchanged. */
@media screen {
 :root {
  color-scheme: light;
  --bg-color: #f5f5f7;
  --sidebar-bg: #ffffff;
  --text-color: #1d1d1f;
  --accent-color: #007aff;
  --editor-bg: #ffffff;
  --editor-border: #e5e5ea;
  --stat-box-bg: #f5f5f7;
  --subtle: #86868b;
  --soft: #f2f2f7;
  --shadow: 0 14px 40px rgba(0,0,0,.09),0 1px 3px rgba(0,0,0,.03);
  --sidebar-width: 328px;
 }
 body.dark-mode {
  color-scheme: dark;
  --bg-color: #18181b;
  --sidebar-bg: #262629;
  --text-color: #f5f5f7;
  --accent-color: #0a84ff;
  --editor-bg: #232326;
  --editor-border: #414146;
  --stat-box-bg: #333337;
  --subtle: #a1a1a6;
  --soft: #36363a;
  --shadow: 0 18px 48px rgba(0,0,0,.34);
 }
 html,body{height:100%;min-width:0}
 body{
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','Segoe UI',Arial,sans-serif;
  color:var(--text-color);background:var(--bg-color);line-height:1.48;
  font-size:13px;-webkit-font-smoothing:antialiased;
 }
 .app-container{height:100dvh;min-height:0}
 .main-content{padding:0 26px 22px;min-width:0;gap:0}
 .header-section{
  margin:0 -26px 17px;padding:0 26px 12px;
  background:var(--sidebar-bg);border-bottom:1px solid var(--editor-border);
  box-shadow:0 1px 2px rgba(0,0,0,.012);gap:0;position:relative;z-index:10
 }
 .top-row{min-height:63px;height:63px;gap:12px}
 .inkflow-brand{
  font-size:19px;letter-spacing:-.047em;font-weight:750;line-height:1;
  color:var(--text-color);padding-right:17px;border-right:1px solid var(--editor-border);
  gap:5px
 }
 .brand-mark{width:6px;height:6px;transform:translateY(5px);background:var(--accent-color);opacity:.95}
 .top-row #filenameInput{
  font-size:13px;font-weight:570;color:var(--text-color);border:1px solid transparent;
  width:248px;max-width:34vw;background:transparent;padding:9px 11px;border-radius:9px;
 }
 .top-row #filenameInput:hover{background:var(--soft)}
 .top-row #filenameInput:focus{background:var(--editor-bg);border-color:var(--accent-color);box-shadow:0 0 0 3px #007aff19}
 .save-status{margin-right:auto;font-size:11px;color:var(--subtle);opacity:1}
 button,button.secondary{
  border-radius:10px;background:var(--editor-bg);color:var(--text-color);
  border:1px solid var(--editor-border);font-size:12.5px;font-weight:570;
  min-height:35px;padding:7px 12px;letter-spacing:-.008em;gap:7px;
  box-shadow:none;transition:background .14s,border-color .14s,box-shadow .14s,transform .12s
 }
 button:hover,button.secondary:hover{background:var(--soft);border-color:#c9c9ce;opacity:1}
 button:active{transform:scale(.985)}
 button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{
  outline:3px solid rgba(0,122,255,.35);outline-offset:2px
 }
 select{
  color:var(--text-color);background-color:var(--editor-bg);border:1px solid var(--editor-border);
  border-radius:10px;min-height:35px;padding:7px 29px 7px 11px;
  font-weight:520;font-size:12px;
 }
 .ui-icon{width:16px;height:16px;flex:none;display:block}
 .ui-button-label{display:inline-flex;align-items:center;white-space:nowrap}
 .top-row #dashboardToggle,.top-row #settingsButton,.top-row #themeButton{
  background:transparent;border:1px solid transparent;min-height:36px;padding:7px 10px;
  border-radius:10px;margin-left:0!important;color:var(--text-color);
 }
 .top-row #dashboardToggle{margin-left:auto!important}
 .top-row #dashboardToggle[aria-expanded="true"]{border-color:var(--editor-border);background:var(--soft)}
 .top-row #dashboardToggle:hover,.top-row #settingsButton:hover,.top-row #themeButton:hover{background:var(--soft)}
 .toolbar{gap:7px;flex-wrap:wrap;overflow:visible;padding:0;margin:0;align-items:center;min-height:37px}
 .toolbar>*{flex:none}
 .toolbar #saveButton,.toolbar #saveButton.secondary{
  background:var(--accent-color);border-color:var(--accent-color);color:#fff;
  box-shadow:0 1px 3px #007aff24
 }
 .toolbar #saveButton:hover{background:#006be1;filter:none}
 body.dark-mode .toolbar #saveButton{color:#fff}
 .toolbar #analyzeButton{color:var(--text-color);border:1px solid var(--editor-border);background:var(--editor-bg)}
 #exportFormat{width:86px}
 #exportStyle{width:163px;max-width:163px}
 #mainToolbar #pdfButton{font-weight:630}
 .toolbar .mobile-more,.file-more{display:inline-flex!important}
 .toolbar:not(.expanded)>#exportStyle,
 .toolbar:not(.expanded)>#stylePreviewButton,
 .toolbar:not(.expanded)>.clear-actions {display:none!important}
 .toolbar.expanded{
  border:none;background:transparent;padding:0;margin:0;box-shadow:none;
 }
 .toolbar .mobile-more{background:var(--soft);border-color:transparent;color:var(--text-color)}
 .toolbar .mobile-more:hover{border-color:var(--editor-border)}
 .toolbar #downloadButton{margin-right:6px}
 .toolbar #pdfButton{margin-right:5px}
 .clear-actions{position:relative}
 .clear-menu{border-radius:12px;overflow:hidden;min-width:175px}
 .clear-menu button{border-radius:8px;font-size:12px}
 button.danger{background:var(--editor-bg);color:#c24237;border-color:var(--editor-border)}
 button.danger:hover{background:#fff1f0;color:#b02720}
 .file-strip{
  background:transparent;border-bottom:0;margin:0 0 11px;padding:0;
  min-height:41px;gap:8px;flex:none;display:flex;align-items:center;flex-wrap:nowrap
 }
 .file-strip-title{display:none}
 .file-tabs{gap:6px;min-width:55px;flex:1;scrollbar-width:thin;align-items:center}
 .file-tab{
  background:transparent;border:1px solid transparent;border-radius:9px;
  max-width:230px;min-height:33px
 }
 .file-tab .file-tab-select{font-size:12px;font-weight:540;padding:7px 9px;min-height:31px}
 .file-tab .file-tab-close{font-size:11px;min-height:27px;opacity:.65}
 .file-tab:has([aria-selected="true"]){
  background:var(--editor-bg);border-color:var(--editor-border);
  box-shadow:0 1px 4px rgba(0,0,0,.035);border-radius:9px
 }
 .file-tab:hover{background:var(--soft)}
 .file-commands{gap:5px;overflow:visible;flex-wrap:wrap;align-items:center}
 .file-commands button{font-size:11.5px;min-height:31px;padding:6px 9px;border:1px solid transparent;background:transparent}
 .file-commands button:hover{border-color:var(--editor-border);background:var(--editor-bg)}
 .file-commands #newFileButton{font-weight:600}
 .file-commands #fileMoreButton{background:var(--soft);border-color:transparent}
 .file-commands:not(.expanded)>#downloadWorkspaceButton,
 .file-commands:not(.expanded)>#openWorkspaceButton {display:none!important}
 .editor-tools{margin:0 0 12px;gap:14px;min-width:0;align-items:center}
 .format-toolbar{gap:4px;align-items:center;flex-wrap:nowrap}
 .editor-tools .format-toolbar button{
  border:1px solid transparent;background:transparent;color:var(--text-color);
  border-radius:8px;min-width:34px;min-height:33px;padding:5px 9px;font-size:12px;font-weight:560
 }
 .editor-tools .format-toolbar button:hover{border-color:var(--editor-border);background:var(--editor-bg)}
 .segmented{padding:3px;background:#e9e9ed;border:0;border-radius:11px;gap:2px;box-shadow:none}
 body.dark-mode .segmented{background:var(--soft)}
 .segmented button,.segmented button.secondary{
  padding:5px 14px;min-height:28px;border:0;border-radius:8px;background:transparent;
  box-shadow:none;font-size:12px;font-weight:590
 }
 .segmented button[aria-pressed="true"],.segmented button[aria-pressed="true"].secondary{
  background:#fff;box-shadow:0 1px 3px #0000001c;color:#171719
 }
 body.dark-mode .segmented button[aria-pressed="true"]{background:#535357;color:#fff}
 .segmented #fullscreenButton{border-left:1px solid #c7c7cc;margin-left:5px;padding-left:12px}
 .editor-grid{flex:1;min-height:0;gap:14px;margin:0}
 .pane{
  background:var(--editor-bg);border:1px solid var(--editor-border);
  border-radius:16px;box-shadow:0 3px 14px rgba(0,0,0,.025);
  overflow:hidden;
 }
 .editor-pane:focus-within{border-color:#b7d8fc;box-shadow:0 0 0 3px #007aff10}
 body.dark-mode .editor-pane:focus-within{border-color:var(--accent-color)}
 .CodeMirror{font-size:14.5px;line-height:1.78;color:var(--text-color);background:transparent;
  font-family:ui-monospace,'SFMono-Regular',Menlo,Monaco,Consolas,monospace}
 .CodeMirror-lines{padding:35px 0}
 .CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{padding:0 clamp(20px,4.1vw,58px)}
 .CodeMirror-gutters{border-color:var(--editor-border);background:var(--editor-bg)}
 .CodeMirror-linenumber{color:#b6b6bc}
 .cm-s-default .cm-header,.cm-s-default .cm-strong{color:#0070de}
 .cm-s-default .cm-link{color:#007aff}
 .cm-s-default .cm-quote{color:#74747a}
 .CodeMirror-focused .CodeMirror-selected,.CodeMirror-selected{background:#cbe4ff!important}
 .CodeMirror-cursor{border-left-color:var(--accent-color)!important}
 #preview{padding:40px clamp(28px,6vw,94px);margin:0 auto;max-width:960px;font-size:14.5px;color:var(--text-color)}
 .markdown-body p,.markdown-body li{line-height:1.8}
 .markdown-body h1,.markdown-body h2,.markdown-body h3{letter-spacing:-.025em}
 .markdown-body a{color:var(--accent-color)}
 .markdown-body pre{background:var(--soft);border:1px solid var(--editor-border);border-radius:10px}
 .editor-empty-guide{left:clamp(35px,5vw,76px)!important;top:44px!important}
 .editor-guide-title{font-size:14px!important;color:var(--subtle)!important}
 .editor-guide-subtitle{font-size:12px!important}
 .sidebar{width:328px;flex:0 0 328px;padding:24px 20px;background:var(--sidebar-bg);border-left:1px solid var(--editor-border);box-shadow:none}
 .sidebar .dashboard-header{margin-bottom:20px}
 .sidebar h3{font-size:17px;font-weight:690;letter-spacing:-.025em}
 .sidebar h4{font-size:12px;font-weight:640;letter-spacing:.01em}
 .sidebar .stat-box{background:var(--stat-box-bg);border-radius:13px;padding:18px 14px;margin-bottom:20px}
 .sidebar .stat-item span{font-size:25px;font-weight:620;letter-spacing:-.045em}
 .sidebar .stat-item label{font-size:11px;color:var(--subtle)}
 .sidebar .suggestion-card{background:var(--editor-bg);border:1px solid var(--editor-border);border-left:3px solid var(--accent-color);border-radius:11px;padding:13px;margin-bottom:11px}
 .settings-dialog,.style-preview-dialog{
  background:var(--editor-bg);color:var(--text-color);border:1px solid var(--editor-border);
  border-radius:18px;box-shadow:0 24px 80px #00000024;max-width:min(94vw,740px)
 }
 .settings-dialog::backdrop,.style-preview-dialog::backdrop{background:#15151577;backdrop-filter:blur(6px)}
 .style-preview-header h3{font-size:20px;font-weight:670;letter-spacing:-.025em}
 .style-preview-header p,.settings-note{color:var(--subtle);line-height:1.65}
 .style-preview-card{border:1px solid var(--editor-border);border-radius:13px;overflow:hidden}
 .style-preview-card:hover{border-color:var(--accent-color)}
 .grammar-controls{border-radius:12px;background:var(--soft)}
 .native-mobile-editor{display:none}
}
@media screen and (max-width:1100px){
 .main-content{padding:0 16px 15px}
 .header-section{margin:0 -16px 13px;padding:0 16px 10px}
 .file-strip{flex-wrap:wrap}
 .file-tabs{flex-basis:100%;order:1}
 .file-commands{flex-basis:100%;order:2}
 .toolbar:not(.expanded)>#exportFormat,.toolbar:not(.expanded)>#downloadButton {display:none!important}
}
@media screen and (max-width:820px){
 .main-content{padding:0 13px 13px}
 .header-section{margin:0 -13px 10px;padding:0 13px 10px}
 .top-row{height:56px;min-height:56px;gap:5px;flex-wrap:nowrap}
 .inkflow-brand{font-size:17px;padding-right:10px;margin:0 2px 0 0;letter-spacing:-.05em}
 .top-row #filenameInput{min-width:0;flex:1 1 auto;width:0;max-width:none;padding:8px 7px;font-size:12px}
 .top-row #dashboardToggle{margin-left:0!important}
 .top-row #dashboardToggle,.top-row #settingsButton,.top-row #themeButton{
  min-height:34px;min-width:33px;padding:7px;gap:0
 }
 .top-row #dashboardToggle .ui-button-label,.top-row #settingsButton .ui-button-label,.top-row #themeButton .ui-button-label{display:none}
 .top-row .ui-icon{width:17px;height:17px}
 .toolbar{display:flex;flex-wrap:wrap;gap:5px}
 .toolbar button{font-size:12px;min-height:35px;padding:6px 9px}
 .toolbar #pdfButton{font-size:12px!important}
 .toolbar #pdfButton:after{content:none!important}
 .toolbar #saveButton{order:2!important}
 .toolbar #importButton{order:1!important}
 .toolbar #pdfButton{order:3!important}
 .toolbar #analyzeButton{order:4!important}
 .toolbar #mobileMoreButton{order:5!important}
 .toolbar.expanded>*{order:6}
 .toolbar .ui-icon{width:14px;height:14px}
 .toolbar:not(.expanded)>:not(#importButton):not(#saveButton):not(#pdfButton):not(#analyzeButton):not(#mobileMoreButton):not(#fileInput){display:none!important}
 .toolbar.expanded{border:none;background:transparent;padding:0;margin:0}
 .file-strip{gap:4px;min-height:auto;padding:0;margin:0 0 8px}
 .file-tabs{flex:1 0 100%;order:1;min-height:32px}
 .file-commands{gap:3px;flex:0 0 100%;order:2;flex-wrap:wrap;overflow:visible}
 .file-commands:not(.expanded)>:not(#newFileButton):not(#addFilesButton):not(#fileMoreButton){display:none!important}
 .file-commands #fileMoreButton{border:0}
 .editor-tools{gap:7px;flex-wrap:wrap;margin-bottom:8px}
 .segmented{order:1;flex:none;margin:0;max-width:100%}
 .segmented button,.segmented button.secondary{font-size:11px;padding:5px 9px}
 .format-toolbar{order:2;flex:1 1 100%;gap:3px}
 .editor-tools .format-toolbar button{min-height:34px}
 .editor-grid{gap:0;grid-template-columns:minmax(0,1fr)}
 .pane{border-radius:13px}
 .native-mobile-editor{
  display:block;flex:1;width:100%;min-height:0;height:100%;background:var(--editor-bg);
  border:0;outline:0;border-radius:13px;padding:24px 21px;font-size:16px;line-height:1.72;
  color:var(--text-color);font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  -webkit-user-select:text;user-select:text;-webkit-touch-callout:default;touch-action:pan-y
 }
 .CodeMirror{display:none!important}
 .sidebar{position:fixed!important;top:0;right:0;bottom:0;width:min(92vw,355px);height:100dvh;z-index:2100;box-shadow:var(--shadow);display:block!important}
 .dashboard-scrim:not([hidden]){display:block;position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.35);backdrop-filter:blur(2px)}
 #preview{padding:27px 24px}
 .settings-dialog,.style-preview-dialog{max-width:calc(100vw - 22px);max-height:90dvh}
}
@media screen and (max-width:380px){
 .main-content{padding:0 10px 10px}
 .header-section{margin:0 -10px 8px;padding:0 10px 8px}
 .top-row{flex-wrap:nowrap;height:55px;min-height:55px;gap:3px;padding:0}
 .inkflow-brand{font-size:15.5px;padding-right:7px}
 .top-row #filenameInput{min-width:0;width:0;flex:1 1 auto;font-size:11px;padding:7px 3px}
 .top-row #dashboardToggle,.top-row #settingsButton,.top-row #themeButton{padding:6px;min-width:29px;min-height:32px}
 .toolbar button{font-size:11px;gap:5px;padding:5px 8px}
 .toolbar .ui-icon{width:13px;height:13px}
 .toolbar #pdfButton{font-size:11px!important}
 .toolbar #mobileMoreButton{font-size:11px}
 .segmented button,.segmented button.secondary{padding:5px 7px}
 .native-mobile-editor{padding:20px 16px}
}
@media screen and (prefers-reduced-motion:reduce){
 button,body{transition:none!important;animation:none!important}
}

@media screen and (max-width:820px){
 /* Native-style text labels for the three essential file actions. */
 .toolbar #importButton .ui-button-label,.toolbar #saveButton .ui-button-label,.toolbar #pdfButton .ui-button-label{display:inline-flex!important;align-items:center}
 .toolbar #importButton .ui-button-label{font-size:0}
 .toolbar #importButton .ui-button-label::after{content:"Open";font-size:12px}
 .toolbar #pdfButton .ui-button-label{font-size:0}
 .toolbar #pdfButton .ui-button-label::after{content:"PDF";font-size:12px}
 .toolbar:not(.expanded)>#analyzeButton{display:none!important}
 .toolbar:not(.expanded)>#mobileMoreButton{display:inline-flex!important}
 .toolbar #mobileMoreButton{font-size:12px}
}
@media screen and (max-width:380px){
 .toolbar #importButton .ui-button-label::after,.toolbar #pdfButton .ui-button-label::after{font-size:11px}
 .toolbar #saveButton .ui-button-label{font-size:11px}
 .toolbar{gap:5px}
}



/* ==================== INKFLOW / CLEAR WORKSPACE UI ====================
   ChatGPT-inspired layout language: simple neutral surfaces, clear information
   architecture and strong content hierarchy. Print-specific CSS is untouched. */
@media screen {
:root {
  color-scheme: light;
  --bg-color:#ffffff;--sidebar-bg:#f9f9f9;--text-color:#202123;
  --accent-color:#202123;--editor-bg:#fff;--editor-border:#e6e6e6;
  --stat-box-bg:#f8f8f8;--subtle:#787878;--soft:#f1f1f1;
  --shadow:0 5px 24px rgba(0,0,0,.07);
  --nav-width:260px;--radius:12px;
}
body.dark-mode {
  color-scheme:dark;
  --bg-color:#212121;--sidebar-bg:#171717;--text-color:#f1f1f1;
  --accent-color:#f1f1f1;--editor-bg:#212121;--editor-border:#3a3a3a;
  --stat-box-bg:#303030;--subtle:#aaa;--soft:#303030;
  --shadow:0 8px 30px rgba(0,0,0,.25)
}
html,body{height:100%;min-width:0;overflow:hidden}
body{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  font-size:13px;background:var(--bg-color);color:var(--text-color);line-height:1.4;
  -webkit-font-smoothing:antialiased}
.app-container{height:100dvh;min-height:0;width:100%;display:flex;flex-direction:row;background:var(--bg-color)}
.main-content{padding:0 26px 18px!important;display:flex;flex:1;min-width:0;min-height:0;gap:0;
  background:var(--bg-color);overflow:hidden}
/* Left workspace column. Navigation is intentionally distinct from the editor. */
.ink-nav{width:var(--nav-width);flex:0 0 var(--nav-width);min-width:0;
  display:flex;flex-direction:column;background:var(--sidebar-bg);border-right:1px solid var(--editor-border);
  padding:20px 13px 15px;gap:0;overflow:hidden;z-index:30}
.ink-nav-header{display:flex;align-items:center;justify-content:space-between;padding:1px 10px 18px;
  border-bottom:1px solid var(--editor-border);margin-bottom:16px}
.ink-nav .inkflow-brand{padding:0!important;margin:0!important;border:0!important;font-size:20px;
  font-weight:720;letter-spacing:-.04em;gap:7px;color:var(--text-color)}
.ink-nav .brand-mark{background:#1d946f;width:7px;height:7px;transform:translateY(5px)}
.nav-kicker,.surface-kicker{color:var(--subtle);font-size:10px;text-transform:uppercase;
  letter-spacing:.11em;font-weight:730}
.nav-section{margin:0 0 22px;min-height:0;display:flex;flex-direction:column;gap:7px}
.nav-section-title{padding:7px 12px 5px;display:flex;align-items:center;justify-content:space-between;
  color:var(--subtle);font-size:10px;letter-spacing:.09em;font-weight:730;text-transform:uppercase}
.ink-nav button,.ink-nav button.secondary{width:100%;justify-content:flex-start;text-align:left;
  background:transparent;border:1px solid transparent;color:var(--text-color);
  font-weight:540;border-radius:10px;padding:10px 12px;font-size:12.5px;min-height:38px;
  box-shadow:none;gap:9px}
.ink-nav button:hover,.ink-nav button.secondary:hover{background:var(--soft);opacity:1}
#newFileButton{color:white!important;background:#222222!important;border-color:#222!important;
  font-weight:640!important;justify-content:flex-start}
#newFileButton:hover{background:#404040!important}
body.dark-mode #newFileButton{color:#202020!important;background:#f4f4f4!important;border-color:#f4f4f4!important}
#inkNav .file-tabs{display:flex!important;flex-direction:column!important;align-items:stretch!important;
  overflow:auto;min-height:0;flex:1 1 auto;gap:3px;scrollbar-width:thin;padding:0 2px 4px}
#inkNav .file-tabs .file-tab{flex:0 0 auto;display:flex;align-items:center;max-width:none;
  width:100%;border:1px solid transparent;border-radius:9px;background:transparent;min-height:38px}
#inkNav .file-tabs .file-tab:hover{background:var(--soft)}
#inkNav .file-tabs .file-tab:has([aria-selected="true"]){background:#eaeaea!important;
  border-color:transparent;box-shadow:none}
body.dark-mode #inkNav .file-tabs .file-tab:has([aria-selected="true"]){background:#303030!important}
#inkNav .file-tab .file-tab-select{min-width:0;flex:1;text-align:left;justify-content:flex-start;
  padding:9px 9px;font-size:12.5px;font-weight:500;background:transparent!important;
  border:0!important;min-height:32px;overflow:hidden;text-overflow:ellipsis}
#inkNav .file-tab .file-tab-close{padding:5px 7px;min-width:24px;flex:none;opacity:.55;
  background:transparent!important;border:0!important;min-height:25px;width:auto}
#inkNav .file-tab .file-tab-close:hover{opacity:1;background:#ddd!important}
.nav-file-list{flex:1;min-height:105px;margin-bottom:5px}
.nav-extras{display:flex;flex-direction:column;gap:2px;padding:0 2px}
.nav-extras > button{min-height:34px!important;padding:7px 10px!important}
.nav-advanced{border-top:1px solid var(--editor-border);padding:10px 2px 0;margin-top:6px}
.nav-advanced summary{cursor:pointer;list-style:none;border-radius:9px;padding:8px 10px;
  font-size:12px;font-weight:620;color:var(--text-color);display:flex;align-items:center;justify-content:space-between}
.nav-advanced summary::-webkit-details-marker{display:none}
.nav-advanced summary::after{content:'⌄';font-size:16px;color:var(--subtle)}
.nav-advanced[open] summary::after{content:'⌃'}
.nav-advanced summary:hover{background:var(--soft)}
.nav-advanced-content{display:flex;flex-direction:column;padding-top:2px}
.nav-footer{border-top:1px solid var(--editor-border);padding-top:10px;margin-top:8px;flex:none}
.nav-footer #settingsButton,.nav-footer #themeButton{width:100%;margin:0!important;padding:9px 12px!important;
  min-height:36px;justify-content:flex-start;gap:10px}
.ink-nav .ui-icon{width:15px;height:15px;flex:none}
.nav-footer .clear-actions{width:100%;position:relative}
.nav-footer .clear-actions button{min-height:35px;padding:8px 12px;gap:8px}
.nav-footer #clearButton{color:var(--subtle);font-size:12px}
.nav-footer #clearButton:hover{color:#b9443b}
.nav-footer .clear-menu{bottom:calc(100% + 5px);top:auto;left:4px;right:auto;
  border-radius:10px;min-width:200px;box-shadow:var(--shadow);
  background:var(--editor-bg);z-index:90}
.nav-footer #clearStorageButton{color:#b33b38}
/* Writing header */
.header-section{border:0!important;border-bottom:1px solid var(--editor-border)!important;
  background:var(--bg-color)!important;box-shadow:none!important;margin:0 -26px 18px!important;
  padding:0 26px!important;gap:0!important;flex:none}
.top-row{display:flex;flex-wrap:nowrap;align-items:center;gap:10px;min-height:81px;height:auto!important;
  padding:12px 0;min-width:0}
.doc-info{display:flex;flex-direction:column;min-width:0;flex:1;gap:3px;padding:1px 0}
.doc-info .doc-path{font-size:10px;letter-spacing:.03em;color:var(--subtle);font-weight:520}
.top-row #filenameInput{flex:none!important;width:100%!important;max-width:520px!important;
  font-size:17px!important;font-weight:660!important;padding:4px 3px!important;
  color:var(--text-color)!important;border:1px solid transparent!important;
  border-radius:5px!important;background:transparent!important;min-width:0!important}
.top-row #filenameInput:focus{outline:none!important;border-bottom-color:var(--subtle)!important}
.doc-info .save-status{display:inline;flex:none;margin:0;font-size:10.5px;color:var(--subtle)}
.top-actions{display:flex;gap:7px;flex:none;align-items:center}
button,button.secondary{border:1px solid var(--editor-border);background:var(--editor-bg);
  border-radius:9px;box-shadow:none;color:var(--text-color);font-size:12px;
  font-weight:560;min-height:35px;padding:8px 11px;gap:7px}
button:hover,button.secondary:hover{background:var(--soft);opacity:1}
button:focus-visible,select:focus-visible,summary:focus-visible,input:focus-visible{
  outline:2px solid #5e8fe8;outline-offset:2px}
#saveButton,#saveButton.secondary{background:#222!important;color:#fff!important;border-color:#222!important;
  padding:9px 15px!important;font-weight:650}
#saveButton:hover{background:#454545!important}
body.dark-mode #saveButton{background:#f4f4f4!important;border-color:#f4f4f4!important;color:#202020!important}
.top-actions #dashboardToggle,.top-actions #analyzeButton{margin:0!important;min-width:0}
.top-actions #dashboardToggle[aria-expanded="true"]{background:var(--soft);border-color:var(--editor-border)}
.top-actions .ui-icon{width:15px;height:15px}
#inkNavToggle{display:none;justify-content:center;align-items:center;width:38px;height:38px;
  padding:8px!important;background:transparent!important;border-color:transparent!important}
#inkNavToggle svg{width:19px;height:19px;display:block}
#inkNavToggle:hover{background:var(--soft)!important}
/* Visible hierarchy between tools, editor, export */
.work-top{display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:0 0 10px;flex:none}
.work-top-title{font-size:13px;letter-spacing:-.01em;font-weight:670;color:var(--text-color)}
.work-top-sub{font-size:11px;font-weight:430;color:var(--subtle);margin-left:8px}
.editor-tools{display:flex;flex:none;align-items:center;gap:14px;
  padding:9px 11px;margin:0 0 10px!important;background:var(--sidebar-bg);
  border:1px solid var(--editor-border);border-radius:12px;min-width:0;
  justify-content:space-between;overflow:visible}
.format-toolbar{display:flex;gap:2px;flex-wrap:wrap;align-items:center;min-width:0}
.editor-tools .format-toolbar button,.editor-tools .format-toolbar button.secondary{
  background:transparent!important;border-color:transparent!important;border-radius:8px!important;
  font-size:12px;color:var(--text-color)!important;min-width:32px;min-height:32px!important;
  padding:5px 9px!important;box-shadow:none;font-weight:575}
.editor-tools .format-toolbar button:hover{background:var(--soft)!important}
.segmented{display:flex;align-items:center;border:1px solid var(--editor-border);background:var(--editor-bg)!important;
  border-radius:9px;gap:0;padding:3px;box-shadow:none;flex:none;margin:0}
.segmented button,.segmented button.secondary{background:transparent!important;border:0!important;
  min-height:27px!important;border-radius:6px!important;padding:5px 11px!important;font-size:11.5px}
.segmented button[aria-pressed="true"],.segmented button[aria-pressed="true"].secondary{
  color:var(--text-color)!important;background:var(--soft)!important;
  box-shadow:none!important}
.segmented #fullscreenButton{border-left:1px solid var(--editor-border)!important;
  margin-left:4px;padding-left:12px!important}
.editor-grid{display:grid;min-height:100px;flex:1;gap:12px;margin:0!important;overflow:hidden;
  grid-template-columns:minmax(0,1fr);border-radius:12px}
.editor-grid[data-view="split"]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.pane{border:1px solid var(--editor-border)!important;border-radius:12px!important;
  box-shadow:none!important;overflow:hidden;min-width:0;background:var(--editor-bg)}
.pane-label{padding:10px 16px;min-height:36px;display:flex;align-items:center;
  background:var(--bg-color);border-bottom:1px solid var(--editor-border);
  color:var(--subtle);font-size:10px;letter-spacing:.08em;font-weight:720;flex:none;text-transform:uppercase}
.editor-pane{display:flex;flex-direction:column}
.editor-pane>.editor-host{flex:1;min-height:0;width:100%;position:relative}
.CodeMirror{font-size:14px!important;line-height:1.8!important;font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  background:var(--editor-bg);color:var(--text-color)}
.CodeMirror-lines{padding:25px 0}
.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{padding-left:clamp(17px,3.7vw,62px);padding-right:clamp(17px,3.7vw,62px)}
.CodeMirror-gutters{background:var(--editor-bg);border-right-color:var(--editor-border)}
.CodeMirror-linenumber{color:var(--subtle)}
.CodeMirror-cursor{border-left-color:var(--text-color)!important}
#preview{max-width:930px;margin:0 auto;padding:32px clamp(24px,4.2vw,75px);
  color:var(--text-color);line-height:1.7;font-size:14px}
.preview-pane{display:flex;flex-direction:column}
.preview-scroller{flex:1;min-height:0;overflow:auto}
.markdown-body h1,.markdown-body h2,.markdown-body h3{letter-spacing:-.028em;color:var(--text-color)}
.markdown-body a{color:#2563eb}
.markdown-body pre{background:var(--soft);border:1px solid var(--editor-border);border-radius:9px}
.editor-empty-guide{top:34px!important;left:clamp(24px,4.2vw,76px)!important}
/* Dedicated export bar, separate from the writing toolbar */
.export-panel{display:flex;flex-direction:column;flex:none;border:1px solid var(--editor-border);
  border-radius:12px;margin-top:12px;background:var(--bg-color);padding:10px 15px 12px;gap:8px}
.export-panel-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.export-panel h3{margin:0;font-size:12px;font-weight:670;letter-spacing:-.01em}
.export-panel .export-caption{font-size:11px;color:var(--subtle);font-weight:420}
#mainToolbar{display:flex!important;position:static!important;visibility:visible!important;
  align-items:center;flex-wrap:wrap;gap:8px;padding:0!important;margin:0!important;
  background:none!important;border:0!important;min-height:0;box-shadow:none!important;overflow:visible}
#mainToolbar>*{display:flex!important;order:0!important}
#mainToolbar #fileInput,#mainToolbar #mobileMoreButton,
#mainToolbar #importButton,#mainToolbar #saveButton,#mainToolbar #analyzeButton,
#mainToolbar .clear-actions{display:none!important}
#mainToolbar select{display:inline-block!important;min-height:34px;border-radius:8px;background:var(--editor-bg);
  border:1px solid var(--editor-border);color:var(--text-color);font-size:11.5px;
  max-width:200px;padding:6px 30px 6px 10px}
#exportFormat{width:160px!important;max-width:160px!important}
#exportStyle{width:160px!important;max-width:160px!important}
.export-mini-label{font-size:10.5px;font-weight:640;color:var(--subtle)}
.export-mini-divider{width:1px;height:25px;background:var(--editor-border);margin:0 5px}
#mainToolbar button{font-size:11.5px;min-height:34px;padding:7px 12px}
#mainToolbar #pdfButton{border-color:#222;background:#222;color:#fff;font-size:11.5px!important;
  font-weight:650;order:15!important;margin:0!important}
#mainToolbar #pdfButton:hover{background:#444}
body.dark-mode #mainToolbar #pdfButton{border-color:#f1f1f1;background:#f1f1f1;color:#222}
#mainToolbar #pdfButton .ui-button-label{font-size:11.5px!important}
#mainToolbar #pdfButton .ui-button-label::after{display:none!important;content:none!important}
#mainToolbar #stylePreviewButton{font-size:11.5px}
#mainToolbar .export-group{display:flex!important;align-items:center;gap:7px;min-width:0;flex-wrap:nowrap}
#mainToolbar .export-file{border-right:1px solid var(--editor-border);padding-right:16px;margin-right:5px}
#mainToolbar .export-pdf{flex:1}
#mainToolbar .export-pdf #pdfButton{margin-left:auto!important}
#mainToolbar #downloadButton .ui-button-label,
#mainToolbar #pdfButton .ui-button-label,
#mainToolbar #stylePreviewButton .ui-button-label{display:inline-flex!important;font-size:11.5px!important}
#mainToolbar #downloadButton .ui-button-label::after{display:none!important;content:none!important}
/* Inherited expanded-toolbar selectors must not hide export options. */
#mainToolbar:not(.expanded)>#exportStyle{display:inline-block!important}
#mainToolbar:not(.expanded)>#stylePreviewButton{display:inline-flex!important}
/* Optional right-side writing dashboard: open only when requested. */
#writingDashboard.sidebar{width:320px;flex:0 0 320px;background:var(--bg-color);
  border-left:1px solid var(--editor-border);box-shadow:none;padding:24px 19px;
  overflow-y:auto}
#writingDashboard[hidden]{display:none!important}
#writingDashboard h3{font-size:16px;letter-spacing:-.025em;font-weight:700}
#writingDashboard h4{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--subtle);font-weight:700}
#writingDashboard .stat-box{border:1px solid var(--editor-border);background:var(--sidebar-bg);
  border-radius:11px;padding:14px;margin-bottom:20px}
#writingDashboard .stat-item span{font-size:22px;font-weight:680}
#writingDashboard .stat-item label{font-size:11px;color:var(--subtle)}
#writingDashboard .suggestion-card{border-radius:9px;border:1px solid var(--editor-border);
  background:var(--editor-bg);border-left:3px solid #777;padding:12px;margin-bottom:10px}
/* Overlay panels */
.settings-dialog,.style-preview-dialog{color:var(--text-color);background:var(--editor-bg);
  border:1px solid var(--editor-border);border-radius:14px;
  box-shadow:var(--shadow)}
#inkNavScrim{display:none}
.ui-icon{width:15px;height:15px;flex:none}
.ui-button-label{display:inline-flex;align-items:center;font-size:12px}
#fileInput{display:none!important}
#mobileMoreButton,#fileMoreButton{display:none!important}
/* Distinct section outlines and no low-contrast phantom icon buttons. */
.top-actions button .ui-button-label{display:inline-flex!important;font-size:12px!important}
.top-actions #analyzeButton,.top-actions #dashboardToggle{display:inline-flex!important}
.top-actions #analyzeButton::after,.top-actions #dashboardToggle::after{content:none!important}
.top-actions #dashboardToggle{margin-left:0!important}
.top-row #filenameInput{max-width:100%!important}
}
@media screen and (max-width:1120px){
:root{--nav-width:235px}
#writingDashboard.sidebar{width:285px;flex-basis:285px}
.main-content{padding:0 17px 13px!important}
.header-section{padding:0 17px!important;margin:0 -17px 13px!important}
.top-row{min-height:75px}
.work-top-sub{display:none}
.editor-tools{flex-wrap:wrap}
.export-panel{padding:10px}
}
@media screen and (max-width:920px){
.ink-nav{position:fixed;inset:0 auto 0 0;width:min(85vw,300px);height:100dvh;
  z-index:2300;transform:translateX(-102%);transition:transform .2s ease;
  box-shadow:10px 0 20px #00000010;flex-basis:auto}
body.nav-open .ink-nav{transform:translateX(0)}
#inkNavScrim{position:fixed;inset:0;z-index:2200;background:rgba(0,0,0,.35);display:none}
body.nav-open #inkNavScrim{display:block}
#inkNavToggle{display:flex}
.main-content{padding:0 16px 14px!important;height:100dvh;flex:1}
.header-section{margin:0 -16px 12px!important;padding:0 16px!important}
.top-row{min-height:68px;gap:8px}
#writingDashboard.sidebar{position:fixed!important;top:0;right:0;bottom:0;
  height:100dvh;width:min(88vw,340px);flex:0 0 auto;z-index:2100;
  box-shadow:var(--shadow);display:block!important}
#writingDashboard[hidden]{display:none!important}
.editor-tools{padding:8px 10px;margin-bottom:9px!important}
}
@media screen and (max-width:620px){
.main-content{padding:0 10px 10px!important}
.header-section{margin:0 -10px 9px!important;padding:0 10px!important}
.top-row{flex-wrap:wrap;gap:5px;min-height:96px;padding:8px 0}
.doc-info{flex:1;min-width:100px;gap:0}
.doc-info .doc-path{font-size:9px}
.top-row #filenameInput{font-size:15px!important;line-height:20px;padding:2px 2px!important}
.doc-info .save-status{display:none}
.top-actions{flex:0 0 100%;justify-content:flex-end;gap:5px;padding-left:43px}
.top-actions button{padding:6px 10px;min-height:31px;font-size:11px!important}
.top-actions button .ui-button-label{font-size:11px!important}
#saveButton,#saveButton.secondary{padding:7px 12px!important}
.work-top{margin-bottom:7px}.work-top-title{font-size:12px}
.editor-tools{gap:5px;padding:5px 7px;flex-wrap:wrap}
.segmented{order:0;margin:0!important;padding:2px;flex:0 0 auto}
.segmented button,.segmented button.secondary{padding:5px 8px!important;font-size:11px;min-height:29px!important}
.segmented #fullscreenButton{padding-left:7px!important;margin-left:1px}
.format-toolbar{order:1;flex:1 1 100%;gap:1px}
.editor-tools .format-toolbar button{min-height:31px!important;min-width:30px;
  padding:5px 7px!important;font-size:11px}
.editor-grid,.editor-grid[data-view="split"]{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.editor-grid[data-view="split"] .editor-pane{display:flex}
.editor-grid[data-view="split"] .preview-pane{display:none}
.pane-label{min-height:31px;padding:7px 13px;font-size:9px}
.pane{border-radius:10px!important}
.native-mobile-editor{display:block!important;flex:1;min-height:0;height:100%;width:100%;
  padding:19px 17px!important;font-size:16px!important;line-height:1.65!important;
  -webkit-user-select:text!important;user-select:text!important;touch-action:pan-y;
  -webkit-touch-callout:default;resize:none;color:var(--text-color);background:var(--editor-bg)}
.CodeMirror{display:none!important}
#preview{padding:20px 16px}
.export-panel{margin-top:8px;gap:6px;padding:8px 9px}
.export-caption{display:none!important}
.export-panel h3{font-size:11px}
#mainToolbar{gap:5px!important;display:flex!important;flex-direction:column;align-items:stretch!important}
#mainToolbar .export-group{display:grid!important;grid-template-columns:56px minmax(0,1fr) auto;
  align-items:center;gap:6px;flex:initial!important;width:100%!important}
#mainToolbar .export-file{border-right:0;border-bottom:1px solid var(--editor-border);
  margin:0;padding:0 0 7px}
#mainToolbar .export-pdf{padding:3px 0 0}
.export-mini-label{font-size:10px;white-space:nowrap}
#mainToolbar select{min-height:31px;font-size:11px;max-width:none!important;min-width:0!important}
#mainToolbar .export-group #exportFormat,
#mainToolbar .export-group #exportStyle{width:100%!important;max-width:none!important;flex:none!important}
#mainToolbar .export-file #downloadButton{grid-column:3;white-space:nowrap}
#mainToolbar .export-pdf #stylePreviewButton{grid-column:3}
#mainToolbar .export-pdf #pdfButton{grid-column:2 / 4;justify-self:end;margin-left:auto!important}
#mainToolbar button{min-height:31px;padding:6px 9px;font-size:11px}
#mainToolbar #pdfButton{min-height:33px}
#mainToolbar button .ui-button-label{display:inline-flex!important;font-size:11px!important}
#mainToolbar #pdfButton .ui-button-label::after{content:none!important;display:none!important}
}
@media screen and (max-width:365px){
.top-row{min-height:93px}
.top-actions button{padding:6px 8px!important;gap:4px}
.top-actions button .ui-button-label{font-size:10.5px!important}
#saveButton,#saveButton.secondary{padding:6px 10px!important}
.segmented button,.segmented button.secondary{padding:5px 6px!important}
.export-panel{margin-top:5px}
}
@media screen and (prefers-reduced-motion:reduce){.ink-nav,button{transition:none!important}}



/* InkFlow — focused refinements of the approved clear UI */
@media screen {
  .ink-nav .brand-mark,.brand-mark{display:none!important}
  .ink-nav-header{gap:8px;padding:2px 8px 15px!important}
  .ink-nav .inkflow-brand{flex:1!important}
  #navCollapseButton{width:30px!important;min-width:30px!important;min-height:30px!important;padding:5px!important;display:grid!important;place-items:center!important;border:1px solid transparent!important;justify-content:center!important;font-size:16px!important;color:var(--subtle)!important}
  #navCollapseButton:hover{background:var(--soft)!important;color:var(--text-color)!important}
  #inkNavToggle{display:flex!important;flex:none!important;border:1px solid var(--editor-border)!important;background:var(--sidebar-bg)!important;border-radius:8px!important;width:34px;height:34px;padding:7px!important}
  #inkNavToggle svg{width:18px;height:18px}
  body.nav-collapsed .ink-nav{width:0!important;flex-basis:0!important;min-width:0!important;padding:0!important;border:0!important;opacity:0;pointer-events:none;visibility:hidden}
  body.nav-collapsed .main-content{min-width:0}
  .nav-file-list .file-tab{gap:1px}
  #inkNav .file-tab .file-tab-select{padding:8px 7px!important}
  #inkNav .file-tab .file-tab-rename{width:25px!important;min-width:25px;min-height:27px!important;padding:4px!important;flex:none!important;justify-content:center!important;font-size:12px!important;opacity:.6;background:transparent!important}
  #inkNav .file-tab .file-tab-rename:hover{opacity:1;background:var(--editor-border)!important}
  #inkNav .file-tab .file-tab-rename svg{height:13px;width:13px}
  #inkNav .file-tab .file-tab-input{min-width:0;flex:1;width:100%;font:inherit;color:var(--text-color);background:var(--editor-bg);border:1px solid #808080;border-radius:6px;padding:6px!important;outline:none;box-sizing:border-box}
  .doc-info{gap:2px!important}
  .doc-info .doc-path{display:none!important}
  .top-row{min-height:64px!important;padding:10px 0!important}
  .top-row #filenameInput{font-size:17px!important;max-width:600px!important}
  .header-section{margin-bottom:12px!important}
  .work-top{margin-bottom:7px!important}
  .work-top .work-top-sub{display:none!important}
  .editor-tools{background:transparent!important;border:0!important;padding:0!important;margin-bottom:10px!important;gap:12px!important;justify-content:space-between;align-items:center;flex-wrap:wrap;box-shadow:none!important}
  .format-toolbar{background:var(--sidebar-bg)!important;border:1px solid var(--editor-border)!important;border-radius:9px!important;padding:3px 4px!important;gap:0!important;min-height:36px;flex:0 1 auto;max-width:100%;width:max-content}
  .editor-tools .format-toolbar button,.editor-tools .format-toolbar button.secondary{padding:5px 7px!important;min-width:27px!important;min-height:28px!important;border-radius:6px!important;font-size:11.5px!important}
  .segmented{padding:3px!important;border:1px solid var(--editor-border)!important;background:var(--sidebar-bg)!important;min-height:36px;flex:0 0 auto}
  .segmented button,.segmented button.secondary{min-height:28px!important;font-size:11px!important;padding:5px 10px!important}
  .export-panel{margin-top:11px!important;padding:11px 14px 12px!important;gap:9px!important;background:var(--sidebar-bg)!important}
  .export-panel-top .export-caption{display:none!important}
  .export-panel h3{font-size:12px!important}
  .export-chooser{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
  .export-option{background:var(--editor-bg)!important;min-height:46px!important;padding:10px 13px!important;border:1px solid var(--editor-border)!important;display:flex;flex:1;justify-content:space-between;gap:10px;align-items:center;border-radius:9px!important;text-align:left;font-size:12.5px!important;font-weight:640!important}
  .export-option:hover{background:var(--soft)!important}
  .export-option[aria-pressed="true"]{border-color:var(--text-color)!important;background:var(--editor-bg)!important}
  .export-option small{display:block;font-size:10px;color:var(--subtle);font-weight:450;margin-top:3px}
  .export-option .option-arrow{color:var(--subtle);font-size:18px;font-weight:400}
  .export-source-details{display:flex;gap:10px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--editor-border);padding-top:9px}
  .export-source-details label{font-size:11px;color:var(--subtle);font-weight:600}
  .export-source-details select{min-height:34px;border:1px solid var(--editor-border);border-radius:8px;background:var(--editor-bg);color:var(--text-color);padding:6px 28px 6px 10px;font-size:12px}
  .export-source-details #downloadButton{margin-left:auto!important;min-height:34px!important;display:inline-flex!important}
  .export-source-details #downloadButton .ui-button-label{display:inline!important}
  .export-source-details[hidden]{display:none!important}
  #mainToolbar{display:none!important}
  .editor-grid{min-height:0!important}
  .nav-advanced{margin-top:1px!important}
  .nav-section{margin-bottom:16px!important}
  .nav-file-list{margin-bottom:8px!important}
  /* Dedicated PDF route inside the single HTML app */
  #pdfWorkflow{display:none;position:fixed;inset:0;z-index:3000;background:var(--bg-color);color:var(--text-color);height:100dvh;overflow:hidden;flex-direction:column;font-family:inherit}
  body.pdf-workflow-open #pdfWorkflow{display:flex}
  body.pdf-workflow-open .app-container{display:none!important}
  .pdf-route-topbar{flex:none;min-height:62px;padding:10px 27px;border-bottom:1px solid var(--editor-border);display:flex;align-items:center;justify-content:space-between;gap:15px;background:var(--bg-color)}
  .pdf-route-left{display:flex;align-items:center;gap:13px;min-width:0}
  #pdfBackButton{background:var(--sidebar-bg);font-size:12px!important}
  .pdf-route-title{display:flex;flex-direction:column;gap:3px;min-width:0}
  .pdf-route-title strong{font-size:15px;font-weight:690;white-space:nowrap}
  .pdf-route-title span{font-size:11px;color:var(--subtle);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}
  .pdf-route-actions{display:flex;align-items:center;gap:8px}
  .pdf-route-actions #printPdfButton{background:var(--text-color);border-color:var(--text-color);color:var(--bg-color);font-weight:650!important;min-width:131px;justify-content:center}
  .pdf-route-actions #printPdfButton:disabled{opacity:.5;cursor:not-allowed}
  .pdf-route-body{display:grid;grid-template-columns:minmax(235px,310px) minmax(0,1fr);flex:1;min-height:0;overflow:hidden}
  .pdf-route-controls{display:flex;flex-direction:column;gap:18px;background:var(--sidebar-bg);padding:24px 19px;overflow-y:auto;border-right:1px solid var(--editor-border)}
  .pdf-route-controls h2{font-size:13px;font-weight:700;margin:0 0 7px}
  .pdf-route-controls p{color:var(--subtle);font-size:11.5px;margin:0 0 9px;line-height:1.5}
  .pdf-route-controls label{font-size:11px;color:var(--subtle);font-weight:600;display:block;margin-bottom:7px}
  .pdf-route-controls #exportStyle{width:100%!important;display:block!important;max-width:none!important;min-height:38px;padding:8px 11px;border-radius:9px;background:var(--editor-bg);color:var(--text-color);border:1px solid var(--editor-border)}
  #browsePdfStyles{width:100%;background:var(--editor-bg);justify-content:center;font-size:12px;min-height:37px}
  .pdf-selected-thumb{border:1px solid var(--editor-border);padding:10px;background:var(--editor-bg);border-radius:10px;display:flex;align-items:center;gap:12px;min-height:88px}
  .pdf-selected-thumb img{height:90px;width:64px;object-fit:cover;border:1px solid var(--editor-border);border-radius:4px;box-shadow:0 2px 8px #00000013}
  .pdf-selected-thumb div{font-weight:640;font-size:12px;line-height:1.5}
  .pdf-selected-thumb small{display:block;color:var(--subtle);font-weight:450;font-size:11px;margin-top:5px}
  #pdfGallery{display:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;max-height:45vh;overflow:auto;padding:2px;scrollbar-width:thin}
  #pdfGallery.open{display:grid}
  .pdf-style-tile{display:flex;align-items:center;flex-direction:column;gap:6px;padding:8px!important;min-height:0!important;border-radius:9px!important;background:var(--editor-bg)!important;text-align:center;color:var(--text-color);font-weight:500;font-size:10.5px!important}
  .pdf-style-tile img{display:block;width:100%;max-width:102px;aspect-ratio:210/297;object-fit:cover;border-radius:4px;border:1px solid var(--editor-border)}
  .pdf-style-tile[aria-pressed="true"]{border-color:var(--text-color)!important;box-shadow:0 0 0 1px var(--text-color)}
  .pdf-controls-foot{margin-top:auto;padding-top:14px;border-top:1px solid var(--editor-border);font-size:11px;line-height:1.6;color:var(--subtle)}
  .pdf-route-preview{min-width:0;min-height:0;overflow:auto;background:var(--soft);display:flex;flex-direction:column;align-items:center;padding:20px 22px 35px;gap:12px}
  .pdf-preview-heading{width:100%;max-width:760px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:var(--text-color);font-weight:650}
  .pdf-preview-heading span{font-size:11px;color:var(--subtle);font-weight:450}
  #pdfPreviewPages.pdf-paginated{display:flex!important;position:static!important;flex-direction:column;align-items:center;gap:18px;width:100%!important;max-width:none!important;height:auto!important;background:transparent!important;visibility:visible!important;pointer-events:auto!important;margin:0!important;padding:0!important;overflow:visible!important}
  #pdfPreviewPages .pdf-page-frame{position:relative;flex:none;background:white;box-shadow:0 5px 20px #00000014;border:1px solid #e0e0e0;box-sizing:content-box;overflow:hidden}
  #pdfPreviewPages .pdf-page-inner{position:relative;transform-origin:0 0}
  #pdfPreviewPages .pdf-sheet{box-sizing:border-box}
  #pdfPreviewPages .pdf-sheet-inner{overflow:hidden}
  #pdfLoading{font-size:12px;color:var(--subtle);padding:40px 0}
  @media (max-width:920px){
    body.nav-collapsed .ink-nav{transform:translateX(-102%)!important;width:min(85vw,300px)!important;flex-basis:auto!important;padding:20px 13px 15px!important;opacity:1;visibility:visible}
    body.nav-open .ink-nav{transform:translateX(0)!important;visibility:visible!important;pointer-events:auto!important}
    #inkNavToggle{display:flex!important}
    .pdf-route-body{grid-template-columns:minmax(205px,250px) minmax(0,1fr)}
    .pdf-route-controls{padding:17px 13px}
  }
  @media (max-width:650px){
    .top-row{min-height:58px!important;flex-wrap:wrap;gap:5px!important;padding:8px 0!important}
    .top-actions{padding-left:0!important;gap:5px!important}
    .editor-tools{flex-direction:column;align-items:stretch!important;gap:7px!important;flex-wrap:nowrap!important}
    .format-toolbar{width:100%;gap:0!important;flex:0 1 auto!important;flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:thin}
    .segmented{width:max-content;max-width:100%;margin:0!important;align-self:flex-end!important}
    .export-panel{padding:9px!important}
    .export-option{min-width:115px;flex:1 1 135px;font-size:11.5px!important;padding:8px 10px!important;min-height:44px!important}
    .export-source-details{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:7px}
    .export-source-details #downloadButton{margin-left:0!important}
    .pdf-route-topbar{padding:8px 12px;min-height:59px}
    .pdf-route-title strong{font-size:13px}
    .pdf-route-title span{max-width:130px;font-size:10px}
    .pdf-route-actions #printPdfButton{min-width:auto;font-size:11px!important;padding:9px!important}
    .pdf-route-body{display:flex;flex-direction:column;overflow:hidden}
    .pdf-route-controls{flex:none;max-height:45vh;gap:9px;padding:10px 12px 11px;overflow-y:auto;border-right:0;border-bottom:1px solid var(--editor-border)}
    .pdf-route-controls h2{font-size:12px;margin-bottom:4px}
    .pdf-route-controls p{display:none}
    .pdf-style-picker{display:grid;grid-template-columns: minmax(0,1fr) auto;gap:7px;align-items:end}
    .pdf-style-picker label{grid-column:1/-1;margin:0}
    .pdf-style-picker #exportStyle{min-height:34px}
    #browsePdfStyles{width:auto!important;min-height:34px!important}
    .pdf-selected-thumb{display:none}
    #pdfGallery{grid-template-columns:repeat(3,minmax(0,1fr));max-height:190px;gap:6px}
    .pdf-style-tile img{max-width:70px}
    .pdf-controls-foot{display:none}
    .pdf-route-preview{padding:12px 10px 22px;gap:7px}
    .pdf-preview-heading{font-size:11px}
  }
}
@media print{#pdfWorkflow{display:none!important}}
/* Must override the original off-screen print-measurement rule. */
@media screen {
 #pdfPreviewPages.pdf-paginated{position:static!important;inset:auto!important;left:auto!important;top:auto!important;visibility:visible!important;display:flex!important;pointer-events:auto!important;width:100%!important;height:auto!important;}
 #pdfPreviewPages.pdf-paginated .pdf-page-frame{visibility:visible!important}
}
@media screen {
 #pdfGallery.open{grid-auto-rows:max-content!important;align-content:start!important;flex:0 0 auto!important;max-height:320px;min-height:0;overflow-y:auto!important}
 #pdfGallery .pdf-style-tile{height:auto!important;min-height:160px!important;align-self:stretch!important;justify-content:flex-start!important;box-sizing:border-box;overflow:hidden}
 #pdfGallery .pdf-style-tile img{flex:0 0 auto!important;height:129px!important;width:91px!important;max-width:100%!important;object-fit:cover!important;pointer-events:none}
 #pdfPreviewPages.pdf-paginated{background:transparent!important}
 @media(max-width:650px){#pdfGallery.open{max-height:180px!important}#pdfGallery .pdf-style-tile{min-height:110px!important}#pdfGallery .pdf-style-tile img{height:88px!important;width:62px!important}}
}

@media screen and (max-width:650px){.editor-tools .format-toolbar{order:0!important}.editor-tools .segmented{order:1!important}}

@media screen {
#pdfPreviewPages.pdf-paginated {
  margin: 0 !important;
  padding: 0 !important;
  background: white !important;
  color: #2b2930 !important;
  box-sizing: border-box;
}
#pdfPreviewPages.pdf-paginated .pdf-sheet {
  position: relative;
  width: 210mm;
  height: 297mm;
  display: block;
  box-sizing: border-box;
  overflow: hidden;
  margin: 0;
  padding: 0;
  background: #fff;
  isolation: isolate;
}
#pdfPreviewPages.pdf-paginated .pdf-sheet-art {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 210mm;
  height: 297mm;
  overflow: hidden;
  pointer-events: none;
}
#pdfPreviewPages.pdf-paginated .pdf-sheet-art svg {
  display: block;
  width: 210mm;
  height: 297mm;
  max-width: none;
  max-height: none;
}
#pdfPreviewPages.pdf-paginated .pdf-sheet-inner {
  position: absolute;
  z-index: 1;
  box-sizing: border-box;
  left: var(--pdf-left);
  right: var(--pdf-right);
  top: var(--pdf-top);
  bottom: var(--pdf-bottom);
  overflow: hidden;
}
#pdfPreviewPages.pdf-paginated .pdf-flow {
  display: flow-root;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 100%;
  height: auto;
  color: #2b2930 !important;
  font: 11pt/1.55 Georgia, 'Noto Serif CJK SC', 'Songti SC', serif;
  overflow: visible;
  overflow-wrap: anywhere;
}
#pdfPreviewPages.pdf-paginated[data-stationery="vintage"] .pdf-flow {color:#41392d!important;}
#pdfPreviewPages.pdf-paginated .pdf-flow .print-title {
  font: 700 24pt/1.2 Georgia, 'Noto Serif CJK SC', 'Songti SC', serif;
  margin:0 0 18pt;
  padding-bottom:9pt;
  border-bottom:1px solid #dedede;
}
#pdfPreviewPages.pdf-paginated[data-stationery="vintage"] .print-title {border-color:#c8b899;}
#pdfPreviewPages.pdf-paginated[data-stationery="floral"] .print-title {border-color:#e7c8d3;}
#pdfPreviewPages.pdf-paginated[data-stationery="kawaii"] .print-title {border-color:#f6d3d9;}
#pdfPreviewPages.pdf-paginated[data-stationery="sky"] .print-title {border-color:#d0e3f2;}
#pdfPreviewPages.pdf-paginated[data-stationery="sakura"] .print-title {border-color:#eebdd0;}
#pdfPreviewPages.pdf-paginated[data-stationery="botanical"] .print-title {border-color:#b3cba8;}
#pdfPreviewPages.pdf-paginated[data-stationery="grid"] .print-title {border-color:#bfcfdd;}
#pdfPreviewPages.pdf-paginated[data-stationery="coffee"] .print-title {border-color:#d7ad8b;}
#pdfPreviewPages.pdf-paginated[data-stationery="night"] .print-title {border-color:#d4bd81;}
#pdfPreviewPages.pdf-paginated[data-stationery="geometric"] .print-title {border-color:#b5c5d5;}
#pdfPreviewPages.pdf-paginated .pdf-flow h1 {font-size:20pt;}
#pdfPreviewPages.pdf-paginated .pdf-flow h2 {font-size:16pt;}
#pdfPreviewPages.pdf-paginated .pdf-flow h3 {font-size:13pt;}
#pdfPreviewPages.pdf-paginated .pdf-flow h1,
#pdfPreviewPages.pdf-paginated .pdf-flow h2,
#pdfPreviewPages.pdf-paginated .pdf-flow h3,
#pdfPreviewPages.pdf-paginated .pdf-flow h4 {break-after:avoid;}
#pdfPreviewPages.pdf-paginated .pdf-flow pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  overflow: visible;
  font-size:9pt;
  background:#f7f7f7!important;
}
#pdfPreviewPages.pdf-paginated .pdf-flow pre code {white-space:pre-wrap;overflow-wrap:anywhere;}
#pdfPreviewPages.pdf-paginated .pdf-flow table {display:table;width:100%;max-width:100%;overflow:visible;font-size:9.5pt;table-layout:auto;}
#pdfPreviewPages.pdf-paginated .pdf-flow th {background:#f0f0f0!important;}
#pdfPreviewPages.pdf-paginated .pdf-flow a {color:#202020;text-decoration:none;}
#pdfPreviewPages.pdf-paginated .pdf-flow img:not(.iwp-math img) {
  max-width:100%;
  max-height:205mm;
  width:auto;
  height:auto;
  object-fit:contain;
}
#pdfPreviewPages.pdf-paginated .pdf-flow blockquote {background:#ffffffea!important;}
#pdfPreviewPages.pdf-paginated .pdf-flow .iwp-display-math {overflow:visible!important;break-inside:avoid;}
#pdfPreviewPages.pdf-paginated .pdf-flow .iwp-math svg {max-width:100%;height:auto;}

}
@media screen {#pdfPreviewPages.pdf-paginated{position:static!important;left:auto!important;top:auto!important;visibility:visible!important;display:flex!important;pointer-events:auto!important;width:100%!important;height:auto!important;background:transparent!important;}}