MediaWiki:Common.css: Difference between revisions

Latest revision as of 21:23, 17 October 2026

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');

:root {
  --bg:        #f9f6f0;
  --beige-1:   #f0ebe0;
  --beige-2:   #e2d9c8;
  --beige-3:   #c8b99a;
  --beige-4:   #a89070;
  --gold:      #c8a060;
  --gold-dark: #a07840;
  --ink:       #2a2218;
  --ink-soft:  #6b5e4e;
  --ink-muted: #9c8e80;
  --surface:   #ffffff;
}

body {
  background-color: var(--bg) !important;
  color: var(--ink) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
  padding-top: 100px !important;
}

h1, h2, h3, h4, h5, h6,
.firstHeading, #firstHeading {
  font-family: 'Inter', sans-serif !important;
  color: var(--ink) !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
}

/* 링크 — 본문만 (헤더 링크 간섭 방지) */
#bodyContent a,
#bodyContent a:visited,
#footer a {
  color: var(--gold-dark) !important;
  text-decoration: none !important;
}
#bodyContent a:hover,
#footer a:hover {
  color: var(--gold) !important;
  text-decoration: underline !important;
}

/* Vector 기본 UI 전부 숨김 */
#mw-head,
#mw-panel,
#p-logo,
#mw-navigation,
#mw-head-base,
#mw-page-base {
  display: none !important;
}

#content,
.mw-body {
  margin: 0 !important;
  max-width: none !important;
  padding: 2rem 2rem 4rem !important;
  background: var(--bg) !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.mw-body-content {
  border: none !important;
  outline: none !important;
}

#bodyContent {
  margin-top: 1.5rem !important;
}

#footer {
  background-color: var(--beige-1) !important;
  border-top: 1px solid var(--beige-2) !important;
  color: var(--ink-muted) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
}

table.wikitable {
  background-color: var(--surface) !important;
  border-color: var(--beige-2) !important;
}
table.wikitable th {
  background-color: var(--beige-1) !important;
  color: var(--ink) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  border-color: var(--beige-2) !important;
}
table.wikitable td {
  border-color: var(--beige-2) !important;
}

hr {
  border-color: var(--beige-2) !important;
}

#catlinks {
  background-color: var(--beige-1) !important;
  border: 1px solid var(--beige-2) !important;
  border-radius: 4px !important;
  font-family: 'Inter', sans-serif !important;
  color: var(--ink-soft) !important;
}

/* ─── 3컬럼 레이아웃 ─── */
.erakh-layout {
  display: grid !important;
  grid-template-columns: 15% minmax(0, 1fr) 13% !important;
  align-items: start !important;
  max-width: 1440px !important;
  margin: 0 auto !important;
}
.erakh-layout.no-toc {
  grid-template-columns: minmax(0, 1fr) 13% !important;
}
.erakh-col-left {
  position: sticky !important;
  top: 100px !important;
  max-height: calc(100vh - 100px) !important;
  overflow-y: auto !important;
  border-right: 1px solid var(--beige-2) !important;
  padding: 1.5rem 1rem !important;
  background: var(--bg) !important;
}
.erakh-col-center {
  min-width: 0 !important;
}
.erakh-col-right {
  position: sticky !important;
  top: 100px !important;
  max-height: calc(100vh - 100px) !important;
  overflow-y: auto !important;
  border-left: 1px solid var(--beige-2) !important;
  background: var(--beige-1) !important;
  padding: 1.5rem 1rem !important;
}
.erakh-toc-label {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.6875rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  color: var(--ink-muted) !important;
  text-transform: uppercase !important;
  margin-bottom: 0.75rem !important;
  padding-bottom: 0.5rem !important;
  border-bottom: 1px solid var(--beige-2) !important;
}
#toc {
  display: none !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  font-family: 'Inter', sans-serif !important;
}
#toctitle { display: none !important; }
#toc ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
#toc li {
  padding: 0.25rem 0 0.25rem 0.5rem !important;
  border-left: 2px solid transparent !important;
  line-height: 1.4 !important;
}
#toc li a {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.78rem !important;
  color: var(--ink-soft) !important;
  text-decoration: none !important;
}
#toc li a:hover { color: var(--ink) !important; }
#toc .toclevel-2 { padding-left: 1.25rem !important; }
#toc .toclevel-2 a {
  font-size: 0.74rem !important;
  color: var(--ink-muted) !important;
}
#toc .toclevel-3 { padding-left: 2rem !important; }
#toc .toclevel-3 a { font-size: 0.72rem !important; }
.tocnumber {
  color: var(--ink-muted) !important;
  margin-right: 0.35rem !important;
}
.erakh-sidebar-label {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.6875rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  color: var(--ink-muted) !important;
  text-transform: uppercase !important;
  margin-bottom: 0.75rem !important;
  padding-bottom: 0.5rem !important;
  border-bottom: 1px solid var(--beige-2) !important;
}
.erakh-sidebar-placeholder {
  border: 1.5px dashed var(--beige-3) !important;
  border-radius: 4px !important;
  padding: 1.25rem 0.75rem !important;
  text-align: center !important;
  color: var(--ink-muted) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 0.72rem !important;
  line-height: 1.8 !important;
  margin-bottom: 0.75rem !important;
}

