.community-page { background-color: #110b0d; background-image: linear-gradient(180deg, #120c0e, #0b0e13 1200px); }
.community-icon-library{position:absolute;width:0;height:0;overflow:hidden}
.community-icon{display:inline-block;flex:none;width:1.1em;height:1.1em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.16em}
.community-eyebrow .community-icon,.community-invite__number .community-icon,.community-story__number .community-icon{margin-right:7px;color:#e9b96f}
.community-steps h3 .community-icon{margin-right:8px;color:#e9b96f;font-size:.9em}
.community-text-link .community-icon{margin-right:5px;color:#eac588}
.community-outline-link .community-icon,.recent-matches__all .community-icon{margin-right:6px;color:#eac588}
.community-live__heading h2 .community-icon{margin-right:5px;color:#eac588;font-size:.85em}
.community-story h2 .community-icon{width:.68em;height:.68em;margin-right:.18em;color:#e1b978;vertical-align:-.02em}
.community-page main { overflow: clip; }
.community-eyebrow { color: #e6bd7a; font: 800 .8rem/1.3 var(--font-display); letter-spacing: .2em; text-transform: uppercase; }
.community-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.community-breadcrumb a{color:inherit;text-decoration:none}
.community-breadcrumb a:hover{text-decoration:underline;text-underline-offset:3px}
.community-breadcrumb a:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.community-eyebrow > span { margin-right: 8px; color: #d73b45; }
.community-breadcrumb > span{margin-right:0;color:inherit}
.community-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  grid-template-rows: auto 1fr;
  align-items: start;
  gap: 26px clamp(28px, 4vw, 64px);
  width: min(100%, 1500px);
  min-height: 680px;
  margin: auto;
  padding: clamp(30px, 3.4vw, 50px) clamp(22px, 3vw, 46px) 44px;
}
.community-hero::before {
  content: '';
  position: absolute;
  z-index: -1;
  top: -50px;
  left: 4%;
  width: min(60%, 700px);
  height: 760px;
  background: url('/assets/pride-embroidered-logo.png') 47% 12% / 85% auto no-repeat;
  mix-blend-mode: screen;
  opacity: .21;
  pointer-events: none;
}
.community-hero::after {
  content: '';
  position: absolute;
  z-index: -2;
  inset: 0;
  background: linear-gradient(90deg, rgba(16, 7, 9, .93), rgba(17, 7, 9, .77)), url('/assets/ti26-brocade.png') center/560px;
  pointer-events: none;
}
.community-hero__intro { grid-column: 1; grid-row: 1; padding-top: 17px; }
.community-hero h1 {
  max-width: 610px;
  margin: 18px 0;
  color: #fff3de;
  font: 800 clamp(3rem, 4.5vw, 5.1rem)/.94 Georgia, 'Times New Roman', serif;
  letter-spacing: -.045em;
  text-wrap: balance;
  text-shadow: 0 3px 10px #090405;
}
.community-hero h1 em { color: #e9bd72; font-style: normal; }
.community-hero__intro > p {
  max-width: 480px;
  margin: 0 0 13px;
  color: #e4d5c3;
  font-size: clamp(1.05rem, 1.55vw, 1.2rem);
  line-height: 1.53;
}
.community-hero__intro > .community-hero__note {
  color: #bfae9b;
  font-size: .98rem;
}
.community-hero__invites { grid-column: 1; grid-row: 2; display: grid; align-content: start; gap: 12px; }
.community-invite {
  position: relative;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 4px 14px;
  min-height: 130px;
  padding: 17px 20px 15px;
  border: 1px solid #a37f4d;
  background-image: linear-gradient(100deg, rgba(12, 31, 17, .89), rgba(16, 28, 20, .76)), url('/assets/ti26-brocade.png');
  background-size: auto, 320px;
  color: #f8ead6;
  box-shadow: inset 0 0 0 2px rgba(6, 8, 5, .72), 0 8px 20px rgba(0, 0, 0, .19);
  transition: border-color .18s, transform .18s, background-color .18s;
}
.community-invite--discord { background-image: linear-gradient(100deg, rgba(22, 22, 51, .91), rgba(18, 18, 36, .8)), url('/assets/ti26-brocade.png'); border-color: #877899; }
.community-invite__brand { grid-column: 1; grid-row: 2 / span 2; align-self: center; width: 40px; height: 40px; object-fit: contain; }
.community-invite[href]:is(:hover, :focus-visible) { border-color: #f5d18e; transform: translateY(-2px); }
.community-invite__number { grid-column: 1 / -1; color: #e7bd78; font: 800 .75rem/1 var(--font-display); letter-spacing: .13em; text-transform: uppercase; }
.community-invite strong { grid-column: 2; font: 800 clamp(1.18rem, 1.8vw, 1.5rem)/1.05 var(--font-display); }
.community-invite > span:nth-of-type(2) { grid-column: 2; color: #d5cab8; font-size: .86rem; line-height: 1.32; }
.community-invite__action { grid-column: 3; grid-row: 2 / span 2; display: flex; align-items: center; gap: 6px; align-self: center; max-width: 125px; color: #f3cd89; font: 800 .76rem/1.2 var(--font-display); letter-spacing: .035em; text-align: right; text-transform: uppercase; }
.community-invite__action > span { font-size: 1.4em; }
.community-invite[aria-disabled="true"] { opacity: .76; cursor: default; }
.community-live { grid-column: 2; grid-row: 1 / 3; min-width: 0; }
.community-live__heading { display: flex; justify-content: space-between; align-items: end; gap: 14px; margin-bottom: 10px; }
.community-live__heading h2 { margin: 4px 0 0; color: #fff2d9; font: 800 clamp(1.5rem, 2vw, 1.9rem)/1 var(--font-display); }
.community-live__badge { padding: 6px 10px; background: #ad2633; color: white; font: 800 .8rem/1 var(--font-display); letter-spacing: .06em; text-transform: uppercase; }
.community-live__stage {
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  border: 2px solid #bb9159;
  background: #0c0c11;
  box-shadow: 0 13px 35px #0009, inset 0 0 0 3px #100909;
}
.community-live__stage iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.community-live__fallback {
  display: grid;
  justify-items: center;
  align-content: center;
  width: 100%;
  height: 100%;
  padding: 20px;
  background: linear-gradient(90deg, #0a0a0edb, #0c0b0dd9), url('/assets/pride-hero-tapestry.webp') center/cover;
  text-align: center;
}
.community-live__fallback img { width: clamp(74px, 12vw, 145px); height: clamp(74px, 12vw, 145px); margin-bottom: 10px; border-radius: 50%; object-fit: cover; object-position: center 43%; box-shadow: 0 0 0 1px #e0b777; }
.community-live__fallback strong { color: #ffe8b3; font: 800 clamp(1.08rem, 2.2vw, 1.5rem)/1.1 var(--font-display); }
.community-live__fallback p { max-width: 440px; margin: 7px auto 0; color: #eee0cd; font-size: .86rem; }
.community-live__play {
  display: grid;
  place-items: center;
  gap: 7px;
  width: 100%;
  height: 100%;
  padding: 20px;
  border: 0;
  background: linear-gradient(#08080a80, #08080ac2), var(--stream-thumb, url('/assets/pride-hero-tapestry.webp')) center/cover;
  color: white;
  font: 800 1.1rem var(--font-display);
  text-shadow: 0 2px 8px #000;
}
.community-live__play span:first-child { display: grid; place-items: center; width: 68px; height: 68px; border: 2px solid #f7ddaa; border-radius: 50%; background: #a52633; font-size: 1.9rem; text-indent: 4px; box-shadow: 0 0 24px #000; }
.community-live__details { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 58px; padding: 8px 2px; }
.community-live__details > div { display: flex; align-items: center; gap: 8px; min-width: 0; }
.community-live__details strong { color: #fff2d8; font: 800 1.15rem var(--font-display); white-space: nowrap; }
.community-live__details #community-live-title-text { min-width: 0; overflow: hidden; color: #c7b8a8; font-size: .85rem; text-overflow: ellipsis; white-space: nowrap; }
.community-live__details a { flex: none; color: #f1c584; font: 800 .85rem var(--font-display); text-decoration: underline; text-underline-offset: 4px; }
.community-live__live-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #e13644; box-shadow: 0 0 9px #e13644; }
.community-live__selector { margin-top: 7px; }
.community-live__selector-head { display: flex; justify-content: space-between; align-items: end; gap: 15px; margin-bottom: 9px; }
.community-live__selector h3 { margin: 0; color: #efc786; font: 800 .83rem var(--font-display); letter-spacing: .13em; text-transform: uppercase; }
.community-live__selector p { margin: 3px 0 0; color: #bbac9d; font-size: .8rem; }
.community-live__selector-head button { min-height: 38px; padding: 5px 10px; border: 1px solid #a78351; background: #241416; color: #f5d490; font: 800 .81rem var(--font-display); white-space: nowrap; }
.community-live__selector-head button:hover { background: #60352c; }
.community-live__channels { display: flex; gap: 10px; overflow-x: auto; padding: 3px 2px 9px; scrollbar-color: #a78558 #231719; }
.community-live__channel { position: relative; flex: 0 0 clamp(128px, 17vw, 180px); display: grid; align-content: end; min-height: 100px; padding: 8px; overflow: hidden; border: 1px solid #866e53; background: #1b181b; color: #fff; text-align: left; scroll-snap-align: start; }
.community-live__channel::before { content: ''; position: absolute; inset: 0; z-index: 0; background: linear-gradient(transparent 38%, #08070bd9), var(--thumb, url('/assets/pride-hero-tapestry.webp')) center/cover; opacity: .91; }
.community-live__channel strong, .community-live__channel small { position: relative; z-index: 1; }
.community-live__channel strong { overflow: hidden; font: 800 1rem var(--font-display); text-overflow: ellipsis; white-space: nowrap; }
.community-live__channel small { color: #fff2d7; font: 800 .68rem var(--font-display); text-transform: uppercase; }
.community-live__channel[aria-pressed="true"] { border-color: #ffe4a1; box-shadow: inset 0 0 0 1px #ffe4a1; }
.community-live__channel:hover { border-color: #ffe4a1; }
.community-live__notice { min-height: 20px; margin: 6px 0; color: #d7c6af; font-size: .78rem; }
.community-home__bands { width: min(100%, 1500px); margin: 0 auto; }
.community-story { width: min(100%, 1260px); margin: auto; padding: 42px 28px 100px; }
.community-story > section { display: grid; grid-template-columns: minmax(130px, .26fr) minmax(0, 1fr); gap: clamp(25px, 5vw, 90px); padding: clamp(56px, 6vw, 86px) 0; border-bottom: 1px solid #634935; }
.community-story > section:last-child { border-bottom: 0; }
.community-story__number { padding-top: 9px; color: #c7a574; font: 800 .81rem var(--font-display); letter-spacing: .12em; text-transform: uppercase; }
.community-story__content { min-width: 0; }
.community-story h2 { margin: 12px 0 20px; color: #fff0d4; font: 800 clamp(2.15rem, 3.4vw, 3.6rem)/1 Georgia, 'Times New Roman', serif; letter-spacing: -.035em; text-wrap: balance; }
.community-story p { max-width: 820px; color: #c7b8aa; font-size: clamp(1rem, 1.35vw, 1.12rem); line-height: 1.65; }
.community-story .community-story__lead { color: #f2e2c9; font-size: clamp(1.15rem, 1.9vw, 1.4rem); line-height: 1.45; }
.community-steps { margin: 35px 0 0; padding: 0; list-style: none; }
.community-steps li { display: grid; grid-template-columns: 55px minmax(0, 1fr); gap: 14px; padding: 22px 0; border-top: 1px solid #59402f; }
.community-steps__index { color: #d9a461; font: 800 1.25rem var(--font-display); }
.community-steps h3 { margin: 0 0 6px; color: #f6e5cb; font: 800 1.4rem var(--font-display); }
.community-steps p { margin: 0 0 10px; }
.community-text-link { display: inline-flex; gap: 8px; align-items: center; min-height: 34px; padding: 0; border: 0; background: transparent; color: #f1c680; font: 800 .96rem var(--font-display); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.community-text-link[aria-disabled="true"] { color: #ab9b8d; cursor: default; }
.community-text-link[href]:hover, .community-text-link:not([aria-disabled="true"]):hover { color: #fff0ba; }
.community-story__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 25px; }
.community-outline-link { display: inline-flex; align-items: center; gap: 15px; min-height: 45px; padding: 8px 17px; border: 1px solid #a37b4b; background: transparent; color: #f1cf92; font: 800 .9rem var(--font-display); text-decoration: none; text-transform: uppercase; cursor: pointer; }
.community-outline-link:hover { border-color: #f8d99a; background: #4c2b20; }
.community-conduct-link { margin-top: 22px; }
.community-outline-link:focus-visible, .community-scoring-dialog__close:focus-visible { outline: 2px solid #ffe4a1; outline-offset: 3px; }
.community-scoring-dialog { width: min(650px, calc(100vw - 28px)); max-height: calc(100dvh - 28px); padding: 0; overflow: auto; border: 1px solid #c1965b; background: #170d0f; color: #f5e7cf; box-shadow: 0 25px 90px #000, inset 0 0 0 3px #3e251c; scrollbar-width: thin; }
.community-scoring-dialog::backdrop { background: rgba(5, 3, 5, .82); backdrop-filter: blur(5px); }
.community-scoring-dialog__panel { padding: clamp(22px, 4vw, 34px); background-image: linear-gradient(155deg, rgba(35, 12, 16, .92), rgba(17, 11, 15, .95)), url('/assets/ti26-brocade.png'); background-size: auto, 460px; }
.community-scoring-dialog__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.community-scoring-dialog__top .community-icon { color: #e9b96f; }
.community-scoring-dialog__close { display: grid; flex: none; place-items: center; width: 44px; height: 44px; border: 1px solid #aa8150; background: #2a1719; color: #f5d49a; cursor: pointer; }
.community-scoring-dialog__close:hover { background: #553026; border-color: #f5d49a; }
.community-scoring-dialog__close .community-icon { width: 22px; height: 22px; }
.community-scoring-dialog h2 { margin: 12px 0 14px; color: #fff0d4; font: 800 clamp(2rem, 5vw, 2.85rem)/1.05 Georgia, 'Times New Roman', serif; letter-spacing: -.035em; text-wrap: balance; }
.community-scoring-dialog p { margin: 0 0 16px; color: #e3d4c2; line-height: 1.55; }
.community-scoring-dialog__rule { margin: 22px 0; padding: 16px; border: 1px solid #a47e50; background: rgba(10, 12, 16, .75); }
.community-scoring-dialog__rule > span { color: #f1c887; font: 800 .8rem var(--font-display); letter-spacing: .1em; text-transform: uppercase; }
.community-scoring-dialog__values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 12px 0 8px; }
.community-scoring-dialog__values p { display: flex; align-items: center; gap: 8px; margin: 0; padding: 10px 12px; border: 1px solid #725338; color: #f8e9d0; font: 800 1rem var(--font-display); }
.community-scoring-dialog__values .community-icon { color: #e9bd72; }
.community-scoring-dialog__values strong { margin-left: auto; color: #f2c67c; font-size: 1.25rem; }
.community-scoring-dialog #community-scoring-status { margin: 6px 0 0; color: #cdbba5; font-size: .86rem; }
.community-scoring-dialog__tie { padding-top: 15px; border-top: 1px solid #6e4d38; }
.community-scoring-dialog__tie strong { color: #f2c67c; }
.community-recent-matches { max-width: 760px; margin-top: 24px; border-top: 1px solid var(--line); --panel-gutter: 20px; }
.community-recent-matches .recent-matches__match { min-height: 62px; padding-top: 12px; padding-bottom: 12px; }
.community-recent-matches .recent-matches__avatar { max-width: 29px; }
.community-recent-matches .recent-matches__score { font-size: 1.35rem; }
.community-recent-matches .recent-matches__scoreboard time { font-size: .75rem; }
.community-recent-matches .recent-matches__status { padding: 20px; font-size: .94rem; }
@media (max-width: 1000px) {
  .community-hero { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 20px; min-height: 0; }
  .community-hero h1 { font-size: clamp(2.5rem, 4.7vw, 3.7rem); }
  .community-invite { padding: 13px; min-height: 120px; }
}
@media (max-width: 760px) {
  .community-hero { display: flex; flex-direction: column; gap: 22px; padding: 28px 18px 34px; }
  .community-hero::before { top: 0; left: 18%; width: 80%; height: 480px; opacity: .15; background-size: 100% auto; }
  .community-hero__intro, .community-live, .community-hero__invites { width: 100%; }
  .community-hero__intro { padding-top: 3px; }
  .community-hero h1 { max-width: 620px; margin-top: 13px; font-size: clamp(2.8rem, 9.2vw, 4.4rem); }
  .community-live__stage { max-height: 520px; }
  .community-hero__invites { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .community-invite { min-height: 170px; }
  .community-invite__action { grid-column: 2/-1; grid-row: auto; align-self: end; max-width: none; text-align: left; }
  .community-story { padding: 20px 22px 70px; }
  .community-story > section { grid-template-columns: 1fr; gap: 8px; }
  .community-story__number { padding-top: 0; }
}
@media (max-width: 520px) {
  .community-scoring-dialog__values { grid-template-columns: 1fr; }
  .community-hero { padding-inline: 14px; }
  .community-hero h1 { font-size: clamp(2.55rem, 11.3vw, 3.7rem); }
  .community-hero__intro > p { font-size: 1rem; }
  .community-hero__invites { grid-template-columns: 1fr; }
  .community-invite { min-height: 0; padding: 15px; }
  .community-live__heading h2 { font-size: 1.45rem; }
  .community-live__details { align-items: start; flex-direction: column; gap: 6px; padding: 9px 0; }
  .community-live__details > div { width: 100%; }
  .community-live__details a { padding: 6px 0; }
  .community-live__channel { flex-basis: 132px; min-height: 88px; }
  .community-story { padding-inline: 18px; }
  .community-steps li { grid-template-columns: 42px minmax(0, 1fr); gap: 8px; }
  .community-recent-matches { --panel-gutter: 8px; }
  .community-recent-matches .recent-matches__avatar { max-width: 19px; }
  .community-recent-matches .recent-matches__score { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .community-invite, .community-outline-link { transition: none; }
}