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

편집 요약 없음
편집 요약 없음
1번째 줄: 1번째 줄:
/* =========================================
/* =========================================
   TEST REMAKE v2.1
   TEST REMAKE v2.1
   Contrast Softener
   Cell-shaded Matte Override
   기존 v2 아래에 추가
   - 강한 그라디언트 제거
  - 평면 색 + 1px 하이라이트/섀도우
   ========================================= */
   ========================================= */


/* 전체 톤: 순흑/순백을 줄이고 회색 폭을 넓힘 */
body.page-대문 {
body.page-대문 {
     background: #060606 !important;
     --y2k-black: #000000;
     color: #c9c9c9 !important;
     --y2k-bg: #050505;
    --y2k-panel: #111111;
    --y2k-panel-2: #151515;
    --y2k-panel-3: #1b1b1b;
    --y2k-title: #202020;
    --y2k-title-hover: #282828;
    --y2k-inner: #080808;
    --y2k-inner-2: #0d0d0d;
    --y2k-line-hi: #5a5a5a;
    --y2k-line-mid: #333333;
    --y2k-line-low: #050505;
    --y2k-text: #e0e0e0;
    --y2k-text-dim: #8a8a8a;
}
}


/* 배경 격자 대비 완화 */
/* 배경도 빛 번짐보다 어두운 평면 타일감 */
body.page-대문 .WW-bg {
body.page-대문 .WW-bg {
     background:
     background: #020202 !important;
        repeating-linear-gradient(
            0deg,
            #070707 0px,
            #070707 15px,
            #0a0a0a 16px
        ),
        #060606 !important;
}
}


body.page-대문 .WW-bg::before {
body.page-대문 .WW-bg::before {
     opacity: 0.28 !important;
     opacity: 0.34 !important;
    filter: none !important;
     background-image:
     background-image:
         linear-gradient(rgba(150,150,150,0.060) 1px, transparent 1px),
         linear-gradient(rgba(120,120,120,0.08) 1px, transparent 1px),
         linear-gradient(90deg, rgba(150,150,150,0.060) 1px, transparent 1px),
         linear-gradient(90deg, rgba(120,120,120,0.08) 1px, transparent 1px),
         repeating-linear-gradient(
         repeating-linear-gradient(
             135deg,
             135deg,
             rgba(255,255,255,0.010) 0px,
             rgba(255,255,255,0.014) 0px,
             rgba(255,255,255,0.010) 1px,
             rgba(255,255,255,0.014) 1px,
             transparent 1px,
             transparent 1px,
             transparent 6px
             transparent 6px
         ) !important;
         ) !important;
    background-size:
        64px 64px,
        64px 64px,
        6px 6px !important;
}
}


body.page-대문 .WW-bg::after {
body.page-대문 .WW-bg::after {
     opacity: 0.34 !important;
     background: none !important;
}
}


/* 상단 네비게이션: 밝은 테두리와 검은 그림자 완화 */
/* 상단 네비게이션: 셀 채색식 금속판 */
body.page-대문 #clbi-top-nav {
body.page-대문 #clbi-top-nav {
     border-top-color: #565656 !important;
     background: var(--y2k-panel-2) !important;
     border-left-color: #4a4a4a !important;
     border-top: 1px solid var(--y2k-line-hi) !important;
     border-right-color: #181818 !important;
     border-left: 1px solid #4a4a4a !important;
     border-bottom-color: #111111 !important;
     border-right: 1px solid var(--y2k-line-low) !important;
     background:
     border-bottom: 1px solid #000 !important;
        linear-gradient(to bottom, #282828 0%, #1a1a1a 48%, #101010 100%) !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 0 rgba(255,255,255,0.10),
         inset 1px 1px 0 rgba(255,255,255,0.10),
         inset -1px -1px 0 rgba(0,0,0,0.58),
         inset -1px -1px 0 rgba(0,0,0,0.95),
         1px 1px 0 #050505 !important;
         2px 2px 0 #000 !important;
}
}


