/* KrunkNative: the v10 main menu shell (client/src/ui/v10_menu.c, v10_login.c). Only what the
 * native engine needs to draw v10's own rules (css/svelte.css, css/main.css) as Chrome does. */

/* The login modal's "Forgot Password?" / "(use email instead)" (.auth-toggle-btn) and "Switch to
 * email login" (.suggestion-link): v10 `all: unset`, which the engine does not implement, so the
 * UA button box stayed: a plain underlined link. */
.auth-toggle-btn.svelte-16z1lxi,
.suggestion-link.svelte-16z1lxi {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	box-shadow: none;
	font-family: inherit;
}

.suggestion-link.svelte-16z1lxi {
	font-size: inherit;
}

/* Player List (windows[22], hud_ui.c), measured against v10's DOM in headless Chromium (the reference
   ingame-playerlist.html.gz): Chromium ignores a table's padding when its borders collapse, so v10's
   rows start at the table's edge (pListTable's 10 px padding is cleared here), and each row is 34.7 px
   tall: the 3 px collapsed tr border-bottom (main.css `th, tr`) is part of the row. This engine adds
   no collapsed border to a row's height, so the cells carry the difference as bottom padding: the
   local row (its own row in v10: 28.7 px) keeps 11.7 px, the others 12.9 px (they are 34.7 px apart). */
.pListTable {
	padding: 0;
}
.pListTable td {
	padding-bottom: 11.7px;
}
.pListTable tr + tr td {
	padding-bottom: 12.9px;
}

/* KrunkNative: v10's text emoji that Chrome draws in colour (Noto Color Emoji: the ranked texts, the
 * Turf Wars icons, the KrunkCup card) are images here (v10_emoji in client/src/ui/v10_competitive.c,
 * ui/img/kn/emoji/, ui/README.md). The image holds the glyph's ink centred on a 256 px square drawn
 * from a 160 px glyph, so 1.6em draws it at the text's own size. Its box is the glyph's: Noto Color
 * Emoji's advance (1.245em, so -0.1775em each side) and 1em of line (-0.3em top and bottom), with the
 * ink centre where Chrome puts it, 0.35em above the baseline (the border box ends 0.45em below it:
 * vertical-align -0.15em on the margin box). Measured against Chrome renders of v10's markup. */
.kn-emoji {
	display: inline-block;
	width: 1.6em;
	height: 1.6em;
	margin: -0.3em -0.1775em;
	vertical-align: -0.15em;
}

/* The ranked message overlay's 64 px emoji-icon (svelte-jxc66d: a block with line-height 1). Its line
 * puts GameFont's baseline 0.9375em down (ascent 1.125em, descent 0.25em, half-leading -0.1875em), so the
 * ink centre sits at 0.5875em and the image starts 0.2125em above the block; the block stays 1em tall. */
.emoji-icon .kn-emoji.overlay-emoji {
	display: block;
	margin: -0.2125em auto -0.3875em;
	font-size: 64px;
}

/* KrunkNative: the ranked message overlay's Svelte transitions (svelte-jxc66d: scale 0.9 to 1 with
 * cubicOut and the backdrop's fade, 200 ms, both ways; g:114154-114158) are css/kn-v10-popups.css's
 * kn-ranked-intro / kn-ranked-outro, which client/src/ui/ranked_ui.c sets only while the overlay
 * mounts or unmounts. A rule on .overlay-container itself would outrank them (two classes against
 * one: the outro ran the intro's keyframes) and restart on every re-render of the popup. */
