@@ 1번째 줄: / 1번째 줄: @@
 .infobox {
-	--infobox-outer: #6d473a;
+	--infobox-frame: #5f7047;
-	--infobox-outer-dark: #55362c;
+	--infobox-frame-dark: #435432;
-	--infobox-inner: #ead6b3;
+	--infobox-shell: #d8c5a5;
-	--infobox-inner-edge: #ccb186;
+	--infobox-shell-light: #e7d7ba;
-	--infobox-line: #9a6b4f;
+	--infobox-paper: #fffaf0;
-	--infobox-line-soft: #c3a286;
+	--infobox-paper-alt: #f2e7d3;
-	--infobox-paper: #efe5d7;
+	--infobox-rule: #d1bea3;
-	--infobox-paper-dark: #e6d8c3;
+	--infobox-label: #71805a;
-	--infobox-ribbon: #8d5a45;
+	--infobox-label-dark: #4e5e3d;
-	--infobox-ribbon-dark: #6f4332;
+	--infobox-label-light: #8e9a73;
-	--infobox-label: #a06a52;
+	--infobox-label-text: #fffdf5;
-	--infobox-label-dark: #7c4e3b;
+	--infobox-title: #704830;
-	--infobox-value: #f4ece0;
+	--infobox-title-dark: #543421;
-	--infobox-value-border: #b89a7f;
+	--infobox-ink: #49372d;
-	--infobox-ink: #463229;
+	--infobox-muted: #675143;
-	--infobox-link: #8a573f;
+	--infobox-link: #825334;
-	--infobox-link-hover: #643d2d;
+	--infobox-link-hover: #5e3822;
-	--infobox-focus: #a7755e;
+	--infobox-focus: #879a67;
-	--infobox-title-text: #fffaf3;
+	--infobox-stitch: rgba(77, 92, 57, 0.42);
-	--infobox-text-outline: #4c3025;
+	--infobox-shadow: rgba(70, 48, 32, 0.2);
-	--infobox-shadow: rgba(74, 46, 35, 0.24);
+	--infobox-cell-shadow: rgba(79, 55, 37, 0.08);
-	--infobox-image-bg: url("/wiki/Special:Redirect/file/Template_Bg_Light.png");
 	position: relative;
+	isolation: isolate;
 	float: right;
 	clear: right;
@@ 29번째 줄: / 29번째 줄: @@
 	max-width: 100%;
 	margin: 0 0 1.25rem 1.25rem;
-	padding: 1rem 0.88rem;
+	padding: 0.78rem;
-	border: 0;
+	border: 2px solid var(--infobox-frame-dark);
-	border-radius: 30px;
+	border-radius: 22px;
 	box-sizing: border-box;
-	background: var(--infobox-outer);
+	background:
+		linear-gradient(
+deg,
+			rgba(255, 255, 255, 0.2),
+			transparent 34%
+		),
+		linear-gradient(
+deg,
+			var(--infobox-shell-light),
+			var(--infobox-shell)
+		);
 	color: var(--infobox-ink);
 	font-family:
@@ 47번째 줄: / 57번째 줄: @@
 	font-weight: 300;
 	line-height: 1.55;
-	box-shadow: 0 10px 24px var(--infobox-shadow);
+	box-shadow:
+10px 25px var(--infobox-shadow),
+		inset 0 1px rgba(255, 255, 255, 0.45);
 	overflow: hidden;
 }
@@ 53번째 줄: / 65번째 줄: @@
 .infobox::before {
 	position: absolute;
-	top: 18px;
+	z-index: -2;
-	right: 16px;
+	top: 0;
-	bottom: 18px;
+	right: 0;
-	left: 16px;
+	bottom: 0;
-	border: 3px solid var(--infobox-inner-edge);
+	left: 0;
-	border-radius: 28px;
+	border-radius: 20px;
-	box-sizing: border-box;
+	background-image: url("/wiki/Special:Redirect/file/paper_texture.png");
-	background: var(--infobox-inner);
+	background-repeat: repeat;
+	background-position: left top;
+	background-size: 520px auto;
 	content: "";
+	opacity: 0.025;
+	pointer-events: none;
 }
 .infobox::after {
 	position: absolute;
-	top: 28px;
+	z-index: -1;
-	right: 24px;
+	top: 5px;
-	bottom: 28px;
+	right: 5px;
-	left: 24px;
+	bottom: 5px;
-	border: 1px solid rgba(154, 107, 79, 0.32);
+	left: 5px;
-	border-radius: 22px;
+	border: 1px dashed var(--infobox-stitch);
+	border-radius: 16px;
 	box-sizing: border-box;
 	content: "";
+	pointer-events: none;
 }