@media (max-width: 900px) {
  .erakh-layout,
  .erakh-layout.no-toc {
    grid-template-columns: minmax(0, 1fr) 13% !important;
  }
  .erakh-col-left { display: none !important; }
}
@media (max-width: 600px) {
  .erakh-layout,
  .erakh-layout.no-toc {
    grid-template-columns: 1fr !important;
  }
  .erakh-col-right { display: none !important; }
}
/* ─── Infobox ─── */
.erakh-infobox {
  float: right !important;
  clear: right !important;
  width: 220px !important;
  margin: 0 0 1rem 1.5rem !important;
  background: #f0ebe0 !important;
  border: 1px solid #e2d9c8 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 0.78rem !important;
  line-height: 1.4 !important;
}
.erakh-ib-title {
  background: #2a2218 !important;
  color: #f9f6f0 !important;
  text-align: center !important;
  padding: 0.5rem 0.75rem !important;
  font-weight: 500 !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.02em !important;
}
.erakh-ib-img {
  text-align: center !important;
  padding: 0.5rem !important;
  border-bottom: 1px solid #e2d9c8 !important;
  background: #e2d9c8 !important;
}
.erakh-ib-section {
  background: #e2d9c8 !important;
  color: #2a2218 !important;
  font-weight: 500 !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 0.3rem 0.6rem !important;
  border-top: 1px solid #c8b99a !important;
  border-bottom: 1px solid #c8b99a !important;
}
.erakh-ib-table {
  width: 100% !important;
  border-collapse: collapse !important;
  background: transparent !important;
  border: none !important;
}
.erakh-ib-table th {
  width: 72px !important;
  background: #ebe5d8 !important;
  color: #6b5e4e !important;
  font-weight: 500 !important;
  font-size: 0.7rem !important;
  padding: 0.3rem 0.5rem !important;
  border: none !important;
  border-bottom: 1px solid #e2d9c8 !important;
  text-align: left !important;
  vertical-align: top !important;
}
.erakh-ib-table td {
  color: #2a2218 !important;
  font-size: 0.75rem !important;
  padding: 0.3rem 0.5rem !important;
  border: none !important;
  border-bottom: 1px solid #e2d9c8 !important;
  vertical-align: top !important;
}
/* ─── Special:Search 페이지 기본 검색 UI 전체 숨김 ─── */
.mw-search-form-wrapper,
.search-types,
.mw-search-top-table,
.mw-search-profile-form,
form#search {
  display: none !important;
}

/* Hide MW help link on category pages */
.mw-indicator-mw-helplink { display: none !important; }
.mw-indicator { display: none !important; }

