@import url("skins/wogmain.css");

.shell__host > .wog-host-page {
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
}

.shell__host.is-fill > .wog-host-page,
#top_view > .wog-host-page,
#foot > .wog-host-page,
#chat_input > .wog-host-page {
	min-height: 100%;
}

#chat,
#chat > .wog-host-page {
	text-align: left;
}

#wog_view > #wogview_body {
	box-sizing: border-box;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	height: 100%;
	margin: 0px;
	min-height: 0;
	min-width: 0px;
	overflow-x: hidden;
	overflow-y: auto;
	width: 100%;
	padding: 12px;
	background:
		radial-gradient(circle at 12% 16%, rgba(170,133,74,.18), rgba(170,133,74,0) 24%),
		linear-gradient(180deg, #402d1d 0%, #1c130c 100%);
}

#wog_view > #wogview_body > FORM,
#wog_view > #wogview_body > TABLE {
	box-sizing: border-box;
	max-width: 100%;
	padding-right: 18px;
	width: 100%;
}

#wog_view > #wogview_body > FORM > TABLE:first-of-type,
#wog_view > #wogview_body > CENTER > TABLE:first-of-type,
#wog_view > #wogview_body > TABLE:first-of-type {
	box-sizing: border-box;
	max-width: 100%;
	width: 100%;
}

#wog_view > #wogview_body > #fight-go,
#wog_view > #wogview_body > #Tscene,
#wog_view > #wogview_body > #Tscene02,
#wog_view > #wogview_body > #Tscene03,
#wog_view > #wogview_body > #Tscene04,
#wog_view > #wogview_body > #Tscene05,
#wog_view > #wogview_body > #Tscene06,
#wog_view > #wogview_body > #Tscene07,
#wog_view > #wogview_body > #reg,
#wog_view > #wogview_body > #house,
#wog_view > #wogview_body > #fight,
#wog_view > #wogview_body > #race,
#wog_view > #wogview_body > #pet-race,
#wog_view > #wogview_body > #server-tournament {
	box-sizing: border-box;
	min-height: 100%;
	max-width: none;
	padding-right: 18px;
	width: 100%;
}

#wog_view > #wogview_body.login-page {
	background: url(skins/fight_bg/reg.jpeg) #20140c no-repeat center top;
	background-size: cover;
	min-width: 0px;
	overflow: hidden;
	padding: 0px;
	text-align: left;
	width: 100%;
	height: 100%;
	min-height: 100%;
}

#wog_view > #wogview_body.login-page.scrollbar {
	overflow: hidden;
}

#wog_view > #wogview_body.login-page > #reg {
	align-items: stretch;
	background: none;
	display: flex;
	height: 100%;
	justify-content: center;
	min-height: 100%;
	padding: 16px 24px 12px;
	width: 100%;
}

#wog_view > #wogview_body.login-page > #reg FORM {
	align-items: stretch;
	display: flex;
	height: 100%;
	margin: 0px;
	max-width: 100%;
	width: 1080px;
}

#wog_view > #wogview_body.login-page .login-hero {
	align-items: stretch;
	display: grid;
	gap: 22px;
	grid-template-columns: minmax(0px, 1fr) 404px;
	height: 100%;
	margin: 0px auto;
	max-width: 100%;
	min-height: 0px;
	width: 1080px;
}

#wog_view > #wogview_body.login-page .login-hero__intro {
	background:
		linear-gradient(180deg, #203c95 0%, #102873 54%, #071640 100%);
	border: 2px solid #cfc3a0;
	border-radius: 6px;
	box-shadow:
		inset 0 0 0 2px #06133f,
		4px 4px 0 #01030a;
	box-sizing: border-box;
	color: #f1e1bc;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	min-height: 0px;
	padding: 30px 34px;
	position: relative;
	overflow: hidden;
}

#wog_view > #wogview_body.login-page .login-hero__intro:before {
	content: none;
}

#wog_view > #wogview_body.login-page .login-hero__intro > * {
	position: relative;
	z-index: 1;
}

#wog_view > #wogview_body.login-page .login-hero__badge {
	align-self: flex-start;
	background: #102873;
	border: 1px solid #bda970;
	border-radius: 6px;
	color: #f0dc96;
	font-size: 12px;
	letter-spacing: 1.8px;
	line-height: 1;
	padding: 7px 12px;
	text-transform: uppercase;
}

#wog_view > #wogview_body.login-page .login-hero__title {
	color: #fff5dd;
	font-size: 38px;
	letter-spacing: 1px;
	line-height: 1.08;
	margin-top: 14px;
}

#wog_view > #wogview_body.login-page .login-hero__subtitle {
	color: rgba(243, 232, 207, 0.92);
	font-size: 16px;
	line-height: 1.7;
	margin-top: 12px;
	max-width: 520px;
}

#wog_view > #wogview_body.login-page .login-hero__tips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 16px;
}

#wog_view > #wogview_body.login-page .login-hero__tip {
	background: #102873;
	border: 1px solid #6f89d1;
	border-radius: 6px;
	color: #fff2c4;
	font-size: 13px;
	line-height: 1.2;
	padding: 7px 12px;
}

#wog_view > #wogview_body.login-page .login-hero__panel {
	background: #071640;
	border: 2px solid #6f89d1;
	border-radius: 6px;
	box-shadow:
		inset 0 0 0 1px #203c95,
		2px 2px 0 #01030a;
	margin-top: 20px;
	max-width: 560px;
	padding: 18px 20px;
}

#wog_view > #wogview_body.login-page .login-hero__panel-title {
	color: #ffe6b3;
	font-size: 15px;
	font-weight: bold;
	letter-spacing: 0.6px;
}

#wog_view > #wogview_body.login-page .login-hero__list {
	margin-top: 10px;
	padding-left: 0px;
}

#wog_view > #wogview_body.login-page .login-hero__list LI {
	color: rgba(244, 236, 219, 0.86);
	line-height: 1.8;
	padding-left: 18px;
	position: relative;
}

#wog_view > #wogview_body.login-page .login-hero__list LI:before {
	color: #e8bf76;
	content: '◆';
	left: 0px;
	position: absolute;
	top: 0px;
}

#wog_view > #wogview_body.login-page #regframe {
	background:
		linear-gradient(180deg, #203c95 0%, #102873 54%, #071640 100%);
	border: 2px solid #cfc3a0;
	border-radius: 6px;
	box-shadow:
		inset 0 0 0 2px #06133f,
		4px 4px 0 #01030a;
	align-self: stretch;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	height: 100%;
	justify-content: center;
	margin: 0px auto;
	max-width: 100%;
	min-height: 0px;
	padding: 24px 24px 20px;
	width: 404px;
}

#wog_view > #wogview_body.login-page #regframe TABLE {
	width: 100%;
}

#wog_view > #wogview_body.login-page #regframe TD {
	font-size: 14px;
	line-height: 1.5;
	white-space: nowrap;
}

#wog_view > #wogview_body.login-page .login-card__header {
	margin-bottom: 18px;
	text-align: center;
}

#wog_view > #wogview_body.login-page .login-card__eyebrow {
	color: #e5bd77;
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
}

#wog_view > #wogview_body.login-page .login-card__title {
	color: #fff0cc;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.2;
	margin-top: 8px;
}

#wog_view > #wogview_body.login-page .login-card__fields {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

#wog_view > #wogview_body.login-page .login-card__field {
	align-items: center;
	display: grid;
	gap: 14px;
	grid-template-columns: 44px minmax(0px, 1fr);
}

#wog_view > #wogview_body.login-page .login-card__label {
	color: #ecd7aa;
	font-size: 14px;
	font-weight: bold;
	letter-spacing: 0.6px;
	text-align: right;
}

#wog_view > #wogview_body.login-page .reg-input,
#wog_view > #wogview_body.login-page .login-card__input {
	background: #071640;
	border: 1px solid #bda970;
	border-radius: 6px;
	box-shadow:
		inset 0 0 0 1px #203c95;
	box-sizing: border-box;
	color: #f4f7fb;
	font-size: 14px;
	height: 34px;
	line-height: 34px;
	max-width: 100%;
	padding: 0px 14px;
	width: 100%;
}

#wog_view > #wogview_body.login-page .login-card__hint {
	color: #d8d2bb;
	font-size: 13px;
	line-height: 1.7;
	margin-top: 16px;
	text-align: center;
}

#wog_view > #wogview_body.login-page .button03 {
	background: linear-gradient(180deg, #f0dc96 0%, #b48a39 55%, #7a561d 100%);
	border: 1px solid #bda970;
	border-radius: 6px;
	box-shadow:
		inset 0 0 0 1px #fff2c4,
		2px 2px 0 #01030a;
	color: #211405;
	font-size: 13px;
	font-weight: bold;
	min-height: 34px;
	min-width: 116px;
	padding: 6px 18px;
}

#wog_view > #wogview_body.login-page .login-card__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
	margin-top: 18px;
}

#wog_view > #wogview_body.login-page .login-card__actions .button03 {
	margin: 0px;
}

@media (max-width: 980px) {
	#wog_view > #wogview_body.login-page > #reg FORM,
	#wog_view > #wogview_body.login-page .login-hero {
		width: 100%;
	}

	#wog_view > #wogview_body.login-page .login-hero {
		grid-template-columns: minmax(0px, 1fr);
	}

	#wog_view > #wogview_body.login-page .login-hero__intro,
	#wog_view > #wogview_body.login-page #regframe {
		min-height: 0px;
	}
}

#top_view,
#foot,
#chat_input {
	--host-bg-0: #071640;
	--host-bg-1: #17328a;
	--host-panel: #102873;
	--host-line: #cfc3a0;
	--host-line-strong: #f0dc96;
	--host-text: #fff2c4;
	--host-text-soft: #d8d2bb;
	--host-accent: #f0dc96;
	--host-accent-strong: #8f6b28;
	--host-radius: 6px;
	--host-shadow: 3px 3px 0 #01030a;
}

#top_view form,
#foot form,
#chat_input form {
	margin: 0;
}

#top_view .top-shell {
	box-sizing: border-box;
	width: 100%;
	height: 72px;
	padding: 8px 14px;
	display: grid;
	align-items: center;
	background:
		linear-gradient(180deg, #203c95 0%, #102873 56%, #071640 100%);
	border-bottom: 0;
	box-shadow:
		inset 2px 0 0 #06133f,
		inset -2px 0 0 #06133f,
		inset 0 2px 0 #06133f;
}

#top_view .top-bar {
	min-width: 0;
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr) 320px;
	gap: 12px;
	align-items: center;
}

#top_view .top-brand {
	min-width: 0;
	display: grid;
	gap: 3px;
}

#top_view .top-brand__eyebrow {
	color: rgba(234, 216, 183, 0.76);
	font-size: 11px;
	letter-spacing: .18em;
	text-transform: uppercase;
}

#top_view .top-brand__title {
	color: var(--host-text);
	font-size: 24px;
	line-height: 1;
	font-weight: 700;
	letter-spacing: .08em;
	white-space: nowrap;
}

#top_view #nav {
	min-width: 0;
	display: grid;
	grid-template-columns: repeat(8, minmax(0, 1fr));
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

#top_view #nav li {
	min-width: 0;
}

#top_view #nav a {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	min-height: 36px;
	padding: 0 8px;
	border: 1px solid #bda970;
	border-radius: 6px;
	background:
		linear-gradient(180deg, #7d5a22 0%, #54360f 52%, #2a1907 100%);
	color: #fff2c4;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	box-shadow:
		inset 0 1px 0 #f0dc96,
		2px 2px 0 #01030a;
}

#top_view #nav a:hover {
	border-color: #f0dc96;
	background: linear-gradient(180deg, #a47b2d 0%, #6f4b18 52%, #3a2409 100%);
	color: #ffffff;
	box-shadow:
		inset 0 1px 0 #fff2c4,
		2px 2px 0 #01030a;
}

#top_view .top-meta {
	min-width: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 10px;
	padding: 7px 9px;
	border: 2px solid var(--host-line);
	border-radius: 6px;
	background: #102873;
	box-shadow:
		inset 0 0 0 2px #06133f,
		2px 2px 0 #01030a;
}

#top_view .top-account {
	min-width: 0;
	display: grid;
	gap: 2px;
}

#top_view .top-account__label {
	color: rgba(234, 216, 183, 0.68);
	font-size: 10px;
	line-height: 1;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

#top_view .top-account__name {
	min-width: 0;
	overflow: hidden;
	color: #eafff0;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#top_view .top-meta[data-state="guest"] .top-account__name {
	color: rgba(235, 218, 186, 0.72);
}

#top_view #a1 {
	min-width: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--host-text-soft);
	font-size: 12px;
	line-height: 1.2;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 180px;
}

#top_view input[type="button"] {
	height: 34px;
	min-width: 120px;
	padding: 0 16px;
	border: 1px solid #bda970;
	border-radius: 6px;
	background: linear-gradient(180deg, #f0dc96 0%, #b48a39 55%, #7a561d 100%);
	color: #211405;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
}

#top_view .top-logout {
	height: 32px;
	min-width: 86px;
	padding: 0 13px;
	border: 1px solid #c78273;
	border-radius: 6px;
	background: linear-gradient(180deg, #8f3e32 0%, #5c251f 100%);
	color: #fff1ea;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
}

#top_view .top-logout:hover {
	border-color: #f3b2a5;
	box-shadow: 2px 2px 0 #01030a;
}

#top_view .top-logout:active {
	filter: brightness(0.92);
}

#top_view .top-logout:disabled {
	display: none;
}

#foot .foot-shell {
	box-sizing: border-box;
	width: 100%;
	height: 128px;
	padding: 8px 12px;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 228px;
	gap: 12px;
	background:
		linear-gradient(180deg, #203c95 0%, #102873 56%, #071640 100%);
	border-top: 0;
	box-shadow:
		inset 0 0 0 2px #06133f,
		inset 0 2px 0 var(--host-line);
}

#foot .foot-primary,
#foot .foot-side {
	min-width: 0;
	height: 100%;
}

#foot .foot-primary {
	display: grid;
	grid-template-columns: 76px minmax(0, 1fr);
	gap: 10px;
	align-items: center;
}

#foot .foot-start {
	display: flex;
	align-items: center;
	justify-content: center;
}

#foot .start {
	width: 72px;
	height: 72px;
	padding: 0;
	border: 1px solid #f0dc96;
	border-radius: 50%;
	background:
		linear-gradient(180deg, #2848a4 0%, #102873 55%, #071640 100%);
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 #01030a;
	color: var(--host-text);
	font-size: 19px;
	font-weight: 700;
	letter-spacing: .08em;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

#foot .start__label {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	text-align: center;
	white-space: nowrap;
}

#foot .start.is-multiline {
	font-size: 18px;
	letter-spacing: .08em;
	line-height: 1.15;
}

#foot .start.is-multiline .start__label {
	flex-direction: column;
	gap: 2px;
	white-space: normal;
}

#foot .start.is-multiline .start__label span {
	display: block;
	width: 100%;
	text-align: center;
}

#foot .start.is-countdown {
	font-size: 14px;
	letter-spacing: .03em;
	line-height: 1.05;
}

#foot .start.is-countdown .start__label {
	gap: 1px;
}

#foot .start.is-compact {
	font-size: 13px;
	letter-spacing: .02em;
	white-space: nowrap;
}

#foot .start:disabled,
#foot .button input[type="button"]:disabled {
	opacity: .64;
	cursor: not-allowed;
}

#foot .foot-primary__content {
	min-width: 0;
	height: 100%;
	display: flex;
	align-items: center;
}

#foot .button {
	width: 100%;
	min-width: 0;
	display: grid;
	grid-template-columns: repeat(9, minmax(0, 1fr));
	gap: 6px;
	align-content: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

#foot .button li {
	min-width: 0;
}

#foot .button a,
#foot .button input[type="button"] {
	--foot-menu-button-border: #6f89d1;
	--foot-menu-button-bg: var(--foot-menu-button-border);
	box-sizing: border-box;
	display: flex;
	width: 100%;
	min-width: 0;
	min-height: 34px;
	padding: 0 6px;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--foot-menu-button-border);
	border-radius: 6px;
	background: var(--foot-menu-button-bg);
	color: #fff2c4;
	font-size: 13px;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	box-shadow:
		inset 0 0 0 1px #223d90,
		2px 2px 0 #01030a;
}

