미디어위키:Gadget-Timeless.css: 두 판 사이의 차이

식물 vs 좀비 위키
둘러보기로 이동 검색으로 이동
← 이전 편집다음 편집 →
Brokey (토론 | 기여)
사무관, 인터페이스 관리자, 관리자
456 편집
편집 요약 없음
편집 요약 없음
1번째 줄: 1번째 줄:
/* MediaWiki:Gadget-Timeless.css
/* =========================================================
* PvZKRWiki Timeless 모바일 인터페이스
  1. 공통 변수
* 기존 Timeless의 기능·구조·UI 위치는 유지하고 시각 디자인만 교체
  ========================================================= */
*/


:root {
:root {
--pvzt-green: #3f8d3c;
--pvzt-green: #3f8f3d;
--pvzt-green-dark: #2f7031;
--pvzt-green-dark: #286d31;
--pvzt-green-deep: #17633f;
--pvzt-green-deep: #17623a;
--pvzt-green-soft: #dfeecd;
--pvzt-cream: #fff5df;
 
--pvzt-cream-soft: #f5e3c1;
--pvzt-brown-950: #2f1d13;
--pvzt-paper: #fff8e8;
--pvzt-brown-900: #3c2619;
--pvzt-paper-2: #f8ebcf;
--pvzt-brown-800: #5a3521;
--pvzt-brown: #6b3a24;
--pvzt-brown-700: #75462d;
--pvzt-brown-dark: #442516;
--pvzt-brown-600: #916342;
--pvzt-wood: #4a2b1c;
 
--pvzt-wood-2: #352016;
--pvzt-paper: #fff6e4;
--pvzt-line: #b88c5c;
--pvzt-paper-2: #f7e7c8;
--pvzt-text: #432d22;
--pvzt-paper-3: #ecd6ac;
--pvzt-muted: #7a6455;
--pvzt-line: #c9a978;
--pvzt-shadow: 0 6px 20px rgba(48, 26, 14, 0.18);
--pvzt-line-dark: #8b5a36;
--pvzt-header-h: 104px;
 
--pvzt-text: #49362a;
--pvzt-muted: #796454;
--pvzt-link: #2d6f35;
--pvzt-link-hover: #21592a;
 
--pvzt-radius-sm: 8px;
--pvzt-radius-md: 12px;
--pvzt-radius-lg: 16px;
--pvzt-shadow:
0 5px 16px rgba(42, 24, 12, 0.16);
--pvzt-shadow-soft:
0 2px 8px rgba(42, 24, 12, 0.11);
}
}




/* =========================
/* =========================================================
   모바일에서만 적용
   2. 모바일 기본 배경
   ========================= */
   ========================================================= */


@media screen and (max-width: 850px) {
@media screen and (max-width: 850px) {
/* =========================
  기본 바탕 초기화
  ========================= */
html {
html {
min-height: 100% !important;
min-height: 100% !important;
background: var(--pvzt-brown-950) !important;
background: #3a2419 !important;
}
}


55번째 줄: 36번째 줄:
min-height: 100vh !important;
min-height: 100vh !important;
margin: 0 !important;
margin: 0 !important;
padding: var(--pvzt-header-h) 0 0 !important;
background:
background:
linear-gradient(
linear-gradient(
rgba(47, 29, 19, 0.94),
rgba(57, 34, 22, 0.94),
rgba(47, 29, 19, 0.94)
rgba(57, 34, 22, 0.94)
),
),
url("/wiki/Special:Redirect/file/Wiki_Bg_Light.png")
url("/wiki/Special:Redirect/file/Wiki_Bg_Light.png")
center / cover fixed !important;
center / cover fixed !important;
color: var(--pvzt-text) !important;
color: var(--pvzt-text) !important;
font-family:
}
"SB Aggro L",
 
"SB 어그로 L",
body.skin-timeless.pvzt-mobile-ready {
-apple-system,
overflow-x: hidden !important;
BlinkMacSystemFont,
"Segoe UI",
"Apple SD Gothic Neo",
"Noto Sans KR",
sans-serif !important;
}
}


.skin-timeless #mw-content-container,
.skin-timeless #mw-content-container,
.skin-timeless #mw-content-block,
.skin-timeless #mw-content-block,
.skin-timeless #mw-content-wrapper,
.skin-timeless #mw-content-wrapper {
.skin-timeless #mw-content,
background: transparent !important;
.skin-timeless #mw-header-container,
.skin-timeless #mw-header,
.skin-timeless #mw-header-hack,
.skin-timeless #mw-header-nav-hack,
.skin-timeless #mw-footer-container,
.skin-timeless .mw-footer-container {
background-image: none !important;
background-image: none !important;
border: 0 !important;
box-shadow: none !important;
}
.skin-timeless #mw-content-container {
margin: 0 !important;
padding: 0 !important;
}
}


.skin-timeless #mw-content-container,
.skin-timeless #mw-content-block,
.skin-timeless #mw-content-block,
.skin-timeless #mw-content-wrapper {
.skin-timeless #mw-content-wrapper {
border: 0 !important;
width: 100% !important;
background: transparent !important;
max-width: none !important;
box-shadow: none !important;
margin: 0 !important;
padding: 0 !important;
}
}
 
 
/* =========================================================
  3. 커스텀 UI 생성 후 기본 Timeless UI 숨김
  ========================================================= */
 
@media screen and (max-width: 850px) {
body.skin-timeless.pvzt-mobile-ready #mw-header-container,
body.skin-timeless.pvzt-mobile-ready #mw-header-hack,
body.skin-timeless.pvzt-mobile-ready #mw-header-nav-hack,
body.skin-timeless.pvzt-mobile-ready #mw-site-navigation,
body.skin-timeless.pvzt-mobile-ready #mw-related-navigation,
body.skin-timeless.pvzt-mobile-ready #personal,
body.skin-timeless.pvzt-mobile-ready #user-tools,
body.skin-timeless.pvzt-mobile-ready .tools-inline,
body.skin-timeless.pvzt-mobile-ready #site-navigation,
body.skin-timeless.pvzt-mobile-ready #page-tools {
display: none !important;
}
}
 
 
/* =========================================================
  4. 상단 모바일 헤더
  ========================================================= */
 
@media screen and (max-width: 850px) {
.pvzt-mobile-header {
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 1200;
display: grid;
grid-template-columns: 44px minmax(0, 1fr) 44px;
grid-template-rows: 48px 48px;
gap: 0 8px;
height: var(--pvzt-header-h);
padding: 6px 10px;
box-sizing: border-box;
background: var(--pvzt-green);
border-bottom: 2px solid var(--pvzt-green-dark);
box-shadow: 0 3px 12px rgba(22, 48, 21, 0.28);
}
 
.pvzt-mobile-header__button {
display: inline-flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
padding: 0;
border: 0;
border-radius: 10px;
background: transparent;
color: #ffffff;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
}


.pvzt-mobile-header__button:hover,
.pvzt-mobile-header__button:focus-visible {
background: rgba(255, 255, 255, 0.14);
outline: 0;
}


/* =========================
.pvzt-mobile-header__button::before {
  상단 헤더
content: "";
  ========================= */
display: block;
width: 24px;
height: 24px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}


.skin-timeless #mw-header-container,
.pvzt-mobile-header__button--menu::before {
.skin-timeless #mw-header,
background-image:
.skin-timeless #mw-header-hack,
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M4 6.5h16v2H4zm0 4.5h16v2H4zm0 4.5h16v2H4z'/%3E%3C/svg%3E");
.skin-timeless #mw-header-nav-hack {
background: var(--pvzt-green) !important;
border: 0 !important;
box-shadow:
inset 0 -1px 0 rgba(28, 91, 31, 0.55),
0 3px 9px rgba(19, 38, 17, 0.22) !important;
color: #ffffff !important;
}
}


.skin-timeless #mw-header {
.pvzt-mobile-header__button--account::before {
padding-top: 0.5rem !important;
background-image:
padding-bottom: 0.5rem !important;
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 12a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9Zm0 2c-4.7 0-8 2.45-8 5.2V21h16v-1.8c0-2.75-3.3-5.2-8-5.2Z'/%3E%3C/svg%3E");
}
}


.skin-timeless #p-logo-text a,
.pvzt-mobile-brand {
.skin-timeless #p-logo-text a:visited {
display: flex;
color: #ffffff !important;
align-items: center;
min-width: 0;
height: 44px;
color: #ffffff;
text-decoration: none !important;
font-family:
font-family:
"SB Aggro B",
"SB Aggro B",
126번째 줄: 172번째 줄:
"SB 어그로",
"SB 어그로",
sans-serif !important;
sans-serif !important;
font-size: 0.94rem !important;
font-size: 1rem;
font-variant: normal !important;
font-weight: 700;
font-weight: 700 !important;
line-height: 1.1;
line-height: 1.2 !important;
text-shadow: 0 1px 1px rgba(18, 61, 27, 0.35);
text-decoration: none !important;
text-shadow: none !important;
}
}


.skin-timeless #p-logo-text a:hover {
.pvzt-mobile-brand:hover {
opacity: 0.9;
color: #ffffff;
text-decoration: none !important;
opacity: 0.94;
}
}


.skin-timeless .mw-wiki-logo {
.pvzt-mobile-brand__text {
filter: drop-shadow(0 2px 3px rgba(31, 18, 9, 0.28));
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}


.skin-timeless #user-tools,
.pvzt-mobile-search {
.skin-timeless #user-tools a,
grid-column: 1 / -1;
.skin-timeless #personal > h2,
grid-row: 2;
.skin-timeless #personal > h2 span {
display: flex;
color: #ffffff !important;
align-items: center;
width: 100%;
min-width: 0;
height: 42px;
}
}


 
.pvzt-mobile-search #simpleSearch,
/* =========================
.pvzt-mobile-search form {
  검색창
position: relative !important;
  ========================= */
display: flex !important;
 
width: 100% !important;
.skin-timeless #simpleSearch {
height: 42px !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
overflow: hidden !important;
border: 1px solid #6e9f68 !important;
border: 1px solid #6f4c35 !important;
border-radius: 9px !important;
border-radius: 9px !important;
background: #fff9ed !important;
background: #fff9ec !important;
box-shadow: none !important;
background-image: none !important;
box-shadow: inset 0 1px 2px rgba(85, 50, 28, 0.08) !important;
}
}


.skin-timeless #simpleSearch:focus-within {
.pvzt-mobile-search #searchInput,
border-color: #245e2a !important;
.pvzt-mobile-search input[type="search"],
box-shadow:
.pvzt-mobile-search input[name="search"] {
0 0 0 3px rgba(255, 255, 255, 0.18) !important;
flex: 1 1 auto !important;
}
min-width: 0 !important;
 
height: 40px !important;
.skin-timeless #searchInput {
margin: 0 !important;
height: 2.45rem !important;
padding: 0 46px 0 13px !important;
padding-right: 3rem !important;
border: 0 !important;
border: 0 !important;
outline: 0 !important;
outline: 0 !important;
background: transparent !important;
background: transparent !important;
color: var(--pvzt-text) !important;
color: var(--pvzt-text) !important;
font-family:
font-size: 16px !important;
"SB Aggro L",
"SB 어그로 L",
sans-serif !important;
font-size: 0.82rem !important;
font-weight: 300 !important;
box-shadow: none !important;
box-shadow: none !important;
}
}


.skin-timeless #searchInput::placeholder {
.pvzt-mobile-search #searchInput::placeholder,
color: rgba(73, 54, 42, 0.55) !important;
.pvzt-mobile-search input[name="search"]::placeholder {
color: rgba(67, 45, 34, 0.55) !important;
}
}


.skin-timeless #searchButton,
.pvzt-mobile-search #searchButton,
.skin-timeless #mw-searchButton {
.pvzt-mobile-search #mw-searchButton,
.pvzt-mobile-search button[type="submit"] {
position: absolute !important;
top: 0 !important;
top: 0 !important;
right: 0 !important;
right: 0 !important;
width: 2.7rem !important;
width: 44px !important;
height: 100% !important;
height: 40px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border: 0 !important;
border-left: 1px solid #d7bd90 !important;
border-left: 1px solid rgba(107, 58, 36, 0.35) !important;
border-radius: 0 !important;
border-radius: 0 !important;
background-color: transparent !important;
background-color: transparent !important;
background-image:
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2375462d' d='M10.75 3a7.75 7.75 0 1 0 4.82 13.82l4.31 4.31a1.25 1.25 0 0 0 1.77-1.77l-4.31-4.31A7.75 7.75 0 0 0 10.75 3Zm0 2.5a5.25 5.25 0 1 1 0 10.5 5.25 5.25 0 0 1 0-10.5Z'/%3E%3C/svg%3E") !important;
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%236b3a24' d='M10.7 3a7.7 7.7 0 1 0 4.73 13.78l4.4 4.4a1.2 1.2 0 1 0 1.7-1.7l-4.4-4.4A7.7 7.7 0 0 0 10.7 3Zm0 2.4a5.3 5.3 0 1 1 0 10.6 5.3 5.3 0 0 1 0-10.6Z'/%3E%3C/svg%3E") !important;
background-position: center !important;
background-position: center !important;
background-repeat: no-repeat !important;
background-repeat: no-repeat !important;
background-size: 18px !important;
background-size: 19px !important;
font-size: 0 !important;
box-shadow: none !important;
box-shadow: none !important;
cursor: pointer !important;
cursor: pointer;
}
}
}
/* =========================================================
  5. 배경 오버레이와 서랍
  ========================================================= */


