:root { --link-color: #0645ad; --link-visited: #0b0080; --border-color: #a7d7f9; --border-light: #c8ccd1; }
body { font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif; background: #f6f6f6; margin: 0; display: flex; color: #202122; font-size: 14px; line-height: 1.6; }

#sidebar { width: 176px; padding: 15px 15px 40px; flex-shrink: 0; display: flex; flex-direction: column; gap: 8px; background: #f8f9fa; }
#logo { cursor: pointer; text-align: center; margin-bottom: 10px; }
.sidebar-box { border-top: 1px solid var(--border-light); padding-top: 8px; font-size: 12px; }
.sidebar-box h3 { font-size: 12px; color: #54595d; margin: 0 0 4px 0; font-family: inherit; border: none; }
.sidebar-link { color: var(--link-color); text-decoration: none; display: block; margin-bottom: 3px; cursor: pointer; }
.sidebar-link:hover { text-decoration: underline; }

#main { background: white; width: 100%; border-left: 1px solid #a7d7f9; padding: 40px 40px 60px; min-height: 100vh; box-sizing: border-box; }
h1 { font-family: 'Linux Libertine', Georgia, 'Times', serif; font-size: 1.8em; border-bottom: 1px solid #a2a9b1; margin-bottom: 5px; font-weight: normal; }
.subtitle { font-size: 13px; color: #54595d; margin-bottom: 20px; }

.content-text { line-height: 1.6; font-size: 14px; }
.content-text p { margin: 8px 0; }

.content-text h2 { font-family: 'Linux Libertine', Georgia, 'Times', serif; font-size: 1.5em; border-bottom: 1px solid #a2a9b1; margin: 24px 0 12px; font-weight: normal; }
.content-text h3 { font-size: 1.2em; margin: 20px 0 8px; font-weight: bold; }
.content-text h4 { font-size: 1em; margin: 16px 0 6px; font-weight: bold; }
.content-text h5 { font-size: 0.9em; margin: 14px 0 4px; font-weight: bold; }
.content-text h6 { font-size: 0.85em; margin: 12px 0 4px; font-weight: bold; color: #54595d; }

.content-text a { color: var(--link-color); text-decoration: none; }
.content-text a:hover { text-decoration: underline; }
.content-text a:visited { color: var(--link-visited); }

.content-text strong { font-weight: bold; }
.content-text em { font-style: italic; }
.content-text del { text-decoration: line-through; color: #72777d; }
.content-text small { font-size: 85%; color: #54595d; }

.content-text ul, .content-text ol { padding-left: 2em; margin: 6px 0; }
.content-text li { margin-bottom: 2px; }

.content-text blockquote { border-left: 3px solid #c8ccd1; padding: 4px 0 4px 16px; margin: 8px 0; color: #404244; }

.content-text hr { border: none; border-top: 1px solid #c8ccd1; margin: 16px 0; }

.wiki-image { float: right; clear: right; margin: 8px 0 12px 16px; background: #f8f9fa; border: 1px solid #c8ccd1; padding: 4px; text-align: center; max-width: 300px; }
.wiki-image img { max-width: 100%; height: auto; }
.wiki-image figcaption { font-size: 12px; color: #404244; padding: 4px 2px 2px; }

.toc { background: #f8f9fa; border: 1px solid #a2a9b1; display: inline-block; padding: 7px 12px; margin: 0 0 20px; font-size: 13px; }
.toc-title { font-weight: bold; text-align: center; margin-bottom: 6px; }
.toc-toggle { font-weight: normal; font-size: 12px; cursor: pointer; color: var(--link-color); margin-left: 4px; }
.toc-toggle:hover { text-decoration: underline; }
.toc-list { list-style: none; padding: 0; margin: 0; }
.toc-list li { margin: 2px 0; }
.toc-list a { color: var(--link-color); text-decoration: none; }
.toc-list a:hover { text-decoration: underline; }
.toc-number { color: #202122; margin-right: 4px; }

#search-box { width: 100%; padding: 5px; box-sizing: border-box; border: 1px solid #a2a9b1; }

#editor-container { display: none; flex-direction: column; gap: 10px; }
#editor-text { width: 100%; height: 400px; font-family: 'Consolas', 'Courier New', monospace; font-size: 13px; padding: 10px; border: 1px solid #a2a9b1; resize: vertical; box-sizing: border-box; }

.editor-toolbar { display: flex; gap: 2px; flex-wrap: wrap; padding: 4px; background: #f8f9fa; border: 1px solid #a2a9b1; border-bottom: none; }
.editor-toolbar button { background: #fff; border: 1px solid #c8ccd1; padding: 4px 10px; cursor: pointer; font-size: 13px; font-family: inherit; min-width: 30px; }
.editor-toolbar button:hover { background: #eaf3ff; border-color: var(--link-color); }
.editor-toolbar .sep { width: 1px; background: #c8ccd1; margin: 2px 4px; }

.btn { background: #f8f9fa; border: 1px solid #a2a9b1; padding: 6px 14px; cursor: pointer; font-size: 13px; }
.btn:hover { background: #eee; }
.btn-primary { background: #36c; color: white; border: none; }
.btn-primary:hover { background: #447ff5; }

#new-title { padding: 8px 10px; margin-bottom: 6px; font-size: 1.2em; border: 1px solid #a2a9b1; font-family: 'Linux Libertine', Georgia, serif; }

.content-text .wiki-table { border-collapse: collapse; margin: 12px 0; font-size: 13px; }
.content-text .wiki-table td, .content-text .wiki-table th { border: 1px solid #a2a9b1; padding: 6px 10px; }
.content-text .wiki-table th { background: #eaecf0; font-weight: bold; text-align: center; }
.content-text .wiki-table caption { font-weight: bold; margin-bottom: 4px; }

.content-text code { background: #f8f9fa; border: 1px solid #eaecf0; border-radius: 2px; padding: 1px 4px; font-family: 'Consolas', 'Courier New', monospace; font-size: 13px; }
.content-text pre { background: #f8f9fa; border: 1px solid #c8ccd1; padding: 12px; overflow-x: auto; margin: 12px 0; }
.content-text pre code { background: none; border: none; padding: 0; }

.content-text .wiki-math { padding: 2px 4px; }

.infobox { float: right; clear: right; margin: 0 0 12px 16px; width: 280px; background: #f8f9fa; border: 1px solid #a2a9b1; font-size: 12px; border-collapse: collapse; }
.infobox-title { background: #eaecf0; font-size: 14px; font-weight: bold; text-align: center; padding: 6px 8px; }
.infobox-subtitle { text-align: center; font-size: 11px; color: #54595d; padding: 2px 8px 6px; }
.infobox-image { text-align: center; padding: 4px; background: #fff; border-bottom: 1px solid #eaecf0; }
.infobox-image img { max-width: 260px; height: auto; }
.infobox th { text-align: left; vertical-align: top; padding: 4px 8px; white-space: nowrap; color: #54595d; font-weight: normal; width: 1%; }
.infobox td { padding: 4px 8px; vertical-align: top; }
.infobox tr + tr { border-top: 1px solid #eaecf0; }

.glow-green { color: #00aa00; text-shadow: 0 0 6px #00aa00, 0 0 12px #00aa0066; }
.glow-red { color: #cc0000; text-shadow: 0 0 6px #cc0000, 0 0 12px #cc000066; }
.glow-yellow { color: #b8860b; text-shadow: 0 0 6px #b8860b, 0 0 12px #b8860b66; }
.glow-blue { color: #0645ad; text-shadow: 0 0 6px #0645ad, 0 0 12px #0645ad66; }

.spoiler { background: #000; color: #000; cursor: default; padding: 0 2px; }
.spoiler:hover { color: #fff; }

.ambox { margin: 10px 0; padding: 8px 10px 8px 40px; border-left: 8px solid #aaa; background: #f8f9fa; font-size: 13px; position: relative; min-height: 20px; }
.ambox-icon { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-weight: bold; font-size: 16px; width: 20px; text-align: center; }
.ambox-orange { border-left-color: #f08; background: #fef6f0; }
.ambox-red { border-left-color: #c33; background: #fef0f0; }
.ambox-blue { border-left-color: #36c; background: #f0f4ff; }
.ambox-yellow { border-left-color: #fc3; background: #fefae6; }

#tab-bar { display: flex; background: #f8f9fa; border-bottom: 1px solid #a7d7f9; margin: -40px -40px 20px; padding: 0 12px; font-size: 13px; }
.tab-group { display: flex; }
.tab-group-right { margin-left: auto; }
.tab { padding: 8px 14px; cursor: pointer; color: var(--link-color); }
.tab:hover { text-decoration: underline; }
.tab-active { background: #fff; border: 1px solid #a7d7f9; border-bottom-color: #fff; margin-bottom: -1px; color: #202122; cursor: default; }
.tab-active:hover { text-decoration: none; }
.tab-inactive { background: transparent; }
.tab-edit { font-weight: bold; }

.references { border-top: 1px solid #a2a9b1; margin-top: 24px; padding-top: 8px; font-size: 12px; }
.references h2 { font-family: 'Linux Libertine', Georgia, 'Times', serif; font-size: 1.5em; border-bottom: 1px solid #a2a9b1; margin: 16px 0 8px; font-weight: normal; }
.references ol { padding-left: 2em; }
.references li { margin-bottom: 4px; }
.references .ref-backlink { text-decoration: none; color: var(--link-color); font-size: 11px; }
.content-text sup a { text-decoration: none; color: var(--link-color); }

#share-container { display: none; flex-direction: column; gap: 12px; }
#share-url { width: 100%; padding: 8px; border: 1px solid #a2a9b1; box-sizing: border-box; font-size: 13px; background: #f8f9fa; color: #202122; }
.share-options { display: flex; flex-direction: column; gap: 16px; max-width: 500px; }
.share-buttons { display: flex; gap: 8px; }
#qr-section { margin-top: 4px; }
#qr-container { margin: 8px 0; }
#qr-container img, #qr-container table { display: block; }
#qr-container table { border-collapse: collapse; }
#qr-container td { width: 4px; height: 4px; padding: 0; }
#qr-container td.qr-dark { background: #000; }
#qr-container td.qr-light { background: #fff; }
.qr-note { font-size: 12px; color: #54595d; }

#footer { border-top: 1px solid #a2a9b1; margin-top: 40px; padding: 16px 0 8px; font-size: 12px; color: #54595d; display: flex; align-items: center; gap: 12px; }
#footer img { border: 0; }
#footer strong { color: #202122; }