#foot .button a:hover,
#foot .button input[type="button"]:hover {
	--foot-menu-button-border: #8fa8ee;
	color: #ffffff;
	box-shadow:
		inset 0 0 0 1px #f0dc96,
		2px 2px 0 #01030a;
}

#foot .button a[disabled],
#foot .button input[type="button"]:disabled,
#foot .button a.is-preview,
#foot .button input[type="button"].is-preview,
#foot .button a.is-preview:hover,
#foot .button input[type="button"].is-preview:hover {
	opacity: .9;
	cursor: pointer;
	filter: saturate(.86);
	border-style: dashed;
}

#foot .button a[disabled],
#foot .button input[type="button"]:disabled {
	opacity: .64;
	cursor: not-allowed;
	filter: grayscale(.18);
	border-style: solid;
}

#foot .button a.is-preview:hover,
#foot .button input[type="button"].is-preview:hover {
	filter: none;
}

#foot .button a.is-preview,
#foot .button input[type="button"].is-preview {
	box-shadow: none;
	transform: none;
}

#foot .foot-side {
	display: grid;
	grid-template-rows: auto auto;
	gap: 6px;
	align-content: center;
}

#foot .foot-side__default {
	min-width: 0;
}

#foot .foot-side__assign {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 6px;
}

#foot .peo {
	box-sizing: border-box;
	display: block;
	width: 100%;
	height: 30px;
	padding: 0 10px;
	border: 1px solid var(--host-line);
	border-radius: 6px;
	background: #071640;
	color: var(--host-text);
	font-size: 13px;
	outline: none;
}

#foot .peo:focus,
#foot .peo.is-targeted {
	border-color: #f0dc96;
	box-shadow:
		inset 0 0 0 1px #2848a4,
		2px 2px 0 #01030a;
}

#foot .foot-side__actions {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 6px;
}

#foot .foot-side__action {
	--foot-menu-button-border: #6f89d1;
	--foot-menu-button-bg: var(--foot-menu-button-border);
	box-sizing: border-box;
	min-width: 0;
	min-height: 34px;
	padding: 0 6px;
	border: 1px solid var(--foot-menu-button-border);
	border-radius: 6px;
	background: var(--foot-menu-button-bg);
	color: #fff2c4;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	box-shadow:
		inset 0 0 0 1px #223d90,
		2px 2px 0 #01030a;
}

#foot .foot-side__action:hover {
	--foot-menu-button-border: #8fa8ee;
	color: #ffffff;
	box-shadow:
		inset 0 0 0 1px #f0dc96,
		2px 2px 0 #01030a;
}

#foot .foot-side__action:disabled {
	opacity: .64;
	cursor: not-allowed;
	box-shadow: none;
}

#chat_input .chat-form {
	box-sizing: border-box;
	width: 100%;
	height: 40px;
	padding: 4px 10px;
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr) 96px 62px 62px minmax(180px, auto);
	align-items: center;
	gap: 8px;
	background:
		linear-gradient(180deg, #203c95 0%, #102873 56%, #071640 100%);
	border-top: 2px solid var(--host-line);
	color: #ead7b4;
	font: 12px/1.4 Verdana, "Microsoft YaHei", sans-serif;
}

#chat_input .chat-field,
#chat_input .chat-select {
	box-sizing: border-box;
	height: 30px;
	padding: 0 12px;
	border: 1px solid #bda970;
	border-radius: 6px;
	background: #071640;
	color: #fff2c4;
	box-shadow: inset 0 0 0 1px #203c95;
	font: inherit;
}

#chat_input .chat-color {
	padding: 0 8px;
	cursor: pointer;
}

#chat_input .chat-btn {
	box-sizing: border-box;
	height: 30px;
	padding: 0 12px;
	border: 1px solid #bda970;
	border-radius: 6px;
	background: linear-gradient(180deg, #7d5a22 0%, #54360f 52%, #2a1907 100%);
	color: #fff2c4;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

#chat_input .chat-toggle {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	min-height: 24px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	font-size: 11px;
	color: rgba(239, 222, 191, 0.8);
	white-space: nowrap;
}

#wog_view .signin-calendar {
	box-sizing: border-box;
	width: 100%;
	padding: 10px;
	border: 1px solid rgba(173, 132, 84, 0.24);
	border-radius: 8px;
	background: rgba(31, 20, 13, 0.56);
	text-align: left;
}

#wog_view .signin-panel {
	display: grid;
	gap: 10px;
}

#wog_view .signin-rewards,
#wog_view .signin-history {
	min-width: 0;
}

#wog_view .signin-history__title {
	margin: 0 0 6px;
}

#wog_view .signin-reward-list,
#wog_view .signin-history-table {
	width: 100%;
}

#wog_view .signin-calendar__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 8px;
}

#wog_view .signin-calendar__month {
	color: #fff2d7;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.2;
}

#wog_view .signin-calendar__summary {
	margin-top: 2px;
	color: rgba(255, 245, 230, 0.72);
	font-size: 12px;
	line-height: 1.35;
}

#wog_view .signin-calendar__action {
	flex: 0 0 auto;
	text-align: right;
}

#wog_view .signin-action__status {
	display: inline-flex;
	align-items: center;
	min-height: 28px;
	color: rgba(255, 245, 230, 0.78);
	font-size: 12px;
	line-height: 1.2;
	white-space: nowrap;
}

#wog_view .signin-action__status.is-signed {
	color: #b7f7c4;
}

#wog_view .signin-action__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 104px;
	min-height: 32px;
	padding: 0 14px;
	line-height: 1;
	vertical-align: middle;
}

#wog_view .signin-calendar__weekdays,
#wog_view .signin-calendar__grid {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 4px;
}

#wog_view .signin-calendar__weekdays {
	margin-bottom: 4px;
	color: rgba(255, 226, 177, 0.68);
	font-size: 12px;
	font-weight: 700;
	text-align: center;
}

#wog_view .signin-day {
	box-sizing: border-box;
	min-height: 74px;
	padding: 6px;
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 6px;
	background: rgba(255, 255, 255, 0.04);
	color: rgba(255, 245, 230, 0.74);
	text-align: left;
}

#wog_view .signin-day--empty {
	border-color: transparent;
	background: transparent;
}

#wog_view .signin-day.is-signed {
	border-color: rgba(125, 211, 252, 0.38);
	background: rgba(21, 94, 117, 0.28);
	color: #e0f7ff;
}

#wog_view .signin-day.is-today {
	box-shadow: inset 0 0 0 2px rgba(246, 211, 101, 0.52);
}

#wog_view .signin-day__num {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.1;
}

#wog_view .signin-day__state {
	margin-top: 5px;
	font-size: 11px;
	line-height: 1.2;
	opacity: 0.82;
}

#wog_view .signin-day__reward {
	margin-top: 4px;
	color: #f7d774;
	font-size: 11px;
	line-height: 1.2;
	word-break: keep-all;
	white-space: normal;
}

#wog_view .signin-day__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	margin: 5px 0 0;
}

#wog_view .signin-day__form {
	margin: 0;
	padding: 0;
}

#wog_view .signin-day__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 48px;
	min-height: 22px;
	padding: 0 8px;
	font-size: 12px;
	line-height: 1;
	vertical-align: middle;
}

#wog_view .signin-day__button--luck {
	min-width: 62px;
}

#wog_view .magic-shop {
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	max-height: 100%;
	display: grid;
	grid-template-rows: auto minmax(0, 1fr);
	gap: 8px;
	overflow: hidden;
	padding: 4px 0 0;
	color: #ead7b4;
}

#wog_view .magic-shop__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 12px;
	margin-bottom: 0;
}

#wog_view .magic-shop__title {
	color: #fff2d7;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
}

#wog_view .magic-shop__desc {
	margin-top: 3px;
	max-width: 720px;
	color: rgba(255, 245, 230, 0.76);
	font-size: 12px;
	line-height: 1.55;
}

#wog_view .magic-shop__wallet-line {
	flex: 0 0 auto;
	color: #d9b56d;
	font-size: 12px;
	line-height: 1.45;
	text-align: right;
	white-space: nowrap;
}

#wog_view .magic-shop__wallet-line b {
	color: #fff2d7;
	font-size: 15px;
}

#wog_view .magic-shop__scroll {
	box-sizing: border-box;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
}

#wog_view .magic-shop__content {
	box-sizing: border-box;
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr) 286px;
	gap: 10px;
	min-height: 0;
	overflow: hidden;
}

#wog_view .magic-shop__catalog,
#wog_view .magic-shop__detail-list,
#wog_view .magic-shop__status-list {
	display: grid;
	gap: 6px;
	min-height: 0;
	margin: 0;
	padding: 0;
	overflow: auto;
	overscroll-behavior: contain;
}

#wog_view .magic-shop__catalog {
	align-content: start;
	padding-right: 4px;
}

#wog_view .magic-shop__detail-list {
	padding-right: 6px;
}

#wog_view .magic-shop__catalog-item {
	box-sizing: border-box;
	display: grid;
	gap: 3px;
	width: 100%;
	min-height: 54px;
	padding: 7px 8px;
	border: 1px solid rgba(173, 132, 84, 0.16);
	border-radius: 4px;
	background: rgba(0, 0, 0, 0.12);
	color: #ead7b4;
	text-align: left;
	cursor: pointer;
}

#wog_view .magic-shop__catalog-item:hover,
#wog_view .magic-shop__catalog-item.is-active {
	border-color: rgba(225, 178, 99, 0.46);
	background: rgba(107, 70, 36, 0.34);
}

#wog_view .magic-shop__product-name,
#wog_view .magic-shop__product-effect {
	display: grid;
	gap: 2px;
	min-width: 0;
}

#wog_view .magic-shop__product-name b,
#wog_view .magic-shop__detail-head h3,
#wog_view .magic-shop__status-row b {
	margin: 0;
	color: #fff2d7;
}

#wog_view .magic-shop__detail-panel {
	display: none;
	min-height: 100%;
	padding: 3px 0;
}

#wog_view .magic-shop__detail-panel.is-active {
	display: block;
}

#wog_view .magic-shop__detail-head {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid rgba(173, 132, 84, 0.18);
}

#wog_view .magic-shop__detail-head h3 {
	font-size: 16px;
	line-height: 1.25;
}

#wog_view .magic-shop__detail-head p,
#wog_view .magic-shop__detail-head span {
	margin: 0;
	color: rgba(255, 245, 230, 0.68);
	font-size: 12px;
	line-height: 1.45;
}

#wog_view .magic-shop__product-desc {
	margin: 8px 0;
	color: rgba(255, 245, 230, 0.82);
	font-size: 12px;
	line-height: 1.55;
}

#wog_view .magic-shop__product-grant {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	gap: 4px 8px;
	margin: 0 0 8px;
	font-size: 12px;
	line-height: 1.45;
}

#wog_view .magic-shop__product-grant dt,
#wog_view .magic-shop__product-grant dd {
	margin: 0;
}

#wog_view .magic-shop__product-grant dt {
	color: rgba(255, 226, 177, 0.72);
	font-weight: 700;
}

#wog_view .magic-shop__product-grant dd {
	color: rgba(255, 245, 230, 0.82);
}

#wog_view .magic-shop__buy-cell {
	max-width: 420px;
	text-align: left;
}

#wog_view .magic-shop__mode-line + .magic-shop__mode-line {
	margin-top: 6px;
	padding-top: 6px;
	border-top: 1px solid rgba(173, 132, 84, 0.13);
}

#wog_view .magic-shop__mode-title {
	color: #fff2d7;
	line-height: 1.45;
}

#wog_view .magic-shop__mode-title span {
	color: rgba(255, 245, 230, 0.74);
}

#wog_view .magic-shop__mode-command {
	margin-top: 4px;
}

#wog_view .magic-shop__status-rail {
	display: grid;
	grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
	gap: 10px;
	min-height: 0;
	overflow: hidden;
}

#wog_view .magic-shop__status-section {
	display: grid;
	grid-template-rows: auto minmax(0, 1fr);
	gap: 6px;
	min-height: 0;
	overflow: hidden;
}

#wog_view .magic-shop__status-list {
	align-content: start;
	max-height: none;
}

#wog_view .magic-shop__status-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2px;
	align-items: start;
	min-height: 0;
	padding: 5px 0;
	border-bottom: 1px solid rgba(173, 132, 84, 0.14);
	color: rgba(255, 245, 230, 0.78);
	font-size: 12px;
	line-height: 1.4;
}

#wog_view .magic-shop__status-row:first-child {
	border-top: 1px solid rgba(173, 132, 84, 0.14);
}

#wog_view .magic-shop__empty-row {
	margin: 0;
	padding: 7px 0;
	border-top: 1px solid rgba(173, 132, 84, 0.14);
	border-bottom: 1px solid rgba(173, 132, 84, 0.14);
	color: rgba(255, 245, 230, 0.62);
	font-size: 12px;
	line-height: 1.45;
	text-align: center;
}

@media (max-width: 980px) {
	#wog_view .magic-shop__head,
	#wog_view .magic-shop__content {
		grid-template-columns: 1fr;
	}

	#wog_view .magic-shop__head {
		align-items: flex-start;
		flex-direction: column;
	}

	#wog_view .magic-shop__wallet-line {
		text-align: left;
		white-space: normal;
	}

	#wog_view .magic-shop__status-row {
		grid-template-columns: minmax(0, 1fr);
		align-items: start;
	}

	#wog_view .magic-shop__status-rail {
		grid-template-rows: auto auto;
	}

	#wog_view .magic-shop__buy-cell {
		max-width: none;
	}
}

#wog_view .chara-create-shell {
	box-sizing: border-box;
	min-height: 100%;
	padding: 8px;
	color: #f5e6c8;
	text-align: left;
}

#wog_view .chara-create-card {
	box-sizing: border-box;
	width: min(100%, 1180px);
	margin: 0 auto;
	padding: 18px;
	border: 1px solid rgba(207, 164, 101, 0.34);
	border-radius: 20px;
	background:
		radial-gradient(circle at top left, rgba(226, 182, 104, 0.14), transparent 26%),
		linear-gradient(180deg, rgba(50, 31, 18, 0.94), rgba(23, 14, 9, 0.90));
	box-shadow: 0 18px 36px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#wog_view .chara-create-head {
	margin-bottom: 14px;
	text-align: center;
}

#wog_view .chara-create-eyebrow {
	color: #e4bd78;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}

#wog_view .chara-create-title {
	margin-top: 4px;
	color: #fff0cd;
	font-size: 26px;
	font-weight: 700;
	line-height: 1.15;
}

#wog_view .chara-create-head p,
#wog_view .chara-create-note,
#wog_view .chara-field em {
	color: rgba(244, 226, 194, 0.72);
	font-size: 12px;
	font-style: normal;
	line-height: 1.55;
}

#wog_view .chara-create-head p {
	margin: 8px auto 0;
	max-width: 720px;
}

#wog_view .chara-create-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

#wog_view .chara-create-section {
	box-sizing: border-box;
	min-width: 0;
	padding: 14px;
	border: 1px solid rgba(201, 156, 94, 0.22);
	border-radius: 16px;
	background: rgba(255, 245, 225, 0.045);
}

#wog_view .chara-build-row {
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: minmax(240px, 0.9fr) minmax(360px, 1.4fr) minmax(220px, 0.75fr);
	gap: 12px;
	align-items: stretch;
}

#wog_view .chara-create-section--appearance,
#wog_view .chara-create-section--points,
#wog_view .chara-create-section--final {
	padding: 12px;
}

#wog_view .chara-create-section--final {
	display: flex;
	flex-direction: column;
}

#wog_view .chara-create-section--final .chara-field {
	grid-template-columns: minmax(0, 1fr);
}

#wog_view .chara-create-section--final .chara-field em {
	grid-column: 1;
}

#wog_view .chara-create-section h3 {
	margin: 0 0 10px;
	color: #ffe2ad;
	font-size: 15px;
	line-height: 1.25;
}

#wog_view .chara-field {
	display: grid;
	grid-template-columns: 88px minmax(0, 1fr);
	gap: 8px 10px;
	align-items: center;
	margin-top: 9px;
}

#wog_view .chara-field:first-of-type {
	margin-top: 0;
}

#wog_view .chara-field > span,
#wog_view .chara-point-line span {
	color: #ecd1a0;
	font-size: 12px;
	font-weight: 700;
}