@@ 87번째 줄: / 105번째 줄: @@
 	align-items: center;
 	justify-content: center;
-	width: calc(100% - 26px);
+	width: 100%;
-	margin: 0 auto;
+	min-height: 0;
-	padding: 0.95rem 2.4rem;
+	padding: 0.58rem 2.1rem 0.54rem;
-	border: 2px solid var(--infobox-ribbon-dark);
+	border: 0;
+	border-radius: 0;
 	box-sizing: border-box;
-	background: var(--infobox-ribbon);
+	background:
+		linear-gradient(
+deg,
+			#7e543a 0%,
+			var(--infobox-title) 48%,
+			var(--infobox-title-dark) 100%
+		);
 	clip-path: polygon(
-% 0,
+0,
-% 0,
+px 50%,
+100%,
 % 100%,
-100%
+		calc(100% - 21px) 50%,
+% 0
 	);
-	color: var(--infobox-title-text);
+	color: #fffaf1;
 	font-family:
 		"SB Aggro B",
@@ 109번째 줄: / 136번째 줄: @@
 		"Noto Sans KR",
 		sans-serif;
-	font-size: 1.28rem;
+	font-size: 1.3rem;
 	font-weight: 700;
-	line-height: 1.16;
+	letter-spacing: -0.025em;
-	letter-spacing: -0.03em;
+	line-height: 1.12;
 	text-align: center;
 	text-shadow:
-		-1px -1px 0 var(--infobox-text-outline),
+1px 0 rgba(60, 35, 21, 0.9),
--1px 0 var(--infobox-text-outline),
+2px 2px rgba(45, 27, 17, 0.35);
-px -1px 0 var(--infobox-text-outline),
+	filter: drop-shadow(0 3px 2px rgba(72, 43, 27, 0.25));
-		-1px 0 0 var(--infobox-text-outline),
+	box-shadow:
-px 0 0 var(--infobox-text-outline),
+		inset 0 1px rgba(255, 255, 255, 0.18),
-		-1px 1px 0 var(--infobox-text-outline),
+		inset 0 -2px rgba(57, 34, 21, 0.22);
-1px 0 var(--infobox-text-outline),
-px 1px 0 var(--infobox-text-outline);
 	overflow-wrap: anywhere;
 	word-break: keep-all;
@@ 134번째 줄: / 159번째 줄: @@
 }
-/* 내용 패널 */
+/* 본체 */
 .infobox__panel {
-	margin: 0.95rem 0 0;
+	margin-top: 0.68rem;
-	padding: 0 0.16rem 0.1rem;
+	padding: 0;
+	border: 0;
+	border-radius: 0;
 	background: transparent;
+	overflow: visible;
+}
+.infobox__image,
+.infobox__details {
+	position: relative;
+	z-index: 1;
 }
 /* 사진칸 */
 .infobox__image {
-	position: relative;
+	display: flex;
-	width: calc(100% - 18px);
+	align-items: center;
-	min-height: 90px;
+	justify-content: center;
-	max-height: 246px;
+	width: 100%;
-	margin: 0 auto 0.82rem;
+	min-height: 82px;
-	padding: 0.9rem 0.9rem 1rem;
+	max-height: 225px;
-	border: 3px solid var(--infobox-line);
+	padding: 0.58rem;
-	border-radius: 0;
+	border: 1px solid var(--infobox-rule);
+	border-radius: 11px;
 	box-sizing: border-box;
-	background-color: var(--infobox-paper);
+	background:
-	background-image: var(--infobox-image-bg);
+		linear-gradient(
-	background-repeat: no-repeat;
+deg,
-	background-position: center;
+			rgba(255, 255, 255, 0.64),
-	background-size: cover;
+			transparent 44%
-	box-shadow: inset 0 0 0 1px rgba(255, 248, 238, 0.55);
+		),
-	clip-path: polygon(
+		var(--infobox-paper);
-0,
+	box-shadow:
-% 0,
+3px 8px var(--infobox-cell-shadow),
-% 82%,
+		inset 0 0 0 3px rgba(216, 198, 170, 0.18);
-% 82%,
-% 100%,
-% 100%,
-% 96%,
-% 100%,
-% 100%,
-% 15%,
-12%
-	);
 	overflow: hidden;
-	text-align: center;
 }
 .infobox__image::before {
 	position: absolute;
-	top: 8px;
+	top: 0;
-	right: 8px;
+	right: 0;
-	bottom: 8px;
+	bottom: 0;
-	left: 8px;
+	left: 0;
-	border: 1px solid rgba(154, 107, 79, 0.28);
+	background-image:
+		linear-gradient(
+deg,
+			rgba(113, 128, 90, 0.025) 25%,
+			transparent 25%,
+			transparent 75%,
+			rgba(113, 128, 90, 0.025) 75%
+		),
+		linear-gradient(
+			-45deg,
+			rgba(113, 128, 90, 0.025) 25%,
+			transparent 25%,
+			transparent 75%,
+			rgba(113, 128, 90, 0.025) 75%
+		);
+	background-position:
+0,
+px 8px;
+	background-size: 16px 16px;
 	content: "";
 	pointer-events: none;
+}
+.infobox__image::after {
+	position: absolute;
+	right: 0.7rem;
+	bottom: 0.52rem;
+	width: 30px;
+	height: 3px;
+	border-radius: 3px;
+	background: var(--infobox-label);
+	content: "";
+	opacity: 0.38;
 }