body.page-대문 .clbi-top-nav-item {
body.page-대문 .clbi-top-nav-item {
     border-left-color: #303030 !important;
     background: #181818 !important;
     border-right-color: #171717 !important;
     border-left: 1px solid #303030 !important;
     background:
     border-right: 1px solid #050505 !important;
        linear-gradient(to bottom, #282828 0%, #1b1b1b 50%, #111111 100%) !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset -1px -1px 0 rgba(0,0,0,0.55) !important;
         inset -1px -1px 0 rgba(0,0,0,0.85) !important;
    color: #d0d0d0 !important;
    text-shadow: 1px 1px 0 #050505 !important;
}
}


body.page-대문 .clbi-top-nav-item:hover,
body.page-대문 .clbi-top-nav-item:hover,
body.page-대문 .clbi-top-nav-item.clbi-tnav-active {
body.page-대문 .clbi-top-nav-item.clbi-tnav-active {
     background:
     background: #242424 !important;
        linear-gradient(to bottom, #333333 0%, #232323 50%, #151515 100%) !important;
    color: #ffffff !important;
     color: #ededed !important;
}
 
body.page-대문 #clbi-sub-worldbuilding {
    background: #090909 !important;
     border-top: 1px solid #000 !important;
}
}


body.page-대문 #clbi-top-search-input {
body.page-대문 .clbi-tnav-sub-item {
     border-top-color: #171717 !important;
     background: #151515 !important;
    border-left-color: #171717 !important;
     border-right: 1px solid #050505 !important;
     border-right-color: #3f3f3f !important;
    border-bottom-color: #3a3a3a !important;
    background: #0e0e0e !important;
    color: #cccccc !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 3px rgba(0,0,0,0.70),
         inset 1px 1px 0 rgba(255,255,255,0.07),
         inset -1px -1px 0 rgba(255,255,255,0.045) !important;
         inset -1px -1px 0 rgba(0,0,0,0.85) !important;
}
}


body.page-대문 #clbi-sub-worldbuilding {
body.page-대문 .clbi-tnav-sub-item:hover {
     background: #111111 !important;
     background: #222222 !important;
}
}


body.page-대문 .clbi-tnav-sub-item {
/* 검색창 */
     border-right-color: #191919 !important;
body.page-대문 #clbi-top-search-input {
     background:
    background: #050505 !important;
        linear-gradient(to bottom, #262626 0%, #181818 52%, #101010 100%) !important;
     border-top: 1px solid #000 !important;
    border-left: 1px solid #000 !important;
     border-right: 1px solid #3f3f3f !important;
    border-bottom: 1px solid #3f3f3f !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 0 rgba(255,255,255,0.07),
         inset 2px 2px 0 rgba(0,0,0,0.92),
         inset -1px -1px 0 rgba(0,0,0,0.52) !important;
         inset -1px -1px 0 rgba(255,255,255,0.05) !important;
    color: #d2d2d2 !important;
}
}