#wog_view .chara-field em {
	grid-column: 2;
}

#wog_view .chara-field--avatar {
	align-items: start;
}

#wog_view .chara-field--avatar em {
	grid-column: 2;
}

#wog_view .chara-field input[type='text'],
#wog_view .chara-field input[type='password'],
#wog_view .chara-field select,
#wog_view .chara-point-line select {
	box-sizing: border-box;
	width: 100%;
	min-height: 32px;
	padding: 5px 10px;
	border: 1px solid rgba(186, 141, 83, 0.38);
	border-radius: 999px;
	background: rgba(17, 10, 6, 0.72);
	color: #fff2d7;
	font: inherit;
}

#wog_view .chara-chip-list,
#wog_view .chara-inline-control,
#wog_view .chara-point-actions,
#wog_view .chara-create-submit {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	align-items: center;
}

#wog_view .chara-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 24px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #f8e4bd;
	cursor: pointer;
}

#wog_view .chara-chip input {
	accent-color: #d8a95f;
	margin: 0;
}

#wog_view .chara-chip b {
	font-weight: 700;
}

#wog_view .chara-chip:hover b,
#wog_view .chara-chip:has(input:checked) b {
	color: #fff0b6;
}

#wog_view .chara-avatar-picker {
	display: grid;
	grid-template-columns: repeat(auto-fill, 50px);
	gap: 6px;
	max-height: 122px;
	padding: 2px 4px 2px 0;
	overflow: auto;
}

#wog_view .chara-avatar-option {
	box-sizing: border-box;
	position: relative;
	width: 50px;
	height: 50px;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 9px;
	background: transparent;
	cursor: pointer;
	overflow: hidden;
}

#wog_view .chara-avatar-option.is-selected {
	border-color: rgba(242, 195, 113, 0.92);
	box-shadow: 0 0 0 2px rgba(242, 195, 113, 0.18);
}

#wog_view .chara-avatar-option img {
	display: block;
	width: 50px;
	height: 50px;
	object-fit: cover;
}

#wog_view .chara-avatar-option span {
	position: absolute;
	right: 2px;
	bottom: 1px;
	padding: 0 4px;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.56);
	color: #fff4dc;
	font-size: 10px;
	line-height: 1.4;
}

#wog_view .chara-preview-link,
#wog_view .chara-point-actions button,
#wog_view .chara-create-submit .chara-submit-primary,
#wog_view .chara-create-submit .button04 {
	box-sizing: border-box;
	min-height: 32px;
	padding: 7px 13px;
	border: 1px solid rgba(170, 123, 69, 0.44);
	border-radius: 999px;
	background: rgba(95, 62, 33, 0.72);
	color: #fbe6bd;
	font: inherit;
	font-weight: 700;
	text-decoration: none;
	cursor: pointer;
}

#wog_view .chara-create-submit .chara-submit-primary {
	background: rgba(136, 89, 43, 0.88);
	border-color: rgba(226, 180, 105, 0.58);
	color: #fff2d2;
}

#wog_view .chara-create-submit .chara-submit-secondary {
	background: rgba(46, 37, 31, 0.68);
	border-color: rgba(151, 123, 89, 0.30);
	color: rgba(235, 212, 178, 0.74);
}

#wog_view .chara-point-top {
	display: grid;
	gap: 8px;
	margin-bottom: 10px;
}

#wog_view .chara-point-summary b {
	color: #fff0b6;
}

#wog_view .chara-point-summary.is-complete b {
	color: #8fe3c2;
}

#wog_view .chara-point-meter {
	height: 8px;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.24);
	overflow: hidden;
}

#wog_view .chara-point-meter i {
	display: block;
	width: 0;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, #9d6a32, #e2bd75);
	transition: width 0.16s ease;
}

#wog_view .chara-point-grid {
	display: grid;
	grid-template-columns: repeat(2, max-content);
	gap: 8px 28px;
	justify-content: start;
}

#wog_view .chara-point-line {
	display: grid;
	grid-template-columns: max-content 72px;
	gap: 6px;
	align-items: center;
	padding: 0;
}

#wog_view .chara-point-actions {
	margin-top: 8px;
}

#wog_view .chara-create-note {
	margin: 8px 0 0;
}

#wog_view .chara-create-submit {
	justify-content: center;
	margin-top: 14px;
}

#wog_view .chara-create-submit input,
#wog_view .chara-create-submit button {
	min-width: 130px;
}

@media (max-width: 900px) {
	#wog_view .chara-create-grid,
	#wog_view .chara-build-row,
	#wog_view .chara-point-grid {
		grid-template-columns: minmax(0, 1fr);
	}
	#wog_view .chara-field {
		grid-template-columns: minmax(0, 1fr);
	}
	#wog_view .chara-field em {
		grid-column: 1;
	}
}

#wog_view .legacy-page {
	box-sizing: border-box;
	width: 100%;
	padding: 8px 10px;
	color: #ead7b4;
	text-align: left;
}

#wog_view .legacy-page__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 8px;
}

#wog_view .legacy-page__title {
	margin: 0;
	color: #fff2d7;
	font-size: 18px;
	line-height: 1.25;
}

#wog_view .legacy-page__desc {
	margin: 0 0 8px;
	color: rgba(255, 245, 230, 0.76);
	font-size: 12px;
	line-height: 1.45;
}

#wog_view .legacy-section {
	margin-top: 10px;
}

#wog_view .legacy-section:first-child {
	margin-top: 0;
}

#wog_view .legacy-section__title {
	margin: 0 0 6px;
	color: #f1e7d2;
	font-size: 14px;
	line-height: 1.25;
}

#wog_view .legacy-kv {
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr);
	gap: 1px;
	margin: 0;
	border: 1px solid rgba(173, 132, 84, 0.22);
	border-radius: 6px;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.05);
}

#wog_view .legacy-kv dt,
#wog_view .legacy-kv dd {
	margin: 0;
	padding: 6px 8px;
	min-height: 20px;
	font-size: 12px;
	line-height: 1.45;
}

#wog_view .legacy-kv dt {
	color: rgba(255, 226, 177, 0.72);
	background: rgba(0, 0, 0, 0.16);
	font-weight: 700;
}

#wog_view .legacy-kv dd {
	color: #f3e3c2;
	background: rgba(255, 255, 255, 0.025);
}

#wog_view .legacy-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
	margin-top: 8px;
}

#wog_view .legacy-actions--top {
	justify-content: flex-end;
	margin: 0 0 8px;
}

#wog_view .legacy-page--mission .legacy-actions {
	justify-content: center;
}

#wog_view .pk-arena-overview {
	display: grid;
	gap: 10px;
}

#wog_view .pk-arena-list,
#wog_view .cdkey-section,
#wog_view .lottery-section,
#wog_view .rebirth-section,
#wog_view .auto-fight-page__section,
#wog_view .group-center-section,
#wog_view .group-center-assignment,
#wog_view .syn-detail-panel,
#wog_view .bank-summary {
	box-sizing: border-box;
	min-width: 0;
	margin-top: 10px;
}

#wog_view .pk-arena-list:first-child,
#wog_view .cdkey-section:first-child,
#wog_view .lottery-section:first-child,
#wog_view .rebirth-section:first-child,
#wog_view .auto-fight-page__section:first-child,
#wog_view .group-center-section:first-child,
#wog_view .group-center-assignment:first-child,
#wog_view .syn-detail-panel:first-child,
#wog_view .bank-summary:first-child {
	margin-top: 0;
}

#wog_view .auto-fight-page__section,
#wog_view .group-center-section,
#wog_view .group-center-assignment,
#wog_view .syn-detail-panel {
	display: grid;
	gap: 8px;
}

#wog_view .pk-arena-subpanel {
	padding-top: 2px;
}

#wog_view .pk-arena-subpanel + .pk-arena-subpanel {
	padding-top: 10px;
	border-top: 1px solid rgba(189, 169, 112, 0.42);
}

#wog_view .pk-arena-subpanel__title {
	margin: 0 0 6px;
	color: #f1e7d2;
	font-size: 14px;
	line-height: 1.25;
}

#wog_view .pk-arena-table-wrap {
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

#wog_view .legacy-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	align-items: center;
	margin: 0 0 8px;
}

#wog_view .skill-view__summary,
#wog_view .skill-view__filters {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 8px;
	align-items: center;
	margin: 0 0 8px;
}

#wog_view .skill-summary__link {
	white-space: nowrap;
}

#wog_view .skill-filter__label {
	color: rgba(255, 226, 177, 0.78);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.35;
}

#wog_view .skill-filter__select {
	min-width: 168px;
	height: 28px;
	border: 1px solid rgba(173, 132, 84, 0.38);
	border-radius: 4px;
	background: rgba(20, 18, 15, 0.92);
	color: #f6e2bd;
	font-size: 12px;
}

#wog_view .legacy-choice-text,
#wog_view .legacy-pagination__link,
#wog_view .wog-shop-nav__text {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	border: 0;
	color: #e8d2aa;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 26px;
	margin: 0;
	padding: 2px 4px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
	text-decoration: none;
	vertical-align: middle;
}

#wog_view .legacy-choice-text:hover,
#wog_view .legacy-choice-text:focus,
#wog_view .legacy-pagination__link:hover,
#wog_view .legacy-pagination__link:focus,
#wog_view .wog-shop-nav__text:hover,
#wog_view .wog-shop-nav__text:focus {
	color: #fff2cf;
	outline: none;
	text-decoration: underline;
}

#wog_view .legacy-pagination__link {
	min-width: 22px;
}

#wog_view .legacy-choice-button.is-active,
#wog_view .legacy-pagination__current.is-active,
#wog_view .online-area__nav.is-active,
#wog_view .wog-shop-nav__button.is-active {
	border-color: rgba(247, 215, 151, 0.72);
	background: linear-gradient(135deg, rgba(191, 135, 67, 1), rgba(107, 64, 30, 0.98));
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.24),
		0 0 0 3px rgba(244, 197, 117, 0.18),
		0 10px 22px rgba(0, 0, 0, 0.24);
	color: var(--capsule-text);
	text-decoration: none;
}

#wog_view .online-area__nav {
	margin: 2px 8px 6px 0;
}

#wog_view .legacy-command-list {
	display: grid;
	gap: 6px;
	margin: 0;
}

#wog_view .legacy-command-row {
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr);
	gap: 8px;
	align-items: center;
	padding: 5px 0;
	border-bottom: 1px solid rgba(173, 132, 84, 0.13);
}

#wog_view .legacy-command-row:last-child {
	border-bottom: 0;
}

#wog_view .legacy-command-label {
	color: rgba(255, 226, 177, 0.82);
	font-size: 12px;
	font-weight: 700;
}

#wog_view .legacy-command-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	align-items: center;
}

#wog_view .wog-shop-layout {
	display: grid;
	grid-template-columns: 116px minmax(0, 1fr);
	gap: 12px;
	align-items: start;
}

#wog_view .wog-shop-main {
	min-width: 0;
}

#wog_view .wog-shop-nav,
#wog_view .wog-shop-levels {
	margin-top: 0;
}

#wog_view .wog-shop-nav__stack {
	display: grid;
	gap: 8px;
}

#wog_view .wog-shop-nav__category {
	min-height: 30px;
	display: flex;
	align-items: center;
}

#wog_view .wog-shop-nav__levels {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 12px;
	align-items: center;
	min-height: 30px;
}

#wog_view .wog-shop-nav__text {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	border: 0;
	color: #e8d2aa;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	min-height: 26px;
	margin: 0;
	padding: 2px 4px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
	text-decoration: none;
}

#wog_view .wog-shop-nav__text:hover,
#wog_view .wog-shop-nav__text:focus {
	color: #fff2cf;
	outline: none;
	text-decoration: underline;
}

#wog_view .wog-shop-requirement {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px 7px;
	line-height: 1.45;
}

#wog_view .wog-shop-requirement__part {
	white-space: nowrap;
}

#wog_view .wog-shop-requirement__part.is-unmet {
	color: #ff7b72;
	font-weight: 700;
	text-shadow: 0 0 8px rgba(255, 96, 80, 0.24);
}

@media screen and (max-width: 720px) {
	#wog_view .wog-shop-layout {
		grid-template-columns: 1fr;
	}

	#wog_view .wog-shop-nav__stack {
		display: flex;
		flex-wrap: wrap;
		gap: 6px 12px;
	}

	#wog_view .wog-shop-nav__category {
		min-height: 26px;
	}
}

#wog_view .legacy-callout {
	margin: 6px 0 10px;
	padding: 7px 9px;
	border: 1px solid rgba(173, 132, 84, 0.18);
	border-radius: 6px;
	background: rgba(0, 0, 0, 0.16);
	color: rgba(255, 245, 230, 0.78);
	font-size: 12px;
	line-height: 1.55;
}

#wog_view .legacy-callout--success {
	background: rgba(76, 113, 58, 0.28);
	color: #e7f5da;
}

#wog_view .legacy-table-wrap {
	width: 100%;
	overflow-x: auto;
}

#wog_view .mission-center {
	display: grid;
	grid-template-columns: 168px minmax(0, 1fr);
	gap: 12px;
	align-items: stretch;
	min-height: 560px;
	min-height: min(68vh, 640px);
}

#wog_view .mission-center__side {
	box-sizing: border-box;
	padding: 10px;
	border: 1px solid rgba(173, 132, 84, 0.2);
	border-radius: 6px;
	background: rgba(0, 0, 0, 0.14);
}

#wog_view .mission-center__group + .mission-center__group {
	margin-top: 14px;
}

#wog_view .mission-center__label {
	margin: 0 0 7px;
	color: rgba(255, 245, 230, 0.58);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.35;
}

#wog_view .mission-center__stores,
#wog_view .mission-center__group {
	display: grid;
	gap: 7px;
}

#wog_view .mission-center__nav {
	box-sizing: border-box;
	width: 100%;
	min-height: 30px;
	margin: 0;
	justify-content: flex-start;
	text-align: left;
	white-space: normal;
}

#wog_view .mission-center__nav.is-active {
	border-color: rgba(247, 215, 151, 0.72);
	background: linear-gradient(135deg, rgba(191, 135, 67, 1), rgba(107, 64, 30, 0.98));
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.24),
		0 0 0 3px rgba(244, 197, 117, 0.18),
		0 10px 22px rgba(0, 0, 0, 0.24);
}

#wog_view .mission-center__main {
	min-width: 0;
}

#wog_view .mission-center__content {
	min-height: 100%;
}

#wog_view .mission-center__loading {
	padding: 18px 12px;
	color: rgba(255, 245, 230, 0.68);
	text-align: center;
}

#wog_view .mission-center__placeholder {
	padding: 18px 12px;
	color: rgba(255, 245, 230, 0.58);
	text-align: center;
}

#wog_view .mission-detail-panel {
	box-sizing: border-box;
	padding: 10px 12px;
	border: 1px solid rgba(173, 132, 84, 0.28);
	border-radius: 6px;
	background: rgba(20, 13, 8, 0.46);
	color: #ead7b4;
}

#wog_view .mission-detail-panel--loading {
	color: rgba(255, 245, 230, 0.72);
	text-align: center;
}

#wog_view .mission-detail-panel__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 8px;
}

#wog_view .mission-detail-panel__eyebrow,
#wog_view .mission-detail-panel__meta {
	margin: 0;
	color: rgba(255, 245, 230, 0.66);
	font-size: 12px;
	line-height: 1.45;
}

#wog_view .mission-detail-panel__title {
	margin: 1px 0 2px;
	color: #fff2d7;
	font-size: 16px;
	line-height: 1.3;
}

#wog_view .mission-detail-panel__close,
#wog_view .mission-list__title {
	border: 0;
	background: transparent;
	color: #ffe2b1;
	font: inherit;
	cursor: pointer;
}

#wog_view .mission-detail-panel__close {
	padding: 2px 0;
	white-space: nowrap;
}

#wog_view .mission-list__title {
	padding: 0;
	font-weight: 700;
	text-align: left;
}

#wog_view .mission-list__title:hover,
#wog_view .mission-detail-panel__close:hover {
	color: #fff6e5;
	text-decoration: underline;
}

#wog_view .mission-detail-panel__body {
	color: #f3e3c2;
	font-size: 12px;
	line-height: 1.6;
}

