미디어위키:Theme.css: 두 판 사이의 차이

편집 요약 없음
태그: 되돌려진 기여
편집 요약 없음
태그: 수동 되돌리기
1번째 줄: 1번째 줄:
@import url('/index.php?title=MediaWiki:Template.Infobox.css&action=raw&ctype=text/css');
/* =========================================
/* =========================================
   Proitem Animation
   COASTLINE: BLACK ICE - Theme
   ========================================= */
   ========================================= */
 
/* screen-header 쓰는 문서만 푸커 숨기기 */
.wip-stripe-layer {
body:has(.screen-header) .liberty-footer {
    position: absolute;
     display: none !important;
    top: 0;
    left: -280px;
    width: calc(100% + 560px);
    height: 100%;
    opacity: 0.08;
    background: repeating-linear-gradient(
        45deg,
        #969696,
        #969696 10px,
        transparent 10px,
        transparent 20px
     );
    z-index: 0;
}
}
 
body:has(.screen-header) footer {
.wip-active .wip-stripe-layer {
     display: none !important;
    animation: wip-stripe-move 8s linear infinite;
}
 
.wip-standby .wip-stripe-layer {
     animation: none;
}
 
@keyframes wip-stripe-move {
    from { transform: translateX(0); }
    to { transform: translateX(280px); }
}
}


/* =========================================
/* 색상 텍스트 틀 및 색상 범위 공통 처리 */
  Collapsible
  ========================================= */
 
[id^="collapsible"] {
    overflow: hidden;
    transition: max-height .25s ease;
    max-height: 0;
}
 
/* =========================================
  Color
  ========================================= */
 
