@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');

:root {
  color-scheme: light;
  --gp-cream: #FBF6EE;
  --gp-sand: #EFE3D1;
  --gp-ink: #23140F;
  --gp-muted: #5B4A40;
  --gp-red: #DC1C36;
  --gp-metal: linear-gradient(110deg,#9C0A20 0%,#DC1C36 35%,#FF5A6C 49%,#D0142F 59%,#8A0B1E 100%);
  --gp-gold: linear-gradient(135deg,#FFF6D8 0%,#F0CF7A 38%,#B8862B 72%,#8A5A12 100%);
  --gp-cut: polygon(5% 0,95% 0,100% 50%,95% 100%,5% 100%,0 50%);
}
* { box-sizing: border-box; }
body { margin: 0; }
.gp-page { min-height: 100vh; display: flex; flex-direction: column; background: var(--gp-cream); color: var(--gp-ink); font-family: 'Oswald',sans-serif; font-size: 16px; line-height: 1.6; }
.gp-page button,.gp-page input,.gp-page code { font: inherit; }
.gp-page a { color: inherit; text-decoration: none; }
.gp-page [hidden] { display: none !important; }
.gp-page :focus-visible { outline: 3px solid #9C0A20; outline-offset: 6px; }
.gp-wrap { width: calc(100% - 12vw); max-width: 1600px; margin-inline: auto; }
.gp-ticker { min-height: 32px; padding: 5px 4vw; display: flex; justify-content: center; align-items: center; gap: 5vw; flex-wrap: wrap; background: #F2E7D5; border-bottom: 1px solid rgba(120,70,30,.13); color: #6D5441; font-size: 11px; font-weight: 500; letter-spacing: 1.5px; text-transform: uppercase; }
.gp-ticker > span { display: inline-flex; align-items: center; gap: 12px; max-width: 100%; overflow-wrap: anywhere; }
.gp-ticker b { color: #9A6410; font-size: 13px; }
.gp-ticker strong { color: #463024; font-weight: 500; letter-spacing: .6px; }
.gp-header { height: 112px; display: flex; align-items: center; gap: 42px; position: relative; z-index: 2; }
.gp-wordmark { display: flex; flex-direction: column; width: max-content; flex: none; font-size: 37px; font-weight: 700; line-height: 1.06; letter-spacing: 1.8px; }
.gp-wordmark span { width: max-content; background: var(--gp-metal); color: transparent; background-clip: text; -webkit-background-clip: text; }
.gp-wordmark span + span { font-size: 20px; letter-spacing: 4.2px; background-image: linear-gradient(130deg,#8A5A12,#BC8A2F 35%,#E1BD68 48%,#9A6410 70%); }
.gp-nav-label { padding-left: 35px; border-left: 1px solid #DBCDBD; color: var(--gp-muted); font-size: 12px; font-weight: 500; letter-spacing: 2.8px; }
.gp-discord { margin-left: auto; display: inline-flex; align-items: center; gap: 12px; border: 1px solid rgba(88,101,242,.35); background: linear-gradient(rgba(88,101,242,.08),rgba(88,101,242,.08)),#FBF6EE; padding: 7px 20px; border-radius: 30px; color: #5865F2 !important; font-size: 19px; font-weight: 700; letter-spacing: 1.2px; }
.gp-discord:hover { background: linear-gradient(rgba(88,101,242,.12),rgba(88,101,242,.12)),#FBF6EE; }
.gp-discord-mark { width: 17px; height: 12px; background: #5865F2; border-radius: 5px 5px 3px 3px; position: relative; }
.gp-discord-mark::before,.gp-discord-mark::after { content: ''; position: absolute; width: 3px; height: 3px; border-radius: 50%; background: var(--gp-cream); top: 4px; left: 4px; }
.gp-discord-mark::after { left: 10px; }
.gp-account { margin-left: auto; display: flex; align-items: center; gap: 28px; min-width: 0; }
.gp-identity { padding: 6px 16px 6px 7px; letter-spacing: .3px; max-width: 270px; color: #46382E !important; font-size: 14px; font-weight: 500; }
.gp-identity img { border-radius: 50%; flex: none; }
.gp-identity [data-gp="user-name"] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gp-text-link { font-size: 12px; font-weight: 500; letter-spacing: 1.5px; padding-block: 10px; white-space: nowrap; }
.gp-text-link:hover { color: #B3112A; }
.gp-text-link span { margin-left: 8px; }
.gp-account .gp-text-link { position: relative; isolation: isolate; padding-inline: 17px; }
.gp-account .gp-text-link::before,.gp-account .gp-text-link::after { content: ''; position: absolute; inset: 0; z-index: -2; background: #C9B49E; clip-path: var(--gp-cut); }
.gp-account .gp-text-link::after { inset: 1px; z-index: -1; background: #FBF6EE; }
.gp-hero { position: relative; isolation: isolate; }
.gp-hero-picture { position: absolute; z-index: -1; inset: -112px 0 0; pointer-events: none; background: url('/panel/assets/hero-login.webp') right center / auto 100% no-repeat; }
.gp-hero-picture::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,#FBF6EE 0%,#FBF6EE 35%,rgba(251,246,238,.9) 43%,rgba(251,246,238,.08) 67%,transparent 82%),linear-gradient(0deg,#FBF6EE,transparent 19%,transparent 84%,rgba(251,246,238,.3)); }
.gp-hero-login { height: 55vh; min-height: 490px; max-height: 650px; }
.gp-hero-inner { height: 100%; display: flex; align-items: center; }
.gp-hero-copy { position: relative; padding-block: 20px; }
.gp-eyebrow { margin: 0 0 20px; color: #B80F2B; font-size: 12px; font-weight: 500; letter-spacing: 3px; }
.gp-eyebrow span { margin-left: 10px; }
.gp-page h1 { font-size: clamp(49px,4.1vw,79px); font-weight: 600; letter-spacing: -.9px; line-height: 1.25; margin: 0 0 22px; }
.gp-red-text { color: #BF122D; background: linear-gradient(110deg,#C41732,#DC1C36 43%,#A30923 90%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.gp-lead { font-size: 18px; font-weight: 350; line-height: 1.75; margin: 0 0 26px; color: var(--gp-muted); }
.gp-login-action { width: max-content; max-width: 100%; }
.gp-cta { position: relative; isolation: isolate; display: inline-flex; align-items: center; justify-content: flex-start; gap: 21px; min-height: 80px; padding: 13px 44px 13px 30px; border: 0; color: white !important; font-family: 'Oswald',sans-serif; cursor: pointer; transition: transform 180ms ease; }
.gp-cta::before { content: ''; position: absolute; z-index: -2; inset: 0; clip-path: var(--gp-cut); background: linear-gradient(135deg,#F8E1AE,#E8A287 45%,#9C0A20 80%); }
.gp-cta::after { content: ''; position: absolute; z-index: -1; inset: 2px; clip-path: var(--gp-cut); background: linear-gradient(180deg,rgba(67,0,10,.2),rgba(67,0,10,.4) 35%,rgba(67,0,10,.62) 100%),linear-gradient(115deg,transparent 0 24%,rgba(255,255,255,.23) 24.3% 24.7%,transparent 25% 72%,rgba(255,255,255,.17) 72.3% 72.7%,transparent 73%),var(--gp-metal); }
.gp-cta:hover { transform: translateY(-2px); }
.gp-cta:active { transform: translateY(0); }
.gp-diamond { display: grid; place-items: center; width: 37px; height: 37px; flex: none; background: var(--gp-gold); border: 1px solid #FFE9A7; box-shadow: 2px 3px 0 rgba(62,17,3,.24); transform: rotate(45deg); border-radius: 5px; }
.gp-diamond > span { transform: rotate(-45deg); color: #4E2D08; font-size: 25px; font-weight: 500; line-height: 1; }
.gp-cta-copy { display: flex; flex-direction: column; text-shadow: 0 1px 2px rgba(75,3,14,.6); }
.gp-cta-copy strong { font-size: 21px; font-weight: 600; letter-spacing: .6px; line-height: 1.5; }
.gp-cta-copy small { font-size: 13px; font-weight: 400; line-height: 1.6; }
.gp-spark { position: absolute; top: -11px; right: 36px; font-size: 25px; line-height: 1; color: #D8AC4F; text-shadow: 0 1px #FFF6D8; }
.gp-checks { display: flex; flex-wrap: wrap; gap: 13px 24px; list-style: none; padding: 0; margin: 27px 0 0; color: #5B4A40; font-size: 13px; font-weight: 400; }
.gp-checks span { margin-right: 6px; color: #946110; }
.gp-notice { width: max-content; max-width: 100%; margin: 18px 0 0; padding: 9px 15px; background: #F8E8E6; color: #9C0A20; border-left: 3px solid #C31732; border-radius: 0 5px 5px 0; font-size: 15px; }
.gp-notice[data-tone="neutral"] { background: #EEE5D9; color: #5B4A40; border-color: #8E7964; }
.gp-access-note { margin-top: 40px; display: flex; align-items: center; gap: 60px; min-height: 122px; padding: 24px 36px; background: rgba(255,255,255,.85); border: 1px solid rgba(120,70,30,.13); border-radius: 20px; box-shadow: 0 12px 32px rgba(94,58,28,.055); }
.gp-access-note > div { display: flex; align-items: center; gap: 23px; }
.gp-access-note h2 { margin: 0; font-size: 23px; font-weight: 500; line-height: 1.45; }
.gp-access-note h2 span { color: #A21229; }
.gp-note-rule { height: 49px; width: 3px; background: #C01832; }
.gp-access-note p { font-size: 16px; font-weight: 350; line-height: 1.8; color: #5B4A40; margin: 0; }
.gp-note-symbol { margin-left: auto; font-size: 40px; color: #D7C9B8; }
.gp-footer { display: flex; justify-content: space-between; gap: 24px; margin-top: auto; padding-block: 34px 25px; color: #77614F; font-size: 11px; letter-spacing: 1.5px; }
.gp-footer span span { margin-inline: 13px; color: #B9A590; }
.gp-hero-hub { height: 36vh; min-height: 280px; max-height: 390px; }
.gp-hero-hub .gp-hero-picture { background-image: url('/panel/assets/backdrop.webp'); background-size: auto 155%; background-position: right 48%; }
.gp-hero-hub .gp-hero-picture::after { background: linear-gradient(90deg,#FBF6EE 0%,rgba(251,246,238,.92) 25%,rgba(251,246,238,.3) 55%,rgba(251,246,238,0) 75%),linear-gradient(0deg,#FBF6EE 0%,transparent 35%,transparent 75%,rgba(251,246,238,.4)); }
.gp-hero-hub h1 { font-size: clamp(54px,4.25vw,82px); margin-bottom: 15px; }
.gp-hero-hub .gp-lead { margin-bottom: 0; }
.gp-servers { padding-top: 22px; }
.gp-section-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 15px; }
.gp-section-heading h2 { font-size: 17px; font-weight: 500; letter-spacing: 1.6px; margin: 0; }
.gp-section-heading p { color: #77614F; font-size: 13px; margin: 0; }
.gp-server-list { display: flex; flex-direction: column; gap: 14px; }
.gp-server { position: relative; display: flex; align-items: center; gap: 36px; min-height: 157px; padding: 24px 38px; border: 1px solid rgba(120,70,30,.13); border-radius: 20px; transition: transform 180ms ease,box-shadow 180ms ease; }
.gp-server[data-online="true"] { background: #2A1A12; color: #FBF6EE; box-shadow: 0 14px 28px rgba(72,40,15,.11); }
.gp-server[data-online="true"]:hover { transform: translateY(-2px); box-shadow: 0 18px 32px rgba(72,40,15,.16); }
.gp-server[data-online="true"]:focus-visible { outline-color: #DC1C36; }
.gp-server-identity { flex: 1; min-width: 0; }
.gp-server-state { display: inline-flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 400; letter-spacing: 1.7px; }
.gp-dot { display: inline-block; flex: none; width: 6px; height: 6px; border-radius: 50%; background: #54D690; box-shadow: 0 0 0 3px rgba(84,214,144,.1); }
.gp-server[data-online="true"] .gp-server-state { padding: 3px 10px; color: #F0CF7A; border: 1px solid rgba(240,207,122,.25); border-radius: 20px; }
.gp-server h3 { margin: 7px 0 5px; font-size: 29px; font-weight: 500; text-transform: uppercase; line-height: 1.4; overflow-wrap: anywhere; }
.gp-server-meta { display: flex; flex-wrap: wrap; gap: 8px 25px; font-size: 13px; font-weight: 350; color: #C6B8AA; margin: 0; }
.gp-server-meta span { border-left: 1px solid rgba(198,184,170,.35); padding-left: 25px; }
.gp-occupancy { padding-right: 24px; }
.gp-player-count { display: flex; align-items: baseline; gap: 12px; line-height: 1.25; }
.gp-player-count strong { font-size: 67px; font-weight: 500; color: transparent; -webkit-text-stroke: 1px #F0CF7A; }
.gp-player-count span { font-size: 24px; color: #E9DECE; font-weight: 300; }
.gp-player-label { color: #CEBDAB; font-size: 10px; letter-spacing: 1.3px; }
.gp-server-cta { min-height: 75px; min-width: 244px; gap: 21px; }
.gp-server[data-online="true"]:not(.gp-server-featured) { background: #FFFCF7; color: #23140F; box-shadow: none; border-radius: 12px; }
.gp-server[data-online="true"]:not(.gp-server-featured) .gp-server-state { color: #465E48; border-color: #D7E2D6; }
.gp-server[data-online="true"]:not(.gp-server-featured) .gp-server-meta,
.gp-server[data-online="true"]:not(.gp-server-featured) .gp-player-label,
.gp-server[data-online="true"]:not(.gp-server-featured) .gp-player-count span { color: #5B4A40; }
.gp-server[data-online="true"]:not(.gp-server-featured) .gp-player-count strong { color: #B4112B; -webkit-text-stroke: 0; }
.gp-server[data-online="false"] { min-height: 109px; padding-block: 18px; background: rgba(255,255,255,.6); color: #776B60; cursor: not-allowed; }
.gp-server[data-online="false"] h3 { font-size: 23px; margin-block: 3px; }
.gp-server[data-online="false"] .gp-dot { background: #9B958E; box-shadow: none; }
.gp-server[data-online="false"] .gp-server-meta { color: #776B60; }
.gp-offline-label { color: #776B60; padding: 9px 17px; border: 1px solid #D8CFC3; border-radius: 5px; font-size: 14px; }
.gp-empty { display: flex; gap: 28px; align-items: center; padding: 35px; border-radius: 20px; background: #FFFDF9; border: 1px solid rgba(120,70,30,.13); }
.gp-empty-symbol { font-size: 74px; font-weight: 200; color: #C9B59A; }
.gp-empty h3 { font-size: 27px; margin: 0 0 5px; font-weight: 500; }
.gp-empty p,.gp-empty ol { color: #5B4A40; font-size: 16px; font-weight: 350; margin: 5px 0; }
.gp-empty ol { padding-left: 22px; }
.gp-empty code { color: #9C0A20; }
.gp-hub .gp-notice { margin: 0 0 14px; }
.gp-server-list[aria-busy="true"] { min-height: 160px; border-top: 1px solid #D8CFC3; }
@media (max-width: 1440px) {
  .gp-header { height: 92px; }
  .gp-hero-picture { inset-block-start: -92px; }
  .gp-wordmark { font-size: 31px; }
  .gp-wordmark span + span { font-size: 17px; letter-spacing: 3.4px; }
  .gp-page h1 { font-size: 53px; }
  .gp-hero-login { min-height: 460px; }
  .gp-eyebrow { margin-bottom: 14px; }
  .gp-lead { font-size: 16px; margin-bottom: 22px; }
  .gp-cta { min-height: 73px; }
  .gp-cta-copy strong { font-size: 19px; }
  .gp-checks { font-size: 12px; gap: 18px; margin-top: 22px; }
  .gp-access-note { margin-top: 22px; min-height: 98px; padding-block: 16px; gap: 45px; }
  .gp-access-note h2 { font-size: 20px; }
  .gp-access-note p { font-size: 14px; }
  .gp-footer { padding-block: 25px 19px; }
  .gp-hero-hub { min-height: 250px; height: 33vh; }
  .gp-hero-hub h1 { font-size: 56px; }
  .gp-hub .gp-eyebrow { margin-bottom: 10px; }
  .gp-hub .gp-hero-copy { padding-block: 10px; }
  .gp-hub .gp-servers { padding-top: 12px; }
  .gp-server { min-height: 143px; padding: 21px 30px; }
  .gp-server h3 { font-size: 26px; }
  .gp-player-count strong { font-size: 58px; }
  .gp-server[data-online="false"] { min-height: 100px; padding-block: 13px; }
}
@media (max-width: 900px) {
  .gp-wrap { width: 90%; }
  .gp-ticker { gap: 8px 20px; }
  .gp-ticker > span:last-child:not(:first-child) { display: none; }
  .gp-nav-label { display: none; }
  .gp-hero-picture { background-position: 72% center; opacity: .8; }
  .gp-hero-picture::after { background: linear-gradient(90deg,#FBF6EE,rgba(251,246,238,.85) 45%,rgba(251,246,238,.2)),linear-gradient(0deg,#FBF6EE,transparent 30%); }
  .gp-page h1 { font-size: clamp(34px,5.6vw,53px); }
  .gp-server { gap: 24px; flex-wrap: wrap; }
  .gp-server-identity { flex-basis: 55%; }
  .gp-server-cta { margin-left: auto; }
  .gp-access-note { gap: 25px; }
  .gp-note-symbol { display: none; }
  .gp-access-note p br { display: none; }
  .gp-footer { font-size: 10px; }
}
@media (max-width: 560px) {
  .gp-header { gap: 15px; }
  .gp-ticker { font-size: 9px; letter-spacing: .5px; }
  .gp-ticker > span:not(:first-child) { display: none; }
  .gp-ticker > span { gap: 6px; }
  .gp-wordmark { font-size: 27px; }
  .gp-wordmark span + span { font-size: 15px; letter-spacing: 2.9px; }
  .gp-discord { padding: 7px 13px; }
  .gp-identity { max-width: 140px; padding: 5px 9px; }
  .gp-account { gap: 12px; }
  .gp-account .gp-text-link { font-size: 10px; letter-spacing: .3px; }
  .gp-account .gp-text-link span { display: none; }
  .gp-identity img { width: 22px; height: 22px; }
  .gp-hero-login { height: auto; min-height: 510px; }
  .gp-hero-inner { min-height: inherit; }
  .gp-eyebrow { font-size: 10px; letter-spacing: 1.3px; }
  .gp-page h1 { font-size: clamp(29px,7.7vw,43px); letter-spacing: -.5px; }
  .gp-hero-hub h1 { font-size: 49px; }
  .gp-lead { font-size: 15px; max-width: 350px; }
  .gp-wide-only { display: none; }
  .gp-hero-picture { background-size: auto 100%; background-position: 64% center; opacity: .5; }
  .gp-cta { padding-inline: 23px 28px; gap: 17px; }
  .gp-cta-copy strong { font-size: 17px; }
  .gp-cta-copy small { font-size: 11px; }
  .gp-diamond { width: 30px; height: 30px; }
  .gp-checks { flex-direction: column; gap: 5px; }
  .gp-access-note { flex-direction: column; align-items: flex-start; padding: 23px; gap: 16px; margin-top: 0; }
  .gp-footer { flex-wrap: wrap; gap: 8px; }
  .gp-section-heading h2 { font-size: 15px; }
  .gp-section-heading p { font-size: 11px; }
  .gp-server { padding: 23px; }
  .gp-server-identity { flex-basis: 100%; }
  .gp-server h3 { font-size: 23px; }
  .gp-server-cta { min-width: 0; margin-left: 0; }
  .gp-player-count strong { font-size: 50px; }
  .gp-occupancy { padding: 0; }
  .gp-server-meta { font-size: 12px; }
  .gp-empty { padding: 24px; gap: 15px; }
  .gp-empty-symbol { display: none; }
  .gp-empty h3 { font-size: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .gp-page *, .gp-page *::before, .gp-page *::after { transition: none !important; animation: none !important; }
}