/* ── Box 템플릿 ── */
.erakh-box {
    background: #ffffff;
    border: 1px solid #c8a060;
    border-left: 0.3em solid #a07840;
    padding: 1em 1.25em;
    margin: 1em 0;
    color: #2a2218;
    font-size: 1em;
    line-height: 1.7;
}

.erakh-box-source {
    display: block;
    margin-top: 0.625em;
    color: #6b5e4e;
    font-size: 0.9em;
}

/* 업로드 다이얼로그 크기 축소 */
.oo-ui-window-frame {
    max-height: 400px !important;
    height: 400px !important;
}

/* =====================================================================
   Erakh Codex — main page styles (added 2026-10-04)
   Used by the Main_Page wikitext (classes erakh-home, erakh-hero, erakh-card ...).
   Safe to leave in place when unused: every rule is scoped to these class names.
   ===================================================================== */

/* Icons: Tabler Icons v3.48.0 (outline), embedded as CSS masks.
   Source: https://github.com/tabler/tabler-icons
   Icons used: user, building, map, dna, clock, users, sword, book, diamond, info-circle

MIT License

Copyright (c) 2020-2026 Paweł Kuna

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/
#bodyContent .erakh-icon {
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  margin: 0 auto 0.4rem;
  background-color: var(--gold);
  -webkit-mask-image: var(--erakh-icon);
  mask-image: var(--erakh-icon);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
#bodyContent .erakh-card-hl .erakh-icon { background-color: var(--gold-dark); }
#bodyContent .erakh-icon-user { --erakh-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0'/%3E%3Cpath d='M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2'/%3E%3C/svg%3E"); }
#bodyContent .erakh-icon-building { --erakh-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21l18 0'/%3E%3Cpath d='M9 8l1 0'/%3E%3Cpath d='M9 12l1 0'/%3E%3Cpath d='M9 16l1 0'/%3E%3Cpath d='M14 8l1 0'/%3E%3Cpath d='M14 12l1 0'/%3E%3Cpath d='M14 16l1 0'/%3E%3Cpath d='M5 21v-16a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v16'/%3E%3C/svg%3E"); }
#bodyContent .erakh-icon-map { --erakh-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7l6 -3l6 3l6 -3v13l-6 3l-6 -3l-6 3v-13'/%3E%3Cpath d='M9 4v13'/%3E%3Cpath d='M15 7v13'/%3E%3C/svg%3E"); }
#bodyContent .erakh-icon-dna { --erakh-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.828 14.828a4 4 0 1 0 -5.656 -5.656a4 4 0 0 0 5.656 5.656'/%3E%3Cpath d='M9.172 20.485a4 4 0 1 0 -5.657 -5.657'/%3E%3Cpath d='M14.828 3.515a4 4 0 0 0 5.657 5.657'/%3E%3C/svg%3E"); }
#bodyContent .erakh-icon-clock { --erakh-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0'/%3E%3Cpath d='M12 7v5l3 3'/%3E%3C/svg%3E"); }
#bodyContent .erakh-icon-users { --erakh-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 7a4 4 0 1 0 8 0a4 4 0 1 0 -8 0'/%3E%3Cpath d='M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3Cpath d='M21 21v-2a4 4 0 0 0 -3 -3.85'/%3E%3C/svg%3E"); }
#bodyContent .erakh-icon-sword { --erakh-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 4v5l-9 7l-4 4l-3 -3l4 -4l7 -9l5 0'/%3E%3Cpath d='M6.5 11.5l6 6'/%3E%3C/svg%3E"); }
#bodyContent .erakh-icon-book { --erakh-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 19a9 9 0 0 1 9 0a9 9 0 0 1 9 0'/%3E%3Cpath d='M3 6a9 9 0 0 1 9 0a9 9 0 0 1 9 0'/%3E%3Cpath d='M3 6l0 13'/%3E%3Cpath d='M12 6l0 13'/%3E%3Cpath d='M21 6l0 13'/%3E%3C/svg%3E"); }
#bodyContent .erakh-icon-diamond { --erakh-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 5h12l3 5l-8.5 9.5a.7 .7 0 0 1 -1 0l-8.5 -9.5l3 -5'/%3E%3Cpath d='M10 12l-2 -2.2l.6 -1'/%3E%3C/svg%3E"); }
#bodyContent .erakh-icon-info-circle { --erakh-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0'/%3E%3Cpath d='M12 9h.01'/%3E%3Cpath d='M11 12h1v4h1'/%3E%3C/svg%3E"); }

/* Page container */
#bodyContent .erakh-home {
  max-width: 860px;
  margin: 0 auto;
  padding: 2.5rem 2rem 4rem;
  box-sizing: border-box;
}
#bodyContent .erakh-home p { margin: 0; }