#wog_view .mission-detail-panel__actions {
	justify-content: flex-start;
}

#wog-overlay-host .wog-dialog.mission-detail-dialog,
.wog-modern-modal-root .wog-dialog.mission-detail-dialog {
	max-width: 680px;
}

#wog-overlay-host .mission-detail-panel,
.wog-modern-modal-root .mission-detail-panel {
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	color: var(--ff-menu-text) !important;
}

#wog-overlay-host .mission-detail-panel__body,
.wog-modern-modal-root .mission-detail-panel__body {
	max-height: min(46vh, 390px);
	overflow: auto;
	padding-right: 6px;
}

#wog-overlay-host .mission-detail-panel__actions,
.wog-modern-modal-root .mission-detail-panel__actions {
	justify-content: flex-start;
}

#wog-overlay-host .mission-detail-panel--loading,
.wog-modern-modal-root .mission-detail-panel--loading {
	padding: 16px 4px !important;
	color: var(--ff-menu-text-soft) !important;
	text-align: center;
}

#wog_view .mission-list__subject {
	text-align: left;
}

#wog_view .mission-list__actions {
	min-width: 112px;
	white-space: nowrap;
}

#wog_view .legacy-form-row {
	display: grid;
	grid-template-columns: 90px minmax(0, 1fr);
	gap: 8px;
	align-items: center;
	margin: 6px 0;
}

#wog_view .legacy-form-row label {
	color: rgba(255, 226, 177, 0.74);
	font-size: 12px;
	font-weight: 700;
}

#wog_view .legacy-form-row input[type="text"],
#wog_view .legacy-form-row select {
	box-sizing: border-box;
	width: 100%;
	max-width: 360px;
	height: 28px;
	padding: 0 9px;
	border: 1px solid rgba(173, 132, 84, 0.32);
	border-radius: 6px;
	background: rgba(0, 0, 0, 0.22);
	color: #fff6e5;
	font: inherit;
}

#wog_view .legacy-form-row--inline {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}

#wog_view .legacy-form-row--inline input[type="text"],
#wog_view .legacy-form-row--inline select {
	width: auto;
	min-width: 92px;
}

#wog_view .legacy-data-table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	margin: 0;
	background: rgba(20, 13, 8, 0.34);
	color: #ead7b4;
	font-size: 12px;
	line-height: 1.35;
}

#wog_view .legacy-data-table th,
#wog_view .legacy-data-table td {
	padding: 5px 7px;
	border: 1px solid rgba(173, 132, 84, 0.18);
	text-align: center;
	vertical-align: middle;
}

#wog_view .legacy-data-table th {
	color: #ffe2b1;
	background: rgba(0, 0, 0, 0.2);
	font-weight: 700;
}

#wog_view .legacy-data-table td {
	background: rgba(255, 255, 255, 0.02);
}

#wog_view .legacy-data-table .legacy-equipped-row td,
#wog_view .legacy-data-table .legacy-bound-row td {
	background: rgba(255, 255, 255, 0.09);
}

#wog_view .legacy-data-table .legacy-equipped-row strong {
	color: #ff5f5f;
}

#wog_view .syn-special__recipe {
	min-width: 160px;
	color: rgba(255, 245, 230, 0.78);
	text-align: left;
	line-height: 1.45;
}

#wog_view .legacy-empty {
	color: rgba(255, 245, 230, 0.62);
	text-align: center;
}

#wog_view .legacy-note {
	color: rgba(255, 245, 230, 0.74);
	font-size: 12px;
	line-height: 1.45;
}

#wog_view .legacy-splash-text {
	margin: 8px 0;
	color: #fff2d7;
	font-size: 36px;
	font-weight: 700;
	line-height: 1.15;
	text-align: center;
}

#wog_view .auto-fight-page__money {
	flex: 0 0 auto;
	color: #d9b56d;
	font-size: 12px;
	text-align: right;
	white-space: nowrap;
}

#wog_view .auto-fight-page__summary {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 8px;
}

#wog_view .auto-fight-page__summary .legacy-page__desc {
	min-width: 0;
	margin-bottom: 0;
}

#wog_view .auto-fight-page__money b {
	color: #fff2d7;
	font-size: 15px;
}

#wog_view .auto-fight-page__status-list,
#wog_view .auto-fight-page__product-list,
#wog_view .auto-fight-page__effect-list {
	display: grid;
	gap: 6px;
	margin: 0;
	padding: 0;
}

#wog_view .auto-fight-page__status-list {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

#wog_view .auto-fight-page__status-item {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 3px;
	padding: 6px 0;
	border-top: 1px solid rgba(173, 132, 84, 0.16);
	border-bottom: 1px solid rgba(173, 132, 84, 0.16);
}

#wog_view .auto-fight-page__status-item dt,
#wog_view .auto-fight-page__status-item dd {
	margin: 0;
}

#wog_view .auto-fight-page__status-item dt {
	color: rgba(255, 226, 177, 0.72);
	font-size: 12px;
	font-weight: 700;
}

#wog_view .auto-fight-page__status-item dd {
	color: #fff2d7;
	font-size: 13px;
}

#wog_view .auto-fight-page__product-row {
	box-sizing: border-box;
	display: grid;
	grid-template-columns: minmax(150px, 0.9fr) minmax(200px, 1.2fr) minmax(150px, 0.8fr) minmax(220px, 1.1fr);
	gap: 10px;
	align-items: center;
	min-height: 52px;
	padding: 8px 0;
	border-bottom: 1px solid rgba(173, 132, 84, 0.18);
}

#wog_view .auto-fight-page__product-row:first-child,
#wog_view .auto-fight-page__effect-row:first-child {
	border-top: 1px solid rgba(173, 132, 84, 0.18);
}

#wog_view .auto-fight-page__product-name,
#wog_view .auto-fight-page__effect-name {
	display: grid;
	gap: 2px;
	min-width: 0;
}

#wog_view .auto-fight-page__product-name b,
#wog_view .auto-fight-page__effect-name b {
	color: #fff2d7;
}

#wog_view .auto-fight-page__product-desc {
	margin: 0;
	color: rgba(255, 245, 230, 0.78);
	font-size: 12px;
	line-height: 1.45;
}

#wog_view .auto-fight-page__product-summary,
#wog_view .auto-fight-page__effect-balance {
	color: rgba(255, 245, 230, 0.8);
	font-size: 12px;
	line-height: 1.45;
}

#wog_view .auto-fight-page__buy-cell,
#wog_view .auto-fight-page__effect-action {
	text-align: left;
}

#wog_view .auto-fight-page__effect-row {
	display: grid;
	grid-template-columns: minmax(150px, 0.9fr) minmax(180px, 1fr) minmax(180px, 0.8fr);
	gap: 10px;
	align-items: center;
	min-height: 40px;
	padding: 7px 0;
	border-bottom: 1px solid rgba(173, 132, 84, 0.18);
}

#wog_view .auto-fight-page__empty-row {
	margin: 0;
	padding: 7px 0;
	border-top: 1px solid rgba(173, 132, 84, 0.14);
	border-bottom: 1px solid rgba(173, 132, 84, 0.14);
	color: rgba(255, 245, 230, 0.62);
	font-size: 12px;
	line-height: 1.45;
	text-align: center;
}

#wog_view .auto-fight-page__actions {
	justify-content: center;
}

@media (max-width: 980px) {
	#wog_view .auto-fight-page__status-list,
	#wog_view .auto-fight-page__product-row,
	#wog_view .auto-fight-page__effect-row {
		grid-template-columns: minmax(0, 1fr);
		align-items: start;
	}

	#wog_view .auto-fight-page__money {
		text-align: left;
		white-space: normal;
	}

	#wog_view .auto-fight-page__summary {
		flex-direction: column;
		gap: 4px;
	}
}

#wog_view .race-option-list,
#wog_view .race-result-list {
	display: grid;
	gap: 4px;
	margin: 0;
	padding: 0;
}

#wog_view .race-option-row,
#wog_view .race-result-row {
	display: grid;
	grid-template-columns: 80px 157px minmax(0, 220px) minmax(0, 1fr) 115px;
	gap: 8px;
	align-items: center;
	min-height: 34px;
}

#wog_view .race-result-row {
	grid-template-columns: 32px minmax(0, 1fr) 93px 126px 170px;
	height: 36px;
}

#wog_view .king-section {
	margin: 0;
}

#wog_view .king-row {
	display: grid;
	grid-template-columns: 25% 30% minmax(0, 45%);
	gap: 8px;
	align-items: center;
	padding: 4px 0;
}

#wog_view .king-row__desc {
	text-align: left;
}

#wog_view #Tscene03.king-page {
	display: block;
	box-sizing: border-box;
	width: 100%;
	min-height: 100%;
	margin: 0 auto;
	padding: 20px 18px 22px !important;
	background: linear-gradient(180deg, #214589 0%, #112a66 52%, #071640 100%) !important;
	border: 2px solid var(--ff-menu-line) !important;
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 var(--ff-menu-shadow) !important;
}

#wog_view #Tscene03.king-page IMG {
	margin: 0;
}

#wog_view #Tscene03.king-page TABLE {
	width: 100%;
	margin-left: 0;
}

#wog_view #Tscene03.king-page .king-tabs {
	margin: 0 0 14px;
}

#wog_view #Tscene03.king-page .king-tab-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}

#wog_view #Tscene03.king-page .king-tab-btn {
	min-width: 112px;
	height: 34px;
	padding: 0 14px;
	border: 1px solid var(--ff-button-line);
	border-radius: 4px;
	background: linear-gradient(180deg, var(--ff-button-bg-top) 0%, var(--ff-button-bg-mid) 54%, var(--ff-button-bg-bottom) 100%) !important;
	box-shadow:
		inset 0 0 0 1px #06133f,
		2px 2px 0 var(--ff-button-shadow) !important;
	color: var(--ff-button-text);
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 0;
}

#wog_view #Tscene03.king-page .king-tab-btn.is-current {
	border-color: var(--ff-button-line-hot);
	background: linear-gradient(180deg, #496fc9 0%, #23448e 54%, #0b1e47 100%) !important;
	box-shadow:
		inset 0 0 0 1px #d9ecff,
		0 0 0 1px #2d6ea4,
		2px 2px 0 var(--ff-button-shadow) !important;
	color: #ffffff;
}

#wog_view #Tscene03.king-page .king-tab-panel {
	display: block;
}

#wog_view #Tscene03.king-page .king-section {
	box-sizing: border-box;
	padding: 16px 16px 18px;
	border: 2px solid var(--ff-menu-line) !important;
	border-radius: 6px;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%) !important;
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 var(--ff-menu-shadow) !important;
}

#wog_view #Tscene03.king-page .king-section + .king-section {
	margin-top: 14px;
}

#wog_view #Tscene03.king-page .king-section__header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 12px;
}

#wog_view #Tscene03.king-page .king-tit {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	margin: 0;
	padding: 0 14px 0 16px;
	border: 1px solid #6f89d1;
	border-radius: 6px;
	background: linear-gradient(180deg, #3a5fb5 0%, #1a3779 100%);
	color: var(--ff-menu-gold);
	line-height: 1.2;
	width: auto;
}

#wog_view #Tscene03.king-page .king-section__meta {
	flex: 0 0 auto;
	color: var(--ff-menu-text-soft);
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 0.08em;
	text-align: right;
}

#wog_view #Tscene03.king-page .king-empty {
	box-sizing: border-box;
	padding: 20px 16px;
	border: 2px solid var(--ff-menu-line);
	border-radius: 6px;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%);
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 var(--ff-menu-shadow);
	color: var(--ff-menu-text-soft);
	text-align: center;
}

#wog_view #Tscene03.king-page .king-podium {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr) minmax(0, 1fr);
	gap: 14px;
	align-items: end;
	margin-top: 12px;
}

#wog_view #Tscene03.king-page .king-podium-card {
	position: relative;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	padding: 16px 12px 14px;
	min-height: var(--king-podium-height, 252px);
	border: 2px solid var(--ff-menu-line);
	border-radius: 6px;
	background: linear-gradient(180deg, #294a8f 0%, #17306e 55%, #081632 100%);
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 var(--ff-menu-shadow);
	text-align: center;
}

#wog_view #Tscene03.king-page .king-podium-card--rank1 {
	--king-podium-height: 326px;
	background: linear-gradient(180deg, #3960b8 0%, #1d3c83 54%, #091a3c 100%);
}

#wog_view #Tscene03.king-page .king-podium-card--rank2 {
	--king-podium-height: 286px;
	background: linear-gradient(180deg, #2f529b 0%, #17356f 54%, #081834 100%);
}

#wog_view #Tscene03.king-page .king-podium-card--rank3 {
	--king-podium-height: 250px;
	background: linear-gradient(180deg, #2f4d8f 0%, #132c61 54%, #07162d 100%);
}

#wog_view #Tscene03.king-page .king-podium-card.is-empty {
	border-style: dashed;
	opacity: 0.88;
}

#wog_view #Tscene03.king-page .king-podium-rank {
	position: absolute;
	top: -12px;
	left: 50%;
	transform: translateX(-50%);
	min-width: 82px;
	padding: 4px 12px;
	border: 1px solid var(--ff-menu-line);
	border-radius: 999px;
	background: linear-gradient(180deg, #eff6ff 0%, #d7e4f7 100%);
	box-shadow: 0 2px 0 var(--ff-menu-shadow);
	color: #13203f;
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 0.08em;
}

#wog_view #Tscene03.king-page .king-podium-card--rank1 .king-podium-rank {
	background: linear-gradient(180deg, #f7eaab 0%, #e7ca65 100%);
	color: #342100;
}

#wog_view #Tscene03.king-page .king-podium-card--rank2 .king-podium-rank {
	background: linear-gradient(180deg, #e0ebf8 0%, #b9cae4 100%);
}

#wog_view #Tscene03.king-page .king-podium-card--rank3 .king-podium-rank {
	background: linear-gradient(180deg, #f0d2a1 0%, #d0a56a 100%);
	color: #3f2506;
}

#wog_view #Tscene03.king-page .king-podium-avatar-frame {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 16px auto 10px;
}

#wog_view #Tscene03.king-page .king-podium-avatar-frame--empty {
	height: 148px;
	border: 2px solid #8fa8cc;
	border-radius: 4px;
	background: linear-gradient(180deg, #304d8f 0%, #0e1b3a 100%);
	color: var(--ff-menu-text-soft);
	font-size: 18px;
	font-weight: bold;
	letter-spacing: 0.1em;
}

#wog_view #Tscene03.king-page .king-podium-card--rank1 .king-podium-avatar-frame--empty {
	height: 190px;
	border-color: #e7ca65;
}

#wog_view #Tscene03.king-page .king-podium-card--rank2 .king-podium-avatar-frame--empty {
	height: 158px;
	border-color: #b9cae4;
}

#wog_view #Tscene03.king-page .king-podium-card--rank3 .king-podium-avatar-frame--empty {
	height: 134px;
	border-color: #d0a56a;
}

#wog_view #Tscene03.king-page .king-podium-avatar {
	display: block;
	object-fit: contain;
}

#wog_view #Tscene03.king-page .king-podium-card--rank1 .king-podium-avatar {
	max-width: 156px;
	max-height: 190px;
}

#wog_view #Tscene03.king-page .king-podium-card--rank2 .king-podium-avatar {
	max-width: 128px;
	max-height: 154px;
}

#wog_view #Tscene03.king-page .king-podium-card--rank3 .king-podium-avatar {
	max-width: 112px;
	max-height: 142px;
}

#wog_view #Tscene03.king-page .king-podium-name {
	min-height: 2.4em;
	color: var(--ff-menu-gold);
	font-size: 18px;
	font-weight: bold;
	line-height: 1.2;
}

#wog_view #Tscene03.king-page .king-podium-score {
	min-height: 2.4em;
	color: var(--ff-menu-text);
	font-size: 14px;
	line-height: 1.45;
}

#wog_view #Tscene03.king-page .king-rank-area {
	margin-top: 16px;
}

#wog_view #Tscene03.king-page .king-rank-title {
	margin: 0 0 10px;
	color: var(--ff-menu-gold);
	font-size: 16px;
	font-weight: bold;
	line-height: 1.2;
}

