/* eth.css -- ETH Zürich theme for HotCRP (NetSec Projects)
 * Loaded after stylesheets/style.css via $Opt["stylesheets"].
 * Tokens follow the "ETH - Design System" Figma file:
 *   ETH Blue #215CAF (hover Blue/120 #08407E), Black Light #222222,
 *   grey scale #F6F6F6 / #F1F1F1 / #E2E2E2 / #C5C5C5 / #8C8C8C / #6F6F6F,
 *   font DIN Next, form fields 1px #8C8C8C radius 2px. */

/* Fonts */
@font-face {
	font-family: "DIN Next ETH";
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	src: url("fonts/DINNextLTW05-Regular.woff2") format("woff2"),
		url("fonts/DINNextLTW05-Regular.woff") format("woff");
}
@font-face {
	font-family: "DIN Next ETH";
	font-weight: 400;
	font-style: italic;
	font-display: swap;
	src: url("fonts/DINNextLTW05-Italic.woff2") format("woff2"),
		url("fonts/DINNextLTW05-Italic.woff") format("woff");
}
@font-face {
	font-family: "DIN Next ETH";
	font-weight: 500;
	font-style: normal;
	font-display: swap;
	src: url("fonts/DINNextLTW05-Medium.woff2") format("woff2"),
		url("fonts/DINNextLTW05-Medium.woff") format("woff");
}
@font-face {
	font-family: "DIN Next ETH";
	font-weight: 500;
	font-style: italic;
	font-display: swap;
	src: url("fonts/DINNextLTW05-MediumItalic.woff2") format("woff2"),
		url("fonts/DINNextLTW05-MediumItalic.woff") format("woff");
}
@font-face {
	font-family: "DIN Next ETH";
	font-weight: 600 900;
	font-style: normal;
	font-display: swap;
	src: url("fonts/DINNextLTW05-Bold.woff2") format("woff2"),
		url("fonts/DINNextLTW05-Bold.woff") format("woff");
}
@font-face {
	font-family: "DIN Next ETH";
	font-weight: 600 900;
	font-style: italic;
	font-display: swap;
	src: url("fonts/DINNextLTW05-BoldItalic.woff2") format("woff2"),
		url("fonts/DINNextLTW05-BoldItalic.woff") format("woff");
}


/* Theme tokens: overrides HotCRP's variables in the same layer, so its
   light/dark switching keeps working. */
