/* Shared interaction tokens; page styles continue to own layout. */
body:is(.workspace-page,.writing-app,.auth-page) {
 --control-icon-size:44px;--dialog-heading-size:22px;--app-dialog-title-size:var(--dialog-heading-size);--dialog-inset:24px;--dialog-gap:16px;
 --app-body-size:var(--brand-body-size);--app-label-size:var(--brand-label-size);--app-small-size:var(--brand-meta-size);
}
/* Decorative tiles share a single treatment across document, project and template cards. */
body[class].workspace-page .workspace-content :is(.doc-icon,.project-icon,.template-icon) {
 display:grid;place-items:center;flex:0 0 var(--brand-icon-size);box-sizing:border-box;
 width:var(--brand-icon-size);height:var(--brand-icon-size);min-width:var(--brand-icon-size);
 border:1px solid var(--brand-lavender-line);border-radius:var(--brand-icon-radius);
 background:var(--brand-yellow);color:var(--brand-ink);box-shadow:none;
}
body[class].workspace-page .workspace-content :is(.doc-icon,.project-icon,.template-icon) > svg.sketch-icon {width:var(--brand-icon-glyph-size);height:var(--brand-icon-glyph-size);stroke-width:1.7;color:inherit;}
body[class]:is(.workspace-page,.writing-app,.auth-page) [data-ui-icon] {
 display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
 box-sizing:border-box;width:var(--control-icon-size);height:var(--control-icon-size);
 min-width:var(--control-icon-size);min-height:var(--control-icon-size);max-width:none;
 padding:0;margin:0;border:1px solid transparent;border-radius:var(--brand-control-radius);
 background:transparent;color:var(--brand-muted);box-shadow:none;cursor:pointer;
 transition:background-color .15s ease,color .15s ease,border-color .15s ease;
}
body[class]:is(.workspace-page,.writing-app,.auth-page) [data-ui-icon] > svg {width:20px;height:20px;flex-shrink:0;color:inherit;}
body[class]:is(.workspace-page,.writing-app,.auth-page) [data-ui-icon]:hover {background:var(--brand-lavender);color:var(--brand-primary);border-color:var(--brand-lavender-line);transform:none;box-shadow:none;}
body[class]:is(.workspace-page,.writing-app,.auth-page) [data-ui-icon]:is([aria-pressed=true],[aria-expanded=true]) {background:var(--brand-lavender);color:var(--brand-primary);border-color:var(--brand-lavender-line);}
body[class]:is(.workspace-page,.writing-app,.auth-page) [data-ui-icon]:focus-visible {outline:2px solid var(--brand-focus-color);outline-offset:var(--brand-focus-offset);}
/* Pointer-opened dialogs should not draw an automatic ring on their close button.
   Keyboard navigation continues to use the shared visible focus treatment. */