.skin-timeless #searchButton:hover,
@media screen and (max-width: 850px) {
.skin-timeless #mw-searchButton:hover {
.pvzt-mobile-overlay {
background-color: #f3e4ca !important;
position: fixed;
inset: 0;
z-index: 1290;
visibility: hidden;
background: rgba(22, 12, 7, 0.55);
opacity: 0;
transition:
opacity 180ms ease,
visibility 0s linear 180ms;
}
}


.skin-timeless .suggestions .suggestions-results,
body.pvzt-mobile-panel-open .pvzt-mobile-overlay {
.skin-timeless .suggestions .suggestions-special {
visibility: visible;
border: 1px solid var(--pvzt-line) !important;
opacity: 1;
background: var(--pvzt-paper) !important;
transition-delay: 0s;
color: var(--pvzt-text) !important;
}
}


.skin-timeless .suggestions .suggestions-result-current {
.pvzt-mobile-drawer {
background: var(--pvzt-green-deep) !important;
position: fixed;
color: #ffffff !important;
top: 0;
bottom: 0;
z-index: 1300;
width: min(84vw, 330px);
padding: 14px 12px 24px;
box-sizing: border-box;
overflow-y: auto;
overscroll-behavior: contain;
background:
linear-gradient(
rgba(62, 37, 23, 0.96),
rgba(48, 29, 19, 0.98)
),
url("/wiki/Special:Redirect/file/Wiki_Bg_Dark.png")
center / cover;
color: #ffffff;
box-shadow: 0 0 24px rgba(26, 12, 5, 0.42);
transition: transform 210ms cubic-bezier(0.4, 0, 0.2, 1);
}
}


.pvzt-mobile-drawer--left {
left: 0;
transform: translateX(-104%);
border-right: 2px solid #25140d;
}


/* =========================
.pvzt-mobile-drawer--right {
  메뉴·사용자 버튼
right: 0;
  ========================= */
transform: translateX(104%);
border-left: 2px solid #25140d;
}


.skin-timeless #mw-site-navigation > h2,
body.pvzt-left-open .pvzt-mobile-drawer--left,
.skin-timeless #mw-related-navigation > h2,
body.pvzt-right-open .pvzt-mobile-drawer--right {
.skin-timeless #personal > h2 {
transform: translateX(0);
border: 1px solid rgba(38, 101, 40, 0.78) !important;
border-radius: 9px !important;
background: #fff9ed !important;
background-image: none !important;
box-shadow: none !important;
}
}


.skin-timeless #mw-site-navigation > h2:hover,
.pvzt-mobile-drawer__top {
.skin-timeless #mw-related-navigation > h2:hover,
display: flex;
.skin-timeless #personal > h2:hover {
align-items: center;
background: #ffffff !important;
justify-content: space-between;
gap: 10px;
min-height: 48px;
margin-bottom: 12px;
}
}


.skin-timeless .pokey {
.pvzt-mobile-drawer__title {
border-bottom-color: var(--pvzt-brown-800) !important;
margin: 0;
color: #ffffff;
font-family:
"SB Aggro B",
"SB 어그로 B",
"SB Aggro",
"SB 어그로",
sans-serif;
font-size: 1.05rem;
font-weight: 700;
}
}


.pvzt-mobile-drawer__close {
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
padding: 0;
border: 1px solid rgba(255, 255, 255, 0.28);
border-radius: 9px;
background: rgba(255, 255, 255, 0.08);
color: #ffffff;
font-size: 1.45rem;
line-height: 1;
cursor: pointer;
}


/* =========================
.pvzt-mobile-drawer__logo {
  드롭다운·사이드 메뉴
display: flex;
  기존 위치 유지
align-items: center;
  ========================= */
justify-content: center;
min-height: 98px;
margin: 0 0 13px;
padding: 10px;
border: 1px solid rgba(255, 236, 193, 0.2);
border-radius: 12px;
background: rgba(30, 17, 10, 0.3);
}


.skin-timeless #mw-site-navigation .sidebar-inner,
.pvzt-mobile-drawer__logo .mw-wiki-logo {
.skin-timeless #mw-related-navigation .sidebar-inner,
display: block !important;
.skin-timeless #personal .dropdown {
width: 145px !important;
overflow: hidden !important;
height: 90px !important;
border: 1px solid var(--pvzt-brown-800) !important;
max-width: 100% !important;
border-radius: var(--pvzt-radius-md) !important;
background-position: center !important;
background: var(--pvzt-paper-3) !important;
background-repeat: no-repeat !important;
background-image: none !important;
background-size: contain !important;
box-shadow: var(--pvzt-shadow) !important;
}
 
.pvzt-mobile-portlet {
margin: 0 0 12px;
overflow: hidden;
border: 1px solid #ad7b49;
border-radius: 8px;
background: var(--pvzt-cream-soft);
color: var(--pvzt-text);
box-shadow: 0 3px 8px rgba(20, 10, 5, 0.2);
}
}


.skin-timeless #mw-site-navigation .sidebar-inner h2,
.pvzt-mobile-portlet__title {
.skin-timeless #mw-site-navigation .sidebar-inner h3,
margin: 0;
.skin-timeless #mw-related-navigation .sidebar-inner h2,
padding: 9px 11px 8px;
.skin-timeless #mw-related-navigation .sidebar-inner h3,
border-bottom: 1px solid rgba(120, 75, 42, 0.2);
.skin-timeless #personal .dropdown h3 {
background: rgba(255, 255, 255, 0.36);
margin: 0 !important;
color: var(--pvzt-brown-dark);
padding: 0.56rem 0.68rem !important;
border: 0 !important;
border-bottom: 1px solid #d6b77f !important;
background: #f4e2bd !important;
color: var(--pvzt-brown-900) !important;
font-family:
font-family:
"SB Aggro M",
"SB Aggro M",
282번째 줄: 406번째 줄:
"SB Aggro",
"SB Aggro",
"SB 어그로",
"SB 어그로",
sans-serif !important;
sans-serif;
font-size: 0.8rem !important;
font-size: 0.9rem;
font-weight: 500 !important;
font-weight: 500;
line-height: 1.25 !important;
text-align: left !important;
text-shadow: none !important;
}
}


.skin-timeless #mw-site-navigation .sidebar-inner .mw-portlet ul,
.pvzt-mobile-portlet ul {
.skin-timeless #mw-related-navigation .sidebar-inner .mw-portlet ul,
.skin-timeless #personal .dropdown ul {
margin: 0 !important;
margin: 0 !important;
padding: 0.52rem 0.68rem 0.65rem !important;
padding: 7px 10px 9px !important;
border: 0 !important;
border-radius: 0 !important;
background: var(--pvzt-paper) !important;
box-shadow: none !important;
list-style: none !important;
list-style: none !important;
transform: none !important;
}
}


.skin-timeless #mw-site-navigation .sidebar-inner .mw-portlet li,
.pvzt-mobile-portlet li {
.skin-timeless #mw-related-navigation .sidebar-inner .mw-portlet li,
.skin-timeless #personal .dropdown li {
margin: 0 !important;
margin: 0 !important;
padding: 0 !important;
padding: 0 !important;
311번째 줄: 423번째 줄:
}
}


.skin-timeless #mw-site-navigation .sidebar-inner .mw-portlet li + li,
.pvzt-mobile-portlet li + li {
.skin-timeless #mw-related-navigation .sidebar-inner .mw-portlet li + li,
margin-top: 1px !important;
.skin-timeless #personal .dropdown li + li {
margin-top: 0.16rem !important;
}
}


.skin-timeless #mw-site-navigation .sidebar-inner .mw-portlet ul a,
.pvzt-mobile-portlet a {
.skin-timeless #mw-related-navigation .sidebar-inner .mw-portlet ul a,
.skin-timeless #personal .dropdown ul a {
display: block !important;
display: block !important;
padding: 0.23rem 0.12rem !important;
padding: 7px 4px !important;
color: var(--pvzt-text) !important;
color: var(--pvzt-text) !important;
font-family:
font-size: 0.88rem !important;
"SB Aggro L",
"SB 어그로 L",
sans-serif !important;
font-size: 0.78rem !important;
font-weight: 300 !important;
line-height: 1.35 !important;
line-height: 1.35 !important;
text-decoration: none !important;
text-decoration: none !important;
text-shadow: none !important;
}
}


.skin-timeless #mw-site-navigation .sidebar-inner .mw-portlet ul a:hover,
.pvzt-mobile-portlet a:hover,
.skin-timeless #mw-related-navigation .sidebar-inner .mw-portlet ul a:hover,
.pvzt-mobile-portlet a:focus-visible {
.skin-timeless #personal .dropdown ul a:hover {
color: var(--pvzt-green-deep) !important;
color: var(--pvzt-link-hover) !important;
text-decoration: underline !important;
text-decoration: underline !important;
}
}


.skin-timeless .sidebar-inner .emptyPortlet {
.pvzt-mobile-portlet .selected > a {
display: none !important;
color: var(--pvzt-green-deep) !important;
font-weight: 700 !important;
}
}
}




/* =========================
/* =========================================================
  문서 상단 도구
  6. 문서 본문
  위치와 기능 유지
  ========================================================= */
  ========================= */


.skin-timeless .tools-inline {
@media screen and (max-width: 850px) {
gap: 0.28rem !important;
.skin-timeless #mw-content {
position: relative;
width: calc(100% - 14px) !important;
max-width: none !important;
margin: 8px 7px 18px !important;
padding: 14px 12px 22px !important;
box-sizing: border-box;
overflow: hidden;
border: 1px solid #b88d59 !important;
border-radius: 0 !important;
background: var(--pvzt-paper) !important;
background-image: none !important;
box-shadow: var(--pvzt-shadow) !important;
}
}


.skin-timeless .tools-inline li {
.skin-timeless #mw-content::before,
margin: 0 !important;
.skin-timeless #mw-content::after {
border: 0 !important;
content: none !important;
border-bottom: 0 !important;
display: none !important;
}
}


.skin-timeless .tools-inline li > a {
.skin-timeless #firstHeading,
display: inline-flex !important;
.skin-timeless .mw-first-heading,
align-items: center !important;
.skin-timeless .mw-body h1.firstHeading {
min-height: 30px !important;
display: block !important;
padding: 4px 9px 4px 26px !important;
width: calc(100% + 24px) !important;
border: 1px solid var(--pvzt-brown-800) !important;
max-width: none !important;
border-radius: 8px !important;
margin: -14px -12px 10px !important;
box-sizing: border-box !important;
padding: 13px 18px 11px !important;
background-color: #7b4c34 !important;
box-sizing: border-box;
background-position: 7px center !important;
border: 0 !important;
background-repeat: no-repeat !important;
border-radius: 0 !important;
background-size: 14px auto !important;
background:
linear-gradient(
100deg,
var(--pvzt-green-deep) 0%,
var(--pvzt-green-deep) 88%,
transparent 88.2%
) !important;
color: #ffffff !important;
color: #ffffff !important;
font-family:
font-family:
"SB Aggro M",
"SB Aggro B",
"SB 어그로 M",
"SB 어그로 B",
"SB Aggro",
"SB Aggro",
"SB 어그로",
"SB 어그로",
sans-serif !important;
sans-serif !important;
font-size: 0.7rem !important;
font-size: 1.38rem !important;
font-weight: 500 !important;
font-weight: 700 !important;
line-height: 1.2 !important;
line-height: 1.25 !important;
text-decoration: none !important;
text-shadow: none !important;
text-shadow: none !important;
box-shadow: none !important;
}
}


