:root {
	color-scheme: light;
	--ink: #202825;
	--muted: #65716a;
	--line: #d8dcd5;
	--paper: #efeee8;
	--white: #fff;
	--green: #287253;
	--green-dark: #194c3b;
	--green-soft: #dcebe0;
	--coral: #bd553e;
	--shadow: 0 18px 55px rgba(38, 47, 43, .12);
	font-family: "DM Sans", sans-serif;
	font-synthesis: none;
	text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; color: var(--ink); background: var(--paper); }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid rgba(40, 114, 83, .42); outline-offset: 2px; }
button, a, label { -webkit-tap-highlight-color: transparent; }
svg { width: 18px; height: 18px; stroke-width: 1.8; }

.app-shell { min-height: 100vh; }
.sidebar { width: 258px; position: fixed; inset: 0 auto 0 0; z-index: 20; display: flex; flex-direction: column; padding: 28px 18px 16px; overflow-y: auto; background: #173b32; border-right: 1px solid #102f28; color: #f4f5ef; transition: transform .24s ease, width .24s ease; }
.brand { display: flex; align-items: center; gap: 11px; padding: 0 10px; color: var(--ink); text-decoration: none; }
.sidebar .brand { color: #f4f5ef; }
.brand-mark { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px 10px 10px 3px; background: var(--green); color: white; transform: rotate(-3deg); }
.brand-mark svg { width: 19px; height: 19px; }
.brand-name { font-size: 20px; font-weight: 700; letter-spacing: -.7px; }
.brand-name span { color: #a9d0ad; }
.workspace-switcher { display: flex; align-items: center; gap: 10px; width: 100%; min-width: 0; margin: 35px 0 30px; padding: 10px; text-align: left; border: 1px solid #426458; border-radius: 8px; background: #234a3e; color: #f4f5ef; cursor: pointer; }
.workspace-avatar, .profile-avatar { flex: 0 0 auto; display: grid; place-items: center; width: 33px; height: 33px; border-radius: 9px; background: #e7d7b8; color: #67533d; font-family: "Fraunces", serif; font-size: 19px; }
.workspace-copy, .profile-copy { display: grid; min-width: 0; gap: 2px; flex: 1; }
.workspace-copy strong, .profile-copy strong { font-size: 12px; font-weight: 600; }
.workspace-copy small, .profile-copy small { color: #b4c7bb; font-size: 10px; }
.workspace-switcher > svg { width: 15px; color: #c3d2c8; }
.side-label { color: #a8c1b2; font-size: 9px; font-weight: 700; letter-spacing: 1.25px; }
.primary-nav, .category-nav { display: grid; gap: 4px; margin-top: 11px; }
.nav-item, .category-item { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 40px; padding: 0 11px; border: 0; border-radius: 6px; background: transparent; color: #d0ded5; text-align: left; font-size: 12px; cursor: pointer; transition: background .15s ease, color .15s ease; }
.nav-item:hover, .category-item:hover { color: #fff; background: #2a5547; }
.nav-item.active { color: #fff; background: #326b55; font-weight: 600; }
.admin-nav-item[hidden] { display: none; }
.nav-item > svg { width: 16px; height: 16px; }
.nav-count { margin-left: auto; color: #b0c5b8; font-size: 10px; }
.side-section-heading { display: flex; align-items: center; justify-content: space-between; margin-top: 37px; padding: 0 7px 0 10px; }
.icon-button { display: inline-grid; place-items: center; flex: 0 0 auto; width: 36px; height: 36px; padding: 0; border: 1px solid transparent; border-radius: 7px; background: transparent; color: #536159; cursor: pointer; transition: background .15s ease, color .15s ease, border-color .15s ease; }
.icon-button:hover { background: #f0f2ed; color: var(--green-dark); }
.icon-button svg { width: 17px; height: 17px; }
.sidebar .icon-button { color: #ccddd1; }
.sidebar .icon-button:hover { background: #2a5547; color: #fff; }
.icon-button.tiny { width: 26px; height: 26px; }
.icon-button.tiny svg { width: 15px; height: 15px; }
.category-nav { margin-top: 8px; }
.category-row { display: flex; align-items: center; gap: 2px; min-width: 0; }
.category-item { flex: 1; min-width: 0; min-height: 35px; gap: 10px; font-size: 11px; }
.category-edit { opacity: 0; color: #b9cec1; }
.category-row:hover .category-edit, .category-row:focus-within .category-edit { opacity: 1; }
.category-edit:hover { background: #2a5547; color: #fff; }
.category-dot { width: 8px; height: 8px; border-radius: 3px; background: var(--category-color, #9eaf8b); }
.category-count { margin-left: auto; color: #b0c5b8; font-size: 10px; }
.sidebar-bottom { margin-top: auto; }
.storage-note { display: flex; align-items: center; gap: 9px; margin: 12px 4px; padding: 11px 9px; border-top: 1px solid #426055; }
.storage-icon { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 8px; color: #c6e4cd; background: #2b5949; }
.storage-icon svg { width: 15px; height: 15px; }
.storage-note > span:last-child { display: grid; gap: 3px; }
.storage-note strong { font-size: 10px; font-weight: 600; }
.storage-note small { color: #b6c9bd; font-size: 9px; }
.profile-button { display: flex; align-items: center; width: 100%; gap: 9px; padding: 10px 5px 2px; border: 0; border-top: 1px solid #426055; background: transparent; color: #f4f5ef; text-align: left; cursor: pointer; }
.profile-avatar { width: 31px; height: 31px; border-radius: 50%; background: #d3e3d9; color: var(--green-dark); font-size: 17px; }
.profile-button > svg { width: 18px; color: #bdcec3; }
.sidebar-scrim { display: none; }
.sidebar.collapsed { width: 72px; padding-right: 12px; padding-left: 12px; }
.sidebar.collapsed .brand { justify-content: center; padding: 0; }
.sidebar.collapsed .brand-name, .sidebar.collapsed .workspace-copy, .sidebar.collapsed .workspace-switcher > svg,
.sidebar.collapsed .side-label, .sidebar.collapsed .side-section-heading .icon-button,
.sidebar.collapsed .nav-item > span:not(.category-dot), .sidebar.collapsed .category-item > span:not(.category-dot),
.sidebar.collapsed .storage-note > span:last-child, .sidebar.collapsed .profile-copy, .sidebar.collapsed .profile-button > svg { display: none; }
.sidebar.collapsed .workspace-switcher, .sidebar.collapsed .profile-button { justify-content: center; padding-right: 0; padding-left: 0; }
.sidebar.collapsed .nav-item, .sidebar.collapsed .category-item { justify-content: center; padding: 0; }
.sidebar.collapsed .nav-item > svg { flex: 0 0 auto; }
.sidebar.collapsed .nav-count { display: none; }
.sidebar.collapsed .side-section-heading { justify-content: center; padding: 0; }
.sidebar.collapsed .primary-nav { margin-top: 11px; }
.sidebar.collapsed .category-nav { margin-top: 8px; }
.sidebar.collapsed .category-edit { display: none; }
.sidebar.collapsed .storage-note { justify-content: center; margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; }
.main-area.sidebar-collapsed { margin-left: 72px; }

.main-area { min-height: 100vh; margin-left: 258px; }
.topbar { height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 5.3%; border-bottom: 1px solid #d8dcd5; background: rgba(250,249,245,.96); }
.breadcrumbs { display: flex; align-items: center; gap: 9px; color: #66736b; font-size: 11px; }
.breadcrumbs svg { width: 13px; height: 13px; }
.breadcrumbs strong { color: #27342d; font-weight: 600; }
.topbar-actions { display: flex; align-items: center; gap: 14px; }
.search-box { width: min(275px, 32vw); height: 36px; display: flex; align-items: center; gap: 8px; padding: 0 9px; border: 1px solid #d3d9d2; border-radius: 6px; background: #fff; color: #58665d; }
.search-box > svg { width: 15px; height: 15px; }
.search-box input { width: 100%; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 11px; }
.search-box input::placeholder { color: #68756d; }
.search-box kbd { flex: 0 0 auto; padding: 2px 5px; border: 1px solid #ecece8; border-radius: 4px; background: #f8f8f5; color: #a0a49f; font: 9px "DM Sans", sans-serif; }
.topbar-bell { width: 32px; height: 32px; }
.topbar-bell svg { width: 18px; }
.top-avatar { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #d9e9df; color: var(--green-dark); font: 16px "Fraunces", serif; }
.menu-toggle { display: inline-grid; width: 32px; height: 32px; }
.page-content { width: min(1280px, 100%); margin: 0 auto; padding: 49px 5.3% 24px; }
.welcome-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.eyebrow { display: flex; align-items: center; gap: 7px; margin: 0 0 10px; color: #8b918d; font-size: 9px; font-weight: 700; letter-spacing: 1.3px; }
.eyebrow-dot { width: 6px; height: 6px; border-radius: 50%; background: #df8a69; box-shadow: 0 0 0 3px #f8e9df; }
h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 8px; font-family: "Fraunces", Georgia, serif; font-size: clamp(30px, 3vw, 39px); font-weight: 500; letter-spacing: -.8px; line-height: 1.18; }
.heading-period { color: var(--coral); }
.welcome-copy { margin: 0; color: #5f6d64; font-size: 12px; }
.primary-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 15px; border: 1px solid var(--green); border-radius: 6px; background: var(--green); color: #fff; font-size: 11px; font-weight: 600; cursor: pointer; transition: transform .15s ease, background .15s ease, box-shadow .15s ease; }
.primary-button:hover { transform: translateY(-1px); background: var(--green-dark); box-shadow: 0 5px 14px rgba(50,107,91,.16); }
.primary-button svg { width: 16px; height: 16px; }
.overview-strip { position: relative; display: flex; align-items: center; gap: 33px; overflow: hidden; margin-top: 30px; padding: 16px 22px; border: 1px solid #d6dbd3; border-radius: 8px; background: #fff; box-shadow: 0 2px 6px rgba(31, 45, 37, .035); }
.overview-item { display: flex; align-items: center; gap: 11px; min-width: 128px; }
.overview-item > span:last-child { display: grid; gap: 4px; }
.overview-item small { color: #657169; font-size: 10px; }
.overview-item strong { font-size: 17px; font-weight: 600; }
.overview-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 8px; }
.overview-icon svg { width: 17px; height: 17px; }
.overview-icon.lilac { background: #ece4f6; color: #654c8c; }
.overview-icon.mint { background: #dcefe2; color: #2e704b; }
.overview-icon.peach { background: #f8e2d8; color: #a94e32; }
.overview-divider { width: 1px; height: 31px; background: #d9ddd6; }
.overview-flourish { margin-left: auto; padding-right: 8px; color: #d9876e; font-size: 24px; transform: rotate(-13deg); }
.notes-section { margin-top: 42px; }
.section-toolbar { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; }
.section-kicker { margin-bottom: 5px; color: #637168; font-size: 9px; font-weight: 700; letter-spacing: 1.2px; }
.section-toolbar h2 { margin: 0; font-family: "Fraunces", Georgia, serif; font-size: 24px; font-weight: 500; }
.toolbar-controls { display: flex; align-items: center; gap: 5px; }
.sort-control { display: flex; align-items: center; gap: 7px; padding: 0 6px; color: #8e958f; }
.sort-control svg { width: 15px; height: 15px; }
.sort-control select { max-width: 135px; border: 0; outline: 0; background: transparent; color: #69716b; font-size: 10px; cursor: pointer; }
.toolbar-divider { width: 1px; height: 20px; margin: 0 5px; background: #e7e8e2; }
.view-toggle { width: 31px; height: 31px; color: #999f99; }
.view-toggle svg { width: 16px; height: 16px; }
.view-toggle.active { border-color: #e9e9e4; background: white; color: var(--green); }
.filter-chips { display: flex; gap: 7px; margin-top: 16px; }
.filter-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border: 1px solid #e8eae4; border-radius: 4px; background: #fff; color: #68716a; font-size: 10px; }
.filter-chip button { display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: #8d948e; cursor: pointer; }
.filter-chip svg { width: 12px; height: 12px; }
.notes-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin-top: 18px; }
.note-card { position: relative; display: flex; flex-direction: column; min-width: 0; min-height: 194px; padding: 16px 16px 12px; overflow: hidden; border: 1px solid #d6dbd3; border-radius: 7px; background: #fff; cursor: pointer; animation: note-arrive .38s both; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.note-card:hover { transform: translateY(-2px); border-color: #d5dfd7; box-shadow: 0 8px 22px rgba(37,42,42,.055); }
@keyframes note-arrive { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
.note-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.note-category { display: inline-flex; align-items: center; gap: 6px; min-width: 0; color: #5e6b62; font-size: 9px; }
.note-category .category-dot { width: 6px; height: 6px; }
.note-actions { display: flex; align-items: center; gap: 1px; opacity: 0; transition: opacity .15s ease; }
.note-card:hover .note-actions, .note-card:focus-within .note-actions { opacity: 1; }
.note-action { display: grid; place-items: center; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 5px; background: transparent; color: #9aa09b; cursor: pointer; }
.note-action:hover, .note-action.selected { background: #f5f3ed; color: #c58c45; }
.note-action.danger:hover { color: #c56b61; }
.note-action svg { width: 14px; height: 14px; }
.note-title { display: -webkit-box; overflow: hidden; margin: 13px 0 7px; color: #303735; font-family: "Fraunces", Georgia, serif; font-size: 18px; font-weight: 500; line-height: 1.28; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.note-preview { display: -webkit-box; overflow: hidden; margin: 0; color: #5f6b63; font-size: 10px; line-height: 1.7; white-space: pre-line; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.note-card-bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 15px; color: #66736a; font-size: 9px; }
.note-bottom-meta { display: flex; align-items: center; gap: 8px; min-width: 0; }
.note-attachment-indicator { display: inline-flex; align-items: center; gap: 4px; color: #326d4d; }
.note-attachment-indicator svg { width: 12px; height: 12px; }
.pinned-mark { display: inline-flex; color: #d08a51; }
.pinned-mark svg { width: 12px; height: 12px; }
.notes-grid.list-layout { grid-template-columns: 1fr; gap: 7px; }
.list-layout .note-card { display: grid; grid-template-columns: minmax(130px, .8fr) minmax(160px, 1.8fr) auto; align-items: center; min-height: 76px; padding: 12px 16px; column-gap: 18px; }
.list-layout .note-card-top { display: contents; }
.list-layout .note-category { grid-column: 1; grid-row: 1; align-self: start; }
.list-layout .note-actions { grid-column: 3; grid-row: 1; justify-self: end; opacity: 1; }
.list-layout .note-title { grid-column: 1; grid-row: 2; margin: 4px 0 0; font-size: 15px; }
.list-layout .note-preview { grid-column: 2; grid-row: 1 / 3; -webkit-line-clamp: 2; }
.list-layout .note-card-bottom { grid-column: 3; grid-row: 2; justify-content: flex-end; margin: 0; padding: 0; }
.empty-state { display: grid; justify-items: center; max-width: 420px; margin: 38px auto; padding: 28px 20px; text-align: center; animation: note-arrive .4s both; }
.empty-illustration { position: relative; display: grid; place-items: center; width: 84px; height: 84px; margin-bottom: 18px; border-radius: 26px 26px 26px 8px; background: #dcebe0; color: var(--green-dark); transform: rotate(-4deg); }
.empty-illustration::before, .empty-illustration::after { position: absolute; content: ""; width: 10px; height: 10px; border-radius: 3px; background: #e9a58b; }
.empty-illustration::before { top: -7px; right: 5px; }
.empty-illustration::after { bottom: 2px; left: -10px; width: 7px; height: 7px; background: #dabd71; }
.empty-illustration svg { width: 34px; height: 34px; stroke-width: 1.4; }
.empty-state h3 { margin: 0 0 8px; font-family: "Fraunces", Georgia, serif; font-size: 22px; font-weight: 500; }
.empty-state p { max-width: 310px; margin: 0 0 18px; color: #5f6c63; font-size: 11px; line-height: 1.7; }
.empty-state .primary-button { min-height: 36px; }
.app-footer { display: flex; justify-content: space-between; gap: 12px; margin-top: 48px; padding-top: 14px; border-top: 1px solid #d6dbd3; color: #657169; font-size: 9px; }
.app-footer span:first-child { display: inline-flex; align-items: center; gap: 6px; }
.app-footer svg { width: 12px; height: 12px; }

.editor-dialog { width: min(720px, calc(100% - 32px)); max-width: none; max-height: min(90vh, 860px); padding: 0; overflow: auto; border: 1px solid #e9e9e4; border-radius: 10px; background: #fff; color: var(--ink); box-shadow: var(--shadow); }
.editor-dialog::backdrop { background: rgba(34,42,38,.42); backdrop-filter: blur(3px); }
.editor-form { display: flex; min-height: min(680px, 88vh); flex-direction: column; }
.editor-header { display: flex; align-items: center; justify-content: space-between; padding: 19px 23px; border-bottom: 1px solid #efefea; }
.editor-heading { display: flex; align-items: center; gap: 11px; }
.editor-mark { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 9px 9px 9px 3px; background: #eaf1ea; color: var(--green); }
.editor-mark svg { width: 18px; height: 18px; }
.editor-kicker { margin: 0 0 3px; color: #a0a59f; font-size: 8px; font-weight: 700; letter-spacing: 1.1px; }
.editor-header h2 { margin: 0; font-family: "Fraunces", Georgia, serif; font-size: 18px; font-weight: 500; }
.editor-fields { display: flex; flex: 1; flex-direction: column; padding: 23px 26px 17px; }
.title-input { width: 100%; padding: 0; border: 0; outline: 0; color: var(--ink); font-family: "Fraunces", Georgia, serif; font-size: 29px; font-weight: 500; }
.title-input::placeholder { color: #c2c6c1; }
.editor-meta { display: flex; align-items: center; gap: 9px; margin-top: 11px; color: #a0a6a0; font-size: 9px; }
.category-select-wrap { display: inline-flex; align-items: center; gap: 5px; color: #7f8b80; }
.category-select-wrap svg { width: 13px; height: 13px; }
.category-select-wrap select { max-width: 155px; border: 0; outline: 0; background: transparent; color: #6e786f; font-size: 10px; }
.meta-dot { width: 3px; height: 3px; border-radius: 50%; background: #c4c8c3; }
.rich-editor { position: relative; margin-top: 20px; overflow: visible; border: 1px solid #e0e4df; border-radius: 7px; background: #fff; }
.format-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; padding: 7px; border-bottom: 1px solid #e7eae6; border-radius: 7px 7px 0 0; background: #f8f9f7; }
.format-group { display: inline-flex; align-items: center; gap: 2px; }
.format-button { display: inline-grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 1px solid transparent; border-radius: 5px; background: transparent; color: #58645c; cursor: pointer; }
.format-button:hover, .format-button:focus-visible { border-color: #d9e2dc; background: #e9f0eb; color: var(--green-dark); }
.format-button svg { width: 15px; height: 15px; }
.format-divider { width: 1px; height: 20px; margin: 0 3px; background: #dfe4df; }
.format-select-label { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 6px; border-radius: 5px; color: #58645c; }
.format-select-label:hover { background: #e9f0eb; }
.format-select-label svg { width: 15px; height: 15px; }
.format-select-label select { max-width: 95px; border: 0; outline: 0; background: transparent; color: #46544a; font-size: 10px; }
.color-tool { position: relative; display: inline-grid; place-items: center; width: 30px; height: 30px; overflow: hidden; border-radius: 5px; color: #58645c; cursor: pointer; }
.color-tool:hover { background: #e9f0eb; }
.color-tool svg { width: 15px; height: 15px; pointer-events: none; }
.color-tool input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.highlight-button { color: #a27a13; }
.emoji-picker { position: absolute; top: 44px; right: 8px; z-index: 5; display: grid; grid-template-columns: repeat(6, 34px); gap: 3px; padding: 8px; border: 1px solid #dfe4df; border-radius: 7px; background: #fff; box-shadow: 0 8px 24px rgba(35, 48, 39, .15); }
.emoji-picker[hidden] { display: none; }
.emoji-picker button { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 5px; background: transparent; font-size: 18px; cursor: pointer; }
.emoji-picker button:hover { background: #eef3ef; }
.content-input { flex: 1; min-height: 210px; max-height: 42vh; overflow: auto; padding: 14px 16px; outline: 0; color: #3f4942; font-size: 12px; line-height: 1.8; overflow-wrap: anywhere; }
.content-input:empty::before { color: #98a19a; content: attr(data-placeholder); pointer-events: none; }
.content-input:focus { box-shadow: inset 0 0 0 1px rgba(50, 107, 91, .18); }
.content-input h2, .content-input h3 { margin: .65em 0 .35em; line-height: 1.35; }
.content-input h2 { font-size: 1.45em; }
.content-input h3 { font-size: 1.2em; }
.content-input p { margin: 0 0 .7em; }
.content-input ul, .content-input ol { padding-left: 25px; }
.content-input blockquote { margin: .8em 0; padding: 4px 12px; border-left: 3px solid #8cae96; color: #65756a; }
.content-input pre { overflow: auto; padding: 10px; border-radius: 5px; background: #f2f4f1; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; }
.content-input table { width: 100%; margin: 10px 0; border-collapse: collapse; table-layout: auto; }
.content-input th, .content-input td { min-width: 60px; padding: 7px 9px; border: 1px solid #cfd8d0; text-align: left; vertical-align: top; }
.content-input th { background: #edf2ed; color: #35473b; font-weight: 600; }
.content-input img { max-width: 100%; height: auto; border-radius: 4px; }
.content-input a { color: #286b9e; text-decoration: underline; text-underline-offset: 2px; }
.attachment-area { margin-top: 17px; padding-top: 14px; border-top: 1px solid #efefea; }
.attachment-heading { display: flex; justify-content: space-between; gap: 8px; color: #a0a69f; font-size: 8px; font-weight: 700; letter-spacing: .8px; }
.attachment-heading span:last-child { font-size: 8px; font-weight: 400; letter-spacing: 0; }
.attachment-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.attachment-card { position: relative; display: flex; align-items: center; gap: 8px; width: min(100%, 205px); min-height: 43px; padding: 6px 26px 6px 7px; border: 1px solid #eaece7; border-radius: 6px; background: #fbfcfa; }
.attachment-thumb { display: grid; place-items: center; flex: 0 0 auto; width: 30px; height: 30px; overflow: hidden; border-radius: 4px; background: #edf2ed; color: #6d9079; }
.attachment-thumb img { width: 100%; height: 100%; object-fit: cover; }
.attachment-thumb svg { width: 15px; height: 15px; }
.attachment-info { display: grid; min-width: 0; gap: 2px; }
.attachment-info strong { overflow: hidden; color: #566059; font-size: 9px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.attachment-info small { color: #a0a69f; font-size: 8px; }
.remove-attachment { position: absolute; top: 5px; right: 5px; display: grid; place-items: center; width: 18px; height: 18px; padding: 0; border: 0; border-radius: 4px; background: transparent; color: #a0a6a0; cursor: pointer; }
.remove-attachment:hover { background: #f8eae7; color: #ba685c; }
.remove-attachment svg { width: 12px; height: 12px; }
.upload-zone { display: flex; align-items: center; gap: 10px; min-height: 58px; margin-top: 10px; padding: 9px 12px; border: 1px dashed #dce3db; border-radius: 6px; background: #fbfcfa; cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.upload-zone:hover, .upload-zone.dragging { border-color: #79a08a; background: #f3f8f4; }
.upload-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 6px; background: #eaf1eb; color: var(--green); }
.upload-icon svg { width: 15px; height: 15px; }
.upload-zone > span:nth-child(2) { display: grid; gap: 4px; }
.upload-zone strong { color: #59635b; font-size: 10px; font-weight: 600; }
.upload-zone small { color: #9ba39c; font-size: 9px; }
.upload-zone u { color: var(--green); text-underline-offset: 2px; }
.upload-arrow { width: 15px; margin-left: auto; color: #9ca89e; }
.editor-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 23px; border-top: 1px solid #efefea; background: #fdfdfb; }
.editor-hint { display: inline-flex; align-items: center; gap: 6px; color: #9ba19b; font-size: 9px; }
.editor-hint svg { width: 13px; height: 13px; }
.editor-footer > div { display: flex; align-items: center; gap: 8px; }
.text-button { min-height: 36px; padding: 0 12px; border: 0; border-radius: 5px; background: transparent; color: #79817a; font-size: 10px; cursor: pointer; }
.text-button:hover { background: #f0f1ed; }
.save-button { min-height: 36px; padding: 0 12px; font-size: 10px; }
.save-button svg { width: 14px; height: 14px; }
.toast-region { position: fixed; right: 22px; bottom: 22px; z-index: 50; display: grid; gap: 8px; }
.toast { display: flex; align-items: center; gap: 8px; padding: 11px 14px; border: 1px solid #e4e9e3; border-radius: 6px; background: #fff; color: #4e5c52; box-shadow: 0 7px 22px rgba(36,45,38,.12); font-size: 11px; animation: toast-in .22s ease both; }
.toast svg { width: 15px; height: 15px; color: var(--green); }
.toast.error svg { color: #c3685b; }
@keyframes toast-in { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }

.auth-dialog { width: min(430px, calc(100% - 28px)); max-width: none; padding: 0; overflow: visible; border: 1px solid #dfe4df; border-radius: 10px; background: #fff; color: var(--ink); box-shadow: var(--shadow); }
.auth-dialog::backdrop { background: rgba(27, 37, 31, .56); backdrop-filter: blur(4px); }
.auth-form { position: relative; padding: 34px 34px 25px; }
.auth-close { position: absolute; top: 11px; right: 11px; }
.auth-brand-mark { display: grid; place-items: center; width: 43px; height: 43px; margin-bottom: 18px; border-radius: 12px 12px 12px 4px; background: var(--green); color: #fff; }
.auth-brand-mark svg { width: 22px; height: 22px; }
.auth-eyebrow { margin: 0 0 8px; color: #6c7a70; font-size: 9px; font-weight: 700; letter-spacing: 1.1px; }
.auth-form h2 { margin: 0; font-family: "Fraunces", Georgia, serif; font-size: 27px; font-weight: 500; line-height: 1.25; }
.auth-description { margin: 8px 0 20px; color: #667169; font-size: 11px; line-height: 1.65; }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; margin-bottom: 18px; padding: 3px; border-radius: 6px; background: #f0f2ef; }
.auth-tab { min-height: 34px; border: 0; border-radius: 4px; background: transparent; color: #6e786f; font-size: 10px; cursor: pointer; }
.auth-tab.active { background: #fff; color: var(--green-dark); font-weight: 600; box-shadow: 0 1px 4px rgba(35, 48, 39, .12); }
.auth-field { display: grid; gap: 6px; margin-top: 12px; color: #46534a; font-size: 10px; font-weight: 600; }
.auth-field input { width: 100%; height: 40px; padding: 0 11px; border: 1px solid #d9dfd9; border-radius: 5px; background: #fff; color: #263129; font-size: 11px; }
.auth-field input::placeholder { color: #8e9991; }
.auth-field input:focus { border-color: #72987b; outline: 3px solid rgba(50, 107, 91, .14); }
.auth-error { margin: 12px 0 0; padding: 9px 10px; border: 1px solid #f0d2ca; border-radius: 5px; background: #fff5f1; color: #9c493c; font-size: 10px; line-height: 1.5; }
.auth-error.success { border-color: #c8dfce; background: #eef7ef; color: #285f3b; }
.auth-error[hidden] { display: none; }
.auth-submit { width: 100%; min-height: 42px; margin-top: 17px; }
.auth-privacy { display: flex; align-items: flex-start; gap: 6px; margin: 14px 0 0; color: #758078; font-size: 9px; line-height: 1.5; }
.auth-privacy svg { flex: 0 0 auto; width: 13px; height: 13px; }
.category-dialog { width: min(420px, calc(100% - 28px)); max-width: none; padding: 0; overflow: hidden; border: 1px solid #dfe4df; border-radius: 9px; background: #fff; color: var(--ink); box-shadow: var(--shadow); }
.category-dialog::backdrop { background: rgba(27, 37, 31, .48); backdrop-filter: blur(3px); }
.category-form-header { display: flex; align-items: center; justify-content: space-between; padding: 17px 20px; border-bottom: 1px solid #ecefea; }
.category-form-header h2 { margin: 0; font-family: "Fraunces", Georgia, serif; font-size: 20px; font-weight: 500; }
.category-form-fields { display: grid; grid-template-columns: minmax(0, 1fr) 88px; align-items: end; gap: 14px; padding: 18px 20px 22px; }
.category-form-fields .auth-field { margin: 0; }
.category-form-fields .auth-field input { height: 38px; }
.category-color-field { display: grid; gap: 6px; color: #46534a; font-size: 10px; font-weight: 600; }
.category-color-field input { width: 100%; height: 38px; padding: 4px; border: 1px solid #d9dfd9; border-radius: 5px; background: #fff; cursor: pointer; }
.category-form-footer { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 20px; border-top: 1px solid #ecefea; background: #fdfdfb; }
.category-form-footer .primary-button { min-height: 36px; font-size: 10px; }
.category-form-footer .primary-button svg { width: 14px; height: 14px; }
.profile-button { min-width: 0; }
.profile-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-button > svg { flex: 0 0 auto; }
.main-area.admin-approvals .sort-control, .main-area.admin-approvals .toolbar-divider, .main-area.admin-approvals .view-toggle { display: none; }
.main-area.admin-approvals .notes-grid { display: block; margin-top: 19px; }
.approval-list { display: grid; gap: 9px; }
.approval-list-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 5px; }
.approval-list-heading h3 { margin: 0; font-family: "Fraunces", Georgia, serif; font-size: 21px; font-weight: 500; }
.approval-refresh { width: 32px; height: 32px; border-color: #dfe5df; background: #fff; }
.approval-card { display: flex; align-items: center; gap: 13px; min-width: 0; padding: 14px 15px; border: 1px solid #dce2dc; border-radius: 7px; background: #fff; box-shadow: 0 2px 7px rgba(36, 48, 39, .035); }
.approval-avatar { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; background: #e4edf5; color: #365f83; font: 18px "Fraunces", Georgia, serif; }
.approval-user { display: grid; min-width: 0; flex: 1; gap: 4px; }
.approval-user strong { overflow: hidden; color: #2d3730; font-size: 11px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.approval-user small { color: #758078; font-size: 9px; }
.pending-badge { display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; padding: 5px 8px; border: 1px solid #efe1bb; border-radius: 4px; background: #fcf7e9; color: #82631f; font-size: 9px; }
.pending-badge svg { width: 12px; height: 12px; }
.approval-actions { display: flex; align-items: center; gap: 6px; margin-left: 5px; }
.approval-actions button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-height: 33px; padding: 0 9px; border-radius: 5px; font-size: 9px; font-weight: 600; cursor: pointer; }
.approval-actions svg { width: 13px; height: 13px; }
.approval-reject { border: 1px solid #ecd4d0; background: #fff; color: #a65045; }
.approval-reject:hover { background: #fff4f1; }
.approval-approve { min-height: 33px; }
.approval-empty { display: grid; justify-items: center; padding: 45px 18px; text-align: center; border: 1px dashed #cfd8d0; border-radius: 7px; background: rgba(255,255,255,.7); }
.approval-empty-mark { display: grid; place-items: center; width: 58px; height: 58px; margin-bottom: 13px; border-radius: 17px 17px 17px 5px; background: #e3efe5; color: #326b48; }
.approval-empty-mark svg { width: 25px; height: 25px; }
.approval-empty h3 { margin: 0 0 6px; font: 500 19px "Fraunces", Georgia, serif; }
.approval-empty p { margin: 0; color: #6c786f; font-size: 10px; }

.preview-dialog { position: fixed; inset: 0; width: 100%; height: 100vh; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; overflow: auto; border: 0; border-radius: 0; background: #fff; color: var(--ink); box-shadow: none; }
.preview-dialog::backdrop { background: rgba(30, 39, 33, .48); backdrop-filter: blur(4px); }
.preview-frame { min-height: 100%; display: flex; flex-direction: column; }
.preview-toolbar { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 62px; padding: 0 22px; border-bottom: 1px solid #e6e9e5; background: rgba(255,255,255,.97); }
.preview-toolbar-brand, .preview-toolbar-actions { display: flex; align-items: center; gap: 10px; }
.preview-toolbar-brand { color: #667169; font-size: 10px; font-weight: 600; }
.preview-mark { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px 8px 8px 3px; background: #eaf1eb; color: var(--green); }
.preview-mark svg { width: 16px; height: 16px; }
.preview-favorite { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 9px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: #6d776f; font-size: 10px; cursor: pointer; }
.preview-favorite:hover, .preview-favorite.active { border-color: #eee2c7; background: #fbf6e9; color: #a57b2e; }
.preview-favorite svg { width: 15px; height: 15px; }
.preview-favorite.active svg { fill: currentColor; }
.preview-edit { min-height: 35px; padding: 0 12px; font-size: 10px; }
.preview-edit svg { width: 14px; height: 14px; }
.preview-trash-action { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 34px; padding: 0 10px; border: 1px solid #cad9ce; border-radius: 5px; background: #f2f7f3; color: #315e3b; font-size: 10px; font-weight: 600; cursor: pointer; }
.preview-trash-action:hover { background: #e7f1e9; }
.preview-trash-action.danger { border-color: #e8ceca; background: #fff7f5; color: #a64e42; }
.preview-trash-action.danger:hover { background: #fbeae7; }
.preview-trash-action svg { width: 14px; height: 14px; }
.preview-trash-action[hidden] { display: none; }
.reader-document { width: min(100%, 1280px); margin: 0 auto; padding: 48px 54px 42px; }
.reader-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; color: #768078; font-size: 10px; }
.reader-category { display: inline-flex; align-items: center; gap: 7px; color: #4d6254; font-weight: 600; }
.reader-category .category-dot { width: 8px; height: 8px; }
.reader-meta-dot { width: 3px; height: 3px; border-radius: 50%; background: #a9b0aa; }
.reader-document > h1 { margin: 18px 0 26px; font-size: clamp(30px, 4vw, 42px); line-height: 1.16; overflow-wrap: anywhere; }
.reader-content { color: #3f4942; font-size: 14px; line-height: 1.9; overflow-wrap: anywhere; }
.reader-content > :first-child { margin-top: 0; }
.reader-content p { margin: 0 0 1em; }
.reader-content h1, .reader-content h2, .reader-content h3 { margin: 1.4em 0 .55em; color: #28332c; line-height: 1.3; }
.reader-content h1 { font-size: 1.7em; }
.reader-content h2 { font-size: 1.45em; }
.reader-content h3 { font-size: 1.2em; }
.reader-content ul, .reader-content ol { padding-left: 1.5em; }
.reader-content li { padding-left: .2em; margin: .25em 0; }
.reader-content blockquote { margin: 1.2em 0; padding: 8px 17px; border-left: 3px solid #779b81; color: #5e6e62; background: #f5f8f5; }
.reader-content pre { overflow: auto; padding: 14px 16px; border: 1px solid #e3e8e2; border-radius: 6px; background: #f6f8f5; font-size: 12px; line-height: 1.6; }
.reader-content table { width: 100%; margin: 1.3em 0; border-collapse: collapse; table-layout: auto; font-size: 12px; line-height: 1.55; }
.reader-content th, .reader-content td { min-width: 55px; padding: 9px 11px; border: 1px solid #d7ded7; text-align: left; vertical-align: top; }
.reader-content th { background: #f0f4ef; color: #33473a; font-weight: 600; }
.reader-content img { display: block; max-width: 100%; height: auto; margin: 1.2em auto; border-radius: 5px; }
.reader-content hr { margin: 1.6em 0; border: 0; border-top: 1px solid #dce2dc; }
.reader-content a { color: #286b9e; text-decoration: underline; text-underline-offset: 3px; }
.reader-attachments { margin-top: 36px; padding-top: 22px; border-top: 1px solid #e5e9e4; }
.reader-attachments h2 { display: flex; align-items: baseline; gap: 7px; margin: 0 0 13px; font-family: "Fraunces", Georgia, serif; font-size: 18px; font-weight: 500; }
.reader-attachments h2 span { color: #89938b; font: 10px "DM Sans", sans-serif; }
.reader-attachment-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.reader-attachment { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 9px; border: 1px solid #e0e5df; border-radius: 6px; background: #fbfcfa; color: inherit; text-decoration: none; transition: border-color .15s ease, background .15s ease; }
.reader-attachment:hover { border-color: #a8c3af; background: #f4f8f4; }
.reader-attachment img { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 4px; object-fit: cover; }
.reader-attachment-icon { display: grid; place-items: center; flex: 0 0 auto; width: 46px; height: 46px; border-radius: 5px; background: #eaf1eb; color: var(--green); }
.reader-attachment-icon svg { width: 20px; height: 20px; }
.reader-attachment-copy { display: grid; min-width: 0; gap: 4px; }
.reader-attachment-copy strong { overflow: hidden; color: #3f4b42; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.reader-attachment-copy small { color: #778178; font-size: 9px; }
.pptx-attachment { flex-wrap: wrap; }
.pptx-preview-button { display: inline-flex; align-items: center; gap: 5px; min-height: 30px; margin-left: auto; padding: 0 8px; border: 1px solid #d7e1d9; border-radius: 5px; background: #f5f8f5; color: #315b3c; font-size: 9px; font-weight: 600; cursor: pointer; }
.pptx-preview-button:hover { border-color: #9eb9a2; background: #edf5ee; }
.pptx-preview-button svg { width: 13px; height: 13px; }
.preview-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding: 13px 22px; border-top: 1px solid #e6e9e5; background: #fcfcfa; }
.preview-footer > span { display: inline-flex; align-items: center; gap: 6px; color: #758077; font-size: 9px; }
.preview-footer > span svg { width: 13px; height: 13px; }

.pptx-dialog { width: min(1120px, calc(100% - 32px)); max-width: none; max-height: min(94vh, 1000px); padding: 0; overflow: hidden; border: 1px solid #d9e0e6; border-radius: 9px; background: #e8edf2; color: var(--ink); box-shadow: var(--shadow); }
.pptx-dialog::backdrop { background: rgba(22, 31, 40, .64); backdrop-filter: blur(4px); }
.pptx-frame { display: flex; height: min(90vh, 900px); flex-direction: column; }
.pptx-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 59px; padding: 0 17px; border-bottom: 1px solid #dbe1e6; background: #fff; }
.pptx-file-heading, .pptx-toolbar-actions { display: flex; align-items: center; gap: 10px; }
.pptx-file-heading { min-width: 0; }
.pptx-file-mark { display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 34px; border-radius: 7px; background: #f7e9e5; color: #b04b3e; }
.pptx-file-mark svg { width: 18px; height: 18px; }
.pptx-file-heading > div { display: grid; min-width: 0; gap: 3px; }
.pptx-file-heading strong { overflow: hidden; max-width: min(48vw, 540px); color: #333e47; font-size: 11px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.pptx-file-heading small { color: #78848d; font-size: 9px; }
.pptx-toolbar-actions { gap: 4px; }
.pptx-toolbar-actions .icon-button { width: 32px; height: 32px; border-color: #e3e7ea; background: #fff; }
.pptx-toolbar-actions .icon-button:disabled { opacity: .4; cursor: default; }
.pptx-page-number { min-width: 54px; color: #59656e; text-align: center; font-size: 10px; font-variant-numeric: tabular-nums; }
.pptx-stage-wrap { position: relative; display: grid; flex: 1; min-height: 0; place-items: center; overflow: auto; padding: 25px; background: #e9edf1; }
.pptx-stage { position: relative; container-type: inline-size; width: min(960px, 100%); overflow: hidden; background: #fff; box-shadow: 0 7px 25px rgba(29, 42, 54, .19); }
.pptx-shape { position: absolute; overflow: hidden; color: #27313a; font-family: Arial, sans-serif; font-size: 1.7cqw; line-height: 1.2; }
.pptx-shape p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.pptx-shape p + p { margin-top: .15em; }
.pptx-shape p[data-bullet] { padding-left: 1em; }
.pptx-shape p[data-bullet]::before { position: absolute; margin-left: -1em; content: attr(data-bullet); }
.pptx-shape img { display: block; width: 100%; height: 100%; object-fit: contain; }
.pptx-status { width: min(680px, 100%); padding: 35px 20px; border: 1px solid #d4dce4; border-radius: 7px; background: #fff; color: #52616c; text-align: center; font-size: 12px; line-height: 1.65; }
.pptx-status[hidden] { display: none; }
.pptx-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 49px; padding: 0 17px; border-top: 1px solid #dbe1e6; background: #fff; }
.pptx-footer > span, .pptx-download { display: inline-flex; align-items: center; gap: 6px; color: #75818a; font-size: 9px; }
.pptx-footer > span svg, .pptx-download svg { width: 13px; height: 13px; }
.pptx-download { min-height: 31px; padding: 0 9px; border: 1px solid #dfe4e8; border-radius: 5px; color: #43535f; text-decoration: none; }
.pptx-download:hover { background: #f3f6f8; }

.document-preview-button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-height: 30px; margin-left: auto; padding: 0 9px; border: 1px solid #cfdae4; border-radius: 5px; background: #f2f6fa; color: #345d7b; font-size: 9px; font-weight: 600; cursor: pointer; }
.document-preview-button:hover { border-color: #8eacc5; background: #eaf2f8; }
.document-preview-button svg { width: 13px; height: 13px; }
.document-attachment { flex-wrap: wrap; }
.document-viewer-dialog { width: min(1080px, calc(100% - 32px)); max-width: none; max-height: min(94vh, 1000px); padding: 0; overflow: hidden; border: 1px solid #d9e0e6; border-radius: 9px; background: #e9edf1; color: var(--ink); box-shadow: var(--shadow); }
.document-viewer-dialog::backdrop { background: rgba(22, 31, 40, .64); backdrop-filter: blur(4px); }
.document-viewer-frame { display: flex; height: min(90vh, 920px); flex-direction: column; }
.document-viewer-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; padding: 0 17px; border-bottom: 1px solid #dbe1e6; background: #fff; }
.document-viewer-file, .document-viewer-actions, .pdf-controls { display: flex; align-items: center; gap: 8px; }
.document-viewer-file { min-width: 0; }
.document-viewer-mark { display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 34px; border-radius: 7px; background: #e5edf5; color: #376489; }
.document-viewer-mark svg { width: 18px; height: 18px; }
.document-viewer-file > div { display: grid; min-width: 0; gap: 3px; }
.document-viewer-file strong { overflow: hidden; max-width: min(42vw, 510px); color: #333e47; font-size: 11px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.document-viewer-file small { color: #78848d; font-size: 9px; }
.document-viewer-actions { gap: 4px; }
.document-viewer-actions .icon-button { width: 32px; height: 32px; border-color: #e3e7ea; background: #fff; }
.document-viewer-actions .icon-button:disabled { opacity: .4; cursor: default; }
.pdf-controls[hidden] { display: none; }
.pdf-page-count { min-width: 52px; color: #59656e; text-align: center; font-size: 10px; font-variant-numeric: tabular-nums; }
.document-control-divider { width: 1px; height: 20px; margin: 0 3px; background: #dfe4e8; }
.document-download { display: inline-flex; align-items: center; gap: 5px; min-height: 31px; padding: 0 9px; border: 1px solid #dfe4e8; border-radius: 5px; color: #43535f; font-size: 9px; text-decoration: none; }
.document-download:hover { background: #f3f6f8; }
.document-download svg { width: 13px; height: 13px; }
.document-viewer-stage { position: relative; display: grid; flex: 1; min-height: 0; place-items: start center; overflow: auto; padding: 24px; background: #e9edf1; }
.document-viewer-status { align-self: center; width: min(680px, 100%); margin: auto; padding: 35px 20px; border: 1px solid #d4dce4; border-radius: 7px; background: #fff; color: #52616c; text-align: center; font-size: 12px; line-height: 1.65; }
.document-viewer-status[hidden], .pdf-page-stage[hidden], .docx-document[hidden], .xlsx-document[hidden] { display: none; }
.pdf-page-stage { width: 100%; min-height: 100%; display: grid; justify-items: center; align-content: start; }
.pdf-page-stage canvas { display: block; max-width: 100%; height: auto; background: #fff; box-shadow: 0 5px 22px rgba(29, 42, 54, .2); }
.docx-document { width: min(840px, 100%); min-height: 100%; margin: 0 auto; padding: 48px 58px; background: #fff; box-shadow: 0 5px 22px rgba(29, 42, 54, .12); color: #303b34; font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; }
.docx-document > :first-child { margin-top: 0; }
.docx-document h1, .docx-document h2, .docx-document h3, .docx-document h4 { margin: 1.2em 0 .55em; color: #28332c; line-height: 1.3; }
.docx-document p { margin: 0 0 1em; }
.docx-document ul, .docx-document ol { padding-left: 1.6em; }
.docx-document table { width: 100%; margin: 1.2em 0; border-collapse: collapse; font-size: 11px; }
.docx-document th, .docx-document td { padding: 7px 9px; border: 1px solid #d7ded7; text-align: left; vertical-align: top; }
.docx-document img { max-width: 100%; height: auto; }
.xlsx-document { width: 100%; min-height: 100%; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #d6dde2; border-radius: 5px; background: #fff; }
.xlsx-sheet-tabs { display: flex; flex: 0 0 auto; gap: 2px; overflow-x: auto; padding: 7px 8px 0; border-bottom: 1px solid #cfd8d0; background: #f3f6f3; }
.xlsx-sheet-tab { flex: 0 0 auto; min-height: 32px; padding: 0 13px; border: 1px solid transparent; border-bottom: 0; border-radius: 5px 5px 0 0; background: transparent; color: #59665d; font-size: 10px; cursor: pointer; }
.xlsx-sheet-tab.active { position: relative; border-color: #cfd8d0; background: #fff; color: #2f5d3c; font-weight: 600; }
.xlsx-table-wrap { flex: 1; overflow: auto; background-color: #fff; background-image: linear-gradient(#eef1ee 1px, transparent 1px), linear-gradient(90deg, #eef1ee 1px, transparent 1px); background-size: 96px 30px; }
.xlsx-preview-table { min-width: 100%; border-collapse: collapse; color: #333d35; font-size: 10px; }
.xlsx-preview-table th, .xlsx-preview-table td { min-width: 96px; max-width: 320px; height: 30px; padding: 5px 8px; overflow: hidden; border: 1px solid #e2e7e2; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.xlsx-preview-table th { position: sticky; top: 0; z-index: 1; background: #edf2ed; color: #2d5035; font-weight: 700; }
.xlsx-limit-notice { flex: 0 0 auto; margin: 0; padding: 8px 11px; border-top: 1px solid #e3e8e3; background: #fff9e9; color: #806324; font-size: 9px; }
.xlsx-limit-notice[hidden] { display: none; }
.document-viewer-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 46px; padding: 0 16px; border-top: 1px solid #dbe1e6; background: #fff; }
.document-viewer-footer > span { display: inline-flex; align-items: center; gap: 6px; color: #75818a; font-size: 9px; }
.document-viewer-footer svg { width: 13px; height: 13px; }

@media (max-width: 1120px) {
	.sidebar { width: 230px; padding-right: 14px; padding-left: 14px; }
	.main-area { margin-left: 230px; }
	.sidebar.collapsed { width: 72px; padding-right: 12px; padding-left: 12px; }
	.notes-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.overview-strip { gap: 19px; padding-right: 16px; padding-left: 16px; }
	.overview-item { min-width: 110px; }
}
@media (max-width: 760px) {
	.sidebar, .sidebar.collapsed { width: 276px; padding: 28px 18px 16px; transform: translateX(-102%); box-shadow: none; }
	.sidebar.open { transform: translateX(0); box-shadow: 14px 0 40px rgba(32,42,37,.13); }
	.sidebar.collapsed .brand { justify-content: flex-start; padding: 0 10px; }
	.sidebar.collapsed .brand-name, .sidebar.collapsed .workspace-copy, .sidebar.collapsed .workspace-switcher > svg,
	.sidebar.collapsed .side-label, .sidebar.collapsed .side-section-heading .icon-button,
	.sidebar.collapsed .nav-item > span:not(.category-dot), .sidebar.collapsed .category-item > span:not(.category-dot),
	.sidebar.collapsed .storage-note > span:last-child, .sidebar.collapsed .profile-copy, .sidebar.collapsed .profile-button > svg { display: initial; }
	.sidebar.collapsed .nav-count { display: inline; }
	.sidebar.collapsed .workspace-switcher { justify-content: flex-start; padding: 10px; }
	.sidebar.collapsed .nav-item, .sidebar.collapsed .category-item { justify-content: flex-start; padding: 0 11px; }
	.sidebar.collapsed .side-section-heading { justify-content: space-between; padding: 0 7px 0 10px; }
	.sidebar.collapsed .storage-note { justify-content: flex-start; margin: 12px 4px; padding: 11px 9px; }
	.sidebar.collapsed .profile-button { justify-content: flex-start; padding: 10px 5px 2px; }
	.sidebar.collapsed .category-edit { display: grid; }
	.category-edit { opacity: 1; }
	.main-area.sidebar-collapsed { margin-left: 0; }
	.sidebar-scrim.show { position: fixed; inset: 0; z-index: 19; display: block; background: rgba(34,42,38,.28); }
	.main-area { margin-left: 0; }
	.topbar { height: 62px; gap: 10px; padding: 0 18px; }
	.breadcrumbs { margin-right: auto; font-size: 10px; }
	.topbar-actions { gap: 7px; }
	.search-box { width: min(220px, 39vw); height: 34px; }
	.search-box kbd, .topbar-bell { display: none; }
	.page-content { padding: 35px 22px 20px; }
	.overview-strip { gap: 14px; }
	.overview-item { min-width: 0; gap: 8px; }
	.overview-item small { font-size: 9px; }
	.overview-icon { width: 32px; height: 32px; }
	.overview-flourish { display: none; }
	.notes-section { margin-top: 34px; }
}
@media (max-width: 540px) {
	.topbar { padding: 0 12px; }
	.breadcrumbs > span, .breadcrumbs > svg { display: none; }
	.breadcrumbs strong { max-width: 105px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	.search-box { width: min(190px, 47vw); padding: 0 7px; }
	.search-box input { font-size: 10px; }
	.top-avatar { width: 27px; height: 27px; }
	.page-content { padding: 29px 16px 18px; }
	.welcome-row { align-items: flex-start; }
	h1 { max-width: 260px; font-size: 30px; }
	.welcome-copy { max-width: 290px; font-size: 10px; line-height: 1.6; }
	.welcome-row > .primary-button { min-height: 36px; gap: 5px; padding: 0 10px; font-size: 10px; white-space: nowrap; }
	.welcome-row > .primary-button svg { width: 14px; height: 14px; }
	.overview-strip { gap: 9px; margin-top: 23px; padding: 12px 9px; }
	.overview-item { flex: 1; gap: 6px; }
	.overview-item strong { font-size: 14px; }
	.overview-item small { font-size: 8px; }
	.overview-icon { width: 27px; height: 27px; border-radius: 6px; }
	.overview-icon svg { width: 14px; height: 14px; }
	.overview-divider { height: 24px; }
	.section-toolbar h2 { font-size: 21px; }
	.sort-control { gap: 3px; }
	.sort-control select { max-width: 105px; font-size: 9px; }
	.sort-control svg { width: 13px; }
	.toolbar-controls { gap: 1px; }
	.toolbar-divider { margin: 0 2px; }
	.view-toggle { width: 27px; height: 29px; }
	.notes-grid { grid-template-columns: 1fr; gap: 9px; margin-top: 14px; }
	.note-card { min-height: 167px; }
	.note-actions { opacity: 1; }
	.list-layout .note-card { grid-template-columns: 1fr auto; gap: 0 8px; }
	.list-layout .note-category { grid-column: 1; }
	.list-layout .note-actions { grid-column: 2; grid-row: 1; }
	.list-layout .note-title { grid-column: 1; grid-row: 2; }
	.list-layout .note-preview { grid-column: 1 / 3; grid-row: 3; margin-top: 5px; }
	.list-layout .note-card-bottom { grid-column: 1 / 3; grid-row: 4; justify-content: space-between; margin-top: 8px; padding-top: 9px; border-top: 1px solid #f0f0eb; }
	.app-footer { margin-top: 35px; font-size: 8px; }
	.editor-dialog { width: 100%; max-width: none; max-height: 94vh; margin: auto 0 0; border-radius: 12px 12px 0 0; }
	.editor-form { min-height: min(700px, 91vh); }
	.editor-fields { padding: 19px 18px 14px; }
	.reader-document { padding: 34px 28px 30px; }
	.preview-toolbar { padding: 0 14px; }
	.pptx-dialog { width: calc(100% - 16px); max-height: 95vh; }
	.pptx-frame { height: 91vh; }
	.pptx-stage-wrap { padding: 12px; }
	.document-viewer-dialog { width: calc(100% - 16px); max-height: 95vh; }
	.document-viewer-frame { height: 91vh; }
	.document-viewer-toolbar { min-height: 53px; padding: 0 8px; }
	.document-viewer-file { gap: 6px; }
	.document-viewer-file strong { max-width: 31vw; font-size: 9px; }
	.document-viewer-file small { font-size: 8px; }
	.document-viewer-mark { width: 28px; height: 28px; }
	.document-viewer-actions { gap: 1px; }
	.document-viewer-actions .icon-button { width: 27px; height: 28px; }
	.pdf-page-count { min-width: 37px; font-size: 8px; }
	.document-control-divider { margin: 0 1px; }
	.document-download { min-height: 28px; gap: 3px; padding: 0 6px; font-size: 8px; }
	.document-viewer-stage { padding: 12px; }
	.docx-document { padding: 26px 20px; font-size: 12px; }
	.xlsx-preview-table th, .xlsx-preview-table td { min-width: 85px; max-width: 200px; }
	.document-viewer-footer { min-height: 41px; padding: 0 9px; }
	.document-viewer-footer > span { max-width: 70%; font-size: 8px; }
	.pptx-toolbar { min-height: 53px; padding: 0 9px; }
	.pptx-file-heading { gap: 7px; }
	.pptx-file-heading strong { max-width: 39vw; font-size: 9px; }
	.pptx-file-mark { width: 29px; height: 29px; }
	.pptx-toolbar-actions { gap: 1px; }
	.pptx-toolbar-actions .icon-button { width: 28px; height: 28px; }
	.pptx-page-number { min-width: 40px; font-size: 9px; }
	.pptx-footer { min-height: 43px; padding: 0 9px; }
	.pptx-footer > span, .pptx-download { font-size: 8px; }
	.auth-form { padding: 30px 24px 22px; }
	.approval-card { flex-wrap: wrap; gap: 9px; padding: 12px; }
	.approval-user { flex-basis: calc(100% - 52px); }
	.pending-badge { margin-left: 47px; }
	.approval-actions { margin-left: auto; }
	.editor-header { padding: 15px 18px; }
	.title-input { font-size: 25px; }
	.rich-editor { margin-top: 17px; }
	.format-toolbar { gap: 2px; padding: 5px; }
	.format-divider { margin: 0 1px; }
	.format-button { width: 28px; height: 28px; }
	.format-select-label { padding: 0 3px; }
	.format-select-label select { max-width: 78px; font-size: 9px; }
	.content-input { min-height: 150px; max-height: 34vh; padding: 12px; }
	.editor-footer { padding: 12px 15px; }
	.editor-hint { max-width: 145px; font-size: 8px; }
	.preview-dialog { width: 100%; height: 100vh; height: 100dvh; max-height: none; margin: 0; border-radius: 0; }
	.preview-frame { min-height: 100%; }
	.preview-toolbar { min-height: 56px; padding: 0 12px; }
	.preview-toolbar-brand { gap: 7px; font-size: 9px; }
	.preview-toolbar-actions { gap: 3px; }
	.preview-favorite { min-height: 32px; padding: 0 6px; }
	.preview-favorite span { display: none; }
	.preview-edit { min-height: 33px; padding: 0 8px; font-size: 9px; }
	.preview-trash-action { min-height: 32px; gap: 3px; padding: 0 6px; font-size: 8px; }
	.preview-toolbar-actions .icon-button { width: 30px; height: 30px; }
	.reader-document { padding: 29px 20px 25px; }
	.reader-document > h1 { margin: 15px 0 20px; font-size: 30px; }
	.reader-content { font-size: 13px; }
	.reader-attachment-list { grid-template-columns: 1fr; }
	.preview-footer { padding: 11px 13px; }
	.preview-footer > span { max-width: 160px; font-size: 8px; }
	.preview-footer .primary-button { min-height: 33px; padding: 0 9px; font-size: 9px; }
}
:root {
	color-scheme: dark;
	--ink: #edf1f7;
	--muted: #9ca7b5;
	--line: #30343c;
	--paper: #111317;
	--white: #1d2025;
	--green: #0878ff;
	--green-dark: #0065e8;
	--green-soft: #172a43;
	--coral: #ff795f;
	--shadow: 0 24px 70px rgba(0, 0, 0, .48);
}
body { color: var(--ink); background: var(--paper); }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline-color: rgba(43, 139, 255, .8); }

.sidebar { background: #1b1d21; border-right-color: #292c32; color: #f1f4f8; }
.sidebar .brand, .sidebar .profile-button { color: #f1f4f8; }
.brand-mark, .auth-brand-mark { background: #0878ff; }
.brand-name span { color: #73b4ff; }
.workspace-switcher { border-color: #343941; background: #25282e; }
.workspace-avatar, .profile-avatar { background: #293b51; color: #9acaff; }
.workspace-copy small, .profile-copy small, .side-label, .category-count, .nav-count { color: #98a2b0; }
.nav-item, .category-item { color: #c3cad4; }
.nav-item:hover, .category-item:hover, .sidebar .icon-button:hover, .category-edit:hover { background: #292e36; color: #fff; }
.nav-item.active { background: #0878ff; color: #fff; }
.category-item.active { background: #18385d; color: #fff; }
.category-count { color: #aeb8c5; }
.storage-note, .profile-button { border-color: #343840; }
.storage-icon { color: #9acaff; background: #18385d; }
.sidebar .icon-button { color: #b7c0cb; }
.sidebar.collapsed .category-edit { display: none; }
.main-area { background: #111317; }
.topbar { border-color: #292c32; background: #17191d; }
.breadcrumbs, .breadcrumbs strong { color: #c0c8d3; }
.search-box { border-color: #363a42; background: #22252a; color: #c1cad5; }
.search-box input { color: #edf1f7; }
.search-box input::placeholder { color: #8f99a7; }
.search-box kbd { border-color: #3a3e46; background: #292c32; color: #a2adbb; }
.top-avatar { background: #17385d; color: #a9d3ff; }
.page-content { color: #edf1f7; }
.eyebrow, .welcome-copy, .section-kicker { color: #a2adbb; }
.overview-strip { border-color: #30343c; background: #1d2025; box-shadow: 0 6px 22px rgba(0, 0, 0, .16); }
.overview-item small, .app-footer { color: #a0aab8; }
.overview-icon.lilac { background: #222c43; color: #a9bdff; }
.overview-icon.mint { background: #173851; color: #75c8ff; }
.overview-icon.peach { background: #452b28; color: #ff9a7d; }
.overview-divider, .toolbar-divider { background: #383c44; }
.sort-control, .sort-control select { color: #aeb8c5; }
.view-toggle { color: #9da7b4; }
.view-toggle.active { border-color: #3a404a; background: #25282e; color: #65aaff; }
.filter-chip { border-color: #343941; background: #202329; color: #c0c8d2; }
.notes-grid .note-card, .approval-card { border-color: #30343c; background: #1d2025; box-shadow: 0 4px 18px rgba(0, 0, 0, .16); }
.notes-grid .note-card.tone-0 { border-color: #294b70; background: #182b43; }
.notes-grid .note-card.tone-1 { border-color: #28565d; background: #183237; }
.notes-grid .note-card.tone-2 { border-color: #2d5d46; background: #1b342b; }
.notes-grid .note-card.tone-3 { border-color: #51406a; background: #2b2338; }
.notes-grid .note-card.tone-4 { border-color: #603943; background: #352329; }
.notes-grid .note-card.tone-5 { border-color: #63512e; background: #342d20; }
.note-card:hover { border-color: #3d526c; box-shadow: 0 10px 26px rgba(0, 0, 0, .28); }
.notes-grid .note-card.tone-0:hover { border-color: #4a7fb5; }
.notes-grid .note-card.tone-1:hover { border-color: #44929a; }
.notes-grid .note-card.tone-2:hover { border-color: #4e946e; }
.notes-grid .note-card.tone-3:hover { border-color: #8569a8; }
.notes-grid .note-card.tone-4:hover { border-color: #a15b69; }
.notes-grid .note-card.tone-5:hover { border-color: #a0844a; }
.note-title, .approval-user strong { color: #eef2f7; }
.note-preview, .note-card-bottom, .approval-user small { color: #a3adba; }
.note-action { color: #aab4c1; }
.note-action:hover { background: #2b3038; color: #70b3ff; }
.note-action.selected { background: #3a3020; color: #f1be60; }
.note-action.danger:hover { color: #ff8476; }
.empty-state h3, .approval-empty h3 { color: #eff3f8; }
.empty-state p, .approval-empty p { color: #a5afbd; }
.empty-illustration, .approval-empty-mark { background: #18385d; color: #8cc5ff; }
.app-footer { border-color: #30343c; }
.primary-button { border-color: #0878ff; background: #0878ff; color: #fff; }
.primary-button:hover { background: #0065e8; box-shadow: 0 6px 20px rgba(0, 105, 255, .28); }

.editor-dialog, .auth-dialog, .category-dialog, .preview-dialog { border-color: #343840; background: #1b1e23; color: #edf1f7; }
.editor-dialog::backdrop, .auth-dialog::backdrop, .category-dialog::backdrop, .preview-dialog::backdrop { background: rgba(4, 6, 10, .76); }
.editor-header, .editor-footer, .category-form-header, .category-form-footer, .preview-toolbar, .preview-footer { border-color: #30343c; background: #1b1e23; }
.editor-kicker, .editor-hint, .attachment-heading, .attachment-heading span:last-child { color: #98a4b2; }
.editor-header h2, .auth-form h2, .category-form-header h2 { color: #f0f4f9; }
.title-input, .content-input { color: #e1e7ef; background: #17191d; }
.title-input::placeholder, .content-input:empty::before { color: #818c9a; }
.editor-meta, .category-select-wrap { color: #a4aebb; }
.category-select-wrap select, .format-select-label select { color: #d3dae4; }
.rich-editor { border-color: #363b44; background: #17191d; }
.format-toolbar { border-color: #363b44; background: #22252a; }
.format-button, .format-select-label, .color-tool { color: #bdc6d2; }
.format-button:hover, .format-button:focus-visible, .format-select-label:hover, .color-tool:hover { border-color: #3a526f; background: #263548; color: #8cc5ff; }
.format-divider { background: #3a3e46; }
.content-input { border-color: #17191d; }
.content-input blockquote { border-color: #398ff1; color: #b4c1d0; }
.content-input pre { background: #22252a; color: #d8e0ea; }
.content-input th { border-color: #3c424b; background: #292d34; color: #d8e5f5; }
.content-input td { border-color: #3c424b; }
.attachment-area { border-color: #30343c; }
.attachment-card, .upload-zone { border-color: #363b44; background: #202329; }
.attachment-thumb, .upload-icon { background: #18385d; color: #88c3ff; }
.attachment-info strong, .upload-zone strong { color: #dce3ec; }
.attachment-info small, .upload-zone small { color: #929eac; }
.upload-zone:hover, .upload-zone.dragging { border-color: #2487ff; background: #1d2b3c; }
.text-button { color: #b3bdc9; }
.text-button:hover { background: #2b2f36; }
.toast { border-color: #363b44; background: #24272d; color: #e0e6ee; }
.auth-eyebrow, .auth-description, .auth-privacy { color: #a4aebb; }
.auth-tabs { background: #25282e; }
.auth-tab { color: #aeb8c5; }
.auth-tab.active { background: #343941; color: #9bcaff; box-shadow: none; }
.auth-field, .category-color-field { color: #c5ced9; }
.auth-field input { border-color: #3a3f48; background: #17191d; color: #edf1f7; }
.auth-field input::placeholder { color: #828d9b; }
.auth-field input:focus { border-color: #2487ff; outline-color: rgba(36, 135, 255, .2); }
.category-color-field input { border-color: #3a3f48; background: #17191d; }
.category-form-header, .category-form-footer { border-color: #30343c; }
.preview-toolbar-brand, .reader-meta, .preview-footer > span { color: #a9b4c2; }
.preview-mark { background: #19385b; color: #8bc4ff; }
.preview-favorite { color: #bdc6d2; }
.preview-favorite:hover, .preview-favorite.active { border-color: #51442a; background: #332b1d; color: #f0c36e; }
.preview-trash-action { border-color: #344a61; background: #1b2b3b; color: #9acaff; }
.preview-trash-action:hover { background: #233a52; }
.preview-trash-action.danger { border-color: #593632; background: #382321; color: #ff988b; }
.reader-document { color: #edf1f7; }
.reader-meta, .reader-category { color: #aeb8c5; }
.reader-document > h1, .reader-content h1, .reader-content h2, .reader-content h3 { color: #f0f4f9; }
.reader-content { color: #d2dae4; }
.reader-content blockquote { border-color: #398ff1; background: #1d2b3c; color: #c1d2e5; }
.reader-content pre { border-color: #363b44; background: #202329; color: #dce3ec; }
.reader-content th, .reader-content td { border-color: #3a4049; }
.reader-content th { background: #292d34; color: #dae8f8; }
.reader-content hr, .reader-attachments { border-color: #343941; }
.reader-attachment { border-color: #363b44; background: #202329; }
.reader-attachment:hover { border-color: #3977b6; background: #1d2b3c; }
.reader-attachment-copy strong { color: #dce3ec; }
.reader-attachment-copy small, .reader-attachments h2 span { color: #9ca7b5; }
.reader-attachment-icon { background: #19385b; color: #8bc4ff; }
.approval-avatar { background: #203651; color: #a4ceff; }
.pending-badge { border-color: #55482b; background: #332b1d; color: #e6c16f; }
.approval-reject { border-color: #553633; background: #252225; color: #ff9c90; }
.approval-reject:hover { background: #382523; }
.approval-empty { border-color: #3b424b; background: #1d2025; }
.pptx-toolbar, .pptx-footer, .document-viewer-toolbar, .document-viewer-footer { border-color: #343941; background: #1b1e23; color: #e1e7ef; }
.pptx-file-heading strong, .document-viewer-file strong { color: #edf1f7; }
.pptx-file-heading small, .document-viewer-file small, .pptx-footer > span, .document-viewer-footer > span { color: #9ca7b5; }
.pptx-toolbar-actions .icon-button, .document-viewer-actions .icon-button, .document-download, .pptx-download { border-color: #3a3f48; background: #25282e; color: #d4dce6; }
.pptx-stage-wrap, .document-viewer-stage { background: #111317; }
.pptx-status, .document-viewer-status { border-color: #363b44; background: #202329; color: #c4cedb; }
.xlsx-document { border-color: #3a4049; background: #1b1e23; }
.xlsx-sheet-tabs { border-color: #3a4049; background: #22252a; }
.xlsx-sheet-tab { color: #b8c2cf; }
.xlsx-sheet-tab.active { border-color: #3a4049; background: #17191d; color: #8bc4ff; }
.xlsx-table-wrap { background-color: #17191d; background-image: linear-gradient(#292d34 1px, transparent 1px), linear-gradient(90deg, #292d34 1px, transparent 1px); }
.xlsx-preview-table { color: #dce3ec; }
.xlsx-preview-table th, .xlsx-preview-table td { border-color: #363b44; }
.xlsx-preview-table th { background: #292d34; color: #d8e5f5; }
.xlsx-limit-notice { border-color: #574828; background: #332b1d; color: #e5c575; }
.main-area { background: #34383f; color: #edf1f7; }
.page-content { color: #edf1f7; }
.page-content h1, .section-toolbar h2, .empty-state h3 { color: #f0f3f8; }
.page-content .eyebrow, .page-content .welcome-copy, .page-content .section-kicker { color: #bec6d1; }
.overview-strip { border-color: #d8dce3; background: #f8f9fb; box-shadow: 0 5px 18px rgba(25, 37, 54, .06); }
.overview-item small { color: #677384; }
.overview-item strong { color: #252d39; }
.overview-icon.lilac { background: #e9edff; color: #526fe0; }
.overview-icon.mint { background: #e0f2fa; color: #287ca7; }
.overview-icon.peach { background: #fff0e9; color: #be6546; }
.overview-divider, .toolbar-divider { background: #e2e6ec; }
.sort-control, .sort-control select { color: #d0d7e1; }
.view-toggle { color: #c0c8d3; }
.view-toggle.active { border-color: #d9e2ee; background: #edf4ff; color: #0878ff; }
.filter-chip { border-color: #e0e5ec; background: #f7f9fc; color: #586476; }
.notes-grid .note-card[class*="tone-"] { border-color: #d4d9e1; background: #f2f4f7; box-shadow: 0 4px 16px rgba(35, 45, 60, .08); }
.notes-grid .note-card[class*="tone-"]:hover { border-color: #b8c2d0; background: #f8f9fb; box-shadow: 0 8px 22px rgba(35, 45, 60, .12); }
.note-title { color: #252d39; }
.note-preview, .note-card-bottom { color: #5f6b7c; }
.note-action { color: #667386; }
.note-action:hover { background: #e5eaf1; color: #0865e8; }
.note-action.selected { background: #fff2d8; color: #9a6d12; }
.note-action.danger:hover { color: #b74742; }
.empty-state p { color: #c3cbd6; }
.empty-illustration { background: #dce8f7; color: #176bd2; }
.app-footer { border-color: #555b64; color: #c1c9d4; }
:root {
	color-scheme: light;
	--ink: #202b3a;
	--muted: #68778a;
	--line: #d9e2ec;
	--paper: #edf2f7;
	--white: #fff;
	--green: #168fe5;
	--green-dark: #0876ca;
	--green-soft: #dcefff;
	--coral: #e77e67;
	--shadow: 0 18px 46px rgba(34, 58, 84, .14);
}
body { color: var(--ink); background: var(--paper); }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline-color: rgba(22, 143, 229, .42); }
.sidebar { background: #202b39; border-right-color: #dce4ee; color: #eef4fb; }
.sidebar .brand, .sidebar .profile-button { color: #eef4fb; }
.brand-mark, .auth-brand-mark { background: #168fe5; }
.brand-name span { color: #90cefa; }
.workspace-switcher { border-color: #3d5066; background: #2a394b; }
.workspace-avatar, .profile-avatar { background: #dcefff; color: #176fae; }
.workspace-copy small, .profile-copy small, .side-label, .category-count, .nav-count { color: #b3c1d1; }
.nav-item, .category-item { color: #d3deea; }
.nav-item:hover, .category-item:hover, .sidebar .icon-button:hover, .category-edit:hover { background: #304257; color: #fff; }
.nav-item.active { background: #168fe5; color: #fff; }
.category-item.active { background: #294866; color: #fff; }
.storage-note, .profile-button { border-color: #3b4c60; }
.storage-icon { color: #9bd8ff; background: #2d4761; }
.sidebar .icon-button { color: #c0d0df; }
.sidebar.collapsed .category-edit { display: none; }
.main-area { background: linear-gradient(145deg, #b4e0fb 0%, #91cff4 48%, #76bced 100%); color: #202b3a; }
.topbar { border-color: #dde5ed; background: rgba(255, 255, 255, .96); }
.breadcrumbs, .breadcrumbs strong { color: #58687a; }
.search-box { border-color: #d8e1ea; background: #fff; color: #607185; }
.search-box input { color: #243246; }
.search-box input::placeholder { color: #8290a1; }
.search-box kbd { border-color: #dce4ec; background: #f5f8fb; color: #77879a; }
.top-avatar { background: #dcefff; color: #176fae; }
.page-content { color: #202b3a; }
.page-content h1, .section-toolbar h2, .empty-state h3 { color: #1e2d40; }
.page-content .eyebrow, .page-content .welcome-copy, .page-content .section-kicker { color: #68788b; }
.overview-strip { border-color: #cbd9e7; background: #fff; box-shadow: 0 4px 16px rgba(35, 57, 80, .07); }
.overview-item small { color: #67778a; }
.overview-item strong { color: #243246; }
.overview-icon.lilac { background: #e9edff; color: #5e70d9; }
.overview-icon.mint { background: #e0f2fa; color: #2585b7; }
.overview-icon.peach { background: #fff0e9; color: #bd684d; }
.overview-divider, .toolbar-divider { background: #e3e9ef; }
.sort-control, .sort-control select { color: #65758a; }
.view-toggle { color: #75879a; }
.view-toggle.active { border-color: #cfe6f8; background: #e5f4ff; color: #087dc8; }
.filter-chip { border-color: #d9e3ed; background: #fff; color: #5e6d80; }
.notes-grid .note-card, .approval-card { border-color: #dce4ec; background: #fff; box-shadow: 0 5px 18px rgba(38, 59, 82, .07); }
.notes-grid .note-card[class*="tone-"] { border-color: #dce4ec; background: #fff; box-shadow: 0 5px 18px rgba(38, 59, 82, .07); }
.note-card:hover, .notes-grid .note-card[class*="tone-"]:hover { border-color: #a8d3f0; background: #fff; box-shadow: 0 10px 24px rgba(38, 75, 108, .12); }
.note-title, .approval-user strong { color: #243246; }
.note-preview, .note-card-bottom, .approval-user small { color: #68788b; }
.note-action { color: #76879a; }
.note-action:hover { background: #e8f4fc; color: #087dc8; }
.note-action.selected { background: #fff5df; color: #a67619; }
.note-action.danger:hover { color: #c34e4a; }
.empty-state h3, .approval-empty h3 { color: #243246; }
.empty-state p, .approval-empty p { color: #697a8e; }
.empty-illustration, .approval-empty-mark { background: #dcefff; color: #1685d0; }
.app-footer { border-color: #bdcede; color: #596d84; }
.primary-button { border-color: #168fe5; background: #168fe5; color: #fff; }
.primary-button:hover { border-color: #0876ca; background: #0876ca; box-shadow: 0 6px 18px rgba(22, 143, 229, .22); }
.editor-dialog, .auth-dialog, .category-dialog, .preview-dialog { border-color: #d9e2ec; background: #fff; color: #202b3a; box-shadow: 0 20px 60px rgba(28, 48, 71, .2); }
.editor-dialog::backdrop, .auth-dialog::backdrop, .category-dialog::backdrop, .preview-dialog::backdrop { background: rgba(29, 43, 60, .48); }
.editor-header, .editor-footer, .category-form-header, .category-form-footer, .preview-toolbar, .preview-footer { border-color: #e1e7ee; background: #fff; }
.editor-kicker, .editor-hint, .attachment-heading, .attachment-heading span:last-child { color: #7b8999; }
.editor-header h2, .auth-form h2, .category-form-header h2 { color: #233246; }
.title-input, .content-input { color: #354357; background: #fff; }
.title-input::placeholder, .content-input:empty::before { color: #8794a3; }
.editor-meta, .category-select-wrap { color: #728196; }
.category-select-wrap select, .format-select-label select { color: #56677c; }
.rich-editor { border-color: #d8e1ea; background: #fff; }
.format-toolbar { border-color: #e0e7ee; background: #f6f9fc; }
.format-button, .format-select-label, .color-tool { color: #5d6d80; }
.format-button:hover, .format-button:focus-visible, .format-select-label:hover, .color-tool:hover { border-color: #c8e4f7; background: #e8f5ff; color: #087dc8; }
.format-divider { background: #dce5ed; }
.content-input { border-color: #fff; }
.content-input blockquote { border-color: #59aee5; color: #5e7185; }
.content-input pre { background: #f1f5f9; color: #334155; }
.content-input th { border-color: #d9e2ec; background: #edf4fa; color: #35485d; }
.content-input td { border-color: #d9e2ec; }
.attachment-area { border-color: #e0e7ee; }
.attachment-card, .upload-zone { border-color: #dce5ed; background: #f8fafc; }
.attachment-thumb, .upload-icon { background: #e2f2fd; color: #1685d0; }
.attachment-info strong, .upload-zone strong { color: #3d4d61; }
.attachment-info small, .upload-zone small { color: #79889a; }
.upload-zone:hover, .upload-zone.dragging { border-color: #72b9e8; background: #f0f8fe; }
.text-button { color: #66768a; }
.text-button:hover { background: #edf3f8; }
.toast { border-color: #dce5ed; background: #fff; color: #405166; box-shadow: 0 7px 22px rgba(36, 55, 76, .12); }
.auth-eyebrow, .auth-description, .auth-privacy { color: #66768a; }
.auth-tabs { background: #eef3f8; }
.auth-tab { color: #64758a; }
.auth-tab.active { background: #fff; color: #087dc8; box-shadow: 0 1px 4px rgba(35, 48, 39, .12); }
.auth-field, .category-color-field { color: #43546a; }
.auth-field input { border-color: #d6e0e9; background: #fff; color: #25364a; }
.auth-field input::placeholder { color: #8391a1; }
.auth-field input:focus { border-color: #55a8e1; outline-color: rgba(22, 143, 229, .16); }
.category-color-field input { border-color: #d6e0e9; background: #fff; }
.preview-toolbar-brand, .reader-meta, .preview-footer > span { color: #708095; }
.preview-mark { background: #e2f2fd; color: #1685d0; }
.preview-favorite { color: #63748a; }
.preview-favorite:hover, .preview-favorite.active { border-color: #f0dfb8; background: #fff7e8; color: #a67619; }
.preview-trash-action { border-color: #cde4f3; background: #f0f8fd; color: #237fb6; }
.preview-trash-action:hover { background: #e4f3fc; }
.preview-trash-action.danger { border-color: #f0d6d2; background: #fff5f3; color: #b74d46; }
.reader-document { color: #344357; }
.reader-meta, .reader-category { color: #687b91; }
.reader-document > h1, .reader-content h1, .reader-content h2, .reader-content h3 { color: #25364a; }
.reader-content { color: #405168; }
.reader-content blockquote { border-color: #68b3e5; background: #eef7fd; color: #5b7188; }
.reader-content pre { border-color: #dfe7ee; background: #f4f7fa; color: #334155; }
.reader-content th, .reader-content td { border-color: #d7e1eb; }
.reader-content th { background: #edf4fa; color: #35495f; }
.reader-content hr, .reader-attachments { border-color: #dfe7ee; }
.reader-attachment { border-color: #dce5ed; background: #f8fafc; }
.reader-attachment:hover { border-color: #a8d3f0; background: #f0f8fe; }
.reader-attachment-copy strong { color: #405168; }
.reader-attachment-copy small, .reader-attachments h2 span { color: #75869a; }
.reader-attachment-icon { background: #e2f2fd; color: #1685d0; }
.reader-document { width: min(100%, 1120px); }
.reader-content { font-size: 16px; line-height: 1.85; }
.reader-content table { font-size: 13px; }
.reader-meta { font-size: 11px; }
.reader-table-wrap { width: 100%; max-width: 100%; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; }
.overview-strip { background: #f5f8fc; }
.notes-grid .note-card, .notes-grid .note-card[class*="tone-"] { border-color: #d4e0ec; background: #edf3f9; box-shadow: 0 4px 14px rgba(42, 67, 94, .055); }
.note-card:hover, .notes-grid .note-card[class*="tone-"]:hover { border-color: #b7d4ea; background: #f2f6fb; box-shadow: 0 8px 20px rgba(42, 67, 94, .09); }
.note-title { color: #344458; }
.note-preview, .note-card-bottom { color: #65758a; }
.preview-dialog { background: #91c9f1; }
.preview-toolbar, .preview-footer { border-color: #8bbfe5; background: #c2e3fa; }
.preview-toolbar-brand, .preview-footer > span, .preview-toolbar .icon-button, .preview-favorite { color: #36536d; }
.preview-toolbar .icon-button:hover, .preview-favorite:hover { background: #acd7f5; color: #203d57; }
.reader-document { background: #e2e4e7; color: #414c59; }
.reader-document > h1, .reader-content h1, .reader-content h2, .reader-content h3 { color: #35465b; }
.reader-content { color: #4d5865; }
.reader-content th { background: #d6d9de; color: #414c59; }
.reader-content td, .reader-content th { border-color: #c8cdd4; }
.approval-avatar { background: #e2f2fd; color: #237fb6; }
.pending-badge { border-color: #eddfbc; background: #fff8e8; color: #8b6b20; }
.approval-reject { border-color: #efd8d5; background: #fff; color: #ad4d45; }
.approval-reject:hover { background: #fff3f1; }
.approval-empty { border-color: #d7e1eb; background: #fff; }
.pptx-toolbar, .pptx-footer, .document-viewer-toolbar, .document-viewer-footer { border-color: #dce5ed; background: #fff; color: #405168; }
.pptx-file-heading strong, .document-viewer-file strong { color: #2c3e53; }
.pptx-file-heading small, .document-viewer-file small, .pptx-footer > span, .document-viewer-footer > span { color: #73849a; }
.pptx-toolbar-actions .icon-button, .document-viewer-actions .icon-button, .document-download, .pptx-download { border-color: #dce5ed; background: #fff; color: #52667d; }
.pptx-stage-wrap, .document-viewer-stage { background: #e8edf3; }
.pptx-status, .document-viewer-status { border-color: #d9e2ec; background: #fff; color: #52667d; }
.xlsx-document { border-color: #d9e2ec; background: #fff; }
.xlsx-sheet-tabs { border-color: #d9e2ec; background: #f2f6fa; }
.xlsx-sheet-tab { color: #5f7085; }
.xlsx-sheet-tab.active { border-color: #d9e2ec; background: #fff; color: #1685d0; }
.xlsx-table-wrap { background-color: #fff; background-image: linear-gradient(#e8edf2 1px, transparent 1px), linear-gradient(90deg, #e8edf2 1px, transparent 1px); }
.xlsx-preview-table { color: #35465b; }
.xlsx-preview-table th, .xlsx-preview-table td { border-color: #dce5ed; }
.xlsx-preview-table th { background: #edf4fa; color: #35495f; }
.xlsx-limit-notice { border-color: #eddfbc; background: #fff8e8; color: #8b6b20; }
.copyright { flex: 0 1 auto; color: #8190a1; font-size: 8px; font-weight: 400; line-height: 1.45; text-align: center; }
.app-footer .copyright { margin-left: auto; }
.editor-footer .copyright, .category-form-footer .copyright { margin: 0 auto; }
.auth-copyright { display: block; margin-top: 15px; }
.preview-footer .copyright { color: #61768c; }
.pptx-footer .copyright, .document-viewer-footer .copyright { color: #73849a; }
@media (max-width: 760px) {
	.app-footer, .editor-footer, .category-form-footer, .preview-footer, .pptx-footer, .document-viewer-footer { flex-wrap: wrap; }
	.app-footer .copyright { flex-basis: 100%; margin-left: 0; text-align: left; }
	.editor-footer .copyright { flex-basis: 100%; order: 3; text-align: left; }
	.preview-footer .copyright, .pptx-footer .copyright, .document-viewer-footer .copyright { flex-basis: 100%; order: 3; text-align: left; }
}
@media (hover: none) {
	.category-edit { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

:root {
	color-scheme: dark;
	--ink: #e4e8ee;
	--muted: #aeb7c3;
	--line: #3b424c;
	--paper: #20242b;
	--white: #2a2f37;
	--green: #82b8df;
	--green-dark: #679cc4;
	--green-soft: #303d4a;
	--coral: #d9917e;
	--shadow: 0 18px 48px rgba(0, 0, 0, .28);
}
body { color: #e4e8ee; background: #20242b; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline-color: rgba(130, 184, 223, .68); }
.sidebar { background: #191d23; border-right-color: #343a43; color: #e4e8ee; }
.sidebar .brand, .sidebar .profile-button { color: #edf1f6; }
.brand-mark, .auth-brand-mark { background: #638fb3; color: #f7f9fc; }
.brand-name span { color: #abc9e1; }
.workspace-switcher { border-color: #414954; background: #272d35; }
.workspace-avatar, .profile-avatar { background: #394653; color: #d7e6f2; }
.workspace-copy small, .profile-copy small, .side-label, .category-count, .nav-count { color: #aab4c0; }
.nav-item, .category-item { color: #c9d0d9; }
.nav-item:hover, .category-item:hover, .sidebar .icon-button:hover, .category-edit:hover { background: #303741; color: #f5f7fa; }
.nav-item.active { background: #426783; color: #fff; }
.category-item.active { background: #303b47; color: #f2f5f8; }
.storage-note, .profile-button { border-color: #373e48; }
.storage-icon { color: #c4d9ea; background: #303b47; }
.sidebar .icon-button { color: #c4ccd6; }
.main-area { color: #e4e8ee; background: #242930; }
.topbar { border-color: #373e48; background: #20242b; }
.breadcrumbs, .breadcrumbs strong { color: #c0c8d2; }
.search-box { border-color: #434b56; background: #2a3038; color: #c5cdd7; }
.search-box input { color: #e6ebf1; }
.search-box input::placeholder { color: #9aa5b2; }
.search-box kbd { border-color: #444c57; background: #343b45; color: #b0bac6; }
.top-avatar { background: #364653; color: #d6e6f3; }
.page-content { color: #e4e8ee; }
.page-content h1, .section-toolbar h2, .empty-state h3 { color: #e8edf3; }
.page-content .eyebrow, .page-content .welcome-copy, .page-content .section-kicker { color: #adb7c3; }
.overview-strip { border-color: #3b424c; background: #2a3038; box-shadow: 0 5px 18px rgba(0, 0, 0, .12); }
.overview-item small, .app-footer { color: #b2bbc6; }
.overview-item strong { color: #edf1f6; }
.overview-icon.lilac { background: #343849; color: #c1c7df; }
.overview-icon.mint { background: #2f4148; color: #b8d4d8; }
.overview-icon.peach { background: #463934; color: #e0b3a1; }
.overview-divider, .toolbar-divider { background: #414853; }
.sort-control, .sort-control select { color: #b8c1cc; }
.view-toggle { color: #aab5c2; }
.view-toggle.active { border-color: #526a7c; background: #303b46; color: #c2d9eb; }
.filter-chip { border-color: #414954; background: #2b3139; color: #c5cdd7; }
.notes-grid .note-card, .notes-grid .note-card[class*="tone-"], .approval-card { border-color: #3d444e; background: #2c323a; box-shadow: 0 5px 16px rgba(0, 0, 0, .13); }
.note-card:hover, .notes-grid .note-card[class*="tone-"]:hover { border-color: #617b90; background: #323943; box-shadow: 0 9px 22px rgba(0, 0, 0, .2); }
.note-title, .approval-user strong { color: #e5e9ef; }
.note-preview, .note-card-bottom, .approval-user small { color: #b5bec9; }
.note-action { color: #bac3ce; }
.note-action:hover { background: #3a424d; color: #c3ddf1; }
.note-action.selected { background: #494233; color: #e3c88f; }
.note-action.danger:hover { color: #e6a29a; }
.empty-state h3, .approval-empty h3 { color: #e7ecf2; }
.empty-state p, .approval-empty p { color: #b4bdc8; }
.empty-illustration, .approval-empty-mark { background: #303c47; color: #c1d8e9; }
.app-footer { border-color: #3b424c; color: #adb7c3; }
.primary-button { border-color: #648eae; background: #648eae; color: #fff; }
.primary-button:hover { border-color: #759fbe; background: #759fbe; box-shadow: 0 6px 16px rgba(76, 115, 146, .24); }
.editor-dialog, .auth-dialog, .category-dialog, .preview-dialog { border-color: #414852; background: #252a31; color: #e4e8ee; box-shadow: 0 20px 60px rgba(0, 0, 0, .42); }
.editor-dialog::backdrop, .auth-dialog::backdrop, .category-dialog::backdrop, .preview-dialog::backdrop { background: rgba(8, 10, 14, .72); }
.editor-header, .editor-footer, .category-form-header, .category-form-footer, .preview-toolbar, .preview-footer { border-color: #3b424c; background: #252a31; }
.editor-kicker, .editor-hint, .attachment-heading, .attachment-heading span:last-child { color: #aab4c0; }
.editor-header h2, .auth-form h2, .category-form-header h2 { color: #e9edf3; }
.title-input, .content-input { color: #dce2ea; background: #20242b; }
.title-input::placeholder, .content-input:empty::before { color: #929eac; }
.editor-meta, .category-select-wrap { color: #afb9c5; }
.category-select-wrap select, .format-select-label select { color: #d0d7e0; }
.rich-editor { border-color: #424a55; background: #20242b; }
.format-toolbar { border-color: #424a55; background: #2c323a; }
.format-button, .format-select-label, .color-tool { color: #c4ccd6; }
.format-button:hover, .format-button:focus-visible, .format-select-label:hover, .color-tool:hover { border-color: #627b91; background: #35414d; color: #d1e3f0; }
.format-divider { background: #444c57; }
.content-input { border-color: #20242b; }
.content-input blockquote { border-color: #799ebc; color: #c1ccd7; }
.content-input pre { background: #2d333c; color: #dce2ea; }
.content-input th { border-color: #4a525e; background: #343b45; color: #e1e7ee; }
.content-input td { border-color: #4a525e; }
.attachment-area { border-color: #3b424c; }
.attachment-card, .upload-zone { border-color: #414954; background: #2b3139; }
.attachment-thumb, .upload-icon { background: #35414c; color: #c3d8e8; }
.attachment-info strong, .upload-zone strong { color: #d8dee6; }
.attachment-info small, .upload-zone small { color: #a5afbb; }
.upload-zone:hover, .upload-zone.dragging { border-color: #769bb8; background: #303b46; }
.text-button { color: #b9c2cd; }
.text-button:hover { background: #343b45; }
.toast { border-color: #414954; background: #2b3139; color: #e0e5eb; box-shadow: 0 7px 22px rgba(0, 0, 0, .24); }
.auth-eyebrow, .auth-description, .auth-privacy { color: #b4bdc8; }
.auth-tabs { background: #20242b; }
.auth-tab { color: #b3bdc9; }
.auth-tab.active { background: #353c46; color: #d3e3f0; box-shadow: none; }
.auth-field, .category-color-field { color: #cbd2dc; }
.auth-field input { border-color: #454d58; background: #20242b; color: #e5eaf0; }
.auth-field input::placeholder { color: #9ca7b4; }
.auth-field input:focus { border-color: #87abc8; outline-color: rgba(130, 184, 223, .18); }
.category-color-field input { border-color: #454d58; background: #20242b; }
.auth-error { border-color: #644744; background: #392d2d; color: #efb6ae; }
.auth-error.success { border-color: #435d51; background: #2b3933; color: #bdd8c5; }
.preview-toolbar-brand, .reader-meta, .preview-footer > span { color: #b6c0cc; }
.preview-mark { background: #35414c; color: #c4dbea; }
.preview-favorite { color: #c1cad4; }
.preview-favorite:hover, .preview-favorite.active { border-color: #655941; background: #39352c; color: #e2c78b; }
.preview-trash-action { border-color: #4d6274; background: #2d3944; color: #caddeb; }
.preview-trash-action:hover { background: #394752; }
.preview-trash-action.danger { border-color: #654745; background: #392d2d; color: #efb3aa; }
.preview-dialog { background: #20242b; }
.preview-toolbar, .preview-footer { border-color: #3b424c; background: #252a31; }
.preview-toolbar-brand, .preview-footer > span, .preview-toolbar .icon-button, .preview-favorite { color: #c0c8d2; }
.preview-toolbar .icon-button:hover, .preview-favorite:hover { background: #373e48; color: #eef2f7; }
.reader-document { background: #2a3038; color: #d5dce5; }
.reader-meta, .reader-category { color: #b8c3cf; }
.reader-document > h1, .reader-content h1, .reader-content h2, .reader-content h3 { color: #e5eaf0; }
.reader-content { color: #d0d7e0; }
.reader-content blockquote { border-color: #789bb8; background: #303943; color: #cbd4de; }
.reader-content pre { border-color: #434b56; background: #22272e; color: #d6dde6; }
.reader-content th, .reader-content td { border-color: #464e59; }
.reader-content th { background: #343b45; color: #e1e6ed; }
.reader-content hr, .reader-attachments { border-color: #414954; }
.reader-attachment { border-color: #414954; background: #2b3139; }
.reader-attachment:hover { border-color: #637d93; background: #333c46; }
.reader-attachment-copy strong { color: #dce2e9; }
.reader-attachment-copy small, .reader-attachments h2 span { color: #aab5c1; }
.reader-attachment-icon { background: #35414c; color: #c4dbea; }
.approval-avatar { background: #35414c; color: #d2e1ed; }
.pending-badge { border-color: #60553c; background: #38342b; color: #dfca91; }
.approval-reject { border-color: #624542; background: #2d3036; color: #eab0a8; }
.approval-reject:hover { background: #3b3030; }
.approval-empty { border-color: #424a55; background: #2a3038; }
.pptx-toolbar, .pptx-footer, .document-viewer-toolbar, .document-viewer-footer { border-color: #3b424c; background: #252a31; color: #d5dce5; }
.pptx-file-heading strong, .document-viewer-file strong { color: #e3e8ef; }
.pptx-file-heading small, .document-viewer-file small, .pptx-footer > span, .document-viewer-footer > span { color: #adb8c4; }
.pptx-toolbar-actions .icon-button, .document-viewer-actions .icon-button, .document-download, .pptx-download { border-color: #444c57; background: #303741; color: #d1d9e2; }
.pptx-stage-wrap, .document-viewer-stage { background: #20242b; }
.pptx-status, .document-viewer-status { border-color: #424a55; background: #2a3038; color: #cbd3dd; }
.xlsx-document { border-color: #414954; background: #252a31; }
.xlsx-sheet-tabs { border-color: #414954; background: #2b3139; }
.xlsx-sheet-tab { color: #c1cad5; }
.xlsx-sheet-tab.active { border-color: #414954; background: #252a31; color: #c5d9e8; }
.xlsx-table-wrap { background-color: #242930; background-image: linear-gradient(#343b45 1px, transparent 1px), linear-gradient(90deg, #343b45 1px, transparent 1px); }
.xlsx-preview-table { color: #d5dce5; }
.xlsx-preview-table th, .xlsx-preview-table td { border-color: #414954; }
.xlsx-preview-table th { background: #343b45; color: #e1e6ed; }
.xlsx-limit-notice { border-color: #60553c; background: #38342b; color: #dfca91; }
.copyright { color: #a4afbc; }
.preview-footer .copyright, .pptx-footer .copyright, .document-viewer-footer .copyright { color: #aab5c1; }

:root {
	color-scheme: dark;
	--ink: #eee8ef;
	--muted: #b3aaba;
	--line: #45384c;
	--paper: #211728;
	--white: #302538;
	--green: #66c4cb;
	--green-dark: #49aeb8;
	--green-soft: #24434b;
	--coral: #e58b78;
	--shadow: 0 18px 46px rgba(9, 8, 18, .32);
}
body { color: #eee8ef; background: #211728; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline-color: rgba(127, 174, 255, .72); }
.sidebar { background: #153247; border-right-color: #285064; color: #e6edf2; }
.sidebar .brand, .sidebar .profile-button { color: #edf3f7; }
.brand-mark, .auth-brand-mark { background: #55b9c4; color: #f4fbfc; }
.brand-name span { color: #a7dce0; }
.workspace-switcher { border-color: #3d6171; background: #234355; }
.workspace-avatar, .profile-avatar { background: #d4e5f0; color: #35546c; }
.workspace-copy small, .profile-copy small, .side-label, .category-count, .nav-count { color: #b3c8d2; }
.nav-item, .category-item { color: #c7d7df; }
.nav-item:hover, .category-item:hover, .sidebar .icon-button:hover, .category-edit:hover { background: #2d4c5e; color: #fff; }
.nav-item.active { background: #788fe0; color: #fff; }
.category-item { border: 1px solid transparent; }
.category-item:not(.active) { background: color-mix(in srgb, var(--category-color, #789c90) 84%, #fff); color: #31404a; }
.category-item:not(.active) .category-count { color: #43515b; }
.category-item.active { border-color: rgba(255, 255, 255, .16); background: #7187d4; color: #fff; }
.category-item.active .category-count { color: #eef1ff; }
.category-dot { background: color-mix(in srgb, var(--category-color, #9eaf8b) 74%, #fff); }
.category-item:not(.active) .category-dot { background: color-mix(in srgb, var(--category-color, #9eaf8b) 72%, #fff); }
.storage-note, .profile-button { border-color: #315064; }
.storage-icon { color: #c0e4e8; background: #294a5c; }
.sidebar .icon-button { color: #c3d5dd; }
.main-area { color: #eee8ef; background: linear-gradient(135deg, #292038 0%, #30213b 52%, #38243a 100%); }
.topbar { border-color: #493950; background: rgba(34, 25, 43, .96); }
.breadcrumbs, .breadcrumbs strong { color: #d0c5d3; }
.search-box { border-color: #51445a; background: #352941; color: #c8bfce; }
.search-box input { color: #f0eaf3; }
.search-box input::placeholder { color: #b2a7ba; }
.search-box kbd { border-color: #5a4d62; background: #403348; color: #c2b7ca; }
.top-avatar { background: #40545c; color: #d1e5e6; }
.page-content { color: #eee8ef; }
.page-content h1, .section-toolbar h2, .empty-state h3 { color: #f0eaf2; }
.page-content .eyebrow, .page-content .welcome-copy, .page-content .section-kicker { color: #c3b8c7; }
.heading-period { color: #e78d78; }
.overview-strip { border-color: #51425b; background: #30263a; box-shadow: 0 5px 18px rgba(10, 8, 17, .16); }
.overview-item small, .app-footer { color: #c0b5c6; }
.overview-item strong { color: #f1ebf2; }
.overview-icon.lilac { background: #484269; color: #c2c7fb; }
.overview-icon.mint { background: #34565d; color: #b4dfe0; }
.overview-icon.peach { background: #66453d; color: #f0b09a; }
.overview-divider, .toolbar-divider { background: #51465a; }
.sort-control, .sort-control select { color: #c5bacb; }
.view-toggle { color: #b8adbf; }
.view-toggle.active { border-color: #6967a6; background: #3c3b61; color: #c8cdff; }
.filter-chip { border-color: #55485e; background: #352b3e; color: #d0c5d5; }
.notes-grid .note-card, .notes-grid .note-card[class*="tone-"], .approval-card { border-color: transparent; box-shadow: 0 6px 18px rgba(12, 8, 20, .18); }
.notes-grid .note-card.tone-0 { background: #3d586b; }
.notes-grid .note-card.tone-1 { background: #493554; }
.notes-grid .note-card.tone-2 { background: #815052; }
.notes-grid .note-card.tone-3 { background: #d9ae5d; }
.notes-grid .note-card.tone-4 { background: #9c80b1; }
.notes-grid .note-card.tone-5 { background: #80b8ca; }
.note-card.tone-0 .note-title, .note-card.tone-0 .note-preview, .note-card.tone-0 .note-card-bottom,
.note-card.tone-1 .note-title, .note-card.tone-1 .note-preview, .note-card.tone-1 .note-card-bottom,
.note-card.tone-2 .note-title, .note-card.tone-2 .note-preview, .note-card.tone-2 .note-card-bottom,
.note-card.tone-4 .note-title, .note-card.tone-4 .note-preview, .note-card.tone-4 .note-card-bottom { color: #f4edf4; }
.note-card.tone-3 .note-title, .note-card.tone-3 .note-preview, .note-card.tone-3 .note-card-bottom,
.note-card.tone-5 .note-title, .note-card.tone-5 .note-preview, .note-card.tone-5 .note-card-bottom { color: #29343d; }
.note-card:hover, .notes-grid .note-card[class*="tone-"]:hover { filter: brightness(1.06); box-shadow: 0 10px 24px rgba(12, 8, 20, .25); }
.note-title, .approval-user strong { color: #f2edf4; }
.note-preview, .note-card-bottom, .approval-user small { color: #c6bdcd; }
.note-action { color: inherit; }
.note-action:hover { background: rgba(20, 25, 34, .22); color: #fff; }
.note-action.selected { background: rgba(46, 38, 28, .32); color: #f1d18c; }
.note-action.danger:hover { color: #ffd0c6; }
.empty-state h3, .approval-empty h3 { color: #f0eaf2; }
.empty-state p, .approval-empty p { color: #c3b8c8; }
.empty-illustration, .approval-empty-mark { background: #3b3652; color: #c3c5f0; }
.app-footer { border-color: #51425b; color: #bdb1c4; }
.primary-button { border-color: #54aeb8; background: #55b9c4; color: #163842; }
.primary-button:hover { border-color: #6ac4cc; background: #6ac4cc; color: #163842; box-shadow: 0 6px 18px rgba(57, 157, 169, .24); }
.editor-dialog, .auth-dialog, .category-dialog, .preview-dialog { border-color: #55485d; background: #30263a; color: #eee8ef; box-shadow: 0 20px 60px rgba(8, 5, 14, .48); }
.editor-dialog::backdrop, .auth-dialog::backdrop, .category-dialog::backdrop, .preview-dialog::backdrop { background: rgba(7, 6, 13, .76); }
.editor-header, .editor-footer, .category-form-header, .category-form-footer, .preview-toolbar, .preview-footer { border-color: #51435b; background: #30263a; }
.editor-kicker, .editor-hint, .attachment-heading, .attachment-heading span:last-child { color: #bdb2c4; }
.editor-header h2, .auth-form h2, .category-form-header h2 { color: #f0eaf2; }
.title-input, .content-input { color: #e8e1eb; background: #261f30; }
.title-input::placeholder, .content-input:empty::before { color: #a99eb1; }
.editor-meta, .category-select-wrap { color: #c1b5c9; }
.category-select-wrap select, .format-select-label select { color: #ded5e3; }
.rich-editor { border-color: #51465a; background: #261f30; }
.format-toolbar { border-color: #51465a; background: #393044; }
.format-button, .format-select-label, .color-tool { color: #d2c9d8; }
.format-button:hover, .format-button:focus-visible, .format-select-label:hover, .color-tool:hover { border-color: #7182bd; background: #444765; color: #d7dcff; }
.format-divider { background: #544a5d; }
.content-input { border-color: #261f30; }
.content-input blockquote { border-color: #68b8c0; color: #c9c2d2; }
.content-input pre { background: #30283a; color: #ded7e3; }
.content-input th { border-color: #594f61; background: #3b3345; color: #eee8f1; }
.content-input td { border-color: #594f61; }
.attachment-area { border-color: #51435b; }
.attachment-card, .upload-zone { border-color: #51465a; background: #352b3e; }
.attachment-thumb, .upload-icon { background: #344b57; color: #c1e0e1; }
.attachment-info strong, .upload-zone strong { color: #e3dce7; }
.attachment-info small, .upload-zone small { color: #b6abba; }
.upload-zone:hover, .upload-zone.dragging { border-color: #69b8c0; background: #35434c; }
.text-button { color: #c8bfce; }
.text-button:hover { background: #403649; }
.toast { border-color: #51465a; background: #352b3e; color: #e8e1eb; box-shadow: 0 7px 22px rgba(8, 5, 14, .3); }
.auth-eyebrow, .auth-description, .auth-privacy { color: #c4bacb; }
.auth-tabs { background: #261f30; }
.auth-tab { color: #bfb4c7; }
.auth-tab.active { background: #45405a; color: #d8dbfb; box-shadow: none; }
.auth-field, .category-color-field { color: #d1c8d8; }
.auth-field input { border-color: #554a60; background: #261f30; color: #eee8f1; }
.auth-field input::placeholder { color: #a99fb1; }
.auth-field input:focus { border-color: #8a8bd1; outline-color: rgba(126, 136, 213, .2); }
.category-color-field input { border-color: #554a60; background: #261f30; }
.auth-error { border-color: #744c4a; background: #443039; color: #f0b7ac; }
.auth-error.success { border-color: #49655c; background: #2b4140; color: #bfe0d1; }
.preview-toolbar-brand, .reader-meta, .preview-footer > span { color: #c4bacb; }
.preview-mark { background: #3a4058; color: #d0d5fa; }
.preview-favorite { color: #d0c7d7; }
.preview-favorite:hover, .preview-favorite.active { border-color: #726044; background: #463a32; color: #f2d18c; }
.preview-trash-action { border-color: #4e6470; background: #30424b; color: #c9e2e4; }
.preview-trash-action:hover { background: #3b535b; }
.preview-trash-action.danger { border-color: #714d4c; background: #433038; color: #f2b8ad; }
.preview-dialog { background: #261b31; }
.preview-toolbar, .preview-footer { border-color: #49374e; background: #30233a; }
.preview-toolbar-brand, .preview-footer > span, .preview-toolbar .icon-button, .preview-favorite { color: #d3c9db; }
.preview-toolbar .icon-button:hover, .preview-favorite:hover { background: #493a50; color: #fff; }
.reader-document { background: #332941; color: #e2dce7; }
.reader-meta, .reader-category { color: #c9bdd0; }
.reader-document > h1, .reader-content h1, .reader-content h2, .reader-content h3 { color: #f0e9f2; }
.reader-content { color: #ddd5e2; }
.reader-content blockquote { border-color: #67b9c0; background: #304047; color: #d0dce0; }
.reader-content pre { border-color: #51445a; background: #292230; color: #e0d9e5; }
.reader-content th, .reader-content td { border-color: #594c61; }
.reader-content th { background: #40354a; color: #eee8f2; }
.reader-content hr, .reader-attachments { border-color: #51445a; }
.reader-attachment { border-color: #51465a; background: #352b3e; }
.reader-attachment:hover { border-color: #7d769f; background: #3d3548; }
.reader-attachment-copy strong { color: #e6dfeb; }
.reader-attachment-copy small, .reader-attachments h2 span { color: #bcb1c6; }
.reader-attachment-icon { background: #344b57; color: #c1e0e1; }
.approval-avatar { background: #394453; color: #d6d8f5; }
.pending-badge { border-color: #66543c; background: #40352d; color: #ead39a; }
.approval-reject { border-color: #704b49; background: #332b34; color: #efb9b0; }
.approval-reject:hover { background: #43333b; }
.approval-empty { border-color: #51465a; background: #30263a; }
.pptx-toolbar, .pptx-footer, .document-viewer-toolbar, .document-viewer-footer { border-color: #51445a; background: #30263a; color: #ded6e4; }
.pptx-file-heading strong, .document-viewer-file strong { color: #ece6f0; }
.pptx-file-heading small, .document-viewer-file small, .pptx-footer > span, .document-viewer-footer > span { color: #bdb2c8; }
.pptx-toolbar-actions .icon-button, .document-viewer-actions .icon-button, .document-download, .pptx-download { border-color: #594d62; background: #3a3043; color: #ded6e5; }
.pptx-stage-wrap, .document-viewer-stage { background: #241a2e; }
.pptx-status, .document-viewer-status { border-color: #51465a; background: #30263a; color: #d4cbdc; }
.xlsx-document { border-color: #51465a; background: #30263a; }
.xlsx-sheet-tabs { border-color: #51465a; background: #392e42; }
.xlsx-sheet-tab { color: #c8bfd1; }
.xlsx-sheet-tab.active { border-color: #51465a; background: #30263a; color: #d1d4ff; }
.xlsx-table-wrap { background-color: #2b2235; background-image: linear-gradient(#40364a 1px, transparent 1px), linear-gradient(90deg, #40364a 1px, transparent 1px); }
.xlsx-preview-table { color: #ded7e5; }
.xlsx-preview-table th, .xlsx-preview-table td { border-color: #51465a; }
.xlsx-preview-table th { background: #3e3448; color: #eee8f1; }
.xlsx-limit-notice { border-color: #66543c; background: #40352d; color: #ead39a; }
.copyright { color: #b7adbf; }
.preview-footer .copyright, .pptx-footer .copyright, .document-viewer-footer .copyright { color: #bdb2c8; }

.preview-dialog { background: #1d2927; }
.preview-toolbar, .preview-footer { border-color: #312b3d; background: #211b2d; }
.preview-toolbar-brand, .preview-footer > span, .preview-toolbar .icon-button, .preview-favorite { color: #c8c3ce; }
.preview-toolbar .icon-button:hover, .preview-favorite:hover { background: #393149; color: #f1edf2; }
.preview-mark { background: #374543; color: #b9d8d0; }
.preview-edit, .preview-footer .primary-button { border-color: #cf8069; background: #cf8069; color: #fff2e9; }
.preview-edit:hover, .preview-footer .primary-button:hover { border-color: #df927b; background: #df927b; color: #fff8f2; }
.preview-trash-action { border-color: #546c63; background: #354641; color: #d1e4db; }
.preview-trash-action:hover { background: #40534c; }
.preview-trash-action.danger { border-color: #76504b; background: #493337; color: #f0c3b7; }
.reader-document { background: #35433f; color: #dedbcc; }
.reader-meta { color: #b6c2b9; }
.reader-category { padding: 5px 8px; border-radius: 5px; background: #a8c9ba; color: #263a34; }
.reader-category .category-dot { background: #598e6c; }
.reader-meta-dot { background: #92a69a; }
.reader-document > h1, .reader-content h1, .reader-content h2, .reader-content h3 { color: #eee8d8; }
.reader-content { color: #dedbcc; }
.reader-content blockquote { border-color: #88b9a6; background: #3d514b; color: #d9e1d8; }
.reader-content pre { border-color: #50615a; background: #293632; color: #e0dfd4; }
.reader-content th, .reader-content td { border-color: #53635c; }
.reader-content th { background: #40534c; color: #e8e5d9; }
.reader-content hr, .reader-attachments { border-color: #50615a; }
.reader-attachments h2 { color: #ece6d8; }
.reader-attachments h2 span, .reader-attachment-copy small { color: #bbc6bc; }
.reader-attachment { border-color: #50615a; background: #2f3d39; }
.reader-attachment:hover { border-color: #829e91; background: #3d4d47; }
.reader-attachment-copy strong { color: #e4e0d4; }
.reader-attachment-icon { background: #3b514a; color: #c4ddd2; }
.reader-table-wrap { scrollbar-color: #788d82 #303c38; }