.color-text {
.color-text {
     color: var(--text-color);
     color: var(--text-color, #fff) !important;
}
}


.color-text a,
.color-text a,
.color-text a:visited,
.color-text a:visited,
.color-text a:hover,
.color-text a.external {
.color-text a:active {
     color: var(--text-color, #fff) !important;
     color: var(--text-color) !important;
    text-decoration-color: var(--text-color) !important;
}
}


/* =========================================
.color-text a:hover {
  CRT Glitch Panel
     color: var(--text-color, #fff) !important;
  ========================================= */
 
.crt-glitch-panel {
     position: relative;
    overflow: hidden;
    isolation: isolate;
    border-radius: 5px;
    box-shadow:
        inset 0 0 18px rgba(255,255,255,0.04),
        inset 0 0 42px rgba(133,67,105,0.10),
        0 0 18px rgba(133,67,105,0.20);
}
}


.crt-glitch-panel .vanishing-grid-bg {
/* 선택 영역 */
    position: relative;
::selection {
    overflow: hidden;
     background: rgba(133, 67, 105, 0.50);
    border-radius: 5px;
    color: #ffffff;
     background:
        radial-gradient(circle at 50% 45%, rgba(212,90,162,0.18) 0%, transparent 32%),
        linear-gradient(to bottom, #111 0%, #090909 58%, #030303 100%) !important;
}
}


.crt-glitch-panel > * {
::-moz-selection {
     position: relative;
     background: rgba(133, 67, 105, 0.50);
     z-index: 2;
     color: #ffffff;
}
}


.crt-glow-content {
/* SVG + 테두리일 때 사각 테두리 제거, 형태 외곽선만 적용 */
     position: relative;
.mw-image-border:has(img[src$=".svg.png"]) {
     z-index: 2;
     border: none !important;
     text-shadow:
     box-shadow: none !important;
        -1px 0 0 rgba(80,160,255,0.75),
     background: transparent !important;
        1px 0 0 rgba(255,55,90,0.65),
     padding: 0 !important;
        2px 0 0 rgba(255,210,70,0.45),
        0 0 2px rgba(255,255,255,0.35),
        0 0 6px rgba(212,90,162,0.22),
        0 0 12px rgba(133,67,105,0.18);
     filter: drop-shadow(0 0 5px rgba(212,90,162,0.18));
}
}


.crt-glow-content::before {
.mw-image-border img[src$=".svg.png"] {
    content: "";
     border: none !important;
    position: absolute;
     box-shadow: none !important;
    inset: -24px;
    z-index: -1;
     pointer-events: none;
     background:
        radial-gradient(
            circle at 50% 35%,
            rgba(255,255,255,0.08) 0%,
            rgba(212,90,162,0.10) 18%,
            rgba(133,67,105,0.08) 34%,
            transparent 68%
        );
    filter: blur(18px);
    opacity: 0.75;
}
 
.crt-glitch-panel .fake-h1,
.crt-glitch-panel h1,
.crt-glitch-panel h2,
.crt-glitch-panel strong {
    text-shadow:
        -1px 0 0 rgba(80,160,255,0.95),
        1px 0 0 rgba(255,55,90,0.85),
        2px 0 0 rgba(255,210,70,0.55),
        0 0 3px rgba(255,255,255,0.65),
        0 0 10px rgba(255,255,255,0.28),
        0 0 18px rgba(212,90,162,0.35),
        0 0 32px rgba(133,67,105,0.24);
}
 
.crt-glitch-panel img {
     filter:
     filter:
         drop-shadow(-1px 0 0 rgba(80,160,255,0.65))
         drop-shadow(1px 0 0 #ffffff)
         drop-shadow(1px 0 0 rgba(255,55,90,0.55))
         drop-shadow(-1px 0 0 #ffffff)
         drop-shadow(2px 0 0 rgba(255,210,70,0.35))
         drop-shadow(0 1px 0 #ffffff)
         drop-shadow(0 0 6px rgba(212,90,162,0.18));
         drop-shadow(0 -1px 0 #ffffff);
}
}


.crt-glitch-panel::before {
/* 폰트 */
     content: "";
@font-face {
    position: absolute;
     font-family: 'Galmuri11';
    inset: -80px 0;
     src: url('/fonts/Galmuri11.woff2') format('woff2');
    z-index: 3;
     font-weight: 400;
    pointer-events: none;
     font-display: block;
    opacity: 0.22;
     background:
        repeating-linear-gradient(
            to bottom,
            rgba(255,255,255,0.08) 0px,
            rgba(255,255,255,0.08) 1px,
            transparent 2px,
            transparent 5px
        );
     mix-blend-mode: screen;
     animation: crt-scanlines-up 7s linear infinite;
}
}


.crt-glitch-panel::after {
@font-face {
     content: "";
     font-family: 'Galmuri11';
    position: absolute;
     src: url('/fonts/Galmuri11-Bold.woff2') format('woff2');
    inset: 0;
     font-weight: 700;
    z-index: 4;
     font-display: block;
     pointer-events: none;
    opacity: 0;
    background:
        linear-gradient(
            to bottom,
            transparent 0%,
            rgba(255,255,255,0.18) 48%,
            rgba(212,90,162,0.28) 50%,
            rgba(90,120,255,0.16) 52%,
            transparent 56%
        );
     mix-blend-mode: screen;
     animation: crt-glitch-band-up 6.5s steps(1, end) infinite;
}
}


/* =========================================
@font-face {
  Horizontal CRT Warp
    font-family: 'BoldRound';
  ========================================= */
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2507-2@1.0/BoldDungGeunMo.woff2') format('woff2');
 
     font-weight: normal;
.crt-horizontal-warp {
     font-display: swap;
    position: relative;
     overflow: hidden;
     isolation: isolate;
}
}


.crt-horizontal-warp .crt-glow-content {
html body, html .liberty-content-main {
     animation: crt-base-drift 9s steps(1, end) infinite;
     font-family: 'Galmuri11', sans-serif !important;
     background-image:
     font-weight: 400 !important;
        repeating-linear-gradient(
     font-size: 12px;
            to bottom,
            rgba(120,180,255,0.00) 0px,
            rgba(120,180,255,0.00) 3px,
            rgba(120,180,255,0.05) 4px,
            rgba(255,80,170,0.035) 5px,
            rgba(120,180,255,0.00) 7px
        );
     background-blend-mode: screen;
}
}


.crt-horizontal-warp .crt-glow-content::after {
* { font-family: inherit !important; }
    content: "";
    position: absolute;
    inset: 0;
    z-index: 6;
    pointer-events: none;
    opacity: 0;
    background:
        linear-gradient(
            to right,
            transparent 0%,
            rgba(120,180,255,0.18) 10%,
            rgba(255,255,255,0.18) 48%,
            rgba(212,90,162,0.20) 78%,
            transparent 100%
        );
    mix-blend-mode: screen;
    animation: crt-wide-horizontal-tear 3.8s steps(1, end) infinite;
}


/* =========================================
.fa, .far, .fas, .fab, [class*="fa-"] {
  CRT Animations
     font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands', 'FontAwesome' !important;
  ========================================= */
 
@keyframes crt-scanlines-up {
     from {
        transform: translateY(0);
    }
 
    to {
        transform: translateY(-80px);
    }
}
}


@keyframes crt-glitch-band-up {
.mw-page-title-main, .mw-page-title-namespace,
    0%, 12%, 27%, 43%, 58%, 76%, 100% {
.liberty-content-main h1, .liberty-content-main h2,
        opacity: 0;
.liberty-content-main h3, .liberty-content-main h4,
        transform: translateY(100%);
.liberty-content-main h5, .liberty-content-main h6 {
    }
     font-family: 'BoldRound', sans-serif !important;
 
    13% {
        opacity: 0.75;
        transform: translateY(70%);
    }
 
    14% {
        opacity: 0.15;
        transform: translateY(62%) skewX(-2deg);
    }
 
    28% {
        opacity: 0.55;
        transform: translateY(35%);
    }
 
    29% {
        opacity: 0.18;
        transform: translateY(28%) skewX(2deg);
    }
 
    44% {
        opacity: 0.65;
        transform: translateY(10%);
    }
 
    45% {
        opacity: 0.12;
        transform: translateY(4%) skewX(-1deg);
    }
 
    59% {
        opacity: 0.5;
        transform: translateY(-20%);
    }
 
    60% {
        opacity: 0.16;
        transform: translateY(-26%) skewX(2deg);
     }
 
    77% {
        opacity: 0.55;
        transform: translateY(-55%);
    }
 
    78% {
        opacity: 0;
        transform: translateY(-70%);
    }
}
}


@keyframes crt-base-drift {
/* 배경 */
    0%, 88%, 100% {
html {
        transform: translateX(0);
     min-height: 100%;
        filter: drop-shadow(0 0 5px rgba(212,90,162,0.18));
     overflow-y: scroll;
    }
     background: #000000 !important;
 
     89% {
        transform: translateX(-2px) skewX(-0.4deg);
        filter:
            contrast(1.08)
            brightness(1.05)
            drop-shadow(0 0 7px rgba(212,90,162,0.24));
    }
 
    90% {
        transform: translateX(3px) skewX(0.5deg);
     }
 
    91% {
        transform: translateX(-1px);
     }
 
    92% {
        transform: translateX(0);
        filter: drop-shadow(0 0 5px rgba(212,90,162,0.18));
    }
}
}


@keyframes crt-wide-horizontal-tear {
body {
     0%, 8%, 17%, 29%, 43%, 61%, 78%, 100% {
     min-height: 100%;
        opacity: 0;
     margin: 0 !important;
        transform: translateX(0);
     background: #000000 !important;
        clip-path: inset(0 0 0 0);
    }
 
    9% {
        opacity: 0.45;
        transform: translateX(-18px) skewX(-3deg);
        clip-path: inset(18% 0 70% 0);
    }
 
    10% {
        opacity: 0.28;
        transform: translateX(24px) skewX(4deg);
        clip-path: inset(21% 0 64% 0);
    }
 
    18% {
        opacity: 0.38;
        transform: translateX(32px) skewX(5deg);
        clip-path: inset(42% 0 47% 0);
    }
 
    19% {
        opacity: 0.16;
        transform: translateX(-28px) skewX(-4deg);
        clip-path: inset(46% 0 43% 0);
    }
 
    30% {
        opacity: 0.48;
        transform: translateX(-36px) skewX(-6deg);
        clip-path: inset(58% 0 30% 0);
    }
 
    31% {
        opacity: 0.18;
        transform: translateX(20px) skewX(3deg);
        clip-path: inset(61% 0 27% 0);
    }
 
    44% {
        opacity: 0.36;
        transform: translateX(18px) skewX(3deg);
        clip-path: inset(8% 0 84% 0);
    }
 
    45% {
        opacity: 0.12;
        transform: translateX(-14px) skewX(-2deg);
        clip-path: inset(11% 0 80% 0);
    }
 
    62% {
        opacity: 0.44;
        transform: translateX(-42px) skewX(-7deg);
        clip-path: inset(73% 0 16% 0);
     }
 
    63% {
        opacity: 0.18;
        transform: translateX(30px) skewX(4deg);
        clip-path: inset(76% 0 12% 0);
    }
 
    79% {
        opacity: 0.42;
        transform: translateX(26px) skewX(4deg);
        clip-path: inset(31% 0 58% 0);
     }
 
    80% {
        opacity: 0.14;
        transform: translateX(-20px) skewX(-3deg);
        clip-path: inset(34% 0 54% 0);
    }
}
}


/* =========================================
/* 이전 JS 배경 레이어는 사용하지 않음 */
  Retro Horizon Grid Background
.WW-bg {
  ========================================= */
     display: none !important;
 
.retro-grid-bg {
     position: relative;
    overflow: hidden;
    border-radius: 5px;
    background:
        linear-gradient(
            to bottom,
            rgba(13, 6, 19, 0.98) 0%,
            rgba(25, 9, 33, 0.82) 44%,
            rgba(53, 19, 56, 0.50) 60%,
            rgba(4, 4, 7, 0.96) 61%,
            rgba(2, 2, 4, 1) 100%
        ) !important;
}
 
.retro-grid-bg .crt-glow-content {
    position: relative;
    z-index: 5;
}
 
.retro-grid-bg::before {
    content: "";
    position: absolute;
    left: -10%;
    right: -10%;
    top: 56%;
    height: 16%;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(
            ellipse at 50% 50%,
            rgba(230,210,225,0.28) 0%,
            rgba(204,94,168,0.30) 20%,
            rgba(184,56,142,0.20) 44%,
            transparent 76%
        );
    filter: blur(9px);
    opacity: 0.68;
}
 
.retro-grid-bg::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 61%;
    width: 150%;
    height: 115%;
    z-index: 2;
    pointer-events: none;
    background-image:
        linear-gradient(
            to right,
            rgba(204,64,156,0.72) 1px,
            transparent 1px
        ),
        linear-gradient(
            to bottom,
            rgba(204,64,156,0.70) 1px,
            transparent 1px
        );
    background-size:
        48px 100%,
        100% 26px;
    transform-origin: 50% 0%;
    transform:
        translateX(-50%)
        perspective(430px)
        rotateX(66deg);
    opacity: 0.78;
    filter:
        drop-shadow(0 0 3px rgba(204,64,156,0.58))
        drop-shadow(0 0 10px rgba(204,64,156,0.30));
    animation: retro-grid-flow 1.8s linear infinite;
    mask-image:
        linear-gradient(
            to bottom,
            transparent 0%,
            black 4%,
            black 82%,
            transparent 100%
        );
    -webkit-mask-image:
        linear-gradient(
            to bottom,
            transparent 0%,
            black 4%,
            black 82%,
            transparent 100%
        );
}
 
.retro-grid-bg .crt-glow-content::before {
    content: "";
    position: absolute;
    inset: -42px;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(
            ellipse at 50% 56%,
            rgba(220,220,225,0.05) 0%,
            rgba(204,64,156,0.07) 22%,
            rgba(96,152,204,0.05) 42%,
            transparent 70%
        );
    filter: blur(20px);
    opacity: 0.52;
}
}


@keyframes retro-grid-flow {
/* Canvas 기반 고정 하프톤 배경 */
    from {
#site-halftone-bg {
        background-position:
     position: fixed;
            0 0,
            0 0;
    }
 
    to {
        background-position:
            0 0,
            0 -26px;
    }
}
 
/* =========================================
  CRT Monitor Frame
  ========================================= */
 
.crt-monitor-frame {
    position: relative;
    box-sizing: border-box;
    padding: 34px 46px 38px 46px;
    border-radius: 22px;
    background:
        linear-gradient(145deg, #303030 0%, #181818 22%, #080808 58%, #202020 100%);
    border: 2px solid #2f2f2f;
    box-shadow:
        inset 0 2px 0 rgba(255,255,255,0.18),
        inset 0 -3px 0 rgba(0,0,0,0.85),
        inset 3px 0 0 rgba(255,255,255,0.06),
        inset -3px 0 0 rgba(0,0,0,0.75),
        0 0 0 3px #050505,
        0 0 0 5px #242424,
        0 12px 20px rgba(0,0,0,0.62),
        0 24px 42px rgba(0,0,0,0.52),
        0 42px 70px rgba(0,0,0,0.34);
}
 
.crt-monitor-frame::before {
    content: "";
     position: absolute;
     inset: 0;
     inset: 0;
     border-radius: 22px;
     width: 100vw;
    height: 100vh;
    z-index: 0;
     pointer-events: none;
     pointer-events: none;
    opacity: 0.16;
     background: #000000;
     background:
        repeating-linear-gradient(
            135deg,
            rgba(255,255,255,0.035) 0px,
            rgba(255,255,255,0.035) 1px,
            transparent 1px,
            transparent 5px
        ),
        radial-gradient(
            ellipse at 28% 12%,
            rgba(255,255,255,0.12) 0%,
            transparent 45%
        );
    mix-blend-mode: screen;
}
 
.crt-monitor-frame::after {
    content: none;
}
}


.crt-monitor-inner {
/* 배경 캔버스보다 실제 위키 UI가 위에 놓이도록 함 */
body > :not(#site-halftone-bg) {
     position: relative;
     position: relative;
     box-sizing: border-box;
     z-index: 1;
    padding: 18px;
    border-radius: 16px;
    background:
        linear-gradient(145deg, #050505 0%, #111 44%, #070707 100%);
    border: 1px solid #050505;
    box-shadow:
        inset 0 5px 14px rgba(0,0,0,0.95),
        inset 0 -2px 4px rgba(255,255,255,0.06),
        inset 4px 0 10px rgba(0,0,0,0.85),
        inset -4px 0 10px rgba(0,0,0,0.85),
        0 1px 0 rgba(255,255,255,0.12);
}
}


.crt-monitor-screen {
/* 관리자 툴은 기존 우선순위를 유지 */
     position: relative;
#dev-tools-panel {
    overflow: hidden;
     position: fixed !important;
    border-radius: 9px / 18px;
     z-index: 99998 !important;
    background: #050505;
     border: 2px solid #050505;
    box-shadow:
        inset 0 0 0 2px #151515,
        inset 0 0 22px rgba(0,0,0,0.95),
        inset 0 0 48px rgba(0,0,0,0.75),
        0 0 0 1px rgba(255,255,255,0.08),
        0 0 18px rgba(133,67,105,0.18);
}
}


.crt-monitor-screen::before {
/* OOUI/MediaWiki 팝업 계열 안전 보정 */
    content: "";
.oo-ui-windowManager,
    position: absolute;
.oo-ui-defaultOverlay,
    inset: 0;
.mw-notification-area,
    z-index: 20;
.mw-notification-area-overlay {
    pointer-events: none;
    border-radius: 9px / 18px;
    background:
        radial-gradient(
            ellipse at 50% 50%,
            transparent 0%,
            transparent 58%,
            rgba(0,0,0,0.22) 82%,
            rgba(0,0,0,0.58) 100%
        ),
        linear-gradient(
            105deg,
            transparent 0%,
            rgba(255,255,255,0.05) 18%,
            transparent 38%,
            transparent 100%
        );
    box-shadow:
        inset 0 0 28px rgba(255,255,255,0.04),
        inset 0 0 60px rgba(0,0,0,0.65);
}
 
.crt-monitor-screen .crt-glitch-panel,
.crt-monitor-screen .retro-grid-bg {
    border-radius: 8px / 16px;
}
 
.crt-monitor-screen .crt-glitch-panel {
    box-shadow: none;
}
 
#clbi-main-crt-hero-wrap {
    width: 100%;
    margin: 0 auto 14px auto;
}
 
#clbi-main-crt-hero {
    width: 100%;
}
 
/* =========================================
  Compact CRT Media Frame
  ========================================= */
 
.compact-crt-media {
     position: relative;
     position: relative;
     box-sizing: border-box;
     z-index: 100000 !important;
    width: fit-content;
    max-width: 100%;
    margin: 6px auto;
    padding: 10px 14px;
    border-radius: 10px;
    background:
        linear-gradient(
            145deg,
            #242424 0%,
            #141414 34%,
            #070707 70%,
            #171717 100%
        );
    border: 1px solid #2b2b2b;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.12),
        inset 0 -2px 0 rgba(0,0,0,0.82),
        inset 2px 0 0 rgba(255,255,255,0.035),
        inset -2px 0 0 rgba(0,0,0,0.62),
        0 0 0 2px #050505,
        0 0 0 3px #242424,
        0 4px 12px rgba(0,0,0,0.68);
    overflow: hidden;
}
}


.compact-crt-media .mw-default-size,
/* 스크롤 */
.compact-crt-media .mw-file-element,
html { overflow-y: scroll; }
.compact-crt-media img {
::-webkit-scrollbar { width: 6px; }
    position: relative;
::-webkit-scrollbar-track { background: #0a0909; }
    z-index: 1;
::-webkit-scrollbar-thumb { background: #854369; border-radius: 3px; }
}


.compact-crt-media img {
/* 제목 */
     max-width: 100%;
.mw-page-title-main {
     height: auto;
     border-radius: 5px 5px 0 0 !important;
     filter:
     padding: 7px !important;
        drop-shadow(0 1px 3px rgba(0,0,0,0.72))
     border: 2px solid #854369 !important;
        drop-shadow(0 0 4px rgba(255,255,255,0.06));
    border-bottom: none !important;
     animation: compact-crt-image-jitter 1.25s steps(1, end) infinite;
    background: #171717 !important;
    color: #e2e2e2 !important;
    display: inline-block !important;
     position: relative !important;
}
}


.compact-crt-media::before {
.mw-page-title-main::after {
     content: "";
     content: '';
     position: absolute;
     position: absolute;
     inset: 6px;
     bottom: -2px;
     z-index: 3;
     left: 0;
     border-radius: 7px;
     right: 0;
     pointer-events: none;
     height: 2px;
     background:
     background: #171717;
        radial-gradient(
            ellipse at 50% 50%,
            transparent 0%,
            transparent 54%,
            rgba(0,0,0,0.20) 78%,
            rgba(0,0,0,0.58) 100%
        ),
        linear-gradient(
            105deg,
            transparent 0%,
            rgba(255,255,255,0.040) 18%,
            transparent 38%,
            transparent 100%
        ),
        linear-gradient(
            to bottom,
            rgba(255,255,255,0.030) 0%,
            transparent 34%,
            rgba(0,0,0,0.26) 100%
        );
    box-shadow:
        inset 0 0 18px rgba(255,255,255,0.028),
        inset 0 0 38px rgba(0,0,0,0.66);
}
}


.compact-crt-media::after {
.mw-page-title-namespace {
     content: "";
     padding: 7px 0 7px 7px !important;
     position: absolute;
     border: 2px solid #854369 !important;
     inset: 6px;
     border-right: none !important;
     z-index: 4;
     border-bottom: none !important;
     border-radius: 7px;
     border-radius: 5px 0 0 0 !important;
     pointer-events: none;
     background: #171717 !important;
     opacity: 0.34;
     color: #e2e2e2 !important;
     background:
     display: inline-block !important;
        repeating-linear-gradient(
    vertical-align: bottom !important;
            to bottom,
     position: relative !important;
            rgba(255,255,255,0.070) 0px,
            rgba(255,255,255,0.070) 1px,
            transparent 2px,
            transparent 4px
        );
     mix-blend-mode: screen;
}
}


.compact-crt-static {
.mw-page-title-namespace::after {
    content: '';
     position: absolute;
     position: absolute;
     inset: 6px;
     bottom: -2px;
    z-index: 5;
     left: 0;
    border-radius: 7px;
     right: 0;
     pointer-events: none;
     height: 2px;
    opacity: 0.30;
     background: #171717;
     background:
        repeating-linear-gradient(
            to bottom,
            transparent 0px,
            transparent 4px,
            rgba(255,255,255,0.10) 5px,
            transparent 6px,
            transparent 10px
        ),
        linear-gradient(
            to bottom,
            transparent 0%,
            transparent 43%,
            rgba(255,255,255,0.11) 49%,
            rgba(180,180,180,0.08) 50%,
            rgba(90,90,90,0.08) 51%,
            transparent 56%,
            transparent 100%
        );
     mix-blend-mode: screen;
     animation:
        compact-crt-static-roll 3.8s linear infinite,
        compact-crt-static-flicker 1.7s steps(1, end) infinite;
}
}


.compact-crt-media:hover::after {
.mw-page-title-separator {
     opacity: 0.40;
     padding: 7px 0 !important;
}
     border-top: 2px solid #854369 !important;
 
     border-bottom: none !important;
.compact-crt-media:hover .compact-crt-static {
     background: #171717 !important;
     opacity: 0.36;
     color: #e2e2e2 !important;
}
     display: inline-block !important;
 
     vertical-align: bottom !important;
.compact-crt-media:hover img {
     position: relative !important;
    filter:
        drop-shadow(0 1px 3px rgba(0,0,0,0.78))
        drop-shadow(0 0 5px rgba(255,255,255,0.08));
}
 
@keyframes compact-crt-static-roll {
     from {
        background-position:
            0 0,
            0 110%;
     }
 
    to {
        background-position:
            0 -32px,
            0 -30%;
     }
}
 
@keyframes compact-crt-static-flicker {
    0%, 100% {
        transform: translateX(0);
        opacity: 0.26;
     }
 
    11% {
        transform: translateX(-1px);
        opacity: 0.36;
     }
 
    12% {
        transform: translateX(1px);
        opacity: 0.22;
    }
 
    36% {
        transform: translateX(0);
        opacity: 0.30;
    }
 
    37% {
        transform: translateX(1px);
        opacity: 0.38;
    }
 
    38% {
        transform: translateX(-1px);
        opacity: 0.24;
     }
 
    64% {
        transform: translateX(0);
        opacity: 0.32;
    }
 
    65% {
        transform: translateX(-1px);
        opacity: 0.40;
    }
 
    66% {
        transform: translateX(0);
        opacity: 0.26;
    }
}
}


@keyframes compact-crt-image-jitter {
.mw-page-title-separator::after {
    0%, 82%, 100% {
     content: '';
        transform: translateX(0);
    }
 
    83% {
        transform: translateX(-1px);
    }
 
    84% {
        transform: translateX(1px);
    }
 
    85% {
        transform: translateX(0);
    }
 
    92% {
        transform: translateX(1px);
    }
 
    93% {
        transform: translateX(-1px);
    }
 
    94% {
        transform: translateX(0);
    }
}
 
.compact-crt-media.compact-crt-portrait {
    padding: 4px 5px;
    border-radius: 8px;
}
 
.compact-crt-media.compact-crt-portrait::before {
    inset: 3px;
    border-radius: 5px;
}
 
.compact-crt-media.compact-crt-portrait::after {
    inset: 3px;
    border-radius: 5px;
}
 
.compact-crt-media.compact-crt-portrait .compact-crt-static {
    inset: 3px;
    border-radius: 5px;
}
 
.compact-crt-media.compact-crt-portrait img,
.compact-crt-media.compact-crt-portrait .mw-file-element {
    display: block;
}
 
/* =========================================
  Related Template Title
  ========================================= */
 
.related-template-title {
    position: relative;
    overflow: hidden;
    width: 100%;
    border-radius: 5px;
    background: #111111;
    color: #fff;
    box-shadow:
        inset 1px 0 0 #494949,
        inset 0 -1px 0 #555;
}
 
.related-template-title::before {
     content: "";
     position: absolute;
     position: absolute;
     inset: 0;
     bottom: -2px;
     z-index: 1;
     left: 0;
     pointer-events: none;
     right: 0;
     border-radius: inherit;
     height: 2px;
     background:
     background: #171717;
        linear-gradient(
            to bottom,
            rgba(255,255,255,0.070) 0%,
            rgba(255,255,255,0.026) 18%,
            transparent 45%,
            rgba(0,0,0,0.18) 100%
        ),
        linear-gradient(
            105deg,
            transparent 0%,
            rgba(255,255,255,0.045) 18%,
            transparent 36%,
            transparent 100%
        );
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.026),
        inset 0 0 14px rgba(0,0,0,0.30);
}
}


.related-template-title::after {
.mw-page-title-namespace ~ .mw-page-title-main {
    content: "";
     border-radius: 0 5px 0 0 !important;
    position: absolute;
     padding: 7px 7px 7px 0 !important;
    inset: 0;
     border-left: none !important;
    z-index: 2;
     vertical-align: bottom !important;
    pointer-events: none;
     border-radius: inherit;
     opacity: 0.20;
     background:
        repeating-linear-gradient(
            to bottom,
            rgba(255,255,255,0.055) 0px,
            rgba(255,255,255,0.055) 1px,
            transparent 2px,
            transparent 4px
        );
     mix-blend-mode: screen;
}
}


.related-template-title > * {
/* 특수 페이지 h1 */
     position: relative;
.liberty-content-header .title h1:not(:has(.mw-page-title-main)) {
     z-index: 3;
    background: #171717 !important;
    color: #e2e2e2 !important;
    border: 2px solid #854369 !important;
    border-bottom: none !important;
    border-radius: 5px 5px 0 0 !important;
    padding: 7px !important;
    display: inline-block !important;
     position: relative !important;
     font-family: 'BoldRound', sans-serif !important;
}
}


/* =========================================
.liberty-content-header .title h1:not(:has(.mw-page-title-main))::after {
  Page Top CRT Banner
     content: '';
  Template use:
  {{Banner|[[파일:example.png{{!}}1000px{{!}}link=]]|80px|20px}}
  2번 인자: 양수면 좌측 이동
  3번 인자: 양수면 아래 이동
  ========================================= */
 
.crt-page-monitor-frame {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    aspect-ratio: 2560 / 580;
    margin: 0 auto 16px auto;
    padding: 14px 20px 16px 20px;
    border-radius: 18px;
    background:
        linear-gradient(
            145deg,
            #151515 0%,
            #0b0b0b 28%,
            #050505 58%,
            #181818 100%
        );
    border: 2px solid #242424;
    box-shadow:
        inset 0 3px 8px rgba(0,0,0,0.78),
        inset 0 -2px 0 rgba(255,255,255,0.030),
        inset 4px 0 10px rgba(0,0,0,0.72),
        inset -3px 0 0 rgba(0,0,0,0.78),
        0 0 0 3px #050505,
        0 0 0 5px #242424;
    overflow: hidden;
}
 
.crt-page-monitor-frame::before {
     content: "";
     position: absolute;
     position: absolute;
     inset: 0;
     bottom: -2px;
    border-radius: 18px;
     left: 0;
     pointer-events: none;
     right: 0;
     opacity: 0.08;
     height: 2px;
     background:
     background: #171717;
        linear-gradient(
            to bottom,
            rgba(0,0,0,0.38) 0%,
            transparent 20%,
            transparent 100%
        ),
        linear-gradient(
            to right,
            rgba(0,0,0,0.34) 0%,
            transparent 18%,
            transparent 100%
        );
     mix-blend-mode: normal;
}
}


.crt-page-monitor-frame::after {
/* 대문 제목 숨기기 */
     content: none;
.mw-page-title-main.clbi-hide,
.mw-page-title-main.clbi-hide::after {
     display: none !important;
}
}


.crt-page-monitor-inner {
/* 본문 */
    position: relative;
.Liberty .content-wrapper .liberty-content .liberty-content-main,
    box-sizing: border-box;
.mw-datatable th, .mw-datatable tr:hover td, textarea,
    width: 100%;
div.mw-warning-with-logexcerpt, div.mw-lag-warn-high,
    height: 100%;
div.mw-cascadeprotectedwarning, div#mw-protect-cascadeon {
    padding: 6px;
     background: #171717;
    border-radius: 13px;
     color: #ffffff;
    background:
        linear-gradient(
            145deg,
            #020202 0%,
            #080808 45%,
            #030303 100%
        );
     border: 1px solid #020202;
     box-shadow:
        inset 0 11px 24px rgba(0,0,0,0.98),
        inset 0 -2px 3px rgba(255,255,255,0.028),
        inset 8px 0 20px rgba(0,0,0,0.94),
        inset -8px 0 20px rgba(0,0,0,0.94),
        0 0 0 1px rgba(255,255,255,0.030);
}
}