/* 좌우 사이드바 패널: 날카로움 유지, 대비만 완화 */
/* 좌우 사이드바 박스 */
body.page-대문 .clbi-left-box,
body.page-대문 .clbi-left-box,
body.page-대문 .clbi-right-box {
body.page-대문 .clbi-right-box {
    border-top-color: #575757 !important;
    border-left-color: #4b4b4b !important;
    border-right-color: #191919 !important;
    border-bottom-color: #111111 !important;
     background:
     background:
         repeating-linear-gradient(
         repeating-linear-gradient(
115번째 줄: 119번째 줄:
             transparent 5px
             transparent 5px
         ),
         ),
         linear-gradient(to bottom, #1a1a1a 0%, #121212 100%) !important;
         var(--y2k-panel) !important;
    border-top: 1px solid #666 !important;
    border-left: 1px solid #555 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset -1px -1px 0 rgba(0,0,0,0.55),
         inset -1px -1px 0 rgba(0,0,0,0.92),
         1px 1px 0 #050505 !important;
         2px 2px 0 #000 !important;
}
}


body.page-대문 .clbi-left-title,
body.page-대문 .clbi-left-title,
body.page-대문 .clbi-right-title {
body.page-대문 .clbi-right-title {
     border-bottom-color: #171717 !important;
     background: var(--y2k-title) !important;
     background:
     border-bottom: 1px solid #050505 !important;
        linear-gradient(to bottom, #2b2b2b 0%, #1c1c1c 55%, #111111 100%) !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 0 rgba(255,255,255,0.09),
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset 0 -1px 0 rgba(0,0,0,0.55) !important;
         inset 0 -1px 0 rgba(0,0,0,0.90) !important;
    color: #d8d8d8 !important;
}
}


body.page-대문 .clbi-left-content,
body.page-대문 .clbi-left-content,
body.page-대문 .clbi-right-content {
body.page-대문 .clbi-right-content {
     background: #101010 !important;
     background: var(--y2k-inner) !important;
    color: #c7c7c7 !important;
}
}


body.page-대문 .clbi-recent-item {
/* JS 인라인 배경이 있는 유저 박스도 평면화 */
    border-top-color: #262626 !important;
body.page-대문 #clbi-right-sidebar .clbi-right-box > div[style*="display:flex"],
    border-left-color: #262626 !important;
body.page-대문 #clbi-right-sidebar .clbi-right-box > div[style*="flex-direction"] {
    border-right-color: #121212 !important;
     background: #151515 !important;
    border-bottom-color: #121212 !important;
     background: #171717 !important;
}
}


body.page-대문 .clbi-recent-title {
body.page-대문 .clbi-user-btn {
     color: #cfcfcf !important;
     background: #181818 !important;
    border: 1px solid #333 !important;
    border-left: 3px solid #5a5a5a !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.07),
        inset -1px -1px 0 rgba(0,0,0,0.85) !important;
}
}


body.page-대문 .clbi-recent-title:hover {
body.page-대문 .clbi-user-btn:hover {
     color: #eeeeee !important;
    background: #242424 !important;
     color: #ffffff !important;
}
}


body.page-대문 .clbi-recent-time {
/* 최근 변경 행 */
     color: #777777 !important;
body.page-대문 .clbi-recent-item {
     background: #141414 !important;
    border-top: 1px solid #292929 !important;
    border-left: 1px solid #292929 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #050505 !important;
    box-shadow: none !important;
}
}


/* 로고 배너 */
/* 로고 박스 */
body.page-대문 #clbi-main-logo {
body.page-대문 #clbi-main-logo {
     border-top-color: #575757 !important;
     background: #101010 !important;
     border-left-color: #4b4b4b !important;
     border-top: 1px solid #666 !important;
     border-right-color: #191919 !important;
     border-left: 1px solid #555 !important;
     border-bottom-color: #111111 !important;
     border-right: 1px solid #050505 !important;
     background:
     border-bottom: 1px solid #000 !important;
        radial-gradient(ellipse at 50% 20%, rgba(255,255,255,0.055), transparent 45%),
        linear-gradient(to bottom, #1b1b1b 0%, #0d0d0d 100%) !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset -1px -1px 0 rgba(0,0,0,0.58),
         inset -1px -1px 0 rgba(0,0,0,0.90),
         1px 1px 0 #050505 !important;
         2px 2px 0 #000 !important;
}
}


177번째 줄: 190번째 줄:
     filter:
     filter:
         grayscale(1)
         grayscale(1)
         contrast(1.05)
         contrast(1.08)
         brightness(0.96)
         brightness(1.02)
         drop-shadow(1px 1px 0 #080808) !important;
         drop-shadow(2px 2px 0 #000) !important;
}
}


185번째 줄: 198번째 줄:
body.page-대문 .Liberty .content-wrapper .liberty-content .liberty-content-main,
body.page-대문 .Liberty .content-wrapper .liberty-content .liberty-content-main,
body.page-대문 .liberty-content-main {
body.page-대문 .liberty-content-main {
     border-top-color: #575757 !important;
     background: #101010 !important;
     border-left-color: #4b4b4b !important;
     border-top: 1px solid #666 !important;
     border-right-color: #191919 !important;
     border-left: 1px solid #555 !important;
     border-bottom-color: #111111 !important;
     border-right: 1px solid #050505 !important;
     background:
     border-bottom: 1px solid #000 !important;
        repeating-linear-gradient(
            0deg,
            #141414 0px,
            #141414 18px,
            #171717 19px
        ) !important;
    color: #d2d2d2 !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 0 rgba(255,255,255,0.075),
         inset 1px 1px 0 rgba(255,255,255,0.07),
         inset -1px -1px 0 rgba(0,0,0,0.56),
         inset -1px -1px 0 rgba(0,0,0,0.90),
         1px 1px 0 #050505 !important;
         2px 2px 0 #000 !important;
}
}


