.creator{max-width:1440px;margin:0 auto}.creator-intro{display:flex;gap:24px;align-items:baseline;flex-wrap:wrap}.creator-intro h1{margin:0}.creator-intro p{margin:0;color:var(--muted)}.creator-types{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}.creator-types [aria-pressed=true]{outline:2px solid var(--primary);outline-offset:2px}.creator-layout{display:grid;grid-template-columns:auto minmax(0,1fr);gap:24px}.creator-workspace{min-width:0}.creator-ad:empty{display:none}.creator-ad .ad-slot{margin:0}.creator-toolbar{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin:0 0 14px}.creator-toolbar label{flex:1;min-width:120px}.creator-toolbar input:not([type=checkbox]){width:100%}.creator-toolbar .creator-open{max-width:240px}.creator-format{display:flex;gap:4px;flex-wrap:wrap;padding:10px 0;border-block:1px solid var(--border,#84939a);margin-bottom:12px}.creator-format button,.editor-text-controls button{background:transparent;border:1px solid var(--border,#84939a);color:inherit;border-radius:6px;min-width:36px;height:34px;cursor:pointer}.creator-format button:hover{background:var(--surface,#e8eeee)}.editor-text-controls{display:flex;gap:5px;align-items:center;flex-wrap:wrap}.editor-text-controls label{min-width:0;margin:0}.creator-display{align-items:center;font-size:13px}.creator-display .button{padding:7px 12px}.creator-writing{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}.creator-writing:has(#creator-markdown[hidden]){grid-template-columns:1fr}.creator-source{display:block;min-width:0}.creator-source textarea{width:100%;height:55vh;min-height:360px;font:var(--editor-font-size,14px)/var(--editor-line,24px) ui-monospace,monospace;tab-size:4;resize:vertical}.creator-preview{overflow:auto;overflow-wrap:anywhere;max-height:55vh;min-height:300px;line-height:1.8}.creator-preview pre{white-space:pre-wrap;background:var(--surface,#e8eeee);padding:12px;border-radius:6px}.creator-preview blockquote{border-left:3px solid var(--primary);margin-left:0;padding-left:18px}.creator-preview table{border-collapse:collapse;width:100%}.creator-preview td,.creator-preview th{border:1px solid #899;padding:6px 10px}.creator-preview h1{font-size:26px}.creator-preview h2{font-size:22px}.creator-preview input[type=checkbox]{pointer-events:none}.creator iframe{display:block;width:100%;height:76vh;min-height:620px;border:1px solid var(--border,#84939a);border-radius:10px;background:#f5f7fb}.creator-privacy{font-size:12px;margin:18px 0}.creator [hidden]{display:none!important}.creator #creator-result{padding:16px;border:1px solid var(--primary);border-radius:8px;margin-top:14px}@media(max-width:800px){.creator-layout{grid-template-columns:1fr}.creator-ad{display:none}.creator-writing{grid-template-columns:1fr}.creator iframe{min-height:660px;height:85vh}.creator-types{gap:8px}.creator-types .button{flex:1;white-space:nowrap;padding:8px}.creator-preview{max-height:50vh}.creator-toolbar .creator-open{max-width:none}}
/* Editor pages prioritize the working surface over landing-page chrome. */
body:has(.creator) .page{max-width:none;padding:0 12px 12px}body:has(.creator) .header{max-width:none;height:44px;padding:0 12px;gap:12px}body:has(.creator) .header nav a{min-height:32px;padding:3px 9px;font-size:12px}body:has(.creator) .header-upload{min-height:32px;padding:4px 10px}.creator{max-width:none}.creator-intro{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.creator-types{margin:8px 0;gap:6px}.creator-types .button{min-height:32px;padding:4px 14px;font-size:13px}.creator-layout{gap:12px}.creator-toolbar{margin-bottom:7px;gap:6px}.creator-toolbar .button{min-height:32px;padding:5px 10px;font-size:12px}.creator-format{margin-bottom:7px;padding:5px 0}.creator-format button{height:30px}.creator iframe{height:calc(100dvh - 130px);min-height:480px;border-radius:6px}.creator-source textarea{height:calc(100dvh - 280px)}.creator-preview{max-height:calc(100dvh - 280px)}.creator-privacy{margin:8px 0}body:has(.creator) .preview-note{font-size:10px;padding:2px 8px}body:has(.creator) .site-footer{margin-top:8px}@media(max-width:800px){body:has(.creator) .header{flex-wrap:nowrap;padding:0 8px;height:44px}body:has(.creator) .header nav{display:none}body:has(.creator) .header-actions{flex-wrap:nowrap}body:has(.creator) .page{padding:0 6px 8px}.creator-types{flex-wrap:nowrap;overflow-x:auto;gap:4px}.creator-types .button{flex:0 0 auto;padding:4px 10px;font-size:12px}.creator iframe{height:calc(100dvh - 122px);min-height:440px}.creator-toolbar label{min-width:100px}.creator-toolbar .creator-open{max-width:150px}.creator-source textarea{min-height:260px}.creator-display{gap:5px}.creator-preview{max-height:55vh}}

.creator-notation-frame{position:fixed;left:-10000px;top:0;width:1200px;height:900px;border:0;pointer-events:none}.creator-preview .creator-diagram{display:block;max-width:100%;height:auto}.creator-preview .creator-inline-math{display:inline-block;max-width:100%;vertical-align:middle}.creator-preview [data-diagram]{background:transparent;padding:8px 0}.creator-preview [data-formula][data-display]{padding:14px 0;overflow:auto}.creator-types .button{height:32px;line-height:20px;box-sizing:border-box}
.creator label{margin:0}.creator-toolbar input:not([type=checkbox]){min-height:32px;height:32px;padding:4px 8px;font-size:13px}.creator-toolbar input[type=file]{padding:2px 4px;font-size:12px}.creator-toolbar input[type=file]::file-selector-button{font:inherit;padding:3px 6px}.creator-format{display:inline-flex;vertical-align:middle;margin:0 10px 6px 0;border:0;padding:0}.creator-display{display:inline-flex;vertical-align:middle;margin:0 0 6px}.creator-writing h2{font-size:13px;margin:0 0 4px}.creator-source textarea{height:calc(100dvh - 230px)}.creator-preview{max-height:calc(100dvh - 230px)}.creator-toolbar .creator-open{max-width:190px}.creator-toolbar input[type=checkbox]{display:inline-block}.creator-display label{font-size:12px}.editor-text-controls button{height:30px}

.creator-types{gap:4px;padding:4px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.creator-types [data-kind]{gap:6px;border-color:transparent;background:transparent;color:var(--muted);font-weight:550;border-radius:5px}
.creator-types [data-kind] svg{flex-shrink:0}
.creator-types [data-kind][aria-pressed=true]{outline:none;background:var(--primary-soft);border-color:var(--primary-line);color:var(--primary)}
.creator-types #creator-media-open{margin-inline-start:auto}
.creator-format button,.editor-text-controls button{border-color:var(--line-strong);background:var(--surface);border-radius:5px}
.creator-format button:hover,.editor-text-controls button:hover{background:var(--primary-soft);border-color:var(--primary)}
.creator iframe{border-color:var(--line);background:var(--surface);border-radius:8px}
.creator-types [data-kind]:focus-visible{outline:2px solid var(--primary);outline-offset:1px}

.file-source-panel{margin:12px 0;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:8px}.file-source-heading{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.file-source-heading h2{font-size:18px;margin:0 auto 0 0;overflow-wrap:anywhere}.file-source-viewer{margin:16px 0;min-height:100px;overflow-wrap:anywhere}.file-source-viewer img,.file-source-viewer video{display:block;max-width:100%;max-height:70vh;margin:auto}.file-source-viewer audio{width:100%}.file-source-viewer pre{white-space:pre-wrap;font-family:var(--mono)}.file-source-viewer iframe{width:100%;height:70vh;min-height:400px;border:0}.file-source-viewer .creator-preview{max-height:none}

/* Shared files open directly in the workspace; keep their navigation compact. */
.file-source-panel{margin:4px 0;padding:0 8px;background:transparent;border:0;border-radius:0}
.file-source-heading{min-height:30px;gap:12px;flex-wrap:nowrap;font-size:12px}
.file-source-heading h2{flex:1;min-width:0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.file-source-heading a{flex-shrink:0}
#file-source-status{font-size:12px;margin:4px 0}
#file-source-status:empty{display:none}
.creator[data-source] iframe{height:calc(100dvh - 164px)}
.creator[data-source] .creator-source textarea{height:calc(100dvh - 264px)}
.creator[data-source] .creator-preview{max-height:calc(100dvh - 264px)}

/* A single workspace bar replaces the site header, filename row and tool tabs. */
body:has(.creator) .site-header{display:none}
.creator-topbar{display:flex;align-items:center;gap:10px;height:38px;min-width:0;font-size:12px}
.creator-home{display:flex;align-items:center;flex-shrink:0;width:52px}.creator-home svg{width:52px;height:26px}
.creator-back{font-size:18px;flex-shrink:0}.creator-filename{min-width:0;max-width:32vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.creator-tool-menu{position:relative;flex-shrink:0}.creator-tool-menu summary{display:flex;align-items:center;gap:8px;cursor:pointer;padding:4px 8px;border:1px solid var(--line);border-radius:5px;list-style:none}.creator-tool-menu summary::-webkit-details-marker{display:none}
#creator-current-tool{display:flex;align-items:center;gap:6px}#creator-current-tool svg{width:16px;height:16px}
.creator-tool-menu .creator-types{position:absolute;z-index:30;top:100%;left:0;display:grid;grid-template-columns:repeat(2,minmax(100px,1fr));margin:4px 0;padding:5px;box-shadow:0 8px 24px #0004;overflow:visible}
.creator-tool-menu .creator-types .button{justify-content:flex-start;margin:0}
.creator-topbar #creator-media-open{margin-left:auto;min-height:26px;height:26px;padding:2px 8px;font-size:12px;white-space:nowrap}.creator-original{margin-left:auto;white-space:nowrap}
.creator-topbar:has(#creator-media-open:not([hidden])) .creator-original{margin-left:0}
.file-source-panel{margin:0;padding:0 6px}
.creator #creator-editor iframe{height:calc(100dvh - 48px);min-height:360px}
.creator[data-source] .creator-source textarea,.creator-source textarea{height:calc(100dvh - 172px)}
.creator[data-source] .creator-preview,.creator-preview{max-height:calc(100dvh - 172px)}
@media(max-width:600px){.creator-topbar{gap:6px}.creator-filename{max-width:25vw}.creator-original{display:none}.creator-home{width:42px}.creator-home svg{width:42px}.creator-tool-menu .creator-types{left:auto;right:0}}

.creator-navigation{position:relative;flex-shrink:0}.creator-navigation>summary{list-style:none;cursor:pointer;padding:4px 6px;font-size:16px}.creator-navigation>summary::-webkit-details-marker{display:none}
body:has(.creator) .creator-navigation .site-header{display:block;position:absolute;top:100%;left:0;width:min(420px,calc(100vw - 24px));z-index:40;border:1px solid var(--line);border-radius:6px;background:var(--surface);box-shadow:0 8px 24px #0004}
body:has(.creator) .creator-navigation .header{height:auto;padding:8px;display:flex;flex-wrap:wrap;gap:8px}
.creator-navigation .header .brand{display:none}body:has(.creator) .creator-navigation .header nav{display:flex;flex-wrap:wrap;width:100%}.creator-navigation .header-actions{margin:0}

/* Keep the workspace inside the viewport; scroll its contents, never the page. */
html:has(.creator){height:100%;overflow:hidden}
body:has(.creator){height:100dvh;min-height:0;overflow:hidden;display:flex;flex-direction:column}
body:has(.creator)>.preview-note{flex:none}
body:has(.creator)>.site-footer{display:none}
body:has(.creator) .page{flex:1;min-height:0;width:100%;display:flex;flex-direction:column;padding-bottom:6px;overflow:hidden}
.creator{flex:1;min-height:0;width:100%;display:flex;flex-direction:column}
.creator-topbar{flex:0 0 38px}
.creator-layout{flex:1;min-height:0;overflow:hidden}
.creator-workspace{min-height:0;display:flex;flex-direction:column;overflow:hidden}
#creator-editor{flex:1;min-height:0}
.creator #creator-editor iframe{height:100%;min-height:0;box-sizing:border-box}
#creator-document{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
#creator-document>.creator-toolbar,#creator-document>.creator-format{flex-shrink:0}
.creator-writing{flex:1;min-height:0;overflow:hidden;grid-template-rows:minmax(0,1fr)}
.creator-source,#creator-markdown{min-height:0;overflow:hidden}
#creator-markdown{display:flex;flex-direction:column}
.creator .creator-source textarea,.creator[data-source] .creator-source textarea{display:block;height:100%;min-height:0;resize:none;box-sizing:border-box;overflow:auto}
.creator #creator-preview{flex:1;min-height:0;max-height:none;overflow:auto;overscroll-behavior:contain}
#creator-status:empty{display:none}
.creator-ad{order:-1;min-height:0;overflow:auto;overscroll-behavior:contain}
.creator>.creator-privacy,.creator>.ad-slot{display:none}
.creator #creator-result{flex:none;max-height:25%;overflow:auto;margin:4px 0 0;padding:6px 10px}
.file-source-panel{flex:none;min-height:0}
.file-source-panel:has(.file-source-viewer:not([hidden])){flex:1;overflow:auto;overscroll-behavior:contain}
.creator-navigation .creator-privacy{display:block;padding:8px;font-size:12px;max-height:30vh;overflow:auto}
@media(max-width:800px){.creator-writing:not(:has(#creator-markdown[hidden])){grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:8px}}