.crt-page-monitor-screen {
.mw-references-columns {
    position: relative;
     border-top: 1px solid #414141 !important;
    width: 100%;
    height: 100%;
    overflow: hidden;
     border-radius: 8px / 15px;
    background: #050505;
    border: 1px solid #060606;
    box-shadow:
        inset 0 0 18px rgba(0,0,0,0.88),
        inset 0 0 42px rgba(0,0,0,0.70),
        0 0 0 1px rgba(255,255,255,0.026);
}
}


.crt-page-monitor-image,
/* 문단 보더 */
.crt-page-monitor-image-base,
.Liberty .content-wrapper .liberty-content .liberty-content-main h1,
.crt-page-monitor-image-bloom,
.Liberty .content-wrapper .liberty-content .liberty-content-main h2,
.crt-page-monitor-slice {
.Liberty .content-wrapper .liberty-content .liberty-content-main h3,
     position: absolute;
.Liberty .content-wrapper .liberty-content .liberty-content-main h4,
     inset: 0;
.Liberty .content-wrapper .liberty-content .liberty-content-main h5,
     line-height: 0;
.Liberty .content-wrapper .liberty-content .liberty-content-main h6 {
     margin-top: 1rem;
     border-bottom: 1px solid #414141 !important;
    margin-bottom: 0.6rem;
     padding-bottom: 0.6rem;
    overflow-wrap: break-word;
     overflow: hidden;
     overflow: hidden;
}
}


.crt-page-monitor-image {
/* 링크 색상 */
    z-index: 1;
a { color: #d45aa2 !important; }
}
a:hover { color: #fdecf9 !important; }
a:active { color: #b3337d !important; }
a.new { color: #ba0000 !important; }
a.new:hover { color: #fe5757 !important; }
a.new:active { color: #ba0000 !important; }
a.external { color: #33b733 !important; text-decoration: underline !important; }
a.external:hover { color: #95ed95 !important; }
a.external:active { color: #33b733 !important; }
a.external:before { display: none !important; }


.crt-page-monitor-image-base {
/* CLBI 템플릿 링크 */
    z-index: 3;
.CLBI-template a { color: #d45aa2 !important; }
}
.CLBI-template a:hover { color: #fdecf9 !important; }
.CLBI-template a:active { color: #b3337d !important; }
.CLBI-template a.new { color: #ba0000 !important; }
.CLBI-template a.new:hover { color: #fe5757 !important; }
.CLBI-template a.new:active { color: #ba0000 !important; }
.CLBI-template a.external { color: #33b733 !important; }
.CLBI-template a.external:hover { color: #95ed95 !important; }
.CLBI-template a.external:active { color: #33b733 !important; }


.crt-page-monitor-image-bloom {
/* 편집 버튼 */
     z-index: 4;
.btn-secondary {
     pointer-events: none;
     color: #e2e2e2 !important;
     opacity: 0.38;
     background-color: #171717 !important;
     mix-blend-mode: normal;
     border: 2px solid #854369 !important;
     filter:
     border-bottom: none !important;
        blur(9px)
    border-radius: 0 !important;
        brightness(0.92)
     box-shadow: 0 2px 0 0 #854369 !important;
        contrast(1.02)
        saturate(1.04);
}
}


.crt-page-monitor-image-base a,
.btn-secondary:hover {
.crt-page-monitor-image-base span,
    color: #d46262 !important;
.crt-page-monitor-image-base .mw-file-description,
    background-color: #171717 !important;
.crt-page-monitor-image-base .mw-default-size,
     border: 2px solid #854369 !important;
.crt-page-monitor-image-base .mw-image-border,
     border-bottom: none !important;
.crt-page-monitor-image-bloom a,
     border-radius: 0 !important;
.crt-page-monitor-image-bloom span,
     box-shadow: 0 2px 0 0 #854369 !important;
.crt-page-monitor-image-bloom .mw-file-description,
.crt-page-monitor-image-bloom .mw-default-size,
.crt-page-monitor-image-bloom .mw-image-border,
.crt-page-monitor-slice a,
.crt-page-monitor-slice span,
.crt-page-monitor-slice .mw-file-description,
.crt-page-monitor-slice .mw-default-size,
.crt-page-monitor-slice .mw-image-border {
    position: absolute !important;
     inset: 0 !important;
     display: block !important;
     width: 100% !important;
     height: 100% !important;
}
}


.crt-page-monitor-image-base img,
.btn-group .btn:first-child { border-radius: 5px 0 0 0 !important; }
.crt-page-monitor-image-base .mw-file-element,
.btn-group .dropdown-toggle { border-radius: 0 5px 0 0 !important; }
.crt-page-monitor-image-bloom img,
.crt-page-monitor-image-bloom .mw-file-element,
.crt-page-monitor-slice img,
.crt-page-monitor-slice .mw-file-element,
.crt-page-monitor-slice-img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center center;
    border: 0 !important;
    transform:
        translate(
            calc(0px - var(--crt-img-left, 0px)),
            var(--crt-img-down, 0px)
        )
        scale(var(--crt-img-scale, 1.04));
    transform-origin: center center;
}


.crt-page-monitor-image-base img,
/* 기본 목차: 본문에서는 숨김 */
.crt-page-monitor-image-base .mw-file-element {
.liberty-content-main #toc,
     filter:
.liberty-content-main .toc {
        brightness(0.84)
     display: none !important;
        contrast(1.08)
        saturate(0.90);
}
}


.crt-page-monitor-image-bloom img,
/* 왼쪽 목차: 전체 내용 영역 */
.crt-page-monitor-image-bloom .mw-file-element {
#side-toc-box .toc-sidebar-content {
     transform:
     padding: 10px 12px !important;
        translate(
            calc(0px - var(--crt-img-left, 0px)),
            var(--crt-img-down, 0px)
        )
        scale(calc(var(--crt-img-scale, 1.04) + 0.02));
}
}


.crt-page-monitor-slice img,
/* 왼쪽 목차: 새로 생성한 목차 목록 */
.crt-page-monitor-slice .mw-file-element,
#side-toc-box .generated-toc {
.crt-page-monitor-slice-img {
     margin: 0 !important;
    filter:
     padding: 0 !important;
        brightness(0.96)
     list-style: none !important;
        contrast(1.18)
     background: transparent !important;
        saturate(0.82);
}
 
.crt-page-monitor-image::after {
    content: "";
    position: absolute;
    inset: -3%;
    z-index: 6;
    pointer-events: none;
    opacity: 0.16;
    background:
        radial-gradient(
            ellipse at 50% 45%,
            rgba(220,235,230,0.12) 0%,
            rgba(170,190,185,0.05) 34%,
            rgba(70,85,82,0.03) 62%,
            transparent 100%
        ),
        linear-gradient(
            to bottom,
            rgba(255,255,255,0.04) 0%,
            rgba(255,255,255,0.014) 28%,
            transparent 70%,
            rgba(0,0,0,0.08) 100%
        );
    mix-blend-mode: normal;
}
 
.crt-page-monitor-slice {
    z-index: 5;
    opacity: 0;
    pointer-events: none;
    mix-blend-mode: screen;
    will-change: transform, opacity, clip-path, filter;
}
 
.crt-page-monitor-slice-a {
    animation: crt-slice-tear-a 4.7s steps(1, end) infinite;
}
 
.crt-page-monitor-slice-b {
    animation: crt-slice-tear-b 6.1s steps(1, end) infinite;
}
 
.crt-page-monitor-slice-c {
    animation: crt-slice-tear-c 7.4s steps(1, end) infinite;
}
 
.crt-page-monitor-screen::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 20;
    pointer-events: none;
    border-radius: 8px / 15px;
    background:
        radial-gradient(
            ellipse at 50% 50%,
            transparent 0%,
            transparent 62%,
            rgba(0,0,0,0.16) 78%,
            rgba(0,0,0,0.42) 100%
        ),
        linear-gradient(
            to bottom,
            rgba(0,0,0,0.18) 0%,
            transparent 14%,
            transparent 82%,
            rgba(0,0,0,0.24) 100%
        ),
        linear-gradient(
            to right,
            rgba(0,0,0,0.18) 0%,
            transparent 8%,
            transparent 92%,
            rgba(0,0,0,0.18) 100%
        ),
        linear-gradient(
            105deg,
            transparent 0%,
            rgba(255,255,255,0.030) 18%,
            transparent 38%,
            transparent 100%
        );
    box-shadow:
        inset 0 0 20px rgba(255,255,255,0.018),
        inset 0 0 54px rgba(0,0,0,0.54);
}
 
.crt-page-monitor-screen::after {
     content: "";
    position: absolute;
    inset: -80px 0;
    z-index: 21;
    pointer-events: none;
    opacity: 0.20;
    background:
        repeating-linear-gradient(
            to bottom,
            rgba(255,255,255,0.08) 0px,
            rgba(255,255,255,0.08) 1px,
            transparent 2px,
            transparent 5px
        );
    mix-blend-mode: screen;
    animation: crt-scanlines-up 7s linear infinite;
}
 
.crt-page-monitor-glitch {
    position: absolute;
    inset: 0;
    z-index: 22;
    pointer-events: none;
    opacity: 0;
    background:
        linear-gradient(
            to bottom,
            transparent 0%,
            rgba(255,255,255,0.12) 48%,
            rgba(212,90,162,0.14) 50%,
            rgba(90,120,255,0.08) 52%,
            transparent 56%
        );
    mix-blend-mode: screen;
    animation: crt-soft-glitch-band 8.2s steps(1, end) infinite;
}
 
.crt-page-monitor-tear {
    position: absolute;
    inset: 0;
    z-index: 23;
    pointer-events: none;
    opacity: 0;
    background:
        linear-gradient(
            to right,
            transparent 0%,
            rgba(120,180,255,0.07) 10%,
            rgba(255,255,255,0.11) 48%,
            rgba(212,90,162,0.08) 78%,
            transparent 100%
        );
    mix-blend-mode: screen;
    animation: crt-soft-horizontal-tear 5.6s steps(1, end) infinite;
}
 
@keyframes crt-slice-tear-a {
    0%, 11%, 100% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 100% 0);
    }
 
    12% {
        opacity: 0.38;
        transform: translateX(-18px);
        clip-path: inset(17% 0 78% 0);
    }
 
    13% {
        opacity: 0.22;
        transform: translateX(11px);
        clip-path: inset(18% 0 77% 0);
        filter: hue-rotate(-8deg);
    }
 
    14% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 100% 0);
    }
 
    63% {
        opacity: 0.30;
        transform: translateX(9px);
        clip-path: inset(24% 0 70% 0);
    }
 
    64% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 100% 0);
    }
}
 
@keyframes crt-slice-tear-b {
    0%, 37%, 100% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 100% 0);
    }
 
    38% {
        opacity: 0.42;
        transform: translateX(24px);
        clip-path: inset(43% 0 50% 0);
    }
 
    39% {
        opacity: 0.26;
        transform: translateX(-14px);
        clip-path: inset(45% 0 48% 0);
        filter: hue-rotate(10deg) brightness(1.08);
    }
 
    40% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 100% 0);
    }
 
    78% {
        opacity: 0.34;
        transform: translateX(-20px);
        clip-path: inset(51% 0 43% 0);
    }
 
    79% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 100% 0);
    }
}
 
@keyframes crt-slice-tear-c {
    0%, 21%, 100% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 100% 0);
    }
 
    22% {
        opacity: 0.28;
        transform: translateX(-30px);
        clip-path: inset(67% 0 25% 0);
    }
 
    23% {
        opacity: 0.18;
        transform: translateX(16px);
        clip-path: inset(68% 0 23% 0);
        filter: contrast(1.25) brightness(1.06);
    }
 
    24% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 100% 0);
    }
 
    91% {
        opacity: 0.36;
        transform: translateX(18px);
        clip-path: inset(73% 0 18% 0);
    }
 
    92% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 100% 0);
    }
}
 