.skin-timeless .tools-inline li > a:hover {
.skin-timeless #firstHeading *,
background-color: #8a5a42 !important;
.skin-timeless .mw-first-heading * {
color: #ffffff !important;
}
 
.pvzt-mobile-page-actions {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 4px;
margin: 0 -4px 14px;
padding: 0 0 10px;
border-bottom: 1px solid rgba(107, 58, 36, 0.28);
}
 
.pvzt-mobile-action {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 3px;
min-width: 0;
min-height: 48px;
padding: 4px 2px;
border: 0;
border-radius: 8px;
background: transparent;
color: #8a654d !important;
font-size: 0.66rem !important;
line-height: 1.1;
text-align: center;
text-decoration: none !important;
text-decoration: none !important;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
}


.skin-timeless .tools-inline li.selected > a {
.pvzt-mobile-action:hover,
background-color: #a47765 !important;
.pvzt-mobile-action:focus-visible {
background: rgba(107, 58, 36, 0.08);
color: var(--pvzt-brown-dark) !important;
outline: 0;
}
}


.skin-timeless .tools-inline li[id^="ca-nstab-"] > a {
.pvzt-mobile-action::before {
content: "";
display: block;
width: 23px;
height: 23px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
opacity: 0.92;
}
 
.pvzt-mobile-action--page::before {
background-image:
background-image:
url("/wiki/Special:Redirect/file/Actionbar-document.svg") !important;
url("/wiki/Special:Redirect/file/Actionbar-document.svg");
filter: sepia(1) saturate(0.7) brightness(0.62);
}
}


.skin-timeless #ca-talk > a {
.pvzt-mobile-action--talk::before {
background-image:
background-image:
url("/wiki/Special:Redirect/file/Actionbar-talk.svg") !important;
url("/wiki/Special:Redirect/file/Actionbar-talk.svg");
filter: sepia(1) saturate(0.7) brightness(0.62);
}
}


.skin-timeless #ca-view > a,
.pvzt-mobile-action--edit::before {
.skin-timeless #ca-view-foreign > a {
background-image:
background-image:
url("/wiki/Special:Redirect/file/Actionbar-read.svg") !important;
url("/wiki/Special:Redirect/file/Actionbar-edit.svg");
filter: sepia(1) saturate(0.7) brightness(0.62);
}
}


.skin-timeless #ca-edit > a {
.pvzt-mobile-action--history::before {
background-image:
background-image:
url("/wiki/Special:Redirect/file/Actionbar-edit.svg") !important;
url("/wiki/Special:Redirect/file/Actionbar-history.svg");
filter: sepia(1) saturate(0.7) brightness(0.62);
}
}


.skin-timeless #ca-history > a {
.pvzt-mobile-action--more::before {
background-image:
background-image:
url("/wiki/Special:Redirect/file/Actionbar-history.svg") !important;
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='5' cy='12' r='2' fill='%238a654d'/%3E%3Ccircle cx='12' cy='12' r='2' fill='%238a654d'/%3E%3Ccircle cx='19' cy='12' r='2' fill='%238a654d'/%3E%3C/svg%3E");
}
 
.skin-timeless .mw-body,
.skin-timeless .mw-parser-output {
color: var(--pvzt-text) !important;
}
 
.skin-timeless .mw-body a,
.skin-timeless .mw-parser-output a {
color: #24683c;
}
 
.skin-timeless .mw-body a:visited,
.skin-timeless .mw-parser-output a:visited {
color: #5b4f7e;
}
}
}
/* =========================================================
  7. 문단 제목과 잔디 구분선
  ========================================================= */
.skin-timeless .mw-heading2,
.skin-timeless .mw-parser-output h2.pvz-grass-heading {
position: relative !important;
margin-bottom: 0.72em !important;
padding-bottom: 12px !important;
border: 0 !important;
border-bottom: 0 !important;
background: none !important;
background-image: none !important;
box-shadow: none !important;
}
.skin-timeless .mw-heading2::before,
.skin-timeless .mw-heading2::after,
.skin-timeless .mw-parser-output h2.pvz-grass-heading::before,
.skin-timeless .mw-parser-output h2.pvz-grass-heading::after {
content: none !important;
display: none !important;
border: 0 !important;
background: none !important;
box-shadow: none !important;
}


.skin-timeless #ca-addsection > a,
.skin-timeless .mw-heading2 > h2,
.skin-timeless #ca-viewsource > a,
.skin-timeless .mw-parser-output h2.pvz-grass-heading {
.skin-timeless #t-contributions > a {
margin-bottom: 0 !important;
padding-left: 9px !important;
padding-bottom: 0 !important;
border: 0 !important;
border-bottom: 0 !important;
background: none !important;
background-image: none !important;
box-shadow: none !important;
}
 
.skin-timeless .pvz-grass-divider {
position: absolute;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
display: block;
height: 14px;
overflow: hidden;
pointer-events: none;
background: #ead9b8;
-webkit-mask-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 112 12'%3E%3Cpath fill='black' d='M0 12V8Q3 8 5 5Q6 3 8 6L11 9Q14 7 16 4Q17 2 19 5L22 9Q25 7 28 5Q29 3 31 6L34 9Q37 7 39 4Q40 2 42 5L45 9Q48 7 51 5Q52 3 54 6L57 9Q60 7 63 4Q64 2 66 5L69 9Q72 7 75 5Q76 3 78 6L81 9Q84 7 87 4Q88 2 90 5L93 9Q96 7 99 5Q100 3 102 6L105 9Q109 8 112 7V12Z'/%3E%3C/svg%3E");
mask-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 112 12'%3E%3Cpath fill='black' d='M0 12V8Q3 8 5 5Q6 3 8 6L11 9Q14 7 16 4Q17 2 19 5L22 9Q25 7 28 5Q29 3 31 6L34 9Q37 7 39 4Q40 2 42 5L45 9Q48 7 51 5Q52 3 54 6L57 9Q60 7 63 4Q64 2 66 5L69 9Q72 7 75 5Q76 3 78 6L81 9Q84 7 87 4Q88 2 90 5L93 9Q96 7 99 5Q100 3 102 6L105 9Q109 8 112 7V12Z'/%3E%3C/svg%3E");
-webkit-mask-repeat: repeat-x;
mask-repeat: repeat-x;
-webkit-mask-position: left bottom;
mask-position: left bottom;
-webkit-mask-size: 112px 12px;
mask-size: 112px 12px;
}
 
 
/* =========================================================
  8. 분류·각주·공지·목차
  ========================================================= */
 
@media screen and (max-width: 850px) {
.skin-timeless #localNotice,
.skin-timeless #catlinks,
.skin-timeless .catlinks,
.skin-timeless ul#filetoc,
.skin-timeless .toccolours,
.skin-timeless .mw-parser-output > .mw-references-wrap,
.skin-timeless .mw-parser-output > ol.references,
.skin-timeless .mw-parser-output > .references {
border: 1px solid var(--pvzt-line) !important;
border-radius: 8px !important;
background: var(--pvzt-paper-2) !important;
background-image: none !important;
background-image: none !important;
color: var(--pvzt-brown) !important;
box-shadow: none !important;
}
.skin-timeless #localNotice {
padding: 0.65rem 0.75rem !important;
}
.skin-timeless #catlinks,
.skin-timeless .catlinks {
margin-top: 1.2rem !important;
padding: 0.58rem 0.72rem !important;
}
}


.skin-timeless #ca-watch > a,
.skin-timeless .mw-parser-output > .mw-references-wrap,
.skin-timeless #ca-unwatch > a {
.skin-timeless .mw-parser-output > ol.references,
width: 34px !important;
.skin-timeless .mw-parser-output > .references {
padding: 4px !important;
margin-top: 1.2rem !important;
background-position: center !important;
padding: 0.72rem 0.85rem !important;
background-size: 17px !important;
}
 
.skin-timeless .mw-parser-output > .mw-references-wrap > ol.references {
margin: 0 !important;
padding: 0 0 0 1.5em !important;
border: 0 !important;
background: transparent !important;
}
}
}


.skin-timeless #ca-watch > a,
 
.skin-timeless .pvz-watch-not-watched > a,
/* =========================================================
.skin-timeless a.pvz-watch-not-watched {
  9. 하단 영역
background-image:
  ========================================================= */
url("/wiki/Special:Redirect/file/GW2_Star2.png") !important;
 
@media screen and (max-width: 850px) {
.skin-timeless #mw-footer-container,
.skin-timeless .mw-footer-container {
margin: 0 !important;
padding: 16px 14px 22px !important;
border: 0 !important;
border-top: 1px solid #79533b !important;
background: rgba(48, 29, 19, 0.9) !important;
background-image: none !important;
color: #f4e2c1 !important;
box-shadow: none !important;
}
}


.skin-timeless #ca-unwatch > a,
.skin-timeless #mw-footer-container a,
.skin-timeless .pvz-watch-watched > a,
.skin-timeless .mw-footer-container a,
.skin-timeless a.pvz-watch-watched {
.skin-timeless #mw-footer-container a:visited,
background-image:
.skin-timeless .mw-footer-container a:visited {
url("/wiki/Special:Redirect/file/GW2_Star.png") !important;
color: #f4d49b !important;
text-shadow: none !important;
}
}
}


/* =========================================================
  10. 작은 화면
  ========================================================= */


/* =========================
@media screen and (max-width: 380px) {
  본문 카드
:root {
  ========================= */
--pvzt-header-h: 100px;
}


.skin-timeless #mw-content {
.pvzt-mobile-header {
position: relative !important;
grid-template-columns: 40px minmax(0, 1fr) 40px;
margin: 0.45rem 0.36rem 1rem !important;
padding-right: 7px;
padding: 18px 14px 22px !important;
padding-left: 7px;
overflow: hidden !important;
border: 1px solid var(--pvzt-brown-800) !important;
border-radius: var(--pvzt-radius-lg) !important;
background: var(--pvzt-paper) !important;
box-shadow: var(--pvzt-shadow) !important;
box-sizing: border-box !important;
}
}


.skin-timeless #mw-content::before,
.pvzt-mobile-header__button {
.skin-timeless #mw-content::after {
width: 40px;
content: none !important;
height: 44px;
display: none !important;
}
}


.pvzt-mobile-brand {
font-size: 0.9rem;
}


/* =========================
.skin-timeless #mw-content {
  문서 제목
width: calc(100% - 8px) !important;
  제목만 위치·형태 변경 허용
margin-right: 4px !important;
  ========================= */
margin-left: 4px !important;
padding-right: 10px !important;
padding-left: 10px !important;
}


.skin-timeless #firstHeading,
.skin-timeless #firstHeading,
.skin-timeless .mw-first-heading,
.skin-timeless .mw-first-heading,
.skin-timeless .mw-body h1.firstHeading {
.skin-timeless .mw-body h1.firstHeading {
display: table !important;
width: calc(100% + 20px) !important;
margin-right: -10px !important;
margin-left: -10px !important;
padding-right: 14px !important;
padding-left: 14px !important;
font-size: 1.22rem !important;
}
 
.pvzt-mobile-action {
font-size: 0.61rem !important;
}
}
 
 
/* =========================================================
  11. 모션 최소화
  ========================================================= */
 
@media (prefers-reduced-motion: reduce) {
.pvzt-mobile-overlay,
.pvzt-mobile-drawer {
transition: none !important;
}
}
 
 
/* =========================================================
  12. 모든 화면에서 기본 Timeless 인터페이스 숨김
  커스텀 UI가 생성된 뒤에만 적용
  ========================================================= */
 
body.skin-timeless.pvzt-mobile-ready #mw-header-container,
body.skin-timeless.pvzt-mobile-ready #mw-header-hack,
body.skin-timeless.pvzt-mobile-ready #mw-header-nav-hack,
body.skin-timeless.pvzt-mobile-ready #mw-site-navigation,
body.skin-timeless.pvzt-mobile-ready #mw-related-navigation,
body.skin-timeless.pvzt-mobile-ready #personal,
body.skin-timeless.pvzt-mobile-ready #user-tools,
body.skin-timeless.pvzt-mobile-ready .tools-inline,
body.skin-timeless.pvzt-mobile-ready #site-navigation,
body.skin-timeless.pvzt-mobile-ready #page-tools {
display: none !important;
}
 
 
/* =========================================================
  13. 데스크톱 Timeless 재구성
  ========================================================= */
 
@media screen and (min-width: 851px) {
:root {
--pvzt-header-h: 58px;
--pvzt-left-w: 214px;
--pvzt-right-w: 196px;
}
 
html {
min-height: 100% !important;
background: #3a2419 !important;
}
 
body.skin-timeless {
min-height: 100vh !important;
margin: 0 !important;
padding: var(--pvzt-header-h) 0 0 !important;
background:
linear-gradient(
rgba(57, 34, 22, 0.94),
rgba(57, 34, 22, 0.94)
),
url("/wiki/Special:Redirect/file/Wiki_Bg_Light.png")
center / cover fixed !important;
color: var(--pvzt-text) !important;
overflow-x: hidden !important;
}
 
.skin-timeless #mw-content-container,
.skin-timeless #mw-content-block,
.skin-timeless #mw-content-wrapper {
width: auto !important;
width: auto !important;
max-width: calc(100% + 14px) !important;
max-width: none !important;
margin:
margin: 0 !important;
0
padding: 0 !important;
0
0.78rem
-14px !important;
padding:
0.48em
2.1em
0.42em
14px !important;
border: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
background: var(--pvzt-green-deep) !important;
background-image: none !important;
color: #ffffff !important;
box-shadow: none !important;
font-family:
}
"SB Aggro B",
 
