:root { color-scheme: dark; --bg:#080d19; --panel:#101a2d; --line:#263550; --text:#f4f7ff; --muted:#94a4bf; --accent:#4ff0a3; --accent-dark:#102f28; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:radial-gradient(circle at 50% -20%,#172b4e 0,#080d19 43rem); color:var(--text); font:15px/1.5 Inter,Segoe UI,Arial,sans-serif; }
.topbar { height:66px; display:flex; align-items:center; justify-content:space-between; padding:0 max(22px,calc((100vw - 1180px)/2)); border-bottom:1px solid rgba(148,164,191,.18); background:#0a1120cc; backdrop-filter:blur(12px); }
.brand { color:#fff; font-weight:850; letter-spacing:1.1px; text-decoration:none; font-size:19px; }.brand span { color:var(--accent); }
.topbar-tools { display:flex; align-items:center; gap:16px; }.language-switch { display:flex; padding:2px; border:1px solid #334361; border-radius:8px; background:#0b1424; }.language-switch button { min-width:38px; padding:5px 8px; border-radius:6px; background:transparent; color:var(--muted); font-size:12px; }.language-switch button[aria-pressed="true"] { background:var(--accent); color:#06140e; }.connection { color:var(--muted); display:flex; gap:8px; align-items:center; font-size:13px; }.connection i { width:8px; height:8px; border-radius:50%; background:#e6ad3d; }.connection.connected i { background:var(--accent); box-shadow:0 0 12px var(--accent); }.connection.disconnected i { background:#eb6675; }.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
main { max-width:1180px; margin:auto; padding:62px 22px; }.hero { max-width:720px; }.eyebrow { color:var(--accent); font-size:12px; letter-spacing:1.6px; font-weight:800; margin:0 0 10px; }.hero h1 { font-size:clamp(38px,6vw,67px); line-height:1.04; margin:0; letter-spacing:-2.5px; }.intro { color:var(--muted); max-width:620px; font-size:17px; margin:20px 0 0; }
.summary { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:42px 0 28px; }.summary article,.feed-panel { background:linear-gradient(135deg,#111d33,#0c1425); border:1px solid var(--line); border-radius:14px; }.summary article { padding:20px 22px; }.summary span { display:block; color:var(--muted); font-size:13px; }.summary strong { display:block; margin-top:4px; font-size:25px; }
.feed-panel { padding:23px; }.panel-head { display:flex; justify-content:space-between; gap:20px; align-items:center; }.panel-head h2 { margin:0; font-size:21px; }.panel-head p { color:var(--muted); margin:4px 0 0; font-size:13px; }button,input,select { font:inherit; }button { cursor:pointer; background:var(--accent); border:0; border-radius:8px; color:#06140e; font-weight:800; padding:10px 15px; }button:hover { filter:brightness(1.08); }.filters { display:flex; flex-wrap:wrap; gap:12px; align-items:end; border-top:1px solid var(--line); margin-top:21px; padding-top:20px; }.filters label { display:grid; gap:5px; color:var(--muted); font-size:12px; }.filters input,.filters select { min-width:160px; height:38px; border-radius:7px; border:1px solid #334361; background:#09111f; color:var(--text); padding:0 10px; }.filters button { height:38px; padding:0 18px; }
.table-wrap { overflow:auto; margin-top:22px; }table { width:100%; border-collapse:collapse; min-width:680px; }th { color:var(--muted); text-align:left; font-size:12px; font-weight:700; padding:0 12px 11px; }td { border-top:1px solid rgba(148,164,191,.15); padding:15px 12px; }td.realm { color:var(--accent); font-weight:800; }.coordinates { font-family:ui-monospace,Consolas,monospace; font-weight:800; }.atom { font:12px ui-monospace,Consolas,monospace; color:var(--muted); }.status span { background:var(--accent-dark); color:var(--accent); border:1px solid #285d4b; border-radius:99px; padding:4px 8px; font-size:10px; font-weight:900; letter-spacing:.7px; }.empty { color:var(--muted); text-align:center; padding:36px; }
@media (max-width:650px) { main { padding-top:42px; }.summary { grid-template-columns:1fr; margin-top:30px; }.feed-panel { padding:16px; }.panel-head { align-items:start; }.topbar { padding:0 16px; } }
.account form { display:flex; flex-wrap:wrap; gap:12px; align-items:end; }
.account form label { display:grid; gap:5px; color:var(--muted); font-size:12px; }
.account form input { min-width:180px; height:38px; border:1px solid #334361; border-radius:7px; background:#09111f; color:var(--text); padding:0 10px; }
.account form button { height:38px; }
.account #account-message { margin:0; color:var(--muted); }
.account #account-state { align-self:center; }
.account #account-state button { margin-left:10px; }
[hidden] { display:none !important; }
.realm-picker { flex-basis:100%; min-width:0; border:1px solid var(--line); border-radius:8px; padding:9px 12px 12px; }
.realm-picker legend { color:var(--accent); padding:0 5px; font-weight:700; }
.realm-picker-tools { display:flex; flex-wrap:wrap; align-items:center; gap:9px; }
.realm-picker-tools #realm-search { min-width:160px; width:220px; }
.realm-picker-tools #clear-realms { height:38px; }
.realm-picker-tools #realm-count { color:var(--muted); font-size:12px; }
.realm-options { display:grid; grid-template-columns:repeat(auto-fill,minmax(90px,1fr)); gap:4px 12px; max-height:180px; overflow:auto; margin-top:9px; padding:10px; border:1px solid var(--line); border-radius:8px; background:#09111f; }
.filters .realm-options label { display:flex; align-items:center; gap:7px; min-width:0; color:var(--text); font-size:13px; cursor:pointer; }
.filters .realm-options input[type="checkbox"] { flex:0 0 16px; width:16px; height:16px; min-width:0; margin:0; padding:0; border:0; accent-color:var(--accent); }
.account-panel { border-top:1px solid var(--line); margin-top:21px; padding-top:20px; }
.auth-tabs { display:flex; gap:8px; margin-bottom:14px; }
.auth-tabs button { background:#253652; color:var(--text); }
.account-form { display:flex; flex-wrap:wrap; gap:12px; align-items:end; }
.account-form label { display:grid; gap:5px; color:var(--muted); font-size:12px; }
.account-form input { min-width:190px; height:38px; border:1px solid #334361; border-radius:7px; background:#09111f; color:var(--text); padding:0 10px; }
.account-form button { height:38px; }
.account-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; }
.account-head > div { display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.account-panel details { margin-top:13px; border-top:1px solid var(--line); padding-top:10px; }
.account-panel summary { cursor:pointer; color:var(--accent); font-weight:700; }
.account-panel details .account-form { margin-top:12px; }
#access-history { margin:12px 0 0; padding-left:20px; color:var(--muted); }
#access-history li { margin:5px 0; }
#account-message { min-height:1.4em; margin:12px 0 0; color:var(--muted); }
#admin-panel table { min-width:600px; }
.admin-access-actions { display:flex; flex-wrap:wrap; gap:6px; }
.admin-access-actions button { margin:0 !important; padding:7px 9px; white-space:nowrap; font-size:12px; }
.admin-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:end; gap:12px; margin-top:14px; }
.admin-toolbar label { display:grid; gap:4px; color:var(--muted); font-size:12px; }
.admin-toolbar input,.admin-access-actions input,.admin-access-actions select { height:34px; border:1px solid #334361; border-radius:7px; background:#09111f; color:var(--text); padding:0 8px; }
.admin-toolbar input { min-width:260px; }.admin-access-actions input { width:72px; }.admin-access-actions select { width:85px; }
#admin-stats { color:var(--muted); }.admin-stat-value { color:var(--accent); font-weight:800; }
.support-form { display:grid !important; grid-template-columns:minmax(150px,220px) 1fr auto; gap:8px; margin-top:12px; }
.support-form textarea { grid-column:1 / -2; min-height:90px; resize:vertical; border:1px solid #334361; border-radius:7px; background:#09111f; color:var(--text); padding:9px; }
.support-form input,.support-form select { height:38px; border:1px solid #334361; border-radius:7px; background:#09111f; color:var(--text); padding:0 9px; }
.ticket-list { display:grid; gap:7px; margin-top:12px; }.ticket-list button { width:100%; display:flex; justify-content:space-between; gap:10px; background:#172640; color:var(--text); text-align:left; }
.ticket-thread { margin-top:14px; padding:12px; border:1px solid var(--line); border-radius:9px; }.ticket-thread h4 { margin:0 0 10px; }
.ticket-message { margin:7px 0; padding:9px 11px; border-radius:8px; background:#101d31; }.ticket-message.admin { border-left:3px solid var(--accent); }.ticket-message small { display:block; color:var(--muted); margin-bottom:3px; }
.ticket-status-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:10px; }
@media (max-width:650px) { .support-form { grid-template-columns:1fr; }.support-form textarea { grid-column:1; } }
#access-shop { margin-top:16px; border-top:1px solid var(--line); padding-top:12px; }
#access-shop h3 { margin:0; font-size:16px; }
#access-shop p { color:var(--muted); margin:3px 0 12px; }
#access-packages { display:flex; flex-wrap:wrap; gap:8px; }
.advanced-filter { margin-top:20px; border:1px solid var(--line); border-radius:14px; background:rgba(9,17,31,.72); padding:0 18px 16px; }.advanced-filter > summary { display:flex; align-items:center; gap:13px; padding:17px 0; cursor:pointer; list-style:none; }.advanced-filter > summary::-webkit-details-marker { display:none; }.advanced-filter summary > span:last-child { display:grid; }.advanced-filter summary strong { color:var(--text); font-size:17px; }.advanced-filter summary small { color:var(--muted); font-size:12px; font-weight:400; }.filter-icon { display:grid; place-items:center; width:39px; height:39px; border-radius:10px; background:rgba(126,72,190,.2); color:#bd81ff; font-size:23px; }.guild-filter-form { display:grid; grid-template-columns:repeat(3,minmax(120px,1fr)) minmax(220px,1.5fr) auto; gap:12px; align-items:end; }.guild-filter-form label { display:grid; gap:5px; color:var(--muted); font-size:12px; }.guild-filter-form input,.guild-filter-form select { width:100%; height:40px; border:1px solid #334361; border-radius:8px; background:#09111f; color:var(--text); padding:0 10px; }.filter-actions { display:flex; gap:7px; }.filter-actions button { height:40px; white-space:nowrap; }.filter-actions .secondary { background:#253652; color:var(--text); }.filter-summary { min-height:1.3em; margin:10px 0 0; color:var(--accent); font-size:12px; }.filter-summary.error { color:#ff7e8b; }
@media (max-width:1000px) { .guild-filter-form { grid-template-columns:repeat(2,1fr); }.filter-actions { grid-column:1 / -1; } }
@media (max-width:650px) { .guild-filter-form { grid-template-columns:1fr; }.filter-actions { grid-column:1; }.advanced-filter { padding-inline:13px; }.advanced-filter summary small { display:none; } }

/* Mercenary Radar visual layer */
:root { --accent2:#39c8ff; }
body { min-height:100vh; overflow-x:hidden; background:radial-gradient(circle at 50% -20%,#172b4e 0,#060b14 43rem); }
.ambient { position:fixed; z-index:-2; width:430px; height:430px; border-radius:50%; filter:blur(110px); opacity:.14; pointer-events:none; animation:floatGlow 12s ease-in-out infinite alternate; }
.ambient-one { top:3%; left:-170px; background:var(--accent2); }.ambient-two { top:28%; right:-190px; background:var(--accent); animation-delay:-5s; }
.scan-grid { position:fixed; inset:0; z-index:-3; opacity:.18; pointer-events:none; background-image:linear-gradient(rgba(83,246,168,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(83,246,168,.07) 1px,transparent 1px); background-size:48px 48px; mask-image:linear-gradient(to bottom,#000,transparent 72%); }
.brand { display:flex; align-items:center; gap:7px; font-size:17px; }.brand i { width:11px; height:11px; border:2px solid var(--accent); border-radius:50%; box-shadow:0 0 15px var(--accent); position:relative; }.brand i::after { content:""; position:absolute; inset:2px; border-radius:50%; background:var(--accent); animation:pulseDot 1.8s ease-in-out infinite; }
main { padding-top:76px; }.hero { position:relative; max-width:820px; min-height:260px; }.eyebrow { display:flex; align-items:center; gap:9px; letter-spacing:1.8px; }.eyebrow i { width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 14px var(--accent); animation:pulseDot 1.5s infinite; }.hero h1 { max-width:760px; font-size:clamp(42px,6vw,72px); line-height:1.01; letter-spacing:-3.2px; background:linear-gradient(110deg,#fff 30%,#a8bdd9 60%,#fff 82%); background-size:220% auto; color:transparent; background-clip:text; animation:titleShine 7s linear infinite; }.intro { max-width:680px; font-size:18px; }
.hero-signal { position:absolute; right:-235px; top:-30px; width:260px; height:260px; border:1px solid rgba(83,246,168,.2); border-radius:50%; opacity:.72; background:repeating-radial-gradient(circle,transparent 0 31px,rgba(83,246,168,.12) 32px 33px); }.hero-signal::before { content:""; position:absolute; left:50%; top:50%; width:50%; height:50%; transform-origin:left top; background:linear-gradient(15deg,rgba(83,246,168,.35),transparent 65%); animation:radarSweep 4s linear infinite; }.hero-signal span { position:absolute; width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 12px var(--accent); animation:targetBlink 2s infinite; }.hero-signal span:nth-child(1){left:70px;top:62px}.hero-signal span:nth-child(2){right:55px;top:112px;animation-delay:-.7s}.hero-signal span:nth-child(3){left:112px;bottom:45px;animation-delay:-1.3s}.hero-signal b { position:absolute; left:50%; top:50%; width:4px; height:4px; border-radius:50%; background:#fff; }
.summary article,.feed-panel { background:linear-gradient(135deg,rgba(17,29,51,.94),rgba(8,17,31,.94)); box-shadow:0 18px 50px rgba(0,0,0,.18); }.summary article { position:relative; overflow:hidden; transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; }.summary article::after { content:""; position:absolute; inset:auto 0 0; height:2px; background:linear-gradient(90deg,transparent,var(--accent),transparent); transform:translateX(-105%); animation:cardScan 4.5s ease-in-out infinite; }.summary article:nth-child(2)::after{animation-delay:-1.5s}.summary article:nth-child(3)::after{animation-delay:-3s}.summary article:hover { transform:translateY(-3px); border-color:rgba(83,246,168,.48); box-shadow:0 20px 55px rgba(25,236,157,.08); }
.radar-panel { position:relative; overflow:hidden; }.radar-panel::before { content:""; position:absolute; top:0; left:-30%; width:30%; height:1px; background:linear-gradient(90deg,transparent,var(--accent2),transparent); animation:panelBeam 6s linear infinite; }tbody tr { transition:background .2s ease; }tbody tr:hover { background:rgba(83,246,168,.045); }
@keyframes pulseDot { 0%,100%{opacity:.45;transform:scale(.75)} 50%{opacity:1;transform:scale(1.15)} }
@keyframes floatGlow { from{transform:translate3d(0,-20px,0)} to{transform:translate3d(45px,45px,0)} }
@keyframes radarSweep { to{transform:rotate(360deg)} }
@keyframes targetBlink { 0%,100%{opacity:.25;transform:scale(.7)} 45%{opacity:1;transform:scale(1.25)} }
@keyframes titleShine { to{background-position:-220% center} }
@keyframes cardScan { 0%,35%{transform:translateX(-105%)} 65%,100%{transform:translateX(105%)} }
@keyframes panelBeam { to{left:110%} }
@media (max-width:1050px) { .hero-signal { right:-60px; opacity:.28; } }
@media (max-width:650px) { .hero-signal { display:none; }.hero { min-height:0; }.brand { font-size:13px; }.hero h1 { letter-spacing:-2px; }.connection span { display:none; }.topbar-tools { gap:10px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; } }

.main-nav { display:flex; align-items:center; gap:6px; margin-left:auto; margin-right:22px; }.main-nav a { color:var(--muted); text-decoration:none; padding:8px 11px; border-radius:7px; font-size:13px; font-weight:750; transition:color .2s ease,background .2s ease; }.main-nav a:hover { color:var(--text); background:rgba(83,246,168,.08); }
.pricing-section { scroll-margin-top:88px; padding:36px 0 44px; }.section-heading { text-align:center; max-width:680px; margin:0 auto 28px; }.section-heading .eyebrow { justify-content:center; }.section-heading h2 { margin:0; font-size:clamp(30px,4vw,46px); letter-spacing:-1.5px; }.section-heading > p:last-child { color:var(--muted); margin:10px 0 0; font-size:16px; }
.how-section { padding:58px 0 28px; }.how-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.how-grid article { padding:24px; border:1px solid var(--line); border-radius:16px; background:linear-gradient(145deg,rgba(17,29,51,.94),rgba(8,17,31,.94)); }.how-grid article > span { display:grid; place-items:center; width:38px; height:38px; border-radius:10px; background:rgba(83,246,168,.12); color:var(--accent); font-size:17px; font-weight:900; }.how-grid h3 { margin:18px 0 7px; font-size:18px; }.how-grid p { margin:0; color:var(--muted); line-height:1.55; }
@media (max-width:820px) { .how-grid { grid-template-columns:1fr; max-width:520px; margin:auto; } }
.pricing-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; align-items:stretch; }.price-card { position:relative; display:flex; flex-direction:column; min-height:350px; padding:25px; overflow:hidden; border:1px solid var(--line); border-radius:16px; background:linear-gradient(145deg,rgba(17,29,51,.96),rgba(8,17,31,.96)); box-shadow:0 18px 50px rgba(0,0,0,.2); transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; }.price-card:hover { transform:translateY(-5px); border-color:rgba(83,246,168,.5); box-shadow:0 24px 65px rgba(25,236,157,.1); }.price-card.featured { border-color:rgba(83,246,168,.62); background:linear-gradient(145deg,rgba(17,48,48,.96),rgba(8,17,31,.96)); }.price-card.featured::before,.price-card.free-plan::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 50% 0,rgba(83,246,168,.12),transparent 48%); }.price-card.free-plan { border-color:rgba(73,184,255,.5); background:linear-gradient(145deg,rgba(15,38,62,.96),rgba(8,17,31,.96)); }.price-card.free-plan strong { color:#75c9ff; font-size:42px; }.plan-name { position:relative; color:var(--accent); font-size:13px; font-weight:850; letter-spacing:.6px; text-transform:uppercase; }.price-card strong { position:relative; display:block; margin:18px 0 5px; font-size:48px; line-height:1; }.price-card strong small { color:var(--muted); font-size:14px; font-weight:750; }.price-card p { position:relative; min-height:45px; color:var(--muted); margin:8px 0 18px; }.price-card ul { position:relative; list-style:none; padding:0; margin:0 0 24px; color:#cdd8e8; }.price-card li { margin:9px 0; }.price-card li::before { content:"✓"; color:var(--accent); font-weight:900; margin-right:9px; }.price-card button { position:relative; width:100%; margin-top:auto; }.popular { position:absolute; right:13px; top:13px; padding:4px 7px; border:1px solid rgba(83,246,168,.35); border-radius:99px; background:rgba(83,246,168,.1); color:var(--accent); font-size:9px; font-weight:900; letter-spacing:.8px; }
#exchanges { scroll-margin-top:88px; }
@media (max-width:1100px) { .pricing-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:820px) { .pricing-grid { grid-template-columns:1fr; max-width:520px; margin:auto; }.price-card { min-height:0; }.main-nav { margin:0 4px 0 auto; }.main-nav a:first-child { display:none; }.main-nav a { padding:7px; } }
.clan-explainer { display:grid; grid-template-columns:auto 1fr; gap:18px; margin-top:18px; padding:22px 24px; border:1px solid rgba(57,200,255,.32); border-radius:16px; background:linear-gradient(135deg,rgba(18,31,55,.94),rgba(13,26,43,.94)); }.clan-explainer-icon { display:grid; place-items:center; width:54px; height:54px; border-radius:13px; background:rgba(57,200,255,.12); color:var(--accent2); font-size:21px; font-weight:900; }.clan-explainer h3 { margin:0 0 5px; font-size:20px; }.clan-explainer p { margin:0; color:var(--muted); }.clan-explainer ol { display:grid; grid-template-columns:repeat(2,1fr); gap:9px 26px; margin:17px 0 14px; padding-left:21px; color:#d8e2f0; }.clan-explainer li { padding-left:3px; }.clan-explainer li::marker { color:var(--accent2); font-weight:900; }.clan-explainer .clan-note { padding-top:12px; border-top:1px solid var(--line); color:#a9bad1; font-size:13px; }
@media (max-width:700px) { .clan-explainer { grid-template-columns:1fr; }.clan-explainer ol { grid-template-columns:1fr; } }
.summary { grid-template-columns:repeat(4,1fr); }
#event-status { white-space:nowrap; font-variant-numeric:tabular-nums; font-size:clamp(18px,2vw,25px); }
#event-card.event-active { border-color:rgba(83,246,168,.72); box-shadow:0 0 32px rgba(83,246,168,.13); }
#event-card.event-active strong { color:var(--accent); text-shadow:0 0 18px rgba(83,246,168,.5); animation:pulseDot 1.8s ease-in-out infinite; transform-origin:left center; }
@media (max-width:900px) { .summary { grid-template-columns:repeat(2,1fr); } }
@media (max-width:650px) { .summary { grid-template-columns:1fr; } }

@media (max-width:650px) {
  main { padding:42px 16px 56px; }
  .topbar { padding:0 14px; }
  .main-nav { display:none; }
  .topbar-tools { margin-left:auto; }
  .hero h1 { font-size:clamp(36px,11vw,46px); line-height:1.04; }
  .intro { font-size:16px; line-height:1.55; }
  .summary { gap:11px; }
  .summary article { padding:17px 18px; }
  .pricing-grid { width:100%; }
  .price-card { padding:21px; }
  .clan-explainer { padding:19px; }
  .auth-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .auth-tabs button { min-height:44px; white-space:normal; }
  .auth-tabs button:last-child { grid-column:1 / -1; }
  .account-form { display:grid; grid-template-columns:minmax(0,1fr); align-items:stretch; }
  .account-form label,.account-form input,.account-form button { width:100%; min-width:0; }
  .account-form input,.account-form button { min-height:44px; }
  .feed-panel > .table-wrap table { min-width:300px; }
  .feed-panel > .table-wrap th,.feed-panel > .table-wrap td { padding-inline:8px; }
}