/* 히어로 프레임 */
/* 히어로 외곽 */
.clbi-y2k-hero {
.clbi-y2k-hero {
    border-top-color: #575757;
    border-left-color: #4b4b4b;
    border-right-color: #191919;
    border-bottom-color: #111111;
     background:
     background:
         repeating-linear-gradient(
         repeating-linear-gradient(
             135deg,
             135deg,
             rgba(255,255,255,0.015) 0px,
             rgba(255,255,255,0.014) 0px,
             rgba(255,255,255,0.015) 1px,
             rgba(255,255,255,0.014) 1px,
             transparent 1px,
             transparent 1px,
             transparent 5px
             transparent 5px
         ),
         ),
         #171717;
         #151515 !important;
    border-top: 1px solid #666 !important;
    border-left: 1px solid #555 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset -1px -1px 0 rgba(0,0,0,0.58),
         inset -1px -1px 0 rgba(0,0,0,0.92),
         1px 1px 0 #050505;
         2px 2px 0 #000 !important;
}
}


.clbi-y2k-hero-top {
.clbi-y2k-hero-top {
     border-top-color: #4f4f4f;
    background: #202020 !important;
     border-left-color: #404040;
     border-top: 1px solid #555 !important;
     border-right-color: #171717;
     border-left: 1px solid #444 !important;
     border-bottom-color: #111111;
     border-right: 1px solid #050505 !important;
     background:
     border-bottom: 1px solid #000 !important;
         linear-gradient(to bottom, #292929 0%, #1b1b1b 58%, #101010 100%);
     box-shadow:
    color: #d5d5d5;
         inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.88) !important;
}
}


/* 중앙 소개 패널: CRT 느낌은 유지하되 면은 평평하게 */
.clbi-y2k-feature {
.clbi-y2k-feature {
    border-top-color: #171717;
    border-left-color: #171717;
    border-right-color: #3a3a3a;
    border-bottom-color: #414141;
     background:
     background:
        linear-gradient(to bottom, rgba(255,255,255,0.025), transparent 26%),
         repeating-linear-gradient(
         repeating-linear-gradient(
             to bottom,
             to bottom,
             rgba(255,255,255,0.024) 0px,
             rgba(255,255,255,0.028) 0px,
             rgba(255,255,255,0.024) 1px,
             rgba(255,255,255,0.028) 1px,
             transparent 1px,
             transparent 1px,
             transparent 4px
             transparent 4px
         ),
         ),
         #101010;
         #080808 !important;
    border-top: 1px solid #050505 !important;
    border-left: 1px solid #050505 !important;
    border-right: 1px solid #3f3f3f !important;
    border-bottom: 1px solid #444 !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 5px rgba(0,0,0,0.70),
         inset 2px 2px 0 rgba(0,0,0,0.90),
         inset -1px -1px 0 rgba(255,255,255,0.045);
         inset -1px -1px 0 rgba(255,255,255,0.05) !important;
}
}


.clbi-y2k-feature h2 {
.clbi-y2k-feature h2 {
    color: #e4e4e4 !important;
    border-bottom-color: #303030 !important;
     text-shadow:
     text-shadow:
         1px 1px 0 #050505,
         1px 1px 0 #000,
         0 0 4px rgba(255,255,255,0.14);
         0 0 3px rgba(255,255,255,0.16) !important;
}
}


.clbi-y2k-feature p {
.clbi-y2k-feature p {
    color: #c8c8c8;
     text-shadow: 1px 1px 0 #000 !important;
     text-shadow: 1px 1px 0 #060606;
}
}


/* 우측 작은 정보판 */
.clbi-y2k-sideplate {
.clbi-y2k-sideplate {
     border-top-color: #171717;
    background: #090909 !important;
     border-left-color: #171717;
     border-top: 1px solid #050505 !important;
     border-right-color: #393939;
     border-left: 1px solid #050505 !important;
     border-bottom-color: #414141;
     border-right: 1px solid #3f3f3f !important;
    background: #101010;
     border-bottom: 1px solid #444 !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 4px rgba(0,0,0,0.68),
         inset 2px 2px 0 rgba(0,0,0,0.90),
         inset -1px -1px 0 rgba(255,255,255,0.04);
         inset -1px -1px 0 rgba(255,255,255,0.05) !important;
}
}


.clbi-y2k-plate-title {
.clbi-y2k-plate-title {
     border-top-color: #505050;
    background: #202020 !important;
     border-left-color: #434343;
     border-top: 1px solid #555 !important;
     border-right-color: #171717;
     border-left: 1px solid #444 !important;
     border-bottom-color: #111111;
     border-right: 1px solid #050505 !important;
     background:
     border-bottom: 1px solid #000 !important;
         linear-gradient(to bottom, #292929 0%, #1a1a1a 55%, #101010 100%);
     box-shadow:
    color: #dcdcdc;
         inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.88) !important;
}
}


