@font-face{font-family:Outfit;src:url('assets/outfit-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Outfit;src:url('assets/outfit-semibold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:Outfit;src:url('assets/outfit-extrabold.ttf') format('truetype');font-style:normal;font-weight:800;font-display:swap}
:root{font-family:Outfit,system-ui,sans-serif;color:#fff3f8;background:#2d213c;color-scheme:dark;--cream:#fff3f8;--candy:#ffacd2;--ink:#40203e}
*{box-sizing:border-box}html{min-width:0;scroll-behavior:smooth}body{margin:0;min-width:0;overflow-x:clip}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #ffb9e3;outline-offset:6px}img{display:block;max-width:100%;height:auto}svg{width:20px;height:20px;flex-shrink:0;fill:currentColor;pointer-events:none}button svg{pointer-events:none}[hidden]{display:none!important}
.skip-link{position:fixed;top:-90px;left:16px;padding:12px 20px;background:var(--candy);color:var(--ink);border-radius:8px;z-index:99}.skip-link:focus{top:16px}
.world,.world-shade{position:fixed;inset:0;pointer-events:none}.world{z-index:0;inset:-24px;background:#57364f url('assets/gummy-world-v1.webp') center center/cover no-repeat;filter:blur(8px)}.world-shade{z-index:1;background:linear-gradient(180deg,rgba(20,25,16,.48),rgba(21,28,18,.17) 22%,rgba(26,32,20,.28) 40%,rgba(24,31,19,.71) 71%,#1c271aea 100%),linear-gradient(90deg,#17211136,transparent 40%,#19241212)}
.page-shell{position:relative;z-index:3;min-height:100svh;max-width:1540px;margin-inline:auto;padding-inline:clamp(20px,3vw,48px);display:flex;flex-direction:column;width:100%;min-width:0}

main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;padding:14px 0 5px}
.hero{width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}.join-pill{max-width:100%;display:flex;align-items:center;justify-content:center;gap:14px;border:1px solid #ffd1eb66;border-bottom-color:#ffbcda40;border-radius:50px;padding:12px 21px;background:#44244888;box-shadow:inset 0 1px 0 #ffe5f02b,0 8px 30px #33163626;backdrop-filter:blur(16px);min-height:46px;transition:background .2s,transform .2s}.join-pill:hover{background:#713b748f;transform:translateY(-2px)}.pill-label{font-size:10px;font-weight:800;letter-spacing:1.3px;color:#a9f9da;white-space:nowrap}.pill-divider{width:1px;height:15px;background:#edbfe74d}.join-pill strong{font-size:15px;font-weight:600;line-height:1.35;min-width:0;overflow-wrap:anywhere}.join-pill svg{width:15px;height:15px;color:#a9f9da}
.hero-logo{width:min(820px,74vw);margin:0;filter:drop-shadow(0 12px 18px #34154166);animation:arrive .6s ease-out both}.hero-logo img{width:100%;height:auto}
/* The supplied artwork includes its own lettering. */
/* Give enlarged artwork its own layout space so the visible gaps stay even. */
.portal-nav{--portal-column-gap:clamp(18px,1.3vw,25px);--portal-row-weight:6.44;--portal-gap-count:5;width:min(100%,1320px);display:flex;flex-wrap:wrap;justify-content:center;gap:var(--portal-column-gap);margin:0 auto;min-width:0;align-items:flex-end}
.portal-link{flex:0 0 calc((100% - var(--portal-column-gap)*var(--portal-gap-count))*var(--portal-art-scale,1)/var(--portal-row-weight));display:flex;align-items:flex-end;justify-content:center;min-width:0;position:relative;background:transparent;padding:8px 2px;text-align:center;border-radius:18px;isolation:isolate;touch-action:manipulation}
.portal-link:before{content:'';position:absolute;z-index:-1;inset:-10%;background:radial-gradient(ellipse,#ffb0d92b,transparent 66%);opacity:0;transition:opacity .25s;pointer-events:none}
.portal-link:hover:before,.portal-link:focus-visible:before{opacity:1}
.portal-art{display:flex;align-items:flex-end;justify-content:center;width:calc(100% / var(--portal-art-scale,1));max-width:195px;height:clamp(126px,14vw,195px);transition:transform .25s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 8px 7px #21142c60)}
.portal-art img{width:100%;height:100%;object-fit:contain;object-position:center bottom;transform:scale(var(--portal-art-scale,1));transform-origin:center bottom}
.discord-link{--portal-art-scale:1.32}.store-link{--portal-art-scale:1.12}
.portal-link:hover .portal-art,.portal-link:focus-visible .portal-art{transform:translateY(-9px) rotate(-2deg) scale(1.025)}
.portal-link:active .portal-art{transform:translateY(-3px) scale(.97)}

.sugar-sparkles{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:2}.sugar-sparkles i{position:absolute;width:3px;height:3px;background:#f8b5e1;box-shadow:0 0 9px #f58cc5;opacity:0;animation:float-sugar 13s ease-in-out infinite}.sugar-sparkles i:nth-child(1){left:11%;top:52%;animation-delay:-1s}.sugar-sparkles i:nth-child(2){left:82%;top:24%;animation-delay:-5s}.sugar-sparkles i:nth-child(3){left:27%;top:37%;animation-delay:-8s}.sugar-sparkles i:nth-child(4){left:93%;top:63%;animation-delay:-3s}.sugar-sparkles i:nth-child(5){left:67%;top:57%;animation-delay:-9s}.sugar-sparkles i:nth-child(6){left:41%;top:74%;animation-delay:-7s}
@keyframes float-sugar{0%,100%{transform:translate(0,10px);opacity:0}30%,60%{opacity:.55}85%{transform:translate(15px,-80px);opacity:0}}@keyframes arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.modal{border:1px solid #bd80b67d;border-radius:18px;padding:0;color:var(--cream);background:#37263e;width:min(490px,calc(100% - 32px));max-height:calc(100svh - 40px);box-shadow:0 22px 90px #0008;overflow:auto}.modal::backdrop{background:#1f142fe0;backdrop-filter:blur(8px)}.modal-inner{position:relative;padding:34px 32px;text-align:center;background:radial-gradient(ellipse at 50% 0%,#f699d31c,transparent 70%)}.modal-close{position:absolute;right:15px;top:15px;display:grid;place-items:center;width:32px;height:32px;border-radius:6px;background:#ffffff09;color:#f8e5f4}.modal-close:hover{background:#ffffff16}.modal-close svg{width:18px;height:18px}.modal-kicker{font-size:9px;letter-spacing:2px;color:#a5efda;font-weight:600}.modal h2{font-size:29px;letter-spacing:-.7px;margin:10px 0 9px;line-height:1.15}.modal-intro{font-size:14px;line-height:1.6;color:#dec9e0;margin:0 auto 24px;max-width:355px}.connection-pending{border:1px dashed #e7a9d54d;border-radius:10px;padding:24px 22px;margin:25px 0;background:#fff1fd05}.connection-pending>svg{width:27px;height:27px;color:#a7eddb}.connection-pending h3{font-size:17px;margin:11px 0 8px}.connection-pending p{font-size:13px;line-height:1.65;color:#d2bbd7;margin:0}.modal-discord{display:flex;align-items:center;gap:9px;justify-content:center;background:transparent;border-top:1px solid #e5c9e729;width:100%;padding:20px 0 0;font-size:12px;color:#e7cfe8}.modal-discord svg:first-child{height:18px;width:23px}.modal-discord svg:last-child{height:12px;width:12px;opacity:.7}.modal-discord:hover{color:#aaf6dc}.edition-tabs{display:flex;border:1px solid #ddafda3d;padding:4px;border-radius:8px;gap:5px;margin:24px 0 8px}.edition-tabs button{background:transparent;border-radius:5px;padding:10px;font-size:12px;flex:1;color:#d7bedc}.edition-tabs button[aria-selected=true]{background:#f5a4cb;color:#46213e;font-weight:600}.join-steps{list-style:none;text-align:left;padding:0;margin:24px 0;display:grid;gap:19px}.join-steps li{display:flex;align-items:flex-start;gap:13px;font-size:13px;line-height:1.5;color:#f5deef}.join-steps li>span{font-size:10px;color:#b2efdd;font-weight:600;background:#ffb3dc14;border:1px solid #ffb3dc33;border-radius:6px;padding:6px 7px;line-height:1.3}.join-steps strong{font-weight:600;color:#fff0f8}.join-steps small{display:block;font-size:11px;color:#cbb2d2;margin-top:3px}.address-copy{width:100%;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 15px;border-radius:8px;background:#f4a5cd;color:#42213f;margin-bottom:22px;text-align:left}.address-copy span{min-width:0}.address-copy small{display:block;font-size:8px;letter-spacing:1.3px;color:#724361;margin-bottom:3px}.address-copy strong{font-size:17px;overflow-wrap:anywhere}.address-copy svg{width:18px;height:18px}.address-copy:hover{background:#ffc4e2}.port-note{font-size:12px;color:#d9bddb;margin:-12px 0 22px}.notice-ok{display:flex;align-items:center;justify-content:center;gap:12px;background:#f9afcf;color:#46213e;font-size:14px;font-weight:600;border-bottom:3px solid #b76897;width:100%;padding:12px 20px;border-radius:7px;margin-top:28px}.notice-ok svg{width:17px;height:17px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);opacity:0;pointer-events:none;background:#ffc4e2;color:#40243d;border:1px solid #ffe9f5;padding:13px 22px;border-radius:8px;box-shadow:0 8px 25px #0005;font-size:14px;font-weight:500;z-index:20;transition:opacity .2s,transform .2s;max-width:calc(100% - 32px);text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}.noscript-note{position:relative;z-index:5;padding:12px;background:#3a2644;text-align:center;font-size:13px}

.modal{min-width:0;max-width:calc(100% - 24px);width:490px;max-height:calc(100dvh - 24px);margin:auto;overscroll-behavior:contain}.modal-inner{padding:32px;min-width:0}.modal h2{overflow-wrap:anywhere;text-wrap:balance}.modal-close{width:40px;height:40px;right:10px;top:10px}.modal .notice-ok{min-height:46px}.modal-discord{min-height:44px;flex-wrap:wrap}.edition-tabs button{min-width:0;min-height:44px}.address-copy{min-width:0}.address-copy strong{word-break:break-word}.toast{overflow-wrap:anywhere}.about-features{display:grid;gap:18px;text-align:left;margin:24px 0}.about-features>div{display:flex;align-items:flex-start;gap:13px}.about-features>div>svg{color:#a5edce;width:24px;height:24px;margin-top:3px}.about-features>div>span{min-width:0}.about-features strong{display:block;color:#fff0fa;font-size:15px;font-weight:600}.about-features small{display:block;color:#d7bedc;font-size:12px;line-height:1.6;margin-top:4px}

.modal{background:#38263f;border-color:#f0b0d44d}.modal::backdrop{background:#1e132bdb;backdrop-filter:blur(9px)}.modal-kicker{display:block;margin-top:12px}.guide-steps{gap:23px}.guide-steps li{font-size:15px}.guide-steps small{font-size:13px;line-height:1.6;margin-top:5px}.guide-steps li>span{margin-top:2px}.notice-ok:hover{background:#ffcbe5}.notice-modal .modal-intro{margin-top:16px}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.sugar-sparkles{display:none}}
.copy-pill{position:relative;max-width:100%}.copy-pill .pill-label{min-width:56px;text-align:left}.copy-pill #server-address{user-select:text}.copy-pill.is-copied{border-color:#bcfbe4a6;background:#4b7a7294}.copy-pill[aria-disabled=true]{cursor:default}.copy-pill[aria-disabled=true]:hover{transform:none;background:#44244888}

.copy-bar{display:flex;justify-content:center;flex-shrink:0;min-width:0;padding-top:24px}
main{padding:clamp(38px,6vh,66px) 0 clamp(64px,12vh,125px);gap:clamp(34px,5.5vh,65px)}

/* GummySMP world and candy palette. */
.world-shade{background:linear-gradient(180deg,#3e24504a 0%,#3927461a 25%,#3c25462b 44%,#332440b3 76%,#2b203ce8 100%),linear-gradient(90deg,#45234a1a,transparent 40%,#3a234510)}
.hero-logo{filter:drop-shadow(0 12px 18px #46214e70)}
.sugar-sparkles i{border-radius:2px}.sugar-sparkles i:nth-child(3n){background:#a5f0d8;box-shadow:0 0 9px #81d8c6}.sugar-sparkles i:nth-child(2n){background:#e2bfff;box-shadow:0 0 9px #c597f4}
@media(max-width:760px){.world{background-position:52% center}.world-shade{background:linear-gradient(180deg,#452b523b,#36254554 38%,#302040c7 78%,#2b203ce8 100%)}}

/* Six across on desktop, three on tablets, and two on phones. */
@media(min-width:961px) and (max-height:740px){
  main{padding-top:24px;padding-bottom:42px;gap:26px}
  .hero-logo{width:min(670px,87svh)}
  .portal-art{height:min(165px,24svh)}
  .join-pill{min-height:42px;padding-block:9px}
}
@media(max-width:960px){
  main{padding-top:42px;padding-bottom:60px;gap:35px}
  .hero-logo{width:min(720px,88vw)}
  .portal-nav{--portal-column-gap:34px;--portal-row-weight:3.32;--portal-gap-count:2;max-width:660px;row-gap:22px}
  .portal-art{height:175px;max-width:185px}
}
@media(max-width:600px){
  .discord-link{--portal-art-scale:1.18}
  .store-link{--portal-art-scale:1.08}
  .page-shell{padding-inline:22px}
  .copy-bar{padding-top:22px}
  main{padding-top:38px;padding-bottom:46px;gap:25px}
  .hero-logo{width:100%;max-width:490px}
  .portal-nav{--portal-column-gap:25px;--portal-row-weight:2.18;--portal-gap-count:1;max-width:400px;row-gap:18px}
  .portal-art{height:160px;max-width:168px}
}
@media(max-width:450px){
  .page-shell{padding-inline:18px}
  main{padding-top:32px;gap:24px}
  .join-pill{gap:11px;padding:11px 16px;min-height:44px}
  .pill-label{font-size:9px;letter-spacing:1px}
  .join-pill strong{font-size:13px}
  .join-pill svg{width:13px;height:13px}
  .portal-nav{--portal-column-gap:22px;row-gap:16px}
  .portal-art{height:145px}
  .modal-inner{padding:28px 22px}
  .modal h2{font-size:27px}
  .modal-intro{font-size:13px}
  .sugar-sparkles i:nth-child(even){display:none}
}
@media(max-width:340px){
  .page-shell{padding-inline:12px}
  .join-pill{gap:9px}
  .portal-nav{--portal-column-gap:18px;row-gap:14px}
  .portal-art{height:126px}
}
