/* Layout values matched to the checked-out Docmost AppShell and sidebar modules. */
:root{--line:#e9ecef;--muted:#868e96;--accent:#228be6}
body{font-size:14px;color:#343a40;line-height:1.55}
.ui-icon{width:18px;height:18px;min-width:18px;vertical-align:middle;color:currentColor}
button{font-weight:500;border-radius:4px}button .ui-icon{pointer-events:none}
#shell{padding-top:45px;height:100vh}
#global-header{height:45px;position:fixed;top:0;left:0;right:0;background:#f6f7f9;border-bottom:1px solid #e9ecef;display:flex;align-items:center;gap:20px;padding:0 32px;z-index:20}
#global-brand{font-size:18px;font-weight:600;color:#212529;letter-spacing:-.4px}
#global-home{margin-left:30px;background:transparent;border:0;font-size:14px}
#global-actions{margin-left:auto;display:flex;gap:18px;align-items:center}
#global-actions>.search{width:240px;margin:0;background:white;border:1px solid #dee2e6;height:28px;padding:0 8px;border-radius:4px}
#global-actions>.search input{font-size:12px}
#global-actions>[data-view]{font-size:0;border:0;background:none;padding:3px}
#global-actions>[data-view] .ui-icon{font-size:16px}
.workspace-heading{margin:0;max-width:230px;gap:6px}.workspace-heading .brand-mark{display:none}.workspace-heading select{font-size:13px}.workspace-heading #add-workspace{font-size:18px}
#sidebar{width:300px;background:#f6f7f9;border:0;padding:16px;gap:4px;height:calc(100vh - 45px)}
#sidebar nav{border:0;padding:0 0 8px;gap:2px}
#sidebar nav button,.sidebar-bottom button{min-height:30px;padding:5px 10px;font-size:14px;gap:12px;border-radius:4px;font-weight:500;color:#495057}
#sidebar nav button span{width:16px;display:flex}.ui-icon{width:16px;height:16px;min-width:16px}
#sidebar nav button.selected,.sidebar-bottom button.selected{background:#e9ecef;color:#212529}
#sidebar .organization-controls,#sidebar #label-filter,#sidebar .section-label,#sidebar #page-list{display:none}
#global-spaces{border-top:1px solid #dee2e6;padding-top:8px;flex:1;overflow:auto}
#global-spaces h2{font-size:12px;color:#868e96;font-weight:600;padding:8px 10px;margin:0;letter-spacing:.5px}
#global-spaces button{display:flex;align-items:center;gap:10px;border:0;background:transparent;text-align:left;width:100%;padding:5px 10px}
.space-avatar{display:inline-grid;place-items:center;background:#e7f5ff;color:#1971c2;border-radius:4px;width:24px;height:24px;font-size:13px;font-weight:600;flex-shrink:0}
.sidebar-footer{border:0;padding:8px 10px;font-size:12px}.avatar{background:#e9ecef;border-radius:50%;font-size:14px}
.sidebar-bottom{margin-top:auto;border-color:#dee2e6}
.space-mode #sidebar .organization-controls,.space-mode #sidebar .section-label{display:flex}
.space-mode #sidebar #page-list{display:block}.space-mode #global-spaces{display:none}
.space-mode #sidebar #label-filter{display:block}
.space-mode #sidebar nav button:not([data-view="all"]):not([data-view="templates"]){display:none}
main{background:white;margin:0 0 0 0;border-top-left-radius:8px}
#document-header{height:45px;padding:0 16px;border-bottom:0;background:white;gap:12px}
body[data-panel="welcome"] #document-header{display:none}
#page-menu summary{padding:4px;display:flex;align-items:center}
#page-tools button{border:0;background:transparent;font-size:13px}
.welcome{max-width:932px;padding:32px 16px;margin:0 auto}
.welcome .view-heading{margin-bottom:24px;gap:16px}.welcome .view-heading h1{font-size:26px;font-weight:600}
body:not(.space-mode) .welcome:has(#home-tabs:not([hidden])) .view-heading{display:none}
body:not(.space-mode) .welcome:has(#home-tabs:not([hidden])) .list-heading{display:none}
#space-carousel{margin:0 0 32px}#space-carousel h2{font-size:16px;font-weight:500;margin:0 0 16px}
.space-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:16px}
.space-card{border:1px solid #dee2e6;border-radius:8px;overflow:hidden;padding:0 12px 14px;display:flex;align-items:flex-start;flex-direction:column;text-align:left;min-height:142px;background:white}
.space-cover{height:40px;width:calc(100% + 24px);margin:0 -12px;background:#f1f3f5}
.space-card .space-avatar{width:38px;height:38px;font-size:18px;margin-top:-20px;border:2px solid white}
.space-card strong{font-size:16px;font-weight:500;margin:8px 0 12px}.space-card small{font-size:12px;color:#868e96}
#home-tabs{display:flex;border-bottom:1px solid #dee2e6;margin-bottom:16px;gap:0}
#home-tabs button{display:flex;align-items:center;gap:8px;border:0;border-bottom:2px solid transparent;border-radius:0;padding:10px 16px;margin-bottom:-1px;background:none;font-size:14px}
#home-tabs button[aria-selected="true"]{border-bottom-color:#343a40}
.document-row{min-height:53px;padding:12px 10px;gap:16px;border-bottom:1px solid #e9ecef}
.document-row .file-icon{display:flex;color:#868e96}.row-title b{font-size:16px;font-weight:500}.row-title small{font-size:11px}.row-date{font-size:12px}.row-arrow{display:none}
#editor{min-height:calc(100vh - 90px)}.document{max-width:850px;padding:40px 54px 100px}
#title{font-size:36px;font-weight:700;letter-spacing:-.5px}.meta{margin:12px 0 24px;font-size:12px}
#discussion{width:350px;background:#f6f7f9;padding:20px;border-left:1px solid #e9ecef}
body[data-panel="settings"] #sidebar{visibility:hidden}
body[data-panel="settings"] #document-header{display:none}
.settings{max-width:932px;padding:32px 16px 80px;margin:auto}
.settings-layout{display:block}.settings-nav{position:fixed;top:45px;bottom:0;left:0;width:300px;background:#f6f7f9;padding:16px;overflow:auto;z-index:10;max-height:none!important}
.settings-nav button{min-height:30px;padding:5px 10px;border:0;background:transparent;text-align:left;color:#495057;font-size:14px}
.settings-nav button:hover{background:#e9ecef}.settings-content h1{font-size:24px;font-weight:600;margin:0 0 8px}.settings-content form{max-width:650px}.settings-content input,.settings-content select{font-size:14px;min-height:36px}
.member-row{padding:14px 8px}.menu-popover{width:230px;padding:4px;box-shadow:0 2px 10px #0002;border-radius:4px}.menu-popover button{font-size:14px!important;padding:8px 12px!important}
@media(max-width:750px){#global-header{padding:0 12px;gap:10px}#global-home,#global-actions>.search{display:none}#global-actions{gap:8px}.workspace-heading{max-width:150px}#sidebar{width:220px}.settings-nav{width:220px}.document{padding:30px 24px}#discussion{width:280px}.welcome{padding:24px 16px}#home-tabs button{padding:10px 8px;font-size:12px}}

.space-badge{font-size:11px;font-weight:600;color:#1971c2;background:#e7f5ff;border-radius:12px;padding:2px 10px;max-width:160px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.space-section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.space-section-heading h2{margin:0!important}.space-section-heading button{border:0;color:#868e96;font-size:12px;background:transparent}.document-row .row-title{display:flex;align-items:center}.document-row .row-date{min-width:90px;text-align:right}.settings-nav button.selected{background:#e9ecef;color:#212529}

.settings-nav button{display:flex;align-items:center;gap:12px}.space-cards{grid-template-columns:repeat(auto-fill,220px)}.space-mode .organization-controls{order:-1;border-bottom:1px solid #dee2e6;padding:4px 0 12px}.space-mode .organization-controls label{font-size:0;flex:1}.space-mode .organization-controls select{font-size:15px;border:0;background:transparent;font-weight:600}body[data-panel="settings"] .sidebar-collapsed .settings-nav{display:none}

#toc-panel{width:350px;flex-shrink:0;border-left:1px solid #e9ecef;background:#f6f7f9;padding:16px}#toc-links button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:6px;color:#495057}#toc-links p{font-size:13px;color:#868e96}#show-comments .ui-icon,#show-toc .ui-icon{width:20px;height:20px}#page-status,#page-meta{display:none}#title{margin-bottom:24px}#save-state{font-size:10px;opacity:.65}

/* Space navigation follows the reference space overview rather than global home. */
#space-navigation{display:none}
.space-mode #sidebar>nav[aria-label="주 메뉴"]{display:none}
.space-mode #sidebar #space-navigation{display:grid;border-bottom:1px solid #dee2e6;margin:0 -16px;padding:0 16px 16px;gap:0}
.space-mode #sidebar #space-navigation button{display:flex;align-items:center;gap:12px;min-height:30px;font-size:14px;padding:5px 2px;background:transparent}
.space-mode #sidebar #space-navigation button:hover{background:#e9ecef}
.space-mode #sidebar #space-navigation button.selected{color:#212529;background:#e9ecef}
.space-mode #sidebar #label-filter,.space-mode #sidebar>.sidebar-bottom,.space-mode #sidebar>.sidebar-footer{display:none}
.space-mode #sidebar{padding-top:4px;gap:2px}
.space-mode .organization-controls{border:0;margin:0;padding:0;min-height:32px}
.space-mode .organization-controls #add-space{display:none}
.space-mode #sidebar .section-label{margin:8px 0 0;padding:0;font-size:12px;min-height:25px}
.space-mode #sidebar #page-list{margin:0 -6px}
.space-mode #sidebar #page-list button{padding-top:5px;padding-bottom:5px}
.space-mode .welcome:has(#home-tabs:not([hidden]))>.view-heading,.space-mode .welcome:has(#home-tabs:not([hidden]))>.list-heading{display:none}
.space-mode .welcome{max-width:none;padding:48px 60px}
.space-mode .document-row .space-badge{display:none}
.space-mode #home-tabs{margin-bottom:16px}
.space-mode .document-row{min-height:46px;padding:10px 12px}

#current-space-avatar{width:20px;height:20px;min-width:20px;font-size:10px;border-radius:50%;background:#7950f2;color:white}.space-mode .organization-controls{gap:8px}.space-mode .organization-controls select{padding:3px 0}.space-mode #space-navigation .ui-icon{color:#868e96}
.space-mode .organization-controls select{color:#343a40}
@media(max-width:750px){.space-mode .welcome{padding:24px 16px}}

dialog.space-settings-modal{width:600px;max-width:calc(100vw - 24px);height:692px;max-height:80vh;top:10vh;bottom:auto;margin:0 auto;padding:20px 32px 16px;border:0;border-radius:4px;overflow:hidden;box-shadow:0 12px 35px #0002}
dialog.space-settings-modal::backdrop{background:#0009}
.space-settings-modal .close{position:absolute;right:24px;top:20px;background:none;border:0;padding:4px;color:#495057}
.space-modal-title{font-size:16px;font-weight:500;margin:0 32px 18px 0;line-height:24px}
.space-modal-tabs{display:flex;border-bottom:2px solid #dee2e6;gap:0;margin-bottom:0}
.space-modal-tabs button{border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;padding:10px 16px;margin-bottom:-2px;font-size:14px;font-weight:500}
.space-modal-tabs button[aria-selected="true"]{border-bottom-color:#212529;background:#f8f9fa}
#space-modal-panel{height:580px;max-height:calc(80vh - 100px);overflow:auto;padding:0 8px 32px 0;font-size:14px}
#space-modal-panel h3{font-size:14px;margin:16px 0;font-weight:600}
#space-modal-panel label{display:block;font-size:14px;font-weight:500;margin-bottom:16px}
#space-modal-panel input:not([type="checkbox"]),#space-modal-panel textarea{display:block;width:100%;min-height:36px;border:0;background:#f1f3f5;border-radius:4px;padding:8px 12px;margin-top:4px;font:inherit}
#space-modal-panel textarea{height:36px;min-height:36px;resize:vertical}
.space-settings-avatar{display:grid;place-items:center;border-radius:50%;width:60px;height:60px;color:white;background:#7950f2;font-size:24px;font-weight:600;margin:10px 0 24px}
.space-save-row{display:flex;justify-content:flex-end;margin:16px 0}
#space-modal-panel .primary{background:#1263d6;border:0;color:white;border-radius:4px;font-size:14px;padding:9px 18px;font-weight:600}
#space-modal-panel button:disabled{background:#e9ecef;color:#adb5bd;cursor:default}
.space-setting-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0;border-top:1px solid #dee2e6;font-size:16px}
.space-setting-row small{display:block;color:#868e96;font-size:13px;margin-top:4px}
.space-setting-row .danger{color:#c92a2a;background:#fff5f5;border:0;padding:8px 18px;border-radius:4px}
.space-member-actions{display:flex;justify-content:flex-end;margin:16px 0}
.space-member-table{width:100%;border-collapse:collapse;margin-top:16px;text-align:left}
.space-member-table th{font-weight:500;color:#868e96;font-size:12px}
.space-member-table th,.space-member-table td{padding:12px 5px;border-bottom:1px solid #e9ecef}
.space-member-table td:first-child{display:flex;align-items:center;gap:10px}
.member-avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#f1f3f5;font-size:12px;flex-shrink:0}
.space-member-table select{border:0;background:none;max-width:120px;font-size:13px;padding:4px}
.space-note{font-size:12px;color:#868e96}
#space-modal-panel input[role="switch"]{appearance:none;width:36px;min-width:36px;height:20px;border-radius:12px;background:#ced4da;position:relative;cursor:pointer;border:0}
#space-modal-panel input[role="switch"]:checked{background:#228be6}
#space-modal-panel input[role="switch"]:before{content:'';position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:white}
#space-modal-panel input[role="switch"]:checked:before{left:18px}
#space-modal-panel{scrollbar-width:thin;scrollbar-color:#adb5bd transparent}
#space-modal-panel::-webkit-scrollbar{width:5px}
#space-modal-panel::-webkit-scrollbar-thumb{background:#adb5bd;border-radius:4px}
.tree-row{align-items:center;position:relative}
#page-list .tree-row [data-id]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
#page-list .tree-row .tree-action{flex:0 0 24px;width:24px;min-height:24px;height:24px;border:0;background:none;padding:0!important;opacity:0;color:#868e96;font-size:18px;line-height:20px}
#page-list .tree-row:hover .tree-action,#page-list .tree-row:focus-within .tree-action{opacity:1}
#page-list .tree-row .tree-action:hover{background:#e9ecef;color:#212529}
.tree-context-menu{position:fixed;z-index:1200;width:210px;background:white;border:1px solid #dee2e6;border-radius:4px;box-shadow:0 3px 12px #0002;padding:4px}
.tree-context-menu button{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;text-align:left;padding:8px 10px;font-size:14px;border-radius:3px;color:#343a40}
.tree-context-menu button:hover,.tree-context-menu button:focus-visible{background:#f1f3f5;outline:none}
.tree-context-menu button.danger{color:#e03131;border-top:1px solid #e9ecef;border-radius:0;margin-top:4px}
@media(hover:none){#page-list .tree-row .tree-action{opacity:1}}
#space-menu-button{margin-left:auto;margin-right:6px;width:20px;height:20px;padding:0;border:1px solid #dee2e6;border-radius:3px;background:transparent;line-height:16px;color:#868e96}
dialog.import-pages-modal{width:600px;max-width:calc(100vw - 24px);top:10vh;bottom:auto;margin:0 auto;padding:20px 32px 24px;border:0;border-radius:4px;max-height:80vh;overflow:auto}
.import-pages-modal::backdrop{background:#0009}
.import-pages-modal h2{font-size:16px;font-weight:500;margin:0 0 24px}
.import-pages-modal .close{position:absolute;right:24px;top:18px;background:none;border:0}
.import-format-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.import-format-grid button{display:flex;align-items:center;gap:10px;text-align:left;background:white;border:1px solid #ced4da;border-radius:4px;height:36px;padding:0 14px;font-size:14px;font-weight:600}
.import-format-grid button:hover:enabled{background:#f8f9fa}
.import-format-grid button:disabled{background:#f1f3f5;border-color:#f1f3f5;color:#adb5bd}
.import-format-icon{width:20px;font-size:15px;font-family:monospace;font-weight:600}
.import-zip-area{text-align:center;padding:28px 0 16px;min-height:150px}
.import-zip-area h3{font-size:18px;font-weight:400;margin:0 0 8px}
.import-zip-area p,.import-note{font-size:13px;color:#868e96;margin:0 0 12px}
.import-zip-area button{display:inline-flex;align-items:center;gap:8px;background:#228be6;color:white;border:0;border-radius:4px;padding:8px 16px}
#import-progress{font-size:13px;margin:0;color:#495057}