@keyframes crt-soft-glitch-band {
    0%, 52%, 100% {
        opacity: 0;
        transform: translateY(80%);
    }
 
    53% {
        opacity: 0.42;
        transform: translateY(36%);
    }
 
    54% {
        opacity: 0.16;
        transform: translateY(20%) skewX(-1deg);
    }
 
    55% {
        opacity: 0;
        transform: translateY(-20%);
    }
}
 
@keyframes crt-soft-horizontal-tear {
    0%, 68%, 100% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 0 0);
    }
 
    69% {
        opacity: 0.32;
        transform: translateX(-16px);
        clip-path: inset(34% 0 58% 0);
    }
 
    70% {
        opacity: 0.18;
        transform: translateX(12px);
        clip-path: inset(37% 0 55% 0);
    }
 
    71% {
        opacity: 0;
        transform: translateX(0);
        clip-path: inset(0 0 0 0);
    }
}
 
@media (prefers-reduced-motion: reduce) {
    .crt-page-monitor-slice-a,
    .crt-page-monitor-slice-b,
    .crt-page-monitor-slice-c,
    .crt-page-monitor-screen::after,
    .crt-page-monitor-glitch,
    .crt-page-monitor-tear {
        animation: none !important;
     }
 
    .crt-page-monitor-slice,
    .crt-page-monitor-glitch,
    .crt-page-monitor-tear {
        opacity: 0 !important;
     }
}
 
/* =========================================
  Historical Events Timeline
  ========================================= */
 
.timeline-event {
    position: relative;
    display: block;
    width: 100%;
    box-sizing: border-box;
    line-height: inherit;
    text-align: center;
}
 
.timeline-title {
    position: relative;
    z-index: 2;
    display: inline-block;
    text-align: center;
}
 
.timeline-event.he-linked::before {
    content: "";
    position: absolute;
    top: -2px;
    left: 2px;
    right: 2px;
    height: 3px;
    border-radius: 999px;
    pointer-events: none;
     background:
        linear-gradient(
            to right,
            transparent 0%,
            color-mix(in srgb, var(--he-color) 18%, transparent) 8%,
            color-mix(in srgb, var(--he-color) 92%, transparent) 14%,
            color-mix(in srgb, var(--he-color) 92%, transparent) 86%,
            color-mix(in srgb, var(--he-color) 18%, transparent) 92%,
            transparent 100%
        );
    box-shadow:
        0 0 7px color-mix(in srgb, var(--he-color) 28%, transparent);
}
 
.timeline-event.he-root {
    overflow: visible;
}
 
.timeline-event.he-root::before {
    content: "";
    position: absolute;
    left: 6%;
    right: 6%;
    top: 50%;
    height: 16px;
    transform: translateY(-50%);
    border-radius: 999px;
    pointer-events: none;
    background:
        linear-gradient(
            to bottom,
            rgba(255,255,255,0.05) 0%,
            rgba(0,0,0,0.24) 100%
        ),
        linear-gradient(
            to right,
            transparent 0%,
            color-mix(in srgb, var(--he-color) 10%, transparent) 8%,
            color-mix(in srgb, var(--he-color) 24%, transparent) 18%,
            color-mix(in srgb, var(--he-color) 36%, transparent) 50%,
            color-mix(in srgb, var(--he-color) 24%, transparent) 82%,
            color-mix(in srgb, var(--he-color) 10%, transparent) 92%,
            transparent 100%
        );
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.05),
        inset 0 -1px 0 rgba(0,0,0,0.42),
        0 0 8px color-mix(in srgb, var(--he-color) 16%, transparent);
    -webkit-mask-image:
        linear-gradient(
            to right,
            transparent 0%,
            black 10%,
            black 90%,
            transparent 100%
        );
    mask-image:
        linear-gradient(
            to right,
            transparent 0%,
            black 10%,
            black 90%,
            transparent 100%
        );
}
 
.timeline-event.he-root::after {
    content: "";
    position: absolute;
    left: 10%;
    right: 10%;
    top: 50%;
    height: 22px;
    transform: translateY(-50%);
    pointer-events: none;
    background:
        linear-gradient(
            to right,
            transparent 0%,
            color-mix(in srgb, var(--he-color) 48%, transparent) 16%,
            color-mix(in srgb, var(--he-color) 48%, transparent) 84%,
            transparent 100%
        ) top center / 100% 1px no-repeat,
        linear-gradient(
            to right,
            transparent 0%,
            color-mix(in srgb, var(--he-color) 24%, transparent) 16%,
            color-mix(in srgb, var(--he-color) 24%, transparent) 84%,
            transparent 100%
        ) bottom center / 100% 1px no-repeat;
}
 
.timeline-event.he-root .timeline-title {
    text-shadow:
        0 0 4px color-mix(in srgb, var(--he-color) 34%, transparent),
        0 0 9px color-mix(in srgb, var(--he-color) 16%, transparent);
}
 
/* =========================================
  Tree List
  ========================================= */
 
.tree-container {
    margin: 0;
    padding: 0;
}
 
.tree-node {
    position: relative;
    padding-left: 20px;
    margin: 0;
    text-indent: 0;
    line-height: 1.55;
}
 
.tree-node::before {
    content: "";
    position: absolute;
    top: 0;
    left: 7px;
    width: 1.2px;
    height: 100%;
    background: #7F7F7F;
}
 
.tree-node::after {
    content: "";
    position: absolute;
    top: 12px;
    left: 7px;
    width: 8px;
    height: 0;
    border-top: 1.2px solid #7F7F7F;
}
 
.tree-node:last-of-type::before {
    height: 12px;
}
 
/* =========================================
  Meeting Composition Panel
  ========================================= */
 
.meeting-panel {
    position: relative;
    isolation: isolate;
    z-index: 0;
    width: calc(100% + 4px);
    left: -2px;
    margin: 0 auto 15px auto;
    border: 2px solid #1a1a1a;
    border-radius: 5px;
    background:
        radial-gradient(
            ellipse at 50% 35%,
            rgba(255,255,255,0.025) 0%,
            transparent 46%
        ),
        linear-gradient(
            to bottom,
            #1A1A1A 0%,
            #181818 52%,
            #151515 100%
        );
    color: #FFF;
    box-shadow:
        0 4px 12px #000;
    text-align: center;
    font-size: 11px;
    box-sizing: border-box;
    overflow: visible;
}
 
.meeting-panel::before {
    content: "";
    position: absolute;
    inset: -5px;
    z-index: -2;
    border-radius: 8px;
    background: #854369;
    pointer-events: none;
}
 
.meeting-panel::after {
    content: "";
    position: absolute;
    inset: -3px;
    z-index: -1;
    border-radius: 7px;
    background: #1A1A1A;
    pointer-events: none;
}
 
.meeting-panel-body {
    width: 100%;
    color: #E4E4E4;
    padding: 4.5px 9px 9px 9px;
    box-sizing: border-box;
    border-radius: 3px;
    background: transparent;
    overflow: hidden;
}
 
.meeting-title-wrap {
    width: 100%;
    max-width: 760px;
    margin: 5px auto 8px auto;
}
 
.meeting-title-wrap .infobox-glass-title {
    top: 0;
    margin-top: 0;
    padding: 5px;
    line-height: 1.2;
}
 
.meeting-title-table {
    width: auto;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    border: 2px solid transparent;
    border-collapse: collapse;
    table-layout: auto;
}
 
.meeting-title-table td,
.meeting-title-table th {
    background: none !important;
     border: none !important;
     border: none !important;
     vertical-align: middle !important;
     box-shadow: none !important;
}
 
.meeting-title-table .meeting-title-image-left {
    width: auto;
    text-align: right !important;
    padding: 0 6px 0 0 !important;
    line-height: 0;
    white-space: nowrap;
}
 
.meeting-title-table .meeting-title-image-right {
    width: auto;
    text-align: left !important;
    padding: 0 0 0 6px !important;
    line-height: 0;
    white-space: nowrap;
}
}


.meeting-title-table .meeting-title-cell {
/* 왼쪽 목차: 목록 항목 */
     width: auto;
#side-toc-box .generated-toc li {
    line-height: 1.15 !important;
     margin: 0 0 4px 0 !important;
    background: none !important;
    text-align: center !important;
    white-space: nowrap;
     padding: 0 !important;
     padding: 0 !important;
    background: transparent !important;
    line-height: 1.5 !important;
}
}


.meeting-title-image-left img,
#side-toc-box .generated-toc li:last-child {
.meeting-title-image-right img,
     margin-bottom: 0 !important;
.meeting-title-image-left .mw-file-element,
.meeting-title-image-right .mw-file-element {
     display: block;
    border: 0 !important;
    vertical-align: middle;
    filter:
        drop-shadow(0 1px 2px rgba(0,0,0,0.75))
        drop-shadow(0 0 3px rgba(255,255,255,0.08));
}
}


.meeting-title-name {
/* 왼쪽 목차: 링크 박스 */
     display: block;
#side-toc-box .generated-toc a {
     line-height: 1.15;
     display: block !important;
     text-align: center;
     color: #E2E2E2 !important;
    text-decoration: none !important;
    padding: 4px 6px !important;
     border-radius: 4px !important;
    overflow: hidden !important;
}
}


.meeting-title-meta {
#side-toc-box .generated-toc a:hover {
     display: block;
     background: rgba(133, 67, 105, 0.18) !important;
    margin-top: 1px;
     color: #ffffff !important;
     color: #7F7F7F;
    font-size: 10px;
    font-weight: normal;
    line-height: 1.15;
    text-align: center;
}
}


.meeting-seatmap {
/* 왼쪽 목차: 긴 제목 감싸는 영역 */
     position: relative;
#side-toc-box .toc-scroll-wrap {
     margin: 0 auto;
     display: block !important;
     padding: 5px 0 4px 0;
     width: 100% !important;
     background: transparent;
     overflow: hidden !important;
    border-radius: 0;
     position: relative !important;
    overflow: visible;
}
}


.meeting-seatmap::before {
/* 왼쪽 목차: 실제로 스크롤되는 긴 제목에만 오른쪽 페이드 적용 */
     content: "";
#side-toc-box .toc-scroll-wrap.is-scrolling {
    position: absolute;
     mask-image: linear-gradient(to right, black 88%, transparent 100%) !important;
    left: 50%;
     -webkit-mask-image: linear-gradient(to right, black 88%, transparent 100%) !important;
    top: 84px;
    bottom: 145px;
    width: 2px;
    transform: translateX(-50%);
    background:
        linear-gradient(
            to bottom,
            transparent 0%,
            rgba(65,65,65,0.72) 18%,
            #414141 50%,
            rgba(65,65,65,0.72) 82%,
            transparent 100%
        );
     box-shadow: 0 0 6px rgba(65,65,65,0.16);
    pointer-events: none;
}
}


.meeting-table-zone::before {
/* 왼쪽 목차: 실제 스크롤되는 텍스트 */
     content: "";
#side-toc-box .toc-scroll-text {
    position: absolute;
     display: inline-block !important;
    left: 7%;
     white-space: nowrap !important;
    right: 7%;
     max-width: none !important;
    top: 50%;
    height: 2px;
    transform: translateY(-50%);
     background:
        linear-gradient(
            to right,
            transparent 0%,
            rgba(65,65,65,0.72) 14%,
            #414141 50%,
            rgba(65,65,65,0.72) 86%,
            transparent 100%
        );
    box-shadow: 0 0 6px rgba(65,65,65,0.14);
     pointer-events: none;
}
}


.meeting-axis-label {
/* 왼쪽 목차: h2 항목 */
    position: relative;
#side-toc-box .toc-level-2 .toc-scroll-text {
    z-index: 4;
     font-size: 12px !important;
    display: inline-block;
     font-weight: 700 !important;
    min-width: 42px;
     color: #E2E2E2 !important;
    margin: 2px auto 4px auto;
    padding: 2px 9px;
    border-radius: 5px;
    background: #0c0c0c;
    color: #E4E4E4;
    font-weight: bold;
    line-height: 1.35;
    box-shadow:
        inset 0 -1px 0 #525252,
        0 0 0 3px #1A1A1A;
}
 
.meeting-chair-line {
     position: relative;
    z-index: 3;
     display: flex;
    justify-content: center;
     margin: 0 0 6px 0;
    background: transparent;
}
}


.meeting-table-zone {
/* 왼쪽 목차: h3 항목 */
    position: relative;
#side-toc-box .toc-level-3 {
    z-index: 3;
     padding-left: 12px !important;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr);
    align-items: center;
    width: 100%;
    max-width: 980px;
     min-height: 210px;
    margin: 0 auto;
    background: transparent;
}
}


.meeting-side {
#side-toc-box .toc-level-3 .toc-scroll-text {
    display: flex;
     font-size: 11px !important;
    flex-wrap: nowrap;
     font-weight: 400 !important;
    justify-content: center;
     color: #b8b8b8 !important;
     align-items: center;
    gap: 0;
     min-width: 0;
     background: transparent;
}
}


.meeting-side-left {
#side-toc-box .toc-level-3 a:hover .toc-scroll-text {
     padding-right: 4px;
     color: #ffffff !important;
}
}


.meeting-side-right {
/* 왼쪽 목차: 문서 스크롤 중에도 목차가 화면 안에 남도록 처리 */
     padding-left: 4px;
#clbi-left-sidebar {
     align-self: stretch !important;
}
}


.meeting-center-spine {
/* 왼쪽 목차: 목차 박스만 화면 상단에 고정되듯 따라오게 함 */
    position: relative;
#side-toc-box {
    display: flex;
     position: sticky !important;
    align-items: center;
     top: 10px !important;
    justify-content: center;
     z-index: 1001;
    align-self: stretch;
     max-height: calc(100vh - 40px);
    min-height: 210px;
     overflow: hidden;
    z-index: 4;
    background: transparent;
}
 
.meeting-center-spine .meeting-axis-label {
     position: absolute;
     top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    writing-mode: vertical-rl;
    text-orientation: mixed;
    min-width: 0;
    min-height: 42px;
    margin: 0;
    padding: 8px 3px;
}
 
.meeting-advisory-zone {
    position: relative;
     z-index: 3;
    margin-top: 6px;
    background: transparent;
}
 
.meeting-advisory-zone > .meeting-axis-label {
    margin-bottom: 6px;
}
 
.meeting-advisory-grid {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 0;
    width: 100%;
     max-width: 760px;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
    background: transparent;
}
 