/* 내부 테이블 */
/* */
.clbi-y2k-mini-table td {
.clbi-y2k-mini-table td {
    border-color: #292929;
     background: #121212 !important;
     background: #171717;
     border: 1px solid #292929 !important;
     color: #c4c4c4;
}
}


.clbi-y2k-mini-table td:first-child {
.clbi-y2k-mini-table td:first-child {
     color: #858585;
     background: #0b0b0b !important;
     background: #121212;
     color: #888 !important;
}
}


/* 티커와 하단 박스 */
/* 티커 */
.clbi-y2k-ticker {
.clbi-y2k-ticker {
     border-top-color: #4d4d4d;
    background: #171717 !important;
     border-left-color: #414141;
     border-top: 1px solid #555 !important;
     border-right-color: #171717;
     border-left: 1px solid #444 !important;
     border-bottom-color: #111111;
     border-right: 1px solid #050505 !important;
     background:
     border-bottom: 1px solid #000 !important;
         linear-gradient(to bottom, #232323 0%, #141414 100%);
     box-shadow:
    color: #a9a9a9;
         inset 1px 1px 0 rgba(255,255,255,0.07),
        inset -1px -1px 0 rgba(0,0,0,0.86) !important;
}
}


/* 하단 박스 */
.clbi-y2k-box {
.clbi-y2k-box {
     border-top-color: #575757;
    background: #111111 !important;
     border-left-color: #4b4b4b;
     border-top: 1px solid #666 !important;
     border-right-color: #191919;
     border-left: 1px solid #555 !important;
     border-bottom-color: #111111;
     border-right: 1px solid #050505 !important;
    background: #151515;
     border-bottom: 1px solid #000 !important;
     box-shadow:
     box-shadow:
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset 1px 1px 0 rgba(255,255,255,0.08),
         inset -1px -1px 0 rgba(0,0,0,0.56),
         inset -1px -1px 0 rgba(0,0,0,0.90),
         1px 1px 0 #050505;
         2px 2px 0 #000 !important;
}
}


.clbi-y2k-box-title {
.clbi-y2k-box-title {
     border-bottom-color: #171717;
    background: #202020 !important;
     background:
     border-bottom: 1px solid #050505 !important;
         linear-gradient(to bottom, #2b2b2b 0%, #1b1b1b 56%, #101010 100%);
     box-shadow:
    color: #dddddd;
         inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.88) !important;
}
}


339번째 줄: 347번째 줄:
             transparent 5px
             transparent 5px
         ),
         ),
         #101010;
         #090909 !important;
}
}


/* 목록 행 */
.clbi-y2k-list li {
.clbi-y2k-list li {
     border-top-color: #272727;
    background: #141414 !important;
     border-left-color: #272727;
     border-top: 1px solid #292929 !important;
     border-right-color: #121212;
     border-left: 1px solid #292929 !important;
     border-bottom-color: #121212;
     border-right: 1px solid #050505 !important;
     background: #171717;
     border-bottom: 1px solid #050505 !important;
    color: #c7c7c7;
     box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.035),
        inset -1px -1px 0 rgba(0,0,0,0.70) !important;
}
}


.clbi-y2k-list a {
/* 상태 카운터 */
     color: #d0d0d0 !important;
.clbi-y2k-counter {
     background: #070707 !important;
    border-top: 1px solid #050505 !important;
    border-left: 1px solid #050505 !important;
    border-right: 1px solid #3d3d3d !important;
    border-bottom: 1px solid #444 !important;
    box-shadow:
        inset 2px 2px 0 rgba(0,0,0,0.90),
        inset -1px -1px 0 rgba(255,255,255,0.045) !important;
}
}


.clbi-y2k-list a:hover {
.clbi-y2k-counter b {
     color: #eeeeee !important;
     text-shadow: 1px 1px 0 #000 !important;
}
}


.clbi-y2k-meta {
/* 방명록 */
     color: #7d7d7d;
.clbi-y2k-guest {
     background: #141414 !important;
    border-top: 1px solid #292929 !important;
    border-left: 1px solid #292929 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #050505 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.035),
        inset -1px -1px 0 rgba(0,0,0,0.70) !important;
}
}