/* Hero */
#bodyContent .erakh-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  background: var(--beige-1);
  border: 1px solid var(--beige-2);
  border-radius: 6px;
  padding: 2rem 2.5rem;
  margin-bottom: 2.5rem;
  box-sizing: border-box;
}
#bodyContent .erakh-hero h1 {
  font-size: 1.5rem;
  line-height: 1.3;
  margin: 0 0 0.5rem 0;
  padding: 0;
  border: 0;
}
#bodyContent .erakh-hero-text p {
  font-size: 0.8125rem;
  color: var(--ink-soft);
  line-height: 1.7;
  max-width: 480px;
}
#bodyContent .erakh-hero-stat {
  text-align: center;
  border-left: 1px solid var(--beige-3);
  padding-left: 2.5rem;
  flex-shrink: 0;
}
#bodyContent .erakh-hero-num {
  font-size: 2rem;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: -0.02em;
  line-height: 1.2;
}
#bodyContent .erakh-hero-label {
  font-size: 0.6875rem;
  color: var(--ink-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-top: 0.25rem;
}

/* Section titles */
#bodyContent .erakh-section-title {
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--ink-muted);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 1rem;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid var(--beige-2);
}

/* Category cards (the whole card is clickable through the link's ::after) */
#bodyContent .erakh-cat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 2.5rem;
}
#bodyContent .erakh-card {
  position: relative;
  box-sizing: border-box;
  border: 1px solid var(--beige-2);
  border-radius: 6px;
  background: var(--surface);
  padding: 1rem 0.5rem;
  text-align: center;
}
#bodyContent .erakh-card:hover { background: var(--beige-1); border-color: var(--beige-3); }
#bodyContent .erakh-card:focus-within { outline: 2px solid var(--gold); outline-offset: 2px; }
#bodyContent .erakh-card-hl { border: 1.5px solid var(--gold); background: #f5ede0; }
#bodyContent .erakh-card-hl:hover { background: #ede0cc; border-color: var(--gold-dark); }
#bodyContent .erakh-card-name { font-size: 0.75rem; font-weight: 500; }
#bodyContent .erakh-card-count {
  font-size: 0.65rem;
  color: var(--ink-muted);
  margin-top: 0.2rem;
}
#bodyContent .erakh-card a,
#bodyContent .erakh-card a:visited,
#bodyContent .erakh-card a:hover {
  color: var(--ink) !important;
  text-decoration: none !important;
}
#bodyContent .erakh-card-hl a,
#bodyContent .erakh-card-hl a:visited,
#bodyContent .erakh-card-hl a:hover {
  color: var(--gold-dark) !important;
}
#bodyContent .erakh-card a::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

