body {
	background: #001b49;
	font-family: Manrope, sans-serif;
	font-size: 19px;
	color: #fefefe;
	min-width: 320px;
}

/* =========welcome========= */
.welcome {
	min-height: 100vh;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	background: url('/static/img/welcome_bg.jpg') no-repeat center / cover;
}

.welcome-middle {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	max-width: 1670px;
	margin-right: auto;
	margin-left: auto;
	padding: 15px;
	width: 100%;
}

.welcome-cont {
	background: rgba(5, 50, 100, 0.7);
	max-width: 750px;
	width: 100%;
	padding: 70px 15px 135px;
	border-radius: 8px;
}

.welcome__logo {
	max-width: 390px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 55px;
}

.welcome__logo img {
	display: inline-block;
	width: 100%;
}

.welcome__title {
	text-align: center;
	margin-bottom: 95px;
	color: #42c0ff;
	font-family: Manrope;
	font-size: 29px;
	font-weight: 500;
	line-height: 1em;
}

.welcome-col {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	max-width: 540px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	gap: 50px;
}

.welcome-row {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	gap: 20px;
}

.welcome-field {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.welcome-field__title {
	color: #fefefe;
	font-family: Manrope;
	font-size: 23px;
	font-weight: 500;
	line-height: 1em;
	margin-bottom: 24px;
}

.btn_welcome {
	min-width: 214px;
	gap: 40px;
}

.btn_welcome img {
	display: inline-block;
	width: 20px;
}

.welcome-bottom {
	padding: 35px 15px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	max-width: 1830px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	padding-left: 140px;
}

.welcome-partners {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 65px;
}

.welcome-partners__item {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	height: 64px;
}

.welcome-partners__item img {
	display: inline-block;
	max-height: 100%;
}

.welcome__copiryte {
	color: #00a0e3;
	font-family: Manrope;
	font-size: 15px;
	font-weight: 400;
	line-height: 1em;
}

/* =========header========= */
.inner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	min-height: 100vh;
	background: #001b4a url('/static/img/inner_bg.jpg') no-repeat center bottom / 100%;
}

.header {
	padding: 20px 0;
	background: #00163b;
	width: 100%;
}

.header .navbar {
	padding: 0;
}

.header__logo {
	width: 289px;
}

.header__logo img {
	display: inline-block;
	width: 100%;
}

.header-menu {
	margin-left: auto;
	margin-bottom: 0;
	padding: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 70px;
	line-height: 1em;
	color: #a5dbf7;
	font-family: Manrope;
	font-size: 19px;
	font-weight: 400;
}

.header-menu a {
	color: #a5dbf7;
	opacity: 1;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

.header-menu a:hover {
	opacity: 0.8;
}

.ellipsis {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	/* max-width: 125px; */
	display: inline-block;
}

.header-menu li,
.header-menu li a {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 10px;
}

.header-menu li img {
	display: inline-block;
	width: 20px;
}

.copied,
.header-menu li a .icon {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 37px;
	height: 37px;
	border-radius: 5px;
	background: #0f2752;
}

.dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
}

.success {
	background: #82c21f;
}

.error {
	background: #d62828;
}

/* =========message========= */
.message {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding: 25px 0;
}

.message .container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.message-cont {
	background: rgba(18, 41, 83, 0.8);
	border-radius: 10px;
	padding: 25px 0;
	height: calc(100vh - 320px);
}

.ps-own {
	position: relative;
	height: 100%;
	overflow: hidden;
	padding: 0 25px;
}

.message-rows {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 5px;
}

.ps__rail-y {
	width: 4px !important;
	opacity: 1 !important;
	background: #192c50 !important;
	right: 5px !important;
}

.ps__thumb-y {
	background: #194674 !important;
	width: 100% !important;
	right: 0 !important;
}

.message-item {
	max-width: 60%;
	border-radius: 10px 10px 10px 0;
	padding: 17px 30px;
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 10px;
}

.message-item * {
	user-select: text;
}

.message-item__name {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-family: Manrope;
	font-size: 19px;
	font-weight: 600;
	line-height: 1em;
	gap: 7px;
}

.message-item__name img {
	display: inline-block;
	width: 16px;
}

.message-item::before {
	display: block;
	position: absolute;
	content: '';
	right: 100%;
	bottom: 0;
	border: 6px solid transparent;
}

.message-item__date {
	font-family: Manrope;
	font-size: 15px;
	font-weight: 400;
	line-height: 1em;
}

.message-item_right {
	margin-left: auto;
	background: #28457a;
	border-radius: 10px 10px 0px 10px;
}

.message-item_right .message-item__name {
	color: #1b8ad4;
}

.message-item_right::before {
	left: 100%;
	border-left-color: #28457a;
	border-bottom-color: #28457a;
}

.message-item_right .message-item__date {
	color: #7893c4;
}

.message-item_left {
	margin-right: auto;
	background: #114f78;
}

.message-item_left .message-item__name {
	color: #2aab8e;
}

.message-item_left::before {
	border-right-color: #114f78;
	border-bottom-color: #114f78;
}