/* 숫자 패널 */
/* 버튼/링크 박스도 평면화 */
.clbi-y2k-counter {
body.page-대문 .clbi-link-box ul li a,
     border-top-color: #171717;
body.page-대문 #clbi-search-btn {
     border-left-color: #171717;
    background: #181818 !important;
     border-right-color: #3a3a3a;
     border-top: 1px solid #555 !important;
     border-bottom-color: #414141;
     border-left: 1px solid #444 !important;
    background: #101010;
     border-right: 1px solid #050505 !important;
     box-shadow: inset 1px 1px 4px rgba(0,0,0,0.68);
     border-bottom: 1px solid #000 !important;
}
     box-shadow:
 
        inset 1px 1px 0 rgba(255,255,255,0.07),
.clbi-y2k-counter b {
        inset -1px -1px 0 rgba(0,0,0,0.85) !important;
    color: #dedede;
}
}


.clbi-y2k-counter span {
body.page-대문 .clbi-link-box ul li a:hover,
     color: #858585;
body.page-대문 #clbi-search-btn:hover {
     background: #242424 !important;
}
}


/* 방명록 */
/* 과한 필터감도 약간 정리 */
.clbi-y2k-guest {
body.page-대문 .clbi-icon,
    border-top-color: #272727;
body.page-대문 .clbi-tnav-icon {
    border-left-color: #272727;
     filter: grayscale(1) brightness(1.45) contrast(0.92) !important;
     border-right-color: #121212;
     opacity: 0.85 !important;
     border-bottom-color: #121212;
    background: #171717;
    color: #c3c3c3;
}
}

2026년 5월 16일 (토) 14:50 판

/* =========================================
   TEST REMAKE v2.1
   Cell-shaded Matte Override
   - 강한 그라디언트 제거
   - 평면 색 + 1px 하이라이트/섀도우
   ========================================= */

body.page-대문 {
    --y2k-black: #000000;
    --y2k-bg: #050505;
    --y2k-panel: #111111;
    --y2k-panel-2: #151515;
    --y2k-panel-3: #1b1b1b;
    --y2k-title: #202020;
    --y2k-title-hover: #282828;
    --y2k-inner: #080808;
    --y2k-inner-2: #0d0d0d;
    --y2k-line-hi: #5a5a5a;
    --y2k-line-mid: #333333;
    --y2k-line-low: #050505;
    --y2k-text: #e0e0e0;
    --y2k-text-dim: #8a8a8a;
}

/* 배경도 빛 번짐보다 어두운 평면 타일감 */
body.page-대문 .WW-bg {
    background: #020202 !important;
}

body.page-대문 .WW-bg::before {
    opacity: 0.34 !important;
    filter: none !important;
    background-image:
        linear-gradient(rgba(120,120,120,0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(120,120,120,0.08) 1px, transparent 1px),
        repeating-linear-gradient(
            135deg,
            rgba(255,255,255,0.014) 0px,
            rgba(255,255,255,0.014) 1px,
            transparent 1px,
            transparent 6px
        ) !important;
    background-size:
        64px 64px,
        64px 64px,
        6px 6px !important;
}

body.page-대문 .WW-bg::after {
    background: none !important;
}

/* 상단 네비게이션: 셀 채색식 금속판 */
body.page-대문 #clbi-top-nav {
    background: var(--y2k-panel-2) !important;
    border-top: 1px solid var(--y2k-line-hi) !important;
    border-left: 1px solid #4a4a4a !important;
    border-right: 1px solid var(--y2k-line-low) !important;
    border-bottom: 1px solid #000 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.10),
        inset -1px -1px 0 rgba(0,0,0,0.95),
        2px 2px 0 #000 !important;
}

body.page-대문 .clbi-top-nav-item {
    background: #181818 !important;
    border-left: 1px solid #303030 !important;
    border-right: 1px solid #050505 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.85) !important;
}

body.page-대문 .clbi-top-nav-item:hover,
body.page-대문 .clbi-top-nav-item.clbi-tnav-active {
    background: #242424 !important;
    color: #ffffff !important;
}

body.page-대문 #clbi-sub-worldbuilding {
    background: #090909 !important;
    border-top: 1px solid #000 !important;
}

