/*!
 * KO4FUN — premium dark MMORPG theme for Invision Community 5 (4ACS Interactive)
 * Loaded on every front-end page by the ko4fun Loader extension.
 * Targets IC5's real classes (captured from the live site) and IC5 theme variables; every custom class is prefixed kr.
 */

@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700;800;900&family=Inter:wght@400;500;600;700&display=swap");

/* ============================================================== tokens */
body.ipsApp {
	/* palette matched to ko4fun.net: slate-charcoal surfaces, red actions, gold accents */
	--kr-accent: #d4af37;
	--kr-accent-bright: #ffd700;
	--kr-accent-soft: #ffe44d;
	--kr-accent-deep: #b8860b;
	--kr-red: #f8312f;
	--kr-red-deep: #c82828;
	--kr-bg: #141416;
	--kr-bg-2: #1a1b1f;
	--kr-bg-3: #212129;
	--kr-bg-4: #2a2a34;
	--kr-fg: #e8e8ea;
	--kr-fg-soft: #cccccc;
	--kr-fg-muted: #a2adb8;
	--kr-fg-dim: #8b8b8b;
	--kr-line: #2a2a34;
	--kr-line-strong: #333240;
	--kr-online: #22c55e;
	--kr-serif: Cinzel, Georgia, "Times New Roman", serif;
	--kr-sans: Inter, Roboto, "Segoe UI", Arial, sans-serif;
	--kr-shadow: 0 24px 48px rgba(0, 0, 0, 0.42);
	--kr-radius: 0px;
}

/* IC5 theme variables: obsidian surfaces, gold primary, no rounded corners */
body.ipsApp {
	--i-body--ba-co: var(--kr-bg);
	--i-background_1: var(--kr-bg);
	--i-background_2: var(--kr-bg-2);
	--i-background_3: var(--kr-bg-3);
	--i-background_4: var(--kr-bg-4);
	--i-background_5: #333240;
	--i-background_6: #3b3a4a;
	--i-box--ba-co: #1a1b1f;
	--i-box--bo-co: var(--kr-line);
	--i-box--bo-ra: var(--kr-radius);
	--i-color: var(--kr-fg);
	--i-color_hard: #ffffff;
	--i-color_soft: var(--kr-fg-soft);
	--i-color_root: var(--kr-fg);
	--i-primary: var(--kr-red);
	--i-primary-contrast: #ffffff;
	--i-secondary: var(--kr-accent);
	--i-secondary-contrast: #1a1405;
	--i-link: var(--kr-accent-bright);
	--i-font-family: var(--kr-sans);
	--i-headerPrimary--ba-co: #1d1d1d;
	--i-headerPrimary--co: var(--kr-fg-soft);
	--i-headerSecondary--ba-co: #1a1b1f;
	--i-headerSecondary--co: var(--kr-fg-muted);
	--i-footer--ba-co: #0d0d0d;
	--i-footer--co: var(--kr-fg-dim);
	--i-boxHeader--co: var(--kr-fg);
	--i-design-radius: 0px;
}

/* ============================================================== atmosphere */
body.ipsApp {
	background-color: var(--kr-bg);
	background-image:
		radial-gradient(1400px 600px at 50% -200px, rgba(49, 162, 166, 0.10), transparent 60%),
		radial-gradient(900px 500px at 0% 30%, rgba(248, 49, 47, 0.10), transparent 60%),
		radial-gradient(900px 500px at 100% 70%, rgba(45, 41, 64, 0.45), transparent 60%);
	background-attachment: fixed;
	color: var(--kr-fg);
	font-family: var(--kr-sans);
}
body.ipsApp::before {
	content: "";
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	opacity: 0.35;
	background-image:
		repeating-linear-gradient(135deg, rgba(255,255,255,0.012) 0 2px, transparent 2px 9px),
		repeating-linear-gradient(45deg, rgba(0,0,0,0.25) 0 1px, transparent 1px 7px);
}
body.ipsApp .ipsLayout { position: relative; z-index: 1; }