#wog_view #Tscene03.king-page .king-rank-table-wrap {
	box-sizing: border-box;
	overflow: hidden;
	border: 2px solid var(--ff-menu-line);
	border-radius: 6px;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%);
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 var(--ff-menu-shadow);
}

#wog_view #Tscene03.king-page .king-rank-table {
	width: 100%;
	margin: 0;
	border: 0 !important;
	border-collapse: collapse;
	background: transparent !important;
	box-shadow: none !important;
	table-layout: fixed;
}

#wog_view #Tscene03.king-page .king-rank-table thead th {
	padding: 10px 12px;
	border-bottom: 1px solid var(--ff-menu-line-soft);
	background: linear-gradient(180deg, #355eb1 0%, #1b3778 100%);
	color: var(--ff-menu-gold);
	font-size: 13px;
	font-weight: bold;
	line-height: 1.2;
	text-align: left;
}

#wog_view #Tscene03.king-page .king-rank-table tbody td {
	padding: 10px 12px;
	border-bottom: 1px solid #425d9a;
	color: var(--ff-menu-text);
	vertical-align: middle;
}

#wog_view #Tscene03.king-page .king-rank-table tbody tr:last-child td {
	border-bottom: 0;
}

#wog_view #Tscene03.king-page .king-rank-table__rank {
	width: 76px;
	color: var(--ff-menu-gold);
	font-weight: bold;
	text-align: center;
}

#wog_view #Tscene03.king-page .king-rank-table__player {
	width: auto;
}

#wog_view #Tscene03.king-page .king-rank-table__player,
#wog_view #Tscene03.king-page .king-rank-table__avatar {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

#wog_view #Tscene03.king-page .king-rank-avatar {
	width: 42px;
	height: 42px;
	border: 1px solid #8fa8cc;
	border-radius: 4px;
	background: linear-gradient(180deg, #2d4e95 0%, #122753 100%);
	box-shadow: inset 0 0 0 1px #06133f;
	object-fit: contain;
}

#wog_view #Tscene03.king-page .king-rank-table__name {
	display: inline-block;
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
	color: var(--ff-menu-text);
	text-overflow: ellipsis;
	white-space: nowrap;
}

#wog_view #Tscene03.king-page .king-rank-table__score {
	color: var(--ff-menu-text-soft);
	text-align: right;
	font-variant-numeric: tabular-nums;
}

#wog_view #Tscene03.king-page .king-rank-empty {
	padding: 18px 12px;
	color: var(--ff-menu-text-soft);
	text-align: center;
}

#wog_view #Tscene03.king-page .king-pagination {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-top: 12px;
}

#wog_view #Tscene03.king-page .king-page-btn {
	min-width: 46px;
	height: 30px;
	padding: 0 12px;
	border: 1px solid var(--ff-button-line);
	background: linear-gradient(180deg, var(--ff-button-bg-top) 0%, var(--ff-button-bg-mid) 54%, var(--ff-button-bg-bottom) 100%) !important;
	box-shadow:
		inset 0 0 0 1px #06133f,
		2px 2px 0 var(--ff-button-shadow) !important;
	color: var(--ff-button-text);
	font-size: 12px;
	font-weight: bold;
}

#wog_view #Tscene03.king-page .king-page-btn.is-current {
	border-color: var(--ff-button-line-hot);
	box-shadow:
		inset 0 0 0 1px #d9ecff,
		0 0 0 1px #2d6ea4,
		2px 2px 0 var(--ff-button-shadow) !important;
	color: #ffffff;
}

#wog_view #Tscene03.king-page .king-page-btn.is-disabled {
	opacity: 0.55;
}

#wog_view #Tscene03.king-page .king-page-status {
	flex: 0 0 100%;
	color: var(--ff-menu-text-soft);
	font-size: 12px;
	line-height: 1.2;
	text-align: center;
}

#wog_view .legacy-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
	justify-content: center;
	margin: 8px 0;
}

#chat_input .chat-toggle input {
	margin: 0;
	accent-color: #f0dc96;
}

/* FF menu style unification for inner legacy pages. */
#wog_view,
#wog_view > #wogview_body {
	--ff-menu-bg-top: #203c95;
	--ff-menu-bg-mid: #102873;
	--ff-menu-bg-bottom: #071640;
	--ff-menu-bg-dark: #051033;
	--ff-menu-line: #cfc3a0;
	--ff-menu-line-soft: #6f89d1;
	--ff-menu-gold: #f0dc96;
	--ff-menu-text: #fff2c4;
	--ff-menu-text-soft: #d8d2bb;
	--ff-menu-shadow: #01030a;
	--ff-button-bg-top: #263e66;
	--ff-button-bg-mid: #14243d;
	--ff-button-bg-bottom: #07111f;
	--ff-button-line: #8fa8cc;
	--ff-button-line-hot: #d9ecff;
	--ff-button-glow: #4fb7ff;
	--ff-button-text: #eef7ff;
	--ff-button-text-muted: #7f8da3;
	--ff-button-shadow: #010713;
}

#wog_view > #wogview_body:not(.login-page) {
	background:
		linear-gradient(180deg, #10236b 0%, #071946 48%, #050c23 100%);
	color: var(--ff-menu-text);
}

#wog_view > #wogview_body.wog-town-map-page {
	background: none !important;
	overflow: hidden;
	padding: 0;
}

#wog_view > #wogview_body.wog-town-map-page > FORM {
	box-sizing: border-box;
	height: 100%;
	margin: 0;
	padding: 0;
	width: 100%;
}

#wog_view > #wogview_body.wog-town-map-page .legacy-page,
#wog_view > #wogview_body.wog-town-map-page #wog-town-map-root,
#wog_view > #wogview_body.wog-town-map-page .wog-town-map {
	box-sizing: border-box;
	height: 100%;
	margin: 0;
	min-height: 100%;
	padding: 0;
	width: 100%;
}

#wog_view > #wogview_body.wog-town-map-page .wog-town-map {
	position: relative;
	overflow: hidden;
}

#wog_view > #wogview_body.wog-town-map-page .wog-town-map__bg {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

#wog_view > #wogview_body.wog-town-map-page .wog-town-map-marker {
	align-items: center;
	background: rgba(3, 8, 24, 0.74);
	border: 1px solid rgba(255, 242, 196, 0.82);
	border-radius: 6px;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.22),
		0 8px 18px rgba(0, 0, 0, 0.36);
	color: #fff;
	cursor: pointer;
	display: flex;
	gap: 4px;
	line-height: 1.25;
	padding: 4px 8px;
	position: absolute;
	text-shadow: 0 1px 3px #000;
	transform: translate(-50%, -50%);
}

#wog_view > #wogview_body.wog-town-map-page .wog-town-map-marker:hover {
	background: rgba(26, 34, 59, 0.86);
	border-color: rgba(255, 255, 255, 0.9);
}

#wog_view > #wogview_body.wog-town-map-page .wog-town-map-marker__image {
	display: block;
	max-height: 40px;
	max-width: 40px;
}

#wog_view > #wogview_body.wog-town-map-page .wog-town-map-marker__label {
	white-space: nowrap;
}

#wog_view .legacy-page,
#wog_view .capsule-scope,
#wog_view .magic-shop,
#wog_view .chara-create,
#wog_view #fight-go,
#wog_view #house,
#wog_view #race,
#wog_view #fight {
	color: var(--ff-menu-text);
}

#wog_view .legacy-section,
#wog_view .legacy-callout,
#wog_view .legacy-kv,
#wog_view .mission-center__side,
#wog_view .mission-detail-panel,
#wog_view .signin-calendar,
#wog_view .magic-shop__catalog-item,
#wog_view .chara-create-section,
#wog_view .auto-fight-page__status-item,
#wog_view .legacy-data-table,
#wog_view .capsule-table,
#wog_view .capsule-pagebar,
#wog_view .capsule-search,
#wog_view .capsule-card,
#wog_view .capsule-card-grid,
#wog_view .capsule-scope table {
	border: 2px solid var(--ff-menu-line) !important;
	border-radius: 6px !important;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%) !important;
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 var(--ff-menu-shadow) !important;
	color: var(--ff-menu-text);
}

#wog_view .legacy-section,
#wog_view .legacy-callout,
#wog_view .mission-center__side,
#wog_view .mission-detail-panel,
#wog_view .signin-calendar,
#wog_view .chara-create-section,
#wog_view .auto-fight-page__status-item,
#wog_view .capsule-card,
#wog_view .capsule-card-grid {
	box-sizing: border-box;
	padding: 14px 16px !important;
}

#wog_view .wog-shop-page {
	box-sizing: border-box;
	padding: 8px 10px 12px;
}

#wog_view .wog-shop-nav {
	box-sizing: border-box;
	padding: 14px 16px !important;
	border: 2px solid var(--ff-menu-line) !important;
	border-radius: 6px !important;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%) !important;
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 var(--ff-menu-shadow) !important;
}

#wog_view .legacy-table-wrap {
	box-sizing: border-box;
	padding: 10px !important;
	border: 2px solid var(--ff-menu-line) !important;
	border-radius: 6px !important;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%) !important;
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 var(--ff-menu-shadow) !important;
}

#wog_view .legacy-table-wrap .legacy-data-table {
	box-shadow: none !important;
}

#wog_view .feature-preview-page {
	box-sizing: border-box;
	display: grid;
	gap: 12px;
	width: min(720px, calc(100% - 28px));
	margin: 24px auto;
	padding: 16px 18px;
	border: 2px solid var(--ff-menu-line);
	border-radius: 6px;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%);
	box-shadow: inset 0 0 0 2px #06133f, 3px 3px 0 var(--ff-menu-shadow);
	color: var(--ff-menu-text);
}

#wog_view .feature-preview-page__head {
	display: flex;
	gap: 12px;
	align-items: center;
	justify-content: space-between;
}

#wog_view .feature-preview-page__head h2 {
	margin: 0;
	color: var(--ff-menu-gold);
	font-size: 18px;
	line-height: 1.2;
}

#wog_view .feature-preview-page__badge {
	flex: 0 0 auto;
	padding: 3px 10px;
	border: 1px solid var(--ff-menu-line-soft);
	border-radius: 999px;
	color: var(--ff-menu-text-soft);
	font-size: 12px;
	line-height: 1.2;
}

#wog_view .feature-preview-page__body {
	margin: 0;
}

#wog_view .pk-arena-list,
#wog_view .cdkey-section,
#wog_view .lottery-section,
#wog_view .rebirth-section,
#wog_view .auto-fight-page__section,
#wog_view .group-center-section,
#wog_view .group-center-assignment,
#wog_view .syn-detail-panel,
#wog_view .bank-summary {
	box-sizing: border-box;
	min-width: 0;
	margin-top: 10px;
}

#wog_view .pk-arena-list:first-child,
#wog_view .cdkey-section:first-child,
#wog_view .lottery-section:first-child,
#wog_view .rebirth-section:first-child,
#wog_view .auto-fight-page__section:first-child,
#wog_view .group-center-section:first-child,
#wog_view .group-center-assignment:first-child,
#wog_view .syn-detail-panel:first-child,
#wog_view .bank-summary:first-child {
	margin-top: 0;
}

#wog_view .auto-fight-page__section,
#wog_view .group-center-section,
#wog_view .group-center-assignment,
#wog_view .syn-detail-panel {
	display: grid;
	gap: 8px;
}

#wog_view .item-set-catalog {
	display: grid;
	gap: 10px;
}

#wog_view .item-set-catalog__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	align-items: stretch;
}

#wog_view .item-set-card {
	display: grid;
	gap: 10px;
	align-content: start;
	min-width: 0;
	padding: 14px 16px;
	border: 2px solid var(--ff-menu-line);
	border-radius: 6px;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%);
	box-shadow: inset 0 0 0 2px #06133f, 3px 3px 0 var(--ff-menu-shadow);
	color: var(--ff-menu-text);
}

#wog_view .item-set-card--disabled {
	filter: saturate(.72);
	opacity: .82;
}

#wog_view .item-set-card__head,
#wog_view .item-set-card__progress,
#wog_view .item-set-first-reward {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	min-width: 0;
}

#wog_view .item-set-card__head STRONG {
	flex: 1 1 auto;
	min-width: 0;
	color: var(--ff-menu-gold);
	font-size: 15px;
	line-height: 1.25;
	word-break: break-word;
}

#wog_view .item-set-card__head SPAN,
#wog_view .item-set-card__progress SPAN {
	color: var(--ff-menu-text-soft);
	font-size: 12px;
	white-space: nowrap;
}

#wog_view .item-set-card__copy {
	flex: 0 0 auto;
	padding: 4px 8px;
	border: 1px solid var(--ff-button-line);
	border-radius: 4px;
	background: linear-gradient(180deg, var(--ff-button-bg-top) 0%, var(--ff-button-bg-mid) 52%, var(--ff-button-bg-bottom) 100%);
	box-shadow: inset 0 1px 0 rgba(244, 250, 255, .62), 2px 2px 0 var(--ff-button-shadow);
	color: var(--ff-button-text);
	font-size: 12px;
	line-height: 1.25;
	cursor: pointer;
	white-space: nowrap;
}

#wog_view .item-set-card__copy:hover {
	border-color: var(--ff-button-line-hot);
	color: #ffffff;
}

#wog_view .item-set-card__copy:disabled {
	opacity: .68;
	cursor: wait;
}

#wog_view .item-set-card__desc {
	margin: 0;
	color: var(--ff-menu-text-soft);
	font-size: 12px;
	line-height: 1.55;
}

#wog_view .item-set-card__members {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 6px;
}

#wog_view .item-set-member {
	display: block;
	min-width: 0;
	max-width: 100%;
	padding: 6px 8px;
	border: 1px solid var(--ff-menu-line-soft);
	background: #071640;
}

#wog_view .item-set-member__line {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
	min-width: 0;
}

#wog_view .item-set-member__main {
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

#wog_view .item-set-member EM,
#wog_view .item-set-effect EM,
#wog_view .item-set-first-reward EM {
	color: var(--ff-menu-gold);
	font-style: normal;
	font-size: 11px;
	white-space: nowrap;
}

#wog_view .item-set-member__main B {
	overflow: hidden;
	color: var(--ff-menu-text);
	font-size: 12px;
	line-height: 1.25;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#wog_view .item-set-member__count {
	color: var(--ff-menu-text-soft);
	font-size: 11px;
	font-weight: 700;
	white-space: nowrap;
}

#wog_view .item-set-member.has-count {
	border-color: #9de2bf;
	background: linear-gradient(90deg, rgba(157,226,191,.2), rgba(7,22,64,.96));
}

#wog_view .item-set-member.has-count .item-set-member__count {
	color: #9de2bf;
}

#wog_view .item-set-member.is-equipped {
	border-color: var(--ff-menu-gold);
}

#wog_view .item-set-member.is-equipped.has-count {
	background: linear-gradient(90deg, rgba(229,188,89,.22), rgba(7,22,64,.96));
}

#wog_view .item-set-member.is-equipped.has-count .item-set-member__count {
	color: var(--ff-menu-gold);
}

#wog_view .item-set-member.is-missing {
	opacity: .72;
}

#wog_view .item-set-card__effects {
	display: grid;
	gap: 6px;
}

#wog_view .item-set-effect {
	display: grid;
	grid-template-columns: 42px minmax(0, 1fr);
	gap: 8px;
	align-items: start;
	padding: 6px 8px;
	border-left: 2px solid var(--ff-menu-line-soft);
	background: #071640;
	color: var(--ff-menu-text-soft);
	font-size: 12px;
	line-height: 1.5;
}

#wog_view .item-set-effect.is-active {
	border-left-color: #9de2bf;
	color: #9de2bf;
}

#wog_view .item-set-effect.is-active EM,
#wog_view .item-set-effect.is-active SPAN {
	color: #9de2bf;
}

#wog_view .item-set-first-reward {
	align-items: flex-start;
	padding-top: 8px;
	border-top: 1px solid rgba(207, 195, 160, .36);
	font-size: 12px;
	line-height: 1.5;
}

#wog_view .item-set-first-reward SPAN {
	min-width: 0;
	color: var(--ff-menu-text);
}

#wog_view .item-set-first-reward STRONG {
	color: var(--ff-menu-text-soft);
	font-size: 12px;
	font-weight: 400;
	text-align: right;
}

@media screen and (max-width: 720px) {
	#wog_view .item-set-catalog__grid {
		grid-template-columns: 1fr;
	}
}