"SB 어그로 B",
.skin-timeless #mw-content-container {
"SB Aggro",
margin-left: var(--pvzt-left-w) !important;
"SB 어그로",
margin-right: var(--pvzt-right-w) !important;
sans-serif !important;
}
font-size: 1.32em !important;
 
font-weight: 700 !important;
/* 데스크톱 상단바 */
line-height: 1.25 !important;
.pvzt-mobile-header {
-webkit-clip-path:
position: fixed;
polygon(
top: 0;
0 0,
right: 0;
100% 0,
left: 0;
calc(100% - 20px) 100%,
z-index: 1200;
0 100%
display: grid;
) !important;
grid-template-columns: 190px minmax(300px, 1fr) 44px;
clip-path:
grid-template-rows: 44px;
polygon(
align-items: center;
0 0,
gap: 12px;
100% 0,
height: var(--pvzt-header-h);
calc(100% - 20px) 100%,
padding: 7px 16px;
0 100%
box-sizing: border-box;
) !important;
background: var(--pvzt-green);
border-bottom: 2px solid var(--pvzt-green-dark);
box-shadow: 0 3px 12px rgba(22, 48, 21, 0.28);
}
}


.skin-timeless #firstHeading *,
.pvzt-mobile-header__button {
.skin-timeless .mw-first-heading * {
display: inline-flex;
color: #ffffff !important;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
padding: 0;
border: 0;
border-radius: 10px;
background: transparent;
color: #ffffff;
cursor: pointer;
}
}


.pvzt-mobile-header__button:hover,
.pvzt-mobile-header__button:focus-visible {
background: rgba(255, 255, 255, 0.14);
outline: 0;
}


/* =========================
.pvzt-mobile-header__button::before {
  본문 글자·링크
content: "";
  ========================= */
display: block;
width: 24px;
height: 24px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}


.skin-timeless .mw-body-content,
.pvzt-mobile-header__button--menu {
.skin-timeless .mw-parser-output {
display: none;
color: var(--pvzt-text) !important;
}
}


.skin-timeless .mw-parser-output a,
.pvzt-mobile-header__button--account {
.skin-timeless .mw-body-content a {
grid-column: 3;
color: var(--pvzt-link) !important;
}
}


.skin-timeless .mw-parser-output a:hover,
.pvzt-mobile-header__button--account::before {
.skin-timeless .mw-body-content a:hover {
background-image:
color: var(--pvzt-link-hover) !important;
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 12a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9Zm0 2c-4.7 0-8 2.45-8 5.2V21h16v-1.8c0-2.75-3.3-5.2-8-5.2Z'/%3E%3C/svg%3E");
}
}


.skin-timeless .mw-body .mw-heading,
.pvzt-mobile-brand {
.skin-timeless .mw-body h1,
grid-column: 1;
.skin-timeless .mw-body h2,
display: flex;
.skin-timeless .mw-body h3,
align-items: center;
.skin-timeless .mw-body h4,
min-width: 0;
.skin-timeless .mw-body h5,
height: 44px;
.skin-timeless .mw-body h6 {
color: #ffffff;
color: var(--pvzt-brown-900) !important;
font-family:
font-family:
"SB Aggro B",
"SB Aggro B",
565번째 줄: 946번째 줄:
"SB 어그로",
"SB 어그로",
sans-serif !important;
sans-serif !important;
font-weight: 700 !important;
font-size: 1rem;
font-weight: 700;
line-height: 1.1;
text-decoration: none !important;
text-shadow: 0 1px 1px rgba(18, 61, 27, 0.35);
}
 
.pvzt-mobile-brand:hover {
color: #ffffff;
text-decoration: none !important;
opacity: 0.94;
}
}


.pvzt-mobile-brand__text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}


/* =========================
.pvzt-mobile-search {
  문단 제목 아래 잔디 구분선
grid-column: 2;
  ========================= */
grid-row: 1;
display: flex;
align-items: center;
width: 100%;
max-width: 980px;
height: 42px;
justify-self: center;
}


.skin-timeless .mw-heading2,
.pvzt-mobile-search #simpleSearch,
.skin-timeless .mw-parser-output h2.pvz-grass-heading {
.pvzt-mobile-search form {
position: relative !important;
position: relative !important;
margin-bottom: 0.72em !important;
display: flex !important;
padding-bottom: 11px !important;
width: 100% !important;
border: 0 !important;
height: 42px !important;
border-bottom: 0 !important;
margin: 0 !important;
background: none !important;
padding: 0 !important;
overflow: hidden !important;
border: 1px solid #6f4c35 !important;
border-radius: 9px !important;
background: #fff9ec !important;
background-image: none !important;
background-image: none !important;
box-shadow: none !important;
box-shadow: inset 0 1px 2px rgba(85, 50, 28, 0.08) !important;
}
}


.skin-timeless .mw-heading2::before,
.pvzt-mobile-search #searchInput,
.skin-timeless .mw-heading2::after,
.pvzt-mobile-search input[type="search"],
.skin-timeless .mw-parser-output h2.pvz-grass-heading::before,
.pvzt-mobile-search input[name="search"] {
.skin-timeless .mw-parser-output h2.pvz-grass-heading::after {
flex: 1 1 auto !important;
content: none !important;
min-width: 0 !important;
display: none !important;
height: 40px !important;
margin: 0 !important;
padding: 0 46px 0 13px !important;
border: 0 !important;
border: 0 !important;
background: none !important;
outline: 0 !important;
background: transparent !important;
color: var(--pvzt-text) !important;
font-size: 15px !important;
box-shadow: none !important;
box-shadow: none !important;
}
}


.skin-timeless .mw-heading2 > h2,
.pvzt-mobile-search #searchButton,
.skin-timeless .mw-parser-output h2.pvz-grass-heading {
.pvzt-mobile-search #mw-searchButton,
margin-bottom: 0 !important;
.pvzt-mobile-search button[type="submit"] {
padding-bottom: 0 !important;
position: absolute !important;
top: 0 !important;
right: 0 !important;
width: 44px !important;
height: 40px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border: 0 !important;
border-bottom: 0 !important;
border-left: 1px solid rgba(107, 58, 36, 0.35) !important;
background: none !important;
background-color: transparent !important;
background-image: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%236b3a24' d='M10.7 3a7.7 7.7 0 1 0 4.73 13.78l4.4 4.4a1.2 1.2 0 1 0 1.7-1.7l-4.4-4.4A7.7 7.7 0 0 0 10.7 3Zm0 2.4a5.3 5.3 0 1 1 0 10.6 5.3 5.3 0 0 1 0-10.6Z'/%3E%3C/svg%3E") !important;
background-position: center !important;
background-repeat: no-repeat !important;
background-size: 19px !important;
font-size: 0 !important;
box-shadow: none !important;
box-shadow: none !important;
cursor: pointer;
}
}


.skin-timeless .pvz-grass-divider {
/* 데스크톱에서는 양쪽 서랍을 고정 사이드바로 사용 */
position: absolute !important;
.pvzt-mobile-overlay {
right: 0 !important;
display: none !important;
bottom: 0 !important;
left: 0 !important;
z-index: 1 !important;
display: block !important;
height: 13px !important;
overflow: hidden !important;
pointer-events: none !important;
background: #ead9b8 !important;
-webkit-mask-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 112 12'%3E%3Cpath fill='black' d='M0 12V8Q3 8 5 5Q6 3 8 6L11 9Q14 7 16 4Q17 2 19 5L22 9Q25 7 28 5Q29 3 31 6L34 9Q37 7 39 4Q40 2 42 5L45 9Q48 7 51 5Q52 3 54 6L57 9Q60 7 63 4Q64 2 66 5L69 9Q72 7 75 5Q76 3 78 6L81 9Q84 7 87 4Q88 2 90 5L93 9Q96 7 99 5Q100 3 102 6L105 9Q109 8 112 7V12Z'/%3E%3C/svg%3E") !important;
mask-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 112 12'%3E%3Cpath fill='black' d='M0 12V8Q3 8 5 5Q6 3 8 6L11 9Q14 7 16 4Q17 2 19 5L22 9Q25 7 28 5Q29 3 31 6L34 9Q37 7 39 4Q40 2 42 5L45 9Q48 7 51 5Q52 3 54 6L57 9Q60 7 63 4Q64 2 66 5L69 9Q72 7 75 5Q76 3 78 6L81 9Q84 7 87 4Q88 2 90 5L93 9Q96 7 99 5Q100 3 102 6L105 9Q109 8 112 7V12Z'/%3E%3C/svg%3E") !important;
-webkit-mask-repeat: repeat-x !important;
mask-repeat: repeat-x !important;
-webkit-mask-position: left bottom !important;
mask-position: left bottom !important;
-webkit-mask-size: 112px 12px !important;
mask-size: 112px 12px !important;
}
}


.pvzt-mobile-drawer {
position: fixed;
top: var(--pvzt-header-h);
bottom: 0;
z-index: 900;
display: block;
padding: 14px 12px 24px;
box-sizing: border-box;
overflow-y: auto;
overscroll-behavior: contain;
background:
linear-gradient(
rgba(62, 37, 23, 0.96),
rgba(48, 29, 19, 0.98)
),
url("/wiki/Special:Redirect/file/Wiki_Bg_Dark.png")
center / cover;
color: #ffffff;
box-shadow: none;
transform: none !important;
transition: none !important;
}


/* =========================
.pvzt-mobile-drawer--left {
  표·입력창·버튼
left: 0;
  ========================= */
width: var(--pvzt-left-w);
border-right: 2px solid #25140d;
}


.skin-timeless table.wikitable {
.pvzt-mobile-drawer--right {
border: 1px solid var(--pvzt-line-dark) !important;
right: 0;
background: var(--pvzt-paper) !important;
width: var(--pvzt-right-w);
color: var(--pvzt-text) !important;
border-left: 2px solid #25140d;
}
}


.skin-timeless table.wikitable > tr > th,
.pvzt-mobile-drawer__top {
.skin-timeless table.wikitable > * > tr > th {
display: none;
border: 1px solid var(--pvzt-line) !important;
background: var(--pvzt-paper-3) !important;
color: var(--pvzt-brown-900) !important;
}
}


.skin-timeless table.wikitable > tr > td,
.pvzt-mobile-drawer__logo {
.skin-timeless table.wikitable > * > tr > td {
display: flex;
border: 1px solid var(--pvzt-line) !important;
align-items: center;
background: var(--pvzt-paper) !important;
justify-content: center;
min-height: 104px;
margin: 0 0 13px;
padding: 10px;
border: 1px solid rgba(255, 236, 193, 0.18);
border-radius: 10px;
background: rgba(30, 17, 10, 0.26);
}
}


.skin-timeless input,
.pvzt-mobile-drawer__logo .mw-wiki-logo {
.skin-timeless select,
display: block !important;
.skin-timeless textarea,
width: 160px !important;
.skin-timeless .oo-ui-inputWidget-input,
height: 96px !important;
.skin-timeless .cdx-text-input__input {
max-width: 100% !important;
border-color: var(--pvzt-line) !important;
background-position: center !important;
border-radius: 8px !important;
background-repeat: no-repeat !important;
background: #fffdf8 !important;
background-size: contain !important;
color: var(--pvzt-text) !important;
box-shadow: none !important;
}
}


.skin-timeless input:focus,
.pvzt-mobile-portlet {
.skin-timeless select:focus,
margin: 0 0 12px;
.skin-timeless textarea:focus,
overflow: hidden;
.skin-timeless .oo-ui-inputWidget-input:focus,
border: 1px solid #ad7b49;
.skin-timeless .cdx-text-input__input:focus {
border-radius: 7px;
border-color: var(--pvzt-green) !important;
background: var(--pvzt-cream-soft);
box-shadow:
color: var(--pvzt-text);
0 0 0 3px rgba(63, 141, 60, 0.13) !important;
box-shadow: 0 3px 8px rgba(20, 10, 5, 0.18);
}
}


.skin-timeless .mw-ui-button,
.pvzt-mobile-portlet__title {
.skin-timeless .oo-ui-buttonElement-button,
margin: 0;
.skin-timeless .cdx-button {
padding: 9px 10px 8px;
border-color: var(--pvzt-green-dark) !important;
border-bottom: 1px solid rgba(120, 75, 42, 0.2);
border-radius: 8px !important;
background: rgba(255, 255, 255, 0.36);
background: var(--pvzt-green) !important;
color: var(--pvzt-brown-dark);
color: #ffffff !important;
font-family:
box-shadow: none !important;
"SB Aggro M",
"SB 어그로 M",
"SB Aggro",
"SB 어그로",
sans-serif;
font-size: 0.86rem;
font-weight: 500;
}
}