.meeting-advisory-grid::before {
    content: "";
    position: absolute;
    left: 7%;
    right: 7%;
    top: 94px;
    height: 2px;
    background:
        linear-gradient(
            to right,
            transparent 0%,
            rgba(65,65,65,0.72) 14%,
            #414141 50%,
            rgba(65,65,65,0.72) 86%,
            transparent 100%
        );
    box-shadow: 0 0 6px rgba(65,65,65,0.14);
     pointer-events: none;
}
 
.meeting-person-card {
    position: relative;
    z-index: 3;
    background: transparent;
    color: #fff;
    text-align: center;
    vertical-align: top;
    padding: 0;
    box-sizing: border-box;
}
 
.meeting-chair-card {
    width: 180px;
}
 
.meeting-side .meeting-person-card {
    width: 50%;
    min-width: 0;
}
 
.meeting-advisory-card {
    width: 33.333%;
    min-width: 0;
}
 
.meeting-person-inner {
    display: flex;
    justify-content: center;
    padding: 0;
    background: transparent;
}
 
.meeting-person-stack {
    width: 90%;
    margin-top: 3px;
    background: transparent;
    display: flex;
    flex-direction: column;
    align-items: center;
}
 
.meeting-side .meeting-person-stack {
    width: 94%;
}
 
.meeting-advisory-card .meeting-person-stack {
    width: 92%;
}
 
.meeting-person-stack .compact-crt-media {
    margin-left: auto;
    margin-right: auto;
    flex: 0 0 auto;
}
 
.meeting-person-stack .office-card-name-cell {
    width: 170px;
    max-width: 100%;
    margin-top: 6px;
    margin-left: auto;
    margin-right: auto;
    flex: 0 0 auto;
}
 
.meeting-chair-card .office-card-name-cell {
    width: 170px;
}
 
.meeting-advisory-card .office-card-name-cell {
    width: 170px;
}
 
.meeting-office {
    display: block;
    margin-top: 2px;
    color: #7F7F7F;
    font-size: 10px;
    line-height: 1.3;
    font-weight: normal;
}
}


/* =====================================================================
/* 왼쪽 목차: 항목이 많을 때 목차 내부만 스크롤되게 함 */
  ScreenHeader + Screen Bezel Module
#side-toc-box .toc-sidebar-content {
 
    max-height: calc(100vh - 88px);
  Template.css에서 교체할 범위:
    overflow-y: auto;
    [/* ScreenHeader */] 주석부터
     overflow-x: hidden;
    [/* Document View System — doc-* */] 주석 바로 위까지
  전체를 지우고 이 파일 내용으로 교체하세요.
  ===================================================================== */
 
/* =========================================
  ScreenHeader — 컨테이너 & 레이아웃 제어
  ========================================= */
 
.liberty-content:has(.screen-header) .liberty-content-header .title {
     display: none !important;
}
}


/* screen-header 문서 — 컨테이너를 베젤로 */
/* 분류 칸 */
.Liberty .content-wrapper .liberty-content:has(.screen-header) .liberty-content-main {
.catlinks {
    position: relative !important;
    box-sizing: border-box !important;
    border: 2px solid #854369 !important;
    border-radius: 5px !important;
    background: linear-gradient(
        160deg,
        #2e2e2e 0%,
        #1e1e1e 30%,
        #121212 65%,
        #1a1a1a 100%
    ) !important;
    box-shadow:
        inset 0 3px 0 rgba(255,255,255,0.10),
        inset 0 -4px 0 rgba(0,0,0,0.85),
        inset 4px 0 0 rgba(255,255,255,0.04),
        inset -4px 0 0 rgba(0,0,0,0.70) !important;
    overflow: hidden !important;
}
 
/* 상단 빛반사 */
.Liberty .content-wrapper .liberty-content:has(.screen-header) .liberty-content-main::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 40%;
    border-radius: 5px 5px 0 0;
    background: linear-gradient(to bottom, rgba(255,255,255,0.06) 0%, transparent 100%);
    pointer-events: none;
    z-index: 0;
}
 
.liberty-content:has(.screen-header) .screen-title-plate,
.liberty-content:has(.screen-header) .screen-header-frame,
.liberty-content:has(.screen-header) .screen-header-inner,
.liberty-content:has(.screen-header) .screen-header-media,
.liberty-content:has(.screen-header) .screen-header-vignette,
.liberty-content:has(.screen-header) .screen-header-scanline,
.liberty-content:has(.screen-header) .screen-header-mask,
.liberty-content:has(.screen-header) .screen-header-glass,
.liberty-content:has(.screen-header) .screen-header-subtitle {
    display: none !important;
}
 
/* =========================================
  screen-header
  베젤 좌우 padding(24px)을 정확히 상쇄
  width: calc(100% + 48px), margin: 0 -24px
  ========================================= */
 
.screen-header {
     position: relative !important;
     position: relative !important;
    z-index: 49 !important;
    display: block !important;
     width: 100% !important;
     width: 100% !important;
     height: var(--screen-header-height, 360px) !important;
     left: auto !important;
     margin: 0 !important;
    right: auto !important;
     padding: 8px 8px 4px 8px !important;
     margin: 4px 0 0 0 !important;
     padding: 4px 7px !important;
     box-sizing: border-box !important;
     box-sizing: border-box !important;
    overflow: hidden !important;
     background: #1d1d1d !important;
     background: #050505 !important;
     border: 1px solid #050505 !important;
     border: 0 !important;
     border-radius: 0 !important;
    border-bottom: 0 !important;
    isolation: isolate !important;
}
 
.screen-header-recess {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 4px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    background: #050505 !important;
    border: 1px solid rgba(255,255,255,0.035) !important;
     border-radius: 6px !important;
     box-shadow:
     box-shadow:
         inset 0 18px 30px rgba(0,0,0,0.82),
         inset 0 1px 0 #555555,
         inset 0 -9px 16px rgba(255,255,255,0.026),
         inset -1px 0 0 #555555,
         inset 18px 0 30px rgba(0,0,0,0.66),
         inset 1px 0 0 #101010,
         inset -18px 0 30px rgba(0,0,0,0.66),
         inset 0 -1px 0 #101010 !important;
        0 1px 0 rgba(255,255,255,0.030),
    color: #e2e2e2 !important;
        0 -1px 0 rgba(0,0,0,0.70) !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    text-shadow: 1px 1px 0 #000 !important;
}
}


.screen-header-recess::before {
.catlinks .mw-normal-catlinks,
    content: "";
.catlinks .mw-hidden-catlinks {
    position: absolute;
     display: block !important;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    opacity: 0.10;
    background: repeating-linear-gradient(
        135deg,
        rgba(255,255,255,0.030) 0px,
        rgba(255,255,255,0.030) 1px,
        transparent 1px,
        transparent 5px
    );
    mix-blend-mode: screen;
}
 
.screen-header-recess::after {
     content: "";
    position: absolute;
    inset: 14px;
    z-index: 12;
    pointer-events: none;
    border-radius: 0;
    box-shadow:
        0 -20px 32px rgba(0,0,0,0.86),
        0 12px 18px rgba(255,255,255,0.024),
        -20px 0 32px rgba(0,0,0,0.78),
        20px 0 32px rgba(0,0,0,0.78),
        inset 0 0 0 1px rgba(255,255,255,0.018) !important;
}
 
.screen-header .screen-header-crt {
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
     margin: 0 !important;
     margin: 0 !important;
     padding: 0 !important;
     padding: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
     background: transparent !important;
     background: transparent !important;
     border: 0 !important;
     border: 0 !important;
     border-radius: 0 !important;
     color: #e2e2e2 !important;
     box-shadow: none !important;
    font-size: 12px !important;
     line-height: 1.5 !important;
}
}


.screen-header .screen-header-crt::before,
.catlinks .mw-hidden-catlinks {
.screen-header .screen-header-crt::after {
     margin-top: 4px !important;
     content: none !important;
}
}


.screen-header .crt-page-monitor-inner {
.catlinks ul {
     position: relative !important;
     display: inline !important;
    width: 100% !important;
    height: 100% !important;
    padding: 5px !important;
     margin: 0 !important;
     margin: 0 !important;
     box-sizing: border-box !important;
     padding: 0 !important;
    border-radius: 0 !important;
     list-style: none !important;
     background: linear-gradient(
     list-style-image: none !important;
        145deg,
     background: transparent !important;
        #050505 0%,
        #0d0d0d 46%,
        #050505 100%
    ) !important;
    border: 1px solid #050505 !important;
     box-shadow:
        inset 0 10px 20px rgba(0,0,0,0.97),
        inset 0 -2px 3px rgba(255,255,255,0.030),
        inset 8px 0 18px rgba(0,0,0,0.90),
        inset -8px 0 18px rgba(0,0,0,0.90) !important;
}
 
.screen-header .crt-page-monitor-screen {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    border-radius: 0 !important;
    background: #050505 !important;
    border: 1px solid #050505 !important;
    box-shadow:
        inset 0 0 0 1px #111,
        inset 0 0 24px rgba(0,0,0,0.94),
        inset 0 0 64px rgba(0,0,0,0.80),
        inset 0 0 118px rgba(0,0,0,0.50),
        0 0 0 1px rgba(255,255,255,0.030) !important;
}
 
.screen-header .crt-page-monitor-image,
.screen-header .crt-page-monitor-image-base,
.screen-header .crt-page-monitor-image-bloom,
.screen-header .crt-page-monitor-slice {
    position: absolute !important;
    inset: 0 !important;
    border-radius: 0 !important;
}
 
.screen-header .crt-page-monitor-image-base a,
.screen-header .crt-page-monitor-image-base span,
.screen-header .crt-page-monitor-image-base .mw-file-description,
.screen-header .crt-page-monitor-image-base .mw-default-size,
.screen-header .crt-page-monitor-image-base .mw-image-border,
.screen-header .crt-page-monitor-image-bloom a,
.screen-header .crt-page-monitor-image-bloom span,
.screen-header .crt-page-monitor-image-bloom .mw-file-description,
.screen-header .crt-page-monitor-image-bloom .mw-default-size,
.screen-header .crt-page-monitor-image-bloom .mw-image-border,
.screen-header .crt-page-monitor-slice a,
.screen-header .crt-page-monitor-slice span,
.screen-header .crt-page-monitor-slice .mw-file-description,
.screen-header .crt-page-monitor-slice .mw-default-size,
.screen-header .crt-page-monitor-slice .mw-image-border {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}
 
.screen-header .crt-page-monitor-image-base img,
.screen-header .crt-page-monitor-image-base .mw-file-element,
.screen-header .crt-page-monitor-image-bloom img,
.screen-header .crt-page-monitor-image-bloom .mw-file-element,
.screen-header .crt-page-monitor-slice img,
.screen-header .crt-page-monitor-slice .mw-file-element,
.screen-header .crt-page-monitor-slice-img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
     max-height: none !important;
    object-fit: cover !important;
    object-position: var(--screen-image-position, center center) !important;
     border: 0 !important;
     border: 0 !important;
    border-radius: 0 !important;
}
.screen-header .crt-page-monitor-screen::before {
    content: "" !important;
    position: absolute !important;
    inset: -4px !important;
    z-index: 20 !important;
    pointer-events: none !important;
    border-radius: 0 !important;
    background:
        radial-gradient(
            ellipse at 50% 50%,
            transparent 0%,
            transparent 62%,
            rgba(0,0,0,0.18) 78%,
            rgba(0,0,0,0.48) 100%
        ),
        linear-gradient(
            to bottom,
            rgba(0,0,0,0.20) 0%,
            transparent 14%,
            transparent 82%,
            rgba(0,0,0,0.28) 100%
        ),
        linear-gradient(
            to right,
            rgba(0,0,0,0.20) 0%,
            transparent 8%,
            transparent 92%,
            rgba(0,0,0,0.20) 100%
        ),
        linear-gradient(
            105deg,
            transparent 0%,
            rgba(255,255,255,0.030) 18%,
            transparent 38%,
            transparent 100%
        ) !important;
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.018),
        inset 0 0 24px rgba(255,255,255,0.015),
        inset 0 0 74px rgba(0,0,0,0.64),
        inset 0 22px 38px rgba(0,0,0,0.60),
        inset 0 -20px 36px rgba(0,0,0,0.44),
        inset 18px 0 36px rgba(0,0,0,0.56),
        inset -18px 0 36px rgba(0,0,0,0.56) !important;
}
.screen-header .crt-page-monitor-screen::after {
    content: "" !important;
    position: absolute !important;
    inset: -80px -4px !important;
    z-index: 21 !important;
    pointer-events: none !important;
    opacity: 0.22 !important;
    border-radius: 0 !important;
    background: repeating-linear-gradient(
        to bottom,
        rgba(255,255,255,0.08) 0px,
        rgba(255,255,255,0.08) 1px,
        transparent 2px,
        transparent 5px
    ) !important;
    mix-blend-mode: screen !important;
    animation: crt-scanlines-up 7s linear infinite !important;
}
}


.screen-header .crt-page-monitor-glitch,
.catlinks li {
.screen-header .crt-page-monitor-tear {
     display: inline !important;
     inset: -4px !important;
     margin: 0 0 0 4px !important;
     border-radius: 0 !important;
}
 
.screen-header .crt-page-monitor-glitch { z-index: 22 !important; }
.screen-header .crt-page-monitor-tear  { z-index: 23 !important; }
 
.screen-header-title {
    position: absolute !important;
    left: 5px !important;
    bottom: 5px !important;
    z-index: 40 !important;
    margin: 0 !important;
     padding: 0 !important;
     padding: 0 !important;
     max-width: calc(100% - 10px) !important;
     list-style: none !important;
     box-sizing: border-box !important;
     list-style-image: none !important;
     background: transparent !important;
     background: transparent !important;
     border: 0 !important;
     border: 0 !important;
     box-shadow: none !important;
     color: #e2e2e2 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}
}


.screen-header-title-main {
.catlinks li::before,
    margin: 0 !important;
.catlinks li::after {
    padding: 0 0 8px 10px !important;
     content: none !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #ffffff !important;
    font-family: 'BoldRound', sans-serif !important;
    font-size: 40px !important;
    font-weight: 700 !important;
    line-height: 0.95 !important;
    letter-spacing: 0.06em !important;
    text-shadow:
        3px 3px 0 rgba(0,0,0,0.98),
        0 0 6px rgba(0,0,0,0.98),
        0 0 14px rgba(0,0,0,0.95),
        0 0 26px rgba(0,0,0,0.92),
        -1px 0 0 rgba(80,160,255,0.24),
        1px 0 0 rgba(255,55,90,0.22) !important;
     white-space: nowrap !important;
}
}


.screen-header-subtitle {
.catlinks a {
     display: none !important;
     display: inline !important;
    color: #c8c8c8 !important;
    text-decoration: none !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
}
}


/* =========================================
.catlinks a:hover {
  screen-body
     color: #ffffff !important;
  베젤 좌우 padding(24px)을 정확히 상쇄
     text-decoration: none !important;
  하단 -28px은 베젤 하단 padding을 상쇄해서 베젤 닫음
  ========================================= */
 
.screen-header + .screen-body {
     margin-top: 0 !important;
     border-top: 0 !important;
}
 
.screen-body {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 4px 8px 4px 8px;
    box-sizing: border-box;
    background: #171717;
    overflow: hidden;
}
}