@@ 197번째 줄: / 252번째 줄: @@
 	max-width: 100%;
 	height: auto;
-	max-height: 208px;
+	max-height: 198px;
 	margin: 0 auto;
 	object-fit: contain;
+	filter: drop-shadow(0 3px 2px rgba(67, 49, 36, 0.14));
 }
-/* 기본 정보 테이블 */
+/* 정보칸 */
 .infobox__details {
-	width: calc(100% - 18px);
+	width: calc(100% + 0.64rem);
-	margin: 0 auto;
+	margin: 0.3rem -0.32rem -0.22rem;
 	border: 0;
 	border-collapse: separate;
-	border-spacing: 0 0.42rem;
+	border-spacing: 0.32rem 0.34rem;
 	table-layout: fixed;
 	background: transparent;
 	box-sizing: border-box;
+	font-family:
+		"SB Aggro L",
+		"SB 어그로 L",
+		-apple-system,
+		BlinkMacSystemFont,
+		"Segoe UI",
+		"Apple SD Gothic Neo",
+		"Noto Sans KR",
+		sans-serif;
+	box-shadow: none;
+	overflow: visible;
+}
+.infobox__image + .infobox__details {
+	margin-top: 0.3rem;
 }
@@ 220번째 줄: / 291번째 줄: @@
 .infobox__details th,
 .infobox__details td {
-	padding: 0.52rem 0.8rem;
+	position: relative;
+	min-width: 0;
+	padding-top: 0.62rem;
+	padding-bottom: 0.62rem;
 	box-sizing: border-box;
 	vertical-align: middle;
-	line-height: 1.36;
+	line-height: 1.46;
+	overflow: hidden;
 }
+/* 항목명 라벨 */
 .infobox__details th {
-	width: 29%;
+	width: 32%;
-	border: 2px solid var(--infobox-line-soft);
+	padding-right: 1.08rem;
-	border-right: 0;
+	padding-left: 0.92rem;
-	border-radius: 6px 0 0 6px;
+	border: 1px solid var(--infobox-label-dark);
-	background: var(--infobox-label);
+	border-radius: 10px;
-	color: var(--infobox-title-text);
+	background-color: var(--infobox-label);
+	background-image:
+		linear-gradient(
+deg,
+			var(--infobox-label-dark) 0,
+			var(--infobox-label-dark) 7px,
+			transparent 7px
+		),
+		linear-gradient(
+deg,
+			rgba(255, 255, 255, 0.055) 25%,
+			transparent 25%,
+			transparent 75%,
+			rgba(255, 255, 255, 0.055) 75%
+		),
+		linear-gradient(
+			-45deg,
+			rgba(67, 84, 50, 0.09) 25%,
+			transparent 25%,
+			transparent 75%,
+			rgba(67, 84, 50, 0.09) 75%
+		);
+	background-position:
+		left top,
+0,
+px 9px;
+	background-size:
+		auto,
+px 18px,
+px 18px;
+	color: var(--infobox-label-text);
 	font-family:
 		"SB Aggro M",
@@ 242번째 줄: / 348번째 줄: @@
 		"Noto Sans KR",
 		sans-serif;
-	font-size: 0.84rem;
+	font-size: 0.82rem;
 	font-weight: 500;
 	text-align: left;
 	text-shadow:
-		-1px -1px 0 var(--infobox-text-outline),
+1px 0 rgba(54, 68, 40, 0.9),
--1px 0 var(--infobox-text-outline),
+1px 2px rgba(40, 51, 30, 0.28);
-px -1px 0 var(--infobox-text-outline),
-		-1px 0 0 var(--infobox-text-outline),
-px 0 0 var(--infobox-text-outline),
-		-1px 1px 0 var(--infobox-text-outline),
-1px 0 var(--infobox-text-outline),
-px 1px 0 var(--infobox-text-outline);
 	word-break: keep-all;
+	box-shadow:
+		inset 0 1px rgba(255, 255, 255, 0.15),
+2px 4px rgba(56, 70, 42, 0.13);
+}
+.infobox__details th::after {
+	position: absolute;
+	top: 50%;
+	right: 0.42rem;
+	width: 5px;
+	height: 5px;
+	border-radius: 50%;
+	background: rgba(255, 253, 245, 0.66);
+	box-shadow: 0 1px 1px rgba(48, 61, 36, 0.35);
+	content: "";
+	transform: translateY(-50%);
 }