.skin-timeless .mw-ui-button:hover,
.pvzt-mobile-portlet ul {
.skin-timeless .oo-ui-buttonElement-button:hover,
margin: 0 !important;
.skin-timeless .cdx-button:hover {
padding: 7px 9px 9px !important;
background: var(--pvzt-green-dark) !important;
list-style: none !important;
}
}


.pvzt-mobile-portlet li {
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
}


/* =========================
.pvzt-mobile-portlet a {
  목차·공지·분류·각주
display: block !important;
  ========================= */
padding: 5px 3px !important;
 
color: var(--pvzt-text) !important;
.skin-timeless .mw-body .toc,
font-size: 0.78rem !important;
.skin-timeless ul#filetoc,
line-height: 1.35 !important;
.skin-timeless .toccolours,
text-decoration: none !important;
.skin-timeless #localNotice,
.skin-timeless #catlinks,
.skin-timeless .catlinks,
.skin-timeless .mw-parser-output > .mw-references-wrap,
.skin-timeless .mw-parser-output > ol.references,
.skin-timeless .mw-parser-output > .references,
.skin-timeless .mw-message-box {
border: 1px solid var(--pvzt-line) !important;
border-radius: 10px !important;
background: var(--pvzt-paper-2) !important;
background-image: none !important;
color: var(--pvzt-brown-700) !important;
box-shadow: none !important;
}
}


.skin-timeless #localNotice,
.pvzt-mobile-portlet a:hover,
.skin-timeless .mw-message-box {
.pvzt-mobile-portlet a:focus-visible {
padding: 0.68rem 0.78rem !important;
color: var(--pvzt-green-deep) !important;
text-decoration: underline !important;
}
}


.skin-timeless #catlinks,
/* 데스크톱 문서 본문 */
.skin-timeless .catlinks {
.skin-timeless #mw-content {
margin-top: 1.2rem !important;
position: relative;
padding: 0.56rem 0.7rem !important;
width: auto !important;
max-width: none !important;
min-height: calc(100vh - var(--pvzt-header-h) - 32px);
margin: 16px 12px 24px !important;
padding: 24px 28px 32px !important;
box-sizing: border-box;
overflow: hidden;
border: 1px solid #b88d59 !important;
border-radius: 0 !important;
background: var(--pvzt-paper) !important;
background-image: none !important;
box-shadow: var(--pvzt-shadow) !important;
}
}


.skin-timeless .mw-parser-output > .mw-references-wrap,
.skin-timeless #mw-content::before,
.skin-timeless .mw-parser-output > ol.references,
.skin-timeless #mw-content::after {
.skin-timeless .mw-parser-output > .references {
content: none !important;
margin-top: 1.2rem !important;
display: none !important;
padding: 0.68rem 0.82rem !important;
}
}


.skin-timeless .mw-parser-output > .mw-references-wrap > ol.references {
.skin-timeless #firstHeading,
margin: 0 !important;
.skin-timeless .mw-first-heading,
padding: 0 0 0 1.5em !important;
.skin-timeless .mw-body h1.firstHeading {
display: table !important;
width: auto !important;
max-width: calc(100% + 28px) !important;
margin: 0 0 12px -28px !important;
padding: 11px 56px 9px 28px !important;
box-sizing: border-box;
border: 0 !important;
border: 0 !important;
background: transparent !important;
border-radius: 0 !important;
background: var(--pvzt-green-deep) !important;
color: #ffffff !important;
font-family:
"SB Aggro B",
"SB 어그로 B",
"SB Aggro",
"SB 어그로",
sans-serif !important;
font-size: 1.9rem !important;
font-weight: 700 !important;
line-height: 1.24 !important;
-webkit-clip-path: polygon(
0 0,
100% 0,
calc(100% - 28px) 100%,
0 100%
);
clip-path: polygon(
0 0,
100% 0,
calc(100% - 28px) 100%,
0 100%
);
text-shadow: none !important;
}
}


.skin-timeless #mw-normal-catlinks,
.skin-timeless #firstHeading *,
.skin-timeless .mw-normal-catlinks,
.skin-timeless .mw-first-heading * {
.skin-timeless #mw-hidden-catlinks,
color: #ffffff !important;
.skin-timeless .mw-hidden-catlinks {
border: 0 !important;
background: transparent !important;
}
}


.pvzt-mobile-page-actions {
display: grid;
grid-template-columns: repeat(5, minmax(72px, 1fr));
gap: 6px;
max-width: 560px;
margin: 0 0 18px;
padding: 0 0 11px;
border-bottom: 1px solid rgba(107, 58, 36, 0.28);
}


/* =========================
.pvzt-mobile-action {
  코드·인용문
display: flex;
  ========================= */
flex-direction: column;
align-items: center;
justify-content: center;
gap: 4px;
min-width: 0;
min-height: 54px;
padding: 5px 4px;
border: 0;
border-radius: 8px;
background: transparent;
color: #8a654d !important;
font-size: 0.72rem !important;
line-height: 1.1;
text-align: center;
text-decoration: none !important;
cursor: pointer;
}


.skin-timeless pre,
.pvzt-mobile-action:hover,
.skin-timeless code,
.pvzt-mobile-action:focus-visible {
.skin-timeless .mw-code {
background: rgba(107, 58, 36, 0.08);
border-color: var(--pvzt-line) !important;
color: var(--pvzt-brown-dark) !important;
background: #f4e8d2 !important;
outline: 0;
color: #49362a !important;
}
}


.skin-timeless blockquote {
.pvzt-mobile-action::before {
border-left: 4px solid var(--pvzt-green) !important;
content: "";
background: #f8ecd8 !important;
display: block;
color: var(--pvzt-text) !important;
width: 24px;
height: 24px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
opacity: 0.92;
}
}


 
.pvzt-mobile-action--page::before {
/* =========================
background-image:
  하단
url("/wiki/Special:Redirect/file/Actionbar-document.svg");
  ========================= */
filter: sepia(1) saturate(0.7) brightness(0.62);
 
.skin-timeless #mw-footer-container,
.skin-timeless .mw-footer-container {
border-top: 1px solid var(--pvzt-line) !important;
background: #f1dfbd !important;
color: var(--pvzt-brown-800) !important;
box-shadow: none !important;
}
}


.skin-timeless #mw-footer-container a,
.pvzt-mobile-action--talk::before {
.skin-timeless .mw-footer-container a,
background-image:
.skin-timeless #mw-footer-container a:visited,
url("/wiki/Special:Redirect/file/Actionbar-talk.svg");
.skin-timeless .mw-footer-container a:visited {
filter: sepia(1) saturate(0.7) brightness(0.62);
color: var(--pvzt-brown-700) !important;
text-shadow: none !important;
}
}


.skin-timeless #mw-footer-container a:hover,
.pvzt-mobile-action--edit::before {
.skin-timeless .mw-footer-container a:hover {
background-image:
color: var(--pvzt-brown-900) !important;
url("/wiki/Special:Redirect/file/Actionbar-edit.svg");
filter: sepia(1) saturate(0.7) brightness(0.62);
}
}


 
.pvzt-mobile-action--history::before {
/* =========================
background-image:
  다크 모드
url("/wiki/Special:Redirect/file/Actionbar-history.svg");
  ========================= */
filter: sepia(1) saturate(0.7) brightness(0.62);
 
html.skin-theme-clientpref-night,
html[data-color-mode="dark"],
body.skin-theme-clientpref-night,
body[data-color-mode="dark"] {
--pvzt-paper: #2b231e;
--pvzt-paper-2: #342920;
--pvzt-paper-3: #403125;
--pvzt-line: #6c513c;
--pvzt-line-dark: #8b6648;
--pvzt-text: #eadbc8;
--pvzt-muted: #baa795;
--pvzt-link: #8fcf84;
--pvzt-link-hover: #b0e6a7;
}
}


html.skin-theme-clientpref-night body.skin-timeless,
.pvzt-mobile-action--more::before {
html[data-color-mode="dark"] body.skin-timeless,
background-image:
body.skin-theme-clientpref-night.skin-timeless,
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='5' cy='12' r='2' fill='%238a654d'/%3E%3Ccircle cx='12' cy='12' r='2' fill='%238a654d'/%3E%3Ccircle cx='19' cy='12' r='2' fill='%238a654d'/%3E%3C/svg%3E");
body[data-color-mode="dark"].skin-timeless {
background:
linear-gradient(
rgba(30, 22, 17, 0.95),
rgba(30, 22, 17, 0.95)
),
url("/wiki/Special:Redirect/file/Wiki_Bg_Dark.png")
center / cover fixed !important;
}
}


html.skin-theme-clientpref-night .skin-timeless #mw-content,
.skin-timeless .mw-body,
html[data-color-mode="dark"] .skin-timeless #mw-content,
.skin-timeless .mw-parser-output {
body.skin-theme-clientpref-night.skin-timeless #mw-content,
color: var(--pvzt-text) !important;
body[data-color-mode="dark"].skin-timeless #mw-content {
border-color: #704a32 !important;
background: var(--pvzt-paper) !important;
}
}


html.skin-theme-clientpref-night .skin-timeless #simpleSearch,
.skin-timeless #localNotice,
html[data-color-mode="dark"] .skin-timeless #simpleSearch,
.skin-timeless #catlinks,
body.skin-theme-clientpref-night.skin-timeless #simpleSearch,
.skin-timeless .catlinks,
body[data-color-mode="dark"].skin-timeless #simpleSearch {
.skin-timeless ul#filetoc,
background: #312720 !important;
.skin-timeless .toccolours,
.skin-timeless .mw-parser-output > .mw-references-wrap,
.skin-timeless .mw-parser-output > ol.references,
.skin-timeless .mw-parser-output > .references {
border: 1px solid var(--pvzt-line) !important;
border-radius: 8px !important;
background: var(--pvzt-paper-2) !important;
background-image: none !important;
color: var(--pvzt-brown) !important;
box-shadow: none !important;
}
}


html.skin-theme-clientpref-night .skin-timeless #searchInput,
.skin-timeless #mw-footer-container,
html[data-color-mode="dark"] .skin-timeless #searchInput,
.skin-timeless .mw-footer-container {
body.skin-theme-clientpref-night.skin-timeless #searchInput,
margin-left: var(--pvzt-left-w) !important;
body[data-color-mode="dark"].skin-timeless #searchInput {
margin-right: var(--pvzt-right-w) !important;
color: #eadbc8 !important;
padding: 18px 24px 24px !important;
border: 0 !important;
border-top: 1px solid #79533b !important;
background: rgba(48, 29, 19, 0.9) !important;
background-image: none !important;
color: #f4e2c1 !important;
box-shadow: none !important;
}
}


html.skin-theme-clientpref-night .skin-timeless #mw-footer-container,
.skin-timeless #mw-footer-container a,
html[data-color-mode="dark"] .skin-timeless #mw-footer-container,
.skin-timeless .mw-footer-container a,
body.skin-theme-clientpref-night.skin-timeless #mw-footer-container,
.skin-timeless #mw-footer-container a:visited,
body[data-color-mode="dark"].skin-timeless #mw-footer-container {
.skin-timeless .mw-footer-container a:visited {
background: #2e241d !important;
color: #f4d49b !important;
text-shadow: none !important;
}
}
}
}




/* =========================
/* 좁은 데스크톱에서는 오른쪽 사이드바 폭을 조금 줄임 */
  주시 버튼 애니메이션
@media screen and (min-width: 851px) and (max-width: 1120px) {
  ========================= */
:root {
--pvzt-left-w: 196px;
--pvzt-right-w: 176px;
}


.skin-timeless .pvz-watch-spinning > a,
.pvzt-mobile-header {
.skin-timeless a.pvz-watch-spinning {
grid-template-columns: 172px minmax(260px, 1fr) 44px;
animation:
padding-right: 10px;
pvzt-watch-spin 320ms ease;
padding-left: 10px;
}
}


@keyframes pvzt-watch-spin {
.skin-timeless #mw-content {
from {
margin-right: 8px !important;
transform: rotate(0deg);
margin-left: 8px !important;
}
padding-right: 22px !important;
to {
padding-left: 22px !important;
transform: rotate(360deg);
}
}
}


@media (prefers-reduced-motion: reduce) {
.skin-timeless #firstHeading,
.skin-timeless *,
.skin-timeless .mw-first-heading,
.skin-timeless *::before,
.skin-timeless .mw-body h1.firstHeading {
.skin-timeless *::after {
margin-left: -22px !important;
animation-duration: 1ms !important;
padding-left: 22px !important;
transition-duration: 1ms !important;
font-size: 1.65rem !important;
}
}
}
}

2026년 7월 31일 (금) 00:26 판

/* =========================================================
   1. 공통 변수
   ========================================================= */