/* ============================================================== typography helpers */
body.ipsApp .krGold, body.ipsApp .krGoldText {
	background: linear-gradient(180deg, #fff6c2 0%, var(--kr-accent-bright) 40%, var(--kr-accent-deep) 72%, var(--kr-accent) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	filter: drop-shadow(0 0 10px color-mix(in srgb, var(--kr-accent) 30%, transparent));
}
body.ipsApp .krGoldText { filter: none; }
body.ipsApp .krFrame { position: relative; }
body.ipsApp .krFrame::before, body.ipsApp .krFrame::after { content: ""; position: absolute; width: 18px; height: 18px; border-color: var(--kr-accent); border-style: solid; opacity: 0.9; pointer-events: none; }
body.ipsApp .krFrame::before { top: -1px; left: -1px; border-width: 1.5px 0 0 1.5px; }
body.ipsApp .krFrame::after { bottom: -1px; right: -1px; border-width: 0 1.5px 1.5px 0; }
body.ipsApp .krGlow { box-shadow: 0 0 0 1px color-mix(in srgb, var(--kr-accent) 35%, transparent), 0 0 24px color-mix(in srgb, var(--kr-accent) 18%, transparent); }
body.ipsApp .krDot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--kr-online); box-shadow: 0 0 10px var(--kr-online); }
body.ipsApp .krDot--soon { background: var(--kr-accent); box-shadow: 0 0 10px var(--kr-accent); }
body.ipsApp .krDot--maintenance { background: #f0a24a; box-shadow: 0 0 10px #f0a24a; }
body.ipsApp .krDot--closed { background: #8a4a4a; box-shadow: none; }

/* buttons */
body.ipsApp .krBtn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	height: 44px; padding: 0 22px;
	font-family: var(--kr-serif); font-weight: 700; font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase;
	text-decoration: none; line-height: 1; white-space: nowrap; cursor: pointer;
	border: 1px solid rgba(255,255,255,0.18); color: var(--kr-fg); background: rgba(0,0,0,0.3);
	transition: transform 120ms ease, box-shadow 160ms ease, background 160ms ease;
}
body.ipsApp .krBtn:hover { text-decoration: none; transform: translateY(-1px); }
body.ipsApp .krBtn--gold, body.ipsApp .krBtn--primary {
	color: #ffffff; border-color: transparent;
	background: linear-gradient(135deg, #ff4540, var(--kr-red) 40%, var(--kr-red-deep));
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.28), inset 0 -2px 0 rgba(0,0,0,0.3), 0 12px 30px rgba(248, 49, 47, 0.32);
	text-shadow: 0 1px 0 rgba(0,0,0,0.3);
}
body.ipsApp .krBtn--gold:hover, body.ipsApp .krBtn--primary:hover { filter: brightness(1.08); }
body.ipsApp .krBtn--goldsolid {
	color: #1a1405; border-color: transparent;
	background: linear-gradient(90deg, var(--kr-accent-soft), var(--kr-accent-bright), var(--kr-accent-deep), var(--kr-accent-bright));
	background-size: 200% auto; animation: krShimmer 6s linear infinite;
}
body.ipsApp .krBtn--outline { border-color: color-mix(in srgb, var(--kr-accent) 60%, transparent); color: var(--kr-accent); background: transparent; }
body.ipsApp .krBtn--outline:hover { background: color-mix(in srgb, var(--kr-accent) 10%, transparent); }
body.ipsApp .krBtn--ghost { border-color: rgba(255,255,255,0.22); }
body.ipsApp .krBtn--block { display: flex; width: 100%; }
@keyframes krShimmer { 0% { background-position: 0% 50%; } 100% { background-position: 200% 50%; } }

/* ============================================================== header */
body.ipsApp .ipsHeader {
	background: radial-gradient(ellipse farthest-corner at center 0, rgba(49,162,166,0.18) -150%, #333240 45%, #2a2a34 100%);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border-bottom: 1px solid color-mix(in srgb, var(--kr-accent) 40%, transparent);
	box-shadow: 0 10px 40px rgba(0,0,0,0.4);
}
body.ipsApp .ipsHeader__primary { min-height: 84px; }
body.ipsApp .ipsHeader__secondary { border-top: 1px solid var(--kr-line); }

/* logo: text logo becomes a gold wordmark with the wordmark */
body.ipsApp .ipsLogo { text-decoration: none; }
body.ipsApp .ipsLogo__text { display: flex; align-items: center; gap: 14px; }
body.ipsApp .ipsLogo__name {
	font-family: var(--kr-serif); font-weight: 800; font-size: 26px; letter-spacing: 0.18em; line-height: 1;
	background: linear-gradient(180deg, #fff6c2 0%, var(--kr-accent-bright) 40%, var(--kr-accent-deep) 72%, var(--kr-accent) 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
	filter: drop-shadow(0 0 10px color-mix(in srgb, var(--kr-accent) 30%, transparent));
}
body.ipsApp .ipsLogo__slogan { font-family: var(--kr-sans); font-size: 10px; letter-spacing: 0.42em; text-transform: uppercase; color: var(--kr-fg-muted); margin-top: 4px; }

/* navigation */
body.ipsApp .ipsNavBar__item > a, body.ipsApp .ipsNavBar__item > button { font-family: var(--kr-serif); font-weight: 600; font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--kr-fg-soft); }
body.ipsApp .ipsNavBar__item > a:hover, body.ipsApp .ipsNavBar__item > button:hover { color: #ffffff; }
body.ipsApp .ipsNavBar__item[data-active] > a, body.ipsApp .ipsNavBar__item.ipsNavBar__item--active > a { color: var(--kr-accent-bright); }
body.ipsApp .ipsNavBar__item[data-active] > a::after, body.ipsApp .ipsNavBar__item.ipsNavBar__item--active > a::after {
	content: ""; display: block; height: 1px; margin-top: 6px;
	background: linear-gradient(90deg, transparent, var(--kr-accent), transparent);
}
body.ipsApp .ipsNavBar__icon { color: var(--kr-accent); }
body.ipsApp .ipsUserNav__link { color: var(--kr-fg-soft); }
body.ipsApp .ipsUserNav__link:hover { color: var(--kr-accent); }
body.ipsApp .ipsUserNav__link--sign-up, body.ipsApp .ipsUserNav__link--sign-up:hover {
	border: 0; border-radius: 0;
	background: linear-gradient(135deg, #ff4540, var(--kr-red) 40%, var(--kr-red-deep));
	color: #ffffff !important;
	font-family: var(--kr-serif); letter-spacing: 0.14em; text-transform: uppercase; font-size: 12px; font-weight: 700;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.28), inset 0 -2px 0 rgba(0,0,0,0.3), 0 8px 22px rgba(248, 49, 47, 0.32);
}
body.ipsApp .ipsUserNav__link--sign-up .ipsUserNav__text, body.ipsApp .ipsUserNav__link--sign-up span, body.ipsApp .ipsUserNav__link--sign-up i { color: #ffffff !important; opacity: 1; }
body.ipsApp .ipsUserNav__link--sign-in, body.ipsApp .ipsUserNav__link--login { border: 1px solid color-mix(in srgb, var(--kr-accent) 60%, transparent); color: var(--kr-accent); font-family: var(--kr-serif); letter-spacing: 0.14em; text-transform: uppercase; font-size: 12px; font-weight: 700; }
body.ipsApp .ipsUserPhoto { box-shadow: 0 0 0 2px var(--kr-bg), 0 0 0 3.5px color-mix(in srgb, var(--kr-accent) 70%, transparent); }

/* breadcrumb */
body.ipsApp .ipsBreadcrumb { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--kr-fg-muted); }
body.ipsApp .ipsBreadcrumb a { color: var(--kr-fg-muted); }
body.ipsApp .ipsBreadcrumb a:hover { color: var(--kr-accent); }

/* ============================================================== boxes, widgets, page headers */
body.ipsApp .ipsBox, body.ipsApp .ipsWidget {
	position: relative;
	border: 1px solid var(--kr-line);
	border-radius: 0;
	background: linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.012));
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), var(--kr-shadow);
}
body.ipsApp .ipsBox::before, body.ipsApp .ipsBox::after, body.ipsApp .ipsWidget::before, body.ipsApp .ipsWidget::after {
	content: ""; position: absolute; width: 16px; height: 16px; border-color: var(--kr-accent); border-style: solid; opacity: 0.75; pointer-events: none; z-index: 2;
}
body.ipsApp .ipsBox::before, body.ipsApp .ipsWidget::before { top: -1px; left: -1px; border-width: 1.5px 0 0 1.5px; }
body.ipsApp .ipsBox::after, body.ipsApp .ipsWidget::after { bottom: -1px; right: -1px; border-width: 0 1.5px 1.5px 0; }