+/* 정보값 종이칸 */
 .infobox__details td {
-	width: 71%;
+	width: 68%;
-	border: 2px solid var(--infobox-value-border);
+	padding-right: 0.82rem;
-	border-left: 0;
+	padding-left: 0.86rem;
-	border-radius: 0 6px 6px 0;
+	border: 1px solid var(--infobox-rule);
-	background: var(--infobox-value);
+	border-radius: 10px;
+	background-color: var(--infobox-paper);
+	background-image:
+		linear-gradient(
+deg,
+			var(--infobox-paper-alt) 0,
+			var(--infobox-paper-alt) 5px,
+			transparent 5px
+		),
+		repeating-linear-gradient(
+deg,
+			transparent 0,
+			transparent 19px,
+			rgba(122, 95, 68, 0.035) 20px
+		);
 	color: var(--infobox-ink);
 	font-family:
@@ 273번째 줄: / 404번째 줄: @@
 		"Noto Sans KR",
 		sans-serif;
-	font-size: 0.9rem;
+	font-size: 0.89rem;
 	font-weight: 300;
 	text-align: left;
+	overflow-wrap: anywhere;
 	word-break: break-word;
-	overflow-wrap: anywhere;
+	box-shadow:
-}
+2px 5px var(--infobox-cell-shadow),
+		inset 0 1px rgba(255, 255, 255, 0.72);
-/* 섹션 제목 */
-.infobox__section-title,
-.infobox__subtitle,
-.infobox__panel > h2,
-.infobox__panel > h3 {
-	display: block;
-	width: calc(100% - 18px);
-	margin: 0.96rem auto 0.72rem;
-	padding: 0.72rem 2.2rem 0.72rem 1.45rem;
-	border: 2px solid var(--infobox-ribbon-dark);
-	box-sizing: border-box;
-	background: var(--infobox-ribbon);
-	clip-path: polygon(
-% 0,
-% 0,
-% 100%,
-100%
-	);
-	color: var(--infobox-title-text);
-	font-family:
-		"SB Aggro B",
-		"SB 어그로 B",
-		-apple-system,
-		BlinkMacSystemFont,
-		"Segoe UI",
-		"Apple SD Gothic Neo",
-		"Noto Sans KR",
-		sans-serif;
-	font-size: 1.1rem;
-	font-weight: 700;
-	line-height: 1.14;
-	text-align: center;
-	text-shadow:
-		-1px -1px 0 var(--infobox-text-outline),
--1px 0 var(--infobox-text-outline),
-px -1px 0 var(--infobox-text-outline),
-		-1px 0 0 var(--infobox-text-outline),
-px 0 0 var(--infobox-text-outline),
-		-1px 1px 0 var(--infobox-text-outline),
-1px 0 var(--infobox-text-outline),
-px 1px 0 var(--infobox-text-outline);
-}
-.infobox__section-title::after,
-.infobox__subtitle::after,
-.infobox__panel > h2::after,
-.infobox__panel > h3::after {
-	position: absolute;
-	top: 50%;
-	right: 0.92rem;
-	width: 0;
-	height: 0;
-	border-top: 9px solid var(--infobox-outer-dark);
-	border-right: 9px solid transparent;
-	border-left: 9px solid transparent;
-	content: "";
-	transform: translateY(-35%);
-}
-/* 섹션 본문 박스 */
-.infobox__section-body,
-.infobox__listbox,
-.infobox__games,
-.infobox__appearance-list {
-	width: calc(100% - 18px);
-	margin: 0 auto 0.4rem;
-	padding: 0.92rem 1rem;
-	border: 2px solid var(--infobox-value-border);
-	border-radius: 8px;
-	box-sizing: border-box;
-	background: var(--infobox-paper);
-	color: var(--infobox-ink);
-	font-size: 0.92rem;
-	line-height: 1.48;
 }
