/* Information page: scoped to preserve the shared header, footer and dialogs. */
.server-info-page { position: relative; isolation: isolate; background: #100d14; color: #c8bdcf; font: 400 15px/1.65 'Exo 2',sans-serif; }
.server-info-page *, .server-info-page *::before, .server-info-page *::after { box-sizing: border-box; }
.server-info-page .si-container { width: min(1320px,100%); margin: 0 auto; padding: 0 32px; }
.server-info-page a:focus-visible, .server-info-page button:focus-visible { outline: 2px solid #bb95ff; outline-offset: 5px; }
.server-info-page .si-hero { position: relative; z-index: 2; margin: 0 0 -12px; min-height: 350px; padding: 58px 0 68px; overflow: hidden; border-radius: 0 0 18px 18px; background: #16101f; box-shadow: 0 18px 32px -10px rgba(0,0,0,.85); }
.server-info-page .si-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(12,7,20,.93),rgba(18,9,30,.62)),url('/img/background_main.png') center 42%/cover no-repeat; z-index: -1; }
.server-info-page .si-hero-layout { display: grid; grid-template-columns: minmax(0,1fr) 320px; align-items: center; gap: 40px; }
.server-info-page .si-eyebrow { display: block; margin: 0 0 6px; color: #a88abd; font-size: 10px; font-weight: 800; letter-spacing: 1.7px; line-height: 1.5; text-transform: uppercase; }
.server-info-page .si-hero-copy > .si-eyebrow { display: flex; align-items: center; gap: 10px; color: #d0b2e6; font-size: 11px; margin-bottom: 14px; }
.server-info-page .si-spark { display: inline-block; width: 7px; height: 7px; background: #a970ff; transform: rotate(45deg); box-shadow: 0 0 14px rgba(169,112,255,.7); flex-shrink: 0; }
.server-info-page .si-hero h1 { margin: 0 0 12px; font: 800 clamp(38px,4.5vw,64px)/1.08 'Exo 2',sans-serif; letter-spacing: 1px; background: linear-gradient(90deg,#fff,#d8b6ff 65%,#a970ff); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.server-info-page .si-hero-subtitle { margin: 0 0 18px; color: #e1d0ed; font-size: 13px; font-weight: 700; letter-spacing: 2px; }
.server-info-page .si-hero-description { margin: 0; max-width: 550px; color: #b3a7bf; font-size: 15px; line-height: 1.8; }
.server-info-page .si-hero-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.server-info-page .si-hero-tags > span { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; background: rgba(169,112,255,.09); color: #d6c3e7; border-radius: 6px; font-size: 11px; font-weight: 600; }
.server-info-page .si-hero-tags i { color: #bb95ff; }
.server-info-page .si-hero-emblem { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; position: relative; }
.server-info-page .si-hero-emblem::before { content: ''; position: absolute; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle,rgba(169,112,255,.14),transparent 70%); z-index: -1; }
.server-info-page .si-hero-emblem img { width: 190px; height: 190px; object-fit: contain; filter: drop-shadow(0 8px 22px rgba(0,0,0,.6)); }
.server-info-page .si-hero-emblem > span { color: #aa8ac0; font-size: 9px; letter-spacing: 2px; font-weight: 700; }
.server-info-page .si-content { padding-top: 42px; padding-bottom: 64px; }
.server-info-page .si-highlights { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-radius: 14px; background: #19121f; box-shadow: 0 8px 28px rgba(0,0,0,.18); overflow: hidden; }
.server-info-page .si-highlights > div { display: flex; align-items: center; gap: 14px; padding: 22px 24px; position: relative; min-width: 0; }
.server-info-page .si-highlights > div + div::before { content: ''; position: absolute; left: 0; top: 24px; bottom: 24px; width: 1px; background: rgba(169,112,255,.1); }
.server-info-page .si-highlight-icon { display: grid; place-items: center; width: 42px; height: 42px; flex-shrink: 0; border-radius: 10px; background: rgba(169,112,255,.08); color: #bb95ff; font-size: 18px; }
.server-info-page .si-highlights small { display: block; color: #a294ac; font-size: 9px; letter-spacing: .9px; font-weight: 700; line-height: 1.5; }
.server-info-page .si-highlights strong { display: block; color: #f0e5fa; font-size: 30px; font-weight: 800; line-height: 1.25; }
.server-info-page .si-highlights strong > span { color: #a88abd; font-size: 18px; margin-left: 2px; }
.server-info-page .si-highlight-vip .si-highlight-icon { background: rgba(230,197,130,.07); color: #e6c582; }
.server-info-page .si-highlight-vip strong { color: #e6c582; }
.server-info-page .si-highlights .si-highlight-label { font-size: 17px; margin-top: 5px; }
.server-info-page .si-section-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 24px 0 28px; padding: 0; }
.server-info-page .si-section-nav a { display: flex; align-items: center; gap: 8px; text-decoration: none; color: #a99ab5; background: #19121f; padding: 9px 15px; border-radius: 7px; font-size: 12px; font-weight: 700; transition: background .2s,color .2s; }
.server-info-page .si-section-nav a i { color: #a970ff; }
.server-info-page .si-section-nav a:hover { background: #2e1e3e; color: #efe4f8; }
.server-info-page .si-layout { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 28px; align-items: start; }
.server-info-page .si-sections { display: grid; gap: 24px; min-width: 0; }
.server-info-page section[id], .server-info-page aside[id] { scroll-margin-top: 110px; }
.server-info-page .si-card { min-width: 0; padding: 30px; border-radius: 14px; border: 1px solid rgba(169,112,255,.09); background: radial-gradient(ellipse at top right,rgba(98,0,234,.035),transparent 65%),#17121d; box-shadow: 0 8px 28px rgba(0,0,0,.12); }
.server-info-page .si-section-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.server-info-page .si-section-icon { display: grid; place-items: center; width: 42px; height: 42px; flex-shrink: 0; border-radius: 10px; background: rgba(169,112,255,.09); color: #bb95ff; font-size: 17px; }
.server-info-page .si-section-heading h2, .server-info-page .si-agenda-heading h2 { margin: 0; color: #eee3f8; text-align: left; font: 800 23px/1.25 'Exo 2',sans-serif; letter-spacing: .2px; text-transform: none; }
.server-info-page .si-intro { margin: 0 0 24px; color: #b1a4bc; font-size: 14px; line-height: 1.85; }
.server-info-page .si-intro strong { color: #ddc6ee; font-weight: 700; }
.server-info-page .si-principles { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; list-style: none; margin: 0; padding: 0; }
.server-info-page .si-principles li { display: flex; align-items: flex-start; gap: 12px; padding: 16px; background: #1d1625; border-radius: 9px; }
.server-info-page .si-principles li:last-child { grid-column: 1/-1; }
.server-info-page .si-principles li > i { margin-top: 5px; color: #a970ff; width: 18px; flex-shrink: 0; text-align: center; font-size: 14px; }
.server-info-page .si-principles h3 { margin: 0 0 4px; color: #dccde8; font-size: 13px; font-weight: 700; }
.server-info-page .si-principles p { margin: 0; color: #a396ad; font-size: 12px; line-height: 1.7; }
.server-info-page .si-section-description { color: #a99ab5; font-size: 13px; margin: -6px 0 22px; }
.server-info-page .si-table-wrap { max-width: 100%; overflow-x: auto; border-radius: 10px; }
.server-info-page .si-table { width: 100%; border-collapse: collapse; font-size: 13px; line-height: 1.5; }
.server-info-page .si-table thead { background: #22172d; }
.server-info-page .si-table th { text-align: left; font-weight: 600; }
.server-info-page .si-table thead th { padding: 15px 18px; color: #cbb0df; font-size: 11px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; }
.server-info-page .si-table td, .server-info-page .si-table tbody th { padding: 15px 18px; border-bottom: 1px solid rgba(169,112,255,.07); background: #130f18; color: #bdb0c9; }
.server-info-page .si-table td, .server-info-page .si-table thead th:not(:first-child) { text-align: center; }
.server-info-page .si-table tbody tr:last-child > * { border-bottom: 0; }
.server-info-page .si-table tbody tr:hover > * { background: #1b1422; }
.server-info-page .si-table .si-vip-column { color: #e6c582; background: rgba(230,197,130,.025); font-weight: 700; }
.server-info-page .si-table thead .si-vip-column { background: rgba(230,197,130,.04); }
.server-info-page .si-table small { display: block; margin-top: 3px; color: #927a9e; font-size: 10px; font-weight: 400; }
.server-info-page .si-reset-range { white-space: nowrap; color: #d8c3e6; }
.server-info-page .si-reset-table strong { font-size: 17px; }
.server-info-page .si-points-unit { font-size: 10px; font-weight: 400; }
.server-info-page .si-card-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; margin-top: 24px; }
.server-info-page .si-card-footer p { display: flex; align-items: center; gap: 8px; font-size: 11px; color: #a295af; margin: 0; }
.server-info-page .si-card-footer p i { color: #e6c582; }
.server-info-page .si-action { margin: 0 6px; padding: 11px 22px; font: italic 800 11px 'Exo 2',sans-serif; flex-shrink: 0; }
.server-info-page .si-note { display: flex; align-items: flex-start; gap: 10px; margin: 22px 0 0; padding: 14px 16px; background: rgba(169,112,255,.04); color: #a496af; font-size: 12px; border-radius: 8px; }
.server-info-page .si-note > i { margin-top: 4px; color: #a970ff; }
.server-info-page .si-note strong { color: #cdb8df; font-weight: 600; }
.server-info-page .si-rewards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.server-info-page .si-reward { display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: 9px; background: #1e1627; }
.server-info-page .si-reward > i { color: #a970ff; font-size: 20px; width: 24px; flex-shrink: 0; text-align: center; }
.server-info-page .si-reward > span { display: block; color: #a89ab3; font-size: 11px; }
.server-info-page .si-reward strong { display: block; margin-top: 5px; color: #dcc2ee; font-size: 14px; font-weight: 700; }
.server-info-page .si-subheading { margin: 26px 0 14px; color: #c3afd2; font-size: 12px; font-weight: 800; letter-spacing: .7px; text-transform: uppercase; }
.server-info-page .si-jewels { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.server-info-page .si-jewels > div { display: flex; flex-direction: column; align-items: flex-start; padding: 18px; border-radius: 9px; background: #1b1522; }
.server-info-page .si-jewels i { color: #a970ff; font-size: 16px; margin-bottom: 10px; }
.server-info-page .si-jewels > div > span { color: #ae9abd; font-size: 11px; }
.server-info-page .si-jewels strong { color: #e3d1f0; font-size: 25px; font-weight: 800; line-height: 1.5; }
.server-info-page .si-jewels strong > span { color: #9a7dae; font-size: 13px; margin-left: 2px; }
.server-info-page .si-agenda-column { position: static; min-width: 0; }
.server-info-page .si-agenda-card { display: flex; flex-direction: column; max-height: calc(100dvh - 128px); border-radius: 14px; overflow: hidden; background: #19121f; border: 1px solid rgba(169,112,255,.14); box-shadow: 0 10px 32px rgba(0,0,0,.2); }
.server-info-page .si-agenda-heading { display: flex; align-items: center; gap: 12px; padding: 24px 22px 20px; flex-shrink: 0; }
.server-info-page .si-agenda-heading h2 { font-size: 18px; }
.server-info-page .si-agenda-heading .si-eyebrow { font-size: 8px; letter-spacing: 1.3px; }
.server-info-page .si-server-clock { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 22px; background: #120e18; color: #aa98b7; font-size: 11px; flex-shrink: 0; }
.server-info-page .si-server-clock > span { display: flex; align-items: center; gap: 7px; }
.server-info-page .si-server-clock i { color: #a970ff; }
.server-info-page .si-server-clock time { color: #dbc6eb; font-family: monospace; font-variant-numeric: tabular-nums; font-size: 13px; }
.server-info-page .si-next-event { margin: 18px 18px 6px; padding: 16px; border-radius: 10px; background: radial-gradient(ellipse at top right,rgba(169,112,255,.15),transparent),#291a37; flex-shrink: 0; }
.server-info-page .si-next-event .si-eyebrow { display: flex; align-items: center; gap: 8px; font-size: 8px; color: #bb95ff; }
.server-info-page .si-next-event .si-spark { width: 5px; height: 5px; }
.server-info-page .si-next-event > strong { display: block; margin-top: 5px; color: #f0e3f9; font-size: 17px; font-weight: 800; }
.server-info-page .si-next-event > div { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; gap: 12px; }
.server-info-page .si-next-event > div > span { color: #a98dbb; font-size: 10px; }
.server-info-page .si-next-event time { color: #d4b0ef; font: 700 20px/1.3 monospace; font-variant-numeric: tabular-nums; }
.server-info-page .si-agenda-list { min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #5a386f transparent; }
.server-info-page .si-agenda-list ul { list-style: none; padding: 0; margin: 0; }
.server-info-page .si-agenda-group { display: flex; align-items: center; justify-content: space-between; padding: 15px 22px 10px; margin: 0; font-size: 9px; font-weight: 800; color: #8f7c9e; letter-spacing: 1.2px; text-transform: uppercase; }
.server-info-page .si-agenda-group span { display: grid; place-items: center; min-width: 20px; height: 20px; background: #241930; border-radius: 5px; color: #b08ac9; font-size: 9px; }
.server-info-page .si-agenda-group > i { color: #e6c582; }
.server-info-page .si-event-row { display: flex; align-items: center; gap: 10px; padding: 13px 20px; border-bottom: 1px solid rgba(169,112,255,.055); }
.server-info-page .si-event-row:hover { background: rgba(169,112,255,.035); }
.server-info-page .si-event-icon { display: grid; place-items: center; width: 29px; height: 29px; flex-shrink: 0; color: #a67abd; background: #24192f; border-radius: 7px; font-size: 11px; }
.server-info-page .si-event-detail { flex: 1; min-width: 0; }
.server-info-page .si-event-detail h4 { margin: 0 0 3px; font-size: 12px; font-weight: 700; color: #d4c3df; overflow-wrap: anywhere; }
.server-info-page .si-event-schedule { display: block; color: #8e7d9c; font-size: 9px; line-height: 1.7; }
.server-info-page .si-event-status { flex-shrink: 0; max-width: 112px; text-align: right; }
.server-info-page .si-event-timer { color: #c6add8; background: #120e18; padding: 5px 7px; border-radius: 5px; font: 11px/1.6 monospace; font-variant-numeric: tabular-nums; white-space: nowrap; }
.server-info-page .si-event-fixed { white-space: normal; display: inline-block; font: 600 10px/1.5 'Exo 2',sans-serif; color: #e6c582; background: rgba(230,197,130,.06); }
.server-info-page .si-event-soon .si-event-timer { color: #e6c582; }
.server-info-page .si-event-status small { display: block; margin-top: 5px; color: #e6c582; font-size: 8px; }
.server-info-page .si-events-empty { padding: 32px 26px; text-align: center; }
.server-info-page .si-events-empty > i { color: #a970ff; font-size: 26px; }
.server-info-page .si-events-empty p { color: #d0badf; margin: 14px 0 6px; font-size: 13px; }
.server-info-page .si-events-empty > span { display: block; color: #9b88a9; font-size: 11px; line-height: 1.7; }
.server-info-page .si-agenda-note { display: flex; align-items: flex-start; gap: 7px; padding: 14px 22px; margin: 0; color: #82708f; background: #15101a; font-size: 9px; line-height: 1.6; flex-shrink: 0; }
.server-info-page .si-agenda-note i { margin-top: 3px; color: #a970ff; }
.server-info-page .si-bottom-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 32px; margin-top: 32px; border-radius: 14px; background: radial-gradient(ellipse at top left,rgba(169,112,255,.12),transparent),#1b1225; }
.server-info-page .si-bottom-cta h2 { margin: 0 0 6px; color: #e8d7f5; font-size: 24px; font-weight: 800; line-height: 1.3; text-align: left; text-transform: none; }
.server-info-page .si-bottom-cta p { color: #a894b6; font-size: 13px; margin: 0; }
.server-info-page .si-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; }
@media (max-width: 1100px) {
 .server-info-page .si-layout { grid-template-columns: minmax(0,1fr) 320px; gap: 22px; }
 .server-info-page .si-card { padding: 24px; }
 .server-info-page .si-highlights > div { padding: 20px 16px; gap: 10px; }
 .server-info-page .si-highlight-icon { width: 35px; height: 35px; font-size: 15px; }
 .server-info-page .si-highlights .si-highlight-label { font-size: 14px; }
 .server-info-page .si-agenda-heading { padding-left: 18px; padding-right: 18px; }
 .server-info-page .si-event-row { padding-left: 16px; padding-right: 16px; gap: 8px; }
 .server-info-page .si-table thead th, .server-info-page .si-table td, .server-info-page .si-table tbody th { padding: 14px 12px; }
}
@media (max-width: 900px) {
 .server-info-page .si-layout { grid-template-columns: 1fr; }
 .server-info-page .si-agenda-column { position: static; }
 .server-info-page .si-agenda-card { max-height: none; }
 .server-info-page .si-agenda-list { overflow: visible; }
 .server-info-page .si-hero-layout { grid-template-columns: minmax(0,1fr) 200px; gap: 24px; }
 .server-info-page .si-hero-emblem img { width: 155px; height: 155px; }
 .server-info-page .si-hero-emblem > span { font-size: 7px; letter-spacing: 1px; }
 .server-info-page .si-highlights { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .server-info-page .si-highlights > div:nth-child(3)::before { display: none; }
 .server-info-page .si-highlights .si-highlight-label { font-size: 17px; }
 .server-info-page .si-event-detail h4 { font-size: 13px; }
 .server-info-page .si-event-schedule { font-size: 10px; }
 .server-info-page .si-event-timer { font-size: 12px; }
}
@media (max-width: 600px) {
 .server-info-page .si-container { padding-left: 20px; padding-right: 20px; }
 .server-info-page .si-hero { padding: 38px 0 44px; min-height: 0; }
 .server-info-page .si-hero-layout { grid-template-columns: 1fr; gap: 0; }
 .server-info-page .si-hero-emblem { display: none; }
 .server-info-page .si-hero h1 { font-size: clamp(30px,9.5vw,45px); letter-spacing: .3px; }
 .server-info-page .si-hero-subtitle { font-size: 10px; letter-spacing: 1.1px; }
 .server-info-page .si-hero-description { font-size: 13px; }
 .server-info-page .si-hero-tags { margin-top: 20px; gap: 7px; }
 .server-info-page .si-hero-tags > span { padding: 5px 9px; font-size: 10px; }
 .server-info-page .si-content { padding-top: 34px; padding-bottom: 40px; }
 .server-info-page .si-highlights > div { padding: 16px 12px; gap: 9px; }
 .server-info-page .si-highlight-icon { width: 30px; height: 30px; font-size: 13px; }
 .server-info-page .si-highlights small { font-size: 7px; letter-spacing: .3px; }
 .server-info-page .si-highlights strong { font-size: 25px; }
 .server-info-page .si-highlights .si-highlight-label { font-size: 12px; }
 .server-info-page .si-section-nav { gap: 7px; margin: 20px 0 24px; }
 .server-info-page .si-section-nav a { font-size: 10px; padding: 8px 10px; gap: 6px; }
 .server-info-page .si-card { padding: 22px 18px; }
 .server-info-page .si-section-heading { gap: 11px; margin-bottom: 18px; }
 .server-info-page .si-section-heading h2 { font-size: 20px; }
 .server-info-page .si-section-heading .si-eyebrow { font-size: 8px; letter-spacing: 1.2px; }
 .server-info-page .si-section-icon { width: 36px; height: 36px; font-size: 14px; }
 .server-info-page .si-intro { font-size: 13px; }
 .server-info-page .si-principles { grid-template-columns: 1fr; gap: 9px; }
 .server-info-page .si-principles li { padding: 14px; }
 .server-info-page .si-principles li:last-child { grid-column: auto; }
 .server-info-page .si-section-description { font-size: 12px; }
 .server-info-page .si-table { font-size: 11px; }
 .server-info-page .si-table thead th { padding: 12px 8px; font-size: 9px; letter-spacing: .1px; }
 .server-info-page .si-table td, .server-info-page .si-table tbody th { padding: 13px 8px; }
 .server-info-page .si-table thead th:first-child { width: 43%; }
 .server-info-page .si-reset-table strong { font-size: 15px; }
 .server-info-page .si-points-unit { display: block; font-size: 9px; }
 .server-info-page .si-rewards { grid-template-columns: 1fr; gap: 9px; }
 .server-info-page .si-reward { padding: 16px; }
 .server-info-page .si-jewels { gap: 8px; }
 .server-info-page .si-jewels > div { padding: 14px 10px; }
 .server-info-page .si-jewels > div > span { font-size: 9px; }
 .server-info-page .si-jewels strong { font-size: 22px; }
 .server-info-page .si-agenda-heading h2 { font-size: 20px; }
 .server-info-page .si-event-row { padding: 14px 18px; }
 .server-info-page .si-event-detail h4 { font-size: 12px; }
 .server-info-page .si-event-schedule { font-size: 9px; }
 .server-info-page .si-event-timer { font-size: 11px; }
 .server-info-page .si-bottom-cta { flex-direction: column; align-items: flex-start; padding: 24px; gap: 20px; }
 .server-info-page .si-bottom-cta h2 { font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) { .server-info-page .btn-launcher::after { animation: none; } }