:root {
	--pvzt-green: #3f8f3d;
	--pvzt-green-dark: #286d31;
	--pvzt-green-deep: #17623a;
	--pvzt-cream: #fff5df;
	--pvzt-cream-soft: #f5e3c1;
	--pvzt-paper: #fff8e8;
	--pvzt-paper-2: #f8ebcf;
	--pvzt-brown: #6b3a24;
	--pvzt-brown-dark: #442516;
	--pvzt-wood: #4a2b1c;
	--pvzt-wood-2: #352016;
	--pvzt-line: #b88c5c;
	--pvzt-text: #432d22;
	--pvzt-muted: #7a6455;
	--pvzt-shadow: 0 6px 20px rgba(48, 26, 14, 0.18);
	--pvzt-header-h: 104px;
}


/* =========================================================
   2. 모바일 기본 배경
   ========================================================= */

@media screen and (max-width: 850px) {
	html {
		min-height: 100% !important;
		background: #3a2419 !important;
	}

	body.skin-timeless {
		min-height: 100vh !important;
		margin: 0 !important;
		padding: var(--pvzt-header-h) 0 0 !important;
		background:
			linear-gradient(
				rgba(57, 34, 22, 0.94),
				rgba(57, 34, 22, 0.94)
			),
			url("/wiki/Special:Redirect/file/Wiki_Bg_Light.png")
			center / cover fixed !important;
		color: var(--pvzt-text) !important;
	}

	body.skin-timeless.pvzt-mobile-ready {
		overflow-x: hidden !important;
	}

	.skin-timeless #mw-content-container,
	.skin-timeless #mw-content-block,
	.skin-timeless #mw-content-wrapper {
		background: transparent !important;
		background-image: none !important;
		border: 0 !important;
		box-shadow: none !important;
	}

	.skin-timeless #mw-content-container {
		margin: 0 !important;
		padding: 0 !important;
	}

	.skin-timeless #mw-content-block,
	.skin-timeless #mw-content-wrapper {
		width: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}
}


/* =========================================================
   3. 커스텀 UI 생성 후 기본 Timeless UI 숨김
   ========================================================= */

@media screen and (max-width: 850px) {
	body.skin-timeless.pvzt-mobile-ready #mw-header-container,
	body.skin-timeless.pvzt-mobile-ready #mw-header-hack,
	body.skin-timeless.pvzt-mobile-ready #mw-header-nav-hack,
	body.skin-timeless.pvzt-mobile-ready #mw-site-navigation,
	body.skin-timeless.pvzt-mobile-ready #mw-related-navigation,
	body.skin-timeless.pvzt-mobile-ready #personal,
	body.skin-timeless.pvzt-mobile-ready #user-tools,
	body.skin-timeless.pvzt-mobile-ready .tools-inline,
	body.skin-timeless.pvzt-mobile-ready #site-navigation,
	body.skin-timeless.pvzt-mobile-ready #page-tools {
		display: none !important;
	}
}


/* =========================================================
   4. 상단 모바일 헤더
   ========================================================= */

@media screen and (max-width: 850px) {
	.pvzt-mobile-header {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		z-index: 1200;
		display: grid;
		grid-template-columns: 44px minmax(0, 1fr) 44px;
		grid-template-rows: 48px 48px;
		gap: 0 8px;
		height: var(--pvzt-header-h);
		padding: 6px 10px;
		box-sizing: border-box;
		background: var(--pvzt-green);
		border-bottom: 2px solid var(--pvzt-green-dark);
		box-shadow: 0 3px 12px rgba(22, 48, 21, 0.28);
	}

	.pvzt-mobile-header__button {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		padding: 0;
		border: 0;
		border-radius: 10px;
		background: transparent;
		color: #ffffff;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}

	.pvzt-mobile-header__button:hover,
	.pvzt-mobile-header__button:focus-visible {
		background: rgba(255, 255, 255, 0.14);
		outline: 0;
	}

	.pvzt-mobile-header__button::before {
		content: "";
		display: block;
		width: 24px;
		height: 24px;
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
	}

	.pvzt-mobile-header__button--menu::before {
		background-image:
			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M4 6.5h16v2H4zm0 4.5h16v2H4zm0 4.5h16v2H4z'/%3E%3C/svg%3E");
	}

	.pvzt-mobile-header__button--account::before {
		background-image:
			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 12a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9Zm0 2c-4.7 0-8 2.45-8 5.2V21h16v-1.8c0-2.75-3.3-5.2-8-5.2Z'/%3E%3C/svg%3E");
	}

	.pvzt-mobile-brand {
		display: flex;
		align-items: center;
		min-width: 0;
		height: 44px;
		color: #ffffff;
		text-decoration: none !important;
		font-family:
			"SB Aggro B",
			"SB 어그로 B",
			"SB Aggro",
			"SB 어그로",
			sans-serif !important;
		font-size: 1rem;
		font-weight: 700;
		line-height: 1.1;
		text-shadow: 0 1px 1px rgba(18, 61, 27, 0.35);
	}

	.pvzt-mobile-brand:hover {
		color: #ffffff;
		text-decoration: none !important;
		opacity: 0.94;
	}

	.pvzt-mobile-brand__text {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.pvzt-mobile-search {
		grid-column: 1 / -1;
		grid-row: 2;
		display: flex;
		align-items: center;
		width: 100%;
		min-width: 0;
		height: 42px;
	}

	.pvzt-mobile-search #simpleSearch,
	.pvzt-mobile-search form {
		position: relative !important;
		display: flex !important;
		width: 100% !important;
		height: 42px !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden !important;
		border: 1px solid #6f4c35 !important;
		border-radius: 9px !important;
		background: #fff9ec !important;
		background-image: none !important;
		box-shadow: inset 0 1px 2px rgba(85, 50, 28, 0.08) !important;
	}

	.pvzt-mobile-search #searchInput,
	.pvzt-mobile-search input[type="search"],
	.pvzt-mobile-search input[name="search"] {
		flex: 1 1 auto !important;
		min-width: 0 !important;
		height: 40px !important;
		margin: 0 !important;
		padding: 0 46px 0 13px !important;
		border: 0 !important;
		outline: 0 !important;
		background: transparent !important;
		color: var(--pvzt-text) !important;
		font-size: 16px !important;
		box-shadow: none !important;
	}

	.pvzt-mobile-search #searchInput::placeholder,
	.pvzt-mobile-search input[name="search"]::placeholder {
		color: rgba(67, 45, 34, 0.55) !important;
	}

	.pvzt-mobile-search #searchButton,
	.pvzt-mobile-search #mw-searchButton,
	.pvzt-mobile-search button[type="submit"] {
		position: absolute !important;
		top: 0 !important;
		right: 0 !important;
		width: 44px !important;
		height: 40px !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		border-left: 1px solid rgba(107, 58, 36, 0.35) !important;
		border-radius: 0 !important;
		background-color: transparent !important;
		background-image:
			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%236b3a24' d='M10.7 3a7.7 7.7 0 1 0 4.73 13.78l4.4 4.4a1.2 1.2 0 1 0 1.7-1.7l-4.4-4.4A7.7 7.7 0 0 0 10.7 3Zm0 2.4a5.3 5.3 0 1 1 0 10.6 5.3 5.3 0 0 1 0-10.6Z'/%3E%3C/svg%3E") !important;
		background-position: center !important;
		background-repeat: no-repeat !important;
		background-size: 19px !important;
		font-size: 0 !important;
		box-shadow: none !important;
		cursor: pointer;
	}
}


/* =========================================================
   5. 배경 오버레이와 서랍
   ========================================================= */

@media screen and (max-width: 850px) {
	.pvzt-mobile-overlay {
		position: fixed;
		inset: 0;
		z-index: 1290;
		visibility: hidden;
		background: rgba(22, 12, 7, 0.55);
		opacity: 0;
		transition:
			opacity 180ms ease,
			visibility 0s linear 180ms;
	}

	body.pvzt-mobile-panel-open .pvzt-mobile-overlay {
		visibility: visible;
		opacity: 1;
		transition-delay: 0s;
	}

	.pvzt-mobile-drawer {
		position: fixed;
		top: 0;
		bottom: 0;
		z-index: 1300;
		width: min(84vw, 330px);
		padding: 14px 12px 24px;
		box-sizing: border-box;
		overflow-y: auto;
		overscroll-behavior: contain;
		background:
			linear-gradient(
				rgba(62, 37, 23, 0.96),
				rgba(48, 29, 19, 0.98)
			),
			url("/wiki/Special:Redirect/file/Wiki_Bg_Dark.png")
			center / cover;
		color: #ffffff;
		box-shadow: 0 0 24px rgba(26, 12, 5, 0.42);
		transition: transform 210ms cubic-bezier(0.4, 0, 0.2, 1);
	}

	.pvzt-mobile-drawer--left {
		left: 0;
		transform: translateX(-104%);
		border-right: 2px solid #25140d;
	}

	.pvzt-mobile-drawer--right {
		right: 0;
		transform: translateX(104%);
		border-left: 2px solid #25140d;
	}

	body.pvzt-left-open .pvzt-mobile-drawer--left,
	body.pvzt-right-open .pvzt-mobile-drawer--right {
		transform: translateX(0);
	}

	.pvzt-mobile-drawer__top {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 10px;
		min-height: 48px;
		margin-bottom: 12px;
	}

	.pvzt-mobile-drawer__title {
		margin: 0;
		color: #ffffff;
		font-family:
			"SB Aggro B",
			"SB 어그로 B",
			"SB Aggro",
			"SB 어그로",
			sans-serif;
		font-size: 1.05rem;
		font-weight: 700;
	}

	.pvzt-mobile-drawer__close {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		padding: 0;
		border: 1px solid rgba(255, 255, 255, 0.28);
		border-radius: 9px;
		background: rgba(255, 255, 255, 0.08);
		color: #ffffff;
		font-size: 1.45rem;
		line-height: 1;
		cursor: pointer;
	}

	.pvzt-mobile-drawer__logo {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 98px;
		margin: 0 0 13px;
		padding: 10px;
		border: 1px solid rgba(255, 236, 193, 0.2);
		border-radius: 12px;
		background: rgba(30, 17, 10, 0.3);
	}

	.pvzt-mobile-drawer__logo .mw-wiki-logo {
		display: block !important;
		width: 145px !important;
		height: 90px !important;
		max-width: 100% !important;
		background-position: center !important;
		background-repeat: no-repeat !important;
		background-size: contain !important;
	}

	.pvzt-mobile-portlet {
		margin: 0 0 12px;
		overflow: hidden;
		border: 1px solid #ad7b49;
		border-radius: 8px;
		background: var(--pvzt-cream-soft);
		color: var(--pvzt-text);
		box-shadow: 0 3px 8px rgba(20, 10, 5, 0.2);
	}

	.pvzt-mobile-portlet__title {
		margin: 0;
		padding: 9px 11px 8px;
		border-bottom: 1px solid rgba(120, 75, 42, 0.2);
		background: rgba(255, 255, 255, 0.36);
		color: var(--pvzt-brown-dark);
		font-family:
			"SB Aggro M",
			"SB 어그로 M",
			"SB Aggro",
			"SB 어그로",
			sans-serif;
		font-size: 0.9rem;
		font-weight: 500;
	}

	.pvzt-mobile-portlet ul {
		margin: 0 !important;
		padding: 7px 10px 9px !important;
		list-style: none !important;
	}

	.pvzt-mobile-portlet li {
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}

	.pvzt-mobile-portlet li + li {
		margin-top: 1px !important;
	}

	.pvzt-mobile-portlet a {
		display: block !important;
		padding: 7px 4px !important;
		color: var(--pvzt-text) !important;
		font-size: 0.88rem !important;
		line-height: 1.35 !important;
		text-decoration: none !important;
	}

	.pvzt-mobile-portlet a:hover,
	.pvzt-mobile-portlet a:focus-visible {
		color: var(--pvzt-green-deep) !important;
		text-decoration: underline !important;
	}

	.pvzt-mobile-portlet .selected > a {
		color: var(--pvzt-green-deep) !important;
		font-weight: 700 !important;
	}
}


/* =========================================================
   6. 문서 본문
   ========================================================= */

@media screen and (max-width: 850px) {
	.skin-timeless #mw-content {
		position: relative;
		width: calc(100% - 14px) !important;
		max-width: none !important;
		margin: 8px 7px 18px !important;
		padding: 14px 12px 22px !important;
		box-sizing: border-box;
		overflow: hidden;
		border: 1px solid #b88d59 !important;
		border-radius: 0 !important;
		background: var(--pvzt-paper) !important;
		background-image: none !important;
		box-shadow: var(--pvzt-shadow) !important;
	}

	.skin-timeless #mw-content::before,
	.skin-timeless #mw-content::after {
		content: none !important;
		display: none !important;
	}

	.skin-timeless #firstHeading,
	.skin-timeless .mw-first-heading,
	.skin-timeless .mw-body h1.firstHeading {
		display: block !important;
		width: calc(100% + 24px) !important;
		max-width: none !important;
		margin: -14px -12px 10px !important;
		padding: 13px 18px 11px !important;
		box-sizing: border-box;
		border: 0 !important;
		border-radius: 0 !important;
		background:
			linear-gradient(
				100deg,
				var(--pvzt-green-deep) 0%,
				var(--pvzt-green-deep) 88%,
				transparent 88.2%
			) !important;
		color: #ffffff !important;
		font-family:
			"SB Aggro B",
			"SB 어그로 B",
			"SB Aggro",
			"SB 어그로",
			sans-serif !important;
		font-size: 1.38rem !important;
		font-weight: 700 !important;
		line-height: 1.25 !important;
		text-shadow: none !important;
	}

	.skin-timeless #firstHeading *,
	.skin-timeless .mw-first-heading * {
		color: #ffffff !important;
	}

	.pvzt-mobile-page-actions {
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		gap: 4px;
		margin: 0 -4px 14px;
		padding: 0 0 10px;
		border-bottom: 1px solid rgba(107, 58, 36, 0.28);
	}

	.pvzt-mobile-action {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		min-width: 0;
		min-height: 48px;
		padding: 4px 2px;
		border: 0;
		border-radius: 8px;
		background: transparent;
		color: #8a654d !important;
		font-size: 0.66rem !important;
		line-height: 1.1;
		text-align: center;
		text-decoration: none !important;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}

	.pvzt-mobile-action:hover,
	.pvzt-mobile-action:focus-visible {
		background: rgba(107, 58, 36, 0.08);
		color: var(--pvzt-brown-dark) !important;
		outline: 0;
	}

	.pvzt-mobile-action::before {
		content: "";
		display: block;
		width: 23px;
		height: 23px;
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
		opacity: 0.92;
	}

	.pvzt-mobile-action--page::before {
		background-image:
			url("/wiki/Special:Redirect/file/Actionbar-document.svg");
		filter: sepia(1) saturate(0.7) brightness(0.62);
	}

	.pvzt-mobile-action--talk::before {
		background-image:
			url("/wiki/Special:Redirect/file/Actionbar-talk.svg");
		filter: sepia(1) saturate(0.7) brightness(0.62);
	}

	.pvzt-mobile-action--edit::before {
		background-image:
			url("/wiki/Special:Redirect/file/Actionbar-edit.svg");
		filter: sepia(1) saturate(0.7) brightness(0.62);
	}

	.pvzt-mobile-action--history::before {
		background-image:
			url("/wiki/Special:Redirect/file/Actionbar-history.svg");
		filter: sepia(1) saturate(0.7) brightness(0.62);
	}

	.pvzt-mobile-action--more::before {
		background-image:
			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='5' cy='12' r='2' fill='%238a654d'/%3E%3Ccircle cx='12' cy='12' r='2' fill='%238a654d'/%3E%3Ccircle cx='19' cy='12' r='2' fill='%238a654d'/%3E%3C/svg%3E");
	}

	.skin-timeless .mw-body,
	.skin-timeless .mw-parser-output {
		color: var(--pvzt-text) !important;
	}

	.skin-timeless .mw-body a,
	.skin-timeless .mw-parser-output a {
		color: #24683c;
	}

	.skin-timeless .mw-body a:visited,
	.skin-timeless .mw-parser-output a:visited {
		color: #5b4f7e;
	}
}