-.infobox__section-body p,
-.infobox__listbox p,
-.infobox__games p,
-.infobox__appearance-list p,
 .infobox__details p {
-	margin: 0.12em 0;
+	margin: 0.14em 0;
 	font: inherit;
 }
-.infobox__section-body ul,
-.infobox__section-body ol,
-.infobox__listbox ul,
-.infobox__listbox ol,
-.infobox__games ul,
-.infobox__games ol,
-.infobox__appearance-list ul,
-.infobox__appearance-list ol,
 .infobox__details ul,
 .infobox__details ol {
-	margin: 0.16em 0 0.16em 1.15em;
+	margin: 0.18em 0 0.18em 1.1em;
 	padding: 0;
 	font: inherit;
 }
-.infobox__section-body li,
-.infobox__listbox li,
-.infobox__games li,
-.infobox__appearance-list li,
 .infobox__details li {
-	margin: 0.12em 0;
+	margin: 0.1em 0;
 	font: inherit;
 }
-.infobox small,
+.infobox__details sup {
-.infobox sup,
+	line-height: 1;
-.infobox__details small,
-.infobox__details sup,
-.infobox__section-body small,
-.infobox__section-body sup,
-.infobox__listbox small,
-.infobox__listbox sup,
-.infobox__games small,
-.infobox__games sup,
-.infobox__appearance-list small,
-.infobox__appearance-list sup {
-	position: static;
-	top: auto;
-	bottom: auto;
-	vertical-align: baseline;
-	line-height: inherit;
-	font-size: 0.85em;
 }
@@ 413번째 줄: / 439번째 줄: @@
 	font-family: inherit;
 	font-weight: inherit;
-	text-decoration: none;
+	text-decoration: underline;
 }
 .infobox a:hover {
 	color: var(--infobox-link-hover);
-	text-decoration: underline;
+	text-decoration-color: currentColor;
 }
 .infobox a:focus {
+	border-radius: 3px;
 	outline: 2px solid var(--infobox-focus);
 	outline-offset: 2px;
 }
