:root {
  --bg: #f4f6f5;
  --surface: #ffffff;
  --surface-2: #f8faf9;
  --ink: #17201d;
  --muted: #65706c;
  --line: #dce3e0;
  --line-strong: #c6d0cc;
  --accent: #0f6654;
  --accent-dark: #084a3d;
  --accent-soft: #e7f1ed;
  --danger: #b33a3a;
  --sidebar: 236px;
  --topbar: 68px;
  --mobile-nav: 72px;
}

* { box-sizing: border-box; letter-spacing: 0; }
html { min-width: 320px; background: var(--bg); scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: Arial, "Noto Sans KR", "Malgun Gothic", sans-serif; font-size: 14px; line-height: 1.6; }
button, input, select, textarea { color: inherit; font: inherit; }
button { -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible, select:focus-visible, [contenteditable="true"]:focus-visible { outline: 3px solid rgba(15, 102, 84, .2); outline-offset: 2px; }
[hidden] { display: none !important; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

.icon-button { display: inline-grid; width: 36px; height: 36px; place-items: center; padding: 0; border: 1px solid transparent; border-radius: 5px; background: transparent; cursor: pointer; font-size: 18px; }
.icon-button:hover { border-color: var(--line); background: var(--surface-2); }
.primary-button { min-height: 38px; padding: 0 17px; border: 1px solid var(--accent); border-radius: 5px; background: var(--accent); color: #fff; cursor: pointer; font-weight: 700; }
.primary-button:hover { background: var(--accent-dark); }
.primary-button:active, .icon-button:active, button:active { transform: translateY(1px); }

.topbar { position: fixed; z-index: 80; inset: 0 0 auto; display: grid; height: var(--topbar); grid-template-columns: var(--sidebar) minmax(280px, 660px) 1fr; align-items: center; gap: 22px; padding: 0 22px; border-bottom: 1px solid var(--line); background: rgba(255, 255, 255, .98); }
.brand { display: flex; align-items: center; gap: 10px; padding: 0; border: 0; background: transparent; cursor: pointer; text-align: left; }
.brand-mark { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 6px; background: var(--accent); color: #fff; font-size: 20px; font-weight: 800; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 18px; line-height: 1.1; }
.brand small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.global-search-trigger { display: grid; height: 42px; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 0 11px; border: 1px solid var(--line-strong); border-radius: 6px; background: #f7f9f8; color: var(--muted); cursor: pointer; text-align: left; }
.global-search-trigger:hover { border-color: #9fb3ab; background: #fff; }
.global-search-trigger > span:first-child { color: var(--accent); font-size: 22px; }
kbd { padding: 2px 6px; border: 1px solid var(--line-strong); border-radius: 4px; background: #fff; color: var(--muted); font-size: 10px; }
.top-actions { display: flex; min-width: 0; align-items: center; justify-content: flex-end; gap: 4px; }
.mobile-home-screen-button { display: none; }
.admin-button { height: 36px; margin-left: 5px; padding: 0 12px; border: 1px solid var(--line-strong); border-radius: 5px; background: #fff; cursor: pointer; font-size: 12px; font-weight: 700; }
.admin-button:hover { border-color: var(--accent); color: var(--accent); }
.profile-button { display: flex; height: 38px; align-items: center; gap: 7px; margin-left: 6px; padding: 0 8px 0 4px; border: 0; background: transparent; cursor: pointer; }
.profile-button span { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 50%; background: #243530; color: #fff; font-size: 12px; }
.profile-button strong { font-size: 12px; }

.portal-shell { min-height: 100dvh; padding-top: var(--topbar); }
.sidebar { position: fixed; z-index: 60; top: var(--topbar); bottom: 0; left: 0; display: flex; width: var(--sidebar); flex-direction: column; padding: 18px 12px 16px; overflow-y: auto; border-right: 1px solid var(--line); background: #f9fbfa; }
.primary-nav { display: grid; gap: 3px; }
.primary-nav button { display: grid; min-height: 40px; grid-template-columns: 1fr; align-items: center; padding: 0 12px; border: 0; border-radius: 5px; background: transparent; color: #394641; cursor: pointer; text-align: left; }
.primary-nav button:hover { background: #edf3f0; color: var(--accent); }
.primary-nav button.active { background: var(--accent-soft); color: var(--accent); font-weight: 700; }
.nav-section-divider { height: 1px; margin: 8px 10px 5px; background: var(--line); }
.nav-section-divider-end { margin: 6px 10px 8px; }
.nav-section-title { padding: 2px 10px 4px; color: #4f5e58; font-size: 10px; font-weight: 800; line-height: 1.4; }
.nav-branch-list { position: relative; display: grid; gap: 1px; margin-left: 19px; padding-left: 12px; }
.nav-branch-list::before { position: absolute; top: 0; bottom: 20px; left: 0; width: 1px; background: #cbd6d2; content: ""; }
.primary-nav .nav-branch-list button { position: relative; min-height: 39px; padding-left: 12px; }
.primary-nav .nav-branch-list button::before { position: absolute; top: 50%; left: -12px; width: 12px; border-top: 1px solid #cbd6d2; content: ""; }
.primary-nav .nav-branch-list button:last-child::after { position: absolute; top: calc(50% + 1px); bottom: 0; left: -12px; width: 1px; background: #f9fbfa; content: ""; }
.sidebar-footer { display: grid; gap: 6px; margin-top: auto; padding: 15px 11px 4px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.sidebar-footer strong { margin-bottom: 3px; color: var(--ink); font-size: 11px; }
.sidebar-footer > span { display: flex; align-items: center; gap: 7px; }
.sidebar-footer > span i { width: 7px; height: 7px; border-radius: 50%; background: #2f8a6f; }
.sidebar-footer i.warning { background: #ce8831; }
.main-content { min-height: calc(100dvh - var(--topbar)); margin-left: var(--sidebar); padding: 34px clamp(24px, 4vw, 58px) 70px; }
.main-content:focus-visible { outline: 0; }
.page-container { width: min(1180px, 100%); margin: 0 auto; }

.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.page-heading p { margin: 0 0 5px; color: var(--accent); font-size: 11px; font-weight: 800; }
.page-heading h1 { margin: 0; font-size: clamp(28px, 3vw, 40px); line-height: 1.25; word-break: keep-all; }
.page-heading > span { max-width: 430px; color: var(--muted); font-size: 13px; text-align: right; }
.welcome-row { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; margin-bottom: 30px; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); }
.welcome-copy { padding: 22px 0; }
.welcome-copy strong { display: block; font-size: 17px; }
.welcome-copy p { margin: 5px 0 0; color: var(--muted); }
.notice-strip { display: grid; align-content: center; gap: 6px; padding: 17px 0 17px 22px; border-left: 1px solid var(--line); }
.notice-strip span { color: #a43a3a; font-size: 10px; font-weight: 800; }
.notice-strip button { padding: 0; overflow: hidden; border: 0; background: transparent; cursor: pointer; font-weight: 700; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin: 0 0 13px; }
.section-heading h2 { margin: 0; font-size: 18px; }
.section-heading span { color: var(--muted); font-size: 11px; }
.home-knowledge-heading { align-items: center; }
.home-card-view-toggle { display: inline-grid; width: 188px; height: 36px; flex: 0 0 auto; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; border: 1px solid #aebdb7; border-radius: 5px; background: #fff; }
.home-card-view-toggle button { min-width: 0; padding: 0 10px; border: 0; border-right: 1px solid #aebdb7; background: #fff; color: var(--accent); cursor: pointer; font-size: 11px; font-weight: 700; white-space: nowrap; }
.home-card-view-toggle button:last-child { border-right: 0; }
.home-card-view-toggle button:hover { background: var(--accent-soft); }
.home-card-view-toggle button.active { background: var(--accent); color: #fff; }

.knowledge-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 14px; }
.knowledge-block { --note: #fff5c9; --note-line: #e5cc68; position: relative; display: flex; min-height: 205px; flex-direction: column; padding: 18px 18px 15px; border: 1px solid color-mix(in srgb, var(--note-line) 62%, #ccd4d1); border-top: 5px solid var(--note-line); border-radius: 5px; background: var(--note); box-shadow: 0 5px 16px rgba(25, 39, 34, .055); }
.knowledge-block.blue { --note: #eaf3fb; --note-line: #6da0c8; }
.knowledge-block.green { --note: #eaf5ee; --note-line: #68a57a; }
.knowledge-block.orange { --note: #fff0df; --note-line: #d38a42; }
.knowledge-block.purple { --note: #f1ecf8; --note-line: #8e73ad; }
.knowledge-block.rose { --note: #faecee; --note-line: #bd6975; }
.knowledge-block.gray { --note: #f1f3f3; --note-line: #788884; }
.knowledge-block.cyan { --note: #e8f5f5; --note-line: #56999a; }
.knowledge-block.sand { --note: #f7f0e4; --note-line: #aa8b58; }
.knowledge-block header { margin-bottom: 11px; }
.knowledge-block-heading { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 10px; padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; text-align: left; }
.knowledge-block-heading:hover h3 { color: var(--accent); }
.knowledge-block h3 { margin: 0; font-size: 16px; line-height: 1.35; }
.knowledge-block header span { color: color-mix(in srgb, var(--note-line) 80%, #26342f); font-size: 10px; font-weight: 800; }
.knowledge-block ul { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.knowledge-block li button { display: grid; width: 100%; min-height: 36px; grid-template-columns: minmax(0, 1fr) 14px; align-items: center; gap: 6px; padding: 6px 0; border: 0; border-bottom: 1px solid rgba(50, 67, 61, .12); background: transparent; cursor: pointer; text-align: left; }
.knowledge-block li:last-child button { border-bottom: 0; }
.knowledge-block li button:hover { color: var(--accent); }
.knowledge-block li button span { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.knowledge-block li button i { width: 14px; color: #69746f; font-style: normal; text-align: right; }
.knowledge-block footer { display: flex; align-items: center; justify-content: flex-start; margin-top: auto; padding-top: 12px; color: #596560; font-size: 10px; }

.quick-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 26px; }
.quick-action { display: flex; min-height: 58px; align-items: center; gap: 11px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 5px; background: #fff; cursor: pointer; text-align: left; }
.quick-action:hover { border-color: #a9bbb4; }
.quick-action span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 5px; background: var(--accent-soft); color: var(--accent); font-weight: 800; }
.quick-action strong, .quick-action small { display: block; }
.quick-action strong { font-size: 12px; }
.quick-action small { color: var(--muted); font-size: 10px; }

.content-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 28px; }
.document-list { border-top: 1px solid var(--line-strong); }
.document-row { position: relative; display: grid; min-height: 84px; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 14px 8px; border-bottom: 1px solid var(--line); background: transparent; cursor: pointer; }
.document-row:hover { background: #f7faf8; }
.document-type-icon { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 5px; background: var(--accent-soft); color: var(--accent); font-size: 11px; font-weight: 800; }
.document-row strong, .document-row small { display: block; }
.document-row strong { font-size: 14px; }
.document-row small { margin-top: 4px; color: var(--muted); font-size: 11px; }
.document-row > span:last-child { color: var(--muted); font-size: 11px; }
.filter-panel { padding: 17px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.filter-panel h3 { margin: 0 0 12px; font-size: 14px; }
.filter-panel label { display: grid; gap: 4px; margin-top: 11px; color: var(--muted); font-size: 10px; font-weight: 700; }
.filter-panel select, .filter-panel input { width: 100%; height: 37px; padding: 0 9px; border: 1px solid var(--line); border-radius: 4px; background: #fff; outline: 0; }
.empty-state { padding: 54px 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: center; }
.empty-state strong, .empty-state span { display: block; }
.empty-state span { margin-top: 5px; color: var(--muted); }
.empty-state button { margin-top: 17px; }

.breadcrumb { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 18px; color: var(--muted); font-size: 11px; }
.breadcrumb button { padding: 0; border: 0; background: transparent; color: var(--accent); cursor: pointer; }
.document-shell { width: min(920px, 100%); margin: 0 auto; }
.document-header { padding-bottom: 25px; border-bottom: 1px solid var(--line); }
.document-header h1 { margin: 0; font-size: clamp(30px, 4vw, 45px); line-height: 1.3; word-break: keep-all; }
.document-meta-row { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 14px; color: var(--muted); font-size: 11px; }
.document-meta-row span { display: inline-flex; align-items: center; gap: 5px; }
.favorite-document-button { margin-left: auto; padding: 0; border: 0; background: transparent; cursor: pointer; color: var(--accent); font-weight: 700; }
.article-content { padding: 31px 0 45px; color: #27302d; font-size: 15px; line-height: 1.8; overflow-wrap: anywhere; }
.article-content h1, .article-content h2, .article-content h3, .article-content h4 { margin: 34px 0 13px; line-height: 1.4; }
.article-content h2 { font-size: 25px; }
.article-content h3 { font-size: 19px; }
.article-content p { margin: 11px 0; }
.article-content ul, .article-content ol { padding-left: 24px; }
.article-content li { margin: 7px 0; }
.article-content blockquote { margin: 19px 0; padding: 13px 16px; border-left: 4px solid var(--accent); background: var(--accent-soft); }
.article-content code { padding: 2px 5px; border-radius: 3px; background: #edf1ef; color: #9c3434; }
.article-content pre { padding: 16px; overflow-x: auto; border-radius: 5px; background: #1d2824; color: #eff5f2; }
.article-content pre code { padding: 0; background: transparent; color: inherit; }
.article-content mark { background: #ffef9d; }
.article-content table { width: 100%; margin: 20px 0; border-collapse: collapse; }
.article-content th, .article-content td { padding: 9px 10px; border: 1px solid var(--line-strong); text-align: left; }
.article-content th { background: #f1f5f3; }
.article-content .task-list { padding: 0; list-style: none; }
.article-content .task-list li { display: flex; gap: 8px; }
.related-documents { padding: 24px 0; border-top: 1px solid var(--line); }
.related-documents h2 { margin: 0 0 12px; font-size: 17px; }
.related-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.related-grid button { min-height: 56px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 5px; background: #fff; cursor: pointer; text-align: left; }
.related-grid button:hover { border-color: var(--accent); }
.inline-edit-button { position: fixed; z-index: 45; right: 28px; bottom: 28px; display: flex; min-height: 44px; align-items: center; gap: 7px; padding: 0 16px; border: 1px solid var(--accent); border-radius: 6px; background: var(--accent); color: #fff; cursor: pointer; box-shadow: 0 8px 24px rgba(15, 70, 57, .2); font-weight: 700; }

.overlay { position: fixed; z-index: 200; inset: 0; display: grid; place-items: start center; padding: 90px 18px 18px; background: rgba(20, 28, 25, .48); }
.search-dialog { width: min(820px, 100%); max-height: calc(100dvh - 120px); overflow: hidden; border-radius: 6px; background: #fff; box-shadow: 0 24px 70px rgba(18, 31, 26, .24); }
.search-dialog > header { display: flex; align-items: center; gap: 9px; padding: 13px 13px 10px; border-bottom: 1px solid var(--line); }
.search-input-wrap { display: grid; min-width: 0; flex: 1; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; }
.search-input-wrap > span { color: var(--accent); font-size: 24px; }
.search-input-wrap input { width: 100%; height: 43px; padding: 0; border: 0; outline: 0; font-size: 16px; }
.search-filter-row { display: flex; gap: 6px; padding: 10px 14px; overflow-x: auto; border-bottom: 1px solid var(--line); }
.search-filter-row button { flex: 0 0 auto; height: 30px; padding: 0 10px; border: 1px solid var(--line); border-radius: 5px; background: #fff; cursor: pointer; font-size: 11px; }
.search-filter-row button.active { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); font-weight: 700; }
.search-results { max-height: calc(100dvh - 250px); overflow-y: auto; padding: 8px 14px 18px; }
.search-group h3 { margin: 15px 0 6px; color: var(--muted); font-size: 10px; }
.search-result-button { display: grid; width: 100%; min-height: 58px; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 7px; border: 0; border-bottom: 1px solid var(--line); background: transparent; cursor: pointer; text-align: left; }
.search-result-button:hover { background: #f6f9f8; }
.search-result-button > span:first-child { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 5px; background: var(--accent-soft); color: var(--accent); font-size: 10px; font-weight: 800; }
.search-result-button strong, .search-result-button small { display: block; }
.search-result-button small { color: var(--muted); }
.search-result-button > i { color: var(--muted); font-style: normal; }

.sheet-backdrop { position: fixed; z-index: 210; inset: 0; display: grid; place-items: end center; background: rgba(20, 28, 25, .48); }
.create-sheet { width: min(620px, 100%); padding: 18px; border-radius: 6px 6px 0 0; background: #fff; }
.create-sheet header { display: flex; align-items: center; justify-content: space-between; }
.create-sheet h2 { margin: 0; font-size: 18px; }
.create-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 15px; }
.create-grid button { display: grid; min-height: 76px; grid-template-columns: 36px 1fr; grid-template-rows: auto auto; align-content: center; column-gap: 10px; padding: 10px; border: 1px solid var(--line); border-radius: 5px; background: #fff; cursor: pointer; text-align: left; }
.create-grid button:hover { border-color: var(--accent); background: #f8fbfa; }
.create-grid button > span { grid-row: 1 / span 2; display: grid; width: 32px; height: 32px; place-items: center; border-radius: 5px; background: var(--accent-soft); color: var(--accent); font-weight: 800; }
.create-grid strong { font-size: 12px; }
.create-grid small { color: var(--muted); font-size: 10px; }

.admin-summary-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 26px; }
.admin-metric { padding: 16px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.admin-metric span, .admin-metric strong { display: block; }
.admin-metric span { color: var(--muted); font-size: 10px; }
.admin-metric strong { margin-top: 7px; font-size: 25px; }
.admin-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); gap: 18px; }
.admin-section { padding: 18px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.admin-section header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 11px; }
.admin-section h2 { margin: 0; font-size: 15px; }
.home-block-content-section { margin-bottom: 18px; overflow: visible; }
.home-block-content-section > header { align-items: flex-end; }
.home-block-content-section > header p { margin: 4px 0 0; color: var(--muted); font-size: 10px; }
.home-block-content-section .primary-button span, .secondary-button span { font-size: 16px; line-height: 1; }
.home-block-editor-list { display: grid; gap: 7px; }
.home-block-editor-item { overflow: hidden; border: 1px solid var(--line); border-radius: 5px; background: #fbfcfc; }
.home-block-editor-item.expanded { border-color: #a9bdb5; background: #fff; box-shadow: 0 7px 20px rgba(20, 53, 44, .07); }
.home-block-editor-heading { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: stretch; }
.home-block-editor-summary { display: grid; width: 100%; min-height: 58px; grid-template-columns: minmax(0, 1fr) 28px; align-items: center; gap: 12px; padding: 10px 13px 10px 0; border: 0; background: transparent; cursor: pointer; text-align: left; }
.home-block-editor-summary:hover { background: #f6f9f8; }
.home-block-editor-summary > span:first-child { min-width: 0; }
.home-block-editor-summary strong, .home-block-editor-summary small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-block-editor-summary strong { font-size: 13px; }
.home-block-editor-summary small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.home-block-drag-handle { display: grid; width: 42px; min-height: 58px; place-items: center; padding: 0; border: 0; background: transparent; cursor: grab; touch-action: auto; user-select: none; -webkit-user-select: none; }
.home-block-drag-handle:not(.readonly):hover { background: #f1f6f4; }
.home-block-drag-handle:focus-visible { outline: 2px solid var(--accent); outline-offset: -3px; }
.home-block-drag-handle:active { cursor: grabbing; }
.home-block-tone { width: 8px; height: 32px; border-radius: 3px; background: #e5cc68; }
.home-block-tone.blue { background: #6da0c8; }
.home-block-tone.green { background: #68a57a; }
.home-block-tone.orange { background: #d38a42; }
.home-block-tone.purple { background: #8e73ad; }
.home-block-tone.rose { background: #bd6975; }
.home-block-tone.gray { background: #788884; }
.home-block-tone.cyan { background: #56999a; }
.home-block-tone.sand { background: #aa8b58; }
.home-block-editor-item.dragging { position: fixed; z-index: 1000; top: var(--drag-y, var(--drag-top)); left: var(--drag-left); width: var(--drag-width); box-sizing: border-box; overflow: visible; border-color: var(--accent); background: #f3faf7; box-shadow: 0 16px 32px rgba(24, 61, 51, .18); cursor: grabbing; pointer-events: none; transform: scale(1.02); transform-origin: center; }
.home-block-editor-item.dragging .home-block-drag-handle { cursor: grabbing; touch-action: none; }
.home-block-editor-list.is-sorting { position: relative; }
.home-block-chevron { color: var(--muted); font-size: 18px; text-align: center; transition: transform .18s ease; }
.home-block-editor-item.expanded .home-block-chevron { transform: rotate(180deg); }
.home-block-editor-body { padding: 15px; border-top: 1px solid var(--line); }
.home-block-form-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(120px, .55fr) minmax(120px, .55fr); gap: 11px; }
.home-block-form-grid label { display: grid; gap: 5px; color: var(--muted); font-size: 10px; font-weight: 700; }
.home-block-form-grid label.wide { grid-column: 1 / -1; }
.home-block-form-grid input, .home-block-form-grid select, .home-block-form-grid textarea { width: 100%; min-width: 0; box-sizing: border-box; border: 1px solid var(--line); border-radius: 4px; background: #fff; color: var(--text); font: inherit; font-size: 12px; }
.home-block-form-grid input, .home-block-form-grid select { height: 38px; padding: 0 10px; }
.home-block-form-grid textarea { min-height: 64px; padding: 9px 10px; resize: vertical; }
.home-block-form-grid input:focus, .home-block-form-grid select:focus, .home-block-form-grid textarea:focus { border-color: var(--accent); outline: 2px solid rgba(15, 102, 84, .13); outline-offset: 1px; }
.home-block-editor-actions { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.danger-text-button, .secondary-button { min-height: 38px; padding: 0 13px; border: 1px solid var(--line); border-radius: 5px; background: #fff; cursor: pointer; font-weight: 700; }
.secondary-button { display: inline-flex; align-items: center; gap: 4px; color: var(--accent); }
.secondary-button:hover { border-color: var(--accent); background: var(--accent-soft); }
.danger-text-button { color: var(--danger); }
.danger-text-button:hover { border-color: #dcb4b4; background: #fff7f7; }
.danger-text-button:disabled { color: #aeb5b2; background: #f4f6f5; cursor: not-allowed; }
.home-block-document-section { margin-top: 18px; padding-top: 15px; border-top: 1px solid var(--line); }
.home-block-document-section > header { margin-bottom: 8px; }
.home-block-document-section h3 { margin: 0; font-size: 12px; }
.home-block-document-section header span { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }
.home-block-document-list { display: grid; border-top: 1px solid var(--line); }
.home-block-document-row { display: grid; min-height: 52px; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 9px; border-bottom: 1px solid var(--line); }
.document-position { color: var(--muted); font-size: 9px; font-variant-numeric: tabular-nums; }
.home-block-document-row strong, .home-block-document-row small { display: block; }
.home-block-document-row strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.home-block-document-row small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.home-block-document-actions { display: flex; gap: 4px; }
.home-block-document-actions button, .home-block-document-empty button { min-height: 30px; padding: 0 9px; border: 1px solid var(--line); border-radius: 4px; background: #fff; cursor: pointer; font-size: 10px; }
.home-block-document-actions button:hover, .home-block-document-empty button:hover { border-color: var(--accent); color: var(--accent); }
.home-block-document-actions button.delete { color: var(--danger); }
.home-block-document-actions button.delete:hover { border-color: #dcb4b4; background: #fff7f7; }
.home-block-document-empty { display: flex; min-height: 60px; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 10px; }
.admin-table { width: 100%; border-collapse: collapse; }
.admin-table th, .admin-table td { padding: 10px 7px; border-bottom: 1px solid var(--line); text-align: left; }
.admin-table th { color: var(--muted); font-size: 10px; }
.admin-table td { font-size: 11px; }
.admin-table button { padding: 4px 7px; border: 1px solid var(--line); border-radius: 4px; background: #fff; cursor: pointer; }
.order-save-status { color: var(--muted); font-size: 10px; }
.order-save-status[data-tone="saving"] { color: #8a671d; }
.order-save-status[data-tone="success"] { color: var(--accent); }
.order-save-status[data-tone="error"] { color: var(--danger); }
.block-order-placeholder { position: relative; box-sizing: border-box; border: 2px dashed rgba(21, 102, 82, .6); border-radius: 4px; background: rgba(229, 243, 237, .72); }
.block-order-placeholder::after { position: absolute; right: 8px; bottom: -2px; left: 8px; height: 2px; background: var(--accent); content: ""; }
.block-drag-active, .block-drag-active * { cursor: grabbing !important; user-select: none !important; -webkit-user-select: none !important; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.request-list { display: grid; gap: 7px; }
.request-item { padding: 10px; border-left: 3px solid #cc8c3d; background: #faf8f3; }
.request-item strong, .request-item span { display: block; }
.request-item strong { font-size: 12px; }
.request-item span { margin-top: 3px; color: var(--muted); font-size: 10px; }

.editor-overlay { position: fixed; z-index: 300; inset: 0; display: flex; flex-direction: column; background: #fff; }
.editor-appbar { display: grid; min-height: 58px; flex: 0 0 auto; grid-template-columns: 42px 1fr auto; align-items: center; gap: 9px; padding: 0 14px; border-bottom: 1px solid var(--line); background: #fff; }
.editor-appbar > div:nth-child(2) { min-width: 0; }
.editor-appbar strong, .editor-appbar span { display: block; }
.editor-appbar strong { font-size: 13px; }
.editor-appbar span { color: var(--muted); font-size: 9px; }
.editor-app-actions { display: flex; align-items: center; gap: 6px; }
.editor-quiet-button { height: 36px; padding: 0 10px; border: 1px solid transparent; border-radius: 5px; background: transparent; cursor: pointer; font-size: 11px; }
.editor-quiet-button:hover, .editor-quiet-button.active { border-color: var(--line); background: var(--surface-2); color: var(--accent); }
.editor-layout { display: grid; min-height: 0; flex: 1; grid-template-columns: 220px minmax(0, 1fr) 250px; }
.editor-library-panel, .editor-info-panel { min-height: 0; overflow-y: auto; background: #f8faf9; }
.editor-library-panel { padding: 13px 11px; border-right: 1px solid var(--line); }
.editor-info-panel { padding: 13px; border-left: 1px solid var(--line); }
.editor-panel-heading { display: flex; min-height: 36px; align-items: center; justify-content: space-between; }
.editor-panel-heading strong { font-size: 12px; }
.editor-library-panel nav { display: grid; gap: 2px; }
.editor-library-panel nav button, .editor-recent-list button { width: 100%; min-height: 35px; padding: 6px 8px; overflow: hidden; border: 0; border-radius: 4px; background: transparent; cursor: pointer; font-size: 11px; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.editor-library-panel nav button:hover, .editor-library-panel nav button.active, .editor-recent-list button:hover { background: var(--accent-soft); color: var(--accent); }
.panel-label { margin: 18px 0 6px; color: var(--muted); font-size: 9px; font-weight: 800; }
.editor-center { position: relative; display: flex; min-width: 0; min-height: 0; flex-direction: column; overflow: hidden; background: #fff; }
.editor-format-toolbar { display: flex; min-height: 50px; flex: 0 0 auto; align-items: center; gap: 5px; padding: 6px 10px; overflow-x: auto; border-bottom: 1px solid var(--line); background: #fbfcfc; scrollbar-width: thin; }
.toolbar-group { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 2px; padding-right: 6px; border-right: 1px solid var(--line); }
.toolbar-group:last-child { border-right: 0; }
.editor-format-toolbar button, .selection-toolbar button { display: inline-grid; min-width: 32px; height: 32px; place-items: center; padding: 0 6px; border: 1px solid transparent; border-radius: 4px; background: transparent; cursor: pointer; }
.editor-format-toolbar button:hover, .editor-format-toolbar button.active, .selection-toolbar button:hover { border-color: var(--line); background: #fff; color: var(--accent); }
.editor-format-toolbar select { width: 78px; height: 32px; border: 1px solid transparent; background: transparent; font-size: 11px; }
.highlight-letter { padding: 0 2px; border-bottom: 4px solid #f1d35d; font-weight: 800; line-height: 1; }
.editor-page-scroll { min-height: 0; flex: 1; overflow: auto; }
.editor-page { position: relative; width: min(820px, calc(100% - 52px)); min-height: 100%; margin: 0 auto; padding: 42px 0 140px; }
.editor-title-input { width: 100%; padding: 0; border: 0; background: transparent; color: #1d2422; font-size: 34px; font-weight: 760; line-height: 1.35; outline: 0; }
.editor-title-input:focus-visible { outline: 0; }
.editor-title-input::placeholder { color: #b8bfbc; }
.editor-tags-line { min-height: 24px; margin-top: 7px; color: var(--muted); font-size: 10px; }
.editor-tags-line span { display: inline-block; margin-right: 5px; padding: 2px 6px; border-radius: 4px; background: var(--accent-soft); color: var(--accent); }
.editor-block-add { position: absolute; top: 126px; left: -34px; width: 26px; height: 26px; border: 1px solid transparent; border-radius: 4px; background: transparent; color: #98a19e; cursor: pointer; opacity: 0; }
.editor-page:hover .editor-block-add, .editor-block-add:focus-visible { opacity: 1; }
.rich-editor-mount { min-height: 520px; }
.rich-editor-prosemirror { min-height: 520px; padding: 13px 0; color: #252d2a; font-size: 15px; line-height: 1.8; outline: 0; overflow-wrap: anywhere; }
.rich-editor-prosemirror:focus-visible { outline: 0; }
.rich-editor-prosemirror > *:first-child { margin-top: 0; }
.rich-editor-prosemirror p { margin: 9px 0; }
.rich-editor-prosemirror h1, .rich-editor-prosemirror h2, .rich-editor-prosemirror h3, .rich-editor-prosemirror h4 { margin: 28px 0 11px; line-height: 1.4; }
.rich-editor-prosemirror h1 { font-size: 30px; }
.rich-editor-prosemirror h2 { font-size: 24px; }
.rich-editor-prosemirror h3 { font-size: 19px; }
.rich-editor-prosemirror h4 { font-size: 16px; }
.rich-editor-prosemirror ul, .rich-editor-prosemirror ol { padding-left: 24px; }
.rich-editor-prosemirror li { margin: 5px 0; }
.rich-editor-prosemirror blockquote { margin: 17px 0; padding: 11px 14px; border-left: 4px solid var(--accent); background: var(--accent-soft); }
.rich-editor-prosemirror code { padding: 2px 5px; border-radius: 3px; background: #edf1ef; color: #9c3434; }
.rich-editor-prosemirror pre { padding: 15px; overflow-x: auto; border-radius: 5px; background: #1d2824; color: #fff; }
.rich-editor-prosemirror pre code { padding: 0; background: transparent; color: inherit; }
.rich-editor-prosemirror mark { background: #ffef9d; }
.rich-editor-prosemirror img { display: block; max-width: 100%; height: auto; margin: 18px auto; }
.rich-editor-prosemirror .tableWrapper { margin: 18px 0; overflow-x: auto; }
.rich-editor-prosemirror table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.rich-editor-prosemirror th, .rich-editor-prosemirror td { min-width: 90px; padding: 8px; border: 1px solid var(--line-strong); vertical-align: top; }
.rich-editor-prosemirror th { background: #eff4f2; }
.rich-editor-prosemirror ul[data-type="taskList"] { padding: 0; list-style: none; }
.rich-editor-prosemirror ul[data-type="taskList"] li { display: flex; align-items: flex-start; gap: 8px; }
.rich-editor-prosemirror ul[data-type="taskList"] input { width: 17px; height: 17px; accent-color: var(--accent); }
.selection-toolbar { position: fixed; z-index: 340; display: flex; gap: 2px; padding: 4px; border: 1px solid var(--line-strong); border-radius: 5px; background: #fff; box-shadow: 0 9px 28px rgba(22, 36, 31, .17); }
.slash-command-menu { position: absolute; z-index: 345; bottom: 18px; left: 50%; display: grid; width: min(360px, calc(100% - 24px)); max-height: 320px; padding: 6px; overflow-y: auto; border: 1px solid var(--line-strong); border-radius: 5px; background: #fff; box-shadow: 0 13px 38px rgba(22, 36, 31, .19); transform: translateX(-50%); }
.slash-command-menu button { display: grid; min-height: 44px; grid-template-columns: 80px 1fr; align-items: center; gap: 8px; padding: 6px 9px; border: 0; border-radius: 4px; background: transparent; cursor: pointer; text-align: left; }
.slash-command-menu button:hover { background: var(--accent-soft); }
.slash-command-menu button strong { color: var(--accent); font-size: 11px; }
.slash-command-menu button span { color: var(--muted); font-size: 10px; }
.editor-info-panel label { display: grid; gap: 5px; margin-top: 13px; color: var(--muted); font-size: 9px; font-weight: 700; }
.editor-info-panel input, .editor-info-panel select { width: 100%; height: 36px; padding: 0 8px; border: 1px solid var(--line); border-radius: 4px; background: #fff; outline: 0; }
.document-info-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 16px; }
.document-info-stats div { padding: 8px; border: 1px solid var(--line); border-radius: 4px; background: #fff; }
.document-info-stats span, .document-info-stats strong { display: block; }
.document-info-stats span { color: var(--muted); font-size: 8px; }
.document-info-stats strong { margin-top: 3px; font-size: 12px; }
.editor-toc, .linked-document-list { display: grid; gap: 2px; }
.editor-toc button, .linked-document-list button { padding: 6px 4px; overflow: hidden; border: 0; background: transparent; color: #53605b; cursor: pointer; font-size: 10px; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.editor-toc button:hover, .linked-document-list button:hover { color: var(--accent); }
.editor-overlay.focus-mode .editor-library-panel, .editor-overlay.focus-mode .editor-info-panel { display: none; }
.editor-overlay.focus-mode .editor-layout { grid-template-columns: 1fr; }

.mobile-bottom-nav { display: none; }
.desktop-hidden { display: none; }
.toast { position: fixed; z-index: 500; right: 18px; bottom: 18px; max-width: min(360px, calc(100% - 36px)); padding: 10px 14px; border-radius: 5px; background: #22302b; color: #fff; font-size: 11px; opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .18s ease, transform .18s ease; }
.toast.show { opacity: 1; transform: translateY(0); }

@media (max-width: 1080px) {
  :root { --sidebar: 210px; }
  .topbar { grid-template-columns: var(--sidebar) minmax(240px, 1fr) auto; }
  .profile-button strong { display: none; }
  .knowledge-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-row { grid-template-columns: repeat(2, 1fr); }
  .admin-summary-grid { grid-template-columns: repeat(3, 1fr); }
  .editor-layout { grid-template-columns: 190px minmax(0, 1fr) 220px; }
}

@media (max-width: 760px) {
  :root { --topbar: 58px; }
  body { padding-bottom: calc(var(--mobile-nav) + env(safe-area-inset-bottom)); }
  .desktop-hidden { display: inline-grid; }
  .topbar { grid-template-columns: 1fr auto 1fr; gap: 8px; height: var(--topbar); padding: 0 11px; }
  #menuButton { justify-self: start; }
  .brand { justify-self: center; }
  .brand-mark { width: 32px; height: 32px; font-size: 17px; }
  .brand > span:last-child { display: none; }
  .global-search-trigger { display: none; }
  .top-actions { justify-self: end; }
  .top-actions .icon-button, .top-actions .admin-button, .profile-button strong { display: none; }
  .mobile-home-screen-button { display: inline-flex; height: 32px; align-items: center; gap: 4px; padding: 0 7px; border: 1px solid #8dafa4; border-radius: 5px; background: var(--accent-soft); color: var(--accent); cursor: pointer; font-size: 10px; font-weight: 800; white-space: nowrap; }
  .mobile-home-screen-button span { display: grid; width: 16px; height: 16px; place-items: center; border: 1px solid currentColor; border-radius: 3px; font-size: 12px; line-height: 1; }
  .mobile-home-screen-button:hover { border-color: var(--accent); background: #dcece6; }
  .profile-button { margin: 0; padding: 0; }
  .profile-button span { width: 31px; height: 31px; }
  .sidebar { top: var(--topbar); z-index: 100; width: min(286px, 86vw); padding-bottom: 90px; box-shadow: 12px 0 35px rgba(20, 33, 28, .16); transform: translateX(-104%); transition: transform .2s ease; }
  .sidebar.open { transform: translateX(0); }
  .main-content { min-height: calc(100dvh - var(--topbar)); margin-left: 0; padding: 24px 16px 30px; }
  .page-heading { align-items: flex-start; flex-direction: column; gap: 7px; margin-bottom: 20px; }
  .page-heading h1 { font-size: 28px; }
  .page-heading > span { text-align: left; }
  .welcome-row { grid-template-columns: 1fr; margin-bottom: 24px; }
  .welcome-copy { padding: 16px 0; }
  .notice-strip { padding: 14px 0; border-top: 1px solid var(--line); border-left: 0; }
  .home-knowledge-heading { align-items: center; gap: 10px; }
  .home-card-view-toggle { width: 158px; height: 34px; margin-left: auto; }
  .home-card-view-toggle button { padding: 0 8px; font-size: 10px; }
  .knowledge-grid { grid-template-columns: 1fr; gap: 11px; }
  .knowledge-block { min-height: 190px; }
  .quick-row { grid-template-columns: 1fr 1fr; margin-top: 18px; }
  .quick-action { min-height: 56px; padding: 9px; }
  .quick-action small { display: none; }
  .content-layout { grid-template-columns: 1fr; }
  .filter-panel { display: none; }
  .document-row { grid-template-columns: 38px minmax(0, 1fr); }
  .document-row > span:last-child { display: none; }
  .document-shell { padding-bottom: 20px; }
  .document-header h1 { font-size: 30px; }
  .favorite-document-button { width: 100%; margin-left: 0; text-align: left; }
  .article-content { font-size: 14px; }
  .related-grid { grid-template-columns: 1fr; }
  .inline-edit-button { right: 15px; bottom: calc(var(--mobile-nav) + env(safe-area-inset-bottom) + 14px); }
  .overlay { align-items: stretch; padding: 0; }
  .search-dialog { width: 100%; height: 100dvh; max-height: none; border-radius: 0; }
  .search-dialog > header { padding-top: calc(10px + env(safe-area-inset-top)); }
  .search-results { max-height: calc(100dvh - 145px); }
  .create-sheet { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
  .admin-summary-grid { grid-template-columns: 1fr 1fr; }
  .admin-grid { grid-template-columns: 1fr; }
  .admin-section { overflow-x: auto; }
  .admin-section.home-block-content-section { overflow: visible; }
  .home-block-content-section > header { align-items: flex-start; gap: 12px; }
  .home-block-content-section > header .primary-button { flex: 0 0 auto; padding: 0 11px; }
  .home-block-form-grid { grid-template-columns: 1fr; }
  .home-block-form-grid label.wide { grid-column: auto; }
  .home-block-document-section > header { align-items: flex-start; gap: 10px; }
  .home-block-document-row { grid-template-columns: 24px minmax(0, 1fr); padding: 8px 0; }
  .home-block-document-actions { grid-column: 2; }
  .home-block-document-empty { align-items: flex-start; flex-direction: column; padding: 12px 0; }
  .mobile-bottom-nav { position: fixed; z-index: 120; right: 0; bottom: 0; left: 0; display: grid; height: calc(var(--mobile-nav) + env(safe-area-inset-bottom)); grid-template-columns: repeat(5, 1fr); padding: 5px 5px env(safe-area-inset-bottom); border-top: 1px solid var(--line); background: rgba(255, 255, 255, .98); }
  .mobile-bottom-nav button { position: relative; display: grid; place-items: center; align-content: center; gap: 1px; border: 0; background: transparent; color: #6d7773; cursor: pointer; }
  .mobile-bottom-nav button > span { font-size: 20px; line-height: 1; }
  .mobile-bottom-nav button small { font-size: 9px; }
  .mobile-bottom-nav button.active { color: var(--accent); font-weight: 700; }
  .mobile-bottom-nav .mobile-create-button span { display: grid; width: 45px; height: 45px; place-items: center; margin-top: -25px; border: 5px solid #fff; border-radius: 50%; background: var(--accent); color: #fff; font-size: 25px; box-shadow: 0 5px 15px rgba(15, 86, 70, .22); }
  .mobile-bottom-nav .mobile-create-button small { margin-top: 1px; }
  .editor-overlay { top: var(--editor-visual-top, 0); bottom: auto; height: var(--editor-visual-height, 100dvh); max-height: var(--editor-visual-height, 100dvh); overflow: hidden; }
  .editor-appbar { min-height: 54px; padding: 0 8px; }
  .editor-appbar strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .editor-app-actions .editor-quiet-button { display: none; }
  .editor-layout { grid-template-columns: 1fr; }
  .editor-library-panel, .editor-info-panel { display: none; }
  .editor-center { height: 100%; padding-bottom: env(safe-area-inset-bottom); }
  .editor-overlay.keyboard-visible .editor-center { padding-bottom: 0; }
  .editor-format-toolbar { position: relative; z-index: 3; order: 2; min-height: 55px; border-top: 1px solid var(--line); border-bottom: 0; background: #fff; box-shadow: 0 -4px 12px rgba(22, 36, 31, .06); }
  .editor-page-scroll { order: 1; overscroll-behavior: contain; scroll-padding-top: 68px; scroll-padding-bottom: 76px; }
  .editor-page { width: calc(100% - 32px); padding: 27px 0 110px; }
  .editor-title-input { font-size: 27px; }
  .editor-block-add { display: none; }
  .rich-editor-prosemirror { min-height: 440px; font-size: 14px; }
  .selection-toolbar { display: none !important; }
  .slash-command-menu { position: fixed; right: 10px; bottom: calc(61px + env(safe-area-inset-bottom)); left: 10px; width: auto; transform: none; }
  .toast { right: 12px; bottom: calc(var(--mobile-nav) + env(safe-area-inset-bottom) + 12px); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}