html,body{background:var(--bg);color:#42345e}

.page-hero .hero h1{max-width:none}

.page-hero .hero{grid-template-columns:none;gap:0;border:0;border-radius:0;background:none}

.page-hero .hero:after,.page-hero .hero:before{content:none}

.site-footer{background:#efe9df}

.site-footer{display:block}

.site-header{
  position:relative;
  top:auto;
  z-index:50;
  overflow:visible;
  border:0;
  background:linear-gradient(145deg,#99dcf9,#c3eaf2 68%,#f5e2ba);
  color:#40345d;
  backdrop-filter:none;
}

.site-header .site-header__inner{
  width:100%;
  max-width:1220px;
  min-height:89px;
  margin:0 auto;
  padding:16px var(--page-gutter);
  gap:clamp(10px,1.8vw,22px);
  border-bottom:1px solid #ffffff66;
}

.site-header .brand{
  min-width:0;
  flex:0 0 auto;
  gap:11px;
  color:#40345d;
}

.site-header .brand img{
  width:40px;
  height:40px;
  border-radius:0;
  box-shadow:none;
}

.site-header .brand > span{
  display:grid;
  gap:2px;
  line-height:1;
  font-size:21px;
  font-weight:900;
  letter-spacing:1px;
}

.site-header .brand strong{
  color:#40345d;
  font-family:inherit;
  font-size:inherit;
  letter-spacing:inherit;
}

.site-header .brand em,
.site-header .brand small{
  display:block;
  color:#746790;
  font-family:inherit;
  font-size:8px;
  font-style:normal;
  font-weight:800;
  letter-spacing:2px;
}

.site-header__account{
  display:flex;
  flex:0 0 auto;
  align-items:center;
  margin-left:auto;
}

.site-header .masthead-actions,
.site-header .header-actions{
  display:flex;
  flex:0 0 auto;
  align-items:center;
  gap:10px;
}

.site-header .account-trigger,
.site-header .join{
  min-height:44px;
  min-width:132px;
  border-radius:10px;
  padding-block:0;
  font-size:12px;
  line-height:1.2;
}

.site-header .account-trigger{
  width:auto;
  max-width:196px;
  padding-inline:16px; /* + 1 px kenarlık = 17 px */
  gap:8px;
  border-color:#ffffffcc;
  background:#ffffffa6;
  color:#514068;
  box-shadow:0 3px 0 #c9bcdd;
}

.site-header .account-trigger:hover{
  background:#ffffffc9;
  transform:translateY(-1px);
  box-shadow:0 4px 0 #c9bcdd,0 6px 16px #85709326;
}

.site-header .account-trigger:active{
  transform:translateY(1px);
  box-shadow:0 2px 0 #c9bcdd;
}

.site-header .account-trigger span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.site-header .header-status{
  color:#665a77;
  font-family:var(--font-body);
  font-size:10px;
}

.site-header .mobile-menu .header-status{display:flex}

.site-header .header-status strong{color:#40345d}

.site-header .join{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding-inline:16px;
  border:0;
  background:#ffdb60;
  color:#40345d;
  font-weight:900;
  white-space:nowrap;
  box-shadow:0 3px 0 #dba539;
  transition:background-color 200ms ease,box-shadow 220ms ease,transform 220ms cubic-bezier(.22,1,.36,1);
}

.site-header .join:hover{
  background:#ffe68a;
  color:#40345d;
  transform:translateY(-1px);
  box-shadow:0 5px 0 #dba539,0 7px 22px #f1be5b38;
}

.site-header .join:active{
  transform:translateY(1px);
  box-shadow:0 2px 0 #dba539;
}

@media(prefers-reduced-motion:reduce) {
.app-shell:not(.motion-enabled) .site-header .join{transform:none!important}
}

.site-header .menu-toggle{
  display:none;
  border-color:#ffffffcc;
  border-radius:10px;
  background:#ffffffa6;
  color:#40345d;
  box-shadow:0 3px 0 #c9bcdd;
}

.site-header .mobile-menu{
  background:#fffefa;
  color:#42345e;
}

.site-header .mobile-menu:not(.is-open){visibility:hidden}

.site-header .mobile-menu.is-open{visibility:visible}

.site-header .mobile-menu nav a{
  color:#574b65;
}

.site-header .mobile-menu nav a:hover,
.site-header .mobile-menu nav a.active,
.site-header .mobile-menu nav a.is-active,
.site-header .mobile-menu nav a[aria-current="page"]{
  background:#e9dff5;
  color:#65478b;
}

.site-header .mobile-menu__ip{
  border-color:#d9cce5;
  color:#65478b;
}

.site-header :is(a,button):focus-visible{
  outline:3px solid #67468d;
  outline-offset:3px;
  box-shadow:0 0 0 3px #ffffffb3;
}

@media(max-width:800px) {
.site-header .header-status{display:none}
}

@media(max-width:700px) {
.site-header .site-header__inner{gap:8px}

.site-header .brand{gap:8px}

.site-header .brand > span{font-size:19px}

.site-header .brand em,
  .site-header .brand small{font-size:7px;letter-spacing:1.5px}

.site-header .account-trigger,
  .site-header .join{min-width:112px;min-height:40px;font-size:11px}

.site-header .account-trigger{max-width:150px;padding-inline:10px}

.site-header .account-trigger svg{display:none}

.site-header .join{padding-inline:12px}
}

@media(max-width:620px) {
.site-header .site-header__inner{
    width:100%;
    min-height:68px;
    padding:10px var(--page-gutter);
    gap:8px;
  }

.site-header .brand > span{font-size:18px}

.site-header .brand em,
  .site-header .brand small{font-size:7px;letter-spacing:1.2px}

.site-header .account-trigger{min-width:0;max-width:132px}

.site-header .masthead-actions > .join{display:none}

.site-header .menu-toggle{display:grid;flex:0 0 40px}

.site-header .mobile-menu{
    display:grid;
    max-height:0;
    gap:0;
    overflow:hidden;
    padding:0 16px;
    border-top:0 solid #e5dccc;
    transition:max-height 260ms ease,padding-block 260ms ease,border-top-width 260ms ease,visibility 0s linear 260ms;
  }

.site-header .mobile-menu.is-open{
    max-height:520px;
    gap:12px;
    padding:12px 16px 16px;
    border-top-width:1px;
    transition:max-height 260ms ease,padding-block 260ms ease,border-top-width 260ms ease;
  }

.site-header .mobile-menu nav{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:4px;
  }

.site-header .mobile-menu nav a{padding:10px;border-radius:7px;font-size:12px}

.site-header .mobile-menu .header-status{display:flex;align-items:center;gap:7px;padding:2px 4px;font-size:11px}

.site-header .mobile-menu__join{width:100%}

.site-header .mobile-menu .button--block{width:100%}

.site-header .mobile-menu__ip{width:100%;padding:10px;font-size:11px}
}

@media(max-width:360px) {
.site-header .site-header__inner{padding-inline:var(--page-gutter)}

.site-header .brand{gap:6px}

.site-header .brand img{width:36px;height:36px}

.site-header .brand > span{font-size:16px}

.site-header .brand em,
  .site-header .brand small{font-size:6px;letter-spacing:1px}

.site-header .account-trigger{max-width:110px;padding-inline:8px;font-size:10px}
}

.page-hero .masthead{background:#241735;color:#fff4df;position:relative;overflow:hidden}

.page-hero .masthead:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 73% 80%,#84602e80,transparent 38%),radial-gradient(ellipse at 30% 110%,#66518255,transparent 65%);pointer-events:none}

.page-hero .hero{max-width:1220px;margin:auto;padding:37px var(--page-gutter) 43px;position:relative;display:flex;align-items:flex-start;justify-content:space-between;min-height:293px}

.page-hero .hero p{color:#f4c774;font-size:11px;letter-spacing:2.6px;font-weight:900;margin:0 0 13px}

.page-hero .hero h1{font-size:clamp(35px,4vw,52px);line-height:1.07;letter-spacing:-1.6px;margin:0 0 25px;font-weight:900}

.page-hero .hero-logo{width:255px;height:255px;object-fit:contain;border-radius:28px;transform:rotate(-4deg);margin:-16px 90px -20px 20px;box-shadow:0 18px 65px #0005}

.page-hero .hero-sun{position:absolute;right:26px;top:3px;font-size:250px;color:#d39d3020;transform:rotate(12deg);line-height:1;pointer-events:none}

.page-hero .hero-bottom{display:flex;align-items:center;gap:18px}

.page-hero .server-address{display:flex;align-items:center;gap:10px;border:1px solid #ffffff24;background:#ffffff09;color:#fff4df;padding:12px 15px;border-radius:8px;font-size:12px}

.page-hero .server-address b{padding-left:12px;border-left:1px solid #ffffff20;font-size:14px}

.page-hero .live-dot{width:7px;height:7px;border-radius:50%;background:#9d93a3}

.page-hero .live-dot.online{background:#98da88;box-shadow:0 0 10px #98da8880}

.page-hero .edition{font-size:11px;color:#c9bccc}

@media(min-width:1450px) {
.page-hero .hero{min-height:315px}
}

@media(max-width:1050px) {
.page-hero .hero-logo{margin-right:25px;width:230px;height:230px}

.page-hero .hero-bottom{flex-direction:column;align-items:start;gap:10px}
}

@media(max-width:800px) {
.page-hero .hero-logo{width:190px;height:190px;margin:0 20px 0 15px}

.page-hero .hero h1{font-size:39px}

.page-hero .hero p{font-size:9px}
}

@media(max-width:600px) {
.page-hero .hero{padding:28px 18px 25px;min-height:300px}

.page-hero .hero h1{font-size:36px;position:relative;z-index:1}

.page-hero .hero p{font-size:8px;letter-spacing:1.6px;max-width:190px;line-height:1.8}

.page-hero .hero-logo{position:absolute;width:130px;height:130px;right:-19px;top:45px;opacity:.9;margin:0;transform:rotate(6deg);border-radius:17px}

.page-hero .hero-sun{right:-50px;top:30px;font-size:180px}

.page-hero .hero-bottom{position:relative;z-index:1}

.page-hero .server-address{font-size:10px;gap:8px;padding:11px}

.page-hero .server-address b{font-size:12px;padding-left:8px}

.page-hero .edition{font-size:10px}
}

@media(prefers-reduced-motion:reduce) {
.app-shell:not(.motion-enabled) .community-home *,.app-shell:not(.motion-enabled) .community-home *:before,.app-shell:not(.motion-enabled) .community-home *:after{transition:none!important;scroll-behavior:auto!important}
}

.page-hero .masthead{background:linear-gradient(145deg,#99dcf9,#c3eaf2 68%,#f5e2ba);color:#40345d}

.page-hero .masthead:before{background:none}

.page-hero .hero{min-height:295px;padding-top:28px;padding-bottom:35px}

.page-hero .hero p{color:#827151;font-size:10px;letter-spacing:2.2px}

.page-hero .hero h1{font-size:54px;color:#40345d;line-height:1.04;letter-spacing:-1.9px;text-shadow:0 2px 0 #ffffff70}

.page-hero .hero-bottom{gap:15px}

.page-hero .server-address{background:#ffffffa0;border:1px solid #fff;color:#534268;box-shadow:0 4px 10px #789caf15}

.page-hero .server-address b{border-color:#bfb1ce;color:#40345d}

.page-hero .edition{color:#76668a}

.page-hero .live-dot.online{background:#60a975;box-shadow:none}

.page-hero .sun-bubble{width:212px;height:212px;border:5px solid transparent;border-radius:50%;background:linear-gradient(125deg,#c5f7f44d,#faf1b765) padding-box,linear-gradient(145deg,#8bfff7,#c5aaff 60%,#ffb7cd) border-box;box-shadow:inset 0 0 30px #fff7,0 0 90px #fff4;position:relative;margin-right:88px;transform:rotate(-6deg)}

.page-hero .sun-bubble:before{content:'';position:absolute;left:25px;top:19px;width:55px;height:18px;border-radius:100%;background:#fff9;transform:rotate(-35deg)}

.page-hero .hero .hero-logo{margin:0;position:absolute;inset:37px;width:128px;height:128px;border-radius:0;box-shadow:none;transform:rotate(6deg);opacity:1}

.page-hero .bubble{position:absolute;border-radius:50%;border:3px solid #ffa9d0;background:linear-gradient(135deg,#e2ffff55,#c1e5f322);border-top-color:#8ffffa;border-left-color:#9ff5ff;box-shadow:inset 3px 3px 10px #ffffff60}

.page-hero .bubble-one{width:44px;height:44px;left:-60px;top:5px}

.page-hero .bubble-two{width:63px;height:63px;right:-38px;bottom:0}

.page-hero .hero-sun{top:35px;right:-15px;width:155px;height:35px;background:#ffffff9c;clip-path:polygon(0 55%,18% 55%,18% 25%,32% 25%,32% 0,65% 0,65% 25%,83% 25%,83% 55%,100% 55%,100% 100%,0 100%);transform:none}

@media(max-width:1050px) {
.page-hero .hero h1{font-size:47px}

.page-hero .sun-bubble{margin-right:45px}
}

@media(max-width:800px) {
.page-hero .hero h1{font-size:44px}

.page-hero .sun-bubble{margin-right:15px;width:180px;height:180px}

.page-hero .hero .hero-logo{inset:29px;width:112px;height:112px}

.page-hero .hero-sun{width:90px}
}

@media(max-width:600px) {
.page-hero .hero{min-height:295px;padding:27px var(--page-gutter)}

.page-hero .hero h1{font-size:39px;letter-spacing:-1.5px;max-width:270px}

.page-hero .hero p{font-size:8px;letter-spacing:1px;max-width:220px}

.page-hero .sun-bubble{position:absolute;width:115px;height:115px;right:-23px;top:44px;margin:0;opacity:.75}

.page-hero .hero .hero-logo{inset:20px;width:66px;height:66px}

.page-hero .sun-bubble:before{width:30px;height:10px;top:13px;left:14px}

.page-hero .bubble-one{width:24px;height:24px;left:-18px;top:-15px}

.page-hero .bubble-two{width:33px;height:33px;right:12px;bottom:-19px}

.page-hero .hero-sun{top:13px;right:-14px;width:70px;height:25px}

.page-hero .hero-bottom{margin-top:28px}

.page-hero .server-address{font-size:10px}
}

.page-hero{line-height:normal;color:#40345d}

.page-hero .sun-bubble{align-self:flex-start}

.page-hero .hero h1 em{font-style:normal;color:#827151}

.page-hero .hero-note{display:block;margin-top:2px;color:#76668a;font-size:11px;line-height:1.4;max-width:430px}