:root {
  --background: #090714;
  --background-2: #110c25;
  --panel: rgba(17, 13, 35, .96);
  --panel-hover: rgba(29, 21, 52, .98);
  --line: rgba(178, 124, 239, .38);
  --line-faint: rgba(188, 156, 237, .13);
  --violet: #ae5aff;
  --violet-light: #d4a4ff;
  --violet-deep: #5b1696;
  --text: #f8f5ff;
  --muted: #aea6c2;
  --gold: #e9c283;
  --green: #47ee73;
  --red: #ef6885;
  --header-h: 79px;
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--text); font-family: Inter, "Segoe UI", Arial, sans-serif; font-size: 14px; background: radial-gradient(ellipse at 20% 5%, rgba(75, 34, 112, .23), transparent 35%), radial-gradient(ellipse at 90% 40%, rgba(91, 35, 129, .15), transparent 32%), linear-gradient(140deg, #090716 0%, #121025 48%, #070714 100%); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible { outline: 2px solid #c48eff; outline-offset: 3px; }
img { max-width: 100%; }
.ico { width: 19px; height: 19px; flex-shrink: 0; vertical-align: middle; }
.top-glow { position: fixed; inset: 0 0 auto; height: 1px; background: linear-gradient(90deg, transparent, #b86cff, transparent); pointer-events: none; z-index: 15; }
.site-header { height: var(--header-h); display: flex; align-items: center; gap: clamp(12px, 1.8vw, 31px); padding: 0 clamp(15px, 2.5vw, 44px); border-bottom: 1px solid rgba(177, 98, 240, .41); background: rgba(8, 7, 18, .97); position: relative; z-index: 10; box-shadow: 0 5px 25px rgba(0,0,0,.19); }
.header-brand { width: 210px; height: 76px; align-items: center; display: flex; justify-content: flex-start; flex-shrink: 0; }
.header-brand img { width: 118px; height: 75px; object-fit: contain; }
.main-navigation { display: flex; align-items: center; justify-content: center; gap: clamp(2px, .6vw, 12px); flex: 1 1 auto; min-width: 0; }
.top-link { display: flex; align-items: center; justify-content: center; gap: 9px; padding: 13px 12px; border: 1px solid transparent; color: #e3e0ec; font-size: 12px; font-weight: 750; white-space: nowrap; border-radius: 9px; transition: color .16s, background .16s, border-color .16s; }
.top-link .ico { width: 19px; height: 19px; }
.top-link:hover { color: white; background: rgba(167, 75, 248, .12); }
.top-link.is-active { background: linear-gradient(180deg, rgba(100, 24, 171, .93), rgba(61, 12, 107, .94)); border-color: rgba(192, 101, 255, .8); color: white; box-shadow: 0 0 17px rgba(176, 44, 255, .35), inset 0 1px 12px rgba(191, 72, 255, .15); }
.header-end { flex-shrink: 0; display: flex; align-items: center; gap: 15px; }
.language-indicator { font-size: 12px; font-weight: 750; display: flex; align-items: center; gap: 7px; }
.language-indicator span { font-size: 19px; }
.account-shortcut { display: none; align-items: center; gap: 7px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 100px; font-size: 11px; font-weight: 650; }
.account-shortcut .ico { width: 17px; }
.mobile-menu-toggle { display: none; border: 1px solid var(--line); color: white; background: #18102d; border-radius: 9px; padding: 9px; }
.site-layout { display: grid; grid-template-columns: 264px minmax(0, 1fr); gap: 21px; width: min(1700px, 100%); margin: auto; padding: 20px 22px 26px; align-items: stretch; }
.sidebar { min-width: 0; border-radius: 14px; border: 1px solid rgba(188, 111, 248, .36); background: linear-gradient(180deg, #131027 0%, #0d0a20 50%, #141025 100%); display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 12px 38px rgba(0,0,0,.2), inset 0 1px rgba(255,255,255,.06); }
.side-card { padding: 20px 13px 12px; }
.side-title { margin: 0 0 17px; display: flex; gap: 13px; align-items: center; padding: 0 10px 15px; border-bottom: 1px solid var(--line-faint); font-size: 15px; font-weight: 780; letter-spacing: .03em; }
.side-title .ico { width: 23px; height: 23px; }
.side-nav { display: flex; flex-direction: column; gap: 5px; }
.side-link { color: #dfd9ef; min-height: 45px; border-radius: 10px; display: flex; align-items: center; gap: 14px; padding: 11px 14px; font-size: 13px; font-weight: 570; border: 1px solid transparent; background: transparent; width: 100%; text-align: left; transition: background .15s; }
.side-link:hover { color: white; background: rgba(160, 94, 255, .12); }
.side-link.is-active { color: white; border-color: rgba(211, 127, 255, .4); background: linear-gradient(90deg, #7714cc, #4a187f); box-shadow: 0 0 15px rgba(170, 51, 239, .23); }
.side-link .ico { width: 20px; height: 20px; }
.side-link.requires-login { opacity: .87; }
.sign-in-link { margin-top: 5px; border-top: 1px solid var(--line-faint); }
.logout-form { width: 100%; }
.logout-button { font-family: inherit; }
.sidebar-landscape { margin-top: auto; min-height: 290px; background: linear-gradient(180deg, #131027 0%, transparent 20%, rgba(22, 10, 39, .08) 60%, #100a22 100%), url('../img/sidebar-realm.webp') center bottom / cover no-repeat; border-top: 1px solid rgba(196, 111, 241, .15); }
.main-content { min-width: 0; }
.hero { height: clamp(245px, 22.1vw, 338px); border: 1px solid rgba(182, 114, 248, .34); border-radius: 14px; overflow: hidden; background: radial-gradient(ellipse 49% 90% at 55% 42%, rgba(105, 49, 163, .40), transparent 75%), radial-gradient(ellipse 55% 90% at 16% 80%, rgba(128, 70, 211, .24), transparent 80%), linear-gradient(120deg, #140e2d 1%, #181131 40%, #1c103b 100%); position: relative; box-shadow: inset 0 1px rgba(230, 192, 255, .12), 0 8px 32px rgba(0,0,0,.19); isolation: isolate; }
.hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 67% 18%, rgba(228, 178, 255, .16), transparent 2%), radial-gradient(circle at 52% 32%, rgba(190, 126, 255, .1), transparent 23%), repeating-linear-gradient(110deg, transparent 0 23px, rgba(255,255,255,.006) 23px 24px); z-index: -1; }
.hero::after { content: ''; position: absolute; bottom: 0; left: 20%; right: 20%; height: 1px; background: linear-gradient(90deg, transparent, #d27dff, transparent); box-shadow: 0 0 15px #bc56fa; }
.hero-figure, .hero-world { position: absolute; top: 0; height: 100%; pointer-events: none; object-fit: cover; mix-blend-mode: screen; opacity: .94; }
.hero-figure { left: 0; width: 34%; object-position: left center; }
.hero-world { right: 0; width: 36%; object-position: right center; }
.hero-center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 2; pointer-events: none; }
.hero-logo { width: clamp(230px, 27vw, 340px); height: auto; max-height: 89%; object-fit: contain; filter: contrast(1.12) saturate(1.06) drop-shadow(0 0 4px rgba(164, 81, 231, .18)); image-rendering: auto; }
.dashboard-grid { display: grid; grid-template-columns: minmax(215px, 26%) minmax(0, 1fr) minmax(210px, 24%); gap: 15px; margin-top: 17px; }
.dashboard-left, .dashboard-right, .dashboard-center { display: flex; flex-direction: column; gap: 15px; min-width: 0; }
.panel, .promo-panel { background: linear-gradient(145deg, rgba(26, 18, 47, .98), rgba(13, 11, 30, .98) 77%); border: 1px solid rgba(185, 121, 239, .39); border-radius: 13px; position: relative; box-shadow: 0 12px 25px rgba(0,0,0,.12), inset 0 1px rgba(215, 160, 255, .12); overflow: hidden; }
.panel:before, .promo-panel:before { position: absolute; content: ''; top: 0; left: 20%; right: 20%; height: 1px; background: linear-gradient(90deg, transparent, rgba(228, 146, 255, .85), transparent); box-shadow: 0 0 11px #a847ef; }
.panel-title { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(15px, 1.28vw, 19px); letter-spacing: .02em; font-weight: 700; padding: 15px 17px 13px; margin: 0; display: flex; align-items: center; gap: 9px; border-bottom: 1px solid var(--line-faint); }
.panel-title .ico { color: #e2c6ff; width: 19px; height: 19px; }
.status-panel { min-height: 106px; display: flex; justify-content: center; }
.single-status { width: 100%; display: flex; justify-content: center; align-items: center; gap: 17px; font-size: clamp(17px, 1.44vw, 23px); font-weight: 720; white-space: nowrap; }
.status-dot { display: inline-block; flex: 0 0 auto; width: 19px; height: 19px; border-radius: 50%; background: #f0637f; box-shadow: 0 0 5px #ee6484, 0 0 13px rgba(238, 100, 132, .48); }
.status-dot.online { background: #37ed51; box-shadow: 0 0 5px #48fa74, 0 0 14px rgba(71, 250, 90, .5); }
.status-dot.small { width: 10px; height: 10px; margin-right: 8px; }
.online-text { color: #52ec69; }
.offline-text { color: #ef6681; }
.news-panel { min-height: 239px; display: flex; flex-direction: column; }
.news-entry { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 18px; border-bottom: 1px solid var(--line-faint); transition: background .15s; }
.news-entry:hover { background: rgba(173, 75, 255, .1); }
.news-entry strong, .news-entry small { display: block; }
.news-entry strong { font-size: 12px; font-weight: 650; line-height: 1.35; }
.news-entry small { color: var(--muted); font-size: 11px; padding-top: 5px; }
.news-entry .ico { width: 15px; height: 15px; }
.subtle-empty { padding: 24px 18px; color: var(--muted); font-size: 12px; line-height: 1.7; margin: 0; }
.panel-link { color: #daa5ff; margin: auto 14px 11px auto; padding: 10px 0 0; display: flex; align-items: center; gap: 2px; font-size: 12px; font-weight: 650; }
.panel-link:hover, .text-link:hover { color: #fff; }
.panel-link .ico, .text-link .ico { height: 15px; width: 15px; }
.ranking-panel { min-height: 100%; }
.ranking-panel .panel-title { font-size: clamp(18px, 1.6vw, 25px); justify-content: center; padding: 16px 13px; letter-spacing: .055em; }
.ranking-panel .panel-title .ico { color: var(--gold); }
.tabbar { display: flex; gap: 6px; padding: 12px 11px 9px; overflow-x: auto; scrollbar-width: thin; }
.rank-tab { display: flex; flex: 1 0 auto; align-items: center; justify-content: center; gap: 5px; white-space: nowrap; padding: 9px 7px; border-radius: 7px; background: linear-gradient(#2a223f, #161327); border: 1px solid rgba(162, 126, 204, .21); color: #eeeafb; font-size: 10px; font-weight: 670; transition: background .14s; }
.rank-tab .ico { width: 15px; height: 15px; }
.rank-tab:hover { background: #34204e; }
.rank-tab.is-active { border-color: rgba(197, 105, 254, .63); background: linear-gradient(180deg, #7020b5, #50117d); color: white; box-shadow: 0 0 12px rgba(170, 50, 225, .25); }
.ranking-scroller { width: 100%; overflow-x: auto; }
.ranking-table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.ranking-table th { color: #c3bdd3; padding: 13px 8px; font-weight: 600; font-size: 11px; text-align: left; white-space: nowrap; border-bottom: 1px solid rgba(212,170,251,.17); }
.ranking-table td { padding: 11px 8px; border-bottom: 1px solid rgba(212,170,251,.10); vertical-align: middle; }
.ranking-table tbody tr:nth-child(even) { background: rgba(181, 125, 245, .03); }
.ranking-table tbody tr:hover { background: rgba(181, 125, 245, .08); }
.ranking-table tr:last-child td { border-bottom: 0; }
.ranking-table .number-col { width: 36px; }
.ranking-table .right { text-align: right; }
.player-name { color: #df94ff; font-weight: 680; }
.place { font-weight: 850; font-size: 15px; color: #cfc7da; min-width: 20px; text-align: center; display: inline-block; }
.place-1 { color: #ffd364; text-shadow: 0 0 7px rgba(232,178,58,.4); }
.place-2 { color: #e1deed; }
.place-3 { color: #e49b64; }
.empty-cell { color: var(--muted); text-align: center; padding: 38px 12px !important; font-size: 12px; }
.guild-panel { min-height: 200px; display: flex; flex-direction: column; }
.guild-row { display: flex; align-items: center; padding: 11px 13px; border-bottom: 1px solid var(--line-faint); gap: 7px; font-size: 12px; }
.guild-name { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; }
.guild-row strong { font-weight: 550; white-space: nowrap; color: #d1c7df; font-size: 10px; }
.promo-panel { min-height: 169px; display: flex; align-items: center; justify-content: space-between; padding: 17px 14px 16px 18px; gap: 8px; }
.promo-panel > div { position: relative; z-index: 1; }
.promo-panel img { position: absolute; right: -14px; bottom: 0; width: 49%; opacity: .78; mix-blend-mode: screen; }
.eyebrow { font-size: 10px; font-weight: 790; color: #ba80ee; text-transform: uppercase; letter-spacing: .18em; }
.promo-panel h2 { font-family: Georgia, 'Times New Roman', serif; color: var(--gold); font-weight: 700; margin: 7px 0; font-size: 20px; white-space: nowrap; }
.promo-panel p { color: var(--muted); max-width: 110px; font-size: 11px; line-height: 1.5; }
.text-link { color: var(--violet-light); font-weight: 670; font-size: 12px; display: inline-flex; align-items: center; gap: 2px; }
.footer { background: rgba(8, 7, 19, .98); border-top: 1px solid rgba(199, 105, 252, .48); box-shadow: 0 -3px 18px rgba(174, 58, 224, .12); }
.footer-inner { margin: auto; max-width: 1600px; display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 14px 24px; }
.footer img { width: 91px; height: 60px; object-fit: contain; }
.footer nav { display: flex; align-items: center; gap: clamp(7px, 1.4vw, 27px); }
.footer nav a { color: #ccc4d7; font-size: 11px; white-space: nowrap; }
.footer nav a:hover { color: white; }
.footer small { color: #9e97b1; font-size: 10px; white-space: nowrap; }
.flash { border-radius: 9px; padding: 14px 17px; margin-bottom: 14px; background: rgba(125, 37, 71, .20); border: 1px solid rgba(234, 108, 154, .46); color: #ffcedd; font-size: 13px; }
.flash-success { border-color: rgba(72, 243, 126, .31); background: rgba(30, 109, 65, .17); color: #bafad1; }
.page-heading { padding: 43px 14px 25px; margin: 0 0 18px; border-bottom: 1px solid var(--line-faint); }
.page-heading h1 { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(32px, 3.2vw, 52px); font-weight: 650; letter-spacing: -.025em; margin: 9px 0; line-height: 1.1; }
.page-heading p { color: var(--muted); margin: 12px 0 0; font-size: 14px; line-height: 1.7; }
.information-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 17px; margin-bottom: 18px; }
.content-panel { padding: 24px 28px; margin-bottom: 18px; line-height: 1.8; }
.content-panel > h2, .content-panel div > h2 { font-family: Georgia,'Times New Roman',serif; margin-top: 7px; font-size: 22px; }
.content-panel p { color: var(--muted); max-width: 70ch; }
.info-feature { min-height: 180px; }
.info-feature > .ico, .download-card > .ico { color: var(--violet-light); width: 34px; height: 34px; }
.download-card { min-height: 270px; }
.download-card .primary-action { margin-top: 21px; }
.primary-action, .secondary-action { border: 1px solid #d198f5; color: white; border-radius: 10px; padding: 12px 18px; background: linear-gradient(135deg, #8333c7, #591a97); font-weight: 700; font-size: 13px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: filter .15s; }
.primary-action:hover, .secondary-action:hover { filter: brightness(1.13); }
.primary-action .ico, .secondary-action .ico { width: 17px; height: 17px; }
.secondary-action { background: #241a39; border-color: var(--line); }
.muted-action { display: inline-block; margin-top: 21px; font-size: 12px; color: #ad9dbd; border: 1px solid var(--line-faint); background: #221a31; border-radius: 9px; padding: 12px 16px; }
.form-panel { width: min(560px,100%); margin: 6px auto 26px; padding: 30px; }
.form-panel form { display: flex; flex-direction: column; gap: 8px; }
.form-panel label { margin-top: 8px; font-weight: 650; color: #e3d9ed; font-size: 12px; }
.form-panel input { background: rgba(8,8,21,.78); border: 1px solid rgba(195, 139, 255, .32); color: white; border-radius: 9px; padding: 14px 13px; width: 100%; outline: none; }
.form-panel input:focus { border-color: #b86fff; box-shadow: 0 0 0 3px rgba(182,87,255,.14); }
.form-panel input::placeholder { color: #7d718f; }
.form-panel form > .primary-action { margin-top: 16px; }
.form-help { color: var(--muted); text-align: center; margin: 22px 0 0; }
.account-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
.account-tile { padding: 24px; display: flex; flex-direction: column; gap: 15px; transition: transform .15s, background .15s; }
.account-tile:hover { transform: translateY(-3px); background: var(--panel-hover); }
.account-tile > .ico { width: 36px; height: 36px; color: #d6a8ff; }
.account-tile strong { font-size: 16px; }
.account-tile span { color: var(--muted); font-size: 12px; }
.account-message { display: flex; align-items: flex-start; gap: 20px; }
.account-message > .ico { width: 42px; height: 42px; color: #c89bff; }
.account-message p { margin-bottom: 17px; }
.article-body { color: #cfc4dc; white-space: normal; margin-bottom: 23px; }
@media(max-width:1450px) {
  .site-header { gap: 10px; }
  .header-brand { width: 155px; }
  .top-link { font-size: 11px; padding: 12px 9px; gap: 7px; }
  .dashboard-grid { grid-template-columns: minmax(210px,26%) minmax(0,1fr); }
  .dashboard-right { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .guild-panel { min-height: 170px; }
  .promo-panel { min-height: 170px; }
}
@media(max-width:1060px) {
  .site-layout { grid-template-columns: 210px minmax(0,1fr); padding: 13px 14px 20px; gap: 13px; }
  .site-header { padding: 0 14px; }
  .header-brand { width: 100px; }
  .header-brand img { width: 100px; }
  .top-link .ico { width: 16px; }
  .top-link { padding: 10px 5px; font-size: 10px; }
  .language-indicator { display: none; }
  .sidebar-landscape { min-height: 230px; }
  .hero-figure { width: 37%; }
  .hero-world { width: 37%; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .dashboard-left, .dashboard-right { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dashboard-right { grid-column: auto; }
  .ranking-panel { min-height: 365px; }
}
@media(max-width:760px) {
  .site-header { height: 67px; justify-content: space-between; }
  .header-brand { height: 66px; width: auto; }
  .header-brand img { width: 108px; height: 63px; }
  .mobile-menu-toggle { display: inline-flex; }
  .header-end { display: flex; }
  .account-shortcut { display: flex; }
  .main-navigation { display: none; position: absolute; top: 67px; left: 0; right: 0; background: rgba(11, 8, 27, .98); padding: 13px; flex-direction: column; border-bottom: 1px solid var(--line); box-shadow: 0 8px 18px rgba(0,0,0,.25); }
  .main-navigation.is-open { display: flex; }
  .main-navigation .top-link { width: 100%; justify-content: flex-start; padding: 12px 15px; font-size: 12px; }
  .site-layout { display: flex; flex-direction: column; }
  .sidebar { order: 2; }
  .main-content { order: 1; }
  .sidebar-landscape { display: none; }
  .side-card { padding: 14px 13px; }
  .side-title { font-size: 14px; padding-bottom: 8px; margin-bottom: 8px; }
  .side-nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; }
  .side-link { font-size: 12px; padding: 9px; }
  .hero { height: 270px; }
  .hero-logo { width: clamp(190px,44vw,280px); }
  .hero-figure { width: 38%; opacity: .7; }
  .hero-world { width: 38%; opacity: .75; }
  .footer-inner { flex-wrap: wrap; justify-content: center; }
  .footer nav { order: 3; flex-wrap: wrap; justify-content: center; }
  .footer small { white-space: normal; }
}
@media(max-width:550px) {
  .site-layout { padding: 11px 10px 16px; }
  .hero { height: 220px; }
  .hero-logo { width: 57%; }
  .hero-figure { width: 35%; opacity: .58; }
  .hero-world { width: 35%; opacity: .54; }
  .dashboard-grid { gap: 11px; margin-top: 11px; }
  .dashboard-left, .dashboard-right { display: flex; gap: 11px; }
  .status-panel { min-height: 83px; }
  .ranking-panel .panel-title { justify-content: flex-start; font-size: 19px; }
  .tabbar { padding: 9px; }
  .rank-tab { font-size: 10px; }
  .ranking-table { min-width: 530px; }
  .page-heading { padding: 27px 8px 16px; }
  .information-grid, .account-grid { grid-template-columns: 1fr; }
  .content-panel { padding: 20px; }
  .form-panel { padding: 19px; }
  .header-end .account-shortcut span { display: none; }
  .header-end .account-shortcut { padding: 9px; }
}
@media(prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *,*::before,*::after { transition: none !important; animation: none !important; } }

/* MU Berceni functional content — preserve original purple design */
.site-stat-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0 0 18px}
.site-stat {padding:22px;display:flex;flex-direction:column;gap:12px}
.site-stat span {display:flex;align-items:center;gap:9px;color:var(--muted);font-size:13px}
.site-stat .ico {width:19px;height:19px;color:#c999ef}
.site-stat strong {font:700 29px/1.1 Georgia,serif;color:#f1e4ff}
.server-values {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px}
.server-values>div {display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid rgba(186,130,220,.14);padding:11px 2px;font-size:14px}
.server-values span,.hint-line {color:var(--muted)}
.server-values strong {color:#ead8fc}
.compact-form {display:flex;flex-direction:column;align-items:stretch;gap:15px;max-width:730px}
.compact-form label {display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:650;color:#d8cbe9}
.compact-form input,.compact-form textarea {width:100%;background:rgba(12,10,28,.67);border:1px solid rgba(186,121,223,.5);border-radius:8px;padding:12px 14px;color:#fff;font:inherit;line-height:1.5}
.compact-form :is(input,textarea):focus {outline:2px solid #8f3cc6;outline-offset:1px}
.compact-form button {align-self:flex-start}
.admin-settings {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.admin-settings button {grid-column:1/-1}
.ticket-item {border-top:1px solid rgba(186,121,223,.19);padding:16px 0;margin-top:12px;line-height:1.65}
.ticket-item strong {color:#f3defd}
.ticket-item>small {display:block;color:var(--muted);margin:6px 0}
.ticket-item p {white-space:normal;color:#bdb3c9;margin:12px 0}
.ticket-badge {display:inline-block;margin-left:10px;padding:3px 8px;border-radius:12px;color:#d9afff;background:#421a65;font-size:11px}
.reply-note {border-left:3px solid #b075ed;padding:10px 13px;background:rgba(102,44,153,.13)}
.character-pills {display:flex;flex-wrap:wrap;gap:9px;margin:16px 0}
.character-pills span {padding:9px 12px;border-radius:8px;background:#26183a;border:1px solid rgba(186,121,223,.3);font-size:13px}
.prominent-number {font-size:24px;color:#f1d8ff}
@media(max-width:700px){.site-stat-grid,.admin-settings,.server-values{grid-template-columns:1fr}}

/* MU Berceni v3: crisp original crest, no dust/glow overlay */
.hero::before { background: radial-gradient(circle at 52% 32%,rgba(145,81,197,.09),transparent 25%); }
.hero-center { background: radial-gradient(ellipse 41% 68% at center,rgba(8,6,26,.15),transparent 80%); }
.character-detail-grid { display: grid;grid-template-columns: repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:18px }
.character-detail-card { padding:21px; }
.character-detail-head {display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line-faint);padding-bottom:13px;margin-bottom:12px}
.character-detail-head strong {font:700 20px Georgia,serif;color:#f5e8ff}
.character-detail-head span {color:var(--muted);font-size:12px}
.character-stats {display:grid;grid-template-columns:1fr 1fr;gap:11px 16px;margin:0}
.character-stats div {display:flex;flex-direction:column;gap:5px}
.character-stats dt {font-size:11px;color:#aa9cbc}
.character-stats dd {margin:0;font-weight:700;font-variant-numeric:tabular-nums}
.summary-strip {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin:0 0 18px}
.summary-tile {padding:20px;display:flex;flex-direction:column;gap:9px}
.summary-tile span {font-size:12px;color:var(--muted)}
.summary-tile strong {font:700 28px Georgia,serif;color:#faf0ff}
.account-detail-row {display:flex;gap:12px;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line-faint)}
.account-detail-row:last-child {border-bottom:0}
.account-detail-row span {color:var(--muted)}
.account-detail-row strong {color:#eee1fd;text-align:right}
.content-note {color:var(--muted);font-size:13px;line-height:1.7;margin:18px 0 5px}
.content-note a {color:var(--violet-light);text-decoration:underline}
.news-excerpt {font-size:13px;line-height:1.6;color:#c3b7d1;margin:11px 0 0}
.no-data-callout {padding:22px 25px;line-height:1.7;color:#cfbfdc}
.no-data-callout strong {display:block;color:#f2e8fb;margin-bottom:7px}
@media(max-width:700px){.summary-strip{grid-template-columns:1fr}.character-detail-grid{grid-template-columns:1fr}}

/* Season 20 class portraits beside real character names in all Rankings tabs. */
.ranking-table .player-identity {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
.ranking-table .character-avatar {
    display: block;
    width: 34px;
    height: 34px;
    flex: none;
    object-fit: cover;
    border: 1px solid rgba(199, 153, 244, .43);
    border-radius: 7px;
    background: #201832;
}
.ranking-table .player-nickname {
    overflow-wrap: anywhere;
}
@media (max-width: 700px) {
    .ranking-table .character-avatar { width: 30px; height: 30px; }
    .ranking-table .player-identity { gap: 7px; }
}

/* MU Berceni visual and live-ranking improvements (isolated overrides). */
.hero {
  height: clamp(270px, 24vw, 368px);
  background: radial-gradient(ellipse at 48% 36%, rgba(78,39,135,.34), transparent 54%),
              linear-gradient(100deg, #121230 0%, #15102d 43%, #100e29 62%, #191034 100%);
  border-color: rgba(150,119,229,.62);
  box-shadow: 0 14px 38px rgba(4,3,19,.34), inset 0 1px rgba(220,182,255,.16);
}
.hero::before {
  background: radial-gradient(ellipse at 49% 56%, rgba(44,18,91,.42), transparent 63%);
  z-index: 1;
  pointer-events: none;
}
.hero-figure, .hero-world { mix-blend-mode: normal; opacity: 1; object-fit: cover; z-index: 0; }
.hero-figure {
  left: 0; width: 38%; height: 100%; object-position: 55% 36%;
  -webkit-mask-image: linear-gradient(90deg,#000 0%,#000 54%,rgba(0,0,0,.83) 72%,transparent 100%);
  mask-image: linear-gradient(90deg,#000 0%,#000 54%,rgba(0,0,0,.83) 72%,transparent 100%);
}
.hero-world {
  right: 0; width: 38%; height: 100%; object-position: 51% 48%;
  -webkit-mask-image: linear-gradient(90deg,transparent 0%,rgba(0,0,0,.9) 36%,#000 68%,#000 100%);
  mask-image: linear-gradient(90deg,transparent 0%,rgba(0,0,0,.9) 36%,#000 68%,#000 100%);
}
.hero-center { z-index: 3; background: radial-gradient(ellipse 27% 64% at center,rgba(10,7,31,.48),transparent 95%); }
.hero-logo {
  width: clamp(245px, 29vw, 405px); max-height: 88%;
  filter: drop-shadow(0 4px 18px rgba(4,0,21,.85)) drop-shadow(0 0 9px rgba(134,80,242,.45));
}
/* No blend-mode: the artwork must keep its actual contrast instead of looking faded. */
.ranking-panel { min-width: 0; }
.ranking-meta {
  padding: 9px 15px 1px; display: flex; align-items: center; justify-content: space-between;
  gap: 10px; color: #afa7c5; font-size: 11px; min-height: 24px;
}
.ranking-live { display:inline-flex; align-items:center; gap:8px; letter-spacing: .02em; }
.ranking-live-dot { width:7px; height:7px; background:#5aed94; box-shadow:0 0 7px rgba(71,255,139,.6); border-radius:50%; }
.ranking-update-time { color:#9c92b7; white-space:nowrap; }
.ranking-update-time.is-error { color:#f2a7bd; }
.ranking-scroller { width:100%; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:thin; scrollbar-color: #6f4292 #191127; }
.ranking-table { width:100%; min-width:585px; border-collapse:collapse; table-layout:fixed; font-size:12px; }
.ranking-table.is-guild { min-width:490px; }
.ranking-table .number-col { width:42px; }
.ranking-table .rank-char-col { width:29%; }
.ranking-table .rank-class-col { width:26%; }
.ranking-table .rank-level-col { width:13%; }
.ranking-table .rank-resets-col { width:13%; }
.ranking-table .rank-master-col { width:16%; }
.ranking-table.is-guild .rank-char-col { width:39%; }
.ranking-table.is-guild .rank-class-col { width:35%; }
.ranking-table th { padding:12px 8px; background:rgba(86,49,120,.15); text-align:left; font-size:11px; letter-spacing:.025em; }
.ranking-table td { height:51px; padding:9px 8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ranking-table .right { text-align:right; }
.ranking-table .rank-value { color:#f2eafa; font-variant-numeric:tabular-nums; font-feature-settings:'tnum'; font-weight:690; }
.ranking-table .player-identity { display:flex; align-items:center; gap:9px; min-width:0; width:100%; }
.ranking-table .player-nickname { min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ranking-table .character-avatar { width:32px; height:32px; }
.ranking-table .class-pill { display:inline-block; max-width:100%; padding:6px 8px; border-radius:6px; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; color:#e2c8ff; background:rgba(125,67,176,.17); border:1px solid rgba(181,139,222,.19); font-weight:640; }
.ranking-table tbody tr:nth-child(even) { background:rgba(164,115,229,.055); }
.ranking-table tbody tr:hover { background:rgba(173,118,235,.15); }
.ranking-table td:not(:last-child), .ranking-table th:not(:last-child) { border-right:1px solid rgba(187,149,225,.055); }
@media(max-width:1059px) {
  .hero-figure { width:40%; } .hero-world { width:40%; }
  .hero-logo { width:clamp(245px, 31vw, 380px); }
}
@media(max-width:760px) {
  .hero { height:270px; }
  .hero-figure { width:45%; object-position:50% 25%; }
  .hero-world { width:42%; object-position:48% 50%; }
  .hero-logo { width:clamp(220px, 47vw, 300px); }
  .ranking-meta { flex-wrap:wrap; }
}
@media(max-width:550px) {
  .hero { height:210px; }
  .hero-figure { width:50%; opacity:.95; }
  .hero-world { width:45%; opacity:.88; }
  .hero-logo { width:58%; }
  .ranking-table { min-width:560px; }
  .ranking-update-time { display:none; }
}
/* Give player columns enough room on desktop; stack side panels on medium screens. */
@media (min-width: 1251px) {
  .dashboard-grid { grid-template-columns: minmax(195px, 21%) minmax(0, 1fr) minmax(185px, 19%); gap: 14px; }
}
@media (min-width: 1061px) and (max-width: 1250px) {
  .dashboard-grid { grid-template-columns: 1fr; }
  .dashboard-left, .dashboard-right { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); }
}


/* Final banner fix: use a single high-resolution artwork so the center logo and right side stay crisp. */
.hero.hero-single-banner {
  padding: 0;
  /* Preserve natural 2172x724 image ratio: no forced height or cropped heads. */
  height: auto;
  aspect-ratio: auto;
  background: linear-gradient(180deg, rgba(12,8,33,.96), rgba(18,10,41,.96));
  border: 1px solid rgba(171,128,255,.62);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 16px 38px rgba(5,4,22,.36), inset 0 1px 0 rgba(255,255,255,.08);
}
.hero.hero-single-banner::before,
.hero.hero-single-banner::after { content: none; }
.hero-banner-art {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center center;
  image-rendering: auto;
}
@media (max-width: 760px) {
  .hero.hero-single-banner { height: auto; }
  .hero-banner-art { object-position: 50% center; }
}
@media (max-width: 550px) {
  .hero.hero-single-banner { height: auto; }
}

/* Live SQL status turns red only when the rank endpoint fails. */
.ranking-live-dot.is-error { background:#f38ba1; box-shadow:0 0 8px rgba(243,139,161,.55); }

/* PATCH SET BUILDER — affects only the existing admin page */
.set-builder-section {scroll-margin-top:25px}
.set-builder-top,.set-builder-list-head {display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap}
.set-builder-top h2,.set-builder-list-head h2 {margin:4px 0 5px}
.set-builder-eyebrow {font-size:10px;font-weight:800;letter-spacing:.15em;color:#c990f3}
.set-builder-status,.set-builder-draft {display:inline-flex;align-items:center;border:1px solid rgba(233,194,131,.3);border-radius:30px;padding:7px 11px;background:rgba(233,194,131,.09);color:#e9c283;font-size:11px;font-weight:750}
.set-builder-form {max-width:none;margin-top:17px}
.set-builder-setup {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(200px,1fr);gap:16px}
.set-builder-setup select {width:100%;background:#141027;color:#fff;border:1px solid rgba(186,121,223,.5);border-radius:8px;padding:12px 14px;font:inherit;min-height:49px}
.set-builder-subtitle {display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:7px}
.set-builder-subtitle strong {font-size:16px;color:#f3defd}
.set-builder-subtitle span {font-size:12px;color:var(--muted)}
.set-builder-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.set-builder-piece {display:flex!important;flex-direction:column;gap:7px!important;min-width:0;padding:12px;border:1px dashed rgba(186,121,223,.39);border-radius:12px;background:rgba(10,9,25,.5);transition:border-color .15s,background .15s;cursor:pointer}
.set-builder-piece:hover {border-color:#bc7fea;background:rgba(50,25,82,.25)}
.set-builder-piece-image {height:122px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(186,121,223,.2);background:radial-gradient(circle at 50% 40%,rgba(109,55,165,.18),rgba(7,6,17,.9));border-radius:9px;overflow:hidden}
.set-builder-piece-image img {max-width:100%;max-height:100%;object-fit:contain}
.set-builder-piece-image img[hidden],.set-builder-piece-placeholder[hidden] {display:none!important}
.set-builder-piece-placeholder {font:bold 26px Georgia,serif;color:#8d699f;letter-spacing:.06em}
.set-builder-piece strong {font-size:13px;color:#e8dcf5}
.set-builder-piece-caption {display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#be91dd}
.set-builder-piece input[type=file] {padding:7px!important;font-size:11px;background:transparent;border:0;width:100%;min-width:0}
.set-builder-piece input[type=file]::file-selector-button {border:1px solid rgba(211,150,255,.44);background:#321b4b;color:#fff;padding:6px 9px;border-radius:6px;margin-right:7px;cursor:pointer}
.set-builder-footer {display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:6px}
.set-builder-footer p {margin:0;font-size:12px}
.set-builder-notice {padding:12px 14px;margin-top:20px;border-left:3px solid #b86fff;border-radius:6px;background:rgba(120,73,171,.11);color:#cfc2dc;font-size:12px;line-height:1.65}
.set-builder-notice strong {color:#eee0fc}
.set-builder-project-count {color:var(--muted);font-size:12px}
.set-builder-empty {margin-top:13px;padding:28px 18px;border:1px dashed rgba(186,121,223,.32);border-radius:10px;color:var(--muted);font-size:13px}
.set-builder-project {margin-top:16px;padding:18px;border:1px solid rgba(186,121,223,.26);border-radius:11px;background:rgba(10,8,24,.52)}
.set-builder-project-header {display:flex;justify-content:space-between;gap:12px;align-items:start;flex-wrap:wrap}
.set-builder-project-header h3 {margin:0 0 3px;font:700 20px Georgia,serif;color:#f4e8ff}
.set-builder-project-header span:not(.set-builder-draft) {color:var(--muted);font-size:12px}
.set-builder-project-pieces {display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin-top:17px}
.set-builder-saved-item {display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;min-width:0}
.set-builder-saved-item img {width:100%;height:104px;object-fit:contain;border:1px solid rgba(186,121,223,.18);border-radius:9px;background:rgba(0,0,0,.26);padding:6px}
.set-builder-saved-item span {font-size:11px;color:#e7dbf3;overflow-wrap:anywhere}
.set-builder-project-actions {display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:15px}
.set-builder-project-actions .secondary-action {display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border:1px solid rgba(186,121,223,.43);border-radius:8px;background:rgba(82,36,127,.2);color:#e9d4ff;font-size:12px}
.set-builder-delete button {color:#efabbc!important}
@media(max-width:830px) {.set-builder-grid {grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px) {.set-builder-setup {grid-template-columns:1fr}.set-builder-grid {grid-template-columns:1fr}.set-builder-piece-image {height:145px}}


/* Modular local admin: navigation lives in index.php, not individual pages. */
.admin-module-nav{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:22px;padding:12px;border:1px solid rgba(186,121,223,.25);background:rgba(22,14,42,.66);border-radius:12px}
.admin-module-link{display:inline-flex;align-items:center;padding:10px 14px;border-radius:8px;color:#dbcbe9;text-decoration:none;font-size:12px;font-weight:700;border:1px solid transparent}
.admin-module-link:hover,.admin-module-link.is-active{background:#43235f;border-color:#9e66c9;color:#fff}
.admin-dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.admin-module-card{display:flex;flex-direction:column;align-items:start;gap:8px;text-decoration:none;padding:22px;color:#ebe0fa;transition:transform .15s, border-color .15s}
.admin-module-card:hover{transform:translateY(-2px);border-color:#ba79df}
.admin-module-card svg{height:27px;width:27px;color:#cd8af4}
.admin-module-card strong{font:700 19px Georgia,serif}
.admin-module-card span{font-size:12px;line-height:1.6;color:var(--muted)}
@media(max-width:640px){.admin-dashboard-grid{grid-template-columns:1fr}.admin-module-nav{padding:8px}.admin-module-link{padding:9px 11px}}

/* XShop admin and public catalog — isolated module. */
.xshop-warning{border-left:3px solid #efbd6d}.xshop-admin-table{overflow-x:auto;max-height:520px;overflow-y:auto;margin:16px 0}.xshop-admin-table table{width:100%;border-collapse:collapse;min-width:570px}.xshop-admin-table td,.xshop-admin-table th{padding:9px;border-bottom:1px solid #4f3a64;text-align:left;font-size:12px}.xshop-admin-table input[type=text],.xshop-admin-table input:not([type]){min-width:150px;width:100%;background:#171026;border:1px solid #70508b;color:#eee;border-radius:7px;padding:9px}.xshop-admin-table input[type=checkbox]{accent-color:#c284ee;transform:scale(1.2)}.xshop-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px}.xshop-actions a{display:inline-flex;align-items:center;padding:10px 14px;border-radius:8px;border:1px solid #875aa4;color:#e5ceff;text-decoration:none}.xshop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:13px}.xshop-card{padding:16px;display:flex;gap:9px;flex-direction:column;min-width:0}.xshop-card strong{font-size:16px;color:#fff}.xshop-card span,.xshop-card small{color:#c7a5d9;font-size:12px}.xshop-item-glyph{display:flex;align-items:center;justify-content:center;font-size:42px!important;height:80px;background:radial-gradient(#5b3086,#161026);border-radius:12px}

/* XShop admin paginare — doar modulul magazin */
.xshop-page-nav{display:flex;gap:12px;align-items:center;justify-content:center;margin-top:18px;flex-wrap:wrap}
.xshop-page-nav span{color:#c8bddc;font-size:0.9rem}