/* Two columns: welcome box + recent changes */
#bodyContent .erakh-home-cols {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
}
#bodyContent .erakh-welcome {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  background: var(--surface);
  border: 1px solid var(--beige-2);
  border-radius: 6px;
  padding: 1.25rem 1.5rem;
  box-sizing: border-box;
}
#bodyContent .erakh-welcome .erakh-icon {
  width: 1.125rem;
  height: 1.125rem;
  margin: 0.1rem 0 0 0;
  flex-shrink: 0;
}
#bodyContent .erakh-welcome-title {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 0.3rem;
}
#bodyContent .erakh-welcome-text {
  font-size: 0.775rem;
  color: var(--ink-soft);
  line-height: 1.65;
}
#bodyContent .erakh-welcome-text a { font-weight: 500; }

/* Recent changes box (filled by MediaWiki:Common.js) */
#bodyContent .erakh-recent {
  background: var(--surface);
  border: 1px solid var(--beige-2);
  border-radius: 6px;
  overflow: hidden;
}
#bodyContent .erakh-recent-msg {
  padding: 1rem;
  font-size: 0.78rem;
  color: var(--ink-muted);
}
#bodyContent .erakh-recent-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.55rem 1rem;
  border-bottom: 1px solid var(--beige-1);
}
#bodyContent .erakh-recent-row:last-child { border-bottom: 0; }
#bodyContent .erakh-recent-row:hover { background: var(--beige-1); }
#bodyContent a.erakh-recent-row:hover { text-decoration: none !important; }
#bodyContent .erakh-recent-title { font-size: 0.78rem; color: var(--ink); }
#bodyContent .erakh-recent-date {
  font-size: 0.7rem;
  color: var(--ink-muted);
  flex-shrink: 0;
  margin-left: 1rem;
}

/* Narrow screens */
@media (max-width: 640px) {
  #bodyContent .erakh-home { padding: 1.5rem 1rem 3rem; }
  #bodyContent .erakh-hero {
    flex-direction: column;
    align-items: stretch;
    gap: 1.25rem;
    padding: 1.5rem 1.25rem;
  }
  #bodyContent .erakh-hero-stat {
    text-align: left;
    border-left: 0;
    padding-left: 0;
    border-top: 1px solid var(--beige-3);
    padding-top: 1rem;
  }
  #bodyContent .erakh-home-cols { grid-template-columns: minmax(0, 1fr); }
}

/* ═══════════════════════════════════════════════════════════════
   문서 가독성 개편 — 단계 B (2026-10-17)
   적용 범위: 문서 보기 화면(네임스페이스 0)에서 Main_Page 제외.
   롤백: 이 주석 블록 전체를 삭제하면 이전 상태로 돌아간다.
   ═══════════════════════════════════════════════════════════════ */

/* 본문 크기·행간 (Vector 기본 14px/1.6 → 16px/1.75) */
body.ns-0.action-view:not(.page-Main_Page) #bodyContent {
  font-size: 16px;
  line-height: 1.75;
}

/* 본문 줄 폭 제한 + 가운데 정렬 (약 90자) */
body.ns-0.action-view:not(.page-Main_Page) #mw-content-text .mw-parser-output {
  max-width: 44rem;
  margin-left: auto;
  margin-right: auto;
}

/* 문단 간격 */
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output p {
  margin: 0 0 0.85em;
}

/* 제목 위계: h2 굵은 선 / h3 얇은 선 / h4 선 없음 */
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h2 {
  font-size: 1.5em;
  line-height: 1.3;
  margin: 1.6em 0 0.6em;
  padding: 0 0 0.35em;
  border-bottom: 2px solid #cdb685 !important;
}
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h3 {
  font-size: 1.2em;
  line-height: 1.35;
  margin: 1.6em 0 0.6em;
  padding: 0 0 0.3em;
  border-bottom: 1px solid #e2d9c8 !important;
}
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h4 {
  font-size: 1.0625em;
  line-height: 1.4;
  margin: 1.6em 0 0.4em;
  border-bottom: 0 !important;
}

/* 본문 링크: 대비 5.5:1 이상의 진한 갈색 + 가는 밑줄 (헤더·목차 링크에는 영향 없음) */
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output a,
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output a:visited {
  color: #7a5420 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: #cdb685;
}
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output a:hover {
  color: #2a2218 !important;
  text-decoration-color: #7a5420;
}