/* =========================================================
   7. 문단 제목과 잔디 구분선
   ========================================================= */

.skin-timeless .mw-heading2,
.skin-timeless .mw-parser-output h2.pvz-grass-heading {
	position: relative !important;
	margin-bottom: 0.72em !important;
	padding-bottom: 12px !important;
	border: 0 !important;
	border-bottom: 0 !important;
	background: none !important;
	background-image: none !important;
	box-shadow: none !important;
}

.skin-timeless .mw-heading2::before,
.skin-timeless .mw-heading2::after,
.skin-timeless .mw-parser-output h2.pvz-grass-heading::before,
.skin-timeless .mw-parser-output h2.pvz-grass-heading::after {
	content: none !important;
	display: none !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
}

.skin-timeless .mw-heading2 > h2,
.skin-timeless .mw-parser-output h2.pvz-grass-heading {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
	border: 0 !important;
	border-bottom: 0 !important;
	background: none !important;
	background-image: none !important;
	box-shadow: none !important;
}

.skin-timeless .pvz-grass-divider {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	display: block;
	height: 14px;
	overflow: hidden;
	pointer-events: none;
	background: #ead9b8;
	-webkit-mask-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 112 12'%3E%3Cpath fill='black' d='M0 12V8Q3 8 5 5Q6 3 8 6L11 9Q14 7 16 4Q17 2 19 5L22 9Q25 7 28 5Q29 3 31 6L34 9Q37 7 39 4Q40 2 42 5L45 9Q48 7 51 5Q52 3 54 6L57 9Q60 7 63 4Q64 2 66 5L69 9Q72 7 75 5Q76 3 78 6L81 9Q84 7 87 4Q88 2 90 5L93 9Q96 7 99 5Q100 3 102 6L105 9Q109 8 112 7V12Z'/%3E%3C/svg%3E");
	mask-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 112 12'%3E%3Cpath fill='black' d='M0 12V8Q3 8 5 5Q6 3 8 6L11 9Q14 7 16 4Q17 2 19 5L22 9Q25 7 28 5Q29 3 31 6L34 9Q37 7 39 4Q40 2 42 5L45 9Q48 7 51 5Q52 3 54 6L57 9Q60 7 63 4Q64 2 66 5L69 9Q72 7 75 5Q76 3 78 6L81 9Q84 7 87 4Q88 2 90 5L93 9Q96 7 99 5Q100 3 102 6L105 9Q109 8 112 7V12Z'/%3E%3C/svg%3E");
	-webkit-mask-repeat: repeat-x;
	mask-repeat: repeat-x;
	-webkit-mask-position: left bottom;
	mask-position: left bottom;
	-webkit-mask-size: 112px 12px;
	mask-size: 112px 12px;
}


/* =========================================================
   8. 분류·각주·공지·목차
   ========================================================= */

@media screen and (max-width: 850px) {
	.skin-timeless #localNotice,
	.skin-timeless #catlinks,
	.skin-timeless .catlinks,
	.skin-timeless ul#filetoc,
	.skin-timeless .toccolours,
	.skin-timeless .mw-parser-output > .mw-references-wrap,
	.skin-timeless .mw-parser-output > ol.references,
	.skin-timeless .mw-parser-output > .references {
		border: 1px solid var(--pvzt-line) !important;
		border-radius: 8px !important;
		background: var(--pvzt-paper-2) !important;
		background-image: none !important;
		color: var(--pvzt-brown) !important;
		box-shadow: none !important;
	}

	.skin-timeless #localNotice {
		padding: 0.65rem 0.75rem !important;
	}

	.skin-timeless #catlinks,
	.skin-timeless .catlinks {
		margin-top: 1.2rem !important;
		padding: 0.58rem 0.72rem !important;
	}

	.skin-timeless .mw-parser-output > .mw-references-wrap,
	.skin-timeless .mw-parser-output > ol.references,
	.skin-timeless .mw-parser-output > .references {
		margin-top: 1.2rem !important;
		padding: 0.72rem 0.85rem !important;
	}

	.skin-timeless .mw-parser-output > .mw-references-wrap > ol.references {
		margin: 0 !important;
		padding: 0 0 0 1.5em !important;
		border: 0 !important;
		background: transparent !important;
	}
}


/* =========================================================
   9. 하단 영역
   ========================================================= */

@media screen and (max-width: 850px) {
	.skin-timeless #mw-footer-container,
	.skin-timeless .mw-footer-container {
		margin: 0 !important;
		padding: 16px 14px 22px !important;
		border: 0 !important;
		border-top: 1px solid #79533b !important;
		background: rgba(48, 29, 19, 0.9) !important;
		background-image: none !important;
		color: #f4e2c1 !important;
		box-shadow: none !important;
	}

	.skin-timeless #mw-footer-container a,
	.skin-timeless .mw-footer-container a,
	.skin-timeless #mw-footer-container a:visited,
	.skin-timeless .mw-footer-container a:visited {
		color: #f4d49b !important;
		text-shadow: none !important;
	}
}


/* =========================================================
   10. 작은 화면
   ========================================================= */

@media screen and (max-width: 380px) {
	:root {
		--pvzt-header-h: 100px;
	}

	.pvzt-mobile-header {
		grid-template-columns: 40px minmax(0, 1fr) 40px;
		padding-right: 7px;
		padding-left: 7px;
	}

	.pvzt-mobile-header__button {
		width: 40px;
		height: 44px;
	}

	.pvzt-mobile-brand {
		font-size: 0.9rem;
	}

	.skin-timeless #mw-content {
		width: calc(100% - 8px) !important;
		margin-right: 4px !important;
		margin-left: 4px !important;
		padding-right: 10px !important;
		padding-left: 10px !important;
	}

	.skin-timeless #firstHeading,
	.skin-timeless .mw-first-heading,
	.skin-timeless .mw-body h1.firstHeading {
		width: calc(100% + 20px) !important;
		margin-right: -10px !important;
		margin-left: -10px !important;
		padding-right: 14px !important;
		padding-left: 14px !important;
		font-size: 1.22rem !important;
	}

	.pvzt-mobile-action {
		font-size: 0.61rem !important;
	}
}


/* =========================================================
   11. 모션 최소화
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
	.pvzt-mobile-overlay,
	.pvzt-mobile-drawer {
		transition: none !important;
	}
}


/* =========================================================
   12. 모든 화면에서 기본 Timeless 인터페이스 숨김
   커스텀 UI가 생성된 뒤에만 적용
   ========================================================= */

body.skin-timeless.pvzt-mobile-ready #mw-header-container,
body.skin-timeless.pvzt-mobile-ready #mw-header-hack,
body.skin-timeless.pvzt-mobile-ready #mw-header-nav-hack,
body.skin-timeless.pvzt-mobile-ready #mw-site-navigation,
body.skin-timeless.pvzt-mobile-ready #mw-related-navigation,
body.skin-timeless.pvzt-mobile-ready #personal,
body.skin-timeless.pvzt-mobile-ready #user-tools,
body.skin-timeless.pvzt-mobile-ready .tools-inline,
body.skin-timeless.pvzt-mobile-ready #site-navigation,
body.skin-timeless.pvzt-mobile-ready #page-tools {
	display: none !important;
}


/* =========================================================
   13. 데스크톱 Timeless 재구성
   ========================================================= */