html[data-focus-modality=pointer] body[class]:is(.workspace-page,.writing-app,.auth-page) :is(button,a,summary,input,select,textarea,[tabindex]):focus-visible {outline:none!important;}
body[class]:is(.workspace-page,.writing-app,.auth-page) [data-ui-icon]:is(:disabled,[aria-disabled=true]) {opacity:.45;cursor:not-allowed;background:transparent;border-color:transparent;color:var(--brand-muted);}
body[class]:is(.workspace-page,.writing-app,.auth-page) [data-ui-icon][hidden] {display:none;}
.interface-tooltip {position:fixed;inset:auto;margin:0;max-width:min(260px,calc(100vw - 16px));box-sizing:border-box;padding:7px 10px;border:0;border-radius:6px;background:#111827;color:#fff;font:400 var(--brand-meta-size)/1.5 var(--brand-body-font,Arial,sans-serif);overflow-wrap:anywhere;pointer-events:none;box-shadow:0 3px 12px #11182720;z-index:1000;}
.interface-tooltip[hidden] {display:none;}
body:is(.workspace-page,.writing-app) :is(.documents-pagination a,.document-bulk-actions button,.documents-reset,#clearDocumentFilters,#createFirstDocument,#skipDocumentSetup,.trash-document button) {display:inline-flex;align-items:center;justify-content:center;gap:8px;}
body:is(.workspace-page,.writing-app) :is(.documents-pagination a,.document-bulk-actions button,.documents-reset,#clearDocumentFilters,#createFirstDocument,#skipDocumentSetup,.trash-document button) > .sketch-icon {width:18px;height:18px;flex-shrink:0;}

/* A consistent heading, body inset and footer for existing native dialogs. */
body[class]:is(.workspace-page,.writing-app) :is(.app-dialog-card,.modal-card,dialog.writing-dialog,dialog.planner-dialog,dialog.template-detail-dialog,dialog.template-workflow-dialog,dialog.choose-plan-dialog) {
 border-color:var(--brand-line);border-radius:var(--brand-card-radius);background:var(--brand-paper);color:var(--brand-ink);font-family:var(--brand-body-font);
}
body[class]:is(.workspace-page,.writing-app) :is(.app-dialog-head,.modal-header,.dialog-heading,.template-workflow-header),
body[class]:is(.workspace-page,.writing-app) .planner-dialog header {
 display:flex;align-items:flex-start;justify-content:space-between;gap:var(--dialog-gap);padding:20px var(--dialog-inset);background:var(--brand-paper);border-bottom:1px solid var(--brand-line);
}
body[class]:is(.workspace-page,.writing-app) :is(.app-dialog-head,.modal-header,.dialog-heading,.template-workflow-header) :is(h2,h3,.template-workflow-title),
body[class]:is(.workspace-page,.writing-app) .planner-dialog header h2 {
 margin:0;font:600 var(--dialog-heading-size)/1.3 var(--brand-heading-font);letter-spacing:-.02em;color:var(--brand-ink);overflow-wrap:anywhere;
}
body[class]:is(.workspace-page,.writing-app) :is(.app-dialog-body,.planner-dialog-body) {padding:var(--dialog-inset);}
body[class]:is(.workspace-page,.writing-app) :is(.app-dialog-actions,.modal-actions,.editor-setup-actions,.template-detail-actions,.template-workflow-footer),
body[class]:is(.workspace-page,.writing-app) .planner-dialog footer {
 display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:12px;padding:16px var(--dialog-inset);margin:0;border-top:1px solid var(--brand-line);background:var(--brand-paper);
}
body[class]:is(.workspace-page,.writing-app) :is(.app-dialog-actions,.modal-actions,.editor-setup-actions,.template-detail-actions,.template-workflow-footer) > :is(button,a),
body[class]:is(.workspace-page,.writing-app) .planner-dialog footer > :is(button,a) {min-height:44px;box-sizing:border-box;padding:10px 16px;border-radius:var(--brand-control-radius);font:500 var(--brand-body-size)/1.5 var(--brand-body-font);}
body[class]:is(.workspace-page,.writing-app) .app-dialog-btn.hidden {display:none;}
body[class]:is(.workspace-page,.writing-app) .app-dialog-message {font-size:var(--brand-body-size);line-height:1.65;}
body[class]:is(.workspace-page,.writing-app) .app-dialog-form {gap:16px;}
body[class]:is(.workspace-page,.writing-app) #documentOptionsForm {padding:var(--dialog-inset);}
body[class]:is(.workspace-page,.writing-app) #documentOptionsModal .modal-card {display:flex;flex-direction:column;overflow:hidden;}
body[class]:is(.workspace-page,.writing-app) #documentOptionsModal .modal-header {flex:0 0 auto;}
body[class]:is(.workspace-page,.writing-app) #documentOptionsForm {flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;}
body[class]:is(.workspace-page,.writing-app) #documentOptionsModal .modal-actions {position:static;flex:0 0 auto;margin:0;padding:16px var(--dialog-inset);}
body[class]:is(.workspace-page,.writing-app) #documentOptionsModal .modal-actions .danger {margin-right:auto;}
body[class]:is(.workspace-page,.writing-app) dialog.writing-dialog:has(> .dialog-heading) {padding:var(--dialog-inset);}
body[class]:is(.workspace-page,.writing-app) dialog.writing-dialog > .dialog-heading {margin:calc(-1 * var(--dialog-inset)) calc(-1 * var(--dialog-inset)) var(--dialog-inset);}
body[class]:is(.workspace-page,.writing-app) #documentSetupDialog .editor-setup-actions {padding:16px 0 0;margin-top:24px;}
@media(max-width:600px) {
 body:is(.workspace-page,.writing-app,.auth-page) {--dialog-inset:16px;--dialog-heading-size:20px;}
 body[class]:is(.workspace-page,.writing-app) :is(.app-dialog-actions,.modal-actions,.editor-setup-actions,.template-detail-actions) > :is(button,a) {flex:1 1 auto;}
 body[class]:is(.workspace-page,.writing-app) #documentOptionsModal .modal-actions .danger {flex-basis:100%;margin-right:0;}
}
@media(prefers-reduced-motion:reduce) {body[class]:is(.workspace-page,.writing-app,.auth-page) [data-ui-icon] {transition:none;}}


body.workspace-page.projects-page .workspace-content .project-card {padding:24px;border:1px solid var(--brand-line);border-radius:var(--brand-card-radius);background:var(--brand-paper);box-shadow:none;gap:0;}
body.workspace-page.projects-page .workspace-content .project-header {margin-bottom:12px;}
body.workspace-page.projects-page .workspace-content .project-card h3 {font:600 var(--brand-title-size)/1.5 var(--brand-body-font);margin:0 0 6px;color:var(--brand-ink);}
body.workspace-page.projects-page .workspace-content .project-desc {display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;font:400 var(--brand-label-size)/1.5 var(--brand-body-font);color:var(--brand-muted);margin:0 0 16px;}
body.workspace-page.projects-page .workspace-content .project-badge {display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;font-size:var(--brand-meta-size);color:var(--brand-muted);}
body.workspace-page.projects-page .workspace-content .project-badge > span {max-width:100%;overflow-wrap:anywhere;}
body.workspace-page.projects-page .workspace-content .project-meta {margin-top:auto;padding-top:12px;gap:12px;flex-wrap:wrap;}
body.workspace-page.projects-page .workspace-content .project-meta > a {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;background:var(--brand-primary);color:#fff;border-color:var(--brand-primary);}
body.workspace-page.projects-page .workspace-content .project-meta > a:hover {background:var(--brand-primary-hover);border-color:var(--brand-primary-hover);}
body.workspace-page.projects-page .workspace-content .project-date {font-size:var(--brand-meta-size);color:var(--brand-muted);}
body.workspace-page.projects-page .workspace-content .menu-btn {display:flex;align-items:center;gap:8px;min-height:44px;}
body.workspace-page.settings-page form.settings-card > :is(.form-group,.form-row,.avatar-upload,.settings-actions) {width:100%;max-width:760px;box-sizing:border-box;}
body.workspace-page.settings-page .settings-card .form-group {margin-bottom:20px;min-width:0;}
body.workspace-page.settings-page .settings-card .form-group > label {font-size:var(--brand-label-size);line-height:1.5;font-weight:500;margin-bottom:8px;color:var(--brand-ink);}
body.workspace-page.settings-page .settings-card .form-control {width:100%;min-height:44px;box-sizing:border-box;}
body.workspace-page.settings-page .settings-card .muted-text {font-size:var(--brand-label-size);line-height:1.6;color:var(--brand-muted);}
body.workspace-page.settings-page .settings-card .form-group > .muted-text {margin:6px 0 0;}
body.workspace-page.settings-page .settings-actions {display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:24px;padding-top:16px;border-top:1px solid var(--brand-line);}
body.workspace-page.settings-page .settings-actions > button {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;}
body.workspace-page .workspace-content :is(.workspace-empty-state,.documents-no-results,.templates-no-results,.dashboard-empty,.empty-state) {grid-column:1 / -1;box-sizing:border-box;padding:32px 24px;border:1px dashed var(--brand-line);border-radius:var(--brand-card-radius);background:var(--brand-paper);text-align:center;}
body.workspace-page .workspace-content :is(.workspace-empty-state,.documents-no-results,.templates-no-results,.dashboard-empty,.empty-state) > :is(svg.empty-sketch,img.empty-doodle) {display:block;width:72px;height:72px;box-sizing:border-box;margin:0 auto 16px;padding:12px;border-radius:16px;background:var(--brand-lavender);color:var(--brand-primary);}
body.workspace-page .workspace-content :is(.workspace-empty-state,.documents-no-results,.templates-no-results,.dashboard-empty,.empty-state) h3 {font:600 20px/1.4 var(--brand-heading-font);margin:0 0 8px;color:var(--brand-ink);}
body.workspace-page .workspace-content :is(.workspace-empty-state,.documents-no-results,.templates-no-results,.dashboard-empty,.empty-state) p {max-width:440px;margin:0 auto 20px;font-size:var(--brand-body-size);line-height:1.6;color:var(--brand-muted);overflow-wrap:anywhere;}
body.workspace-page .workspace-content :is(.workspace-empty-state,.documents-no-results,.templates-no-results,.dashboard-empty,.empty-state) > :is(button,a) {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;}
body.workspace-page .workspace-content :is(.workspace-empty-state,.documents-no-results,.templates-no-results,.dashboard-empty,.empty-state)[hidden] {display:none;}
body[class]:is(.workspace-page,.writing-app) .app-dialog-actions .app-dialog-btn.primary.is-destructive {background:#b42332;border-color:#b42332;color:#fff;}
body[class]:is(.workspace-page,.writing-app) .app-dialog-actions .app-dialog-btn.primary.is-destructive:hover {background:#941e2a;border-color:#941e2a;}
body[class]:is(.workspace-page,.writing-app) .app-dialog-actions .app-dialog-btn.primary.is-warning {background:#fff8e9;border-color:#d8b76b;color:#805b19;}
body[class]:is(.workspace-page,.writing-app) .app-dialog-actions .app-dialog-btn.primary.is-warning:hover {background:#fef0cd;}
body[class]:is(.workspace-page,.writing-app) .app-dialog-actions .app-dialog-btn.primary.is-neutral {background:var(--brand-paper);border-color:var(--brand-line);color:var(--brand-ink);}
body[class]:is(.workspace-page,.writing-app) .app-dialog-actions .app-dialog-btn.primary.is-neutral:hover {background:var(--brand-canvas);}
body.workspace-page .trash-document [data-permanent-delete] button {color:#a52a3b;border-color:#e8bec5;background:#fff1f3;}
@media(max-width:800px) {
 body:is(.workspace-page,.writing-app) .mobile-current-page {max-width:32vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--brand-meta-size);color:var(--brand-lavender);}
 body:is(.workspace-page,.writing-app) .mobile-menu-label {display:flex;align-items:center;gap:8px;}
 body:is(.workspace-page,.writing-app) .mobile-navigation nav {max-height:calc(var(--dialog-viewport-height,100dvh) - 72px);overflow-y:auto;overscroll-behavior:contain;scroll-padding:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));}
 body:is(.workspace-page,.writing-app) .mobile-navigation nav a {min-height:44px;box-sizing:border-box;}
 body:is(.workspace-page,.writing-app) .mobile-navigation nav a[aria-current=page] {background:var(--brand-lavender);color:var(--brand-primary);border-radius:var(--brand-control-radius);box-shadow:inset 3px 0 var(--brand-primary);font-weight:600;}
 body:is(.workspace-page,.writing-app) .mobile-navigation nav a[aria-current=page] .sketch-icon {color:inherit;}
}
@media(max-width:650px) {
 body.workspace-page.projects-page .workspace-content .project-card {padding:16px;}
 body.workspace-page.projects-page .workspace-content .project-meta > a {flex:1;}
 body.workspace-page.settings-page .settings-actions > button {width:100%;}
 body.workspace-page .workspace-content :is(.workspace-empty-state,.documents-no-results,.templates-no-results,.dashboard-empty,.empty-state) {padding:24px 16px;}
}


body.workspace-page.projects-page .workspace-content .project-card :is(h3,.project-description) {display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere;}
body.workspace-page.projects-page .workspace-content .project-card :is(.project-meta,.project-header,.project-info) {min-width:0;}
body.workspace-page.documents-page .documents-refinements {display:contents;}
body.workspace-page.documents-page .documents-refinements > summary {display:none;}
body.workspace-page.documents-page .documents-refinement-fields {display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
body.workspace-page.documents-page .documents-refinements:not([open]) > .documents-refinement-fields {display:flex;}
/* Desktop refinements are part of the initial layout, including before hydration.
   Closed details use a hidden content wrapper in modern browsers. */
@media(min-width:651px) {
 body.workspace-page.documents-page .documents-refinements::details-content {display:contents;content-visibility:visible;}
}
body.workspace-page.documents-page .documents-refinement-count:empty {display:none;}
body[class]:is(.workspace-page,.writing-app,.auth-page) :is(.main,dialog,.auth-layout) :is(button,input,select,textarea):disabled,
body[class]:is(.workspace-page,.writing-app,.auth-page) [data-ui-icon]:is(:disabled,[aria-disabled=true]) {
 opacity:1;color:var(--brand-muted);background:#f1f5f9;border-color:var(--brand-line);cursor:not-allowed;box-shadow:none;
}
body[class]:is(.workspace-page,.writing-app,.auth-page) input::placeholder,
body[class]:is(.workspace-page,.writing-app,.auth-page) textarea::placeholder {color:var(--brand-muted);opacity:1;}
body.writing-app .writing-header #saveState {display:inline-flex;align-items:center;gap:6px;animation:none;opacity:1;visibility:visible;color:var(--brand-muted);}
body.writing-app .writing-header #saveState::before {content:'';width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0;}
body.writing-app .writing-header #saveState[data-state=saved] {color:var(--brand-green);animation:none;}
body.writing-app .writing-header #saveState[data-state=saving] {color:var(--brand-primary);}
body.writing-app .writing-header #saveState[data-state=dirty] {color:#805b19;}
body.writing-app .writing-header #saveState[data-state=error] {color:#a52a3b;}
body.writing-app .writing-header #saveRetry {min-height:44px;padding:8px 12px;border:1px solid var(--brand-line);border-radius:var(--brand-control-radius);background:var(--brand-paper);color:#a52a3b;font:500 var(--brand-label-size)/1.5 var(--brand-body-font);cursor:pointer;}
body.writing-app .writing-header #saveWarning {margin:0;color:#a52a3b;font-size:var(--brand-meta-size);overflow-wrap:anywhere;}

/* The visual viewport shrinks when the mobile keyboard covers the page. */
body[class]:is(.workspace-page,.writing-app) dialog:is(.app-dialog-backdrop,.modal-backdrop) {top:var(--dialog-viewport-top,0px);height:var(--dialog-viewport-height,100dvh);}
body[class].documents-page :is(#documentOptionsModal,#competitorModal) {top:var(--dialog-viewport-top,0px);bottom:auto;height:var(--dialog-viewport-height,100dvh);padding:var(--dialog-inset);}
body[class].documents-page :is(#documentOptionsModal,#competitorModal) .modal-card {max-height:calc(var(--dialog-viewport-height,100dvh) - 2 * var(--dialog-inset));}
body[class]:is(.workspace-page,.writing-app) dialog:is(.app-dialog-backdrop,.modal-backdrop) :is(.app-dialog-card,.modal-card) {max-height:100%;min-height:0;}
body[class]:is(.workspace-page,.writing-app) dialog:is(.writing-dialog,.planner-dialog,.template-detail-dialog,.template-workflow-dialog,.choose-plan-dialog) {max-height:calc(var(--dialog-viewport-height,100dvh) - 24px);}
html[data-visual-keyboard] body[class]:is(.workspace-page,.writing-app) dialog:is(.writing-dialog,.planner-dialog,.template-detail-dialog,.template-workflow-dialog,.choose-plan-dialog) {top:calc(var(--dialog-viewport-top,0px) + 12px);bottom:auto;margin-top:0;margin-bottom:0;}
body[class]:is(.workspace-page,.writing-app) :is(.app-dialog-head,.dialog-heading,.modal-header) {flex-shrink:0;}
body[class]:is(.workspace-page,.writing-app) :is(.app-dialog-actions,.modal-actions,.editor-setup-actions,.template-detail-actions) {position:sticky;bottom:0;z-index:2;background:var(--brand-paper);}
body[class]:is(.workspace-page,.writing-app) :is(.app-dialog-body,#documentOptionsForm,#documentSetupForm,.planner-dialog-body) {scroll-padding-block:16px 96px;}
body[class]:is(.workspace-page,.writing-app) dialog :is(input,select,textarea) {scroll-margin-block:16px 96px;}
@media(max-width:650px) {
 body.workspace-page.documents-page .workspace-content .documents-toolbar {gap:8px;}
 body.workspace-page.documents-page .workspace-content .documents-toolbar .filter-tabs {gap:6px;scrollbar-width:thin;margin:0;padding:0 0 4px;max-width:100%;}
 body.workspace-page.documents-page .workspace-content .filter-tab {min-height:44px;padding:8px 12px;}
 body.workspace-page.documents-page .workspace-content .filter-tab[aria-pressed=true] {background:var(--brand-lavender);color:var(--brand-primary);border-color:var(--brand-line);box-shadow:inset 0 -2px 0 var(--brand-primary);}
 body.workspace-page.documents-page .documents-refinements {display:block;flex:1 1 100%;min-width:0;}
 body.workspace-page.documents-page .documents-refinements > summary {display:flex;align-items:center;gap:8px;min-height:44px;box-sizing:border-box;padding:8px 12px;border:1px solid var(--brand-line);border-radius:var(--brand-control-radius);background:var(--brand-paper);color:var(--brand-muted);font-size:var(--brand-label-size);cursor:pointer;list-style:none;}
 body.workspace-page.documents-page .documents-refinements > summary::-webkit-details-marker {display:none;}
 body.workspace-page.documents-page .documents-refinements > summary > .sketch-icon:last-child {margin-left:auto;}
 body.workspace-page.documents-page .documents-refinements[open] > summary > .sketch-icon:last-child {transform:rotate(180deg);}
 body.workspace-page.documents-page .documents-refinement-fields {display:grid;gap:12px;padding:12px 0 0;}
 body.workspace-page.documents-page .documents-refinements:not([open]) > .documents-refinement-fields {display:none;}
 body.workspace-page.documents-page .documents-refinement-count {padding:2px 7px;border-radius:12px;background:var(--brand-lavender);color:var(--brand-primary);}
 body.writing-app .writing-header #saveWarning {flex-basis:100%;}
 body[class]:is(.workspace-page,.writing-app) dialog :is(input,select,textarea) {font-size:var(--brand-title-size);}
}
