:root {
	--nr-accent: #3d5afe;
	--nr-accent-2: #00c2a8;
	--nr-w: 1320px;
	--nr-font: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Noto Sans KR', system-ui, sans-serif;
	--nr-radius: 18px;
	--nr-radius-sm: 12px;
	--nr-ease: cubic-bezier(.2, .7, .2, 1);

	--nr-bg: #ffffff;
	--nr-bg-2: #f4f5f8;
	--nr-card: #ffffff;
	--nr-line: #e6e8ee;
	--nr-line-2: #d5d9e1;
	--nr-text: #0d1016;
	--nr-sub: #586071;
	--nr-mute: #8d95a3;
	--nr-inv: #0d1016;
	--nr-inv-text: #ffffff;
	--nr-glass: rgba(255, 255, 255, .78);
	--nr-shadow: 0 24px 60px -32px rgba(13, 16, 22, .35);
	--nr-hot: #f03e3e;
	--nr-accent-soft: color-mix(in srgb, var(--nr-accent) 11%, transparent);
	--nr-accent-line: color-mix(in srgb, var(--nr-accent) 35%, transparent);
	--nr-accent-ink: var(--nr-accent);
	color-scheme: light;
}

html[data-nr-mode="dark"] {
	--nr-bg: #090a0e;
	--nr-bg-2: #111319;
	--nr-card: #14171e;
	--nr-line: #232733;
	--nr-line-2: #313646;
	--nr-text: #f1f3f7;
	--nr-sub: #a2a9b8;
	--nr-mute: #6d7585;
	--nr-inv: #f1f3f7;
	--nr-inv-text: #090a0e;
	--nr-glass: rgba(9, 10, 14, .72);
	--nr-shadow: 0 24px 60px -30px rgba(0, 0, 0, .8);
	--nr-hot: #ff6b6b;
	--nr-accent-soft: color-mix(in srgb, var(--nr-accent) 20%, transparent);
	--nr-accent-line: color-mix(in srgb, var(--nr-accent) 50%, transparent);
	--nr-accent-ink: color-mix(in srgb, var(--nr-accent) 70%, #ffffff);
	color-scheme: dark;
}

html, body { background: var(--nr-bg); }
body { margin: 0; color: var(--nr-text); font-family: var(--nr-font); -webkit-font-smoothing: antialiased; word-break: keep-all; overflow-wrap: anywhere; }
body.color_scheme_dark, body.color_scheme_light { background: var(--nr-bg); }

/* 다크 모드: 회원 스킨(로그인 · 계정 찾기 · 가입)은 data-theme 로 색을 가르므로 나래 모드에 맞춰 토큰을 넘겨 준다 */
html[data-nr-mode="dark"] .xm, html[data-nr-mode="dark"] .nr-content {
	--zm-brand: var(--nr-accent);
	--zm-brand-hover: color-mix(in srgb, var(--nr-accent) 86%, #000);
	--zm-brand-soft: color-mix(in srgb, var(--nr-accent) 20%, transparent);
	--zm-bg: var(--nr-card);
	--zm-surface: var(--nr-bg-2);
	--zm-text: var(--nr-text);
	--zm-text-sub: var(--nr-sub);
	--zm-border: var(--nr-line-2);
	--zm-line-strong: var(--nr-line-2);
}
html[data-nr-mode="dark"] .xm, html[data-nr-mode="dark"] .xm h1, html[data-nr-mode="dark"] .xm h2, html[data-nr-mode="dark"] .xm h3,
html[data-nr-mode="dark"] .xm label, html[data-nr-mode="dark"] .xm p, html[data-nr-mode="dark"] .xm dt, html[data-nr-mode="dark"] .xm dd { color: var(--nr-text); }
html[data-nr-mode="dark"] .xm input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]), html[data-nr-mode="dark"] .xm select, html[data-nr-mode="dark"] .xm textarea { color: var(--nr-text); background-color: var(--nr-card); border-color: var(--nr-line-2); }
html[data-nr-mode="dark"] .xm input::placeholder, html[data-nr-mode="dark"] .xm textarea::placeholder { color: var(--nr-mute); opacity: 1; }
html[data-nr-mode="dark"] .xm a:not(.btn) { color: var(--nr-sub); }
html[data-nr-mode="dark"] .xm a:not(.btn):hover { color: var(--nr-text); }
html[data-nr-mode="dark"] .xm .btn:not(.btn-primary):not([type="submit"]), html[data-nr-mode="dark"] .xm button:not(.btn):not(.text) { background: color-mix(in srgb, var(--nr-card) 88%, #fff); border-color: var(--nr-line-2); color: var(--nr-text); }
html[data-nr-mode="dark"] .xm .btn:not(.btn-primary):not([type="submit"]):hover, html[data-nr-mode="dark"] .xm button:not(.btn):not(.text):hover { background: color-mix(in srgb, var(--nr-card) 80%, #fff); border-color: var(--nr-accent); color: var(--nr-text); }
html[data-nr-mode="dark"] .xm .help-block, html[data-nr-mode="dark"] .xm .help-inline, html[data-nr-mode="dark"] .xm small { color: var(--nr-sub); }

.nr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 20px; border: 1px solid transparent; border-radius: 999px; font: 700 15px/1 var(--nr-font); letter-spacing: -.01em; text-decoration: none !important; cursor: pointer; white-space: nowrap; transition: transform .2s var(--nr-ease), background .2s, color .2s, border-color .2s, box-shadow .2s; }
.nr-btn:hover { transform: translateY(-2px); }
.nr-btn:active { transform: translateY(0); }
.nr-btn-lg { min-height: 56px; padding: 0 28px; font-size: 16.5px; }
.nr-btn-sm { min-height: 36px; padding: 0 14px; font-size: 13.5px; }
.nr-btn-accent { background: var(--nr-accent); color: #fff !important; box-shadow: 0 12px 30px -14px var(--nr-accent); }
.nr-btn-accent:hover { box-shadow: 0 18px 40px -14px var(--nr-accent); }
.nr-btn-ink { background: var(--nr-inv); color: var(--nr-inv-text) !important; }
.nr-btn-line { border-color: var(--nr-line-2); background: transparent; color: var(--nr-text) !important; }
.nr-btn-line:hover { border-color: var(--nr-text); }
.nr-btn-ghost { border-color: color-mix(in srgb, currentColor 30%, transparent); background: transparent; color: inherit !important; }
.nr-btn-ghost:hover { border-color: currentColor; }
.nr-btn-light { background: #fff; color: #0d1016 !important; }

.nr-badge { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; background: var(--nr-accent-soft); color: var(--nr-accent-ink); font-size: 12.5px; font-weight: 800; font-style: normal; letter-spacing: -.01em; }
.nr-badge.is-hot { background: color-mix(in srgb, var(--nr-hot) 14%, transparent); color: var(--nr-hot); }
.nr-badge.is-off { background: var(--nr-bg-2); color: var(--nr-mute); }

.nr-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.nr-chips button, .nr-chips a { height: 40px; padding: 0 16px; border: 1px solid var(--nr-line); border-radius: 999px; background: var(--nr-card); color: var(--nr-sub); font: 700 14px/1 var(--nr-font); text-decoration: none; cursor: pointer; display: inline-flex; align-items: center; transition: all .18s; }
.nr-chips button:hover, .nr-chips a:hover { border-color: var(--nr-text); color: var(--nr-text); }
.nr-chips .is-on { background: var(--nr-inv) !important; border-color: var(--nr-inv) !important; color: var(--nr-inv-text) !important; }

.nr-orb { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .55; pointer-events: none; will-change: transform; }
.nr-orb-1 { width: 46vw; height: 46vw; max-width: 720px; max-height: 720px; left: -8%; top: -20%; background: var(--nr-accent); animation: nr-float-a 18s ease-in-out infinite alternate; }
.nr-orb-2 { width: 38vw; height: 38vw; max-width: 600px; max-height: 600px; right: -6%; top: 10%; background: var(--nr-accent-2); animation: nr-float-b 22s ease-in-out infinite alternate; }
.nr-orb-3 { width: 28vw; height: 28vw; max-width: 460px; max-height: 460px; left: 38%; bottom: -24%; background: color-mix(in srgb, var(--nr-accent) 50%, var(--nr-accent-2)); animation: nr-float-a 26s ease-in-out infinite alternate-reverse; }
html[data-nr-mode="dark"] .nr-orb { opacity: .42; }
@keyframes nr-float-a { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(8vw, 6vh, 0) scale(1.15); } }
@keyframes nr-float-b { from { transform: translate3d(0, 0, 0) scale(1.05); } to { transform: translate3d(-10vw, 8vh, 0) scale(.9); } }

@media (prefers-reduced-motion: reduce) {
	.nr-orb { animation: none !important; }
	.nr-ticker-track { animation-duration: 90s !important; }
	[data-nr-reveal], .nr-hero-title .nr-line, .nr-hero-text, .nr-hero-btns { opacity: 1 !important; transform: none !important; animation: none !important; }
	.nr-live i::after { animation: none !important; }
}