body.page-대문 .clbi-tnav-sub-item {
    background: #151515 !important;
    border-right: 1px solid #050505 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.07),
        inset -1px -1px 0 rgba(0,0,0,0.85) !important;
}

body.page-대문 .clbi-tnav-sub-item:hover {
    background: #222222 !important;
}

/* 검색창 */
body.page-대문 #clbi-top-search-input {
    background: #050505 !important;
    border-top: 1px solid #000 !important;
    border-left: 1px solid #000 !important;
    border-right: 1px solid #3f3f3f !important;
    border-bottom: 1px solid #3f3f3f !important;
    box-shadow:
        inset 2px 2px 0 rgba(0,0,0,0.92),
        inset -1px -1px 0 rgba(255,255,255,0.05) !important;
}

/* 좌우 사이드바 박스 */
body.page-대문 .clbi-left-box,
body.page-대문 .clbi-right-box {
    background:
        repeating-linear-gradient(
            135deg,
            rgba(255,255,255,0.014) 0px,
            rgba(255,255,255,0.014) 1px,
            transparent 1px,
            transparent 5px
        ),
        var(--y2k-panel) !important;
    border-top: 1px solid #666 !important;
    border-left: 1px solid #555 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.92),
        2px 2px 0 #000 !important;
}

body.page-대문 .clbi-left-title,
body.page-대문 .clbi-right-title {
    background: var(--y2k-title) !important;
    border-bottom: 1px solid #050505 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.08),
        inset 0 -1px 0 rgba(0,0,0,0.90) !important;
}

body.page-대문 .clbi-left-content,
body.page-대문 .clbi-right-content {
    background: var(--y2k-inner) !important;
}

/* JS 인라인 배경이 있는 유저 박스도 평면화 */
body.page-대문 #clbi-right-sidebar .clbi-right-box > div[style*="display:flex"],
body.page-대문 #clbi-right-sidebar .clbi-right-box > div[style*="flex-direction"] {
    background: #151515 !important;
}

body.page-대문 .clbi-user-btn {
    background: #181818 !important;
    border: 1px solid #333 !important;
    border-left: 3px solid #5a5a5a !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.07),
        inset -1px -1px 0 rgba(0,0,0,0.85) !important;
}

body.page-대문 .clbi-user-btn:hover {
    background: #242424 !important;
    color: #ffffff !important;
}

/* 최근 변경 행 */
body.page-대문 .clbi-recent-item {
    background: #141414 !important;
    border-top: 1px solid #292929 !important;
    border-left: 1px solid #292929 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #050505 !important;
    box-shadow: none !important;
}

/* 로고 박스 */
body.page-대문 #clbi-main-logo {
    background: #101010 !important;
    border-top: 1px solid #666 !important;
    border-left: 1px solid #555 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.90),
        2px 2px 0 #000 !important;
}

body.page-대문 #clbi-main-logo img {
    filter:
        grayscale(1)
        contrast(1.08)
        brightness(1.02)
        drop-shadow(2px 2px 0 #000) !important;
}

/* 중앙 본문 컨테이너 */
body.page-대문 .Liberty .content-wrapper .liberty-content .liberty-content-main,
body.page-대문 .liberty-content-main {
    background: #101010 !important;
    border-top: 1px solid #666 !important;
    border-left: 1px solid #555 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.07),
        inset -1px -1px 0 rgba(0,0,0,0.90),
        2px 2px 0 #000 !important;
}

/* 히어로 외곽 */
.clbi-y2k-hero {
    background:
        repeating-linear-gradient(
            135deg,
            rgba(255,255,255,0.014) 0px,
            rgba(255,255,255,0.014) 1px,
            transparent 1px,
            transparent 5px
        ),
        #151515 !important;
    border-top: 1px solid #666 !important;
    border-left: 1px solid #555 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.92),
        2px 2px 0 #000 !important;
}

.clbi-y2k-hero-top {
    background: #202020 !important;
    border-top: 1px solid #555 !important;
    border-left: 1px solid #444 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.88) !important;
}

/* 중앙 소개 패널: CRT 느낌은 유지하되 면은 평평하게 */
.clbi-y2k-feature {
    background:
        repeating-linear-gradient(
            to bottom,
            rgba(255,255,255,0.028) 0px,
            rgba(255,255,255,0.028) 1px,
            transparent 1px,
            transparent 4px
        ),
        #080808 !important;
    border-top: 1px solid #050505 !important;
    border-left: 1px solid #050505 !important;
    border-right: 1px solid #3f3f3f !important;
    border-bottom: 1px solid #444 !important;
    box-shadow:
        inset 2px 2px 0 rgba(0,0,0,0.90),
        inset -1px -1px 0 rgba(255,255,255,0.05) !important;
}

