|
|
| Line 1: |
Line 1: |
| @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');
| | /* ═══════════════════════════════════════════════════════════════ |
| | 문서 가독성 개편 — 단계 B (2026-10-17) |
| | 적용 범위: 문서 보기 화면(네임스페이스 0)에서 Main_Page 제외. |
| | 롤백: 이 주석 블록 전체를 삭제하면 이전 상태로 돌아간다. |
| | ═══════════════════════════════════════════════════════════════ */ |
|
| |
|
| :root {
| | /* 본문 크기·행간 (Vector 기본 14px/1.6 → 16px/1.75) */ |
| --bg: #f9f6f0;
| | body.ns-0.action-view:not(.page-Main_Page) #bodyContent { |
| --beige-1: #f0ebe0;
| | font-size: 16px; |
| --beige-2: #e2d9c8;
| | line-height: 1.75; |
| --beige-3: #c8b99a;
| |
| --beige-4: #a89070; | |
| --gold: #c8a060; | |
| --gold-dark: #a07840;
| |
| --ink: #2a2218;
| |
| --ink-soft: #6b5e4e;
| |
| --ink-muted: #9c8e80;
| |
| --surface: #ffffff;
| |
| } | | } |
|
| |
|
| body { | | /* 본문 줄 폭 제한 + 가운데 정렬 (약 90자) */ |
| background-color: var(--bg) !important;
| | body.ns-0.action-view:not(.page-Main_Page) #mw-content-text .mw-parser-output { |
| color: var(--ink) !important;
| | max-width: 44rem; |
| font-family: 'Inter', sans-serif !important;
| | margin-left: auto; |
| font-size: 16px !important; | | margin-right: auto; |
| line-height: 1.7 !important; | |
| padding-top: 100px !important; | |
| } | | } |
|
| |
|
| h1, h2, h3, h4, h5, h6,
| | /* 문단 간격 */ |
| .firstHeading, #firstHeading { | | body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output p { |
| font-family: 'Inter', sans-serif !important;
| | margin: 0 0 0.85em; |
| color: var(--ink) !important;
| |
| font-weight: 600 !important;
| |
| letter-spacing: -0.01em !important; | |
| } | | } |
|
| |
|
| /* 링크 — 본문만 (헤더 링크 간섭 방지) */ | | /* 제목 위계: h2 굵은 선 / h3 얇은 선 / h4 선 없음 */ |
| #bodyContent a, | | body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h2 { |
| #bodyContent a:visited,
| | font-size: 1.5em; |
| #footer a {
| | line-height: 1.3; |
| color: var(--gold-dark) !important; | | margin: 1.6em 0 0.6em; |
| text-decoration: none !important; | | padding: 0 0 0.35em; |
| | border-bottom: 2px solid #cdb685 !important; |
| } | | } |
| #bodyContent a:hover, | | body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output h3 { |
| #footer a:hover {
| | font-size: 1.2em; |
| color: var(--gold) !important; | | line-height: 1.35; |
| text-decoration: underline !important; | | 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 { |
| /* Vector 기본 UI 전부 숨김 */
| | font-size: 1.0625em; |
| #mw-head,
| | line-height: 1.4; |
| #mw-panel, | | margin: 1.6em 0 0.4em; |
| #p-logo,
| | border-bottom: 0 !important; |
| #mw-navigation,
| |
| #mw-head-base,
| |
| #mw-page-base {
| |
| display: none !important; | |
| } | | } |
|
| |
|
| #content, | | /* 본문 링크: 대비 5.5:1 이상의 진한 갈색 + 가는 밑줄 (헤더·목차 링크에는 영향 없음) */ |
| .mw-body { | | body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output a, |
| margin: 0 !important; | | body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output a:visited { |
| max-width: none !important; | | color: #7a5420 !important; |
| padding: 2rem 2rem 4rem !important; | | text-decoration: underline !important; |
| background: var(--bg) !important; | | text-decoration-thickness: 1px; |
| border: none !important;
| | text-underline-offset: 3px; |
| box-shadow: none !important; | | text-decoration-color: #cdb685; |
| outline: none !important;
| |
| } | | } |
| | | body.ns-0.action-view:not(.page-Main_Page) #bodyContent .mw-parser-output a:hover { |
| .mw-body-content { | | color: #2a2218 !important; |
| border: none !important; | | text-decoration-color: #7a5420; |
| outline: none !important; | |
| } | | } |
|
| |
|
| #bodyContent {
| | /* 좌우 칸 15% 대칭 — 900px 이하에서는 기존 반응형 규칙을 그대로 사용 */ |
| margin-top: 1.5rem !important;
| | @media (min-width: 901px) { |
| }
| | .erakh-layout { |
| | | grid-template-columns: 15% minmax(0, 1fr) 15% !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 { | | .erakh-layout.no-toc { |
| grid-template-columns: 1fr !important; | | grid-template-columns: minmax(0, 1fr) 15% !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); }
| |
| } | | } |