.message-item_left .message-item__date {
	color: #80a1b7;
}

.message-item__text {
  white-space: pre-wrap;
  word-break: break-word;
}

/* Reply feature — see refactoring log §10 / §4 amendment 2026-05-04 */
.message-item__reply-btn {
	position: absolute;
	top: 6px;
	right: 8px;
	width: 26px;
	height: 26px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: rgba(0, 22, 59, 0.45);
	color: #42c0ff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 120ms ease, background 120ms ease;
}

.message-item__reply-btn:hover {
	background: rgba(0, 22, 59, 0.85);
}

.message-item__reply-btn svg {
	display: block;
}

/* Always visible — discoverability over chrome-cleanliness. */
.message-item__reply-btn {
	opacity: 0.8;
}

.message-item__reply-btn:hover,
.message-item__reply-btn:focus-visible,
.message-item:hover .message-item__reply-btn {
	opacity: 1;
}

.message-item__reply-chip {
	display: flex;
	flex-direction: column;
	gap: 2px;
	max-width: 100%;
	padding: 6px 10px;
	border-left: 3px solid #42c0ff;
	background: rgba(0, 22, 59, 0.45);
	border-radius: 0 6px 6px 0;
	font-size: 14px;
	cursor: pointer;
	transition: background 120ms ease;
}

.message-item__reply-chip:hover {
	background: rgba(0, 22, 59, 0.7);
}

.message-item__reply-chip__author {
	color: #42c0ff;
	font-weight: 600;
	line-height: 1.1;
}

.message-item__reply-chip__preview {
	color: #c9d6e6;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	line-height: 1.2;
}

.message-item__highlight {
	box-shadow: 0 0 0 2px #42c0ff;
	transition: box-shadow 120ms ease;
}

.reply-preview {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 12px;
	margin-bottom: 10px;
	background: rgba(0, 22, 59, 0.55);
	border-radius: 6px;
}

.reply-preview[hidden] { display: none; }

.reply-preview__bar {
	width: 3px;
	align-self: stretch;
	background: #42c0ff;
	border-radius: 2px;
	flex: 0 0 auto;
}

.reply-preview__body {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: baseline;
	font-size: 14px;
	color: #c9d6e6;
}

.reply-preview__label {
	color: #80a1b7;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	font-size: 11px;
}

.reply-preview__author {
	color: #42c0ff;
	font-weight: 600;
}

.reply-preview__snippet {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
	flex: 1 1 200px;
}