.clbi-y2k-feature h2 {
    text-shadow:
        1px 1px 0 #000,
        0 0 3px rgba(255,255,255,0.16) !important;
}

.clbi-y2k-feature p {
    text-shadow: 1px 1px 0 #000 !important;
}

/* 우측 작은 정보판 */
.clbi-y2k-sideplate {
    background: #090909 !important;
    border-top: 1px solid #050505 !important;
    border-left: 1px solid #050505 !important;
    border-right: 1px solid #3f3f3f !important;
    border-bottom: 1px solid #444 !important;
    box-shadow:
        inset 2px 2px 0 rgba(0,0,0,0.90),
        inset -1px -1px 0 rgba(255,255,255,0.05) !important;
}

.clbi-y2k-plate-title {
    background: #202020 !important;
    border-top: 1px solid #555 !important;
    border-left: 1px solid #444 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.88) !important;
}

/* 표 */
.clbi-y2k-mini-table td {
    background: #121212 !important;
    border: 1px solid #292929 !important;
}

.clbi-y2k-mini-table td:first-child {
    background: #0b0b0b !important;
    color: #888 !important;
}

/* 티커 */
.clbi-y2k-ticker {
    background: #171717 !important;
    border-top: 1px solid #555 !important;
    border-left: 1px solid #444 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.07),
        inset -1px -1px 0 rgba(0,0,0,0.86) !important;
}

/* 하단 박스 */
.clbi-y2k-box {
    background: #111111 !important;
    border-top: 1px solid #666 !important;
    border-left: 1px solid #555 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.90),
        2px 2px 0 #000 !important;
}

.clbi-y2k-box-title {
    background: #202020 !important;
    border-bottom: 1px solid #050505 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.08),
        inset -1px -1px 0 rgba(0,0,0,0.88) !important;
}

.clbi-y2k-box-body {
    background:
        repeating-linear-gradient(
            135deg,
            rgba(255,255,255,0.012) 0px,
            rgba(255,255,255,0.012) 1px,
            transparent 1px,
            transparent 5px
        ),
        #090909 !important;
}

/* 목록 행 */
.clbi-y2k-list li {
    background: #141414 !important;
    border-top: 1px solid #292929 !important;
    border-left: 1px solid #292929 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #050505 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.035),
        inset -1px -1px 0 rgba(0,0,0,0.70) !important;
}

/* 상태 카운터 */
.clbi-y2k-counter {
    background: #070707 !important;
    border-top: 1px solid #050505 !important;
    border-left: 1px solid #050505 !important;
    border-right: 1px solid #3d3d3d !important;
    border-bottom: 1px solid #444 !important;
    box-shadow:
        inset 2px 2px 0 rgba(0,0,0,0.90),
        inset -1px -1px 0 rgba(255,255,255,0.045) !important;
}

.clbi-y2k-counter b {
    text-shadow: 1px 1px 0 #000 !important;
}

/* 방명록 */
.clbi-y2k-guest {
    background: #141414 !important;
    border-top: 1px solid #292929 !important;
    border-left: 1px solid #292929 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #050505 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.035),
        inset -1px -1px 0 rgba(0,0,0,0.70) !important;
}

/* 버튼/링크 박스도 평면화 */
body.page-대문 .clbi-link-box ul li a,
body.page-대문 #clbi-search-btn {
    background: #181818 !important;
    border-top: 1px solid #555 !important;
    border-left: 1px solid #444 !important;
    border-right: 1px solid #050505 !important;
    border-bottom: 1px solid #000 !important;
    box-shadow:
        inset 1px 1px 0 rgba(255,255,255,0.07),
        inset -1px -1px 0 rgba(0,0,0,0.85) !important;
}

body.page-대문 .clbi-link-box ul li a:hover,
body.page-대문 #clbi-search-btn:hover {
    background: #242424 !important;
}

/* 과한 필터감도 약간 정리 */
body.page-대문 .clbi-icon,
body.page-대문 .clbi-tnav-icon {
    filter: grayscale(1) brightness(1.45) contrast(0.92) !important;
    opacity: 0.85 !important;
}