:root {
	--bg: rgb(15, 15, 15);
	--panel: #141414;
	--panel2: rgb(20,20,20);
	--text: rgb(240,240,244);
	--text-muted: rgba(240,240,244,0.65);
	--line-strong: rgba(60,60,60,0.8);
	--line-soft: rgba(70,70,70,0.7);
	--accent-grad: linear-gradient(60deg, rgb(90,80,185), rgb(134,93,207));
	--radius: 9px;
}
body {
	background: var(--bg);
	color: var(--text);
	font-family: 'Roboto', system-ui, -apple-system, sans-serif;
	font-size: 1rem;
	line-height: 1.5;
	margin: 0;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}
a {
	color: rgb(97, 126, 182);
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
.topnav {
	padding: 1.25rem 0 0;
	position: relative;
	z-index: 200;
}
.topnav-inner {
	box-sizing: border-box;
	max-width: 70%;
	margin: 0 auto;
	display: flex;
	align-items: center;
	background: var(--panel);
	border: 1px solid var(--line-strong);
	border-radius: var(--radius);
	padding: 0 0.25rem 0 0.75rem;
}
.topnav-logo {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	text-decoration: none;
	padding: 0.45rem 0.6rem 0.45rem 0;
}
.topnav-logo img {
	width: 26px;
	height: 26px;
	display: block;
}
.topnav-sep {
	width: 1px;
	align-self: stretch;
	background: var(--line-strong);
	flex-shrink: 0;
	margin: 0.35rem 0.4rem;
}
.nav {
	display: flex;
	flex-direction: row;
	align-items: center;
	flex: 1;
}
.nav-top, .nav-bottom {
	display: flex;
	flex-direction: row;
	align-items: center;
}
.nav-bottom {
	margin-left: auto;
}
.nav-link {
	font-family: 'Roboto', system-ui, -apple-system, sans-serif;
	font-weight: 300;
	color: rgb(134, 138, 150);
	display: flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.45rem 0.75rem;
	border-radius: var(--radius);
	text-decoration: none;
	font-size: 0.875rem;
	white-space: nowrap;
}
.nav-link:hover {
	background: rgb(34,34,34);
	color: rgb(134, 138, 150);
	text-decoration: none;
}
.nav-link svg {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
}
.nav-link .material-symbols-outlined {
	display: none;
}
.nav-link.active {
	background: var(--accent-grad);
	color: #fff;
	font-weight: 400;
}
.nav-label {
	font-weight: 300;
}
.dashboard-wrap {
	overflow-x: hidden;
	flex: 1;
}
.dashboard-wrap-no-margin {
	overflow-x: hidden;
}
.dashboard-container {
	box-sizing: border-box;
	padding: 2rem 0rem;
	max-width: 70%;
	margin: 0 auto 2rem;
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}
.group-box {
	border: 1px solid var(--line-strong);
	padding: 1.5rem;
	background: var(--panel);
	border-radius: var(--radius);
}
.group-title {
	margin-top: -2px;
	margin-bottom: 1.25rem;
	font-size: 1.25rem;
	font-weight: 700;
}
.dashboard-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
	gap: 1rem;
}
.actions-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
	gap: 1rem;
}
.info-card {
	background: var(--panel);
	border: 1px solid var(--line-soft);
	border-radius: var(--radius);
	padding: 0rem 1rem 0.85rem 1.25rem;
}
.info-card h3 {
	margin: 0;
}
.action-card {
	background: var(--panel);
	padding: 1.25rem;
	border: 1px solid var(--line-soft);
	border-radius: var(--radius);
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.info-label {
	font-size: .95rem;
	margin-bottom: .4rem;
	font-weight: 700;
	color: var(--text-muted);
	text-decoration: revert;
}
.action-card h4.info-label {
	margin-top: -2px;
}
.action-card p {
	margin: 0;
	color: var(--text-muted);
	font-size: .92rem;
	line-height: 1.6;
}
.action-card .btn-accent {
	margin-top: auto;
}
.btn-accent {
	background: var(--accent-grad);
	border: none;
	padding: .6rem 1rem;
	color: #fff;
	cursor: pointer;
	font-weight: 400;
	margin: .9rem 0 0;
	border-radius: var(--radius);
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	text-decoration: none;
}
.btn-accent:hover {
	opacity: .92;
}
.log-box {
	background: #111;
	padding: 1rem;
	overflow-y: auto;
	border: 1px solid var(--line-soft);
	font-size: .95rem;
	line-height: 1.5;
	border-radius: var(--radius);
}
.news-box {
	background: #111;
	padding: 1rem;
	height: 4rem;
	overflow-y: auto;
	border: 1px solid var(--line-soft);
	font-size: .95rem;
	line-height: 1.5;
	border-radius: var(--radius);
}
.download-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .75rem;
}
.download-item {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	background: var(--panel);
	border: 1px solid var(--line-soft);
	padding: .9rem 1rem;
	border-radius: var(--radius);
	gap: .6rem;
}
.download-meta {
	display: flex;
	flex-direction: column;
	gap: .15rem;
}
.key-row {
	display: flex;
	align-items: center;
	gap: .5rem;
}
.icon-btn {
	background: transparent;
	border: 1px solid var(--line-soft);
	color: var(--text);
	border-radius: var(--radius);
	padding: .25rem;
	line-height: 0;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.icon-btn:hover {
	background: rgb(34,34,34);
}
.icon-btn .material-symbols-outlined {
	font-size: 1.1rem;
}
.support-grid {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fit,minmax(min(100%,22rem),1fr))
}
.card {
	background: var(--panel);
	border: 1px solid var(--line-soft);
	border-radius: var(--radius);
	padding: 1rem;
}
.card-header {
	display: flex;
	align-items: center;
	gap: .6rem;
	margin-bottom: .75rem
}
.card-title {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700
}
.card-sub {
	margin: 0;
	font-size: .9rem;
	color: var(--text-muted);
	line-height: 1.6
}
.form-row {
	display: grid;
	gap: .6rem;
	margin: .5rem 0 0
}
.form-label {
	font-size: .9rem;
	color: var(--text-muted)
}
.form-control {
	background: #101010;
	border: 1px solid var(--line-soft);
	border-radius: var(--radius);
	padding: .65rem .75rem;
	color: var(--text);
	outline: none;
	transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
	width: 100%;
	box-sizing: border-box;
	display: block;
}
.form-control::placeholder {
	color: rgba(240,240,244,.35);
}
.form-control:focus-visible {
	border-color: rgba(180,160,255,.6);
	box-shadow: 0 0 0 3px rgba(134,93,207,.25);
	background: #0f0f0f;
}
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	border: 0;
	border-radius: var(--radius);
	padding: .6rem 1rem;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	user-select: none;
	transition: transform .04s ease,opacity .15s ease
}
.btn:active {
	transform: translateY(1px)
}
.btn-ghost {
	background: transparent;
	border: 1px solid var(--line-soft);
	color: var(--text)
}
.btn-ghost:hover {
	background: rgb(34,34,34)
}
.actions {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-top: .75rem
}
.header-chip {
	display: inline-block;
	margin: .25rem 0 1rem;
	padding: .35rem .5rem;
	border-radius: var(--radius);
	border: 1px dashed var(--line-soft);
	color: var(--text-muted);
	font-size: .85rem;
	background: rgba(255,255,255,.02)
}
.callout {
	border-radius: var(--radius);
	background: var(--panel2);
	border: 1px dashed var(--line-soft);
	padding: .65rem .75rem;
	color: var(--text-muted);
	font-size: .88rem
}
.result {
	margin-top: .65rem;
	max-height: 22rem;
	overflow: auto;
	border-radius: var(--radius);
	border: 1px solid var(--line-soft);
	background: #0d0d0d;
	padding: .6rem;
	font-size: .95rem;
	line-height: 1.45
}
.result table {
	width: 100%;
	border-collapse: collapse;
	font-size: .93rem
}
.result th, .result td {
	border: 1px solid var(--line-soft);
	padding: .5rem .6rem;
	vertical-align: top
}
.result th {
	background: #121212;
	color: var(--text);
	text-align: left
}
.material-symbols-outlined {
	font-size: 1.15rem;
	line-height: 1;
	color: currentColor
}
/* ── Auth pages (login / register) ── */
.auth-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1;
	padding: 2rem 1rem;
}
/* ── Landing split layout (login left / resellers right) ── */
.landing-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.landing-inner {
    display: flex;
    align-items: center;        /* same Y axis — both columns vertically centred */
    gap: 3.5rem;                /* X-axis spacing between the two columns */
    width: 100%;
    max-width: 70%;
    box-sizing: border-box;
}