body.ipsApp .ipsBox__header, body.ipsApp .ipsWidget__header {
	background: linear-gradient(90deg, color-mix(in srgb, var(--kr-accent) 12%, transparent), transparent 70%);
	border-bottom: 1px solid color-mix(in srgb, var(--kr-accent) 28%, transparent);
}
body.ipsApp .ipsBox__header h2, body.ipsApp .ipsBox__header h3, body.ipsApp .ipsWidget__header h3, body.ipsApp .ipsBox__header .ipsTitle {
	font-family: var(--kr-serif); font-weight: 700; font-size: 15px; letter-spacing: 0.16em; text-transform: uppercase;
	background: linear-gradient(180deg, #fff6c2 0%, var(--kr-accent-bright) 40%, var(--kr-accent-deep) 72%, var(--kr-accent) 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
body.ipsApp .ipsBox__header-toggle { color: var(--kr-accent); }

body.ipsApp .ipsPageHeader { border-bottom: 1px solid var(--kr-line); background: linear-gradient(90deg, rgba(120,70,20,0.16), transparent 60%); }
body.ipsApp .ipsPageHeader__title h1, body.ipsApp .ipsPageHeader__title .ipsTitle, body.ipsApp h1.ipsTitle {
	font-family: var(--kr-serif); font-weight: 800; letter-spacing: 0.02em;
	background: linear-gradient(180deg, #fff6c2 0%, var(--kr-accent-bright) 40%, var(--kr-accent-deep) 72%, var(--kr-accent) 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ============================================================== forum index rows */
body.ipsApp .ipsData--forum-category .ipsData__item, body.ipsApp .ipsData--table .ipsData__item { border-color: var(--kr-line); }
body.ipsApp .ipsData__item { position: relative; transition: background 160ms ease; }
body.ipsApp .ipsData__item:hover { background: rgba(248, 49, 47, 0.06); }
body.ipsApp .ipsData__item:hover::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--kr-red); box-shadow: 0 0 12px var(--kr-red); z-index: 1; }
body.ipsApp .ipsData__title h4, body.ipsApp .ipsData__title a { font-family: var(--kr-serif); font-weight: 700; font-size: 15px; letter-spacing: 0.04em; color: #ffffff; }
body.ipsApp .ipsData__title a:hover { color: var(--kr-accent); }
body.ipsApp .ipsData__desc { color: var(--kr-fg-muted); }
body.ipsApp .ipsData__icon { border-radius: 50%; padding: 2px; background: conic-gradient(from 0deg, var(--kr-accent), transparent 40%, var(--kr-accent) 70%, transparent); }
body.ipsApp .ipsData__icon > *, body.ipsApp .ipsData__icon img { border-radius: 50%; background: var(--kr-bg-3); }
body.ipsApp .ipsData__stats { font-family: var(--kr-serif); font-weight: 700; }
body.ipsApp .ipsData__stats-label { font-family: var(--kr-sans); font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; font-size: 10px; color: var(--kr-fg-dim); }
body.ipsApp .ipsData__last-primary a { color: var(--kr-fg); }
body.ipsApp .ipsData__last-secondary { color: var(--kr-fg-dim); }
body.ipsApp .ipsData__category a { color: var(--kr-accent); letter-spacing: 0.12em; text-transform: uppercase; font-size: 10px; }

/* badges */
body.ipsApp .ipsBadge { border-radius: 0; font-family: var(--kr-serif); font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; font-size: 10px; }
body.ipsApp .ipsBadge--pinned, body.ipsApp .ipsBadge--featured { background: color-mix(in srgb, var(--kr-accent) 18%, transparent); color: var(--kr-accent); border: 1px solid color-mix(in srgb, var(--kr-accent) 50%, transparent); }

/* ============================================================== buttons (IC5) */
body.ipsApp .ipsButton { border-radius: 0; font-family: var(--kr-serif); font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; font-size: 12px; }
body.ipsApp .ipsButton--primary {
	color: #ffffff !important; border: 0;
	background: linear-gradient(135deg, #ff4540, var(--kr-red) 40%, var(--kr-red-deep));
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.28), inset 0 -2px 0 rgba(0,0,0,0.3), 0 10px 26px rgba(248, 49, 47, 0.3);
}
body.ipsApp .ipsButton--primary:hover { filter: brightness(1.06); }
body.ipsApp .ipsButton--secondary, body.ipsApp .ipsButton--soft, body.ipsApp .ipsButton--inherit { border: 1px solid rgba(255,255,255,0.18); background: rgba(0,0,0,0.3); color: var(--kr-fg); }
body.ipsApp .ipsButton--follow { border: 1px solid color-mix(in srgb, var(--kr-accent) 60%, transparent); color: var(--kr-accent); background: transparent; }

/* inputs */
body.ipsApp .ipsInput, body.ipsApp input.ipsInput--text, body.ipsApp .ipsInput--text { border-radius: 0; border-color: var(--kr-line-strong); background: rgba(0,0,0,0.35); color: var(--kr-fg); }
body.ipsApp .ipsInput:focus, body.ipsApp .ipsInput--text:focus { border-color: var(--kr-accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--kr-accent) 25%, transparent); }

/* ============================================================== topic view */
body.ipsApp .ipsEntry { border: 1px solid var(--kr-line); background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01)); box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), var(--kr-shadow); }
body.ipsApp .ipsEntry--topic:first-child, body.ipsApp .ipsEntry[data-first-post] { border-color: color-mix(in srgb, var(--kr-accent) 30%, transparent); }
body.ipsApp .ipsEntry__author-column { background: rgba(0,0,0,0.25); border-right: 1px solid var(--kr-line); }
body.ipsApp .ipsEntry__author-column .ipsUserPhoto { box-shadow: 0 0 0 3px var(--kr-bg-3), 0 0 0 5px var(--kr-accent), 0 0 26px color-mix(in srgb, var(--kr-accent) 35%, transparent); }
body.ipsApp .ipsEntry__username, body.ipsApp .ipsEntry__username a { font-family: var(--kr-serif); font-weight: 700; letter-spacing: 0.06em; color: #f4efe3; }
body.ipsApp .ipsEntry__group { font-family: var(--kr-serif); font-weight: 700; font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; color: #1a1405; background: linear-gradient(90deg, var(--kr-accent-soft), var(--kr-accent)); padding: 4px 14px; clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 8px 100%, 0 50%); }
body.ipsApp .ipsEntry__meta { border-bottom: 1px solid var(--kr-line); color: var(--kr-fg-dim); font-size: 12px; }
body.ipsApp .ipsRichText { color: #d6d6da; font-size: 15px; line-height: 1.6; }
body.ipsApp .ipsRichText h1, body.ipsApp .ipsRichText h2, body.ipsApp .ipsRichText h3 { font-family: var(--kr-serif); letter-spacing: 0.04em; }
body.ipsApp .ipsRichText a { color: var(--kr-accent); }
body.ipsApp .ipsRichText blockquote { border-left: 3px solid var(--kr-accent); background: color-mix(in srgb, var(--kr-accent) 8%, transparent); }
body.ipsApp .ipsRichText__table-wrapper table { border-color: var(--kr-line-strong); }

/* ============================================================== footer */
body.ipsApp .ipsFooter { border-top: 1px solid var(--kr-line); background: linear-gradient(180deg, transparent, rgba(0,0,0,0.55)); position: relative; }
body.ipsApp .ipsFooter::before { content: ""; position: absolute; left: 10%; right: 10%; top: -1px; height: 1px; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--kr-accent) 55%, transparent), transparent); }
body.ipsApp .ipsFooterLinks a { color: var(--kr-fg-dim); font-size: 12px; letter-spacing: 0.1em; }
body.ipsApp .ipsFooterLinks a:hover { color: var(--kr-accent); }
body.ipsApp .ipsCopyright { color: var(--kr-fg-dim); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; }

