/* Community arena — dark game interface. Loaded after layout and component styles. */
:root {
  color-scheme: dark;
  --bg: #0B0D12;
  --paper: #12151E;
  --ink: #F2F4F8;
  --muted: #9aa8bc;
  --line: #283344;
  --mint: #3DE8C6;
  --mint-soft: #17352f;
  --violet: #b49aff;
  --violet-soft: #29213d;
  --surface-raised: #192332;
  --surface-input: #0f1722;
  --text-soft: #bec9d8;
  --text-dim: #8392a9;
  --focus: #7cf8d0;
}
html, body { background: var(--bg); color: var(--ink); }
body { background-image: none; }
::selection { background: #285e50; color: #f1fff9; }
* { scrollbar-color: #3c4c64 #101722; scrollbar-width: thin; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #101722; }
::-webkit-scrollbar-thumb { background: #3c4c64; border: 2px solid #101722; border-radius: 8px; }
input, select, textarea, button { color-scheme: dark; }
input, textarea { caret-color: var(--mint); }
option, optgroup { background: #172130; color: var(--ink); }
input:-webkit-autofill { -webkit-text-fill-color: var(--ink); box-shadow: 0 0 0 1000px var(--surface-input) inset; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible { outline-color: var(--focus); }
.skip-link { background: var(--mint); color: #10251e; }
.prototype-notice { background: #111722; color: #98a6bc; border-bottom: 1px solid #202b3b; }
.prototype-notice i { background: var(--violet); }
.prototype-notice a:hover { color: var(--ink); }
.brand-header { background: #101620; border-color: #263140; }
.brand-mark { background: var(--mint); color: #10251e; }
.brand-service, .brand { color: var(--ink); }
.header-right a { color: var(--text-soft); }
.header-right a:hover { color: var(--mint); }
.brand-divider { background: #354154; }
.sidebar { background: #0f151f; border-color: #263140; }
.side-label, .side-nav a { color: #98a7bb; }
.side-nav a:hover { background: #192331; color: #e6eff9; }
.side-nav a.active { background: #18322d; color: var(--mint); }
.sidebar-bottom { color: #9babc0; border-color: var(--line); }
.sidebar-bottom a:hover { color: var(--mint); }
.breadcrumbs { color: #8494ac; }
.breadcrumbs span { color: #bdc9d9; }
.btn { background: #192332; border-color: #334157; color: #dce6f3; }
.btn:hover { background: #223146; border-color: #52637a; color: #f4f8ff; }
.btn-primary, .btn-mint { background: var(--mint); border-color: var(--mint); color: #10251e; box-shadow: 0 3px 14px #0000001a; }
.btn-primary:hover, .btn-mint:hover { background: #93f7d3; border-color: #93f7d3; color: #10251e; }
.btn-ghost { background: transparent; border-color: transparent; color: #a7b5c7; }
.btn-ghost:hover { background: #1b2735; border-color: #34435a; color: #edf4fc; }
.btn-danger { background: #ab394b; border-color: #c25164; color: #fff5f7; }
.btn-danger:hover { background: #c04459; border-color: #e07487; color: #fff; }
.link { color: #8be8c6; }
.pill { background: #202c3b; color: #b6c6da; }
.pill-mint { color: #80f0c6; background: #18362f; }
.pill-violet { color: #c3afff; background: #302743; }
.pill-warm { color: #edc27c; background: #392d1e; }
.pill-red { color: #ffacb8; background: #3b222d; }
.card, .feature, .collection-banner, .form-card, .resume-preview,
.waiting-card, .stat, .table-wrap, .empty-state, .login-card {
  background: var(--paper); border-color: var(--line);
}
.hero-stage { background: #142723; border: 1px solid #2b493e; }
.stage-grid { background-image: linear-gradient(#76c3a510 1px, transparent 1px), linear-gradient(90deg, #76c3a510 1px, transparent 1px); }
.stage-label { color: #8bb5a4; }
.mini-player { background: #17262a; border-color: #35574b; box-shadow: 0 15px 30px #00000026; }
.mini-player:nth-child(2) { background: #232334; border-color: #4d4164; }
.mini-player p { color: #b1becb; }
.mini-player .mini-stat { background: #30443f; }
.mini-player:nth-child(2) .mini-stat { background: #3b334b; }
.mini-stat:after { background: var(--mint); }
.mini-player:nth-child(2) .mini-stat:after { background: var(--violet); }
.vote-float { background: #0c1717; border: 1px solid #3e6355; color: #defff0; box-shadow: 0 10px 24px #00000030; }
.vote-float .icon { color: var(--mint); }
.progress { background: #263345; }
.feature .feature-icon { background: #1c3530; color: #84e5bf; }
.feature:nth-child(2) .feature-icon { background: #302743; color: #c4afff; }
.feature:nth-child(3) .feature-icon { background: #372d20; color: #ecc17c; }
.footnote, .footer-note { color: #8d9cb1; }
.form-step { color: #8c9bb1; }
.form-step i { border-color: #38465b; color: #9fadc2; background: #141e2b; }
.form-step.active { color: #e9f4fb; }
.form-step.active i { background: var(--mint); border-color: var(--mint); color: #112b20; }
.form-step.done { color: #8be5c1; }
.form-step.done i { background: #193a30; border-color: #3c795e; color: #8be5c1; }
.form-step:after { background: #334055; }
.step-index, .optional, .hint { color: #98a6bb; }
.field input, .field select, .field textarea,
.dialog-body textarea, #appeal-text, #report-reason {
  background: var(--surface-input); color: #e4ecf7; border-color: #344259;
}
.field input::placeholder, .field textarea::placeholder,
.dialog-body textarea::placeholder, #appeal-text::placeholder, #report-reason::placeholder { color: #8190a6; }
.field input:focus, .field select:focus, .field textarea:focus,
.dialog-body textarea:focus { border-color: #3DE8C6; }
.input-icon-wrap > .icon { color: #90a4ba; }
.selected-entity { color: #81dbb7; }
.choice { background: #182231; color: #acbbce; border-color: #344259; }
.choice:hover { background: #202e40; color: #e4eefb; }
.choice.selected { background: #18392f; border-color: #579e80; color: #9bf0cc; }
.save-hint { color: #8f9fb5; }
.preview-heading { border-color: #2a384a; }
.preview-heading span, .preview-section small { color: #91a2b8; }
.preview-avatar { background: #1c3930; color: #83e4bb; }
.preview-body > p, .preview-section p { color: #a3b0c2; }
.preview-empty { color: #8797ad !important; }
.preview-notice { background: #111a25; color: #97a9bc; }
.helper-card { color: #97a7bc; }
.helper-card b { color: #b9c7d9; }
.entry-card { background: #101a26; border-color: #2d3b4e; }
.icon-button { color: #a0afc3; }
.icon-button:hover { background: #27364a; color: #f4f8ff; }
.add-entry { background: #14221f; border-color: #385b4d; color: #9cd4bb; }
.add-entry:hover { background: #1b332b; border-color: #67ad8f; color: #c3f6df; }
.empty-entry { background: #101a25; border-color: #34475a; }
.empty-entry > .icon { color: #80ad9a; }
.empty-entry p { color: #a4b3c5; }
.error-box { color: #ffb6c3; background: #35212d; border-color: #704054; }
.check-row, .check-row small { color: #b7c3d4; }
.check-row input { accent-color: var(--mint); }
.summary-item, .preview-section, .compact-list > div { border-color: #2c394b; }
.summary-item > small { color: #9eacc0; }
.summary-item p { color: #adbbce; }
.summary-item a { color: #90dfc0; }
.notice { background: #172a29; border-color: #2c4b43; color: #b0d1c3; }
.notice-warm { background: #2b251d; border-color: #55452c; color: #e1c68f; }
.notice-red { background: #32212a; border-color: #624052; color: #e9b0bb; }
.waiting-count { background: #172e29; border: 1px solid #345346; }
.waiting-count .icon { color: #84e9bf; }
.big-number span { color: #8fb9a6; }
.waiting-count .progress { background: #304b40; }
.waiting-count p { color: #a0c9b4; }
.roadmap-item { border-color: #34465a; }
.roadmap-item:before { background: #52667b; }
.roadmap-item p { color: #97a8bd; }
.roadmap-item.active { border-color: var(--mint); }
.stat small, .stat p { color: #a1afc3; }
.judge-entry { background: #152d27; border: 1px solid #315247; }
.judge-entry p { color: #afc7bb; }
.judge-entry-letters span { background: #213b32; border: 1px solid #436b58; color: #8be8be; }
.judge-entry-letters span + span { background: #302a43; border-color: #62517e; color: #cbb4ff; }
.compact-list p { color: #9aaac0; }
.compact-list .icon { color: #899cb3; }
.rating-card { background: #132d26; border-color: #335a45; color: #f0fff7; }
.rating-card .eyebrow, .rating-card h2 { color: #9ee6c6; }
.rating-card p, .rating-meta span { color: #a2c2b0; }
.rating-meta { border-color: #35594a; }
.rating-meta b { color: #e5fff0; }
.data-table th { background: #182332; color: #a9b8ce; }
.data-table td { border-color: #2a384b; }
.data-table tr.me { background: #18362d; }
.empty-state > .icon { color: #96bba9; }
.empty-state p, .login-card p { color: #a7b4c8; }
.login-card .btn-kakao { background: #e8d45a; border-color: #e8d45a; color: #29220e; }
.login-card .btn-kakao:hover { background: #f4e16e; border-color: #f4e16e; color: #29220e; }
.complete-icon[style*="background"] { background: #3b222d !important; color: #ffb2c0 !important; }
.demo-controls { background: #172130; border-color: #3a4b5f; color: #a6b8c9; box-shadow: 0 6px 24px #00000040; }
.demo-controls select { color: #b1ddc8; }
.demo-controls button { background: #253549; color: #c2d3e2; }
.demo-controls button:hover { background: #36506a; }
.site-footer { color: #8294ac; border-color: #263446; }
.site-footer strong { color: #b0bfd2; }
.site-footer a:hover { color: #d3f8e7; }
.mobile-nav { background: #101722f2; border-color: #2b394d; }
.mobile-nav a { color: #95a4ba; }
.mobile-nav a.active { color: var(--mint); }
#toast { background: #204838; border: 1px solid #4c8468; color: #e6fff2; box-shadow: 0 8px 25px #00000040; }
dialog { background: #172130; border-color: #39495f; color: var(--ink); box-shadow: 0 30px 100px #00000080; }
dialog::backdrop { background: #03070dc9; backdrop-filter: blur(6px); }
.dialog-copy { color: #b1bed0; }

/* Name search */
.arena-search-list { background: #172231; border-color: #3e5066; color: #e6f0fa; box-shadow: 0 18px 45px #00000080, 0 0 0 1px #3DE8C608; }
.arena-search-caption { color: #a1b0c3; }
.arena-search-option { color: #e2eef8; }
.arena-search-option:hover, .arena-search-option.is-active { background: #233c37; }
.arena-search-option small { color: #9eb1c5; }
.arena-search-symbol { background: #223c35; color: #8af0c6; }
.arena-search-return { color: #94b8a8; }
.arena-search-option.is-custom { border-color: #354458; }
.arena-search-option.is-custom .arena-search-symbol { background: #426d59; color: #dcfff0; }
.arena-search-empty { color: #a7b8ca; }

/* A/B game */
.aj-arena {
  --aj-ink: #F2F4F8;
  --aj-muted: #a0aec3;
  --aj-line: #2d3b4e;
  --aj-mint: #3DE8C6;
  --aj-violet: #b49aff;
  color: var(--aj-ink);
}
.aj-arena button:focus-visible, .aj-arena textarea:focus-visible,
.aj-arena input:focus-visible { outline-color: var(--focus); }
.aj-judge-dot { background: #3DE8C6; box-shadow: 0 0 0 4px #3DE8C614; }
.aj-exit-button { color: #a4b2c6; }
.aj-exit-button:hover { background: #273447; color: #edf4fc; }
.aj-steps { background: #131d2b; border-color: #2b3a4f; }
.aj-step { color: #97a7bd; }
.aj-step:not(:last-child):after { background: #405068; }
.aj-step-number { border-color: #3c4d65; color: #a6b6c9; background: #192536; }
.aj-step.is-current { color: #f1f7ff; }
.aj-step.is-current .aj-step-number { background: #3DE8C6; border-color: #3DE8C6; color: #112c21; }
.aj-step.is-done { color: #a0dbbd; }
.aj-step.is-done .aj-step-number { background: #204232; border-color: #4e7c60; color: #9ef3c8; }
.aj-round-kicker { color: #94a7be; }
.aj-round-kicker i { background: #8197b0; }
.aj-round-heading p { color: #a8b6ca; }
.aj-category-icon { background: #1b2b32; border-color: #3c5359; color: #a1cfbe; }
.aj-versus { background: #223046; border: 1px solid #536178; color: #ecf3fe; box-shadow: 0 0 0 6px var(--bg); }
.aj-profile { background: #141f2b; border-color: #36574b; box-shadow: 0 8px 26px #00000014; }
.aj-profile-a { --aj-side: #3DE8C6; --aj-side-strong: #a3f5d4; --aj-side-soft: #17382e; --aj-side-border: #3f7b60; }
.aj-profile-b { --aj-side: #b49aff; --aj-side-strong: #d0bcff; --aj-side-soft: #2a2540; --aj-side-border: #6b568c; border-color: #504260; }
.aj-profile.is-picked { border-color: var(--aj-side); box-shadow: 0 0 0 2px var(--aj-side-border), 0 12px 26px #00000030; }
.aj-profile-top { background: var(--aj-side-soft); border-color: var(--aj-side-border); }
.aj-profile-label { color: var(--aj-side-strong); opacity: .85; }
.aj-fact + .aj-fact { border-color: #304052; }
.aj-fact-label { color: #9dacc0; }
.aj-fact p { color: #b5c3d5; }
.aj-fact p.aj-fact-strong { color: #e0eafa; }
.aj-fact-divider { background: #304052; }
.aj-detail-tags > span { background: #1e2c3c; border-color: #35455a; color: #bed0df; }
.aj-result-fact p { color: var(--aj-side-strong); }
.aj-empty, .aj-empty strong { color: #acbdcc; }
.aj-empty-symbol { color: #6f899d; }
.aj-empty p { color: #a2b3c5; }
.aj-feedback-dot { background: #85d4ad; }
.aj-button-dark { background: var(--mint); color: #10271d; }
.aj-button-dark:hover:not(:disabled) { background: #98f7d5; color: #10271d; }
.aj-button-dark:disabled { background: #304052; color: #a4b3c6; opacity: .6; }
.aj-shortcut { color: #91a5bc; }
.aj-shortcut kbd { background: #1c2a3b; color: #b4c9da; border-color: #41536a; box-shadow: 0 2px 0 #080e17; }
.aj-footer { color: #94a6bc; }
.aj-footer-link { color: #a5b6ca; }
.aj-footer-link:hover { color: #d7f6e8; }
.aj-ballot-summary, .aj-final-form { background: #141f2c; border-color: #304054; }
.aj-panel-kicker { color: #94a6ba; }
.aj-summary-row { color: #b2c2d3; border-color: #2d3c50; }
.aj-summary-row > .aj-icon { color: #92a6be; }
.aj-summary-icon { background: #223446; color: #bdd2e2; }
.aj-choice-a { color: #8bf0c5; }
.aj-choice-b { color: #c6b0ff; }
.aj-choice-tie { color: #a6b9cb; }
.aj-summary-row:hover > span:nth-child(2) { color: #dcfbed; }
.aj-summary-note { color: #a4b7c7; }
.aj-summary-lock { color: #9dafc0; border-color: #3b5061; }
.aj-summary-lock .aj-icon { color: #a0c7b5; }
.aj-field-title > span { color: #9bb5a6; }
.aj-verdict { background: #172431; border-color: #34495b; color: #e1ecf8; }
.aj-verdict-a { --verdict: #7df1c3; --verdict-bg: #1a392e; --verdict-line: #5f9e7d; }
.aj-verdict-b { --verdict: #c1a6ff; --verdict-bg: #302741; --verdict-line: #8b6caf; }
.aj-verdict-tie { --verdict: #bfd0e1; --verdict-bg: #273747; --verdict-line: #7a91a8; }
.aj-verdict:hover, .aj-verdict.is-picked { background: var(--verdict-bg); border-color: var(--verdict-line); }
.aj-verdict strong { color: #e1ecf7; }
.aj-verdict small { color: #a6b8ca; }
.aj-radio-mark { background: #101c2a; border-color: #5a7183; }
.aj-verdict.is-picked .aj-radio-mark { background: var(--verdict); border-color: var(--verdict); color: #14241e; }
.aj-reason { background: #0f1925; border-color: #3c5165; color: #dce7f3; }
.aj-reason:focus { border-color: #85d7b5; }
.aj-reason::placeholder { color: #8fa3ba; }
.aj-reason-meta { color: #9bafc2; }
.aj-checkbox { color: #bacbd5; }
.aj-checkbox input { accent-color: #7cf1c3; }
.aj-checkbox small { background: #263a46; color: #b0c5d1; }
.aj-confirm-checkbox { border-color: #344b59; color: #c1d6ca; }
.aj-submit-error { color: #ffadb8; }
.aj-final-footnote { color: #97acbd; }
.aj-toast { background: #214632; border: 1px solid #528362; color: #eafff1; box-shadow: 0 8px 28px #00000066; }
@media (max-width: 600px) {
  .aj-versus { box-shadow: 0 0 0 4px var(--bg); }
}