/* 좌우 칸 15% 대칭 — 900px 이하에서는 기존 반응형 규칙을 그대로 사용 */
@media (min-width: 901px) {
  .erakh-layout {
    grid-template-columns: 15% minmax(0, 1fr) 15% !important;
  }
  .erakh-layout.no-toc {
    grid-template-columns: minmax(0, 1fr) 15% !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   톤 변경 — 단계 B2 (2026-10-17)
   메인페이지와 모든 화면의 페이지 배경을 같은 파스텔 톤으로 통일하고,
   문서 본문은 더 밝은 연백색 면으로 올린다. (헤더·서브바 색은 JS가 지정하므로 불변)
   롤백: 이 주석 블록 전체를 삭제하면 이전 상태(단계 B)로 돌아간다.
   ═══════════════════════════════════════════════════════════════ */

:root {
  --bg: #f3f1ec;
}

body.ns-0.action-view:not(.page-Main_Page) #content {
  background: #fffdf9 !important;
  border: 1px solid #e6e1d8 !important;
  border-radius: 4px;
}
body.ns-0.action-view:not(.page-Main_Page) .erakh-col-left {
  background: transparent !important;
  border-right: 0 !important;
}
body.ns-0.action-view:not(.page-Main_Page) .erakh-col-right {
  background: transparent !important;
}

/* ═══════════════════════════════════════════════════════════════
   번호 제목 — 단계 C (2026-10-17)
   문서 보기 화면(네임스페이스 0, Main_Page 제외)의 h2/h3/h4에 번호 칩을 붙인다.
   번호 규칙은 MediaWiki 목차 번호와 같고, 왼쪽 목차(Common.js)와 같은 시점에 켠다.
   롤백: 이 주석 블록 전체를 삭제한다.
   ═══════════════════════════════════════════════════════════════ */

body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output {
  counter-reset: erakh-h2;
}
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h2 {
  counter-increment: erakh-h2;
  counter-reset: erakh-h3 erakh-h4;
}
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h3 {
  counter-increment: erakh-h3;
  counter-reset: erakh-h4;
}
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h4 {
  counter-increment: erakh-h4;
}

body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h2::before,
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h3::before,
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h4::before {
  display: inline-block;
  background: #f1e8d6;
  color: #7a5420;
  font-weight: 600;
  font-size: 0.74em;
  line-height: 1.5;
  padding: 0.05em 0.55em;
  border-radius: 3px;
  margin-right: 0.7em;
  vertical-align: 0.12em;
  font-variant-numeric: tabular-nums;
}
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h2::before {
  content: counter(erakh-h2);
}
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h3::before {
  content: counter(erakh-h2) "." counter(erakh-h3);
}
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h4::before {
  content: counter(erakh-h2) "." counter(erakh-h3) "." counter(erakh-h4);
}

/* ═══════════════════════════════════════════════════════════════
   머리말 문단 — 단계 D (2026-10-17)
   위키텍스트의 <b class="erakh-lead">라벨</b> 문단을 "골드 마커 + 별도 줄 라벨"로 표시한다.
   본문 강조용 굵은 글씨('''…''')와 구분하기 위해 클래스가 붙은 라벨에만 적용된다.
   롤백: 이 주석 블록 전체를 삭제한다. (클래스는 스타일이 없으면 보통 굵은 글씨로 보인다)
   ═══════════════════════════════════════════════════════════════ */

body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output .erakh-lead {
  display: block;
  font-weight: 600;
  color: #2a2218;
  margin: 1.15em 0 0.05em;
}
body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output .erakh-lead::before {
  content: "";
  display: inline-block;
  width: 0.42em;
  height: 0.42em;
  background: #cdb685;
  transform: rotate(45deg);
  margin-right: 0.6em;
  vertical-align: 0.14em;
}