-/* 모바일 */
+/* 태블릿·모바일 */
 @media screen and (max-width: 720px) {
 	.infobox {
@@ 434번째 줄: / 461번째 줄: @@
 		max-width: 100%;
 		margin: 0 0 1.1rem;
-		padding: 0.92rem 0.76rem;
+		padding: 0.68rem;
-		border-radius: 26px;
+		border-radius: 20px;
 		font-size: 1rem;
+		line-height: 1.55;
+		box-shadow:
+8px 20px var(--infobox-shadow),
+			inset 0 1px rgba(255, 255, 255, 0.38);
 	}
 	.infobox::before {
-		top: 14px;
+		border-radius: 18px;
-		right: 12px;
-		bottom: 14px;
-		left: 12px;
-		border-radius: 24px;
 	}
 	.infobox::after {
-		top: 22px;
+		border-radius: 15px;
-		right: 19px;
-		bottom: 22px;
-		left: 19px;
-		border-radius: 18px;
 	}
-	.infobox__title,
+	.infobox__title {
-	.infobox__section-title,
+		padding: 0.64rem 2.3rem 0.6rem;
-	.infobox__subtitle,
+		clip-path: polygon(
-	.infobox__panel > h2,
+0,
-	.infobox__panel > h3,
+px 50%,
-	.infobox__image,
+100%,
-	.infobox__details,
+% 100%,
-	.infobox__section-body,
+			calc(100% - 23px) 50%,
-	.infobox__listbox,
+% 0
-	.infobox__games,
+		);
-	.infobox__appearance-list {
+		font-size: 1.65rem;
-		width: calc(100% - 12px);
+		line-height: 1.12;
 	}
-	.infobox__title {
+	.infobox__panel {
-		padding: 0.92rem 2.2rem;
+		margin-top: 0.62rem;
-		font-size: 1.5rem;
 	}
 	.infobox__image {
-		min-height: 94px;
+		min-height: 90px;
-		max-height: 250px;
+		max-height: 235px;
-		padding: 0.82rem 0.82rem 0.94rem;
+		padding: 0.58rem;
 	}
 	.infobox__image img {
-		max-height: 212px;
+		max-height: 208px;
 	}
-	.infobox__details th,
+	.infobox__details {
-	.infobox__details td {
+		width: calc(100% + 0.56rem);
-		padding: 0.54rem 0.72rem;
+		margin-right: -0.28rem;
+		margin-left: -0.28rem;
+		border-spacing: 0.28rem 0.32rem;
 	}
-	.infobox__details th {
+	.infobox__image + .infobox__details {
-		width: 31%;
+		margin-top: 0.28rem;
-		font-size: 0.97rem;
 	}
+	.infobox__details th,
 	.infobox__details td {
-		width: 69%;
+		padding-top: 0.72rem;
-		font-size: 1rem;
+		padding-bottom: 0.72rem;
+		line-height: 1.46;
 	}
-	.infobox__section-title,
+	.infobox__details th {
-	.infobox__subtitle,
+		width: 30%;
-	.infobox__panel > h2,
+		padding-right: 1.02rem;
-	.infobox__panel > h3 {
+		padding-left: 0.88rem;
-		padding: 0.74rem 2.05rem 0.74rem 1.35rem;
+		font-size: 0.96rem;
-		font-size: 1.24rem;
 	}
-	.infobox__section-body,
+	.infobox__details td {
-	.infobox__listbox,
+		width: 70%;
-	.infobox__games,
+		padding-right: 0.84rem;
-	.infobox__appearance-list {
+		padding-left: 0.9rem;
 		font-size: 1rem;
 	}
@@ 517번째 줄: / 541번째 줄: @@
 @media screen and (max-width: 480px) {
 	.infobox {
-		padding: 0.82rem 0.62rem;
+		padding: 0.56rem;
-		border-radius: 22px;
+		border-radius: 18px;
 	}
 	.infobox::before {
-		top: 12px;
+		border-radius: 16px;
-		right: 10px;
-		bottom: 12px;
-		left: 10px;
-		border-radius: 20px;
 	}
 	.infobox::after {
-		top: 18px;
+		top: 4px;
-		right: 16px;
+		right: 4px;
-		bottom: 18px;
+		bottom: 4px;
-		left: 16px;
+		left: 4px;
-		border-radius: 15px;
+		border-radius: 14px;
 	}
-	.infobox__title,
+	.infobox__title {
-	.infobox__section-title,
+		padding: 0.6rem 1.9rem 0.56rem;
-	.infobox__subtitle,
+		clip-path: polygon(
-	.infobox__panel > h2,
+0,
-	.infobox__panel > h3,
+px 50%,
-	.infobox__image,
+100%,
-	.infobox__details,
+% 100%,
-	.infobox__section-body,
+			calc(100% - 18px) 50%,
-	.infobox__listbox,
+% 0
-	.infobox__games,
+		);
-	.infobox__appearance-list {
+		font-size: 1.48rem;
-		width: calc(100% - 8px);
+		line-height: 1.12;
 	}
-	.infobox__title {
+	.infobox__panel {
-		padding: 0.82rem 1.9rem;
+		margin-top: 0.58rem;
-		font-size: 1.34rem;
 	}
 	.infobox__image {
-		min-height: 80px;
+		min-height: 72px;
-		max-height: 220px;
+		max-height: 205px;
-		padding: 0.72rem 0.7rem 0.84rem;
+		padding: 0.46rem;
+		border-radius: 9px;
 	}
 	.infobox__image img {
-		max-height: 178px;
+		max-height: 180px;
 	}
 	.infobox__details {
-		border-spacing: 0 0.34rem;
+		display: block;
+		width: 100%;
+		margin: 0.28rem 0 -0.16rem;
+		border-spacing: 0;
+	}
+	.infobox__details tbody {
+		display: block;
+		width: 100%;
+	}
+	.infobox__details tr {
+		display: grid;
+		grid-template-columns: minmax(88px, 31%) minmax(0, 1fr);
+		gap: 0.3rem;
+		width: 100%;
+		margin: 0 0 0.34rem;
 	}
 	.infobox__details th,
 	.infobox__details td {
-		padding: 0.5rem 0.62rem;
+		display: flex;
+		align-items: center;
+		width: auto;
+		min-height: 44px;
+		padding-top: 0.62rem;
+		padding-bottom: 0.62rem;
+		line-height: 1.42;
 	}
 	.infobox__details th {
-		width: 33%;
+		padding-right: 0.96rem;
-		font-size: 0.9rem;
+		padding-left: 0.76rem;
+		border-radius: 9px;
+		font-size: 0.87rem;
 	}
 	.infobox__details td {
-		width: 67%;
+		padding-right: 0.7rem;
-		font-size: 0.95rem;
+		padding-left: 0.76rem;
+		border-radius: 9px;
+		font-size: 0.94rem;
+	}
+}
+/* 직접 선택한 다크 모드 */
+@media screen {
+	html.skin-theme-clientpref-night .infobox {
+		--infobox-frame: #71805b;
+		--infobox-frame-dark: #445039;
+		--infobox-shell: #37352c;
+		--infobox-shell-light: #454238;
+		--infobox-paper: #302f29;
+		--infobox-paper-alt: #3b3a31;
+		--infobox-rule: #5c594c;
+		--infobox-label: #566247;
+		--infobox-label-dark: #35402d;
+		--infobox-label-light: #687556;
+		--infobox-label-text: #f5f1e5;
+		--infobox-title: #674631;
+		--infobox-title-dark: #4d3223;
+		--infobox-ink: #eee8dc;
+		--infobox-muted: #c5bbaa;
+		--infobox-link: #dfb183;
+		--infobox-link-hover: #f1cba4;
+		--infobox-focus: #a8bb82;
+		--infobox-stitch: rgba(157, 172, 126, 0.34);
+		--infobox-shadow: rgba(0, 0, 0, 0.34);
+		--infobox-cell-shadow: rgba(0, 0, 0, 0.18);
+		background:
+			linear-gradient(
+deg,
+				rgba(255, 255, 255, 0.045),
+				transparent 34%
+			),
+			linear-gradient(
+deg,
+				var(--infobox-shell-light),
+				var(--infobox-shell)
+			);
 	}
-	.infobox__section-title,
+	html.skin-theme-clientpref-night .infobox::before {
-	.infobox__subtitle,
+		opacity: 0.009;
-	.infobox__panel > h2,
-	.infobox__panel > h3 {
-		padding: 0.68rem 1.88rem 0.68rem 1.12rem;
-		font-size: 1.08rem;
 	}
-	.infobox__section-body,
+	html.skin-theme-clientpref-night .infobox__title {
-	.infobox__listbox,
+		background:
-	.infobox__games,
+			linear-gradient(
-	.infobox__appearance-list {
+deg,
-		padding: 0.82rem 0.86rem;
+				#76513a 0%,
-		font-size: 0.95rem;
+				var(--infobox-title) 48%,
+				var(--infobox-title-dark) 100%
+			);
+	}
+	html.skin-theme-clientpref-night .infobox__image {
+		background:
+			linear-gradient(
+deg,
+				rgba(255, 255, 255, 0.045),
+				transparent 44%
+			),
+			var(--infobox-paper);
 	}
-}
-/* 수동 다크 모드 */
+	html.skin-theme-clientpref-night .infobox__details td {
-@media screen {
+		background-color: var(--infobox-paper);
-	html.skin-theme-clientpref-night .infobox {
+		background-image:
-		--infobox-outer: #52392f;
+			linear-gradient(
-		--infobox-outer-dark: #3d2a23;
+deg,
-		--infobox-inner: #725a48;
+				var(--infobox-paper-alt) 0,
-		--infobox-inner-edge: #8f735c;
+				var(--infobox-paper-alt) 5px,
-		--infobox-line: #ad8464;
+				transparent 5px
-		--infobox-line-soft: #98775d;
+			),
-		--infobox-paper: #3a312c;
+			repeating-linear-gradient(
-		--infobox-paper-dark: #493d36;
+deg,
-		--infobox-ribbon: #875a45;
+				transparent 0,
-		--infobox-ribbon-dark: #694332;
+				transparent 19px,
-		--infobox-label: #94634d;
+				rgba(255, 255, 255, 0.018) 20px
-		--infobox-label-dark: #774d3b;
+			);
-		--infobox-value: #3f342f;
-		--infobox-value-border: #866956;
-		--infobox-ink: #f2e7df;
-		--infobox-link: #edc1a9;
-		--infobox-link-hover: #ffe0d0;
-		--infobox-focus: #d0a388;
-		--infobox-title-text: #fff8f2;
-		--infobox-text-outline: #311f18;
-		--infobox-shadow: rgba(0, 0, 0, 0.35);
-		--infobox-image-bg: url("/wiki/Special:Redirect/file/Template_Bg_Dark.png");
 	}
 }
-/* OS 다크 모드 */
+/* 운영체제 설정을 따르는 다크 모드 */
 @media screen and (prefers-color-scheme: dark) {
 	html.skin-theme-clientpref-os .infobox {
-		--infobox-outer: #52392f;
+		--infobox-frame: #71805b;
-		--infobox-outer-dark: #3d2a23;
+		--infobox-frame-dark: #445039;
-		--infobox-inner: #725a48;
+		--infobox-shell: #37352c;
-		--infobox-inner-edge: #8f735c;
+		--infobox-shell-light: #454238;
-		--infobox-line: #ad8464;
+		--infobox-paper: #302f29;
-		--infobox-line-soft: #98775d;
+		--infobox-paper-alt: #3b3a31;
-		--infobox-paper: #3a312c;
+		--infobox-rule: #5c594c;
-		--infobox-paper-dark: #493d36;
+		--infobox-label: #566247;
-		--infobox-ribbon: #875a45;
+		--infobox-label-dark: #35402d;
-		--infobox-ribbon-dark: #694332;
+		--infobox-label-light: #687556;
-		--infobox-label: #94634d;
+		--infobox-label-text: #f5f1e5;
-		--infobox-label-dark: #774d3b;
+		--infobox-title: #674631;
-		--infobox-value: #3f342f;
+		--infobox-title-dark: #4d3223;
-		--infobox-value-border: #866956;
+		--infobox-ink: #eee8dc;
-		--infobox-ink: #f2e7df;
+		--infobox-muted: #c5bbaa;
-		--infobox-link: #edc1a9;
+		--infobox-link: #dfb183;
-		--infobox-link-hover: #ffe0d0;
+		--infobox-link-hover: #f1cba4;
-		--infobox-focus: #d0a388;
+		--infobox-focus: #a8bb82;
-		--infobox-title-text: #fff8f2;
+		--infobox-stitch: rgba(157, 172, 126, 0.34);
-		--infobox-text-outline: #311f18;
+		--infobox-shadow: rgba(0, 0, 0, 0.34);
-		--infobox-shadow: rgba(0, 0, 0, 0.35);
+		--infobox-cell-shadow: rgba(0, 0, 0, 0.18);
-		--infobox-image-bg: url("/wiki/Special:Redirect/file/Template_Bg_Dark.png");
+		background:
+			linear-gradient(
+deg,
+				rgba(255, 255, 255, 0.045),
+				transparent 34%
+			),
+			linear-gradient(
+deg,
+				var(--infobox-shell-light),
+				var(--infobox-shell)
+			);
+	}
+	html.skin-theme-clientpref-os .infobox::before {
+		opacity: 0.009;
+	}
+	html.skin-theme-clientpref-os .infobox__title {
+		background:
+			linear-gradient(
+deg,
+				#76513a 0%,
+				var(--infobox-title) 48%,
+				var(--infobox-title-dark) 100%
+			);
+	}
+	html.skin-theme-clientpref-os .infobox__image {
+		background:
+			linear-gradient(
+deg,
+				rgba(255, 255, 255, 0.045),
+				transparent 44%
+			),
+			var(--infobox-paper);
+	}
+	html.skin-theme-clientpref-os .infobox__details td {
+		background-color: var(--infobox-paper);
+		background-image:
+			linear-gradient(
+deg,
+				var(--infobox-paper-alt) 0,
+				var(--infobox-paper-alt) 5px,
+				transparent 5px
+			),
+			repeating-linear-gradient(
+deg,
+				transparent 0,
+				transparent 19px,
+				rgba(255, 255, 255, 0.018) 20px
+			);
 	}
 }

익명 사용자

검색

틀:정보상자/styles.css: 두 판 사이의 차이

둘러보기

위키 도구

문서 도구