.reply-preview__cancel {
	flex: 0 0 auto;
	width: 26px;
	height: 26px;
	border: none;
	border-radius: 50%;
	background: transparent;
	color: #c9d6e6;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}

.reply-preview__cancel:hover {
	background: rgba(0, 22, 59, 0.6);
	color: #fff;
}

.message-bottom {
	margin-top: 25px;
	display: flex;
	width: 100%;
	gap: 15px;
}

.message-field {
	position: relative;
	flex-grow: 1;
}

.message-field .global-input {
	padding-right: 175px;
}

.btn_message {
	position: absolute;
	top: 4px;
	right: 4px;
	height: calc(100% - 8px);
	min-height: inherit;
	min-width: 168px;
	gap: 30px;
}

.btn_message img {
	display: inline-block;
	width: 16px;
}

.btn_message-stop {
	min-width: 168px;
	margin-top: 20px;
}




/*Extra large devices (large desktops, 1430px and up) */
@media (max-width: 1429.5px) {
	body {
		font-size: 17px;
	}

	/* =========welcome========= */
	.welcome-cont {
		max-width: 640px;
		padding: 50px 15px 80px;
	}

	.welcome__logo {
		max-width: 330px;
		margin-bottom: 30px;
	}

	.welcome__title {
		margin-bottom: 50px;
		font-size: 24px;
	}

	.welcome-field__title {
		font-size: 18px;
		margin-bottom: 15px;
	}

	.btn_welcome {
		min-width: 190px;
		gap: 20px;
	}

	.btn_welcome img {
		width: 18px;
	}

	.welcome-bottom {
		padding: 15px;
	}

	.welcome-partners {
		gap: 40px;
	}

	.welcome-partners__item {
		height: 40px;
	}

	/* =========header========= */
	.header-menu {
		gap: 35px;
		font-size: 17px;
	}

	.header__logo {
		width: 250px;
	}

	.header-menu li img {
		width: 17px;
	}

	.copied,
	.header-menu li a .icon {
		width: 32px;
		height: 32px;
	}

	.header-menu li,
	.header-menu li a {
		gap: 8px;
	}

	/* =========message========= */

}

/*Extra large devices (large desktops, 1200px and up) */
@media (max-width: 1199.5px) {
	body {
		font-size: 16px;
	}

	/* =========welcome========= */
	.welcome {
		background-position: right center;
	}

	.welcome-cont {
		margin-right: auto;
		margin-left: auto;
	}

	.welcome-partners {
		gap: 20px;
	}

	/* =========header========= */
	.header {
		position: relative;
		z-index: 2;
	}

	.header__collapse {
		position: absolute;
		z-index: 10px;
		top: calc(100% + 20px);
		left: -15px;
		background: #00163b;
		width: calc(100% + 30px);
	}

	.header .navbar-toggler {
		padding: 0;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		width: 45px;
		height: 30px;
		position: relative;
	}

	.header .navbar-toggler span {
		display: block;
		width: 100%;
		height: 2px;
		background: #fefefe;
		-webkit-transition: all 0.5s;
		transition: all 0.5s;
	}

	.header .navbar-toggler[aria-expanded='true'] span:nth-child(2) {
		display: none;
	}

	.header .navbar-toggler[aria-expanded='true'] span:first-child {
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
		position: absolute;
		left: 0;
		top: 14px;
	}

	.header .navbar-toggler[aria-expanded='true'] span:last-child {
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
		position: absolute;
		left: 0;
		bottom: 12px;
	}

	.header-menu {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-align: end;
		-ms-flex-align: end;
		align-items: flex-end;
		padding: 25px 15px;
	}

	.dot {
		width: 8px;
		height: 8px;
	}

	/* =========message========= */
	.message-cont {
		height: calc(100vh - 294px);
	}

	.btn_message {
		min-width: 138px;
		gap: 13px;
	}

	.btn_message img {
		width: 12px;
	}

	.message-field .global-input {
		padding-right: 155px;
	}

	.message-item__text br {
		display: none;
	}

}

/*Medium devices (tablets, 768px and up) */
@media (max-width: 767px) {
	body {
		font-size: 15px;
	}

	/* =========welcome========= */
	.welcome {
		background: url('/static/img/welcome_bg2.jpg') no-repeat 30% center / cover;
	}

	.welcome-cont {
		padding: 40px 10px;
		background: rgba(5, 50, 100, 0.9);
	}

	.welcome__logo {
		max-width: 270px;
		margin-bottom: 20px;
	}

	.welcome__title {
		margin-bottom: 35px;
		font-size: 21px;
	}

	.welcome-row {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		gap: 15px;
	}

	.welcome-field {
		-webkit-box-flex: inherit;
		-ms-flex: inherit;
		flex: inherit;
		width: 100%;
	}

	.welcome-field__title {
		font-size: 16px;
		margin-bottom: 11px;
	}

	.btn_welcome {
		width: 100%;
	}

	.welcome-col {
		gap: 25px;
	}

	.welcome-bottom {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		gap: 25px;
	}

	.welcome-partners {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		gap: 15px;
	}

	.welcome-partners__item {
		height: 32px;
	}

	/* =========header========= */
	.header__logo {
		width: 230px;
	}

	/* =========message========= */
	.message-item {
		width: 100%;
		max-width: 100%;
	}

	.ps-own {
		padding: 0 15px;
	}

	.message-item::before {
		border-width: 4px;
	}

	.message-cont {
		min-height: 500px;
		padding: 15px 0;
	}

	.message-item {
		padding: 15px;
	}

	.message-item__name {
		font-size: 17px;
	}

	.btn_message span {
		display: none;
	}

	.btn_message {
		width: 37px;
		min-width: inherit;
		padding: 0;
	}

	.btn_message img {
		width: 16px;
	}

	.message-field .global-input {
		padding-right: 50px;
	}

}

img {
	user-select: none !important;
	-webkit-user-drag: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	pointer-events: auto;
}

/* Disable selection everywhere */
html {
	user-select: none;
	-webkit-user-select: none;
}

/* Re-enable selection inside form fields */
input,
textarea,
[contenteditable="true"] {
	user-select: text;
	-webkit-user-select: text;
}

a {
	-webkit-user-drag: none;
}

/* E2E encryption status chip + banner — see refactoring log §7 entry 2026-05-12 */
.e2e-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 2px 10px;
	margin-left: 8px;
	border-radius: 12px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.02em;
	user-select: none;
	transition: background 120ms ease, color 120ms ease;
}

.e2e-chip__icon { font-size: 13px; line-height: 1; }
.e2e-chip__label { line-height: 1.2; }

.e2e-chip--ready {
	background: rgba(130, 194, 31, 0.18);
	color: #82c21f;
	border: 1px solid rgba(130, 194, 31, 0.5);
}

.e2e-chip--handshaking {
	background: rgba(255, 184, 0, 0.18);
	color: #ffb800;
	border: 1px solid rgba(255, 184, 0, 0.45);
}

.e2e-chip--insecure {
	background: rgba(214, 40, 40, 0.18);
	color: #ff7676;
	border: 1px solid rgba(214, 40, 40, 0.55);
}

.e2e-banner {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	margin-bottom: 10px;
	background: rgba(214, 40, 40, 0.12);
	border-left: 3px solid #d62828;
	border-radius: 6px;
	color: #ffb0b0;
	font-size: 13px;
	line-height: 1.3;
}

.e2e-banner[hidden] { display: none; }

.e2e-banner__icon { font-size: 16px; line-height: 1; }
.e2e-banner__text { flex: 1 1 auto; }