@layer theme {
:root {
	--eth-blue: light-dark(#215caf, #7a9dcf);
	--eth-blue-hover: light-dark(#08407e, #a6bedf);
	--eth-blue-10: light-dark(#e9eff7, #1c2533);
	--eth-blue-20: light-dark(#d3deef, #24314a);
	--eth-separator: light-dark(#e2e2e2, #3a3a3a);
	--eth-button-border: light-dark(rgba(34, 34, 34, 0.24), rgba(255, 255, 255, 0.28));
	--eth-strong-border: light-dark(#000000, #ffffff);
	--eth-canvas: light-dark(#f6f6f6, #121212);
	--eth-card: light-dark(#ffffff, #1e1e1e);
	--eth-card-border: light-dark(rgba(34, 34, 34, 0.06), rgba(255, 255, 255, 0.08));
	--eth-card-shadow: light-dark(0 1px 2px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.4)), light-dark(0 8px 24px rgba(0, 0, 0, 0.06), 0 8px 24px rgba(0, 0, 0, 0.3));
	--eth-row-hover: light-dark(rgba(33, 92, 175, 0.06), rgba(122, 157, 207, 0.1));

	--paper: light-dark(#ffffff, #1a1a1a);
	--paper-transparent: light-dark(rgba(255, 255, 255, 0), rgba(26, 26, 26, 0));
	--text: light-dark(#222222, #e8e8e8);
	--input-text: light-dark(#222222, #eeeeee);
	--input-border: light-dark(#8c8c8c, #6f6f6f);
	--input-hover-border: light-dark(#000000, #c5c5c5);
	--input-active-border: light-dark(#000000, #ffffff);
	--disabled-bg: light-dark(#f6f6f6, #2a2a2a);
	--disabled-fg: light-dark(rgba(34, 34, 34, 0.48), rgba(255, 255, 255, 0.4));
	--disabled-border: light-dark(rgba(34, 34, 34, 0.2), rgba(255, 255, 255, 0.16));
	--dim-fg: light-dark(#6f6f6f, #a9a9a9);
	--hint-fg: light-dark(#575757, #c5c5c5);
	--link-fg: light-dark(#215caf, #7a9dcf);
	--link-visited-fg: light-dark(#385c9b, #a0b1d0);
	--link-hover-fg: light-dark(#08407e, #a6bedf);
	--link-active-fg: light-dark(#08407e, #d3deef);
	--sort-link-fg: light-dark(#222222, #e2e2e2);
	--error-fg: light-dark(#b7352d, #ff6b6b);
	--error-msg-bg: light-dark(#f8ebea, #351c1b);
	--error-entry-bg: light-dark(#fdf7f6, #2a1d1c);
	--warning-fg: light-dark(#8e6713, #d2b26a);
	--warning-msg-bg: light-dark(#f4f0e7, #2e2717);
	--warning-entry-bg: light-dark(#faf8f3, #26221a);
	--success-fg: light-dark(#627313, #a1ab71);
	--success-msg-bg: light-dark(#eff1e7, #22271a);
	--note-fg: light-dark(#215caf, #7a9dcf);
	--msg-bg: light-dark(#e9eff7, #1c2533);
	--button-bgi: none;
	--button-hover-bgi: linear-gradient(light-dark(rgba(34, 34, 34, 0.04), rgba(255, 255, 255, 0.06)), light-dark(rgba(34, 34, 34, 0.04), rgba(255, 255, 255, 0.06)));
	--button-active-bgi: linear-gradient(light-dark(rgba(34, 34, 34, 0.1), rgba(255, 255, 255, 0.12)), light-dark(rgba(34, 34, 34, 0.1), rgba(255, 255, 255, 0.12)));
	--fieldset-bg: light-dark(#f6f6f6, #222222);
	--fieldset-hover-bg: light-dark(#f1f1f1, #262626);
	--fieldset-active-bg: light-dark(#ffffff, #1f2633);
	--fieldset-border: light-dark(#c5c5c5, #484848);
	--fieldset-option-border: light-dark(#e2e2e2, #3a3a3a);
	--fieldset-option-hover-border: light-dark(#8c8c8c, #6f6f6f);
	--fieldset-hover-border: light-dark(#8c8c8c, #6f6f6f);
	--dialog-bg: light-dark(#ffffff, #222222);
	--tablink-border: light-dark(#215caf, #7a9dcf);
	--tablink-active-bg: light-dark(#e9eff7, #1c2533);
	--list-alternate-bg: light-dark(#f6f6f6, #222428);
	--list-group-border: light-dark(#e2e2e2, #3a3a3a);
	--list-group-bg: light-dark(#f1f1f1, #2a2a2a);
	--brand-fg: light-dark(#215caf, #7a9dcf);
	--brand-bg: light-dark(#f6f6f6, #222222);
	--brand-bg-dark: light-dark(#e9eff7, #1c2533);
	--brand-decor-light: light-dark(#d3deef, #24314a);
	--headline-fg: light-dark(#215caf, #7a9dcf);
	--headline-decor: light-dark(#215caf, #7a9dcf);
	--heading-fg: light-dark(#222222, #e2e2e2);
	--home-heading-fg: light-dark(#215caf, #7a9dcf);
	--sidebar-bg: light-dark(#f1f1f1, #222222);
	--error-paper: light-dark(#f1f1f1, #222222);
	--signin-paper: light-dark(#f1f1f1, #222222);
	--submission-bg-dark: light-dark(#e2e2e2, #2a2a2a);
	--submission-bg: light-dark(#f1f1f1, #222222);
	--submission-sidebar-bg: light-dark(#f6f6f6, #1f1f1f);
	--submission-sidebar-fg: light-dark(#222222, #e8e8e8);
	--submission-sidebar-title-fg: light-dark(#575757, #c5c5c5);
	--status-submitted-fg: light-dark(#a7117a, #dc9ec9);
	--status-rejected-fg: light-dark(#b7352d, #e2aeab);
	--status-accepted-fg: light-dark(#627313, #a1ab71);
	--sf-title-fg: light-dark(#215caf, #7a9dcf);
	--rf-title-fg: light-dark(#007894, #66afc0);
	--review-border: light-dark(#d3deef, #24314a);
	--comment-title-fg: light-dark(#8e6713, #d2b26a);
	--comment-title-emphasis: light-dark(#704f12, #e8e1d0);
	--comment-selfid-fg: light-dark(#704f12, #d2c2a1);
	--comment-border: light-dark(#e2e2e2, #3a3a3a);
	--response-border: light-dark(#e8e1d0, #4a3e26);
}

/* Buttons: ETH "themed" buttons -- blue primary, outlined secondary */
select, button, .btn, button.btn-t:hover {
	border-color: var(--eth-button-border);
}
button:hover, .btn:hover, select:hover {
	border-color: var(--eth-strong-border);
}
button:active, .btn:active {
	border-color: var(--eth-strong-border);
}
.btn-default,
.btn-primary,
.btn-success,
input.btn:checked {
	border-color: var(--eth-blue);
	background: var(--eth-blue);
	color: light-dark(#ffffff, #111111);
}
.btn-default:hover, .btn-default:active,
.btn-primary:hover, .btn-primary:active,
.btn-success:hover, .btn-success:active,
input.btn:checked:hover, input.btn:checked:active {
	border-color: var(--eth-blue-hover);
	background: var(--eth-blue-hover);
}
a.btn-default, a.btn-default:hover,
a.btn-primary, a.btn-primary:hover,
a.btn-success, a.btn-success:hover {
	color: light-dark(#ffffff, #111111);
}
.btn-danger:hover, .btn-danger:active {
	border: 1px solid #96272d;
	background: #b7352d;
	color: #ffffff;
}
.differs .btn-default,
.differs .btn-primary,
.btn-highlight,
.btn-highlight.btn-danger {
	border-color: #b7352d;
	background: #b7352d;
	color: #ffffff;
}
.differs .btn-default:hover, .differs .btn-default:active,
.differs .btn-primary:hover, .differs .btn-primary:active,
.btn-highlight:hover, .btn-highlight:active {
	border: 1px solid #96272d;
	background: #96272d;
}
}


/* Typography */
:root, .text-default,
input, textarea, .textarea, select, button, .btn {
	font-family: "DIN Next ETH", "DIN Next LT Pro", "Helvetica Neue", Arial, sans-serif;
}
:root, .text-default {
	line-height: 1.5;
}
h1, h2, h3, h4 {
	line-height: 1.3;
}
h2, h3.form-h {
	font-weight: 700;
}
strong, b, .font-weight-bold {
	font-weight: 700;
}


/* Header: white application bar with the ETH logo, as in
   "Header for Web-Applications" */
#p-header {
	/* own stacking context, kept above the page body so header
	   dropdowns (account menu) are not covered by page content */
	isolation: isolate;
	z-index: 20;
	padding-bottom: 24px;
}
#p-header::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	right: 0;
	height: 72px;
	background: var(--paper);
	border-bottom: 1px solid var(--eth-separator);
}
body.paper #p-header {
	background: var(--paper);
	border-bottom: 1px solid var(--eth-separator);
}
#h-site {
	display: flex;
	align-items: center;
	height: 72px;
	padding: 0 24px;
	border: 0;
	border-radius: 0;
	background: none;
	color: var(--text);
}
#h-site > h1 {
	display: block;
	font-size: inherit;
	line-height: inherit;
}
#h-site > a, #h-site > h1 > a {
	display: inline-flex;
	align-items: center;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.2;
	color: var(--text);
	text-decoration: none;
	background: linear-gradient(var(--eth-separator), var(--eth-separator)) no-repeat 164px center / 1px 32px;
}
#h-site > a::before, #h-site > h1 > a::before {
	content: "";
	flex: none;
	width: 148px;
	height: 24px;
	margin-right: 33px;
	background-color: currentColor;
	-webkit-mask: url("eth-logo.svg") no-repeat left center / 148px 24px;
	mask: url("eth-logo.svg") no-repeat left center / 148px 24px;
}
#h-site > a:hover, #h-site > h1 > a:hover {
	color: var(--eth-blue);
	text-decoration: none;
}
.header-site-name {
	font-weight: 500;
}
#h-right {
	display: flex;
	align-items: center;
	height: 72px;
	padding: 0 24px;
	font-size: 0.9375rem;
}
#p-quicklinks {
	margin-top: 12px;
}
body.paper #p-quicklinks {
	margin-top: 12px;
}
#h-page {
	padding: 24px 0 0 24px;
}
#h-title {
	font-size: 2rem;
	font-weight: 400;
	line-height: 1.2;
}
#h-title strong {
	font-weight: 700;
}
#h-page.header-page-submission {
	top: 0;
	margin-top: 16px;
	margin-bottom: 0;
	border-top: 1px solid var(--eth-separator);
	border-bottom: 1px solid var(--eth-separator);
}
h1.paptitle {
	font-size: 1.75rem;
	line-height: 1.25;
	padding: 12px 24px;
}


/* Footer */
#p-footer {
	background: none;
	border: 0;
	border-radius: 0;
	color: var(--dim-fg);
	font-size: 0.75rem;
	padding: 4px 12px;
}


/* Buttons: geometry */
button, .btn {
	border-radius: 2px;
	padding: 3px 12px 4px;
	font-weight: 500;
}
select {
	border-radius: 2px;
}
button.btn-t {
	border-radius: 2px;
}
.btn-licon {
	padding: 5px 4px 2px;
}
.btn-licon-s {
	padding-left: 5px;
	padding-right: 5px;
}
button.link, button.q, button.qo, button.qx {
	font-weight: inherit;
	padding: 0;
	border-radius: 0;
}
:is(button, .btn, a, select, summary):focus-visible {
	outline: 2px solid var(--eth-strong-border);
	outline-offset: 2px;
}


/* Form fields: 1px #8C8C8C, black on hover, 2px black when active */
input[type=text], input[type=email], input[type=password], input[type=date],
input[type=number], input[type=search], input[type=url], textarea, .textarea {
	border-radius: 2px;
	padding: 4px 8px;
	background-color: var(--paper);
	color: var(--input-text);
}
input[type=text]:hover, input[type=email]:hover, input[type=password]:hover,
input[type=date]:hover, input[type=number]:hover, input[type=search]:hover,
input[type=url]:hover, textarea:hover, .textarea:hover {
	border-color: var(--input-hover-border);
}
input[type=text]:focus, input[type=email]:focus, input[type=password]:focus,
input[type=date]:focus, input[type=number]:focus, input[type=search]:focus,
input[type=url]:focus, textarea:focus, .textarea:focus {
	border-color: var(--input-active-border);
	box-shadow: inset 0 0 0 1px var(--input-active-border);
	outline: none;
}
input[type=checkbox], input[type=radio] {
	accent-color: var(--eth-blue);
}
fieldset {
	border-radius: 2px;
}


/* Messages: flat ETH notifications with a colored accent bar
   (unlayered, since HotCRP's .msg border-color is unlayered) */
.msg, .msg.msg-confirm, .msg.msg-success, .msg.msg-warning, .msg.msg-error {
	border-style: solid;
	border-width: 0 0 0 4px;
	border-radius: 2px;
	padding: 12px 16px;
}
.msg {
	background: var(--msg-bg);
	border-color: var(--eth-blue);
}
.msg.msg-confirm, .msg.msg-success {
	background: var(--success-msg-bg);
	border-color: var(--success-fg);
}
.msg.msg-warning {
	background: var(--warning-msg-bg);
	border-color: var(--warning-fg);
}
.msg.msg-error {
	background: var(--error-msg-bg);
	border-color: var(--error-fg);
}


/* Home page */
#p-body.body-home {
	margin-top: 0.5rem;
}
h2.home, h4.home {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--text);
	padding-bottom: 8px;
	margin-bottom: 0.75rem;
	border-bottom: 1px solid var(--eth-separator);
}
.home-sidebar ul > li {
	padding: 3px 0;
}
.home-sidebar a {
	text-decoration: none;
}
.home-sidebar a:hover {
	text-decoration: underline;
}
/* The sidebar Help link is "?⃝ <u>Help</u>"; DIN Next ETH lacks the
   combining enclosing circle (U+20DD), so hide that text and draw the
   circled "?" in CSS */
.home-sidebar a.noul[href*="help"] {
	display: inline-flex;
	align-items: center;
	font-size: 0;
}
.home-sidebar a.noul[href*="help"] > u {
	font-size: 1rem;
}
.home-sidebar a.noul[href*="help"]::before {
	content: "?";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 1.1rem;
	height: 1.1rem;
	margin-right: 6px;
	border: 1.5px solid currentColor;
	border-radius: 50%;
	font-size: 0.6875rem;
	font-weight: 700;
	line-height: 1;
}

/* Welcome text (conference home message) as a hero card */
.home-main > .msg.avoid-home-sidebar {
	position: relative;
	overflow: hidden;
	padding: 40px 40px 32px;
	border: 1px solid var(--eth-card-border);
	border-radius: 12px;
	background: var(--eth-card);
	box-shadow: var(--eth-card-shadow);
}
.home-main > .msg.avoid-home-sidebar::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 6px;
	background: linear-gradient(90deg, #215caf, #007894);
}
.home-main > .msg h1 {
	font-size: 2.25rem;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
	margin-bottom: 1rem;
}
.home-main > .msg h1 + p {
	font-size: 1.125rem;
	color: var(--hint-fg);
}
.home-main > .msg h2 {
	font-size: 1.375rem;
	margin-top: 1.75rem;
	margin-bottom: 0.5rem;
}
.home-main > .msg h3 {
	font-size: 1.0625rem;
	margin-top: 1rem;
	margin-bottom: 0.375rem;
}
.home-main > .msg hr {
	border: 0;
	border-top: 1px solid var(--eth-separator);
	margin: 1.5rem 0 0;
}
.home-main > .msg ul {
	padding-left: 1.25rem;
}
.home-main > .msg li {
	margin-bottom: 0.25rem;
}
.home-main > .msg li::marker {
	color: var(--eth-blue);
}
/* Welcome text sections (<div class="welcome-cols"> in the home message):
   side by side when the card is wide enough, stacked otherwise */
.home-main > .msg.avoid-home-sidebar {
	container-type: inline-size;
	width: auto; /* fit-content (from .msg) would collapse to 0 here */
}
.home-main > .msg .welcome-cols {
	display: grid;
	grid-template-columns: 1fr;
	margin-top: 1.5rem;
	border-top: 1px solid var(--eth-separator);
}
.home-main > .msg .welcome-col {
	min-width: 0;
	padding-top: 0.25rem;
}
.home-main > .msg .welcome-col + .welcome-col {
	margin-top: 1.5rem;
	border-top: 1px solid var(--eth-separator);
}
.home-main > .msg .welcome-col > :last-child {
	margin-bottom: 0;
}
@container (min-width: 760px) {
.home-main > .msg .welcome-cols {
	grid-template-columns: 1fr 1fr;
	column-gap: 48px;
}
.home-main > .msg .welcome-col + .welcome-col {
	margin-top: 0;
	border-top: 0;
	padding-left: 48px;
	margin-left: -24px;
	border-left: 1px solid var(--eth-separator);
}
}

/* Signed-in home: the welcome card fills the space left of the sidebar (it
   is a block formatting context, so it flows beside the floated sidebar) */
.home-content:not(:has(#f-signin)) > .home-main > .msg.avoid-home-sidebar {
	max-width: none;
	width: auto;
}

/* Signed-out home: grey canvas, centered content, two-column layout
   (welcome card | sign in + information) */
#p-page.body-home:has(#f-signin) {
	background: var(--eth-canvas);
	min-height: 100vh;
}
#p-body.body-home:has(#f-signin) {
	max-width: 1248px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 24px;
	padding-right: 24px;
}
#m-home:has(#f-signin) #h-site {
	padding-left: max(24px, calc((100% - 1248px) / 2 + 24px));
}
#m-home:has(#f-signin) #h-right {
	padding-right: max(24px, calc((100% - 1248px) / 2 + 24px));
}
.home-content:has(#f-signin) .homegrp:not(#f-signin):not(:has(.signingrp)) > p {
	color: var(--hint-fg);
}
.home-content:has(#f-signin) > .home-sidebar,
.home-content:has(#f-signin) #homeau {
	padding: 24px;
	border: 1px solid var(--eth-card-border);
	border-radius: 12px;
	background: var(--eth-card);
	box-shadow: var(--eth-card-shadow);
}
@media screen and (min-width: 960px) {
.home-content:has(> .home-main > #f-signin) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 380px;
	column-gap: 32px;
	align-items: start;
}
.home-content:has(> .home-main > #f-signin) > .home-main {
	display: contents;
}
.home-content:has(> .home-main > #f-signin) > .home-main > * {
	grid-column: 1;
	min-width: 0;
}
.home-content:has(> .home-main > #f-signin) > .home-main > .msg.avoid-home-sidebar {
	grid-row: 1 / span 4;
	max-width: none;
	margin-top: 0;
}
.home-content:has(> .home-main > #f-signin) > .home-main > #f-signin {
	grid-column: 2;
	grid-row: 1;
	margin-bottom: 24px;
}
.home-content:has(> .home-main > #f-signin) > .home-sidebar {
	grid-column: 2;
	grid-row: 2;
	float: none;
	width: auto;
	margin: 0 0 24px;
}
.home-content:has(> .home-main > #f-signin) > .home-main > #homeau {
	grid-column: 2;
	grid-row: 3;
	margin-bottom: 24px;
}
.home-content:has(> .home-main > #f-signin) .homegrp:not(#f-signin):not(#homeau):not(.msg) {
	grid-row: 5;
}
}


/* Sign in card */
.signingrp {
	border: 1px solid var(--eth-card-border);
	border-radius: 12px;
	padding: 32px;
	background: var(--eth-card);
	box-shadow: var(--eth-card-shadow);
}
#f-signin .signingrp {
	width: auto;
	max-width: none;
	margin-bottom: 0;
}
.home-content:has(#f-signin) > .home-sidebar > .homegrp:last-child,
.home-content:has(#f-signin) #homeau > :last-child {
	margin-bottom: 0;
}
#p-page.body-signin, #p-page.body-error {
	background: var(--eth-canvas);
}
h1.signin {
	font-size: 1.75rem;
	margin-bottom: 0.5rem;
}
.signingrp button[type=submit] {
	padding-top: 9px;
	padding-bottom: 10px;
	font-size: 1rem;
}
.signingrp input[type=email], .signingrp input[type=password], .signingrp input[type=text] {
	padding: 8px 12px;
}
/* Separator between password sign-in and OIDC sign-in buttons */
.signingrp .mt-5:has(> button[formaction*="oauth?"]) {
	margin-top: 1.5rem !important;
	padding-top: 1.5rem;
	border-top: 1px solid var(--eth-separator);
}


/* Theme toggle (scripts/eth-theme.js) */
.eth-theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 1px solid var(--eth-button-border);
	border-radius: 50%;
	background: transparent;
	color: var(--text);
	cursor: pointer;
}
button.eth-theme-toggle:hover {
	border-color: var(--eth-strong-border);
	background: var(--eth-row-hover);
}
.eth-theme-toggle > svg {
	display: block;
}
.eth-theme-toggle-float {
	position: absolute;
	top: 18px;
	right: 24px;
	z-index: 2;
}
#h-right {
	gap: 16px;
}


/* Motion and small modern touches */
a, button, .btn, select,
input[type=text], input[type=email], input[type=password], input[type=search],
input[type=number], input[type=url], input[type=date], textarea, .textarea {
	transition: color 0.15s ease, background-color 0.15s ease,
		border-color 0.15s ease, box-shadow 0.15s ease;
}
@media (prefers-reduced-motion: reduce) {
a, button, .btn, select, input, textarea, .textarea {
	transition: none;
}
}
::selection {
	background: light-dark(rgba(33, 92, 175, 0.2), rgba(122, 157, 207, 0.35));
}
.dropmenu-container {
	border-radius: 8px;
	box-shadow: 0 3px 15px rgba(0, 0, 0, 0.14);
}
tr.pl:hover > td {
	background-image: linear-gradient(var(--eth-row-hover), var(--eth-row-hover));
}


/* Left menus (settings, profile, help, ...) and paper mode tabs:
   ETH navigation with a 3px blue indicator */
.leftmenu-item.active {
	border: 0;
	border-left: 3px solid var(--eth-blue);
	border-radius: 0;
	margin-left: -5px;
	padding-left: 8px;
	background: var(--paper);
	color: var(--text);
	font-weight: 700;
}
.papmode.active {
	border: 0;
	border-bottom: 3px solid var(--eth-blue);
	border-radius: 0;
	background: none;
	padding-top: 4.5px;
	padding-bottom: 1px;
}
.papmode.active > a {
	color: var(--text);
}


/* Lists */
.pltable > thead > tr > th, .pltable > thead > tr.pl_headrow > th {
	font-weight: 500;
}
.sort-ascending::after {
	content: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 7H7L4 2Z' style='fill:%23215caf' /%3E%3C/svg%3E");
}
.sort-descending::after {
	content: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 2H7L4 7Z' style='fill:%23215caf' /%3E%3C/svg%3E");
}


@media screen and (max-width: 768px) {
#p-header::before, #h-site, #h-right {
	height: 56px;
}
#h-site {
	padding-left: 12px;
	padding-right: 12px;
}
#h-site > a, #h-site > h1 > a {
	font-size: 16px;
}
#h-site > a, #h-site > h1 > a {
	background-position: 123px center;
	background-size: 1px 24px;
}
#h-site > a::before, #h-site > h1 > a::before {
	width: 111px;
	height: 18px;
	margin-right: 25px;
	-webkit-mask-size: 111px 18px;
	mask-size: 111px 18px;
}
#h-right {
	padding: 0 12px;
}
#h-title {
	font-size: 1.5rem;
}
.home-main > .msg.avoid-home-sidebar {
	padding: 28px 20px 20px;
}
.home-main > .msg h1 {
	font-size: 1.625rem;
}
#p-body.body-home:has(#f-signin) {
	padding-left: 12px;
	padding-right: 12px;
}
#m-home:has(#f-signin) #h-site {
	padding-left: 12px;
}
#m-home:has(#f-signin) #h-right {
	padding-right: 12px;
}
.signingrp {
	padding: 24px;
}
.eth-theme-toggle {
	width: 32px;
	height: 32px;
}
.eth-theme-toggle-float {
	top: 12px;
	right: 12px;
}
}

@media print {
#p-header::before {
	display: none;
}
}