#wog_view .legacy-data-table th,
#wog_view .capsule-scope th,
#wog_view .capsule-table tr:first-child > td,
#wog_view .capsule-table tr:first-child > th,
#wog_view .capsule-pagebar tr:first-child > td,
#wog_view .capsule-search tr:first-child > td {
	background: #071640 !important;
	color: var(--ff-menu-gold) !important;
	border-color: var(--ff-menu-line-soft) !important;
}

#wog_view .legacy-data-table td,
#wog_view .capsule-scope td {
	background: #102873 !important;
	border-color: var(--ff-menu-line-soft) !important;
	color: var(--ff-menu-text);
}

#wog_view .legacy-kv dt,
#wog_view .legacy-kv dd,
#wog_view .capsule-scope table table,
#wog_view .capsule-table .b1,
#wog_view .capsule-scope .b1 {
	background: #071640 !important;
	color: var(--ff-menu-text);
}

#wog_view .legacy-page__title,
#wog_view .legacy-section__title,
#wog_view .pk-arena-subpanel__title,
#wog_view .mission-detail-panel__title,
#wog_view .magic-shop__title,
#wog_view .magic-shop__product-name b,
#wog_view .magic-shop__detail-head h3,
#wog_view .magic-shop__status-row b,
#wog_view .chara-create-title,
#wog_view .chara-create-section h3,
#wog_view .auto-fight-page__money b,
#wog_view .auto-fight-page__product-name b,
#wog_view .auto-fight-page__effect-name b {
	color: var(--ff-menu-gold) !important;
}

#wog_view .legacy-page__desc,
#wog_view .legacy-note,
#wog_view .legacy-empty,
#wog_view .legacy-callout,
#wog_view .mission-detail-panel__body,
#wog_view .magic-shop__desc,
#wog_view .magic-shop__product-desc,
#wog_view .magic-shop__product-grant dd,
#wog_view .magic-shop__product-effect,
#wog_view .chara-create-note,
#wog_view .chara-create-head p,
#wog_view .chara-field em,
#wog_view .auto-fight-page__product-desc,
#wog_view .auto-fight-page__product-summary,
#wog_view .auto-fight-page__effect-balance {
	color: var(--ff-menu-text-soft) !important;
}

#wog_view .button01,
#wog_view .button02,
#wog_view .button03,
#wog_view .button05,
#wog_view .button07,
#wog_view .button08,
#wog_view .button09,
#wog_view .button011,
#wog_view .pagego,
#wog_view .legacy-choice-button,
#wog_view .legacy-pagination__current,
#wog_view .online-area__nav,
#wog_view .wog-shop-nav__button,
#wog_view .mission-center__nav,
#wog_view .capsule-link,
#wog_view .chara-preview-link,
#wog_view .chara-point-actions button,
#wog_view .chara-create-submit .chara-submit-primary,
#wog_view .chara-create-submit .button04,
#wog_view .signin-action__button,
#wog_view .signin-day__button,
#wog_view .wog-purchase-shortcut,
#wog_view .wog-bag-expand-item button,
#wog_view .wog-bag__qty-buttons button {
	border: 1px solid var(--ff-button-line) !important;
	border-radius: 6px !important;
	background: linear-gradient(180deg, var(--ff-button-bg-top) 0%, var(--ff-button-bg-mid) 52%, var(--ff-button-bg-bottom) 100%) !important;
	box-shadow:
		inset 0 1px 0 rgba(244, 250, 255, 0.72),
		inset 0 -1px 0 rgba(45, 118, 176, 0.36),
		2px 2px 0 var(--ff-button-shadow) !important;
	color: var(--ff-button-text) !important;
	text-decoration: none !important;
	text-shadow: 0 1px 0 var(--ff-button-shadow) !important;
}

#wog_view .button01:hover,
#wog_view .button02:hover,
#wog_view .button03:hover,
#wog_view .button05:hover,
#wog_view .button07:hover,
#wog_view .button08:hover,
#wog_view .button09:hover,
#wog_view .button011:hover,
#wog_view .pagego:hover,
#wog_view .legacy-choice-button:hover,
#wog_view .legacy-pagination__current:hover,
#wog_view .online-area__nav:hover,
#wog_view .wog-shop-nav__button:hover,
#wog_view .mission-center__nav:hover,
#wog_view .capsule-link:hover,
#wog_view .chara-preview-link:hover,
#wog_view .chara-point-actions button:hover,
#wog_view .chara-create-submit .chara-submit-primary:hover,
#wog_view .chara-create-submit .button04:hover,
#wog_view .signin-action__button:hover,
#wog_view .signin-day__button:hover,
#wog_view .wog-purchase-shortcut:hover,
#wog_view .wog-bag-expand-item button:hover,
#wog_view .wog-bag__qty-buttons button:hover,
#wog_view .legacy-choice-button.is-active,
#wog_view .legacy-pagination__current.is-active,
#wog_view .online-area__nav.is-active,
#wog_view .wog-shop-nav__button.is-active,
#wog_view .mission-center__nav.is-active {
	border-color: var(--ff-button-line-hot) !important;
	background: linear-gradient(180deg, #365f92 0%, #1d3558 52%, #0b172a 100%) !important;
	color: #ffffff !important;
	box-shadow:
		inset 0 1px 0 #f6fbff,
		inset 0 0 0 1px rgba(79, 183, 255, 0.45),
		0 0 10px rgba(79, 183, 255, 0.28),
		2px 2px 0 var(--ff-button-shadow) !important;
}

#wog_view .button01:disabled,
#wog_view .button02:disabled,
#wog_view .button03:disabled,
#wog_view .button05:disabled,
#wog_view .button07:disabled,
#wog_view .button08:disabled,
#wog_view .button09:disabled,
#wog_view .button011:disabled,
#wog_view .pagego:disabled,
#wog_view .legacy-choice-button:disabled,
#wog_view .legacy-pagination__current:disabled,
#wog_view .online-area__nav:disabled,
#wog_view .wog-shop-nav__button:disabled,
#wog_view .mission-center__nav:disabled,
#wog_view .capsule-link:disabled,
#wog_view .chara-preview-link:disabled,
#wog_view .chara-point-actions button:disabled,
#wog_view .chara-create-submit .chara-submit-primary:disabled,
#wog_view .chara-create-submit .button04:disabled,
#wog_view .signin-action__button:disabled,
#wog_view .signin-day__button:disabled,
#wog_view .wog-purchase-shortcut:disabled,
#wog_view .wog-bag-expand-item button:disabled,
#wog_view .wog-bag__qty-buttons button:disabled,
#wog_view .button01[disabled],
#wog_view .button02[disabled],
#wog_view .button03[disabled],
#wog_view .button05[disabled],
#wog_view .button07[disabled],
#wog_view .button08[disabled],
#wog_view .button09[disabled],
#wog_view .button011[disabled],
#wog_view .pagego[disabled],
#wog_view .legacy-choice-button[disabled],
#wog_view .legacy-pagination__current[disabled],
#wog_view .online-area__nav[disabled],
#wog_view .wog-shop-nav__button[disabled],
#wog_view .mission-center__nav[disabled],
#wog_view .capsule-link[disabled],
#wog_view .chara-preview-link[disabled],
#wog_view .chara-point-actions button[disabled],
#wog_view .chara-create-submit .chara-submit-primary[disabled],
#wog_view .chara-create-submit .button04[disabled],
#wog_view .signin-action__button[disabled],
#wog_view .signin-day__button[disabled],
#wog_view .wog-purchase-shortcut[disabled],
#wog_view .wog-bag-expand-item button[disabled],
#wog_view .wog-bag__qty-buttons button[disabled] {
	border-color: rgba(118, 138, 166, 0.6) !important;
	background: linear-gradient(180deg, #1c2636 0%, #101724 100%) !important;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.08),
		2px 2px 0 var(--ff-button-shadow) !important;
	color: var(--ff-button-text-muted) !important;
	cursor: not-allowed !important;
}

#wog_view input[type='text'],
#wog_view input[type='password'],
#wog_view input[type='email'],
#wog_view input[type='number'],
#wog_view select,
#wog_view textarea,
#wog_view .skill-filter__select,
#wog_view .legacy-form-row input[type='text'],
#wog_view .legacy-form-row select,
#wog_view .wog-purchase-qty-input,
#wog_view .capsule-scope input[type='text'],
#wog_view .capsule-scope input[type='password'],
#wog_view .capsule-scope input[type='email'],
#wog_view .capsule-scope input[type='number'],
#wog_view .capsule-scope select,
#wog_view .capsule-scope textarea {
	border: 1px solid #bda970 !important;
	border-radius: 6px !important;
	background: #071640 !important;
	box-shadow: inset 0 0 0 1px #203c95 !important;
	color: var(--ff-menu-text) !important;
}

#wog_view input[type='text']:focus,
#wog_view input[type='password']:focus,
#wog_view input[type='email']:focus,
#wog_view input[type='number']:focus,
#wog_view select:focus,
#wog_view textarea:focus {
	border-color: var(--ff-menu-gold) !important;
	outline: none;
	box-shadow:
		inset 0 0 0 1px #203c95,
		2px 2px 0 var(--ff-menu-shadow) !important;
}

#wog_view .legacy-choice-text,
#wog_view .legacy-pagination__link,
#wog_view .wog-shop-nav__text,
#wog_view .mission-list__title,
#wog_view .mission-detail-panel__close {
	color: var(--ff-menu-gold) !important;
}

#wog_view .wog-choice-row:hover td,
#wog_view .wog-choice-row:hover th,
#wog_view .wog-choice-row.is-selected td,
#wog_view .wog-choice-row.is-selected th,
#wog_view .legacy-data-table .legacy-equipped-row td,
#wog_view .legacy-data-table .legacy-bound-row td,
#wog_view .signin-day.is-signed,
#wog_view .magic-shop__catalog-item:hover,
#wog_view .magic-shop__catalog-item.is-active {
	background: #1b378f !important;
}

#wog_view a {
	color: var(--ff-menu-gold);
}

#wog_view a:hover {
	color: #ffffff;
}

#wog_view hr,
#wog_view .capsule-scope hr {
	width: 46%;
	max-width: 440px;
	height: 2px;
	margin: 10px auto;
	border: 0;
	background: linear-gradient(90deg, rgba(240, 220, 150, 0) 0%, var(--ff-menu-gold) 18%, var(--ff-menu-gold) 82%, rgba(240, 220, 150, 0) 100%) !important;
	box-shadow: 0 1px 0 var(--ff-menu-shadow);
}

#wog_view .chara-create-card,
#wog_view .fight-go-layout__surface,
#wog_view .magic-shop__detail-panel.is-active,
#wog_view .magic-shop__status-section,
#wog_view .auto-fight-page__product-list,
#wog_view .auto-fight-page__effect-list,
#wog_view .wog-bag__panel,
#wog_view .wog-bag-expand-item {
	border: 2px solid var(--ff-menu-line) !important;
	border-radius: 6px !important;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%) !important;
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 var(--ff-menu-shadow) !important;
	color: var(--ff-menu-text) !important;
}

#wog_view .magic-shop__detail-panel.is-active,
#wog_view .magic-shop__status-section,
#wog_view .auto-fight-page__product-list,
#wog_view .auto-fight-page__effect-list {
	padding: 8px !important;
}

#wog_view .fight-go-layout__aside {
	border-left-color: var(--ff-menu-line-soft) !important;
}

#wog_view .fight-go-layout__actions,
#wog_view .magic-shop__detail-head,
#wog_view .magic-shop__mode-line + .magic-shop__mode-line,
#wog_view .magic-shop__status-row,
#wog_view .magic-shop__empty-row,
#wog_view .auto-fight-page__product-row,
#wog_view .auto-fight-page__effect-row,
#wog_view .auto-fight-page__empty-row {
	border-color: var(--ff-menu-line-soft) !important;
}

#wog_view .fight-go-layout__module-title,
#wog_view .fight-go-layout__route-label,
#wog_view .fight-go-layout__toggle-chip,
#wog_view .fight-go-layout__pet-auto-body b,
#wog_view .auto-fight-inline__toggle,
#wog_view .magic-shop__mode-title,
#wog_view .magic-shop__wallet-line b,
#wog_view .chara-create-eyebrow,
#wog_view .chara-field > span,
#wog_view .chara-point-line span,
#wog_view .chara-point-summary b,
#wog_view .signin-calendar__month,
#wog_view .signin-day__reward,
#wog_view .wog-bag__title h2,
#wog_view .wog-bag__detail h3,
#wog_view .wog-bag__detail-row strong,
#wog_view .wog-bag-expand-name {
	color: var(--ff-menu-gold) !important;
}

#wog_view .fight-go-layout__inline-meta,
#wog_view .fight-go-layout__pet-auto,
#wog_view .auto-fight-inline__summary,
#wog_view .auto-fight-inline__profile,
#wog_view .auto-fight-inline__policy-choice,
#wog_view .magic-shop__detail-head p,
#wog_view .magic-shop__detail-head span,
#wog_view .magic-shop__mode-title span,
#wog_view .magic-shop__status-row,
#wog_view .magic-shop__empty-row,
#wog_view .signin-calendar__summary,
#wog_view .signin-calendar__weekdays,
#wog_view .signin-day,
#wog_view .wog-bag__title p,
#wog_view .wog-bag__detail-sub,
#wog_view .wog-bag__detail-empty,
#wog_view .wog-bag__detail-row,
#wog_view .wog-bag__category-stat,
#wog_view .wog-bag-expand-meta {
	color: var(--ff-menu-text-soft) !important;
}

#wog_view .fight-go-layout input[type='radio'],
#wog_view .fight-go-layout input[type='checkbox'],
#wog_view .auto-fight-inline input[type='checkbox'],
#wog_view .chara-chip input {
	accent-color: var(--ff-menu-gold) !important;
}

#wog_view .signin-day,
#wog_view .wog-bag__slot,
#wog_view .wog-bag__usage-tag,
#wog_view .chara-avatar-option,
#wog_view .chara-point-meter {
	border: 1px solid var(--ff-menu-line-soft) !important;
	border-radius: 6px !important;
	background: #071640 !important;
	color: var(--ff-menu-text) !important;
}

#wog_view .signin-day--empty {
	border-color: transparent !important;
	background: transparent !important;
	box-shadow: none !important;
}

#wog_view .signin-day.is-today {
	border-color: var(--ff-menu-gold) !important;
	box-shadow: inset 0 0 0 2px var(--ff-menu-gold) !important;
}

#wog_view .wog-bag__slot:hover,
#wog_view .wog-bag__slot.is-active,
#wog_view .wog-bag__slot.is-expand:hover,
#wog_view .chara-avatar-option.is-selected {
	border-color: var(--ff-menu-gold) !important;
	background: #1b378f !important;
	box-shadow: inset 0 0 0 1px var(--ff-menu-gold) !important;
}

#wog_view .wog-bag__slot.is-empty {
	border-style: dashed !important;
	color: #6f89d1 !important;
}

#wog_view .wog-bag__slot.is-expand {
	border-color: #6f89d1 !important;
	background: #102873 !important;
	color: var(--ff-menu-text) !important;
}

#wog_view .wog-bag__usage-tag.is-primary {
	border-color: var(--ff-menu-gold) !important;
	background: #102873 !important;
	color: var(--ff-menu-gold) !important;
}

#wog_view .wog-bag-expand-item input {
	border: 1px solid #bda970 !important;
	border-radius: 6px !important;
	background: #071640 !important;
	color: var(--ff-menu-text) !important;
}

#wog_view .chara-avatar-option span {
	border-radius: 4px !important;
	background: #071640 !important;
	color: var(--ff-menu-gold) !important;
}

#wog_view .chara-point-meter i {
	background: linear-gradient(90deg, #b48a39 0%, var(--ff-menu-gold) 100%) !important;
}

#wog_view [bgcolor] {
	background: #102873 !important;
}

/* Character pages: status and creation use the FF menu palette. */
#wog_view #Tscene05.role-scene {
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%) !important;
	border: 2px solid var(--ff-menu-line) !important;
	border-radius: 6px !important;
	box-shadow:
		inset 0 0 0 2px #06133f,
		4px 4px 0 var(--ff-menu-shadow) !important;
	color: var(--ff-menu-text) !important;
	padding: 14px 18px 16px !important;
	position: relative;
	text-shadow: 1px 1px 0 var(--ff-menu-shadow);
}

