body{isolation:isolate}
body::before{
  content:'';
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(180deg,#1b122a70 0%,#170f26a8 58%,#100d19dc 100%),
    #100d19 url('/assets/spawn.webp') center center/cover no-repeat;
}
.header{height:80px;background:#140e24;border-bottom:2px solid #7954a76b}
.wordmark img{width:43px;height:43px;object-fit:contain}
footer .wordmark{display:flex}
.header nav{gap:7px;text-transform:uppercase;letter-spacing:.08em;font-weight:750}
.header nav a{padding:9px 14px;border-radius:7px}
.header nav a[aria-current="page"]{background:#a27bf326;color:#e7daff;box-shadow:inset 0 -2px #b998ff}
.header .nav-discord{margin-left:7px;color:#cfbaff}
.portal-hero{
  background:linear-gradient(90deg,#100a20be 0%,#150e256d 38%,transparent 72%);
  padding:46px 24px 35px;
}
.portal-hero-inner{max-width:1120px;margin:0 auto 24px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);align-items:center;gap:35px}
.portal-intro{min-width:0}
.hero-label{display:table;background:#251535e8;border:1px solid #d3a65887;border-radius:6px;padding:7px 10px}
.portal-intro h1{font-size:clamp(41px,6.4vw,96px);font-weight:900;letter-spacing:-.06em;text-shadow:0 4px #100820}
.portal-intro h1 em{display:block;text-shadow:none}
.portal-intro>p:not(.eyebrow){font-size:17px;max-width:37ch;color:#f0e9f7;margin:20px 0 23px}
.portal-intro .button{border-radius:9px}
.hero-emblem{display:grid;place-items:center;position:relative;isolation:isolate;min-height:360px}
.hero-emblem:before{
  content:'';position:absolute;z-index:-1;inset:6% 9%;
  background:radial-gradient(ellipse,#762ac68c,#261340e3 65%);
  border:2px solid #e8b66d7a;border-radius:26px;
  box-shadow:inset 0 0 0 7px #1b0b2e91,0 9px #150a26a8,0 0 55px #a64bff32;
  transform:rotate(-5deg);
}
.hero-emblem img{width:min(90%,330px);height:auto;filter:drop-shadow(0 18px 18px #120822b5)}
.emblem-caption{position:absolute;bottom:7%;background:#201333;border:1px solid #dcb57496;color:#ffe3a8;border-radius:6px;font-size:10px;letter-spacing:.19em;font-weight:800;padding:5px 10px}
.emblem-spark{position:absolute;font-size:34px;color:#ffe1a2;text-shadow:0 0 16px #ffca8b80}
.spark-one{top:5%;right:11%}.spark-two{bottom:14%;left:8%;color:#92f9ff}
.server-card{display:flex;gap:20px;align-items:center;justify-content:space-between;max-width:1120px;margin:auto;padding:18px 20px 18px 24px;border:2px solid #8eddea91;border-radius:13px;background:linear-gradient(130deg,#2d1c45,#151b33);box-shadow:0 5px #080612,0 0 34px #4edbef24;text-align:left}
.server-address .eyebrow{color:var(--gold);margin:0 0 4px}
.server-address strong{font:800 clamp(18px,3.4vw,33px)/1.3 ui-monospace,monospace;color:#bbf8ff}
.server-card button{flex:none}
.server-meta{display:flex;gap:8px 17px;flex-wrap:wrap;margin-top:7px;color:#e5d7f3;font-size:12px}
.server-meta strong{font:inherit;font-weight:750;color:#f3e9fc}
.portal-links{max-width:1240px;margin:auto;padding:0 36px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.portal-tile{--accent:#8ef4ff;display:flex;flex-direction:column;align-items:flex-start;min-height:138px;padding:17px;border:1px solid color-mix(in srgb,var(--accent) 53%,transparent);border-radius:13px;background:linear-gradient(144deg,color-mix(in srgb,var(--accent) 17%,#1a1425),#171024);box-shadow:0 5px #0a0711,inset 0 1px #ffffff18;transition:transform .18s,border-color .18s}
.portal-tile:hover{transform:translateY(-3px);border-color:var(--accent)}
.portal-tile>span{display:grid;place-items:center;width:39px;height:39px;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);border-radius:9px;background:#100b20b0;color:var(--accent);font-size:22px;margin-bottom:9px}
.portal-tile>span img{width:31px;height:31px;object-fit:contain;image-rendering:pixelated}
.portal-tile strong{font-size:19px;line-height:1.15}
.portal-tile small{font-size:12px;color:#ded2ec;margin-top:6px}
.tile-rules{--accent:#bba5ff}.tile-votes{--accent:#ffd995}.tile-discord{--accent:#8daaff}
.page-banner{padding:48px 26px;background:linear-gradient(90deg,#2b174ad6,#1b183c55 75%,#17152735);border-bottom:2px solid #c29ef358}
.page-banner>div{max-width:1168px;margin:auto}
.page-banner h1{font-size:clamp(36px,6vw,66px)}
.page-banner p:last-child{max-width:52ch;margin:17px 0 0;color:#e6dcf0}
.shop-banner>div{display:flex;align-items:center;justify-content:space-between;gap:18px}
.shop-banner img,.crystal-large img{object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 0 14px #55eafa66)}
.shop-banner img{width:clamp(66px,12vw,125px);height:auto;aspect-ratio:1;flex:none;margin-right:5%}
.crystal-large{line-height:0;transform:none}
.crystal-large img{width:min(100%,103px);height:auto}
.package{
  background:linear-gradient(145deg,#2b2040,#1a1528);
  border:1px solid #b28cdc55;border-radius:10px;box-shadow:0 3px #0b0812;
  padding:14px 13px;
}
.package[aria-pressed=true]{background:linear-gradient(145deg,#24424c,#20253d);box-shadow:0 3px #0a1c24}
.package strong{color:#f4e8ff;font-size:19px}
.package .cost{font-size:13px}
.purchase-panel{border-color:#c4a3e38c;border-top:3px solid #dcba80;box-shadow:0 5px #0b0812;background:radial-gradient(ellipse at 50% 28%,#49366d 0%,transparent 61%),#20162e}
.page-anchors{display:flex;flex-wrap:wrap;gap:10px;max-width:1240px;margin:0 auto;padding:23px 36px 0}
.page-anchors a{border:1px solid #c9a5f14d;border-radius:6px;padding:7px 11px;color:#e7d7fc;font-size:13px;font-weight:650}
.page-anchors a:hover{border-color:var(--cyan)}
.page-loja #cristais,.page-votar #votar{border-top:0}
.page-loja .section,.page-votar .section{padding-top:51px;padding-bottom:51px}
main>.section{background:#100d19bd}
footer{background:#140e24ed}
img.world-art{display:block;width:100%;object-fit:cover;object-position:center 57%}
.rules-grid,.flow-grid{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}
.rules-grid{padding-top:32px;padding-bottom:28px}
.rules-grid section,.flow-grid li{padding:23px;border:1px solid #a991c537;background:#1d162b;border-radius:9px}
.rules-grid h2{font-size:25px}
.rules-grid ul{padding-left:20px;margin:15px 0 0;color:#ded4e7}
.rules-grid li+li{margin-top:9px}
.rule-help{padding-top:10px;padding-bottom:60px}
.rule-help h2{font-size:29px;margin-bottom:10px}
.flow-grid{grid-template-columns:repeat(3,minmax(0,1fr));padding:0;list-style:none;margin:24px 0 0}
.flow-grid span{color:var(--gold);font-weight:750}
.flow-grid h3{margin:6px 0 10px;font-size:19px}
.flow-grid p{margin:0;font-size:14px}
.plan{border-top:3px solid var(--plan);border-radius:13px;box-shadow:0 5px #090610,inset 0 1px #ffffff12}
.plan .plan-symbol{display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--plan);border-radius:11px;background:color-mix(in srgb,var(--plan) 15%,#211630)}
.plan ul{margin-bottom:0;min-height:0}
.comparison-wrap h3{font-size:24px}
.comparison-wrap .table-scroll{border-color:#a88fcb4c;box-shadow:0 5px #0b0714}
.comparison-wrap table{font-size:13px}
.comparison-wrap thead th{background:#2d1d43;font-size:12px}
.comparison-wrap thead th:nth-last-child(4){color:#a5e9ad}
.comparison-wrap thead th:nth-last-child(3){color:#c2a2ff}
.comparison-wrap thead th:nth-last-child(2){color:#8ae6fa}
.comparison-wrap thead th:last-child{color:#f1cd88}
.comparison-wrap tbody tr:nth-child(even){background:#1e162b}
.comparison-wrap tbody td{font-variant-numeric:tabular-nums}
.activation-wrap{padding:24px;border:1px solid #e7b77663;border-radius:12px;background:linear-gradient(145deg,#352446,#1b1428)}
.activation-wrap .eyebrow{margin-bottom:10px}
.activation-wrap h3{margin-bottom:12px}
.kit-copy{max-width:78ch;font-size:14px}
@media(max-width:700px){
  .header{height:68px}
  .header nav{top:68px}
  .header .nav-discord{margin-left:0}
  .portal-hero{padding:27px 18px 25px;background:linear-gradient(180deg,transparent 19%,#150e2599 62%,transparent)}
  .portal-hero-inner{grid-template-columns:1fr;gap:14px;margin-bottom:21px;text-align:center}
  .hero-emblem{grid-row:1;min-height:0;width:min(100%,260px);margin:auto}
  .hero-emblem img{width:68%}
  .hero-emblem:before{inset:3% 8%;border-radius:17px}
  .emblem-caption{bottom:-2%;font-size:8px}
  .emblem-spark{font-size:22px}
  .hero-label{margin:8px auto 11px;font-size:8px}
  .portal-intro h1{font-size:clamp(31px,9.1vw,55px)}
  .portal-intro h1 em{display:inline}
  .portal-intro>p:not(.eyebrow){font-size:14px;margin:10px auto 14px}
  .portal-intro .hero-actions{justify-content:center}
  .portal-intro .button{font-size:11px;min-height:42px;padding:8px 12px}
  .server-card{flex-direction:column;align-items:stretch;text-align:center;padding:14px;gap:11px}
  .server-card button{min-height:40px}
  .server-meta{justify-content:center;gap:4px 12px;font-size:11px}
  .portal-links{padding:0 18px;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .portal-tile{padding:13px;min-height:115px}
  .portal-tile strong{font-size:16px}
  .portal-tile small{font-size:11px}
  .page-banner{padding:40px 22px}
  .shop-banner img{margin-right:0}
  .page-anchors{padding:19px 22px 0}
  .rules-grid,.flow-grid{grid-template-columns:minmax(0,1fr)}
  .comparison-wrap table{min-width:570px}
  .comparison-wrap tr>*:first-child{position:sticky;left:0;min-width:135px;padding-left:10px;background:#21172e;box-shadow:2px 0 #ffffff16}
  .activation-wrap{padding:14px}
}
@media(prefers-reduced-motion:reduce){.portal-tile{transition:none}}