.landing-form-col {
    flex: 0 0 360px;            /* fixed width, never shrinks */
    max-width: 100%;
}

.landing-resellers-col {
    flex: 1;                    /* takes the remaining space */
    min-width: 0;               /* prevents overflow in flex */
}
.landing-form-col .auth-card {
	flex: 1;
}
.landing-resellers-col .group-box {
	flex: 1;
	margin: 0;
}
.auth-card {
	width: 100%;
	max-width: 400px;
}
.auth-brand {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.6rem;
	margin-bottom: 1.25rem;
}
.auth-brand img {
	max-width: 160px;
	width: 60%;
	height: auto;
	border-radius: var(--radius);
}
.auth-brand-title {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--text-muted);
	text-align: center;
	margin: 0;
}
.form-row--center {
	display: flex;
	justify-content: center;
	margin-top: .75rem;
	margin-bottom: .25rem;
}
.auth-split {
	display: flex;
	gap: 0.5rem;
	margin-top: 0.75rem;
}
.auth-split .btn-accent {
	flex: 1;
	min-width: 0;
	margin: 0;
}
.form-row-check {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-size: 0.875rem;
	color: var(--text-muted);
}
.form-row-check input[type="checkbox"] {
	width: 1rem;
	height: 1rem;
	flex-shrink: 0;
	accent-color: rgb(134,93,207);
	cursor: pointer;
}
.auth-footer {
	display: flex;
	justify-content: center;
	gap: 1.5rem;
	margin-top: 1rem;
	font-size: 0.85rem;
}
@media (max-width: 48rem) {
	.topnav {
		padding: 0.75rem 0 0;
	}
	.topnav-inner {
		max-width: 92%;
		padding: 0 0.25rem 0 0.6rem;
		overflow-x: auto;
	}
	.dashboard-container {
		max-width: 92%;
		padding: 1rem .85rem 2rem;
	}
	.support-grid {
		grid-template-columns: 1fr
	}
	.actions {
		gap: .6rem
	}
	.btn, .btn-ghost {
		width: 100%
	}
	.actions .btn {
		width: 100%
	}
	.actions .btn-accent {
    	width: auto;
    	margin: 0;
    	flex-shrink: 0;
	}
	.auth-wrap {
		align-items: flex-start;
		padding: 1.5rem 1rem 2rem;
	}
	.dashboard-grid,
	.actions-grid {
		grid-template-columns: 1fr;
	}
	.site-footer-inner {
		max-width: 92%;
	}
	.landing-wrap {
        align-items: flex-start;
        padding: 1.5rem 1rem 2rem;
    }
    .landing-inner {
        flex-direction: column;
        max-width: 92%;
        gap: 1.5rem;
    }
    .landing-form-col {
        flex: 0 0 auto;
        width: 100%;
    }
}
.table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--panel);
	border: 1px solid var(--line-soft);
	border-radius: var(--radius);
	overflow: hidden;
	font-size: .95rem;
}
.table thead th {
	background: rgba(255,255,255,0.02);
	color: var(--text-muted);
	text-align: left;
	font-weight: 700;
	padding: .75rem 1rem;
	border-bottom: 1px solid var(--line-soft);
}
.table tbody td {
	padding: .75rem 1rem;
	vertical-align: middle;
	border-top: 1px solid rgba(240,240,244,0.08);
}
.table tbody tr:nth-child(odd) {
	background: rgba(255,255,255,0.01);
}
.table tbody tr:hover {
	background: rgba(255,255,255,0.04);
}
.table td + td,.table th + th {
	border-left: 1px solid rgba(240,240,244,0.06);
}
.table.key-history th:nth-child(1),.table.key-history td:nth-child(1) {
	white-space: nowrap;
}
.table.key-history th:nth-child(2),.table.key-history td:nth-child(2) {
	white-space: nowrap;
}
.table.resellers td ul.list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}
.table.resellers td ul.list li a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	border: 1px solid var(--line-soft);
	border-radius: var(--radius);
	padding: .35rem .75rem;
	font-size: .9rem;
	font-weight: 600;
	color: rgb(97, 126, 182);
	background: transparent;
	transition: opacity .2s ease;
}
.table.resellers td ul.list li a:hover {
	background: rgb(34,34,34);
}
@media (max-width: 720px) {
	.table thead {
		display: none;
	}
	.table, .table tbody, .table tr, .table td {
		display: block;
		width: 100%;
	}
	.table tr {
		border-top: 1px solid var(--line-soft);
	}
	.table td {
		border-left: none;
		display: block;
		word-break: break-word;
		overflow-wrap: break-word;
	}
	.table td::before {
		content: attr(data-label);
		display: block;
		color: var(--text-muted);
		font-weight: 700;
		font-size: 0.75rem;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		margin-bottom: 0.2rem;
	}
}
.table-scroll { overflow-x: auto; width: 100%; }
/* ── Utilities ── */
.label-icon { display: flex; align-items: center; gap: .5rem; }
.label-icon svg, .label-icon .material-symbols-outlined { flex-shrink: 0; }
.action-card p strong { color: var(--text); }
.seo-kw { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.mt-sm { margin-top: .5rem; }
.action-form { display: flex; flex-direction: column; gap: .5rem; margin-top: .25rem; }
.status-text { margin: 0; font-size: .85rem; color: var(--text-muted); }
.link-inherit { color: inherit; text-decoration: none; }
.mt-1 { margin-top: 1rem; }
.mb-1 { margin-bottom: 1rem !important; }
.mb-lg { margin-bottom: 1.25rem; }
.slots-denom { font-size: 1.25rem; font-weight: 400; color: var(--text-muted); }
/* ── Ace-info page ── */
.step-list { display: flex; flex-direction: column; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.step { display: flex; gap: 1rem; align-items: flex-start; }
.step-num { flex-shrink: 0; width: 2rem; height: 2rem; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .85rem; color: #fff; background: var(--panel); border: 1px solid var(--line-soft); border-radius: var(--radius); }
.step-body { flex: 1; padding-top: .1rem; }
.step-title { font-weight: 700; margin: 0 0 .2rem; }
.step-desc { color: var(--text-muted); font-size: .92rem; line-height: 1.6; margin: 0; }
.step-desc code { background: rgba(255,255,255,.06); border: 1px solid var(--line-soft); border-radius: 4px; padding: .1rem .35rem; font-size: .88rem; font-family: monospace; }
.req-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: .75rem; }
.req-item { display: flex; align-items: flex-start; gap: .65rem; padding: .75rem; background: rgba(255,255,255,.02); border: 1px solid var(--line-soft); border-radius: var(--radius); }
.req-icon { flex-shrink: 0; color: var(--text-muted); }
.req-icon.ok { color: rgb(110,200,110); }
.req-icon.warn { color: rgb(200,160,80); }
.req-label { font-size: .9rem; font-weight: 700; margin: 0 0 .1rem; }
.req-sub { font-size: .82rem; color: var(--text-muted); margin: 0; }
.slots-display { align-content: center; text-align: center; padding: 1.5rem 1rem; }
.slots-display .slots-num { font-size: 2.5rem; font-weight: 700; line-height: 1; }
.slots-display .slots-label { font-size: .9rem; color: var(--text-muted); margin-top: .3rem; }
.warn-box { background: rgba(200,140,50,.08); border: 1px solid rgba(200,140,50,.3); border-radius: var(--radius); padding: .75rem 1rem; color: rgb(220,170,80); font-size: .9rem; display: flex; gap: .6rem; align-items: flex-start; }
.warn-box .material-symbols-outlined { flex-shrink: 0; font-size: 1.1rem; margin-top: .05rem; }
/* ── Reselling page ── */
.price-table { width: 100%; border-collapse: collapse; font-size: .93rem; }
.price-table th { text-align: left; padding: .5rem .6rem; color: var(--text-muted); font-weight: 700; border-bottom: 1px solid var(--line-soft); }
.price-table td { padding: .5rem .6rem; border-top: 1px solid rgba(240,240,244,.06); }
.price-table tr.total-row td { font-weight: 700; border-top: 1px solid var(--line-soft); padding-top: .75rem; }
.price-table tr.currency-row td { color: var(--text-muted); font-size: .85rem; }
.price-tag { font-size: 1.5rem; font-weight: 700; line-height: 1; }
.price-sub { font-size: .8rem; color: var(--text-muted); margin-top: .15rem; }
.product-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.product-card { border: 1px solid var(--line-soft); border-radius: var(--radius); padding: 1rem; }
.product-name { font-weight: 700; font-size: .95rem; margin: 0 0 .2rem; }
.product-price { font-size: .85rem; color: var(--text-muted); margin: 0 0 .75rem; }
.discount-bar-wrap { height: 6px; background: rgba(255,255,255,.06); border-radius: 99px; overflow: hidden; margin: .75rem 0 .25rem; }
.discount-bar { height: 100%; background: var(--accent-grad); border-radius: 99px; transition: width .2s ease; width: 0%; }
.discount-label { font-size: .8rem; color: var(--text-muted); display: flex; justify-content: space-between; }
.info-row { display: flex; align-items: center; gap: .5rem; font-size: .85rem; color: var(--text-muted); padding: .4rem 0; border-bottom: 1px solid rgba(240,240,244,.05); }
.info-row:last-child { border-bottom: none; }
.info-row strong { color: var(--text); margin-left: auto; }
/* ── Site footer ── */
.site-footer {
	border-top: 1px solid var(--line-strong);
	padding: 1.25rem 0 1.75rem;
	margin-top: 1rem;
}
.site-footer-inner {
	box-sizing: border-box;
	max-width: 70%;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	gap: 1.5rem;
	font-size: .82rem;
	color: var(--text-muted);
}
.site-footer-inner a { color: var(--text-muted); text-decoration: none; }
.site-footer-inner a:hover { color: var(--text); }
/* ── Password reveal ── */
.input-wrap { position: relative; display: flex; align-items: center; }
.input-wrap .form-control { padding-right: 2.5rem; }
.input-reveal {
	position: absolute;
	right: .6rem;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	padding: 0;
	color: rgb(134,138,150);
	cursor: pointer;
	display: flex;
	align-items: center;
	font-size: 1.1rem;
	line-height: 1;
}
.input-reveal:hover { color: var(--text); }
.input-reveal .material-symbols-outlined { font-size: 1.1rem; }
/* ── Login accent nav-link ── */
.nav-link--accent {
	background: rgba(110,85,195,0.1);
	border: 1px solid rgba(110,85,195,0.25);
	color: rgb(175,155,255);
}
.nav-link--accent:hover {
	background: rgba(110,85,195,0.18);
	color: rgb(200,185,255);
}
/* ── Form hint (no-account text) ── */
.form-hint {
	font-size: .82rem;
	color: var(--text-muted);
	text-align: center;
	margin: .5rem 0 0;
}
.form-hint a { color: var(--text-muted); text-decoration: underline; }
/* ── Background glow ── */
body::before {
	content: '';
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: -1;
	background:
		radial-gradient(ellipse 55% 45% at 8% 15%, rgba(90,80,185,0.13) 0%, transparent 100%),
		radial-gradient(ellipse 50% 40% at 92% 85%, rgba(134,93,207,0.11) 0%, transparent 100%),
		radial-gradient(ellipse 38% 32% at 52% 52%, rgba(110,85,192,0.07) 0%, transparent 100%);
}
/* ── Version tags (reseller sells badges) ── */
.version-tag {
	display: inline-block;
	font-size: .72rem;
	padding: 2px 7px;
	border-radius: 4px;
	background: rgba(110,85,195,.18);
	color: rgb(175,155,255);
	margin: 1px 2px 1px 0;
	white-space: nowrap;
}