#wog_view #Tscene05.role-scene .role-scene__copy {
	position: absolute;
	right: 18px;
	bottom: 16px;
	z-index: 55;
	padding: 5px 10px;
	border: 1px solid var(--ff-button-line);
	border-radius: 4px;
	background: linear-gradient(180deg, var(--ff-button-bg-top) 0%, var(--ff-button-bg-mid) 52%, var(--ff-button-bg-bottom) 100%);
	box-shadow: inset 0 1px 0 rgba(244, 250, 255, .62), 2px 2px 0 var(--ff-button-shadow);
	color: var(--ff-button-text);
	font-size: 12px;
	line-height: 1.25;
	cursor: pointer;
	white-space: nowrap;
}

#wog_view #Tscene05.role-scene .role-scene__copy:hover {
	border-color: var(--ff-button-line-hot);
	color: #ffffff;
}

#wog_view #Tscene05.role-scene .role-scene__copy:disabled {
	opacity: .68;
	cursor: wait;
}

#wog_view #Tscene05.role-scene:before,
#wog_view #Tscene05.role-scene:after {
	content: none !important;
}

#wog_view #Tscene05.role-scene .role-column,
#wog_view #Tscene05.role-scene .role-portrait {
	box-sizing: border-box;
	min-width: 0;
	padding: 12px;
	border: 1px solid var(--ff-menu-line-soft);
	border-radius: 6px;
	background: #071640;
	box-shadow:
		inset 0 0 0 1px #203c95,
		2px 2px 0 var(--ff-menu-shadow);
}

#wog_view #Tscene05.role-scene .role-portrait__frame {
	min-height: 320px;
	padding: 8px;
	border: 1px solid var(--ff-menu-line-soft);
	border-radius: 6px;
	background:
		linear-gradient(180deg, rgba(32, 60, 149, 0.58) 0%, rgba(7, 22, 64, 0.92) 100%);
	box-shadow: inset 0 0 0 1px #203c95;
}

#wog_view #Tscene05.role-scene .role-record__name,
#wog_view #Tscene05.role-scene .role-info__item DT,
#wog_view #Tscene05.role-scene .role-equip__item DT,
#wog_view #Tscene05.role-scene .role-stat DT,
#wog_view #Tscene05.role-scene .role-progress__head SPAN,
#wog_view #Tscene05.role-scene .role-setlist__title,
#wog_view #Tscene05.role-scene .role-setlist__link,
#wog_view #Tscene05.role-scene .role-effects__title,
#wog_view #Tscene05.role-scene .role-set__head STRONG,
#wog_view #Tscene05.role-scene .role-set__head SPAN,
#wog_view #Tscene05.role-scene .role-set__effect EM,
#wog_view #Tscene05.role-scene .role-effect__name {
	color: var(--ff-menu-gold) !important;
}

#wog_view #Tscene05.role-scene .role-record__line,
#wog_view #Tscene05.role-scene .role-note,
#wog_view #Tscene05.role-scene .role-set__desc,
#wog_view #Tscene05.role-scene .role-effect__detail,
#wog_view #Tscene05.role-scene .role-equip__tooltip-note,
#wog_view #Tscene05.role-scene .role-equip__tooltip-row--muted {
	color: var(--ff-menu-text-soft) !important;
}

#wog_view #Tscene05.role-scene .role-info__item DD,
#wog_view #Tscene05.role-scene .role-equip__item DD,
#wog_view #Tscene05.role-scene .role-stat DD,
#wog_view #Tscene05.role-scene .role-progress__head STRONG,
#wog_view #Tscene05.role-scene .role-set__effect {
	color: var(--ff-menu-text) !important;
}

#wog_view #Tscene05.role-scene .role-stat,
#wog_view #Tscene05.role-scene .role-info__item,
#wog_view #Tscene05.role-scene .role-equip__item,
#wog_view #Tscene05.role-scene .role-progress__row,
#wog_view #Tscene05.role-scene .role-setlist__title,
#wog_view #Tscene05.role-scene .role-effects__title {
	border-color: var(--ff-menu-line-soft) !important;
}

#wog_view #Tscene05.role-scene .role-progress__bar,
#wog_view #Tscene05.role-scene .role-metric__bar {
	height: 7px;
	border: 1px solid var(--ff-menu-line-soft);
	border-radius: 4px;
	background: #051033;
	box-shadow: inset 0 0 0 1px #01030a;
}

#wog_view #Tscene05.role-scene .role-progress__bar SPAN,
#wog_view #Tscene05.role-scene .role-metric__bar SPAN {
	background: linear-gradient(90deg, #b48a39 0%, var(--ff-menu-gold) 100%) !important;
}

#wog_view #Tscene05.role-scene .role-progress__row--hp .role-progress__bar SPAN {
	background: linear-gradient(90deg, #267a5b 0%, #8fe3c2 100%) !important;
}

#wog_view #Tscene05.role-scene .role-progress__row--exp .role-progress__bar SPAN {
	background: linear-gradient(90deg, #b48a39 0%, var(--ff-menu-gold) 100%) !important;
}

#wog_view #Tscene05.role-scene .role-home,
#wog_view #Tscene05.role-scene .role-equip__name {
	border-color: var(--ff-menu-gold) !important;
	color: var(--ff-menu-gold) !important;
}

#wog_view #Tscene05.role-scene .role-home:hover {
	color: #ffffff !important;
}

#wog_view #Tscene05.role-scene .role-home--empty {
	color: #6f89d1 !important;
}

#wog_view #Tscene05.role-scene .role-equip__tooltip {
	border: 2px solid var(--ff-menu-line);
	border-radius: 6px;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%);
	box-shadow:
		inset 0 0 0 2px #06133f,
		3px 3px 0 var(--ff-menu-shadow);
	color: var(--ff-menu-text);
}

#wog_view #Tscene05.role-scene .role-equip__tooltip-title,
#wog_view #Tscene05.role-scene .role-equip__tooltip-row EM {
	color: var(--ff-menu-gold);
}

#wog_view #Tscene05.role-scene .role-equip__tooltip-row--bonus {
	color: #8fe3c2;
}

#wog_view #Tscene05.role-scene .role-effect,
#wog_view #Tscene05.role-scene .role-set {
	border: 1px solid var(--ff-menu-line-soft);
	border-radius: 6px;
	background: #102873;
	box-shadow: inset 0 0 0 1px #203c95;
}

#wog_view #Tscene05.role-scene .role-effect__tag {
	border: 1px solid var(--ff-menu-gold);
	border-radius: 4px;
	background: #071640;
	color: var(--ff-menu-gold);
}

#wog_view #Tscene05.role-scene .role-effect__tag--runtime {
	border-color: #8fe3c2;
	background: #071640;
	color: #8fe3c2;
}

#wog_view .chara-create-shell {
	color: var(--ff-menu-text) !important;
}

#wog_view .chara-create-card {
	border: 2px solid var(--ff-menu-line) !important;
	border-radius: 6px !important;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%) !important;
	box-shadow:
		inset 0 0 0 2px #06133f,
		4px 4px 0 var(--ff-menu-shadow) !important;
	color: var(--ff-menu-text) !important;
}

#wog_view .chara-create-section {
	border: 1px solid var(--ff-menu-line-soft) !important;
	border-radius: 6px !important;
	background: #071640 !important;
	box-shadow:
		inset 0 0 0 1px #203c95,
		2px 2px 0 var(--ff-menu-shadow) !important;
}

#wog_view .chara-create-eyebrow,
#wog_view .chara-create-title,
#wog_view .chara-create-section h3,
#wog_view .chara-field > span,
#wog_view .chara-point-line SPAN,
#wog_view .chara-point-summary B {
	color: var(--ff-menu-gold) !important;
	text-shadow: 1px 1px 0 var(--ff-menu-shadow);
}

#wog_view .chara-create-head P,
#wog_view .chara-create-note,
#wog_view .chara-field EM {
	color: var(--ff-menu-text-soft) !important;
}

#wog_view .chara-chip {
	color: var(--ff-menu-text) !important;
}

#wog_view .chara-chip:hover B,
#wog_view .chara-chip:has(INPUT:checked) B {
	color: #ffffff !important;
}

#wog_view .chara-create-submit .chara-submit-secondary {
	background: linear-gradient(180deg, #182b49 0%, #0d1a2e 100%) !important;
	color: var(--ff-menu-text-soft) !important;
}

/* Pet race and serverwide tournament use the FF menu palette. */
#wog_view #pet-race.pet-race-page,
#wog_view #server-tournament.tournament-page {
	box-sizing: border-box;
	width: 100%;
	min-height: 100%;
	padding: 14px 14px 18px;
	color: var(--ff-menu-text);
	background:
		radial-gradient(circle at 12% 12%, rgba(240, 220, 150, 0.12), rgba(240, 220, 150, 0) 26%),
		linear-gradient(180deg, #15336f 0%, #0b1d56 48%, #07143b 100%);
}

#wog_view #pet-race.pet-race-page {
	display: grid;
	grid-template-rows: minmax(0, 1fr);
	height: 100%;
	max-height: 100%;
	min-height: 0;
	padding: 8px 10px;
	overflow: hidden;
}

#wog_view > #wogview_body > #pet-race.pet-race-page {
	display: grid;
	grid-template-rows: minmax(0, 1fr);
	height: 100%;
	max-height: 100%;
	min-height: 0;
	padding: 8px 10px;
	overflow: hidden;
}

#wog_view:has(#pet-race.pet-race-page),
#wog_view > #wogview_body:has(> #pet-race.pet-race-page) {
	overflow: hidden;
}

#wog_view #pet-race .pet-race-hero,
#wog_view #server-tournament .tournament-hero,
#wog_view #pet-race .pet-race-summary,
#wog_view #server-tournament .tournament-summary,
#wog_view #pet-race .pet-race-events,
#wog_view #server-tournament .tournament-panel,
#wog_view #pet-race .pet-race-lane,
#wog_view #pet-race .pet-race-pet-card,
#wog_view #server-tournament .tournament-match,
#wog_view #server-tournament .tournament-round,
#wog_view #server-tournament .tournament-legacy,
#wog_view #server-tournament .tournament-entry-table-wrap {
	border: 2px solid var(--ff-menu-line);
	border-radius: 6px;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%);
	box-shadow: inset 0 0 0 2px #06133f, 3px 3px 0 var(--ff-menu-shadow);
}

#wog_view #pet-race .pet-race-hero,
#wog_view #server-tournament .tournament-hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin: 0 0 12px;
	padding: 14px 16px;
}

#wog_view #pet-race .pet-race-hero__tools,
#wog_view #server-tournament .tournament-hero__tools {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
}

#wog_view #pet-race .feature-guide-button,
#wog_view #pet-race .pet-race-action-button,
#wog_view #server-tournament .feature-guide-button {
	min-width: 84px;
	height: 30px;
	padding: 0 10px;
	font-size: 12px;
}

#wog_view #pet-race .pet-race-hero h1,
#wog_view #server-tournament .tournament-hero h1,
#wog_view #pet-race .pet-race-panel h2,
#wog_view #server-tournament .tournament-panel h2,
#wog_view #server-tournament .tournament-round__title,
#wog_view #server-tournament .tournament-legacy__head h3 {
	margin: 0;
	color: var(--ff-menu-gold);
	line-height: 1.2;
}

#wog_view #pet-race .pet-race-hero p,
#wog_view #server-tournament .tournament-hero p,
#wog_view #server-tournament .tournament-callout,
#wog_view #server-tournament .tournament-round__meta,
#wog_view #server-tournament .tournament-legacy__head span {
	margin: 0;
	color: var(--ff-menu-text-soft);
	font-size: 12px;
	line-height: 1.6;
}

#wog_view #pet-race .pet-race-status,
#wog_view #server-tournament .tournament-hero__badge,
#wog_view #server-tournament .tournament-round__badge,
#wog_view #server-tournament .tournament-match__status {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 26px;
	padding: 0 10px;
	border: 1px solid var(--ff-menu-line-soft);
	background: linear-gradient(180deg, #3a5fb5 0%, #1a3779 100%);
	color: var(--ff-menu-gold);
	font-size: 11px;
	font-weight: 700;
}

#wog_view #pet-race .pet-race-status {
	flex-direction: column;
	align-items: flex-end;
	gap: 4px;
	min-width: 128px;
	min-height: 58px;
	text-align: right;
}

#wog_view #server-tournament .tournament-hero__badge {
	flex-direction: row;
	gap: 6px;
	min-width: 0;
	min-height: 24px;
	padding: 0 8px;
	text-align: left;
	white-space: nowrap;
}

#wog_view #pet-race .pet-race-status span,
#wog_view #server-tournament .tournament-hero__badge span {
	color: var(--ff-menu-text);
	font-weight: 400;
}

#wog_view #pet-race .pet-race-summary,
#wog_view #server-tournament .tournament-summary {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 8px;
	margin: 0 0 12px;
	padding: 12px;
}

#wog_view #pet-race .pet-race-summary > div,
#wog_view #server-tournament .tournament-summary > div {
	min-width: 0;
	padding: 8px 10px;
	border: 1px solid var(--ff-menu-line-soft);
	background: linear-gradient(180deg, rgba(7, 22, 64, 0.72) 0%, rgba(16, 40, 115, 0.86) 100%);
	box-shadow: inset 0 0 0 1px rgba(6, 19, 63, 0.8);
}

#wog_view #pet-race .pet-race-summary b,
#wog_view #server-tournament .tournament-summary b,
#wog_view #pet-race .pet-race-pet-card__name,
#wog_view #server-tournament .tournament-legacy__meta b {
	display: block;
	margin-bottom: 4px;
	color: var(--ff-menu-gold);
	font-size: 12px;
	line-height: 1.3;
}

#wog_view #pet-race .pet-race-summary span,
#wog_view #server-tournament .tournament-summary span,
#wog_view #pet-race .pet-race-pet-card__meta,
#wog_view #server-tournament .tournament-legacy__meta span {
	color: var(--ff-menu-text);
	font-size: 12px;
	line-height: 1.5;
}

#wog_view #pet-race .pet-race-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 330px);
	gap: 10px;
	align-items: start;
	height: 100%;
	min-height: 0;
}

#wog_view #server-tournament .tournament-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
	gap: 12px;
	align-items: start;
}

#wog_view #server-tournament .tournament-panel--main,
#wog_view #server-tournament .tournament-panel--side {
	min-width: 0;
}

#wog_view #server-tournament .tournament-side-stack {
	display: grid;
	gap: 12px;
	align-content: start;
	min-width: 0;
}

#wog_view #pet-race .pet-race-panel,
#wog_view #server-tournament .tournament-panel,
#wog_view #server-tournament .tournament-round,
#wog_view #server-tournament .tournament-legacy {
	padding: 14px;
}

#wog_view #pet-race .pet-race-track-panel {
	min-height: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

#wog_view #pet-race .pet-race-sidebar {
	display: grid;
	grid-template-rows: auto auto minmax(0, 1fr);
	gap: 6px;
	align-self: stretch;
	min-height: 0;
	max-height: 100%;
	overflow: hidden;
}

#wog_view #pet-race .pet-race-sidebar .pet-race-hero {
	display: grid;
	gap: 6px;
	margin: 0;
	padding: 8px;
}

#wog_view #pet-race .pet-race-hero__head {
	display: grid;
	gap: 3px;
	min-width: 0;
}

#wog_view #pet-race .pet-race-title-row {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}

#wog_view #pet-race .pet-race-sidebar .pet-race-hero h1 {
	font-size: 20px;
}

#wog_view #pet-race .pet-race-sidebar .pet-race-hero__tools {
	flex-wrap: wrap;
	justify-content: flex-start;
}

#wog_view #pet-race .pet-race-status-tag {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 20px;
	padding: 0 8px;
	border: 1px solid var(--ff-menu-line-soft);
	background: linear-gradient(180deg, #3a5fb5 0%, #1a3779 100%);
	color: var(--ff-menu-gold);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
}

#wog_view #pet-race .pet-race-sidebar .pet-race-status {
	align-items: flex-start;
	min-width: 104px;
	min-height: 44px;
	text-align: left;
}

#wog_view #pet-race .pet-race-sidebar .pet-race-summary {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin: 0;
	padding: 6px;
	gap: 6px;
}