@media screen and (min-width: 851px) {
	:root {
		--pvzt-header-h: 58px;
		--pvzt-left-w: 214px;
		--pvzt-right-w: 196px;
	}

	html {
		min-height: 100% !important;
		background: #3a2419 !important;
	}

	body.skin-timeless {
		min-height: 100vh !important;
		margin: 0 !important;
		padding: var(--pvzt-header-h) 0 0 !important;
		background:
			linear-gradient(
				rgba(57, 34, 22, 0.94),
				rgba(57, 34, 22, 0.94)
			),
			url("/wiki/Special:Redirect/file/Wiki_Bg_Light.png")
			center / cover fixed !important;
		color: var(--pvzt-text) !important;
		overflow-x: hidden !important;
	}

	.skin-timeless #mw-content-container,
	.skin-timeless #mw-content-block,
	.skin-timeless #mw-content-wrapper {
		width: auto !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		background: transparent !important;
		background-image: none !important;
		box-shadow: none !important;
	}

	.skin-timeless #mw-content-container {
		margin-left: var(--pvzt-left-w) !important;
		margin-right: var(--pvzt-right-w) !important;
	}

	/* 데스크톱 상단바 */
	.pvzt-mobile-header {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		z-index: 1200;
		display: grid;
		grid-template-columns: 190px minmax(300px, 1fr) 44px;
		grid-template-rows: 44px;
		align-items: center;
		gap: 12px;
		height: var(--pvzt-header-h);
		padding: 7px 16px;
		box-sizing: border-box;
		background: var(--pvzt-green);
		border-bottom: 2px solid var(--pvzt-green-dark);
		box-shadow: 0 3px 12px rgba(22, 48, 21, 0.28);
	}

	.pvzt-mobile-header__button {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		padding: 0;
		border: 0;
		border-radius: 10px;
		background: transparent;
		color: #ffffff;
		cursor: pointer;
	}

	.pvzt-mobile-header__button:hover,
	.pvzt-mobile-header__button:focus-visible {
		background: rgba(255, 255, 255, 0.14);
		outline: 0;
	}

	.pvzt-mobile-header__button::before {
		content: "";
		display: block;
		width: 24px;
		height: 24px;
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
	}

	.pvzt-mobile-header__button--menu {
		display: none;
	}

	.pvzt-mobile-header__button--account {
		grid-column: 3;
	}

	.pvzt-mobile-header__button--account::before {
		background-image:
			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 12a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9Zm0 2c-4.7 0-8 2.45-8 5.2V21h16v-1.8c0-2.75-3.3-5.2-8-5.2Z'/%3E%3C/svg%3E");
	}

	.pvzt-mobile-brand {
		grid-column: 1;
		display: flex;
		align-items: center;
		min-width: 0;
		height: 44px;
		color: #ffffff;
		font-family:
			"SB Aggro B",
			"SB 어그로 B",
			"SB Aggro",
			"SB 어그로",
			sans-serif !important;
		font-size: 1rem;
		font-weight: 700;
		line-height: 1.1;
		text-decoration: none !important;
		text-shadow: 0 1px 1px rgba(18, 61, 27, 0.35);
	}

	.pvzt-mobile-brand:hover {
		color: #ffffff;
		text-decoration: none !important;
		opacity: 0.94;
	}

	.pvzt-mobile-brand__text {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.pvzt-mobile-search {
		grid-column: 2;
		grid-row: 1;
		display: flex;
		align-items: center;
		width: 100%;
		max-width: 980px;
		height: 42px;
		justify-self: center;
	}

	.pvzt-mobile-search #simpleSearch,
	.pvzt-mobile-search form {
		position: relative !important;
		display: flex !important;
		width: 100% !important;
		height: 42px !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden !important;
		border: 1px solid #6f4c35 !important;
		border-radius: 9px !important;
		background: #fff9ec !important;
		background-image: none !important;
		box-shadow: inset 0 1px 2px rgba(85, 50, 28, 0.08) !important;
	}

	.pvzt-mobile-search #searchInput,
	.pvzt-mobile-search input[type="search"],
	.pvzt-mobile-search input[name="search"] {
		flex: 1 1 auto !important;
		min-width: 0 !important;
		height: 40px !important;
		margin: 0 !important;
		padding: 0 46px 0 13px !important;
		border: 0 !important;
		outline: 0 !important;
		background: transparent !important;
		color: var(--pvzt-text) !important;
		font-size: 15px !important;
		box-shadow: none !important;
	}

	.pvzt-mobile-search #searchButton,
	.pvzt-mobile-search #mw-searchButton,
	.pvzt-mobile-search button[type="submit"] {
		position: absolute !important;
		top: 0 !important;
		right: 0 !important;
		width: 44px !important;
		height: 40px !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		border-left: 1px solid rgba(107, 58, 36, 0.35) !important;
		background-color: transparent !important;
		background-image:
			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%236b3a24' d='M10.7 3a7.7 7.7 0 1 0 4.73 13.78l4.4 4.4a1.2 1.2 0 1 0 1.7-1.7l-4.4-4.4A7.7 7.7 0 0 0 10.7 3Zm0 2.4a5.3 5.3 0 1 1 0 10.6 5.3 5.3 0 0 1 0-10.6Z'/%3E%3C/svg%3E") !important;
		background-position: center !important;
		background-repeat: no-repeat !important;
		background-size: 19px !important;
		font-size: 0 !important;
		box-shadow: none !important;
		cursor: pointer;
	}

	/* 데스크톱에서는 양쪽 서랍을 고정 사이드바로 사용 */
	.pvzt-mobile-overlay {
		display: none !important;
	}

	.pvzt-mobile-drawer {
		position: fixed;
		top: var(--pvzt-header-h);
		bottom: 0;
		z-index: 900;
		display: block;
		padding: 14px 12px 24px;
		box-sizing: border-box;
		overflow-y: auto;
		overscroll-behavior: contain;
		background:
			linear-gradient(
				rgba(62, 37, 23, 0.96),
				rgba(48, 29, 19, 0.98)
			),
			url("/wiki/Special:Redirect/file/Wiki_Bg_Dark.png")
			center / cover;
		color: #ffffff;
		box-shadow: none;
		transform: none !important;
		transition: none !important;
	}

	.pvzt-mobile-drawer--left {
		left: 0;
		width: var(--pvzt-left-w);
		border-right: 2px solid #25140d;
	}

	.pvzt-mobile-drawer--right {
		right: 0;
		width: var(--pvzt-right-w);
		border-left: 2px solid #25140d;
	}

	.pvzt-mobile-drawer__top {
		display: none;
	}

	.pvzt-mobile-drawer__logo {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 104px;
		margin: 0 0 13px;
		padding: 10px;
		border: 1px solid rgba(255, 236, 193, 0.18);
		border-radius: 10px;
		background: rgba(30, 17, 10, 0.26);
	}

	.pvzt-mobile-drawer__logo .mw-wiki-logo {
		display: block !important;
		width: 160px !important;
		height: 96px !important;
		max-width: 100% !important;
		background-position: center !important;
		background-repeat: no-repeat !important;
		background-size: contain !important;
	}

	.pvzt-mobile-portlet {
		margin: 0 0 12px;
		overflow: hidden;
		border: 1px solid #ad7b49;
		border-radius: 7px;
		background: var(--pvzt-cream-soft);
		color: var(--pvzt-text);
		box-shadow: 0 3px 8px rgba(20, 10, 5, 0.18);
	}

	.pvzt-mobile-portlet__title {
		margin: 0;
		padding: 9px 10px 8px;
		border-bottom: 1px solid rgba(120, 75, 42, 0.2);
		background: rgba(255, 255, 255, 0.36);
		color: var(--pvzt-brown-dark);
		font-family:
			"SB Aggro M",
			"SB 어그로 M",
			"SB Aggro",
			"SB 어그로",
			sans-serif;
		font-size: 0.86rem;
		font-weight: 500;
	}

	.pvzt-mobile-portlet ul {
		margin: 0 !important;
		padding: 7px 9px 9px !important;
		list-style: none !important;
	}

	.pvzt-mobile-portlet li {
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}

	.pvzt-mobile-portlet a {
		display: block !important;
		padding: 5px 3px !important;
		color: var(--pvzt-text) !important;
		font-size: 0.78rem !important;
		line-height: 1.35 !important;
		text-decoration: none !important;
	}

	.pvzt-mobile-portlet a:hover,
	.pvzt-mobile-portlet a:focus-visible {
		color: var(--pvzt-green-deep) !important;
		text-decoration: underline !important;
	}

	/* 데스크톱 문서 본문 */
	.skin-timeless #mw-content {
		position: relative;
		width: auto !important;
		max-width: none !important;
		min-height: calc(100vh - var(--pvzt-header-h) - 32px);
		margin: 16px 12px 24px !important;
		padding: 24px 28px 32px !important;
		box-sizing: border-box;
		overflow: hidden;
		border: 1px solid #b88d59 !important;
		border-radius: 0 !important;
		background: var(--pvzt-paper) !important;
		background-image: none !important;
		box-shadow: var(--pvzt-shadow) !important;
	}

	.skin-timeless #mw-content::before,
	.skin-timeless #mw-content::after {
		content: none !important;
		display: none !important;
	}

	.skin-timeless #firstHeading,
	.skin-timeless .mw-first-heading,
	.skin-timeless .mw-body h1.firstHeading {
		display: table !important;
		width: auto !important;
		max-width: calc(100% + 28px) !important;
		margin: 0 0 12px -28px !important;
		padding: 11px 56px 9px 28px !important;
		box-sizing: border-box;
		border: 0 !important;
		border-radius: 0 !important;
		background: var(--pvzt-green-deep) !important;
		color: #ffffff !important;
		font-family:
			"SB Aggro B",
			"SB 어그로 B",
			"SB Aggro",
			"SB 어그로",
			sans-serif !important;
		font-size: 1.9rem !important;
		font-weight: 700 !important;
		line-height: 1.24 !important;
		-webkit-clip-path: polygon(
			0 0,
			100% 0,
			calc(100% - 28px) 100%,
			0 100%
		);
		clip-path: polygon(
			0 0,
			100% 0,
			calc(100% - 28px) 100%,
			0 100%
		);
		text-shadow: none !important;
	}

	.skin-timeless #firstHeading *,
	.skin-timeless .mw-first-heading * {
		color: #ffffff !important;
	}

	.pvzt-mobile-page-actions {
		display: grid;
		grid-template-columns: repeat(5, minmax(72px, 1fr));
		gap: 6px;
		max-width: 560px;
		margin: 0 0 18px;
		padding: 0 0 11px;
		border-bottom: 1px solid rgba(107, 58, 36, 0.28);
	}

	.pvzt-mobile-action {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 4px;
		min-width: 0;
		min-height: 54px;
		padding: 5px 4px;
		border: 0;
		border-radius: 8px;
		background: transparent;
		color: #8a654d !important;
		font-size: 0.72rem !important;
		line-height: 1.1;
		text-align: center;
		text-decoration: none !important;
		cursor: pointer;
	}

	.pvzt-mobile-action:hover,
	.pvzt-mobile-action:focus-visible {
		background: rgba(107, 58, 36, 0.08);
		color: var(--pvzt-brown-dark) !important;
		outline: 0;
	}

	.pvzt-mobile-action::before {
		content: "";
		display: block;
		width: 24px;
		height: 24px;
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
		opacity: 0.92;
	}

	.pvzt-mobile-action--page::before {
		background-image:
			url("/wiki/Special:Redirect/file/Actionbar-document.svg");
		filter: sepia(1) saturate(0.7) brightness(0.62);
	}

	.pvzt-mobile-action--talk::before {
		background-image:
			url("/wiki/Special:Redirect/file/Actionbar-talk.svg");
		filter: sepia(1) saturate(0.7) brightness(0.62);
	}

	.pvzt-mobile-action--edit::before {
		background-image:
			url("/wiki/Special:Redirect/file/Actionbar-edit.svg");
		filter: sepia(1) saturate(0.7) brightness(0.62);
	}

	.pvzt-mobile-action--history::before {
		background-image:
			url("/wiki/Special:Redirect/file/Actionbar-history.svg");
		filter: sepia(1) saturate(0.7) brightness(0.62);
	}

	.pvzt-mobile-action--more::before {
		background-image:
			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='5' cy='12' r='2' fill='%238a654d'/%3E%3Ccircle cx='12' cy='12' r='2' fill='%238a654d'/%3E%3Ccircle cx='19' cy='12' r='2' fill='%238a654d'/%3E%3C/svg%3E");
	}

	.skin-timeless .mw-body,
	.skin-timeless .mw-parser-output {
		color: var(--pvzt-text) !important;
	}

	.skin-timeless #localNotice,
	.skin-timeless #catlinks,
	.skin-timeless .catlinks,
	.skin-timeless ul#filetoc,
	.skin-timeless .toccolours,
	.skin-timeless .mw-parser-output > .mw-references-wrap,
	.skin-timeless .mw-parser-output > ol.references,
	.skin-timeless .mw-parser-output > .references {
		border: 1px solid var(--pvzt-line) !important;
		border-radius: 8px !important;
		background: var(--pvzt-paper-2) !important;
		background-image: none !important;
		color: var(--pvzt-brown) !important;
		box-shadow: none !important;
	}

	.skin-timeless #mw-footer-container,
	.skin-timeless .mw-footer-container {
		margin-left: var(--pvzt-left-w) !important;
		margin-right: var(--pvzt-right-w) !important;
		padding: 18px 24px 24px !important;
		border: 0 !important;
		border-top: 1px solid #79533b !important;
		background: rgba(48, 29, 19, 0.9) !important;
		background-image: none !important;
		color: #f4e2c1 !important;
		box-shadow: none !important;
	}

	.skin-timeless #mw-footer-container a,
	.skin-timeless .mw-footer-container a,
	.skin-timeless #mw-footer-container a:visited,
	.skin-timeless .mw-footer-container a:visited {
		color: #f4d49b !important;
		text-shadow: none !important;
	}
}


/* 좁은 데스크톱에서는 오른쪽 사이드바 폭을 조금 줄임 */
@media screen and (min-width: 851px) and (max-width: 1120px) {
	:root {
		--pvzt-left-w: 196px;
		--pvzt-right-w: 176px;
	}

	.pvzt-mobile-header {
		grid-template-columns: 172px minmax(260px, 1fr) 44px;
		padding-right: 10px;
		padding-left: 10px;
	}

	.skin-timeless #mw-content {
		margin-right: 8px !important;
		margin-left: 8px !important;
		padding-right: 22px !important;
		padding-left: 22px !important;
	}

	.skin-timeless #firstHeading,
	.skin-timeless .mw-first-heading,
	.skin-timeless .mw-body h1.firstHeading {
		margin-left: -22px !important;
		padding-left: 22px !important;
		font-size: 1.65rem !important;
	}
}
원본 주소 "https://pvzkrwiki.com/index.php?title=미디어위키:Gadget-Timeless.css&oldid=518"