/* =========================================
/* 분류 문서 */
  Document View System — doc-*
.mw-category-generated { color: #e2e2e2 !important; }
  ========================================= */
.mw-category-generated a { color: #854369 !important; }
.CategoryTreeToggle { color: #854369 !important; }
.number-link { color: #854369 !important; }


.doc-body {
/* 편집 섹션 */
     position: relative;
.mw-editsection {
     z-index: 3;
     color: #b45c8f !important;
     box-sizing: border-box;
     float: right;
    width: 100%;
     font-weight: bold;
    padding: 0;
    background: transparent;
}
}


/* =========================================
/* 넘겨주기 */
  doc-header
.mw-redirectedfrom { color: #854369 !important; }
  ========================================= */
.mw-redirectedfrom a { color: #854369 !important; }


.doc-header {
/* 서브페이지 */
    position: relative;
.subpages { color: #fdecec !important; }
    display: grid;
.subpages a { color: #854369 !important; }
    grid-template-columns: 24px 1fr auto 24px;
.subpages a:active { color: #854369 !important; }
    align-items: center;
    height: 28px;
    margin-bottom: 7px;
    padding: 0 8px;
    box-sizing: border-box;
    background:
        linear-gradient(
            to bottom,
            #282828 0%,
            #1a1a1a 40%,
            #161616 100%
        );
    border-top: 1px solid #3a3a3a;
    border-bottom: 1px solid #0a0a0a;
    border-left: 1px solid #222;
    border-right: 1px solid #222;
    border-radius: 2px;
}


.doc-header::before {
/* 공지사항 */
     content: "";
.alert-info {
     position: absolute;
     background-color: #171717 !important;
     inset: 0;
     border: 2px solid #854369 !important;
    pointer-events: none;
     box-shadow: 0px 0px 3px #000000;
    opacity: 0.06;
    background: repeating-linear-gradient(
        135deg,
        rgba(255,255,255,0.08) 0px,
        rgba(255,255,255,0.08) 1px,
        transparent 1px,
        transparent 4px
    );
    border-radius: inherit;
}
}


.doc-header-id {
/* 푸터 */
    font-size: 10px;
.footer-info-lastmod { color: #e2e2e2 !important; }
    font-weight: 700;
.footer-info-copyright { color: #e2e2e2 !important; }
    letter-spacing: 0.18em;
.footer-places-privacy a { color: #c95197 !important; }
    color: #c0c0c0;
.footer-places-privacy a:active { color: #e2e2e2 !important; }
    text-shadow: 0 1px 0 rgba(0,0,0,0.80);
.footer-places-about a { color: #c95197 !important; }
    position: relative;
.footer-places-about a:active { color: #e2e2e2 !important; }
    z-index: 1;
.footer-places-disclaimers a { color: #c95197 !important; }
}
.footer-places-disclaimers a:active { color: #e2e2e2 !important; }


.doc-screw {
/* 리스트 */
    position: relative;
.liberty-content-main ul:not(#toc) {
    z-index: 1;
     list-style-type: disc;
    width: 10px;
     list-style-image: none;
    height: 10px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 36% 32%, rgba(255,255,255,0.35) 0%, transparent 28%),
        linear-gradient(145deg, #505050 0%, #282828 55%, #0e0e0e 100%);
     border: 1px solid #090909;
     box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.15),
        inset 0 -1px 0 rgba(0,0,0,0.60),
        0 0 0 1px #333;
    justify-self: center;
}
}


.doc-screw::after {
.liberty-content-main ul ul:not(#toc) {
    content: "";
     list-style-type: circle;
    position: absolute;
     list-style-image: none;
    top: 50%;
    left: 15%;
    right: 15%;
    height: 1px;
    transform: translateY(-50%);
     background: rgba(0,0,0,0.55);
     border-radius: 1px;
}
}


.doc-status {
.liberty-content-main ul ul ul:not(#toc) {
     display: flex;
     list-style-type: square;
     align-items: center;
     list-style-image: none;
    gap: 5px;
    position: relative;
    z-index: 1;
}
}


.doc-status-lamp {
/* 반전 */
     display: inline-block;
.invert {
    width: 8px;
     filter: invert(1);
    height: 8px;
    border-radius: 50%;
    background: #111;
    border: 1px solid #060606;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.06),
        0 0 0 1px #252525;
}
}


.doc-status-lamp.on {
/* 편집 권한에 따라 우측 모서리 처리 */
     background: radial-gradient(circle at 38% 32%, #d9ff9d 0%, #7ec43e 45%, #253d18 100%);
.liberty-content.content-tools-hidden .liberty-content-main {
    box-shadow:
     border-top-right-radius: 5px !important;
        inset 0 1px 0 rgba(255,255,255,0.28),
        0 0 0 1px #1a3010,
        0 0 5px rgba(100,200,50,0.45);
}
}


.doc-status-lamp.warn {
/* 분류 */
     background: radial-gradient(circle at 38% 32%, #ffe8b0 0%, #d89a42 45%, #4d2a0d 100%);
.liberty-content-main .catlinks {
     box-shadow:
     width: 100% !important;
        inset 0 1px 0 rgba(255,255,255,0.28),
     left: auto !important;
        0 0 0 1px #3a1f06,
    margin: 4px 0 0 0 !important;
        0 0 5px rgba(220,140,40,0.45);
    padding: 4px 7px !important;
    box-sizing: border-box !important;
}
}


/* =========================================
/* 이미지 위에 이미지 얹기 */
  doc-layout
.portrait-overlay-img,
  ========================================= */
.portrait-overlay-img a {
 
     max-width: none !important;
.doc-layout {
     max-height: none !important;
    display: grid;
     overflow: visible !important;
    grid-template-columns: 200px minmax(0, 1fr) 320px;
    gap: 7px;
    align-items: stretch;
    min-height: 620px;
}
 
.doc-layout-left,
.doc-layout-center,
.doc-layout-right {
     min-width: 0;
}
 
.doc-layout-center,
.doc-layout-right {
     display: flex;
    flex-direction: column;
     gap: 7px;
}
}


.doc-layout-lower {
.portrait-overlay-img img {
    display: grid;
     height: var(--overlay-height, 180px) !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
     width: auto !important;
    gap: 7px;
    flex: 1;
}
 
/* =========================================
  doc-panel
  ========================================= */
 
.doc-panel {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    background: #1a1a1a;
    border-top: 1px solid #303030;
    border-bottom: 1px solid #080808;
    border-left: 1px solid #222;
    border-right: 1px solid #111;
    border-radius: 2px;
    overflow: hidden;
}
 
.doc-panel::before {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    width: 5px;
     height: 5px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 35% 30%, rgba(255,255,255,0.25) 0%, transparent 40%),
        linear-gradient(145deg, #444 0%, #1e1e1e 100%);
    border: 1px solid #080808;
    box-shadow: 0 0 0 1px #2a2a2a;
    pointer-events: none;
    z-index: 10;
}
 
.doc-panel::after {
    content: "";
    position: absolute;
    top: 4px;
    right: 4px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 35% 30%, rgba(255,255,255,0.25) 0%, transparent 40%),
        linear-gradient(145deg, #444 0%, #1e1e1e 100%);
    border: 1px solid #080808;
    box-shadow: 0 0 0 1px #2a2a2a;
    pointer-events: none;
    z-index: 10;
}
 
.doc-panel-title {
    position: relative;
    z-index: 3;
    box-sizing: border-box;
    padding: 6px 10px 5px 10px;
    font-family: 'Galmuri11', sans-serif !important;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    line-height: 1.2;
    letter-spacing: 0.10em;
    color: #888;
    background: linear-gradient(to bottom, #161616 0%, #121212 100%);
    border-bottom: 1px solid #0d0d0d;
    text-shadow: 0 1px 0 rgba(0,0,0,0.80);
    text-transform: uppercase;
}
 
.doc-panel-heading {
    padding: 10px 18px;
    font-size: 11px;
    font-weight: 700;
    color: #7a7a7a;
    letter-spacing: 0.06em;
    text-shadow: 0 1px 0 rgba(0,0,0,0.80);
    position: relative;
    z-index: 3;
}
 
.doc-panel table {
     width: 100%;
    border-collapse: collapse;
    margin: 0;
}
 
.doc-panel table th,
.doc-panel table td {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    vertical-align: middle !important;
}
 
.doc-panel table th[style],
.doc-panel table td[style] {
    background: revert !important;
    border: revert !important;
    padding: revert !important;
}
 
/* =========================================
  doc-display
  ========================================= */
 
.doc-display {
    position: relative;
    z-index: 3;
    box-sizing: border-box;
    padding: 4px 14px;
    margin-bottom: 0;
    min-height: 90px;
    line-height: 1.8;
    color: #d8d8d8;
    background: #111111;
    border-top: 1px solid #0a0a0a;
    box-shadow:
        inset 0 2px 6px rgba(0,0,0,0.55),
        inset 0 0 1px rgba(0,0,0,0.80);
}
 
/* =========================================
  doc-info
  ========================================= */
 
.doc-info-row {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    margin: 7px 10px 0 10px;
}
 
.doc-info-key {
    font-size: 10px;
    font-weight: 700;
    color: #7a7a7a;
    letter-spacing: 0.06em;
    text-shadow: 0 1px 0 rgba(0,0,0,0.70);
}
 
.doc-info-value {
    position: relative;
    overflow: hidden;
    text-align: right;
    border-radius: 2px;
    background: #0e0e0e;
    color: #d8d8d8;
    padding: 4px 9px;
    font-size: 11px;
    font-weight: 700;
    box-sizing: border-box;
    border-top: 1px solid #0a0a0a;
    border-bottom: 1px solid #252525;
    border-left: 1px solid #111;
    border-right: 1px solid #111;
    box-shadow:
        inset 0 2px 4px rgba(0,0,0,0.60),
        inset 1px 0 0 rgba(255,255,255,0.015);
}
 
.doc-info-value::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    opacity: 0.15;
    background: repeating-linear-gradient(
        to bottom,
        rgba(255,255,255,0.055) 0px,
        rgba(255,255,255,0.055) 1px,
        transparent 2px,
        transparent 4px
    );
    mix-blend-mode: screen;
}
 
.doc-info-block {
    padding: 0 8px 6px 8px;
    background: #1a1a1a;
}
 
.doc-info-block-label {
    display: block;
    padding: 6px 2px 4px 2px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9a9a9a;
    text-shadow: 0 1px 0 rgba(0,0,0,0.80);
}
 
/* =========================================
  doc-nav
  ========================================= */
 
.doc-nav {
    height: 100%;
    display: flex;
    flex-direction: column;
}
 
.doc-nav-item {
    position: relative;
    z-index: 3;
    box-sizing: border-box;
    width: calc(100% - 16px);
    margin: 5px 8px 0 8px;
    padding: 7px 24px 7px 10px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.35;
    color: #666;
    background: linear-gradient(to bottom, #232323 0%, #1a1a1a 50%, #161616 100%);
    border-top: 1px solid #2e2e2e;
    border-bottom: 1px solid #0a0a0a;
    border-left: 1px solid #222;
    border-right: 1px solid #111;
    border-radius: 2px;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.025),
        0 1px 0 rgba(255,255,255,0.012);
    cursor: pointer;
    display: block;
    text-decoration: none;
    text-shadow: 0 1px 0 rgba(0,0,0,0.70);
}
 
.doc-nav-item::after {
    content: "›";
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    color: #333;
    font-size: 13px;
}
 
.doc-nav-item.active {
    color: #e8e8e8;
    background: linear-gradient(to bottom, #5a2040 0%, #3d1a2f 52%, #2e1222 100%);
    border-top-color: #7a3055;
    border-bottom-color: #1a0810;
    border-left-color: #6a2848;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.06),
        0 0 6px rgba(212,90,162,0.10);
}
 
.doc-nav-item.active::after {
    color: #d45aa2;
}
 
/* =========================================
  doc-status-row
  ========================================= */
 
.doc-status-row {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 5px 8px 0 8px;
    padding: 5px 9px;
    box-sizing: border-box;
    font-size: 10px;
    font-weight: 700;
    color: #555;
    background: #111;
    border-top: 1px solid #0a0a0a;
    border-bottom: 1px solid #222;
    border-left: 1px solid #111;
    border-right: 1px solid #111;
    border-radius: 2px;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.50);
    letter-spacing: 0.06em;
    text-shadow: 0 1px 0 rgba(0,0,0,0.80);
}
 
/* =========================================
  doc-link
  ========================================= */
 
.doc-link {
    position: relative;
    z-index: 3;
    box-sizing: border-box;
    margin: 5px 10px 0 10px;
    padding: 6px 10px 6px 14px;
    font-size: 11px;
    font-weight: 700;
    color: #888;
    background: linear-gradient(to bottom, #1a1a1a 0%, #151515 100%);
    border-top: 1px solid #242424;
    border-bottom: 1px solid #080808;
    border-left: 1px solid #1e1e1e;
    border-right: 1px solid #111;
    border-radius: 2px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.018);
    display: block;
    text-decoration: none;
    cursor: pointer;
    text-shadow: 0 1px 0 rgba(0,0,0,0.70);
}
 
.doc-link::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 20%;
    bottom: 20%;
    width: 2px;
    background: #2e2e2e;
    border-radius: 1px;
}
 
.doc-link:hover {
    color: #c0c0c0;
    background: linear-gradient(to bottom, #222 0%, #1a1a1a 100%);
    border-top-color: #333;
}
 
.doc-link:hover::before {
    background: #854369;
}
 
/* =========================================
  doc-tab-bar
  ========================================= */
 
.doc-tab-bar {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 5px 6px;
    background: linear-gradient(to bottom, #141414 0%, #111 100%);
    border-top: 1px solid #0a0a0a;
    box-shadow: inset 0 1px 0 rgba(0,0,0,0.60);
}
 
.doc-tab-key {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    gap: 3px;
    padding: 0 4px;
    user-select: none;
    white-space: nowrap;
}
 
.doc-tab-key kbd {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    font-size: 10px;
    font-weight: 700;
    font-family: inherit;
    color: #e2e2e2;
    background: linear-gradient(to bottom, #2a2a2a 0%, #1e1e1e 100%);
    border-top: 1px solid #3a3a3a;
    border-bottom: 1px solid #080808;
    border-left: 1px solid #2e2e2e;
    border-right: 1px solid #111;
    border-radius: 2px;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.06),
        0 1px 0 rgba(255,255,255,0.02);
    text-shadow: 0 1px 0 rgba(0,0,0,0.80);
}
 
.doc-tab-key .doc-tab-arrow {
    font-size: 10px;
    color: #333;
    line-height: 1;
}
 
.doc-tab {
    flex: 1;
    box-sizing: border-box;
    padding: 6px 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #e2e2e2;
    background: linear-gradient(to bottom, #1e1e1e 0%, #181818 100%);
    border-top: 1px solid #2a2a2a;
    border-bottom: 1px solid #080808;
    border-left: 1px solid #222;
    border-right: 1px solid #111;
    border-radius: 2px;
    cursor: pointer;
    text-align: center;
    text-shadow: 0 1px 0 rgba(0,0,0,0.80);
    text-transform: uppercase;
    user-select: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
 
.doc-tab:hover {
    color: #ffffff;
    background: linear-gradient(to bottom, #242424 0%, #1a1a1a 100%);
    border-top-color: #333;
}
 
.doc-tab.active {
    color: #ffffff;
    background: linear-gradient(to bottom, #2e1222 0%, #3d1a2f 52%, #5a2040 100%);
    border-top-color: #7a3055;
    border-bottom-color: #1a0810;
    border-left-color: #6a2848;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
}
 
/* =========================================
  doc-footer
  ========================================= */
 
.doc-footer {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 110px 44px 110px 200px;
    gap: 12px;
    align-items: center;
    height: 44px;
    margin-top: 7px;
    padding: 0 10px;
    box-sizing: border-box;
    background: linear-gradient(to bottom, #282828 0%, #1a1a1a 40%, #161616 100%);
    box-shadow:
        inset 1px 0 0 #494949,
        inset 0 -1px 0 #555,
        inset 0 2px 6px rgba(0,0,0,0.55);
    border-top: 1px solid #3a3a3a;
    border-bottom: 1px solid #0a0a0a;
    border-left: 1px solid #222;
    border-right: 1px solid #222;
    border-radius: 2px;
}
 
.doc-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.05;
    background: repeating-linear-gradient(
        135deg,
        rgba(255,255,255,0.08) 0px,
        rgba(255,255,255,0.08) 1px,
        transparent 1px,
        transparent 4px
    );
}
 
.doc-footer-sliders {
    display: flex;
    align-items: center;
    gap: 10px;
}
 
.doc-slider {
    position: relative;
    width: 80px;
    height: 6px;
    background: #0a0a0a;
    border-top: 1px solid #080808;
    border-bottom: 1px solid #222;
    border-radius: 99px;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.70);
}
 
.doc-slider.short {
    width: 54px;
}
 
.doc-slider::after {
    content: "";
    position: absolute;
    top: -6px;
    left: 48%;
    width: 10px;
    height: 18px;
    border-radius: 2px;
    background: linear-gradient(to bottom, #c8c0b2 0%, #8a8278 100%);
    border-top: 1px solid #d8d0c2;
    border-bottom: 1px solid #2a2622;
    border-left: 1px solid #aaa49c;
    border-right: 1px solid #5a544e;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.30),
        0 1px 3px rgba(0,0,0,0.40);
}
 
.doc-date {
    box-sizing: border-box;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: #d45aa2;
    background: #0a0a0a;
    border-top: 1px solid #080808;
    border-bottom: 1px solid #2a1a22;
    border-left: 1px solid #0e0e0e;
    border-right: 1px solid #0e0e0e;
    border-radius: 2px;
    box-shadow: inset 0 2px 5px rgba(0,0,0,0.70);
    text-shadow: 0 0 8px rgba(212,90,162,0.40);
}
 
.doc-knob {
    justify-self: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 36% 28%, rgba(255,255,255,0.30) 0%, transparent 24%),
        linear-gradient(145deg, #c8bfb0 0%, #8a8278 48%, #464039 100%);
    border: 1px solid #2a2520;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.30),
        inset 0 -2px 0 rgba(0,0,0,0.22),
        0 2px 5px rgba(0,0,0,0.50);
}
 
.doc-keys {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 5px;
}
 
.doc-keys span {
    height: 22px;
    border-radius: 2px;
    background: linear-gradient(to bottom, #d8d4ca 0%, #a09890 55%, #6e6660 100%);
    border-top: 1px solid #e0dcd2;
    border-bottom: 1px solid #1e1c18;
    border-left: 1px solid #b8b0a8;
    border-right: 1px solid #4a4440;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.40),
        0 1px 2px rgba(0,0,0,0.30);
}
 
.doc-keys span.red {
    background: linear-gradient(to bottom, #cc6058 0%, #922e28 55%, #521410 100%);
    border-top-color: #d87070;
    border-bottom-color: #1e0808;
}
 
.doc-keys span.amber {
    background: linear-gradient(to bottom, #e4bc6c 0%, #b87c28 55%, #6c3e08 100%);
    border-top-color: #ecd080;
    border-bottom-color: #201008;
}
 
/* =========================================
  Responsive
  ========================================= */
 
@media screen and (max-width: 1280px) {
    .doc-layout {
        grid-template-columns: 210px minmax(0, 1fr);
    }
 
    .doc-layout-right {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 7px;
    }
 
    .doc-footer {
        grid-template-columns: 1fr 110px 44px 110px;
    }
 
    .doc-keys {
        display: none;
    }
}
 
@media screen and (max-width: 980px) {
    .doc-layout,
    .doc-layout-lower,
    .doc-layout-right {
        grid-template-columns: 1fr;
    }
 
    .doc-footer {
        grid-template-columns: 1fr;
        height: auto;
        padding: 8px 10px;
    }
 
    .doc-footer-sliders {
        justify-content: center;
    }
 
    .doc-date,
    .doc-knob {
        justify-self: center;
    }
}
 
/* =========================================
  CLBI Nations & Factions inline-theme support
  원본 표 구조 유지 / 외곽 패널 4px 패딩만 CSS에서 담당
  ========================================= */
 
body.page-국가_및_조합 .liberty-content-main .mw-parser-output > .clbi-nations-board,
body.page-Nations_\&_Factions .liberty-content-main .mw-parser-output > .clbi-nations-board {
    position: relative;
    display: block;
    width: 100%;
    margin: 0 !important;
    padding: 4px !important;
    box-sizing: border-box;
    background: #1d1d1d;
    border: 1px solid #050505;
    border-radius: 0;
    color: #e2e2e2;
    overflow: visible;
    box-shadow:
        inset 0 1px 0 #555555,
        inset -1px 0 0 #555555,
        inset 1px 0 0 #101010,
        inset 0 -1px 0 #101010;
}
 
body.page-국가_및_조합 .clbi-nations-board .clbi-nations-table,
body.page-Nations_\&_Factions .clbi-nations-board .clbi-nations-table {
    width: 100% !important;
     max-width: none !important;
     max-width: none !important;
     margin: 0 !important;
     max-height: none !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
}
 
body.page-국가_및_조합 .clbi-nations-board a:not(.new):not(.external),
body.page-Nations_\&_Factions .clbi-nations-board a:not(.new):not(.external) {
    color: #e2e2e2 !important;
    text-decoration: none !important;
}
}


body.page-국가_및_조합 .clbi-nations-board a:not(.new):not(.external):hover,
/* 관련 틀 본문 하단 여백 보정 */
body.page-Nations_\&_Factions .clbi-nations-board a:not(.new):not(.external):hover {
.related-template-body > *:last-child {
     color: #ffffff !important;
     margin-bottom: 1px !important;
    text-decoration: none !important;
}
}


body.page-국가_및_조합 .clbi-nations-board img,
.related-template-body table:last-child,
body.page-Nations_\&_Factions .clbi-nations-board img {
.related-template-body .wikitable:last-child,
     vertical-align: middle;
.related-template-body [id^="collapsible"]:last-child {
     margin-bottom: 1px !important;
}
}


/* =========================================
.related-template-body > br:last-child {
  CLBI Nations & Factions continent tabs
     display: none !important;
  하단 대륙 정보 패널 / 선택 탭 패널 융합형
  ========================================= */
 
body.page-국가_및_조합 .clbi-nations-continent-switcher,
body.page-Nations_\&_Factions .clbi-nations-continent-switcher {
     display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
}


body.page-국가_및_조합 .clbi-nations-continent-tabs,
/* 컨트리볼 */
body.page-Nations_\&_Factions .clbi-nations-continent-tabs {
#clbi-left-nations-image {
     display: block;
     display: block;
     width: 100%;
     width: 100%;
    height: auto;
     margin: 0;
     margin: 0;
     padding: 0;
     padding: 0;
    box-sizing: border-box;
     border: 0;
}
 
body.page-국가_및_조합 .clbi-nations-continent-tabbar,
body.page-Nations_\&_Factions .clbi-nations-continent-tabbar {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 4px;
    min-height: 28px;
    margin: 0 0 -1px 0;
    padding: 0;
    box-sizing: border-box;
    overflow: visible;
}
 
body.page-국가_및_조합 .clbi-nations-continent-tab,
body.page-Nations_\&_Factions .clbi-nations-continent-tab {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 92px;
    height: 24px;
    padding: 0 10px;
    box-sizing: border-box;
    background: #101010;
    border: 1px solid #050505;
    border-radius: 0;
    color: #c8c8c8;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    text-shadow: 1px 1px 0 #000;
    cursor: pointer;
    user-select: none;
    box-shadow:
        inset 0 1px 0 #555555,
        inset -1px 0 0 #555555,
        inset 1px 0 0 #101010,
        inset 0 -1px 0 #101010;
}
 
body.page-국가_및_조합 .clbi-nations-continent-tab:hover,
body.page-Nations_\&_Factions .clbi-nations-continent-tab:hover {
    background: #1d1d1d;
    color: #ffffff;
}
 
body.page-국가_및_조합 .clbi-nations-continent-tab.is-active,
body.page-Nations_\&_Factions .clbi-nations-continent-tab.is-active {
    z-index: 4;
    height: 28px;
    background: #1d1d1d;
    border-bottom-color: #1d1d1d;
    color: #ffffff;
    box-shadow:
        inset 0 1px 0 #555555,
        inset -1px 0 0 #555555,
        inset 1px 0 0 #101010;
}
 
body.page-국가_및_조합 .clbi-nations-continent-body,
body.page-Nations_\&_Factions .clbi-nations-continent-body {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    min-height: 320px;
    margin: 0;
    padding: 4px;
    box-sizing: border-box;
    background: #1d1d1d;
    border: 1px solid #050505;
     border-radius: 0;
    color: #e2e2e2;
    overflow: hidden;
    box-shadow:
        inset 0 1px 0 #555555,
        inset -1px 0 0 #555555,
        inset 1px 0 0 #101010,
        inset 0 -1px 0 #101010;
}
 
body.page-국가_및_조합 .clbi-nations-continent-panel,
body.page-Nations_\&_Factions .clbi-nations-continent-panel {
    display: none;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
 
body.page-국가_및_조합 .clbi-nations-continent-panel.is-active,
body.page-Nations_\&_Factions .clbi-nations-continent-panel.is-active {
    display: block;
}
 
body.page-국가_및_조합 .clbi-nations-continent-heading,
body.page-Nations_\&_Factions .clbi-nations-continent-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 24px;
    margin: 0 0 4px;
    padding: 0 7px;
    box-sizing: border-box;
    border-bottom: 1px solid #050505;
    color: #e2e2e2;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    text-shadow: 1px 1px 0 #000;
    box-shadow: 0 1px 0 #101010;
}
 
body.page-국가_및_조합 .clbi-nations-continent-heading span:last-child,
body.page-Nations_\&_Factions .clbi-nations-continent-heading span:last-child {
    color: #8a8a8a;
    font-size: 9px;
    white-space: nowrap;
}
 
body.page-국가_및_조합 .clbi-nations-region-row,
body.page-Nations_\&_Factions .clbi-nations-region-row {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    min-height: 25px;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    border-bottom: 1px solid #050505;
    box-shadow: 0 1px 0 #101010;
}
 
body.page-국가_및_조합 .clbi-nations-region-row:last-child,
body.page-Nations_\&_Factions .clbi-nations-region-row:last-child {
    border-bottom: 0;
    box-shadow: none;
}
 
body.page-국가_및_조합 .clbi-nations-region-name,
body.page-Nations_\&_Factions .clbi-nations-region-name {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: 4px 7px;
    box-sizing: border-box;
    border-right: 1px solid #050505;
    color: #c8c8c8;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
    text-shadow: 1px 1px 0 #000;
    box-shadow: 1px 0 0 #101010;
}
 
body.page-국가_및_조합 .clbi-nations-region-content,
body.page-Nations_\&_Factions .clbi-nations-region-content {
    min-width: 0;
    padding: 4px 8px;
    box-sizing: border-box;
    color: #e2e2e2;
    font-size: 11px;
    line-height: 1.55;
    text-align: left;
    word-break: keep-all;
}
 
body.page-국가_및_조합 .clbi-nations-region-content img,
body.page-Nations_\&_Factions .clbi-nations-region-content img {
    vertical-align: -2px;
}
 
@media screen and (max-width: 1100px) {
    body.page-국가_및_조합 .clbi-nations-continent-tab,
    body.page-Nations_\&_Factions .clbi-nations-continent-tab {
        min-width: 0;
        flex: 1 1 0;
        padding: 0 5px;
        font-size: 10px;
    }
 
    body.page-국가_및_조합 .clbi-nations-region-row,
    body.page-Nations_\&_Factions .clbi-nations-region-row {
        grid-template-columns: 100px minmax(0, 1fr);
    }
}
}

2026년 6월 29일 (월) 23:59 판

/* =========================================
   COASTLINE: BLACK ICE - Theme
   ========================================= */
/* screen-header 쓰는 문서만 푸커 숨기기 */
body:has(.screen-header) .liberty-footer {
    display: none !important;
}
body:has(.screen-header) footer {
    display: none !important;
}

/* 색상 텍스트 틀 및 색상 범위 공통 처리 */
.color-text {
    color: var(--text-color, #fff) !important;
}

.color-text a,
.color-text a:visited,
.color-text a.external {
    color: var(--text-color, #fff) !important;
}

.color-text a:hover {
    color: var(--text-color, #fff) !important;
}

/* 선택 영역 */
::selection {
    background: rgba(133, 67, 105, 0.50);
    color: #ffffff;
}

::-moz-selection {
    background: rgba(133, 67, 105, 0.50);
    color: #ffffff;
}

/* SVG + 테두리일 때 사각 테두리 제거, 형태 외곽선만 적용 */
.mw-image-border:has(img[src$=".svg.png"]) {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
}

.mw-image-border img[src$=".svg.png"] {
    border: none !important;
    box-shadow: none !important;
    filter:
        drop-shadow(1px 0 0 #ffffff)
        drop-shadow(-1px 0 0 #ffffff)
        drop-shadow(0 1px 0 #ffffff)
        drop-shadow(0 -1px 0 #ffffff);
}

/* 폰트 */
@font-face {
    font-family: 'Galmuri11';
    src: url('/fonts/Galmuri11.woff2') format('woff2');
    font-weight: 400;
    font-display: block;
}

@font-face {
    font-family: 'Galmuri11';
    src: url('/fonts/Galmuri11-Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: block;
}

@font-face {
    font-family: 'BoldRound';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2507-2@1.0/BoldDungGeunMo.woff2') format('woff2');
    font-weight: normal;
    font-display: swap;
}

html body, html .liberty-content-main {
    font-family: 'Galmuri11', sans-serif !important;
    font-weight: 400 !important;
    font-size: 12px;
}

* { font-family: inherit !important; }

.fa, .far, .fas, .fab, [class*="fa-"] {
    font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands', 'FontAwesome' !important;
}

.mw-page-title-main, .mw-page-title-namespace,
.liberty-content-main h1, .liberty-content-main h2,
.liberty-content-main h3, .liberty-content-main h4,
.liberty-content-main h5, .liberty-content-main h6 {
    font-family: 'BoldRound', sans-serif !important;
}

/* 배경 */
html {
    min-height: 100%;
    overflow-y: scroll;
    background: #000000 !important;
}

body {
    min-height: 100%;
    margin: 0 !important;
    background: #000000 !important;
}

/* 이전 JS 배경 레이어는 사용하지 않음 */
.WW-bg {
    display: none !important;
}

/* Canvas 기반 고정 하프톤 배경 */
#site-halftone-bg {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    z-index: 0;
    pointer-events: none;
    background: #000000;
}

/* 배경 캔버스보다 실제 위키 UI가 위에 놓이도록 함 */
body > :not(#site-halftone-bg) {
    position: relative;
    z-index: 1;
}

/* 관리자 툴은 기존 우선순위를 유지 */
#dev-tools-panel {
    position: fixed !important;
    z-index: 99998 !important;
}

/* OOUI/MediaWiki 팝업 계열 안전 보정 */
.oo-ui-windowManager,
.oo-ui-defaultOverlay,
.mw-notification-area,
.mw-notification-area-overlay {
    position: relative;
    z-index: 100000 !important;
}

/* 스크롤 */
html { overflow-y: scroll; }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0a0909; }
::-webkit-scrollbar-thumb { background: #854369; border-radius: 3px; }

/* 제목 */
.mw-page-title-main {
    border-radius: 5px 5px 0 0 !important;
    padding: 7px !important;
    border: 2px solid #854369 !important;
    border-bottom: none !important;
    background: #171717 !important;
    color: #e2e2e2 !important;
    display: inline-block !important;
    position: relative !important;
}

.mw-page-title-main::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 2px;
    background: #171717;
}

.mw-page-title-namespace {
    padding: 7px 0 7px 7px !important;
    border: 2px solid #854369 !important;
    border-right: none !important;
    border-bottom: none !important;
    border-radius: 5px 0 0 0 !important;
    background: #171717 !important;
    color: #e2e2e2 !important;
    display: inline-block !important;
    vertical-align: bottom !important;
    position: relative !important;
}

.mw-page-title-namespace::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 2px;
    background: #171717;
}

.mw-page-title-separator {
    padding: 7px 0 !important;
    border-top: 2px solid #854369 !important;
    border-bottom: none !important;
    background: #171717 !important;
    color: #e2e2e2 !important;
    display: inline-block !important;
    vertical-align: bottom !important;
    position: relative !important;
}

.mw-page-title-separator::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 2px;
    background: #171717;
}

.mw-page-title-namespace ~ .mw-page-title-main {
    border-radius: 0 5px 0 0 !important;
    padding: 7px 7px 7px 0 !important;
    border-left: none !important;
    vertical-align: bottom !important;
}

/* 특수 페이지 h1 */
.liberty-content-header .title h1:not(:has(.mw-page-title-main)) {
    background: #171717 !important;
    color: #e2e2e2 !important;
    border: 2px solid #854369 !important;
    border-bottom: none !important;
    border-radius: 5px 5px 0 0 !important;
    padding: 7px !important;
    display: inline-block !important;
    position: relative !important;
    font-family: 'BoldRound', sans-serif !important;
}

.liberty-content-header .title h1:not(:has(.mw-page-title-main))::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 2px;
    background: #171717;
}

/* 대문 제목 숨기기 */
.mw-page-title-main.clbi-hide,
.mw-page-title-main.clbi-hide::after {
    display: none !important;
}

/* 본문 */
.Liberty .content-wrapper .liberty-content .liberty-content-main,
.mw-datatable th, .mw-datatable tr:hover td, textarea,
div.mw-warning-with-logexcerpt, div.mw-lag-warn-high,
div.mw-cascadeprotectedwarning, div#mw-protect-cascadeon {
    background: #171717;
    color: #ffffff;
}

.mw-references-columns {
    border-top: 1px solid #414141 !important;
}

/* 문단 보더 */
.Liberty .content-wrapper .liberty-content .liberty-content-main h1,
.Liberty .content-wrapper .liberty-content .liberty-content-main h2,
.Liberty .content-wrapper .liberty-content .liberty-content-main h3,
.Liberty .content-wrapper .liberty-content .liberty-content-main h4,
.Liberty .content-wrapper .liberty-content .liberty-content-main h5,
.Liberty .content-wrapper .liberty-content .liberty-content-main h6 {
    margin-top: 1rem;
    border-bottom: 1px solid #414141 !important;
    margin-bottom: 0.6rem;
    padding-bottom: 0.6rem;
    overflow-wrap: break-word;
    overflow: hidden;
}

/* 링크 색상 */
a { color: #d45aa2 !important; }
a:hover { color: #fdecf9 !important; }
a:active { color: #b3337d !important; }
a.new { color: #ba0000 !important; }
a.new:hover { color: #fe5757 !important; }
a.new:active { color: #ba0000 !important; }
a.external { color: #33b733 !important; text-decoration: underline !important; }
a.external:hover { color: #95ed95 !important; }
a.external:active { color: #33b733 !important; }
a.external:before { display: none !important; }

/* CLBI 템플릿 링크 */
.CLBI-template a { color: #d45aa2 !important; }
.CLBI-template a:hover { color: #fdecf9 !important; }
.CLBI-template a:active { color: #b3337d !important; }
.CLBI-template a.new { color: #ba0000 !important; }
.CLBI-template a.new:hover { color: #fe5757 !important; }
.CLBI-template a.new:active { color: #ba0000 !important; }
.CLBI-template a.external { color: #33b733 !important; }
.CLBI-template a.external:hover { color: #95ed95 !important; }
.CLBI-template a.external:active { color: #33b733 !important; }

/* 편집 버튼 */
.btn-secondary {
    color: #e2e2e2 !important;
    background-color: #171717 !important;
    border: 2px solid #854369 !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    box-shadow: 0 2px 0 0 #854369 !important;
}

.btn-secondary:hover {
    color: #d46262 !important;
    background-color: #171717 !important;
    border: 2px solid #854369 !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    box-shadow: 0 2px 0 0 #854369 !important;
}

.btn-group .btn:first-child { border-radius: 5px 0 0 0 !important; }
.btn-group .dropdown-toggle { border-radius: 0 5px 0 0 !important; }

/* 기본 목차: 본문에서는 숨김 */
.liberty-content-main #toc,
.liberty-content-main .toc {
    display: none !important;
}

/* 왼쪽 목차: 전체 내용 영역 */
#side-toc-box .toc-sidebar-content {
    padding: 10px 12px !important;
}

/* 왼쪽 목차: 새로 생성한 목차 목록 */
#side-toc-box .generated-toc {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 왼쪽 목차: 목록 항목 */
#side-toc-box .generated-toc li {
    margin: 0 0 4px 0 !important;
    padding: 0 !important;
    background: transparent !important;
    line-height: 1.5 !important;
}

#side-toc-box .generated-toc li:last-child {
    margin-bottom: 0 !important;
}

/* 왼쪽 목차: 링크 박스 */
#side-toc-box .generated-toc a {
    display: block !important;
    color: #E2E2E2 !important;
    text-decoration: none !important;
    padding: 4px 6px !important;
    border-radius: 4px !important;
    overflow: hidden !important;
}

#side-toc-box .generated-toc a:hover {
    background: rgba(133, 67, 105, 0.18) !important;
    color: #ffffff !important;
}

/* 왼쪽 목차: 긴 제목 감싸는 영역 */
#side-toc-box .toc-scroll-wrap {
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    position: relative !important;
}

/* 왼쪽 목차: 실제로 스크롤되는 긴 제목에만 오른쪽 페이드 적용 */
#side-toc-box .toc-scroll-wrap.is-scrolling {
    mask-image: linear-gradient(to right, black 88%, transparent 100%) !important;
    -webkit-mask-image: linear-gradient(to right, black 88%, transparent 100%) !important;
}

/* 왼쪽 목차: 실제 스크롤되는 텍스트 */
#side-toc-box .toc-scroll-text {
    display: inline-block !important;
    white-space: nowrap !important;
    max-width: none !important;
}

/* 왼쪽 목차: h2 항목 */
#side-toc-box .toc-level-2 .toc-scroll-text {
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #E2E2E2 !important;
}

/* 왼쪽 목차: h3 항목 */
#side-toc-box .toc-level-3 {
    padding-left: 12px !important;
}

#side-toc-box .toc-level-3 .toc-scroll-text {
    font-size: 11px !important;
    font-weight: 400 !important;
    color: #b8b8b8 !important;
}

#side-toc-box .toc-level-3 a:hover .toc-scroll-text {
    color: #ffffff !important;
}

/* 왼쪽 목차: 문서 스크롤 중에도 목차가 화면 안에 남도록 처리 */
#clbi-left-sidebar {
    align-self: stretch !important;
}

/* 왼쪽 목차: 목차 박스만 화면 상단에 고정되듯 따라오게 함 */
#side-toc-box {
    position: sticky !important;
    top: 10px !important;
    z-index: 1001;
    max-height: calc(100vh - 40px);
    overflow: hidden;
}

/* 왼쪽 목차: 항목이 많을 때 목차 내부만 스크롤되게 함 */
#side-toc-box .toc-sidebar-content {
    max-height: calc(100vh - 88px);
    overflow-y: auto;
    overflow-x: hidden;
}

/* 분류 칸 */
.catlinks {
    position: relative !important;
    z-index: 49 !important;
    display: block !important;
    width: 100% !important;
    left: auto !important;
    right: auto !important;
    margin: 4px 0 0 0 !important;
    padding: 4px 7px !important;
    box-sizing: border-box !important;
    background: #1d1d1d !important;
    border: 1px solid #050505 !important;
    border-radius: 0 !important;
    box-shadow:
        inset 0 1px 0 #555555,
        inset -1px 0 0 #555555,
        inset 1px 0 0 #101010,
        inset 0 -1px 0 #101010 !important;
    color: #e2e2e2 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    text-shadow: 1px 1px 0 #000 !important;
}

.catlinks .mw-normal-catlinks,
.catlinks .mw-hidden-catlinks {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    color: #e2e2e2 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

.catlinks .mw-hidden-catlinks {
    margin-top: 4px !important;
}

.catlinks ul {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    list-style-image: none !important;
    background: transparent !important;
    border: 0 !important;
}

.catlinks li {
    display: inline !important;
    margin: 0 0 0 4px !important;
    padding: 0 !important;
    list-style: none !important;
    list-style-image: none !important;
    background: transparent !important;
    border: 0 !important;
    color: #e2e2e2 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

.catlinks li::before,
.catlinks li::after {
    content: none !important;
}

.catlinks a {
    display: inline !important;
    color: #c8c8c8 !important;
    text-decoration: none !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
}

.catlinks a:hover {
    color: #ffffff !important;
    text-decoration: none !important;
}

/* 분류 문서 */
.mw-category-generated { color: #e2e2e2 !important; }
.mw-category-generated a { color: #854369 !important; }
.CategoryTreeToggle { color: #854369 !important; }
.number-link { color: #854369 !important; }

/* 편집 섹션 */
.mw-editsection {
    color: #b45c8f !important;
    float: right;
    font-weight: bold;
}

/* 넘겨주기 */
.mw-redirectedfrom { color: #854369 !important; }
.mw-redirectedfrom a { color: #854369 !important; }

/* 서브페이지 */
.subpages { color: #fdecec !important; }
.subpages a { color: #854369 !important; }
.subpages a:active { color: #854369 !important; }

/* 공지사항 */
.alert-info {
    background-color: #171717 !important;
    border: 2px solid #854369 !important;
    box-shadow: 0px 0px 3px #000000;
}

/* 푸터 */
.footer-info-lastmod { color: #e2e2e2 !important; }
.footer-info-copyright { color: #e2e2e2 !important; }
.footer-places-privacy a { color: #c95197 !important; }
.footer-places-privacy a:active { color: #e2e2e2 !important; }
.footer-places-about a { color: #c95197 !important; }
.footer-places-about a:active { color: #e2e2e2 !important; }
.footer-places-disclaimers a { color: #c95197 !important; }
.footer-places-disclaimers a:active { color: #e2e2e2 !important; }

/* 리스트 */
.liberty-content-main ul:not(#toc) {
    list-style-type: disc;
    list-style-image: none;
}

.liberty-content-main ul ul:not(#toc) {
    list-style-type: circle;
    list-style-image: none;
}

.liberty-content-main ul ul ul:not(#toc) {
    list-style-type: square;
    list-style-image: none;
}

/* 반전 */
.invert {
    filter: invert(1);
}

/* 편집 권한에 따라 우측 모서리 처리 */
.liberty-content.content-tools-hidden .liberty-content-main {
    border-top-right-radius: 5px !important;
}

/* 분류 */
.liberty-content-main .catlinks {
    width: 100% !important;
    left: auto !important;
    margin: 4px 0 0 0 !important;
    padding: 4px 7px !important;
    box-sizing: border-box !important;
}

/* 이미지 위에 이미지 얹기 */
.portrait-overlay-img,
.portrait-overlay-img a {
    max-width: none !important;
    max-height: none !important;
    overflow: visible !important;
}

.portrait-overlay-img img {
    height: var(--overlay-height, 180px) !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
}

/* 관련 틀 본문 하단 여백 보정 */
.related-template-body > *:last-child {
    margin-bottom: 1px !important;
}

.related-template-body table:last-child,
.related-template-body .wikitable:last-child,
.related-template-body [id^="collapsible"]:last-child {
    margin-bottom: 1px !important;
}

.related-template-body > br:last-child {
    display: none !important;
}

/* 컨트리볼 */
#clbi-left-nations-image {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    border: 0;
}