#wog_view #pet-race .pet-race-sidebar .pet-race-summary > div {
	padding: 5px 6px;
}

#wog_view #pet-race .pet-race-sidebar .pet-race-summary b {
	margin-bottom: 2px;
	font-size: 11px;
}

#wog_view #pet-race .pet-race-sidebar .pet-race-summary span {
	font-size: 11px;
	line-height: 1.25;
}

#wog_view #pet-race .pet-race-track-panel h2,
#wog_view #pet-race .pet-race-events h2 {
	margin: 0 0 6px;
	font-size: 13px;
}

#wog_view #pet-race #pet-race-track-list {
	display: grid;
	gap: 3px;
}

#wog_view #server-tournament .tournament-panel__head,
#wog_view #server-tournament .tournament-round__head,
#wog_view #server-tournament .tournament-match__head,
#wog_view #server-tournament .tournament-legacy__head,
#wog_view #pet-race .pet-race-lane__label,
#wog_view #pet-race .pet-race-lane__stats,
#wog_view #server-tournament .tournament-match__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

#wog_view #pet-race .pet-race-events,
#wog_view #pet-race .pet-race-pet-list,
#wog_view #server-tournament .tournament-my-entry,
#wog_view #server-tournament .tournament-callout {
	display: grid;
	gap: 8px;
}

#wog_view #pet-race .pet-race-events {
	box-sizing: border-box;
	grid-template-rows: auto minmax(0, 1fr);
	height: 100%;
	max-height: 400px;
	min-height: 0;
	padding: 8px;
	overflow: hidden;
}

#wog_view #pet-race #pet-race-event-list {
	display: grid;
	gap: 5px;
	max-height: 348px;
	min-height: 0;
	overflow: auto;
}

#wog_view #pet-race .pet-race-pet-card {
	padding: 10px 12px;
	cursor: pointer;
}

#wog_view #pet-race .pet-race-pet-card input {
	margin-right: 6px;
	accent-color: var(--ff-menu-gold);
}

#wog_view #pet-race .pet-race-bet,
#wog_view #server-tournament .tournament-panel__actions {
	display: grid;
	grid-template-columns: 1fr auto auto;
	gap: 8px;
	align-items: center;
}

#wog_view #pet-race .pet-race-bet input[type="text"] {
	min-height: 32px;
	border: 1px solid var(--ff-menu-line-soft);
	background: linear-gradient(180deg, #071640 0%, #102873 100%);
	color: var(--ff-menu-text);
	box-shadow: inset 0 0 0 1px #06133f;
}

#wog_view #pet-race .pet-race-track {
	position: relative;
	min-height: 32px;
	padding: 0 18px;
	background: linear-gradient(180deg, rgba(7, 22, 64, 0.72) 0%, rgba(16, 40, 115, 0.9) 100%);
	overflow: hidden;
}

#wog_view #pet-race .pet-race-track__finish {
	position: absolute;
	top: 0;
	right: 24px;
	width: 5px;
	height: 100%;
	background: repeating-linear-gradient(180deg, #f0dc96 0 8px, #102873 8px 16px);
}

#wog_view #pet-race .pet-race-runner {
	position: absolute;
	left: clamp(16px, var(--pet-race-progress, 0%), calc(100% - 16px));
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	width: 26px;
	height: 26px;
}

#wog_view #pet-race .pet-race-runner__avatar,
#wog_view #server-tournament .tournament-legacy__avatar {
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border: 1px solid var(--ff-menu-line);
	border-radius: 50%;
	background: linear-gradient(180deg, #3a5fb5 0%, #1a3779 100%);
	box-shadow: inset 0 0 0 2px #06133f, 0 2px 0 var(--ff-menu-shadow);
	color: var(--ff-menu-gold);
	font-size: 10px;
	font-weight: 700;
	overflow: hidden;
}

#wog_view #pet-race .pet-race-runner__avatar img,
#wog_view #pet-race .pet-race-runner__avatar picture,
#wog_view #pet-race .pet-race-runner__sprite {
	display: block;
	width: 100%;
	height: 100%;
}

#wog_view #pet-race .pet-race-runner__avatar img {
	object-fit: cover;
}

#wog_view #pet-race .pet-race-runner__sprite {
	display: grid;
	place-items: center;
}

#wog_view #server-tournament .tournament-legacy__avatar {
	width: 44px;
	height: 44px;
	font-size: 18px;
}

#wog_view #pet-race .pet-race-runner__name,
#wog_view #pet-race .pet-race-runner__owner,
#wog_view #server-tournament .tournament-match__player b {
	max-width: 74px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 10px;
	line-height: 1;
	text-align: center;
}

#wog_view #pet-race .pet-race-runner__owner {
	display: none;
}

#wog_view #server-tournament .tournament-match__player b {
	max-width: 96px;
	font-size: 11px;
	line-height: normal;
}

#wog_view #pet-race .pet-race-runner__owner,
#wog_view #pet-race .pet-race-lane__label,
#wog_view #pet-race .pet-race-lane__stats,
#wog_view #server-tournament .tournament-match__meta {
	color: var(--ff-menu-text-soft);
	font-size: 11px;
}

#wog_view #pet-race .pet-race-lane {
	display: grid;
	grid-template-columns: minmax(82px, 112px) minmax(0, 1fr) minmax(64px, 82px);
	gap: 6px;
	align-items: center;
	padding: 3px 6px;
	margin-bottom: 0;
}

#wog_view #pet-race .pet-race-lane__label,
#wog_view #pet-race .pet-race-lane__stats {
	flex-direction: column;
	justify-content: center;
	gap: 2px;
	min-width: 0;
	line-height: 1.2;
}

#wog_view #pet-race .pet-race-lane__label {
	align-items: flex-start;
}

#wog_view #pet-race .pet-race-lane__stats {
	align-items: flex-end;
	text-align: right;
}

#wog_view #pet-race .pet-race-lane__label span,
#wog_view #pet-race .pet-race-lane__stats span {
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#wog_view #pet-race .pet-race-lane.is-finished,
#wog_view #server-tournament .tournament-match.is-completed {
	border-color: #8fd18d;
}

#wog_view #pet-race .pet-race-lane.is-winner,
#wog_view #server-tournament .tournament-match.is-bye {
	border-color: #f0dc96;
}

#wog_view #pet-race .pet-race-empty,
#wog_view #server-tournament .tournament-empty {
	padding: 10px 12px;
	border: 1px dashed var(--ff-menu-line-soft);
	background: rgba(7, 22, 64, 0.62);
	color: var(--ff-menu-text-soft);
	font-size: 12px;
}

#wog_view #pet-race .pet-race-event {
	display: flex;
	gap: 8px;
	padding: 5px 7px;
	border: 1px solid rgba(111, 137, 209, 0.34);
	background: rgba(7, 22, 64, 0.54);
	color: var(--ff-menu-text);
	font-size: 11px;
	line-height: 1.3;
}

#wog_view #pet-race .pet-race-event span {
	color: var(--ff-menu-gold);
	min-width: 42px;
}

#wog_view #pet-race .pet-race-float {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translate(-50%, -120%);
	z-index: 4;
	padding: 4px 8px;
	border: 1px solid var(--ff-menu-line);
	border-radius: 4px;
	background: rgba(7, 22, 64, 0.94);
	color: var(--ff-menu-text);
	font-size: 11px;
	white-space: nowrap;
	pointer-events: none;
	animation: wogPetRaceFloat 1.1s ease-out forwards;
}

#wog_view #pet-race .pet-race-float--attack,
#wog_view #pet-race .pet-race-float--hit_stun {
	border-color: #f0dc96;
	color: #f0dc96;
}

#wog_view #pet-race .pet-race-float--dodge {
	border-color: #8fd18d;
	color: #8fd18d;
}

#wog_view #pet-race .pet-race-float--backlash_stun,
#wog_view #pet-race .pet-race-float--stunned_wait {
	border-color: #d97a6b;
	color: #f2c66d;
}

#wog-overlay-host .pet-race-modal-form,
#wog-overlay-host .pet-race-modal-field,
#wog-overlay-host .pet-race-pet-list {
	display: grid;
	gap: 10px;
}

#wog-overlay-host .wog-dialog.pet-race-join-dialog {
	max-width: 620px;
}

#wog-overlay-host .pet-race-modal-form {
	min-width: min(520px, calc(100vw - 88px));
}

#wog-overlay-host .pet-race-modal-label,
#wog-overlay-host .pet-race-modal-range {
	color: var(--ff-menu-text-soft);
	font-size: 12px;
	line-height: 1.5;
	text-shadow: 1px 1px 0 var(--ff-menu-shadow);
}

#wog-overlay-host .pet-race-pet-list {
	max-height: min(42vh, 300px);
	overflow: auto;
	padding-right: 4px;
}

#wog-overlay-host .pet-race-pet-card {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 4px 8px;
	align-items: center;
	padding: 10px 12px;
	border: 2px solid var(--ff-menu-line);
	border-radius: 6px;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%);
	box-shadow: inset 0 0 0 2px #06133f, 2px 2px 0 var(--ff-menu-shadow);
	cursor: pointer;
}

#wog-overlay-host .pet-race-pet-card input {
	grid-row: span 2;
	margin: 0;
	accent-color: var(--ff-menu-gold);
}

#wog-overlay-host .pet-race-pet-card__name {
	color: var(--ff-menu-gold);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
}

#wog-overlay-host .pet-race-pet-card__meta {
	color: var(--ff-menu-text);
	font-size: 12px;
	line-height: 1.45;
}

#wog-overlay-host .pet-race-bet {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	gap: 8px;
	align-items: center;
	margin-top: 2px;
}

#wog-overlay-host .pet-race-bet input[type="text"] {
	box-sizing: border-box;
	width: 100%;
	min-height: 32px;
	border: 1px solid var(--ff-menu-line-soft);
	background: linear-gradient(180deg, #071640 0%, #102873 100%);
	color: var(--ff-menu-text);
	box-shadow: inset 0 0 0 1px #06133f;
}

#wog-overlay-host .pet-race-bet .button03 {
	min-height: 32px;
	white-space: nowrap;
}

#wog_view #server-tournament .tournament-rounds {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(260px, 1fr);
	gap: 12px;
	overflow-x: auto;
	padding-bottom: 4px;
}

#wog_view #server-tournament .tournament-round {
	display: grid;
	gap: 10px;
	min-width: 260px;
}

#wog_view #server-tournament .tournament-match {
	display: grid;
	gap: 8px;
	padding: 10px 12px;
}

#wog_view #server-tournament .tournament-match__players {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 54px minmax(0, 1fr);
	gap: 8px;
	align-items: center;
}

#wog_view #server-tournament .tournament-match__player {
	display: grid;
	grid-template-columns: 18px minmax(0, 1fr);
	align-items: center;
	gap: 6px;
	padding: 8px 10px;
	border: 1px solid rgba(111, 137, 209, 0.38);
	background: rgba(7, 22, 64, 0.62);
	color: var(--ff-menu-text);
}

#wog_view #server-tournament .tournament-match__player.is-winner {
	border-color: #f0dc96;
	color: #f0dc96;
}

#wog_view #server-tournament .tournament-match__side {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border: 1px solid var(--ff-menu-line);
	background: linear-gradient(180deg, #3a5fb5 0%, #1a3779 100%);
	color: var(--ff-menu-gold);
	font-size: 10px;
	font-weight: 700;
}

#wog_view #server-tournament .tournament-match__vs {
	display: grid;
	place-items: center;
	color: var(--ff-menu-gold);
	font-size: 11px;
	font-weight: 700;
}

#wog_view #server-tournament .tournament-entry-table-wrap {
	max-height: 420px;
	overflow: auto;
	padding: 0;
}

#wog_view #server-tournament .tournament-entry-table {
	width: 100%;
	border-collapse: collapse;
}

#wog_view #server-tournament .tournament-entry-table th,
#wog_view #server-tournament .tournament-entry-table td {
	padding: 6px 8px;
	border-bottom: 1px solid rgba(111, 137, 209, 0.24);
	color: var(--ff-menu-text);
	font-size: 11px;
	text-align: left;
}

#wog_view #server-tournament .tournament-entry-table th {
	position: sticky;
	top: 0;
	background: #071640;
	color: var(--ff-menu-gold);
	z-index: 1;
}

#wog_view #server-tournament .tournament-entry-table__seed,
#wog_view #server-tournament .tournament-entry-table__player {
	color: var(--ff-menu-gold);
	font-weight: 700;
}

#wog_view #server-tournament .tournament-legacy {
	margin-top: 12px;
}

#wog_view #server-tournament .tournament-legacy__body {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 10px;
	align-items: center;
}

@keyframes wogPetRaceFloat {
	0% { opacity: 0; transform: translate(-50%, -10%) scale(.92); }
	12% { opacity: 1; }
	100% { opacity: 0; transform: translate(-50%, -160%) scale(1); }
}

@media (max-width: 1200px) {
	#wog_view #pet-race .pet-race-layout,
	#wog_view #server-tournament .tournament-layout {
		grid-template-columns: 1fr;
		height: auto;
	}
	#wog_view #pet-race.pet-race-page {
		height: auto;
		min-height: 100%;
		overflow: visible;
	}
	#wog_view > #wogview_body > #pet-race.pet-race-page {
		height: auto;
		min-height: 100%;
		overflow: visible;
	}
	#wog_view #pet-race .pet-race-summary,
	#wog_view #server-tournament .tournament-summary {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 820px) {
	#wog_view #pet-race .pet-race-summary,
	#wog_view #server-tournament .tournament-summary {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	#wog_view #pet-race .pet-race-hero,
	#wog_view #server-tournament .tournament-hero {
		flex-direction: column;
		align-items: flex-start;
	}
	#wog_view #pet-race .pet-race-hero__tools,
	#wog_view #server-tournament .tournament-hero__tools {
		width: 100%;
		justify-content: space-between;
	}
	#wog_view #pet-race .pet-race-bet,
	#wog-overlay-host .pet-race-bet,
	#wog_view #server-tournament .tournament-panel__actions,
	#wog_view #server-tournament .tournament-match__players {
		grid-template-columns: 1fr;
	}
}

/* Player guide pages opened from feature help buttons. */
#wog_view #feature-guide.feature-guide-page {
	box-sizing: border-box;
	width: 100%;
	min-height: 100%;
	padding: 14px 14px 18px;
	color: var(--ff-menu-text);
	background:
		radial-gradient(circle at 12% 12%, rgba(240, 220, 150, 0.12), rgba(240, 220, 150, 0) 26%),
		linear-gradient(180deg, #15336f 0%, #0b1d56 48%, #07143b 100%);
}

#wog_view #feature-guide .feature-guide-hero,
#wog_view #feature-guide .feature-guide-card {
	border: 2px solid var(--ff-menu-line);
	border-radius: 6px;
	background: linear-gradient(180deg, var(--ff-menu-bg-top) 0%, var(--ff-menu-bg-mid) 54%, var(--ff-menu-bg-bottom) 100%);
	box-shadow: inset 0 0 0 2px #06133f, 3px 3px 0 var(--ff-menu-shadow);
}

#wog_view #feature-guide .feature-guide-hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin: 0 0 12px;
	padding: 14px 16px;
}

#wog_view #feature-guide .feature-guide-hero h1,
#wog_view #feature-guide .feature-guide-card h2 {
	margin: 0;
	color: var(--ff-menu-gold);
	line-height: 1.2;
}

#wog_view #feature-guide .feature-guide-hero p {
	margin: 0;
	color: var(--ff-menu-text-soft);
	font-size: 12px;
	line-height: 1.6;
}

#wog_view #feature-guide .feature-guide-content {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
}

#wog_view #feature-guide .feature-guide-card {
	padding: 14px 16px;
}

#wog_view #feature-guide .feature-guide-card ul {
	display: grid;
	gap: 8px;
	margin: 10px 0 0;
	padding-left: 18px;
	color: var(--ff-menu-text);
	font-size: 13px;
	line-height: 1.7;
}

#wog_view #feature-guide .feature-guide-card li::marker {
	color: var(--ff-menu-gold);
}

@media (max-width: 1000px) {
	#wog_view #feature-guide .feature-guide-content {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 700px) {
	#wog_view #feature-guide .feature-guide-hero {
		flex-direction: column;
		align-items: flex-start;
	}
}