/* Elfen Server visual system. Replace images/elfen-hero.png to change the banner. */
:root {
  --elfen-ink: #0d0918;
  --elfen-deep: #130d22;
  --elfen-panel: #1d1430;
  --elfen-panel-soft: #261a3c;
  --elfen-gold: #d8a848;
  --elfen-gold-light: #f0d18a;
  --elfen-cream: #f4eddf;
  --elfen-muted: #b9adc9;
  --elfen-line: rgba(216, 168, 72, .42);
}

html { scroll-behavior: smooth; }
body.elfen-site { margin: 0; min-width: 0; background: linear-gradient(rgba(13,9,24,.48),rgba(13,9,24,.68)),url('images/elfen/background.png') center top / cover fixed no-repeat; color: var(--elfen-cream); font: 15px/1.65 "Segoe UI", Arial, sans-serif; }
.elfen-site *, .elfen-site *::before, .elfen-site *::after { box-sizing: border-box; }
.elfen-site img { max-width: 100%; }
.elfen-site a { color: var(--elfen-gold-light); text-decoration: none; }
.elfen-site a:hover { color: #fff2c4; text-decoration: none; }
.elfen-site :focus-visible { outline: 2px solid var(--elfen-gold-light); outline-offset: 3px; }
.elfen-site h1, .elfen-site h2, .elfen-site h3 { font-family: Georgia, "Times New Roman", serif; font-weight: 700; line-height: 1.16; }
.elfen-site em { font-style: normal; color: var(--elfen-gold); }

.elfen-header { position: relative; z-index: 100; background: rgba(13, 9, 24, .98); border-bottom: 1px solid var(--elfen-line); box-shadow: 0 12px 30px rgba(0,0,0,.18); }
.elfen-header-inner { width: min(1480px, calc(100% - 64px)); min-height: 104px; margin: auto; display: flex; align-items: center; gap: 36px; }
.elfen-brand { display: inline-flex; align-items: center; gap: 12px; min-width: 220px; color: var(--elfen-cream) !important; }
.elfen-brand-mark { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--elfen-gold); transform: rotate(45deg); color: var(--elfen-gold); font-size: 27px; box-shadow: inset 0 0 0 4px rgba(216,168,72,.1); }
.elfen-brand-mark::first-letter { transform: rotate(-45deg); }
.elfen-brand-text { font: 700 22px/1 Georgia, serif; letter-spacing: .07em; white-space: nowrap; text-shadow: 0 2px 8px #000; }
.elfen-brand-text strong { color: var(--elfen-gold); }
.elfen-brand-text small { display: block; padding-top: 8px; font: 600 8px/1 "Segoe UI",sans-serif; letter-spacing: .3em; color: var(--elfen-muted); }
.elfen-header-logo { display: block; width: 88px; height: 88px; max-width: none; max-height: none; object-fit: contain; filter: drop-shadow(0 3px 10px #000b); }
.elfen-navigation { display: flex; align-items: center; justify-content: center; gap: clamp(14px, 2vw, 34px); flex: 1; }
.elfen-navigation > a, .elfen-nav-dropdown > summary { color: #dcd5e4; font-size: 13px; font-weight: 650; cursor: pointer; transition: color .2s; list-style: none; white-space: nowrap; }
.elfen-nav-dropdown > summary::-webkit-details-marker { display: none; }
.elfen-nav-dropdown > summary::after { content: '⌄'; color: var(--elfen-gold); margin-left: 7px; }
.elfen-navigation > a:hover, .elfen-nav-dropdown > summary:hover, .elfen-nav-dropdown[open] > summary { color: var(--elfen-gold-light); }
.elfen-nav-dropdown { position: relative; }
.elfen-dropdown-panel { position: absolute; top: calc(100% + 23px); left: -18px; width: 215px; padding: 9px; background: #1b132d; border: 1px solid var(--elfen-line); box-shadow: 0 18px 45px #0008; }
.elfen-dropdown-panel a { display: block; padding: 10px 12px; color: var(--elfen-cream); font-size: 13px; }
.elfen-dropdown-panel a:hover { background: #332344; color: var(--elfen-gold-light); }
.elfen-account-link { display: inline-flex; align-items: center; justify-content: center; gap: 15px; min-height: 42px; padding: 0 18px; border: 1px solid #d8a848; border-radius: 6px; background: linear-gradient(145deg,#ebc777,#bc842c); color: #211426 !important; font-size: 13px; font-weight: 800; white-space: nowrap; box-shadow: inset 0 1px #fff7, 0 5px 14px #0004; transition: background .2s, transform .2s; }
.elfen-account-link:hover { background: linear-gradient(145deg,#f6d68f,#d49d38); transform: translateY(-1px); }
.elfen-account-link span { color: #211426; font-size: 17px; }
.elfen-menu-toggle { display: none; }
.elfen-brand-strip { position: relative; z-index: 3; display: grid; place-items: start center; height: 260px; margin-bottom: -120px; overflow: visible; background: transparent; pointer-events: none; }
.elfen-brand-strip a { display: block; width: min(750px,54vw); height: auto; pointer-events: auto; }
.elfen-brand-strip img { display: block; width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 5px 15px #000b); }

.elfen-button { display: inline-flex; align-items: center; justify-content: center; gap: 24px; min-height: 54px; padding: 0 28px; border: 1px solid var(--elfen-gold); border-radius: 5px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; transition: transform .2s, background .2s, box-shadow .2s; }
.elfen-button:hover { transform: translateY(-2px); }
.elfen-button-gold { background: linear-gradient(145deg,#ebc777,#bc842c); color: #211426 !important; box-shadow: 0 10px 34px #0005, inset 0 1px #fff8; }
.elfen-button-gold:hover { background: linear-gradient(145deg,#f6d68f,#d49d38); box-shadow: 0 12px 35px #0008; }
.elfen-button-ghost { background: #160f26b8; color: var(--elfen-cream) !important; }
.elfen-button-ghost:hover, .elfen-button-outline:hover { background: #3a294b; }
.elfen-button-outline { background: transparent; color: var(--elfen-gold-light) !important; width: 100%; }
.elfen-eyebrow { margin: 0 0 17px; color: var(--elfen-gold); font-size: 11px; font-weight: 800; letter-spacing: .24em; }
.elfen-diamond { color: var(--elfen-gold); font-size: 11px; margin-right: 8px; }

.elfen-hero { position: relative; min-height: min(780px, calc(100vh - 86px)); display: flex; justify-content: center; align-items: center; padding: 100px 24px 115px; overflow: hidden; text-align: center; background: transparent; }
.elfen-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(9,6,17,.10),rgba(9,6,17,.27) 28%,rgba(9,6,17,.38) 50%,rgba(9,6,17,.27) 72%,rgba(9,6,17,.10)),linear-gradient(180deg,rgba(11,7,22,.04),rgba(11,7,22,.12) 55%,rgba(13,9,24,.58)); }
.elfen-hero-content { position: relative; z-index: 1; width: min(850px, 100%); margin: 0 auto; }
.elfen-hero-wordmark { margin-bottom: 27px; color: #f1d798; font: 700 clamp(36px, 5.4vw, 79px)/1 Georgia,serif; letter-spacing: .06em; text-shadow: 0 3px #392018, 0 8px 25px #000; }
.elfen-hero-wordmark span { display: block; margin-bottom: 7px; font-size: .55em; color: var(--elfen-gold); }
.elfen-hero-logo { display: block; width: min(250px, 58vw); max-height: 250px; object-fit: contain; margin: 0 auto; filter: drop-shadow(0 8px 20px #000a); }
.elfen-hero h1 { max-width: 850px; margin: 0 auto 22px; color: var(--elfen-cream); font-size: clamp(38px, 4vw, 62px); text-shadow: 0 4px 25px #000b; }
.elfen-hero-description { max-width: 680px; margin: 0 auto; color: #ded6df; font-size: clamp(15px, 1.35vw, 18px); line-height: 1.7; text-shadow: 0 2px 12px #000; }
.elfen-hero-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.elfen-hero-meta { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 20px; margin-top: 35px; color: #d5c9d8; font-size: 13px; }
.elfen-meta-divider { color: #61b7e8; font-size: 9px; }
.elfen-scroll-cue { position: absolute; bottom: 26px; left: 50%; transform: translateX(-50%); z-index: 2; display: grid; gap: 1px; color: var(--elfen-gold-light); font-size: 9px; font-weight: 800; letter-spacing: .26em; }
.elfen-scroll-cue span { font-size: 20px; }
.elfen-ornament { display: flex; align-items: center; justify-content: center; gap: 12px; height: 38px; background: var(--elfen-ink); color: var(--elfen-gold); }
.elfen-ornament span { height: 1px; width: min(16vw, 190px); background: linear-gradient(90deg,transparent,var(--elfen-gold)); }
.elfen-ornament span:last-child { transform: rotate(180deg); }

.elfen-section { width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: 96px 0; }
.elfen-section-heading { max-width: 680px; margin: 0 auto 44px; text-align: center; }
.elfen-section-heading h2 { margin: 0 0 18px; color: var(--elfen-cream); font-size: clamp(34px, 3.2vw, 48px); }
.elfen-section-heading > p:last-child { color: var(--elfen-muted); margin: 0; font-size: 16px; }
.elfen-world-grid { display: grid; grid-template-columns: 1.12fr .88fr; min-height: 390px; border: 1px solid var(--elfen-line); background: var(--elfen-panel); box-shadow: 0 18px 50px #0004; }
.elfen-world-art { position: relative; min-height: 360px; background: linear-gradient(180deg,transparent 35%,#140d20),url('images/elfen-hero.png') 22% 48% / cover; }
.elfen-world-art span { position: absolute; bottom: 24px; left: 25px; color: var(--elfen-gold-light); font-size: 10px; font-weight: 800; letter-spacing: .22em; }
.elfen-world-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(30px,5vw,70px); }
.elfen-small-rule { width: 52px; height: 2px; background: var(--elfen-gold); }
.elfen-world-copy h3 { margin: 27px 0 18px; font-size: clamp(30px,3vw,42px); }
.elfen-world-copy p { color: var(--elfen-muted); margin: 0 0 27px; }
.elfen-text-link { display: inline-flex; align-items: center; gap: 17px; color: var(--elfen-gold-light) !important; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.elfen-text-link:hover { gap: 23px; }
.elfen-features { padding-top: 45px; }
.elfen-feature-grid, .elfen-step-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.elfen-feature-card { position: relative; display: block; min-height: 300px; padding: 34px 30px; color: var(--elfen-cream) !important; background: radial-gradient(circle at 80% 0,#422d56 0,transparent 42%),linear-gradient(145deg,#231733,#150e24); border: 1px solid var(--elfen-line); transition: transform .2s,border-color .2s; }
.elfen-feature-card:hover { transform: translateY(-5px); border-color: var(--elfen-gold); }
.elfen-feature-icon { display: grid; place-items: center; width: 53px; height: 53px; border: 1px solid var(--elfen-gold); color: var(--elfen-gold); font-size: 26px; }
.elfen-feature-number { display: block; margin-top: 28px; color: var(--elfen-gold); font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.elfen-feature-card h3 { margin: 9px 0 12px; font-size: 27px; }
.elfen-feature-card p { margin: 0; color: var(--elfen-muted); font-size: 14px; }
.elfen-card-arrow { position: absolute; top: 30px; right: 28px; color: var(--elfen-gold); font-size: 22px; }
.elfen-steps { border-top: 1px solid var(--elfen-line); }
.elfen-step { position: relative; padding: 35px 30px; border-top: 2px solid var(--elfen-gold); background: #1a1229; }
.elfen-step > span { color: var(--elfen-gold); font: 700 42px/1 Georgia,serif; }
.elfen-step h3 { margin: 25px 0 12px; font-size: 26px; }
.elfen-step p { color: var(--elfen-muted); min-height: 65px; }
.elfen-step a { font-size: 12px; font-weight: 800; }
.elfen-community { padding: 100px 24px; border-block: 1px solid var(--elfen-line); background: linear-gradient(90deg,#130c21dd,#1b1230cc),url('images/elfen-hero.png') center 55% / cover; text-align: center; }
.elfen-community-inner { width: min(720px,100%); margin: auto; }
.elfen-community h2 { font-size: clamp(35px,3.5vw,52px); margin: 0 0 20px; }
.elfen-community p:not(.elfen-eyebrow) { color: #d6c9d8; }
.elfen-faq { text-align: center; }
.elfen-faq-list { max-width: 850px; margin: 0 auto 30px; text-align: left; }
.elfen-faq-list details { border: 1px solid var(--elfen-line); background: #1b122b; margin-bottom: 11px; }
.elfen-faq-list summary { cursor: pointer; padding: 20px 25px; color: var(--elfen-cream); font-weight: 700; list-style: none; }
.elfen-faq-list summary::-webkit-details-marker { display: none; }
.elfen-faq-list summary::after { content: '+'; float: right; color: var(--elfen-gold); font-size: 22px; line-height: 1; }
.elfen-faq-list details[open] summary::after { content: '−'; }
.elfen-faq-list details p { padding: 0 25px 22px; margin: 0; color: var(--elfen-muted); }
.elfen-final-cta { padding: 70px 24px 86px; text-align: center; background: radial-gradient(ellipse at center,#38224c 0,#160d24 60%,#0d0918); border-top: 1px solid var(--elfen-line); }
.elfen-final-cta h2 { margin: 10px 0; font-size: clamp(32px,3.4vw,48px); }
.elfen-final-cta p { color: var(--elfen-muted); margin-bottom: 27px; }

.elfen-download-page { min-height: 470px; display: grid; place-items: center; padding: 42px 20px; background: linear-gradient(rgba(13,9,24,.78),rgba(13,9,24,.88)),url('images/elfen/background.png') center 47% / cover; }
.elfen-download-card { width: min(540px,100%); padding: 34px clamp(22px,5vw,52px); border: 1px solid var(--elfen-line); background: linear-gradient(155deg,rgba(35,24,51,.97),rgba(18,12,29,.97)); box-shadow: 0 18px 54px #0009, inset 0 1px #ffffff12; text-align: center; }
.elfen-download-logo { display: block; width: min(190px,58vw); height: auto; max-height: 190px; object-fit: contain; margin: 0 auto 14px; filter: drop-shadow(0 7px 18px #0009); }
.elfen-download-card h2 { margin: 0 0 12px; color: var(--elfen-gold-light); font-size: clamp(30px,4vw,42px); }
.elfen-download-card p { margin: 0 auto 26px; max-width: 410px; color: var(--elfen-cream); font-size: 16px; }
.elfen-download-card .elfen-button { min-width: min(280px,100%); }
.elfen-download-compatibility { margin-top: 20px; color: var(--elfen-muted); font-size: 13px; }

.elfen-page-banner { min-height: 270px; display: flex; align-items: center; border-bottom: 1px solid var(--elfen-line); background: linear-gradient(90deg,rgba(16,11,30,.84),rgba(27,18,48,.69) 50%,rgba(16,11,30,.82)),url('images/elfen/banner.png') center 43% / cover; }
.elfen-page-news .elfen-page-banner { background-image: linear-gradient(90deg,rgba(16,11,30,.84),rgba(27,18,48,.62) 50%,rgba(16,11,30,.8)),url('images/elfen/bannernews.png'); background-position: center 46%; background-size: cover; }
.elfen-page-news .elfen-page-banner { display: none; }
.elfen-page-banner-inner { width: min(1480px,calc(100% - 64px)); margin: auto; padding: 55px 0; }
.elfen-page-banner h1 { margin: 0 0 10px; font-size: clamp(38px,3.5vw,56px); }
.elfen-page-banner p:last-child { color: #d3c6d8; margin: 0; }
.elfen-separator { color: #785b8c; margin: 0 7px; }
.elfen-inner-shell { width: min(1480px,calc(100% - 48px)); margin: 34px auto 90px; display: grid; grid-template-columns: 250px minmax(0,1fr) 250px; gap: 22px; align-items: start; }
.elfen-side-menu, .elfen-right-rail { display: grid; gap: 18px; min-width: 0; }
.elfen-side-card { background: linear-gradient(160deg,#251936,#170f27); border: 1px solid var(--elfen-line); box-shadow: 0 10px 28px #0003; padding: 20px; }
.elfen-side-kicker { color: var(--elfen-gold); font-size: 10px; font-weight: 800; letter-spacing: .17em; }
.elfen-join-card { text-align: center; padding: 27px 21px; }
.elfen-join-card h2 { font-size: 25px; margin: 12px 0 22px; }
.elfen-join-card .elfen-button { width: 100%; padding: 0 12px; }
.elfen-side-secondary { display: inline-block; margin-top: 15px; color: var(--elfen-muted) !important; font-size: 12px; }
.elfen-side-secondary:hover { color: var(--elfen-gold-light) !important; }
.elfen-card-title { display: flex; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--elfen-line); color: var(--elfen-gold-light); font-size: 11px; font-weight: 800; letter-spacing: .13em; }
.elfen-menu-card { padding: 18px 0 10px; }
.elfen-menu-card > .elfen-card-title { margin: 0 20px 10px; }
.elfen-menu-group { border-bottom: 1px solid #ffffff0d; }
.elfen-menu-group:last-child { border-bottom: 0; }
.elfen-menu-group summary { padding: 12px 20px; color: var(--elfen-cream); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; cursor: pointer; list-style: none; }
.elfen-menu-group summary::-webkit-details-marker { display: none; }
.elfen-menu-group summary::after { content: '+'; float: right; color: var(--elfen-gold); }
.elfen-menu-group[open] summary { color: var(--elfen-gold-light); background: #322140; }
.elfen-menu-group[open] summary::after { content: '−'; }
.elfen-menu-links { display: grid; padding: 7px 10px 12px; }
.elfen-menu-links a { display: flex; align-items: center; min-height: 38px; margin: 3px 0; padding: 8px 14px; border-left: 2px solid transparent; border-radius: 6px; color: var(--elfen-muted); font-size: 12px; transition: background .2s, color .2s; }
.elfen-menu-links a:hover { color: var(--elfen-gold-light); background: #ffffff0a; }
.elfen-menu-links a.is-active { border-left-color: transparent; background: linear-gradient(145deg,#ebc777,#bc842c); color: #211426 !important; font-weight: 800; box-shadow: inset 0 1px #fff7, 0 3px 9px #0003; }
.elfen-main { min-width: 0; }
.elfen-quickbar { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; margin-bottom: 18px; padding: 9px; background: linear-gradient(90deg,#241833,#171024); border: 1px solid var(--elfen-line); }
.elfen-quickbar a { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; padding: 0 15px; color: var(--elfen-cream); font-size: 12px; border-right: 1px solid var(--elfen-line); }
.elfen-quickbar a:last-child { border: 0; }
.elfen-quickbar a:hover { color: var(--elfen-gold-light); }
.elfen-quickbar a:first-child { margin-right: 6px; border: 0; border-radius: 6px; background: linear-gradient(145deg,#ebc777,#bc842c); color: #211426; font-weight: 800; box-shadow: inset 0 1px #fff7, 0 3px 9px #0003; }
.elfen-quickbar a:first-child:hover { background: linear-gradient(145deg,#f6d68f,#d49d38); color: #211426; }
.elfen-news-ticker-heading { display: flex; align-items: center; gap: 10px; min-height: 44px; margin: 0 0 9px; padding: 0 17px; border: 1px solid var(--elfen-line); background: linear-gradient(90deg,#30203d,#171024); color: var(--elfen-gold-light); font: 700 13px Georgia,serif; letter-spacing: .08em; }
.elfen-news-heading-line { height: 1px; flex: 1; background: linear-gradient(90deg,var(--elfen-line),transparent); }
.elfen-news-heading-tag { color: var(--elfen-gold); font: 700 9px "Segoe UI",Arial,sans-serif; letter-spacing: .16em; }
.elfen-live-dot { width: 7px; height: 7px; display: inline-block; border-radius: 50%; background: #59ca87; box-shadow: 0 0 9px #59ca87; }
.elfen-main .Box, .elfen-main .elfen-content-panel { position: relative; margin: 0 0 18px; background: #1c132c; color: var(--elfen-cream); border: 1px solid var(--elfen-line); box-shadow: 0 11px 28px #0003; font-size: 14px; overflow: visible; }
.elfen-main .Box > .Corner-tl, .elfen-main .Box > .Corner-tr, .elfen-main .Box > .CornerWrapper-b, .elfen-main .Box > .Border_1, .elfen-main .Box > .BorderTitleText, .elfen-main .Box > .Title, .elfen-main .Box > #ContentBoxHeadline { display: none !important; }
.elfen-main .Box > .Border_2, .elfen-main .Box > .Border_2 > .Border_3 { border: 0 !important; background: transparent !important; padding: 0 !important; margin: 0 !important; }
.elfen-panel-title { display: flex; align-items: center; gap: 9px; min-height: 47px; padding: 0 20px; border-bottom: 1px solid var(--elfen-line); background: linear-gradient(90deg,#352142,#21172e); color: var(--elfen-gold-light); font: 700 14px Georgia,serif; letter-spacing: .05em; }
.elfen-title-line { height: 1px; flex: 1; margin-left: 10px; background: linear-gradient(90deg,var(--elfen-line),transparent); }
.elfen-main .BoxContent { min-height: 0 !important; height: auto !important; padding: 22px !important; background: #1c142b !important; background-image: none !important; color: var(--elfen-cream) !important; font: 14px/1.65 "Segoe UI",Arial,sans-serif !important; overflow-x: auto; }
.elfen-page-news .elfen-main .BoxContent { background: linear-gradient(rgba(24,17,37,.91),rgba(24,17,37,.94)),url('images/elfen/bannernews.png') center center / cover !important; overflow-x: hidden !important; }
.elfen-main .BoxContent p, .elfen-main .BoxContent div, .elfen-main .BoxContent span, .elfen-main .BoxContent td, .elfen-main .BoxContent th, .elfen-main .BoxContent li, .elfen-main .BoxContent label, .elfen-main .BoxContent b { color: var(--elfen-cream) !important; }
.elfen-main .BoxContent a, .elfen-main .BoxContent a * { color: var(--elfen-gold-light) !important; }
.elfen-main .BoxContent a:hover { color: #fff4c9 !important; }
.elfen-main .BoxContent .Odd, .elfen-main .BoxContent tr:nth-child(odd), .elfen-main .BoxContent [bgcolor="#D4C0A1"] { background-color: #2a1e3b !important; }
.elfen-main .BoxContent .Even, .elfen-main .BoxContent tr:nth-child(even), .elfen-main .BoxContent [bgcolor="#F1E0C6"] { background-color: #221833 !important; }
.elfen-main .BoxContent .TableContentContainer, .elfen-main .BoxContent .TableContainer, .elfen-main .BoxContent .TableContent, .elfen-main .BoxContent .Table1, .elfen-main .BoxContent .Table2, .elfen-main .BoxContent .Table3 { background: #21172f !important; border-color: var(--elfen-line) !important; max-width: 100%; }
.elfen-main .BoxContent th { background: #3a2747 !important; color: var(--elfen-gold-light) !important; }
.elfen-main .BoxContent input:not([type="checkbox"]):not([type="radio"]), .elfen-main .BoxContent select, .elfen-main .BoxContent textarea { max-width: 100%; background: #130d20 !important; color: var(--elfen-cream) !important; border: 1px solid var(--elfen-line) !important; padding: 8px 10px; }
.elfen-main .BoxContent input[type="submit"], .elfen-main .BoxContent button { cursor: pointer; color: var(--elfen-gold-light) !important; }
.elfen-main #createaccount > .TableContainer { width: 100% !important; border: 1px solid var(--elfen-line) !important; border-radius: 6px; background: #1c142b !important; font-size: 14px !important; overflow: hidden; }
.elfen-main #createaccount .TableContainer > .CaptionContainer, .elfen-main #createaccount .TableContainer > .CaptionContainer > .CaptionInnerContainer { height: auto !important; padding: 0 !important; background: linear-gradient(145deg,#ebc777,#bc842c) !important; text-align: center !important; }
.elfen-main #createaccount .CaptionEdgeLeftTop, .elfen-main #createaccount .CaptionEdgeRightTop, .elfen-main #createaccount .CaptionEdgeLeftBottom, .elfen-main #createaccount .CaptionEdgeRightBottom, .elfen-main #createaccount .CaptionBorderTop, .elfen-main #createaccount .CaptionBorderBottom, .elfen-main #createaccount .CaptionVerticalLeft, .elfen-main #createaccount .CaptionVerticalRight { display: none !important; }
.elfen-main #createaccount .TableContainer > .CaptionContainer .Text { margin: 0 !important; padding: 12px 16px !important; color: #211426 !important; font: 800 15px/1.4 Georgia,serif !important; text-align: center !important; }
.elfen-main #createaccount table.Table5 { width: 100% !important; border: 0 !important; border-collapse: collapse !important; background: transparent !important; }
.elfen-main #createaccount table.Table5 > tbody > tr > td { padding: 0 !important; border: 0 !important; }
.elfen-main #createaccount .Table5 .InnerTableContainer { width: 100% !important; margin: 0 !important; padding: 12px !important; box-sizing: border-box; }
.elfen-main #createaccount .TableShadowContainerRightTop, .elfen-main #createaccount .TableShadowContainer { display: none !important; }
.elfen-main #createaccount .TableContentAndRightShadow { margin: 0 !important; padding: 0 !important; background: none !important; font-size: inherit !important; }
.elfen-main #createaccount .TableContentContainer { margin: 0 0 12px !important; padding: 0 !important; border: 1px solid var(--elfen-line) !important; border-radius: 4px; background: #21172f !important; box-shadow: none !important; overflow: hidden; }
.elfen-main #createaccount table.TableContent { width: 100% !important; border: 0 !important; border-collapse: collapse !important; border-spacing: 0 !important; background: #21172f !important; }
.elfen-main #createaccount table.TableContent > tbody > tr > td { padding: 8px 12px !important; border-bottom: 1px solid #ffffff12; vertical-align: middle; }
.elfen-main #createaccount table.TableContent > tbody > tr:last-child > td { border-bottom: 0; }
.elfen-main #createaccount table.TableContent > tbody > tr:has(.FormFieldError:empty) { display: none !important; }
.elfen-main #createaccount table.TableContent > tbody > tr > td.LabelV { width: 180px !important; min-width: 180px; white-space: nowrap; }
.elfen-main #createaccount table.TableContent input[type="text"], .elfen-main #createaccount table.TableContent input[type="password"], .elfen-main #createaccount table.TableContent select { width: min(100%,360px) !important; min-width: 0; min-height: 40px; box-sizing: border-box; }
.elfen-main #createaccount table.TableContent #character_name { width: min(100%,360px) !important; }
.elfen-main #createaccount .FormFieldError { display: inline-block; padding: 2px 0; color: #ffaaa4 !important; font-size: 12px; }
.elfen-main .elfen-rules-intro { margin: 0 0 20px; color: var(--elfen-cream); font-size: 16px; }
.elfen-main .elfen-rules-section { margin: 0 0 14px; padding: 17px 19px; border: 1px solid var(--elfen-line); border-radius: 5px; background: #21172f; }
.elfen-main .elfen-rules-section h2 { margin: 0 0 10px; color: var(--elfen-gold-light); font: 700 18px/1.4 Georgia,serif; }
.elfen-main .elfen-rules-section p, .elfen-main .elfen-rules-section ul { margin: 0; }
.elfen-main .elfen-rules-section ul { padding-left: 22px; }
.elfen-main .elfen-rules-section li { margin: 5px 0; }
.elfen-main .elfen-rules-updated { margin: 18px 0 0; color: var(--elfen-muted); font-size: 12px; }

/* Server information page */
.elfen-server-info { display: grid; gap: 20px; }
.elfen-server-links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px; border: 1px solid var(--elfen-line); background: rgba(22,15,38,.94); }
.elfen-server-links a { display: inline-flex; align-items: center; gap: 10px; min-height: 40px; padding: 0 15px; border: 1px solid transparent; border-radius: 4px; color: var(--elfen-cream); font-size: 13px; font-weight: 700; }
.elfen-server-links a span { color: var(--elfen-gold); }
.elfen-server-links a:hover { border-color: var(--elfen-line); background: #30203f; color: var(--elfen-gold-light); }
.elfen-server-grid { display: grid; gap: 18px; align-items: start; }
.elfen-server-overview { grid-template-columns: minmax(250px,.82fr) minmax(0,1.18fr); }
.elfen-server-details { grid-template-columns: repeat(2,minmax(0,1fr)); }
.elfen-server-card { min-width: 0; overflow: hidden; border: 1px solid var(--elfen-line); border-radius: 5px; background: rgba(25,17,41,.96); box-shadow: 0 12px 28px rgba(0,0,0,.2); }
.elfen-server-card-heading { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 10px 16px; border-bottom: 1px solid var(--elfen-line); background: linear-gradient(110deg,#2b1d3d,#21162f); color: var(--elfen-gold-light); font: 700 16px/1.25 Georgia,"Times New Roman",serif; }
.elfen-server-card-heading > span { color: var(--elfen-gold); font: 14px/1 "Segoe UI",sans-serif; }
.elfen-server-card-content { padding: 18px; }
.elfen-save-content { text-align: center; }
.elfen-save-schedule { margin: 0 0 16px; color: var(--elfen-muted); }
.elfen-save-schedule strong { color: var(--elfen-cream); }
.elfen-save-countdown { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.elfen-save-countdown > div { display: grid; gap: 3px; padding: 15px 8px; border: 1px solid var(--elfen-line); border-radius: 4px; background: linear-gradient(145deg,#2a1d3d,#1a122a); }
.elfen-save-countdown strong { color: var(--elfen-gold-light); font: 700 clamp(22px,2.6vw,30px)/1 Georgia,"Times New Roman",serif; font-variant-numeric: tabular-nums; }
.elfen-save-countdown span { color: var(--elfen-muted); font-size: 11px; }
.elfen-server-facts { margin: 0; padding: 4px 16px; }
.elfen-server-facts > div { display: grid; grid-template-columns: minmax(120px,.8fr) minmax(0,1.2fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(216,168,72,.14); }
.elfen-server-facts > div:last-child { border-bottom: 0; }
.elfen-server-facts dt { color: var(--elfen-muted); font-size: 13px; }
.elfen-server-facts dd { margin: 0; color: var(--elfen-cream); font-size: 13px; font-weight: 650; overflow-wrap: anywhere; }
.elfen-server-facts dd span { color: var(--elfen-gold); }
.elfen-server-note { margin: 12px 0 0; color: var(--elfen-muted); font-size: 12px; }
.elfen-combat-note { padding: 0 16px 14px; }
.elfen-rate-facts { padding-top: 0; padding-bottom: 0; }
.elfen-stage-grid { display: grid; gap: 8px; }
.elfen-stage-details { overflow: hidden; border: 1px solid rgba(216,168,72,.24); border-radius: 4px; background: rgba(13,9,24,.42); }
.elfen-stage-details summary { display: flex; justify-content: space-between; gap: 12px; padding: 11px 13px; color: var(--elfen-cream); font-size: 13px; font-weight: 700; cursor: pointer; }
.elfen-stage-details summary::marker { color: var(--elfen-gold); }
.elfen-stage-details summary span { color: var(--elfen-gold); font-size: 11px; white-space: nowrap; }
.elfen-stage-table-wrap { padding: 0 10px 10px; }
.elfen-stage-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.elfen-stage-table th, .elfen-stage-table td { padding: 7px 9px; border-bottom: 1px solid rgba(216,168,72,.12); text-align: left; }
.elfen-stage-table th { color: var(--elfen-gold-light); font-weight: 700; }
.elfen-stage-table td { color: var(--elfen-cream); }
@media (max-width: 760px) { .elfen-server-overview,.elfen-server-details { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .elfen-server-links { display: grid; grid-template-columns: 1fr; } .elfen-server-facts { padding-inline: 12px; } .elfen-server-facts > div { grid-template-columns: 1fr; gap: 3px; } .elfen-server-card-content { padding: 14px; } }

/* Team and in-game support page */
.elfen-team-page { display: grid; gap: 20px; }
.elfen-team-intro { padding: 20px 22px; border: 1px solid var(--elfen-line); border-radius: 5px; background: linear-gradient(120deg,rgba(43,29,61,.94),rgba(25,17,41,.96)); }
.elfen-team-kicker { color: var(--elfen-gold); font-size: 10px; font-weight: 800; letter-spacing: .2em; }
.elfen-team-intro h2 { margin: 7px 0 6px; color: var(--elfen-cream); font-size: clamp(24px,3vw,32px); }
.elfen-team-intro p { margin: 0; color: var(--elfen-muted); }
.elfen-team-count { margin: -7px 0 0; color: var(--elfen-muted); font-size: 12px; }
.elfen-team-group { overflow: hidden; border: 1px solid var(--elfen-line); border-radius: 5px; background: rgba(25,17,41,.94); }
.elfen-team-group-title { display: flex; align-items: center; gap: 10px; margin: 0; padding: 13px 16px; border-bottom: 1px solid var(--elfen-line); background: #261a38; color: var(--elfen-gold-light); font: 700 17px/1.3 Georgia,"Times New Roman",serif; }
.elfen-team-group-title > span:first-child { color: var(--elfen-gold); font: 11px/1 "Segoe UI",sans-serif; }
.elfen-team-group-count { margin-left: auto; color: var(--elfen-muted); font: 600 11px/1 "Segoe UI",sans-serif; }
.elfen-team-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,250px),1fr)); gap: 12px; padding: 14px; }
.elfen-team-member { display: flex; min-width: 0; min-height: 106px; align-items: center; gap: 14px; padding: 13px; border: 1px solid rgba(216,168,72,.2); border-radius: 4px; background: linear-gradient(145deg,#21172f,#181124); }
.elfen-team-outfit { display: grid; flex: 0 0 68px; width: 68px; height: 76px; place-items: center; overflow: hidden; }
.elfen-team-outfit img { display: block; width: 64px; height: 64px; object-fit: contain; image-rendering: pixelated; }
.elfen-team-member-info { min-width: 0; }
.elfen-team-member-info h4 { margin: 0 0 6px; color: var(--elfen-cream); font: 700 15px/1.35 "Segoe UI",Arial,sans-serif; overflow-wrap: anywhere; }
.elfen-team-member-info h4 a { color: var(--elfen-gold-light); }
.elfen-team-status { display: inline-flex; align-items: center; gap: 6px; color: var(--elfen-muted); font-size: 11px; }
.elfen-team-status > span { width: 7px; height: 7px; border-radius: 50%; background: #9b7380; }
.elfen-team-status.is-online > span { background: #55ce91; box-shadow: 0 0 8px #55ce9177; }
.elfen-team-meta { margin: 8px 0 0; }
.elfen-team-meta > div { display: flex; gap: 5px; color: var(--elfen-muted); font-size: 11px; }
.elfen-team-meta dt::after { content: ':'; }
.elfen-team-meta dd { margin: 0; color: var(--elfen-cream); }
.elfen-team-empty { padding: 22px; border: 1px solid var(--elfen-line); border-radius: 5px; background: rgba(25,17,41,.94); color: var(--elfen-muted); text-align: center; }
@media (max-width: 480px) { .elfen-team-intro { padding: 16px; } .elfen-team-grid { grid-template-columns: 1fr; padding: 10px; } }

/* Houses, guilds and recent deaths */
.elfen-directory-page { display: grid; gap: 18px; }
.elfen-directory-intro { padding: 20px 22px; border: 1px solid var(--elfen-line); border-radius: 5px; background: linear-gradient(120deg,rgba(43,29,61,.94),rgba(25,17,41,.96)); }
.elfen-directory-kicker { color: var(--elfen-gold); font-size: 10px; font-weight: 800; letter-spacing: .2em; }
.elfen-directory-intro h2 { margin: 7px 0 6px; color: var(--elfen-cream); font-size: clamp(24px,3vw,32px); }
.elfen-directory-intro p { margin: 0; color: var(--elfen-muted); }
.elfen-directory-count { margin: -7px 0 0; color: var(--elfen-muted); font-size: 12px; }
.elfen-directory-panel { overflow: hidden; border: 1px solid var(--elfen-line); border-radius: 5px; background: rgba(25,17,41,.96); box-shadow: 0 12px 28px rgba(0,0,0,.18); }
.elfen-directory-panel-heading { display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 11px 16px; border-bottom: 1px solid var(--elfen-line); background: linear-gradient(110deg,#2b1d3d,#21162f); color: var(--elfen-gold-light); font: 700 16px/1.25 Georgia,"Times New Roman",serif; }
.elfen-directory-panel-heading > span { color: var(--elfen-gold); font: 11px/1 "Segoe UI",sans-serif; }
.elfen-directory-panel-heading small { margin-left: auto; color: var(--elfen-muted); font: 500 12px/1.4 "Segoe UI",sans-serif; }
.elfen-directory-empty { padding: 22px; border: 1px solid var(--elfen-line); border-radius: 5px; background: rgba(25,17,41,.94); color: var(--elfen-muted); text-align: center; }
.elfen-directory-empty p { margin: 0; }
.elfen-directory-empty p + p { margin-top: 8px; }
.elfen-directory-empty h3 { margin: 0 0 7px; color: var(--elfen-cream); }
.elfen-directory-empty.inline { margin: 14px; border: 0; background: transparent; }
.elfen-directory-notice { padding: 14px 17px; border: 1px solid rgba(216,168,72,.28); border-radius: 4px; background: rgba(216,168,72,.08); }
.elfen-directory-notice strong { color: var(--elfen-gold-light); }
.elfen-directory-notice p { margin: 4px 0 0; color: var(--elfen-muted); font-size: 13px; }
.elfen-directory-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 38px; padding: 0 14px; border: 1px solid var(--elfen-line); border-radius: 4px; background: rgba(34,24,50,.9); color: var(--elfen-gold-light) !important; font: 700 12px/1.3 "Segoe UI",Arial,sans-serif; text-align: center; cursor: pointer; }
.elfen-directory-button:hover { border-color: var(--elfen-gold); background: #30203f; color: #fff !important; }
.elfen-directory-button.is-primary { border-color: #e5b95e; background: linear-gradient(145deg,#ebc777,#bc842c); color: #211426 !important; }
.elfen-directory-button.is-primary:hover { background: linear-gradient(145deg,#f6d68f,#d49d38); }
.elfen-directory-button.is-danger { border-color: rgba(214,104,104,.55); color: #f0b4b4 !important; }
.elfen-house-list { display: grid; }
.elfen-house-row { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(75px,.5fr) minmax(90px,.55fr) auto; align-items: center; gap: 13px; padding: 13px 16px; border-bottom: 1px solid rgba(216,168,72,.12); }
.elfen-house-row:last-child { border-bottom: 0; }
.elfen-house-main { display: flex; min-width: 0; align-items: center; gap: 12px; }
.elfen-house-icon { display: grid; flex: 0 0 38px; width: 38px; height: 38px; place-items: center; border: 1px solid var(--elfen-line); border-radius: 4px; color: var(--elfen-gold); font: 26px/1 Georgia,serif; }
.elfen-house-main h3 { margin: 0; color: var(--elfen-cream); font: 700 14px/1.4 "Segoe UI",Arial,sans-serif; overflow-wrap: anywhere; }
.elfen-house-main p { margin: 3px 0 0; color: var(--elfen-muted); font-size: 12px; }
.elfen-house-main p a { color: var(--elfen-gold-light); }
.elfen-house-fact { display: grid; gap: 2px; }
.elfen-house-fact span { color: var(--elfen-muted); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.elfen-house-fact strong { color: var(--elfen-cream); font-size: 12px; }
.elfen-house-filters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; padding: 17px; }
.elfen-house-filters label { display: grid; gap: 6px; color: var(--elfen-muted); font-size: 12px; font-weight: 650; }
.elfen-house-filters select, .elfen-guild-nick-form input { width: 100%; min-height: 40px; padding: 7px 10px; border: 1px solid var(--elfen-line); border-radius: 4px; background: #130d22; color: var(--elfen-cream); font: 13px "Segoe UI",Arial,sans-serif; }
.elfen-house-filters > button { justify-self: start; }
.elfen-house-detail-card { display: grid; grid-template-columns: minmax(180px,.75fr) minmax(0,1.25fr); }
.elfen-house-image { display: grid; min-height: 220px; place-items: center; padding: 18px; background: rgba(13,9,24,.46); }
.elfen-house-image img { max-height: 320px; width: 100%; object-fit: contain; border: 1px solid rgba(216,168,72,.18); border-radius: 4px; }
.elfen-house-detail-copy { align-self: center; padding: 23px; color: var(--elfen-muted); }
.elfen-house-detail-copy h3 { margin: 0 0 12px; color: var(--elfen-gold-light); font: 700 20px/1.3 Georgia,serif; }
.elfen-house-detail-copy strong { color: var(--elfen-cream); }
.elfen-house-detail-copy .elfen-directory-button { margin-top: 8px; }
.elfen-guild-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,270px),1fr)); gap: 14px; }
.elfen-guild-card { display: grid; grid-template-columns: 68px minmax(0,1fr); align-items: center; gap: 12px; padding: 15px; border: 1px solid var(--elfen-line); border-radius: 5px; background: rgba(25,17,41,.96); }
.elfen-guild-logo { display: grid; width: 64px; height: 64px; place-items: center; border: 1px solid rgba(216,168,72,.24); border-radius: 4px; background: #160f26; }
.elfen-guild-logo img { max-width: 58px; max-height: 58px; object-fit: contain; }
.elfen-guild-card-copy { min-width: 0; }
.elfen-guild-card-copy h3 { margin: 0 0 4px; color: var(--elfen-gold-light); font: 700 16px/1.35 Georgia,serif; overflow-wrap: anywhere; }
.elfen-guild-card-copy p { margin: 0; color: var(--elfen-muted); font-size: 12px; overflow-wrap: anywhere; }
.elfen-guild-card-copy p.is-muted { font-style: italic; }
.elfen-guild-card > .elfen-directory-button { grid-column: 1 / -1; justify-self: stretch; }
.elfen-guild-admin-link { grid-column: 1 / -1; color: #e89a9a !important; font-size: 11px; text-align: center; }
.elfen-guild-create-panel { padding-bottom: 16px; }
.elfen-guild-create-panel > p, .elfen-guild-create-panel > form, .elfen-guild-create-panel > a { margin: 14px 16px 0; }
.elfen-guild-create-panel > form { display: inline-block; }
.elfen-guild-hero { display: flex; align-items: center; gap: 18px; padding: 20px; border: 1px solid var(--elfen-line); border-radius: 5px; background: linear-gradient(120deg,rgba(43,29,61,.94),rgba(25,17,41,.96)); }
.elfen-guild-hero img { flex: 0 0 86px; width: 86px; height: 86px; padding: 5px; border: 1px solid var(--elfen-line); border-radius: 5px; background: #160f26; object-fit: contain; }
.elfen-guild-hero h2 { margin: 5px 0; color: var(--elfen-cream); font-size: clamp(23px,3vw,31px); overflow-wrap: anywhere; }
.elfen-guild-hero p { margin: 0; color: var(--elfen-muted); }
.elfen-guild-about { padding: 17px; color: var(--elfen-muted); }
.elfen-guild-about p { margin: 8px 0; }
.elfen-guild-about strong, .elfen-guild-about a { color: var(--elfen-gold-light); }
.elfen-guild-description { margin-bottom: 13px; color: var(--elfen-cream); overflow-wrap: anywhere; }
.elfen-guild-ranks { display: grid; gap: 13px; padding: 14px; }
.elfen-guild-rank { overflow: hidden; border: 1px solid rgba(216,168,72,.18); border-radius: 4px; }
.elfen-guild-rank h3 { margin: 0; padding: 10px 13px; border-bottom: 1px solid rgba(216,168,72,.17); background: #21172f; color: var(--elfen-gold-light); font: 700 15px/1.3 Georgia,serif; }
.elfen-guild-member-list { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,260px),1fr)); gap: 9px; padding: 10px; }
.elfen-guild-member { display: flex; min-width: 0; align-items: center; gap: 10px; padding: 11px; border: 1px solid rgba(216,168,72,.15); border-radius: 4px; background: rgba(13,9,24,.37); }
.elfen-guild-member-main { display: flex; flex: 1; min-width: 0; align-items: flex-start; gap: 9px; }
.elfen-guild-member-mark { color: var(--elfen-gold); }
.elfen-guild-member h4 { margin: 0; font: 700 13px/1.4 "Segoe UI",Arial,sans-serif; overflow-wrap: anywhere; }
.elfen-guild-member h4 a { color: var(--elfen-cream); }
.elfen-guild-member h4 small, .elfen-guild-nick { display: block; color: var(--elfen-muted); font-size: 11px; font-weight: 400; }
.elfen-guild-member p { margin: 4px 0 0; color: var(--elfen-muted); font-size: 11px; }
.elfen-guild-member p span { color: var(--elfen-gold); }
.elfen-guild-member-status { display: inline-flex; align-items: center; gap: 5px; color: var(--elfen-muted); font-size: 10px; white-space: nowrap; }
.elfen-guild-member-status i { width: 7px; height: 7px; border-radius: 50%; background: #a56c70; }
.elfen-guild-member-status.is-online i { background: #55ce91; box-shadow: 0 0 7px #55ce9177; }
.elfen-guild-kick { color: #e89a9a !important; font-size: 10px; }
.elfen-guild-nick-form { display: flex; flex-wrap: wrap; align-items: end; gap: 5px; margin-top: 5px; }
.elfen-guild-nick-form label { display: grid; gap: 3px; color: var(--elfen-muted); font-size: 10px; }
.elfen-guild-nick-form input { min-height: 30px; padding: 4px 7px; font-size: 11px; }
.elfen-guild-nick-form .elfen-directory-button { min-height: 30px; padding: 0 8px; font-size: 10px; }
.elfen-guild-invites { display: grid; gap: 8px; padding: 14px 17px; }
.elfen-guild-invites > div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid rgba(216,168,72,.13); color: var(--elfen-cream); }
.elfen-guild-invites a { color: var(--elfen-gold-light); }
.elfen-guild-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; }
.elfen-guild-actions form { margin: 0; }
.elfen-kill-list { overflow: hidden; border: 1px solid var(--elfen-line); border-radius: 5px; background: rgba(25,17,41,.96); }
.elfen-kill-row { display: grid; grid-template-columns: 44px minmax(0,1fr) auto; align-items: center; gap: 14px; padding: 14px 16px; border-bottom: 1px solid rgba(216,168,72,.14); }
.elfen-kill-row:last-child { border-bottom: 0; }
.elfen-kill-index { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid var(--elfen-line); border-radius: 50%; color: var(--elfen-gold-light); font: 700 13px Georgia,serif; }
.elfen-kill-details { min-width: 0; }
.elfen-kill-details p { margin: 0; color: var(--elfen-cream); font-size: 13px; overflow-wrap: anywhere; }
.elfen-kill-details p a { color: var(--elfen-gold-light); font-weight: 700; }
.elfen-kill-details time { display: block; margin-top: 4px; color: var(--elfen-muted); font-size: 11px; }
.elfen-kill-world { padding: 5px 8px; border: 1px solid rgba(216,168,72,.22); border-radius: 3px; color: var(--elfen-gold-light); font-size: 10px; }
@media (max-width: 680px) { .elfen-house-row { grid-template-columns: minmax(0,1fr) auto; } .elfen-house-main { grid-column: 1 / -1; } .elfen-house-filters { grid-template-columns: 1fr; } .elfen-house-detail-card { grid-template-columns: 1fr; } .elfen-house-image { min-height: 150px; } }
@media (max-width: 480px) { .elfen-directory-intro { padding: 16px; } .elfen-directory-panel-heading { padding-inline: 12px; } .elfen-house-row { padding: 12px; gap: 9px; } .elfen-guild-hero { align-items: flex-start; gap: 12px; padding: 14px; } .elfen-guild-hero img { flex-basis: 62px; width: 62px; height: 62px; } .elfen-guild-member { flex-wrap: wrap; } .elfen-kill-row { grid-template-columns: 34px minmax(0,1fr); gap: 9px; padding: 12px; } .elfen-kill-index { width: 30px; height: 30px; font-size: 11px; } .elfen-kill-world { grid-column: 2; justify-self: start; } }
.elfen-success-stack { display: grid; gap: 14px; }
.elfen-success-card { overflow: hidden; border: 1px solid var(--elfen-line); border-radius: 5px; background: rgba(25,17,41,.96); box-shadow: 0 10px 24px rgba(0,0,0,.16); }
.elfen-success-heading { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 15px; border-bottom: 1px solid var(--elfen-line); background: linear-gradient(110deg,#2b1d3d,#21162f); color: var(--elfen-gold-light); font: 700 16px/1.3 Georgia,"Times New Roman",serif; }
.elfen-success-heading > span { color: var(--elfen-gold); font-size: 13px; }
.elfen-success-content { padding: 15px 17px; color: var(--elfen-cream); overflow-wrap: anywhere; }
.elfen-success-content b, .elfen-success-content strong { color: var(--elfen-gold-light); }
.elfen-success-actions { display: flex; justify-content: flex-start; margin-top: 14px; }
.elfen-main .elfen-auth-panel { margin: 0 0 20px; overflow: hidden; border: 1px solid var(--elfen-line); border-radius: 6px; background: #1c142b; box-shadow: 0 8px 24px #0003; }
.elfen-main .elfen-auth-panel-heading { padding: 12px 16px; background: linear-gradient(145deg,#ebc777,#bc842c); color: #211426; font: 800 15px/1.4 Georgia,serif; text-align: center; }
.elfen-main .elfen-auth-panel-body { padding: 20px; }
.elfen-main .elfen-auth-field { display: grid; grid-template-columns: 170px minmax(0,1fr); align-items: center; gap: 14px; margin: 0 0 14px; }
.elfen-main .elfen-auth-field label { color: var(--elfen-cream); font-weight: 700; }
.elfen-main .elfen-auth-field input { width: 100%; min-height: 42px; box-sizing: border-box; }
.elfen-main .elfen-auth-remember { display: flex; align-items: center; gap: 8px; margin: 0 0 16px 184px; }
.elfen-main .elfen-auth-remember input { margin: 0; }
.elfen-main .elfen-auth-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; }
.elfen-main .elfen-auth-panel .elfen-button { border-radius: 6px; color: #211426 !important; cursor: pointer; }
.elfen-main .elfen-auth-recovery { display: inline-flex; align-items: center; min-height: 42px; padding: 0 14px; border: 1px solid var(--elfen-line); border-radius: 6px; color: var(--elfen-gold-light) !important; }
.elfen-main .elfen-auth-recovery:hover { background: #ffffff0a; }
.elfen-main .elfen-new-player-body { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px; }
.elfen-main .elfen-new-player-body h2 { margin: 0 0 9px; color: var(--elfen-cream); font: 700 21px/1.3 Georgia,serif; }
.elfen-main .elfen-new-player-body p { margin: 0; color: var(--elfen-muted); }
.elfen-main .elfen-new-player-body .elfen-button { flex: 0 0 auto; }
.elfen-main .NewsHeadlineBackground, .elfen-main #NewsArchive .NewsHeadlineBackground { background: #3b274a !important; border: 1px solid var(--elfen-line) !important; }
.elfen-main .NewsHeadlineText, .elfen-main .NewsHeadlineDate { color: var(--elfen-cream) !important; }
.elfen-server-news { max-width: 100%; margin: 0 auto; color: var(--elfen-cream); line-height: 1.8; }
.elfen-server-news > img { display: block; width: 100%; max-height: 390px; margin: 0 0 25px; object-fit: cover; border: 1px solid var(--elfen-line); box-shadow: 0 10px 30px #0006; }
.elfen-server-news h2 { margin: 26px 0 10px; color: var(--elfen-gold-light); font: 700 22px/1.3 Georgia,serif; }
.elfen-server-news p { margin: 0 0 16px; }
.elfen-server-news ul { margin: 0 0 22px; padding-left: 23px; }
.elfen-server-news li { margin: 0 0 9px; padding-left: 3px; }
.elfen-server-news li::marker { color: var(--elfen-gold); }
.elfen-server-news .elfen-news-callout { margin: 22px 0 4px; padding: 16px 19px; border: 1px solid var(--elfen-line); background: linear-gradient(110deg,#30203d,#1b1329); }
.elfen-main #newsticker .BoxContent, .elfen-main #NewsTicker .BoxContent { min-height: 0 !important; padding: 13px !important; }
.elfen-main #newsticker { margin-bottom: 12px; }
.elfen-main #newsticker .BoxContent { height: auto !important; overflow: visible !important; }
.elfen-main #newsticker .NewsTickerFullText { display: none; }
.elfen-main #newsticker .Row, .elfen-main #NewsTicker .Row { border-bottom: 1px solid #ffffff14; cursor: pointer; }
.elfen-main #newsticker .Row:last-child, .elfen-main #NewsTicker .Row:last-child { border: 0; }
.elfen-main #newsticker .Odd, .elfen-main #newsticker .Even, .elfen-main #NewsTicker .Odd, .elfen-main #NewsTicker .Even { background: transparent !important; padding: 9px 3px; }
.elfen-main .NewsTickerDate { color: var(--elfen-gold) !important; }
.elfen-main #newsticker .NewsTickerDate { position: static; display: inline-block; margin-right: 10px; font-size: 11px; }
.elfen-main #newsticker .NewsTickerShortText { display: inline; height: auto; margin: 0; line-height: 1.6; }
.elfen-main #FeaturedArticle .BoxContent { min-height: 0 !important; }
.elfen-page-news .elfen-main #FeaturedArticle .BoxContent { min-height: 180px !important; height: auto !important; padding: 22px !important; background: linear-gradient(90deg,rgba(19,13,29,.9),rgba(19,13,29,.72)),url('images/elfen/bannernews.png') center center / cover !important; }
.elfen-page-news .elfen-main #FeaturedArticle #TeaserText { height: auto; min-height: 130px; overflow: visible; }
.elfen-page-news .elfen-inner-shell { margin-top: 22px; }
.elfen-main #TeaserThumbnail img { border: 1px solid var(--elfen-line); object-fit: cover; }
.elfen-online-card { text-align: center; }
.elfen-right-rail .elfen-card-title { justify-content: center; text-align: center; }
.elfen-online-count { margin: 14px 0 0; color: var(--elfen-gold-light); font: 700 40px/1 Georgia,serif; }
.elfen-online-card p, .elfen-download-card p { margin: 8px 0 13px; color: var(--elfen-muted); font-size: 12px; }
.elfen-online-card > a { font-size: 11px; font-weight: 800; }
.elfen-download-card .elfen-button { min-height: 44px; font-size: 10px; padding: 0 8px; }
.elfen-right-rail .elfen-download-card .elfen-button { border-radius: 6px; border-color: #d8a848; background: linear-gradient(145deg,#ebc777,#bc842c); color: #211426 !important; box-shadow: inset 0 1px #fff7, 0 5px 14px #0004; }
.elfen-right-rail .elfen-download-card .elfen-button:hover { background: linear-gradient(145deg,#f6d68f,#d49d38); }
.elfen-right-rail #Themeboxes { display: grid; gap: 17px; text-align: center; }
.elfen-right-rail #Themeboxes > div, .elfen-right-rail #Themeboxes > form > div { width: 100% !important; height: auto !important; max-height: none !important; min-width: 0 !important; margin: 0 !important; background: #1d1430 !important; border: 1px solid var(--elfen-line); box-shadow: 0 10px 28px #0003; }
.elfen-right-rail #Themeboxes [class$="_header"] { display: grid; place-items: center; width: 100% !important; height: auto !important; min-height: 45px; padding: 11px 15px; line-height: 1.5 !important; background: #352142 !important; border-bottom: 1px solid var(--elfen-line); color: var(--elfen-gold-light) !important; font: 700 13px/1.5 Georgia,serif !important; text-align: center !important; }
.elfen-right-rail #Themeboxes .rank_header { display: flex !important; align-items: center; justify-content: center; gap: 9px; }
.elfen-right-rail #Themeboxes .rank_header::before, .elfen-right-rail #Themeboxes .rank_header::after { content: ''; flex: 1; height: 1px; background: var(--elfen-line); }
.elfen-right-rail #Themeboxes .rank-heading-symbol { color: var(--elfen-gold); font-size: 10px; }
.elfen-right-rail #Themeboxes .rank_outfit { right: 18px; top: 23%; width: 100px; height: 120px; transform: translateY(-50%); background-position: center bottom; background-size: contain; z-index: 2; }
.elfen-right-rail #Themeboxes [class$="_content"] { width: 100% !important; height: auto !important; max-height: none !important; padding: 14px !important; background: #1d1430 !important; color: var(--elfen-cream) !important; }
.elfen-right-rail #Themeboxes .donate_content { min-height: 150px; background: linear-gradient(rgba(18,11,24,.22),rgba(18,11,24,.58)),url('images/elfen/shop.png') center 56% / cover no-repeat !important; }
.elfen-right-rail #Themeboxes [class$="_bottom"] { display: none !important; }
.elfen-right-rail #Themeboxes [class$="_button"] { max-width: 100%; padding: 0 8px; border: 1px solid var(--elfen-gold) !important; border-radius: 3px; background: #35223d !important; color: var(--elfen-gold-light) !important; font-weight: 700 !important; }
.elfen-right-rail #Themeboxes [class$="_button"]:hover { background: #583b54 !important; }
.elfen-right-rail #Themeboxes [class$="_text"], .elfen-right-rail #Themeboxes [class$="_text"] a { color: var(--elfen-cream) !important; }
.elfen-right-rail #Themeboxes [class$="_input"] { max-width: 100%; background: #110c1e !important; color: #fff !important; border: 1px solid var(--elfen-line) !important; }

.elfen-footer { display: grid; grid-template-columns: 1fr auto auto; gap: 35px; align-items: center; padding: 45px max(32px,calc((100vw - 1480px)/2)); border-top: 1px solid var(--elfen-line); background: #0b0714; }
.elfen-footer-brand { color: var(--elfen-gold-light) !important; font: 700 20px Georgia,serif; }
.elfen-footer p { color: var(--elfen-muted); font-size: 12px; margin: 5px 0 0; }
.elfen-footer nav { display: flex; flex-wrap: wrap; gap: 16px; }
.elfen-footer nav a, .elfen-footer-meta { color: var(--elfen-muted); font-size: 11px; }
.elfen-footer-meta a { color: var(--elfen-gold-light); }
.elfen-back-top { position: fixed; right: 22px; bottom: 22px; z-index: 80; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--elfen-gold); background: #1b122b; color: var(--elfen-gold-light) !important; box-shadow: 0 5px 22px #0007; }
#HelperDivContainer { display: none; position: absolute; z-index: 1000; width: 260px; padding: 14px; background: #21162f; border: 1px solid var(--elfen-gold); box-shadow: 0 10px 30px #0008; color: var(--elfen-cream); font: 12px/1.5 "Segoe UI",Arial,sans-serif; }
#HelperDivHeadline { margin-bottom: 7px; color: var(--elfen-gold-light); font: 700 15px Georgia,serif; }
#HelperDivText { color: var(--elfen-cream); }

@media (max-width: 1180px) {
  .elfen-inner-shell { grid-template-columns: 220px minmax(0,1fr); }
  .elfen-right-rail { grid-column: 1 / -1; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .elfen-right-rail #Themeboxes { grid-column: 1 / -1; grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .elfen-header-inner { width: calc(100% - 36px); min-height: 72px; gap: 14px; }
  .elfen-menu-toggle { margin-right: auto; }
  .elfen-header-logo { width: 64px; height: 64px; }
  .elfen-brand-text { font-size: 18px; }
  .elfen-brand-text small { font-size: 6px; }
  .elfen-menu-toggle { width: 38px; height: 38px; display: flex; flex-direction: column; justify-content: center; gap: 5px; background: transparent; border: 1px solid var(--elfen-line); padding: 8px; cursor: pointer; }
  .elfen-menu-toggle span { height: 2px; width: 100%; background: var(--elfen-gold-light); }
  .elfen-navigation { display: none; position: absolute; top: 72px; left: 0; right: 0; padding: 18px 24px 24px; background: #160f26; border-bottom: 1px solid var(--elfen-line); box-shadow: 0 20px 35px #0008; }
  .elfen-navigation.is-open { display: grid; gap: 15px; align-items: stretch; }
  .elfen-dropdown-panel { position: static; margin-top: 8px; width: 100%; box-shadow: none; }
  .elfen-account-link { min-height: 38px; padding: 0 10px; font-size: 11px; }
  .elfen-inner-shell { grid-template-columns: minmax(0,1fr); }
  .elfen-main { order: 1; }
  .elfen-side-menu { order: 2; grid-template-columns: 1fr 1fr; }
  .elfen-right-rail { order: 3; }
  .elfen-footer { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .elfen-brand-strip { height: 220px; margin-bottom: -80px; }
  .elfen-brand-strip a { width: min(550px,92vw); }
  .elfen-header-logo { width: 50px; height: 50px; }
  .elfen-header-inner { width: calc(100% - 28px); }
  .elfen-brand-mark { width: 34px; height: 34px; font-size: 20px; }
  .elfen-brand-text { font-size: 14px; }
  .elfen-brand-text small { letter-spacing: .13em; }
  .elfen-account-link { font-size: 0; width: 38px; padding: 0; }
  .elfen-account-link span { font-size: 18px; }
  .elfen-hero { min-height: 710px; padding: 65px 20px 90px; background-position: 48% center; }
  .elfen-hero-shade { background: linear-gradient(180deg,#100b1c91,#100b1bc7 45%,#0d0918); }
  .elfen-hero h1 { font-size: 36px; }
  .elfen-hero-actions { display: grid; }
  .elfen-hero-meta { gap: 7px 15px; font-size: 11px; }
  .elfen-meta-divider { display: none; }
  .elfen-section { width: calc(100% - 32px); padding: 70px 0; }
  .elfen-world-grid, .elfen-feature-grid, .elfen-step-grid { grid-template-columns: 1fr; }
  .elfen-world-art { min-height: 270px; }
  .elfen-feature-card { min-height: 260px; }
  .elfen-page-banner-inner { width: calc(100% - 36px); }
  .elfen-inner-shell { width: calc(100% - 28px); margin-top: 18px; }
  .elfen-side-menu, .elfen-right-rail, .elfen-right-rail #Themeboxes { grid-template-columns: 1fr; }
  .elfen-main .BoxContent { padding: 13px !important; }
  .elfen-quickbar { justify-content: center; }
  .elfen-quickbar a { padding: 0 8px; font-size: 10px; }
  .elfen-footer { padding: 40px 22px; }
  .elfen-main .elfen-auth-panel-body { padding: 15px; }
  .elfen-main .elfen-auth-field { grid-template-columns: 1fr; gap: 6px; }
  .elfen-main .elfen-auth-remember { margin-left: 0; }
  .elfen-main .elfen-new-player-body { display: grid; }
  .elfen-main .elfen-new-player-body .elfen-button { width: 100%; }
}

/* Account management uses the same cards and borders as the other inner pages. */
.elfen-page-account .elfen-main .BoxContent > .TableContainer {
  margin: 0 0 20px !important;
  border: 1px solid var(--elfen-line) !important;
  border-radius: 6px;
  background: #1c142b !important;
  box-shadow: 0 10px 28px #0003;
  font-size: 14px;
  overflow: hidden;
}
.elfen-page-account .elfen-main .TableContainer .CaptionContainer,
.elfen-page-account .elfen-main .TableContainer .CaptionInnerContainer {
  height: auto !important;
  padding: 0 !important;
  background: linear-gradient(90deg,#352142,#21172e) !important;
  font-size: inherit !important;
}
.elfen-page-account .elfen-main .TableContainer .CaptionContainer { border-bottom: 1px solid var(--elfen-line); }
.elfen-page-account .elfen-main .TableContainer .CaptionInnerContainer > span { display: none !important; }
.elfen-page-account .elfen-main .TableContainer .CaptionContainer .Text {
  display: flex;
  align-items: center;
  min-height: 48px;
  margin: 0 !important;
  padding: 10px 18px !important;
  color: var(--elfen-gold-light) !important;
  font: 700 16px/1.35 Georgia,serif !important;
  letter-spacing: .03em;
}
.elfen-page-account .elfen-main .TableContainer .CaptionContainer .Text::before {
  content: '◆';
  margin-right: 10px;
  color: var(--elfen-gold);
  font: 11px/1 "Segoe UI",sans-serif;
}
.elfen-page-account .elfen-main .TableContainer > table {
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: collapse;
  background: transparent !important;
}
.elfen-page-account .elfen-main .TableContainer > table > tbody > tr > td { padding: 0 !important; border: 0 !important; }
.elfen-page-account .elfen-main .TableContainer .InnerTableContainer {
  width: 100% !important;
  margin: 0 !important;
  padding: 16px !important;
  box-sizing: border-box;
}
.elfen-page-account .elfen-main .TableContainer .InnerTableContainer > table { width: 100%; border-collapse: collapse; }
.elfen-page-account .elfen-main .TableContainer .TableContentAndRightShadow {
  margin: 0 !important;
  background: none !important;
  font-size: inherit !important;
}
.elfen-page-account .elfen-main .TableContainer .TableShadowContainerRightTop,
.elfen-page-account .elfen-main .TableContainer .TableShadowContainer { display: none !important; }
.elfen-page-account .elfen-main .TableContainer .TableContentContainer {
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--elfen-line) !important;
  border-radius: 4px;
  background: #21172f !important;
  box-shadow: none !important;
  overflow-x: auto;
}
.elfen-page-account .elfen-main .TableContainer table.TableContent {
  width: 100% !important;
  border: 0 !important;
  border-collapse: collapse;
  background: #21172f !important;
}
.elfen-page-account .elfen-main .TableContainer table.TableContent td {
  padding: 10px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid #ffffff12 !important;
  vertical-align: middle;
}
.elfen-page-account .elfen-main .TableContainer table.TableContent tr:last-child > td { border-bottom: 0 !important; }
.elfen-page-account .elfen-main .TableContainer table.TableContent tr.LabelH > td {
  background: #352542 !important;
  color: var(--elfen-gold-light) !important;
  font-weight: 700;
}
.elfen-page-account .elfen-main .TableContainer .BigBoldText { color: var(--elfen-cream) !important; }
.elfen-page-account .elfen-main .TableContainer .AccountStatusImage { max-width: 48px; height: auto; }
.elfen-page-account .elfen-main .TableContainer .premiumbenefits {
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 10px;
}
.elfen-page-account .elfen-main .TableContainer .premiumbenefits > div {
  min-width: 0;
  margin: 0 !important;
  padding: 10px;
  border: 1px solid var(--elfen-line);
  border-radius: 4px;
  background: #291c3b;
  justify-content: flex-start !important;
  font-size: 12px;
}
.elfen-page-account .elfen-main .TableContainer .premiumbenefits img { flex: none; max-width: 36px; height: auto; }
.elfen-page-account .elfen-main .elfen-account-download-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 6px 2px;
}
.elfen-page-account .elfen-main .elfen-account-download-row strong { color: var(--elfen-gold-light); font-size: 16px; }
.elfen-page-account .elfen-main .elfen-account-download-row p { margin: 4px 0 0; color: var(--elfen-muted) !important; }
.elfen-page-account .elfen-main .elfen-account-download-row .elfen-directory-button { flex: none; min-height: 42px; }
.elfen-page-account .elfen-main .SmallBox {
  margin: 0 0 20px;
  border: 1px solid var(--elfen-line);
  border-radius: 6px;
  background: #21172f;
  box-shadow: 0 10px 28px #0003;
  font-size: 14px;
  overflow: hidden;
}
.elfen-page-account .elfen-main .SmallBox [class^="BoxFrame"] { display: none !important; }
.elfen-page-account .elfen-main .SmallBox .Message { padding: 16px 18px !important; background: #21172f !important; font-size: 14px; }
.elfen-page-account .elfen-main .SmallBox .Message table { width: 100%; border-collapse: collapse; }
.elfen-page-account .elfen-main .SmallBox .Message tr,
.elfen-page-account .elfen-main .SmallBox .Message td { padding: 5px 0; border: 0 !important; background: transparent !important; }
.elfen-page-account .elfen-main .SmallBox .Message td.LabelV { color: var(--elfen-gold-light) !important; font-size: 16px; white-space: normal; }
.elfen-page-account .elfen-main .TopButtonContainer { display: none; }
.elfen-page-account .elfen-main .BigButton {
  width: auto !important;
  min-width: 135px;
  height: 38px !important;
  border: 1px solid var(--elfen-line);
  border-radius: 4px;
  background: #291c3b !important;
}
.elfen-page-account .elfen-main .BigButton > div { height: 100%; }
.elfen-page-account .elfen-main .BigButton .BigButtonOver { display: none !important; }
.elfen-page-account .elfen-main .BoxContent .BigButtonText {
  position: static !important;
  display: block;
  width: 100% !important;
  height: 100% !important;
  padding: 0 12px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--elfen-gold-light) !important;
  font: 700 12px "Segoe UI",Arial,sans-serif !important;
  text-shadow: none !important;
}
.elfen-page-account .elfen-main .BigButton:hover { border-color: var(--elfen-gold); background: #352542 !important; }
.elfen-page-account .elfen-main .BoxContent > br { display: none; }
@media (max-width: 680px) {
  .elfen-page-account .elfen-main .TableContainer .InnerTableContainer { padding: 10px !important; }
  .elfen-page-account .elfen-main .TableContainer table.TableContent td { padding: 8px !important; }
  .elfen-page-account .elfen-main .TableContainer .premiumbenefits { grid-template-columns: 1fr; }
  .elfen-page-account .elfen-main .elfen-account-download-row { align-items: flex-start; flex-direction: column; }
}

/* Character, online and ranking pages share the inner-page panel design. */
.elfen-page-legacy .elfen-main .TableContainer {
  margin: 0 0 18px !important;
  border: 1px solid var(--elfen-line) !important;
  border-radius: 6px;
  background: #1c142b !important;
  box-shadow: 0 10px 28px #0003;
  font-size: 14px !important;
  overflow: hidden;
}
.elfen-page-legacy .elfen-main .TableContainer .CaptionContainer,
.elfen-page-legacy .elfen-main .TableContainer .CaptionInnerContainer {
  height: auto !important;
  padding: 0 !important;
  background: linear-gradient(90deg,#352142,#21172e) !important;
  font-size: inherit !important;
}
.elfen-page-legacy .elfen-main .TableContainer .CaptionContainer { border-bottom: 1px solid var(--elfen-line); }
.elfen-page-legacy .elfen-main .TableContainer .CaptionInnerContainer > span { display: none !important; }
.elfen-page-legacy .elfen-main .TableContainer .CaptionContainer .Text {
  display: flex;
  align-items: center;
  min-height: 48px;
  margin: 0 !important;
  padding: 10px 18px !important;
  color: var(--elfen-gold-light) !important;
  font: 700 16px/1.35 Georgia,serif !important;
  letter-spacing: .03em;
}
.elfen-page-legacy .elfen-main .TableContainer .CaptionContainer .Text::before {
  content: '◆';
  margin-right: 10px;
  color: var(--elfen-gold);
  font: 11px/1 "Segoe UI",sans-serif;
}
.elfen-page-legacy .elfen-main .TableContainer > table {
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: collapse;
  background: transparent !important;
}
.elfen-page-legacy .elfen-main .TableContainer > table > tbody > tr > td { padding: 0 !important; border: 0 !important; }
.elfen-page-legacy .elfen-main .TableContainer .InnerTableContainer {
  width: 100% !important;
  margin: 0 !important;
  padding: 16px !important;
  box-sizing: border-box;
}
.elfen-page-legacy .elfen-main .TableContainer .InnerTableContainer > table { width: 100%; border-collapse: collapse; }
.elfen-page-legacy .elfen-main .TableContainer .TableContentAndRightShadow { margin: 0 !important; background: none !important; font-size: inherit !important; }
.elfen-page-legacy .elfen-main .TableContainer .TableShadowContainerRightTop,
.elfen-page-legacy .elfen-main .TableContainer .TableShadowContainer { display: none !important; }
.elfen-page-legacy .elfen-main .TableContainer .TableContentContainer {
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--elfen-line) !important;
  border-radius: 4px;
  background: #21172f !important;
  box-shadow: none !important;
  overflow-x: auto;
}
.elfen-page-legacy .elfen-main .TableContainer table.TableContent {
  width: 100% !important;
  border: 0 !important;
  border-collapse: collapse;
  background: #21172f !important;
}
.elfen-page-legacy .elfen-main .TableContainer table.TableContent td {
  padding: 10px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid #ffffff12 !important;
  vertical-align: middle;
}
.elfen-page-legacy .elfen-main .TableContainer table.TableContent tr:last-child > td { border-bottom: 0 !important; }
.elfen-page-legacy .elfen-main .TableContainer table.TableContent tr.LabelH > td,
.elfen-page-legacy .elfen-main .TableContainer table.TableContent td.LabelV150,
.elfen-page-legacy .elfen-main .TableContainer table.TableContent td.LabelV175 { color: var(--elfen-gold-light) !important; font-weight: 700; }
.elfen-page-legacy .elfen-main .TableContainer table.TableContent tr.LabelH > td { background: #352542 !important; }
.elfen-page-legacy .elfen-main .BoxContent > table { width: 100%; border-collapse: collapse; }
.elfen-page-legacy .elfen-main .BoxContent > table > tbody > tr > td { padding: 0 !important; border: 0 !important; }
.elfen-page-highscores .elfen-main .PageNavigation { padding: 10px 12px !important; background: #291c3b !important; }
.elfen-page-highscores .elfen-main .RightArea { margin-left: auto; font: 12px/1.5 "Segoe UI",Arial,sans-serif !important; letter-spacing: 0; }
.elfen-page-online .elfen-main .BoxContent > table:first-of-type > tbody { display: block; }
.elfen-page-online .elfen-main .BoxContent > table:first-of-type > tbody > tr {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 16px;
  background: transparent !important;
}
.elfen-page-online .elfen-main .BoxContent > table:first-of-type > tbody > tr > td { display: block; width: auto !important; min-width: 0; padding: 0 !important; }
.elfen-page-online .elfen-main .BoxContent > table:first-of-type .TableContainer { height: calc(100% - 18px); }
.elfen-page-online .elfen-main .TableContent img[alt="player outfit"] { position: static !important; margin: 0 !important; max-width: 64px; max-height: 64px; object-fit: contain; }
@media (max-width: 680px) {
  .elfen-page-legacy .elfen-main .TableContainer .InnerTableContainer { padding: 10px !important; }
  .elfen-page-legacy .elfen-main .TableContainer table.TableContent td { padding: 8px !important; }
  .elfen-page-online .elfen-main .BoxContent > table:first-of-type > tbody > tr { grid-template-columns: 1fr; gap: 0; }
  .elfen-page-highscores .elfen-main .RightArea { display: block; width: 100%; margin: 4px 0 0; }
}

/* Character creation follows the same panel and form style as the inner pages. */
.elfen-page-create-character .elfen-main .elfen-create-character { display: grid; gap: 18px; }
.elfen-page-create-character .elfen-main .elfen-create-intro { margin: 0 !important; color: var(--elfen-cream) !important; }
.elfen-page-create-character .elfen-main .elfen-create-warning {
  margin: 0 !important;
  padding: 12px 15px;
  border: 1px solid rgba(220,123,123,.5);
  border-radius: 4px;
  background: rgba(113,36,53,.22);
  color: #f5c7c7 !important;
}
.elfen-page-create-character .elfen-main .elfen-create-card {
  overflow: hidden;
  border: 1px solid var(--elfen-line);
  border-radius: 6px;
  background: #1c142b;
  box-shadow: 0 10px 28px #0003;
}
.elfen-page-create-character .elfen-main .elfen-create-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  margin: 0;
  padding: 10px 18px;
  border-bottom: 1px solid var(--elfen-line);
  background: linear-gradient(90deg,#352142,#21172e);
  color: var(--elfen-gold-light) !important;
  font: 700 16px/1.35 Georgia,serif;
  letter-spacing: .03em;
}
.elfen-page-create-character .elfen-main .elfen-create-heading span { color: var(--elfen-gold) !important; font: 11px/1 "Segoe UI",sans-serif; }
.elfen-page-create-character .elfen-main .elfen-create-body { padding: 18px; }
.elfen-page-create-character .elfen-main .elfen-create-fields {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 20px;
  padding: 18px;
  border: 1px solid var(--elfen-line);
  border-radius: 4px;
  background: #21172f;
}
.elfen-page-create-character .elfen-main .elfen-create-field { min-width: 0; margin: 0; padding: 0; border: 0; }
.elfen-page-create-character .elfen-main .elfen-create-vocations { grid-column: 1 / -1; }
.elfen-page-create-character .elfen-main .elfen-create-field > label,
.elfen-page-create-character .elfen-main .elfen-create-field > legend { display: block; margin: 0 0 9px; padding: 0; color: var(--elfen-gold-light) !important; font-weight: 700; }
.elfen-page-create-character .elfen-main .elfen-create-name-row { display: flex; align-items: center; gap: 9px; }
.elfen-page-create-character .elfen-main #character_name { flex: 1; min-width: 0; width: 100%; min-height: 41px; }
.elfen-page-create-character .elfen-main #character_indicator { flex: none; width: 16px; height: 16px; object-fit: contain; }
.elfen-page-create-character .elfen-main #character_error { display: block; min-height: 18px; margin-top: 7px; color: var(--elfen-muted) !important; font-size: 12px; }
.elfen-page-create-character .elfen-main #character_error span[style*="red"] { color: #f0a2a2 !important; }
.elfen-page-create-character .elfen-main #character_error span[style*="green"] { color: #8fdfa8 !important; }
.elfen-page-create-character .elfen-main .elfen-create-genders label { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; color: var(--elfen-cream) !important; cursor: pointer; }
.elfen-page-create-character .elfen-main .elfen-create-genders input[type="radio"] { margin: 0; accent-color: var(--elfen-gold); }
.elfen-vocation-choices {
  display: grid;
  grid-template-columns: repeat(6,minmax(0,1fr));
  gap: 10px;
  width: 100%;
}
.elfen-vocation-card {
  position: relative;
  display: block;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--elfen-cream) !important;
  cursor: pointer;
}
.elfen-vocation-card > input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.elfen-vocation-card-content {
  display: flex;
  height: 100%;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #76552f;
  border-radius: 4px;
  background: linear-gradient(180deg,#302039,#1a1325);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.elfen-vocation-card:hover .elfen-vocation-card-content { transform: translateY(-2px); border-color: var(--elfen-gold); }
.elfen-vocation-card.is-coming-soon { cursor: default; }
.elfen-vocation-card.is-coming-soon .elfen-vocation-card-description { color: var(--elfen-gold-light) !important; font-weight: 800; letter-spacing: .08em; }
.elfen-vocation-card.is-coming-soon:hover .elfen-vocation-card-content { transform: none; border-color: #76552f; }
.elfen-vocation-card:has(input:checked) .elfen-vocation-card-content {
  border: 2px solid var(--elfen-gold);
  box-shadow: 0 0 0 2px #d9a34335, 0 0 18px #d9a3432b;
}
.elfen-vocation-card:has(input:focus-visible) .elfen-vocation-card-content { outline: 2px solid var(--elfen-gold-light); outline-offset: 2px; }
.elfen-vocation-card-image { display: block; width: 100%; height: auto; aspect-ratio: 293 / 485; object-fit: contain; background: #17111f; }
.elfen-vocation-card-name.elfen-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; }
.elfen-vocation-card-description { display: block; flex: 1; padding: 9px 10px 11px; color: var(--elfen-cream) !important; text-align: center; font-size: 11px; line-height: 1.4; }
.elfen-page-create-character .elfen-main .elfen-create-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.elfen-page-create-character .elfen-main .elfen-create-actions .elfen-directory-button { min-width: 150px; min-height: 42px; }
.elfen-page-create-character .elfen-main .elfen-create-actions .is-primary { color: #211426 !important; }
@media (max-width: 680px) {
  .elfen-page-create-character .elfen-main .elfen-create-body { padding: 10px; }
  .elfen-page-create-character .elfen-main .elfen-create-fields { grid-template-columns: 1fr; gap: 16px; padding: 14px; }
  .elfen-page-create-character .elfen-main .elfen-create-actions .elfen-directory-button { flex: 1; }
}
@media (max-width: 900px) { .elfen-vocation-choices { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 520px) {
  .elfen-vocation-choices { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
}

.elfen-page-delete-character .elfen-main .elfen-delete-card {
  border: 1px solid var(--elfen-line);
  border-radius: 4px;
  background: #1c142b;
  box-shadow: 0 10px 28px #0003;
  overflow: hidden;
}
.elfen-page-delete-character .elfen-main .elfen-delete-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  margin: 0;
  padding: 10px 18px;
  border-bottom: 1px solid var(--elfen-line);
  background: linear-gradient(90deg,#352142,#21172e);
  color: var(--elfen-gold-light) !important;
  font: 700 16px/1.35 Georgia,serif;
  letter-spacing: .03em;
}
.elfen-page-delete-character .elfen-main .elfen-delete-heading span { color: var(--elfen-gold) !important; font: 11px/1 "Segoe UI",sans-serif; }
.elfen-page-delete-character .elfen-main .elfen-delete-body { padding: 18px; }
.elfen-page-delete-character .elfen-main .elfen-delete-intro { margin: 0 0 16px; color: var(--elfen-muted) !important; }
.elfen-page-delete-character .elfen-main .elfen-delete-warning { margin: 0 0 16px; padding: 11px 13px; border: 1px solid rgba(214,104,104,.4); border-radius: 4px; background: rgba(110,43,55,.16); color: #f0b4b4 !important; }
.elfen-page-delete-character .elfen-main .elfen-delete-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; padding: 18px; border: 1px solid var(--elfen-line); border-radius: 4px; background: #21172f; }
.elfen-page-delete-character .elfen-main .elfen-delete-field { display: grid; gap: 8px; min-width: 0; }
.elfen-page-delete-character .elfen-main .elfen-delete-field label { color: var(--elfen-gold-light) !important; font-weight: 700; }
.elfen-page-delete-character .elfen-main .elfen-delete-field input { box-sizing: border-box; width: 100%; min-height: 41px; }
.elfen-page-delete-character .elfen-main .elfen-delete-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.elfen-page-delete-character .elfen-main .elfen-delete-actions .elfen-directory-button { min-width: 150px; min-height: 42px; }
.elfen-page-delete-character .elfen-main .elfen-delete-actions .is-danger { background: linear-gradient(145deg,#7c3545,#552637); }
.elfen-page-delete-character .elfen-main .elfen-delete-actions .is-danger:hover { border-color: #e18a8a; background: linear-gradient(145deg,#994457,#683044); }
@media (max-width: 680px) {
  .elfen-page-delete-character .elfen-main .elfen-delete-body { padding: 12px; }
  .elfen-page-delete-character .elfen-main .elfen-delete-fields { grid-template-columns: 1fr; gap: 14px; padding: 14px; }
  .elfen-page-delete-character .elfen-main .elfen-delete-actions .elfen-directory-button { flex: 1; }
}

.elfen-main .BoxContent .elfen-error-box {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0 0 18px;
  padding: 14px 16px;
  border: 1px solid rgba(220,115,115,.48);
  border-left: 3px solid #d96d78;
  border-radius: 4px;
  background: linear-gradient(110deg,rgba(112,47,64,.3),rgba(43,29,54,.86));
  color: var(--elfen-cream);
}
.elfen-main .BoxContent .elfen-error-icon {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 23px;
  border: 1px solid rgba(235,164,164,.7);
  border-radius: 50%;
  background: rgba(161,67,81,.3);
  color: #ffd2ca !important;
  font: 700 15px/1 "Segoe UI",Arial,sans-serif;
}
.elfen-main .BoxContent .elfen-error-content { min-width: 0; }
.elfen-main .BoxContent .elfen-error-title { display: block; margin: 0 0 5px; color: #f1c4b7 !important; font-size: 13px; }
.elfen-main .BoxContent .elfen-error-content ul { margin: 0; padding-left: 17px; color: var(--elfen-cream); font-size: 12px; }
.elfen-main .BoxContent .elfen-error-content li { padding: 1px 0; }

/* Use smaller WebP artwork where supported; the original PNG declarations above remain as fallback. */
@supports (background-image: image-set(url('images/elfen/background.webp') type('image/webp'), url('images/elfen/background.png') type('image/png'))) {
  body.elfen-site { background-image: linear-gradient(rgba(13,9,24,.48),rgba(13,9,24,.68)), image-set(url('images/elfen/background.webp') type('image/webp'), url('images/elfen/background.png') type('image/png')); }
  .elfen-world-art { background-image: linear-gradient(180deg,transparent 35%,#140d20), image-set(url('images/elfen-hero.webp') type('image/webp'), url('images/elfen-hero.png') type('image/png')); }
  .elfen-community { background-image: linear-gradient(90deg,#130c21dd,#1b1230cc), image-set(url('images/elfen-hero.webp') type('image/webp'), url('images/elfen-hero.png') type('image/png')); }
  .elfen-download-page { background-image: linear-gradient(rgba(13,9,24,.78),rgba(13,9,24,.88)), image-set(url('images/elfen/background.webp') type('image/webp'), url('images/elfen/background.png') type('image/png')); }
  .elfen-page-banner { background-image: linear-gradient(90deg,rgba(16,11,30,.84),rgba(27,18,48,.69) 50%,rgba(16,11,30,.82)), image-set(url('images/elfen/banner.webp') type('image/webp'), url('images/elfen/banner.png') type('image/png')); }
  .elfen-right-rail #Themeboxes .donate_content { background-image: linear-gradient(rgba(18,11,24,.22),rgba(18,11,24,.58)), image-set(url('images/elfen/shop.webp') type('image/webp'), url('images/elfen/shop.png') type('image/png')) !important; }
}