/* ============================================================== HERO widget */
body.ipsApp .krHero { position: relative; margin: 0 0 28px; border: 1px solid var(--kr-line); background: var(--kr-bg-2); box-shadow: var(--kr-shadow); overflow: hidden; }

body.ipsApp .krStrip { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 26px; min-height: 38px; padding: 6px 24px; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--kr-fg-muted); border-bottom: 1px solid var(--kr-line); background: rgba(0,0,0,0.35); }
body.ipsApp .krStrip__group { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 26px; }
body.ipsApp .krStrip__item { display: inline-flex; align-items: center; gap: 8px; color: var(--kr-fg-muted); text-decoration: none; white-space: nowrap; }
body.ipsApp .krStrip__item--notice, body.ipsApp .krStrip__item--notice a { color: var(--kr-accent); }
body.ipsApp .krStrip__item--soon .krDot { background: var(--kr-accent); box-shadow: 0 0 10px var(--kr-accent); }
body.ipsApp .krStrip__item--maintenance .krDot { background: #f0a24a; box-shadow: 0 0 10px #f0a24a; }
body.ipsApp .krStrip__item--closed .krDot { background: #8a4a4a; box-shadow: none; }
body.ipsApp .krStrip__group--links a:hover { color: var(--kr-accent); }

body.ipsApp .krSlider { position: relative; min-height: 420px; }
body.ipsApp .krSlide { position: absolute; inset: 0; display: flex; align-items: center; opacity: 0; visibility: hidden; transition: opacity 700ms ease, visibility 0s linear 700ms; }
body.ipsApp .krSlide.is-active { position: relative; opacity: 1; visibility: visible; transition: opacity 700ms ease; }
body.ipsApp .krSlide__art {
	position: absolute; inset: 0;
	background-image: linear-gradient(90deg, rgba(20,20,22,0.94) 0%, rgba(20,20,22,0.6) 45%, rgba(20,20,22,0.15) 100%), linear-gradient(180deg, rgba(20,20,22,0) 40%, var(--kr-bg-2) 100%), var(--kr-slide-image, radial-gradient(700px 320px at 22% 60%, rgba(248, 49, 47, 0.28), transparent 65%)), radial-gradient(900px 400px at 70% 20%, rgba(45, 41, 64, 0.6), transparent 65%), linear-gradient(120deg, #1a1a22, #141416 60%, #0d0b14);
	background-size: cover, cover, cover, cover, cover; background-position: center;
	transform: scale(1.04); transition: transform 8s ease;
}
body.ipsApp .krSlide.is-active .krSlide__art { transform: scale(1); }
body.ipsApp .krSlide__embers { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
body.ipsApp .krSlide__embers i { position: absolute; bottom: 30px; width: 4px; height: 4px; border-radius: 50%; background: #ffe9a8; box-shadow: 0 0 10px 2px color-mix(in srgb, var(--kr-accent) 80%, transparent); animation: krEmber 7s linear infinite; opacity: 0; }
body.ipsApp .krSlide__embers i:nth-child(1) { left: 12%; animation-delay: 0s; }
body.ipsApp .krSlide__embers i:nth-child(2) { left: 22%; animation-delay: 1.4s; animation-duration: 8s; }
body.ipsApp .krSlide__embers i:nth-child(3) { left: 31%; animation-delay: 2.8s; width: 3px; height: 3px; }
body.ipsApp .krSlide__embers i:nth-child(4) { left: 46%; animation-delay: 0.9s; animation-duration: 9s; }
body.ipsApp .krSlide__embers i:nth-child(5) { left: 58%; animation-delay: 3.6s; width: 3px; height: 3px; }
body.ipsApp .krSlide__embers i:nth-child(6) { left: 67%; animation-delay: 5s; animation-duration: 8.5s; }
body.ipsApp .krSlide__embers i:nth-child(7) { left: 76%; animation-delay: 2.2s; width: 5px; height: 5px; }
body.ipsApp .krSlide__embers i:nth-child(8) { left: 88%; animation-delay: 4.4s; }
@keyframes krEmber { 0% { transform: translateY(0) scale(1); opacity: 0; } 12% { opacity: 0.95; } 100% { transform: translateY(-300px) translateX(18px) scale(0.35); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { body.ipsApp .krSlide__embers i, body.ipsApp .krBtn--gold { animation: none; } }

body.ipsApp .krSlide__content { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 14px; max-width: 720px; padding: 56px 48px; }
body.ipsApp .krSlide__eyebrow { display: flex; align-items: center; gap: 14px; font-size: 11px; letter-spacing: 0.34em; text-transform: uppercase; color: var(--kr-accent); }
body.ipsApp .krSlide__eyebrow span { width: 36px; height: 1px; background: var(--kr-accent); }
body.ipsApp .krSlide__title { margin: 0; font-family: var(--kr-serif); font-weight: 800; font-size: clamp(30px, 4vw, 52px); line-height: 1.05; letter-spacing: 0.04em; }
body.ipsApp .krSlide__subtitle { font-family: var(--kr-serif); font-weight: 600; font-size: 18px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--kr-fg); }
body.ipsApp .krSlide__divider { display: flex; align-items: center; gap: 12px; width: 320px; max-width: 100%; }
body.ipsApp .krSlide__divider span:first-child { flex-grow: 1; height: 1px; background: linear-gradient(90deg, var(--kr-accent), transparent); }
body.ipsApp .krSlide__divider span:last-child { width: 60px; height: 1px; background: color-mix(in srgb, var(--kr-accent) 50%, transparent); }
body.ipsApp .krSlide__divider svg { fill: var(--kr-accent); flex-shrink: 0; }
body.ipsApp .krSlide__body { margin: 0; font-size: 15px; color: var(--kr-fg-soft); max-width: 560px; }
body.ipsApp .krSlide__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 8px; }
body.ipsApp .krSlide__actions .krBtn { height: 48px; padding: 0 30px; }

body.ipsApp .krCountdown { position: absolute; right: 48px; bottom: 44px; z-index: 1; display: grid; grid-template-columns: auto 1px auto 1px auto 1px auto; align-items: center; gap: 0 14px; padding: 16px 20px 12px; background: rgba(10,9,12,0.72); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
body.ipsApp .krCountdown__unit { display: flex; flex-direction: column; align-items: center; min-width: 64px; }
body.ipsApp .krCountdown__unit b { font-family: var(--kr-serif); font-weight: 800; font-size: 32px; line-height: 1; }
body.ipsApp .krCountdown__unit span { font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--kr-fg-muted); margin-top: 6px; }
body.ipsApp .krCountdown__sep { width: 1px; height: 40px; background: rgba(255,255,255,0.08); }
body.ipsApp .krCountdown__label { grid-column: 1 / -1; margin-top: 10px; text-align: center; font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--kr-fg-muted); }
body.ipsApp .krCountdown.is-open .krCountdown__label { color: var(--kr-online); }

body.ipsApp .krSlider__nav { position: absolute; left: 48px; bottom: 22px; z-index: 2; display: flex; gap: 8px; }
body.ipsApp .krSlider__dot { width: 28px; height: 3px; padding: 0; border: 0; background: rgba(255,255,255,0.2); cursor: pointer; transition: background 160ms ease; }
body.ipsApp .krSlider__dot.is-active { background: var(--kr-accent); box-shadow: 0 0 10px var(--kr-accent); }
body.ipsApp .krSlider__arrow { position: absolute; top: 50%; z-index: 2; transform: translateY(-50%); width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,0.15); background: rgba(0,0,0,0.4); color: var(--kr-fg); cursor: pointer; opacity: 0; transition: opacity 160ms ease; }
body.ipsApp .krHero:hover .krSlider__arrow { opacity: 1; }
body.ipsApp .krSlider__arrow--prev { left: 14px; } body.ipsApp .krSlider__arrow--next { right: 14px; }
body.ipsApp .krSlider__arrow:hover { border-color: var(--kr-accent); color: var(--kr-accent); }

body.ipsApp .krRibbon { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); border-top: 1px solid var(--kr-line); background: rgba(12,11,14,0.8); }
body.ipsApp .krRibbon__cell { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 16px 20px; border-right: 1px solid var(--kr-line); }
body.ipsApp .krRibbon__cell:last-child { border-right: 0; }
body.ipsApp .krRibbon__cell b { font-family: var(--kr-serif); font-weight: 800; font-size: 26px; white-space: nowrap; }
body.ipsApp .krRibbon__cell span { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--kr-fg-muted); }

/* ============================================================== sidebar panels (widgets) */
body.ipsApp .krPanel { display: flex; flex-direction: column; border: 1px solid var(--kr-line); background: linear-gradient(180deg, rgba(40,30,16,0.35), rgba(12,11,14,0.85)); }
body.ipsApp .krPanel__header { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid color-mix(in srgb, var(--kr-accent) 25%, transparent); font-family: var(--kr-serif); font-weight: 700; font-size: 13px; letter-spacing: 0.2em; text-transform: uppercase; }
body.ipsApp .krPanel__body { display: flex; flex-direction: column; gap: 14px; padding: 18px; }
body.ipsApp .krServer { display: flex; flex-direction: column; gap: 6px; }
body.ipsApp .krServer__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; }
body.ipsApp .krServer__row--date { padding-top: 4px; border-top: 1px solid var(--kr-line); }
body.ipsApp .krServer__name, body.ipsApp .krServer__name a { color: var(--kr-fg-soft); text-decoration: none; }
body.ipsApp .krServer__value { color: #f4efe3; font-weight: 600; text-align: right; }
body.ipsApp .krServer--closed .krServer__value { color: var(--kr-fg-dim); }
body.ipsApp .krServer--soon .krServer__value { color: var(--kr-accent); }
body.ipsApp .krServer__note { font-size: 11px; color: var(--kr-fg-dim); }
body.ipsApp .krBar { height: 5px; background: rgba(255,255,255,0.06); }
body.ipsApp .krBar__fill { height: 5px; background: linear-gradient(90deg, var(--kr-red-deep), var(--kr-red), #ffb3b1); box-shadow: 0 0 10px rgba(248, 49, 47, 0.55); transition: width 600ms ease; }
body.ipsApp .krServer--closed .krBar__fill, body.ipsApp .krServer--maintenance .krBar__fill { background: #5a4a3a; box-shadow: none; }

body.ipsApp .krCommunity { gap: 12px; padding: 18px; }
body.ipsApp .krCommunity__discord { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 18px; text-align: center; text-decoration: none; color: #8b9cff; background: linear-gradient(180deg, rgba(88,101,242,0.16), rgba(12,11,14,0.6)); border: 1px solid rgba(88,101,242,0.35); }
body.ipsApp .krCommunity__discord:hover { border-color: rgba(88,101,242,0.7); }
body.ipsApp .krCommunity__title { font-family: var(--kr-serif); font-weight: 700; font-size: 14px; letter-spacing: 0.14em; text-transform: uppercase; color: #f4efe3; }
body.ipsApp .krCommunity__stats { font-size: 12px; color: var(--kr-fg-muted); }
body.ipsApp .krCommunity__links { display: flex; flex-direction: column; gap: 8px; }

/* widgets wrapping our panels: remove the default widget padding so the frame is flush */
body.ipsApp .ipsWidget:has(> .ipsWidget__content--wrap > .ipsWidget__content > .krPanel), body.ipsApp .ipsWidget:has(.krHero) { background: transparent; border: 0; box-shadow: none; }
body.ipsApp .ipsWidget:has(.krPanel)::before, body.ipsApp .ipsWidget:has(.krPanel)::after, body.ipsApp .ipsWidget:has(.krHero)::before, body.ipsApp .ipsWidget:has(.krHero)::after { display: none; }
body.ipsApp .ipsWidget:has(.krPanel) .ipsWidget__content, body.ipsApp .ipsWidget:has(.krHero) .ipsWidget__content, body.ipsApp .ipsWidget:has(.krPanel) .ipsWidget__padding, body.ipsApp .ipsWidget:has(.krHero) .ipsWidget__padding { padding: 0; }
body.ipsApp .ipsWidget:has(.krPanel) > .ipsWidget__content--wrap > .ipsWidget__header, body.ipsApp .ipsWidget:has(.krHero) .ipsWidget__header { display: none; }

/* ============================================================== responsive */
@media (max-width: 979px) {
	body.ipsApp .krSlider { min-height: 0; }
	body.ipsApp .krSlide__content { padding: 40px 24px 28px; max-width: none; }
	body.ipsApp .krCountdown { position: static; margin: 0 24px 28px; grid-template-columns: repeat(4, 1fr); gap: 8px; }
	body.ipsApp .krCountdown__sep { display: none; }
	body.ipsApp .krCountdown__unit b { font-size: 26px; }
	body.ipsApp .krSlide.is-active { display: flex; flex-direction: column; align-items: stretch; }
	body.ipsApp .krSlider__nav { left: 24px; bottom: 12px; }
	body.ipsApp .krSlider__arrow { display: none; }
	body.ipsApp .krStrip { padding: 8px 16px; font-size: 10px; letter-spacing: 0.16em; }
	body.ipsApp .krStrip__group--links { display: none; }
	body.ipsApp .krRibbon__cell { flex-direction: column; gap: 4px; padding: 12px; border-right: 0; border-bottom: 1px solid var(--kr-line); }
	body.ipsApp .ipsHeader__primary { min-height: 64px; }
	body.ipsApp .ipsLogo__name { font-size: 20px; }
}
